admingit/jewpms
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(style-edit): 更新vxe-table组件配置并优化保存逻辑

Browse Source 
将vxe-table的编辑模式从'cell'改为'row'，并更新了相关依赖版本。优化了保存逻辑，确保数据提交后自动刷新表格数据
This commit is contained in:
user 2025-04-15 23:17:40 +08:00
parent 21b7dd1621
commit 01074a91da
4 changed files with 46 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
package-lock.json generated
View File

@ -34,8 +34,8 @@
"vue-i18n": "11.1.0",
"vue-router": "4.5.0",
"vue-web-cam": "^1.9.0",
"vxe-pc-ui": "^4.4.21",
"vxe-table": "^4.11.28",
"vxe-pc-ui": "^4.5.22",
"vxe-table": "^4.13.3",
"xe-utils": "^3.7.4"
},
"devDependencies": {
@ -4365,9 +4365,9 @@
}
},
"node_modules/@vxe-ui/core": {
"version": "4.0.38",
"resolved": "https://registry.npmmirror.com/@vxe-ui/core/-/core-4.0.38.tgz",
"integrity": "sha512-zQHcYUUsMUiDNi5buxP9AIz9Ru2BK5JXkKmtGZ5gjdr/nF8Nm/jcMcAdZXDmYAryn1BLka+ZTq83G++HkfWdBg==",
"version": "4.0.39",
"resolved": "https://registry.npmmirror.com/@vxe-ui/core/-/core-4.0.39.tgz",
"integrity": "sha512-7lRfmnh6fAjbuKxQ1NcJVQ4Z8bXDYHtnTrzvUGREf3CsXu/PzUoyArHhOJH6yRmiNBfk29CCqVhiRsv4ngSViQ==",
"license": "MIT",
"dependencies": {
"dom-zindex": "^1.0.6",
@ -13811,21 +13811,21 @@
}
},
"node_modules/vxe-pc-ui": {
"version": "4.4.21",
"resolved": "https://registry.npmmirror.com/vxe-pc-ui/-/vxe-pc-ui-4.4.21.tgz",
"integrity": "sha512-g877IT/oXQH4MCnLEh+YZU0xQ+952X3OqktuQkuvQeqv+UgIQyK6eODiNAp9JdFhEcZPzfoUZMjjZt9eXpeqBg==",
"version": "4.5.22",
"resolved": "https://registry.npmmirror.com/vxe-pc-ui/-/vxe-pc-ui-4.5.22.tgz",
"integrity": "sha512-SfVFZsqZch7vY8uf0Tx31n0emWdLVAB1CXpsl/58uoGfw2QWS2CaDVPWqP3E06lYeH8q+DkcBfYoXyXR1VkkgA==",
"license": "MIT",
"dependencies": {
"@vxe-ui/core": "^4.0.38"
"@vxe-ui/core": "^4.0.39"
}
},
"node_modules/vxe-table": {
"version": "4.11.28",
"resolved": "https://registry.npmmirror.com/vxe-table/-/vxe-table-4.11.28.tgz",
"integrity": "sha512-kp6qEAqVuMK1QinLK4xoPPzwAKZVEokYVLLJY3r+X7dtvRSi4c2YOJ7gdBZ9TJX1DDKmTYPZI9r4IR/MUoIaaA==",
"version": "4.13.3",
"resolved": "https://registry.npmmirror.com/vxe-table/-/vxe-table-4.13.3.tgz",
"integrity": "sha512-tc7EQ/YKSZcv4gVbGObbYws9a/Ium+u+8dkrcv1oKyur9wL9aRtG04/MIjuvhrgw1H+I0YgsjttT3j6mTdNR3g==",
"license": "MIT",
"dependencies": {
"vxe-pc-ui": "^4.4.19"
"vxe-pc-ui": "^4.5.22"
}
},
"node_modules/wait-on": {

4
package.json
View File

@ -102,8 +102,8 @@
"vue-i18n": "11.1.0",
"vue-router": "4.5.0",
"vue-web-cam": "^1.9.0",
"vxe-pc-ui": "^4.4.21",
"vxe-table": "^4.11.28",
"vxe-pc-ui": "^4.5.22",
"vxe-table": "^4.13.3",
"xe-utils": "^3.7.4"
},
"devDependencies": {

57
src/main/webapp/app/orders/style/style-edit.component.ts
View File

@ -63,18 +63,18 @@ export default defineComponent({
{
field: 'process',
title: 'jewpmsApp.style.base.process',
editRender: { name: 'select', options: processTypes, optionProps: { value: 'number', label: 'name' } },
editRender: { name: 'VxeSelect', options: processTypes, optionProps: { value: 'number', label: 'name' } },
},
{ field: 'material', title: 'jewpmsApp.style.base.material', editRender: { name: 'input', autoSelect: true } },
{ field: 'setGroup', title: 'jewpmsApp.style.base.setGroup', editRender: { name: 'input' } },
{ field: 'quantity', title: 'jewpmsApp.style.base.quantity', editRender: { name: 'input', props: { type: 'number' } } },
{ field: 'weight', title: 'jewpmsApp.style.base.weight', editRender: { name: 'input', props: { type: 'number' } } },
{ field: 'custPrice', title: 'jewpmsApp.style.base.custPrice', editRender: { name: 'input', props: { type: 'number' } } },
{ field: 'costPrice', title: 'jewpmsApp.style.base.costPrice', editRender: { name: 'input', props: { type: 'number' } } },
{ field: 'custLabor', title: 'jewpmsApp.style.base.custLabor', editRender: { name: 'input', props: { type: 'number' } } },
{ field: 'costLabor', title: 'jewpmsApp.style.base.costLabor', editRender: { name: 'input', props: { type: 'number' } } },
{ field: 'unitHour', title: 'jewpmsApp.style.base.unitHour', editRender: { name: 'input', props: { type: 'number' } } },
{ field: 'remark', title: 'jewpmsApp.style.base.remark', editRender: { name: 'input' } },
{ field: 'material', title: 'jewpmsApp.style.base.material', editRender: { name: 'VxeInput', immediate: true, autoselect: true } },
{ field: 'setGroup', title: 'jewpmsApp.style.base.setGroup', editRender: { name: 'VxeInput', immediate: true, autoselect: true } },
{ field: 'quantity', title: 'jewpmsApp.style.base.quantity', editRender: { name: 'VxeNumberInput', autoselect: true } },
{ field: 'weight', title: 'jewpmsApp.style.base.weight', editRender: { name: 'VxeNumberInput', autoselect: true } },
{ field: 'custPrice', title: 'jewpmsApp.style.base.custPrice', editRender: { name: 'VxeNumberInput', autoselect: true } },
{ field: 'costPrice', title: 'jewpmsApp.style.base.costPrice', editRender: { name: 'VxeNumberInput', autoselect: true } },
{ field: 'custLabor', title: 'jewpmsApp.style.base.custLabor', editRender: { name: 'VxeNumberInput', autoselect: true } },
{ field: 'costLabor', title: 'jewpmsApp.style.base.costLabor', editRender: { name: 'VxeNumberInput', autoselect: true } },
{ field: 'unitHour', title: 'jewpmsApp.style.base.unitHour', editRender: { name: 'VxeNumberInput', autoselect: true } },
{ field: 'remark', title: 'jewpmsApp.style.base.remark', editRender: { name: 'VxeInput', immediate: true, autoselect: true } },
{ title: 'entity.action.actions', width: 100 },
];
@ -84,18 +84,18 @@ export default defineComponent({
{
field: 'process',
title: 'jewpmsApp.style.setting.process',
editRender: { name: 'select', options: settingTypes, optionProps: { value: 'number', label: 'name' } },
editRender: { name: 'VxeSelect', options: settingTypes, optionProps: { value: 'number', label: 'name' } },
},
{ field: 'material', title: 'jewpmsApp.style.setting.material', editRender: { name: 'input', autoSelect: true } },
{ field: 'setGroup', title: 'jewpmsApp.style.setting.setGroup', editRender: { name: 'input' } },
{ field: 'quantity', title: 'jewpmsApp.style.setting.quantity', editRender: { name: 'input', props: { type: 'number' } } },
{ field: 'weight', title: 'jewpmsApp.style.setting.weight', editRender: { name: 'input', props: { type: 'number' } } },
{ field: 'custPrice', title: 'jewpmsApp.style.setting.custPrice', editRender: { name: 'input', props: { type: 'number' } } },
{ field: 'costPrice', title: 'jewpmsApp.style.setting.costPrice', editRender: { name: 'input', props: { type: 'number' } } },
{ field: 'custLabor', title: 'jewpmsApp.style.setting.custLabor', editRender: { name: 'input', props: { type: 'number' } } },
{ field: 'costLabor', title: 'jewpmsApp.style.setting.costLabor', editRender: { name: 'input', props: { type: 'number' } } },
{ field: 'unitHour', title: 'jewpmsApp.style.setting.unitHour', editRender: { name: 'input', props: { type: 'number' } } },
{ field: 'remark', title: 'jewpmsApp.style.setting.remark', editRender: { name: 'input' } },
{ field: 'material', title: 'jewpmsApp.style.setting.material', editRender: { name: 'input', immediate: true, autoselect: true } },
{ field: 'setGroup', title: 'jewpmsApp.style.setting.setGroup', editRender: { name: 'input', immediate: true, autoselect: true } },
{ field: 'quantity', title: 'jewpmsApp.style.setting.quantity', editRender: { name: 'VxeNumberInput', autoselect: true } },
{ field: 'weight', title: 'jewpmsApp.style.setting.weight', editRender: { name: 'VxeNumberInput', autoselect: true } },
{ field: 'custPrice', title: 'jewpmsApp.style.setting.custPrice', editRender: { name: 'VxeNumberInput', autoselect: true } },
{ field: 'costPrice', title: 'jewpmsApp.style.setting.costPrice', editRender: { name: 'VxeNumberInput', autoselect: true } },
{ field: 'custLabor', title: 'jewpmsApp.style.setting.custLabor', editRender: { name: 'VxeNumberInput', autoselect: true } },
{ field: 'costLabor', title: 'jewpmsApp.style.setting.costLabor', editRender: { name: 'VxeNumberInput', autoselect: true } },
{ field: 'unitHour', title: 'jewpmsApp.style.setting.unitHour', editRender: { name: 'VxeNumberInput', autoselect: true } },
{ field: 'remark', title: 'jewpmsApp.style.setting.remark', editRender: { name: 'input', immediate: true, autoselect: true } },
{ title: 'entity.action.actions', width: 100 },
];
@ -315,18 +315,19 @@ export default defineComponent({
const saveDtlEvent = async row => {
try {
// 保存行数据到数据库
console.log(row);
await axios.put(`api/styledtls/${row.id}`, row);
// 提交编辑状态
let $table = baseRef.value;
if (activeTab.value === 'setting') $table = settingRef.value;
if ($table) {
await $table.clearEdit();
$table.clearEdit().then(() => {
axios.put(`api/styledtls/${row.id}`, row);
setTimeout(() => {
// 刷新数据
loadStyleDtls();
}, 300);
});
}
alertService.showInfo(t$('jewpmsApp.style.updated', { param: row.name || row.process }));
// 刷新数据
await loadStyleDtls();
} catch (e) {
alertService.showHttpError(e);
}

7
src/main/webapp/app/orders/style/style-edit.vue
View File

@ -135,7 +135,7 @@
:data="baseDtls"
stripe
keepSource
:edit-config="{ trigger: 'manual', mode: 'cell', autoClear: false, showStatus: true }"
:edit-config="{ trigger: 'manual', mode: 'row', autoClear: false, showStatus: true }"
>
<vxe-column type="seq" width="50"></vxe-column>
<vxe-column
@ -150,9 +150,6 @@
<template #default="{ row }" v-if="column.field === 'process'">
{{ processTypes.find(s => s.number === String(row.process))?.name || row.process }}
</template>
<template #edit="{ row }" v-if="column.field === 'material'">
<vxe-input v-model="row.material" type="text"></vxe-input>
</template>
<template #header="{ column }" v-if="column.title === 'entity.action.actions'">
<span class="vxe-button">{{ column.title }}</span>
<vxe-button class="btn-circle text-success" icon="vxe-icon-square-plus-square" @click="addDtlEvent"></vxe-button>
@ -179,7 +176,7 @@
:data="settingDtls"
stripe
keepSource
:edit-config="{ trigger: 'manual', mode: 'cell', autoClear: false, showStatus: true }"
:edit-config="{ trigger: 'manual', mode: 'row', autoClear: false, showStatus: true }"
>
<vxe-column type="seq" width="50"></vxe-column>
<vxe-column