<template>
  <div class="margin-5"></div>
  <div class="main-container wrap main-fullScreen main-div" style="height: unset;">
    <!--上部分-->
    <div class="relative_box">
      <div class="flexWrap">
        <div class="flex-item-2">
          <div class="flexWrap" style="height: 260px">
            <div class="slogo" style="margin: auto;">
              <img :src="state.schoolInfo.schoolIcon" width="160" height="160" alt="..">
            </div>
          </div>
        </div>
        <div class="flex-item-8" style="padding-top: 40px;">
          <div class="sname">
            <span class="">{{ state.schoolInfo.schoolName }}</span>
          </div>
          <!--院校地址-->
          <div class="scity mt-10" v-if="state.schoolInfo.street">
            <el-text>
              <el-icon>
                <LocationFilled />
              </el-icon>
              {{ state.schoolInfo.street }}
            </el-text>
          </div>
          <!--院校标签-->
          <div class="stags mt-10">
            <span class="stag mr-10" v-for="(item, index) in state.schoolInfo.tagsList" :key="index">{{ item }}</span>
          </div>
          <div class="other mt-10">
            <el-row>
              <el-text>
                <el-icon>
                  <View />
                </el-icon>
                官方网址：<a v-for="item in state.schoolInfo.websiteAddressList" class="while" :href="item"
                  target="_blank">{{ item }}</a>
              </el-text>
            </el-row>
            <el-row>
              <el-text>
                <el-icon>
                  <Phone />
                </el-icon>
                官方电话：{{ state.schoolInfo.schoolPhone }}
              </el-text>
            </el-row>
            <!-- <el-text>
                <el-icon><Message /></el-icon>
                电子邮箱：暂未收录
              </el-text> -->
          </div>
        </div>
      </div>
    </div>
    <!--中间部分-->
    <div class="mt-15">
      <!--博士点...schoolResearchTeaching-->
      <div class="flexWrap schoolResearchTeachingBox" v-if="state.schoolInfo.schoolResearchTeaching">
        <div class="item mr-10 border-eb" v-if="state.schoolInfo.arwuRanking">
          <span class="num">{{ state.schoolInfo.arwuRanking }}<span class="ming">名</span></span><br />
          <span class="text">软科排名</span>
        </div>
        <div class="item mr-10 border-eb" v-if="state.schoolInfo.schoolResearchTeaching.professionalMasterDegreePoint">
          <span class="num">{{ state.schoolInfo.schoolResearchTeaching.professionalMasterDegreePoint }}<span
              class="ming">个</span></span><br />
          <span class="text">专硕点</span>
        </div>
        <div class="item mr-10 border-eb" v-if="state.schoolInfo.schoolResearchTeaching.academicMasterDegreePoint">
          <span class="num">{{ state.schoolInfo.schoolResearchTeaching.academicMasterDegreePoint }}<span
              class="ming">个</span></span><br />
          <span class="text">学硕点</span>
        </div>
        <div class="item mr-10 border-eb" v-if="state.schoolInfo.schoolResearchTeaching.doctoralPoint">
          <span class="num">{{ state.schoolInfo.schoolResearchTeaching.doctoralPoint }}<span
              class="ming">个</span></span><br />
          <span class="text">博士点</span>
        </div>
        <div class="item mr-10 border-eb" v-if="state.schoolInfo.schoolResearchTeaching.zhx">
          <span class="num">是</span><br />
          <span class="text">自划线</span>
        </div>
        <div class="item mr-10 border-eb" v-if="state.schoolInfo.schoolResearchTeaching.byl">
          <span class="num">{{ state.schoolInfo.schoolResearchTeaching.byl }}%</span><br />
          <span class="text">保研率</span>
        </div>
        <div class="item mr-10 border-eb" v-if="state.schoolInfo.schoolResearchTeaching.yjsy">
          <span class="num">有</span><br />
          <span class="text">研究生院</span>
        </div>
        <div class="item mr-10 border-eb" v-if="state.schoolInfo.schoolResearchTeaching.byzg">
          <span class="num">有</span><br />
          <span class="text">保研资格</span>
        </div>

      </div>
    </div>
    <el-card class="box-card mt-15">
      <el-tabs v-model="state.activeTabsName">
        <el-tab-pane label="学校概括" name="tabs1"></el-tab-pane>
        <el-tab-pane label="分数/计划" name="tabs2"></el-tab-pane>
        <el-tab-pane label="开设专业" name="tabs3"></el-tab-pane>
        <el-tab-pane label="硕士点" name="tabs4"></el-tab-pane>
      </el-tabs>
      <el-row :gutter="20">
        <el-col>
          <div v-show="state.activeTabsName == 'tabs1'">
            <el-row :gutter="20">
              <el-col :span="17">
                <div class="jbxx">
                  <el-divider content-position="left">相关信息</el-divider>
                  <el-card shadow="always" class="mb-10">
                    <el-row :gutter="20" class="other-line">
                      <el-col :span="9">
                        <i class="block-icon float_left"
                          style="background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAACrElEQVRYR82YPWgUQRTHf48oB6eSJkgOTCFqGo2doIVKGlHBxt7GOw9MUBArPyIhGkstgicIe42NnYX40Ug0jYVYKYIJqRRjITY5A5HknuzHfe1tbmf2Fu622uK9N7/5vzczb0bos0/6jAdrIL1ChjXGgXPAGMowQs6bmLKCsAJ8AV6QZV7mWLeZtDGQFsmxyRRwAWWn0SBCBXhKhhkp8cvEJxYoUMQFuYaSNQnaZiOsAQ/JcjdOsY5AOsEw6zxHOZoIJOwkfCDD+U5qbQmkBQ6jvETZkwpMLYjwgwHOyhM+R8WNBAqU+Zg6TDNUhiNRSrUBBTXzLrU0bSWvm74s4+GaagcqMEuVm8ZpEv6gZIAdxj4NpWbF4XazXwtQkKpl49UkrDLACDDEBktgua+5qy/DvubUtQLlKaFctpjpVylz0NsT8/w1nkirJI/FYaIhWvAX1M5v403P90sDqEKWoVot1RXSPKdRXluokw6QG0U4Iw5v/N+aQnkeoQ3pDMG6V8inKInDZBjoPcoJQ5CaWVpAC+JwshXoIovAgZ4AwZKUGQ0rtGpZ0GnWUEUcdnUPJCyLw35v2RfIU+U+sNtSZbeGIoCSpcwN9oARbsg0/7TIIBtMIVxF2W4BFpmyBZTjFkEapsI3YFIc3npqXWKUKnMop4ziCRFFnWzZt44nPEO5LmV+6jTb+M4iyt5YqC2WfZKNsX0s93yDGZRPiNfcDRoARWyMfvNue3TEjhVr4PbdUUeHl3v7wzV2vFgDIfpw9YD8Htq8/YgdLcYgrv0IVLqHcqvbsYz8hc4Nmgfk19I8yjGjoEmNTFvYptT1R5Nfm7AWGWOTV6nfPJJcg+pQ/XRRrEP5NdUfV+nmeg22hDs9f2wIL6LQc8whlFxPnmOSrm5bv9jnGNuA3dr/B+m6FjQK0kN/AAAAAElFTkSuQmCC');"></i>
                        <span class="float_left">创建时间：
                          <span v-if="state.schoolInfo.schoolOpenDate">
                            {{ getYear(state.schoolInfo.schoolOpenDate) }}年
                          </span>
                        </span>
                      </el-col>
                      <el-col :span="9">
                        <i class="block-icon float_left"
                          style="margin-left: 50px; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAEd0lEQVRYR82XbYhUVRjHf8+dmUXbsuhFLd1At+31Q7lrb5a7e8+1XRMCDQKTtC8FFVKEBkFkK4VgiVBRfgosMwkJExF8mXuvK6hQ4Wwr5EtlWbRQaLFmKO7MPHHvuHfm7ow0uXfBAxdmzsv//zvPc8655wqXWZHLjIfaQJ7dBrIMdAYqt4JadYMLazH+srC/PpHCOzUAOhFkEOhHZAfStBZ7/blamtVAnr0aleX/C6JSWfgZ40+Lqjz7XZQX4+ZynIwsoN3tHwkVB/LNUor6ft3RuFjHjLTR7h0Mm/c491IoflXVNQBvtGZyv3sqPp/hf/u6JnIu/ytow6iBhFUY/7VIxzXHQFtqQL2H8V+qDeQ7T1Msrh81TCAgHMH4d5TT5qxAiyurtWUA405FRIfbyinznI/R4pJEgAKRjHUX7e53oZ7ffQvF89/X1K7sF85luHi2j9KZGBDyOo73VoX+AZQHqtOWmo/Jbq0RIXME1dsSAxL6MP6MSO9iG0asZRh3bQ0g+zTKVYkBBULpzHQ6dv0Uau599Aby5wZQ0jEPkXUY74U40LddjZwcOpMoTCgmr+B4a8ppM9tRnTcCaBfG644D9T7SQj5/bAyADuB4syJd1zwJ+lncR47jeM1xINe0g/YmDiQoDempPLx7INT+5rErOH3md5QrIy8hj3SMx+7JhzENG3xnIcXipsSBAkHLWortflCRtk9QXRzzshpasHf+UAby7JdRopWeLJj4OJ4pA83pRgs74usoNReT3VkRIfMORV2eLEi0KgpYjZOxt50Ma0o3gN9AJ5V6yClSPEunt6UiQmYjqovGBihM2zPY7keRvu/MDX9nrP5ofV1oLK0h13igdnJAUgCOEhyOSo60tZOO7KF69EtAnn0Y5fZ6BlT1Ec6icgjRHGLl0FQf467uZ9bms5eiNxyhQdAJ/y0gf4bGKn1YkiNFjtnXHkU2BxFJpEh4Ngye+ad65nICtA+RHKo5Mqk+Zmd/ScQ1fI0MtYK2lR7amGDdzczsoNDbNY1CfluY65J5Hw3jc8ze/lci5v68yejZ1tC09LSiNFVpp1N30pE9nOxXx34zhfO0UrhgHALoTXVNTNJzMLvdSwfq7WqiWCiFXMNZB78vnC11IYzoJEtwvA31A7mmC5FOKJbCr1x/KbYXHWPJq9je6jiQ9lj4vS2otDL+ui9jW9c1W0DnJwpRKSaEF35hj1lAAYOEH4X3gDaG/dKpVjqyuWiMa3pA3xg7INmE8RYJrvkRdHqVkWUtxHY/j+o9+3GUL8YMCPkUx1ssePbfsfvJsKOwAuO/WRGhZtDwijAmJVpDrgkOwJtrvBI2YvynonpVwTfBvbt8uUqMLHz3NeN4J4KUbQAtG0cm8jWOd1/M0zX7QR9MjKOcjehLNzipmygMHazexjKI410zAmgd6HOJAQXXV5WVmPZVSE8x0C1t+73dN5IfWoPSATolMhyXmcRDu/6oWEfPg344KqDgng0nUdlHSt6m0z0Q3/2jUk9+cP0ndfLeNRX/BeErjDT18wRjAAAAAElFTkSuQmCC')"></i>
                        <span class="float_left">占地面积（亩）：未收录</span>
                      </el-col>
                    </el-row>
                    <el-row :gutter="20" class="other-line">
                      <el-col :span="9">
                        <i class="block-icon float_left"
                          style="background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAADyElEQVRYR+2YW2gcZRSAvzOJ2WSDF1AQDFgQr9matWSyogj6oC8KvkR8iGK1pcWlGpUiWCQYr4kaUNAqFJRab4gggjUYlEjUB2Vm1xuKJagEVARpuhLjJSQ5cuJsnW538s9uYumDBxaWnfOf8825/OewwnEmcpzx8D+QKyNrjdA1wFPAb8B24GOXQ9fzZoFOBJ4AtsYcLAGPAcPAgstx0vNmgK4A9gIbEox+AdwEfN4MVCNAHcAIMAjOZrAI3Q88CljkUktaoAKwDzgvteV/FD8BNgMH0p5zAZ0A3AfcA7SkNVqj90d03opfXTZWA7oQeBHIu4ykfP4+cAsws5p+PSCLxN1RDbSldJZWbQ64E3g+bZedA7wAXJLWQ5N6+4FtwM+15+MRsnA+DWSbdNLosYPAzYDBHZY40O+AtfaxlG+AC5KALLd201pnHQuxcbMFeD0JyH6/KLpvrMP+S/kgSpeVx3XAS8C35rBel1lnPRB1mrfOVH8C9wJPAsvAp1EQ3gOuSgKqMlwaddzZ6wRVimbc1zF7Nop2RpCPu4DseSdgisU1QC0CDwMPAfa9VjLAX9UfXaNjRa+7u/v6mZmZPfPz8yc3AuZ53oHl5eUbAItOklwJWMpWxAkUhuHFqvrG3NzcGWNjY4yPjzuZRISBgQGKxeIvbW1ttxcKhddWOWT7k33cQEEQ2AK2W1UtrCsyNTXFyMgIs7OzdX10dXUxPDxMPv/vCBSRN7PZbDGXyx11MwPvVgs6MUKqKkEQ7E6qnUqlwujoKJOTk0dA9ff3Mzg4SEfH0feriBwSkdt8338ldsjmpr3Z4VKom7Jyudy9uLj4lSs3ExMTWBrb29sZGhqiULC1KVkMyvf9U0WkuoacGU3/0wAbJck1FATBFlW1+8L250RZWFigpaVl5eOA+U5ENvu+/1FM7zLgQ2AT8JmzqMvl8oalpaW9qmp7dNMiInuy2ezOXC5n4yIuA8DLwLXAW04gU7B6CsPwDlV9pNHhKyI/eZ63tbe3952Et9kFmN0dwDOpgKqGwjA8X1X3qWpfmlCJyKuZTGZHT0/PoVX0nwVuBUYBg3PfQ3FjqtpaKpV2qeqQqiZtBQc9zyv6vn/EFE+Aehu4OkrbjQ0DVY0GQbBJVW3fztU42t/Z2bkt4b6px/QlsBGw6X9500B2cHp6OlOpVB604aiq8yJyV19f33Np0hnT+RU4CfgeOGtNQFWjpVKpp7W1dTafz//QIIytNnb3nGLvB5y7LkANQtSqG8zpwI/RHxaNFfUanac67pz2qayso9Lfe4j8JXHam58AAAAASUVORK5CYII=');"></i>
                        <span class="float_left">主管部门：{{ state.schoolInfo.affiliation }}</span>
                      </el-col>
                    </el-row>
                    <el-row :gutter="20" class="other-line">
                      <el-col :span="24">
                        <i class="block-icon float_left"
                          style="background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAADv0lEQVRYR82YX2gcVRSHvzOb3awxNSbQLBbaqAQVKxSKGESkD9o+WERfrMVSIQ9WJKLgk82mdSQ7URAVqz6UPgimWAhCqQ+K+uAfVIKgqFhaKBKttDa0xiZR3O4mc+Ruu2q7M3fu7PSh92ng/M653zn33rlnRrjChlxhPKQHCrTEX9wPbAYGEVYBHspJhJ+BD4BDBPJrO8m6A/naT43dwA4gb51MCBH2k2MXz8vxNGBuQGN6HyHvAD1pgiNU8XiMcdnv6pcMVNYngddQPNegLTqPcSpiqps47EBlfQDlILSx1y6d2mMHFdmXRBQPVNYB4EeU7qQgjvY6cAcT8p1NbwN6G2W742Suso+ZkE3pgXy9iTpHMu2buFmFuwnki3hzlGVUdwITCUf7DMIYHXzGEnVC7kKooKxO8NtDIE+nBfoKuDM2sPAbedbjy6mLNC9qDwtMA7dYfGcI5Ma0QHNAb2zQHA8zLlOR9l26gWU+tVapQCe+1KI0rZva1yI1/rYGXEEfO+WPSM2U5vieBZQuS5WuJ5Bf3IBe0F4WMRWKG3UKdMdl2HAaVbOUpdgIHrdSkSNuQKpmq9ZQOiwZDhHI15H253QNdSKz/1dfYCW+nHEDMqqyHkW52VKlTwi4BxFt0YzqAWCrJZmzVOiL9I29Esq6F23c6vFDOEgXT1CW2YbInLBFXkUZTvAzrcmD6U7Zbt3IEh9ZAxujaTPA7AVzLdxmXeZmsBzbbbe/7eow99jaRKg0AuEUeQZsByIeaEw3EfJhmvkStcKjBDJp3wk266i+AYwkTuQmeJcJeShJau+HzCugzOuXAWqKAtvwZSkbUNO7rC+jPJMULNIuTLKOYbbIsot/cgv7H9Q24CWU61wCI8xd6Ab24os5jU7DHciE87WLGlsRnkJZF1ORY8AeVjDJszLvRPE/UTqgpuMrehW/8x7KvRdNKHxDNxtjL14HuvaATOBLoS4DzPl3bZbRhDK9U8bKNDGyATUrtdBouM5myc0ZaOqwFk5XWeOFlDRkpcI1ohRDpYhHp3kWEBWqGlIVj3NC43lRPE53wGy+n+PDN0jVBbilQvumtVQTHkHZAI2TNKCabWlFUIUTAj+I8nkuz4HHb4/+5m8BenNap1UZcsmmbY0wMzLEoEjr+6kF6K0ZLVZn2bx8vkLrEQYF+rNUSQTTHf4kwrcqfMnVHBpZK39GJeS0qd8/pp0n5lhVV/pCj2tlmR7xKF74LdP8NWN6oroo5zTHvCrzHR5zvSVOblkt9o+GzC/Gttcq2fEfQwsnNOzpMb4AAAAASUVORK5CYII=');"></i>
                        <span class="float_left">
                          学校地址：{{ state.schoolInfo.province }}{{ state.schoolInfo.city }}{{ state.schoolInfo.area }}
                        </span>
                      </el-col>
                    </el-row>
                  </el-card>
                  <el-divider content-position="left">基本信息</el-divider>
                  <el-card shadow="always">
                    <span style="font-size: 16px;font-family: 'Microsoft YaHei'">
                      {{ state.schoolInfo.baseInfo || '暂无' }}
                    </span>
                  </el-card>
                  <br />
                </div>
              </el-col>
              <el-col :span="7">
                <!--招生章程-->
                <div v-if="state.articleList && state.articleList.length > 0">
                  <el-divider content-position="right">招生章程</el-divider>
                  <div class="gjjylzy border-eb bgd-while">
                    <div class="item" :class="index === state.articleList.length - 1 ? 'item-last' : ''"
                      v-for="(item, index) in state.articleList" :key="index" @click="showArticle(item)">
                      <span>{{ item.title }}</span>
                    </div>
                  </div>
                  <div class="flexWrap">
                    <span class="showMore" @click="showArticleMore">查看更多</span>
                  </div>
                </div>
                <!--国家级一流专业-->
                <div
                  v-if="state.doubleFirstPlan && state.doubleFirstPlan.gjjList && state.doubleFirstPlan.gjjList.length > 0">
                  <el-divider content-position="right">国家级一流专业</el-divider>
                  <div class="gjjylzy border-eb bgd-while">
                    <div class="item" :class="index === state.doubleFirstPlan.gjjList.length - 1 ? 'item-last' : ''"
                      v-for="(item, index) in state.doubleFirstPlan.gjjList" :key="index"
                      @click="showMajorInfo(item.majorCode)">
                      <span>{{ item.majorName }}</span>
                      <span class="item-right">详细查看</span>
                    </div>
                  </div>
                </div>
                <!--省级一流专业-->
                <div
                  v-if="state.doubleFirstPlan && state.doubleFirstPlan.sjList && state.doubleFirstPlan.sjList.length > 0">
                  <el-divider content-position="right">省级一流专业</el-divider>
                  <div class="gjjylzy border-eb bgd-while">
                    <div class="item" :class="index === state.doubleFirstPlan.sjList.length - 1 ? 'item-last' : ''"
                      v-for="(item, index) in state.doubleFirstPlan.sjList" :key="index"
                      @click="showMajorInfo(item.majorCode)">
                      <span>{{ item.majorName }}</span>
                      <span class="item-right">详细查看</span>
                    </div>
                  </div>
                </div>
                <!--第四轮学科评估-->
                <div v-if="state.subjectEvaluationList && state.subjectEvaluationList.length > 0">
                  <el-divider content-position="right">第四轮学科评估</el-divider>
                  <div class="dslxkpg border-eb bgd-while">
                    <div class="item" :class="index === state.subjectEvaluationList.length - 1 ? 'item-last' : ''"
                      v-for="(item, index) in state.subjectEvaluationList" :key="index">
                      <span>{{ item.subjectName }}</span>
                      <span class="item-right">{{ item.evaluationResult }}</span>
                    </div>
                  </div>
                </div>
                <!--男女比例-->
                <div class="mt-15" ref="chartRef" :style="{ width: '330px', height: '400px'}"></div>
              </el-col>
            </el-row>
          </div>
          <div v-show="state.activeTabsName == 'tabs2'">
            <el-divider content-position="left">分数/计划</el-divider>
            <el-form :inline="true" :model="selectSchoolHistoryMajorEnrollForm" class="demo-form-inline">
              <el-form-item label="年份">
                <el-radio-group v-model="selectSchoolHistoryMajorEnrollForm.year" @change="historyMajorEnrollList">
                  <el-radio v-for="item in StaticConstant.allYear" :label="item.label" name="year">{{ item.label
                    }}</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-form>
            <div class="majorList">
              <el-table :data="state.schoolHistoryMajorEnrollResult.records" border style="width: 100%">
                <el-table-column label="年份" width='100'>
                  <template v-slot="scope">
                    {{ scope.row.year }}
                  </template>
                </el-table-column>
                <el-table-column label="专业名称">
                  <template v-slot="scope">
                    <span v-if="scope.row.enrollmentCode">({{ scope.row.enrollmentCode }})</span>
                    {{ scope.row.majorName }}
                    <span v-if="scope.row.detail">({{ scope.row.detail }})</span>
                  </template>
                </el-table-column>
                <el-table-column label="录取批次" width='100'>
                  <template v-slot="scope">
                    <span v-if="scope.row.batch">{{ scope.row.batch }}</span>
                  </template>
                </el-table-column>
                <el-table-column label="文理分科" width='100'>
                  <template v-slot="scope">
                    {{ scope.row.category }}
                  </template>
                </el-table-column>
                <el-table-column label="计算方法" width="150">
                  <template v-slot="scope">
                    {{ scope.row.rulesEnrollProbability }}
                  </template>
                </el-table-column>
                <el-table-column label="最低分数线" width='100'>
                  <template v-slot="scope">
                    {{ scope.row.admissionLine }}
                  </template>
                </el-table-column>
                <el-table-column label="招生人数" width='100'>
                  <template v-slot="scope">
                    {{ scope.row.enrollNum }}
                  </template>
                </el-table-column>
                <el-table-column label="录取数" width='100'>
                  <template v-slot="scope">
                    {{ scope.row.admissionNum }}
                  </template>
                </el-table-column>
              </el-table>
              <div class="page">
                <el-pagination background @current-change="handleHistoryMajorEnrollPage"
                  :current-page="state.schoolHistoryMajorEnrollResult.current"
                  :page-size="state.schoolHistoryMajorEnrollResult.size"
                  :total="state.schoolHistoryMajorEnrollResult.total" layout="total, prev, pager, next,jumper" />
              </div>
            </div>

          </div>
          <div v-show="state.activeTabsName == 'tabs3'">
            <el-divider content-position="left">开设专业</el-divider>
            <el-form :inline="true" :model="selectMajorForm" class="demo-form-inline">
              <el-form-item :inline="true">
                <el-input style="width: 70%" :input-style="{ background: 'none !important' }"
                  v-model="selectMajorForm.majorName" class="w-50 m-2 input-border-style" size="large"
                  placeholder="输入专业名称" />
                <el-button size="large" type="primary" style="margin-left: 5px" plain @click="schoolMajorList">搜索
                </el-button>
              </el-form-item>
            </el-form>
            <div class="majorList">
              <el-table :data="state.majorResult.records" border style="width: 100%">
                <el-table-column label="专业名称">
                  <template v-slot="scope">
                    {{ scope.row.majorName }}
                  </template>
                </el-table-column>
                <el-table-column label="专业代码" width="150">
                  <template v-slot="scope">
                    {{ scope.row.majorCode }}{{ scope.row.majorCodeChar||'' }}
                  </template>
                </el-table-column>
                
                <el-table-column label="批次" width='100'>
                  <template v-slot="scope">
                    <span v-if="scope.row.batch">
                      {{ scope.row.batch}}
                    </span>
                  </template>
                </el-table-column>
                <el-table-column label="专业类别" width='155'>
                  <template v-slot="scope">
                    {{ scope.row.majorType }}
                  </template>
                </el-table-column>
                <el-table-column label="专业大类" width='180'>
                  <template v-slot="scope">
                    {{ scope.row.zyl || '' }}
                  </template>
                </el-table-column>
                <el-table-column label="学制" width='80'>
                  <template v-slot="scope">
                    <span v-if="scope.row.semester">
                      {{ scope.row.semester }}年
                    </span>
                  </template>
                </el-table-column>

                <el-table-column label="操作" width='120'>
                  <template v-slot="scope">
                    <el-button type="success" @click="showMajorInfo(scope.row.majorCode)">专业介绍</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
          <div v-show="state.activeTabsName == 'tabs4'">
            <SchoolNpee v-if="state.schoolInfo.id" :schoolId="state.schoolInfo.id"/>
          </div>
        </el-col>
      </el-row>
    </el-card>
  </div>
