kd-aiot-frontend-qms/src/views/inspectionWork/components/term.vue

<template>
  <div>
    <ele-pro-table
      ref="table"
      :columns="columns"
      :datasource="list"
      max-height="calc(100vh - 605px)"
      tool-class="ele-toolbar-form"
      row-key="qualityLevelId"
                 @columns-change="handleColumnChange"
              :cache-key="cacheKeyUrl"
    >
      <template v-slot:textType="{ row }">
        {{
          row.textType == 1
            ? '数值'
            : row.textType == 2
            ? '选择'
            : row.textType == 3
            ? '上下限'
            : row.textType == 4
            ? '规格'
            : row.textType == 5
            ? '时间'
            : row.textType == 6
            ? '范围'
            : ''
        }}
      </template>

      <template v-slot:type="{ row }">
        {{ getDictValue('质检标准类型', row.qualityStandardType) }}
      </template>

      <template v-slot:defaultValue="{ row }">
        <div style="display: flex">
          <div
            v-if="row.textType == 3"
            style="display: flex; align-items: center"
          >
           {{ row.minValue }} {{row.unit}}
            <span>&nbsp;&nbsp;-</span>
          {{ row.maxValue }}{{row.unit}}
          </div>

          <div v-else >
          {{ row.defaultValue }} {{row.unit}}
          </div>

        </div>
      </template>


      <template v-slot:qualityResultValue="{ row }">
        <el-input
              v-model="row.qualityResultValue"
            ></el-input>
      </template>

      <template v-slot:qualityResult="{ row }">
        <el-select
              v-model="row.qualityResult"
              placeholder="请选择"
              style="width: 100%"
              clearable
              :disabled="isDetails"
            >
              <el-option
                v-for="item in qualityList"
                :label="item.name"
                :key="item.value"
                :value="item.value"
              />
            </el-select>

      </template>

      
    </ele-pro-table>
  </div>
</template>

<script>
  import dictMixins from '@/mixins/dictMixins';
  import { getByCode } from '@/api/system/dictionary-data';

  import tabMixins from '@/mixins/tableColumnsMixin';
  export default {
    components: {},
    mixins: [dictMixins,tabMixins],
    props: {
      qualityParam: {
        type: Array
      },

      isDetails: {
        type: Boolean,
        default: false
      }
    },

    watch: {
      qualityParam: {
        handler(val) {
          this.list = val;
          this.$forceUpdate();
        },
        deep: true,
        immediate: true
      }
    },

    data() {
      return {
        list: [],
        dictList: [],

        
				qualityList: [{
						name: '合格',
						value: 1
					},
					{
						name: '不合格',
						value: 2
					},
					{
						name: '让步接受',
						value: 3
					},

				],
          
        cacheKeyUrl: 'qms-c2e9664a-inspectionWork-components-term',
        columns: [
          {
            prop: 'categoryLevelName',
            label: '质检类型',
            align: 'center',
            minWidth: 110
          },

          {
            prop: 'inspectionName',
            label: '质检名称',
            showOverflowTooltip: true,
            align: 'center',
            minWidth: 110
          },

          {
            prop: 'defaultValue',
            slot: 'defaultValue',
            label: '工艺参数',
            align: 'center',
            minWidth: 180
          },

          {
            label: '工艺要求',
            prop: 'inspectionStandard',
            formatter: (row, column, cellValue) => {
              return row.symbol + ' ' + cellValue + ' ' + row.unit;
            },
            minWidth: 350
          },

          {
            prop: 'qualityResultValue',
            slot: 'qualityResultValue',
            label: '质检结果参数',
            align: 'center',
            minWidth: 160
          },

          {
            prop: 'qualityResult',
            slot: 'qualityResult',
            label: '质检结果',
            align: 'center',
            minWidth: 100
          },

        ]
      };
    },

    created() {
      this.requestDict('质检标准类型');
      // this.getDictList('mathematical_symbol');
    },

    methods: {
      async getDictList(code) {
        let { data: res } = await getByCode(code);
        this.dictList = res.map((item) => {
          let values = Object.keys(item);
          return {
            value: Number(values[0]),
            label: item[values[0]]
          };
        });
      },

      getDate() {
        return this.list;
      }
    }
  };
</script>

<style lang="scss" scoped>
  .content_box {
    width: 100%;
    margin-top: 12px;
    max-height: 42vh;
    overflow-y: scroll;
  }

  .content_ll_case {
    display: flex;
    flex-wrap: wrap;
    background: #e6f7ff;
    line-height: 30px;
  }

  .content_ll {
    height: 30px;
    width: 23%;
    display: flex;
    flex-direction: row;
    align-items: center;

    margin: auto;

    .name {
      color: #000;
      font-weight: 500;
      margin-right: 8px;
    }
  }

  ::v-deep .el-table--medium .el-table__cell {
    padding: 4px 0 !important;
  }

  ::v-deep .el-form-item__content {
    line-height: 28px !important;
  }
</style>