Refactoring premiss edit:

- fixed bug in mass edit, when editing single value
This commit is contained in:
Jan 2025-10-18 09:28:11 +02:00
parent 20fa52826a
commit 20ad15e4e4
4 changed files with 43 additions and 61 deletions

View file

@ -239,15 +239,17 @@ export default {
.edit-calculation-cell { .edit-calculation-cell {
flex: 1 1 auto; flex: 1 1 auto;
margin: 1.6rem 0; margin: 1.6rem 0;
padding: 0.8rem;
} }
.edit-calculation-empty { .edit-calculation-empty {
flex: 1 1 auto; flex: 1 1 auto;
margin: 1.6rem 0; margin: 1.6rem 0;
padding: 0.8rem;
} }
.copyable-cell { .copyable-cell {
padding: 0.8rem;
border-radius: 0.8rem; border-radius: 0.8rem;
} }

View file

@ -1,17 +1,14 @@
<template> <template>
<div class="container" :class="{ 'responsive': responsive }" @focusout="focusLost"> <div class="container" :class="{ 'responsive': responsive }" @focusout="focusLost">
<div class="field-group"> <div class="field-group" v-if="!hideDescription">
<div class="caption-column">Part number</div> <div class="caption-column">Part number</div>
<div class="input-column"> <div class="input-column">
<span>{{ partNumber }}</span> <span>{{ partNumber }}</span>
<modal :state="modalSelectMaterial" @close="closeEditModal">
<select-material :part-number="partNumber" @close="modalEditClick"/>
</modal>
</div> </div>
</div> </div>
<div class="field-group"> <div class="field-group" v-if="!hideDescription">
<div class="caption-column">Description</div> <div class="caption-column">Description</div>
<div class="input-column"> <div class="input-column">
<span>{{ description }}</span> <span>{{ description }}</span>
@ -83,7 +80,7 @@ export default {
type: String, type: String,
required: true, required: true,
}, },
openSelectDirect: { hideDescription: {
type: Boolean, type: Boolean,
default: false, default: false,
}, },
@ -100,11 +97,10 @@ export default {
}, },
data() { data() {
return { return {
modalSelectMaterial: false,
} }
}, },
created() { created() {
this.modalSelectMaterial = this.openSelectDirect;
}, },
methods: { methods: {
focusLost(event) { focusLost(event) {
@ -112,22 +108,6 @@ export default {
this.$emit('save', 'material'); this.$emit('save', 'material');
} }
}, },
closeEditModal() {
this.modalSelectMaterial = false;
if (this.openSelectDirect) {
this.$emit('close');
}
},
modalEditClick(data) {
this.modalSelectMaterial = false;
if (data.action === 'accept') {
this.selectedMaterial = data.material;
this.$emit('updateMaterial', data.material.id, data.updateMasterData ? 'updateMasterData' : 'keepMasterData');
} else if (this.openSelectDirect) {
this.$emit('close');
}
},
updateInputValue(inputRef, formattedValue) { updateInputValue(inputRef, formattedValue) {
this.$nextTick(() => { this.$nextTick(() => {
if (this.$refs[inputRef] && this.$refs[inputRef].value !== formattedValue) { if (this.$refs[inputRef] && this.$refs[inputRef].value !== formattedValue) {
@ -147,9 +127,6 @@ export default {
event.target.value = validatedPercent === null ? null : validatedPercent.toFixed(2); event.target.value = validatedPercent === null ? null : validatedPercent.toFixed(2);
}, },
activateEditMode() {
this.modalSelectMaterial = true;
},
async fetchHsCode(query) { async fetchHsCode(query) {
const hsCodeQuery = {searchTerm: query}; const hsCodeQuery = {searchTerm: query};
await this.customsStore.setQuery(hsCodeQuery); await this.customsStore.setQuery(hsCodeQuery);

View file

@ -84,6 +84,7 @@
v-model:unitCount="componentProps.unitCount" v-model:unitCount="componentProps.unitCount"
v-model:mixable="componentProps.mixable" v-model:mixable="componentProps.mixable"
v-model:stackable="componentProps.stackable" v-model:stackable="componentProps.stackable"
v-model:hideDescription="componentProps.hideDescription"
:responsive="false" :responsive="false"
@close="closeEditModalAction('cancel')" @close="closeEditModalAction('cancel')"
@ -193,7 +194,7 @@ export default {
modalType: null, modalType: null,
componentsData: { componentsData: {
price: {props: {price: 0, overSeaShare: 0, includeFcaFee: false}}, price: {props: {price: 0, overSeaShare: 0, includeFcaFee: false}},
material: {props: {partNumber: "", hsCode: "", tariffRate: 0.00, description: "", openSelectDirect: false}}, material: {props: {partNumber: "", hsCode: "", tariffRate: 0.00, description: "", hideDescription: false}},
packaging: { packaging: {
props: { props: {
length: 0, length: 0,
@ -248,7 +249,7 @@ export default {
openModal(type, ids, dataSource = -1, massEdit = true) { openModal(type, ids, dataSource = -1, massEdit = true) {
if (type !== 'destinations') if (type !== 'destinations')
this.fillData(type, dataSource) this.fillData(type, dataSource, massEdit)
else { else {
this.premiseEditStore.prepareDestinations(dataSource, ids, massEdit, true); this.premiseEditStore.prepareDestinations(dataSource, ids, massEdit, true);
} }
@ -287,13 +288,13 @@ export default {
this.fillData(this.modalType); this.fillData(this.modalType);
this.modalType = null; this.modalType = null;
}, },
fillData(type, id = -1) { fillData(type, id = -1, hideDescription = false) {
if (id === -1) { if (id === -1) {
// clear // clear
this.componentsData = { this.componentsData = {
price: {props: {price: null, overSeaShare: null, includeFcaFee: null}}, price: {props: {price: null, overSeaShare: null, includeFcaFee: null}},
material: {props: {partNumber: "", hsCode: "", tariffRate: null, description: null, openSelectDirect: true}}, material: {props: {partNumber: "", hsCode: "", tariffRate: null, description: null, hideDescription: hideDescription}},
packaging: { packaging: {
props: { props: {
length: null, length: null,
@ -322,21 +323,21 @@ export default {
this.componentsData.material.props = { this.componentsData.material.props = {
partNumber: premise.material.part_number, partNumber: premise.material.part_number,
hsCode: premise.material.hs_code ?? "", hsCode: premise.material.hs_code,
tariffRate: premise.tariff_rate ?? 0.00, tariffRate: premise.tariff_rate ?? 0.00,
description: premise.material.name ?? "", description: premise.material.name ?? "",
openSelectDirect: false hideDescription: hideDescription
} }
} else if (type === "packaging") { } else if (type === "packaging") {
this.componentsData.packaging.props = { this.componentsData.packaging.props = {
length: premise.handling_unit.length ?? 0, length: premise.handling_unit.length,
width: premise.handling_unit.width ?? 0, width: premise.handling_unit.width,
height: premise.handling_unit.height ?? 0, height: premise.handling_unit.height,
weight: premise.handling_unit.weight ?? 0, weight: premise.handling_unit.weight,
weightUnit: premise.handling_unit.weight_unit ?? "KG", weightUnit: premise.handling_unit.weight_unit ?? "KG",
dimensionUnit: premise.handling_unit.dimension_unit ?? "MM", dimensionUnit: premise.handling_unit.dimension_unit ?? "MM",
unitCount: premise.handling_unit.content_unit_count ?? 1, unitCount: premise.handling_unit.content_unit_count,
mixable: premise.is_mixable ?? true, mixable: premise.is_mixable ?? true,
stackable: premise.is_stackable ?? true stackable: premise.is_stackable ?? true
} }

View file

@ -264,7 +264,7 @@ export const usePremiseEditStore = defineStore('premiseEdit', {
}); });
this.premisses = updatedPremises; this.premisses = updatedPremises;
return await this.savePrice(ids); return await this.savePrice(ids, priceData);
}, },
async batchUpdateMaterial(ids, materialData) { async batchUpdateMaterial(ids, materialData) {
const updatedPremises = this.premisses.map(p => { const updatedPremises = this.premisses.map(p => {
@ -283,9 +283,11 @@ export const usePremiseEditStore = defineStore('premiseEdit', {
}); });
this.premisses = updatedPremises; this.premisses = updatedPremises;
return await this.saveMaterial(ids); return await this.saveMaterial(ids, materialData);
}, },
async batchUpdatePackaging(ids, packagingData) { async batchUpdatePackaging(ids, packagingData) {
const updatedPremises = this.premisses.map(p => { const updatedPremises = this.premisses.map(p => {
if (ids.includes(p.id)) { if (ids.includes(p.id)) {
return { return {
@ -308,7 +310,9 @@ export const usePremiseEditStore = defineStore('premiseEdit', {
}); });
this.premisses = updatedPremises; this.premisses = updatedPremises;
return await this.savePackaging(ids); logger.info("packaging data:", toRaw(packagingData), "update result", toRaw(updatedPremises));
return await this.savePackaging(ids, packagingData);
}, },
async startCalculation() { async startCalculation() {
@ -698,7 +702,7 @@ export const usePremiseEditStore = defineStore('premiseEdit', {
* Save * Save
*/ */
async savePrice(ids = null) { async savePrice(ids = null, priceData = null) {
let success = true; let success = true;
const toBeUpdated = this.premisses ? (ids ? (ids.map(id => this.premisses.find(p => String(p.id) === String(id)))) : (this.premisses.filter(p => p.selected))) : null; const toBeUpdated = this.premisses ? (ids ? (ids.map(id => this.premisses.find(p => String(p.id) === String(id)))) : (this.premisses.filter(p => p.selected))) : null;
@ -706,9 +710,9 @@ export const usePremiseEditStore = defineStore('premiseEdit', {
const body = { const body = {
premise_ids: toBeUpdated.map(p => p.id), premise_ids: toBeUpdated.map(p => p.id),
material_cost: toBeUpdated[0].material_cost, material_cost: priceData === null ? toBeUpdated[0].material_cost : priceData.material_cost,
oversea_share: toBeUpdated[0].oversea_share, oversea_share: priceData === null ? toBeUpdated[0].oversea_share : priceData.oversea_share,
is_fca_enabled: toBeUpdated[0].is_fca_enabled is_fca_enabled: priceData === null ? toBeUpdated[0].is_fca_enabled : priceData.includeFcaFee
}; };
await performRequest(this, 'POST', `${config.backendUrl}/calculation/price/`, body, false).catch(e => { await performRequest(this, 'POST', `${config.backendUrl}/calculation/price/`, body, false).catch(e => {
@ -717,32 +721,30 @@ export const usePremiseEditStore = defineStore('premiseEdit', {
return success; return success;
}, },
async savePackaging(ids = null) { async savePackaging(ids = null, packagingData = null) {
let success = true; let success = true;
const toBeUpdated = this.premisses ? (ids ? (ids.map(id => this.premisses.find(p => String(p.id) === String(id)))) : (this.premisses.filter(p => p.selected))) : null; const toBeUpdated = this.premisses ? (ids ? (ids.map(id => this.premisses.find(p => String(p.id) === String(id)))) : (this.premisses.filter(p => p.selected))) : null;
if (!toBeUpdated?.length) return; if (!toBeUpdated?.length) return;
logger.info(toBeUpdated[0]);
const body = { const body = {
premise_ids: toBeUpdated.map(p => p.id), premise_ids: toBeUpdated.map(p => p.id),
handling_unit: { handling_unit: {
weight: toBeUpdated[0].handling_unit.weight, weight: packagingData === null ? toBeUpdated[0].handling_unit.weight : packagingData.weight,
weight_unit: toBeUpdated[0].handling_unit.weight_unit, weight_unit: packagingData === null ? toBeUpdated[0].handling_unit.weight_unit : packagingData.weightUnit,
length: toBeUpdated[0].handling_unit.length, length: packagingData === null ? toBeUpdated[0].handling_unit.length : packagingData.length,
width: toBeUpdated[0].handling_unit.width, width: packagingData === null ? toBeUpdated[0].handling_unit.width : packagingData.width,
height: toBeUpdated[0].handling_unit.height, height: packagingData === null ? toBeUpdated[0].handling_unit.height : packagingData.height,
dimension_unit: toBeUpdated[0].handling_unit.dimension_unit, dimension_unit: packagingData === null ? toBeUpdated[0].handling_unit.dimension_unit : packagingData.dimensionUnit,
content_unit_count: toBeUpdated[0].handling_unit.content_unit_count, content_unit_count: packagingData === null ? toBeUpdated[0].handling_unit.content_unit_count : packagingData.unitCount,
}, },
is_mixable: toBeUpdated[0].is_mixable, is_mixable: packagingData === null ? toBeUpdated[0].is_mixable : packagingData.mixable,
is_stackable: toBeUpdated[0].is_stackable, is_stackable: packagingData === null ? toBeUpdated[0].is_stackable : packagingData.stackable,
}; };
@ -753,7 +755,7 @@ export const usePremiseEditStore = defineStore('premiseEdit', {
return success; return success;
}, },
async saveMaterial(ids = null) { async saveMaterial(ids = null, materialData = null) {
let success = true; let success = true;
const toBeUpdated = this.premisses ? (ids ? (ids.map(id => this.premisses.find(p => String(p.id) === String(id)))) : (this.premisses.filter(p => p.selected))) : null; const toBeUpdated = this.premisses ? (ids ? (ids.map(id => this.premisses.find(p => String(p.id) === String(id)))) : (this.premisses.filter(p => p.selected))) : null;
@ -763,8 +765,8 @@ export const usePremiseEditStore = defineStore('premiseEdit', {
const body = { const body = {
premise_ids: toBeUpdated.map(p => p.id), premise_ids: toBeUpdated.map(p => p.id),
hs_code: toBeUpdated[0].hs_code, hs_code: materialData === null ? toBeUpdated[0].hs_code : materialData.hsCode,
tariff_rate: toBeUpdated[0].tariff_rate, tariff_rate: materialData === null ? toBeUpdated[0].tariff_rate : materialData.tariffRate,
}; };
await performRequest(this, 'POST', `${config.backendUrl}/calculation/material/`, body, false).catch(() => { await performRequest(this, 'POST', `${config.backendUrl}/calculation/material/`, body, false).catch(() => {