</template>
<script setup lang="ts">
/*学校介绍详情页*/
import apiConstant from "@/utils/ApiConstant";
import { onMounted, reactive, ref } from 'vue'
import { useRoute,useRouter } from 'vue-router';
import { AxiosResponse } from "axios";
import { SchoolEntity } from "@/types";
import { isNotNull } from '@/utils/tool';
import axiosInstance from '@/utils/http';
import * as echarts from 'echarts';
import StaticConstant from "@/utils/StaticConstant";
import SchoolNpee from "@/components/npee/schoolNpee.vue";

const router = useRouter();
const { query, params } = useRoute();   //2.在跳转页面定义router变量，解构得到指定的query和params传参的参数
document.title = '院校介绍|' + import.meta.env.VITE_PROGRAM_TYPE;
//获取页面传参
let schoolCode = params.schoolCode

const selectSchoolHistoryMajorEnrollForm = reactive({
  year: '2023',
  pageNo: 1,
  pageSize: 10
})

//搜索专业列表对象
const selectMajorForm = reactive({
  majorName: '',
  disciplines: '',//一级学科
  pageNo: 1,
  pageSize: 10
})
const state = reactive({
  activeTabsName: 'tabs1',
  schoolInfo: {} as SchoolEntity,
  disciplinesOptions: [] as any,//
  doubleFirstPlan: {} as any,//双万计划
  subjectEvaluationList: [] as any,//第四轮学科
  majorResult: {
    records: [] as any,
    current: 1,
    size: 0,
    total: 0
  } as any,
  schoolHistoryMajorEnrollResult: {
    records: [] as any,
    current: 1,
    size: 0,
    total: 0
  },
  scoreInfo:{cognitioPolyclinic:''} as any,
  articleList: [] as any,//招生章程
})

