kd-aiot-frontend-wt/src/views/bpm/handleTask/components/purchaseOrder/invoice/detailDialog.vue

<template>
  <div>
    <!-- <div class="switch">
      <div class="switch_left">
        <ul>
          <li v-for="item in tabOptions" :key="item.key" :class="{ active: activeComp == item.key }"
            @click="changeActive(item)">
            {{ item.name }}
          </li>
        </ul>
      </div>
    </div> -->

    <div>
      <div v-for="item in tabOptions" :label="item.name" :name="item.name">
        <headerTitle :title="item.name"></headerTitle>
        <div v-if="item.key == 'main'">
          <receiptInfo ref="modalRefs" :businessId="businessId" :form="form" :detailData="detailData">
          </receiptInfo>
        </div>
        <div v-if="item.key == 'inoutBound'">
          <add ref="modalRefs" :form="form" :sourceBizNo="form.receiveNo" :saleProductList="form.productList"
            :bizType="2" :detailProductList="detailData.productList"></add>
        </div>
        <div v-if="item.key == 'inoutBoundView'">
          <detailDialog ref="modalRefs" :bizType="2" :businessId="form.receiveNo" :isUpload="isUpload">
          </detailDialog>
        </div>
        <div v-if="item.key == 'inoutBoundEdit'">
          <procurementWarehousing :businessId="form.receiveNo" :qualityInspectionItems="qualityInspectionItems"
            ref="modalRefs">
          </procurementWarehousing>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import dictMixins from '@/mixins/dictMixins';

import { getReceiveSaleOrderrecordDetail } from '@/api/bpm/components/purchasingManage/purchaseorderreceive';

import detailDialog from '@/views/bpm/stockManagement/details.vue';

import procurementWarehousing from '@/views/bpm/stockManagement/quality.vue';


import receiptInfo from './receiptInfo.vue';
import add from '@/views/bpm/stockManagement/storage.vue';

import storageApi from '@/api/warehouseManagement';
import fileMain from '@/components/addDoc/index.vue';

export default {
  props: {
    businessId: {
      default: ''
    },
    taskId: {
      default: ''
    },
    taskDefinitionKey: {
      default: ''
    }
  },
  components: {
    fileMain,
    detailDialog,
    procurementWarehousing,
    add,
    receiptInfo
  },
  mixins: [dictMixins],
  data() {
    return {
      qualityInspectionItems: [
        'materielDesignation',
        'clientCode',
        'engrave',
        'weight',
        'result'
      ],
      isUpload: false,
      activeComp: 'main',
      tabOptions: [{ key: 'main', name: '收货单详情' }],

      visible: false,
      detailId: '',
      title: '详情',
      row: {},
      activeName: 'base',
      form: {
        orderFiles: [{ name: '222' }]
      },
      detailData: {},

    };
  },
  async created() {
    await this.getDetailData(this.businessId);
    // getOutInBySourceBizNoOrError(this.form.receiveNo)
    await storageApi
      .getInfoBySourceBizNo(this.form.receiveNo)
      .then((res) => {
        if (JSON.stringify(res) == '{}') {
          // 未查询到相关信息(未入库)
          if (this.taskDefinitionKey == 'storeManagerApprove') {
            this.tabOptions.push({ key: 'inoutBound', name: '入库单' });
            this.activeComp = 'inoutBound';
            this.$emit('activeCompChange', 'inoutBound');
            // this.$nextTick(() => {
            //   this.$refs.add.pickerSuccess(this.form);
            // });
          }
        } else {
          if (this.taskDefinitionKey == 'qualityInspection') {
            this.tabOptions.push({
              key: 'inoutBoundEdit',
              name: '入库单详情(已入库)'
            });
            this.activeComp = 'inoutBoundEdit';
          } else if (this.taskDefinitionKey == 'qualityInspectionFeedback') {
            this.tabOptions.push({
              key: 'inoutBoundView',
              name: '入库单详情'
            });
            this.isUpload = true;
            this.activeComp = 'inoutBoundView';
          } else {
            this.tabOptions.push({
              key: 'inoutBoundView',
              name: '入库单详情'
            });
            this.isUpload = false;
            this.activeComp = 'inoutBoundView';
          }
          // if (
          //   ![
          //     'starter',
          //     'deptLeaderApprove',
          //     'storeManagerApprove',
          //     'qualityInspection'
          //   ].includes(this.taskDefinitionKey)
          // ) {
          //   this.tabOptions.push({
          //     key: 'inoutBoundView',
          //     name: '入库单详情'
          //   });
          //   this.isUpload = true;
          //   this.activeComp = 'inoutBoundView';
          // } else {
          //   this.tabOptions.push({
          //     key: 'inoutBoundEdit',
          //     name: '入库单详情(已入库)'
          //   });
          //   this.activeComp = 'inoutBoundEdit';
          // }
        }
      })
      .catch(() => {
        this.$message.error('获取入库单详情失败');
      });
    console.log(this.tabOptions, 'this.tabOptions')


  },

  methods: {

    changeActive(item) {
      this.activeComp = item.key;
      this.$emit('activeCompChange', item.key);
      // if (
      //   this.taskDefinitionKey == 'storeManagerApprove' &&
      //   item.key == 'inoutBound'
      // ) {
      //   this.$nextTick(() => {
      //     this.$refs.add.pickerSuccess(this.form);
      //   });
      // }
    },
    save(data) {
      this.$refs.modalRefs[1].handleSave(data);
    },
    success() {
      // this.$parent.handleClose()

      this.$emit('handleClose');
    },

    // 判断质检状态是否全部已检
    allListChecked() {
      return (
        this.$refs.modalRefs[3] &&
        this.$refs.modalRefs[3].getStatus()
      );
    },
    async getTableValue() {
      console.log(this.$refs.modalRefs[1], 'aaaaaaaad')
      return {
        form: this.form,
        returnStorageData: this.$refs.modalRefs[1].getReturnStorage(),
        isAllChecked:
          this.$refs.modalRefs[3] &&
          (await this.$refs.modalRefs[3].getStatus()),

        qualityInspector:
          (this.$refs.modalRefs[2] &&
            this.$refs.modalRefs[2].getQualityFile()) ||
          {}
        // qualityInspector:
        //   (this.$refs.detailDialog &&
        //     this.$refs.detailDialog.getQualityFile()) ||
        //   {}
      };
    },
    async getDetailData(id) {
      this.loading = true;
      const data = await getReceiveSaleOrderrecordDetail(id);
      this.loading = false;
      if (data) {
        console.log(data, '1111111111111111111111');

        this.form = data;
        this.detailData = data;
      }
    }
  }
};
</script>

<style scoped lang="scss">
.ele-dialog-form {
  .el-form-item {
    margin-bottom: 10px;
  }
}

.headbox {
  display: flex;
  justify-content: flex-start;
  align-items: center;

  .amount {
    font-size: 14px;
    font-weight: bold;
    margin-right: 20px;
  }
}
</style>