From 1e6ad815e1be186abfbb146cdb632b1817089620 Mon Sep 17 00:00:00 2001
From: juwei001 <974220104@qq.com>
Date: Fri, 15 Mar 2024 17:25:16 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BB=A3=E7=A0=81=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/hsyf.js                               |  16 ++
 src/components/GridTree/nodeWrap.vue          | 148 ++++++++++--------
 src/components/NameSplit/index.vue            |  23 ++-
 .../hsyf-left/organization/organization.vue   | 106 ++++++-------
 .../dialog-module/hsyf-right/ylqdModal.vue    |   5 +-
 .../dialog-module/hsyf-right/ywqsModal.vue    |   4 +-
 .../screen-content-left/hsyf-left/index.vue   |   2 +-
 7 files changed, 167 insertions(+), 137 deletions(-)

diff --git a/src/api/hsyf.js b/src/api/hsyf.js
index 1b3fa73..3dd9dd1 100644
--- a/src/api/hsyf.js
+++ b/src/api/hsyf.js
@@ -17,6 +17,22 @@ export function getSearchTreelist (params) {
     params
   })
 }
+// 党组织架构
+export function partyOrgTree (params) {
+  return request({
+    url: '/api/resi/partymember/yifengScreen/partyOrgTree',
+    method: 'GET',
+    params
+  })
+}
+// 党员中心户列表
+export function partyMemberCenListByOrg (params) {
+  return request({
+    url: '/api/resi/partymember/yifengScreen/partyMemberCenListByOrg',
+    method: 'GET',
+    params
+  })
+}
 
 // 各级党委组织架构领导班子
 export function partyOrgLeaderList (params) {
diff --git a/src/components/GridTree/nodeWrap.vue b/src/components/GridTree/nodeWrap.vue
index 583818b..f0398c8 100644
--- a/src/components/GridTree/nodeWrap.vue
+++ b/src/components/GridTree/nodeWrap.vue
@@ -1,14 +1,10 @@
 <template>
   <div>
-    <div class="node-wrap" v-if="nodeConfig.laneLevel === 1">
+    <div class="node-wrap" v-if="nodeConfig.orgType == '3'">
       <div class="node-wrap-box">
         <div class="node-box-after">
           <div class="nodeBoxTop">
-            <nameSplit
-              :item="nodeConfig"
-              areaName="organizationName"
-              peopleName="name"
-            />
+            <nameSplit :item="nodeConfig" areaName="name" peopleName="name" />
           </div>
         </div>
       </div>
@@ -24,7 +20,7 @@
             <div class="condition-node">
               <div class="condition-node-box">
                 <div class="auto-judge">
-                  <div v-if="getOnerSixLevelFlag(item)">
+                  <div v-if="item.orgType != '6' && item.orgType != '7'">
                     <div
                       :class="[
                         item.children && item.children.length > 0
@@ -34,7 +30,7 @@
                     >
                       <nameSplit
                         :item="item"
-                        areaName="organizationName"
+                        areaName="name"
                         peopleName="name"
                       />
                     </div>
@@ -57,7 +53,7 @@
                       />
                     </div>
                   </div>
-                  <div v-if="item.level === 'building_chief'">
+                  <div v-if="item.orgType == '6'">
                     <div
                       :class="[
                         item.children && item.children.length > 0
@@ -67,18 +63,19 @@
                     >
                       <nameSplit
                         :item="item"
-                        areaName="organizationName"
+                        areaName="name"
                         peopleName="name"
                       />
                     </div>
                     <div
-                      v-if="item._children"
                       style="text-align: center; cursor: pointer"
-                      @click="getChildrenData(item, index, nodeConfig.children)"
+                      @click="
+                        getChildrenDataPople(item, index, nodeConfig.children)
+                      "
                     >
                       <img
                         style="width: 16px; height: 16px; margin-left: 50px"
-                        v-if="item.children && item.children.length > 0"
+                        v-if="item.id == currentId"
                         :src="require('@/assets/images/home/sh-red.png')"
                         alt=""
                       />
@@ -90,8 +87,7 @@
                       />
                     </div>
                   </div>
-                  <div v-if="item.level === 'unit_chief'">
-                      <!-- @click="gotoPersonnel(item)" -->
+                  <div v-if="item.orgType == '7'">
                     <div
                       :class="[
                         item.categoryWarn === 'red'
@@ -105,17 +101,16 @@
                           ? 'dyzxhHover'
                           : 'dyzxh',
                       ]"