const chartRef = ref<HTMLDivElement | null>(null);
onMounted(()=>{
  let scoreInfo = localStorage.getItem('scoreInfo')
  if(scoreInfo){
    state.scoreInfo = JSON.parse(scoreInfo)
  }
  getSchoolInfo()
  schoolMajorList()
  historyMajorEnrollList()
})

function getSchoolInfo() {
  if (!schoolCode) {
    return;
  }
  axiosInstance({
    url: apiConstant.School.schoolInfo,
    method: 'get',
    params: {
      schoolCode: schoolCode
    },
    // showLoading: false,//是否显示加载图标
  }).then((response: AxiosResponse) => {
    return response?.data
  }).then((data) => {
    if (data.success) {
      let dataResult = data.result
      if (dataResult != null && dataResult != undefined) {
        console.log(dataResult)
        state.schoolInfo = dataResult
        document.title = dataResult.schoolName + '介绍|' + import.meta.env.VITE_PROGRAM_TYPE;
        //官网地址
        if (dataResult.schoolWebsiteAddress) {
          let websiteAddressList = dataResult.schoolWebsiteAddress.split(',');
          state.schoolInfo.websiteAddressList = websiteAddressList
        }
        //获取双万计划
        getDoubleFirstPlan()
        //第四轮学科
        getSubjectEvaluation()
        //招生章程
        getArticleList()
        //
        setPeople()
      } else {
        //学校不存在，跳转到搜索页
        router.push({
          path: '/school/search'
        });
      }

    }
  }).catch((error: any) => {
    console.log(error);
  }).finally(() => {
  });
}

