111

src/assets/scss/modules/visual/basicInfoMain.scss

@@ -1,3 +1,6 @@
+@import "../../c/config";
+@import "../../c/function";
+@import "./c/common";
 .div_top {
   margin-left: 10px;
   height: 35px;
@@ -296,6 +299,15 @@
         top: 13px;
         left: 18px;
       }
+      .icon_roomstate {
+        position: absolute;
+        top: 16px;
+        right: 16px;
+        font-size: 14px;
+        font-family: PingFang SC;
+        font-weight: 500;
+        color: #ffffff;
+      }
 
       .icon_category {
         position: absolute;
@@ -312,9 +324,9 @@
             height: 20px;
           }
           .icon_name{
-           text-align: center;
+           
-            margin:5px;
+            display: flex;
-            font-size: 16px;
+            justify-content: center;
           }
         }
        
@@ -365,11 +377,12 @@
   box-shadow: 0 0 10px inset #1a5afd;
 
   .user_item {
-    padding: 13px 8px 0 14px;
+    padding: 9px 8px 0 12px;
-    font-size: 16px;
+    font-size: 14px;
     font-family: PingFang SC;
     font-weight: 400;
     color: #ffffff;
+    line-height: 10px;
 
     .user_item_content {
       display: flex;
@@ -498,3 +511,74 @@
     cursor: pointer;
   }
 }
