<template>
  <div>
    <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
      <el-tab-pane
        v-for="item in tabOption"
        :label="item.label"
        :name="item.name"
      >
      </el-tab-pane>
    </el-tabs>
    <component
      v-if="activeName && isValidComponent(activeName)"
      :is="activeName"
      :key="cKey"
      ref="componentRef"
      :taskDefinitionKey="taskDefinitionKey"
      :activeComp="activeComp"
      :businessId="businessId"
      :infoData="{}"
      :permissionType="permissionType"
    />
  </div>
</template>

<script>
  import { EventBus } from '@/views/bpm/handleTask/components/saleOrder/customerReturnGoods/eventBus';
  import {
    saleReturnGetByIdAPI,
    getOutInByIdAPI
  } from '@/api/bpm/components/saleManage/saleorder';
  export default {
    name: 'repairTabsPage',
    components: {
      outerStoremanOut: () => import('./outboundToOutsourcing.vue'),
      outerStoremanIn: () => import('./interiorStorageToOutsourcing.vue'),
      outerInQC: () => import('./interiorStorageToOutsourcingQuality.vue'),
      innerStoremanIn: () => import('./interiorProductionStorage'),
      innerInQC: () => import('./interiorProductionStorageQuality'),
      innerFillWeight: () => import('./innerFillWeight'),
      outerFillWeight: () => import('./outerFillWeight')
    },
    props: {
      taskDefinitionKey: {
        type: String,
        default: ''
      },
      activeComp: {
        type: String,
        default: ''
      },
      permissionType: {
        type: String,
        default: 'view'
      },
      businessId: {
        type: String,
        default: ''
      },
      innerOuterBoth: {
        type: Number,
        default: ''
      }
    },
    data() {
      return {
        form: {},
        warehouseInfoString: '',
        activeName: '',
        cKey: 1
      };
    },
    computed: {
      tabOption() {
        let list = [
          {
            label: '内部生产物品入库',
            name: 'innerStoremanIn',
            isOutOrIn: 'innerStore'
          },
          {
            label: '填写重量',
            name: 'innerFillWeight',
            isOutOrIn: 'innerStore'
          },
          {
            label: '内部生产入库质检',
            name: 'innerInQC',
            isOutOrIn: 'innerStore'
          },
          {
            label: '物品出库给外协',
            name: 'outerStoremanOut',
            isOutOrIn: 'outerStore'
          },
          {
            label: '外协返修物品入库',
            name: 'outerStoremanIn',
            isOutOrIn: 'outerStore'
          },
          {
            label: '填写重量',
            name: 'outerFillWeight',
            isOutOrIn: 'outerStore'
          },
          {
            label: '外协返修入库质检',
            name: 'outerInQC',
            isOutOrIn: 'outerStore'
          }
        ];
        return list.filter((item) => item.isOutOrIn == this.activeComp);
      }
    },
    async created() {
      let innerStoreList = ['innerStoremanIn', 'innerFillWeight', 'innerInQC'];
      let outerStoreList = [
        'outerStoremanOut',
        'outerStoremanIn',
        'outerFillWeight',
        'outerInQC'
      ];
      if (this.activeComp === 'innerStore') {
        // 内部处理流程
        if (innerStoreList.includes(this.taskDefinitionKey)) {
          this.activeName = this.taskDefinitionKey;
        } else {
          this.activeName = innerStoreList[0];
        }
      } else {
        // 外部处理流程
        if (outerStoreList.includes(this.taskDefinitionKey)) {
          this.activeName = this.taskDefinitionKey;
        } else {
          this.activeName = outerStoreList[0];
        }
      }
    },
    async mounted() {
      setTimeout(() => {
        this.getActiveCompValue();
      }, 400);
    },
    methods: {
      isValidComponent(componentName) {
        const validComponents = [
          'outerStoremanOut',
          'outerStoremanIn',
          'outerInQC',
          'innerStoremanIn',
          'innerInQC',
          'innerFillWeight',
          'outerFillWeight'
        ];
        return validComponents.includes(componentName);
      },
      handleClick(val) {
        this.activeName = val.name;
        this.getActiveCompValue();
      },
      getActiveCompValue() {
        EventBus.$emit('getActiveCompValue', {
          activeComp: this.activeComp,
          childActiveComp: this.activeName,
          permissionType: this.permissionType
        });
      },
      getTableValue() {
        return new Promise(async (resolve) => {
          this.form = await saleReturnGetByIdAPI(this.businessId);
          let params = {
            returnRecordId: this.form.returnRecordId,
            id: this.form.id,
            returnStorageData: await this.$refs.componentRef.getReturnStorage(),
            qualityInspectionStatus: this.$refs.componentRef.getStatus(),
            qualityInspector:
              (this.$refs.componentRef &&
                this.$refs.componentRef.getQualityFile()) ||
              {}
          };
          resolve(params);
        });
      }
    }
  };
</script>
<style scoped lang="scss"></style>
