feat: toggle status

This commit is contained in:
Methapon2001 2024-04-17 15:00:07 +07:00
parent 38e2eef6ed
commit dbfc8edf14

View file

@ -162,7 +162,94 @@ function clearData() {
<span>{{ node.name }}</span>
<div class="q-gutter-xs" @click.stop>
<q-btn icon="mdi-file-plus-outline" fab-mini unelevated />
<q-btn icon="mdi-dots-vertical" fab-mini unelevated />
<q-btn icon="mdi-dots-vertical" fab-mini unelevated flat>
<q-menu class="bordered">
<q-list v-close-popup>
<q-item
clickable
dense
class="row q-py-sm"
style="white-space: nowrap"
>
<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
clickable
dense
class="row q-py-sm"
style="white-space: nowrap"
>
<q-icon
name="mdi-pencil-outline"
class="col-3"
size="xs"
style="color: hsl(var(--cyan-6-hsl))"
/>
<span class="col-9 q-px-md flex items-center">
{{ $t('edit') }}
</span>
</q-item>
<q-item
dense
clickable
class="row"
style="white-space: nowrap"
>
<q-icon
name="mdi-trash-can-outline"
size="xs"
class="col-3"
style="color: hsl(var(--red-6-hsl))"
/>
<span class="col-9 q-px-md flex items-center">
{{ $t('delete') }}
</span>
</q-item>
<q-item dense>
<q-item-section class="q-py-sm">
<div class="q-pa-sm surface-2 rounded">
<q-toggle
dense
size="sm"
:label="
node.status !== 'INACTIVE'
? $t('switchOnLabel')
: $t('switchOffLabel')
"
@click="
async () => {
const res = await branchStore.editById(
node.id,
{
status:
node.status !== 'INACTIVE'
? 'INACTIVE'
: 'ACTIVE',
},
);
if (res) node.status = res.status;
}
"
:model-value="
node.status === 'CREATED' ||
node.status === 'ACTIVE'
"
/>
</div>
</q-item-section>
</q-item>
</q-list>
</q-menu>
</q-btn>
</div>
</div>
</template>