<template>
  <el-dialog
    class="modify-school-set page-dialog"
    :visible.sync="modalIsShow"
    :title="title"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    append-to-body
    fullscreen
    @opened="visibleChange"
  >
    <div class="mb-4 tab-btns">
      <el-button
        v-for="tab in tabs"
        :key="tab.val"
        size="medium"
        :type="curTab == tab.val ? 'primary' : 'default'"
        @click="selectMenu(tab.val)"
        >{{ tab.name }}
      </el-button>
    </div>

    <div v-if="modalIsShow" class="part-box part-box-pad">
      <component :is="compName" :school="school"></component>
    </div>

    <div slot="footer"></div>
  </el-dialog>
</template>

<script>
// import SchoolSetCheck from "./school/SchoolSetCheck.vue";
// import SchoolSetData from "./school/SchoolSetData.vue";
// import SchoolSetMenu from "./school/SchoolSetMenu.vue";
// import SchoolSetPaper from "./school/SchoolSetPaper.vue";
// import SchoolSetRole from "./school/SchoolSetRole.vue";
import SchoolSetSync from "./school/SchoolSetSync.vue";

export default {
  name: "modify-school-set",
  components: {
    // SchoolSetCheck,
    // SchoolSetData,
    // SchoolSetMenu,
    // SchoolSetPaper,
    // SchoolSetRole,
    SchoolSetSync
  },
  props: {
    school: {
      type: Object,
      default() {
        return {};
      }
    }
  },
  data() {
    return {
      modalIsShow: false,
      curTab: "sync",
      tabs: [
        // {
        //   name: "用户验证配置",
        //   val: "check"
        // },
        // {
        //   name: "菜单管理",
        //   val: "menu"
        // },
        // {
        //   name: "角色管理",
        //   val: "role"
        // },
        // {
        //   name: "试卷规格配置",
        //   val: "paper"
        // },
        {
          name: "同步配置",
          val: "sync"
        }
        // {
        //   name: "数据还原",
        //   val: "data"
        // }
      ]
    };
  },
  computed: {
    compName() {
      return `school-set-${this.curTab}`;
    },
    title() {
      return `学校设置--${this.school.name}`;
    }
  },
  methods: {
    visibleChange() {},
    cancel() {
      this.modalIsShow = false;
    },
    open() {
      this.modalIsShow = true;
    },
    selectMenu(tab) {
      this.curTab = tab;
    }
  }
};
</script>
