From 8288a11ac7af4d4fb40d3d3b038b772ee154f616 Mon Sep 17 00:00:00 2001
From: YM <479443481@qq.com>
Date: 星期一, 22 七月 2024 18:20:19 +0800
Subject: [PATCH] Merge branch 'master' of http://182.92.203.7:2001/r/TCM_CharacterLibrary

---
 src/pages/academicSchools/index.vue |  998 +++++++++++++++++++++++++++++++++++++---------------------
 1 files changed, 639 insertions(+), 359 deletions(-)

diff --git a/src/pages/academicSchools/index.vue b/src/pages/academicSchools/index.vue
index 7b41958..45652ba 100644
--- a/src/pages/academicSchools/index.vue
+++ b/src/pages/academicSchools/index.vue
@@ -1,32 +1,151 @@
 <template>
-  <view>
+  <view
+    style="width: 100%; height: 100%; display: flex; flex-direction: column"
+  >
     <headNav :idIndex="'6'" text="瀛︽湳娴佹淳" />
     <!-- 楂樼骇鎼滅储 -->
-    <view style="margin-top: 0.1rem">
+    <view
+      style="
+        padding-left: 0.6rem;
+        margin-top: 0.1rem;
+        display: flex;
+        position: relative;
+      "
+    >
       <advancedSearch
         @onSearch="onSearch"
-        @onSubmit="onSubmit"
-        :from="From"
         placehold="璇疯緭鍏ュ叧閿瓧"
+        :isAvancedTrue="false"
         :keyword="searchKey"
-        :advancedSearchBack="advancedSearchBack"
       />
+      <view
+        @click="isAvancedClick"
+        style="
+          color: #244a7b;
+          cursor: pointer;
+          font-size: 0.12rem;
+          margin-left: 0.35rem;
+          line-height: 0.58rem;
+        "
+        >楂樼骇鎼滅储 {{ isAdvancedSearch ? "鈭�" : "鈭�" }}</view
+      >
+      <!-- 鐑棬鎼滅储 -->
+      <view class="flex flex-center hotSearch" style="margin-left: 2rem">
+        鐑棬鎼滅储锛�
+        <ul class="flex" style="margin-right: 10rpx">
+          <li
+            @click="onSearch({ text: item }, index)"
+            :class="{ cursor: true, active: hotAciveIndex === index }"
+            v-for="(item, index) in hotKeyList"
+            :key="item"
+          >
+            {{ item.name }}
+          </li>
+        </ul>
+      </view>
+      <view v-if="isAdvancedSearch" class="searchDialog">
+        <h3 style="margin-bottom: 0.2rem">楂樼骇鎼滅储</h3>
+        <el-form  label-width="100px" :model="formData" size="mini">
+          <el-row>
+            <el-col :span="8">
+              <el-form-item label="濮撳悕/鍒悕锛�">
+                <el-input v-model="formData.name"></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="娲诲姩鍦帮細">
+                <el-select
+                  style="width: 100%"
+                  v-model="formData.actively"
+                  placeholder="璇烽�夋嫨娲诲姩鍦�"
+                >
+                  <!-- <el-option label="鍖哄煙涓�" value="shanghai"></el-option> -->
+                  <!-- <el-option label="鍖哄煙浜�" value="beijing"></el-option> -->
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="浣滃搧锛�">
+                <el-input v-model="formData.works"></el-input>
+              </el-form-item>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="8">
+              <el-form-item label="浜虹墿鏍囩锛�">
+                <el-select
+                  style="width: 100%"
+                  v-model="formData.personTags"
+                  placeholder="璇烽�夋嫨浜虹墿鏍囩"
+                >
+                  <!-- <el-option label="鍖哄煙涓�" value="shanghai"></el-option> -->
+                  <!-- <el-option label="鍖哄煙浜�" value="beijing"></el-option> -->
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="绀句細韬唤锛�">
+                <el-select
+                  style="width: 100%"
+                  v-model="formData.socialIdentity"
+                  placeholder="璇烽�夋嫨绀句細韬唤"
+                >
+                  <!-- <el-option label="鍖哄煙涓�" value="shanghai"></el-option> -->
+                  <!-- <el-option label="鍖哄煙浜�" value="beijing"></el-option> -->
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="8">
+              <el-form-item label="鏃舵湡锛�">
+                <el-select
+                  style="width: 100%"
+                  v-model="formData.period"
+                  placeholder="璇烽�夋嫨鏃舵湡"
+                >
+                  <!-- <el-option label="鍖哄煙涓�" value="shanghai"></el-option> -->
+                  <!-- <el-option label="鍖哄煙浜�" value="beijing"></el-option> -->
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
+        <div style="text-align: right">
+          <el-button type="primary" size="mini">鎼滅储</el-button>
+          <el-button size="mini">閲嶇疆</el-button>
+        </div>
+      </view>
+      <div v-if="showPerson" class="personDialog">
+        <i
+          class="el-icon-circle-close closeBtn"
+          @click="
+            () => {
+              showPerson = false;
+            }
+          "
+        ></i>
+        <el-table :data="personList" style="width: 100%">
+          <el-table-column prop="name" label="濮撳悕">
+            <template slot-scope="scope">
+              <span
+                style="color: #409eff; cursor: pointer"
+                @click="
+                  () => {
+                    currentId = scope.row.id;
+                    getData();
+                  }
+                "
+                >{{ scope.row.name }}</span
+              >
+            </template>
+          </el-table-column>
+          <el-table-column prop="age" label="鏃朵唬"> </el-table-column>
+          <el-table-column prop="nativePlace" label="绫嶈疮"> </el-table-column>
+          <el-table-column prop="alias" label="鍒悕"> </el-table-column>
+          <el-table-column prop="division" label="鍖诲鍒嗙"> </el-table-column>
+        </el-table>
+      </div>
     </view>
