style: refs #7347 updates
gitea/salix-front/pipeline/pr-dev There was a failure building this commit
Details
gitea/salix-front/pipeline/pr-dev There was a failure building this commit
Details
This commit is contained in:
parent
4a2074dc9d
commit
91f317dfe6
|
|
@ -320,8 +320,12 @@ input::-webkit-inner-spin-button {
|
||||||
.q-item > .q-item__section:has(.q-checkbox) {
|
.q-item > .q-item__section:has(.q-checkbox) {
|
||||||
max-width: fit-content;
|
max-width: fit-content;
|
||||||
}
|
}
|
||||||
|
.vn-row > * .q-checkbox r {
|
||||||
.row > .column:has(.q-checkbox) {
|
min-width: 80%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
.vn-row > .q-checkbox.row.items-center {
|
||||||
max-width: fit-content;
|
max-width: fit-content;
|
||||||
}
|
}
|
||||||
.q-field__inner {
|
.q-field__inner {
|
||||||
|
|
|
||||||
|
|
@ -8,8 +8,9 @@ import SendEmailDialog from 'components/common/SendEmailDialog.vue';
|
||||||
import SupplierConsumptionFilter from './SupplierConsumptionFilter.vue';
|
import SupplierConsumptionFilter from './SupplierConsumptionFilter.vue';
|
||||||
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
|
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
|
||||||
|
|
||||||
import { dateRange, toDate } from 'src/filters';
|
import { dateRange, toCurrency, toDate } from 'src/filters';
|
||||||
import { dashIfEmpty } from 'src/filters';
|
|
||||||
|
import EntryDescriptorProxy from 'src/pages/Entry/Card/EntryDescriptorProxy.vue';
|
||||||
import { usePrintService } from 'composables/usePrintService';
|
import { usePrintService } from 'composables/usePrintService';
|
||||||
import useNotify from 'src/composables/useNotify.js';
|
import useNotify from 'src/composables/useNotify.js';
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
|
@ -31,7 +32,81 @@ const arrayData = useArrayData('SupplierConsumption', {
|
||||||
order: ['itemTypeFk', 'itemName', 'itemSize'],
|
order: ['itemTypeFk', 'itemName', 'itemSize'],
|
||||||
userFilter: { where: { supplierFk: route.params.id } },
|
userFilter: { where: { supplierFk: route.params.id } },
|
||||||
});
|
});
|
||||||
|
const headerColumns = computed(() => [
|
||||||
|
{
|
||||||
|
name: 'id',
|
||||||
|
label: t('globals.entry'),
|
||||||
|
align: 'left',
|
||||||
|
field: 'id',
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'invoiceNumber',
|
||||||
|
label: t('globals.subItem'),
|
||||||
|
align: 'left',
|
||||||
|
field: 'invoiceNumber',
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'quantity',
|
||||||
|
label: t('globals.quantity'),
|
||||||
|
align: 'left',
|
||||||
|
field: 'quantity',
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'total',
|
||||||
|
label: t('globals.quantity'),
|
||||||
|
align: 'left',
|
||||||
|
field: 'total',
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'shipped',
|
||||||
|
label: t('globals.quantity'),
|
||||||
|
align: 'left',
|
||||||
|
field: 'shipped',
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
|
||||||
|
const columns = computed(() => [
|
||||||
|
{
|
||||||
|
name: 'itemName',
|
||||||
|
label: t('globals.item'),
|
||||||
|
align: 'left',
|
||||||
|
field: 'itemName',
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'subName',
|
||||||
|
label: t('globals.subItem'),
|
||||||
|
align: 'left',
|
||||||
|
field: 'subName',
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'quantity',
|
||||||
|
label: t('globals.quantity'),
|
||||||
|
align: 'left',
|
||||||
|
field: 'quantity',
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'price',
|
||||||
|
label: t('globals.price'),
|
||||||
|
align: 'left',
|
||||||
|
field: 'price',
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'total',
|
||||||
|
label: t('globals.total'),
|
||||||
|
align: 'left',
|
||||||
|
field: 'total',
|
||||||
|
sortable: true,
|
||||||
|
},
|
||||||
|
]);
|
||||||
const store = arrayData.store;
|
const store = arrayData.store;
|
||||||
|
|
||||||
onUnmounted(() => state.unset('SupplierConsumption'));
|
onUnmounted(() => state.unset('SupplierConsumption'));
|
||||||
|
|
@ -122,13 +197,17 @@ const totalEntryPrice = (rows) => {
|
||||||
totalQuantity = totalQuantity + quantity;
|
totalQuantity = totalQuantity + quantity;
|
||||||
}
|
}
|
||||||
totalRows.value = { totalPrice, totalQuantity };
|
totalRows.value = { totalPrice, totalQuantity };
|
||||||
|
// expanded.value = rows.map((r) => r.id);
|
||||||
return rows;
|
return rows;
|
||||||
};
|
};
|
||||||
|
const tableRef = ref(null);
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
stateStore.rightDrawer = true;
|
stateStore.rightDrawer = true;
|
||||||
await getSupplierConsumptionData();
|
await getSupplierConsumptionData();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const expanded = ref([]);
|
||||||
|
// const initialExpanded = rows.filter((r, i) => i % 3 === 0).map((r) => r.index);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
@ -179,60 +258,215 @@ onMounted(async () => {
|
||||||
<SupplierConsumptionFilter data-key="SupplierConsumption" />
|
<SupplierConsumptionFilter data-key="SupplierConsumption" />
|
||||||
</template>
|
</template>
|
||||||
</RightMenu>
|
</RightMenu>
|
||||||
<QTable
|
<QCard class="full-width q-pa-md">
|
||||||
:rows="rows"
|
<QTable
|
||||||
row-key="id"
|
flat
|
||||||
hide-header
|
bordered
|
||||||
class="full-width q-mt-md"
|
ref="tableRef"
|
||||||
:no-data-label="t('No results')"
|
:rows="rows"
|
||||||
>
|
:columns="headerColumns"
|
||||||
<template #body="{ row }">
|
:table-colspan="9"
|
||||||
<QTr>
|
row-key="id"
|
||||||
<QTd no-hover>
|
virtual-scroll
|
||||||
<span class="label">{{ t('supplier.consumption.entry') }}: </span>
|
:virtual-scroll-item-size="48"
|
||||||
<span>{{ row.id }}</span>
|
:pagination="{
|
||||||
</QTd>
|
rowsPerPage: 0,
|
||||||
<QTd no-hover>
|
}"
|
||||||
<span class="label">{{ t('globals.date') }}: </span>
|
:rows-per-page-options="[0]"
|
||||||
<span>{{ toDate(row.shipped) }}</span></QTd
|
v-model:expanded="expanded"
|
||||||
|
>
|
||||||
|
<template v-slot:header="props">
|
||||||
|
<QTr :props="props">
|
||||||
|
<QTh auto-width />
|
||||||
|
|
||||||
|
<QTh v-for="col in props.cols" :key="col.name" :props="props">
|
||||||
|
{{ col.label }}
|
||||||
|
</QTh>
|
||||||
|
</QTr>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template v-slot:body="props">
|
||||||
|
<QTr :props="props" :key="`m_${props.row.id}`" class="bg-travel">
|
||||||
|
<QTd auto-width>
|
||||||
|
<QToggle
|
||||||
|
v-model="props.expand"
|
||||||
|
checked-icon="vn:eye"
|
||||||
|
unchecked-icon="remove"
|
||||||
|
/>
|
||||||
|
</QTd>
|
||||||
|
|
||||||
|
<QTd v-for="col in props.cols" :key="col.name" :props="props">
|
||||||
|
{{ col.value }}
|
||||||
|
</QTd>
|
||||||
|
</QTr>
|
||||||
|
<QTr
|
||||||
|
v-show="props.expand"
|
||||||
|
:props="props"
|
||||||
|
:key="`e_${props.row.id}`"
|
||||||
|
class="q-virtual-scroll--with-prev"
|
||||||
>
|
>
|
||||||
<QTd colspan="6" no-hover>
|
<QTd colspan="100%">
|
||||||
<span class="label">{{ t('globals.reference') }}: </span>
|
<QTable
|
||||||
<span>{{ row.invoiceNumber }}</span>
|
flat
|
||||||
</QTd>
|
bordered
|
||||||
</QTr>
|
color="secondary"
|
||||||
<QTr v-for="(buy, index) in row.buys" :key="index">
|
card-class="bg-travel text-white"
|
||||||
<QTd no-hover>
|
table-header-class=" text-white"
|
||||||
<QBtn flat color="blue" dense no-caps>{{ buy.itemName }}</QBtn>
|
ref="tableRef"
|
||||||
<ItemDescriptorProxy :id="buy.itemFk" />
|
:rows="props.row.buys"
|
||||||
</QTd>
|
:columns="columns"
|
||||||
|
hide-header
|
||||||
|
:table-colspan="9"
|
||||||
|
row-key="id"
|
||||||
|
virtual-scroll
|
||||||
|
:virtual-scroll-item-size="48"
|
||||||
|
:pagination="{
|
||||||
|
rowsPerPage: 0,
|
||||||
|
}"
|
||||||
|
:rows-per-page-options="[0]"
|
||||||
|
v-model:expanded="expanded"
|
||||||
|
>
|
||||||
|
<template v-slot:header="props">
|
||||||
|
<QTr :props="props">
|
||||||
|
<QTh
|
||||||
|
v-for="col in props.cols"
|
||||||
|
:key="col.name"
|
||||||
|
:props="props"
|
||||||
|
>
|
||||||
|
{{ col.label }}
|
||||||
|
</QTh>
|
||||||
|
</QTr>
|
||||||
|
</template>
|
||||||
|
<template v-slot:body="props">
|
||||||
|
<QTr :props="props" :key="`m_${props.row.id}`">
|
||||||
|
<QTd
|
||||||
|
v-for="col in props.cols"
|
||||||
|
:key="col.name"
|
||||||
|
:props="props"
|
||||||
|
>
|
||||||
|
{{ col.value }}
|
||||||
|
</QTd>
|
||||||
|
</QTr>
|
||||||
|
</template>
|
||||||
|
</QTable>
|
||||||
|
</QTd>
|
||||||
|
</QTr>
|
||||||
|
</template>
|
||||||
|
</QTable>
|
||||||
|
</QCard>
|
||||||
|
<!-- <QTable
|
||||||
|
:rows="rows"
|
||||||
|
row-key="id"
|
||||||
|
hide-header
|
||||||
|
class="full-width q-mt-md"
|
||||||
|
:no-data-label="t('No results')"
|
||||||
|
>
|
||||||
|
<template #body="{ row }">
|
||||||
|
<QTr>
|
||||||
|
<QTd no-hover>
|
||||||
|
|
||||||
<QTd no-hover>
|
</QTd>
|
||||||
<span>{{ buy.subName }}</span>
|
<QTd no-hover>
|
||||||
<FetchedTags :item="buy" />
|
</QTd
|
||||||
</QTd>
|
>
|
||||||
<QTd no-hover> {{ dashIfEmpty(buy.quantity) }}</QTd>
|
<QTd colspan="6" no-hover>
|
||||||
<QTd no-hover> {{ dashIfEmpty(buy.price) }}</QTd>
|
|
||||||
<QTd colspan="2" no-hover> {{ dashIfEmpty(buy.total) }}</QTd>
|
</QTd>
|
||||||
</QTr>
|
</QTr>
|
||||||
<QTr>
|
<QTh>
|
||||||
<QTd colspan="5" no-hover>
|
<QTd no-hover>
|
||||||
<span class="label">{{ t('Total entry') }}: </span>
|
<span class="label">ItemFk </span>
|
||||||
<span>{{ row.total }} €</span>
|
</QTd>
|
||||||
</QTd>
|
<QTd no-hover>
|
||||||
<QTd no-hover>
|
<span class="header">subName </span>
|
||||||
<span class="label">{{ t('Total stems') }}: </span>
|
</QTd>
|
||||||
<span>{{ row.quantity }}</span>
|
<QTd no-hover>
|
||||||
</QTd>
|
<span class="label"> Quanitity : </span>
|
||||||
</QTr>
|
</QTd>
|
||||||
</template>
|
</QTh>
|
||||||
</QTable>
|
<QTr v-for="(buy, index) in row.buys" :key="index">
|
||||||
|
<QTd no-hover>
|
||||||
|
<QBtn flat color="blue" dense no-caps>{{ buy.itemName }}</QBtn>
|
||||||
|
<ItemDescriptorProxy :id="buy.itemFk" />
|
||||||
|
</QTd>
|
||||||
|
|
||||||
|
<QTd no-hover>
|
||||||
|
<span>{{ buy.subName }}</span>
|
||||||
|
<FetchedTags :item="buy" />
|
||||||
|
</QTd>
|
||||||
|
<QTd no-hover> {{ dashIfEmpty(buy.quantity) }}</QTd>
|
||||||
|
<QTd no-hover> {{ dashIfEmpty(buy.price) }}</QTd>
|
||||||
|
<QTd colspan="2" no-hover> {{ dashIfEmpty(buy.total) }}</QTd>
|
||||||
|
</QTr>
|
||||||
|
<QTr>
|
||||||
|
<QTd colspan="5" no-hover>
|
||||||
|
<span class="label">{{ t('Total entry') }}: </span>
|
||||||
|
<span>{{ row.total }} €</span>
|
||||||
|
</QTd>
|
||||||
|
<QTd no-hover>
|
||||||
|
<span class="label">{{ t('Total stems') }}: </span>
|
||||||
|
<span>{{ row.quantity }}</span>
|
||||||
|
</QTd>
|
||||||
|
</QTr>
|
||||||
|
</template>
|
||||||
|
</QTable> -->
|
||||||
</template>
|
</template>
|
||||||
|
<style lang="scss">
|
||||||
|
.QTable__top {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.QTable__bottom.row.items-center {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.label {
|
.label {
|
||||||
|
padding-right: 5px;
|
||||||
color: var(--vn-label-color);
|
color: var(--vn-label-color);
|
||||||
}
|
}
|
||||||
|
.header {
|
||||||
|
flex: 1 0 33%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding-left: 8px;
|
||||||
|
height: 35px;
|
||||||
|
border-bottom: 1px solid $primary;
|
||||||
|
background-color: var(--vn-page-color);
|
||||||
|
font-size: 19px;
|
||||||
|
font-weight: bold;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
.footer {
|
||||||
|
flex: 1 0 33%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding-left: 8px;
|
||||||
|
height: 35px;
|
||||||
|
border-bottom: 1px solid $primary;
|
||||||
|
background-color: var(--vn-page-color);
|
||||||
|
font-size: 19px;
|
||||||
|
font-weight: bold;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-travel {
|
||||||
|
background-color: var(--vn-page-color);
|
||||||
|
border-bottom: 2px solid $primary;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header {
|
||||||
|
flex: 1 0 33%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding-left: 8px;
|
||||||
|
height: 35px;
|
||||||
|
border-bottom: 1px solid $primary;
|
||||||
|
background-color: var(--vn-page-color);
|
||||||
|
font-size: 19px;
|
||||||
|
font-weight: bold;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
<i18n>
|
<i18n>
|
||||||
|
|
|
||||||
|
|
@ -61,11 +61,27 @@ onMounted(() => weekdayStore.initStore());
|
||||||
v-for="(detail, index) in details"
|
v-for="(detail, index) in details"
|
||||||
:key="index"
|
:key="index"
|
||||||
class="full-width flex q-mb-lg"
|
class="full-width flex q-mb-lg"
|
||||||
|
style="flex-direction: column"
|
||||||
>
|
>
|
||||||
<span class="header">
|
<div class="column full-width">
|
||||||
{{ getHeaderTitle(detail.shipped) }}
|
<div class="flex">
|
||||||
</span>
|
<span class="header">
|
||||||
<QTable flat :columns="columns" :rows="detail.lines" class="full-width" />
|
{{ getHeaderTitle(detail.shipped) }}
|
||||||
|
</span>
|
||||||
|
<span class="header">
|
||||||
|
{{ getHeaderTitle(detail.shipped) }}
|
||||||
|
</span>
|
||||||
|
<span class="header">
|
||||||
|
{{ getHeaderTitle(detail.shipped) }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<QTable
|
||||||
|
flat
|
||||||
|
:columns="columns"
|
||||||
|
:rows="detail.lines"
|
||||||
|
class="full-width"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</QCard>
|
</QCard>
|
||||||
</QPage>
|
</QPage>
|
||||||
|
|
@ -73,7 +89,7 @@ onMounted(() => weekdayStore.initStore());
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.header {
|
.header {
|
||||||
min-width: 100% !important;
|
flex: 1 0 33%;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding-left: 8px;
|
padding-left: 8px;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue