明细计算,产品详情页

This commit is contained in:
朱昊天
2026-04-28 16:53:35 +08:00
parent 539889a346
commit fe13e952f2
18 changed files with 633 additions and 298 deletions

View File

@@ -61,14 +61,16 @@
<span v-else></span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="320" fixed="right">
<template #default="scope">
<el-button link type="primary" icon="Plus" @click="handleBom(scope.row)">配方</el-button>
<el-button link type="primary" icon="View" @click="handleDetail(scope.row)">详情</el-button>
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)">修改</el-button>
<el-button link type="primary" icon="Setting" @click="handleAddition(scope.row)">附加属性</el-button>
<el-button link type="primary" @click="handleLabor(scope.row)">工价</el-button>
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)">删除</el-button>
<div class="product-op-actions">
<el-button link type="primary" icon="View" @click="handleDetail(scope.row)">详情</el-button>
<el-button link type="primary" icon="Plus" @click="handleBom(scope.row)">配方</el-button>
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)">修改</el-button>
<el-button link type="primary" icon="Setting" @click="handleAddition(scope.row)">附加属性</el-button>
<el-button link type="primary" icon="Money" @click="handleLabor(scope.row)">工价</el-button>
<el-button link type="danger" icon="Delete" @click="handleDelete(scope.row)">删除</el-button>
</div>
</template>
</el-table-column>
</el-table>
@@ -238,8 +240,8 @@ import { useRouter } from 'vue-router';
import { listProduct, getProduct, delProduct, addProduct, updateProduct } from "@/api/mat/product";
import { listProductMaterialRelation } from "@/api/mat/productMaterialRelation";
import { getMaterial } from "@/api/mat/material";
import { listProductAddition, addProductAddition, updateProductAddition, delProductAddition } from "@/api/mat/productAddition";
import { listProductLabor, addProductLabor, updateProductLabor, delProductLabor } from "@/api/mat/productLabor";
import { listProductAddition, batchSaveProductAddition } from "@/api/mat/productAddition";
import { listProductLabor, batchSaveProductLabor } from "@/api/mat/productLabor";
import { listByIds, listOss } from "@/api/system/oss";
import bom from "@/views/mat/components/bom.vue";
import StickyDragContainer from "@/components/StickyDragContainer/index.vue";
@@ -672,41 +674,27 @@ function removeAdditionItem(index) {
}
function saveAdditions() {
// 过滤掉空的属性项
const validAdditions = additionList.value.filter(item => item.attrName && item.attrName.trim());
// 保存附加属性
validAdditions.forEach(item => {
const additionData = {
productId: currentProductId.value,
attrName: item.attrName.trim(),
attrValue: item.attrValue ? item.attrValue.trim() : ''
};
// 如果有addId则是更新操作
if (item.addId) {
additionData.addId = item.addId;
// 调用API更新附加属性
updateProductAddition(additionData).then(response => {
if (response.code === 200) {
proxy.$modal.msgSuccess('保存成功');
} else {
proxy.$modal.msgError('保存失败');
}
});
const items = (additionList.value || [])
.map(item => ({
addId: item?.addId,
attrName: item?.attrName ? String(item.attrName).trim() : '',
attrValue: item?.attrValue ? String(item.attrValue).trim() : ''
}))
.filter(item => item.attrName);
batchSaveProductAddition({
productId: currentProductId.value,
items
}).then(res => {
if (res.code === 200 && res.data) {
proxy.$modal.msgSuccess('保存成功');
additionOpen.value = false;
} else {
// 调用API新增附加属性
addProductAddition(additionData).then(response => {
if (response.code === 200) {
proxy.$modal.msgSuccess('保存成功');
} else {
proxy.$modal.msgError('保存失败');
}
});
proxy.$modal.msgError('保存失败');
}
}).catch(() => {
proxy.$modal.msgError('保存失败');
});
additionOpen.value = false;
}
function handleLabor(row) {
@@ -725,38 +713,28 @@ function addLaborItem() {
}
function removeLaborItem(index) {
const item = laborList.value[index];
if (item && item.laborId) {
delProductLabor(item.laborId).finally(() => {
laborList.value.splice(index, 1);
});
return;
}
laborList.value.splice(index, 1);
}
async function saveLabors() {
const valid = laborList.value
.map(item => ({
...item,
laborName: item.laborName ? String(item.laborName).trim() : ''
}))
.filter(item => item.laborName);
const tasks = valid.map(item => {
const data = {
laborId: item.laborId,
productId: currentProductId.value,
laborName: item.laborName,
laborPrice: item.laborPrice ?? 0
};
if (data.laborId) return updateProductLabor(data);
return addProductLabor(data);
});
try {
await Promise.all(tasks);
proxy.$modal.msgSuccess('保存成功');
const items = (laborList.value || [])
.map(item => ({
laborId: item?.laborId,
laborName: item?.laborName ? String(item.laborName).trim() : '',
laborPrice: item?.laborPrice ?? 0
}))
.filter(item => item.laborName);
const res = await batchSaveProductLabor({
productId: currentProductId.value,
items
});
if (res.code === 200 && res.data) {
proxy.$modal.msgSuccess('保存成功');
} else {
proxy.$modal.msgError('保存失败');
}
} catch (e) {
proxy.$modal.msgError('保存失败');
} finally {
@@ -787,4 +765,15 @@ getList();
:deep(.el-image-viewer__wrapper) {
z-index: 9999 !important;
}
.product-op-actions {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 4px 10px;
}
:deep(.product-op-actions .el-button + .el-button) {
margin-left: 0;
}
</style>