From fe85e4208e502c78e3494a460617ae8753f51341 Mon Sep 17 00:00:00 2001
From: YM <479443481@qq.com>
Date: 星期五, 26 七月 2024 11:16:11 +0800
Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/TCM_CharacterLibrary
---
src/pages/inherit/list.vue | 121 +++++++++++++++++++++++++++++++---------
1 files changed, 94 insertions(+), 27 deletions(-)
diff --git a/src/pages/inherit/list.vue b/src/pages/inherit/list.vue
index a51d860..eb25d41 100644
--- a/src/pages/inherit/list.vue
+++ b/src/pages/inherit/list.vue
@@ -3,7 +3,7 @@
<headNav
idIndex="2"
:searchBg="false"
- text="涓尰涓栧尰浼犳壙鏁版嵁搴�"
+ text="瀹跺浼犳壙"
bg="/static/image/topBg1.png"
bg1="/static/image/line1.png"
/>
@@ -51,6 +51,33 @@
<view class="legend">
<view class="icon" style="background: #244a7b"></view>
<view>绀句細鍏崇郴</view>
+ </view>
+ <view class="viewChangeBtn">
+ <p>{{ viewType == 1 ? "妯増瑙嗗浘" : "绔栫増瑙嗗浘" }}</p>
+ <view class="imgBox">
+ <img
+ v-if="viewType == 1"
+ src="@/static/image/inherit/1-a.png"
+ alt=""
+ />
+ <img
+ v-else
+ src="@/static/image/inherit/1.png"
+ @click="viewChange(1)"
+ />
+ </view>
+ <view class="imgBox">
+ <img
+ v-if="viewType == 2"
+ src="@/static/image/inherit/2-a.png"
+ alt=""
+ />
+ <img
+ v-else
+ src="@/static/image/inherit/2.png"
+ @click="viewChange(2)"
+ />
+ </view>
</view>
</view>
<!-- echarts鍥� -->
@@ -115,6 +142,7 @@
culture1: null,
culture2: null,
culture3: null,
+ viewType: 1,
};
},
onLoad(options) {
@@ -126,13 +154,13 @@
if (this.type) {
this.changeType(this.type);
}
- this.getData();
+ this.getData(this.socialMapping);
},
methods: {
- getData() {
+ getData(socialFlag) {
inheritMedicalRelationList({
identifier: this.idIndex,
- socialFlag: true,
+ socialFlag: socialFlag,
}).then((res) => {
this.dataList = res.object;
// 澶勭悊鑺傜偣棰滆壊
@@ -211,15 +239,21 @@
this.culture3 = res.list.find((item) => item.typeName == "瀹惰");
});
},
+ viewChange(data) {
+ this.viewType = data;
+ document.getElementById("barChart").innerHTML = "";
+ this.initG6Chart();
+ },
showSocialMapping() {
this.socialMapping = !this.socialMapping;
if (!this.socialMapping) {
this.socialRelationsData(this.dataList.children);
console.log(this.dataList, "dataList");
document.getElementById("barChart").innerHTML = "";
- this.initG6Chart();
+ // this.initG6Chart();
+ this.getData(this.socialMapping);
} else {
- this.getData();
+ this.getData(this.socialMapping);
}
// this.initBarChart(newDataList, newLinks);
},
@@ -252,7 +286,8 @@
if (dataList && dataList.length) {
const G6Data = dataList.map((f) => {
return {
- id: f.name,
+ id: f.value + "-" + f.name,
+ name: f.name,
personId: f.personId,
relationInfo: f?.relationInfo?.relation
? f.relationInfo.relation
@@ -274,6 +309,7 @@
const data = {
isRoot: true,
id: this.dataList.name,
+ name: this.dataList.name,
style: {
fill: "red",
},
@@ -290,25 +326,24 @@
height,
linkCenter: true,
modes: {
- default: [
- // {
- // type: "collapse-expand",
- // onChange: function onChange(item, collapsed) {
- // const data = item.get("model");
- // data.collapsed = collapsed;
- // return true;
- // },
- // },
- "drag-canvas",
- "zoom-canvas",
- ],
+ default: ["drag-canvas", "zoom-canvas"],
},
defaultNode: {
size: 30,
+ type: "tree-node",
+ },
+ defaultEdge: {
+ type: this.viewType == 1 ? "cubic-horizontal" : "cubic-vertical",
+ style: {
+ endArrow: {
+ path: G6.Arrow.vee(10, 10, 18), // 浣跨敤鍐呯疆绠ご璺緞鍑芥暟锛屽弬鏁颁负绠ご鐨� 瀹藉害銆侀暱搴︺�佸亸绉婚噺锛堥粯璁や负 0锛屼笌 d 瀵瑰簲锛�
+ d: 15,
+ },
+ },
},
layout: {
type: "compactBox",
- direction: "LR",
+ direction: this.viewType == 1 ? "LR" : "TB",
getId: function getId(d) {
return d.id;
},
@@ -318,11 +353,12 @@
getWidth: function getWidth() {
return 16;
},
- getVGap: function getVGap() {
- return 30;
+ getVGap: () => {
+ console.log(this.viewType);
+ return this.viewType == 1 ? 20 : 110;
},
- getHGap: function getHGap() {
- return 100;
+ getHGap: () => {
+ return this.viewType == 1 ? 100 : 50;
},
},
});
@@ -337,7 +373,7 @@
fill: node.relationType ? "#EDF4FF" : "#FCEFE3",
stroke: node.relationType ? "#5E7AA7" : "#D3791E",
},
- label: node.id,
+ label: node.name,
labelCfg: {
position: "center",
offset: 5,
@@ -348,11 +384,14 @@
},
};
});
+ let that = this
+ const edgeType =
+ this.viewType == 1 ? "cubic-horizontal" : "cubic-vertical";
this.graph.edge(function (node) {
return {
- type: "cubic-horizontal",
+ type: edgeType,
color: "#A3B1BF",
- label: node.target._cfg?.model.relationInfo,
+ label: that.textStyle(node.target._cfg?.model.relationInfo)
};
});
this.graph.on("node:click", (e) => {
@@ -442,6 +481,11 @@
//杩涜娓叉煋
myChart.setOption(option);
},
+
+ textStyle(str) {
+ return str.replace(/(.{4})/g, "$1\n");
+ },
+
// 杩斿洖鎸夐挳
goBack() {
this.$router.go(-1);
@@ -509,6 +553,29 @@
margin-right: 0.06rem;
}
+.viewChangeBtn {
+ position: absolute;
+ right: 1.2rem;
+ top: 0.17rem;
+ display: flex;
+}
+
+.viewChangeBtn p {
+ line-height: 0.36rem;
+ margin-right: 0.2rem;
+}
+
+.viewChangeBtn .imgBox {
+ width: 0.36rem;
+ height: 0.36rem;
+}
+
+.viewChangeBtn img {
+ width: 100%;
+ height: 100%;
+ cursor: pointer;
+}
+
.legend {
display: flex;
align-items: center;
--
Gitblit v1.9.1