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

fix: dot vertical (person card)

Browse source
This commit is contained in:
puriphatt 2024-04-19 10:54:12 +07:00
parent f7514e64a5
commit 9011126e8f
1 changed files with 55 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

91
src/components/home/PersonCard.vue
View file

@ -68,56 +68,75 @@ defineEmits<{
size="sm" size="sm"
@click.stop="" @click.stop=""
> >
<q-menu :offset="[0, 10]" style="width: 130px"> <q-menu class="bordered">
<q-list> <q-list v-close-popup>
<q-item <q-item
clickable clickable
dense
class="row q-py-sm"
style="white-space: nowrap"
@click="$emit('enterCard', 'INFO', v.id)"
>
<q-icon
name="mdi-eye-outline"
class="col-3"
size="xs"
style="color: hsl(var(--green-6-hsl))"
/>
<span class="col-9 q-px-md flex items-center">
{{ $t('viewDetail') }}
</span>
</q-item>
<q-item
dense
clickable
class="row q-py-sm"
style="white-space: nowrap"
@click="$emit('updateCard', 'FORM', v.id)" @click="$emit('updateCard', 'FORM', v.id)"
v-close-popup v-close-popup
> >
<q-item-section class="col-4"> <q-icon
<q-icon name="mdi-pencil-outline"
class="full-width" class="col-3"
name="mdi-pencil-outline" size="xs"
color="positive" style="color: hsl(var(--cyan-6-hsl))"
size="xs" />
/> <span class="col-9 q-px-md flex items-center">
</q-item-section>
<q-item-section class="text-caption">
{{ $t('edit') }} {{ $t('edit') }}
</q-item-section> </span>
</q-item> </q-item>
<q-item <q-item
dense
clickable clickable
@click="$emit('deleteCard', v.id)" @click="$emit('deleteCard', v.id)"
v-close-popup v-close-popup
> >
<q-item-section class="col-4"> <q-icon
<q-icon name="mdi-trash-can-outline"
class="full-width" size="xs"
name="mdi-trash-can-outline" class="col-3 app-text-negative"
color="negative" />
size="xs" <span class="col-9 q-px-md flex items-center">
/>
</q-item-section>
<q-item-section class="text-caption">
{{ $t('delete') }} {{ $t('delete') }}
</q-item-section> </span>
</q-item> </q-item>
<q-item clickable> <q-item dense>
<q-item-section class="col-4"> <q-item-section class="q-py-sm">
<q-toggle <div class="q-pa-sm surface-2 rounded">
dense <q-toggle
color="primary" dense
size="xs" size="sm"
@click="$emit('toggleStatus', v.id)" @click="$emit('toggleStatus', v.id)"
:model-value="!v.disabled" :model-value="!v.disabled"
val="xs" val="xs"
padding="none" padding="none"
/> :label="
</q-item-section> v.disabled
<q-item-section class="text-caption"> ? $t('switchOnLabel')
{{ v.disabled ? 'เปิดสถานะ' : 'ปิดสถานะ' }} : $t('switchOffLabel')
"
/>
</div>
</q-item-section> </q-item-section>
</q-item> </q-item>
</q-list> </q-list>