From c56935d7085725e609d926b064c146f3ffc29e6e Mon Sep 17 00:00:00 2001
From: YM <479443481@qq.com>
Date: 星期四, 06 六月 2024 19:33:48 +0800
Subject: [PATCH] 1

---
 src/pages/inherit/index.vue |   78 +++++++++++++++++++++++++++++++-------
 1 files changed, 63 insertions(+), 15 deletions(-)

diff --git a/src/pages/inherit/index.vue b/src/pages/inherit/index.vue
index f318915..370cf29 100644
--- a/src/pages/inherit/index.vue
+++ b/src/pages/inherit/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <view class="">
+  <view>
     <headNav
       idIndex="2"
       :searchBg="false"
@@ -10,7 +10,37 @@
 
     <div class="filterBox font-family">
       <div class="searchBox">
-        <input type="text" v-model="keyword" placeholder="璇疯緭鍏ュ叧閿瓧" />
+        <input
+          type="text"
+          v-model="keyword"
+          @confirm="search"
+          placeholder="璇疯緭鍏ュ叧閿瓧"
+          style="padding-right: 54px; box-sizing: border-box"
+        />
+        <span
+          class="cleanupBtn"
+          v-if="keyword"
+          @click="keyword = ''"
+          style="
+            position: absolute;
+            top: 50%;
+            margin-top: -10px;
+            right: 84px;
+            color: #fff;
+            z-index: 2;
+            display: inline-block;
+            width: 20px;
+            height: 20px;
+            text-align: center;
+            line-height: 20px;
+            background-color: #a5a5a5;
+            font-weight: bold;
+            border-radius: 50%;
+            font-size: 12px;
+            cursor: pointer;
+          "
+          >鉁�</span
+        >
         <button @click="search">鎼滅储</button>
       </div>
       <div class="dynasty">
@@ -71,7 +101,21 @@
     </div>
     <div class="contentBox">
       <!-- echarts鍥� -->
-      <div class="barChart" ref="barChart"></div>
+      <div id="barChart" ref="barChart"></div>
+      <div
+        v-if="!loading && nodeData.length == 0"
+        style="
+          position: absolute;
+          top: 30%;
+          left: 0;
+          right: 0;
+          text-align: center;
+          font-size: 0.2rem;
+          color: #666;
+        "
+      >
+        鏆傛棤鎼滅储鏁版嵁
+      </div>
       <div
         class="toolBox"
         v-if="showTool"
@@ -94,6 +138,7 @@
 export default {
   data() {
     return {
+      loading: true,
       // 鏍囬椤堕儴鏍忛渶瑕佺殑涓滆タ
       keyword: "",
       idIndex: 0,
@@ -106,12 +151,11 @@
       toolTop: 0,
       toolLeft: 0,
       toolInfo: {},
-      totalCount: 0,
+      totalCount: 0
     };
   },
   onLoad(options) {
     this.idIndex = options.id;
-    console.log("optionsoptionsoptions", options.id);
   },
   mounted() {
     this.getStatistics();
@@ -120,14 +164,15 @@
     getStatistics() {
       inheritMedicalSataStatistics().then((res) => {
         this.dynasty = res.object;
-        this.activeId = this.dynasty[0].dynastyId
+        this.activeId = this.dynasty[0].dynastyId;
         this.getData();
       });
     },
     getData() {
+      this.loading = true;
       this.nodeData = [];
       // const defaultDynasty = this.dynasty.find(f.dynasty == "瀹�");
-      
+      this.showTool = false;
       inheritMedicalList({
         keywords: this.keyword,
         dynastyId: this.activeId,
@@ -152,16 +197,18 @@
           searchType: this.searchType,
           path: this.conditionId
         }).then((res) => {
-          this.totalCount = res.object.totalCount
+          this.totalCount = res.object.totalCount;
         });
+        console.log(this.nodeData, "this.nodeData");
+        this.loading = false;
         // 鍒濆鍖� echarts
         this.initBarChart();
       });
     },
     initBarChart() {
-      // WMBg
       //閫氳繃 $ref 杩涜鎸傝浇
-      let myChart = echarts.init(this.$refs.barChart);
+      var chartDom = document.getElementById("barChart");
+      let myChart = echarts.init(chartDom);
 
       let FontSize = 18; // 瀛椾綋澶у皬
       let BorderWidth = 2; // 杈规澶у皬
@@ -235,8 +282,9 @@
               curveness: 0
             },
             force: {
+              layoutAnimation: false,
               // initLayout: 'circular',
-              // gravity: 0
+              // gravity: 0,
               friction: 0.1,
               repulsion: 500,
               edgeLength: 6
@@ -252,7 +300,6 @@
         }
       });
       myChart.on("click", (params) => {
-        console.log(params.event.offsetX, params.event.offsetY);
         if (params.componentType === "series") {
           this.showTool = true;
           this.toolTop = params.event.offsetY + "px";
@@ -358,7 +405,7 @@
   height: 80vh;
   position: relative;
 }
-.barChart {
+#barChart {
   width: 100%;
   height: 100%;
 }
@@ -394,17 +441,18 @@
   align-items: center;
   margin: 0 auto;
   margin-top: 0.2rem;
+  position: relative;
 }
 
 .searchBox > input {
   border: none;
   outline: none;
   margin: auto;
-  width: 100%;
+  flex: 1;
+  overflow: hidden;
   padding-left: 20px;
 }
 .searchBox > button {
-  width: 10%;
   color: white;
   height: 40px;
   line-height: 40px;

--
Gitblit v1.9.1