From f1a0db5232be76d93dcaad38b2bfdb524868731d Mon Sep 17 00:00:00 2001
From: QYF-GitLab1 <1940665526@qq.com>
Date: 星期四, 18 七月 2024 18:50:54 +0800
Subject: [PATCH] 1

---
 src/pages/academicSchools/index.vue |  134 +++++++++++++++++++++++++++++++++++++++-----
 1 files changed, 118 insertions(+), 16 deletions(-)

diff --git a/src/pages/academicSchools/index.vue b/src/pages/academicSchools/index.vue
index d544c1a..c3c251c 100644
--- a/src/pages/academicSchools/index.vue
+++ b/src/pages/academicSchools/index.vue
@@ -48,6 +48,20 @@
         鏆傛棤鐩稿叧鏁版嵁
       </div>
     </div>
+    <div id="customDialog" class="customDialog">
+      <div class="title">
+        <span>{{ detailData.name }}</span>
+        <span @click="closeDom">鍏抽棴</span>
+      </div>
+      <div class="content">
+        <p>濮撳悕锛歿{ detailData.name }}</p>
+        <p>鍒悕锛歿{ detailData.alias }}</p>
+        <p>绫嶈疮锛歿{ detailData.nativePlace }}</p>
+        <p>鍖诲鍒嗙锛� {{ detailData.medicalBranch }}</p>
+        <p>灏忎紶锛歿{ detailData.biography }}</p>
+      </div>
+      <div class="btn">鏌ョ湅鏇村>>></div>
+    </div>
   </view>
 </template>
 
@@ -243,9 +257,12 @@
       // 浜虹墿淇℃伅
       infoOfPersons: [],
       // 瀛︽湳娴佹淳
-      infoOfSchools:[],
+      infoOfSchools: [],
       // 褰撳墠浜虹墿淇℃伅
       ownInfo: null,
+      detailData: {
+        name: "",
+      },
     };
   },
   mounted() {
@@ -281,7 +298,9 @@
           obj.relationTypeName = ele.literatureName;
         }
         if (str == "schoolList") {
-          const nameData = this.infoOfSchools?.find(i=>i.schoolId == ele.schoolId)
+          const nameData = this.infoOfSchools?.find(
+            (i) => i.schoolId == ele.schoolId
+          );
           obj.relationTypeName = nameData?.name[0];
         }
         if (str == "placeList") {
@@ -557,7 +576,7 @@
       var option;
       option = {
         title: {
-          text: "瀛︽湳娴佹淳",
+          text: "",
           // subtext: '',
           left: "center",
           top: FontSize + 10,
@@ -619,11 +638,48 @@
       myChart.off("click");
       myChart.on("click", (params) => {
         if (params.dataType === "node") {
-          this.spaceTimeArr(params.data.id);
+          this.creatDom(params);
         }
       });
-      console.log(option, "option");
       myChart.setOption(option);
+    },
+    creatDom(params) {
+      const e = params.event;
+      const div = document.getElementById("customDialog");
+      div.style.display = "block";
+      div.style.left = e.offsetX + 50 + "px";
+      div.style.top = e.offsetY - 50 + "px";
+      const data = this.infoOfPersons?.find(
+        (i) => i.id == params.data.personId
+      );
+      const obj = {
+        name:
+          data?.NAME?.map((e, i) => {
+            i += 1;
+            return e["content" + i];
+          }).join("銆�") ?? "",
+        alias:
+          data?.ALIAS?.map((e, i) => {
+            i += 1;
+            return e["content" + i];
+          }).join("銆�") ?? "",
+        nativePlace:
+          data?.NATIVE_PLACE?.map((e, i) => {
+            i += 1;
+            return e["content" + i];
+          }).join("銆�") ?? "",
+        medicalBranch:
+          data?.MEDICAL_BRANCH?.map((e, i) => {
+            i += 1;
+            return e["content" + i];
+          }).join("銆�") ?? "",
+        biography: data?.BIOGRAPHY ?? "",
+      };
+      this.detailData = obj;
+    },
+    closeDom() {
+      const div = document.getElementById("customDialog");
+      div.style.display = "none";
     },
     // 鍩虹鎼滅储
     onSearch(val, index) {
@@ -633,7 +689,6 @@
       } else {
         this.hotAciveIndex = "";
       }
-      // this.searchKey = val.text;
       this.getData(val.text);
     },
     // 楂樼骇鎼滅储
@@ -717,7 +772,64 @@
 #relatio {
   width: 100%;
   height: 100%;
+  position: relative;
 }
+
+.customDialog {
+  width: 300px;
+  min-height: 240px;
+  display: none;
+  position: fixed;
+  z-index: 99999999;
+  border-radius: 2px;
+  background: #fff;
+}
+
+.customDialog .title {
+  width: 100%;
+  height: 35px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 10px;
+  box-sizing: border-box;
+  background-color: rgb(221, 232, 246);
+  font-size: 14px;
+}
+.customDialog .title span:nth-child(1) {
+  font-size: 16px;
+  font-weight: 600;
+}
+
+.customDialog .title span:nth-child(2) {
+  color: rgb(95, 127, 168);
+  cursor: pointer;
+}
+
+.customDialog .content {
+  padding: 15px;
+  box-sizing: border-box;
+}
+
+.customDialog .content p {
+  margin-bottom: 5px;
+  display: -webkit-box; /* 鏄剧ず澶氳鏂囨湰瀹瑰櫒 */
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2; /*鏄剧ず琛屾暟*/
+  overflow: hidden; /*闅愯棌澶氬嚭閮ㄥ垎鏂囧瓧*/
+  text-overflow: ellipsis; /*鐢ㄧ渷鐣ュ彿浠f浛澶氬嚭閮ㄥ垎鏂囧瓧*/
+}
+
+.customDialog .btn{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: rgb(95, 127, 168);
+  cursor: pointer;
+  font-size: 14px;
+  height: 35px;
+}
+
 @media screen and (min-width: 2560px) and (max-width: 3840px) {
 }
 
@@ -741,15 +853,5 @@
 .hotSearch {
   font-size: 0.12rem;
   color: #2c2c2c;
-
-  li {
-    color: #244a7b;
-    margin: 0 0.1rem;
-    color: #244a7b;
-    &.active {
-      color: #027edc;
-      font-weight: bold;
-    }
-  }
 }
 </style>

--
Gitblit v1.9.1