<template>
  <div class="main-contain">
    <div class="position">
      <bread-crumb :crumbs="crumbs"></bread-crumb>
    </div>
    <div class="app-container">
      <el-tabs v-model="activeName">
        <el-tab-pane
          v-for="item in tabMapOptions"
          :label="item.label"
          :key="item.key"
          :name="item.key"
          style="display:flex;"
        >
          <keep-alive>
            <div style="display:flex;width:100%;">
              <tab-pane
                v-if="activeName == item.key"
                :type="item.key"
                style="flex:1;"
              ></tab-pane>
            </div>
          </keep-alive>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<script>
import tabPane from "./components/templateTable";
import BreadCrumb from "@/xt_pages/components/bread-crumb";
export default {
  name: "tab",
  components: { tabPane, BreadCrumb },
  data() {
    return {
      crumbs: [
        { path: false, name: "管理中心" },
        { path: "data/template", name: "模版配置" }
      ],
      tabMapOptions: [
        { label: this.$t("data_config.education"), key: "education" },
        { label: this.$t("data_config.summary"), key: "summary" },
        { label: this.$t("data_config.nursing_record"), key: "nursing_record" },
        { label: this.$t("data_config.special_record"), key: "special_record" },
        { label: this.$t("data_config.course_disease"), key: "course_disease" },
        { label: this.$t("data_config.rescue_record"), key: "rescue_record" }
      ],
      activeName: "education",
      createdTimes: 0
    };
  },
  methods: {
    showCreatedTimes() {
      this.createdTimes = this.createdTimes + 1;
    }
  }
};
</script>

<style scoped>
.tab-container {
  margin: 30px;
}
</style>
