From 20dee1a91f02eaaccfb0e0126dd16c578bf8f4fe Mon Sep 17 00:00:00 2001 From: YM <479443481@qq.com> Date: 星期四, 25 七月 2024 15:48:08 +0800 Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/TCM_CharacterLibrary --- src/pages/academicSchools/index.vue | 592 +++++++++++++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 535 insertions(+), 57 deletions(-) diff --git a/src/pages/academicSchools/index.vue b/src/pages/academicSchools/index.vue index cea42cc..1e8272e 100644 --- a/src/pages/academicSchools/index.vue +++ b/src/pages/academicSchools/index.vue @@ -62,10 +62,11 @@ <div class="selectActivelyBox" @click="selectActively"> <p v-if="formData.actively.length == 0">璇烽�夋嫨娲诲姩鍦�</p> <el-tag + style="margin-right: 5px" v-for="item in formData.actively" - :key="item.id" + :key="item.index" size="small" - closable + type="info" >{{ item.name }}</el-tag > </div> @@ -131,12 +132,84 @@ </el-col> </el-row> <div style="text-align: right"> - <el-button type="primary" size="mini" @click="searchFun" + <el-button + size="mini" + style="background-color: #244a7b; color: #fff" + @click="searchFun" >鎼滅储</el-button > <el-button size="mini" @click="resetForm">閲嶇疆</el-button> </div> </el-form> + <div class="fromTable"> + <el-table + :data="tableData" + class="lightBo" + style="width: 100%" + empty-text="鏆傛棤鎼滅储淇℃伅" + size="small" + :border="true" + :height="tableData.length > 0 ? '443' : 'auto'" + > + <el-table-column + prop="id" + label="搴忓彿" + width="70" + ></el-table-column> + <el-table-column prop="name" width="150" label="濮撳悕"> + <template slot-scope="scope"> + <a + style="cursor: pointer; color: #027edc" + @click=" + () => { + currentId = scope.row.id; + getData(); + isAdvancedSearch = false; + } + " + >{{ scope.row.name }}</a + > + </template> + </el-table-column> + <el-table-column prop="alias" label="鍒悕"></el-table-column> + <el-table-column prop="place" label="娲诲姩鍦�"></el-table-column> + <el-table-column + prop="medicalBranch" + label="鍖诲鍒嗙" + width="150" + ></el-table-column> + <el-table-column prop="workName" label="浣滃搧"></el-table-column> + <el-table-column + prop="personLabel" + width="150" + label="浜虹墿鏍囩" + ></el-table-column> + <el-table-column + prop="socialDistinction" + label="绀句細韬唤" + width="150" + ></el-table-column> + <el-table-column + prop="period" + width="150" + label="鏃舵湡" + ></el-table-column> + </el-table> + <div class="drawerPage"> + <el-pagination + class="paging flex" + background + @size-change="handleSizeChangeForm" + @current-change="handleCurrentChangeForm" + :current-page="formData.currentPage" + :page-sizes="[10, 20, 60, 100]" + :page-size="formData.pageSize" + layout="total, sizes, prev, pager, next, jumper" + :total="formData.total" + > + </el-pagination> + </div> + </div> </view> <div v-if="showPerson" class="personDialog"> <i @@ -176,7 +249,7 @@ style="margin-top: 0.1rem; flex: 1; width: 100%; position: relative" > <div - v-if="!loading && relationships.length == 0" + v-if="!loading && nodeDatas.length == 0" style=" position: absolute; top: 30%; @@ -185,6 +258,7 @@ text-align: center; font-size: 0.2rem; color: #666; + z-index: 99; " > 鏆傛棤鐩稿叧鏁版嵁 @@ -200,6 +274,7 @@ text-align: center; font-size: 0.2rem; color: #666; + z-index: 99; " ></div> </div> @@ -223,22 +298,94 @@ <span @click="closeDom">鍏抽棴</span> </div> <div class="content"> - <p>濮撳悕锛歿{ detailData.name }}</p> - <p>鍒悕锛歿{ detailData.alias }}</p> - <p>绫嶈疮锛歿{ detailData.nativePlace }}</p> - <p>鍖诲鍒嗙锛� {{ detailData.medicalBranch }}</p> - <p>灏忎紶锛歿{ detailData.biography }}</p> + <p>浠h〃浜虹墿锛歿{ detailData.character }}</p> + <p>閲嶈鍖诲锛歿{ detailData.skilledDoctor }}</p> + <p>浠h〃鎬ц憲浣滐細{{ detailData.works }}</p> + <p>瀛︽淳鎬濇兂锛� {{ detailData.thought }}</p> </div> <div class="btn" @click="spaceTimeArr(detailData.id)">鏌ョ湅鏇村>>></div> </div> - <el-drawer title="鍦板潃鍒楄〃" :visible.sync="drawer" direction="rtl" :before-close="handleClose" + class="customDrawer" > - <span>鎴戞潵鍟�!</span> + <div class="drawerContent"> + <div class="drawerTips">閬镐腑鐨勫湴鍧�锛�</div> + <div class="drawerTable"> + <div class="tableTabs"> + <div class="inputItem"> + <el-input + placeholder="璜嬭几鍏ュ湴鍚嶆悳绱�" + v-model="tableKey" + class="input-with-select" + @keyup.enter="searchAddress" + > + <el-button + @click="searchAddress" + type="primary" + slot="append" + icon="el-icon-search" + ></el-button> + </el-input> + </div> + <div class="selectItem"> + <el-select v-model="dynastyId" placeholder="璜嬮伕鎿囨檪鏈�"> + <el-option + v-for="item in dynastyData" + :key="item.dynastyId + '0'" + :label="item.name" + :value="item.dynastyId" + ></el-option> + </el-select> + </div> + </div> + <el-table + ref="multipleTable" + :data="gridData" + style="width: 100%" + height="530" + @selection-change="handleSelectionChange" + row-key="index" + > + <el-table-column type="selection" width="55"> </el-table-column> + <el-table-column prop="currentName" label="鍦板悕"> </el-table-column> + <el-table-column width="250" label="骞翠唬鍗�闁�"> + <template slot-scope="scope">{{ + scope.row.start + "-" + scope.row.end + }}</template> + </el-table-column> + <el-table-column + prop="dynastyName" + label="鏅傛湡" + width="250" + show-overflow-tooltip + > + </el-table-column> + </el-table> + </div> + <div class="drawerPage"> + <el-pagination + class="paging flex" + background + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + :current-page="currentPage" + :page-sizes="[10, 20, 60, 100]" + :page-size="pageSize" + layout="total, sizes, prev, pager, next, jumper" + :total="total" + > + </el-pagination> + </div> + <div class="drawerBtn"> + <el-button @click="setCurrent">鍏ㄩ伕鐣跺墠闋�</el-button> + <el-button @click="setCurrent('cancle')">鍙栨秷鍏ㄩ伕</el-button> + <el-button @click="drawer = false" type="primary">纰哄畾</el-button> + </div> + </div> </el-drawer> </view> </template> @@ -247,16 +394,19 @@ import { getPersonData, getHotSearch, - getPDataStatistics, academicSearch, getPersonTag, getSocialDistinction, - getDynastyAll + getDynastyAll, + getAdvancedData, + getPlaceInfo, } from "@/api/index.js"; import * as echarts from "echarts"; export default { data() { return { + // 楂樼礆鎼滅储琛ㄦ牸 + tableData: [], loading: true, hotAciveIndex: "", currentId: 21682, @@ -300,7 +450,11 @@ works: "", personTags: "", socialIdentity: "", - period: "" + period: "", + page: 1, + currentPage: 1, + pageSize: 10, + total: 0, }, showPerson: false, personList: [], @@ -312,7 +466,17 @@ personTag: [], socialDistinction: [], dynastyData: [], + // 鎶藉眽 + gridData: [], + page: 1, + currentPage: 1, + pageSize: 10, + total: 0, drawer: false, + dynastyId: "", + tableKey: "", + multipleTableSelection: [], + // echarts infoOfPersons: [], infoOfSchools: [], nodeDatas: [], @@ -324,6 +488,8 @@ this.hotSearch(); // 鑾峰彇浜虹墿鏍囩銆佺ぞ浼氳韩浠� this.getOptionInfo(); + // 鐛插彇鍦板潃鍒楄〃 + this.getAddressList(); // 鐩戝惉绐楀彛澶у皬鍙樺寲 window.addEventListener("resize", this.relation); }, @@ -331,6 +497,92 @@ this.searchKey = options.keyword; }, methods: { + // 鎼滅储鍦板潃 + searchAddress() { + this.gridData = []; + this.getAddressList(); + }, + // 鍒嗛〉 + handleSizeChange(val) { + this.pageSize = val; + this.getAddressList(); + }, + handleCurrentChange(val) { + this.page = val; + this.getAddressList(); + }, + + handleSizeChangeForm(val) { + this.formData.pageSize = val; + this.searchFun(); + }, + handleCurrentChangeForm(val) { + this.formData.page = val; + this.searchFun(); + }, + // 琛ㄦ牸閫夋嫨 + handleSelectionChange(val) { + const data = val.map((item) => { + return { + ...item, + name: item.currentName, + id: item.dynastyId + }; + }); + this.formData.actively = data; + this.multipleTableSelection = this.formData.actively; + }, + // 鍏ㄩ伕 + setCurrent(str) { + if (str == "cancle") { + this.$refs.multipleTable.clearSelection(); + return false; + } + if (this.gridData.length) { + this.$refs.multipleTable.clearSelection(); + this.gridData.forEach((row) => { + this.$refs.multipleTable.toggleRowSelection(row); + }); + const data = this.gridData.map((item) => { + return { + ...item, + name: item.currentName, + id: item.dynastyId + }; + }); + this.formData.actively = data; + this.multipleTableSelection = this.formData.actively; + } + }, + // 鐛插彇鍦板潃鍒楄〃 + getAddressList() { + const data = { + page: this.page, + pageSize: this.pageSize + }; + if (this.dynastyId != "") { + data["dynastyId"] = this.dynastyId; + } + if (this.tableKey != "") { + data["keyword"] = this.tableKey; + } + getPlaceInfo(data).then((res) => { + if (res?.success && res?.npage) { + this.total = res.npage.totalCount; + } + if (res?.success && res?.list.length) { + this.gridData = res?.list?.map((item, i) => { + return { + ...item, + index: i + }; + }); + } else { + this.gridData = []; + } + }); + }, + getOptionInfo() { getDynastyAll().then((res) => { this.dynastyData = res.list; @@ -342,25 +594,143 @@ this.socialDistinction = res.list; }); }, + resetForm(formName) { this.formData = { name: "", actively: [], works: "", - personTags: "", - socialIdentity: "", - period: "" + personTags: [], + socialIdentity: [], + period: [], + page: 1, + currentPage: 1, + pageSize: 10, + total: 0, }; }, searchFun() { - console.log(this.formData); + const palceData = this.formData.actively?.map((item) => { + return { + ancientName: item.ancientName ?? "", + dynastyId: item.dynastyId, + currentName: item.currentName, + }; + }); + let Obj = { + keyword: this.formData.name, + placeList: [...palceData], + literatureName: this.formData.works, + personTagIdList: this.formData.personTags, + socialDistinctionIdList: this.formData.socialIdentity, + dynastyIdList: this.formData.period, + page: this.formData.page, + pageSize: this.formData.pageSize, + }; + // // 鎼滅储 + getAdvancedData(Obj).then((res) => { + if (res?.success) { + this.tableData = res.list.map((item) => { + return { + id: item.personId, + name: + item?.NAME?.map((e, i) => { + let data = []; + Object.entries(e).forEach((c) => { + if (c[0]?.indexOf("content") > -1) { + data.push(c[1]); + } + }); + return data; + }).join() ?? "", + alias: + item?.ALIAS?.map((e, i) => { + let data = []; + Object.entries(e).forEach((c) => { + if (c[0]?.indexOf("content") > -1) { + data.push(c[1]); + } + }); + return data; + }).join() ?? "", + place: + item?.NATIVE_PLACE?.map((e, i) => { + let data = []; + Object.entries(e).forEach((c) => { + if (c[0]?.indexOf("content") > -1) { + data.push(c[1]); + } + }); + return data; + }).join() ?? "", + medicalBranch: + item?.MEDICAL_BRANCH?.map((e, i) => { + let data = []; + Object.entries(e).forEach((c) => { + if (c[0]?.indexOf("content") > -1) { + data.push(c[1]); + } + }); + return data; + }).join() ?? "", + socialDistinction: + item?.SOCIAL_IDENTITY?.map((e, i) => { + let data = []; + Object.entries(e).forEach((c) => { + if (c[0]?.indexOf("content") > -1) { + data.push(c[1]); + } + }); + return data; + }).join() ?? "", + period: + item?.PERIOD?.map((e, i) => { + let data = []; + Object.entries(e).forEach((c) => { + if (c[0]?.indexOf("content") > -1) { + data.push(c[1]); + } + }); + return data; + }).join() ?? "", + workName: + item?.REPRESENTATIVE_WORKS?.map((e, i) => { + let data = []; + Object.entries(e).forEach((c) => { + if (c[0]?.indexOf("content") > -1) { + data.push(c[1]); + } + }); + return data; + }).join() ?? "", + personLabel: + item?.PERSON_LABEL?.map((e, i) => { + let data = []; + Object.entries(e).forEach((c) => { + if (c[0]?.indexOf("content") > -1) { + data.push(c[1]); + } + }); + return data; + }).join() ?? "", + }; + }); + if (res?.npage) { + // 鎬绘暟閲� + this.formData.total = res.npage.totalCount; + } + } + }); }, + selectActively() { this.drawer = true; }, + handleClose(done) { done(); }, + // 鑾峰彇浜虹墿鍏崇郴 getPersonInfo(arr, str, newArr, order, type, parent) { for (let i = 0; i < arr.length; i++) { @@ -490,6 +860,7 @@ } return arr; }, + //鏁扮粍鍘婚噸 deduplicateArray(arr, idKey) { // 浣跨敤涓�涓緟鍔╁璞℃潵璺熻釜宸茬粡瑙佽繃鐨処D @@ -514,16 +885,19 @@ getData() { this.loading = true; getPersonData(this.currentId).then((res) => { - console.log("1111111111111", res); - this.infoOfPersons = res.object.infoOfPersons; - this.infoOfSchools = res.object.infoOfSchools; - this.nodeDatas = []; - this.links = []; - this.handleData([res.object.personChain], null); - console.log("this.nodeDatas", this.nodeDatas); - console.log("this.links", this.links); - this.loading = false; - this.relation(); + if (res && res.object) { + this.infoOfPersons = res?.object?.infoOfPersons; + this.infoOfSchools = res?.object?.infoOfSchools; + this.nodeDatas = []; + this.links = []; + this.handleData([res.object.personChain], null); + this.loading = false; + this.relation(); + } else { + this.loading = false; + this.nodeDatas = []; + this.links = []; + } // this.nodes = []; // this.relationships = []; // let kinData = []; @@ -647,6 +1021,7 @@ // } }); }, + // 閫掑綊澶勭悊鎵�鏈夊眰绾ф暟鎹� handleData(data, parent) { for (let i = 0; i < data.length; i++) { @@ -960,6 +1335,7 @@ }); myChart.setOption(option); }, + creatDom(params) { const id = params.data.id.split("_")[0]; const type = params.data.id.split("_")[1]; @@ -970,11 +1346,9 @@ div.style.display = "block"; div.style.left = e.offsetX + 50 + "px"; div.style.top = e.offsetY - 50 + "px"; - const data = this.infoOfPersons?.find( - (i) => i.id == id - ); + const data = this.infoOfPersons?.find((i) => i.id == id); const obj = { - id: params.data.id, + id: id, name: data?.NAME?.map((e, i) => { i += 1; @@ -1006,43 +1380,36 @@ div.style.display = "block"; div.style.left = e.offsetX + 50 + "px"; div.style.top = e.offsetY - 50 + "px"; - const data = this.infoOfPersons?.find( - (i) => i.id == id - ); + const data = this.infoOfSchools?.find((i) => i.schoolId == id); + console.log(data); + debugger const obj = { id: params.data.id, - name: - data?.NAME?.map((e, i) => { - i += 1; - return e["content" + i]; - }).join("銆�") ?? "", - alias: - data?.ALIAS?.map((e, i) => { - i += 1; - return e["content" + i]; - }).join("銆�") ?? "", - nativePlace: - data?.NATIVE_PLACE?.map((e, i) => { - i += 1; - return e["content" + i]; - }).join("銆�") ?? "", - medicalBranch: - data?.MEDICAL_BRANCH?.map((e, i) => { - i += 1; - return e["content" + i]; - }).join("銆�") ?? "", - biography: data?.BIOGRAPHY ?? "" + name: data.name[0], + character: data.important_PEOPLE + ? data.important_PEOPLE.map((item) => item.content2).join("銆�") + : "", + skilledDoctor: data.important_PHYSICIAN + ? data.important_PHYSICIAN.map((item) => item.content2).join("銆�") + : "", + works: data.important_WORK + ? data.important_WORK.map((item) => item.content).join("銆�") + : "", + thought: data.school_THOUGHT + ? data.school_THOUGHT.map((item) => item.content).join("銆�") + : "" }; this.detailData = obj; } }, + closeDom() { const div = document.getElementById("customDialog"); div.style.display = "none"; }, + // 鍩虹鎼滅储 onSearch(val, index) { - console.log(val); if (index !== undefined) { // 鐑棬鎼滅储鍏抽敭瀛楋紝鐩存帴鏌ヨ鏁版嵁 this.searchKey = ""; @@ -1056,6 +1423,7 @@ this.searchPerson(val.text); } }, + // 鏍规嵁鍏抽敭瀛楁绱汉鐗� searchPerson(key) { academicSearch({ @@ -1088,6 +1456,7 @@ this.showPerson = true; }); }, + // 鍏崇郴鍥� 鐐瑰嚮閲岄潰鐨勫厓绱� spaceTimeArr(id) { // 鍏崇郴鍥剧殑鏁版嵁 @@ -1095,6 +1464,7 @@ url: "/pages/character/detail?id=" + id }); }, + // 鑾峰彇鏈濅唬echarts鐨勬暟鎹� echartsArr() { getDataStatistics().then((res) => { @@ -1108,6 +1478,7 @@ }); }); }, + // 鐑棬鎼滅储 hotSearch() { getHotSearch().then((res) => { @@ -1121,6 +1492,7 @@ }); }); }, + isAvancedClick() { this.isAdvancedSearch = !this.isAdvancedSearch; // this.$nextTick(() => { @@ -1137,6 +1509,112 @@ </script> <style> +.fromTable { + width: 100%; + padding: 40px 0; + box-sizing: border-box; +} + +.fromTable >>> .el-table thead th.el-table__cell { + background-color: rgb(194 208 217) !important; + color: #333; + font-weight: normal; + font-size: 14px; +} + +.fromTable + .drawerPage + >>> .el-pagination.is-background + .el-pager + li:not(.disabled).active { + background-color: rgb(36, 74, 123) !important; +} + +.customDrawer >>> .el-drawer__header { + margin-bottom: 20px; + border-bottom: 1px solid #eee; + padding: 20px; + box-sizing: border-box; +} + +.headerClassBg { + background-color: rgb(95, 127, 168); +} + +.drawerTips { + margin-bottom: 20px; + color: #666; +} + +.drawerTable { + width: 100%; +} + +.drawerTable >>> .el-table thead th.el-table__cell { + background-color: rgb(231, 236, 239) !important; + color: #333; + font-weight: normal; +} + +.tableTabs { + width: 100%; + display: flex; + margin-bottom: 20px; +} + +.inputItem { + width: 80%; +} + +.drawerPage { + display: flex; + justify-content: flex-end; + padding: 20px 0; + box-sizing: border-box; +} + +.drawerBtn { + display: flex; + justify-content: flex-end; +} + +.drawerContent { + width: 100%; + height: 100%; + padding: 0 20px; + box-sizing: border-box; +} + +/* 鍒嗛〉 */ +.paging ::v-deep .btn-prev, +.paging ::v-deep .btn-next { + border: 0; + height: 30px; +} + +.paging ::v-deep .btn-prev span, +.paging ::v-deep .btn-next span { + font-size: 0.12rem; + height: 0.3rem; + line-height: 0.3rem; + background-color: #fff; + color: #9e9e9e; + text-align: center; + border: 1px solid #9e9e9e; + padding: 0 0.1rem; +} + +.paging ::v-deep .el-pager li { + font-size: 0.1rem; + width: 0.28rem; + height: 0.3rem; + line-height: 0.3rem; + background-color: #fff; + color: #9e9e9e; + text-align: center; + border: 1px solid #9e9e9e; +} + #relation { width: 100%; height: 100%; -- Gitblit v1.9.1