kd-aiot-frontend-mes/src/views/produce/components/qualityInspection/components/selfInspectionReporting.vue

<template>
  <ele-modal
    :before-close="cancel"
    :close-on-click-modal="false"
    :maxable="true"
    :title="title"
    :visible.sync="visible"
    v-if="visible"
    append-to-body
    custom-class="ele-dialog-form"
    width="85vw"
  >
    <el-form
      ref="form"
      :model="form"
      :rules="rules"
      label-position="right"
      label-width="110px"
    >
      <headerTitle style="margin-top: 15px" title="基本信息" />
      <el-row :gutter="10" class="basic">
        <el-col :lg="8" :md="12" :sm="12" :xl="8" :xs="12">
          <el-form-item label="工序类型：">
            <el-input :value="produceTaskTypeText" disabled />
          </el-form-item>
        </el-col>

        <el-col :lg="8" :md="12" :sm="12" :xl="8" :xs="12">
          <el-form-item label="工序名称：">
            <el-input v-model="form.produceTaskName" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :lg="8" :md="12" :sm="12" :xl="8" :xs="12">
          <el-form-item label="顶层产品编码：">
            <el-input v-model="form.topCategoryCode" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :lg="8" :md="12" :sm="12" :xl="8" :xs="12">
          <el-form-item label="产品名称：">
            <el-input v-model="form.productName" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :lg="8" :md="12" :sm="12" :xl="8" :xs="12">
          <el-form-item label="产品编码">
            <el-input v-model="form.productCode" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :lg="8" :md="12" :sm="12" :xl="8" :xs="12">
          <el-form-item label="批次号：">
            <el-input v-model="form.batchNo" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :lg="8" :md="12" :sm="12" :xl="8" :xs="12">
          <el-form-item label="首件编码：" prop="firstArticleCode">
            <el-input
              v-model="form.firstArticleCode"
              :disabled="mode == 'detail'"
            ></el-input>
          </el-form-item>
        </el-col>

        <el-col :lg="8" :md="12" :sm="12" :xl="8" :xs="12" v-if="type == 1">
          <el-form-item label="自检报工时间:" prop="selfCheckTime">
            <el-date-picker
              v-model="form.selfCheckTime"
              type="datetime"
              placeholder="选择日期"
              value-format="yyyy-MM-dd HH:mm:ss"
              :disabled="mode == 'detail'"
            >
            </el-date-picker>
          </el-form-item>
        </el-col>

        <el-col :lg="8" :md="12" :sm="12" :xl="8" :xs="12" v-if="type == 2">
          <el-form-item label="专检报工时间:" prop="specialCheckTime">
            <el-date-picker
              v-model="form.specialCheckTime"
              type="datetime"
              placeholder="选择日期"
              value-format="yyyy-MM-dd HH:mm:ss"
              :disabled="mode == 'detail'"
            >
            </el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>

      <headerTitle style="margin-top: 15px" title="过程控制" />

      <el-row>
        <el-col :span="12">
          <el-form-item label="工艺、图纸是否有效：" label-width="200px">
            <el-radio-group
              v-model="form.processDrawingValid"
              :disabled="mode == 'detail'"
            >
              <el-radio
                :label="item.value"
                v-for="(item, i) in radioList"
                :key="i"
                >{{ item.name }}</el-radio
              >
            </el-radio-group>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="设备是否完好：" label-width="200px">
            <el-radio-group
              v-model="form.deviceValid"
              :disabled="mode == 'detail'"
            >
              <el-radio
                :label="item.value"
                v-for="(item, i) in radioList"
                :key="i"
                >{{ item.name }}</el-radio
              >
            </el-radio-group>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="工装是否合格：" label-width="200px">
            <el-radio-group
              v-model="form.toolingQualifiedValid"
              :disabled="mode == 'detail'"
            >
              <el-radio
                :label="item.value"
                v-for="(item, i) in radioList"
                :key="i"
                >{{ item.name }}</el-radio
              >
            </el-radio-group>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="量具是否合格并在有效期内：" label-width="200px">
            <el-radio-group
              v-model="form.measuringToolValid"
              :disabled="mode == 'detail'"
            >
              <el-radio
                :label="item.value"
                v-for="(item, i) in radioList"
                :key="i"
                >{{ item.name }}</el-radio
              >
            </el-radio-group>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="数控程序是否确认：" label-width="200px">
            <el-radio-group
              v-model="form.ncProgramValid"
              :disabled="mode == 'detail'"
            >
              <el-radio
                :label="item.value"
                v-for="(item, i) in radioList"
                :key="i"
                >{{ item.name }}</el-radio
              >
            </el-radio-group>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="原材料或半成品是否合格：" label-width="200px">
            <el-radio-group
              v-model="form.materialSemiFinishedValid"
              :disabled="mode == 'detail'"
            >
              <el-radio
                :label="item.value"
                v-for="(item, i) in radioList"
                :key="i"
                >{{ item.name }}</el-radio
              >
            </el-radio-group>
          </el-form-item>
        </el-col>
      </el-row>

      <headerTitle style="margin-top: 15px" title="检查项目" />
      <ele-pro-table
        ref="table"
        row-key="id"
        :columns="columns"
        :datasource="form.items"
        cache-key="mes-selfInspectionRequest-20251201"
        :need-page="false"
        @refresh="getData"
        :selection.sync="selection"
        style="width: 100%"
      >
        <template v-slot:toolbar>
          <el-button
            type="primary"
            @click="addInspection"
            v-if="form.items.length == 0"
            >选择质检方案</el-button
          >
        </template>
        <template v-slot:status="{ row }">
          <el-tag v-if="row.status == 0">待自检</el-tag>
          <el-tag v-if="row.status == 1">请托中</el-tag>
          <el-tag v-if="row.status == 2">待专检</el-tag>
          <el-tag v-if="row.status == 3">已完成</el-tag>
        </template>

        <template v-slot:havePleaseEntrust="{ row }">
          <el-tag v-if="row.havePleaseEntrust == 1">是</el-tag>
          <el-tag v-else>否</el-tag>
        </template>

        <template v-slot:defaultValue="{ row }">
          <div
            style="width: 100%; display: flex; justify-content: space-between"
          >
            <div style="width: 17%">
              <DictSelection
                clearable
                dictName="数学字符"
                disabled
                v-model="row.symbol"
              ></DictSelection>
            </div>

            <el-tooltip
              effect="dark"
              :content="`${row.minValue} - ${row.maxValue}`"
              placement="top"
              v-if="row.textType == 3"
            >
              <div
                style="
                  display: flex;
                  align-items: center;
                  justify-content: space-between;
                  width: 65%;
                "
              >
                <el-input style="width: 45%" v-model="row.minValue" disabled />
                <span>&nbsp;&nbsp;-</span>
                <el-input
                  style="width: 45%; margin-left: 10px"
                  v-model="row.maxValue"
                  disabled
                />
              </div>
            </el-tooltip>

            <el-tooltip
              effect="dark"
              :content="row.defaultValue"
              placement="top"
              v-else
            >
              <div style="width: 65%">
                <el-input
                  v-model="row.defaultValue"
                  placeholder="请输入"
                  disabled
                />
              </div>
            </el-tooltip>

            <div style="width: 17%">
              <DictSelection
                dictName="工艺参数单位"
                clearable
                filterable
                disabled
                v-model="row.unitName"
              >
              </DictSelection>
            </div>
          </div>
        </template>

        <template v-slot:selfCheckDesc="{ row }">
          <el-input
            size="mini"
            v-model="row.selfCheckDesc"
            placeholder="请输入"
            :disabled="row.status != 0 || mode == 'detail'"
          />
        </template>

        <template v-slot:selfCheckResult="{ row }">
          <el-select
            size="mini"
            v-model="row.selfCheckResult"
            filterable
            :disabled="row.status != 0 || mode == 'detail'"
            placeholder="请选择"
          >
            <el-option
              v-for="item in option"
              :label="item.name"
              :value="item.value"
              :key="item.value"
            >
            </el-option>
          </el-select>
        </template>

        <template v-slot:specialCheckResult="{ row }">
          <el-select
            size="mini"
            v-model="row.specialCheckResult"
            filterable
            placeholder="请选择"
            :disabled="row.status != 2 || mode == 'detail'"
          >
            <el-option
              v-for="item in option"
              :label="item.name"
              :value="item.value"
              :key="item.value"
            >
            </el-option>
          </el-select>
        </template>

        <template v-slot:specialCheckDesc="{ row }">
          <el-input
            size="mini"
            v-model="row.specialCheckDesc"
            :disabled="row.status != 2 || mode == 'detail'"
            placeholder="请输入"
          />
        </template>
      </ele-pro-table>
    </el-form>

    <span slot="footer" class="dialog-footer" v-if="mode != 'detail'">
      <el-button @click="visible = false">取 消</el-button>
      <el-button type="primary" @click="saveSelf(1)">提交</el-button>
      <el-button type="primary" @click="saveSelf(2)">保存</el-button>
    </span>

    <inspectionTemplatePop
      ref="inspectionTemplateRef"
      @changeSel="changeSel"
    ></inspectionTemplatePop>
  </ele-modal>
