| | |
| | | <!-- 类型 --> |
| | | <ul> |
| | | <li class="left-title"> |
| | | <span>{{ category.title }}</span> |
| | | <p @click="category.isDisplay = !category.isDisplay"> |
| | | <span>{{ categoryOBJ.title }}</span> |
| | | <p @click="categoryOBJ.isDisplay = !categoryOBJ.isDisplay"> |
| | | <img |
| | | :src="[category.isDisplay ? topIcon : bottomIcon]" |
| | | :src="[categoryOBJ.isDisplay ? topIcon : bottomIcon]" |
| | | alt="" |
| | | /> |
| | | </p> |
| | | </li> |
| | | <li class="left-main" v-if="category.isDisplay"> |
| | | <li class="left-main" v-if="categoryOBJ.isDisplay"> |
| | | <div |
| | | class="category-main" |
| | | v-for="(item, index) in category.list" |
| | | v-for="(item, index) in categoryOBJ.list" |
| | | :key="index" |
| | | > |
| | | <el-checkbox |
| | | class="el-checkbox" |
| | | v-model="item.checked" |
| | | :title="item.name" |
| | | @change="categoryChange(item)" |
| | | @change="categoryChange(categoryOBJ.title, item)" |
| | | style="display: inline-block; vertical-align: middle" |
| | | >{{ item.name }}</el-checkbox |
| | | >{{ item.valueName }}</el-checkbox |
| | | > |
| | | <span |
| | | class="" |
| | |
| | | <li class="left-title"> |
| | | <div> |
| | | <span>{{ annual.title }}</span> |
| | | <span> |
| | | <span @click="timeSortChange()"> |
| | | 时间 |
| | | <img |
| | | class="sort-Icon" |
| | | :src="[isDisplay ? sortTop : sortBottom]" |
| | | :src="[resourceTypeSortInfo ? sortTop : sortBottom]" |
| | | alt="" |
| | | /> |
| | | </span> |
| | | <span |
| | | <span @click="countSortChange()" |
| | | >文献量 |
| | | <img |
| | | class="sort-Icon" |
| | | :src="[isDisplay ? sortBottom : sortTop]" |
| | | :src="[particularYearSortInfo ? sortTop : sortBottom]" |
| | | alt="" |
| | | /> |
| | | </span> |
| | |
| | | class="el-checkbox" |
| | | v-model="item.checked" |
| | | :title="item.years" |
| | | >{{ item.years }}</el-checkbox |
| | | > |
| | | @change="categoryChange(annual.title, item)" |
| | | >{{ item.name }} |
| | | </el-checkbox> |
| | | <span class="">{{ item.num }}</span> |
| | | </div> |
| | | <p |
| | |
| | | <li class="left-title"> |
| | | <div> |
| | | <span>{{ sources.title }}</span> |
| | | <span> |
| | | <span @click="sourcesSortChange()"> |
| | | 文献量 |
| | | <img |
| | | class="sort-Icon" |
| | | :src="[isDisplay ? sortBottom : sortTop]" |
| | | :src="[sourceFromSortInfo ? sortBottom : sortTop]" |
| | | alt="" |
| | | /> |
| | | </span> |
| | |
| | | class="el-checkbox" |
| | | :title="item.name" |
| | | v-model="item.checked" |
| | | @change="categoryChange(sources.title, item)" |
| | | >{{ item.name }}</el-checkbox |
| | | > |
| | | <span class="">{{ item.num }}</span> |
| | |
| | | </li> |
| | | </ul> |
| | | <!-- 学科 --> |
| | | <ul> |
| | | <!-- <ul> |
| | | <li class="left-title"> |
| | | <span>{{ subject.title }}</span> |
| | | <p @click="subject.isDisplay = !subject.isDisplay"> |
| | | <img |
| | | :src="[subject.isDisplay ? topIcon : bottomIcon]" |
| | | alt="" |
| | | /> |
| | | <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 |
| | | > |
| | | <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> |
| | | </ul> --> |
| | | </div> |
| | | <div |
| | | class="content-right" |
| | |
| | | <!-- title部分 --> |
| | | <ul class="right-header"> |
| | | <li v-for="(item, index) in associationList" :key="index"> |
| | | <p>{{ item.type }} : {{ item.content }}</p> |
| | | <p>{{ item.type }} : {{ item.name }}</p> |
| | | <img |
| | | @click="removeAssociationList(item.content)" |
| | | @click="removeAssociationList(item)" |
| | | :src="errorIcon" |
| | | alt="" |
| | | /> |
| | |
| | | class="right-main" |
| | | v-for="(item, index) in resultList" |
| | | :key="index" |
| | | @click ="goPage(item.id)" |
| | | > |
| | | <li class="main-name"> |
| | | <p>{{ item.name }}</p> |
| | | <p> |
| | | <el-button @click="goPage(item.id)">详情</el-button> |
| | | <el-button>AI智能阅读</el-button> |
| | | <!-- <el-button >详情</el-button> --> |
| | | <el-button @click.stop="openAiReading(item.AIReading, item.name)" |
| | | >AI智能阅读</el-button |
| | | > |
| | | </p> |
| | | </li> |
| | | <li class="main-sources"> |
| | | <span>{{ item.resourceTypeName }}</span> |
| | | <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 class="main-author"> |
| | | {{ item.author }} |
| | | </li> |
| | | <li class="main-title" :title="item.cleanAbstract" v-if="item.abstract"> |
| | | <li |
| | | class="main-title" |
| | | :title="item.cleanAbstract" |
| | | v-if="item.abstract" |
| | | > |
| | | <span>摘要: </span> |
| | | <span class="page-main-abstract" v-html="item.abstract"></span> |
| | | <span |
| | | class="page-main-abstract" |
| | | v-html="item.cleanAbstract" |
| | | ></span> |
| | | </li> |
| | | <li class="main-keyword" v-if="item.keyWords && item.keyWords.length > 0"> |
| | | <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.stop=" |
| | | () => |
| | | handleSearch({ |
| | | text: citem, |
| | | type: 'keyWords', |
| | | label: '关键词', |
| | | }) |
| | | " |
| | | > |
| | | {{ citem }} |
| | | </span> |
| | |
| | | :background="isBackground" |
| | | layout="prev, pager, next" |
| | | :total="total" |
| | | :page-size="6" |
| | | :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> |
| | | <el-empty v-if="!loading && !resultList.length"></el-empty> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | }, |
| | | data() { |
| | | return { |
| | | dialogVisible: false, |
| | | aIName: "", |
| | | AIReading: "", |
| | | relatedList: [], |
| | | // 输入框的内容 |
| | | inputValue: "", |
| | |
| | | { |
| | | type: "input", |
| | | label: "标 题", |
| | | name: "title", |
| | | name: "Name", |
| | | value: "", |
| | | }, |
| | | { |
| | |
| | | { |
| | | type: "input", |
| | | label: "关键词", |
| | | name: "keyword", |
| | | name: "keyWords", |
| | | value: "", |
| | | }, |
| | | { |
| | |
| | | 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, |
| | | }, |
| | | ], |
| | | list: [], |
| | | }, |
| | | |
| | | // 类型 |
| | | categoryOBJ: { |
| | | title: "类型", |
| | | isDisplay: true, |
| | | id: "", |
| | | index: "", |
| | | list: [], |
| | | }, |
| | | categoryChecList: [], |
| | | subjectCheckList: [], |
| | | |
| | | postedSortInfo: true, |
| | | resourceTypeSortInfo: true, |
| | | particularYearSortInfo: true, |
| | | sourceFromSortInfo: 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, |
| | | }, |
| | | ], |
| | | list: [], |
| | | }, |
| | | // 文献来源 |
| | | sources: { |
| | |
| | | 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, |
| | | }, |
| | | ], |
| | | list: [], |
| | | }, |
| | | // 学科 |
| | | subject: { |
| | |
| | | resultList: [], |
| | | total: 0, |
| | | paginationPage: 1, |
| | | loading: false, |
| | | loading: true, |
| | | labelList: { |
| | | abstract: "摘要", |
| | | author: "作者", |
| | | keyword: "关键词", |
| | | keyWords: "关键词", |
| | | source: "来源", |
| | | title: "标题", |
| | | Name: "标题", |
| | | year: "年份", |
| | | }, |
| | | }; |
| | | }, |
| | | mounted() { |
| | | this.inputType = this.$route.query.type; |
| | | this.inputValue = this.$route.query.value; |
| | | this.getSelectData(); |
| | | this.getSidebarData(); |
| | | }, |
| | | |
| | | methods: { |
| | | categoryChange(val) { |
| | | categoryChange(typeName, val) { |
| | | console.log(val, "val"); |
| | | console.log(typeName, "typeName"); |
| | | if (val.checked) { |
| | | this.categoryChecList.push(val.value); |
| | | this.associationList.push({ |
| | | type: typeName, |
| | | content: val.name, |
| | | value: val.value, |
| | | name: val.valueName || 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(); |
| | | }, |
| | |
| | | }, |
| | | |
| | | async onSubmit(val) { |
| | | console.log(val, "val"); |
| | | console.log(this.associationList, "associationList"); |
| | | |
| | | for (let key in val) { |
| | | if (val[key] != "") { |
| | | this.associationList.push({ |
| | | type: this.labelList[key], |
| | | content: val[key], |
| | | value: 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]; |
| | | } |
| | | } |
| | | } |
| | | console.log(this.associationList, "this.associationList"); |
| | | this.getItemList(); |
| | | }, |
| | | //重置搜索结果 |
| | |
| | | |
| | | //获取下拉选择框的内容 |
| | | async getSelectData() { |
| | | this.loading = true; |
| | | try { |
| | | // 同时发起两个异步请求,并等待它们的结果 |
| | | const [subjectListResult, resourceListResult] = await Promise.all([ |
| | |
| | | |
| | | // 删除 |
| | | removeAssociationList(value) { |
| | | console.log(value, "value"); |
| | | this.associationList = this.associationList.filter( |
| | | (item) => item.content !== value |
| | | (item) => item.content !== value.content |
| | | ); |
| | | this.inputValue = ""; |
| | | |
| | | switch (value.value) { |
| | | case "resourceType": |
| | | this.categoryOBJ.list.forEach((item) => { |
| | | if (item.name == value.content) { |
| | | item.checked = false; |
| | | } |
| | | }); |
| | | break; |
| | | |
| | | case "particularYear": |
| | | this.annual.list.forEach((item) => { |
| | | if (item.name == value.content) { |
| | | item.checked = false; |
| | | } |
| | | }); |
| | | break; |
| | | case "sourceFrom": |
| | | this.sources.list.forEach((item) => { |
| | | if (item.name == value.content) { |
| | | item.checked = false; |
| | | } |
| | | }); |
| | | break; |
| | | } |
| | | // 通知父组件数据已改变 |
| | | this.getItemList() |
| | | this.getItemList(); |
| | | }, |
| | | |
| | | // 搜索 |
| | | handleSearch(isText) { |
| | | this.associationList = [] |
| | | 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(); |
| | | } |
| | | }, |
| | | //获取侧边栏数据 |
| | | getSidebarData() { |
| | | MG.resource |
| | | .getItem({ |
| | | path: "*", |
| | | queryType: "*", |
| | | fields: { |
| | | GroupBy: [["particularYear"], ["sourceFrom"], ["resourceType"]], |
| | | "subjectAffiliation*": this.subjectCheckList, |
| | | }, |
| | | }) |
| | | .then((res) => { |
| | | // 处理group的数据 |
| | | console.log(res, "res009"); |
| | | |
| | | res.groups.forEach((item) => { |
| | | if ( |
| | | item.key == "particularYear" && |
| | | item.datas && |
| | | item.datas.length |
| | | ) { |
| | | item.datas.forEach((citem) => { |
| | | this.annual.list.push({ |
| | | name: citem.groupKey, |
| | | num: citem.count, |
| | | value: item.key, |
| | | check: false, |
| | | }); |
| | | }); |
| | | } |
| | | |
| | | if (item.key == "sourceFrom" && item.datas && item.datas.length) { |
| | | item.datas.forEach((citem) => { |
| | | this.sources.list.push({ |
| | | name: citem.groupKey, |
| | | num: citem.count, |
| | | value: item.key, |
| | | check: false, |
| | | }); |
| | | }); |
| | | } |
| | | |
| | | if (item.key == "resourceType" && item.datas && item.datas.length) { |
| | | item.datas.forEach((citem) => { |
| | | this.categoryOBJ.list.push({ |
| | | name: citem.groupKey, |
| | | valueName: this.getGroupKey(citem.groupKey), |
| | | value: item.key, |
| | | num: citem.count, |
| | | check: false, |
| | | }); |
| | | }); |
| | | } |
| | | }); |
| | | }); |
| | | }, |
| | | |
| | | // 请求数据 |
| | | getItemList() { |
| | | this.loading = true; |
| | | |
| | | let searchData = {}; // 初始化一个空对象来存储搜索数据 |
| | | if (this.inputValue) { // 如果输入值存在 |
| | | if (this.inputType != "all") { // 如果输入类型不是"all" |
| | | if (this.inputValue) { |
| | | // 如果输入值存在 |
| | | if (this.inputType != "all") { |
| | | // 如果输入类型不是"all" |
| | | // 将输入值与输入类型关联,并添加一个星号(*)作为后缀 |
| | | searchData[this.inputType + "*"] = this.inputValue; |
| | | } else { // 如果输入类型是"all" |
| | | } 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是空的 |
| | | |
| | | debugger; |
| | | if (item.value !== "all") { |
| | | // 如果当前选项的值不是"all" |
| | | if (!Object.keys(searchData).length) { |
| | | // 如果searchData是空的 |
| | | // 将第一个选项的值与输入值关联,并添加一个星号(*)作为后缀 |
| | | searchData[item.value + "*"] = this.inputValue; |
| | | } else { // 如果searchData不是空的 |
| | | } else { |
| | | // 如果searchData不是空的 |
| | | // 使用"||"作为前缀,将后续选项的值与输入值关联,并添加一个星号(*)作为后缀 |
| | | // 这通常用于构建一个逻辑或(OR)查询 |
| | | searchData["||" + item.value + "*"] = this.inputValue; |
| | |
| | | } |
| | | } |
| | | } |
| | | |
| | | console.log(this.associationList, "this.associationList"); |
| | | if (this.associationList && this.associationList.length) { |
| | | let resourceTypeValueList = []; |
| | | let particularYearValueList = []; |
| | | let sourceFromValueList = []; |
| | | |
| | | this.associationList.forEach((item) => { |
| | | debugger; |
| | | if (item.value !== "all") { |
| | | 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 != "year") { |
| | | if (item.value == "resourceType") { |
| | | resourceTypeValueList.push(item.content); |
| | | searchData[item.value + "*"] = resourceTypeValueList; |
| | | } else if (item.value == "particularYear") { |
| | | particularYearValueList.push(item.content); |
| | | searchData[item.value + "*"] = particularYearValueList; |
| | | } else if (item.value == "sourceFrom") { |
| | | sourceFromValueList.push(item.content); |
| | | searchData[item.value + "*"] = sourceFromValueList; |
| | | } |
| | | } else { |
| | | searchData["||" + item.value + "*"] = item.content; |
| | | } |
| | | } |
| | | }); |
| | | } |
| | | // for (let key in searchData) { |
| | | // if (searchData[key].length === 1) { |
| | | // searchData[key] = searchData[key][0]; |
| | | // } |
| | | // } |
| | | console.log(searchData, "searchData"); |
| | | console.log(this.resourceTypeValueList, "resourceTypeValueList"); |
| | | const isResourceTypeValueList = this.categoryChecList.filter( |
| | | (item) => this.resourceTypeValueList.indexOf(item) !== -1 |
| | | ); |
| | | MG.resource |
| | | .getItem({ |
| | | path: "*", |
| | | queryType: "*", |
| | | paging: { |
| | | start: (this.paginationPage - 1) * 6, |
| | | size: 6, |
| | | start: (this.paginationPage - 1) * 10, |
| | | size: 10, |
| | | }, |
| | | sort: { |
| | | year: this.postedSortInfo ? "Desc" : "Asc", |
| | |
| | | fields: { |
| | | cmsType: ["cmsItem"], |
| | | "resourceType*": |
| | | this.categoryChecList.length > 0 |
| | | ? this.categoryChecList |
| | | isResourceTypeValueList.length > 0 |
| | | ? isResourceTypeValueList |
| | | : this.resourceTypeValueList, |
| | | source: [], |
| | | isbn: [], |
| | | year: [], |
| | | particularYear: [], |
| | | contributor: [], |
| | | abstract: [], |
| | | keyWords: [], |
| | | author: [], |
| | |
| | | AIReading: [], |
| | | file: [], |
| | | IssueNumber: [], |
| | | // "particularYear*": ["2009"], |
| | | GroupBy: [["particularYear"], ["sourceFrom"], ["resourceType"]], |
| | | "subjectAffiliation*": this.subjectCheckList, |
| | | ...searchData, |
| | | }, |
| | | }) |
| | | .then((res) => { |
| | | console.log(res, "全部内容"); |
| | | |
| | | console.log(res, "res"); |
| | | res.datas.forEach((item) => { |
| | | item.year = moment(item.year).format("YYYY-MM-DD"); |
| | | if (typeof item.keyWords === "string") { |
| | |
| | | // 设置一个默认值或者进行其他错误处理 |
| | | item.keyWords = []; |
| | | } |
| | | // 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 |
| | | 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.getItemList(); // 重新获取数据 |
| | | // 滚动到页面顶部 |
| | | this.$nextTick(() => { |
| | | const pageMain = document.querySelector('.page-main-father'); |
| | | const pageMain = document.querySelector(".page-main-father"); |
| | | if (pageMain) { |
| | | pageMain.scrollTo({ |
| | | top: 0, |
| | | behavior: 'smooth' |
| | | behavior: "smooth", |
| | | }); |
| | | } |
| | | }); |
| | |
| | | sortChange() { |
| | | this.postedSortInfo = !this.postedSortInfo; |
| | | this.getItemList(); |
| | | }, |
| | | timeSortChange() { |
| | | this.resourceTypeSortInfo = !this.resourceTypeSortInfo; |
| | | this.annual.list.sort((a, b) => { |
| | | a.name - b.name; |
| | | }); |
| | | if (this.resourceTypeSortInfo) { |
| | | this.annual.list.sort((a, b) => a.name - b.name); |
| | | } else { |
| | | this.annual.list.sort((a, b) => b.name - a.name); |
| | | } |
| | | }, |
| | | countSortChange() { |
| | | this.particularYearSortInfo = !this.particularYearSortInfo; |
| | | |
| | | if (!this.particularYearSortInfo) { |
| | | this.annual.list.sort((a, b) => a.num - b.num); |
| | | } else { |
| | | this.annual.list.sort((a, b) => b.num - a.num); |
| | | } |
| | | console.log(this.annual.list, "this.annual.list"); |
| | | }, |
| | | sourcesSortChange() { |
| | | this.sourceFromSortInfo = !this.sourceFromSortInfo; |
| | | if (this.sourceFromSortInfo) { |
| | | this.sources.list.sort((a, b) => a.num - b.num); |
| | | } else { |
| | | this.sources.list.sort((a, b) => b.num - a.num); |
| | | } |
| | | }, |
| | | 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"; |
| | | } |
| | | }, |
| | | |
| | | getGroupKey(typeName) { |
| | | switch (typeName) { |
| | | case "journal": |
| | | return "期刊"; |
| | | case "books": |
| | | return "图书"; |
| | | case "video": |
| | | return "视频"; |
| | | case "audio": |
| | | return "音频"; |
| | | case "newspaper": |
| | | return "newspaper-color"; |
| | | default: |
| | | return "other-color"; |
| | | } |
| | | }, |
| | | |
| | | openAiReading(text, name) { |
| | | this.AIReading = text; |
| | | this.aIName = name; |
| | | this.dialogVisible = true; |
| | | }, |
| | | }, |
| | | }; |
| | |
| | | } |
| | | } |
| | | |
| | | ::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%; |
| | |
| | | background-color: #fefbf5; |
| | | border: 1px solid #e4dace; |
| | | |
| | | .input-main { |
| | | ::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; |
| | | } |
| | | } |
| | | |
| | |
| | | font-size: 14px; |
| | | background-color: transparent; |
| | | color: #937950; |
| | | border: 1px solid #6f5a3a; |
| | | border: 1px solid #937950; |
| | | cursor: pointer; |
| | | |
| | | &:hover { |
| | | background-color: #6f5a3a; |
| | | background-color: #937950; |
| | | color: #fffdf8; |
| | | } |
| | | } |
| | |
| | | |
| | | .right-header { |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | |
| | | li { |
| | | background: #ffffff; |
| | |
| | | font-family: Poppins; |
| | | font-size: 13px; |
| | | color: #937950; |
| | | line-height: 20px; |
| | | margin-bottom: 10px; |
| | | |
| | | img { |
| | | cursor: pointer; |
| | |
| | | padding: 19px 30px 15px 30px; |
| | | border: 1px solid #decaac; |
| | | |
| | | &:hover { |
| | | cursor: pointer; |
| | | border: 1px solid #937950; |
| | | } |
| | | |
| | | .main-name { |
| | | display: flex; |
| | | align-items: center; |
| | |
| | | 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 #6f5a3a; |
| | | border: 1px solid #937950; |
| | | border-radius: 0; |
| | | |
| | | &:hover { |
| | | background-color: #6f5a3a; |
| | | 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; |
| | | background-color: #87a8b9; |
| | | |
| | | color: #fff; |
| | | margin-right: 10px; |
| | | } |
| | |
| | | border-left: 1px solid #2c2c2c; |
| | | } |
| | | |
| | | margin-bottom: 10px; |
| | | margin-bottom: 15px; |
| | | } |
| | | |
| | | .main-author { |
| | |
| | | overflow: hidden; |
| | | display: -webkit-box; |
| | | -webkit-box-orient: vertical; |
| | | -webkit-line-clamp: 4; |
| | | -webkit-line-clamp: 3; |
| | | |
| | | span { |
| | | font-family: Source Han Sans; |
| | |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | .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 { |
| | |
| | | border-radius: 5px; |
| | | border: 1px solid #cccccc; |
| | | } |
| | | </style> |
| | | |
| | | :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> |