| | |
| | | font-family: "LanTing"; |
| | | src: url(../font/兰亭黑\ GBK.TTF); |
| | | } |
| | | |
| | | @font-face { |
| | | font-family: "siyuanBold"; |
| | | src: url(../font/SourceHanSansCN-Bold.otf); |
| | | } |
| | | @font-face { |
| | | font-family: "siyuan"; |
| | | src: url(../font/SourceHanSansCN-Regular.otf); |
| | | } |
| | | |
| | | |
| | | /* HTML5 display-role reset for older browsers */ |
| | | article, |
| | | aside, |
New file |
| | |
| | | <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="48" height="48" viewBox="0 0 48 48"><defs><clipPath id="master_svg0_55_1931"><rect x="0" y="0" width="48" height="48" rx="0"/></clipPath></defs><g clip-path="url(#master_svg0_55_1931)"><g><rect x="0" y="0" width="48" height="48" rx="0" fill="#FFFFFF" fill-opacity="0.009999999776482582" style="mix-blend-mode:passthrough"/></g><g><path d="M9.15075,9.15076Q3,15.3015,3,24Q3,32.698499999999996,9.15076,38.8492Q15.3015,45,24,45Q32.698499999999996,45,38.8492,38.8492Q45,32.698499999999996,45,24Q45,15.3015,38.8492,9.15075Q32.698499999999996,3,24,3Q15.3015,3,9.15075,9.15076ZM10.564969999999999,37.435Q5,31.8701,5,24Q5,16.1299,10.564969999999999,10.564969999999999Q16.1299,5,24,5Q31.8701,5,37.435,10.564969999999999Q43,16.1299,43,24Q43,31.8701,37.435,37.435Q31.8701,43,24,43Q16.1299,43,10.564969999999999,37.435Z" fill-rule="evenodd" fill="#6F5A3A" fill-opacity="1" style="mix-blend-mode:passthrough"/></g><g><path d="M14.49163818359375,23.5L32.49163818359375,23.5Q32.59013818359375,23.5,32.68673818359375,23.519215Q32.78333818359375,23.538429999999998,32.87433818359375,23.576121Q32.96533818359375,23.613812,33.04723818359375,23.66853Q33.12913818359375,23.723249,33.19873818359375,23.792893Q33.268338183593755,23.862537,33.32313818359375,23.94443Q33.37783818359375,24.026322,33.41553818359375,24.117317Q33.453238183593754,24.208311,33.47243818359375,24.30491Q33.49163818359375,24.4015086,33.49163818359375,24.5Q33.49163818359375,24.5984914,33.47243818359375,24.69509Q33.453238183593754,24.791689,33.41553818359375,24.882683Q33.37783818359375,24.973678,33.32313818359375,25.05557Q33.268338183593755,25.137463,33.19873818359375,25.207107Q33.12913818359375,25.276751,33.04723818359375,25.33147Q32.96533818359375,25.386188,32.87433818359375,25.423879Q32.78333818359375,25.461570000000002,32.68673818359375,25.480785Q32.59013818359375,25.5,32.49163818359375,25.5L14.49163818359375,25.5Q14.39314678359375,25.5,14.29654818359375,25.480785Q14.19994918359375,25.461570000000002,14.10895518359375,25.423879Q14.01796018359375,25.386188,13.93606818359375,25.33147Q13.85417518359375,25.276751,13.78453118359375,25.207107Q13.71488718359375,25.137463,13.66016818359375,25.05557Q13.60545018359375,24.973678,13.56775918359375,24.882683Q13.53006818359375,24.791689,13.510853183593749,24.69509Q13.49163818359375,24.5984914,13.49163818359375,24.5Q13.49163818359375,24.4015086,13.510853183593749,24.30491Q13.53006818359375,24.208311,13.56775918359375,24.117317Q13.60545018359375,24.026322,13.66016818359375,23.94443Q13.71488718359375,23.862537,13.78453118359375,23.792893Q13.85417518359375,23.723249,13.93606818359375,23.66853Q14.01796018359375,23.613812,14.10895518359375,23.576121Q14.19994918359375,23.538429999999998,14.29654818359375,23.519215Q14.39314678359375,23.5,14.49163818359375,23.5Z" fill-rule="evenodd" fill="#6F5A3A" fill-opacity="1" style="mix-blend-mode:passthrough"/></g><g><path d="M22.78453118359375,16.207107Q22.64387918359375,16.066455,22.56775818359375,15.882683Q22.49163818359375,15.698912,22.49163818359375,15.5Q22.49163818359375,15.4015086,22.51085318359375,15.30491Q22.530068183593748,15.208311,22.56775918359375,15.117317Q22.60545018359375,15.026322,22.66016818359375,14.94443Q22.71488718359375,14.862537,22.78453118359375,14.792893Q22.85417518359375,14.723249,22.93606818359375,14.66853Q23.01796018359375,14.613812,23.10895518359375,14.576121Q23.19994918359375,14.53843,23.29654818359375,14.519214999999999Q23.39314678359375,14.5,23.49163818359375,14.5Q23.69055018359375,14.5,23.87432118359375,14.57612Q24.05809318359375,14.652241,24.19874518359375,14.792893L33.19874818359375,23.79289Q33.33939818359375,23.93355,33.41551818359375,24.11732Q33.49163818359375,24.301090000000002,33.49163818359375,24.5Q33.49163818359375,24.698909999999998,33.41551818359375,24.88268Q33.33939818359375,25.06645,33.19874818359375,25.20711L24.19874518359375,34.2071Q24.05809218359375,34.3478,23.87432118359375,34.4239Q23.69055018359375,34.5,23.49163818359375,34.5Q23.39314678359375,34.5,23.29654818359375,34.4808Q23.19994918359375,34.461600000000004,23.10895518359375,34.4239Q23.01796018359375,34.3862,22.93606818359375,34.3315Q22.85417518359375,34.276700000000005,22.78453118359375,34.2071Q22.71488718359375,34.1375,22.66016818359375,34.0556Q22.60545018359375,33.9737,22.56775918359375,33.8827Q22.530068183593748,33.7917,22.51085318359375,33.6951Q22.49163818359375,33.5985,22.49163818359375,33.5Q22.49163818359375,33.301100000000005,22.56775818359375,33.1173Q22.64387918359375,32.933499999999995,22.78453118359375,32.7929L22.78541118359375,32.792L31.07742818359375,24.5L22.78453118359375,16.207107L22.78453118359375,16.207107Z" fill-rule="evenodd" fill="#6F5A3A" fill-opacity="1" style="mix-blend-mode:passthrough"/></g></g></svg> |
| | |
| | | <template > |
| | | <template> |
| | | <div> |
| | | <el-form |
| | | size="mini" |
| | | :inline="true" |
| | | style="padding: 0px 10px; |
| | | " |
| | | :model="from" |
| | | class="row demo-form-inline col-xs-12" |
| | | > |
| | | <el-form size="mini" :inline="true" style="padding: 0px 10px; |
| | | " :model="from" class="row demo-form-inline col-xs-12"> |
| | | <el-row :gutter="10"> |
| | | <el-form-item |
| | | style="width: 33%" |
| | | v-for="(item, i) in from.from" |
| | | :key="i" |
| | | :label="item.label" |
| | | > |
| | | <el-input |
| | | v-if="item.type === 'input'" |
| | | v-model="item.value" |
| | | :placeholder="item.label" |
| | | ></el-input> |
| | | <el-form-item style="width: 33%" v-for="(item, i) in from.from" :key="i" :label="item.label"> |
| | | <el-input v-if="item.type === 'input'" v-model="item.value" :placeholder="item.label"></el-input> |
| | | </el-form-item> |
| | | <!-- 其他表单项省略 --> |
| | | <!-- <el-form-item style="display:block; "> --> |
| | | <div class="flex flex-center Formbtn"> |
| | | <el-button |
| | | |
| | | size="mini" |
| | | @click="handleSubmit" |
| | | >搜索</el-button |
| | | > |
| | | <el-button size="mini" @click="handleReset" |
| | | >重置</el-button |
| | | > |
| | | <el-button size="mini" @click="handleSubmit">搜索</el-button> |
| | | <el-button size="mini" @click="handleReset">重置</el-button> |
| | | </div> |
| | | <!-- </el-form-item> --> |
| | | </el-row> |
| | |
| | | <script> |
| | | export default { |
| | | props: ["from"], |
| | | mounted(){ |
| | | mounted() { |
| | | }, |
| | | methods: { |
| | | handleSubmit() { |
| | |
| | | ::v-deep .el-form-item__content div { |
| | | width: 100%; |
| | | } |
| | | |
| | | ::v-deep.el-form--inline .el-form-item__label { |
| | | font-family: Source Han Sans; |
| | | font-size: 14px; |
| | | font-weight: bold; |
| | | color: #2C2C2C; |
| | | } |
| | | </style> |
| | |
| | | <template> |
| | | <div class="homeLayoutBox"> |
| | | <div class="leftMenu"> |
| | | <div class="leftMenuTitle" @click="$router.push('/home')">王永炎院士</div> |
| | | <div style="cursor: pointer;" class="leftMenuTitle" @click="$router.push('/home')">王永炎院士</div> |
| | | <div class="leftMenuContent"> |
| | | <p>学术思想传承</p> |
| | | <p>多维度数据库</p> |
| | |
| | | background: #937950; |
| | | display: flex; |
| | | flex-direction: column; |
| | | font-family: Alimama DongFangDaKai; |
| | | |
| | | font-family: siyuanBlod; |
| | | |
| | | .leftMenuTitle { |
| | | width: 100%; |
| | | height: 50px; |
| | | line-height: 50px; |
| | | text-align: center; |
| | | margin-top: 20px; |
| | | color: #fff; |
| | | font-size: 24px; |
| | | } |
| | |
| | | font-size: 20px; |
| | | line-height: 30px; |
| | | color: #fff; |
| | | margin: 10px 20px; |
| | | margin: 10px 14px; |
| | | margin-top: 0px; |
| | | padding: 10px 0; |
| | | text-align: center; |
| | | border-top: 1px solid #fff; |
| | | border-bottom: 1px solid #fff; |
| | | letter-spacing: 4px; |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .leftMenuList > menuItem:first-child { |
| | |
| | | justify-content: space-around; |
| | | border-top: 1px solid #b9a587; |
| | | margin-top: 20px; |
| | | |
| | | font-weight: bold; |
| | | .menuItem { |
| | | width: 100%; |
| | | display: flex; |
| | |
| | | cursor: pointer; |
| | | .menuText { |
| | | line-height: 50px; |
| | | font-weight: 700; |
| | | } |
| | | |
| | | i { |
| | |
| | | <p> |
| | | <span v-for="(item, index) in details.author" :key="index">{{ item }}</span> |
| | | </p> |
| | | <p v-if="details.abstract"> |
| | | <span>摘要:</span> |
| | | <span class="page-main-abstract" v-html="details.abstract"></span> |
| | | <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> |
| | |
| | | <li class="main-author"> |
| | | {{ item.author }} |
| | | </li> |
| | | <li class="main-title" :title="item.abstract" v-if="item.abstract"> |
| | | <li class="main-title" :title="item.abstract" v-if="item.cleanAbstract"> |
| | | <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"> |
| | | <span>关键词:</span> |
| | |
| | | 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, "视频地址"); |
| | | } |
| | | } |
| | | |
| | |
| | | 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 : ''; |
| | | }) |
| | |
| | | // 设置一个默认值或者进行其他错误处理 |
| | | 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, ""); |
| | |
| | | } 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 : ''; |
| | |
| | | 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; |
| | | } |
| | | } |
| | |
| | | font-size: 14px; |
| | | background-color: #937950; |
| | | color: #fff; |
| | | border: 1px solid #6f5a3a; |
| | | border: 1px solid #937950; |
| | | border-radius: 0; |
| | | |
| | | &:hover { |
| | | background-color: #6f5a3a; |
| | | background-color: #937950; |
| | | color: #fffdf8; |
| | | } |
| | | } |
| | |
| | | .page-main-abstract { |
| | | font-family: Source Han Sans !important; |
| | | font-size: 14px !important; |
| | | font-weight: 350 !important; |
| | | line-height: 26px !important; |
| | | color: #333333 !important; |
| | | font-weight: 100 !important; |
| | | } |
| | | |
| | | p:nth-child(1) { |
| | |
| | | margin-bottom: 13px; |
| | | 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; |
| | | |
| | | .abstract-title{ |
| | | font-weight: bold; |
| | | } |
| | | span { |
| | | font-family: Source Han Sans; |
| | | font-size: 14px; |
| | | font-weight: bold; |
| | | color: #333333; |
| | | } |
| | | |
| | | } |
| | | |
| | | p:nth-child(3) { |
| | |
| | | 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; |
| | | background-color: #937950; |
| | | color: #fffdf8; |
| | | } |
| | | } |
| | |
| | | color: #333; |
| | | 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; |
| | |
| | | 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"> |
| | |
| | | <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=" |
| | | () => |
| | | handleSearch({ |
| | | text: citem, |
| | | type: 'keyWords', |
| | | label: '关键词', |
| | | }) |
| | | " |
| | | > |
| | | {{ citem }} |
| | | </span> |
| | |
| | | > |
| | | </el-pagination> |
| | | </div> |
| | | <el-empty v-if="!loading && !resultList.length"></el-empty> |
| | | </div> |
| | | <el-empty v-if="!loading && !resultList.length"></el-empty> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | { value: "all", label: "全部" }, |
| | | { value: "Name", label: "标题" }, |
| | | { value: "author", label: "作者" }, |
| | | // { value: "year", label: "年份" }, |
| | | { value: "keyWords", label: "关键词" }, |
| | | { value: "abstract", label: "摘要" }, |
| | | { value: "source", label: "来源" }, |
| | |
| | | |
| | | methods: { |
| | | categoryChange(val) { |
| | | console.log(val, "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(); |
| | | }, |
| | |
| | | ); |
| | | this.inputValue = ""; |
| | | // 通知父组件数据已改变 |
| | | this.getItemList() |
| | | this.getItemList(); |
| | | }, |
| | | |
| | | // 搜索 |
| | | handleSearch(isText) { |
| | | this.associationList = [] |
| | | this.associationList = []; |
| | | if (isText.text != "") { |
| | | this.inputValue = isText.text; |
| | | this.inputType = isText.type; |
| | |
| | | // 请求数据 |
| | | getItemList() { |
| | | 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是空的 |
| | | 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; |
| | |
| | | } |
| | | } |
| | | } |
| | | 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: "*", |
| | |
| | | // 设置一个默认值或者进行其他错误处理 |
| | | 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); |
| | | }); |
| | | }, |
| | | // 处理页码变化 |
| | | handleCurrentChange(newPage) { |
| | | this.paginationPage = newPage; |
| | | this.getItemList(); // 重新获取数据 |
| | | |
| | | // 滚动到页面顶部 |
| | | this.$nextTick(() => { |
| | | const pageMain = document.querySelector('.page-main-father'); |
| | |
| | | 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", |
| | | }); |
| | | } |
| | | }); |
| | |
| | | } |
| | | } |
| | | |
| | | ::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; |
| | |
| | | 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; |
| | | } |
| | | } |
| | |
| | | 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; |
| | |
| | | border-radius: 5px; |
| | | border: 1px solid #cccccc; |
| | | } |
| | | </style> |
| | | :deep.el-pagination.is-background .el-pager li:not(.disabled):hover{ |
| | | color: #937950 |
| | | } |
| | | </style> |
| | | |
| | | <style> |
| | | .el-input.is-focus .el-input__inner { |
| | | color: #937950 !important; |
| | | border-color: #937950 !important; |
| | | font-weight: bold; |
| | | } |
| | | |
| | | .el-select-dropdown__item.selected { |
| | | color: #937950 !important; |
| | | font-weight: bold; |
| | | } |
| | | |
| | | .el-select .el-input__inner:focus { |
| | | border-color: #937950; |
| | | font-weight: bold; |
| | | } |
| | | </style> |
| | |
| | | class="journalBox" |
| | | v-if="info.cmsItemType === 'journal' || info.cmsItemType === 'books'" |
| | | > |
| | | <div class="title">{{ info.name }}</div> |
| | | <div :title="info.name" class="title">{{ info.name }}</div> |
| | | <div class="subtitle"> |
| | | <div class="source">{{ info.source }}</div> |
| | | <div class="journalInformation">{{ info.IssueNumber }}</div> |
| | |
| | | </div> |
| | | </div> |
| | | <div class="videoBox" v-if="info.cmsItemType === 'video'"> |
| | | <video width="370" height="200" controls :src="info.requestCtx"></video> |
| | | <video width="370" height="200" controls :src="info.fileLink"></video> |
| | | |
| | | <div> |
| | | <div class="subtitle"> |
| | |
| | | </div> |
| | | <div class="contentBox" style="text-align: left"> |
| | | <div class="contentBox" style="text-align: left"> |
| | | <div class="audioContent" v-html="info.abstract"></div> |
| | | </div></div> |
| | | <div class="audioContent" v-html="info.abstract"></div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="audioBox" v-if="info.cmsItemType === 'audio'"> |
| | | <div style="text-align: center"> |
| | | <audio |
| | | style="width: 90%" |
| | | src="https://www.w3schools.com/html/horse.ogg" |
| | | :src="info.fileLink" |
| | | controls |
| | | ></audio> |
| | | </div> |
| | |
| | | </div> |
| | | |
| | | <div class="btnBox"> |
| | | <div class="detailBtn">查看详情</div> |
| | | <div @click="toDetail" class="detailBtn">查看详情</div> |
| | | </div> |
| | | </div> |
| | | </template> |
| | |
| | | data() { |
| | | return {}; |
| | | }, |
| | | |
| | | mounted() { |
| | | console.log(this.info); |
| | | }, |
| | | methods: { |
| | | toDetail() { |
| | | this.$router.push({ name: "details", query: { id: this.info.id } }); |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | |
| | | font-size: 16px; |
| | | line-height: 22px; |
| | | font-weight: 600; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | white-space: nowrap; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | .subtitle { |
| | |
| | | cursor: pointer; |
| | | border: 1px solid #8f7a5a; |
| | | } |
| | | .audioContent{ |
| | | .audioContent { |
| | | white-space: pre-line; |
| | | line-height: 18px; |
| | | margin-top: 10px; |
| | |
| | | overflow-y: auto; |
| | | margin-top: 20px; |
| | | } |
| | | video { |
| | | border-radius: 10px; |
| | | border: 1px solid #dcdcdc; |
| | | box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); |
| | | } |
| | | </style> |
| | |
| | | class="gradchild" |
| | | v-for="(citem, cindex) in item.list" |
| | | :style="{ background: citem.color }" |
| | | @click.stop="showDetail(index, cindex, 1, $event)" |
| | | @click.self="showDetail(index, cindex, 1, $event)" |
| | | :key="cindex" |
| | | > |
| | | <div class="detailDialog" v-if="citem.showDetail"> |
| | | <div |
| | | class="detailDialog" |
| | | :style="popupStyle" |
| | | v-if="citem.showChildDetail" |
| | | > |
| | | <div |
| | | class="closeBtn" |
| | | @click.stop="closeDetail(index, cindex, 0)" |
| | |
| | | import moment from "moment"; |
| | | import floatingWindow from "./floatingWindow.vue"; |
| | | import yearWindow from "./yearWindow.vue"; |
| | | |
| | | import { nextTick } from "vue"; |
| | | import fileApi from "@/assets/js/middleGround/api/file"; |
| | | import { requestCtx, appRefCode } from "@/assets/js/config"; |
| | | export default { |
| | | components: { |
| | | floatingWindow, |
| | |
| | | audio: "#b9a587", |
| | | newspaper: "#8d77b3", |
| | | other: "#009f9f", |
| | | }, |
| | | popupStyle: { |
| | | left: "0", |
| | | top: "0", |
| | | }, |
| | | }; |
| | | }, |
| | |
| | | }, |
| | | }) |
| | | .then(async (res) => { |
| | | console.log(res, "res"); |
| | | for (let i = 0; i < res.datas.length; i++) { |
| | | const item = res.datas[i]; |
| | | this.$set(item, "showDetail", false); |
| | | const listData = await this.getYearResource(item); |
| | | if (listData.length > 0) { |
| | | this.$set(item, "list", listData); |
| | | for (let j = 0; j < listData.length; j++) { |
| | | const element = listData[j]; |
| | | this.$set(element, "showChildDetail", false); |
| | | } |
| | | console.log(item, "item"); |
| | | } |
| | | } |
| | | |
| | | console.log(this.contentList, "this.contentList"); |
| | | this.contentList = res.datas; |
| | | this.showList = true; |
| | | }); |
| | |
| | | const filterList = yearDataList.datas.filter((item) => { |
| | | return item.cmsItemType != "chronology" && item.cmsItemType != "AWARD"; |
| | | }); |
| | | |
| | | if (filterList && filterList.length > 0) { |
| | | for (let i = 0; i < filterList.length; i++) { |
| | | const item = filterList[i]; |
| | | if (item.file) { |
| | | const requestCtx = |
| | | this.config.requestCtx + `/file/api/ApiDownload?md5=${item.file}`; |
| | | const requestCtx = await this.getResourcePath(item.file); |
| | | console.log(requestCtx, "requestCtx"); |
| | | this.$set(item, "fileLink", requestCtx); |
| | | } |
| | | this.$set(item, "showDetail", false); |
| | |
| | | } |
| | | return filterList; |
| | | }, |
| | | |
| | | // 获取阿里云加速地址 (视频,音频) |
| | | async getResourcePath(md5) { |
| | | try { |
| | | // 如果返回的数据为空或未定义,则拼接默认下载路径 |
| | | return requestCtx + "/file/api/ApiDownload?md5=" + md5; |
| | | } catch (error) { |
| | | // 捕获异常并打印错误日志 |
| | | console.error("获取资源路径失败:", error); |
| | | // 返回一个默认值或抛出错误(根据业务需求) |
| | | return requestCtx + "/file/api/ApiDownload?md5=" + md5; |
| | | } |
| | | }, |
| | | |
| | | closeDetail(index, cindex, type) { |
| | | for (let i = 0; i < this.contentList.length; i++) { |
| | | const item = this.contentList[i]; |
| | | if (item && item.length > 0) { |
| | | if (item && item.list?.length > 0) { |
| | | for (let j = 0; j < item.list.length; j++) { |
| | | const citem = item.list[j]; |
| | | this.$set(citem, "showDetail", false); |
| | | this.$set(citem, "showChildDetail", false); |
| | | } |
| | | } |
| | | } |
| | | this.contentList[index].list[cindex].showDetail = false; |
| | | |
| | | console.log( |
| | | this.contentList[index].list, |
| | | "this.contentList[index].list[cindex]" |
| | | ); |
| | | }, |
| | | showDetail(index, cindex, type, event) { |
| | | console.log(event, "event"); |
| | | const rect = event.target.getBoundingClientRect(); |
| | | const screenWidth = window.innerWidth; |
| | | const popupWidth = 542; // 假设弹框宽度为200px |
| | | // 判断触发元素位置 |
| | | if (rect.left + rect.width / 2 < screenWidth / 2) { |
| | | // 左侧显示弹框在右侧 |
| | | this.popupStyle = { |
| | | left: `${rect.right}px`, |
| | | top: `${rect.bottom - 150}px`, |
| | | }; |
| | | } else { |
| | | // 右侧显示弹框在左侧 |
| | | this.popupStyle = { |
| | | left: `${rect.left - popupWidth}px`, |
| | | top: `${rect.bottom - 150}px`, |
| | | }; |
| | | } |
| | | console.log(this.popupStyle.top, "this.top"); |
| | | console.log(this.popupStyle.left, "this.left"); |
| | | // if (rect.left - popupWidth < 0) { |
| | | // // 左侧空间不足时强制右侧显示 |
| | | // this.popupStyle.left = `${rect.right}px`; |
| | | // } else if (rect.right + popupWidth > screenWidth) { |
| | | // // 右侧空间不足时强制左侧显示 |
| | | // this.popupStyle.left = `${rect.left - popupWidth}px`; |
| | | // } |
| | | for (let i = 0; i < this.contentList.length; i++) { |
| | | const item = this.contentList[i]; |
| | | if (item && item.length > 0) { |
| | | if (item && item.list?.length > 0) { |
| | | for (let j = 0; j < item.list.length; j++) { |
| | | const citem = item.list[j]; |
| | | this.$set(citem, "showDetail", false); |
| | | item.showDetail = false; |
| | | if (citem.showChildDetail) { |
| | | this.contentList[i].list[j].showDetail = false; |
| | | citem.showChildDetail = false; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | if (this.contentList[index].list[cindex].type) { |
| | | this.contentList[index].list[cindex].showDetail = true; |
| | | this.contentList[index].list[cindex].showChildDetail = true; |
| | | } |
| | | console.log(this.contentList[index].list, "this.contentList[index].list[cindex]"); |
| | | }, |
| | | }, |
| | | }; |
| | |
| | | display: flex; |
| | | flex-direction: column; |
| | | overflow: auto; |
| | | font-family: Source Han Sans; |
| | | } |
| | | |
| | | .pageBox { |
| | |
| | | position: relative; |
| | | } |
| | | |
| | | .gradchild:hover { |
| | | width: 25px; |
| | | height: 25px; |
| | | margin-top: 2px; |
| | | margin-right: 2px; |
| | | cursor: pointer; |
| | | position: relative; |
| | | // .gradchild :hover { |
| | | // transform: scale(1.1); |
| | | // z-index: 999; |
| | | // } |
| | | |
| | | /* 重置子元素的样式 */ |
| | | // .gradchild:hover .detailDialog { |
| | | // transform: scale(1); |
| | | // z-index: 999; |
| | | // } |
| | | .item-circle :hover ::before { |
| | | background-color: #b9a587 !important; |
| | | } |
| | | .item-circle { |
| | | width: 100%; |
| | |
| | | align-items: center; |
| | | } |
| | | .detailDialog { |
| | | position: absolute; |
| | | top: -700%; |
| | | transform: translateY(20%); |
| | | transform: translateX(-50%); |
| | | position: fixed; |
| | | width: 524px; |
| | | z-index: 9999; |
| | | cursor: pointer; |
| | |
| | | border: 2px solid #cbbeaa; |
| | | box-shadow: 2px 2px 4px 1px rgba(0, 0, 0, 0.5); |
| | | } |
| | | |
| | | video { |
| | | border-radius: 10px; |
| | | border: 1px solid #dcdcdc; |
| | | box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); |
| | | } |
| | | .yaerWindow { |
| | | position: absolute; |
| | | left: -54px; |
| | |
| | | border: 2px solid #cbbeaa; |
| | | box-shadow: 2px 2px 4px 1px rgba(0, 0, 0, 0.5); |
| | | } |
| | | .detailDialog .dialogContent { |
| | | width: 100%; |
| | | height: 100%; |
| | | background-color: #fff; |
| | | position: relative; |
| | | padding: 5px; |
| | | z-index: 20; |
| | | box-sizing: border-box; |
| | | } |
| | | // .detailDialog .dialogContent { |
| | | // width: 100%; |
| | | // height: 100%; |
| | | // background-color: #fff; |
| | | // position: relative; |
| | | // padding: 5px; |
| | | // z-index: 20; |
| | | // box-sizing: border-box; |
| | | // } |
| | | .closeBtn { |
| | | position: absolute; |
| | | width: 20px; |
| | |
| | | right: 5px; |
| | | z-index: 999; |
| | | } |
| | | |
| | | ::v-deep .el-loading-spinner { |
| | | color: #937950 !important; |
| | | .el-loading-text { |
| | | font-size: 14px; |
| | | color: #937950; |
| | | } |
| | | |
| | | .el-icon-loading { |
| | | font-size: 14px; |
| | | color: #937950; |
| | | } |
| | | } |
| | | </style> |
| | |
| | | <div class="content"> |
| | | <div class="leftTxt" v-html="info.eventOverview"></div> |
| | | <div class="rightimg"> |
| | | <div v-if="imgLink != ''" class="imgBox"> |
| | | <img class="autoImg" :src="imgLink" alt="" /> |
| | | <div class="imgBox" style="text-align: center" v-if="imgLink != ''"> |
| | | <div class="arrowBox leftArrowBox"> |
| | | <img class="autoImg" :src="arrow" alt="" /> |
| | | </div> |
| | | <div class="imgBox"> |
| | | <img class="autoImg" :src="imgLink" alt="" /> |
| | | </div> |
| | | <div class="arrowBox"> |
| | | <img class="autoImg" :src="arrow" alt="" /> |
| | | </div> |
| | | </div> |
| | | <div style="text-align: center; font-size: 18px; color: #999" v-else>暂无图片</div> |
| | | <div style="text-align: center; font-size: 18px; color: #999" v-else> |
| | | 暂无图片 |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | |
| | | <script> |
| | | import { getPublicImage } from "@/assets/js/middleGround/tool"; |
| | | |
| | | import arrow from "@/assets/images/right_arrow.svg"; |
| | | export default { |
| | | name: "floatingWindow", |
| | | props: { |
| | |
| | | return { |
| | | title: "", |
| | | imgLink: "", |
| | | arrow, |
| | | }; |
| | | }, |
| | | methods: {}, |
| | |
| | | padding: 15px; |
| | | z-index: 20; |
| | | box-sizing: border-box; |
| | | background-color: #FDF8F0; |
| | | background-color: #fdf8f0; |
| | | } |
| | | .content { |
| | | display: flex; |
| | |
| | | overflow: hidden; |
| | | white-space: normal; |
| | | overflow-y: auto; |
| | | |
| | | padding: 10px; |
| | | } |
| | | .rightimg { |
| | | width: 350px; |
| | | height: 100%; |
| | | padding: 10px; |
| | | padding-top: 0px; |
| | | } |
| | | .title { |
| | | font-size: 24px; |
| | |
| | | min-height: 300px; |
| | | position: relative; |
| | | } |
| | | |
| | | .arrowBox { |
| | | width: 30px; |
| | | height: 30px; |
| | | position: relative; |
| | | } |
| | | .imgBox{ |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | } |
| | | .arrowBox{ |
| | | margin: 0 5px; |
| | | } |
| | | |
| | | .leftArrowBox{ |
| | | transform: rotate(180deg); |
| | | } |
| | | </style> |
| | |
| | | <!-- 图表显示 --> |
| | | <div |
| | | class="charts-main" |
| | | v-if="activeTabs == 'chart'" |
| | | v-show="activeTabs == 'chart'" |
| | | v-loading="loading" |
| | | element-loading-text="图表加载中" |
| | | element-loading-spinner="el-icon-loading" |
| | |
| | | 职称:{{ currentNodeInfo.professionalTitle || "-" }} |
| | | </p> |
| | | </div> |
| | | <div style="text-align: left; line-height: 22px;max-height:200px;overflow-y: auto; padding: 10px;" > |
| | | <div |
| | | style=" |
| | | text-align: left; |
| | | line-height: 22px; |
| | | max-height: 200px; |
| | | overflow-y: auto; |
| | | padding: 10px; |
| | | " |
| | | > |
| | | <div v-html="currentNodeInfo.studentProfile"></div> |
| | | </div> |
| | | <!-- <div |
| | |
| | | </transition> |
| | | </div> |
| | | <!-- 列表显示 --> |
| | | <div class="page-main" v-if="activeTabs == 'list'"> |
| | | <div class="page-main" v-show="activeTabs == 'list'"> |
| | | <div |
| | | v-loading="loading" |
| | | style="min-height: 550px" |
| | |
| | | <div v-for="(item, index) in universityList" :key="index"> |
| | | <div |
| | | class="table-title" |
| | | v-if="item.studentList && item.studentList.length > 0" |
| | | > |
| | | v-if="item.studentList && item.studentList.length > 0"> |
| | | <div class="table-title-left"> |
| | | <p class="table-title-name">{{ item.unitName }}</p> |
| | | <p class="table-title-degree">{{ item.academicDegreeName }}</p> |
| | |
| | | </div> |
| | | <div |
| | | class="table-title-right" |
| | | @click="item.isShow = !item.isShow" |
| | | > |
| | | @click="item.isShow = !item.isShow"> |
| | | <img :src="[item.isShow ? topIcon : bottomIcon]" alt="" /> |
| | | </div> |
| | | </div> |
| | |
| | | methods: { |
| | | changeTab(key) { |
| | | this.activeTabs = key; |
| | | console.log(this.activeTabs, "activeTabs"); |
| | | // console.log(this.activeTabs, "activeTabs"); |
| | | if (key == "chart") { |
| | | this.initChart(); |
| | | } |
| | | }, |
| | | initChart() { |
| | | this.chart = echarts.init(this.$refs.chart); |
| | |
| | | formatter: (params) => { |
| | | const data = params.data; |
| | | this.currentNodeInfo = data; |
| | | console.log(data, "data"); |
| | | // console.log(data, "data"); |
| | | if (data.cmsItemType == "student") { |
| | | return ` |
| | | <div style=" |
| | |
| | | |
| | | this.chart.setOption(option); |
| | | this.chart.on("click", (params) => { |
| | | console.log("点击时的回调", params); |
| | | // console.log("点击时的回调", params); |
| | | this.tooltipShow = true; |
| | | }); |
| | | }, |
| | |
| | | }; |
| | | }); |
| | | this.academicDegreeList = academicDegreeListResult.option; |
| | | console.log(this.academicDegreeList, "this.academicDegreeList"); |
| | | } catch (error) { |
| | | console.error("获取下拉框数据失败:", error); |
| | | } |
| | |
| | | return MG.store |
| | | .getProductTypeField(requestData) |
| | | .then((res) => { |
| | | console.log(res, "下拉框数据"); |
| | | const selestList = JSON.parse(res[0].config); |
| | | return selestList; |
| | | }) |
| | |
| | | }); |
| | | this.loading = false; |
| | | console.log(res, "res"); |
| | | console.log(arrList, "arrList"); |
| | | if (res.datas && res.datas.length) { |
| | | res.datas.forEach((item) => { |
| | | arrList.forEach((citem) => { |
| | |
| | | }); |
| | | }); |
| | | arrList = arrList.filter((item) => item.studentList.length); |
| | | console.log(arrList, "arrList"); |
| | | |
| | | // console.log(arrList, "arrList"); |
| | | |
| | | this.universityList = arrList; |
| | | // this.chartData.children = arrList; |
| | | this.chartData.children = arrList; |
| | | const temp_chartData = { |
| | | name: "王永炎", |
| | | children: arrList, |
| | | }; |
| | | this.chartData = temp_chartData; |
| | | |
| | | console.log(this.chartData, "this.chartData"); |
| | | // console.log(this.chartData, "this.chartData"); |
| | | this.initChart(); |
| | | } |
| | | }) |
| | |
| | | overflow: hidden; |
| | | display: flex; |
| | | flex-direction: column; |
| | | font-family: Source Han Sans; |
| | | } |
| | | |
| | | .page-header { |
| | |
| | | font-size: 14px; |
| | | color: #937950; |
| | | } |
| | | |
| | | ::v-deep .el-loading-spinner { |
| | | .el-loading-text { |
| | | font-size: 14px; |
| | | color: #937950; |
| | | } |
| | | |
| | | .el-icon-loading { |
| | | font-size: 14px; |
| | | color: #937950; |
| | | } |
| | | } |
| | | </style> |
| | |
| | | background-size: 98% 95%; |
| | | position: relative; |
| | | box-sizing: border-box; |
| | | font-family: siyuan; |
| | | |
| | | } |
| | | .bgBox { |
| | | width: 100%; |
| | |
| | | font-size: 40px; |
| | | font-weight: 600; |
| | | margin-top: 20px; |
| | | font-family: siyuan; |
| | | } |
| | | .menuSubTitle { |
| | | font-size: 28px; |
| | | margin-top: 20px; |
| | | font-family: siyuan; |
| | | |
| | | } |
| | | .menuLine { |
| | | margin-top: 40px; |
| | |
| | | <!-- 左边标题 --> |
| | | <div class="honors-main-title">荣<br />誉<br />奖<br />项</div> |
| | | <!-- 右边内容 --> |
| | | <div class="honors-text" v-loading="loading" element-loading-background="rgba(0, 0, 0, 0)" element-loading-text="学生列表加载中" |
| | | element-loading-spinner="el-icon-loading"> |
| | | <div class="honors-text" v-loading="loading" element-loading-background="rgba(0, 0, 0, 0)" |
| | | element-loading-text="学生列表加载中" element-loading-spinner="el-icon-loading"> |
| | | <div style="min-height: 646px;"> |
| | | <ul> |
| | | <li v-for="(item, index) in honorList" :key="index"> |
| | |
| | | </li> |
| | | </ul> |
| | | </div> |
| | | <!-- 分页 --> |
| | | <div class="pagination"> |
| | | <el-pagination @current-change="handleCurrentChange" class="msg-pagination-container" |
| | | :background="isBackground" layout="prev, pager, next" :total="total"> |
| | | </el-pagination> |
| | | <div class="honor-main-bottom"> |
| | | <!-- “山”图片 --> |
| | | <img class="honor-Bg" src="../../assets/images/honors/honor-Bg.png" alt="" /> |
| | | <!-- 分页 --> |
| | | <div class="pagination"> |
| | | <el-pagination @current-change="handleCurrentChange" class="msg-pagination-container" |
| | | :background="isBackground" layout="prev, pager, next" :total="total"> |
| | | </el-pagination> |
| | | </div> |
| | | </div> |
| | | <!-- “山”图片 --> |
| | | <img class="honor-Bg" src="../../assets/images/honors/honor-Bg.png" alt="" /> |
| | | |
| | | |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | start: (this.currentPage - 1) * 10, |
| | | size: 10, |
| | | }, |
| | | // coverSize: { |
| | | // height: 70 |
| | | // } |
| | | coverSize: { |
| | | height: 70 |
| | | } |
| | | }).then((res) => { |
| | | console.log(res, "res"); |
| | | if (res.datas && res.datas.length) { |
| | |
| | | } |
| | | } |
| | | |
| | | .honor-main-bottom { |
| | | display: flex; |
| | | justify-content: space-between |
| | | } |
| | | |
| | | ::v-deep .el-loading-spinner { |
| | | .el-loading-text { |
| | | font-size: 14px; |
| | | color: #937950; |
| | | } |
| | | |
| | | .el-icon-loading { |
| | | font-size: 14px; |
| | | color: #937950; |
| | | } |
| | | } |
| | | |
| | | @font-face { |
| | | font-family: "Alimama DongFangDaKai"; |
| | | src: url("../../assets/font/阿里妈妈东方大楷.ttf"); |
| | |
| | | background-color: #937950; |
| | | color: #fff; |
| | | border-radius: 5px; |
| | | border: 1px solid #cccccc; |
| | | border: 1px solid#cccccc; |
| | | } |
| | | |
| | | //修改鼠标滑过的颜色 |
| | | |
| | | :deep.el-pagination.is-background .el-pager li:not(.disabled):hover{ |
| | | color: #937950 |
| | | } |
| | | |
| | | :deep.msg-pagination-container.is-background .el-pager li:hover{ |
| | | color: #937950; |
| | | } |
| | | :deep.el-pagination.is-background .el-pager li:hover { |
| | | color: #937950; |
| | | } |
| | | </style> |