Merge branch 'master' of http://182.92.203.7:2001/r/wyyDatabase

zhongshujie

2025-04-08 96de5562aa8245de24582623951fed016cf90a00

 src/views/directory/index.vue

@@ -4,12 +4,18 @@
      <p>王永炎院士学生目录</p>
    </div>
    <div class="page-main-title">
      <p @click="changeTab('chart')" :class="[activeTabs == 'chart' ? 'active-tab' : '']">
        <img :src="[activeTabs == 'chart' ? chartIcon : noChartIcon]" alt="">
      <p
        @click="changeTab('chart')"
        :class="[activeTabs == 'chart' ? 'active-tab' : '']"
      >
        <img :src="[activeTabs == 'chart' ? chartIcon : noChartIcon]" alt="" />
        <span>图表显示</span>
      </p>
      <p @click="changeTab('list')" :class="[activeTabs == 'list' ? 'active-tab' : '']">
        <img :src="[activeTabs == 'list' ? listIcon : noListIcon]" alt="">
      <p
        @click="changeTab('list')"
        :class="[activeTabs == 'list' ? 'active-tab' : '']"
      >
        <img :src="[activeTabs == 'list' ? listIcon : noListIcon]" alt="" />
        <span>列表显示</span>
      </p>
    </div>
@@ -22,22 +28,17 @@
    <!-- 列表显示 -->
    <div class="page-main" v-if="activeTabs == 'list'">
      <div v-for="(item, index) in universityList" :key="index">
        <div
          class="table-title"
          v-if="item.studentList && item.studentList.length > 0"
        >
        <div class="table-title" v-if="item.studentList && item.studentList.length > 0">
          <div class="table-title-left">
            <p class="table-title-name">{{ item.name }}</p>
            <p class="table-title-degree">{{ item.degree }}</p>
            <p class="table-title-number">{{ item.studentList.length }}人</p>
          </div>
          <div class="table-title-right" @click="item.isShow = !item.isShow"><img
              :src="[item.isShow ? topIcon : bottomIcon]" alt=""></div>
          <div class="table-title-right" @click="item.isShow = !item.isShow">
            <img :src="[item.isShow ? topIcon : bottomIcon]" alt="" />
          </div>
        </div>
        <table
          cellpadding="100"
          v-if="item.studentList && item.studentList.length > 0 && item.isShow"
        >
        <table cellpadding="100" v-if="item.studentList && item.studentList.length > 0 && item.isShow">
          <tr class="table-heading">
            <th>姓名</th>
            <th>性别</th>
@@ -251,7 +252,7 @@
        name: "Root",
        children: [
          {
            name: "Node 1",
            name: "王玉来",
            children: [
              { name: "Leaf 1-1" },
              { name: "Leaf 1-2" },
@@ -279,7 +280,6 @@

  mounted() {
    this.initChart();

    window.addEventListener("resize", this.handleResize);
  },
  beforeDestroy() {
@@ -292,10 +292,15 @@
    changeTab(key) {
      this.activeTabs = key;
      console.log(this.activeTabs, "activeTabs");
      if (key == "chart") {
        this.$nextTick(() => {
          this.initChart();
          window.addEventListener("resize", this.handleResize);
        });
      }
    },
    initChart() {
      this.chart = echarts.init(this.$refs.chart);

      const option = {
        tooltip: {
          trigger: "item",
@@ -305,40 +310,26 @@
            return `
              <div style="
                padding: 10px;
                background: #fff;
                background: #FDF8F0;
                border-radius: 5px;
                box-shadow: 0 2px 10px rgba(0,0,0,0.1);
                max-width: 300px;
                width: 360px;
                text-align: center;
              ">
                <div style="
                  border-bottom: 1px solid #eee;
                  padding-bottom: 5px;
                  margin-bottom: 5px;
                ">
                  <span style="
                    font-size: 16px;
                    color: #333;
                    font-weight: bold;
                  ">${data.name}</span>
                  ${
                    data.customInfo
                      ? `<span style="
                    background: #ffeb3b;
                    padding: 2px 5px;
                    border-radius: 3px;
                    margin-left: 8px;
                    font-size: 12px;
                  ">${data.customInfo}</span>`
                      : ""
                  }
                </div>
                <div style="margin-top: 8px;">
                  <div>节点值: <span style="color: #4f8ff7;">${
                    data.value || 0
                  }</span></div>
                  <div>描述: ${data.description || "暂无描述"}</div>
        
                </div>
                <div style="width: 80px;height: 80px;position: relative; margin: 0 auto; margin-bottom: 10px;background: #D8D8D8;">
      <img class="autoImg"  src="${require("@/assets/images/directory/touxiang.png")}" alt="">
                  </div>
                <div style="font-size: 16px; font-weight: bold; margin-bottom: 5px;">${
                  data.name
                }</div>
                <div> <span> 男 </span> <span> 硕士 </span> <span> 北京中医药大学 </span></div>
                <div style="font-size: 16px; font-weight: bold; margin-bottom: 5px;text-align: left;margin-top: 10px;">
                  <p style="margin-bottom: 5px;">学习时间：1985.09 -1988.07</p>
                  <p style="margin-bottom: 5px;">现工作单位：北京中医药大学东方医院</p>
                  <p style="margin-bottom: 5px;">职务：原院长</p>
                  <p style="margin-bottom: 5px;">职称：主任医师、教授</p>
                  </div>
                
              </div>
            `;
          },
@@ -491,9 +482,11 @@
    /* 移除最后一行的下边框 */
  }
}

.charts-main {
  // background-color: #000;
}

.table-title {
  display: flex;
  align-items: center;