chamomind/jws-frontend
chamomind/jws-frontend
7
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

refactor: enhance FloatingActionButton to support custom icons

Browse source
This commit is contained in:
puriphatt 2025-04-10 17:22:13 +07:00
parent 5b1ccadf92
commit a40f9f9775
1 changed files with 11 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

14
src/components/FloatingActionButton.vue
View file

@ -1,6 +1,9 @@
<script setup lang="ts">
import { Icon } from '@iconify/vue/dist/iconify.js';
defineProps<{
hideIcon?: boolean;
icon?: string;
}>();
</script>
@ -10,10 +13,13 @@ defineProps<{
v-if="!hideIcon"
id="btn-add"
padding="sm"
icon="mdi-plus"
:icon="icon ? undefined : 'mdi-plus'"
direction="up"
class="color-btn"
>
<template #icon v-if="icon">
<Icon :icon width="24" />
</template>
<slot>
<q-fab-action
padding="xs"
@ -29,10 +35,12 @@ defineProps<{
fab
id="btn-add"
padding="sm"
icon="mdi-plus"
:icon="icon ? undefined : 'mdi-plus'"
direction="up"
class="color-btn"
/>
>
<Icon v-if="icon" :icon width="24" />
</q-btn>
</q-page-sticky>
</template>