forked from verdnatura/salix-front
fix: formModelPoup defaultActions false
This commit is contained in:
parent
eaea8a50f0
commit
73c5e0f1f4
|
@ -90,7 +90,7 @@ const $props = defineProps({
|
||||||
});
|
});
|
||||||
const emit = defineEmits(['onFetch', 'onDataSaved']);
|
const emit = defineEmits(['onFetch', 'onDataSaved']);
|
||||||
const modelValue = computed(
|
const modelValue = computed(
|
||||||
() => $props.model ?? `formModel_${route?.meta?.title ?? route.name}`,
|
() => $props.model ?? `formModel_${route?.meta?.title ?? route.name}`
|
||||||
).value;
|
).value;
|
||||||
const componentIsRendered = ref(false);
|
const componentIsRendered = ref(false);
|
||||||
const arrayData = useArrayData(modelValue);
|
const arrayData = useArrayData(modelValue);
|
||||||
|
@ -137,7 +137,7 @@ onMounted(async () => {
|
||||||
JSON.stringify(newVal) !== JSON.stringify(originalData.value);
|
JSON.stringify(newVal) !== JSON.stringify(originalData.value);
|
||||||
isResetting.value = false;
|
isResetting.value = false;
|
||||||
},
|
},
|
||||||
{ deep: true },
|
{ deep: true }
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -145,7 +145,7 @@ onMounted(async () => {
|
||||||
if (!$props.url)
|
if (!$props.url)
|
||||||
watch(
|
watch(
|
||||||
() => arrayData.store.data,
|
() => arrayData.store.data,
|
||||||
(val) => updateAndEmit('onFetch', val),
|
(val) => updateAndEmit('onFetch', val)
|
||||||
);
|
);
|
||||||
|
|
||||||
watch(formUrl, async () => {
|
watch(formUrl, async () => {
|
||||||
|
@ -239,7 +239,7 @@ function filter(value, update, filterOptions) {
|
||||||
(ref) => {
|
(ref) => {
|
||||||
ref.setOptionIndex(-1);
|
ref.setOptionIndex(-1);
|
||||||
ref.moveOptionSelection(1, true);
|
ref.moveOptionSelection(1, true);
|
||||||
},
|
}
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -261,13 +261,7 @@ defineExpose({
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<div class="column items-center full-width">
|
<div class="column items-center full-width">
|
||||||
<QForm
|
<QForm @submit="save" @reset="reset" class="q-pa-md" id="formModel">
|
||||||
|
|
||||||
@submit="save"
|
|
||||||
@reset="reset"
|
|
||||||
class="q-pa-md"
|
|
||||||
id="formModel"
|
|
||||||
>
|
|
||||||
<QCard>
|
<QCard>
|
||||||
<slot
|
<slot
|
||||||
v-if="formData"
|
v-if="formData"
|
||||||
|
@ -276,70 +270,72 @@ defineExpose({
|
||||||
:validate="validate"
|
:validate="validate"
|
||||||
:filter="filter"
|
:filter="filter"
|
||||||
/>
|
/>
|
||||||
<SkeletonForm v-else/>
|
<SkeletonForm v-else />
|
||||||
</QCard>
|
</QCard>
|
||||||
</QForm>
|
</QForm>
|
||||||
</div>
|
</div>
|
||||||
<Teleport
|
<Teleport
|
||||||
to="#st-actions"
|
to="#st-actions"
|
||||||
v-if="stateStore?.isSubToolbarShown() && componentIsRendered"
|
v-if="
|
||||||
|
$props.defaultActions &&
|
||||||
|
stateStore?.isSubToolbarShown() &&
|
||||||
|
componentIsRendered
|
||||||
|
"
|
||||||
>
|
>
|
||||||
<div v-if="$props.defaultActions">
|
<QBtnGroup push class="q-gutter-x-sm">
|
||||||
<QBtnGroup push class="q-gutter-x-sm">
|
<slot name="moreActions" />
|
||||||
<slot name="moreActions" />
|
<QBtn
|
||||||
<QBtn
|
:label="tMobile(defaultButtons.reset.label)"
|
||||||
:label="tMobile(defaultButtons.reset.label)"
|
:color="defaultButtons.reset.color"
|
||||||
:color="defaultButtons.reset.color"
|
:icon="defaultButtons.reset.icon"
|
||||||
:icon="defaultButtons.reset.icon"
|
flat
|
||||||
flat
|
@click="reset"
|
||||||
@click="reset"
|
:disable="!hasChanges"
|
||||||
:disable="!hasChanges"
|
:title="t(defaultButtons.reset.label)"
|
||||||
:title="t(defaultButtons.reset.label)"
|
/>
|
||||||
/>
|
<QBtnDropdown
|
||||||
<QBtnDropdown
|
v-if="$props.goTo"
|
||||||
v-if="$props.goTo"
|
@click="saveAndGo"
|
||||||
@click="saveAndGo"
|
:label="tMobile('globals.saveAndContinue')"
|
||||||
:label="tMobile('globals.saveAndContinue')"
|
:title="t('globals.saveAndContinue')"
|
||||||
:title="t('globals.saveAndContinue')"
|
:disable="!hasChanges"
|
||||||
:disable="!hasChanges"
|
color="primary"
|
||||||
color="primary"
|
icon="save"
|
||||||
icon="save"
|
split
|
||||||
split
|
>
|
||||||
>
|
<QList>
|
||||||
<QList>
|
<QItem
|
||||||
<QItem
|
clickable
|
||||||
clickable
|
v-close-popup
|
||||||
v-close-popup
|
@click="save"
|
||||||
@click="save"
|
:title="t('globals.save')"
|
||||||
:title="t('globals.save')"
|
>
|
||||||
>
|
<QItemSection>
|
||||||
<QItemSection>
|
<QItemLabel>
|
||||||
<QItemLabel>
|
<QIcon
|
||||||
<QIcon
|
name="save"
|
||||||
name="save"
|
color="white"
|
||||||
color="white"
|
class="q-mr-sm"
|
||||||
class="q-mr-sm"
|
size="sm"
|
||||||
size="sm"
|
/>
|
||||||
/>
|
{{ t('globals.save').toUpperCase() }}
|
||||||
{{ t('globals.save').toUpperCase() }}
|
</QItemLabel>
|
||||||
</QItemLabel>
|
</QItemSection>
|
||||||
</QItemSection>
|
</QItem>
|
||||||
</QItem>
|
</QList>
|
||||||
</QList>
|
</QBtnDropdown>
|
||||||
</QBtnDropdown>
|
<QBtn
|
||||||
<QBtn
|
v-else
|
||||||
v-else
|
:label="tMobile('globals.save')"
|
||||||
:label="tMobile('globals.save')"
|
color="primary"
|
||||||
color="primary"
|
icon="save"
|
||||||
icon="save"
|
@click="save"
|
||||||
@click="save"
|
:disable="!hasChanges"
|
||||||
:disable="!hasChanges"
|
:title="t(defaultButtons.save.label)"
|
||||||
:title="t(defaultButtons.save.label)"
|
/>
|
||||||
/>
|
</QBtnGroup>
|
||||||
</QBtnGroup>
|
|
||||||
</div>
|
|
||||||
</Teleport>
|
</Teleport>
|
||||||
|
|
||||||
<QInnerLoading
|
<QInnerLoading
|
||||||
:showing="isLoading"
|
:showing="isLoading"
|
||||||
:label="t('globals.pleaseWait')"
|
:label="t('globals.pleaseWait')"
|
||||||
|
|
|
@ -23,16 +23,12 @@ const formModelRef = ref(null);
|
||||||
const closeButton = ref(null);
|
const closeButton = ref(null);
|
||||||
|
|
||||||
const onDataSaved = (formData, requestResponse) => {
|
const onDataSaved = (formData, requestResponse) => {
|
||||||
closeForm();
|
if (closeButton.value) closeButton.value.click();
|
||||||
emit('onDataSaved', formData, requestResponse);
|
emit('onDataSaved', formData, requestResponse);
|
||||||
};
|
};
|
||||||
|
|
||||||
const isLoading = computed(() => formModelRef.value?.isLoading);
|
const isLoading = computed(() => formModelRef.value?.isLoading);
|
||||||
|
|
||||||
const closeForm = async () => {
|
|
||||||
if (closeButton.value) closeButton.value.click();
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({
|
defineExpose({
|
||||||
isLoading,
|
isLoading,
|
||||||
onDataSaved,
|
onDataSaved,
|
||||||
|
|
Loading…
Reference in New Issue