新增统计

src/api/stat/index.js

@@ -0,0 +1,55 @@
+import request from '@/utils/request'
+
+// 统计不同类型的活动次数
+export function activityCountByType(query) {
+  return request({
+    url: '/community/stat/activity-count-by-type',
+    method: 'get',
+    params: query
+  })
+}
+
+// 统计不同类型活动各有多少人参加
+export function userCountByType(query) {
+    return request({
+      url: '/community/stat/user-count-by-type',
+      method: 'get',
+      params: query
+    })
+}
+
+// 统计不同群体各有多少人数参加活动
+export function userCountByTag(query) {
+    return request({
+      url: '/community/stat/user-count-by-tag',
+      method: 'get',
+      params: query
+    })
+}
+
+// 统计参加活动的总人数
+export function userTotalCountByTag(query) {
+    return request({
+      url: '/community/stat/user-total-count-by-tag',
+      method: 'get',
+      params: query
+    })
+}
+
+// 统计不同活动类型、主题、参与人数和积分数
+export function activityTableA(query) {
+    return request({
+      url: '/community/stat/activity-table-a',
+      method: 'get',
+      params: query
+    })
+}
+
+// 统计不同活动类型的次数、参与人数和积分数
+export function activityTableb(query) {
+    return request({
+      url: '/community/stat/activity-table-b',
+      method: 'get',
+      params: query
+    })
+}

src/views/stat/activity/activity-table-a.vue

@@ -0,0 +1,99 @@
+<template>
+    <div class="app-container">
+      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="120px">
+        <el-form-item label="活动开始时间" prop="startTime">
+          <el-date-picker clearable
+            v-model="queryParams.startTime"
+            type="date"
+            value-format="yyyy-MM-dd"
+            placeholder="请选择活动开始时间">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="活动结束时间" prop="endTime">
+          <el-date-picker clearable
+            v-model="queryParams.endTime"
+            type="date"
+            value-format="yyyy-MM-dd"
+            placeholder="请选择活动结束时间">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-form>
+  
+      <el-table v-loading="loading" :data="activityList">
+        <el-table-column label="活动类型" align="center" prop="activityType" />
+        <el-table-column label="主题" align="center" prop="activityTopic" />
+        <el-table-column label="人数" align="center" prop="userCount" />
+        <el-table-column label="积分" align="center" prop="points" />
+      </el-table>
+  
+      <pagination
+        v-show="total>0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </div>
+  </template>
+  
+  <script>
+  import { activityTableA } from "@/api/stat/index";
+  export default {
+    name: "Activity",
+    data() {
+      return {
+        // 遮罩层
+        loading: true,
+        // 总条数
+        total: 0,
+        // 活动管理表格数据
+        activityList: [],
+        // 查询参数
+        queryParams: {
+          pageNum: 1,
+          pageSize: 10,
+        },
+        titleList: [
+            { name: '文化娱乐', value: 'whyl' },
+            { name: '志愿服务', value: 'zyfu' },
+            { name: '教育宣讲', value: 'jyxj' },
+            { name: '治理防范', value: 'zlff' },
+            { name: '环境卫生', value: 'hjws' },
+            { name: '关爱服务', value: 'gafw' }
+        ]
+      };
+    },
+    created() {
+      this.getList();
+    },
+    methods: {
+      /** 查询活动管理列表 */
+      async getList() {
+        this.loading = true;
+        const res = await activityTableA(this.queryParams);
+        this.activityList = res.data.map(e => {
+            const type = this.titleList.find(j => j.value == e.activityType);
+            if (type) e.activityType = type.name;
+            return e;
+        });
+        // this.total = res.total;
+        this.loading = false;
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.queryParams.pageNum = 1;
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.resetForm("queryForm");
+        this.handleQuery();
+      },
+    }
+  };
+  </script>
+  

src/views/stat/activity/activity-table-b.vue

