fix: kebab action hide after change status
This commit is contained in:
parent
483859daca
commit
9990b73f4c
3 changed files with 24 additions and 5 deletions
|
|
@ -133,7 +133,7 @@ defineEmits<{
|
||||||
<KebabAction
|
<KebabAction
|
||||||
v-if="action && !node.actionDisabled"
|
v-if="action && !node.actionDisabled"
|
||||||
:id-name="node.name"
|
:id-name="node.name"
|
||||||
status="ACTIVE"
|
:status="node.status"
|
||||||
@view="$emit('view', node)"
|
@view="$emit('view', node)"
|
||||||
@edit="$emit('edit', node)"
|
@edit="$emit('edit', node)"
|
||||||
@delete="$emit('delete', node)"
|
@delete="$emit('delete', node)"
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,10 @@
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
|
import { ref } from 'vue';
|
||||||
import ToggleButton from '../button/ToggleButton.vue';
|
import ToggleButton from '../button/ToggleButton.vue';
|
||||||
|
import { QMenu } from 'quasar';
|
||||||
|
import { watch } from 'vue';
|
||||||
|
|
||||||
withDefaults(
|
const props = withDefaults(
|
||||||
defineProps<{
|
defineProps<{
|
||||||
idName: string;
|
idName: string;
|
||||||
status: string;
|
status: string;
|
||||||
|
|
@ -20,6 +23,17 @@ defineEmits<{
|
||||||
(e: 'delete'): void;
|
(e: 'delete'): void;
|
||||||
(e: 'changeStatus'): void;
|
(e: 'changeStatus'): void;
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
|
const refMenu = ref<InstanceType<typeof QMenu>>();
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => props.status,
|
||||||
|
() => {
|
||||||
|
setTimeout(() => {
|
||||||
|
refMenu.value?.hide();
|
||||||
|
}, 100);
|
||||||
|
},
|
||||||
|
);
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<q-btn
|
<q-btn
|
||||||
|
|
@ -31,7 +45,7 @@ defineEmits<{
|
||||||
:id="`btn-kebab-action-${idName}`"
|
:id="`btn-kebab-action-${idName}`"
|
||||||
@click.stop
|
@click.stop
|
||||||
>
|
>
|
||||||
<q-menu class="bordered">
|
<q-menu class="bordered" ref="refMenu">
|
||||||
<q-list>
|
<q-list>
|
||||||
<q-item
|
<q-item
|
||||||
v-close-popup
|
v-close-popup
|
||||||
|
|
@ -107,7 +121,11 @@ defineEmits<{
|
||||||
two-way
|
two-way
|
||||||
:id="`btn-kebab-status-${idName}`"
|
:id="`btn-kebab-status-${idName}`"
|
||||||
:model-value="status !== 'INACTIVE'"
|
:model-value="status !== 'INACTIVE'"
|
||||||
@click="() => $emit('changeStatus')"
|
@click="
|
||||||
|
() => {
|
||||||
|
$emit('changeStatus');
|
||||||
|
}
|
||||||
|
"
|
||||||
/>
|
/>
|
||||||
<span class="q-pl-md">
|
<span class="q-pl-md">
|
||||||
{{
|
{{
|
||||||
|
|
|
||||||
|
|
@ -175,7 +175,8 @@ const treeProductTypeAndGroup = computed(
|
||||||
product: item._count.product,
|
product: item._count.product,
|
||||||
},
|
},
|
||||||
type: 'group',
|
type: 'group',
|
||||||
actionDisabled: item.status === 'INACTIVE',
|
actionDisabled: false,
|
||||||
|
// actionDisabled: item.status === 'INACTIVE',
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
id: 'type',
|
id: 'type',
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue