verdnatura/salix-front
verdnatura
/
salix-front
2
3
Fork 1
Code Issues Pull Requests 96 Releases Wiki Activity

refactor: refs #8606 modified table width and order
gitea/salix-front/pipeline/pr-dev This commit looks good Details

This commit is contained in:
Jon Elias 2025-02-17 12:57:37 +01:00
parent 7c6112c896
commit 8b6c0c05d6
1 changed files with 88 additions and 64 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

152
src/pages/Zone/ZoneList.vue
View File

@ -65,7 +65,6 @@ const tableFilter = {
const columns = computed(() => [ const columns = computed(() => [
{ {
align: 'left',
name: 'id', name: 'id',
label: t('list.id'), label: t('list.id'),
chip: { chip: {
@ -75,6 +74,8 @@ const columns = computed(() => [
columnFilter: { columnFilter: {
inWhere: true, inWhere: true,
}, },
columnClass: 'shrink-column',
component: 'number',
}, },
{ {
align: 'left', align: 'left',
@ -106,7 +107,6 @@ const columns = computed(() => [
format: (row, dashIfEmpty) => dashIfEmpty(row?.agencyMode?.name), format: (row, dashIfEmpty) => dashIfEmpty(row?.agencyMode?.name),
}, },
{ {
align: 'left',
name: 'price', name: 'price',
label: t('list.price'), label: t('list.price'),
cardVisible: true, cardVisible: true,
@ -114,6 +114,8 @@ const columns = computed(() => [
columnFilter: { columnFilter: {
inWhere: true, inWhere: true,
}, },
columnClass: 'shrink-column',
component: 'number',
}, },
{ {
align: 'center', align: 'center',
@ -177,68 +179,73 @@ function formatRow(row) {
<ZoneFilterPanel data-key="ZonesList" /> <ZoneFilterPanel data-key="ZonesList" />
</template> </template>
</RightMenu> </RightMenu>
<VnTable <div class="table-container">
ref="tableRef" <div class="column items-center">
data-key="ZonesList" <VnTable
url="Zones" ref="tableRef"
:create="{ data-key="ZonesList"
urlCreate: 'Zones', url="Zones"
title: t('list.createZone'), :create="{
onDataSaved: ({ id }) => tableRef.redirect(`${id}/location`), urlCreate: 'Zones',
formInitialData: {}, title: t('list.createZone'),
}" onDataSaved: ({ id }) => tableRef.redirect(`${id}/location`),
:user-filter="tableFilter" formInitialData: {},
:columns="columns" }"
redirect="zone" :user-filter="tableFilter"
:right-search="false" :columns="columns"
table-height="85vh" redirect="zone"
> :right-search="false"
<template #column-addressFk="{ row }"> table-height="85vh"
{{ dashIfEmpty(formatRow(row)) }} order="id ASC"
</template> >
<template #more-create-dialog="{ data }"> <template #column-addressFk="{ row }">
<VnSelect {{ dashIfEmpty(formatRow(row)) }}
url="AgencyModes" </template>
v-model="data.agencyModeFk" <template #more-create-dialog="{ data }">
option-value="id" <VnSelect
option-label="name" url="AgencyModes"
:label="t('list.agency')" v-model="data.agencyModeFk"
/> option-value="id"
<VnInput option-label="name"
v-model="data.price" :label="t('list.agency')"
:label="t('list.price')" />
min="0" <VnInput
type="number" v-model="data.price"
required="true" :label="t('list.price')"
/> min="0"
<VnInput type="number"
v-model="data.bonus" required="true"
:label="t('zone.bonus')" />
min="0" <VnInput
type="number" v-model="data.bonus"
/> :label="t('zone.bonus')"
<VnInput min="0"
v-model="data.travelingDays" type="number"
:label="t('zone.travelingDays')" />
type="number" <VnInput
min="0" v-model="data.travelingDays"
/> :label="t('zone.travelingDays')"
<VnInputTime v-model="data.hour" :label="t('list.close')" /> type="number"
<VnSelect min="0"
url="Warehouses" />
v-model="data.warehouseFK" <VnInputTime v-model="data.hour" :label="t('list.close')" />
option-value="id" <VnSelect
option-label="name" url="Warehouses"
:label="t('list.warehouse')" v-model="data.warehouseFK"
:options="warehouseOptions" option-value="id"
/> option-label="name"
<QCheckbox :label="t('list.warehouse')"
v-model="data.isVolumetric" :options="warehouseOptions"
:label="t('list.isVolumetric')" />
:toggle-indeterminate="false" <QCheckbox
/> v-model="data.isVolumetric"
</template> :label="t('list.isVolumetric')"
</VnTable> :toggle-indeterminate="false"
/>
</template>
</VnTable>
</div>
</div>
</template> </template>
<i18n> <i18n>
@ -246,3 +253,20 @@ es:
Search zone: Buscar zona Search zone: Buscar zona
You can search zones by id or name: Puedes buscar zonas por id o nombre You can search zones by id or name: Puedes buscar zonas por id o nombre
</i18n> </i18n>
<style lang="scss" scoped>
.table-container {
display: flex;
justify-content: center;
}
.column {
display: flex;
flex-direction: column;
align-items: center;
min-width: 70%;
}
:deep(.shrink-column) {
width: 8%;
}
</style>