kd-aiot-frontend-aps/src/views/saleOrder/components/orderHomogeneityInspectDialog.vue

<template>
  <div>
  <ele-modal
    width="80vw"
    :visible.sync="visible"
    :close-on-click-modal="false"
    row-key="code"
    custom-class="ele-dialog-form"
    :title="'齐套性检查'"
  >
    <div class="form-wrapper">
<!--      <el-form :model="requestData" label-width="0" :show-message="false">-->
<!--        <el-descriptions title="" :column="2" border>-->
<!--          <el-descriptions-item label="计划编号">-->
<!--            {{ formData.code }}</el-descriptions-item-->
<!--          >-->

<!--          <el-descriptions-item label="产品编码">{{-->
<!--            formData.productCode-->
<!--            }}</el-descriptions-item>-->

<!--          <el-descriptions-item label="产品名称">{{-->
<!--            formData.productName-->
<!--            }}</el-descriptions-item>-->

<!--          <el-descriptions-item label="牌号|型号">-->
<!--            {{ formData.brandNo }}|{{ formData.model }}</el-descriptions-item-->
<!--          >-->

<!--          <el-descriptions-item label="批次号">{{-->
<!--            formData.batchNo-->
<!--            }}</el-descriptions-item>-->

<!--          <el-descriptions-item label="工艺路线">{{-->
<!--            formData.produceRoutingName-->
<!--            }}</el-descriptions-item>-->

<!--          <el-descriptions-item label="要求生产数量">{{-->
<!--            formData.requiredFormingNum-->
<!--            }}</el-descriptions-item>-->
<!--          <el-descriptions-item label="要求完成日期">{{-->
<!--            formData.reqMoldTime-->
<!--            }}</el-descriptions-item>-->
<!--        </el-descriptions>-->
<!--      </el-form>-->

<!--      <headerTitle title="剩余拆批" class="mt20"> </headerTitle>-->
      <el-form ref="form" :model="form" :rules="rules">
<!--        <ele-pro-table-->
<!--          ref="table"-->
<!--          :needPage="false"-->
<!--          :columns="columns"-->
<!--          :datasource="form.surplusUnpack"-->
<!--        >-->
<!--          <template v-slot:toolbar>-->
<!--            <el-button-->
<!--              size="small"-->
<!--              type="primary"-->
<!--              icon="el-icon-plus"-->
<!--              class="ele-btn-icon"-->
<!--              :disabled="requiredFormingNum == 0 ? true : false"-->
<!--              @click="openUnpack"-->
<!--            >-->
<!--              拆批-->
<!--            </el-button>-->
<!--          </template>-->

<!--          <template v-slot:requiredFormingNum="scope">-->
<!--            <el-form-item-->
<!--              v-if="requiredFormingNum != 0"-->
<!--              :prop="'surplusUnpack.' + scope.$index + '.requiredFormingNum'"-->
<!--              :rules="[-->
<!--                {-->
<!--                  required: true,-->
<!--                  message: '请输入要求生产数量',-->
<!--                  trigger: 'change'-->
<!--                },-->
<!--                {-->
<!--                  pattern: /^\d+(\.{0,1}\d+){0,1}$/,-->
<!--                  message: '拆批数超过生产数量',-->
<!--                  trigger: ['blur', 'change']-->
<!--                }-->
<!--              ]"-->
<!--            >-->
<!--              <el-input-->
<!--                disabled-->
<!--                v-model="requiredFormingNum"-->
<!--                placeholder="请输入"-->
<!--              ></el-input>-->
<!--            </el-form-item>-->

<!--            <el-form-item v-else> 工单已全部拆完 </el-form-item>-->
<!--          </template>-->

<!--          <template v-slot:splitResidue="scope">-->
<!--            {{ formData.splitResidue }}-->
<!--          </template>-->

<!--        </ele-pro-table>-->

<!--        <headerTitle title="拆批" class="mt20"> </headerTitle>-->

        <ele-pro-table
          ref="table"
          :needPage="false"
          :columns="columns"
          :datasource="datasource"
          :init-load="false"
        >
          <template v-slot:stockCount="{ row }">
            <el-link type="primary" :underline="false" @click="stockDetail(row)">
              {{ row.stockCount }}
            </el-link>
          </template>
          <template v-slot:currentCount="{ row }">
            <el-link type="primary" :underline="false" @click="currentDetail(row)">
              {{ row.currentCount }}
            </el-link>
          </template>
