kd-aiot-frontend-mes/src/views/produce/components/picking/details.vue

<template>
  <div>
    <ele-pro-table
      ref="table"
      :columns="columns"
      max-height="68vh"
      :datasource="dataList"
      cache-key="pickingDetails"
      highlight-current-row
      @row-click="rowClick"
      :need-page="false"
      @refresh="refresh"
    >
      <template v-slot:toolbar>
      <div class="rx-sc" v-if="!isDetails">
        <div class="c_title">领料记录 </div>
        <el-button type="primary" size="mini" style="margin: 0 5px" @click="handleAdd">新增</el-button>
        <!-- <el-button type="primary" size="mini" @click="openOutsourcingPicking()">委外领料</el-button> -->

      </div>
      </template>

      <template v-slot:action="{ row }">
        <el-button type="text" size="mini" @click="handDetailed(row)"
          >详情</el-button
        >
      </template>

      <template v-slot:status="{ row }">
        <el-tag
            :type="['danger', 'success', 'warning', 'danger'][row.status] "
            effect="dark"
            style="margin: 3px 0;"
            >{{
            statusList[row.status]
            }}</el-tag
          >
        </template>
    </ele-pro-table>

    <detailed

      @detailedClose="detailedClose"
      v-if="detailedShow"
      :detailedObj="detailedObj"
    ></detailed>

    <outsourcingPickingList v-if="outsourcingPickingShow" ref="outsourcingPickingListRef" @closeOutsourcingPicking="closeOutsourcingPicking"></outsourcingPickingList>

  </div>
</template>

<script>
  import { pickDetails } from '@/api/produce/picking';
  import detailed from './detailed.vue';
  import outsourcingPickingList from './outsourcingPickingList.vue';
  import { getTaskInstanceById } from '@/api/produce/index';

import { boolean } from 'mathjs';
  export default {
    name: 'picking-details',
    components: { detailed,outsourcingPickingList },
    props:{
      isDetails:{
        type: Boolean,
        default: false
      },
      workTaskId:{

      }
    },
    data() {
      return {
        dataList: [],
        detailedShow: false,
        detailedObj: null,

        statusList: ['未领料', '领料中', '已出库', '已驳回'],
        outsourcingPickingShow:false
      };
    },

    computed: {
      // 表格列配置
      columns() {
        return [
          {
            columnKey: 'index',
            label: '序号',
            type: 'index',
            width: 55,
            align: 'center',
            showOverflowTooltip: true
          },
          // {
          //   label: '工序',
          //   prop: 'taskName',
          //   width: 120,
          //   align: 'center',
          //   showOverflowTooltip: true
          // },
          {
            prop: 'createTime',
            label: '领料时间',
            align: 'center'
          },
          {
            prop: 'code',
            label: '领料单编号',
            align: 'center'
          },

          {
            prop: 'name',
            label: '领料单名称',
            align: 'center'
          },

          {
            prop: 'executorName',
            label: '领料人',
            align: 'center'
          },

          {
            prop: 'status',
            slot: 'status',
            label: '状态',
            align: 'center'
          },

          {
            prop: '',
            label: '操作',
            width: 80,
            align: 'center',
            resizable: false,
            fixed: 'right',
            slot: 'action'
          }
        ];
      },
      taskObj() {
        return this.$store.state.user.taskObj;
      },
      clientEnvironmentId() {
        return this.$store.state.user.info.clientEnvironmentId;
      }
    },

    methods: {
      getList(workListIds) {
        this.workListIds = workListIds || [];
        pickDetails(workListIds).then((res) => {
          this.dataList = res || [];
          this.$forceUpdate();
        });
      },

      rowClick(row) {},

      handleAdd() {
        this.$emit('pickAdd', 'pick');
      },

      refresh() {
        this.getList(this.workListIds);
      },

      handDetailed(row) {
        this.detailedObj = JSON.stringify(row);
        this.detailedShow = true;
      },

      detailedClose() {
        this.detailedShow = false;
      },
      openOutsourcingPicking(){
        console.log('this.workListIds',this.workListIds)
        if(this.workListIds.length == 1){
          this.getTaskInstanceByIdFn()
          // this.outsourcingPickingShow=true
        }else{
          this.$message.warning('只能选择一条工单进行委外领料');
        }
      },
      closeOutsourcingPicking(){
        this.outsourcingPickingShow=false
      },
      //获取工单列表
      getTaskInstanceByIdFn() {
        getTaskInstanceById(this.workListIds[0]).then((res) => {
          // console.log(res,this.workTaskId, 'res2345678');
          let { data } = res;
          if (data.length) {
            let arr = data.filter(item => item.taskId == this.workTaskId)
            console.log(arr,this.workTaskId, 'res2345678');
            if(arr[0].existOutsource){
               this.outsourcingPickingShow=true
            }else{
              this.$message.warning('当前工序不能委外领料');
            }
          }

        })

      },
    },
    created() {}
  };
</script>

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