function getDoubleFirstPlan() {
  if (state.schoolInfo && state.schoolInfo.id) {
    axiosInstance({
      url: apiConstant.School.doubleFirstPlan,
      method: 'get',
      params: {
        schoolId: state.schoolInfo.id
      },
      showLoading: false,//是否显示加载图标
    }).then((response: AxiosResponse) => {
      return response?.data
    }).then((data) => {
      if (data.success) {
        state.doubleFirstPlan = data.result
        //如果国家级跟省级 都有，给院校的标签里加一个 双万计划
        if (arrayIsNotEmpty(data.result.gjjList) || arrayIsNotEmpty(data.result.sjList)) {
          state.schoolInfo.tagsList.push('双万计划')
        }
      }
    }).catch((error: any) => {
      console.log(error);
    }).finally(() => {
    });
  }
}
//获取第四轮学科评估
function getSubjectEvaluation() {
  if (state.schoolInfo && state.schoolInfo.id) {
    axiosInstance({
      url: apiConstant.School.subjectEvaluation,
      method: 'get',
      params: {
        schoolId: state.schoolInfo.id
      },
      showLoading: false,//是否显示加载图标
    }).then((response: AxiosResponse) => {
      return response?.data
    }).then((data) => {
      if (data.success) {
        state.subjectEvaluationList = data.result
      }
    }).catch((error: any) => {
      console.log(error);
    }).finally(() => {
    });
  }
}

