From 0b4fa4b2cfd68528d15aa71557425a7a80e3fc41 Mon Sep 17 00:00:00 2001 From: YM <479443481@qq.com> Date: 星期五, 17 五月 2024 21:08:50 +0800 Subject: [PATCH] 222 --- src/pages/character/index.vue | 161 ++++++++++++++++++++++++++--------------------------- 1 files changed, 78 insertions(+), 83 deletions(-) diff --git a/src/pages/character/index.vue b/src/pages/character/index.vue index a8ae2b7..8f7acbe 100644 --- a/src/pages/character/index.vue +++ b/src/pages/character/index.vue @@ -9,6 +9,7 @@ :from="From" placehold="璇疯緭鍏ュ叧閿瓧" :keyword="searchKey" + :advancedSearchBack="advancedSearchBack" /> </view> <!-- 鐑棬鎼滅储 --> @@ -27,10 +28,10 @@ </view> <view class="" style="margin-left: 0.2rem">涔︿腑鏈�甯告彁鍒扮殑100浣嶄汉鐗�</view> <!-- 鍏崇郴琛ㄥ湴鍥� --> - <view - id="relation" - style="margin-top: 0.2rem; height: 70vh; width: 100%" - ></view> + <view id="relation" style="margin-top: 0.2rem; height: 70vh; width: 100%;position: relative;" + ><div v-if="!loading && relationships.length == 0" style="position: absolute;top: 30%;left: 0;right: 0;text-align: center;font-size: 0.20rem;color: #666;">鏆傛棤鐩稿叧鏁版嵁</div></view + > + <!-- 鏈濅唬 --> <view class="flex flex-center" @@ -86,6 +87,7 @@ export default { data() { return { + loading: true, // echarts鏁版嵁 nodes: [], // echarts涓よ�呯殑鍏崇郴 @@ -269,24 +271,47 @@ // window.addEventListener("resize", this.relation); this.innt(); }, + onLoad(options) { + this.searchKey = options.keyword; + }, methods: { getData() { - getPersonList({ - keywords: "", //鎼滅储妗嗘绱� - name: "", //濮撳悕 - alias: "", //鍒悕 - nativePlace: "", //鏈哄叧 - tagId: null, //鑱屼笟id - official: "", //鑱屽畼 - genderType: null, //鎬у埆 - dynasty: null, //鏈濅唬鍚� - dynastyId: null, //鏈濅唬id - institution: "", //鏈烘瀯 - bookId: null, //鏉ユ簮id - page: 1, - pageSize: 100 + getFuzzySearch({ + keyword: this.searchKey ? this.searchKey : "" }).then((res) => { - console.log(res); + this.nodes = []; + this.relationships = []; + if (res.success && res.list) { + res.list.forEach((item, index) => { + let exists1 = this.nodes.some( + (node) => node.id === item.identifier1 && node.name === item.name1 + ); + let exists2 = this.nodes.some( + (node) => node.id === item.identifier2 && node.name === item.name2 + ); + // 璇佹槑涓嶅瓨鍦� + if (exists1 !== true) { + this.nodes.push({ + name: item.name1, + id: item.identifier1 + }); + } + if (exists2 !== true) { + this.nodes.push({ + name: item.name2, + id: item.identifier2 + }); + } + let obj = { + source: item.name1, + target: item.name2, + relation: item.relationName || "" // 濡傛灉瀛樺湪 relationName 瀛楁鍒欎娇鐢紝鍚﹀垯涓虹┖瀛楃涓� + }; + this.relationships.push(obj); + }); + } + this.loading = false; + this.relation(); }); }, // 鍏崇郴鍥捐氨 @@ -347,10 +372,8 @@ padding: [3, 8], borderRadius: 30, position: "middle", // 璁剧疆鏍囩鏂囨湰鍦ㄧ嚎鐨勪腑闂翠綅缃笂灞呬腑鏄剧ず - // bottom: -(FontSize+10), - z: 10, // 璁剧疆鏍囩鐨剒杞撮珮搴︼紝浣垮叾姣旇繛鎺ョ嚎鏇撮珮 - // offset: [0, 15] ,// 寰�涓嬬Щ鍔� 10 鍍忕礌 - distance: -(Distance + 1) // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 + // z: -1, // 璁剧疆鏍囩鐨剒杞撮珮搴︼紝浣垮叾姣旇繛鎺ョ嚎鏇撮珮 + distance: -10 // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 } }); } @@ -361,31 +384,14 @@ return { name: node.name, id: node.id, - x: Math.random() * 2000, // 璁剧疆闅忔満x鍧愭爣浣嶇疆 - y: Math.random() * 600, // 璁剧疆闅忔満y鍧愭爣浣嶇疆 itemStyle: { - color: getColorByIndex(), // 鍙互鏍规嵁绱㈠紩璁剧疆涓嶅悓鐨勯鑹� + color: "#eae0eb", // 鍙互鏍规嵁绱㈠紩璁剧疆涓嶅悓鐨勯鑹� borderWidth: BorderWidth, - borderColor: getColorByIndex() + borderColor: "#996f9f" } }; }); - // 璁剧疆棰滆壊 - function getColorByIndex() { - // 鐢熸垚闅忔満鐨� R銆丟銆丅 鍒嗛噺鍊硷紝闄愬埗鍦ㄦ洿楂樼殑鑼冨洿鍐� - var r = Math.floor(Math.random() * 106) + 150; // 150 鍒� 255 涔嬮棿鐨勯殢鏈烘暟 - var g = Math.floor(Math.random() * 106) + 150; // 150 鍒� 255 涔嬮棿鐨勯殢鏈烘暟 - var b = Math.floor(Math.random() * 106) + 150; // 150 鍒� 255 涔嬮棿鐨勯殢鏈烘暟 - // 灏� R銆丟銆丅 鍒嗛噺鍊艰浆鎹负鍗佸叚杩涘埗锛屽苟纭繚姣忎釜鍒嗛噺鍊奸兘鏄袱浣嶆暟 - var hexR = r.toString(16).padStart(2, "0"); // 浣跨敤 padStart 鏂规硶纭繚鐢熸垚鐨勫崄鍏繘鍒舵暟涓轰袱浣� - var hexG = g.toString(16).padStart(2, "0"); - var hexB = b.toString(16).padStart(2, "0"); - // 鎷兼帴鍗佸叚杩涘埗棰滆壊鍊� - var color = "#" + hexR + hexG + hexB; - return color; - } - console.log(links); - console.log(nodeData); + var option; option = { title: { @@ -414,7 +420,7 @@ series: [ { type: "graph", - layout: "none", + layout: "force", roam: true, symbolSize: SymbolSize, // 璋冩暣鑺傜偣澶у皬 label: { @@ -422,7 +428,7 @@ color: "black", // 璁剧疆鑺傜偣鏂囧瓧棰滆壊涓洪粦鑹� fontSize: FontSize // 璁剧疆鏂囧瓧澶у皬 }, - edgeSymbol: ["circle"], + edgeSymbol: ["circle", "arrow"], edgeSymbolSize: [4, 10], data: nodeData, links: links, @@ -430,6 +436,18 @@ opacity: 0.9, width: 2, curveness: 0.3 + }, + emphasis: { + focus: "adjacency", + lineStyle: { + width: 10 + } + }, + force: { + initLayout: null, + // gravity: 0 + repulsion: 800, + edgeLength: 400 } } ] @@ -437,9 +455,10 @@ // 灏嗙敓鎴愮殑杩炴帴绾挎坊鍔犲埌echarts鍥捐〃鐨刼ption涓� option.series[0].links = links; // 璁剧疆鐐瑰嚮浜嬩欢鐩戝惉 + myChart.off("click"); myChart.on("click", (params) => { - // menuNav2 = !menuNav1 - if (params.componentType === "series") { + console.log(params); + if (params.dataType === "node") { this.spaceTimeArr(params.data.id); } }); @@ -448,45 +467,21 @@ // 鍩虹鎼滅储 onSearch(val) { this.searchKey = val.text; - getFuzzySearch({ keyword: val.text }).then((res) => { - if (res.list) { - this.nodes = []; - this.relationships = []; - res.list.forEach((item, index) => { - let exists1 = this.nodes.some( - (node) => node.id === item.identifier1 && node.name === item.name1 - ); - let exists2 = this.nodes.some( - (node) => node.id === item.identifier2 && node.name === item.name2 - ); - // 璇佹槑涓嶅瓨鍦� - if (exists1 !== true) { - this.nodes.push({ - name: item.name1, - id: item.identifier1 - }); - } - if (exists2 !== true) { - this.nodes.push({ - name: item.name2, - id: item.identifier2 - }); - } - let obj = { - source: item.name1, - target: item.name2, - relation: item.relationName || "" // 濡傛灉瀛樺湪 relationName 瀛楁鍒欎娇鐢紝鍚﹀垯涓虹┖瀛楃涓� - }; - this.relationships.push(obj); - }); - } - this.relation(); - }); + this.getData(); }, // 楂樼骇鎼滅储 onSubmit(val) { - getAdvanceSearch(val).then((res) => { - console.log(res, "鎺ュ彛璋冪敤鎴愬姛"); + getAdvanceSearch({ + ...val, + page: 1, + pageSize: 100 + }).then((res) => { + console.log(res, "res"); + }); + }, + advancedSearchBack() { + uni.navigateTo({ + url: "/pages/knowledgeBase/knowledgeBase" }); }, // 鐐瑰嚮涓嬮潰鐨勬湞浠f寜閽� -- Gitblit v1.9.1