<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" 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>
|
<!-- 共xx条 -->
|
<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 @click="openAiReading(item.AIReading, item.name)">AI智能阅读</el-button>
|
</p>
|
</li>
|
<li class="main-sources">
|
<span :class="getResourceTypeClass(item.cmsItemType)">{{ 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="10">
|
</el-pagination>
|
</div>
|
<el-dialog v-model="dialogVisible" :title="aIName" width="60vw" top="3vh" bottom="2vh"
|
:visible.sync="dialogVisible" class="custom-dialog">
|
<div class="AIReadingBox" element-loading-spinner="el-icon-loading"
|
element-loading-background="rgba(0, 0, 0, 0)">
|
<div class="richTextInitBox" v-if="AIReading" v-html="AIReading"></div>
|
<div class="richTextInitError" v-else>网络繁忙，请稍后再试。</div>
|
</div>
|
</el-dialog>
|
<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 {
|
dialogVisible: false,
|
aIName: "",
|
AIReading: "",
|
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: 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: true,
|
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;
|
}
|
}
|
}
|
}
|
}
|
// 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 {
|
// searchData["||" + item.value + "*"] = item.content;
|
// }
|
// });
|
// }
|
console.log(searchData, "searchData");
|
MG.resource
|
.getItem({
|
path: "*",
|
queryType: "*",
|
paging: {
|
start: (this.paginationPage - 1) * 10,
|
size: 10,
|
},
|
sort: {
|
year: this.postedSortInfo ? "Desc" : "Asc",
|
},
|
fields: {
|
cmsType: ["cmsItem"],
|
"resourceType*":
|
this.categoryChecList.length > 0
|
? this.categoryChecList
|
: this.resourceTypeValueList,
|
source: [],
|
isbn: [],
|
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();
|
},
|
getResourceTypeClass(typeName) {
|
switch (typeName) {
|
case 'journal':
|
return 'journal-color';
|
case 'books':
|
return 'books-color';
|
case 'video':
|
return 'video-color';
|
case 'audio':
|
return 'audio-color';
|
case 'newspaper':
|
return 'newspaper-color';
|
default:
|
return 'other-color';
|
}
|
},
|
|
openAiReading(text, name) {
|
this.AIReading = text;
|
this.aIName = name;
|
this.dialogVisible = true;
|
}
|
},
|
};
|
</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;
|
}
|
}
|
|
::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;
|
}
|
}
|
}
|
|
.journal-color {
|
background-color: #87a8b9;
|
}
|
|
.books-color {
|
background-color: #C48787;
|
}
|
|
.video-color {
|
background-color: #6F8F5A;
|
}
|
|
.audio-color {
|
background-color: #937950;
|
}
|
|
.newspaper-color {
|
background-color: #8D77B3;
|
}
|
|
.other-color {
|
background-color: #009F9F;
|
}
|
|
|
|
.main-sources {
|
span:nth-child(1) {
|
padding: 3px 5px;
|
|
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;
|
}
|
}
|
}
|
}
|
}
|
|
.AIReadingBox {
|
height: 85vh;
|
min-height: 600px;
|
padding: 20px 10px;
|
}
|
|
.richTextInitBox {
|
height: 100%;
|
overflow: auto;
|
}
|
.richTextInitError{
|
height: 100%;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
|
.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
|
}
|
|
:deep.el-button--primary {
|
background-color: #937950;
|
color: #937950;
|
border: 1px solid #937950;
|
cursor: pointer;
|
|
&:hover {
|
background-color: #937950;
|
color: #fffdf8;
|
}
|
}
|
</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>
|
