Explorar el Código

社区、出入记录数据统计卡片

slowslo hace 4 años
padre
commit
bc36876ba2

+ 8 - 0
src/api/estate/accessrecord.js

@@ -48,3 +48,11 @@ export const update = (row) => {
   })
 }
 
+export const getAccessCount = (row) => {
+  return request({
+    url:'/api/cyzh-estate/accessrecord/getAccessCount',
+    method: 'get',
+  })
+}
+
+

+ 80 - 1
src/views/community/agency.vue

@@ -1,5 +1,43 @@
 <template>
   <basic-container>
+<!--    卡片-->
+<!--    <el-container>-->
+<!--      <el-main>-->
+<!--        <template>-->
+<!--          <el-carousel :interval="5000" height="200px">-->
+<!--            <el-carousel-item>-->
+<!--              <el-container>-->
+<!--                <el-header style="background-color: rgb(29,67,58);height: 65px">-->
+<!--                  <div class="titleLabel">-->
+<!--                    <el-row :gutter="40">-->
+<!--                      <div>-->
+<!--                        <el-col :span="20"><div class="titleText">{{communityCount.agencyCount}}</div></el-col>-->
+<!--                        <el-col :span="4"><div class="titleCount">{{communityCount.buildingCount}}</div></el-col>-->
+<!--                      </div>-->
+<!--                    </el-row>-->
+<!--                  </div>-->
+<!--                </el-header>-->
+<!--                <el-main>-->
+<!--                  <div style="margin-left: 100px">-->
+<!--                    <avue-data-display :option="dataShow(item)"></avue-data-display>-->
+<!--                  </div>-->
+<!--                </el-main>-->
+<!--              </el-container>-->
+<!--            </el-carousel-item>-->
+<!--          </el-carousel>-->
+<!--        </template>-->
+<!--      </el-main>-->
+<!--    </el-container>-->
+
+<!--卡片数据展示-->
+    <el-card style="background: #f5f5f5;margin-bottom: 20px">
+        <el-tabs type="border-card">
+          <el-tab-pane label="社区数据统计">
+            <div><avue-data-box :option="communityStatistics"></avue-data-box></div>
+          </el-tab-pane>
+        </el-tabs>
+    </el-card>
+
     <avue-crud :option="option" :table-loading="loading" :data="data" :page="page" :permission="permissionList"
                :before-open="beforeOpen" v-model="form" ref="crud" @row-update="rowUpdate" @row-save="rowSave" @row-del="rowDel"
                @search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange" @current-change="currentChange"
@@ -33,6 +71,7 @@ import {
   update,
   remove
 } from "@/api/community/agency.js";
+import {getCommunityList} from "../../api/grid/index";
 import {
   mapGetters
 } from "vuex";
