<template>
  <!-- 重点学科 -->
  <div class="key_discipline">
    <div class="discipline_box">
      <!-- 面包屑 -->
      <div class="major_title layout align_left">
        <el-breadcrumb separator="|">
          <el-breadcrumb-item @click.native="toMajorIndex">首页</el-breadcrumb-item>
          <el-breadcrumb-item>了解专业</el-breadcrumb-item>
          <el-breadcrumb-item class="last_brand">重点学科</el-breadcrumb-item>
        </el-breadcrumb>
      </div>
      <!-- 图片 -->
      <div class="discipline_img">
        <h1>教育部重点学科名单</h1>
      </div>
      <!-- 内容 -->
      <div class="discipline_content clearfix">
        <!-- 项目简介 -->
        <div>
          <div class="project_profile flex_diection align_left layout">
            <h2>项目简介</h2>
          </div>
          <!-- 简介 -->
          <div class="all_msg" :class="{show_all:!isMore}">
            <div
              class="project_msg"
              :class="{hidden:isMore}"
              v-for="(item,index) in msg"
              :key="index"
            >{{item}}</div>
          </div>
          <!-- 展开更多 -->
          <div class="show_more" @click="showMore()">{{isMore?"展开更多":"收起"}}</div>
        </div>
        <!-- 相近相关部门 -->
        <div class="relevant_department">
          <div class="layout align_left">
            <h2>相近相关部门</h2>
          </div>
          <!-- 学科 -->
          <div class="subject_information double_subject_information clearfix layout flex_row">
            <div class="double_subject_bg"></div>
            <!-- 一级分类 -->
            <ul class="first_classify">
              <li
                v-for="item in firstList"
                :key="item.id"
                class="first_class_li"
                :class="{first_class_choice:isFirst == item.id}"
                @click="choiced(item.id)"
              >
                {{item.name}}
                <!-- 二级分类 -->
                <ol class="second_classify clearfix" v-show="isFirst == item.id">
                  <li
                    v-for="items in item.child"
                    :key="items.id"
                    class="second_class_li"
                    :class="{second_class_choice:isSecond == items.id}"
                    @click="choicedSecond(items)"
                  >{{items.name}}</li>
                </ol>
              </li>
            </ul>
            <!-- 重点学科名单 表格 -->
            <div class="discipline_table_box clearfix">
              <!-- 学科名称 -->
              <div class="subject_name">{{subjectName}}</div>
              <!-- 一级学科 -->
              <div class="first_subject clearfix choice_course">
                <div class="subject_tips">国家重点学科名单</div>
                <el-table
                  :data="KeyFirstList"
                  border
                  style="width: 723px"
                  class="score_dialog"
                  :header-cell-style="changeHeader"
                  :span-method="objectSpanMethod"
                >
                  <el-table-column prop="first" label="类别" width="214" align="center"></el-table-column>
                  <el-table-column prop="major" label="学科代码及名称" align="center"></el-table-column>
                  <el-table-column prop="schoolName" label="学校名称" width="264" align="center"></el-table-column>
                </el-table>
              </div>
              <!-- 二级学科 -->
              <div class="first_subject clearfix">
                <div class="subject_tips">国家重点（培育）学科名单</div>
                <el-table
                  :data="KeySecondList"
                  border
                  style="width: 723px"
                  class="score_dialog"
                  :header-cell-style="changeHeader"
                  :span-method="objectSpanMethod"
                >
                  <el-table-column prop="first" label="类别" width="214" align="center"></el-table-column>
                  <el-table-column prop="major" label="学科代码及名称" align="center"></el-table-column>
                  <el-table-column prop="schoolName" label="学校名称" width="264" align="center"></el-table-column>
                </el-table>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { post } from "@/api/http";
