From c6189f35d8744bf9c90bc15fd132ceb2a51d902c Mon Sep 17 00:00:00 2001
From: 杨磊 <505174330@qq.com>
Date: 星期一, 28 四月 2025 19:29:52 +0800
Subject: [PATCH] bug修改

---
 src/views/achievements/index.vue | 1439 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 1,434 insertions(+), 5 deletions(-)

diff --git a/src/views/achievements/index.vue b/src/views/achievements/index.vue
index ffd9204..42bb078 100644
--- a/src/views/achievements/index.vue
+++ b/src/views/achievements/index.vue
@@ -1,14 +1,1443 @@
-
 <template>
-  <div>瀛︽湳鎴愭灉</div>
+  <div class="page">
+    <div class="page-header">
+      <p>
+        <span>鐜嬫案鐐庨櫌澹鏈垚鏋�</span>
+      </p>
+    </div>
+    <div class="page-main-father">
+      <div class="page-main">
+        <!-- 鎼滅储妗� -->
+        <ul class="page-input">
+          <li class="input-main">
+            <SearchBox @search="handleSearch" :options="inputOptions" />
+          </li>
+          <li class="input-txt" @click="isDisplay = !isDisplay">
+            楂樼骇妫�绱�
+            <img :src="[isDisplay ? topIcon : bottomIcon]" alt="" />
+          </li>
+        </ul>
+        <!-- 楂樼骇鎼滅储 -->
+        <div v-if="isDisplay" class="page-search">
+          <MyForm
+            class="myfrom"
+            @submit="
+              (data) => {
+                CurrentPage = 1;
+                onSubmit(data);
+              }
+            "
+            @reset="resetForm"
+            :from="from"
+          />
+        </div>
+        <!-- 鎼滅储缁撴灉 -->
+        <div class="page-content">
+          <div class="content-left">
+            <!-- 绫诲瀷 -->
+            <ul>
+              <li class="left-title">
+                <span>{{ category.title }}</span>
+                <p @click="category.isDisplay = !category.isDisplay">
+                  <img
+                    :src="[category.isDisplay ? topIcon : bottomIcon]"
+                    alt=""
+                  />
+                </p>
+              </li>
+              <li class="left-main" v-if="category.isDisplay">
+                <div
+                  class="category-main"
+                  v-for="(item, index) in category.list"
+                  :key="index"
+                >
+                  <el-checkbox
+                    class="el-checkbox"
+                    v-model="item.checked"
+                    :title="item.name"
+                    @change="categoryChange(item)"
+                    style="display: inline-block; vertical-align: middle"
+                    >{{ item.name }}</el-checkbox
+                  >
+                  <span
+                    class=""
+                    style="display: inline-block; vertical-align: middle"
+                    >{{ item.num }}</span
+                  >
+                </div>
+              </li>
+            </ul>
+            <!-- 骞村害 -->
+            <ul>
+              <li class="left-title">
+                <div>
+                  <span>{{ annual.title }}</span>
+                  <span>
+                    鏃堕棿
+                    <img
+                      class="sort-Icon"
+                      :src="[isDisplay ? sortTop : sortBottom]"
+                      alt=""
+                    />
+                  </span>
+                  <span
+                    >鏂囩尞閲�
+                    <img
+                      class="sort-Icon"
+                      :src="[isDisplay ? sortBottom : sortTop]"
+                      alt=""
+                    />
+                  </span>
+                </div>
+                <p @click="annual.isDisplay = !annual.isDisplay">
+                  <img
+                    :src="[annual.isDisplay ? topIcon : bottomIcon]"
+                    alt=""
+                  />
+                </p>
+              </li>
+              <li class="left-main" v-if="annual.isDisplay">
+                <div
+                  class="annual-main"
+                  :style="{
+                    display: index + 1 > professionIndex ? 'none' : '',
+                  }"
+                  v-for="(item, index) in annual.list"
+                  :key="index"
+                >
+                  <el-checkbox
+                    class="el-checkbox"
+                    v-model="item.checked"
+                    :title="item.years"
+                    >{{ item.years }}</el-checkbox
+                  >
+                  <span class="">{{ item.num }}</span>
+                </div>
+                <p
+                  class="annual-footer"
+                  v-if="annual.list && annual.list.length > 5"
+                  @click="shrinkClick('a', '骞村害')"
+                >
+                  {{ activeBox !== "a" ? "鏇村 鈭�" : "鏀惰捣 鈭�" }}
+                </p>
+              </li>
+            </ul>
+            <!-- 鏂囩尞鏉ユ簮 -->
+            <ul>
+              <li class="left-title">
+                <div>
+                  <span>{{ sources.title }}</span>
+                  <span>
+                    鏂囩尞閲�
+                    <img
+                      class="sort-Icon"
+                      :src="[isDisplay ? sortBottom : sortTop]"
+                      alt=""
+                    />
+                  </span>
+                </div>
+                <p @click="sources.isDisplay = !sources.isDisplay">
+                  <img
+                    :src="[sources.isDisplay ? topIcon : bottomIcon]"
+                    alt=""
+                  />
+                </p>
+              </li>
+              <li class="left-main" v-if="sources.isDisplay">
+                <div
+                  class="sources-main"
+                  v-for="(item, index) in sources.list"
+                  :key="index"
+                  :style="{
+                    display: index + 1 > dynastyIndex ? 'none' : '',
+                  }"
+                >
+                  <el-checkbox
+                    class="el-checkbox"
+                    :title="item.name"
+                    v-model="item.checked"
+                    >{{ item.name }}</el-checkbox
+                  >
+                  <span class="">{{ item.num }}</span>
+                </div>
+                <p
+                  class="sources-footer"
+                  v-if="sources.list && sources.list.length > 5"
+                  @click="shrinkClick('b', '鏂囩尞鏉ユ簮')"
+                >
+                  {{ activeBox !== "b" ? "鏇村 鈭�" : "鏀惰捣 鈭�" }}
+                </p>
+              </li>
+            </ul>
+            <!-- 瀛︾ -->
+            <!-- <ul>
+              <li class="left-title">
+                <span>{{ subject.title }}</span>
+                <p @click="subject.isDisplay = !subject.isDisplay">
+                  <img
+                    :src="[subject.isDisplay ? topIcon : bottomIcon]"
+                    alt=""
+                  />
+                </p>
+              </li>
+              <li class="left-main" v-if="subject.isDisplay">
+                <div
+                  class="category-main"
+                  v-for="(item, index) in subject.list"
+                  :key="index"
+                >
+                  <el-checkbox
+                    class="el-checkbox"
+                    v-model="item.checked"
+                    :title="item.name"
+                    @change="subjectChange(item)"
+                    >{{ item.name }}</el-checkbox
+                  >
+                  <span class="">{{ item.num }}</span>
+                </div>
+              </li>
+            </ul> -->
+          </div>
+          <div
+            class="content-right"
+            v-loading="loading"
+            element-loading-text="妫�绱㈢粨鏋滃姞杞戒腑"
+            element-loading-spinner="el-icon-loading"
+            element-loading-background="rgba(0, 0, 0, 0)"
+          >
+            <!-- title閮ㄥ垎 -->
+            <ul class="right-header">
+              <li v-for="(item, index) in associationList" :key="index">
+                <p>{{ item.type }} : {{ item.content }}</p>
+                <img
+                  @click="removeAssociationList(item.content)"
+                  :src="errorIcon"
+                  alt=""
+                />
+              </li>
+            </ul>
+            <!-- 鍏眡x鏉� -->
+            <ul class="right-number">
+              <ul class="number-number">
+                鍏辨壘鍒�<span>{{ this.total }}</span
+                >鏉$粨鏋�
+              </ul>
+              <ul class="number-time">
+                鍙戣〃鏃堕棿
+                <span @click="sortChange()"
+                  ><img :src="!postedSortInfo ? sortBottom : sortTop" alt=""
+                /></span>
+              </ul>
+            </ul>
+            <!-- 缁撴灉灞曠ず -->
+            <ul
+              class="right-main"
+              v-for="(item, index) in resultList"
+              :key="index"
+            >
+              <li class="main-name">
+                <p>{{ item.name }}</p>
+                <p>
+                  <el-button @click="goPage(item.id)">璇︽儏</el-button>
+                  <el-button>AI鏅鸿兘闃呰</el-button>
+                </p>
+              </li>
+              <li class="main-sources">
+                <span>{{ item.resourceTypeName }}</span>
+                <span>{{ item.source }}</span>
+                <span>{{ item.year }}</span>
+                <span v-if="item.DOI">doi锛歿{ item.DOI }}</span>
+              </li>
+              <li class="main-author">
+                {{ item.author }}
+              </li>
+              <li
+                class="main-title"
+                :title="item.cleanAbstract"
+                v-if="item.abstract"
+              >
+                <span>鎽樿: </span>
+                <span
+                  class="page-main-abstract"
+                  v-html="item.cleanAbstract"
+                ></span>
+              </li>
+              <li
+                class="main-keyword"
+                v-if="item.keyWords && item.keyWords.length > 0"
+              >
+                <span>鍏抽敭璇嶏細</span>
+                <span
+                  class="keyWord"
+                  v-for="(citem, cindex) in item.keyWords"
+                  :key="cindex"
+                  @click="
+                    () =>
+                      handleSearch({
+                        text: citem,
+                        type: 'keyWords',
+                        label: '鍏抽敭璇�',
+                      })
+                  "
+                >
+                  {{ citem }}
+                </span>
+              </li>
+            </ul>
+            <!-- 鍒嗛〉 -->
+            <div class="pagination" v-if="total > 6">
+              <el-pagination
+                @current-change="handleCurrentChange"
+                class="msg-pagination-container"
+                :background="isBackground"
+                layout="prev, pager, next"
+                :total="total"
+                :page-size="6"
+              >
+              </el-pagination>
+            </div>
+            <el-empty v-if="!loading && !resultList.length"></el-empty>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
+import MyForm from "@/components/form/form.vue";
+import SearchBox from "@/views/home/components/searchBox.vue";
+import MG from "@/assets/js/middleGround/WebMiddleGroundApi.js";
+import moment from "moment";
+/* eslint-disable vue/no-unused-components */
 export default {
+  name: "achievements",
+  components: {
+    MyForm,
+    SearchBox,
+  },
+  data() {
+    return {
+      relatedList: [],
+      // 杈撳叆妗嗙殑鍐呭
+      inputValue: "",
+      // 閫夋嫨鐨勭被鍨�
+      inputType: "",
+      //绫诲瀷閫夋嫨
+      inputOptions: [
+        { value: "all", label: "鍏ㄩ儴" },
+        { value: "Name", label: "鏍囬" },
+        { value: "author", label: "浣滆��" },
+        { value: "keyWords", label: "鍏抽敭璇�" },
+        { value: "abstract", label: "鎽樿" },
+        { value: "source", label: "鏉ユ簮" },
+      ],
+      subjectAffiliationRefCode: "subjectAffiliation",
+      resourceTypeRefCode: "resourceType",
+      resourceTypeValueList: [],
+      errorIcon: require("@/assets/images/achievements/errorIcon.png"),
+      topIcon: require("@/assets/images/achievements/top-Icon.png"),
+      bottomIcon: require("@/assets/images/achievements/bottom-Icon.png"),
+      sortTop: require("@/assets/images/achievements/sort-top.png"),
+      sortBottom: require("@/assets/images/achievements/sort-bottom.png"),
+      isBackground: true,
+      isDisplay: false,
+      input3: "",
+      select: "",
+      checked: [],
+      optionlist: [
+        {
+          lable: "鏍囬",
+        },
+        {
+          lable: "浣滆��",
+        },
+        {
+          lable: "骞翠唤",
+        },
+        {
+          lable: "鍏抽敭璇�",
+        },
+        {
+          lable: "鎽樿",
+        },
+        {
+          lable: "鏉ユ簮",
+        },
+      ],
+      // 褰撳墠椤�
+      CurrentPage: 1,
+      // 楂樼骇鎼滅储
+      from: {
+        from: [
+          {
+            type: "input",
+            label: "鏍囥��棰�",
+            name: "Name",
+            value: "",
+          },
+          {
+            type: "input",
+            label: "浣溿��鑰�",
+            name: "author",
+            value: "",
+          },
+          {
+            type: "input",
+            label: "骞淬��浠�",
+            name: "year",
+            value: "",
+          },
+          {
+            type: "input",
+            label: "鍏抽敭璇�",
+            name: "keyword",
+            value: "",
+          },
+          {
+            type: "input",
+            label: "鎽樸��瑕�",
+            name: "abstract",
+            value: "",
+          },
+          {
+            type: "input",
+            label: "鏉ャ��婧�",
+            name: "source",
+            value: "",
+          },
+        ],
+      },
+      // 绫诲瀷
+      category: {
+        title: "绫诲瀷",
+        isDisplay: true,
+        id: "",
+        index: "",
+        list: [
+          {
+            name: "鏈熷垔",
+            num: 190,
+            check: false,
+          },
+          {
+            name: "鍥句功",
+            num: 190,
+            check: false,
+          },
+          {
+            name: "瑙嗛",
+            num: 190,
+            check: false,
+          },
+          {
+            name: "闊抽",
+            num: 190,
+            check: false,
+          },
+        ],
+      },
+      categoryChecList: [],
+      subjectCheckList: [],
 
-}
+      postedSortInfo: true,
+      // 骞村害
+      annual: {
+        title: "骞村害",
+        isDisplay: true,
+        id: "",
+        index: "",
+        list: [
+          {
+            years: "2025",
+            num: 10,
+            check: false,
+          },
+          {
+            years: "2024",
+            num: 18,
+            check: false,
+          },
+          {
+            years: "2023",
+            num: 21,
+            check: false,
+          },
+          {
+            years: "2022",
+            num: 19,
+            check: false,
+          },
+          {
+            years: "2021",
+            num: 22,
+            check: false,
+          },
+          {
+            years: "2020",
+            num: 24,
+            check: false,
+          },
+     
+        ],
+      },
+      // 鏂囩尞鏉ユ簮
+      sources: {
+        title: "鏂囩尞鏉ユ簮",
+        isDisplay: true,
+        id: "",
+        index: "",
+        list: [
+          {
+            name: "鍖椾含涓尰鑽ぇ瀛﹀ぇ瀛﹀鎶�",
+            num: 190,
+            check: false,
+          },
+          {
+            name: "鍖椾含甯堣寖澶у",
+            num: 19,
+            check: false,
+          },
+          {
+            name: "涓浗涓尰绉戝闄�",
+            num: 22,
+            check: false,
+          },
+          {
+            name: "鍖椾含涓尰鑽ぇ瀛﹀ぇ瀛﹀鎶�",
+            num: 31,
+            check: false,
+          },
+          {
+            name: "骞垮窞涓尰鑽ぇ瀛�",
+            num: 25,
+            check: false,
+          },
+  
+        ],
+      },
+      // 瀛︾
+      subject: {
+        title: "瀛︾",
+        isDisplay: true,
+        id: "",
+        index: "",
+        list: [
+          {
+            name: "鍖诲",
+            num: 190,
+            check: false,
+          },
+          {
+            name: "鍖诲",
+            num: 190,
+            check: false,
+          },
+          {
+            name: "鍖诲",
+            num: 190,
+            check: false,
+          },
+          {
+            name: "鍖诲",
+            num: 190,
+            check: false,
+          },
+          {
+            name: "鍖诲",
+            num: 190,
+            check: false,
+          },
+        ],
+      },
+      // 鐜板湪澶氬皯鏉¤亴涓氭暟鎹�
+      professionIndex: 4,
+      // 灞曞紑鍜屾敹缂╃殑鎸夐挳闇�瑕�
+      activeBox: null,
+      // 鐜板湪澶氬皯鏉℃椂鏈熸暟鎹�
+      dynastyIndex: 4,
+      // 鎵�鍏宠仈鍐呭
+      associationList: [],
+      // 鏌ヨ缁撴灉
+      resultList: [],
+      total: 0,
+      paginationPage: 1,
+      loading: false,
+      labelList: {
+        abstract: "鎽樿",
+        author: "浣滆��",
+        keyword: "鍏抽敭璇�",
+        source: "鏉ユ簮",
+        Name: "鏍囬",
+        year: "骞翠唤",
+      },
+    };
+  },
+  mounted() {
+    this.getSelectData();
+  },
+
+  methods: {
+    categoryChange(val) {
+      if (val.checked) {
+        this.categoryChecList.push(val.value);
+        this.associationList.push({
+          type: "绫诲瀷",
+          content: val.name,
+        });
+      } else {
+        const index = this.categoryChecList.findIndex(
+          (item) => item === val.value
+        );
+        const index2 = this.associationList.findIndex(
+          (item) => item.name === val.name
+        );
+        this.categoryChecList.splice(index, 1);
+        this.associationList.splice(index2, 1);
+      }
+      this.getItemList();
+    },
+
+    subjectChange(val) {
+      console.log(val, "val");
+      if (val.checked) {
+        this.subjectCheckList.push(val.value);
+      } else {
+        const index = this.subjectCheckList.findIndex(
+          (item) => item === val.value
+        );
+        this.subjectCheckList.splice(index, 1);
+      }
+      this.getItemList();
+    },
+
+    async onSubmit(val) {
+      console.log(val, "val");
+      console.log(this.associationList, "associationList");
+
+      for (let key in val) {
+        if (val[key] != "") {
+          const hasKey = this.associationList.find((item) => item.value == key);
+          if (!hasKey) {
+            this.associationList.push({
+              type: this.labelList[key],
+              content: val[key],
+              value: key,
+            });
+          }else {
+            hasKey.content = val[key]
+          }
+        }
+      }
+      this.getItemList();
+    },
+    //閲嶇疆鎼滅储缁撴灉
+    resetForm() {
+      // this.onSearch("");
+    },
+    // 椤甸潰璺宠浆
+    goPage(id) {
+      this.$router.push({ name: "details", query: { id } });
+    },
+    // 鏀惰捣鍜屽睍绀�
+    shrinkClick(key, name) {
+      if (name == "骞村害") {
+        this.professionIndex =
+          this.professionIndex < this.annual.list.length
+            ? this.annual.list.length
+            : 4;
+        this.dynastyIndex = 4;
+        this.activeBox = this.activeBox === "a" ? null : "a";
+      } else {
+        this.dynastyIndex =
+          this.dynastyIndex < this.sources.list.length
+            ? this.sources.list.length
+            : 4;
+        this.professionIndex = 4;
+        this.activeBox = this.activeBox === "b" ? null : "b";
+      }
+    },
+
+    //鑾峰彇涓嬫媺閫夋嫨妗嗙殑鍐呭
+    async getSelectData() {
+      try {
+        // 鍚屾椂鍙戣捣涓や釜寮傛璇锋眰锛屽苟绛夊緟瀹冧滑鐨勭粨鏋�
+        const [subjectListResult, resourceListResult] = await Promise.all([
+          this.getSelectContent(this.subjectAffiliationRefCode),
+          this.getSelectContent(this.resourceTypeRefCode),
+        ]);
+        console.log(subjectListResult.option);
+        this.subject.list = subjectListResult.option;
+        this.category.list = resourceListResult.option;
+        if (this.category.list && this.category.list.length) {
+          this.category.list.forEach((item) => {
+            this.resourceTypeValueList.push(item.value);
+          });
+        }
+        this.getItemList();
+      } catch (error) {
+        console.error("鑾峰彇涓嬫媺妗嗘暟鎹け璐�:", error);
+      }
+    },
+
+    //鑾峰彇閫夋嫨鍐呭
+    getSelectContent(refCode) {
+      let requestData = { refCodes: [refCode] };
+      return MG.store
+        .getProductTypeField(requestData)
+        .then((res) => {
+          const selestList = JSON.parse(res[0].config);
+          return selestList;
+        })
+        .catch((error) => {
+          console.error("鑾峰彇閫夋嫨鍐呭澶辫触:", error);
+          return null;
+        });
+    },
+
+    // 鍒犻櫎
+    removeAssociationList(value) {
+      this.associationList = this.associationList.filter(
+        (item) => item.content !== value
+      );
+      this.inputValue = "";
+      // 閫氱煡鐖剁粍浠舵暟鎹凡鏀瑰彉
+      this.getItemList();
+    },
+
+    // 鎼滅储
+    handleSearch(isText) {
+      console.log(isText, "isText");
+      this.associationList = [];
+      console.log(isText, "isText");
+      
+      if (isText.text != "") {
+        this.inputValue = isText.text;
+        this.inputType = isText.type;
+        this.associationList.push({
+          type: isText.label,
+          content: isText.text,
+          value: isText.type,
+        });
+        this.getItemList();
+      }
+    },
+
+    // 璇锋眰鏁版嵁
+    getItemList() {
+      this.loading = true;
+      let searchData = {}; // 鍒濆鍖栦竴涓┖瀵硅薄鏉ュ瓨鍌ㄦ悳绱㈡暟鎹�
+      if (this.inputValue) {
+        // 濡傛灉杈撳叆鍊煎瓨鍦�
+        if (this.inputType != "all") {
+          // 濡傛灉杈撳叆绫诲瀷涓嶆槸"all"
+          // 灏嗚緭鍏ュ�间笌杈撳叆绫诲瀷鍏宠仈锛屽苟娣诲姞涓�涓槦鍙�(*)浣滀负鍚庣紑
+          searchData[this.inputType + "*"] = this.inputValue;
+        } else {
+          // 濡傛灉杈撳叆绫诲瀷鏄�"all"
+          // 閬嶅巻杈撳叆閫夐」
+          for (let index = 0; index < this.inputOptions.length; index++) {
+            const item = this.inputOptions[index]; // 鑾峰彇褰撳墠閫夐」
+            if (item.value !== "all") {
+              // 濡傛灉褰撳墠閫夐」鐨勫�间笉鏄�"all"
+              if (!Object.keys(searchData).length) {
+                // 濡傛灉searchData鏄┖鐨�
+                // 灏嗙涓�涓�夐」鐨勫�间笌杈撳叆鍊煎叧鑱旓紝骞舵坊鍔犱竴涓槦鍙�(*)浣滀负鍚庣紑
+                searchData[item.value + "*"] = this.inputValue;
+              } else {
+                // 濡傛灉searchData涓嶆槸绌虹殑
+                // 浣跨敤"||"浣滀负鍓嶇紑锛屽皢鍚庣画閫夐」鐨勫�间笌杈撳叆鍊煎叧鑱旓紝骞舵坊鍔犱竴涓槦鍙�(*)浣滀负鍚庣紑
+                // 杩欓�氬父鐢ㄤ簬鏋勫缓涓�涓�昏緫鎴栵紙OR锛夋煡璇�
+                searchData["||" + item.value + "*"] = this.inputValue;
+              }
+            }
+          }
+        }
+      }
+      console.log(searchData, "searchData1");
+
+      if (this.associationList && this.associationList.length) {
+        this.associationList.forEach((item) => {
+          if (item.value == "year") {
+            const endDate = item.content.split("/")[0] + "/12/31 23:59:59";
+            const startDate = item.content.split("/")[0] + "/01/01 00:00:00";
+            searchData[item.value + ">="] = startDate;
+            searchData[item.value + "<="] = endDate;
+          } else if (item.value) {
+            searchData[item.value + "*"] = item.content;
+          }
+        });
+      }
+      console.log(searchData, "searchData");
+      MG.resource
+        .getItem({
+          path: "*",
+          queryType: "*",
+          paging: {
+            start: (this.paginationPage - 1) * 6,
+            size: 6,
+          },
+          sort: {
+            year: this.postedSortInfo ? "Desc" : "Asc",
+          },
+          fields: {
+            cmsType: ["cmsItem"],
+            "resourceType*":
+              this.categoryChecList.length > 0
+                ? this.categoryChecList
+                : this.resourceTypeValueList,
+            source: [],
+            year: [],
+            abstract: [],
+            keyWords: [],
+            author: [],
+            DOI: [],
+            AIReading: [],
+            file: [],
+            IssueNumber: [],
+            "subjectAffiliation*": this.subjectCheckList,
+            ...searchData,
+          },
+        })
+        .then((res) => {
+          console.log(res, "鍏ㄩ儴鍐呭");
+
+          res.datas.forEach((item) => {
+            item.year = moment(item.year).format("YYYY-MM-DD");
+            if (typeof item.keyWords === "string") {
+              item.keyWords = item.keyWords.split(";;");
+            } else {
+              // 璁剧疆涓�涓粯璁ゅ�兼垨鑰呰繘琛屽叾浠栭敊璇鐞�
+              item.keyWords = [];
+            }
+            if (item.abstract) {
+              item.cleanAbstract = item.abstract.replace(/<[^>]+>/g, "");
+            }
+
+            const foundItem = this.category.list.find(
+              (citem) => citem.value == item.cmsItemType
+            );
+            item.resourceTypeName = foundItem ? foundItem.name : "";
+          });
+          this.resultList = res.datas;
+          this.total = res.total;
+          this.loading = false;
+        })
+        .catch((error) => {
+          // 鎵撳嵃閿欒淇℃伅
+          console.error("鑾峰彇鏁版嵁澶辫触:", error);
+        });
+
+      // 婊氬姩鍒伴〉闈㈤《閮�
+      this.$nextTick(() => {
+        const pageMain = document.querySelector(".page-main-father");
+        if (pageMain) {
+          pageMain.scrollTo({
+            top: 0,
+            behavior: "smooth",
+          });
+        }
+      });
+    },
+    // 澶勭悊椤电爜鍙樺寲
+    handleCurrentChange(newPage) {
+      this.paginationPage = newPage;
+      this.getItemList(); // 閲嶆柊鑾峰彇鏁版嵁
+      // 婊氬姩鍒伴〉闈㈤《閮�
+      this.$nextTick(() => {
+        const pageMain = document.querySelector(".page-main-father");
+        if (pageMain) {
+          pageMain.scrollTo({
+            top: 0,
+            behavior: "smooth",
+          });
+        }
+      });
+    },
+    sortChange() {
+      this.postedSortInfo = !this.postedSortInfo;
+      this.getItemList();
+    },
+  },
+};
 </script>
 