<!--          <template v-slot:requiredFormingNum="scope">-->
<!--            <el-form-item-->
<!--              :prop="'unpackList.' + scope.$index + '.requiredFormingNum'"-->
<!--              :rules="{-->
<!--                required: true,-->
<!--                message: '请输入要求生产数量',-->
<!--                trigger: 'change'-->
<!--              }"-->
<!--            >-->
<!--              <el-input-number-->
<!--                type="number"-->
<!--                @change="changeNum(scope.$index)"-->
<!--                :min="0"-->
<!--                v-model="scope.row.requiredFormingNum"-->
<!--                placeholder="请输入"-->
<!--              ></el-input-number>-->
<!--            </el-form-item>-->
<!--          </template>-->

<!--          <template v-slot:reqMoldTime="scope">-->
<!--            <el-form-item-->
<!--              :prop="'unpackList.' + scope.$index + '.reqMoldTime'"-->
<!--              :rules="{-->
<!--                required: true,-->
<!--                message: '请选择开始计划时间',-->
<!--                trigger: 'change'-->
<!--              }"-->
<!--            >-->
<!--              <el-date-picker-->
<!--                class="w100"-->
<!--                v-model="scope.row.reqMoldTime"-->
<!--                type="date"-->
<!--                value-format="yyyy-MM-dd"-->
<!--              ></el-date-picker>-->
<!--            </el-form-item>-->
<!--          </template>-->
        </ele-pro-table>
      </el-form>
    </div>
    <div slot="footer">
      <el-button plain @click="cancel">取消</el-button>
      <el-button type="primary" @click="confirm">确定</el-button>
    </div>
  </ele-modal>

  <stockDetailDialog ref="stockDetailDialog" />

  <currentDetailDialog ref="currentDetailDialog" />
  </div>
</template>

<script>
  import { orderHomogeneityInspect } from '@/api/saleOrder/index.js';
  import stockDetailDialog from '../../productionPlan/components/stockDetailDialog.vue';
  import currentDetailDialog from '../../productionPlan/components/currentDetailDialog.vue';
  import {homogeneityInspect} from "@/api/productionPlan";
  export default {
    components: {
      stockDetailDialog,
      currentDetailDialog
    },
    data() {
      return {
        visible: false,

        formData: {},
        requestData: {
          deviceCode: '',
          deviceName: '',
          deviceId: ''
        },
        requiredFormingNum: 0,

        form: {
          homogeneityInspect: []
        },

        rules: {},

        columns: [
          {
            prop: 'opCode',
            label: '工序编码',
            align: 'center',
            minWidth: 100,
            showOverflowTooltip: true
          },
          {
            prop: 'opName',
            label: '工序名称',
            align: 'center',
            minWidth: 100
          },
          {
            prop: 'bomCode',
            label: '物料编码',
            align: 'center',
            minWidth: 100,
            showOverflowTooltip: true
          },
          {
            prop: 'bomName',
            label: '物料名称',
            align: 'center',
            minWidth: 100
          },
          {
            prop: 'count',
            label: '定额数量',
            align: 'center',
            minWidth: 80
          },
          {
            slot: 'stockCount',
            prop: 'stockCount',
            label: '库存数量',
            align: 'center',
            minWidth: 80
          },
          {
            prop: 'stockStatus',
            label: '库存状态',
            align: 'center',
            minWidth: 80
          },
          {
            slot: 'currentCount',
            prop: 'currentCount',
            label: '在途数量',
            align: 'center',
            minWidth: 80
          },
          {
            prop: 'currentStatus',
            label: '在途状态',
            align: 'center',
            minWidth: 80
          },
          {
            prop: 'finishStatus',
            label: '最终状态',
            align: 'center',
            minWidth: 80
          },
        ],
        ids: [],
      };
    },
    methods: {
        reload(where) {
          this.$nextTick(() => {
            this.$refs.table.reload({ page: 1, where });
          });
        },
        /* 表格数据源 */
        datasource({ page, limit, where }) {
          return homogeneityInspect({
            pageNum: page,
            size: limit,
            ...where,
          });
        },
       stockDetail(row) {
         this.$refs.stockDetailDialog.open(row);
       },
       currentDetail(row) {
         this.$refs.currentDetailDialog.open(row);
       },
      open(data) {
         this.visible = true;
         this.reload(data);
      },
      cancel() {
        this.formData = {};
        this.visible = false;
      },

      confirm() {
        this.visible = false;
      },
    }
  };
</script>

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

  .el-form-item {
    margin-bottom: 0 !important;
  }
</style>