//获取招生章程
function getArticleList() {
  axiosInstance({
    url: apiConstant.Article.articlePage,
    method: 'get',
    params: {
      type: 1,
      schoolId: state.schoolInfo.id,
      pageNum: 1,
      pageSize: 10
    },
    showLoading: false,//是否显示加载图标
  }).then((response: AxiosResponse) => {
    return response?.data
  }).then((data) => {
    if (data.success) {
      state.articleList = data.result.records
    }
  }).catch((error: any) => {
    console.log(error);
  }).finally(() => {
  });
}

//分数计划
function historyMajorEnrollList() {
  if (!schoolCode) {
    return;
  }
  axiosInstance({
    url: apiConstant.Major.schoolHistoryMajorEnrollList,
    method: 'get',
    params: {
      schoolCode: schoolCode,
      year: selectSchoolHistoryMajorEnrollForm.year,
      pageNo: selectSchoolHistoryMajorEnrollForm.pageNo,
      pageSize: selectSchoolHistoryMajorEnrollForm.pageSize
    },
    // showLoading: false,//是否显示加载图标
  }).then((response: AxiosResponse) => {
    return response?.data
  }).then((data) => {
    if (data.success) {
      let dataResult = data.result
      if (dataResult != null && dataResult != undefined) {
        console.log(dataResult)
        state.schoolHistoryMajorEnrollResult = data.result
      }
    }
  }).catch((error: any) => {
    console.log(error);
  }).finally(() => {
  });

}