</template>

<script>
  import {
    getDetail,
    selfInspectionReport,
    specialInspectionReport,
    addInspectionsTerm
  } from '@/api/produce/qualityInspection.js';
  import deptSelect from '@/components/CommomSelect/dept-select.vue';
  import inspectionTemplatePop from '@/views/produce/components/bom/qualityTesting/inspectionTemplate.vue';
  import { getTemplateById } from '@/api/produce/bom.js';
  export default {
    components: { deptSelect, inspectionTemplatePop },
    data() {
      return {
        visible: false,
        form: {
          order: '',
          feedNeedTurnover: 1,
          processDrawingValid: 1,
          deviceValid: 1,
          toolingQualifiedValid: 1,
          measuringToolValid: 1,
          ncProgramValid: 1,
          materialSemiFinishedValid: 1,
          items: []
        },
        rules: {
          firstArticleCode: [
            { required: true, message: '请输入', trigger: 'change' }
          ],

          selfCheckTime: [
            { required: true, message: '请选择', trigger: 'change' }
          ],
          specialCheckTime: [
            { required: true, message: '请选择', trigger: 'change' }
          ]
        },
        radioList: [
          {
            name: '是',
            value: 1
          },
          {
            name: '否',
            value: 0
          }
        ],
        option: [
          {
            name: '不合格',
            value: 2
          },
          {
            name: '合格',
            value: 1
          }
        ],
        list: [],
        item: null,
        type: '',
        selection: [],
        title: '',
        mode: ''
      };
    },

    computed: {
      columns() {
        return [
          {
            width: 50,
            type: 'index',
            columnKey: 'index',
            label: '序号',
            align: 'center'
          },
          {
            prop: 'categoryLevelClassName',
            label: '质检名称',
            showOverflowTooltip: true,
            align: 'center',
            minWidth: 110
          },
          {
            prop: 'defaultValue',
            slot: 'defaultValue',
            align: 'center',
            label: '工艺参数',
            minWidth: 340
          },
          {
            prop: 'havePleaseEntrust',
            slot: 'havePleaseEntrust',
            align: 'center',
            label: '是否请托',
            minWidth: 70
          },
          {
            prop: 'status',
            slot: 'status',
            align: 'center',
            label: '检验状态',
            minWidth: 70
          },
          {
            prop: 'selfCheckDesc',
            slot: 'selfCheckDesc',
            align: 'center',
            label: '自检实测结果',
            minWidth: 150
          },
          {
            prop: 'selfCheckResult',
            slot: 'selfCheckResult',
            align: 'center',
            label: '自检结果',
            minWidth: 100
          },
          {
            prop: 'specialCheckDesc',
            slot: 'specialCheckDesc',
            align: 'center',
            label: '专检实测结果',
            minWidth: 150
          },
          {
            prop: 'specialCheckResult',
            slot: 'specialCheckResult',
            align: 'center',
            label: '专检结果',
            minWidth: 100
          }
        ];
      },

      produceTaskTypeText() {
        const map = {
          1: '普通工序',
          2: '质检工序'
        };
        return map[this.form.produceTaskType] || '';
      }
    },

    methods: {
      cancel() {
        this.visible = false;
      },

      open(item, type, mode) {
        this.item = item;
        this.type = type;
        this.mode = mode ? mode : '';
        if (mode) {
          this.title = type == 1 ? '自检报工详情' : '专检报工详情';
        } else {
          this.title = type == 1 ? '自检报工' : '专检报工';
        }

        this.visible = true;
        this.getData();
      },

      saveSelf(actionType) {
        this.$refs.form.validate(async (valid) => {
          if (!valid) {
            return false;
          }

          if (actionType === 1 && !this.validateCheckResult()) return;

          this.applyStatus(actionType);

          const URL =
            this.type == 1 ? selfInspectionReport : specialInspectionReport;

          const loading = this.$loading({
            lock: true,
            text: 'Loading',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.7)'
          });

          try {
            await URL({
              ...this.form,
              isReport: actionType === 1 ? 1 : 0
            });

            this.$message.success(actionType === 1 ? '提交成功' : '保存成功');
            this.cancel();
            this.$emit('refreshData');
          } finally {
            loading.close();
          }
        });
      },

      applyStatus(actionType) {
        if (actionType !== 1) return;

        const map = {
          1: {
            resultField: 'selfCheckResult',
            itemStatus: 2,
            formStatus: 2
          },
          2: {
            resultField: 'specialCheckResult',
            itemStatus: 3,
            formStatus: 3
          }
        };

        const config = map[this.type];
        if (!config) return;

        const { resultField, itemStatus, formStatus } = config;

        const allPass = this.form.items.every((item) => item[resultField] == 1);

        if (!allPass) return;

        this.form.items.forEach((item) => {
          item.status = itemStatus;
        });

        this.form.status = formStatus;

        // this.form.items.forEach((item) => {
        //   if (item[resultField] == 1) {
        //     item.status = itemStatus;
        //   }
        // });

        // const allPass = this.form.items.every(
        //   (item) => item[resultField] == 1
        // );

        // if (allPass) {
        //   this.form.status = formStatus;
        // }
      },

      addInspection() {
        this.$refs.inspectionTemplateRef.open('first');
      },

      async changeSel({ id }) {
        const { data } = await getTemplateById(id);

        data.inspectionItemVOList.forEach((item) => {
          item.qualitySchemeTemplateCode = data.qualitySchemeTemplateCode;
          item.qualitySchemeTemplateName = data.qualitySchemeTemplateName;
        });

        this.isAdd = true;
        await this.addInspectionsTerm(data.inspectionItemVOList);
      },

      async addInspectionsTerm(items) {
        const payload = this.buildInspectionPayload(items);
        const res = await addInspectionsTerm(payload);

        this.form = res;
      },

      buildInspectionPayload(items) {
        return {
          ...this.item,
          items
        };
      },

      validateCheckResult() {
        const map = {
          1: {
            field: 'selfCheckResult',
            checkStatus: 0,
            entrustStatus: 1
          },
          2: {
            field: 'specialCheckResult',
            checkStatus: 2,
            entrustStatus: 1
          }
        };

        const config = map[this.type];
        if (!config) return true;

        const { field, checkStatus, entrustStatus } = config;
        const hasEntrustPending = this.form.items.some(
          (item) =>
            item.status === entrustStatus &&
            (item[field] === null || item[field] === undefined)
        );

        if (hasEntrustPending) {
          this.$message.warning('请托结果还没有返回');
          return false;
        }

        const checkItems = this.form.items.filter(
          (item) => item.status === checkStatus
        );

        if (checkItems.some((item) => item[field] == null)) {
          this.$message.warning(
            this.type === 1
              ? '请填写完整自检结果后再提交'
              : '请填写完整专检结果后再提交'
          );
          return false;
        }

        return true;
      },

      async getData() {
        const data = await getDetail(this.item.id);

        [
          { key: 'processDrawingValid', value: 1 },
          { key: 'deviceValid', value: 1 },
          { key: 'toolingQualifiedValid', value: 1 },
          { key: 'measuringToolValid', value: 1 },
          { key: 'ncProgramValid', value: 1 },
          { key: 'materialSemiFinishedValid', value: 1 }
        ].forEach((item) => {
          if (data[item.key] !== 0) {
            data[item.key] = 1;
          }
        });
        // this.form = { ...data };
        this.form = {
          ...this.form,
          ...data,
          items: data.items || []
        };
      }
    }
  };
</script>

<style></style>