kd-aiot-frontend-mes/src/views/warehousing/index.vue

<template>
  <div class="ele-body">
    <el-card shadow="never" v-loading="loading">
      <search @search="reload" ref="searchRef"> </search>

      <!-- 数据表格 -->
      <ele-pro-table ref="table" :columns="columns" :datasource="datasource">
        <template v-slot:totalCount="{ row }">
          {{ row.totalCount }} {{ row.measuringUnit }}
        </template>

        <template v-slot:totalPackage="{ row }">
          {{ row.totalPackage }}
        </template>

        <template v-slot:totalWeight="{ row }">
          {{ row.totalWeight }} {{ row.weightUnit }}
        </template>

        <template v-slot:approvalStatus="{ row }">
          <span :class="{ 'ele-text-danger': row.approvalStatus == 2 }">
            {{ statusFormatter(row.approvalStatus) }}
          </span>
        </template>

        <template v-slot:action="{ row }">
          <el-link
            type="primary"
            v-if="row.approvalStatus == 0 || row.approvalStatus == 3"
            :underline="false"
            @click="storage(row)"
          >
            入库
          </el-link>
          <el-link type="primary" :underline="false" @click="details(row)">
            详情
          </el-link>
        </template>
      </ele-pro-table>
    </el-card>

    <tgDetails ref="tgDetailsRefs"></tgDetails>
    <storage inboundType="2" ref="storageRefs" @success="reload"></storage>
  </div>
</template>

<script>
import { getList } from '@/api/warehousing/index.js';

import search from './components/search.vue';
import tgDetails from './components/tgDetails.vue';
import storage from './storageComponents/storage.vue';
export default {
  components: {
    search,
    tgDetails,
    storage
  },
  data() {
    return {
      loading: false,

      statusOpt: [
        { label: '未提交', value: 0 },
        { label: '审核中', value: 1 },
        { label: '审核通过', value: 2 },
        { label: '审核不通过', value: 3 }
      ]
    };
  },
  computed: {
    // 表格列配置
    columns() {
      return [
        {
          columnKey: 'index',
          label: '序号',
          type: 'index',
          width: 55,
          align: 'center',
          showOverflowTooltip: true,
          fixed: 'left'
        },
        {
          prop: 'workOrderCode',
          label: '工单编码',
          align: 'center',
          minWidth: 110
        },
        {
          prop: 'warehouseName',
          label: '仓库名称	',
          align: 'center'
        },

        {
          prop: 'categoryLevelName',
          label: '物品分类',
          align: 'center'
        },
        {
          prop: 'categoryName',
          label: '名称',
          align: 'center'
        },
        { label: '型号', prop: 'modelType', width: '150' },
        { label: '规格', prop: 'specification', width: '150' },
        { label: '牌号', prop: 'brandNum', width: '50' },
        {
          slot: 'totalCount',
          label: '总数量',
          align: 'center'
        },

        {
          slot: 'totalPackage',
          label: '总包装',
          align: 'center'
        },

        {
          slot: 'totalWeight',
          label: '总重量',
          align: 'center'
        },
        {
          prop: 'type',
          label: '入库类型',
          align: 'center',
          formatter: (row, column, cellValue) => {
            return cellValue==1?'生产入库':""
          }
        },
        {
          prop: 'approvalUserName',
          label: '审核人',
          align: 'center'
        },

        {
          prop: 'createTime',
          label: '创建时间',
          align: 'center',
          showOverflowTooltip: true,
          minWidth: 110
        },
        {
          slot: 'approvalStatus',
          label: '状态',
          align: 'center'
        },

        {
          columnKey: 'action',
          label: '操作',
          width: 120,
          align: 'center',
          resizable: false,
          fixed: 'right',
          slot: 'action',
          showOverflowTooltip: true
        }
      ];
    }
  },
  created() {},
  methods: {
    statusFormatter(status) {
      const obj = this.statusOpt.find((i) => i.value == status);
      return obj && obj.label;
    },
    /* 表格数据源 */
    datasource({ page, limit, where }) {
      return getList({
        pageNum: page,
        size: limit,
        ...where
      });
    },

    details(row) {
      this.$refs.tgDetailsRefs.open(row);
    },

    storage(row) {
      // let data = JSON.parse(JSON.stringify(row))
      // data.detailList.forEach(item=>{
      //   if(data.categoryName.includes('砌块')||data.categoryName.includes('板材')){
      //     item.packingCount=item.packingCount
      //   }
      // })
      this.$refs.storageRefs.pickerSuccess(row);
    },

    /* 刷新表格 */
    reload(where) {
      this.$nextTick(() => {
        this.$refs.table.reload({ page: 1, where });
      });
    }
  }
};
</script>

<style lang="scss" scoped></style>