export default {
  data() {
    return {
      table: {
        // 学校名称
        trNum: [],
        // 学科名称
        subList: []
      },
      isMore: true,
      msg: [
        "国家重点学科是国家根据发展战略与重大需求，择优确定并重点建设的培养创新人才、开展科学研究的重要基地，在高等教育学科体系中居于骨干和引领地位。重点学科建设对于带动我国高等教育整体水平全面提高，提升人才培养质量、科技创新水平和社会服务能力；满足经济建设和社会发展对高层次创新人才的需求，建设创新型国家提供高层次人才和智力支撑；提高国家创新能力，建设创新型国家具有重要的意义。到目前，我国共组织了三次重点学科的评选工作。",
        "第一次评选工作是在1986-1987年。1985年5月27日颁布的《中共中央关于教育体制改革的决定》中提出“根据同行评议、择优扶植的原则，有计划地建设一批重点学科。”根据这一要求，原国家教育委员会于1987年8月12日发布了《国家教育委员会关于做好评选高等学校重点学科申报工作的通知》，决定开展高等学校重点学科评选工作。根据《通知》精神，重点学科的门类要比较齐全，科类结构比例和布局应力求合理，要有利于促进学科间的横向联合，逐步形成高校科研优势。重点学科点应承担教学、科研双重任务，要逐步做到能够自主地、持续地培养和国际水平大体相当的博士、硕士、学士；能够接受国内外学术骨干人员进修深造，进行较高水平的科学研究；能够解决四化建设中重要的科学技术问题、理论问题和实际问题，能为国家重大决策提供科学根据，为开拓新的学术领域、促进学科发展作出较大贡献。此次评选共评选出416个重点学科点，其中文科78个，理科86个，工科163个，农科36个，医科53个，涉及108所高等学校。",
        "第二次评选工作是在2001-2002年。根据《教育部关于开展高等学校重点学科评选工作的通知》规定，开展了新一轮的高等学校重点学科评选工作。主要目的是促进我国高等学校的学科建设，进一步提高我国高等学校教学科研的能力，形成一批立足国内培养高层次专门人才、解决经济建设和社会发展重大问题的基地；根据目前我国经济建设、社会发展、科技进步和国防建设的需要，对高等学校的学科建设方向进行引导和示范，使高等学校学科建设进一步适应现代化建设的需要；优化高等教育资源配置，集中国家和地方有限财力，通过重点建设，逐步在全国范围内形成布局合理、各具特色和优势的重点学科体系，巩固和扩大高等学校在人才培养、科学研究方面的综合优势。共评选出964个高等学校重点学科。",
        "第三次评选工作是在2006年。经过近二十年的建设，国家重点学科的教学、科研条件得到了明显改善，学术水平、培养高层次人才和承担国家重大任务的能力得到了显著提高，促进了高等学校学科结构的调整和优化，已成为我国高等学校重要的具有骨干和示范作用的教学、科研基地。面对世界科技革命的严峻挑战和世界范围内日益激烈的人才竞争，为适应建设创新型国家、构建社会主义和谐社会和全面建设小康社会对人才和科技的要求，根据建设创新型国家的战略部署，调整国家重点学科结构。根据《教育部关于加强国家重点学科建设的意见》精神，在“服务国家目标，提高建设效益，完善制度机制，建设一流学科”指导思想下，调整的重点是在按二级学科设置的基础上，增设一级学科国家重点学科。一级学科国家重点学科的建设要突出综合优势和整体水平，促进学科交叉、融合和新兴学科的生长。二级学科国家重点学科的建设要突出特色和优势，在重点方向上取得突破。共评选出286个一级学科，677个二级学科，217个国家重点（培育）学科。"
      ],

      // 一级分类
      firstList: [],
      isFirst: 1,
      // 二级分类
      secondList: [],
      isSecond: 1,
      // 高校学科评估结果
      titleList: ["类别", "学科代码及名称", "学校名称"],
      KeyFirstList: [],
      // 根据相同的标志存储数据
      // 第一列
      spanArr1: [],
      // 第二列
      spanArr2: [],
      // 二维数组的索引
      pos1: 0,
      pos2: 0,
      KeySecondList: [],
      subjectName:"0101 哲学"
    };
  },
  methods: {
    // 专业首页
    toMajorIndex(){
      this.$router.push({path:"/Major"})
    },
    // 表头样式
    changeHeader({ row, rowIndex }) {
      if (rowIndex == 0) {
        return "background-color:#f1f1f1;color:#5B5E63!important;font-weight:400";
      }
    },
    //   展示更多
    showMore() {
      this.isMore = !this.isMore;
    },
    // 一级分类选择
    choiced(id) {
      this.isFirst = id;
    },
    // 二级选择
    choicedSecond(item) {
      this.subjectName = item.name;
      this.isSecond = item.id;
      this.getKeySubject(item.id);
    },
    // 一级分类
    //  国家重点学科分类 
    getSubjectEvaluationCategory() {
      let url = "/api/major/getKeySubjectCategory/";
      post(url).then(res => {
        this.firstList = res;
        this.secondList = res.child;
      });
    },
    // 高校学科评估结果
    getKeySubject(id) {
      let url = "/api/major/getKeySubject/";
      let params = {
        category_id: id
      };
      post(url, params).then(res => {
        let arr = [];
        let subArr = [];
        for (var obj of res.first) {
          if (obj.sort == 1) {
            for (var obj2 of obj.key_subject_list) {
              for (var obj3 of obj2.school) {
                let str1 = {};
                str1["type"] = obj.sort;
                str1["first"] = "一级学科";
                str1["major"] = obj2.subject_name;
                str1["schoolName"] = obj3;
                arr.push(str1);
              }
            }
          }
          if (obj.sort == 2) {
            for (var obj2 of obj.key_subject_list) {
              for (var obj3 of obj2.school) {
                let str1 = {};
                str1["type"] = obj.sort;
                str1["first"] = "二级学科";
                str1["major"] = obj2.subject_name;
                str1["schoolName"] = obj3;
                arr.push(str1);
              }
            }
          }
        }

        this.KeyFirstList = arr;
        this.getSpanArr(this.KeyFirstList);
        for (var obj of res.second) {
          if (obj.sort == 2) {
            for (var obj2 of obj.key_subject_list) {
              for (var obj3 of obj2.school) {
                let str1 = {};
                str1["first"] = "二级学科";
                str1["major"] = obj2.subject_name;
                str1["schoolName"] = obj3;
                subArr.push(str1);
              }
            }
          }
        }
        this.KeySecondList = subArr;
      });
    },
    // 计算合并的列
    getSpanArr(KeyFirstList) {
      let that = this;
      that.spanArr1 = [];
      that.pos1 = 0;
      that.spanArr2 = [];
      that.pos2 = 0 ;
      KeyFirstList.forEach((item, index) => {
        // 判断是否是第一项
        if (index == 0) {
          this.spanArr1.push(1);
          this.pos1 = 0;
          this.spanArr2.push(1);
          this.pos2 = 0;
        } else {
          // 如果不是第一项，就根据标志存储
          if (KeyFirstList[index].type == KeyFirstList[index - 1].type) {
            // 查找到符合条件的数据时把之前存储的数据+1
            this.spanArr1[this.pos1] += 1;
            this.spanArr1.push(0);
          } else {
            // 无符合条件的数据就记录当前的index
            this.spanArr1.push(1);
            this.pos1 = index;
          }
          // 第二列
          if (KeyFirstList[index].major == KeyFirstList[index - 1].major) {
            this.spanArr2[this.pos2] += 1;
            this.spanArr2.push(0);
          } else {
            this.spanArr2.push(1);
            this.pos2 = index;
          }
        }
      });
    },
    // 合并列
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      // 第一列
      if (columnIndex === 0) {
        const _row = this.spanArr1[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          rowspan: _row,
          colspan: _col
        };
      } else if (columnIndex === 1) {
        // 第二列
        const _row = this.spanArr2[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          rowspan: _row,
          colspan: _col
        };
      } else {
        return false;
      }
    }
  },
  mounted() {
    this.getSubjectEvaluationCategory();
    this.getKeySubject(2);
  }
};
</script>
<style scoped>
@import "../../../../style/discipline.css";

table {
  width: 723px;
  font-size: 14px;
}
/* 第一行 表头 */
.tr_title {
  background-color: #f1f1f1;
  color: #5b5e63;
}
.tr_title td {
  padding: 6px 0;
  text-align: center;
}
td {
  border: 1px solid #eee;
  height: 100%;
}
.school_det_name {
  line-height: 50px;
  /* border-bottom: 1px solid #eee; */
}
</style>