refactor: refs #8363 use same dialog as create when cloning a fixedPrice

This commit is contained in:
Jon Elias 2025-03-25 09:17:52 +01:00
parent 712b983340
commit 15bd9da3e2
4 changed files with 32 additions and 180 deletions

View File

@ -227,6 +227,7 @@ watch(
defineExpose({
create: createForm,
showForm,
reload,
redirect: redirectFn,
selected,

View File

@ -1,5 +1,5 @@
<script setup>
import { onMounted, ref, onUnmounted, computed } from 'vue';
import { onMounted, ref, onUnmounted, computed, watch } from 'vue';
import { useI18n } from 'vue-i18n';
import { useStateStore } from 'stores/useStateStore';
@ -17,16 +17,14 @@ import { toDate } from 'src/filters';
import { isLower, isBigger } from 'src/filters/date.js';
import ItemFixedPriceFilter from './ItemFixedPriceFilter.vue';
import ItemDescriptorProxy from './Card/ItemDescriptorProxy.vue';
import CloneFixedPriceForm from 'src/pages/Item/components/CloneFixedPriceForm.vue';
const stateStore = useStateStore();
const { t } = useI18n();
const tableRef = ref();
const editFixedPriceForm = ref(null);
const cloneFixedPriceForm = ref(null);
const cloneRow = ref({});
const selectedRows = ref([]);
const hasSelectedRows = computed(() => selectedRows.value.length > 0);
const isToClone = ref(false);
const dateColor = 'var(--vn-label-text-color)';
onMounted(async () => {
stateStore.rightDrawer = true;
@ -172,7 +170,17 @@ const openEditFixedPriceForm = () => {
};
const openCloneFixedPriceForm = (row) => {
cloneRow.value = (({ itemFk, rate2, rate3, started, ended, warehouseFk }) => ({
tableRef.value.showForm = true;
isToClone.value = true;
tableRef.value.create.title = t('Clone fixed price');
tableRef.value.create.formInitialData = (({
itemFk,
rate2,
rate3,
started,
ended,
warehouseFk,
}) => ({
itemFk,
rate2,
rate3,
@ -180,8 +188,6 @@ const openCloneFixedPriceForm = (row) => {
ended,
warehouseFk,
}))(JSON.parse(JSON.stringify(row)));
cloneFixedPriceForm.value.show();
};
const dateStyle = (date) =>
@ -190,6 +196,23 @@ const dateStyle = (date) =>
color: 'var(--vn-black-text-color)',
}
: { color: dateColor, 'background-color': 'transparent' };
onMounted(() => {
if (tableRef.value) {
tableRef.value.showForm = false;
}
});
watch(
() => tableRef.value?.showForm,
(newVal) => {
if (newVal === false && tableRef.value) {
isToClone.value = false;
tableRef.value.create.title = t('Create fixed price');
tableRef.value.create.formInitialData = {};
}
},
);
</script>
<template>
@ -332,9 +355,6 @@ const dateStyle = (date) =>
@on-data-saved="tableRef.CrudModelRef.saveChanges()"
/>
</QDialog>
<QDialog ref="cloneFixedPriceForm">
<CloneFixedPriceForm :row="cloneRow" @on-data-saved="tableRef.reload()" />
</QDialog>
</template>
<style lang="scss">
.q-table th,
@ -399,4 +419,5 @@ es:
Add fixed price: Añadir precio fijado
Edit fixed price(s): Editar precio(s) fijado(s)
Create fixed price: Crear precio fijado
Clone fixed price: Clonar precio fijado
</i18n>

View File

@ -59,7 +59,6 @@ const props = defineProps({
<VnInputDate
v-model="params.started"
:label="t('params.started')"
is-outlined
filled
@update:model-value="searchFn()"
/>
@ -68,7 +67,6 @@ const props = defineProps({
<VnInputDate
v-model="params.ended"
:label="t('params.ended')"
is-outlined
filled
@update:model-value="searchFn()"
/>

View File

@ -1,168 +0,0 @@
<script setup>
import { ref } from 'vue';
import { useI18n } from 'vue-i18n';
import axios from 'axios';
import { useQuasar } from 'quasar';
import VnSelect from 'src/components/common/VnSelect.vue';
import VnInput from 'src/components/common/VnInput.vue';
import VnInputDate from 'src/components/common/VnInputDate.vue';
import VnRow from 'components/ui/VnRow.vue';
const $props = defineProps({
row: {
type: Array,
default: () => [],
},
});
const { t } = useI18n();
const quasar = useQuasar();
const isLoading = ref(false);
const closeButton = ref(null);
const data = $props.row;
const emit = defineEmits(['onDataSaved']);
const onSubmit = async () => {
if (isLoading.value) return;
isLoading.value = true;
const params = data;
await axios.post('FixedPrices', params);
quasar.notify({
type: 'positive',
message: t('globals.dataSaved'),
});
isLoading.value = false;
closeForm();
emit('onDataSaved');
};
const closeForm = () => {
if (closeButton.value) closeButton.value.click();
};
</script>
<template>
<QForm @submit="onSubmit()" class="all-pointer-events">
<QCard class="q-pa-lg">
<span ref="closeButton" class="close-icon" v-close-popup>
<QIcon name="close" size="sm" />
</span>
<div class="q-pb-md">
<span class="title">{{ t('Clone item') }}</span>
</div>
<VnRow>
<VnSelect
url="Items/search"
v-model="data.itemFk"
:label="t('item.fixedPrice.itemName')"
:fields="['id', 'name']"
:filter-options="['id', 'name']"
option-label="name"
option-value="id"
:required="true"
sort-by="name ASC"
>
<template #option="scope">
<QItem v-bind="scope.itemProps">
<QItemSection>
<QItemLabel>
{{ scope.opt.name }}
</QItemLabel>
<QItemLabel caption> #{{ scope.opt.id }} </QItemLabel>
</QItemSection>
</QItem>
</template>
</VnSelect>
</VnRow>
<VnRow>
<VnInput
:label="t('item.fixedPrice.groupingPrice')"
v-model="data.rate2"
/>
<VnInput
:label="t('item.fixedPrice.packingPrice')"
v-model="data.rate3"
/>
</VnRow>
<VnRow>
<VnInputDate
:label="t('item.fixedPrice.started')"
v-model="data.started"
/>
<VnInputDate :label="t('item.fixedPrice.ended')" v-model="data.ended" />
</VnRow>
<VnRow>
<VnSelect
:label="t('globals.warehouse')"
url="Warehouses"
v-model="data.warehouseFk"
:fields="['id', 'name']"
option-label="name"
option-value="id"
hide-selected
:required="true"
sort-by="name ASC"
>
<template #option="scope">
<QItem v-bind="scope.itemProps">
<QItemSection>
<QItemLabel>
{{ scope.opt.name }}
</QItemLabel>
<QItemLabel caption> #{{ scope.opt.id }} </QItemLabel>
</QItemSection>
</QItem>
</template>
</VnSelect>
</VnRow>
<div class="q-mt-lg row justify-end">
<QBtn
:label="t('globals.cancel')"
type="reset"
color="primary"
flat
:disabled="isLoading"
:loading="isLoading"
v-close-popup
/>
<QBtn
:label="t('globals.save')"
type="submit"
color="primary"
class="q-ml-sm"
:disabled="isLoading"
:loading="isLoading"
@click="onSubmit()"
/>
</div>
</QCard>
</QForm>
</template>
<style lang="scss" scoped>
.title {
font-size: 17px;
font-weight: bold;
line-height: 20px;
}
.close-icon {
position: absolute;
top: 20px;
right: 20px;
cursor: pointer;
}
.countLines {
font-size: 24px;
color: $primary;
font-weight: bold;
}
</style>
<i18n>
es:
Clone item: Clonar artículo
Item id: Id artículo
</i18n>