//获取学校开设专业
function schoolMajorList() {
  if (!schoolCode) {
    return;
  }
  axiosInstance({
    url: apiConstant.Major.schoolMajorList,
    method: 'get',
    params: {
      schoolCode: schoolCode,
      majorName: selectMajorForm.majorName,
      cognitioPolyclinic:state.scoreInfo.cognitioPolyclinic
    },
    // showLoading: false,//是否显示加载图标
  }).then((response: AxiosResponse) => {
    return response?.data
  }).then((data) => {
    if (data.success) {
      let dataResult = data.result
      if (dataResult != null && dataResult != undefined) {
        console.log(dataResult)
        state.majorResult.records = data.result
      }
    }
  }).catch((error: any) => {
    console.log(error);
  }).finally(() => {
  });
}

const handleHistoryMajorEnrollPage = (page: number) => {
  if (page) {
    selectSchoolHistoryMajorEnrollForm.pageNo = page
    historyMajorEnrollList()
  }
}

const handleMajorPage = (page: number) => {
  if (page) {
    selectMajorForm.pageNo = page
    schoolMajorList()
  }
}

const getYear = (time: string) => {
  if (isNotNull(time)) {
    return time.split("-")[0]
  }
}


//查看专业详情
function showMajorInfo(majorCode: string) {
  window.open('/major/' + majorCode, '_self')
}

