feat: updates ItemProposal

This commit is contained in:
Javier Segarra 2024-09-11 23:17:38 +02:00
parent 373ca0b3f1
commit 9ec1c5ff4b
6 changed files with 244 additions and 232 deletions

View File

@ -9,6 +9,9 @@ import VnLv from 'src/components/ui/VnLv.vue';
import { toCurrency } from 'filters/index';
import VnStockValueDisplay from 'src/components/ui/VnStockValueDisplay.vue';
import { useDialogPluginComponent } from 'quasar';
import VnTable from 'src/components/VnTable/VnTable.vue';
import VnInput from 'src/components/common/VnInput.vue';
import VnInputNumber from 'src/components/common/VnInputNumber.vue';
const MATCH_VALUES = [5, 6, 7, 8];
const { t } = useI18n();
@ -79,12 +82,23 @@ const columns = computed(() => [
label: t('proposal.available'),
name: 'available',
field: 'available',
columnClass: 'shrink',
columnFilter: {
component: 'input',
type: 'number',
columnClass: 'shrink',
},
},
{
...defaultColumnAttrs,
label: t('proposal.difference'),
name: 'difference',
field: (item) => (item.id % 2 === 0 ? 10 : -10),
format: (item) => (item.id % 2 === 0 ? 10 : -10),
columnFilter: {
component: 'input',
type: 'number',
columnClass: 'shrink',
},
},
{
...defaultColumnAttrs,
@ -106,6 +120,8 @@ const columns = computed(() => [
label: t('proposal.longName'),
name: 'longName',
field: 'longName',
columnClass: 'expand',
columnFilter: { class: 'expand' },
},
// {
// ...defaultColumnAttrs,
@ -152,12 +168,22 @@ const columns = computed(() => [
label: t('proposal.price2'),
name: 'price2',
field: 'price2',
columnFilter: {
component: 'input',
type: 'number',
class: 'expand',
},
},
{
...defaultColumnAttrs,
label: t('proposal.minQuantity'),
name: 'minQuantity',
field: 'minQuantity',
columnFilter: {
component: 'input',
type: 'number',
class: 'expand',
},
},
{
...defaultColumnAttrs,
@ -200,82 +226,15 @@ onUnmounted(() => {});
</script>
<template>
<QPopupProxy ref="popupProxyRef">
<QCard>
<!-- {{ itemLack }} -->
<QCardSection v-if="false" class="row items-center q-pb-none">
<VnLv class="image">
<template #label>
<QImg
:src="`/api/Images/catalog/50x50/${item.id}/download?access_token=${token}`"
spinner-color="primary"
:ratio="1"
height="50px"
width="50px"
class="image remove-bg"
:alt="'asdads'"
/>
</template>
<template #value>
<QBtn flat class="link text-blue">
{{ item.longName }}
<ItemDescriptorProxy :id="item.id" />
</QBtn>
<FetchedTags class="q-ml-md" :item="item" :max-length="5" />
</template>
</VnLv>
<QSpace />
<QBtn icon="close" flat round dense v-close-popup />
</QCardSection>
<QCardSection
v-if="false"
class="row items-center justify-center column items-stretch"
>
<span class="text-h6 text-grey">
<!-- {{ currentTicket }} -->
<!-- {{
t('proposal.title', {
ticketFk: currentTicket.ticketFk,
saleFk: currentTicket.saleFk,
})
}} -->
</span>
</QCardSection>
<QCardActions v-if="$props.replaceAction">
<!-- <QBtn
:label="t('globals.removeSelection')"
color="primary"
flat
:disable="proposalSelected.length < 1 || quantity === 0"
@click="proposalSelected = []"
/> -->
<QBtn
:label="t('globals.replace')"
color="primary"
:loading="isLoading"
@click="confirm"
:disable="proposalSelected.length < 1 || quantity === 0"
unelevated
/>
<QInput
v-model.number="quantity"
v-if="quantity > -1"
@update:model-value="(val) => (quantity = val)"
type="number"
min="0"
:label="t('proposal.quantityToReplace')"
class="q-ml-lg"
/>
</QCardActions>
<QCard style="min-width: 500px">
<QCardSection class="row items-center justify-center column items-stretch">
<!-- <VnRow style="display: flex"> -->
<div>
<div style="width: 62vw">
<!-- {{ proposalSelected }} -->
{{ $props.itemLack.itemFk }}
{{ $props.itemLack.warehouseFk }}
<VnPaginate
:append="false"
<!-- {{ rows[1].available }} -->
<VnTable
data-key="ItemsGetSimilar"
url="Items/getSimilar"
:filter="{
@ -285,57 +244,66 @@ onUnmounted(() => {});
},
}"
auto-load
:columns="columns"
class="full-width q-mt-md"
v-model:selected="proposalSelected"
row-key="id"
:is-editable="false"
:right-search="false"
:without-header="false"
:disable-option="{ card: true, table: true }"
:table="{
'row-key': 'id',
selection: 'multiple',
}"
>
<template #body="{ rows }">
<!-- {{ rows[1].available }} -->
<QTable
:rows="rows"
:columns="columns"
row-key="id"
selection="single"
disa
:pagination="{ rowsPerPage: 0 }"
class="full-width q-mt-md"
:no-data-label="t('globals.noResults')"
v-model:selected="proposalSelected"
:dense="$q.screen.lt.md"
flat
:grid="$q.screen.lt.md"
auto-load
:rows-per-page-options="[0]"
hide-pagination
hide-bottom
>
<template #body-selection="scope">
<QTd align="center" v-if="$props.replaceAction"
><QCheckbox
v-model="scope.selected"
:disable="
!(
scope.row.available >=
itemLack.lack * -1
)
"
>
<QTooltip
v-if="
!(
scope.row.available >=
itemLack.lack * -1
)
"
>
Nop</QTooltip
>
</QCheckbox>
<!-- <div v-else class="q-ml-sm">
<template #top-left>
<div v-if="$props.replaceAction" style="display: flex">
<QBtn
:label="t('globals.replace')"
color="primary"
:loading="isLoading"
@click="confirm"
:disable="
proposalSelected.length < 1 || quantity === 0
"
unelevated
/>
<VnInputNumber
v-model.number="quantity"
v-if="quantity > -1"
@update:model-value="(val) => (quantity = val)"
type="number"
min="0"
:label="t('proposal.quantityToReplace')"
class="q-ml-lg"
/></div
></template>
<!-- <template #body="scope">{{ scope }}</template> -->
<template #body-selection="scope">
<QTd align="center" v-if="$props.replaceAction"
><QCheckbox
v-model="scope.selected"
:disable="
!(scope.row.available >= itemLack.lack * -1)
"
>
<QTooltip
v-if="
!(scope.row.available >= itemLack.lack * -1)
"
>
Nop</QTooltip
>
</QCheckbox>
<!-- <div v-else class="q-ml-sm">
<QIcon name="info" size="sm"></QIcon>
</div
>--></QTd
>
</template>
<template #top-row>
<!-- <QTr>
>
</template>
<template #top-row>
<!-- <QTr>
<QTd />
<QTd
v-for="(col, index) in cols"
@ -352,62 +320,62 @@ onUnmounted(() => {});
/>
</QTd>
</QTr> -->
</template>
<template #body-cell-longName="{ row, value }">
<QTd align="left" class="text-primary">
<QTooltip>
{{ row.id }}
</QTooltip>
<QImg
:src="`/api/Images/catalog/50x50/${row.id}/download?access_token=${token}`"
spinner-color="primary"
:ratio="1"
height="50px"
width="50px"
class="image remove-bg"
:alt="'asdads'" />
<QBtn flat color="blue" dense>{{ value }}</QBtn>
</template>
<template #column-longName="{ row, value }">
<!-- <QTd align="left" class="text-primary"> -->
<QTooltip>
{{ row.id }}
</QTooltip>
<QImg
:src="`/api/Images/catalog/50x50/${row.id}/download?access_token=${token}`"
spinner-color="primary"
:ratio="1"
height="50px"
width="50px"
class="image remove-bg"
:alt="'asdads'"
/>
<QBtn flat color="blue" dense>{{ value }}</QBtn>
<ItemDescriptorProxy :id="row.id" />
<FetchedTags :item="row" :max-length="5"
/></QTd>
</template>
<template #body-cell-status="{ value }">
<QTd class="col" align="center">
<div
:style="{ background: gradientStyle(value) }"
class="compatibility"
>
<QTooltip>
{{ compatibilityItem(value) }}
</QTooltip>
</div>
</QTd>
</template>
<!-- <template #body-cell-tags="{ row }">
<ItemDescriptorProxy :id="row.id" />
<FetchedTags :item="row" :max-length="5" />
<!-- </QTd> -->
</template>
<template #column-status="{ value }">
<!-- <QTd class="col" align="center"> -->
<div
:style="{ background: gradientStyle(value) }"
class="compatibility"
>
<QTooltip>
{{ compatibilityItem(value) }}
</QTooltip>
</div>
<!-- </QTd> -->
</template>
<!-- <template #column-tags="{ row }">
<QTd class="col" align="center"> </QTd>
</template> -->
<template #body-cell-price2="{ row, value }">
<QTd
class="col"
align="center"
:class="[conditionalValuePrice(value)]"
>
<QTooltip>
{{ toCurrency(row.price2) }}
</QTooltip>
{{ toCurrency(row.price2) }}
</QTd>
</template>
<template #body-cell-difference="{ value }">
<QTd class="col" align="left">
<VnStockValueDisplay :value="value" />
</QTd>
</template>
</QTable>
<template #column-price2="{ row }">
<!-- <QTd
class="col"
align="center"
:class="[conditionalValuePrice(value)]"
> -->
<QTooltip>
{{ toCurrency(row.price2) }}
</QTooltip>
{{ toCurrency(row.price2) }}
<!-- </QTd> -->
</template>
</VnPaginate>
<template #column-difference="{ row }">
<pre>{{ row.difference }}</pre>
<!-- <QTd class="col" align="left"> -->
<!-- <VnStockValueDisplay :value="value" /> -->
<!-- </QTd> -->
</template>
</VnTable>
</div>
</QCardSection>
</QCard>

View File

@ -1,5 +1,5 @@
<script setup>
import { computed, ref } from 'vue';
import { computed, ref, watch } from 'vue';
import { useI18n } from 'vue-i18n';
import { useSession } from 'composables/useSession';
import { useSummaryDialog } from 'src/composables/useSummaryDialog';
@ -17,7 +17,13 @@ import RouteFilter from 'pages/Route/Card/RouteFilter.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import VnInputDate from 'components/common/VnInputDate.vue';
import VnTable from 'components/VnTable/VnTable.vue';
const $props = defineProps({
filter: {
type: Object,
default: () => ({}),
},
});
watch($props.filter, (v) => (filterLack.value.where = v));
const { t } = useI18n();
const { viewSummary } = useSummaryDialog();
const quasar = useQuasar();
@ -27,7 +33,7 @@ const tableRef = ref([]);
const confirmationDialog = ref(false);
const startingDate = ref(null);
const router = useRouter();
const routeFilter = {
const filterLack = ref({
include: [
{
relation: 'workers',
@ -36,7 +42,8 @@ const routeFilter = {
},
},
],
};
where: { alertLevel: 'FREE' },
});
const columns = computed(() => [
{
align: 'left',
@ -306,7 +313,7 @@ const openTicketsDialog = (id) => {
:columns="columns"
:right-search="false"
:is-editable="true"
:filter="routeFilter"
:filter="filterLack"
redirect="route"
:row-click="false"
:create="{

View File

@ -34,7 +34,7 @@ const emit = defineEmits(['refreshData']);
const router = useRouter();
const { t } = useI18n();
const QPopupProxyRef = ref(null);
const popupProxyRef = ref(null);
const transferLinesColumns = computed(() => [
{
@ -102,7 +102,7 @@ const transferSales = async (ticketId) => {
</script>
<template>
<QPopupProxy :breakpoint="600" ref="QPopupProxyRef">
<QPopupProxy ref="popupProxyRef">
<QCard class="full-width q-px-md" style="display: flex; width: 100vw">
<QTable
v-if="transfer.sales"

View File

@ -1,7 +1,6 @@
<script setup>
import { computed, nextTick, onMounted, onUnmounted, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import { QBtn, QCheckbox } from 'quasar';
import axios from 'axios';
import ChangeQuantityDialog from 'pages/Ticket/Negative/components/ChangeQuantityDialog.vue';
import ChangeStateDialog from 'pages/Ticket/Negative/components/ChangeStateDialog.vue';
@ -196,8 +195,8 @@ const replaceItem = () => {
sales: selectedRows,
lastActiveTickets: selectedRows.map((row) => row.ticketFk),
}"
></TicketTransfer
></QBtn>
></TicketTransfer>
</QBtn>
<QBtn color="primary" @click="showProposalDialog = true">
<QIcon name="import_export" class="rotate-90"></QIcon>
<ItemProposal
@ -217,7 +216,7 @@ const replaceItem = () => {
</template>
</VnSubToolbar>
<QPage>
<div class="full-width q-pa-md">
<div class="full-width q-pa-md" style="padding-bottom: 0px">
<!-- <p>item:{{ item }}</p>
<p>itemLack:{{ itemLack }}</p>
<p>selectedRows:{{ selectedRows }}</p>
@ -229,31 +228,32 @@ const replaceItem = () => {
@on-fetch="copyOriginalRowsData"
auto-load
>
<template #body="{ rows }">
<template #body>
<!-- <VnLv >
<template #label> -->
<div class="q-mb-lg image" style="display: flex; align-items: center">
<div style="display: flex; align-items: center">
<VnImg :id="item.id" class="rounded image-wrapper"></VnImg>
<QBtn flat class="link text-blue">
{{ item.longName }}
<ItemDescriptorProxy :id="entityId" />
</QBtn>
<QBadge
class="q-ml-xs"
v-if="itemLack"
text-color="white"
:color="itemLack.lack === 0 ? 'green' : 'red'"
:label="itemLack.lack"
/>
<QBtn flat class="link text-blue">
{{ item.longName }}
<ItemDescriptorProxy :id="entityId" />
</QBtn>
<FetchedTags class="q-ml-md" :item="item" :max-length="5" />
</div>
{{ rows }}
<!-- {{ rows }} -->
<!-- </template>
<template #value> </template>
</VnLv> -->
</template>
</VnPaginate>
</div>
<TicketLackTable></TicketLackTable>
<TicketLackTable :filter="{ alertLevel: showFree }"></TicketLackTable>
</QPage>
<!--<HandleSplited
@ -273,4 +273,7 @@ const replaceItem = () => {
opacity: 0;
background-color: $primary;
}
.q-table.q-table__container > div:first-child {
border-radius: unset;
}
</style>

View File

@ -12,8 +12,10 @@ import { useState } from 'src/composables/useState';
import { useRole } from 'src/composables/useRole';
import TicketMassiveUpdate from '../Card/TicketMassiveUpdate.vue';
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
import RightMenu from 'src/components/common/RightMenu.vue';
const router = useRouter();
import VnImg from 'src/components/ui/VnImg.vue';
import TicketLackFilter from './TicketLackFilter.vue';
const stateStore = useStateStore();
const { t } = useI18n();
@ -67,7 +69,8 @@ const columns = computed(() => [
format: ({ itemFk }) => itemFk,
sortable: true,
columnFilter: {
component: 'number',
component: 'input',
type: 'number',
columnClass: 'shrink',
},
},
@ -115,7 +118,8 @@ const columns = computed(() => [
sortable: true,
cardVisible: true,
columnFilter: {
component: 'number',
component: 'input',
type: 'number',
columnClass: 'shrink',
},
},
@ -133,7 +137,8 @@ const columns = computed(() => [
label: t('negative.lack'),
field: ({ lack }) => lack,
columnFilter: {
component: 'number',
component: 'input',
type: 'number',
columnClass: 'shrink',
},
sortable: true,
@ -198,39 +203,42 @@ onBeforeMount(() => {
<!-- </QBtnGroup> -->
</template>
</VnSubToolbar>
<div class="list">
<VnTable
ref="tableRef"
data-key="NegativeList"
:url="`Tickets/itemLack`"
:order="['itemFk DESC, date DESC, timed DESC']"
:user-params="negativeParams"
auto-load
:columns="columns"
default-mode="table"
:right-search="true"
:is-editable="false"
:use-model="true"
:row-click="redirectToCreateView"
v-model:selected="selectedRows"
:create="false"
:table="{
'row-key': 'itemFk',
selection: 'multiple',
}"
>
<template #column-itemFk="{ row }">
<!-- <QTd style="height: 76px; flex-direction: row; display: flex"> -->
{{ row.itemFk }}
<VnImg
style="width: 50px; height: 50px; float: inline-end"
:id="row.itemFk"
class="rounded"
></VnImg>
<!-- </QTd> -->
</template>
</VnTable>
</div>
<RightMenu>
<template #right-panel>
<TicketLackFilter data-key="NegativeList" />
</template>
</RightMenu>
<VnTable
ref="tableRef"
data-key="NegativeList"
:url="`Tickets/itemLack`"
:order="['itemFk DESC, date DESC, timed DESC']"
:user-params="negativeParams"
auto-load
:columns="columns"
default-mode="table"
:right-search="false"
:is-editable="false"
:use-model="true"
:row-click="redirectToCreateView"
v-model:selected="selectedRows"
:create="false"
:table="{
'row-key': 'itemFk',
selection: 'multiple',
}"
>
<template #column-itemFk="{ row }">
<!-- <QTd style="height: 76px; flex-direction: row; display: flex"> -->
{{ row.itemFk }}
<VnImg
style="width: 50px; height: 50px; float: inline-end"
:id="row.itemFk"
class="rounded"
></VnImg>
<!-- </QTd> -->
</template>
</VnTable>
</QPage>
</template>

View File

@ -1,5 +1,5 @@
<script setup>
import { computed, ref } from 'vue';
import { computed, ref, watch } from 'vue';
import { useI18n } from 'vue-i18n';
import axios from 'axios';
import FetchData from 'src/components/FetchData.vue';
@ -14,7 +14,30 @@ import { useRoute } from 'vue-router';
import VnTable from 'src/components/VnTable/VnTable.vue';
import TicketDescriptorProxy from '../Card/TicketDescriptorProxy.vue';
const rowsSelected = ref([]);
const $props = defineProps({
filter: {
type: Object,
default: () => ({}),
},
});
watch(
() => $props.filter,
(v) => {
filterLack.value.where = v;
tableRef.value.reload(filterLack);
}
);
const filterLack = ref({
include: [
{
relation: 'workers',
scope: {
fields: ['id', 'firstName'],
},
},
],
where: { alertLevel: 'FRasdEE' },
});
const { t } = useI18n();
const URL_KEY = 'Tickets/ItemLack';
const editableStates = ref([]);
@ -75,7 +98,8 @@ const columns = computed(() => [
align: 'left',
sortable: true,
columnFilter: {
component: 'number',
component: 'input',
type: 'number',
},
columnClass: 'shrink',
},
@ -85,7 +109,8 @@ const columns = computed(() => [
align: 'left',
sortable: true,
columnFilter: {
component: 'number',
component: 'input',
type: 'number',
},
columnClass: 'shrink',
},
@ -155,8 +180,9 @@ const columns = computed(() => [
align: 'left',
sortable: true,
columnFilter: {
component: 'number',
columnClass: 'shrink',
component: 'input',
type: 'number',
class: 'expand',
},
},
]);
@ -217,7 +243,7 @@ const tableRef = ref(null);
:create="false"
:create-as-dialog="false"
:use-model="true"
:filter="routeFilter"
:filter="filterLack"
:table="{
'row-key': 'id',
selection: 'multiple',