kd-aiot-frontend-qms/src/views/inspectionClassify/components/user-list.vue

<template>
  <div>
    <user-search @search="reload" ref="searchRef"> </user-search>
    <!-- 数据表格 -->
    <ele-pro-table
      ref="table"
      :columns="columns"
      :datasource="datasource"
      height="calc(100vh - 365px)"
      full-height="calc(100vh - 116px)"
      tool-class="ele-toolbar-form"
      cache-key="inspectionClassify"
      row-key="id"
    >
      <!-- 表头工具栏 -->
      <template v-slot:toolbar>
        <el-button
          size="small"
          type="primary"
          icon="el-icon-plus"
          class="ele-btn-icon"
          @click="openAdd()"
        >
          添加质检项
        </el-button>
      </template>

      <template v-slot:textType="{ row }">
        {{
          row.itemVO.textType == 1
            ? '数值'
            : row.itemVO.textType == 2
            ? '选择'
            : row.itemVO.textType == 3
            ? '上下限'
            : row.itemVO.textType == 4
            ? '规格'
            : row.itemVO.textType == 5
            ? '时间'
            : row.itemVO.textType == 6
            ? '范围'
            : ''
        }}
      </template>

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

      <template v-slot:toolList="{ row }">
        <div
          style="display: inline-block"
          v-for="(item, idx) in row.itemVO.toolList"
          :key="idx"
          >{{ item.name }}
          <span
            v-if="row.itemVO.toolList && idx != row.itemVO.toolList.length - 1"
            >,
          </span></div
        >
      </template>

      <template v-slot:action="{ row }">
        <el-popconfirm
          class="ele-action"
          title="确定要删除此质检项吗？"
          @confirm="remove(row)"
        >
          <template v-slot:reference>
            <el-link type="danger" :underline="false" icon="el-icon-delete">
              删除
            </el-link>
          </template>
        </el-popconfirm>
      </template>
    </ele-pro-table>

    <qualityItem
      ref="qualityItemRef"
      @chooseProcess="chooseProcess"
    ></qualityItem>
  </div>
</template>

<script>
  import userSearch from './user-search.vue';
  import {
    getList,
    removeItem,
    saveBatch
  } from '@/api/inspectionClassify/index';
  import dictMixins from '@/mixins/dictMixins';

  import qualityItem from './qualityItem.vue';

  export default {
    mixins: [dictMixins],
    components: { userSearch, qualityItem },
    props: {
      rootId: [Number, String]
    },
    data() {
      return {
        // 当前编辑数据
        current: null,

        columns: [
          {
            prop: 'itemVO.categoryLevelName',
            label: '质检类型',
            align: 'center',
            minWidth: 110
          },
          {
            prop: 'itemVO.inspectionCode',
            label: '参数编码',
            showOverflowTooltip: true,
            align: 'center',
            minWidth: 110
          },
          {
            prop: 'itemVO.inspectionName',
            label: '参数名称',
            showOverflowTooltip: true,
            align: 'center',
            minWidth: 110
          },

          {
            prop: 'itemVO.textType',
            label: '参数类型',
            showOverflowTooltip: true,
            align: 'center',
            slot: 'textType',
            minWidth: 110
          },

          {
            prop: 'itemVO.maxValue',
            label: '参数上限',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'itemVO.minValue',
            label: '参数下限',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'itemVO.defaultValue',
            label: '默认值',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            label: '工艺要求',
            prop: 'itemVO.inspectionStandard',
            formatter: (row, column, cellValue) => {
              return (
                row.itemVO.symbol + ' ' + cellValue + ' ' + row.itemVO.unit
              );
            },
            minWidth: 150
          },
          {
            label: '标准类型',
            prop: 'itemVO.type',
            slot: 'type'
          },

          {
            prop: 'itemVO.qualityStandardName',
            label: '标准名称',
            align: 'center',
            minWidth: 110
          },

          {
            label: '状态',
            prop: 'status',
            formatter: (row, column, cellValue) => {
              return cellValue == 1 ? '启用' : cellValue === 0 ? '停用' : '';
            }
          },

          {
            prop: 'itemVO.toolList',
            slot: 'toolList',
            label: '设备名称',
            align: 'center',
            minWidth: 150
          },

          {
            label: '备注',
            prop: 'inspectionRemark'
          },
          {
            label: '操作',

            slot: 'action',
            showOverflowTooltip: true
          }
        ]
      };
    },
    created() {},
    methods: {
      /* 表格数据源 */
      datasource({ page, limit, where }) {
        return getList({
          ...where,
          pageNum: page,
          size: limit,
          categoryLevelId: this.categoryLevelId || 12,
          rootCategoryLevelId: this.rootId
        });
      },
      /* 刷新表格 */
      reload(where) {
        this.$refs.table.reload({
          pageNum: 1,
          where: where,
          categoryLevelId: this.categoryLevelId,
          rootCategoryLevelId: this.rootId
        });
      },

      /* 打开编辑弹窗 */
      openAdd() {
        this.$refs.qualityItemRef.open(this.categoryLevelId || 12);
      },

      openDetail(row) {
        console.log(row);
      },

      chooseProcess(data) {
        saveBatch(data).then((res) => {
          if (res.code == 0) {
            this.$message.success(res.message);
            this.reload();
          }
        });
      },

      /* 删除 */
      remove(row) {
        const loading = this.$loading({ lock: true });
        removeItem([row.id])
          .then((msg) => {
            loading.close();
            this.$message.success(msg);
            this.reload();
          })
          .catch((e) => {
            loading.close();
          });
      },
      done() {
        this.$refs.searchRef.search();
      },

      clickSearch(info) {
        this.categoryLevelId = info.id;
        this.rootCategoryLevelId = info.rootCategoryLevelId;
        this.reload();
      }
    }
  };
</script>