From 56f35a339e7076dd88250985dc8fcd183eb8f592 Mon Sep 17 00:00:00 2001
From: PLUTO <>
Date: Wed, 11 Oct 2023 16:44:36 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A6=82=E8=A7=88=E5=8A=A8=E6=80=81=E6=9B=B4?=
 =?UTF-8?q?=E6=96=B0=E6=94=B9=E4=B8=BA=E5=9B=9B=E6=9D=A1=E5=B1=95=E7=A4=BA?=
 =?UTF-8?q?=EF=BC=8C=E9=A1=B5=E9=9D=A2=E9=97=B4=E8=B7=9D=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/DynamicHumanRoomData.vue       |  46 ++--
 .../overview/components/GridUpdateRanking.vue |  53 ++---
 src/views/dataBoard/overview/index.vue        | 214 ++++--------------
 3 files changed, 70 insertions(+), 243 deletions(-)

diff --git a/src/views/dataBoard/overview/components/DynamicHumanRoomData.vue b/src/views/dataBoard/overview/components/DynamicHumanRoomData.vue
index 7f391e7d2..44a232913 100644
--- a/src/views/dataBoard/overview/components/DynamicHumanRoomData.vue
+++ b/src/views/dataBoard/overview/components/DynamicHumanRoomData.vue
@@ -34,12 +34,8 @@
         </div>
       </div>
     </div>
-    <div v-else style="width: 100%; height: 100%; text-align: center;padding-top: 20px;">
-      <img
-        width="268px"
-        height="128px"
-        src="~@/assets/images/overview/zanwu.png"
-      />
+    <div v-else style="width: 100%; height: 100%; text-align: center; padding-top: 30px">
+      <img width="268px" height="128px" src="~@/assets/images/overview/zanwu.png" />
       <div class="zanwuText">近3日暂无更新</div>
     </div>
   </div>
@@ -74,30 +70,18 @@ export default {
   },
   methods: {
     getList(item) {
-      this.$http
-        .get(
-          "/actual/base/streetOverview/residentHouseUpdateRecord?level=" +
-            item.orgLevel +
-            "&orgId=" +
-            item.orgId
-        )
-        .then(({ data: { data } }) => {
-          this.list = data;
-          if (this.list.length > 4) {
-            this.$nextTick(() => {
-              const aniHeight =
-                this.$refs.animation2.querySelector(".tr").offsetHeight *
-                this.pmList.length;
-              this.$refs.animation2.style.animation = `move1 ${this.pmList.length}s linear infinite`;
-              document.styleSheets[0].insertRule(
-                `@keyframes move2{0% {transform: translateY(0px);}100% {transform: translateY(-${aniHeight}px);}`,
-                0
-              );
-            });
-          } else {
-            this.$refs.animation2.style.animation = null;
-          }
-        });
+      this.$http.get("/actual/base/streetOverview/residentHouseUpdateRecord?level=" + item.orgLevel + "&orgId=" + item.orgId).then(({ data: { data } }) => {
+        this.list = data;
+        if (this.list.length > 4) {
+          this.$nextTick(() => {
+            const aniHeight = this.$refs.animation2.querySelector(".tr").offsetHeight * this.pmList.length;
+            this.$refs.animation2.style.animation = `move1 ${this.pmList.length}s linear infinite`;
+            document.styleSheets[0].insertRule(`@keyframes move2{0% {transform: translateY(0px);}100% {transform: translateY(-${aniHeight}px);}`, 0);
+          });
+        } else {
+          this.$refs.animation2.style.animation = null;
+        }
+      });
     },
   },
 };
