样式调整

zhongshujie

2025-04-08 5f4c128cd325cfea43bd38de5cef2d9170be7472

 src/views/directory/index.vue

@@ -3,12 +3,16 @@
    <div class="page-header">
      <p>王永炎院士学生目录</p>
    </div>
    <div class="page-main-father">
    <div class="page-main-title">
      <p
        @click="changeTab('chart')"
        :class="[activeTabs == 'chart' ? 'active-tab' : '']"
      >
        <img :src="[activeTabs == 'chart' ? chartIcon : noChartIcon]" alt="" />
          <img
            :src="[activeTabs == 'chart' ? chartIcon : noChartIcon]"
            alt=""
          />
        <span>图表显示</span>
      </p>
      <p
@@ -28,7 +32,10 @@
    <!-- 列表显示 -->
    <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>
@@ -38,7 +45,12 @@
            <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>
@@ -60,6 +72,7 @@
            <td>{{ citem.title }}</td>
          </tr>
        </table>
        </div>
      </div>
    </div>
  </div>
@@ -394,23 +407,31 @@
  height: 100%;
  box-sizing: border-box;
  background-color: #e9e1d4;
  overflow: auto;
  position: relative;
}

.page-header {
  height: 102px;
  height: 9.4%;
  width: 100%;
  text-align: left;
  margin-bottom: 8px;
  border-bottom: 2px solid #937950;

  background-color: #e9e1d4;
  position: sticky;
  top: 0;
  z-index: 100;
  p {
    padding: 35px 0 34px 0;
    padding: 2% 0 1.9% 0;
    font-family: Alimama DongFangDaKai;
    font-size: 30px;
    text-indent: 1em;
    border-bottom: 1px solid #937950;
  }
}

.page-main-father {
  height: calc(100% - 9.4%);
  width: 100%;
  overflow: auto;
}

.page-main-title {
@@ -420,6 +441,7 @@
  cursor: pointer;
  margin-bottom: 75px;
  color: #9e9e9e;
  margin-top: 1%;

  p {
    display: flex;
@@ -447,7 +469,7 @@
}

.page-main {
  width: 1313px;
  width: 77.3%;
  margin: 0 auto;
  overflow: hidden;
  margin-bottom: 100px;