<template>
  <Dialog
    title="更多工程"
    :visible="dialogVisible"
    width="70%"
    @change-visible="changeVisible"
    :destroy-on-close="true"
  >
    <DialogTabs
      :tabList="tabList"
      :currentTab="currentTabNow"
      @change="(val) => changeTab(val)"
    ></DialogTabs>
    <component :is="currentTabNow"></component>
  </Dialog>
</template>
<script>
import ProjectDetail from "./ProjectDetail.vue";

import CXCY from "./CXCY.vue";
import GCZL from "./GCZL.vue";
import ZFJG from "./ZFJG.vue";
export default {
  name: "ProjectDialog",
  components: { ProjectDetail, CXCY, GCZL, ZFJG },
  props: {
    projectName: {
      type: String,
      default: "",
    },
    visible: {
      type: Boolean,
      default: false,
    },
    projectId: {
      type: [Number, String],
      default: "",
    },
  },
  data() {
    return {
      tabList: [
        { name: "ZFJG", label: "政府监管" },
        { name: "GCZL", label: "工程质量" },
        { name: "CXCY", label: "创新创优" },
        { name: "ProjectDetail", label: "工程整体情况" },
      ],
      currentTabNow: "",
    };
  },
  computed: {
    dialogVisible: {
      get() {
        return this.visible;
      },
      set(val) {
        this.$emit("change-visible", val);
      },
    },
  },
  methods: {
    changeTab(e) {
      this.currentTabNow = e;
    },
    changeVisible(val) {
      this.dialogVisible = val;
    },
  },
  mounted() {
    this.$eventBus.$on("switchTab", (type) => {
      this.$nextTick(() => {
        this.currentTabNow = type;
      });
    });
  },
};
</script>
  <style lang="less" scoped>
</style>