@@ -116,7 +100,7 @@ export default {
   color: #a3b9da;
 }
 .dhrd-list {
-  height: 140px;
+  height: 150px;
   overflow-y: auto;
   @include scrollBar .dhrd-item {
     display: flex;
diff --git a/src/views/dataBoard/overview/components/GridUpdateRanking.vue b/src/views/dataBoard/overview/components/GridUpdateRanking.vue
index e366d3240..3e37bef5f 100644
--- a/src/views/dataBoard/overview/components/GridUpdateRanking.vue
+++ b/src/views/dataBoard/overview/components/GridUpdateRanking.vue
@@ -22,9 +22,7 @@
           <!-- 无缝滚动 -->
           <div v-if="pmList.length > 3">
             <div class="tr" v-for="(item, index) in pmList" :key="index">
-              <div
-                :class="index - 0 + 1 < 4 ? `td tdbg${index - 0 + 1}` : 'td'"
-              >
+              <div :class="index - 0 + 1 < 4 ? `td tdbg${index - 0 + 1}` : 'td'">
                 {{ index - 0 + 1 }}
               </div>
               <div class="td">{{ item.orgName }}</div>
@@ -36,15 +34,8 @@
         </div>
       </div>
     </div>
-    <div
-      v-else
-      style="width: 100%; height: 100%; text-align: center; padding-top: 20px"
-    >
-      <img
-        width="268px"
-        height="128px"
-        src="~@/assets/images/overview/zanwu.png"
-      />
+    <div v-else style="width: 100%; height: 100%; text-align: center; padding-top: 15px">
+      <img width="268px" height="128px" src="~@/assets/images/overview/zanwu.png" />
       <div class="zanwuText">近3日暂无更新</div>
     </div>
   </div>
@@ -85,30 +76,18 @@ export default {
   },
   methods: {
     getList(item) {
-      this.$http
-        .get(
-          "/actual/base/streetOverview/residentHouseUpdateGroupByGrid?level=" +
-            item.orgLevel +
-            "&orgId=" +
-            item.orgId
-        )
-        .then(({ data: { data } }) => {
-          this.pmList = data;
-          if (this.pmList.length > 3) {
-            this.$nextTick(() => {
-              const aniHeight =
-                this.$refs.animation1.querySelector(".tr").offsetHeight *
-                this.pmList.length;
-              this.$refs.animation1.style.animation = `move1 ${this.pmList.length}s linear infinite`;
-              document.styleSheets[0].insertRule(
-                `@keyframes move1{0% {transform: translateY(0px);}100% {transform: translateY(-${aniHeight}px);}`,
-                0
-              );
-            });
-          } else {
-            this.$refs.animation1.style.animation = null;
-          }
-        });
+      this.$http.get("/actual/base/streetOverview/residentHouseUpdateGroupByGrid?level=" + item.orgLevel + "&orgId=" + item.orgId).then(({ data: { data } }) => {
+        this.pmList = data;
+        if (this.pmList.length > 3) {
+          this.$nextTick(() => {
+            const aniHeight = this.$refs.animation1.querySelector(".tr").offsetHeight * this.pmList.length;
+            this.$refs.animation1.style.animation = `move1 ${this.pmList.length}s linear infinite`;
+            document.styleSheets[0].insertRule(`@keyframes move1{0% {transform: translateY(0px);}100% {transform: translateY(-${aniHeight}px);}`, 0);
+          });
+        } else {
+          this.$refs.animation1.style.animation = null;
+        }
+      });
     },
   },
 };
@@ -118,7 +97,7 @@ export default {
 <style lang="scss" scoped>
 .m-sqrfph {
   padding-top: 0 !important;
-  height: 150px !important;
+  height: 205px !important;
 }
 .zanwuText {
   margin-top: -34px;
diff --git a/src/views/dataBoard/overview/index.vue b/src/views/dataBoard/overview/index.vue
index 9422e1ff6..75edfcd1f 100644
--- a/src/views/dataBoard/overview/index.vue
+++ b/src/views/dataBoard/overview/index.vue
@@ -8,67 +8,26 @@
     <div class="g-row">
       <div class="g-left">
         <div class="m-box">
-          <title-box
-            :text="`${
-              currentLevel === 'district'
-                ? '区'
-                : currentLevel === 'street'
-                ? '街道'
-                : currentLevel === 'community'
-                ? '社区'
-                : currentLevel === 'grid'
-                ? '网格'
-                : ''
-            }介绍`"
-          />
+          <title-box :text="`${currentLevel === 'district' ? '区' : currentLevel === 'street' ? '街道' : currentLevel === 'community' ? '社区' : currentLevel === 'grid' ? '网格' : ''}介绍`" />
           <jdjs :currentLevelData="currentLevelData" />
         </div>
 
         <div class="m-box">
-          <title-box
-            :text="`${
-              currentLevel === 'district'
-                ? '区'
-                : currentLevel === 'street'
-                ? '街道'
-                : currentLevel === 'community'
-                ? '社区'
-                : currentLevel === 'grid'
-                ? '网格'
-                : ''
-            }图谱画像`"
-          />
+          <title-box :text="`${currentLevel === 'district' ? '区' : currentLevel === 'street' ? '街道' : currentLevel === 'community' ? '社区' : currentLevel === 'grid' ? '网格' : ''}图谱画像`" />
           <jdtphx :currentLevelData="currentLevelData" :id="orgId" />
         </div>
       </div>
       <div class="g-center">
         <div class="m-map" style="overflow: hidden">
-          <map-top
-            :currentLevelData="currentLevelData"
-            @changeType="changeType"
-            :level="currentLevel"
-          />
+          <map-top :currentLevelData="currentLevelData" @changeType="changeType" :level="currentLevel" />
           <div v-if="breadList.length > 1" class="go-back" @click="goBackMap">
             <img src="~@/assets/images/shuju/overview/go-back.png" />
           </div>
-          <grid-map
-            ref="map"
-            @clickAgency="clickAgencyItem"
-            :srcGridData="orgData"
-            @clickDotBtn="handleClickDotBtn"
-            :level="currentLevel"
-            :peopleType="peopleType"
-          />
+          <grid-map ref="map" @clickAgency="clickAgencyItem" :srcGridData="orgData" @clickDotBtn="handleClickDotBtn" :level="currentLevel" :peopleType="peopleType" />
         </div>
         <div class="m-box m-rybox">
           <title-box :text="`${customerName}${peopleList[peopleType]}`" />
-          <jdwgy
-            :peopleType="peopleType"
-            :currentLevelData="currentLevelData"
-            :level="currentLevel"
-            @setNum="setNum"
-            @setPoint="setPoint"
-          />
+          <jdwgy :peopleType="peopleType" :currentLevelData="currentLevelData" :level="currentLevel" @setNum="setNum" @setPoint="setPoint" />
         </div>
       </div>
 
@@ -78,136 +37,57 @@
           <rfsjtj :currentLevelData="currentLevelData" />
         </div>
         <!-- 街道概览 -->
-        <div
-          v-if="currentLevel === 'street' || currentLevel === 'district'"
-          class="m-box"
-        >
+        <div v-if="currentLevel === 'street' || currentLevel === 'district'" class="m-box">
           <title-box text="各社区人房数据更新排行">
             <span class="date-span">
-              <el-date-picker
-                v-model="rfphDate"
-                format="yyyy-MM"
-                value-format="yyyy-MM"
-                @change="changeDate"
-                type="month"
-                :clearable="false"
-                placeholder="选择月"
-              >
-              </el-date-picker>
+              <el-date-picker v-model="rfphDate" format="yyyy-MM" value-format="yyyy-MM" @change="changeDate" type="month" :clearable="false" placeholder="选择月"> </el-date-picker>
             </span>
           </title-box>
           <sqrfph :currentLevelData="currentLevelData" :date="rfphDate" />
         </div>
-        <div
-          v-if="currentLevel === 'street' || currentLevel === 'district'"
-          class="m-box"
-        >
+        <div v-if="currentLevel === 'street' || currentLevel === 'district'" class="m-box">
           <title-box text="各社区12345投诉事件统计">
             <span class="date-span">
-              <el-date-picker
-                v-model="sq12345Date"
-                format="yyyy-MM"
-                value-format="yyyy-MM"
-                type="month"
-                :clearable="false"
-                placeholder="选择月"
-              />
+              <el-date-picker v-model="sq12345Date" format="yyyy-MM" value-format="yyyy-MM" type="month" :clearable="false" placeholder="选择月" />
             </span>
           </title-box>
           <sq12345 :currentLevelData="currentLevelData" :date="sq12345Date" />
         </div>
 
         <!-- 社区&网格-->
-        <div
-          v-if="currentLevel === 'community' || currentLevel === 'grid'"
-          class="m-box"
-        >
+        <div v-if="currentLevel === 'community' || currentLevel === 'grid'" class="m-box">
           <title-box text="人房数据动态更新" />
-          <Tabs
-            v-model="dynamicType"
-            :list="dynamicTypeList"
-            v-if="currentLevel === 'community'"
-            @changeVal="dynamicTypeChange"
-          />
-          <DynamicHumanRoomData
-            :currentLevelData="currentLevelData"
-            :currentLevel="currentLevel"
-            v-if="dynamicType === 1"
-          />
-          <GridUpdateRanking
-            :currentLevelData="currentLevelData"
-            :currentLevel="currentLevel"
-            v-if="dynamicType === 2"
-          />
+          <Tabs v-model="dynamicType" :list="dynamicTypeList" v-if="currentLevel === 'community'" @changeVal="dynamicTypeChange" />
+          <DynamicHumanRoomData :currentLevelData="currentLevelData" :currentLevel="currentLevel" v-if="dynamicType === 1" />
+          <GridUpdateRanking :currentLevelData="currentLevelData" :currentLevel="currentLevel" v-if="dynamicType === 2" />
         </div>
         <!-- 社区概览-->
         <div v-if="currentLevel === 'community'" class="m-box">
           <title-box text="社区满意度自查结果">
             <span class="date-span">
-              <el-date-picker
-                v-model="sqzcDate"
-                format="yyyy-MM"
-                value-format="yyyy-MM"
-                type="month"
-                :clearable="false"
-                placeholder="选择月"
-              />
+              <el-date-picker v-model="sqzcDate" format="yyyy-MM" value-format="yyyy-MM" type="month" :clearable="false" placeholder="选择月" />
             </span>
           </title-box>
-          <CommunityResult
-            :currentLevelData="currentLevelData"
-            :date="sqzcDate"
-          />
+          <CommunityResult :currentLevelData="currentLevelData" :date="sqzcDate" />
         </div>
         <div v-if="currentLevel === 'community'" class="m-box">
           <title-box text="事件&回访">
             <span class="date-span">
-              <el-date-picker
-                v-model="sjhfDate"
-                format="yyyy-MM"
-                value-format="yyyy-MM"
-                @change="changeDate"
-                type="month"
-                :clearable="false"
-                placeholder="选择月"
-              />
+              <el-date-picker v-model="sjhfDate" format="yyyy-MM" value-format="yyyy-MM" @change="changeDate" type="month" :clearable="false" placeholder="选择月" />
             </span>
           </title-box>
-          <Tabs
-            v-model="eventType"
-            :list="eventTypeList"
-            @changeVal="eventTypeChange"
-          />
-          <EventAndFollowUp
-            :currentLevelData="currentLevelData"
-            :date="sjhfDate"
-            v-if="eventType === 1"
-          />
-          <FollowUp
-            :currentLevelData="currentLevelData"
-            :date="sjhfDate"
-            v-if="eventType === 2"
-          />
+          <Tabs v-model="eventType" :list="eventTypeList" @changeVal="eventTypeChange" />
+          <EventAndFollowUp :currentLevelData="currentLevelData" :date="sjhfDate" v-if="eventType === 1" />
+          <FollowUp :currentLevelData="currentLevelData" :date="sjhfDate" v-if="eventType === 2" />
         </div>
         <!-- 网格 -->
         <div v-if="currentLevel === 'grid'" class="m-box">
           <title-box text="社区网格数据更新情况排行">
             <span class="date-span">
-              <el-date-picker
-                v-model="sqwggxDate"
-                format="yyyy-MM"
-                value-format="yyyy-MM"
-                @change="changeDate"
-                type="month"
-                :clearable="false"
-                placeholder="选择月"
-              />
+              <el-date-picker v-model="sqwggxDate" format="yyyy-MM" value-format="yyyy-MM" @change="changeDate" type="month" :clearable="false" placeholder="选择月" />
             </span>
           </title-box>
-          <RankingGridData
-            :currentLevelData="currentLevelData"
-            :date="sqwggxDate"
-          />
+          <RankingGridData :currentLevelData="currentLevelData" :date="sqwggxDate" />
         </div>
       </div>
     </div>
@@ -355,8 +235,7 @@ export default {
 
   methods: {
     changeCustomerName() {
-      this.customerName =
-        localStorage.getItem("customerNameDataBoard") || "数据分析可视化平台";
+      this.customerName = localStorage.getItem("customerNameDataBoard") || "数据分析可视化平台";
     },
     changeType(e) {
       this.peopleType = e;
@@ -402,8 +281,7 @@ export default {
       this.$refs.map.clearMarkert();
       if (item.id) {
         if (item.level == "grid") {
-          this.customerName =
-            item.parentName + "-" + item.name;
+          this.customerName = item.parentName + "-" + item.name;
         } else {
           this.customerName = item.name || item.meta.title;
         }
@@ -412,8 +290,7 @@ export default {
           orgLevel: item.level,
         };
       } else {
-        this.customerName =
-          localStorage.getItem("customerNameDataBoard") || "数据分析可视化平台";
+        this.customerName = localStorage.getItem("customerNameDataBoard") || "数据分析可视化平台";
         this.currentLevelData = {
           ...this.$store.state.chooseArea.chooseName,
           orgLevel: this.$store.state.chooseArea.chooseName.level,
@@ -449,10 +326,7 @@ export default {
       if (!item.longitude) {
         return this.$message.error("请先设置坐标");
       }
-      this.$refs.map.setDotMarker(item, [
-        parseFloat(item.longitude),
-        parseFloat(item.latitude),
-      ]);
+      this.$refs.map.setDotMarker(item, [parseFloat(item.longitude), parseFloat(item.latitude)]);
     },
     setNum(data) {
       // data
@@ -483,25 +357,19 @@ export default {
       // }
     },
     //获取地图上显示的组织数据
-    async getMapData(
-      orgId = this.$store.state.chooseArea.chooseName.orgId,
-      level = this.$store.state.chooseArea.chooseName.level
-    ) {
+    async getMapData(orgId = this.$store.state.chooseArea.chooseName.orgId, level = this.$store.state.chooseArea.chooseName.level) {
       const url = "org_map";
-      this.$http
-        .post(`/gov/org/agency/maporg`, { orgId, level })
-        .then(({ data: { data } }) => {
-          this.orgData = data;
-          this.orgId = this.orgData.id;
-          this.orgLevel = this.orgData.level;
-          this.currentLevel = this.orgData.agencyLevel;
-          this.currentLevelData = {
-            orgId: this.orgId,
-            orgLevel: this.currentLevel,
-          };
-          this.peopleType =
-            this.currentLevel === "grid" ? "unit" : "staffAgency";
-        });
+      this.$http.post(`/gov/org/agency/maporg`, { orgId, level }).then(({ data: { data } }) => {
+        this.orgData = data;
+        this.orgId = this.orgData.id;
+        this.orgLevel = this.orgData.level;
+        this.currentLevel = this.orgData.agencyLevel;
+        this.currentLevelData = {
+          orgId: this.orgId,
+          orgLevel: this.currentLevel,
+        };
+        this.peopleType = this.currentLevel === "grid" ? "unit" : "staffAgency";
+      });
     },
 
     //获取地图上显示的组织数据
@@ -595,14 +463,10 @@ export default {
   background: #000;
 }
 </style>
-<style
-  lang="scss"
-  src="@/assets/scss/dataBoard/overview/index.scss"
-  scoped
-></style>
+<style lang="scss" src="@/assets/scss/dataBoard/overview/index.scss" scoped></style>
 
 <style lang="scss" scoped>
 .tabs {
-  padding: 16px;
+  padding: 10px 11px 0px;
 }
 </style>