order-ui-pc/src/views/supplierSellOut/supplierFiling/detail.vue

<template>
  <div class="report-detail__container">
    <el-tabs v-model="activeTabs" v-loading="loading">
      <el-tab-pane name="1" :label="title">
        <el-collapse v-model="collapses">
          <el-collapse-item v-if="type === 'add'" name="1" :title="title">
            <base-form :id="id" :type="type" />
          </el-collapse-item>

          <template v-else>
            <base-detail
              ref="baseForm"
              :sitem="sitem"
              @change-status="handleChangeStatus"
              @change-num="handleChangeNum"
              @change-order-code="handleChangeOrderCode"
              @change-detail="(det) => (sitem = det)"
            />
          </template>
          <tempalte v-if="(status == '2' || status == '3') && !isSupertube">
            <el-collapse-item name="3" title="待转单">
              <wait-transferred :id="id" :num="num" @refresh="handleRefresh" />
            </el-collapse-item>
          </tempalte>
        </el-collapse>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import WaitTransferred from "./cpns/wait-transferred.vue";
import ShipmentRequest from "./cpns/shipment-request.vue";
import baseDetail from "./cpns/baseDetail.vue";
import BaseForm from "./cpns/baseForm.vue";
import asyncRequest from "@/apis/service/sellOut/filing";
import { mapGetters } from "vuex";

export default {
  components: {
    BaseForm,
    // ExamForms,
    baseDetail,
    WaitTransferred,
    ShipmentRequest
  },
  data() {
    return {
      loading: false,
      activeTabs: "1",
      collapses: ["1", "2", "3", "4"],
      status: "",
      sitem: {},
      orderCode: "",
      num: "0"
    };
  },
  computed: {
    ...mapGetters(["isSupertube"]),
    title() {
      return this.id && this.id !== "add" ? "报备单详情" : "新建报备单";
    },
    type() {
      return this.id && this.id !== "add" ? "view" : "add";
    },
    id() {
      return this.$route.query.id;
    },
    getNewTime() {
      this.newTime = new Date().valueOf();
    }
  },
  methods: {
    async examFormSubmit({ companyCode, ...rest } = {}) {
      const { id } = this.$route.query;
      this.loading = true;
      await asyncRequest.status({
        ...rest,
        id,
        companyCode: Array.isArray(companyCode) ? companyCode[0] : companyCode
      });

      await this.$refs.baseForm.initData();
      this.loading = false;
    },
    handleChangeStatus(status) {
      this.status = status;
    },
    handleChangeOrderCode(orderCode) {
      this.orderCode = orderCode;
    },
    async handleRefresh() {
      this.loading = true;
      await this.$refs.baseForm.initData();
      this.loading = false;
    },
    handleChangeNum(num) {
      this.num = num;
    }
  }
};
</script>

<style lang="scss" scoped>
.report-detail__container {
  padding: 15px;
}
</style>