From 5e73d562bae941a7658c3c13fdb585461f1a24e4 Mon Sep 17 00:00:00 2001 From: zhongshujie <2862698242@qq.com> Date: 星期一, 28 四月 2025 21:21:07 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/wyyDatabase --- src/views/achievements/details.vue | 1535 +++++++++++++++++++++++++++++++++++++--------------------- 1 files changed, 967 insertions(+), 568 deletions(-) diff --git a/src/views/achievements/details.vue b/src/views/achievements/details.vue index e504786..e3708e1 100644 --- a/src/views/achievements/details.vue +++ b/src/views/achievements/details.vue @@ -1,613 +1,1012 @@ <template> - <div class="page"> - <div class="page-header"> - <p>鐜嬫案鐐庨櫌澹鏈垚鏋�</p> - </div> - <ul class="page-main"> - <li class="page-main-name"> - <p><el-button icon="el-icon-arrow-left" @click="goBack()">杩斿洖</el-button></p> - <p>{{ detailsList.name }}</p> - </li> - <li class="page-main-time"> - <p> - <span>{{ detailsList.sources }}</span> - <span>{{ detailsList.time }}</span> - </p> - </li> - <li class="page-main-title"> - <p> - <span v-for="(item, index) in detailsList.characterList" :key="index">{{ item.name }}</span> - </p> - <p> - <span>鎽樿锛�</span>{{ detailsList.title }} - </p> - <p> - <span>鍏抽敭璇嶏細</span> - <span class="page-main-keyword" v-for="(item, index) in detailsList.keyword" :key="index">{{ - item.name }}</span> - </p> - <p> - <el-button >鏌ョ湅鍏ㄦ枃</el-button> - </p> - <p class="page-main-video"> - <video :src="detailsList.videoUrl" controls autoplay class="video" width="70%"></video> - </p> - <p class="page-main-audio"> - <audio :src="detailsList.videoUrl" controls autoplay class="video" width="100%"></audio> - </p> - </li> - <li class="page-main-literature"> - <p class="literature-header">鐩稿叧鏂囩尞</p> - <div class="content-right"> - <!-- 缁撴灉灞曠ず --> - <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)">璇︽儏</el-button> - <el-button>AI鏅鸿兘闃呰</el-button> - </p> - </li> - <li class="main-sources"> - <span>{{ item.type }}</span> - <span>{{ item.sources }}</span> - <span>{{ item.time }}</span> - </li> - <li class="main-author"> - {{ item.author }} - </li> - <li class="main-title" :title="item.title"> - <span>鎽樿: </span>{{ item.title }} - </li> - <li class="main-keyword"> - <span>鍏抽敭璇嶏細</span> - <span class="keyWord" v-for="(citem, cindex) in item.keyword" :key="cindex"> - {{ citem.name }} - </span> - </li> - </ul> - </div> - </li> - </ul> + <div class="page"> + <div class="page-header"> + <p><span>鐜嬫案鐐庨櫌澹鏈垚鏋�</span></p> </div> + <div class="page-main-father"> + <ul class="page-main"> + <li class="page-main-name"> + <p> + <el-button icon="el-icon-arrow-left" @click="goBack()">杩斿洖</el-button> + </p> + <p>{{ details.name }}</p> + </li> + <li class="page-main-time"> + <p> + <span>{{ details.source }}</span> + <span>{{ details.year }}</span> + <span v-if="details.DOI">doi锛歿{ details.DOI }}</span> + </p> + </li> + <li class="page-main-title"> + <p> + <span v-for="(item, index) in details.author" :key="index">{{ item }}</span> + </p> + <p v-if="details.cleanAbstract"> + <span class="abstract-title">鎽樿锛�</span> + <span class="page-main-abstract-main" v-html="details.cleanAbstract"></span> + </p> + <p v-if="details.keyWords && details.keyWords.length > 0"> + <span>鍏抽敭璇嶏細</span> + <span class="page-main-keyword" v-for="(item, index) in details.keyWords" :key="index">{{ item + }}</span> + </p> + <p v-if="details.cmsItemType != 'video' && details.cmsItemType != 'audio'"> + <el-button @click="openPdf(details.name)">鏌ョ湅鍏ㄦ枃</el-button> + </p> + <p class="page-main-video" v-if="details.cmsItemType == 'video'"> + <video :src="details.src" controls autoplay class="video" width="70%"></video> + </p> + <p class="page-main-audio" v-if="details.cmsItemType == 'audio'"> + <audio :src="details.src" controls autoplay class="video" width="100%"></audio> + </p> + </li> + <li class="page-main-literature"> + <p class="literature-header">鐩稿叧鏂囩尞</p> + <div class="content-right" v-loading="loading" element-loading-text="妫�绱㈢粨鏋滃姞杞戒腑" + element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0)"> + <!-- 缁撴灉灞曠ず --> + <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.abstract" v-if="item.cleanAbstract"> + <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"> + {{ citem }} + </span> + </li> + </ul> + </div> + </li> + </ul> + </div> + <el-empty v-if="!loading && details == ''"></el-empty> + <el-dialog v-model="dialogVisible" :title="pdfName" width="60vw" top="3vh" bottom="2vh" + :visible.sync="dialogVisible" class="custom-dialog"> + <div class="pdfInfoBox" v-loading="pdfLoading" element-loading-text="鍥剧墖鍔犺浇涓�" + element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0)"> + <div v-for="(item, index) in pdfList" :key="index" class="pdfItem" :page="index + 1"> + <img :src="item.showSrc" alt="" style="min-height: 550px" loading="lazy" /> + <el-divider content-position="center"> 绗� {{ index + 1 }} 椤� </el-divider> + </div> + </div> + <el-empty v-if="!pdfLoading && !pdfList.length"></el-empty> + </el-dialog> + </div> </template> <script> +import { requestCtx, appRefCode } from "@/assets/js/config"; +import fileApi from "@/assets/js/middleGround/api/file"; +import MG from "@/assets/js/middleGround/WebMiddleGroundApi.js"; +import moment from "moment"; export default { - data() { - return { - isDisplay: false, - detailsList: { - name: "涓嵂闂告煖鐨勫巻鍙蹭紶鎵夸笌鏂版椂浠e彂灞曟�濊��", - sources: "鍖椾含涓尰鑽ぇ瀛﹀鎶�", - time: "2025-02-24", - characterList: [ - { - name: "鏉ㄦ担鑿�" - }, - { - name: "鏉ㄦ担鑿�" - }, - { - name: "鏉ㄦ担鑿�" - }, - { - name: "鏉ㄦ担鑿�" - }, - ], - title: "涓嵂闂告煖鏄紶缁熶腑鑽皟鍓傜殑楂樼骇绠$悊浜哄憳锛屽湪'鍓嶅簵鍚庡巶寮�'涓嵂鎴垮彂鎸ラ噸瑕佷綔鐢ㄥ拰鍏抽敭鑱岃兘銆備紶鎵夸腑鑽椄鏌滅殑瀹濊吹瀛︽湳缁忛獙涓庝紭绉�鏂囧寲瀵瑰帢娓呬腑鑽瀛︾鍙戝睍鑴夌粶銆佽鑼冧腑鑽皟鍓傛妧鏈搷浣溿�佷績杩涜�佽嵂宸ユ妧鑹�'娲绘�佷紶鎵�'鍏锋湁閲嶈绉戝浠峰�煎拰鐜板疄鎰忎箟銆傞潰鍚戞柊鏃朵唬銆佸紑鍚柊鎬濈淮锛屾湰鏂囧鑰佸瓧鍙蜂腑鑽摵鐨勫叴璧峰拰涓嵂闂告煖杩涜鑰冭瘉锛屽垎鏋愪腑鑽椄鏌滅殑宀椾綅璐d换銆佷紶鎵胯矾寰勫強鏈潵鍙戝睍锛屾彁鍑洪珮绱犺川涓嵂闂告煖浜烘墠鍩瑰吇绛栫暐锛屾棬鍦ㄥ煿鍏荤鍚堝綋浠gぞ浼氶渶姹傜殑涓嵂琛屼笟澶嶅悎鍨嬪垱鏂颁汉鎵嶃�備腑鑽椄鏌滄槸浼犵粺涓嵂璋冨墏鐨勯珮绾х鐞嗕汉鍛橈紝鍦�'鍓嶅簵鍚庡巶寮�'涓嵂鎴垮彂鎸ラ噸瑕佷綔鐢ㄥ拰鍏抽敭鑱岃兘銆備紶鎵夸腑鑽椄鏌滅殑瀹濊吹瀛︽湳缁忛獙涓庝紭绉�鏂囧寲瀵瑰帢娓呬腑鑽瀛︾鍙戝睍鑴夌粶銆佽鑼冧腑鑽皟鍓傛妧鏈搷浣溿�佷績杩涜�佽嵂宸ユ妧鑹�'娲绘�佷紶鎵�'鍏锋湁閲嶈绉戝浠峰�煎拰鐜板疄鎰忎箟銆傞潰鍚戞柊鏃朵唬銆佸紑鍚柊鎬濈淮锛屾湰鏂囧鑰佸瓧鍙蜂腑鑽摵鐨勫叴璧峰拰涓嵂闂告煖杩涜鑰冭瘉锛屽垎鏋愪腑鑽椄鏌滅殑宀椾綅璐d换銆佷紶鎵胯矾寰勫強鏈潵鍙戝睍锛屾彁鍑洪珮绱犺川涓嵂闂告煖浜烘墠鍩瑰吇绛栫暐锛屾棬鍦ㄥ煿鍏荤鍚堝綋浠gぞ浼氶渶姹傜殑涓嵂琛屼笟澶嶅悎鍨嬪垱鏂颁汉鎵嶃��", - keyword: [ - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - ], - videoUrl: "https://www.w3schools.com/html/mov_bbb.mp4", - audioMd5: "", - }, - // 鏌ヨ缁撴灉 - resultList: [ - { - name: "涓嵂闂告煖鐨勫巻鍙蹭紶鎵夸笌鏂版椂浠e彂灞曟�濊��", - sources: "鍖椾含涓尰鑽ぇ瀛﹀鎶�", - type: "鏈熷垔", - author: "鏉ㄦ担鑿� 鍖椾含涓尰鑽ぇ瀛︿腑鑽闄紱璧靛ぉ鎴� 鍖椾含甯堣寖澶у", - time: "2025-02-24 09:21", - title: "涓嵂闂告煖鏄紶缁熶腑鑽皟鍓傜殑楂樼骇绠$悊浜哄憳锛屽湪'鍓嶅簵鍚庡巶寮�'涓嵂鎴垮彂鎸ラ噸瑕佷綔鐢ㄥ拰鍏抽敭鑱岃兘銆備紶鎵夸腑鑽椄鏌滅殑瀹濊吹瀛︽湳缁忛獙涓庝紭绉�鏂囧寲瀵瑰帢娓呬腑鑽瀛︾鍙戝睍鑴夌粶銆佽鑼冧腑鑽皟鍓傛妧鏈搷浣溿�佷績杩涜�佽嵂宸ユ妧鑹�'娲绘�佷紶鎵�'鍏锋湁閲嶈绉戝浠峰�煎拰鐜板疄鎰忎箟銆傞潰鍚戞柊鏃朵唬銆佸紑鍚柊鎬濈淮锛屾湰鏂囧鑰佸瓧鍙蜂腑鑽摵鐨勫叴璧峰拰涓嵂闂告煖杩涜鑰冭瘉锛屽垎鏋愪腑鑽椄鏌滅殑宀椾綅璐d换銆佷紶鎵胯矾寰勫強鏈潵鍙戝睍锛屾彁鍑洪珮绱犺川涓嵂闂告煖浜烘墠鍩瑰吇绛栫暐锛屾棬鍦ㄥ煿鍏荤鍚堝綋浠gぞ浼氶渶姹傜殑涓嵂琛屼笟澶嶅悎鍨嬪垱鏂颁汉鎵嶃��", - keyword: [ - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - ] - - }, - { - name: "涓嵂闂告煖鐨勫巻鍙蹭紶鎵夸笌鏂版椂浠e彂灞曟�濊��", - sources: "鍖椾含涓尰鑽ぇ瀛﹀鎶�", - type: "鏈熷垔", - author: "鏉ㄦ担鑿� 鍖椾含涓尰鑽ぇ瀛︿腑鑽闄紱璧靛ぉ鎴� 鍖椾含甯堣寖澶у", - time: "2025-02-24 09:21", - title: "涓嵂闂告煖鏄紶缁熶腑鑽皟鍓傜殑楂樼骇绠$悊浜哄憳锛屽湪'鍓嶅簵鍚庡巶寮�'涓嵂鎴垮彂鎸ラ噸瑕佷綔鐢ㄥ拰鍏抽敭鑱岃兘銆備紶鎵夸腑鑽椄鏌滅殑瀹濊吹瀛︽湳缁忛獙涓庝紭绉�鏂囧寲瀵瑰帢娓呬腑鑽瀛︾鍙戝睍鑴夌粶銆佽鑼冧腑鑽皟鍓傛妧鏈搷浣溿�佷績杩涜�佽嵂宸ユ妧鑹�'娲绘�佷紶鎵�'鍏锋湁閲嶈绉戝浠峰�煎拰鐜板疄鎰忎箟銆傞潰鍚戞柊鏃朵唬銆佸紑鍚柊鎬濈淮锛屾湰鏂囧鑰佸瓧鍙蜂腑鑽摵鐨勫叴璧峰拰涓嵂闂告煖杩涜鑰冭瘉锛屽垎鏋愪腑鑽椄鏌滅殑宀椾綅璐d换銆佷紶鎵胯矾寰勫強鏈潵鍙戝睍锛屾彁鍑洪珮绱犺川涓嵂闂告煖浜烘墠鍩瑰吇绛栫暐锛屾棬鍦ㄥ煿鍏荤鍚堝綋浠gぞ浼氶渶姹傜殑涓嵂琛屼笟澶嶅悎鍨嬪垱鏂颁汉鎵嶃�備腑鑽椄鏌滄槸浼犵粺涓嵂璋冨墏鐨勯珮绾х鐞嗕汉鍛橈紝鍦�'鍓嶅簵鍚庡巶寮�'涓嵂鎴垮彂鎸ラ噸瑕佷綔鐢ㄥ拰鍏抽敭鑱岃兘銆備紶鎵夸腑鑽椄鏌滅殑瀹濊吹瀛︽湳缁忛獙涓庝紭绉�鏂囧寲瀵瑰帢娓呬腑鑽瀛︾鍙戝睍鑴夌粶銆佽鑼冧腑鑽皟鍓傛妧鏈搷浣溿�佷績杩涜�佽嵂宸ユ妧鑹�'娲绘�佷紶鎵�'鍏锋湁閲嶈绉戝浠峰�煎拰鐜板疄鎰忎箟銆傞潰鍚戞柊鏃朵唬銆佸紑鍚柊鎬濈淮锛屾湰鏂囧鑰佸瓧鍙蜂腑鑽摵鐨勫叴璧峰拰涓嵂闂告煖杩涜鑰冭瘉锛屽垎鏋愪腑鑽椄鏌滅殑宀椾綅璐d换銆佷紶鎵胯矾寰勫強鏈潵鍙戝睍锛屾彁鍑洪珮绱犺川涓嵂闂告煖浜烘墠鍩瑰吇绛栫暐锛屾棬鍦ㄥ煿鍏荤鍚堝綋浠gぞ浼氶渶姹傜殑涓嵂琛屼笟澶嶅悎鍨嬪垱鏂颁汉鎵嶃��", - keyword: [ - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - ] - - }, - { - name: "涓嵂闂告煖鐨勫巻鍙蹭紶鎵夸笌鏂版椂浠e彂灞曟�濊��", - sources: "鍖椾含涓尰鑽ぇ瀛﹀鎶�", - type: "鏈熷垔", - author: "鏉ㄦ担鑿� 鍖椾含涓尰鑽ぇ瀛︿腑鑽闄紱璧靛ぉ鎴� 鍖椾含甯堣寖澶у", - time: "2025-02-24 09:21", - title: "涓嵂闂告煖鏄紶缁熶腑鑽皟鍓傜殑楂樼骇绠$悊浜哄憳锛屽湪'鍓嶅簵鍚庡巶寮�'涓嵂鎴垮彂鎸ラ噸瑕佷綔鐢ㄥ拰鍏抽敭鑱岃兘銆備紶鎵夸腑鑽椄鏌滅殑瀹濊吹瀛︽湳缁忛獙涓庝紭绉�鏂囧寲瀵瑰帢娓呬腑鑽瀛︾鍙戝睍鑴夌粶銆佽鑼冧腑鑽皟鍓傛妧鏈搷浣溿�佷績杩涜�佽嵂宸ユ妧鑹�'娲绘�佷紶鎵�'鍏锋湁閲嶈绉戝浠峰�煎拰鐜板疄鎰忎箟銆傞潰鍚戞柊鏃朵唬銆佸紑鍚柊鎬濈淮锛屾湰鏂囧鑰佸瓧鍙蜂腑鑽摵鐨勫叴璧峰拰涓嵂闂告煖杩涜鑰冭瘉锛屽垎鏋愪腑鑽椄鏌滅殑宀椾綅璐d换銆佷紶鎵胯矾寰勫強鏈潵鍙戝睍锛屾彁鍑洪珮绱犺川涓嵂闂告煖浜烘墠鍩瑰吇绛栫暐锛屾棬鍦ㄥ煿鍏荤鍚堝綋浠gぞ浼氶渶姹傜殑涓嵂琛屼笟澶嶅悎鍨嬪垱鏂颁汉鎵嶃�備腑鑽椄鏌滄槸浼犵粺涓嵂璋冨墏鐨勯珮绾х鐞嗕汉鍛橈紝鍦�'鍓嶅簵鍚庡巶寮�'涓嵂鎴垮彂鎸ラ噸瑕佷綔鐢ㄥ拰鍏抽敭鑱岃兘銆備紶鎵夸腑鑽椄鏌滅殑瀹濊吹瀛︽湳缁忛獙涓庝紭绉�鏂囧寲瀵瑰帢娓呬腑鑽瀛︾鍙戝睍鑴夌粶銆佽鑼冧腑鑽皟鍓傛妧鏈搷浣溿�佷績杩涜�佽嵂宸ユ妧鑹�'娲绘�佷紶鎵�'鍏锋湁閲嶈绉戝浠峰�煎拰鐜板疄鎰忎箟銆傞潰鍚戞柊鏃朵唬銆佸紑鍚柊鎬濈淮锛屾湰鏂囧鑰佸瓧鍙蜂腑鑽摵鐨勫叴璧峰拰涓嵂闂告煖杩涜鑰冭瘉锛屽垎鏋愪腑鑽椄鏌滅殑宀椾綅璐d换銆佷紶鎵胯矾寰勫強鏈潵鍙戝睍锛屾彁鍑洪珮绱犺川涓嵂闂告煖浜烘墠鍩瑰吇绛栫暐锛屾棬鍦ㄥ煿鍏荤鍚堝綋浠gぞ浼氶渶姹傜殑涓嵂琛屼笟澶嶅悎鍨嬪垱鏂颁汉鎵嶃��", - keyword: [ - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - ] - - }, - { - name: "涓嵂闂告煖鐨勫巻鍙蹭紶鎵夸笌鏂版椂浠e彂灞曟�濊��", - sources: "鍖椾含涓尰鑽ぇ瀛﹀鎶�", - type: "鏈熷垔", - author: "鏉ㄦ担鑿� 鍖椾含涓尰鑽ぇ瀛︿腑鑽闄紱璧靛ぉ鎴� 鍖椾含甯堣寖澶у", - time: "2025-02-24 09:21", - title: "涓嵂闂告煖鏄紶缁熶腑鑽皟鍓傜殑楂樼骇绠$悊浜哄憳锛屽湪'鍓嶅簵鍚庡巶寮�'涓嵂鎴垮彂鎸ラ噸瑕佷綔鐢ㄥ拰鍏抽敭鑱岃兘銆備紶鎵夸腑鑽椄鏌滅殑瀹濊吹瀛︽湳缁忛獙涓庝紭绉�鏂囧寲瀵瑰帢娓呬腑鑽瀛︾鍙戝睍鑴夌粶銆佽鑼冧腑鑽皟鍓傛妧鏈搷浣溿�佷績杩涜�佽嵂宸ユ妧鑹�'娲绘�佷紶鎵�'鍏锋湁閲嶈绉戝浠峰�煎拰鐜板疄鎰忎箟銆傞潰鍚戞柊鏃朵唬銆佸紑鍚柊鎬濈淮锛屾湰鏂囧鑰佸瓧鍙蜂腑鑽摵鐨勫叴璧峰拰涓嵂闂告煖杩涜鑰冭瘉锛屽垎鏋愪腑鑽椄鏌滅殑宀椾綅璐d换銆佷紶鎵胯矾寰勫強鏈潵鍙戝睍锛屾彁鍑洪珮绱犺川涓嵂闂告煖浜烘墠鍩瑰吇绛栫暐锛屾棬鍦ㄥ煿鍏荤鍚堝綋浠gぞ浼氶渶姹傜殑涓嵂琛屼笟澶嶅悎鍨嬪垱鏂颁汉鎵嶃�備腑鑽椄鏌滄槸浼犵粺涓嵂璋冨墏鐨勯珮绾х鐞嗕汉鍛橈紝鍦�'鍓嶅簵鍚庡巶寮�'涓嵂鎴垮彂鎸ラ噸瑕佷綔鐢ㄥ拰鍏抽敭鑱岃兘銆備紶鎵夸腑鑽椄鏌滅殑瀹濊吹瀛︽湳缁忛獙涓庝紭绉�鏂囧寲瀵瑰帢娓呬腑鑽瀛︾鍙戝睍鑴夌粶銆佽鑼冧腑鑽皟鍓傛妧鏈搷浣溿�佷績杩涜�佽嵂宸ユ妧鑹�'娲绘�佷紶鎵�'鍏锋湁閲嶈绉戝浠峰�煎拰鐜板疄鎰忎箟銆傞潰鍚戞柊鏃朵唬銆佸紑鍚柊鎬濈淮锛屾湰鏂囧鑰佸瓧鍙蜂腑鑽摵鐨勫叴璧峰拰涓嵂闂告煖杩涜鑰冭瘉锛屽垎鏋愪腑鑽椄鏌滅殑宀椾綅璐d换銆佷紶鎵胯矾寰勫強鏈潵鍙戝睍锛屾彁鍑洪珮绱犺川涓嵂闂告煖浜烘墠鍩瑰吇绛栫暐锛屾棬鍦ㄥ煿鍏荤鍚堝綋浠gぞ浼氶渶姹傜殑涓嵂琛屼笟澶嶅悎鍨嬪垱鏂颁汉鎵嶃��", - keyword: [ - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - ] - - }, - { - name: "涓嵂闂告煖鐨勫巻鍙蹭紶鎵夸笌鏂版椂浠e彂灞曟�濊��", - sources: "鍖椾含涓尰鑽ぇ瀛﹀鎶�", - type: "鏈熷垔", - author: "鏉ㄦ担鑿� 鍖椾含涓尰鑽ぇ瀛︿腑鑽闄紱璧靛ぉ鎴� 鍖椾含甯堣寖澶у", - time: "2025-02-24 09:21", - title: "涓嵂闂告煖鏄紶缁熶腑鑽皟鍓傜殑楂樼骇绠$悊浜哄憳锛屽湪'鍓嶅簵鍚庡巶寮�'涓嵂鎴垮彂鎸ラ噸瑕佷綔鐢ㄥ拰鍏抽敭鑱岃兘銆備紶鎵夸腑鑽椄鏌滅殑瀹濊吹瀛︽湳缁忛獙涓庝紭绉�鏂囧寲瀵瑰帢娓呬腑鑽瀛︾鍙戝睍鑴夌粶銆佽鑼冧腑鑽皟鍓傛妧鏈搷浣溿�佷績杩涜�佽嵂宸ユ妧鑹�'娲绘�佷紶鎵�'鍏锋湁閲嶈绉戝浠峰�煎拰鐜板疄鎰忎箟銆傞潰鍚戞柊鏃朵唬銆佸紑鍚柊鎬濈淮锛屾湰鏂囧鑰佸瓧鍙蜂腑鑽摵鐨勫叴璧峰拰涓嵂闂告煖杩涜鑰冭瘉锛屽垎鏋愪腑鑽椄鏌滅殑宀椾綅璐d换銆佷紶鎵胯矾寰勫強鏈潵鍙戝睍锛屾彁鍑洪珮绱犺川涓嵂闂告煖浜烘墠鍩瑰吇绛栫暐锛屾棬鍦ㄥ煿鍏荤鍚堝綋浠gぞ浼氶渶姹傜殑涓嵂琛屼笟澶嶅悎鍨嬪垱鏂颁汉鎵嶃�備腑鑽椄鏌滄槸浼犵粺涓嵂璋冨墏鐨勯珮绾х鐞嗕汉鍛橈紝鍦�'鍓嶅簵鍚庡巶寮�'涓嵂鎴垮彂鎸ラ噸瑕佷綔鐢ㄥ拰鍏抽敭鑱岃兘銆備紶鎵夸腑鑽椄鏌滅殑瀹濊吹瀛︽湳缁忛獙涓庝紭绉�鏂囧寲瀵瑰帢娓呬腑鑽瀛︾鍙戝睍鑴夌粶銆佽鑼冧腑鑽皟鍓傛妧鏈搷浣溿�佷績杩涜�佽嵂宸ユ妧鑹�'娲绘�佷紶鎵�'鍏锋湁閲嶈绉戝浠峰�煎拰鐜板疄鎰忎箟銆傞潰鍚戞柊鏃朵唬銆佸紑鍚柊鎬濈淮锛屾湰鏂囧鑰佸瓧鍙蜂腑鑽摵鐨勫叴璧峰拰涓嵂闂告煖杩涜鑰冭瘉锛屽垎鏋愪腑鑽椄鏌滅殑宀椾綅璐d换銆佷紶鎵胯矾寰勫強鏈潵鍙戝睍锛屾彁鍑洪珮绱犺川涓嵂闂告煖浜烘墠鍩瑰吇绛栫暐锛屾棬鍦ㄥ煿鍏荤鍚堝綋浠gぞ浼氶渶姹傜殑涓嵂琛屼笟澶嶅悎鍨嬪垱鏂颁汉鎵嶃��", - keyword: [ - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - { - name: "涓嵂闂告煖", - }, - ] - - } - ] - } - }, - methods: { - goPage(key) { - - }, - - goBack() { - this.$router.go(-1); - } + data() { + return { + observer: null, + pdfName: "", + dialogVisible: false, + pdfList: [], + relatedList: [], + // 杈撳叆妗嗙殑鍐呭 + inputValue: "", + // 閫夋嫨鐨勭被鍨� + inputType: "", + //绫诲瀷閫夋嫨 + inputOptions: [ + { value: "all", label: "鍏ㄩ儴" }, + { value: "Name", label: "鏍囬" }, + { value: "author", label: "浣滆��" }, + { value: "keyWords", label: "鍏抽敭璇�" }, + { value: "abstract", label: "鎽樿" }, + { value: "source", label: "鏉ユ簮" }, + ], + isDisplay: false, + details: {}, + // 绫诲瀷 + 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, + }, + ], + }, + resourceTypeRefCode: "resourceType", + resourceTypeValueList: [], + // 鏌ヨ缁撴灉 + resultList: [], + loading: true, + pdfLoading: false, + }; + }, + async mounted() { + await this.getContent(this.$route.query.id); + await this.getSelectData(); + // 鏌ユ壘鍏抽敭璇嶇浉鍖归厤鐨勬枃绔� + if (this.details.keyWords && this.details.keyWords.length) { + for (let i = 0; i < this.details.keyWords.length; i++) { + const item = this.details.keyWords[i]; + this.inputValue = item + this.inputType = "keyWords" + await this.getItemListOne() + } + this.loading = false; + console.log(this.resultList, "澶勭悊濂界殑"); + } else { + this.getItemList() } -} + if (this.resultList.length == 0) { + this.getItemList() + } + + //澶勭悊鏂囦欢 + if (this.details.cmsItemType == "video" || this.details.cmsItemType == "audio") { + if (this.details.file != "") { + this.details.src = await this.getResourcePath(this.details.file) + console.log(this.details.src, "瑙嗛鍦板潃"); + } + } + + + + + this.observer = new IntersectionObserver(this.pageChangeCallback, { + root: null, // 鎸囧畾鏍瑰厓绱狅紝杩欓噷璁句负 null锛岃〃绀洪�夊彇鏁翠釜瑙嗙獥浣滀负鏍瑰厓绱犮�� + rootMargin: '0px', // 鎸囧畾鏍瑰厓绱犵殑杈圭晫锛岃繖閲岃涓� "0px"锛岃〃绀烘牴鍏冪礌鐨勮竟鐣屽拰瑙嗙獥鐨勮竟鐣岄噸鍚� + threshold: 0.1 // 鎸囧畾浜ゅ弶姣斾緥锛岃繖閲岃涓� 0.5锛岃〃绀哄綋鐩爣鍏冪礌涓�鍗婃垨鏇村鏄剧ず鍦ㄨ绐椾腑鏃惰Е鍙戝洖璋冨嚱鏁般�� + }) + }, + methods: { + // 鏍规嵁id璇锋眰璇ラ〉闈㈡暟鎹� + async getContent(id) { + this.loading = true; + const res = await MG.resource + .getItem({ + path: "*", + queryType: "*", + fields: { + cmsType: ["cmsItem"], + "Id=": [id + ""], + source: [], + isbn: [], + year: [], + abstract: [], + keyWords: [], + author: [], + DOI: [], + AIReading: [], + file: [], + IssueNumber: [], + }, + }) + 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.author && item.author.length > 0) { + item.author = item.author.split(";"); + } + 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.details = res.datas[0] + }, + + // 鍦ㄦ鐐瑰嚮璇︽儏 + async goPage(id) { + await this.getContent(id); + await this.getSelectData(); + this.resultList = []; + // 鏌ユ壘鍏抽敭璇嶇浉鍖归厤鐨勬枃绔� + if (this.details.keyWords && this.details.keyWords.length) { + for (let i = 0; i < this.details.keyWords.length; i++) { + const item = this.details.keyWords[i]; + this.inputValue = item + this.inputType = "keyWords" + this.getItemListOne() + } + } else { + this.getItemList() + } + if (this.resultList.length == 0) { + this.getItemList() + } + + //澶勭悊鏂囦欢 + if (this.details.cmsItemType == "video" || this.details.cmsItemType == "audio") { + if (this.details.file != "") { + this.details.src = await this.getResourcePath(this.details.file) + } + } + // 婊氬姩鍒伴〉闈㈤《閮� + this.$nextTick(() => { + const pageMain = document.querySelector('.page-main-father'); + if (pageMain) { + pageMain.scrollTo({ + top: 0, + behavior: 'smooth' + }); + } + }); + }, + + goBack() { + this.$router.go(-1); + }, + + // 鑾峰彇闃块噷浜戝姞閫熷湴鍧� (瑙嗛锛岄煶棰�) + async getResourcePath(md5) { + try { + // 璋冪敤 fileApi.getAliVod 鏂规硶鑾峰彇璧勬簮璺緞 + const res = await fileApi.getAliVod({ + md5, + appRefCode, + }); + + // 濡傛灉杩斿洖鐨勬暟鎹笉涓虹┖涓斿畾涔夋槑纭紝鍒欑洿鎺ヨ繑鍥� res.data + if (res.data && res.data !== "") { + return res.data; + } + + // 濡傛灉杩斿洖鐨勬暟鎹负绌烘垨鏈畾涔夛紝鍒欐嫾鎺ラ粯璁や笅杞借矾寰� + return requestCtx + "/file/api/ApiDownload?md5=" + md5; + } catch (error) { + // 鎹曡幏寮傚父骞舵墦鍗伴敊璇棩蹇� + console.error("鑾峰彇璧勬簮璺緞澶辫触:", error); + // 杩斿洖涓�涓粯璁ゅ�兼垨鎶涘嚭閿欒锛堟牴鎹笟鍔¢渶姹傦級 + return requestCtx + "/file/api/ApiDownload?md5=" + md5; + } + }, + + // 鑾峰彇鐩稿叧璧勬簮 + async getPDFInfo(md5) { + const res = await this.MG.file.getPdfInfo({ + md5 + }) + if (!res || !res.totalPages) return (this.pdfList = []) + for (let index = 0; index < res.totalPages; index++) { + const src = + requestCtx + '/file/GetPdfPageImage?md5=' + md5 + '&index=' + (index + 1) + '&dpi=300' + '&width=800' + this.pdfList.push({ + src, + showSrc: '' + }) + } + this.pdfLoading = false; + // 鍚姩椤电爜瑙傚療 + setTimeout(() => { + this.initObservation() + }, 500) + }, + + initObservation() { + const sections = document.querySelectorAll('.pdfItem') + sections.forEach((section) => { + // observer 瑙傚療姣忎釜鍏冪礌锛屼互渚垮湪瀹冧滑杩涘叆鎴栫寮�瑙嗙獥鏃惰Е鍙戝洖璋冨嚱鏁般�� + const isObserver = section.getAttribute('observer') + if (!isObserver) { + this.observer.observe(section) + + section.setAttribute('observer', '1') + } + }) + // 棰勫姞杞藉墠鍑犻〉璧勬簮 + const preloadPages = 3 + for (let i = 0; i < Math.min(preloadPages, sections.length); i++) { + const section = sections[i] + const page = section.getAttribute('page') + if (this.pdfList[page - 1].showSrc == '') { + this.pdfList[page - 1].showSrc = this.pdfList[page - 1].src + } + } + }, + + pageChangeCallback(entries, observer) { + //entries锛氫唬琛ㄨ瀵熷埌鐨勭洰鏍囧厓绱犵殑闆嗗悎銆� observer锛氫唬琛ㄨ瀵熻�呭璞°�� + entries.forEach((entry) => { + //entry.isIntersecting锛氭鏌ュ綋鍓嶇洰鏍囧厓绱犳槸鍚︿笌鏍瑰厓绱犵浉浜ゃ�� + if (entry.isIntersecting) { + const target = entry.target + //entry.target锛氳幏鍙栧綋鍓嶇洰鏍囧厓绱� + const page = target.getAttribute('page') + if (this.pdfList[page - 1].showSrc == '') { + this.pdfList[page - 1].showSrc = this.pdfList[page - 1].src + } + } + }) + }, + + + + //鑾峰彇涓嬫媺閫夋嫨妗嗙殑鍐呭 + async getSelectData() { + try { + // 鍚屾椂鍙戣捣涓や釜寮傛璇锋眰锛屽苟绛夊緟瀹冧滑鐨勭粨鏋� + const [resourceListResult] = await Promise.all([ + this.getSelectContent(this.resourceTypeRefCode), + ]); + this.category.list = resourceListResult.option; + if (this.category.list && this.category.list.length) { + this.category.list.forEach((item) => { + this.resourceTypeValueList.push(item.value) + }); + } + + } 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; + }); + }, + + // 澶嶅埗涓�浠� + async getItemListOne() { + 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; + } + } + } + } + } + const res = await MG.resource + .getItem({ + path: "*", + queryType: "*", + paging: { + size: 99999 + }, + fields: { + cmsType: ["cmsItem"], + // 'id=':[this.$route.params.key], + "resourceType*": this.resourceTypeValueList, + source: [], + isbn: [], + year: [], + abstract: [], + keyWords: [], + author: [], + DOI: [], + AIReading: [], + file: [], + IssueNumber: [], + ...searchData, + }, + }) + 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 : ''; + console.log(this.details.id, ""); + + if (!this.resultList.find(citem => citem.id === item.id) && item.id != this.details.id && this.resultList.length < 11) { + this.resultList.push(item); + } + }); + }, + + async openPdf(name) { + this.pdfLoading = true; + this.pdfList = [] + this.pdfName = name; + this.dialogVisible = true; + await this.getPDFInfo(this.details.file); + }, + + // 璇锋眰鎵�鏈夌殑鏁版嵁 + getItemList() { + MG.resource + .getItem({ + path: "*", + queryType: "*", + paging: { + size: 5 + }, + fields: { + cmsType: ["cmsItem"], + "resourceType*": this.resourceTypeValueList, + source: [], + isbn: [], + year: [], + abstract: [], + keyWords: [], + author: [], + DOI: [], + AIReading: [], + file: [], + IssueNumber: [], + }, + }) + .then((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.loading = false; + }).catch((err) => { + console.log("鏇挎崲鏁版嵁璇锋眰澶辫触"); + }); + }, + + //鍘婚噸 + uniqueById(array) { + const uniqueItems = new Map(); + array.forEach(item => { + if (!uniqueItems.has(item.id)) { + uniqueItems.set(item.id, item); + } + }); + return Array.from(uniqueItems.values()); + } + }, +}; </script> <style lang="less" scoped> .page { - width: 100%; - height: 100%; - box-sizing: border-box; - background-color: #e9e1d4; - overflow: auto; + width: 100%; + height: 100%; + box-sizing: border-box; + background-color: #e9e1d4; + position: relative; + overflow: hidden; + display: flex; + flex-direction: column; } .page-header { - height: 102px; - width: 100%; - text-align: left; - margin-bottom: 8px; - border-bottom: 2px solid #937950; + 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 { - padding: 35px 0 34px 0; - font-family: Alimama DongFangDaKai; - font-size: 30px; - text-indent: 1em; - border-bottom: 1px solid #937950; - } + p { + height: 100%; + font-family: Alimama DongFangDaKai; + font-size: 30px; + text-indent: 1em; + border-bottom: 1px solid #937950; + display: flex; + align-items: center; + } } +.page-main-father { + flex: 1; + width: 100%; + height: 100%; + min-width: 1200px; + overflow: auto; + padding-top: 2%; + padding-bottom: 2%; +} + + .page-main { - background-color: #fcfaf3; - width: 1330px; - margin: 0 auto; + background-color: #fcfaf3; + width: 77.3%; + margin: 0 auto; + margin-top: 1%; - .page-main-name { + .page-main-name { + display: flex; + align-items: center; + padding: 21px 28px; + border-bottom: 1px solid #d8cbb6; + + ::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; + } + } + + p:nth-child(1) { + width: 8%; + } + + p:nth-child(2) { + width: 92%; + text-align: center; + font-family: Source Han Sans; + font-size: 32px; + font-weight: 350; + color: #937950; + } + } + + .page-main-time { + padding: 8px 0 16px 0; + display: flex; + justify-content: center; + font-family: Source Han Sans; + font-size: 14px; + font-weight: normal; + line-height: 22px; + border-bottom: 1px solid #d8cbb6; + + p { + span { + margin-right: 20px; + } + } + } + + .page-main-title { + padding: 13px 185px 25px 185px; + border-bottom: 1px solid #d8cbb6; + + ::v-deep .el-button { + font-size: 14px; + background-color: #937950; + color: #fff; + border: 1px solid #937950; + border-radius: 0; + + &:hover { + background-color: #937950; + color: #fffdf8; + } + } + + .page-main-abstract { + font-family: Source Han Sans !important; + font-size: 14px !important; + line-height: 26px !important; + color: #333333 !important; + font-weight: 100 !important; + } + + p:nth-child(1) { + display: flex; + justify-content: center; + margin-bottom: 13px; + + span { + font-family: Source Han Sans; + font-size: 14px; + font-weight: 350; + color: #604d2f; + border-right: 1px solid #937950; + padding: 0 21px; + } + + span:last-child { + border: none; + } + } + + p:nth-child(2) { + margin-bottom: 13px; + font-family: Source Han Sans; + font-size: 14px; + line-height: 26px; + color: #333333; + overflow: hidden; + display: -webkit-box; + -webkit-box-orient: vertical; + + .abstract-title { + font-weight: bold; + } + + span { + font-family: Source Han Sans; + font-size: 14px; + color: #333333; + } + + } + + p:nth-child(3) { + margin-bottom: 24px; + + span:nth-child(1) { + font-family: Source Han Sans; + font-weight: 700; + font-size: 14px; + } + + .page-main-keyword { + 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; + } + } + } + + .page-main-video { + padding: 10px; + height: 377px; + width: auto; + display: flex; + justify-content: center; + + video { + border-radius: 10px; + border: 1px solid #dcdcdc; + box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); + } + } + + .page-main-audio { + padding: 10px; + display: flex; + justify-content: center; + + audio {} + } + + .page-main-literature { + padding: 10px 93px 20px 185px; + + .literature-header { + font-family: Source Han Sans; + font-size: 14px; + font-weight: bold; + line-height: 26px; + } + + .content-right { + min-height: 600px; + padding: 14px 20px 20px 14px; + + .right-header { display: flex; - align-items: center; - padding: 21px 28px; - border-bottom: 1px solid #D8CBB6; - ::v-deep .el-button { + 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; + + 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; + } + } + + .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; + + ::v-deep .el-button { font-size: 14px; background-color: transparent; color: #937950; - border: 1px solid #6F5A3A; + border: 1px solid #937950; border-radius: 0; &:hover { - background-color: #6F5A3A; - color: #FFFDF8; + background-color: #937950; + color: #fffdf8; } + } } - p:nth-child(1) { - width: 8%; - } - - p:nth-child(2) { - width: 92%; - text-align: center; - font-family: Source Han Sans; - font-size: 32px; - font-weight: 350; - color: #937950; - } - } - - .page-main-time { - padding: 8px 0 16px 0; - display: flex; - justify-content: center; - font-family: Source Han Sans; - font-size: 14px; - font-weight: normal; - line-height: 22px; - border-bottom: 1px solid #D8CBB6; - - p { - span { - margin-right: 20px; - } - } - } - - .page-main-title { - padding: 13px 185px 25px 185px; - border-bottom: 1px solid #D8CBB6; - - ::v-deep .el-button { - font-size: 14px; - background-color: #937950; + .main-sources { + span:nth-child(1) { + padding: 3px 5px; + background-color: #87a8b9; color: #fff; - border: 1px solid #6F5A3A; - border-radius: 0; + margin-right: 10px; - &:hover { - background-color: #6F5A3A; - color: #FFFDF8; - } - } + } - p:nth-child(1) { - display: flex; - justify-content: center; - margin-bottom: 13px; - - span { - font-family: Source Han Sans; - font-size: 14px; - font-weight: 350; - color: #604D2F; - border-right: 1px solid #937950; - padding: 0 21px; - } - - span:last-child { - border: none; - } - } - - p:nth-child(2) { - margin-bottom: 13px; + span:nth-child(2) { font-family: Source Han Sans; - font-size: 14px; + font-size: 12px; font-weight: 350; - line-height: 26px; - color: #333333; - overflow: hidden; - display: -webkit-box; - -webkit-box-orient: vertical; - -webkit-line-clamp: 3; + padding-right: 10px; + color: #333; - span { - font-family: Source Han Sans; - font-size: 14px; - font-weight: bold; - color: #333333; - } - } + } - p:nth-child(3) { - margin-bottom: 24px; - - span:nth-child(1) { - font-family: Source Han Sans; - font-weight: 700; - font-size: 14px; - } - - .page-main-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; - } - } - } - - .page-main-video { - padding: 10px; - height: 377px; - width: auto; - display: flex; - justify-content: center; - - video { - border-radius: 10px; - border: 1px solid #DCDCDC; - box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); - } - } - - .page-main-audio { - padding: 10px; - display: flex; - justify-content: center; - - audio {} - } - - .page-main-literature { - padding: 10px 93px 20px 185px; - - .literature-header { + 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; - font-weight: bold; - line-height: 26px; + } } - - .content-right { - padding: 14px 20px 20px 14px; - - .right-header { - display: flex; - - 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; - - 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; - } - } - - .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; - - ::v-deep .el-button { - font-size: 14px; - background-color: transparent; - color: #937950; - border: 1px solid #6F5A3A; - border-radius: 0; - - &:hover { - background-color: #6F5A3A; - 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; - border-right: 1px solid #2C2C2C; - color: #333; - } - - span:nth-child(3) { - font-family: Source Han Sans; - font-size: 12px; - font-weight: 350; - padding-left: 10px; - color: #333; - } - - margin-bottom: 10px; - } - - .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: 4; - - span { - font-family: Source Han Sans; - font-weight: 700; - font-size: 14px; - } - } - - .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; - } - - } - - - } + .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 { + + 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; + } + } + } } + } +} + + +.pdfInfoBox { + height: 85vh; + margin-top: 20px; + overflow: auto; + width: 100%; + + img { + display: block; + margin: 0 auto; + width: 70%; + box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.1); + object-fit: contain; + } +} + +::v-deep .el-loading-spinner { + .el-loading-text { + font-size: 14px; + color: #937950; + } + + .el-icon-loading { + font-size: 14px; + color: #937950; + } } </style> + +<style lang="less"> +.custom-dialog { + overflow: hidden !important; + + .el-dialog__body { + padding: 0; + } + + .el-dialog__header { + background-color: #937950; + + .el-dialog__title { + display: flex; + justify-content: space-between; + align-items: center; + color: #fff; + font-weight: 900; + font-size: 16px; + + span:nth-child(2):hover { + cursor: pointer; + } + } + + + .el-dialog__title, + .el-dialog__headerbtn .el-dialog__close { + color: #fff; + font-weight: 900; + font-size: 16px; + } + } +} +</style> \ No newline at end of file -- Gitblit v1.9.1