-<style>
+<style lang="less" scoped>
+.page {
+  width: 100%;
+  height: 100%;
+  box-sizing: border-box;
+  background-color: #e9e1d4;
+  position: relative;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
+}
 
-</style>
\ No newline at end of file
+.page-header {
+  padding: 8px 0;
+  height: 9.4%;
+  width: 100%;
+  text-align: left;
+  border-bottom: 2px solid #937950;
+  background-color: #e9e1d4;
+  position: sticky;
+  top: 0;
+  z-index: 100;
+
+  p {
+    height: 100%;
+    font-family: Alimama DongFangDaKai;
+    font-size: 30px;
+    text-indent: 1em;
+    border-bottom: 1px solid #937950;
+    display: flex;
+    align-items: center;
+  }
+}
+
+::v-deep .el-loading-spinner {
+  .el-loading-text {
+    font-size: 14px;
+    color: #937950;
+  }
+
+  .el-icon-loading {
+    font-size: 14px;
+    color: #937950;
+  }
+}
+
+.page-main-father {
+  flex: 1;
+  width: 100%;
+  height: 100%;
+  min-width: 1200px;
+  overflow: auto;
+  padding-top: 1%;
+  padding-bottom: 2%;
+}
+
+.page-main {
+  width: 77.3%;
+  margin: 0 auto;
+  margin-top: 1%;
+  margin-bottom: 1%;
+}
+
+.page-input {
+  width: 100%;
+  display: flex;
+  background-color: #fefbf5;
+  border: 1px solid #e4dace;
+
+  ::v-deep(.input-main) {
+    padding: 15px 0;
+    display: flex;
+    justify-content: center;
+    width: 90%;
+    border-right: 2px solid #e4dace;
+    font-weight: bold;
+
+    .input-with-select {
+      width: 50%;
+      font-weight: bold;
+    }
+
+    .el-select .el-input.is-focus .el-input__inner {
+      color: #937950 !important;
+      border-color: #937950 !important;
+      font-weight: bold;
+    }
+
+    .el-select-dropdown__item.selected {
+      color: #937950 !important;
+      font-weight: bold;
+    }
+
+    .el-select .el-input__inner:focus {
+      border-color: #937950;
+      font-weight: bold;
+    }
+
+    .el-select .el-input__inner {
+      font-family: Source Han Sans;
+      font-size: 14px;
+      font-weight: bold;
+      color: #2c2c2c;
+    }
+  }
+
+  .input-txt {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 10%;
+    padding: 15px 0;
+    font-family: Source Han Sans;
+    font-size: 14px;
+    font-weight: bold;
+    color: #6f5a3a;
+    cursor: pointer;
+
+    img {
+      width: 10px;
+      height: auto;
+      margin-left: 5px;
+    }
+  }
+}
+
+.page-search {
+  width: 100%;
+  background-color: #fefbf5;
+  border-bottom: 1px solid #e4dace;
+  border-left: 1px solid #e4dace;
+  border-right: 1px solid #e4dace;
+  padding: 13px 0px;
+  display: flex;
+  justify-content: center;
+
+  .myfrom {
+    width: 80%;
+
+    ::v-deep .flex-center {
+      height: 80% !important;
+    }
+
+    ::v-deep .Formbtn {
+      width: 100% !important;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+
+      .el-button {
+        width: 68px !important;
+        height: 32px !important;
+        font-size: 14px;
+        background-color: transparent;
+        color: #937950;
+        border: 1px solid #937950;
+        cursor: pointer;
+
+        &:hover {
+          background-color: #937950;
+          color: #fffdf8;
+        }
+      }
+    }
+  }
+}
+
+.page-content {
+  width: 100%;
+  margin-top: 20px;
+  background-color: #fefbf5;
+  border: 1px solid #e4dace;
+  display: flex;
+
+  .content-left {
+    width: 19.5%;
+    border-bottom: 1px solid #e4dace;
+  }
+
+  .left-title {
+    padding: 7px 7px 9px 10px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    border-right: 1px solid #e4dace;
+    border-bottom: 1px solid #e4dace;
+
+    span {
+      margin-right: 20px;
+      font-family: Source Han Sans;
+      font-size: 14px;
+      font-weight: bold;
+    }
+
+    .sort-Icon {
+      cursor: pointer;
+      height: 12px;
+      width: auto;
+    }
+
+    img {
+      cursor: pointer;
+      height: 4px;
+      width: auto;
+    }
+  }
+
+  .left-main {
+    border-right: 1px solid #e4dace;
+    border-bottom: 1px solid #e4dace;
+    padding: 10px;
+    display: flex;
+    flex-wrap: wrap;
+  }
+
+  .category-main {
+    width: 50%;
+    margin-bottom: 10px;
+    display: flex;
+    align-items: center;
+
+    span {
+      font-family: Source Han Sans;
+      font-size: 12px;
+      color: #8f7a5a;
+    }
+  }
+
+  .annual-main {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 10px;
+
+    span {
+      font-family: Source Han Sans;
+      font-size: 12px;
+      color: #8f7a5a;
+    }
+  }
+
+  .annual-footer {
+    cursor: pointer;
+    width: 100%;
+    text-align: center;
+    font-family: Source Han Sans;
+    font-size: 12px;
+    font-weight: 350;
+    color: #937950;
+  }
+
+  .sources-main {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 10px;
+
+    span {
+      font-family: Source Han Sans;
+      font-size: 12px;
+      color: #8f7a5a;
+    }
+  }
+
+  .el-checkbox {
+    vertical-align: middle;
+    font-family: "Tahoma";
+    width: 70%;
+    vertical-align: middle;
+  }
+
+  /* 璁剧疆榧犳爣缁忚繃瀵瑰嬀妗嗭紝瀵瑰嬀妗嗚竟妗嗙殑棰滆壊 */
+  ::v-deep .el-checkbox .el-checkbox__inner:hover {
+    border-color: #d1d1d1;
+  }
+
+  /* 璁剧疆checkbox鑾峰緱鐒︾偣鍚庯紝瀵瑰嬀妗嗙殑杈规棰滆壊 */
+  ::v-deep .el-checkbox .el-checkbox__input.is-focus .el-checkbox__inner {
+    border-color: #d1d1d1;
+  }
+
+  ::v-deep .el-checkbox .el-checkbox__input.is-checked + .el-checkbox__label {
+    color: #2c2c2c;
+  }
+
+  ::v-deep .el-checkbox .el-checkbox__input.is-checked .el-checkbox__inner,
+  ::v-deep
+    .el-checkbox
+    .el-checkbox__input.is-indeterminate
+    .el-checkbox__inner {
+    border-color: #8f7a5a;
+    background-color: #8f7a5a;
+  }
+
+  ::v-deep .el-checkbox__label {
+    color: #2c2c2c;
+    width: 100%;
+    font-family: Source Han Sans;
+    font-size: 12px;
+    font-weight: bold;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    /* 瓒呭嚭閮ㄥ垎鏄剧ず鐪佺暐鍙� */
+    vertical-align: middle;
+  }
+
+  .sources-footer {
+    cursor: pointer;
+    width: 100%;
+    text-align: center;
+    font-family: Source Han Sans;
+    font-size: 12px;
+    font-weight: 350;
+    color: #937950;
+  }
+
+  .content-right {
+    width: 80.5%;
+    padding: 14px 20px 20px 14px;
+
+    .right-header {
+      display: flex;
+      flex-wrap: wrap;
+
+      li {
+        background: #ffffff;
+        border: 1px solid #937950;
+        padding: 3px 10px;
+        margin-right: 13px;
+        display: flex;
+        align-items: center;
+        font-family: Poppins;
+        font-size: 13px;
+        color: #937950;
+        line-height: 20px;
+        margin-bottom: 10px;
+
+        img {
+          cursor: pointer;
+          height: 16px;
+          width: auto;
+          margin-left: 5px;
+        }
+      }
+    }
+
+    .right-number {
+      display: flex;
+      justify-content: flex-end;
+      align-items: flex-start;
+      margin-bottom: 12px;
+
+      .number-number {
+        font-family: Source Han Sans;
+        font-weight: 350;
+        font-size: 14px;
+        color: #2c2c2c;
+        margin-right: 20px;
+
+        span {
+          color: #937950;
+          margin: 0 10px;
+        }
+      }
+
+      .number-time {
+        font-family: Source Han Sans;
+        font-size: 12px;
+        font-weight: 350;
+        color: #2c2c2c;
+
+        span {
+          margin-left: 11px;
+        }
+
+        img {
+          height: 12px;
+          width: auto;
+        }
+      }
+    }
+
+    .right-main {
+      margin-bottom: 20px;
+      padding: 19px 30px 15px 30px;
+      border: 1px solid #decaac;
+
+      .main-name {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        font-family: Source Han Sans;
+        font-size: 16px;
+        font-weight: bold;
+        color: #937950;
+        margin-bottom: 5px;
+
+        p {
+          overflow: hidden;
+        }
+
+        ::v-deep .el-button {
+          font-size: 14px;
+          background-color: transparent;
+          color: #937950;
+          border: 1px solid #937950;
+          border-radius: 0;
+
+          &:hover {
+            background-color: #937950;
+            color: #fffdf8;
+          }
+        }
+      }
+
+      .main-sources {
+        span:nth-child(1) {
+          padding: 3px 5px;
+          background-color: #87a8b9;
+          color: #fff;
+          margin-right: 10px;
+        }
+
+        span:nth-child(2) {
+          font-family: Source Han Sans;
+          font-size: 12px;
+          font-weight: 350;
+          padding-right: 10px;
+          color: #333;
+        }
+
+        span:nth-child(3) {
+          font-family: Source Han Sans;
+          font-size: 12px;
+          font-weight: 350;
+          padding-left: 10px;
+          padding-right: 10px;
+          color: #333;
+          border-left: 1px solid #2c2c2c;
+        }
+
+        span:nth-child(4) {
+          font-family: Source Han Sans;
+          font-size: 12px;
+          font-weight: 350;
+          padding-left: 10px;
+          color: #333;
+          border-left: 1px solid #2c2c2c;
+        }
+
+        margin-bottom: 15px;
+      }
+
+      .main-author {
+        margin-bottom: 12px;
+        font-family: Source Han Sans;
+        font-size: 12px;
+        font-weight: 350;
+        color: #333;
+      }
+
+      .main-title {
+        margin-bottom: 15px;
+        font-family: Source Han Sans;
+        font-size: 14px;
+        font-weight: 350;
+        line-height: 26px;
+        color: #333333;
+        overflow: hidden;
+        display: -webkit-box;
+        -webkit-box-orient: vertical;
+        -webkit-line-clamp: 3;
+
+        span {
+          font-family: Source Han Sans;
+          font-weight: 700;
+          font-size: 14px;
+        }
+      }
+
+      .page-main-abstract {
+        font-family: Source Han Sans !important;
+        font-size: 14px !important;
+        font-weight: 350 !important;
+        line-height: 26px !important;
+        color: #333333 !important;
+      }
+
+      .main-keyword {
+        span:nth-child(1) {
+          font-family: Source Han Sans;
+          font-weight: 700;
+          font-size: 14px;
+        }
+
+        .keyWord {
+          cursor: pointer;
+          padding: 5px 10px;
+          color: #937950;
+          border: 1px solid #937950;
+          font-family: Source Han Sans;
+          font-size: 12px;
+          font-weight: 350;
+          line-height: 28px;
+          margin-right: 13px;
+        }
+      }
+    }
+  }
+}
+
+.pagination {
+  display: flex;
+  justify-content: center;
+}
+
+el-input__suffix {
+  right: 22px;
+  color: #999;
+}
+
+:deep .msg-pagination-container.is-background .el-pager li {
+  /*瀵归〉鏁扮殑鏍峰紡杩涜淇敼*/
+  background-color: transparent;
+  color: #333333;
+  border-radius: 5px;
+  border: 1px solid #cccccc;
+}
+
+:deep.msg-pagination-container.is-background .btn-next {
+  /*瀵逛笅涓�椤电殑鎸夐挳鏍峰紡杩涜淇敼*/
+  background-color: transparent;
+  color: #333333;
+  border-radius: 5px;
+  border: 1px solid #cccccc;
+}
+
+:deep.msg-pagination-container.is-background .btn-prev {
+  /*瀵逛笂涓�椤电殑鎸夐挳鏍峰紡杩涜淇敼*/
+  background-color: transparent;
+  color: #333333;
+  border-radius: 5px;
+  border: 1px solid #cccccc;
+}
+
+:deep.msg-pagination-container.is-background
+  .el-pager
+  li:not(.disabled).active {
+  /*褰撳墠閫変腑椤垫暟鐨勬牱寮忚繘琛屼慨鏀�*/
+  background-color: #937950;
+  color: #fff;
+  border-radius: 5px;
+  border: 1px solid #cccccc;
+}
+:deep.el-pagination.is-background .el-pager li:not(.disabled):hover{
+  color: #937950
+}
+</style>
+
+<style>
+.el-input.is-focus .el-input__inner {
+  color: #937950 !important;
+  border-color: #937950 !important;
+  font-weight: bold;
+}
+
+.el-select-dropdown__item.selected {
+  color: #937950 !important;
+  font-weight: bold;
+}
+
+.el-select .el-input__inner:focus {
+  border-color: #937950;
+  font-weight: bold;
+}
+</style>

--
Gitblit v1.9.1