@@ -0,0 +1,99 @@
+<template>
+    <div class="app-container">
+      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="120px">
+        <el-form-item label="活动开始时间" prop="startTime">
+          <el-date-picker clearable
+            v-model="queryParams.startTime"
+            type="date"
+            value-format="yyyy-MM-dd"
+            placeholder="请选择活动开始时间">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="活动结束时间" prop="endTime">
+          <el-date-picker clearable
+            v-model="queryParams.endTime"
+            type="date"
+            value-format="yyyy-MM-dd"
+            placeholder="请选择活动结束时间">
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-form>
+  
+      <el-table v-loading="loading" :data="activityList">
+        <el-table-column label="活动类型" align="center" prop="activityType" />
+        <el-table-column label="活动次数" align="center" prop="activityCounts" />
+        <el-table-column label="人数" align="center" prop="userCount" />
+        <el-table-column label="积分" align="center" prop="points" />
+      </el-table>
+  
+      <pagination
+        v-show="total>0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </div>
+  </template>
+  
+  <script>
+  import { activityTableb } from "@/api/stat/index";
+  export default {
+    name: "Activity",
+    data() {
+      return {
+        // 遮罩层
+        loading: true,
+        // 总条数
+        total: 0,
+        // 活动管理表格数据
+        activityList: [],
+        // 查询参数
+        queryParams: {
+          pageNum: 1,
+          pageSize: 10,
+        },
+        titleList: [
+            { name: '文化娱乐', value: 'whyl' },
+            { name: '志愿服务', value: 'zyfu' },
+            { name: '教育宣讲', value: 'jyxj' },
+            { name: '治理防范', value: 'zlff' },
+            { name: '环境卫生', value: 'hjws' },
+            { name: '关爱服务', value: 'gafw' }
+        ]
+      };
+    },
+    created() {
+      this.getList();
+    },
+    methods: {
+      /** 查询活动管理列表 */
+      async getList() {
+        this.loading = true;
+        const res = await activityTableb(this.queryParams);
+        this.activityList = res.data.map(e => {
+            const type = this.titleList.find(j => j.value == e.activityType);
+            if (type) e.activityType = type.name;
+            return e;
+        });;
+        // this.total = res.total;
+        this.loading = false;
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.queryParams.pageNum = 1;
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.resetForm("queryForm");
+        this.handleQuery();
+      },
+    }
+  };
+  </script>
+  

src/views/stat/activity/index.vue

@@ -6,16 +6,21 @@
           <div slot="header"><span>搜索信息</span></div>
           <div class="el-table el-table--enable-row-hover el-table--medium">
             <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px">
-              <el-form-item label="时间范围">
-                <el-date-picker
-                  v-model="dateRange"
-                  style="width: 240px"
+              <el-form-item label="活动开始时间" prop="startTime">
+                <el-date-picker clearable
+                  v-model="queryParams.startTime"
+                  type="date"
                   value-format="yyyy-MM-dd"
-                  type="daterange"
-                  range-separator="-"
-                  start-placeholder="开始日期"
-                  end-placeholder="结束日期"
-                ></el-date-picker>
+                  placeholder="请选择活动开始时间">
+                </el-date-picker>
+              </el-form-item>
+              <el-form-item label="活动结束时间" prop="endTime">
+                <el-date-picker clearable
+                  v-model="queryParams.endTime"
+                  type="date"
+                  value-format="yyyy-MM-dd"
+                  placeholder="请选择活动结束时间">
+                </el-date-picker>
               </el-form-item>
               <el-form-item>
                 <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
@@ -40,17 +45,10 @@
             <span>人数统计</span>
           </div>
           <el-row :gutter="24">
-            <el-col :span="3"><div class="grid-content bg-purple">总人数：</div></el-col>
-            <el-col :span="3"><div class="grid-content bg-purple">居民人数：</div></el-col>
-            <el-col :span="3"><div class="grid-content bg-purple">网格长人数：</div></el-col>
-            <el-col :span="3"><div class="grid-content bg-purple">楼栋长人数：</div></el-col>
-            <el-col :span="3"><div class="grid-content bg-purple">单元长人数：</div></el-col>
-            <el-col :span="3"><div class="grid-content bg-purple">下沉干部人数：</div></el-col>
-            <el-col :span="3"><div class="grid-content bg-purple">志愿者人数：</div></el-col>
-            <el-col :span="3"><div class="grid-content bg-purple">社区干部人数：</div></el-col>
+            <el-col :span="4" v-for="(item, index) in userData" :key="index"><div style="margin-top: 8px;">{{ item.name }}: {{ item.value }}人</div></el-col>
           </el-row>
           <div class="el-table el-table--enable-row-hover el-table--medium">
-            <div ref="usedmemory" style="height: 480px" />
+            <div ref="usedmemory" style="height: 440px" />
           </div>
         </el-card>
       </el-col>
