From d4211fd96865e58217d63efaf4d8f6609fb24ae6 Mon Sep 17 00:00:00 2001 From: mh-two-thousand-and-two <17391232786@163.com> Date: 星期二, 16 四月 2024 17:43:33 +0800 Subject: [PATCH] 更新数据 --- src/pages/characterRelation/characterRelation.vue | 288 ++++++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 203 insertions(+), 85 deletions(-) diff --git a/src/pages/characterRelation/characterRelation.vue b/src/pages/characterRelation/characterRelation.vue index ee78364..daf5abe 100644 --- a/src/pages/characterRelation/characterRelation.vue +++ b/src/pages/characterRelation/characterRelation.vue @@ -3,7 +3,7 @@ <headNav idIndex="1" text="涓尰浜虹墿鏁版嵁搴�" /> <!-- 楂樼骇鎼滅储 --> <view style="margin: .35rem 0 .16rem 0; "> - <advancedSearch @onSearch="onSearch" :from="From" placehold="杈撳叆濮撳悕/鍒悕/鏈濅唬/浼犱富鑱屼笟鎼滅储" /> + <advancedSearch @onSearch="onSearch" @onSubmit="onSubmit" :from="From" placehold="杈撳叆濮撳悕/鍒悕/鏈濅唬/浼犱富鑱屼笟鎼滅储" /> </view> <!-- 鐑棬鎼滅储 --> <view class="flex flex-center hotSearch"> @@ -14,6 +14,7 @@ </li> </ul> </view> + <view class="" style="margin-left: .2rem;">涔︿腑鏈�甯告彁鍒扮殑100浣嶄汉鐗�</view> <!-- 鍏崇郴琛ㄥ湴鍥� --> <view id="relation" style="margin-top: .2rem; height: 70vh;width: 100%;"></view> <!-- 鏈濅唬 --> @@ -38,14 +39,19 @@ import { getDataStatistics, getHotSearch, - getFuzzySearch + getFuzzySearch, + getAdvanceSearch, + getPDataStatistics } from '@/api/index.js' import * as echarts from 'echarts'; export default { data() { return { // echarts鏁版嵁 - nodes: ['鏉庢椂鐝�'], + nodes: [{ + name: '鏉庢椂鐝�', + id: 23 + }], // echarts涓よ�呯殑鍏崇郴 relationships: [{ source: '鏉庢椂鐝�', @@ -82,39 +88,60 @@ name: 'alias', value: '' }, { - type: 'number', - label: 'inst', - name: 'inst', - value: '' - }, { type: 'input', - label: 'location', + label: '绫嶈疮', name: 'location', value: '' }, { + type: 'select', + label: '鑱屼笟', + name: 'sdId', + value: '', + options: [{ + label: '鏈寚鏄�', + value: 'UNKNOWN' + }, ] + }, { type: 'input', - label: 'office', + label: '瀹樿亴', name: 'office', value: '' }, { - type: 'number', - label: 'page', - name: 'page', - value: '' - }, { - type: 'number', - label: 'pageSize', - name: 'pageSize', - value: '' + type: 'select', + label: '鎬у埆', + value: '', + name: 'genderTypeEO', + options: [{ + label: '鏈寚鏄�', + value: 'UNKNOWN' + }, { + label: '鐢�', + value: 'MALE' + }, + { + label: '濂�', + value: 'WOMAN' + } + ] }, { type: 'input', - label: 'period', + label: '鏃堕棿', name: 'period', value: '' }, { type: 'input', - label: 'sdId', - name: 'sdId', + label: '鏈烘瀯', + name: 'inst', + value: '' + }, { + type: 'number', + label: '椤电爜', + name: 'page', + value: '' + }, { + type: 'number', + label: '椤靛ぇ灏�', + name: 'pageSize', value: '' }, ] }, @@ -219,7 +246,6 @@ }, methods: { - // 鍏崇郴鍥捐氨 relation() { var chartDom = document.getElementById('relation'); @@ -251,60 +277,73 @@ } // 鏍规嵁鍏崇郴鏁版嵁鐢熸垚杩炴帴绾� var links = []; - relationships.forEach(function(relationship) { - var sourceIndex = nodes.indexOf(relationship.source); - var targetIndex = nodes.indexOf(relationship.target); - // console.log(sourceIndex, targetIndex); - if (sourceIndex !== -1 && targetIndex !== -1) { - links.push({ - source: sourceIndex, - target: targetIndex, - label: { - show: true, - formatter: function(params) { // 浣跨敤鍑芥暟鍔ㄦ�佺敓鎴愭爣绛惧唴瀹� - return relationships.find(rel => rel.source === nodes[params.data - .source] && rel.target === nodes[params.data.target]) - .relation; - }, // 璁剧疆鍏崇郴鏍囩鍐呭涓�"Child-Parent" - color: '#2C2C2C', - fontSize: FontSize - 2, - backgroundColor: 'rgba(255, 255, 255, 1)', - padding: [3, 8], - borderRadius: 30, - position: 'middle', // 璁剧疆鏍囩鏂囨湰鍦ㄧ嚎鐨勪腑闂翠綅缃笂灞呬腑鏄剧ず - // bottom: -(FontSize+10), - z: 10, // 璁剧疆鏍囩鐨剒杞撮珮搴︼紝浣垮叾姣旇繛鎺ョ嚎鏇撮珮 - // offset: [0, 15] ,// 寰�涓嬬Щ鍔� 10 鍍忕礌 - distance: -(Distance + 1), // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 - } - }); + relationships.forEach((relationship, i) => { + // 闈� + var sourceIndex = nodes.findIndex((node) => node.name === relationship.source); + var targetIndex = nodes.findIndex((node) => node.name === relationship.target); + if (relationship.relation) { + if (sourceIndex !== -1 && targetIndex !== -1) { + console.log(relationship.source, relationship.target); + links.push({ + source: sourceIndex, + target: targetIndex, + label: { + show: true, + formatter: function(params) { // 浣跨敤鍑芥暟鍔ㄦ�佺敓鎴愭爣绛惧唴瀹� + // console.log(params, 'paramsparamsparamsparamsparams'); + // return relationships.find(rel => rel.source === nodes[params.data + // .source] && rel.target === nodes[params.data.target]) + // .relation; + return relationship.relation; + }, // 璁剧疆鍏崇郴鏍囩鍐呭涓�"Child-Parent" + color: '#2C2C2C', + fontSize: FontSize - 2, + backgroundColor: 'rgba(255, 255, 255, 1)', + padding: [3, 8], + borderRadius: 30, + position: 'middle', // 璁剧疆鏍囩鏂囨湰鍦ㄧ嚎鐨勪腑闂翠綅缃笂灞呬腑鏄剧ず + // bottom: -(FontSize+10), + z: 10, // 璁剧疆鏍囩鐨剒杞撮珮搴︼紝浣垮叾姣旇繛鎺ョ嚎鏇撮珮 + // offset: [0, 15] ,// 寰�涓嬬Щ鍔� 10 鍍忕礌 + distance: -(Distance + 1), // 灏嗘爣绛炬斁缃湪杩炴帴绾夸笂 + } + }); + } } - }); - console.log(links); // 鏍规嵁nodes鍔ㄦ�佺敓鎴愯妭鐐规暟鎹� var nodeData = nodes.map(function(node, index) { return { - name: node, + name: node.name, + id: node.id, x: Math.random() * 2000, // 璁剧疆闅忔満x鍧愭爣浣嶇疆 y: Math.random() * 600, // 璁剧疆闅忔満y鍧愭爣浣嶇疆 itemStyle: { - color: getColorByIndex(index), // 鍙互鏍规嵁绱㈠紩璁剧疆涓嶅悓鐨勯鑹� + color: getColorByIndex(), // 鍙互鏍规嵁绱㈠紩璁剧疆涓嶅悓鐨勯鑹� borderWidth: BorderWidth, - borderColor: getColorByIndex(index + 1) + borderColor: getColorByIndex() } }; }); // 璁剧疆棰滆壊 - function getColorByIndex(index) { - var colors = ['#ecf4ff', '#dd9795', '#f1edbe', '#ecf4ff', '#c5dbd8']; // 鍙互鏍规嵁瀹為檯鎯呭喌璁剧疆棰滆壊鏁扮粍 - return colors[index % colors.length]; + 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; } var option; option = { title: { // text: '涔︿腑鏈�甯告彁鍒扮殑100浣嶄汉鐗�', - subtext: '涔︿腑鏈�甯告彁鍒扮殑100浣嶄汉鐗�', + // subtext: '', left: 'center', top: FontSize + 10, // textStyle: { @@ -345,11 +384,8 @@ } }] }; - // 灏嗙敓鎴愮殑杩炴帴绾挎坊鍔犲埌echarts鍥捐〃鐨刼ption涓� option.series[0].links = links; - - // 璁剧疆鐐瑰嚮浜嬩欢鐩戝惉 myChart.on('click', (params) => { // menuNav2 = !menuNav1 @@ -365,13 +401,13 @@ }) option && myChart.setOption(option); }, - // 鍏崇郴鍥� + // 鍏崇郴鍥� 鐐瑰嚮閲岄潰鐨勫厓绱� spaceTimeArr(Arr) { // 鍏崇郴鍥剧殑鏁版嵁 console.log(Arr); - // uni.navigateTo({ - // url: '/pages/repository/repository' - // }) + uni.navigateTo({ + url: '/pages/repository/repository' + }) }, // 鑾峰彇鏈濅唬echarts鐨勬暟鎹� async echartsArr() { @@ -387,59 +423,141 @@ }) console.log(this.dynasty, 'sdfsfd'); }) + }, // 鐑棬鎼滅储 async hotSearch() { await getHotSearch().then(res => { console.log(res, 'saaadfds'); - this.hot= Object.keys(res.object).map(key => { - return { id: parseInt(key), name: res.object[key] }; + this.hot = Object.keys(res.object).map(key => { + return { + id: parseInt(key), + name: res.object[key] + }; }) // this.hot = res.list }) }, + // 鍩虹鎼滅储 async onSearch(val) { console.log(val); await getFuzzySearch(val.text).then(res => { + console.log(res, 'jieko'); if (res.list) { this.nodes = [] - this.nodes[0] = res.list[0].name1 - this.nodes[1] = res.list[0].name2 - for (let i = 1; i < res.list.length; i++) { - this.nodes.push(res.list[i].name2); - } - this.nodes = [...new Set(this.nodes)] - this.relationships = this.nodes.slice(1).map(item => { - return { - source: this.nodes[0], - target: item, - relation: '' - }; + 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 瀛楁鍒欎娇鐢紝鍚﹀垯涓虹┖瀛楃涓� + } + // 鍙湁褰� item.relationName 瀛樺湪鏃讹紝鎵嶅悜 obj 瀵硅薄涓坊鍔� relation 瀛楁 + if (item.relationName) { + obj.relation = item.relationName; + } + this.relationships.push(obj) + }); - + // this.nodes = [] + // this.nodes[0] = { + // name: res.list[0].name1, + // id: res.list[0].identifier1 + // } + // this.nodes[1] = { + // name: res.list[1].name1, + // id: res.list[1].identifier1 + // } + // for (let i = 1; i < res.list.length; i++) { + // let node1 = { + // name: res.list[i].name1, + // id: res.list[i].identifier1 + // } + // this.nodes.push(node1); + // // console.log(i); + // } + // this.nodes = [...new Set(this.nodes.map(node => JSON.stringify(node)))].map(node => + // JSON.parse(node)); + // console.log(this.nodes,'nodesnodesnodesnodes'); + // this.relationships = this.nodes.slice(1).map((item, index) => { + // console.log(item,res.list[index].relationName, 'iiiiiiiiiiiiisdfdsf'); + // return { + // source: this.nodes[0].name, + // target: item.name, + // relation: res.list[index].relationName + // }; + // }); } else { - alert('娌℃湁鎼滅储鍒版暟鎹�') + // alert('娌℃湁鎼滅储鍒版暟鎹�') } + this.relation() console.log(res); - }) - this.relation() + }) + + }, + // 楂樼骇鎼滅储 + async onSubmit(val) { + console.log(val); + await getAdvanceSearch(val).then(res => { + console.log(res, '鎺ュ彛璋冪敤鎴愬姛'); + }) }, // 鐐瑰嚮涓嬮潰鐨勬湞浠f寜閽� dynastyBottomClick(item) { + this.dynastyColor = item.id this.onSearch({ text: item.name }) }, + // 楂樼骇鎼滅储閲岄潰鑱屼笟鐨勪笅鎷夎彍鍗� + async innt() { + await getPDataStatistics().then(res => { + const professionIndex = this.From.from.findIndex(field => field.label === '鑱屼笟'); + // 濡傛灉鎵惧埌浜嗚亴涓氬瓧娈� + if (professionIndex !== -1) { + // 灏� profession.list 杞崲涓� options 鏍煎紡 + const options = res.object.occupationStatistic.details.map(item => ({ + label: item.tagName, + value: item.tagId.toString() // 灏� id 杞崲涓哄瓧绗︿覆锛岀‘淇濅笌 value 绫诲瀷涓�鑷� + })); + // 鏇存柊鑱屼笟瀛楁鐨� options 灞炴�� + this.$set(this.From.from[professionIndex], 'options', options); + } + }) + } }, mounted() { - // 鍏崇郴鍥捐氨 this.relation() this.echartsArr() this.hotSearch() + this.onSearch({ + text: '' + }) // 鐩戝惉绐楀彛澶у皬鍙樺寲 window.addEventListener('resize', this.relation); + + + this.innt() } } </script> -- Gitblit v1.9.1