-                      :title="item.organizationName"
+                      :title="item.name"
                     >
-                      <!-- {{ spliceNameFun(item.organizationName, 3) }} -->
-                      <div class="dyzxhDian" v-if="index===0"></div>
+                      <div class="dyzxhDian" v-if="index === 0"></div>
                       <div class="dyzxhDian1" v-else></div>
-                      {{ item.organizationName }}
+                      {{ item.name }}
                     </div>
-                    <div
+                    <!-- <div
                       v-if="item._children"
                       style="text-align: center; cursor: pointer"
-                      @click="getChildrenData(item, index, nodeConfig.children)"
+                      @click="getChildrenDataPople(item, index, nodeConfig.children)"
                     >
                       <img
                         style="width: 16px; height: 16px; margin-left: 50px"
@@ -129,7 +124,7 @@
                         :src="require('@/assets/images/home/zk-red.png')"
                         alt=""
                       />
-                    </div>
+                    </div> -->
                   </div>
                 </div>
               </div>
@@ -152,87 +147,106 @@
   </div>
 </template>
 <script>
+import { partyMemberCenListByOrg } from '@/api/hsyf'
 export default {
-  props: ["nodeConfig"],
-  data() {
+  props: ['nodeConfig'],
+  data () {
     return {
       homeTypeArr: [],
+      currentId: null,
       sixLevelArr: [
-        "province",
-        "city",
-        "district",
-        "street",
-        "community",
-        "grid_manager",
-      ],
-    };
+        'province',
+        'city',
+        'district',
+        'street',
+        'community',
+        'grid_manager'
+      ]
+    }
   },
-  mounted() {},
+  mounted () {},
   computed: {},
   watch: {},
   methods: {
-    getAllName(item) {
-      return item;
+    getAllName (item) {
+      return item
     },
 
-    getItemNameArr(str) {
-      return str.split(",").slice(0, 2);
+    getItemNameArr (str) {
+      return str.split(',').slice(0, 2)
     },
 
-    spliceNameFun(row, num) {
+    spliceNameFun (row, num) {
       if (row && row.length > num) {
-        return row.substring(0, num) + "...";
+        return row.substring(0, num) + '...'
       }
-      return row;
+      return row
     },
 
-    getOnerSixLevelFlag(item) {
-      return this.sixLevelArr.includes(item.level);
+    getOnerSixLevelFlag (item) {
+      return this.sixLevelArr.includes(item.level)
     },
 
-    findParentParentId(nodeConfig, pid) {
-      let parentParentId = "";
+    findParentParentId (nodeConfig, pid) {
+      let parentParentId = ''
       if (nodeConfig.id === pid) {
-        return nodeConfig.pid;
+        return nodeConfig.pid
       } else {
         if (nodeConfig.children && nodeConfig.children.length > 0) {
           for (let i = 0; i < nodeConfig.children.length; i++) {
             parentParentId = this.findParentParentId(
               nodeConfig.children[i],
               pid
-            );
+            )
             if (parentParentId) {
-              return parentParentId;
+              return parentParentId
             }
           }
         }
       }
     },
-    getChildrenData(item, idx, arr) {
+    getChildrenData (item, idx, arr) {
       arr.forEach((element, index) => {
         if (index === idx) {
           if (element.children) {
-            element._children = element.children;
-            element.children = null;
+            element._children = element.children
+            element.children = null
           } else {
-            element.children = element._children;
+            element.children = element._children
           }
         } else {
-          element.children = null;
+          element.children = null
         }
-      });
+      })
     },
-    gotoPersonnel(item) {
-      const grandPid = this.findParentParentId(this.nodeConfig, item.pid);
-      const name = item.organizationName
-        ? item.organizationName
-        : "四号楼二单元302";
+    getChildrenDataPople (item, idx, arr) {
+      partyMemberCenListByOrg({ orgId: item.id }).then((res) => {
+        arr.forEach((element, index) => {
+          if (element.children) {
+            element._children = element.children
+            element.children = null
+            this.currentId = null
+          } else {
+            element.children = res.data.map(item => {
+              return {
+                ...item,
+                orgType: 7
+              }
+            })
+            this.currentId = item.id
+          }
+        })
+      })
+    },
+    gotoPersonnel (item) {
+      const grandPid = this.findParentParentId(this.nodeConfig, item.pid)
+      const name = item.name ? item.name : '四号楼二单元302'
       this.$router.push(
         `/organizational/microgrid/${item.id}/${grandPid}/${name}`
-      );
-    },
-  },
-};
+      )
+    }
+  }
+}
 </script>
 <style scoped lang="scss">
 @import "~@/assets/css/workflow.scss";
