| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <el-button v-if="dataValue.isEdit" |
| | | type="primary" |
| | | @click="addItem" |
| | | style="margin-bottom: 10px">添加 |
| | | </el-button> |
| | | <el-button v-if="!dataValue.isEdit" |
| | | type="primary" |
| | | @click="dataValue.isEdit = true" |
| | | style="margin-bottom: 10px">编辑 |
| | | </el-button> |
| | | <el-button v-if="dataValue.isEdit" |
| | | type="primary" |
| | | @click="cancelEdit" |
| | | style="margin-bottom: 10px">取消 |
| | | </el-button> |
| | | <el-button type="primary" |
| | | :loading="dataValue.loading" |
| | | @click="submit" |
| | | :disabled="!dataValue.isEdit" |
| | | style="margin-bottom: 10px">确认 |
| | | </el-button> |
| | | <PageHeader content="产品结构详情"> |
| | | <template #right-button> |
| | | <el-button v-if="dataValue.isEdit && !isOrderPage" |
| | | type="primary" |
| | | @click="addItem">添加 |
| | | </el-button> |
| | | <el-button v-if="!dataValue.isEdit && !isOrderPage" |
| | | type="primary" |
| | | @click="dataValue.isEdit = true">编辑 |
| | | </el-button> |
| | | <el-button v-if="dataValue.isEdit && !isOrderPage" |
| | | type="primary" |
| | | @click="cancelEdit">取消 |
| | | </el-button> |
| | | <el-button v-if="!isOrderPage" |
| | | type="primary" |
| | | :loading="dataValue.loading" |
| | | @click="submit" |
| | | :disabled="!dataValue.isEdit">确认 |
| | | </el-button> |
| | | </template> |
| | | </PageHeader> |
| | | <el-table |
| | | :data="tableData" |
| | | border |
| | | :preserve-expanded-content="false" |
| | | :default-expand-all="true" |
| | | style="width: 100%" |
| | | > |
| | | <el-table-column type="expand"> |
| | |
| | | </el-form-item> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="demandedQuantity" |
| | | <el-table-column v-if="isOrderPage" |
| | | prop="demandedQuantity" |
| | | label="需求总量"> |
| | | <template #default="{ row, $index }"> |
| | | <el-form-item :prop="`dataList.${$index}.demandedQuantity`" |
| | |
| | | </el-form-item> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="diskQuantity" |
| | | label="盘数(盘)"> |
| | | <template #default="{ row, $index }"> |
| | | <el-form-item :prop="`dataList.${$index}.diskQuantity`" |
| | | :rules="[{ required: true, message: '请输入盘数', trigger: ['blur','change'] }]" |
| | | style="margin: 0"> |
| | | <el-input-number v-model="row.diskQuantity" |
| | | :min="0" |
| | | :precision="0" |
| | | :step="1" |
| | | controls-position="right" |
| | | style="width: 100%" |
| | | :disabled="!dataValue.isEdit" /> |
| | | </el-form-item> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" fixed="right" width="100"> |
| | | <template #default="{ row, $index }"> |
| | | <el-button type="danger" |
| | | <el-button v-if="dataValue.isEdit" |
| | | type="danger" |
| | | text |
| | | @click="dataValue.dataList.splice($index, 1)">删除 |
| | | </el-button> |
| | |
| | | </el-form> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="产品编码" prop="productCode" /> |
| | | <el-table-column label="BOM编号" prop="bomNo" /> |
| | | <el-table-column label="产品名称" prop="productName" /> |
| | | <el-table-column label="规格型号" prop="model" /> |
| | | <el-table-column label="单位" prop="unit" /> |
| | | </el-table> |
| | | |
| | | <product-select-dialog v-if="dataValue.showProductDialog" |
| | |
| | | ref, |
| | | } from "vue"; |
| | | import { queryList, add } from "@/api/productionManagement/productStructure.js"; |
| | | import { listProcessBom } from "@/api/productionManagement/productionOrder.js"; |
| | | import { list } from "@/api/productionManagement/productionProcess"; |
| | | import { ElMessage } from "element-plus"; |
| | | import {useRoute, useRouter} from "vue-router"; |
| | |
| | | } |
| | | }); |
| | | |
| | | // 从路由参数获取产品信息 |
| | | const routeBomNo = computed(() => route.query.bomNo || ''); |
| | | const routeProductName = computed(() => route.query.productName || ''); |
| | | const routeProductModelName = computed(() => route.query.productModelName || ''); |
| | | const routeOrderId = computed(() => route.query.orderId); |
| | | const pageType = computed(() => route.query.type); |
| | | const isOrderPage = computed(() => pageType.value === 'order' && routeOrderId.value); |
| | | |
| | | const dataValue = reactive({ |
| | | dataList: [], |
| | |
| | | { |
| | | productName: "", |
| | | model: "", |
| | | unit: "", |
| | | productCode: "", |
| | | bomNo: "", |
| | | } |
| | | ]) |
| | | |
| | |
| | | }; |
| | | |
| | | const fetchData = async () => { |
| | | const { data } = await queryList(routeId.value); |
| | | tableData[0].productName = data.productName; |
| | | tableData[0].model = data.model; |
| | | tableData[0].unit = data.unit; |
| | | tableData[0].productCode = data.productCode; |
| | | dataValue.dataList = data.productStructureList; |
| | | if (isOrderPage.value) { |
| | | // 订单情况:使用订单的产品结构接口 |
| | | const { data } = await listProcessBom({ orderId: routeOrderId.value }); |
| | | dataValue.dataList = data || []; |
| | | } else { |
| | | // 非订单情况:使用原来的接口 |
| | | const { data } = await queryList(routeId.value); |
| | | dataValue.dataList = data || []; |
| | | } |
| | | }; |
| | | |
| | | const fetchProcessOptions = async () => { |
| | |
| | | row[0].productName; |
| | | dataValue.dataList[dataValue.currentRowIndex].model = row[0].model; |
| | | dataValue.dataList[dataValue.currentRowIndex].productModelId = row[0].id; |
| | | dataValue.dataList[dataValue.currentRowIndex].unit = row[0].unit || ""; |
| | | dataValue.showProductDialog = false; |
| | | }; |
| | | |
| | |
| | | dataValue.loading = true; |
| | | if (valid) { |
| | | add({ |
| | | parentId: routeId.value, |
| | | bomId: routeId.value, |
| | | productStructureList: dataValue.dataList || [], |
| | | }).then(res => { |
| | | router.push({ |
| | |
| | | unitQuantity: 0, |
| | | demandedQuantity: 0, |
| | | unit: "", |
| | | diskQuantity: 0, |
| | | }); |
| | | }; |
| | | |
| | |
| | | }; |
| | | |
| | | onMounted(() => { |
| | | // 从路由参数回显数据 |
| | | tableData[0].productName = routeProductName.value; |
| | | tableData[0].model = routeProductModelName.value; |
| | | tableData[0].bomNo = routeBomNo.value; |
| | | |
| | | // 订单情况下禁用编辑 |
| | | if (isOrderPage.value) { |
| | | dataValue.isEdit = false; |
| | | } |
| | | |
| | | fetchData(); |
| | | fetchProcessOptions(); |
| | | }); |