wms1.0/mes/qd/src/views/wms/ql_manage/physicalMst/Dialog1.vue

<template>
  <div>
    <el-dialog
      title="质检结果录入"
      append-to-body
      :visible.sync="visiable1"
      fullscreen
      destroy-on-close
      :before-close="close"
      @open="open"
    >
      <el-row :gutter="20">
        <el-col :span="18" style="border: 1px solid white">
          <span/>
        </el-col>
        <el-col :span="6">
          <span>
            <el-button
              :disabled="form1.bill_status === '99'"
              type="success"
              icon="el-icon-finished"
              @click="computerResult"
            >计算结果</el-button>
            <el-button
              :disabled="form1.bill_status === '99'"
              icon="el-icon-check"
              size="mini"
              type="primary"
              @click="onSubmit"
            >保存</el-button>
            <el-button icon="el-icon-close" type="info" @click="close">关闭</el-button>
          </span>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form
            :inline="true"
            :model="form1"
            style="border: 1px solid #cfe0df;margin-top: 10px;padding-top: 10px;"
            class="demo-form-inline"
            label-width="auto"
            label-position="right"
            label-suffix=":"
          >
            <el-form-item label="质检单号">
              <el-input
                v-model="form1.inspection_code"
                disabled
                size="mini"
                style="width: 210px"
                class="filter-item"
              />
            </el-form-item>
            <el-form-item label="物料名称">
              <el-input
                v-model="form1.material_name"
                disabled
                size="mini"
                style="width: 210px"
                class="filter-item"
              />
            </el-form-item>
            <el-form-item label="采购订单">
              <el-input
                v-model="form1.source_bill_code"
                disabled
                size="mini"
                style="width: 210px"
                class="filter-item"
              />
            </el-form-item>
            <el-form-item label="重量">
              <el-input
                v-model="form1.qty"
                disabled
                size="mini"
                style="width: 210px"
                class="filter-item"
              />
            </el-form-item>
            <el-form-item>
              <label slot="label">结&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;果:</label>
              <el-select
                v-model="form1.result"
                clearable
                size="mini"
                style="width: 210px"
                placeholder="结果"
                class="filter-item"
                :disabled="form1.bill_status === '99'"
              >
                <el-option
                  v-for="item in dict.qc_result"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item>
              <label slot="label">等&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;级:</label>
              <el-select
                v-model="form1.grade"
                clearable
                size="mini"
                style="width: 210px"
                placeholder="等级"
                class="filter-item"
                :disabled="form1.bill_status === '99'"
              >
                <el-option
                  v-for="item in dict.qc_grade"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
            <el-form-item label="备注">
              <el-input
                v-model="form1.remark"
                :disabled="form1.bill_status === '99'"
                placeholder="合格白色，超出标准范围红色"
                style="width: 380px;"
                rows="2"
                type="textarea"
              />
            </el-form-item>

          </el-form>
        </el-col>
      </el-row>

      <!--表格渲染-->
      <el-table
        :data="form1.tableData"
        border
        stripe
        style="width: 100%"
        :cell-style="cellStyle"
      >
        <el-table-column
          v-if="false"
          prop="inspection_item_id"
          label="项点标识"
        />
        <el-table-column
          prop="order_index"
          width="60"
          label="序号"
        >
          <template slot-scope="scope">
            <span>{{ scope.$index + 1 }}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="inspection_item_code"
          label="项点编码"
        />
        <el-table-column
          prop="inspection_item_name"
          label="项点名称"
        />
        <el-table-column
          width="100"
          prop="inspection_item_type"
          label="项点类别"
          :formatter="format_inspection_item_type"
        />
        <el-table-column
          prop="down_limit"
          label="合格下限(≥)"
          width="100"
          :formatter="crud.formatQlNum4"
        />

        <el-table-column
          prop="up_limit"
          label="合格上限(≤)"
          width="100"
          :formatter="crud.formatQlNum4"
        />
        <el-table-column
          prop="value"
          width="155px"
          label="检测值"
        >
          <template slot-scope="scope">
            <el-input-number
              v-model="form1.tableData[scope.$index].value"
              :controls="false"
              size="mini"
              type="number"
              :disabled="form1.bill_status === '99'"
              :precision="4"
            />
          </template>
        </el-table-column>

        <el-table-column
          prop="remark"
          label="备注"
          width="160"
        >
          <template slot-scope="scope">
            <el-input
              v-model="form1.tableData[scope.$index].remark"
              :disabled="form1.bill_status === '99'"
              size="mini"
              class="edit-input"
            />
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>

    <MaterDtl :dialog-show.sync="materShow" :mater-opt-code="'05'" @tableChanged2="tableChanged2"/>
  </div>
</template>

<script>
import CRUD, {crud} from '@crud/crud'
import MaterDtl from '@/views/wms/pub/MaterDialog'
import crudPhysicalMst from '@/views/wms/ql_manage/physicalMst/physicalMst'

