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

feat: refs #6321 itemProposal tags

This commit is contained in:
Javier Segarra 2025-01-26 02:35:59 +01:00
parent 0a4da26d3d
commit dea3535ad4
2 changed files with 149 additions and 196 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

77
src/pages/Item/components/ItemProposal.vue
View File

@ -166,7 +166,14 @@ const columns = computed(() => [
// ],
// },
]);
const isSelected = (row) => proposalSelected.value.some((item) => row.id === item.id);
function change(row) {
if (isSelected(row)) {
confirm(row);
proposalSelected.value = [];
}
proposalSelected.value = [row];
}
async function confirm(row) {
try {
// const params = {
@ -223,8 +230,8 @@ const isSelectionAvailable = (itemProposal) => {
// watch(proposalSelected, ({ available }) => (quantity.value = available));
</script>
<template>
<div style="min-width: 65vw">
<VnTable
data-cy="proposalTable"
ref="proposalTableRef"
data-key="ItemsGetSimilar"
url="Items/getSimilar"
@ -237,7 +244,6 @@ const isSelectionAvailable = (itemProposal) => {
auto-load
:columns="columns"
class="full-width q-mt-md"
v-model:selected="proposalSelected"
row-key="id"
:is-editable="false"
:right-search="false"
@ -266,9 +272,8 @@ const isSelectionAvailable = (itemProposal) => {
</template>
<template #column-longName="{ row }">
<QTd
class="flex"
style="
max-width: 100%;
display: flex;
max-width: 100%;
/* align-items: center; */
/* justify-content: flex-start; */
@ -282,11 +287,15 @@ const isSelectionAvailable = (itemProposal) => {
</QTooltip>
<!-- <QBtn flat color="blue" dense>{{ }}</QBtn> -->
<QBtn
data-cy="replaceBtn"
icon="change_circle"
color="primary"
flat
dense
@click="confirm(row)"
:class="{
'fill-icon': isSelected(row),
}"
@click="change(row)"
:disable="!isSelectionAvailable(row)"
>
<QTooltip> {{ t('Open_details') }}</QTooltip>
@ -317,23 +326,12 @@ const isSelectionAvailable = (itemProposal) => {
color: gradientStyle(statusConditionalValue(row)),
}" -->
<ItemDescriptorProxy :id="row.id" />
<!-- <section id="portraitGrid"> -->
<!-- -->
<!-- <div id="left">
<VnImg
:id="row.id"
spinner-color="primary"
:ratio="1"
width="50px"
class="image remove-bg"
/>
</div> -->
<!-- <FetchedTags :item="row" class="q-mb-xs" columns="4" /> -->
</div>
<div :key="key" class="inline-tag" v-for="(tag, key) in [5]">
<div class="inline-tag">
{{ tag }}
<span
:key="key"
v-for="(tag, key) in [5, 6, 7]"
class="text"
:style="{
color: row[`match${tag}`]
@ -368,14 +366,7 @@ const isSelectionAvailable = (itemProposal) => {
</div>
</template> -->
<template #column-price2="{ row }">
<div
style="
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
"
>
<div class="flex column items-center content-center">
<VnStockValueDisplay :value="sales[0].price - row.price2" />
<span :class="[conditionalValuePrice(row.price2)]">{{
toCurrency(row.price2)
@ -386,9 +377,8 @@ const isSelectionAvailable = (itemProposal) => {
<VnStockValueDisplay :value="sales[0].price - row.price2" />
</template>
</VnTable>
</div>
</template>
<style lang="scss">
<style lang="scss" scoped>
.compatibility {
width: 100%;
}
@ -399,21 +389,14 @@ const isSelectionAvailable = (itemProposal) => {
.not-match {
color: inherit;
}
.calendars-header {
height: 45px;
display: flex;
justify-content: space-between;
align-items: center;
background-color: $primary;
font-weight: bold;
font-size: 16px;
}
#portraitGrid {
display: grid;
grid-template-columns: repeat(3, 0.5fr);
.text {
margin: 0.05rem;
padding: 1px;
border: 1px solid var(--vn-label-color);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: smaller;
}
</style>
<i18n>
en:
</i18n>

38
src/pages/Item/components/ItemProposalProxy.vue
View File

@ -1,19 +1,9 @@
<script setup>
import ItemProposal from './ItemProposal.vue';
import { ref } from 'vue';
const emit = defineEmits(['onDialogClosed', 'itemReplaced']);
const popupProxyRef = ref(null);
import { useDialogPluginComponent } from 'quasar';
const emit = defineEmits([
'onDialogClosed',
'itemReplaced',
'confirm',
'cancel',
...useDialogPluginComponent.emits,
]);
defineExpose({ show: () => dialogRef.value.show(), hide: () => dialogRef.value.hide() });
const { dialogRef, onDialogHide, onDialogOK, onDialogCancel } =
useDialogPluginComponent();
const $props = defineProps({
itemLack: {
type: Object,
@ -33,39 +23,19 @@ const $props = defineProps({
});
</script>
<template>
<QDialog
ref="dialogRef"
full-width
transition-show="scale"
transition-hide="scale"
persistent
>
<QPopupProxy ref="popupProxyRef" data-cy="itemProposalProxy">
<QCard>
<QCardSection class="row items-center q-pb-none">
<span class="text-h6 text-grey">{{ $t('Item proposal') }}</span>
<QSpace />
<QBtn icon="close" flat round dense v-close-popup />
</QCardSection>
<QCardSection>
<!-- <VnImg :id="itemLack.id" class="rounded image-wrapper"></VnImg>
<QBtn flat class="link text-blue">
{{ itemLack.longName }}
<ItemDescriptorProxy :id="itemLack.id" />
</QBtn>
<FetchedTags :item="itemLack" />
</QCardSection>
<QCardSection class="q-pt-none"> -->
<ItemProposal
v-bind="$props"
@item-replaced="
(data) => {
emit('itemReplaced', data);
popupProxyRef.value.hide();
popupProxyRef.hide();
}
"
></ItemProposal
></QCardSection>
</QCard>
</QDialog>
</QPopupProxy>
</template>