From 4d56b4733adabd8fc3f26d6d583587598aad87db Mon Sep 17 00:00:00 2001 From: YM <479443481@qq.com> Date: 星期一, 22 七月 2024 18:19:54 +0800 Subject: [PATCH] 1 --- src/pages/academicSchools/index.vue | 249 +++++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 228 insertions(+), 21 deletions(-) diff --git a/src/pages/academicSchools/index.vue b/src/pages/academicSchools/index.vue index 0aab590..f7cb004 100644 --- a/src/pages/academicSchools/index.vue +++ b/src/pages/academicSchools/index.vue @@ -4,7 +4,14 @@ > <headNav :idIndex="'6'" text="瀛︽湳娴佹淳" /> <!-- 楂樼骇鎼滅储 --> - <view style="margin-left: 0.6rem; margin-top: 0.1rem; display: flex"> + <view + style=" + padding-left: 0.6rem; + margin-top: 0.1rem; + display: flex; + position: relative; + " + > <advancedSearch @onSearch="onSearch" placehold="璇疯緭鍏ュ叧閿瓧" @@ -32,10 +39,111 @@ v-for="(item, index) in hotKeyList" :key="item" > - {{ item }} + {{ item.name }} </li> </ul> </view> + <view v-if="isAdvancedSearch" class="searchDialog"> + <h3 style="margin-bottom: 0.2rem">楂樼骇鎼滅储</h3> + <el-form label-width="100px" :model="formData" size="mini"> + <el-row> + <el-col :span="8"> + <el-form-item label="濮撳悕/鍒悕锛�"> + <el-input v-model="formData.name"></el-input> + </el-form-item> + </el-col> + <el-col :span="8"> + <el-form-item label="娲诲姩鍦帮細"> + <el-select + style="width: 100%" + v-model="formData.actively" + placeholder="璇烽�夋嫨娲诲姩鍦�" + > + <!-- <el-option label="鍖哄煙涓�" value="shanghai"></el-option> --> + <!-- <el-option label="鍖哄煙浜�" value="beijing"></el-option> --> + </el-select> + </el-form-item> + </el-col> + <el-col :span="8"> + <el-form-item label="浣滃搧锛�"> + <el-input v-model="formData.works"></el-input> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="8"> + <el-form-item label="浜虹墿鏍囩锛�"> + <el-select + style="width: 100%" + v-model="formData.personTags" + placeholder="璇烽�夋嫨浜虹墿鏍囩" + > + <!-- <el-option label="鍖哄煙涓�" value="shanghai"></el-option> --> + <!-- <el-option label="鍖哄煙浜�" value="beijing"></el-option> --> + </el-select> + </el-form-item> + </el-col> + <el-col :span="8"> + <el-form-item label="绀句細韬唤锛�"> + <el-select + style="width: 100%" + v-model="formData.socialIdentity" + placeholder="璇烽�夋嫨绀句細韬唤" + > + <!-- <el-option label="鍖哄煙涓�" value="shanghai"></el-option> --> + <!-- <el-option label="鍖哄煙浜�" value="beijing"></el-option> --> + </el-select> + </el-form-item> + </el-col> + <el-col :span="8"> + <el-form-item label="鏃舵湡锛�"> + <el-select + style="width: 100%" + v-model="formData.period" + placeholder="璇烽�夋嫨鏃舵湡" + > + <!-- <el-option label="鍖哄煙涓�" value="shanghai"></el-option> --> + <!-- <el-option label="鍖哄煙浜�" value="beijing"></el-option> --> + </el-select> + </el-form-item> + </el-col> + </el-row> + </el-form> + <div style="text-align: right"> + <el-button type="primary" size="mini">鎼滅储</el-button> + <el-button size="mini">閲嶇疆</el-button> + </div> + </view> + <div v-if="showPerson" class="personDialog"> + <i + class="el-icon-circle-close closeBtn" + @click=" + () => { + showPerson = false; + } + " + ></i> + <el-table :data="personList" style="width: 100%"> + <el-table-column prop="name" label="濮撳悕"> + <template slot-scope="scope"> + <span + style="color: #409eff; cursor: pointer" + @click=" + () => { + currentId = scope.row.id; + getData(); + } + " + >{{ scope.row.name }}</span + > + </template> + </el-table-column> + <el-table-column prop="age" label="鏃朵唬"> </el-table-column> + <el-table-column prop="nativePlace" label="绫嶈疮"> </el-table-column> + <el-table-column prop="alias" label="鍒悕"> </el-table-column> + <el-table-column prop="division" label="鍖诲鍒嗙"> </el-table-column> + </el-table> + </div> </view> <!-- 鍏崇郴琛ㄥ湴鍥� --> @@ -69,8 +177,7 @@ font-size: 0.2rem; color: #666; " - > - </div> + ></div> </div> <div id="customDialog" class="customDialog"> <div class="title"> @@ -93,9 +200,11 @@ import { getPersonData, getHotSearch, - getPDataStatistics + getPDataStatistics, + academicSearch } from "@/api/index.js"; import * as echarts from "echarts"; +import MyForm from "@/components/form/form.vue"; export default { data() { return { @@ -121,7 +230,22 @@ detailData: { name: "" }, - isAdvancedSearch: false + isAdvancedSearch: false, + formData: { + name: "", + actively: "", + works: "", + personTags: "", + socialIdentity: "", + period: "" + }, + showPerson: false, + personList: [], + personPageInfo: { + totalCount: 0, + page: 1, + limit: 10 + } }; }, mounted() { @@ -151,7 +275,7 @@ parentName: parent?.NAME[0]?.content1 ?? parent.parentName, name2: personInfo?.NAME[0]?.content1, category: type, - symbolSize: order, + symbolSize: 15 }; if (order > 80) { order = 80; @@ -299,7 +423,6 @@ let place = []; let school = []; if (res && res.success && res.object) { - this.infoOfPersons = res.object?.infoOfPersons; this.infoOfSchools = res.object?.infoOfSchools; if (res.object?.personChain) { @@ -387,9 +510,6 @@ school = [...newArr]; } } - console.log(kinData); - console.log(kinData.map(item=>item.name2).join("銆�")); - debugger const personData = [ ...kinData, ...teacher, @@ -398,6 +518,7 @@ ...place, ...school ]; + console.log(personData); // const k = personData.filter((item) => item.category == 0); // const t = personData.filter((item) => item.category == 1); // const l = personData.filter((item) => item.category == 2); @@ -405,7 +526,7 @@ // const p = personData.filter((item) => item.category == 4); // const s = personData.filter((item) => item.category == 5); // const nodesList = [...k, ...t, ...l, ...o, ...p, ...s]; - // console.log(nodesList); + personData.forEach((item) => { let exists1 = this.nodes.some( (node) => @@ -448,6 +569,23 @@ // 鍋囪鎮ㄦ湁鑺傜偣鍚嶇О鍜屽畠浠箣闂寸殑鍏崇郴鏁版嵁 var nodes = this.deduplicateArray(this.nodes, "id"); var relationships = this.relationships; + + nodes = nodes.map((item) => { + let size = item.symbolSize; + for (let i = 0; i < relationships.length; i++) { + const linkItem = relationships[i]; + if (linkItem.source == item.parentName) { + size += 5; + } + if (linkItem.target == item.parentName) { + size += 5; + } + } + return { + ...item, + symbolSize: size > 80 ? 80 : size + }; + }); let FontSize = 12; // 瀛椾綋澶у皬 let BorderWidth = 2; // 杈规澶у皬 @@ -508,6 +646,8 @@ }); // 鏍规嵁nodes鍔ㄦ�佺敓鎴愯妭鐐规暟鎹� var nodeData = nodes; + console.log(nodeData); + console.log(links); var option; option = { // backgroundColor: { @@ -613,19 +753,50 @@ }, // 鍩虹鎼滅储 onSearch(val, index) { + console.log(val); if (index !== undefined) { + // 鐑棬鎼滅储鍏抽敭瀛楋紝鐩存帴鏌ヨ鏁版嵁 this.searchKey = ""; this.hotAciveIndex = index; + this.currentId = val.text.id; + this.getData(); } else { this.hotAciveIndex = ""; + // 鎼滅储鍏堟樉绀轰汉鐗╁垪琛� + this.personPageInfo.page = 1; + this.searchPerson(val.text); } - this.getData(val.text); }, - // 鐐瑰嚮涓嬮潰鐨勬湞浠f寜閽� - dynastyBottomClick(item) { - this.dynastyColor = item.id; - this.onSearch({ - text: item.name + // 鏍规嵁鍏抽敭瀛楁绱汉鐗� + searchPerson(key) { + academicSearch({ + keyword: key, + page: this.personPageInfo.page, + pageSize: this.personPageInfo.limit + }).then((res) => { + this.personList = res.list.map((item) => { + return { + id: item.personId, + name: item.name, + age: + item.periodList && item.periodList.length + ? item.periodList[0].content2 + : "-", + nativePlace: + item.nativePlaceList && item.nativePlaceList.length + ? item.nativePlaceList[0].content1 + : "-", + alias: + item.aliasList && item.aliasList.length + ? item.aliasList[0].content2 + : "-", + division: + item.medicalBranchList && item.medicalBranchList.length + ? item.medicalBranchList[0].content1 + : "-" + }; + }); + this.showPerson = true; }); }, // 鍏崇郴鍥� 鐐瑰嚮閲岄潰鐨勫厓绱� @@ -654,7 +825,10 @@ const indexList = Object.keys(res.object); indexList.sort((a, b) => parseInt(b) - parseInt(a)); this.hotKeyList = indexList.map((item) => { - return res.object[item]; + return { + id: item, + name: res.object[item] + }; }); }); }, @@ -668,7 +842,7 @@ // document.querySelector(".fbox1").style.height = box1Height + "px"; // } // }); - }, + } } }; </script> @@ -678,7 +852,7 @@ width: 100%; height: 100%; position: relative; - background-image: url('../../static/image/characterRelationBg.png'); + background-image: url("../../static/image/characterRelationBg.png"); background-size: 100% 100%; background-repeat: no-repeat; background-position: center; @@ -773,4 +947,37 @@ } } } + +.searchDialog { + position: absolute; + top: 0.68rem; + left: 0; + right: 0; + z-index: 999; + padding: 0.1rem 0.4rem; + background: #fff; + min-height: 2rem; +} + +.personDialog { + position: absolute; + top: 0.68rem; + z-index: 999; + padding: 0.1rem; + background: #fff; + border-radius: 6px; + box-shadow: 0 0 10px -3px #000; + .closeBtn { + position: absolute; + right: -10px; + top: -10px; + width: 24px; + height: 24px; + font-size: 24px; + background-color: #fff; + border-radius: 50%; + color: #f56c6c; + cursor: pointer; + } +} </style> -- Gitblit v1.9.1