elink-star
/
epmet-work-uni
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

关系图谱功能，

master
mk 10 months ago
parent
41ce77eb87
commit
9a4fc8602e
5 changed files with 233 additions and 326 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      pages/login/login.vue
  2. 238
      pages/resiAndHouse/resiAndHouse.vue
  3. 300
      subpages/searchResult/pages/resiInfo/component/graph/graph.vue
  4. 15
      subpages/searchResult/pages/resiInfo/resiInfo.vue
  5. 4
      utils/config.js

2
pages/login/login.vue
View File

@ -137,7 +137,7 @@ export default {
}) })
.catch((err) => { .catch((err) => {
uni.showToast({ uni.showToast({
title: res.msg, title: err.msg,
icon: 'none', icon: 'none',
duration: 3000 duration: 3000
}); });

238
pages/resiAndHouse/resiAndHouse.vue
View File

@ -52,7 +52,7 @@
<view class="group_2" v-if="selectVale === 'resi'"> <view class="group_2" v-if="selectVale === 'resi'">
<view class="section_2"> <view class="section_2">
<view class="box_16"> <view class="box_16">
<jia-cascader :itemList="angencyList" @completeChange="completeGrid" @inputChange="changeResiCascader" :border="false" :clearIcon="false"></jia-cascader> <jia-cascader v-if="selectVale === 'resi' && resiText" :itemList="angencyList" @completeChange="completeGrid" @inputChange="changeResiCascader" :border="false" :clearIcon="false" :request="true" :receiveData="receiveData" :placeholder="resiText"></jia-cascader>
</view> </view>
<view class="box_17"> <view class="box_17">
<view class="tabs"> <view class="tabs">
@ -220,13 +220,7 @@
<view class="group_2" v-if="selectVale === 'house'"> <view class="group_2" v-if="selectVale === 'house'">
<view class="section_2"> <view class="section_2">
<view class="box_16" v-if="!houseListSearchFlag"> <view class="box_16" v-if="!houseListSearchFlag">
<text lines="1" class="text_4" @tap="handelClickShowTreeFw">{{ cascaderNameFw }}</text> <jia-cascader v-if="houseText && selectVale === 'house'" :itemList="angencyFwList" @completeChange="completeGrid1" @inputChange="changeHouseCascader" :border="false" :clearIcon="false" :request="true" :receiveData="receiveDataFw" :placeholder="houseText"></jia-cascader>
<view class="image-text_9">
<view class="image-text_qh">
<image src="/static/images/swapHorizontal.png" class="image_8"></image>
<text lines="1" class="text_5" @tap="handelClickShowTreeFw">切换</text>
</view>
</view>
</view> </view>
<view class="box_17" v-if="!houseListSearchFlag"> <view class="box_17" v-if="!houseListSearchFlag">
<view class="tabs"> <view class="tabs">
@ -363,20 +357,6 @@ export default {
tableData: [], tableData: [],
tableFwData: [], tableFwData: [],
resiList: [
{
name: '',
resiTags: [''],
nationalityName: '',
nationName: '',
mobile: '',
idNum: '',
agencyName: '',
homeName: '',
updatedTime: ''
}
],
pageNo: 1, pageNo: 1,
pageSize: 10, pageSize: 10,
lowerThreshold: '10', lowerThreshold: '10',
@ -391,7 +371,6 @@ export default {
angencyId: null, angencyId: null,
category: null, category: null,
searchOrgIdPath: '', searchOrgIdPath: '',
cascaderFwValue: '',
angencyList: [], angencyList: [],
//组织树 //组织树
@ -399,14 +378,6 @@ export default {
agencyName: '', agencyName: '',
fieldName: {
text: 'label',
value: 'id',
children: 'children'
},
cascaderNameFw: null,
params: { params: {
agencyId: '', agencyId: '',
orgId: '', orgId: '',
@ -452,7 +423,6 @@ export default {
], ],
tempList: [], tempList: [],
angencyJmList: [],
houseListSearchFlag: false, houseListSearchFlag: false,
cascaderName: '', cascaderName: '',
statusHeight: '', statusHeight: '',
@ -461,7 +431,11 @@ export default {
loadLeve: '', loadLeve: '',
resiSearch: '', resiSearch: '',
houseSearch: '', houseSearch: '',
carList:[] carList:[],
receiveData:[],
receiveDataFw:[],
houseText:'',
resiText:''
}; };
}, },
/** /**
@ -538,7 +512,8 @@ export default {
onShareAppMessage() {}, onShareAppMessage() {},
methods: { methods: {
completeGrid(e) { completeGrid(e) {
},
completeGrid1(e) {
}, },
async carInfoPage(){ async carInfoPage(){
try { try {
@ -582,6 +557,17 @@ export default {
} }
}, },
changeResiCascader(e){ changeResiCascader(e){
const {level,value} = e
getNextTree({
level,
id: value
}).then((res) => {
if (res.data.length > 0) {
this.receiveData = this.convertLabelToText(res.data)
}else{
this.receiveData = null
}
});
this.searchOrgIdPath = e.value; this.searchOrgIdPath = e.value;
this.setData({ this.setData({
pageNo: 1, pageNo: 1,
@ -596,44 +582,30 @@ export default {
url: `/subpages/house/pages/housePortrait/housePortrait?resiId=${e.currentTarget.dataset.item.id}` url: `/subpages/house/pages/housePortrait/housePortrait?resiId=${e.currentTarget.dataset.item.id}`
}); });
}, },
getUnitoption(val) { getUnitoption(val) {
const level = val[0].level;
getNextTree({ getNextTree({
level: val[0].level, level: level,
id: val[0].id || val[0].agencyId id: val[0].id || val[0].value
}).then((res) => { }).then((res) => {
if (res.data.length > 0) { if (res.data.length > 0) {
if (res.data[0].level != 'unit' || res.data[0].level == 'unit') { if(level !== 'unit'){
this.getUnitoption(res.data);
this.setData({
tempList:this.tempList.concat([res.data[0]])
})
}
let houseText = this.tempList.map(item=>item.label).join('-')
this.setData({ this.setData({
tempList: this.tempList.concat([res.data[0]]) houseText
}); })
this.getUnitoption(res.data); if(level === 'unit'){
} this.setData({
let unitId = this.tempList.filter((item) => item.level == 'unit')[0]?.id; 'params1.searchOrgIdPath': val[0].id,
this.setData({ 'params.orgId': val[0].id,
cascaderNameFw: this.tempList });
.map((item) => item.label) this.getTableFwData();
.splice(0, this.tempList.length - 1)
.join(','),
'params1.searchOrgIdPath': unitId,
'params.orgId': unitId
});
const data = res.data.map((item) => {
if (item.level != 'unit') {
return {
...item,
children: []
};
} }
return {
...item,
children: null
};
});
const arr = this.getTreeFun(val[0].agencyId, this.angencyFwList, data);
this.setData({
angencyFwList: arr
});
} else { } else {
const arr = this.getTreeFun(val[0].agencyId, this.angencyFwList, null); const arr = this.getTreeFun(val[0].agencyId, this.angencyFwList, null);
this.setData({ this.setData({
@ -681,9 +653,11 @@ export default {
}, },
getTopTreeData() { getTopTreeData() {
api.getAgencygridtree().then((res) => { api.getTopTree().then((res) => {
this.setData({ this.setData({
angencyList: this.convertLabelToText([res.data]) angencyList: this.convertLabelToText([res.data]),
angencyFwList: this.convertLabelToText([res.data]),
resiText:app.globalData.user.agencyName
}); });
}); });
}, },
@ -693,17 +667,17 @@ export default {
...node ...node
}; };
// 将 label 替换为 text // 将 label 替换为 text
if (newNode.agencyName !== undefined) { if (newNode.label !== undefined) {
newNode.text = newNode.agencyName; newNode.text = newNode.label;
delete newNode.agencyName; delete newNode.label;
} }
if (newNode.subAgencyList && newNode.subAgencyList.length > 0) { if (newNode.children && newNode.children.length > 0) {
newNode.children = newNode.subAgencyList newNode.children = newNode.children
delete newNode.subAgencyList; delete newNode.children;
} }
if (newNode.agencyId) { if (newNode.id) {
newNode.value = newNode.agencyId newNode.value = newNode.id
delete newNode.agencyId; delete newNode.id;
} }
if (newNode.children && newNode.children.length > 0) { if (newNode.children && newNode.children.length > 0) {
newNode.children = this.convertLabelToText(newNode.children); newNode.children = this.convertLabelToText(newNode.children);
@ -730,100 +704,44 @@ export default {
}); });
}, },
onChangeJm(e) {
console.log(e);
const { value, selectedOptions } = e.detail;
const level = selectedOptions[selectedOptions.length - 1].level;
const orgId = selectedOptions[selectedOptions.length - 1].id;
const cascaderName = selectedOptions.map((item) => item.label).join('');
this.setData({
searchOrgIdPath: orgId,
cascaderName,
tableData: [],
pageNo: 1,
selectedOptions,
loadLeve: selectedOptions.findIndex((item) => item.level === 'house') !== -1 ? 'house' : ''
});
getNextTree({
level,
id: value
}).then((res) => {
if (res.data.length > 0) {
const data = res.data.map((item) => {
if (item.level != 'house') {
return {
...item,
children: []
};
}
return {
...item,
children: null
};
});
const arr = this.getTreeFun(value, this.angencyJmList, data);
this.setData({
angencyJmList: arr
});
} else {
const arr = this.getTreeFun(value, this.angencyJmList, null);
this.setData({
angencyJmList: arr
});
}
});
this.getAllOrgCategoryCount();
this.getTableData();
},
onFinishJm(e) {
this.setData({ changeHouseCascader(e) {
pageNo: 1, const { value, level } = e;
searchOrgIdPath: e.detail.selectedOptions[e.detail.selectedOptions.length - 1].id, const updateParamsAndFetchData = (orgId) => {
cascaderName: e.detail.selectedOptions.map((item) => item.label).join(','), this.setData({
tableData: [] params: {
}); ...this.params,
this.getAllOrgCategoryCount(); agencyId: app.globalData.user.agencyId,
}, orgId,
},
'params1.searchOrgIdPath': orgId
});
this.getTableFwData();
};
onChangeFw(e) { if (level === 'unit') {
const { value, tabIndex, selectedOptions } = e.detail; this.receiveDataFw = null;
if (tabIndex > 0 && selectedOptions[selectedOptions.length - 1].level != 'unit') { updateParamsAndFetchData(value);
const level = selectedOptions[selectedOptions.length - 1].level; } else {
getNextTree({ getNextTree({ level, id: value }).then((res) => {
level,
id: value
}).then((res) => {
if (res.data.length > 0) { if (res.data.length > 0) {
const data = res.data.map((item) => { this.receiveDataFw = this.convertLabelToText(res.data);
if (item.level != 'unit') {
return {
...item,
children: []
};
}
return {
...item,
children: null
};
});
const arr = this.getTreeFun(value, this.angencyFwList, data);
this.setData({
angencyFwList: arr
});
} else { } else {
const arr = this.getTreeFun(value, this.angencyFwList, null); this.receiveDataFw = null;
this.setData({ updateParamsAndFetchData(value);
angencyFwList: arr
});
} }
}); });
} }
}, },
handelClickSearchType(e) { handelClickSearchType(e) {
this.setData({ this.setData({
selectVale: e.currentTarget.dataset.type selectVale: e.currentTarget.dataset.type,
receiveData:null,
houseText:null,
tempList:[]
}); });
if (e.currentTarget.dataset.type === 'resi') { if (e.currentTarget.dataset.type === 'resi') {
this.setData({ this.setData({

300
subpages/searchResult/pages/resiInfo/component/graph/graph.vue
View File

@ -1,27 +1,20 @@
<template> <template>
<!-- subpages/searchResult/pages/resiInfo/modules/graph/graph.wxml --> <!-- subpages/searchResult/pages/resiInfo/modules/graph/graph.wxml -->
<view class="hotlineComplaints"> <view class="hotlineComplaints">
<ec-canvas id="hotlineComplaints" canvas-id="hotlineComplaints" :ec="ec"></ec-canvas> <view id="graph" style=" height: 338rpx; width: 100%;"></view>
</view> </view>
</template> </template>
<script> <script>
import ecCanvas from '../../../../../../ec-canvas/ec-canvas'; import * as echarts from 'echarts';
import * as echarts from '../../../../../../static/echarts.js';
import { getFamilyRelationshipList } from '../../../../../../utils/api'; import { getFamilyRelationshipList } from '../../../../../../utils/api';
var chart;
export default { export default {
components: { components: {
ecCanvas
}, },
data() { data() {
return { return {
ec: { myChart: null,
lazyLoad: true
// onInit: initChart
},
tabValue: 1
}; };
}, },
props: { props: {
@ -35,166 +28,165 @@ export default {
this.$nextTick(() => this.ready()); this.$nextTick(() => this.ready());
}, },
methods: { methods: {
initEcharts() {
var chartDom = document.getElementById('graph');
// 将创建的echarts示例放到vue的data中，这样在这个界面就想到于全局配置了
this.myChart = echarts.init(chartDom);
},
ready() { ready() {
this.getData(); this.getData();
this.initEcharts();
}, },
getData() { getData() {
this.zpSelectComponent('#hotlineComplaints').init((canvas, width, height, dpr) => {
chart = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: dpr // 像素比
});
let than = this; let params = {
chart.on('click', function (param) { type: '0',
if (param.dataType == 'node') { id: this.resiId
than.$emit('clickGraphNode', { };
detail: { getFamilyRelationshipList(params).then(({ data }) => {
data: param.data.data let index = data.findIndex((item) => item.id == this.resiId);
} if (index !== -1) {
}); const [item] = data.splice(index, 1);
data.unshift(item);
}
let nodeList = data.map((item, index) => {
let symbolUrl = '';
if (item.type === 1) {
symbolUrl = 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/a6cdfe6f699040f58fd8b2c10486b41d.png';
} else { } else {
} // 如果 type 不等于 1，则根据 gender 进行判断
}); if (item.gender === '1') {
canvas.setChart(chart); // 如果 gender 等于 1，则根据 age 进行进一步的判断
let params = { symbolUrl =
type: '0', item.age > 18 && item.age < 60
id: this.resiId ? 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/1e21790833b04e9abe61e2a8f40446cb.png'
}; : item.age < 18
getFamilyRelationshipList(params).then(({ data }) => {
let index = data.findIndex((item) => item.id == this.resiId);
if (index !== -1) {
const [item] = data.splice(index, 1);
data.unshift(item);
}
let nodeList = data.map((item, index) => {
let symbolUrl = '';
if (item.type === 1) {
symbolUrl = 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/a6cdfe6f699040f58fd8b2c10486b41d.png';
} else {
// 如果 type 不等于 1，则根据 gender 进行判断
if (item.gender === '1') {
// 如果 gender 等于 1，则根据 age 进行进一步的判断
symbolUrl =
item.age > 18 && item.age < 60
? 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/1e21790833b04e9abe61e2a8f40446cb.png'
: item.age < 18
? 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/62c2b6a1ce834f8dae081b562b2579b9.png' ? 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/62c2b6a1ce834f8dae081b562b2579b9.png'
: item.age > 60 : item.age > 60
? 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/bd586a4e7d0f4b3aa68c79067dfe1428.png' ? 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/bd586a4e7d0f4b3aa68c79067dfe1428.png'
: ''; : '';
} else if (item.gender === '2') { } else if (item.gender === '2') {
// 如果 gender 等于 2，则根据 age 进行进一步的判断 // 如果 gender 等于 2，则根据 age 进行进一步的判断
symbolUrl = symbolUrl =
item.age > 18 && item.age < 60 item.age > 18 && item.age < 60
? 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/3b44e3495dcd4d96a3c07baad1bd7c5e.png' ? 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/3b44e3495dcd4d96a3c07baad1bd7c5e.png'
: item.age < 18 : item.age < 18
? 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/0c38251bba644a6b8e4a925aea74c9a7.png' ? 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/0c38251bba644a6b8e4a925aea74c9a7.png'
: item.age > 60 : item.age > 60
? 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/2465ff7633a94413bf4ed2aa778c2765.png' ? 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/2465ff7633a94413bf4ed2aa778c2765.png'
: ''; : '';
} else { } else {
symbolUrl = 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/1e21790833b04e9abe61e2a8f40446cb.png'; symbolUrl = 'image://https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20240402/1e21790833b04e9abe61e2a8f40446cb.png';
}
} }
return { }
name: item.name, return {
id: index + 1, name: item.name,
category: 0, id: index + 1,
symbolSize: item.id == this.resiId ? 50 : 30, category: 0,
symbol: symbolUrl, symbolSize: item.id == this.resiId ? 50 : 30,
label: { symbol: symbolUrl,
position: 'bottom'
},
data: {
type: item.type,
id: item.id
}
};
});
let links = data.map((item, index) => ({
source: 0,
target: index,
name: item.houseHolderRel || '未知',
label: { label: {
align: 'center', position: 'bottom'
fontSize: 12,
color: '#9cbbf9'
}, },
lineStyle: { data: {
color: '#9cbbf9' type: item.type,
} id: item.id
}));
let categories = data.map((item, index) => ({
name: item.houseHolderRel || '未知',
id: index + 1,
itemStyle: {
color: '#9cbbf9'
} }
}));
categories.splice(0, 1);
var option = {
legend: [
{
// selectedMode: 'single',
// icon: 'circle'
show: false
}
],
series: [
{
type: 'graph',
layout: 'force',
// symbolSize: 10,
force: {
repulsion: 80,
gravity: 0,
edgeLength: 100,
//线条长度
layoutAnimation: true
},
draggable: true,
roam: false,
nodeScaleRatio: 0,
focusNodeAdjacency: false,
lineStyle: {
normal: {
opacity: 0.5,
width: 1.5,
curveness: 0
}
},
categories: categories,
edgeSymbol: ['', 'arrow'],
// edgeSymbolSize: [80, 10],
edgeLabel: {
normal: {
show: true,
textStyle: {
fontSize: 20
},
formatter(x) {
return x.data.name;
}
}
},
label: {
show: true
},
data: nodeList,
links: links
}
]
}; };
chart.setOption(option);
}); });
return chart; let links = data.map((item, index) => ({
source: 0,
target: index,
name: item.houseHolderRel || '未知',
label: {
align: 'center',
fontSize: 12,
color: '#9cbbf9'
},
lineStyle: {
color: '#9cbbf9'
}
}));
let categories = data.map((item, index) => ({
name: item.houseHolderRel || '未知',
id: index + 1,
itemStyle: {
color: '#9cbbf9'
}
}));
categories.splice(0, 1);
var option = {
legend: [
{
// selectedMode: 'single',
// icon: 'circle'
show: false
}
],
series: [
{
type: 'graph',
layout: 'force',
// symbolSize: 10,
force: {
repulsion: 80,
gravity: 0,
edgeLength: 100,
//线条长度
layoutAnimation: true
},
draggable: true,
roam: false,
nodeScaleRatio: 0,
focusNodeAdjacency: false,
lineStyle: {
normal: {
opacity: 0.5,
width: 1.5,
curveness: 0
}
},
categories: categories,
edgeSymbol: ['', 'arrow'],
// edgeSymbolSize: [80, 10],
edgeLabel: {
normal: {
show: true,
textStyle: {
fontSize: 20
},
formatter(x) {
return x.data.name;
}
}
},
label: {
show: true
},
data: nodeList,
links: links
}
]
};
if (option) {
let than = this;
this.myChart.on('click', function (param) {
if (param.dataType == 'node') {
than.$emit('clickGraphNode', {
detail: {
data: param.data.data
}
});
} else {
}
});
this.myChart.setOption(option);
}
}); });
} }
}, },
created: function () {}, created: function () { },
watch: { watch: {
resiId: { resiId: {
handler: function (val) { handler: function (val) {
@ -206,12 +198,8 @@ export default {
} }
}; };
</script> </script>
<style> <style scoped>
/* subpages/searchResult/pages/resiInfo/modules/graph/graph.wxss */ /* subpages/searchResult/pages/resiInfo/modules/graph/graph.wxss */
ec-canvas {
width: 100%;
height: 100%;
}
.hotlineComplaints { .hotlineComplaints {
width: 100%; width: 100%;
height: 618rpx; height: 618rpx;

15
subpages/searchResult/pages/resiInfo/resiInfo.vue
View File

@ -347,11 +347,12 @@
</view> </view>
</view> </view>
</view> </view>
<view class="card" id="graph"> <view class="card" id="graph1">
<view class="title">关系图谱</view> <view class="title">
<!-- <resi-graph :resiId="resiId" @clickGraphNode="clickGraphNode" v-if="resiId"></resi-graph> --> <text>人员图谱</text>
</view>
<resi-graph :resiId="resiId" @clickGraphNode="clickGraphNode" ></resi-graph>
</view> </view>
<view class="card" id="business"> <view class="card" id="business">
<view class="title"> <view class="title">
<text>业务记录</text> <text>业务记录</text>
@ -1184,7 +1185,7 @@ export default {
ensure_house: '保障房信息', ensure_house: '保障房信息',
chronic_disease: '慢病信息', chronic_disease: '慢病信息',
base: '基本信息', base: '基本信息',
graph: '关系图谱', graph1: '关系图谱',
update: '更新记录', update: '更新记录',
business: '业务记录' business: '业务记录'
}; };
@ -1199,7 +1200,7 @@ export default {
list.push( list.push(
{ {
name: '关系图谱', name: '关系图谱',
id: 'graph' id: 'graph1'
}, },
{ {
name: '业务记录', name: '业务记录',
@ -1623,7 +1624,7 @@ export default {
} }
}; };
</script> </script>
<style> <style scoped>
/* subpages/searchResult/pages/resiInfo/resiInfo.wxss */ /* subpages/searchResult/pages/resiInfo/resiInfo.wxss */
/**index.wxss**/ /**index.wxss**/
page { page {

4
utils/config.js
View File

@ -4,8 +4,8 @@ module.exports = {
userId: '' userId: ''
}; };
function BASEURL() { function BASEURL() {
return 'http://192.168.1.140/api/'; // return 'http://192.168.1.140/api/';
// return 'http://112.230.202.146:10081'//生产 return 'http://112.230.202.146:10081/api/'//生产
} }
function getToken() { function getToken() {

Write Preview
Loading…
Cancel
Save