feat: refs #6123 refactor ZoneControl component to enhance data handling and improve UI elements
This commit is contained in:
parent
01d380c57c
commit
80baecdd9e
|
|
@ -13,12 +13,36 @@ import { useFilterParams } from 'src/composables/useFilterParams';
|
|||
import axios from 'axios';
|
||||
import VnLv from 'src/components/ui/VnLv.vue';
|
||||
import VnCheckbox from 'src/components/common/VnCheckbox.vue';
|
||||
import { useState } from 'src/composables/useState';
|
||||
|
||||
const { t } = useI18n();
|
||||
const quasar = useQuasar();
|
||||
const filterDate = ref(useFilterParams('StockBoughts').params);
|
||||
const state = useState();
|
||||
const user = state.getUser().fn();
|
||||
const footer = ref({ bought: 0, reserve: 0 });
|
||||
const columns = computed(() => [
|
||||
{
|
||||
align: 'left',
|
||||
label: t('warehouse'),
|
||||
name: 'warehouseFk',
|
||||
component: 'select',
|
||||
attrs: {
|
||||
url: 'Warehouses',
|
||||
fields: ['id', 'name'],
|
||||
optionValue: 'id',
|
||||
optionLabel: 'name',
|
||||
sortBy: 'name ASC',
|
||||
},
|
||||
isEditable: false,
|
||||
format: ({ warehouseName }, dashIfEmpty) => dashIfEmpty(warehouseName),
|
||||
},
|
||||
{
|
||||
label: t('date'),
|
||||
name: 'dated',
|
||||
component: 'date',
|
||||
visible: false,
|
||||
create: true,
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
name: 'zoneFk',
|
||||
|
|
@ -29,7 +53,26 @@ const columns = computed(() => [
|
|||
{
|
||||
name: 'etd',
|
||||
label: t('etd'),
|
||||
component: 'date',
|
||||
component: 'time',
|
||||
isEditable: false,
|
||||
},
|
||||
{
|
||||
name: 'volume',
|
||||
label: t('volume'),
|
||||
component: 'number',
|
||||
isEditable: false,
|
||||
},
|
||||
{
|
||||
name: 'packingVolume',
|
||||
label: t('packingVolume'),
|
||||
component: 'number',
|
||||
isEditable: false,
|
||||
},
|
||||
{
|
||||
name: 'packingProgress',
|
||||
label: t('packingProgress'),
|
||||
component: 'number',
|
||||
isEditable: false,
|
||||
},
|
||||
{
|
||||
name: 'isLate',
|
||||
|
|
@ -40,21 +83,7 @@ const columns = computed(() => [
|
|||
name: 'isFull',
|
||||
label: t('isFull'),
|
||||
component: 'checkbox',
|
||||
},
|
||||
{
|
||||
name: 'm3',
|
||||
label: t('m3'),
|
||||
component: 'number',
|
||||
},
|
||||
{
|
||||
name: 'm3enc',
|
||||
label: t('m3enc'),
|
||||
component: 'number',
|
||||
},
|
||||
{
|
||||
name: 'm3porEnc',
|
||||
label: t('m3porEnc'),
|
||||
component: 'number',
|
||||
isEditable: false,
|
||||
},
|
||||
]);
|
||||
const fetchDataRef = ref();
|
||||
|
|
@ -75,41 +104,6 @@ function setFooter(data) {
|
|||
}
|
||||
</script>
|
||||
<template>
|
||||
<VnSubToolbar>
|
||||
<template #st-data>
|
||||
<FetchData
|
||||
ref="fetchDataRef"
|
||||
url="ProductionConfigs"
|
||||
:filter="{
|
||||
fields: [
|
||||
'isZoneClosedByExpeditionActivated',
|
||||
'minTicketsToCloseZone',
|
||||
],
|
||||
}"
|
||||
@on-fetch="(data) => (productionConfig = data[0])"
|
||||
/>
|
||||
<VnRow>
|
||||
<VnLv
|
||||
:label="t('minTicketsToCloseZone')"
|
||||
:value="productionConfig?.minTicketsToCloseZone"
|
||||
/>
|
||||
<VnLv
|
||||
:label="t('isZoneClosedByExpeditionActivated')"
|
||||
:value="productionConfig?.isZoneClosedByExpeditionActivated"
|
||||
style="max-width: 100%"
|
||||
/>
|
||||
<QBtn
|
||||
style="max-width: 5%"
|
||||
flat
|
||||
icon="edit"
|
||||
@click="openDialog()"
|
||||
:title="t('entryStockBought.editTravel')"
|
||||
color="primary"
|
||||
data-cy="edit-travel"
|
||||
/>
|
||||
</VnRow>
|
||||
</template>
|
||||
</VnSubToolbar>
|
||||
<QDialog v-model="productionConfigDialogRef" :class="['vn-row', 'wrap']">
|
||||
<FormModelPopup
|
||||
url-update="ProductionConfigs/1"
|
||||
|
|
@ -139,21 +133,55 @@ function setFooter(data) {
|
|||
url="Zones/controlFilter"
|
||||
search-url="Zones/controlFilter"
|
||||
order="bought DESC"
|
||||
:disable-option="{ card: true }"
|
||||
:is-editable="true"
|
||||
@on-fetch="
|
||||
async (data) => {
|
||||
setFooter(data);
|
||||
await fetchDataRef.fetch();
|
||||
if (fetchDataRef) await fetchDataRef.fetch();
|
||||
}
|
||||
"
|
||||
:columns="columns"
|
||||
:footer="true"
|
||||
table-height="80vh"
|
||||
:column-search="false"
|
||||
:without-header="true"
|
||||
:user-params="{ dated: Date.vnNew() }"
|
||||
:user-params="{ dated: Date.vnNew(), warehouseFk: user.warehouseFk }"
|
||||
auto-load
|
||||
>
|
||||
<template #top-left>
|
||||
<FetchData
|
||||
ref="fetchDataRef"
|
||||
url="ProductionConfigs"
|
||||
:filter="{
|
||||
fields: [
|
||||
'isZoneClosedByExpeditionActivated',
|
||||
'minTicketsToCloseZone',
|
||||
],
|
||||
}"
|
||||
@on-fetch="(data) => (productionConfig = data[0])"
|
||||
/>
|
||||
<VnRow>
|
||||
<VnLv
|
||||
:label="t('minTicketsToCloseZone')"
|
||||
:value="productionConfig?.minTicketsToCloseZone"
|
||||
info="test"
|
||||
/>
|
||||
<VnLv
|
||||
:label="t('isZoneClosedByExpeditionActivated')"
|
||||
:value="productionConfig?.isZoneClosedByExpeditionActivated"
|
||||
style="max-width: 100%"
|
||||
info="test"
|
||||
/>
|
||||
<QBtn
|
||||
style="max-width: 5%"
|
||||
flat
|
||||
icon="edit"
|
||||
@click="openDialog()"
|
||||
:title="t('editProductionConfig')"
|
||||
color="primary"
|
||||
data-cy="edit-travel"
|
||||
/>
|
||||
</VnRow>
|
||||
</template>
|
||||
</VnTable>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -163,21 +191,30 @@ function setFooter(data) {
|
|||
minTicketsToCloseZone: Min tickets to close
|
||||
isZoneClosedByExpeditionActivated: Closed by expedition
|
||||
popUpTitle: Edit config
|
||||
isLate: Is late
|
||||
isFull: Is full
|
||||
zone: Zone
|
||||
warehouse: Warehouse
|
||||
etd: Etd
|
||||
volume: Volume
|
||||
packingVolume: Pac. volume
|
||||
packingProgress: Progress
|
||||
es:
|
||||
minTicketsToCloseZone: Tickets minimos para cerrar zona
|
||||
isZoneClosedByExpeditionActivated: Zona cerrada por expedición activada
|
||||
minTicketsToCloseZone: Tickets minimos
|
||||
isZoneClosedByExpeditionActivated: Por expedición
|
||||
popUpTitle: Editar configuración
|
||||
isLate: Tarde
|
||||
isFull: Completo
|
||||
zone: Zona
|
||||
warehouse: Almacen
|
||||
etd: Etd
|
||||
volume: Volumen
|
||||
packingVolume: Vol. Encajado
|
||||
packingProgress: Progreso
|
||||
</i18n>
|
||||
<style lang="scss" scoped>
|
||||
.table-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.column {
|
||||
min-width: 35%;
|
||||
margin-top: 1%;
|
||||
}
|
||||
.text-negative {
|
||||
color: $negative !important;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue