人员类别分析

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

@@ -14,7 +14,8 @@
     display: flex;
     // justify-content: space-around;
     justify-content: flex-start;
-    flex-wrap: wrap;
+    flex-wrap: nowrap;
+    // overflow-y: auto;
     min-height: 190px;
 
     .top-item-active {
@@ -22,8 +23,9 @@
     }
 
     .top-item {
+      flex: 0 0 280px;
       box-sizing: border-box;
-      width: 280px;
+      // width: 280px;
       height: 190px;
       padding: 10px 22px 14px 21px;
       // background: rgba(255, 255, 255, 0);

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

@@ -23,6 +23,7 @@
                           type="date"
                           :clearable="false"
                           @change="handleChangeDate"
+                          :picker-options="pickerOptions"
                           prefix-icon="el-icon-caret-bottom"
                           placeholder="选择日期"
                           value-format="yyyy-MM-dd">
@@ -30,38 +31,40 @@
 
         </div>
       </div>
-      <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>
+      <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>
-          <div class="top-item-num">
-            <div class="num-item">
-              <div>较上月</div>
-              <div>
-                <div>{{ "+"+ item.immigration }}</div>
+            <div class="top-item-num">
+              <div class="num-item">
+                <div>较上月</div>
+                <div>
+                  <div>{{ "+"+ item.immigration }}</div>
 
+                </div>
               </div>
-            </div>
-            <div class="num-item">
-              <div>{{"  "}}</div>
-              <div>
-                <div>{{ "-"+ item.emigration}}</div>
+              <div class="num-item">
+                <div>{{"  "}}</div>
+                <div>
+                  <div>{{ "-"+ item.emigration}}</div>
+                </div>
               </div>
             </div>
           </div>
         </div>
-      </div>
+
+      </el-scrollbar>
+
       <div class="warning-box-bottom">
         <screen-table ref="ref_recordlist"></screen-table>
         <div class="pagination">
@@ -108,11 +111,15 @@ export default {
         checkStrictly: true
       },
 
+      pickerOptions: { //控制时间范围
+        disabledDate (time) {
+          return time.getTime() > (Date.now() - (24 * 60 * 60 * 1000))
+        }
+      },
       dateIdShow: '',
       agencyId: '',
       level: '',
       dateId: '',//yyyyMMdd
-      monthId: '',//yyyyMM
       categoryKey: '',
       agencyInfo: {},
 
@@ -141,10 +148,7 @@ export default {
     async getApiData () {
       //获取各类人数
       await this.getCategoryData()
-
-
-      this.$refs.ref_recordlist.getRecordlist(this.monthId, this.categoryKey, this.pageNo, this.pageSize)
-
+      this.loadRecordList()
     },
     initData () {
       var time = (new Date).getTime() - 24 * 60 * 60 * 1000;
@@ -188,13 +192,19 @@ export default {
       this.pageNo = 1;
       this.categoryKey = item.categoryKey
 
-      this.$refs.ref_recordlist.getRecordlist(this.monthId, this.categoryKey, this.pageNo, this.pageSize)
+      this.loadRecordList()
+
+    },
+
+    loadRecordList () {
+      this.$refs.ref_recordlist.getRecordlist(this.dateId, this.categoryKey, this.pageNo, this.pageSize, this.agencyId, this.level)
+
     },
 
     //获取各类人数
     async getCategoryData () {
-      // const url = "/data/aggregator/icuser/category-data";
-      const url = "http://yapi.elinkservice.cn/mock/245/data/aggregator/icuser/category-data";
+      const url = "/data/aggregator/icuser/category-data";
+      // const url = "http://yapi.elinkservice.cn/mock/245/data/aggregator/icuser/category-data";
       let params = {
         orgType: this.level,
         orgId: this.agencyId,
@@ -226,18 +236,18 @@ export default {
     pageSizeChangeHandleNew (val) {
       this.pageNo = 1;
       this.pageSize = val;
-      this.$refs.ref_recordlist.getRecordlist(this.monthId, this.categoryKey, this.pageNo, this.pageSize)
+      this.loadRecordList()
     },
     pageCurrentChangeHandleNew (val) {
       this.pageNo = val;
-      this.$refs.ref_recordlist.getRecordlist(this.monthId, this.categoryKey, this.pageNo, this.pageSize)
+      this.loadRecordList()
     },
   },
   watch: {
     dateIdShow () {
       let dataArray = this.dateIdShow.split('-')
       this.dateId = dataArray.join('')
-      this.monthId = this.dateId.substring(0, 6)
+
     },
 
   },

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

@@ -104,9 +104,9 @@ export default {
           label: '新增'
         },
       ],
-      typeShow: '类别',
+      typeShow: '全部',
       selType: '',
-      monthId: '',
+      dateId: '',
       categoryKey: '',
       pageNo: '',
       pageSize: '',
@@ -139,7 +139,18 @@ export default {
       const { data, code, msg } = await requestPost(url, params)
 
       if (code === 0) {
-        this.typeList = data
+        this.typeList = []
+        this.typeList.push(
+          {
+            label: '全部',
+            value: ''
+          }
+        )
+
+        data.forEach(element => {
+          this.typeList.push(element)
+        });
+
 
       } else {
         this.$message.error(msg)
@@ -149,23 +160,27 @@ export default {
     },
 
     //具体流动列表
-    async getRecordlist (monthId, categoryKey, pageNo, pageSize) {
+    async getRecordlist (dateId, categoryKey, pageNo, pageSize, orgId, orgType) {
       this.visibleLoading = true
-      if (monthId) {
-        this.monthId = monthId
+      if (dateId) {
+        this.dateId = dateId
         this.categoryKey = categoryKey
         this.pageNo = pageNo
         this.pageSize = pageSize
+        this.orgId = orgId
+        this.orgType = orgType
       }
       let tableData = [];
-      // const url = "/temp/record-list";
-      const url = "http://yapi.elinkservice.cn/mock/245/temp/record-list";
+      const url = "/epmetuser/icuserchangerecord/category-analysis-list";
+      // const url = "http://yapi.elinkservice.cn/mock/245/epmetuser/icuserchangerecord/category-analysis-list";
       let params = {
         categoryKey: this.categoryKey,
-        monthId: this.monthId,
+        dateId: this.dateId,
         type: this.selType,
         pageNo: this.pageNo,
         pageSize: this.pageSize,
+        orgId: this.orgId,
+        orgType: this.orgType
       };
       const { data, code, msg } = await requestPost(url, params);
       if (code === 0) {