@@ -59,8 +57,7 @@
 </template>
 
 <script>
-import { getCache } from "@/api/monitor/cache";
-import { statActivitiesByType } from "@/api/community/stat";
+import { activityCountByType, userCountByType, userCountByTag, userTotalCountByTag } from "@/api/stat/index";
 import echarts from "echarts";
 
 export default {
@@ -71,19 +68,29 @@ export default {
       // cache信息
       cache: [],
       queryParams: {},
-      dateRange: []
+      dateRange: [],
+      userData: [],
+      titleList: [
+        { name: '文化娱乐', value: 'whyl' },
+        { name: '志愿服务', value: 'zyfu' },
+        { name: '教育宣讲', value: 'jyxj' },
+        { name: '治理防范', value: 'zlff' },
+        { name: '环境卫生', value: 'hjws' },
+        { name: '关爱服务', value: 'gafw' }
+      ]
     }
   },
   mounted() {
-    // this.getList();
+    this.handleQuery();
     // this.openLoading();
-    this.getActivity();
-    this.getUser();
   },
   methods: {
     // 搜索
     handleQuery() {
-      console.log(this.addDateRange(this.queryParams, this.dateRange));
+      this.$modal.loading("正在加载活动统计数据，请稍候！");
+      this.getActivity();
+      this.getUser();
+      this.getUserList();
     },
     // 重置
     resetQuery() {
@@ -91,21 +98,24 @@ export default {
       this.resetForm("queryForm");
       this.handleQuery();
     },
-    /** 查缓存询信息 */
-    getList() {
-      this.$modal.loading("正在加载活动统计数据，请稍候！");
+    /** 人数信息 */
+    async getUserList() {
+      const typeUser = await userCountByTag(this.queryParams);
+      console.log(typeUser, 'typeUser');
+      const allUser = await userTotalCountByTag(this.queryParams);
+      console.log(allUser, 'allUser');
+      const allData = [{ name: '总人数', value: allUser.data }];
+      this.userData = [ ...allData, ...typeUser?.data ];
       this.$modal.closeLoading();
     },
-    getActivity() {
+    async getActivity() {
+      const res = await activityCountByType(this.queryParams);
+      const data = res?.data.map(e => {
+        const type = this.titleList.find(j => j.value == e.name);
+        if (type) e.name = type.name;
+        return e;
+      });;
       const myChart = echarts.init(this.$refs.activities, 'macarons');
-      const data = [
-        { name: '教育宣讲', value: 120 },
-        { name: '关爱服务', value: 20 },
-        { name: '环境卫生', value: 100 },
-        { name: '治理防范', value: 200 },
-        { name: '文化娱乐', value: 80 },
-        { name: '志愿服务', value: 120 }
-      ]
       const option = {
         tooltip: {
           trigger: 'item',
@@ -125,15 +135,13 @@ export default {
       };
       myChart.setOption(option);
     },
-    getUser() {
-      const data = [
-        { name: '教育宣讲', value: 120 },
-        { name: '关爱服务', value: 20 },
-        { name: '环境卫生', value: 100 },
-        { name: '治理防范', value: 200 },
-        { name: '文化娱乐', value: 80 },
-        { name: '志愿服务', value: 120 }
-      ];
+    async getUser() {
+      const res = await userCountByType(this.queryParams);
+      const data = res?.data.map(e => {
+        const type = this.titleList.find(j => j.value == e.name);
+        if (type) e.name = type.name;
+        return e;
+      });
       const myChart = echarts.init(this.$refs.usedmemory);
       const option = {
         xAxis: {
@@ -175,4 +183,4 @@ export default {
     }
   }
 };
-</script>
+</script>

vue.config.js

@@ -39,7 +39,7 @@ module.exports = {
       [process.env.VUE_APP_BASE_API]: {
         // target: `http://fuyu.scapp.cn/prod-api/`,
         // target: `https://fuyu.cc-lotus.info`,
-        target: `http://192.168.0.18:8080`,
+        target: `http://192.168.0.19:8080`,
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''
@@ -50,7 +50,7 @@ module.exports = {
         changeOrigin: true,
       },
       '/profile/': {
-        target: `http://192.168.0.18:8080`,
+        target: `http://192.168.0.19:8080`,
         changeOrigin: true,
       },
     },