<template>
|
<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" style="display: inline-block; vertical-align: middle;"
|
v-model="item.checked" :title="item.name">{{ 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">{{ 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>
|
<!-- 共xx条 -->
|
<ul class="right-number">
|
<ul class="number-number">
|
共找到<span>{{ this.total }}</span>条结果
|
</ul>
|
<ul class="number-time">
|
发表时间
|
<span><img :src="sortBottom" 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)">详情</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">
|
<span>摘要: </span>
|
<span class="page-main-abstract" v-html="item.abstract"></span>
|
</li>
|
<li class="main-keyword">
|
<span>关键词：</span>
|
<span class="keyWord" v-for="(citem, cindex) in item.keyWords" :key="cindex">
|
{{ 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>
|
</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 {
|
// 输入框的内容
|
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: "title",
|
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,
|
},
|
],
|
},
|
// 年度
|
annual: {
|
title: "年度",
|
isDisplay: true,
|
id: "",
|
index: "",
|
list: [
|
{
|
years: "2025",
|
num: 20,
|
check: false,
|
},
|
{
|
years: "2025",
|
num: 20,
|
check: false,
|
},
|
{
|
years: "2025",
|
num: 20,
|
check: false,
|
},
|
{
|
years: "2025",
|
num: 20,
|
check: false,
|
},
|
{
|
years: "2025",
|
num: 20,
|
check: false,
|
},
|
{
|
years: "2025",
|
num: 20,
|
check: false,
|
},
|
{
|
years: "2025",
|
num: 20,
|
check: false,
|
},
|
],
|
},
|
// 文献来源
|
sources: {
|
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,
|
},
|
{
|
name: "北京中医药大学大学学报",
|
num: 190,
|
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,
|
};
|
},
|
mounted() {
|
this.getSelectContent();
|
this.getLeftCheckbox()
|
this.getSelectData();
|
},
|
|
methods: {
|
async onSubmit(val) { },
|
//重置搜索结果
|
resetForm() {
|
// this.onSearch("");
|
},
|
// 页面跳转
|
goPage(key) {
|
console.log(key, "key");
|
this.$router.push({ name: "details", params: { key: key } });
|
},
|
// 收起和展示
|
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";
|
}
|
},
|
// 获取左侧checkbox数据
|
getLeftCheckbox() {
|
|
|
},
|
|
//获取下拉选择框的内容
|
async getSelectData() {
|
this.loading = true;
|
try {
|
// 同时发起两个异步请求，并等待它们的结果
|
const [subjectListResult, resourceListResult] = await Promise.all([
|
this.getSelectContent(this.subjectAffiliationRefCode),
|
this.getSelectContent(this.resourceTypeRefCode),
|
]);
|
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);
|
console.log(selestList, "下拉框数据");
|
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(1234);
|
console.log(isText, "搜索123");
|
if (isText.text != "") {
|
this.inputValue = isText.text
|
this.inputType = isText.type
|
this.associationList.push({
|
type: isText.label,
|
content: isText.text,
|
});
|
this.getItemList()
|
}
|
},
|
|
// getTtem
|
getItemList() {
|
let searchData = {};
|
if (this.inputValue) {
|
if (this.inputType != "all") {
|
searchData[this.inputType + "*"] = this.inputValue;
|
} else {
|
for (let index = 0; index < this.inputOptions.length; index++) {
|
const item = this.inputOptions[index];
|
if (item.value !== "all" ) {
|
console.log(item.value, "987");
|
if (!Object.keys(searchData).length) {
|
searchData[item.value + "*"] = this.inputValue
|
} else {
|
searchData["||" + item.value + "*"] = this.inputValue
|
}
|
}
|
}
|
}
|
|
console.log(searchData, "搜索数据123");
|
}
|
debugger
|
MG.resource
|
.getItem({
|
path: "*",
|
queryType: "*",
|
paging: {
|
start: (this.paginationPage - 1) * 6,
|
size: 6
|
},
|
fields: {
|
cmsType: ["cmsItem"],
|
"resourceType*": this.resourceTypeValueList,
|
source: [],
|
year: [],
|
abstract: [],
|
keyWords: [],
|
author: [],
|
DOI: [],
|
AIReading: [],
|
file: [],
|
IssueNumber: [],
|
...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 = [];
|
}
|
item.resourceTypeName = this.category.list.find((citem) => citem.value == item.cmsItemType).name
|
})
|
this.resultList = res.datas
|
this.total = res.total;
|
this.loading = false;
|
})
|
},
|
|
// 处理页码变化
|
handleCurrentChange(newPage) {
|
this.paginationPage = newPage;
|
this.getItemList(); // 重新获取数据
|
},
|
|
},
|
};
|
</script>
|
|
<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;
|
}
|
|
.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;
|
}
|
}
|
|
.page-main-father {
|
flex: 1;
|
width: 100%;
|
height: 100%;
|
min-width: 1292px;
|
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;
|
|
.input-main {
|
padding: 15px 0;
|
display: flex;
|
justify-content: center;
|
width: 90%;
|
border-right: 2px solid #e4dace;
|
|
.input-with-select {
|
width: 50%;
|
}
|
}
|
|
.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 #6f5a3a;
|
|
&:hover {
|
background-color: #6f5a3a;
|
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;
|
|
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;
|
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;
|
|
::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;
|
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: 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;
|
}
|
}
|
|
.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;
|
}
|
</style>
|