@@ -325,10 +339,11 @@ export default {
     text-align: center;
     min-width: 120px;
     height: 81px;
-    padding-top: 28px;
+    margin-bottom: 12px;
+    padding-top: 42px;
     background-image: url(~@/assets/images/home/lydxzTree-red.png);
     background-repeat: no-repeat;
-    background-position: center;
+    background-position: center 28px;
   }
   .lydxzHover {
     @include spanLevel;
@@ -336,10 +351,11 @@ export default {
     text-align: center;
     min-width: 120px;
     height: 81px;
-    padding-top: 28px;
+    margin-bottom: 12px;
+    padding-top: 42px;
     background-image: url(~@/assets/images/home/lydxzTree-red.png);
     background-repeat: no-repeat;
-    background-position: center;
+    background-position: center 28px;
   }
   .dyzxh {
     @include lastLevel;
diff --git a/src/components/NameSplit/index.vue b/src/components/NameSplit/index.vue
index 37abc57..e26c286 100644
--- a/src/components/NameSplit/index.vue
+++ b/src/components/NameSplit/index.vue
@@ -1,43 +1,42 @@
 <template>
   <div class="node-com">
     <div
-      v-if="!flag"
-      :class="item['level'] == 'street' ? 'nodeTitle1' : 'nodeTitle'"
+      :class="item['orgType'] == '3' ? 'nodeTitle1' : 'nodeTitle'"
       :title="getAllName(item[areaName])"
     >
       {{ spliceNameFun(item[areaName], 7) }}
-      <div v-if="item['level'] == 'street'" class="nodeTitleStreet">
+      <div v-if="item['orgType'] == '3'" class="nodeTitleStreet">
         <img src="@/assets/images/icon/danghui.png" />
       </div>
-      <div v-if="item['level'] == 'street'" class="nodeTitleStreet1">
+      <div v-if="item['orgType'] == '3'" class="nodeTitleStreet1">
         <img src="@/assets/images/icon/downJt.png" />
       </div>
     </div>
-    <div
+    <!-- <div
       class="name_more peoName"
       v-if="item[peopleName] && !item[peopleName].includes(',')"
-      @click="gotoPersonnel(item.resiId)"
+      @click="gotoPersonnel(item.id)"
       :title="getAllName(item[peopleName])"
     >
       {{ spliceNameFun(item[peopleName], 12) }}
-    </div>
-    <div
+    </div> -->
+    <!-- <div
       class="name_more"
       v-if="item[peopleName] && item[peopleName].includes(',')"
     >
       <span
         v-for="(i, k) in getItemNameArr(item[peopleName])"
         :key="i"
-        @click="gotoPersonnel(item.resiId.split(',')[k])"
+        @click="gotoPersonnel(item.id.split(',')[k])"
         :title="getAllName(i)"
         >{{ spliceNameFun(i, 12)
         }}{{
           k === getItemNameArr(item[peopleName]).length - 1 ? "" : ","
         }}</span
-      >
+      > -->
       <!-- 多个人员展示 -->
       <!-- <popTips :item="item" :pageName="pageName" /> -->
-    </div>
+    <!-- </div> -->
     <div v-if="item.partyOrgLevel < 9" class="peoPosition peoName">
       ({{ getPeopositionMap(item.partyOrgLevel) }})
     </div>
@@ -73,7 +72,6 @@ export default {
     return {};
   },
   mounted() {
-    // console.log("item:", this.item);
   },
   methods: {
     getAllName(item) {
@@ -81,6 +79,7 @@ export default {
     },
 
     getItemNameArr(str) {
+      console.log('getItemNameArr::', str.split(",").slice(0, 1))
       return str.split(",").slice(0, 1);
     },
 
diff --git a/src/views/next/dialog-module/hsyf-left/organization/organization.vue b/src/views/next/dialog-module/hsyf-left/organization/organization.vue
index f33eda8..13b7ef8 100644
--- a/src/views/next/dialog-module/hsyf-left/organization/organization.vue
+++ b/src/views/next/dialog-module/hsyf-left/organization/organization.vue
@@ -18,16 +18,12 @@
                   v-for="(item, index) in levelArr"
                   :key="item"
                   :class="[
-                    item === 'unit_chief' ? 'lastLevel' : '',
+                    index === 4 ? 'lastLevel' : '',
                     `flowLevel-${index + 1}`,
                   ]"
-                  :style="{
-                    height: item === 'building_chief' ? '91px' : '',
-                    lineHeight: item === 'building_chief' ? '91px' : '',
-                  }"
                 >
-                  <div :class="[item === 'building_chief' ? 'otherTop' : '']">
-                    {{ getTitleNameMapFun(item) }}
+                  <div :class="[index === 4 ? 'otherTop' : '']">
+                    {{ getTitleNameMapFun(index) }}
                   </div>
                 </div>
                 <el-row>
@@ -60,6 +56,7 @@
 
 <script>
 import { mapGetters, mapActions } from 'vuex'
+import { partyOrgTree } from '@/api/hsyf'
 import dataJson from './organization.json'
 export default {
   name: '',
@@ -88,10 +85,6 @@ export default {
     }
   },
   mounted () {
-    // const orgId = this.$store.state.chooseArea.chooseName.orgId;
-    // if (orgId) {
-    //   this.getTreeData();
-    // }
     this.getTreeData()
   },
   created () {},
@@ -127,24 +120,24 @@ export default {
     },
     // 获取data以及子节点的level
     getDataPLevel (data) {
-      data.forEach((item) => {
-        this.levelArr.push(item.level)
-        if (item.children && item.children.length > 0) {
-          this.getDataPLevel(item.children)
-        }
-      })
+      // data.forEach((item) => {
+      //   this.levelArr.push(item.level)
+      //   if (item.children && item.children.length > 0) {
+      //     this.getDataPLevel(item.children)
+      //   }
+      // })
+      this.levelArr = [1, 2, 3, 4, 5]
       const myArray = [...new Set(this.levelArr)]
       this.treeHeight = myArray.length * 110 + 200
-      this.levelArr = this.getLevelArrNum(myArray)
     },
 
     hideChildrenData (data) {
       const newData = [...data]
       newData.forEach((item) => {
-        if (item.laneLevel === 1) {
+        if (item.orgType == 3) {
           this.hideChildrenData(item.children)
         }
-        if (item.children && item.children.length > 0 && item.laneLevel >= 2) {
+        if (item.children && item.children.length > 0 && item.orgType >= 4) {
           item._children = item.children
           item.children = null
           this.hideChildrenData(item._children)
@@ -156,41 +149,41 @@ export default {
     // 获取树状结构
     getTreeData () {
       this.loading = true
-      // 接口还没开发，临时用静态数据
-      const res = this.dataJson
-      // console.log(' this.dataJson::',  this.dataJson);
-      const {
-        data: { code, msg, data }
-      } = res
-      // console.log(data);
-      if (code === 0) {
-        if (data.length === 0) {
+      partyOrgTree().then((res) => {
+        const { code, msg } = res
+        const data = [{
+          children: res.data.list,
+          orgType: 3,
+          id: '1740292343513055234',
+          pid: '0',
+          name: res.data.title
+        }]
+        if (code === 0) {
+          if (data.length === 0) {
+            this.loading = false
+            this.$message.error('暂无数据')
+            return
+          }
+
+          this.getDataPLevel(data)
+          this.hideChildrenData(data)
           this.loading = false
-          this.$message.error('暂无数据')
-          return
+        } else {
+          this.loading = false
+          this.$message.error(msg)
         }
-
-        this.getDataPLevel(data)
-        this.hideChildrenData(data)
-        this.loading = false
-      } else {
-        this.loading = false
-        this.$message.error(msg)
-      }
+      })
     },
 
     getTitleNameMapFun (i) {
-      const titleNameMap = new Map([
-        ['province', '省委'],
-        ['city', '市委'],
-        ['district', '区委'],
-        ['street', '镇党委'],
-        ['community', '新村党委'],
-        ['grid_manager', '自然村党组织'],
-        ['building_chief', '网格党小组'],
-        ['unit_chief', '党员中心户']
-      ])
-      return titleNameMap.get(i)
+      const titleNameMap = [
+        '镇党委',
+        '新村党委',
+        '自然村党组织',
+        '网格党小组',
+        '党员中心户'
+      ]
+      return titleNameMap[i]
     },
 
     zoomSize (e) {
@@ -486,7 +479,7 @@ export default {
 
     .flowLevel-4 {
       top: 474px;
-      line-height: 91px;
+      line-height: 110px;
 
       div {
         padding-left: 80px;
@@ -504,19 +497,22 @@ export default {
     }
 
     .flowLevel-5 {
-      top: 600px;
-      line-height: 110px;
+      top: 610px;
+      line-height: 120px;
+      height: 120px;
 
       div {
         padding-left: 80px;
 
         &::after {
           @include flowLevelAfter;
-          top: 24px;
+          top: 44px;
           left: 15px;
           width: 180px;
-          height: 60px;
+          height: 100px;
           background-image: url(~@/assets/images/icon/dyzxhT-red.png);
+          background-repeat: no-repeat;
+          background-position: center 12px;
           opacity: 0.6;
         }
       }
diff --git a/src/views/next/dialog-module/hsyf-right/ylqdModal.vue b/src/views/next/dialog-module/hsyf-right/ylqdModal.vue
index 32700d9..4e9978a 100644
--- a/src/views/next/dialog-module/hsyf-right/ylqdModal.vue
+++ b/src/views/next/dialog-module/hsyf-right/ylqdModal.vue
@@ -298,7 +298,10 @@ export default {
           &-title {
             display: flex;
             &-left {
-              width: 220px;
+              width: 210px;
+            overflow: hidden; /* 隐藏超出的内容 */
+            text-overflow: ellipsis; /* 显示省略号 */
+            white-space: nowrap;
             }
             &-arrow {
               transform: rotate(-90deg);
diff --git a/src/views/next/dialog-module/hsyf-right/ywqsModal.vue b/src/views/next/dialog-module/hsyf-right/ywqsModal.vue
index 75bfc13..d9f4885 100644
--- a/src/views/next/dialog-module/hsyf-right/ywqsModal.vue
+++ b/src/views/next/dialog-module/hsyf-right/ywqsModal.vue
@@ -40,9 +40,9 @@
                           line-height: 22px;
                         "
                       >
-                        {{ item.describe }}
+                        {{ item.introduce }}
                       </div>
-                      <div>{{ item.describe }}</div>
+                      <div>{{ item.introduce }}</div>
                     </el-tooltip>
                   </div>
                   <div class="content-item-wish">
diff --git a/src/views/next/screen-content-left/hsyf-left/index.vue b/src/views/next/screen-content-left/hsyf-left/index.vue
index 4b9a9fe..bd3c079 100644
--- a/src/views/next/screen-content-left/hsyf-left/index.vue
+++ b/src/views/next/screen-content-left/hsyf-left/index.vue
@@ -453,7 +453,7 @@ export default {
       this.$set(
         i,
         'c',
-        this.forArrayValue(['#00BABC', '#009FA4', '#00FFC0'], index)
+        this.forArrayValue(['rgba(255,255,255,0.2)', 'rgba(255,255,255,0.4)', 'rgba(255,255,255,0.6)'], index)
       )
     })
     this.getData()