kd-aiot-frontend/src/views/material/product/components/link-msg.vue

<template>
  <div class="link-msg">
    <headerTitle title="关联信息"></headerTitle>
    <el-tabs v-model="activeTab">
      <el-tab-pane label="可用模具">
        <ele-pro-table :columns="moduleColumn" :datasource="moduleData">
        </ele-pro-table>
      </el-tab-pane>
      <el-tab-pane label="BOM">
        <ele-pro-table :columns="BOMColumn" :datasource="bomData">
        </ele-pro-table
      ></el-tab-pane>
      <el-tab-pane label="工艺路线">
        <ele-pro-table :columns="pathColumn" :datasource="pathData">
        </ele-pro-table
      ></el-tab-pane>
      <!-- <el-tab-pane label="质量标准"></el-tab-pane> -->
      <!-- <el-tab-pane label="文件">
        <ele-pro-table :columns="fileColumn" :datasource="[]"> </ele-pro-table
      ></el-tab-pane> -->
      <el-tab-pane label="关联设备">
        <ele-pro-table :columns="equiColumn" :datasource="eqData">
        </ele-pro-table
      ></el-tab-pane>
      <el-tab-pane label="供应商">
        <ele-pro-table :columns="supplierColumn" :datasource="supplierData" :need-page="false">
        </ele-pro-table
      ></el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
  import { getBomRoutingList } from '@/api/material/list.js';
  import { getRelatesInformationList } from '@/api/material/product.js';
  import dictMixins from '@/mixins/dictMixins';
  import storage from '@/api/warehouseManagement/index.js';
  export default {
    mixins: [dictMixins],
    props: {
      id: [Number, String],
      categoryLevelId: [Number, String],
      code: [Number, String],
      categoryLevelGroupId: [Number, String]
    },
    data() {
      return {
        activeTab: '0',
        moduleColumn: [
          {
            type: 'index',
            label: '序号',
            width: '55px',
            align: 'center'
          },
          {
            label: '编码',
            prop: 'code'
          },
          {
            label: '名称',
            prop: 'name'
          },
          {
            label: '牌号',
            prop: 'brandNum'
          },
          {
            label: '型号',
            prop: 'modelType'
          },
          {
            label: '收缩系数',
            prop: 'extendInfo.shrinkEffictive'
          },
          {
            label: '大模体型号',
            prop: 'extendInfo.maxMoldType'
          },
          // {
          //   label: '物品类型',
          //   prop: ''
          // },
          {
            label: '分类',
            prop: 'categoryLevelGroupName'
          }
        ],
        BOMColumn: [
          {
            label: 'BOM编码',
            prop: 'code'
          },
          {
            label: 'BOM名称',
            prop: 'name'
          },
          {
            label: '版本号',
            prop: 'version'
          },
          {
            label: '基本数量',
            prop: 'baseCount'
          },
          {
            label: '单位',
            prop: 'baseCountUnit'
          }
        ],
        pathColumn: [
          {
            label: '工艺路线组编码',
            prop: 'code'
          },
          {
            label: '工艺路线名称',
            prop: 'name'
          },
          {
            label: '生产版本',
            prop: 'produceVersionName'
          },
          {
            label: '工艺路线版本',
            prop: 'version'
          }
        ],
        fileColumn: [
          {
            label: '文件编码'
          },
          {
            label: '文件名称'
          }
        ],
        equiColumn: [
          // {
          //   type: 'selection'
          // },
          {
            label: '设备分类',
            prop: 'categoryLevelGroupName'
          },
          {
            label: '设备编码',
            prop: 'code'
          },
          {
            label: '设备名称',
            prop: 'name'
          },
          {
            label: '产能',
            formatter: (row) => {
              return (
                row.quantity &&
                `${row.quantity}/${this.getDictValue(
                  '重量单位',
                  row.quantityUnitId
                )}`
              );
            }
          }
        ],
        supplierColumn:[

          {
            prop: 'code',
            label: '编码',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 140
          },
          {
            prop: 'name',
            label: '名称',
            align: 'center',
            slot: 'name',
            showOverflowTooltip: true,
            minWidth: 200
          },
          {
            prop: 'serialNo',
            label: '代号',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 140
          },
          {
            prop: 'phone',
            label: '电话',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 120
          },
          {
            prop: 'addressName',
            label: '注册地址',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 120,
            formatter: (_row, _column, cellValue) => {
              return (
                (_row.addressName ? _row.addressName.replaceAll(',', '') : '') +
                 ( _row.address || '')
              );
            }
          },
          {
            prop: 'otherAddressName',
            label: '联系地址',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 120,
            formatter: (_row, _column, cellValue) => {
              return (
                (_row.otherAddressName
                  ? _row.otherAddressName.replaceAll(',', '')
                  : '') + (_row.otherAddress || '')
              );
            }
          },
          {
            prop: 'linkName',
            label: '联系人',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 120
          },
          {
            prop: 'linkPhone',
            label: '联系人电话',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 120
          },
          {
            prop: 'status',
            label: '状态',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 100,
            formatter: (_row, _column, cellValue) => {
              return _row.status === 1 ? '启用' : '禁用';
            }
          },
          {
            prop: 'createUsername',
            label: '创建人',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 100
          },
          {
            prop: 'createTime',
            label: '创建时间',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 160,
            formatter: (_row, _column, cellValue) => {
              return this.$util.toDateString(cellValue);
            }
          },
        ],
        moduleData: [],
        eqData: [],
        bomData: [],
        pathData: [],
        supplierData:[]//供应商
      };
    },
    watch: {
      id: {
        handler(val) {
          if (val) {
            this.getData();
            this.contactQueryByCategoryIdsAPI();
          }
        },
        immediate: true
      },
      categoryLevelId: {
        handler(val) {
          if (val) {
            this.getModuleData();
            this.getEqData();
          }
        },
        immediate: true
      },
    },
    created() {
      this.requestDict('重量单位');
    },
    methods: {
      async getData() {
        const data = await getBomRoutingList(this.id);

        this.bomData = data?.bomList || [];
        this.pathData = data?.routingList || [];
      },
      // 关联设备
      async getEqData() {
        const data = await getRelatesInformationList({
          mainCategoryId: this.categoryLevelId,
          categoryLevelRootId: 4, //设备
          categoryLevelGroupId: this.categoryLevelGroupId
        });

        this.eqData = data;
      },
      // 关联舟皿
      async getModuleData() {
        const data = await getRelatesInformationList({
          mainCategoryId: this.categoryLevelId,
          categoryLevelRootId: 5, //模具
          categoryLevelGroupId: this.categoryLevelGroupId
        });

        this.moduleData = data;
      },
      // 关联供应商
      async contactQueryByCategoryIdsAPI() {
        const data = await storage.contactQueryByCategoryIdsAPI({
          categoryIds:[this.id]
        });

        this.supplierData = data[this.id]||[];
      }
    }
  };
</script>
<style lang="scss" scoped>
  .link-msg {
    background: #fff;

    padding: 1px 17px;
  }
</style>