export default {
  name: 'Dialog1',
  dicts: ['QL_TEST_POINTTYPE', 'qc_grade', 'qc_result'],
  components: {MaterDtl},
  mixins: [crud()],
  props: {
    visiable1: {
      type: Boolean
    },
    inspectionId: {
      type: String
    }
  },
  data() {
    return {
      materShow: false,
      materType: '05',
      form1: {
        material_id: '',
        bill_status: '',
        material_code: '',
        material_name: '',
        pcsn: '',
        sample_code: '',
        other_device_no: '',
        other_device_wd: '',
        weightlost: '',
        grade: '',
        result: '',
        change_material_id: '',
        change_material_code: '',
        change_material_name: '',
        change_pcsn: '',
        remark: '',
        tableData: []
      }
    }
  },
  watch: {
    'form1.tableData': {
      handler(newValue, oldValue) {
        // this.computerResult()
      },
      deep: true
    }
  },
  methods: {
    open() {
      const param = {
        inspection_id: this.inspectionId
      }
      crudPhysicalMst.getResult(param).then(res => {
        this.form1 = res
        const rows = this.form1.tableData
        for (let i = 0; i < rows.length; i++) {
          const row = rows[i]
          this.$set(row, 'value', row.value)
        }
        if (res.grade === '' || !res.grade) {
          this.form1.grade = '1'
        }
      })
    },
    cellStyle({row, column, rowIndex, columnIndex}) {
      // https://blog.csdn.net/qq_41648113/article/details/109337781
      // https://blog.csdn.net/Akatsuki233/article/details/100311040
      // https://blog.csdn.net/qq_45414633/article/details/107795124
      const inspection_type = row.inspection_type
      const is_limit_remark = row.is_limit_remark
      const value = parseFloat(row.value)
      const up_limit = parseFloat(row.up_limit)
      const down_limit = parseFloat(row.down_limit)

      const down_limit_value = parseFloat(row.down_limit_value)
      const up_limit_value = parseFloat(row.up_limit_value)

      // 理化项
      if (inspection_type === '02') {
        if (column.property === 'value') {
          if (value < down_limit) {
            row.is_ok = '0'
            return 'background: red'
          } else if ((value >= down_limit) && (value <= down_limit_value)) {
            if (is_limit_remark === '1') {
              row.form_remark = row.inspection_item_name + '超下限'
              return 'background: yellow'
            }
            row.is_ok = '1'
          } else if (value > up_limit) {
            row.is_ok = '0'
            return 'background: red'
          } else if ((value <= up_limit) && (value >= up_limit_value)) {
            if (is_limit_remark === '1') {
              row.form_remark = row.inspection_item_name + '超上限'
              return 'background: yellow'
            }
            row.is_ok = '1'
          } else {
            row.form_remark = ''
            row.is_ok = '1'
          }
        }
      }
    },
    computerResult() {
      const rows = this.form1.tableData
      for (let i = 0; i < rows.length; i++) {
        if (!rows[i].up_limit && rows[i].inspection_type === '02') {
          if (rows[i].value === undefined) {
            this.crud.notify('有标准项点未输入完', CRUD.NOTIFICATION_TYPE.INFO)
            return false
          }
        }
      }
      this.$set(this.form1, 'result', '1')
      var remark = ''
      for (var row of rows) {
        if (row.is_ok === '0') {
          this.$set(this.form1, 'result', '2')
        } else {
          if (row.is_limit_remark === '1' && row.form_remark) {
            remark += row.form_remark.replace('\n', '') + ','
          }
        }
      }

      this.$set(this.form1, 'remark', remark)
      if (this.form1.result === '1') return this.crud.notify('计算结果为合格', CRUD.NOTIFICATION_TYPE.SUCCESS)
      if (this.form1.result === '2') return this.crud.notify('计算结果为不合格', CRUD.NOTIFICATION_TYPE.INFO)
    },
    format_inspection_item_type(row, column) {
      return this.dict.label.QL_TEST_POINTTYPE[row.inspection_item_type]
    },

    onSubmit() {
      debugger
      const msg = '是否继续！'
      const data = this.form1.tableData
      var flag = 0
      for (var row of data) {
        if (row.up_limit !== '') {
          if (!row.value) {
            flag = flag + 1
          }
        }
      }
      // 如果检测值有一项没填则提示是否继续 （在上限下限有值的情况下）
      if (flag > 0) {
        this.$confirm(msg, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          crudPhysicalMst.saveResult(this.form1).then(res => {
            this.close()
            this.crud.toQuery()
            this.notify('操作成功', 'success')
          })
        })
      } else {
        crudPhysicalMst.saveResult(this.form1).then(res => {
          this.close()
          this.crud.toQuery()
          this.notify('操作成功', 'success')
        })
      }
    },
    onSubmit2() {
      const data = this.form1.tableData
      var flag = 0
      for (var row of data) {
        if (!row.value) {
          flag = flag + 1
        }
      }
      // if (flag === data.length) {
      //   this.crud.notify('请至少填写一项检测值', CRUD.NOTIFICATION_TYPE.INFO)
      //   return false
      // }
      crudPhysicalMst.saveResult(this.form1).then(res => {
        this.close()
        this.crud.toQuery()
        this.notify('操作成功', 'success')
      })
    },
    notify(title, type) {
      this.$notify({
        title: title,
        type: type,
        duration: 2500
      })
    },
    cleanMater() {
      this.form1.change_material_id = null
      this.form1.change_material_code = null
      this.form1.change_material_name = null
      this.form1.change_pcsn = null
      this.$forceUpdate()
    },
    tableChanged2(row) {
      // 新增一行物料时，给行进行赋值
      this.form1.change_material_id = row.material_id
      this.form1.change_material_code = row.material_code
      this.form1.change_material_name = row.material_name
      this.form1.change_pcsn = this.form1.pcsn + '-GY'
    },
    close() {
      // this.$emit('update:visiable1', false)
      this.$parent._data.visiable1 = false
    }
  }
}
</script>

<style rel="stylesheet/scss" lang="scss">
.edit-input {
  .el-input__inner {
    border: 1px solid #e5e6e7;
  }
}
</style>

<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep .el-dialog__body {
  padding-top: 10px;
}
</style>