| | |
| | | <div class="search_form"> |
| | | <el-form :model="searchForm" |
| | | :inline="true"> |
| | | <el-form-item label="客户名称:"> |
| | | <el-input v-model="searchForm.customerName" |
| | | placeholder="请输入" |
| | | clearable |
| | | prefix-icon="Search" |
| | | style="width: 160px;" |
| | | @change="handleQuery" /> |
| | | </el-form-item> |
| | | <el-form-item label="合同号:"> |
| | | <el-input v-model="searchForm.salesContractNo" |
| | | placeholder="请输入" |
| | | clearable |
| | | prefix-icon="Search" |
| | | style="width: 160px;" |
| | | @change="handleQuery" /> |
| | | </el-form-item> |
| | | <el-form-item label="产品名称:"> |
| | | <el-input v-model="searchForm.productCategory" |
| | | <el-input v-model="searchForm.productName" |
| | | placeholder="请输入" |
| | | clearable |
| | | prefix-icon="Search" |
| | |
| | | @change="handleQuery" /> |
| | | </el-form-item> |
| | | <el-form-item label="规格:"> |
| | | <el-input v-model="searchForm.specificationModel" |
| | | <el-input v-model="searchForm.model" |
| | | placeholder="请输入" |
| | | clearable |
| | | prefix-icon="Search" |
| | | style="width: 160px;" |
| | | @change="handleQuery" /> |
| | | </el-form-item> |
| | | <el-form-item label="状态:"> |
| | | <el-select v-model="searchForm.status" |
| | | placeholder="请选择" |
| | | style="width: 160px;" |
| | | @change="handleQuery"> |
| | | <el-option v-for="item in statusOptions" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" |
| | | @click="handleQuery">搜索</el-button> |
| | | <el-button type="primary" |
| | | @click="handleReset">重置</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | <div> |
| | | <el-button type="primary" @click="isShowNewModal = true">新增</el-button> |
| | | <el-button type="danger" @click="handleDelete">删除</el-button> |
| | | <el-button type="danger" |
| | | @click="handleDelete">退回</el-button> |
| | | <el-button @click="handleOut">导出</el-button> |
| | | </div> |
| | | </div> |
| | |
| | | :tableLoading="tableLoading" |
| | | :row-class-name="tableRowClassName" |
| | | :isSelection="true" |
| | | :selectable="row => row.status != 4" |
| | | @selection-change="handleSelectionChange" |
| | | @pagination="pagination"> |
| | | <template #completionStatus="{ row }"> |
| | | <el-progress |
| | | :percentage="toProgressPercentage(row?.completionStatus)" |
| | | :color="progressColor(toProgressPercentage(row?.completionStatus))" |
| | | :status="toProgressPercentage(row?.completionStatus) >= 100 ? 'success' : ''" |
| | | /> |
| | | <el-progress :percentage="toProgressPercentage(row?.completionStatus)" |
| | | :color="progressColor(toProgressPercentage(row?.completionStatus))" |
| | | :status="toProgressPercentage(row?.completionStatus) >= 100 ? 'success' : ''" /> |
| | | </template> |
| | | </PIMTable> |
| | | </div> |
| | |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | |
| | | <new-product-order v-if="isShowNewModal" |
| | | v-model:visible="isShowNewModal" |
| | | @completed="handleQuery" /> |
| | | v-model:visible="isShowNewModal" |
| | | @completed="handleQuery" /> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | import { ElMessageBox } from "element-plus"; |
| | | import dayjs from "dayjs"; |
| | | import { useRouter } from "vue-router"; |
| | | import { getDicts } from "@/api/system/dict/data"; |
| | | import { |
| | | productOrderListPage, |
| | | listProcessRoute, |
| | | bindingRoute, |
| | | listProcessBom, delProductOrder, |
| | | listProcessBom, |
| | | delProductOrder, |
| | | } from "@/api/productionManagement/productionOrder.js"; |
| | | import { listPage } from "@/api/productionManagement/processRoute.js"; |
| | | import { listMain as getOrderProcessRouteMain } from "@/api/productionManagement/productProcessRoute.js"; |
| | | import {fileDel} from "@/api/financialManagement/revenueManagement.js"; |
| | | import { fileDel } from "@/api/financialManagement/revenueManagement.js"; |
| | | import PIMTable from "@/components/PIMTable/PIMTable.vue"; |
| | | const NewProductOrder = defineAsyncComponent(() => import("@/views/productionManagement/productionOrder/New.vue")); |
| | | const NewProductOrder = defineAsyncComponent(() => |
| | | import("@/views/productionManagement/productionOrder/New.vue") |
| | | ); |
| | | |
| | | const { proxy } = getCurrentInstance(); |
| | | |
| | |
| | | |
| | | const tableColumn = ref([ |
| | | { |
| | | label: "状态", |
| | | prop: "status", |
| | | dataType: "tag", |
| | | |
| | | formatData: val => { |
| | | const statusMap = { |
| | | 1: "待开始", |
| | | 2: "进行中", |
| | | 3: "已完成", |
| | | 4: "已取消", |
| | | }; |
| | | return statusMap[val] || ""; |
| | | }, |
| | | formatType: val => { |
| | | const statusMap = { |
| | | 1: "error", |
| | | 2: "warning", |
| | | 3: "success", |
| | | 4: "info", |
| | | }; |
| | | return statusMap[val] || "info"; |
| | | }, |
| | | width: 100, |
| | | }, |
| | | { |
| | | label: "生产订单号", |
| | | prop: "npsNo", |
| | | width: '120px', |
| | | }, |
| | | { |
| | | label: "销售合同号", |
| | | prop: "salesContractNo", |
| | | width: '150px', |
| | | }, |
| | | { |
| | | label: "客户名称", |
| | | prop: "customerName", |
| | | width: '200px', |
| | | width: "120px", |
| | | }, |
| | | { |
| | | label: "产品名称", |
| | | prop: "productCategory", |
| | | width: '120px', |
| | | prop: "productName", |
| | | width: "120px", |
| | | }, |
| | | { |
| | | label: "规格", |
| | | prop: "specificationModel", |
| | | width: '120px', |
| | | prop: "model", |
| | | width: "120px", |
| | | }, |
| | | { |
| | | label: "物料编码", |
| | | prop: "materialCode", |
| | | width: "120px", |
| | | }, |
| | | { |
| | | label: "工艺路线编号", |
| | | prop: "processRouteCode", |
| | | width: '200px', |
| | | width: "200px", |
| | | }, |
| | | { |
| | | label: "需求数量", |
| | |
| | | }, |
| | | { |
| | | label: "交付日期", |
| | | prop: "deliveryDate", |
| | | prop: "planCompleteTime", |
| | | formatData: val => (val ? dayjs(val).format("YYYY-MM-DD") : ""), |
| | | width: 120, |
| | | }, |
| | | |
| | | { |
| | | dataType: "action", |
| | | label: "操作", |
| | | align: "center", |
| | | fixed: "right", |
| | | width: 200, |
| | | width: 300, |
| | | operation: [ |
| | | { |
| | | name: "来源", |
| | | type: "text", |
| | | clickFun: row => { |
| | | showSourceData(row); |
| | | }, |
| | | }, |
| | | { |
| | | name: "工艺路线", |
| | | type: "text", |
| | |
| | | { |
| | | name: "绑定工艺路线", |
| | | type: "text", |
| | | showHide: row => !row.processRouteCode, |
| | | showHide: row => !row.routeId, |
| | | clickFun: row => { |
| | | openBindRouteDialog(row); |
| | | }, |
| | | }, |
| | | { |
| | | name: "产品结构", |
| | | name: "删除", |
| | | type: "text", |
| | | showHide: row => row.status == 4, |
| | | clickFun: row => { |
| | | showProductStructure(row); |
| | | handleDeleteSolo(row); |
| | | }, |
| | | }, |
| | | // { |
| | | // name: "产品结构", |
| | | // type: "text", |
| | | // clickFun: row => { |
| | | // showProductStructure(row); |
| | | // }, |
| | | // }, |
| | | ], |
| | | }, |
| | | ]); |
| | |
| | | customerName: "", |
| | | salesContractNo: "", |
| | | projectName: "", |
| | | productCategory: "", |
| | | specificationModel: "", |
| | | productName: "", |
| | | model: "", |
| | | }, |
| | | }); |
| | | const { searchForm } = toRefs(data); |
| | |
| | | |
| | | // 添加表行类名方法 |
| | | const tableRowClassName = ({ row }) => { |
| | | if (!row.deliveryDate) return ''; |
| | | if (row.isFh) return ''; |
| | | |
| | | const diff = row.deliveryDaysDiff; |
| | | if (diff === 15) { |
| | | return 'yellow'; |
| | | } else if (diff === 10) { |
| | | return 'pink'; |
| | | } else if (diff === 2) { |
| | | return 'purple'; |
| | | } else if (diff < 2) { |
| | | return 'red'; |
| | | } |
| | | // if (!row.planCompleteTime) return ""; |
| | | // if (row.isFh) return ""; |
| | | // const diff = row.deliveryDaysDiff; |
| | | // if (diff === 15) { |
| | | // return "yellow"; |
| | | // } else if (diff === 10) { |
| | | // return "pink"; |
| | | // } else if (diff === 2) { |
| | | // return "purple"; |
| | | // } else if (diff < 2) { |
| | | // return "red"; |
| | | // } |
| | | }; |
| | | |
| | | // 绑定工艺路线弹框 |
| | |
| | | const bindRouteLoading = ref(false); |
| | | const bindRouteSaving = ref(false); |
| | | const routeOptions = ref([]); |
| | | const productTypeOptions = ref([]); |
| | | const bindForm = reactive({ |
| | | orderId: null, |
| | | routeId: null, |
| | |
| | | bindForm.routeId = null; |
| | | bindRouteDialogVisible.value = true; |
| | | routeOptions.value = []; |
| | | if (!row.productModelId) { |
| | | if (!row.model) { |
| | | proxy.$modal.msgWarning("当前订单缺少产品型号,无法查询工艺路线"); |
| | | bindRouteDialogVisible.value = false; |
| | | return; |
| | | } |
| | | bindRouteLoading.value = true; |
| | | const distName = |
| | | row.productName == "板材" |
| | | ? row.productName |
| | | : row.productName + "-" + row.strength; |
| | | |
| | | try { |
| | | const res = await listProcessRoute({ productModelId: row.productModelId }); |
| | | routeOptions.value = res.data || []; |
| | | // 获取产品类型字典 |
| | | const dictRes = await getDicts("product_type"); |
| | | if (dictRes.code === 200) { |
| | | productTypeOptions.value = dictRes.data; |
| | | // 用distName匹配dictLabel,获取dictCode |
| | | const matchedType = productTypeOptions.value.find( |
| | | item => item.dictLabel === distName |
| | | ); |
| | | const dictCode = matchedType ? matchedType.dictCode : row.productType; |
| | | |
| | | // 使用dictCode查询工艺路线列表 |
| | | const res = await listPage({ dictCode, status: true }); |
| | | routeOptions.value = res.data.records || []; |
| | | } |
| | | } catch (e) { |
| | | console.error("获取工艺路线列表失败:", e); |
| | | proxy.$modal.msgError("获取工艺路线列表失败"); |
| | |
| | | bindRouteSaving.value = false; |
| | | } |
| | | }; |
| | | |
| | | const statusOptions = ref([ |
| | | { value: 1, label: "待开始" }, |
| | | { value: 2, label: "进行中" }, |
| | | { value: 3, label: "已完成" }, |
| | | { value: 4, label: "已取消" }, |
| | | ]); |
| | | const handleReset = () => { |
| | | searchForm.value = { |
| | | customerName: "", |
| | | salesContractNo: "", |
| | | projectName: "", |
| | | productName: "", |
| | | model: "", |
| | | status: "", |
| | | }; |
| | | handleQuery(); |
| | | }; |
| | | // 查询列表 |
| | | /** 搜索按钮操作 */ |
| | | const handleQuery = () => { |
| | |
| | | const showRouteItemModal = async row => { |
| | | const orderId = row.id; |
| | | try { |
| | | const res = await getOrderProcessRouteMain(orderId); |
| | | const data = res.data || {}; |
| | | if (!data || !data.id) { |
| | | proxy.$modal.msgWarning("未找到关联的工艺路线"); |
| | | return; |
| | | } |
| | | router.push({ |
| | | path: "/productionManagement/processRouteItem", |
| | | query: { |
| | | id: data.id, |
| | | processRouteCode: data.processRouteCode || "", |
| | | productName: data.productName || "", |
| | | model: data.model || "", |
| | | bomNo: data.bomNo || "", |
| | | description: data.description || "", |
| | | orderId, |
| | | id: row.routeId, |
| | | processRouteCode: row.processRouteCode || "", |
| | | productName: row.productName || "", |
| | | model: row.model || "", |
| | | bomNo: row.bomNo || "", |
| | | bomId: row.bomId || "", |
| | | description: row.description || "", |
| | | dictLabel: |
| | | row.productName == "板材" |
| | | ? row.productName |
| | | : row.productName + "-" + row.strength, |
| | | orderId: row.id, |
| | | type: "order", |
| | | editable: true, |
| | | }, |
| | | }); |
| | | } catch (e) { |
| | |
| | | }; |
| | | |
| | | const showProductStructure = row => { |
| | | if (!row.processRouteCode) { |
| | | proxy.$modal.msgWarning("请先绑定工艺路线"); |
| | | return; |
| | | } |
| | | router.push({ |
| | | path: "/productionManagement/productStructureDetail", |
| | | query: { |
| | | id: row.id, |
| | | bomNo: row.bomNo || "", |
| | | productName: row.productCategory || "", |
| | | productModelName: row.specificationModel || "", |
| | | productName: row.productName || "", |
| | | productModelName: row.model || "", |
| | | orderId: row.id, |
| | | type: "order", |
| | | }, |
| | | }); |
| | | }; |
| | | |
| | | // 查看来源生产计划数据 |
| | | const showSourceData = row => { |
| | | // 这里需要根据实际的API和路由进行调整 |
| | | // 假设生产订单中有生产计划ID字段,比如productionPlanId |
| | | if (row.productionPlanId) { |
| | | // 跳转到生产计划详情页面 |
| | | router.push({ |
| | | path: "/productionManagement/productionPlan", |
| | | query: { |
| | | id: row.productionPlanId, |
| | | }, |
| | | }); |
| | | } else { |
| | | proxy.$modal.msgWarning("当前订单没有关联的生产计划"); |
| | | } |
| | | }; |
| | | |
| | | // 表格选择数据 |
| | | const handleSelectionChange = (selection) => { |
| | | const handleSelectionChange = selection => { |
| | | selectedRows.value = selection; |
| | | }; |
| | | const handleDeleteSolo = row => { |
| | | ElMessageBox.confirm("选中的内容将被退回,是否确认退回?", "导出", { |
| | | confirmButtonText: "确认", |
| | | cancelButtonText: "取消", |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | delProductOrder([row.id]).then(res => { |
| | | proxy.$modal.msgSuccess("删除成功"); |
| | | getList(); |
| | | }); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已取消"); |
| | | }); |
| | | }; |
| | | |
| | | const handleDelete = () => { |
| | | let ids = []; |
| | | if (selectedRows.value.length > 0) { |
| | | ids = selectedRows.value.map((item) => item.id); |
| | | ids = selectedRows.value.map(item => item.id); |
| | | } else { |
| | | proxy.$modal.msgWarning("请选择数据"); |
| | | return; |
| | | } |
| | | ElMessageBox.confirm("选中的内容将被删除,是否确认删除?", "导出", { |
| | | ElMessageBox.confirm("选中的内容将被退回,是否确认退回?", "导出", { |
| | | confirmButtonText: "确认", |
| | | cancelButtonText: "取消", |
| | | type: "warning", |
| | | }).then(() => { |
| | | delProductOrder(ids).then((res) => { |
| | | proxy.$modal.msgSuccess("删除成功"); |
| | | getList(); |
| | | }) |
| | | .then(() => { |
| | | delProductOrder(ids).then(res => { |
| | | proxy.$modal.msgSuccess("删除成功"); |
| | | getList(); |
| | | }); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已取消"); |
| | | }); |
| | | }).catch(() => { |
| | | proxy.$modal.msg("已取消"); |
| | | }); |
| | | }; |
| | | |
| | | // 导出 |
| | |
| | | type: "warning", |
| | | }) |
| | | .then(() => { |
| | | proxy.download("/productOrder/export", {...searchForm.value}, "生产订单.xlsx"); |
| | | proxy.download( |
| | | "/productOrder/export", |
| | | { ...searchForm.value }, |
| | | "生产订单.xlsx" |
| | | ); |
| | | }) |
| | | .catch(() => { |
| | | proxy.$modal.msg("已取消"); |
| | |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | | .search_form{ |
| | | align-items: start; |
| | | } |
| | | .search_form { |
| | | align-items: start; |
| | | } |
| | | |
| | | ::v-deep .yellow { |
| | | background-color: #FAF0DE; |
| | | } |
| | | ::v-deep .yellow { |
| | | background-color: #faf0de; |
| | | } |
| | | |
| | | ::v-deep .pink { |
| | | background-color: #FAE1DE; |
| | | } |
| | | ::v-deep .pink { |
| | | background-color: #fae1de; |
| | | } |
| | | |
| | | ::v-deep .red { |
| | | background-color: #f80202; |
| | | } |
| | | ::v-deep .red { |
| | | background-color: #f80202; |
| | | } |
| | | |
| | | ::v-deep .purple{ |
| | | background-color: #F4DEFA; |
| | | } |
| | | ::v-deep .purple { |
| | | background-color: #f4defa; |
| | | } |
| | | </style> |