kd-aiot-frontend/src/views/material/BOMmanage/qualityTesting/inspectionClassify/components/edit.vue

<!-- 用户编辑弹窗 -->
<template>
  <el-dialog
    class="ele-dialog-form"
    title="质检项"
    :visible.sync="visible"
    :before-close="handleClose"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    width="1000px"
    append-to-body
  >
    <el-form ref="form" :model="form" :rules="rules" label-width="100px">
      <el-table
        style="margin-top: 15px"
        :data="form.parameterStandards"
        border
        height="40vh"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" align="center" width="55">
        </el-table-column>

        <el-table-column :label="form.singleWeightDivision" align="center">
          <el-table-column
            label="参数上限"
            align="center"
            v-if="form.parameterType == 3"
          >
            <template slot-scope="scope">
              <el-form-item label-width="0" prop="finalValue">
                <el-input
                  clearable
                  :disabled="type == 'detail'"
                  v-model="scope.row.finalValue"
                  placeholder="请输入"
                />
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column
            label="参数下限"
            align="center"
            v-if="form.parameterType == 3"
          >
            <template slot-scope="scope">
              <el-form-item label-width="0" prop="initialValue">
                <el-input
                  :disabled="type == 'detail'"
                  clearable
                  v-model="scope.row.initialValue"
                  placeholder="请输入"
                />
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column
            label="默认值"
            align="center"
            v-if="form.parameterType != 3"
          >
            <template slot-scope="scope">
              <el-form-item label-width="0" prop="defaultValue">
                <el-input
                  clearable
                  :disabled="type == 'detail'"
                  v-model="scope.row.defaultValue"
                  placeholder="请输入"
                />
              </el-form-item>
            </template>
          </el-table-column>
        </el-table-column>

        <el-table-column :label="form.tolerance" align="center">
          <el-table-column label="质检标准" align="center">
            <template slot-scope="scope">
              <el-form-item label-width="0" prop="inspectionStandard">
                <el-input
                  clearable
                  v-model="scope.row.toleranceValue"
                  placeholder="请输入"
                  :disabled="type == 'detail'"
                >
                  <DictSelection
                    style="width: 100px"
                    slot="prepend"
                    clearable
                    :disabled="type == 'detail'"
                    dictName="数学字符"
                    v-model="scope.row.symbol"
                  ></DictSelection>
                </el-input>
                <!-- </el-form-item> -->
              </el-form-item>
            </template>
          </el-table-column>
        </el-table-column>
      </el-table>
    </el-form>

    <template v-slot:footer>
      <el-button @click="handleClose">取消</el-button>
      <el-button type="primary" :loading="loading" @click="save">
        保存
      </el-button>
    </template>
  </el-dialog>
</template>

<script>
  import { EventBus } from '@/utils/eventBus';
  export default {
    components: {},

    data() {
      const defaultForm = function () {
        return {
          parameterStandards: [],
          linePoints: []
        };
      };
      return {
        defaultForm,
        // 表单数据
        form: { ...defaultForm() },

        // 表单验证规则
        rules: {},
        visible: false,

        type: '',
        loading: false,

        multipleSelection: [],
        rowObj: {}
      };
    },

    created() {},
    methods: {
      open(type, rowItem) {
        this.rowObj = rowItem;
        let row = rowItem.qualityStandard || {};
        this.type = type;
        if (this.type != 'add') {
          row.linePoints = row.linePoints || [];
          if (!row.parameterStandards) {
            row.parameterStandards = [];
          } else {
            row.singleWeightDivision =
              row.parameterStandards[0]?.singleWeightDivision;
            row.tolerance = row.parameterStandards[0]?.tolerance;
            row.parameterType = row.parameterStandards[0]?.parameterType;
          }
          this.form = JSON.parse(JSON.stringify(row));
  
        }
        this.visible = true;
      },

      handleSelectionChange(val) {
        this.multipleSelection = val;
      },

      /* 保存编辑 */
      save() {
        let _row = JSON.parse(JSON.stringify(this.rowObj));
        let row = _row.qualityStandard || {};

        if (!row.parameterStandards) {
          row.parameterStandards = [];
        } else {
          row.singleWeightDivision =
            row.parameterStandards[0]?.singleWeightDivision;
          row.tolerance = row.parameterStandards[0]?.tolerance;
          row.parameterType = row.parameterStandards[0]?.parameterType;
        }


        row.parameterStandards = this.multipleSelection;
        _row.qualityStandard = row;
        EventBus.$emit('inspectionSelection', { message: _row });

        this.handleClose();
      },
      restForm() {
        this.form = { ...this.defaultForm() };
        this.$nextTick(() => {
          this.$refs.form.clearValidate();
        });
      },
      handleClose() {
        this.restForm();
        this.visible = false;
      }
    }
  };
</script>

<style lang="scss" scoped>
  .location-warp {
    display: flex;

    .detail {
      margin-left: 10px;
    }
  }

  :deep(
      .el-dialog:not(.ele-dialog-form)
        .el-dialog__body
        .el-form
        .el-form-item:last-child
    ) {
    margin-bottom: 22px;
  }
  :deep(
      .el-dialog:not(.ele-dialog-form)
        .el-dialog__body
        .el-form
        .el-table__body
        .el-table__row
        .el-form-item:last-child
    ) {
    margin-bottom: 0 !important;
  }
  .add-product {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    font-size: 30px;
    color: #1890ff;
    margin: 10px 0;
    cursor: pointer;
  }
</style>