小区简介居住人同步

src/store/getters.js

@@ -31,5 +31,6 @@ const getters = {
   panel: (state) => state.xiaoqu.panel,
   houseItem: (state) => state.xiaoqu.houseItem,
   refreshBuild: (state) => state.xiaoqu.refreshBuild,
+  personNum: (state) => state.xiaoqu.personNum,
 };
 export default getters;

src/store/modules/xiaoqu.js

@@ -12,8 +12,15 @@ const xiaoqu = {
     panel: {},
     houseItem: {},
     refreshBuild: 1,
+    personNum: {
+      zz: 0,
+      cz: 0,
+    },
   },
   mutations: {
+    SET_PERSON_NUM: (state, data) => {
+      state.personNum = data;
+    },
     SET_REFRESH: (state, refresh) => {
       state.refreshBuild = refresh;
     },
@@ -82,6 +89,10 @@ const xiaoqu = {
       };
       state.houseItem = {};
       state.refreshBuild = 1;
+      state.personNum = {
+        zz: 0,
+        cz: 0,
+      };
     },
   },
   actions: {

src/views/components/xiaoqu/leftData/xiaoquInfo.vue

@@ -67,8 +67,10 @@
           <div class="row-item-data">
             <div class="row-item-name">小区总人口</div>
             <div class="row-item-value">
-              <span class="unit-num" style="color: #00ffe4">1.8</span>
+              <span class="unit-num" style="color: #00ffe4">{{
-              <span class="unit-text" style="color: #fff"> 万人</span>
+                personNum.zz + personNum.cz
+              }}</span>
+              <span class="unit-text" style="color: #fff"> 人</span>
             </div>
           </div>
         </div>
@@ -81,8 +83,10 @@
           <div class="row-item-data">
             <div class="row-item-name">暂住人口</div>
             <div class="row-item-value">
-              <span class="unit-num" style="color: #00ffe4">1.2</span>
+              <span class="unit-num" style="color: #00ffe4">{{
-              <span class="unit-text" style="color: #fff"> 万人</span>
+                personNum.zz
+              }}</span>
+              <span class="unit-text" style="color: #fff"> 人</span>
             </div>
           </div>
         </div>
@@ -95,8 +99,10 @@
           <div class="row-item-data">
             <div class="row-item-name">常住人口</div>
             <div class="row-item-value">
-              <span class="unit-num" style="color: #00ffe4">0.6</span>
+              <span class="unit-num" style="color: #00ffe4">{{
-              <span class="unit-text" style="color: #fff"> 万人</span>
+                personNum.cz
+              }}</span>
+              <span class="unit-text" style="color: #fff"> 人</span>
             </div>
           </div>
         </div>
@@ -137,7 +143,7 @@ export default {
     introduceTitle,
   },
   computed: {
-    ...mapGetters(["queryParamsXiaoqu", "xiaoquIntroduce"]),
+    ...mapGetters(["queryParamsXiaoqu", "xiaoquIntroduce", "personNum"]),
   },
   filters: {
     filterData(target) {
@@ -224,6 +230,9 @@ export default {
         font-weight: 500;
         color: #ffffff;
       }
+      .row-item-value {
+        text-align: center;
+      }
 
       .describe-icon {
         margin-left: 8px;

src/views/components/xiaoqu/rightData/colorList.vue

@@ -58,8 +58,12 @@ export default {
   methods: {
     async getColor() {
       let res = await getColorList(this.queryParamsXiaoqu);
-
       this.colorListL = this.resetColor(res.data);
+
+      this.$store.commit("SET_PERSON_NUM", {
+        cz: this.colorListL[8].person,
+        zz: this.colorListL[9].person,
+      });
     },
     resetColor(colorList) {
       const nameOrder = [