jonhon-mes-web/src/views/productionManagement/components/addDialog.vue

<template>
  <el-dialog
    title="详情"
    append-to-body
    :modelValue="addDialog"
    width="90%"
    @close="closeDialog"
    @open="open"
  >
    <el-descriptions :column="4" border title="物料需求信息" :label-width="150">
      <el-descriptions-item label="作业中心">{{
        addForm.bsWorkCenter?.wcName
      }}</el-descriptions-item>
      <el-descriptions-item label="建立人员">{{ addForm.createUser }}</el-descriptions-item>
      <el-descriptions-item label="建立时间">{{ addForm.createTime }}</el-descriptions-item>

      <el-descriptions-item label="物料编码">{{ addForm.goodsCode }}</el-descriptions-item>
      <el-descriptions-item label="班组实际消耗(克)">{{
        addForm.teamActualConsumption
      }}</el-descriptions-item>
      <el-descriptions-item label="班组预添加(克)">{{
        addForm.teamPreAddGram
      }}</el-descriptions-item>
      <el-descriptions-item label="物料名称">{{ addForm.goodsName }}</el-descriptions-item>
      <el-descriptions-item label="可使用定额(克)">{{
        addForm.usableQuotaGram
      }}</el-descriptions-item>
      <el-descriptions-item label="累计结余(克)">{{
        addForm.accumulatedBalanceGram
      }}</el-descriptions-item>
      <el-descriptions-item label="本次添加涉及单号">{{
        addForm.involveCode
      }}</el-descriptions-item>
      <el-descriptions-item label="本次剩余单号余量">{{
        addForm.involveCode
      }}</el-descriptions-item>
    </el-descriptions>
    <el-descriptions
      class="margin-top"
      :column="4"
      border
      title="审批信息"
      v-if="addForm.bsWorkCenter"
    >
    <template v-for="(item,index) in addForm.bsWorkCenter" :key="index">
      <el-descriptions-item label="审批人">{{
        item.approvalMan
      }}</el-descriptions-item>
      <el-descriptions-item label="审批时间">{{
        item.approvalTime
      }}</el-descriptions-item>
      <el-descriptions-item label="审批结果">{{
        item.approvalStatus
      }}</el-descriptions-item>
      <el-descriptions-item label="审批意见">{{
        item.approvalMemo
      }}</el-descriptions-item>
      </template> 
    </el-descriptions>
    <el-descriptions class="margin-top" :column="4" border title="订单信息"> </el-descriptions>
    <el-table :data="tableData">
      <el-table-column label="槽号" prop="slot" align="center"></el-table-column>
      <el-table-column label="化验值" prop="testVal" align="center"></el-table-column>
      <el-table-column label="申报添加金钾(克)" prop="saveGoldVal" align="center"></el-table-column>
      <el-table-column
        label="申报添加银钾(克)"
        prop="saveSilverVal"
        align="center"
      ></el-table-column>
      <el-table-column label="理论值" prop="saveBoardVal" align="center"></el-table-column>
    </el-table>
  </el-dialog>
</template>

<script>
import { getOrderMoldPlanCaDeatils } from '@/api/productionManagement/addRequirements';
export default {
  props: {
    addDialog: {
      type: Boolean,
      default: false,
    },
    id: {
      type: String,
    },
  },
  data() {
    return {
      addForm: {},
      sumAvailable: '0.0',
      tableData: [],
    };
  },
  mounted() {},
  methods: {
    async open() {
      //接口暂无
      console.log(this.id, 'zz');
      try {
        const ref = await getOrderMoldPlanCaDeatils({ id: this.id });
        if (res.code == 200) {
          this.detailForm = res.data.detailForm;
          this.tableData = res.data.list;
        }
      } catch (err) {
        console.log(err);
      }
      this.addForm = {
        bsWorkCenter:[ {
          wcName: '电镀作业中心A区',
          approvalMan: '张三（车间主管）',
          approvalTimeFirst: '2025-12-01 09:30:25',
          approvalResultFirst: '通过',
          approvalOpinionFirst: '物料消耗数据核对无误，预添加量在定额范围内，同意审批',
          approverSecond: '李四（生产经理）',
          approvalTime: '2025-12-01 14:15:40',
          approvalMemo: '通过',
          approvalOpinionSecond: '同意车间主管意见，按计划执行物料添加',
          approvalStatus:""
        }],
        createUser: '王五（统计员）',
        createTime: '2025-11-30 16:20:10',
        goodsCode: 'WL-DJ-001-2025',
        teamActualConsumption: 1856.7,
        teamPreAddGram: 2000.0,
        goodsName: '氰化金钾溶液（20%）',
        usableQuotaGram: 4500.5,
        accumulatedBalanceGram: 987.2,
        currentAddRelatedOrderNo: 'OD-202512001',
        currentRemainingOrderQuota: 1560.8,
      };
      this.tableData = [
        { slot: 5, testVal: 1.85, saveGoldVal: 0.0, saveSilverVal: 850.2, saveBoardVal: 848.5 },
        { slot: 6, testVal: 1.88, saveGoldVal: 0.0, saveSilverVal: 880.7, saveBoardVal: 879.2 },
        { slot: 7, testVal: 1.82, saveGoldVal: 0.0, saveSilverVal: 820.4, saveBoardVal: 819.0 },
        { slot: 8, testVal: 1.86, saveGoldVal: 0.0, saveSilverVal: 860.9, saveBoardVal: 859.3 },
      ];
    },
    closeDialog() {
      this.$emit('closeDialog');
    },
  },
};
</script>

<style lang="scss" scoped>
.margin-top {
  margin-top: 24px;
}

:deep(.is-bordered-content) {
  width: 280px;
}
</style>