//查看招生章程详情
function showArticle(e: any) {
  window.open('/article/' + e.id, '_self')
}

//查看更多招生章程
function showArticleMore() {
  window.open('/article/search', '_self')
}

//写入男女比例图
function setPeople() {
  let femaleRatio = state.schoolInfo.femaleRatio
  let maleRatio = state.schoolInfo.maleRatio
  if (chartRef.value && echarts &&
  (femaleRatio && 
  maleRatio)) {
    const myChart = echarts.init(chartRef.value);

    const option = {
  title: {
    text: '男女比例',
    left: 'right'
  },
  tooltip: {
    trigger: 'item'
  },
  legend: {
    orient: 'vertical',
    left: 'left'
  },
  series: [
    {
      type: 'pie',
      radius: '60%',
      data: [
        { value: femaleRatio, name: '男' },
        { value: maleRatio, name: '女' }
      ],
      emphasis: {
        itemStyle: {
          shadowBlur: 10,
          shadowOffsetX: 0,
          shadowColor: 'rgba(0, 0, 0, 0.5)'
        }
      },
      tooltip: {
        trigger: 'item',
        //formatter: '{a} <br/>{b}: {c} ({d}%)'
        formatter: '{b}: {d}%'
      }
    }
  ]
};


    // 设置实例参数
    myChart.setOption(option as any);
  }
}