@@ -46,6 +85,7 @@ export default {
   components: {CyExcelImport,editPolygonMap},
   data() {
     return {
+      communityCount:{},
       mapVisible:false,
       areaData: [],
       form: {},
@@ -56,10 +96,41 @@ export default {
         currentPage: 1,
         total: 0
       },
+      //数据展示
+      communityStatistics:{
+        span:6,
+        data: [
+          {
+            title: '社区数量',
+            count: 0,
+            icon: 'el-icon-s-home',
+            color: 'rgb(49, 180, 141)',
+          },
+          {
+            title: '小区数量',
+            count: 0,
+            icon: 'el-icon-s-home',
+            color: 'rgb(56, 161, 242)',
+          },
+          {
+            title: '楼宇数量',
+            count: 0,
+            icon: 'el-icon-s-home',
+            color: 'rgb(117, 56, 199)',
+          },
+          {
+            title: '住户数量',
+            count: 0,
+            icon: 'el-icon-user-solid',
+            color: 'rgb(143,119,0)',
+          },
+        ]
+      },
+
       selectionList: [],
       option: {
         height: 'auto',
-        calcHeight: 60,
+        // calcHeight: 60,
         tip: false,
         searchShow: true,
         searchMenuSpan: 6,
@@ -450,6 +521,14 @@ export default {
       this.onLoad(this.page, this.query);
     },
     onLoad(page, params = {}) {
+      getCommunityList('/640000').then(res=>{
+        this.communityCount = res.data.data;
+        console.log(this.communityCount,"打印communityCount");
+        this.communityStatistics.data[0].count = this.communityCount.agencyCount;
+        this.communityStatistics.data[1].count = this.communityCount.residentialCount;
+        this.communityStatistics.data[2].count = this.communityCount.buildingCount;
+        this.communityStatistics.data[3].count = this.communityCount.userCount;
+      });
       this.loading = true;
       getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
         const data = res.data.data;

+ 3 - 3
src/views/device/iotdevice.vue

@@ -38,11 +38,11 @@
           <device-detail pic="/img/device/parkingmonitor.png" :device="deviceDetail" v-if="deviceDetail.deviceType == 100007"></device-detail>
           <device-detail pic="/img/device/gate.png" :device="deviceDetail" v-if="deviceDetail.deviceType == 9"></device-detail>
         </el-tab-pane>
-        <!--<el-tab-pane label="告警设置" name="second">-->
+        <el-tab-pane label="告警设置" name="second">-->
         <!--  <alarm :alarmData="alarmData" :alarmSetData="alarmSetData" :residential-id="residentialId"></alarm>-->
         <!--</el-tab-pane>-->
-      </el-tabs>
-    </el-dialog> -->
+<!--      </el-tabs>-->
+<!--    </el-dialog> &ndash;&gt;-->
     <el-container>
       <el-main>
         <template>

+ 54 - 2
src/views/estate/accessrecord.vue

@@ -1,5 +1,19 @@
 <template>
   <basic-container>
+<!--    卡片数据展示-->
+    <el-card style="background: #f5f5f5;margin-bottom: 20px">
+<!--      <template slot="header">-->
+<!--        出入统计数据-->
+        <el-tabs type="border-card">
+          <el-tab-pane label="数据统计"><avue-data-box :option="AccessRecord"></avue-data-box></el-tab-pane>
+<!--          <el-tab-pane label="本周数据"><avue-data-icon :option="weekAccessRecord"></avue-data-icon></el-tab-pane>-->
+<!--          <el-tab-pane label="本月数据"><avue-data-icon :option="monthAccessRecord"></avue-data-icon></el-tab-pane>-->
+<!--          <el-tab-pane label="今年数据"><avue-data-icon :option="yearAccessRecord"></avue-data-icon></el-tab-pane>-->
+        </el-tabs>
+<!--      </template>-->
+    </el-card>
+
+
     <avue-crud :option="option"
                :table-loading="loading"
                :data="data"
@@ -32,12 +46,43 @@
 </template>
 
 <script>
-  import {getList, getDetail, add, update, remove} from "@/api/estate/accessrecord";
+  import {getList, getDetail, add, update, remove, getAccessCount} from "@/api/estate/accessrecord";
   import {mapGetters} from "vuex";
 
   export default {
     data() {
       return {
+        //今年数据
+        AccessRecord:{
+          span:6,
+          data: [
+            {
+              title: '今日数据',
+              count: 0,
+              icon: 'el-icon-s-home',
+              color: 'rgb(49, 180, 141)',
+            },
+            {
+              title: '本周数据',
+              count: 0,
+              icon: 'el-icon-s-home',
+              color: 'rgb(56, 161, 242)',
+            },
+            {
+              title: '本月数据',
+              count: 0,
+              icon: 'el-icon-s-home',
+              color: 'rgb(117, 56, 199)',
+            },
+            {
+              title: '今年数据',
+              count: 0,
+              icon: 'el-icon-user-solid',
+              color: 'rgb(143,119,0)',
+            },
+          ]
+        },
+
         residentialColumn: {
           label: "所属小区",
           prop: "residentialId",
@@ -88,7 +133,7 @@
         selectionList: [],
         option: {
           height:'auto',
-          calcHeight: 30,
+          // calcHeight: 30,
           tip: false,
           searchShow: true,
           searchMenuSpan: 6,
@@ -400,6 +445,13 @@
       },
       onLoad(page, params = {}) {
         this.loading = true;
+        getAccessCount().then(res=>{
+          console.log(res,"打印res")
+          this.AccessRecord.data[0].count = res.data.dayCount;
+          this.AccessRecord.data[1].count = res.data.weekCount;
+          this.AccessRecord.data[2].count = res.data.monthCount;
+          this.AccessRecord.data[3].count = res.data.yearCount;
+        });
         getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
           const data = res.data.data;
           this.page.total = data.total;