feat: itemProposalProxy
gitea/salix-front/pipeline/pr-dev There was a failure building this commit Details

This commit is contained in:
Javier Segarra 2024-09-16 10:47:41 +02:00
parent 8be1a42c53
commit 0a3703532e
3 changed files with 161 additions and 136 deletions

View File

@ -94,7 +94,7 @@ const columns = computed(() => [
...defaultColumnAttrs, ...defaultColumnAttrs,
label: t('proposal.difference'), label: t('proposal.difference'),
name: 'difference', name: 'difference',
format: (item) => (item.id % 2 === 0 ? 10 : -10), format: ({ id }) => (id % 2 === 0 ? 10 : -10),
columnFilter: { columnFilter: {
component: 'input', component: 'input',
type: 'number', type: 'number',
@ -226,85 +226,79 @@ function onDialogClose() {
onUnmounted(() => {}); onUnmounted(() => {});
</script> </script>
<template> <template>
<QPopupProxy ref="popupProxyRef"> <!-- <QPopupProxy ref="popupProxyRef"> -->
<QCard style="min-width: 500px"> <!-- <QCard style="min-width: 500px">
<QCardSection class="row items-center justify-center column items-stretch"> <QCardSection class="row items-center justify-center column items-stretch"> -->
<!-- <VnRow style="display: flex"> --> <!-- <VnRow style="display: flex"> -->
<div style="width: 62vw"> <div style="min-width: 65vw">
<!-- {{ proposalSelected }} --> <!-- {{ proposalSelected }} -->
{{ $props.itemLack.itemFk }} <!-- {{ $props.itemLack.itemFk }}
{{ $props.itemLack.warehouseFk }} {{ $props.itemLack.warehouseFk }} -->
<!-- {{ rows[1].available }} --> <!-- {{ rows[1].available }} -->
<VnTable <VnTable
data-key="ItemsGetSimilar" data-key="ItemsGetSimilar"
url="Items/getSimilar" url="Items/getSimilar"
:filter="{ :filter="{
where: { where: {
itemFk: $props.itemLack.itemFk, itemFk: $props.itemLack.itemFk,
warehouseFk: $props.itemLack.warehouseFk, warehouseFk: $props.itemLack.warehouseFk,
}, },
}" }"
auto-load auto-load
:columns="columns" :columns="columns"
class="full-width q-mt-md" class="full-width q-mt-md"
v-model:selected="proposalSelected" v-model:selected="proposalSelected"
row-key="id" row-key="id"
:is-editable="false" :is-editable="false"
:right-search="false" :right-search="false"
:without-header="false" :without-header="false"
:disable-option="{ card: true, table: true }" :disable-option="{ card: true, table: true }"
:table="{ :table="{
'row-key': 'id', 'row-key': 'id',
selection: 'multiple', selection: 'multiple',
}" }"
>
<template #top-left>
<div v-if="$props.replaceAction" style="display: flex">
<QBtn
:label="t('globals.replace')"
class="q-py-xs"
color="primary"
:loading="isLoading"
@click="confirm"
style="padding-block: 8px"
:disable="proposalSelected.length < 1 || quantity === 0"
/>
<VnInputNumber
v-model.number="quantity"
v-if="proposalSelected.length > 0"
@update:model-value="(val) => (quantity = val)"
type="number"
min="0"
:label="t('proposal.quantityToReplace')"
dense
class="q-ml-xs"
/></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)"
> >
<template #top-left> <QTooltip v-if="!(scope.row.available >= itemLack.lack * -1)">
<div v-if="$props.replaceAction" style="display: flex"> Nop</QTooltip
<QBtn >
:label="t('globals.replace')" </QCheckbox>
color="primary" <!-- <div v-else class="q-ml-sm">
: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> <QIcon name="info" size="sm"></QIcon>
</div </div
>--></QTd >--></QTd
> >
</template> </template>
<template #top-row> <template #top-row>
<!-- <QTr> <!-- <QTr>
<QTd /> <QTd />
<QTd <QTd
v-for="(col, index) in cols" v-for="(col, index) in cols"
@ -321,67 +315,67 @@ onUnmounted(() => {});
/> />
</QTd> </QTd>
</QTr> --> </QTr> -->
</template> </template>
<template #column-longName="{ row }"> <template #column-longName="{ row }">
<!-- <QTd align="left" class="text-primary"> --> <!-- <QTd align="left" class="text-primary"> -->
<QTooltip> <QTooltip>
{{ row.id }} {{ row.id }}
</QTooltip> </QTooltip>
<!-- <QBtn flat color="blue" dense>{{ }}</QBtn> --> <!-- <QBtn flat color="blue" dense>{{ }}</QBtn> -->
<p class="link">{{ row.longName }}</p> <p class="link">{{ row.longName }}</p>
<ItemDescriptorProxy :id="row.id" /> <ItemDescriptorProxy :id="row.id" />
<div style="display: flex"> <div style="display: flex">
<VnImg <VnImg
:id="row.id" :id="row.id"
spinner-color="primary" spinner-color="primary"
:ratio="1" :ratio="1"
height="50px" height="50px"
width="50px" width="50px"
class="image remove-bg" class="image remove-bg"
/> />
<FetchedTags :item="row" /> <FetchedTags :item="row" />
</div> </div>
<!-- </QTd> --> <!-- </QTd> -->
</template> </template>
<template #column-status="{ value }"> <template #column-status="{ row }">
<!-- <QTd class="col" align="center"> --> <!-- <QTd class="col" align="center"> -->
<div <div
:style="{ background: gradientStyle(value) }" :style="{ background: gradientStyle(statusConditionalValue(row)) }"
class="compatibility" class="compatibility"
> >
<QTooltip> <QTooltip>
{{ compatibilityItem(value) }} {{ compatibilityItem(statusConditionalValue(row)) }}
</QTooltip> </QTooltip>
</div> </div>
<!-- </QTd> --> <!-- </QTd> -->
</template> </template>
<!-- <template #column-tags="{ row }"> <!-- <template #column-tags="{ row }">
<QTd class="col" align="center"> </QTd> <QTd class="col" align="center"> </QTd>
</template> --> </template> -->
<template #column-price2="{ row }"> <template #column-price2="{ row }">
<!-- <QTd <QTd
class="col" class="col"
align="center" align="center"
:class="[conditionalValuePrice(value)]" :class="[conditionalValuePrice(row.price2)]"
> --> >
<QTooltip> <QTooltip>
{{ toCurrency(row.price2) }} {{ toCurrency(row.price2) }}
</QTooltip> </QTooltip>
{{ toCurrency(row.price2) }} {{ toCurrency(row.price2) }}
<!-- </QTd> --> </QTd>
</template> </template>
<template #column-difference="{ row }"> <template #column-difference="{ row }">
<pre>{{ row.difference }}</pre> <!-- <pre>asdad{{ row }}</pre> -->
<!-- <QTd class="col" align="left"> --> <!-- <QTd class="col" align="left"> -->
<!-- <VnStockValueDisplay :value="value" /> --> <VnStockValueDisplay :value="row.id % 2 === 0 ? 10 : -10" />
<!-- </QTd> --> <!-- </QTd> -->
</template> </template>
</VnTable> </VnTable>
</div> </div>
</QCardSection> <!-- </QCardSection>
</QCard> </QCard> -->
</QPopupProxy> <!-- </QPopupProxy> -->
</template> </template>
<style lang="scss"> <style lang="scss">
.compatibility { .compatibility {

View File

@ -0,0 +1,30 @@
<script setup>
import ItemProposal from './ItemProposal.vue';
const $props = defineProps({
item: {
type: Object,
required: true,
default: () => {},
},
itemLack: {
type: Object,
required: true,
default: () => {},
},
replaceAction: {
type: Boolean,
required: false,
default: false,
},
tickets: {
type: Array,
required: false,
default: () => [],
},
});
</script>
<template>
<QPopupProxy>
<ItemProposal v-bind="$props"></ItemProposal>
</QPopupProxy>
</template>

View File

@ -18,6 +18,7 @@ import { useRoute } from 'vue-router';
import { useArrayData } from 'src/composables/useArrayData'; import { useArrayData } from 'src/composables/useArrayData';
import VnImg from 'src/components/ui/VnImg.vue'; import VnImg from 'src/components/ui/VnImg.vue';
import TicketLackTable from './TicketLackTable.vue'; import TicketLackTable from './TicketLackTable.vue';
import ItemProposalProxy from 'src/pages/Item/components/ItemProposalProxy.vue';
const { t } = useI18n(); const { t } = useI18n();
const URL_KEY = 'Tickets/ItemLack'; const URL_KEY = 'Tickets/ItemLack';
const editableStates = ref([]); const editableStates = ref([]);
@ -199,14 +200,14 @@ const replaceItem = () => {
</QBtn> </QBtn>
<QBtn color="primary" @click="showProposalDialog = true"> <QBtn color="primary" @click="showProposalDialog = true">
<QIcon name="import_export" class="rotate-90"></QIcon> <QIcon name="import_export" class="rotate-90"></QIcon>
<ItemProposal <ItemProposalProxy
ref="proposalDialogRef" ref="proposalDialogRef"
:item="item" :item="item"
:item-lack="itemLack" :item-lack="itemLack"
:replace-action="true" :replace-action="true"
:tickets="selectedRows" :tickets="selectedRows"
@refresh-data="itemProposalEvt" @refresh-data="itemProposalEvt"
></ItemProposal> ></ItemProposalProxy>
<QTooltip bottom anchor="bottom right"> <QTooltip bottom anchor="bottom right">
{{ t('itemProposal') }} {{ t('itemProposal') }}
</QTooltip> </QTooltip>