From 87c87f989dcc3027407eccde48a6b35f0f999570 Mon Sep 17 00:00:00 2001 From: 杨磊 <505174330@qq.com> Date: 星期一, 28 四月 2025 14:48:23 +0800 Subject: [PATCH] 高级检索 --- src/views/achievements/index.vue | 291 +++++++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 217 insertions(+), 74 deletions(-) diff --git a/src/views/achievements/index.vue b/src/views/achievements/index.vue index eb71247..80fc281 100644 --- a/src/views/achievements/index.vue +++ b/src/views/achievements/index.vue @@ -19,12 +19,17 @@ </ul> <!-- 楂樼骇鎼滅储 --> <div v-if="isDisplay" class="page-search"> - <MyForm class="myfrom" @submit=" - (data) => { - CurrentPage = 1; - onSubmit(data); - } - " @reset="resetForm" :from="from" /> + <MyForm + class="myfrom" + @submit=" + (data) => { + CurrentPage = 1; + onSubmit(data); + } + " + @reset="resetForm" + :from="from" + /> </div> <!-- 鎼滅储缁撴灉 --> <div class="page-content"> @@ -34,15 +39,31 @@ <li class="left-title"> <span>{{ category.title }}</span> <p @click="category.isDisplay = !category.isDisplay"> - <img :src="[category.isDisplay ? topIcon : bottomIcon]" alt="" /> + <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 + 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> @@ -53,25 +74,50 @@ <span>{{ annual.title }}</span> <span> 鏃堕棿 - <img class="sort-Icon" :src="[isDisplay ? sortTop : sortBottom]" alt="" /> + <img + class="sort-Icon" + :src="[isDisplay ? sortTop : sortBottom]" + alt="" + /> </span> - <span>鏂囩尞閲� - <img class="sort-Icon" :src="[isDisplay ? sortBottom : sortTop]" alt="" /> + <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="" /> + <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> + <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', '骞村害')"> + <p + class="annual-footer" + v-if="annual.list && annual.list.length > 5" + @click="shrinkClick('a', '骞村害')" + > {{ activeBox !== "a" ? "鏇村 鈭�" : "鏀惰捣 鈭�" }} </p> </li> @@ -83,23 +129,42 @@ <span>{{ sources.title }}</span> <span> 鏂囩尞閲� - <img class="sort-Icon" :src="[isDisplay ? sortBottom : sortTop]" alt="" /> + <img + class="sort-Icon" + :src="[isDisplay ? sortBottom : sortTop]" + alt="" + /> </span> </div> <p @click="sources.isDisplay = !sources.isDisplay"> - <img :src="[sources.isDisplay ? topIcon : bottomIcon]" alt="" /> + <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> + <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', '鏂囩尞鏉ユ簮')"> + <p + class="sources-footer" + v-if="sources.list && sources.list.length > 5" + @click="shrinkClick('b', '鏂囩尞鏉ユ簮')" + > {{ activeBox !== "b" ? "鏇村 鈭�" : "鏀惰捣 鈭�" }} </p> </li> @@ -109,39 +174,67 @@ <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> </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)"> + <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="" /> + <img + @click="removeAssociationList(item.content)" + :src="errorIcon" + alt="" + /> </li> </ul> <!-- 鍏眡x鏉� --> <ul class="right-number"> <ul class="number-number"> - 鍏辨壘鍒�<span>{{ this.total }}</span>鏉$粨鏋� + 鍏辨壘鍒�<span>{{ this.total }}</span + >鏉$粨鏋� </ul> <ul class="number-time"> 鍙戣〃鏃堕棿 - <span @click="sortChange()"><img :src="!postedSortInfo ? sortBottom : sortTop" alt="" /></span> + <span @click="sortChange()" + ><img :src="!postedSortInfo ? sortBottom : sortTop" alt="" + /></span> </ul> </ul> <!-- 缁撴灉灞曠ず --> - <ul class="right-main" v-for="(item, index) in resultList" :key="index"> + <ul + class="right-main" + v-for="(item, index) in resultList" + :key="index" + > <li class="main-name"> <p>{{ item.name }}</p> <p> @@ -158,22 +251,46 @@ <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> </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: '鍏抽敭璇�' })"> + <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="6"> + <el-pagination + @current-change="handleCurrentChange" + class="msg-pagination-container" + :background="isBackground" + layout="prev, pager, next" + :total="total" + :page-size="6" + > </el-pagination> </div> <el-empty v-if="!loading && !resultList.length"></el-empty> @@ -467,14 +584,21 @@ 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(); }, @@ -577,12 +701,12 @@ ); this.inputValue = ""; // 閫氱煡鐖剁粍浠舵暟鎹凡鏀瑰彉 - this.getItemList() + this.getItemList(); }, // 鎼滅储 handleSearch(isText) { - this.associationList = [] + this.associationList = []; if (isText.text != "") { this.inputValue = isText.text; this.inputType = isText.type; @@ -597,19 +721,25 @@ // 璇锋眰鏁版嵁 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; @@ -618,6 +748,19 @@ } } } + 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: "*", @@ -663,10 +806,12 @@ 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 + 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; }); @@ -677,11 +822,11 @@ 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", }); } }); @@ -730,7 +875,6 @@ ::v-deep .el-loading-spinner { .el-loading-text { - font-size: 14px; color: #937950; } @@ -740,7 +884,6 @@ color: #937950; } } - .page-main-father { flex: 1; @@ -798,10 +941,8 @@ font-family: Source Han Sans; font-size: 14px; font-weight: bold; - color: #2C2C2C; - + color: #2c2c2c; } - } .input-txt { @@ -854,7 +995,6 @@ background-color: transparent; color: #937950; border: 1px solid #937950; - ; cursor: pointer; &:hover { @@ -982,12 +1122,15 @@ border-color: #d1d1d1; } - ::v-deep .el-checkbox .el-checkbox__input.is-checked+.el-checkbox__label { + ::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 { + ::v-deep + .el-checkbox + .el-checkbox__input.is-indeterminate + .el-checkbox__inner { border-color: #8f7a5a; background-color: #8f7a5a; } @@ -1240,7 +1383,9 @@ border: 1px solid #cccccc; } -:deep.msg-pagination-container.is-background .el-pager li:not(.disabled).active { +:deep.msg-pagination-container.is-background + .el-pager + li:not(.disabled).active { /*褰撳墠閫変腑椤垫暟鐨勬牱寮忚繘琛屼慨鏀�*/ background-color: #937950; color: #fff; @@ -1254,9 +1399,7 @@ color: #937950 !important; border-color: #937950 !important; font-weight: bold; - } - .el-select-dropdown__item.selected { color: #937950 !important; @@ -1267,4 +1410,4 @@ border-color: #937950; font-weight: bold; } -</style> \ No newline at end of file +</style> -- Gitblit v1.9.1