-    <!-- 鐑棬鎼滅储 -->
-    <view class="flex flex-center hotSearch">
-      鐑棬鎼滅储锛�
-      <ul class="flex" style="margin-right: 10rpx">
-        <li
-          @click="onSearch({ text: item }, index)"
-          :class="{ cursor: true, active: hotAciveIndex === index }"
-          v-for="(item, index) in hotKeyList"
-          :key="item"
-        >
-          {{ item }}
-        </li>
-      </ul>
-    </view>
-    <view style="margin-left: 0.2rem">涔︿腑鏈�甯告彁鍒扮殑100浣嶄汉鐗�</view>
+
     <!-- 鍏崇郴琛ㄥ湴鍥� -->
     <div
       id="relation"
@@ -46,6 +165,33 @@
       >
         鏆傛棤鐩稿叧鏁版嵁
       </div>
+      <div
+        v-if="loading"
+        v-loading="loading"
+        style="
+          position: absolute;
+          top: 30%;
+          left: 0;
+          right: 0;
+          text-align: center;
+          font-size: 0.2rem;
+          color: #666;
+        "
+      ></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" @click="spaceTimeArr(detailData.id)">鏌ョ湅鏇村>>></div>
     </div>
   </view>
 </template>
@@ -55,8 +201,10 @@
   getPersonData,
   getHotSearch,
   getPDataStatistics,
+  academicSearch,
 } from "@/api/index.js";
 import * as echarts from "echarts";