+
+.m-room-pop {
+  @include shield;
+  background-color: rgba(#000, 0.9);
+  overflow-y: auto;
+
+  .wrap {
+    position: relative;
+    margin: 120px auto;
+    width: 680px;
+
+    .title {
+      padding: 10px;
+      font-size: 22px;
+      font-family: PingFang SC;
+      font-weight: 800;
+      color: #ffffff;
+      display: flex;
+      align-items: center;
+
+      img {
+        display: block;
+        margin-right: 5px;
+      }
+      span {
+        display: block;
+      }
+    }
+
+    .btn-close {
+      position: absolute;
+      top: -15px;
+      right: -15px;
+      cursor: pointer;
+    }
+
+    .list {
+      // display: flex;
+      // flex-wrap: wrap;
+      padding: 5px 60px 5px 30px;
+
+      .item {
+        position: relative;
+        box-sizing: border-box;
+        padding: 0 15px;
+        width: 100%;
+        color: #fff;
+        font-size: 18px;
+        font-family: PingFang SC;
+        font-weight: 400;
+        color: #ffffff;
+        line-height: 24px;
+        margin: 15px 0;
+
+        &::before {
+          position: absolute;
+          left: 0;
+          top: 9px;
+          content: "";
+          display: block;
+          width: 7px;
+          height: 7px;
+          background: #0c81fe;
+          border-radius: 3px;
+        }
+      }
+    }
+
+
+  }
+}

src/assets/scss/modules/visual/personCategory.scss

@@ -8,7 +8,14 @@
   color: #fff;
   // background: url("../../../img/modules/visual/warning-box.png") no-repeat center;
   background-size: 100% 100%;
-  padding: 45px 21px 35px 24px;
+  padding: 15px 21px 15px 24px;
+
+
+
+    /deep/ .el-scrollbar__wrap {
+      margin-right:-17px !important
+    }
+
 
   &-top {
     display: flex;
@@ -152,7 +159,7 @@
   &-bottom {
     box-sizing: border-box;
     width: 100%;
-    height: calc(100% - 300px);
+    height: calc(100vh - 535px);
     min-height: 300px;
     margin-top: 60px;
   }

src/views/modules/visual/basicinfo/basicInfoCommunity.vue

@@ -43,18 +43,21 @@
               <img :src="item.partyUrl"
                    alt />
             </div>
+
+            <div class="icon_roomstate">
+              <div>出租</div>
+            </div>
+
             <div class="icon_category">
 
               <div class="div_icon_item"
                    v-for="(iconItem,iconIndex) in item.iconArrayShow"
                    :key="iconIndex">
-                <el-popover trigger="click"
+                <el-popover trigger="hover"
                             popper-class="icon_popover"
-                            width="10"
                             placement="bottom">
                   <div class="icon_name">{{iconItem.name}} </div>
                   <div slot="reference">
-
                     <img class="icon_img"
                          :src="iconItem.iconUrl"
                          alt />
@@ -99,33 +102,6 @@
               </div>
 
             </el-popover>
-
-            <!-- <div @click.stop="handleShowAllUser(index)"
-                 class="div_user">
-
-              <span>全部成员</span>
-              <img src="../../../../assets/img/xiala.png"
-                   alt />
-
-              <div class="user_list"
-                   v-show="item.showAllUser&&userArray.length>0">
-                <div v-for="(userItem,userIndex) in userArray"
-                     :key="userIndex"
-                     class="user_item"
-                     @click.stop="handleClickUser(userItem.userId)">
-                  <div class="user_item_content">
-                    <div class="name">{{userItem.name}}</div>
-
-                    <img src="../../../../assets/img/jinru.png"
-                         alt />
-
-                  </div>
-                  <div :class="['item_line',{'last_line':userIndex==(userArray.length-1)}]"></div>
-                </div>
-
-              </div>
-            </div> -->
-
           </div>
 
         </div>
@@ -137,6 +113,11 @@
              class="no-data-img" />
       </div>
     </div>
+
+    <room-info v-show="showHouseInfo"
+               v-if="selHouseId"
+               :selHouseId="selHouseId"
+               @close="showHouseInfo = false" />
   </div>
 
 </template>
@@ -147,6 +128,7 @@ import { Loading } from 'element-ui'; //引入Loading服务
 import { requestPost } from "@/js/dai/request";
 import ScreenLoading from "@/views/modules/visual/cpts/loading";
 import nextTick from "dai-js/tools/nextTick";
+import roomInfo from "@/views/modules/visual/basicinfo/cpts/roomInfo";
 
 let loading;//加载动画
 
@@ -166,6 +148,7 @@ export default {
       selHouseId: '',
       selHouseName: '',
       selHouseIndex: 0,
+      showHouseInfo: false,
 
       userArray: [],
       selUserName: '',
@@ -179,6 +162,9 @@ export default {
       runNum: 0,
       runAgencyArray: [],
 
+
+
+
     }
   },
   async mounted () {
@@ -219,6 +205,8 @@ export default {
       this.selHouseId = this.roomArray[index].houseId
       this.selHouseName = this.roomArray[index].houseName
 
+      this.showHouseInfo = true
+
       // this.$emit('refreshInfoList', this.selHouseId, 'room')-
     },
     //点击全部成员
@@ -235,7 +223,7 @@ export default {
 
       });
 
-      await nextTick(100);
+      await nextTick(50);
 
       if ((selIndex === 0 || selIndex) && !this.roomArray[selIndex].showAllUser) {
 
@@ -443,7 +431,7 @@ export default {
     ...mapGetters(["clientHeight"])
 
   },
-  components: { ScreenLoading },
+  components: { ScreenLoading, roomInfo },
 }
 
 </script>
@@ -556,13 +544,14 @@ export default {
 <style lang="scss" >
 .el-popover.my_popover {
   padding: 0px;
-  margin-top: 10px;
+  margin-top: 14px;
   border: 0;
 }
 .el-popover.icon_popover {
-  min-width: 80px !important;
+  font-size: 14px;
+  min-width: 50px !important;
   margin-top: 5px !important;
-  padding: 6px !important;
+  padding: 3px !important;
   background-color: rgb(247, 250, 253);
 }
 </style>

src/views/modules/visual/basicinfo/cpts/roomInfo.vue

@@ -0,0 +1,175 @@
+<template>
+  <div class="m-room-pop">
+    <div class="wrap">
+      <cpt-card>
+        <div class="title">
+          <img src="@/assets/img/shuju/title-tip.png" />
+          <span>房屋信息</span>
+        </div>
+
+        <div class="btn-close"
+             @click="handleClose">
+          <img src="@/assets/img/shuju/people/close.png" />
+        </div>
+
+        <div class="list">
+
+          <div class="item">
+            <span class="item-field">所属小区：</span>
+            <span>{{ formData.neighborHoodName }}</span>
+          </div>
+        </div>
+        <div class="list">
+          <div class="item">
+            <span class="item-field">所属楼栋：</span>
+            <span>{{  formData.buildingName }}</span>
+          </div>
+
+        </div>
+        <div class="list">
+          <div class="item">
+            <span class="item-field">房屋名称：</span>
+            <span>{{ formData. houseName }}</span>
+          </div>
+        </div>
+        <div class="list">
+          <div class="item">
+            <span class="item-field">房屋类型：</span>
+            <span>{{ formData.neighborHoodName }}</span>
+          </div>
+
+        </div>
+        <div class="list">
+
+          <div class="item">
+            <span class="item-field">房屋状态：</span>
+            <span>{{ formData. houseName }}</span>
+          </div>
+
+        </div>
+        <div class="list">
+
+          <div class="item">
+            <span class="item-field">房主姓名：</span>
+            <span>{{ formData.neighborHoodName }}</span>
+          </div>
+        </div>
+        <div class="list">
+          <div class="item">
+            <span class="item-field">房主电话：</span>
+            <span>{{  formData.buildingName }}</span>
+          </div>
+        </div>
+        <div class="list">
+          <div class="item">
+            <span class="item-field">房主身份证：</span>
+            <span>{{ formData. houseName }}</span>
+          </div>
+
+        </div>
+
+      </cpt-card>
+    </div>
+  </div>
+</template>
+
+<script>
+import cptCard from "@/views/modules/visual/cpts/card";
+import { requestPost } from "@/js/dai/request";
+import cptTb from "@/views/modules/visual/cpts/tb";
+
+export default {
+  name: "peopleMore",
+  props: {
+    selHouseId: {
+      type: String,
+      default: "",
+    },
+    gridName: {
+      type: String,
+      default: "",
+    },
+  },
+
+  components: {
+    cptCard, cptTb
+  },
+
+  data () {
+    return {
+      formData: {
+        gridId: '',
+        agencyId: '',//当前网格所属组织Id	
+        userId: '',//居民端小程序的用户id、数字社区的icResiUserId、其他情况无值	
+        userType: 'icresi',//居民端小程序的人：resi;数字社区的居民：icresi;导入的：import;同步的：synchro	
+        name: '',
+        idCard: '',
+        mobile: '',
+        heSuanCheck: false,
+        presentAddress: '',
+        presentAddressCode: '',
+        detailAddress: '',
+        sourceAddressCode: '',
+        presentAddressPathCode: '',
+        sourceAddress: '',
+        sourceAddressPathCode: '',
+        arriveDate: '',
+        remark: '',
+        leaveDate: '',
+        userType: 'input',
+        content: '',
+        channel: []
+
+      },
+    };
+  },
+
+  computed: {
+
+  },
+
+  watch: {
+    selHouseId () {
+      this.getApiData();
+    },
+  },
+
+  mounted () {
+    this.getApiData();
+  },
+
+  methods: {
+
+    handleClose () {
+      this.$emit("close");
+    },
+
+    async getApiData () {
+
+      this.loadHouseInfo()
+
+    },
+
+    async loadHouseInfo () {
+
+      const url = "/gov/org/house/gethouseinfo/" + this.selHouseId
+
+      const { data, code, msg } = await requestPost(url)
+
+      if (code === 0) {
+        this.formData = data
+
+
+      } else {
+        this.$message.error(msg)
+      }
+
+    },
+  },
+};
+</script>
+<style
+  lang="scss"
+  src="@/assets/scss/modules/visual/basicInfoMain.scss"
+  scoped
+></style>

src/views/modules/visual/basicinfo/peopleSearch.vue

@@ -124,9 +124,8 @@ export default {
       total: 0,
       orgLevel: 'search',
       selUserId: '',
-      //下钻层级记录
+
-      runNum: 0,
+
-      runAgencyArray: [],
     };
   },
   activated () {

src/views/modules/visual/basicinfo/personCategory/index.vue

@@ -1,106 +1,106 @@
 <template>
-  <div @click="hiddenTypeList()"
+  <div>
-       class="warning-box">
+    <!-- 组织路由 -->
-    <cpt-card>
+    <div class="div_top">
-      <div class="title">
+      <div class="router_line"></div>
-        <img src="@/assets/img/shuju/title-tip.png" />
+      <div class="div_router">
-        <span>人员类别分析</span>
+        <div v-if="orgLevel==='search'">
-
+          <span class="router_child">人员类别</span>
-        <div class="second-select cascader">
-
-          <el-cascader class="customer_cascader"
-                       ref="myCascader"
-                       v-model="agencyIdArray"
-                       :key="iscascaderShow"
-                       :options="casOptions"
-                       :props="optionProps"
-                       :show-all-levels="false"
-                       @change="handleChangeAgency"></el-cascader>
         </div>
-        <div class="second-select ">
+        <div v-if="orgLevel==='people'"> <span class="router_parents"
-
+                @click="handleClickBack">人员类别<span class="arrow">></span></span>
-          <el-date-picker v-model="dateIdShow"
-                          type="date"
-                          :clearable="false"
-                          @change="handleChangeDate"
-                          :picker-options="pickerOptions"
-                          prefix-icon="el-icon-caret-bottom"
-                          placeholder="选择日期"
-                          value-format="yyyy-MM-dd">
-          </el-date-picker>
 
+          <span class="router_child">个人档案</span>
         </div>
       </div>
-      <el-scrollbar style="width: 100%">
+    </div>
-        <div class="warning-box-top">
+    <div v-if="orgLevel!=='people'"
-          <div class="top-item"
+         @click="hiddenTypeList()"
-               :class="{'top-item-active': activeIndex == index}"
+         class="warning-box">
-               @click="onClickList(item,index)"
+      <cpt-card>
-               v-for="(item, index) in categoryList"
+        <div class="title">
-               :key="index">
+          <img src="@/assets/img/shuju/title-tip.png" />
-            <div class="top-item-img">
+          <span>人员类别分析</span>
-              <img :src="item.dataIcon" />
+
-              <div class="top-item-left">
+          <div class="second-select cascader">
-                <span>{{ item.categoryName }}</span>
+
-                <span>{{ item.total }}</span>
+            <el-cascader class="customer_cascader"
-              </div>
+                         ref="myCascader"
-            </div>
+                         v-model="agencyIdArray"
-            <div class="top-item-num">
+                         :key="iscascaderShow"
-              <div class="item_left">较上月</div>
+                         :options="casOptions"
-              <div class="item_right">
+                         :props="optionProps"
-                <div class="item_right_row">
+                         :show-all-levels="false"
-                  <div class="item_right_title">增加</div>
+                         @change="handleChangeAgency"></el-cascader>
-                  <div>
+          </div>
-                    <span v-if=" item.immigration!==0">{{ "+" }}</span>
+          <div class="second-select ">
-                    <span>{{  item.immigration }}</span>
+
-                  </div>
+            <el-date-picker v-model="dateIdShow"
+                            type="date"
+                            :clearable="false"
+                            @change="handleChangeDate"
+                            :picker-options="pickerOptions"
+                            prefix-icon="el-icon-caret-bottom"
+                            placeholder="选择日期"
+                            value-format="yyyy-MM-dd">
+            </el-date-picker>
 
+          </div>
+        </div>
+        <el-scrollbar style="width: 100%">
+          <div class="warning-box-top">
+            <div class="top-item"
+                 :class="{'top-item-active': activeIndex == index}"
+                 @click="onClickList(item,index)"
+                 v-for="(item, index) in categoryList"
+                 :key="index">
+              <div class="top-item-img">
+                <img :src="item.dataIcon" />
+                <div class="top-item-left">
+                  <span>{{ item.categoryName }}</span>
+                  <span>{{ item.total }}</span>
                 </div>
+              </div>
+              <div class="top-item-num">
+                <div class="item_left">较上月</div>
+                <div class="item_right">
+                  <div class="item_right_row">
+                    <div class="item_right_title">增加</div>
+                    <div>
+                      <span v-if=" item.immigration!==0">{{ "+" }}</span>
+                      <span>{{  item.immigration }}</span>
+                    </div>
 
-                <div class="item_right_row row2">
-                  <div class="item_right_title">减少</div>
-                  <div>
-                    <span v-if=" item.emigration!==0">{{ "-" }}</span>
-                    <span>{{  item.emigration }}</span>
                   </div>
 
-                </div>
+                  <div class="item_right_row row2">
+                    <div class="item_right_title">减少</div>
+                    <div>
+                      <span v-if=" item.emigration!==0">{{ "-" }}</span>
+                      <span>{{  item.emigration }}</span>
+                    </div>
 
-              </div>
-              <!-- <div class="num-item">
-                <div>较上月</div>
-
-                <div>
-                  <div>
-                    <span>新人员增加</span>
-                    <span v-if=" item.immigration!==0">{{ "+" }}</span>
-                    <span>{{  item.immigration }}</span>
                   </div>
 
                 </div>
-              </div> -->
+
-              <!-- <div class="num-item">
+              </div>
-                <div>{{"  "}}</div>
-
-                <div>
-                  <div>
-                    <span>原人员减少</span>
-                    <span v-if=" item.emigration!==0">{{ "-" }}</span>
-                    <span>{{  item.emigration }}</span>
-                  </div>
-                </div>
-              </div> -->
             </div>
           </div>
-        </div>
 
-      </el-scrollbar>
+        </el-scrollbar>
 
-      <div class="warning-box-bottom">
+        <div class="warning-box-bottom">
-        <screen-table ref="ref_recordlist"></screen-table>
+          <screen-table ref="ref_recordlist"
+                        @toSubAgency="toSubAgency"></screen-table>
 
-      </div>
+        </div>
-    </cpt-card>
+      </cpt-card>
+    </div>
+
+    <people v-if="orgLevel==='people'"
+            :uid="selUserId"
+            ref="ref_people"></people>
   </div>
 </template>
 
@@ -109,12 +109,17 @@ import { requestPost } from "@/js/dai/request";
 import screenTable from "./recordList";
 import cptCard from "@/views/modules/visual/cpts/card";
 import nextTick from "dai-js/tools/nextTick";
+import People from "../people";
 
 export default {
 
   components: {
     cptCard,
     screenTable,
+    People,
+
+
+
   },
   data () {
     return {
@@ -146,10 +151,11 @@ export default {
       agencyInfo: {},
 
       categoryList: [],
-
-
       activeIndex: 0,
 
+      orgLevel: 'search',
+      selUserId: '',
+
     };
   },
   async mounted () {
@@ -160,6 +166,7 @@ export default {
 
 
   },
+
   methods: {
     hiddenTypeList () {
 
@@ -256,6 +263,20 @@ export default {
 
     },
 
+
+    //下钻到下一级 type点击的类型:polygon 点击多边形（分为点击组织/小区）    people 点击详情
+    async toSubAgency (userId) {
+
+      this.selUserId = userId
+      this.orgLevel = 'people'
+    },
+
+    //返回所选组织
+    handleClickBack () {
+      this.orgLevel = 'search'
+
+    },
+
   },
   watch: {
     dateIdShow () {
@@ -267,6 +288,12 @@ export default {
   },
 };
 </script>
+
+<style
+  lang="scss"
+  src="@/assets/scss/modules/visual/basicInfoMain.scss"
+  scoped
+></style>
 <style
   lang="scss"
   src="@/assets/scss/modules/visual/typeAnalyze.scss"
@@ -277,3 +304,4 @@ export default {
   src="@/assets/scss/modules/visual/personCategory.scss"
   scoped
 ></style>
+

src/views/modules/visual/basicinfo/personCategory/recordList.vue

@@ -1,4 +1,5 @@
 <template>
+
   <div class="warning-table">
     <div class="table">
       <div class="table-header">
@@ -50,15 +51,16 @@
         <div class="table-body-tr"
              v-for="(value, index) in tableData"
              :key="index">
-          <div class="td"
+          <div :class="['td',indexs===1?'tr-underline':'']"
                v-for="(item, indexs) in value"
                :style="{width:widthList[indexs]}"
-               :key="indexs">
+               :key="indexs"
+               @click="handelToPeople(indexs,index)">
             <span>{{ item }}</span>
 
           </div>
         </div>
-        <screen-loading v-if="visibleLoading">加载中</screen-loading>
+        <!-- <screen-loading v-if="visibleLoading">加载中</screen-loading> -->
         <div class="no-data"
              v-if="tableData.length == 0 && !visibleLoading">
           <img src="@/assets/img/modules/visual/noData.png"
@@ -68,7 +70,7 @@
         </div>
       </div>
     </div>
-    <div class="pagination">
+    <div class="pagination-record">
       <el-pagination :current-page="pageNo"
                      :page-size="pageSize"
                      background
@@ -79,6 +81,7 @@
       </el-pagination>
     </div>
   </div>
+
 </template>
 
 <script>
@@ -96,6 +99,7 @@ export default {
   data () {
     return {
       visibleLoading: false,
+      tableAllData: [],
       tableData: [],
       showTypeSelect: false,
       widthList: ['5%', '10%', '15%', '10%', '20%', '30%'],
@@ -106,8 +110,9 @@ export default {
       dateId: '',
       categoryKey: '',
       pageNo: 1,
-      pageSize: 10,
+      pageSize: 7,
-      total: 0
+      total: 0,
+
     };
   },
   watch: {
@@ -118,9 +123,22 @@ export default {
     this.loadTypeList()
   },
 
+
   created () { },
 
   methods: {
+
+    //点击查看
+    handelToPeople (titleIndex, index) {
+      if (titleIndex === 1) {
+        // console.log(this.tableData)
+        console.log(this.tableAllData[index])
+        this.$emit('toSubAgency', this.tableAllData[index].icUserId)
+
+      }
+
+    },
+
     hiddenTypeList () {
 
       this.showTypeSelect = false
@@ -181,6 +199,7 @@ export default {
       };
       const { data, code, msg } = await requestPost(url, params);
       if (code === 0) {
+        this.tableAllData = data.list
         data.list.forEach((item, index) => {
           tableData.push([
             index + 1,
@@ -230,10 +249,11 @@ export default {
   width: 100%;
   height: 100%;
   .table {
-    width: 100%;
+    position: relative;
+    width: 99%;
     height: 100%;
     &-header {
-      width: 100%;
+      width: 99%;
       height: 50px;
       display: flex;
       justify-content: space-around;
@@ -247,6 +267,7 @@ export default {
         text-align: center;
         width: calc(100% / 5);
       }
+
       &-select {
         position: relative;
 
@@ -328,6 +349,15 @@ export default {
             }
           }
         }
+        .tr-underline {
+          font-size: 18px;
+          font-weight: 400;
+          color: rgba(197, 210, 255, 0.85);
+          text-decoration: underline;
+        }
+        .tr-underline:hover {
+          cursor: pointer;
+        }
       }
 
       &-tr:nth-child(2n) {
@@ -339,6 +369,7 @@ export default {
           no-repeat center;
         background-size: 100% 100%;
       }
+
       // 暂无数据
       .no-data {
         width: 100%;
@@ -353,10 +384,13 @@ export default {
       }
     }
   }
-  .pagination {
+  .pagination-record {
+    position: absolute;
     box-sizing: border-box;
-    margin-top: 20px;
+    right: 20px;
-    width: 100%;
+    bottom: 10px;
+    // margin-top: 20px;
+    // width: 100%;
     height: 40px;
     display: flex;
     justify-content: flex-end;
@@ -431,3 +465,5 @@ export default {
   }
 }
 </style>
+
+