function arrayIsNotEmpty(sjList: any): any {
  return sjList && sjList.length > 0;
}
</script>

<style scoped lang="scss">
.relative_box {
  border-radius: 5px 5px 0 0;
  height: 280px;
  background: linear-gradient(131deg, rgb(52, 142, 250) 0%, rgb(122, 182, 249) 100%);
  color: #fff;

  .slogo {
    border-radius: 30px;
    background: #fff;
    padding: 13px;
    width: 160px;
    height: 160px;
  }

  //院校名称
  .sname {
    flex-wrap: wrap;
    width: 50%;
    font-size: 25px;
    color: white;
  }

  //院校地址
  .el-text {
    color: white;
  }

  //院校标签
  .stags {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
  }

  .stags .stag {
    padding: 5px 10px;
    border: 1px solid white;
    min-width: 80px;
    text-align: center;
    border-radius: 15px;
  }
}

/*专业列表*/
.majorList {

  //标题行背景色，文字居中
  :deep(.el-table__header .el-table__cell) {
    background: #fafafa;
    text-align: center;
    color: #000;
    font-family: "Microsoft YaHei";
    font-weight: 600;
  }

  //数据行 文字居中
  :deep(.el-table__body .el-table__cell) {
    text-align: center;
  }

}

.jbxx {
  .block-icon {
    display: inline-block;
    width: 18px;
    height: 18px;
    margin-right: 15px;
    position: relative;
    background-size: 100% 100% !important;
  }

  .float_left {
    float: left;
  }

  .other-line {
    margin: 0 30px 30px 0;
  }

  .other-line:last-child {
    margin: 0;
  }

}

img {
  border: 0;
  vertical-align: top;
}

* {
  font-family: "Microsoft YaHei";
}


/*科研教学 box start */
.schoolResearchTeachingBox {
  .item {
    text-align: center;
    padding: 10px 15px;
    background-color: white;

    //参数
    .num {
      font-size: 20px;
      font-weight: 600;
      color: $color-blue-60;
    }

    .ming {
      font-size: 14px
    }

    //名称
    .text {
      color: #666;
      font-size: 15px;
    }
  }
}

/*科研教学 box end */

/*国家级一流专业 start */
.gjjylzy {
  padding: 10px;

  .item {
    cursor: pointer;
    padding: 10px 0;
    line-height: 20px;
    border-bottom: 1px solid #e4e7ed;
  }

  .item:hover {
    color: $color-blue-60;
  }

  .item-last {
    border-bottom: none;
  }

  .item-right {
    color: $color-blue-60;
    float: right;
  }
}

/*国家级一流专业 end */

/*第四轮学科评估 start */
.dslxkpg {
  padding: 10px;

  .item {
    cursor: pointer;
    padding: 10px 0;
    line-height: 20px;
    border-bottom: 1px solid #e4e7ed;
  }

  .item-last {
    border-bottom: none;
  }

  .item-right {
    float: right;
  }
}

/*第四轮学科评估 end */

//查看更多按钮
.showMore {
  font-size: 15px;
  line-height: 30px;
  cursor: pointer;
  color: $color-blue-60;
  float: right;
  margin: 0 0 0 auto;
}
</style>