+import MyForm from "@/components/form/form.vue";
 export default {
   data() {
     return {
@@ -67,172 +215,6 @@
       nodes: [],
       // echarts涓よ�呯殑鍏崇郴
       relationships: [],
-      // 楂樼骇鎼滅储
-      From: {
-        from: [
-          {
-            type: "input",
-            label: "濮撳悕",
-            name: "name",
-            value: "",
-          },
-          {
-            type: "input",
-            label: "鍒悕",
-            name: "alias",
-            value: "",
-          },
-          {
-            type: "input",
-            label: "绫嶈疮",
-            name: "location",
-            value: "",
-          },
-          {
-            type: "select",
-            label: "鑱屼笟",
-            name: "sdId",
-            value: "",
-            options: [
-              {
-                label: "鏈寚鏄�",
-                value: "UNKNOWN",
-              },
-            ],
-          },
-          {
-            type: "input",
-            label: "瀹樿亴",
-            name: "office",
-            value: "",
-          },
-          {
-            type: "select",
-            label: "鎬у埆",
-            value: "",
-            name: "genderTypeEO",
-            options: [
-              {
-                label: "鏈寚鏄�",
-                value: "UNKNOWN",
-              },
-              {
-                label: "鐢�",
-                value: "MALE",
-              },
-              {
-                label: "濂�",
-                value: "WOMAN",
-              },
-            ],
-          },
-          {
-            type: "input",
-            label: "鏃舵湡",
-            name: "period",
-            value: "",
-          },
-          {
-            type: "input",
-            label: "鏈烘瀯",
-            name: "inst",
-            value: "",
-          },
-          {
-            type: "number",
-            label: "椤电爜",
-            name: "page",
-            value: "",
-          },
-          {
-            type: "number",
-            label: "椤靛ぇ灏�",
-            name: "pageSize",
-            value: "",
-          },
-        ],
-      },
-      // 涓嬮潰鐨勬湞浠�1
-      dynastyColor: 1,
-      // 鏈濅唬
-      dynasty: [
-        {
-          name: "澶忔湞",
-          coord: "2070BC",
-          id: 1,
-        },
-        {
-          name: "鍟嗘湞",
-          id: 2,
-          coord: "1600BC",
-        },
-        {
-          name: "瑗垮懆",
-          id: 3,
-          coord: "1600BC",
-        },
-        {
-          name: "鏄ョ鎴樺浗",
-          id: 4,
-          coord: "770BC",
-        },
-        {
-          name: "绉︽湞",
-          id: 5,
-          coord: "221BC",
-        },
-        {
-          name: "姹夋湞",
-          id: 6,
-          coord: "202BC",
-        },
-        {
-          name: "涓夊浗涓ゆ檵鍗楀寳鏈�",
-          id: 7,
-          coord: "184",
-        },
-        {
-          name: "闅嬫湞",
-          id: 8,
-          coord: "581",
-        },
-        {
-          name: "鍞愭湞",
-          id: 9,
-          coord: "618",
-        },
-        {
-          name: "浜斾唬鍗佸浗",
-          id: 10,
-          coord: "907",
-        },
-        {
-          name: "杈藉閲�",
-          id: 11,
-          coord: "907",
-        },
-        {
-          name: "瀹嬫湞",
-          id: 12,
-          coord: "960",
-        },
-        {
-          name: "鍏冩湞",
-          id: 13,
-          coord: "1271",
-        },
-
-        {
-          name: "鏄庢湞",
-          id: 14,
-          coord: "1368",
-        },
-        {
-          name: "娓呮湞",
-          id: 15,
-          coord: "1636",
-        },
-      ],
       // 鐑棬鎼滅储
       hotKeyList: [],
       searchKey: "",
@@ -241,8 +223,29 @@
       categories: [],
       // 浜虹墿淇℃伅
       infoOfPersons: [],
+      // 瀛︽湳娴佹淳
+      infoOfSchools: [],
       // 褰撳墠浜虹墿淇℃伅
       ownInfo: null,
+      detailData: {
+        name: "",
+      },
+      isAdvancedSearch: false,
+      formData: {
+        name: "",
+        actively: "",
+        works: "",
+        personTags: "",
+        socialIdentity: "",
+        period: ""
+      },
+      showPerson: false,
+      personList: [],
+      personPageInfo: {
+        totalCount: 0,
+        page: 1,
+        limit: 10,
+      },
     };
   },
   mounted() {
@@ -251,34 +254,142 @@
     this.hotSearch();
     // 鐩戝惉绐楀彛澶у皬鍙樺寲
     window.addEventListener("resize", this.relation);
-    this.innt();
   },
   onLoad(options) {
     this.searchKey = options.keyword;
   },
   methods: {
-    getPersonInfo(arr, str, newArr, order, type) {
+    // 鑾峰彇浜虹墿鍏崇郴
+    getPersonInfo(arr, str, newArr, order, type, parent) {
       for (let i = 0; i < arr.length; i++) {
         const ele = arr[i];
         const personInfo = this.infoOfPersons.find(
           (item) => item.id == ele.personId
         );
-        const obj = {
-          personId: ele.personId,
-          id1: this.ownInfo.id,
-          id2: personInfo.id,
-          relationTypeId: ele.relationTypeId,
-          relationTypeName: ele.relationTypeName,
-          name1: this.ownInfo?.NAME[0]?.content1,
-          name2: personInfo?.NAME[0]?.content1,
-          category: type,
-        };
-        newArr.push(obj);
-        if (ele[str] && ele[str]?.length) {
-          this.getPersonInfo(ele[str], "kinList", newArr, 2, type);
+        if (personInfo?.id) {
+          const obj = {
+            personId: ele.personId,
+            parentId: parent.id,
+            relationTypeName: ele.relationTypeName,
+            parentName: parent?.NAME[0]?.content1 ?? parent.parentName,
+            name: personInfo?.NAME[0]?.content1,
+            category: type,
+            symbolSize: 15,
+          };
+          if (order > 80) {
+            order = 80;
+          }
+          if (str == "literatureList") {
+            obj.relationTypeName = ele.literatureName;
+          }
+          if (str == "schoolList") {
+            const nameData = this.infoOfSchools?.find(
+              (i) => i.schoolId == ele.schoolId
+            );
+            obj.relationTypeName = nameData?.name[0];
+          }
+          if (str == "placeList") {
+            obj.relationTypeName = ele.ancientName ?? ele.currentName;
+          }
+          newArr.push(obj);
+          if (ele["kinList"] && ele["kinList"]?.length) {
+            order += 15;
+            this.getPersonInfo(
+              ele["kinList"],
+              "kinList",
+              newArr,
+              order,
+              0,
+              personInfo
+            );
+          }
+          if (ele["teacherStudentList"] && ele["teacherStudentList"]?.length) {
+            order += 15;
+            this.getPersonInfo(
+              ele["teacherStudentList"],
+              "teacherStudentList",
+              newArr,
+              order,
+              1,
+              personInfo
+            );
+          }
+          if (ele["literatureList"] && ele["literatureList"]?.length) {
+            const data = this.changeLiterature(
+              ele["literatureList"],
+              "literatureList"
+            );
+            order += 15;
+            this.getPersonInfo(
+              data,
+              "literatureList",
+              newArr,
+              order,
+              2,
+              personInfo
+            );
+          }
+
+          if (ele["socialList"] && ele["socialList"]?.length) {
+            const data = this.changeLiterature(ele["socialList"], "socialList");
+            order += 15;
+            this.getPersonInfo(
+              data,
+              "socialList",
+              newArr,
+              order,
+              3,
+              personInfo
+            );
+          }
+          if (ele["placeList"] && ele["placeList"]?.length) {
+            const data = this.changeLiterature(ele["placeList"], "placeList");
+            order += 15;
+            this.getPersonInfo(data, "placeList", newArr, order, 4, personInfo);
+          }
+          if (ele["schoolList"] && ele["schoolList"]?.length) {
+            const data = this.changeLiterature(ele["schoolList"], "schoolList");
+            order += 15;
+            this.getPersonInfo(
+              data,
+              "schoolList",
+              newArr,
+              order,
+              5,
+              personInfo
+            );
+          }
         }
       }
     },
+
+    // 澶勭悊鏁版嵁
+    changeLiterature(arr, str) {
+      for (let i = 0; i < arr.length; i++) {
+        const ele = arr[i];
+        if (!ele.personId && ele.personList?.length) {
+          ele.literatureList = [];
+          ele.personId = this.ownInfo.id;
+          if (ele["personList"] && ele["personList"]?.length) {
+            for (let j = 0; j < ele["personList"].length; j++) {
+              const item = ele["personList"][j];
+              const data = item[str]?.map((e) => {
+                return {
+                  ...e,
+                  personId: item.personId,
+                };
+              });
+              if (ele[str] && data?.length) {
+                ele[str].push(...data);
+              }
+            }
+          }
+        }
+      }
+      return arr;
+    },
+
+    // 鏂囩尞
 
     //鏁扮粍鍘婚噸
     deduplicateArray(arr, idKey) {
@@ -299,73 +410,131 @@
 
       return deduplicatedArray;
     },
+
+    // 鏌ヨ璇︽儏
     getData() {
       this.loading = true;
       getPersonData(this.currentId).then((res) => {
         this.nodes = [];
         this.relationships = [];
-        let kin = [];
+        let kinData = [];
         let teacher = [];
+        let literature = [];
+        let social = [];
+        let place = [];
+        let school = [];
         if (res && res.success && res.object) {
-          console.log(res.object);
           this.infoOfPersons = res.object?.infoOfPersons;
+          this.infoOfSchools = res.object?.infoOfSchools;
+          console.log(res.object);
           if (res.object?.personChain) {
             this.ownInfo = this.infoOfPersons.find(
               (item) => item.id == res.object?.personChain.personId
             );
             const obj = res.object?.personChain;
-            console.log(obj.kinList, "kinList");
             if (obj.kinList?.length) {
               let newArr = [];
               this.categories.push({ name: "浜插睘鍏崇郴" });
-              this.getPersonInfo(obj.kinList, "kinList", newArr, 1, 0);
-              console.log(newArr, "list");
-              newArr.forEach((item) => {
-                let exists1 = this.nodes.some(
-                  (node) => node.id === item.id1 && node.name === item.name1
-                );
-                let exists2 = this.nodes.some(
-                  (node) => node.id === item.id1 && node.name === item.name2
-                );
-                // 璇佹槑涓嶅瓨鍦�
-                if (item.name1 && exists1 !== true) {
-                  this.nodes.push({
-                    name: item.name1,
-                    id: item.id1,
-                    ...item,
-                  });
-                }
-                if (item.name2 && exists2 !== true) {
-                  this.nodes.push({
-                    name: item.name2,
-                    id: item.id2,
-                    ...item,
-                  });
-                }
-                let obj = {
-                  source: item.name1,
-                  target: item.name2,
-                  relation: item.relationTypeName || "", // 濡傛灉瀛樺湪 relationName 瀛楁鍒欎娇鐢紝鍚﹀垯涓虹┖瀛楃涓�
-                };
-                this.relationships.push(obj);
-              });
+              this.getPersonInfo(
+                obj.kinList,
+                "kinList",
+                newArr,
+                1,
+                0,
+                this.ownInfo
+              );
+              kinData = [...newArr];
             }
             if (obj.teacherStudentList?.length) {
               this.categories.push({ name: "甯堟壙鍏崇郴" });
+              let newArr = [];
+              this.getPersonInfo(
+                obj.teacherStudentList,
+                "teacherStudentList",
+                newArr,
+                1,
+                1,
+                this.ownInfo
+              );
+              teacher = [...newArr];
             }
             if (obj.literatureList?.length) {
               this.categories.push({ name: "鏂囩尞浣滃搧" });
+              let newArr = [];
+              const data = this.changeLiterature(
+                obj.literatureList,
+                "literatureList"
+              );
+              this.getPersonInfo(
+                data,
+                "literatureList",
+                newArr,
+                1,
+                2,
+                this.ownInfo
+              );
+              literature = [...newArr];
+              // console.log(literature, "literature");
             }
             if (obj.socialList?.length) {
+              let newArr = [];
               this.categories.push({ name: "绀句細鍏崇郴" });
+              const data = this.changeLiterature(obj.socialList, "socialList");
+              this.getPersonInfo(
+                data,
+                "socialList",
+                newArr,
+                1,
+                3,
+                this.ownInfo
+              );
+              social = [...newArr];
             }
             if (obj.placeList?.length) {
               this.categories.push({ name: "娲诲姩鍦�" });
+              let newArr = [];
+              const data = this.changeLiterature(obj.placeList, "placeList");
+              console.log(data, "place");
+              this.getPersonInfo(data, "placeList", newArr, 1, 4, this.ownInfo);
+              place = [...newArr];
             }
             if (obj.schoolList?.length) {
               this.categories.push({ name: "瀛︽湳娴佹淳" });
+              let newArr = [];
+              const data = this.changeLiterature(obj.schoolList, "schoolList");
+              this.getPersonInfo(
+                data,
+                "schoolList",
+                newArr,
+                1,
+                5,
+                this.ownInfo
+              );
+              school = [...newArr];
             }
           }
+          const personData = [
+            ...kinData,
+            ...teacher,
+            ...literature,
+            ...social,
+            ...place,
+            ...school,
+          ];
+
+          personData.forEach((item) => {
+            this.nodes.push({
+              name: item.name,
+              id: item.personId,
+              ...item,
+            });
+            let obj = {
+              source: item.parentName,
+              target: item.name,
+              relation: item.relationTypeName || "", // 濡傛灉瀛樺湪 relationName 瀛楁鍒欎娇鐢紝鍚﹀垯涓虹┖瀛楃涓�
+            };
+            this.relationships.push(obj);
+          });
         }
         this.loading = false;
         this.relation();
@@ -378,6 +547,23 @@
       // 鍋囪鎮ㄦ湁鑺傜偣鍚嶇О鍜屽畠浠箣闂寸殑鍏崇郴鏁版嵁
       var nodes = this.deduplicateArray(this.nodes, "id");
       var relationships = this.relationships;
+
+      nodes = nodes.map((item) => {
+        let size = item.symbolSize;
+        for (let i = 0; i < relationships.length; i++) {
+          const linkItem = relationships[i];
+          if (linkItem.source == item.parentName) {
+            size += 5;
+          }
+          if (linkItem.target == item.parentName) {
+            size += 5;
+          }
+        }
+        return {
+          ...item,
+          symbolSize: size > 80 ? 80 : size,
+        };
+      });
 
       let FontSize = 12; // 瀛椾綋澶у皬
       let BorderWidth = 2; // 杈规澶у皬
@@ -404,7 +590,7 @@
       var links = [];
       relationships.forEach((relationship, i) => {
         var sourceIndex = nodes.findIndex(
-          (node) => node.name === relationship.source
+          (node) => node.parentName === relationship.source
         );
         var targetIndex = nodes.findIndex(
           (node) => node.name === relationship.target
@@ -437,153 +623,156 @@
         }
       });
       // 鏍规嵁nodes鍔ㄦ�佺敓鎴愯妭鐐规暟鎹�
-      var nodeData = nodes.map(function (node, index) {
-        return {
-          name: node.name,
-          id: node.id,
-          itemStyle: {
-            color: "#eae0eb", // 鍙互鏍规嵁绱㈠紩璁剧疆涓嶅悓鐨勯鑹�
-            borderWidth: BorderWidth,
-            borderColor: "#996f9f",
-          },
-        };
-      });
-
+      var nodeData = nodes;
       var option;
       option = {
-        title: {
-          // text: '涔︿腑鏈�甯告彁鍒扮殑100浣嶄汉鐗�',
-          // subtext: '',
-          left: "center",
-          top: FontSize + 10,
-          // textStyle: {
-          // 	fontSize: FontSize // 璁剧疆鏍囬鏂囧瓧澶у皬涓� 18px
-          // },
-          subtextStyle: {
-            fontSize: FontSize, // 璁剧疆鍓爣棰樻枃瀛楀ぇ灏忎负 14px
-            color: "#2C2C2C",
-          },
-        },
-        backgroundColor: {
-          type: "image",
-          image: "/static/image/characterRelationBg.png",
-          // repeat: 'repeat-x', // 鏄惁骞抽摵锛屽彲浠ユ槸 'repeat-x', 'repeat-y', 'no-repeat'
-          size: "100% 100%", // 鑳屾櫙鍥剧墖鐨勫昂瀵革紝鍙互鏄櫨鍒嗘瘮鎴栬�呭儚绱�
-          position: "center center", // 鑳屾櫙鍥剧墖鐨勪綅缃紝鍙互鏄� top, bottom, middle 鎴栬�呯櫨鍒嗘瘮
-        },
-        tooltip: {},
+        // backgroundColor: {
+        //   type: "image",
+        //   image: "/static/image/characterRelationBg.png",
+        //   size: "100% 100%", // 鑳屾櫙鍥剧墖鐨勫昂瀵革紝鍙互鏄櫨鍒嗘瘮鎴栬�呭儚绱�
+        //   position: "center center", // 鑳屾櫙鍥剧墖鐨勪綅缃紝鍙互鏄� top, bottom, middle 鎴栬�呯櫨鍒嗘瘮
+        // },
+        // tooltip: {},
         legend: [
           {
-            // selectedMode: 'single',
+            left: 20,
+            top: 20,
+            orient: "vertical",
             data: this.categories.map(function (a) {
               return a.name;
             }),
           },
         ],
-        animationDurationUpdate: 1500,
-        animationEasingUpdate: "quinticInOut",
         series: [
           {
             type: "graph",
+            legendHoverLink: false,
             layout: "force",
-            roam: true,
-            symbolSize: SymbolSize, // 璋冩暣鑺傜偣澶у皬
-            label: {
-              show: true,
-              color: "black", // 璁剧疆鑺傜偣鏂囧瓧棰滆壊涓洪粦鑹�
-              fontSize: FontSize, // 璁剧疆鏂囧瓧澶у皬
-            },
-            edgeSymbol: ["circle", "arrow"],
-            edgeSymbolSize: [4, 10],
+            symbolSize: 15,
             data: nodeData,
             links: links,
             categories: this.categories,
+            roam: true,
+            label: {
+              show: true,
+              position: "right",
+              formatter: "{b}",
+            },
+            scaleLimit: {
+              min: 0.4,
+              max: 2,
+            },
             lineStyle: {
-              opacity: 0.9,
-              width: 2,
-              curveness: 0.3,
+              color: "source",
+              curveness: 0.2,
             },
             emphasis: {
               focus: "adjacency",
               lineStyle: {
-                width: 10,
+                width: 5,
               },
             },
             force: {
-              // layoutAnimation: false,
-              // friction: 1,
-              repulsion: 800,
-              edgeLength: 400,
+              repulsion: 600,
+              edgeLength: 300,
             },
           },
-          // {
-          //   name: "Les Miserables",
-          //   type: "graph",
-          //   legendHoverLink: false,
-          //   layout: "none",
-          //   data: nodeData,
-          //   links: links,
-          //   categories: this.categories,
-          //   roam: true,
-          //   label: {
-          //     position: "right",
-          //     formatter: "{b}",
-          //   },
-          //   lineStyle: {
-          //     color: "source",
-          //     curveness: 0.3,
-          //   },
-          //   emphasis: {
-          //     focus: "adjacency",
-          //     lineStyle: {
-          //       width: 10,
-          //     },
-          //   },
-          // },
         ],
       };
-      // 灏嗙敓鎴愮殑杩炴帴绾挎坊鍔犲埌echarts鍥捐〃鐨刼ption涓�
-      option.series[0].links = links;
       // 璁剧疆鐐瑰嚮浜嬩欢鐩戝惉
       myChart.off("click");
       myChart.on("click", (params) => {
         if (params.dataType === "node") {
-          this.spaceTimeArr(params.data.id);
+          this.creatDom(params);
         }
       });
-      option && myChart.setOption(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 = {
+        id: params.data.id,
+        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) {
+      console.log(val);
       if (index !== undefined) {
+        // 鐑棬鎼滅储鍏抽敭瀛楋紝鐩存帴鏌ヨ鏁版嵁
         this.searchKey = "";
         this.hotAciveIndex = index;
+        this.currentId = val.text.id;
+        this.getData();
       } else {
         this.hotAciveIndex = "";
+        // 鎼滅储鍏堟樉绀轰汉鐗╁垪琛�
+        this.personPageInfo.page = 1;
+        this.searchPerson(val.text);
       }
-      // this.searchKey = val.text;
-      this.getData(val.text);
     },
-    // 楂樼骇鎼滅储
-    onSubmit(val) {
-      getAdvanceSearch({
-        ...val,
-        page: 1,
-        pageSize: 100,
+    // 鏍规嵁鍏抽敭瀛楁绱汉鐗�
+    searchPerson(key) {
+      academicSearch({
+        keyword: key,
+        page: this.personPageInfo.page,
+        pageSize: this.personPageInfo.limit,
       }).then((res) => {
-        console.log(res, "res");
-      });
-    },
-    advancedSearchBack() {
-      uni.navigateTo({
-        url: "/pages/knowledgeBase/knowledgeBase",
-      });
-    },
-    // 鐐瑰嚮涓嬮潰鐨勬湞浠f寜閽�
-    dynastyBottomClick(item) {
-      this.dynastyColor = item.id;
-      this.onSearch({
-        text: item.name,
+        this.personList = res.list.map((item) => {
+          return {
+            id: item.personId,
+            name: item.name,
+            age:
+              item.periodList && item.periodList.length
+                ? item.periodList[0].content2
+                : "-",
+            nativePlace:
+              item.nativePlaceList && item.nativePlaceList.length
+                ? item.nativePlaceList[0].content1
+                : "-",
+            alias:
+              item.aliasList && item.aliasList.length
+                ? item.aliasList[0].content2
+                : "-",
+            division:
+              item.medicalBranchList && item.medicalBranchList.length
+                ? item.medicalBranchList[0].content1
+                : "-",
+          };
+        });
+        this.showPerson = true;
       });
     },
     // 鍏崇郴鍥� 鐐瑰嚮閲岄潰鐨勫厓绱�
@@ -612,36 +801,94 @@
         const indexList = Object.keys(res.object);
         indexList.sort((a, b) => parseInt(b) - parseInt(a));
         this.hotKeyList = indexList.map((item) => {
-          return res.object[item];
+          return {
+            id: item,
+            name: res.object[item],
+          };
         });
       });
     },
-
-    // 楂樼骇鎼滅储閲岄潰鑱屼笟鐨勪笅鎷夎彍鍗�
-    innt() {
-      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);
-        }
-      });
+    isAvancedClick() {
+      this.isAdvancedSearch = !this.isAdvancedSearch;
+      // this.$nextTick(() => {
+      //   var box1Height = document.querySelector(".fbox").offsetHeight;
+      //   // let box2Height= document.querySelector('.fbox1').style.height = box1Height + 'px';
+      //   let box2Height = document.querySelector(".fbox1").offsetHeight;
+      //   if (box1Height <= box2Height) {
+      //     document.querySelector(".fbox1").style.height = box1Height + "px";
+      //   }
+      // });
     },
   },
 };
 </script>
 
 <style>
+#relation {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  background-image: url("../../static/image/characterRelationBg.png");
+  background-size: 100% 100%;
+  background-repeat: no-repeat;
+  background-position: center;
+}
+
+.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) {
 }
 
@@ -676,4 +923,37 @@
     }
   }
 }
+
+.searchDialog {
+  position: absolute;
+  top: 0.68rem;
+  left: 0;
+  right: 0;
+  z-index: 999;
+  padding: 0.1rem 0.4rem;
+  background: #fff;
+  min-height: 2rem;
+}
+
+.personDialog {
+  position: absolute;
+  top: 0.68rem;
+  z-index: 999;
+  padding: 0.1rem;
+  background: #fff;
+  border-radius: 6px;
+  box-shadow: 0 0 10px -3px #000;
+  .closeBtn {
+    position: absolute;
+    right: -10px;
+    top: -10px;
+    width: 24px;
+    height: 24px;
+    font-size: 24px;
+    background-color: #fff;
+    border-radius: 50%;
+    color: #f56c6c;
+    cursor: pointer;
+  }
+}
 </style>

--
Gitblit v1.9.1