社团统计及团员统计

src/views/stuwork/stuassociation/index.vue

@@ -64,12 +64,19 @@
               学生社团列表
             </span>
             <div class="header-actions">
-              <el-button 
-                icon="Plus" 
-                type="primary" 
+              <el-button
+                icon="Plus"
+                type="primary"
                 @click="formDialogRef.openDialog()">
                 新增
               </el-button>
+              <el-button
+                icon="DataAnalysis"
+                type="warning"
+                class="ml10"
+                @click="handleStats">
+                社团统计
+              </el-button>
               <right-toolbar  
                 v-model:showSearch="showSearch" 
                 class="ml10"
@@ -187,9 +194,54 @@
 
     <!-- 新增/编辑表单弹窗 -->
     <form-dialog ref="formDialogRef" @refresh="getDataList" />
-    
+
     <!-- 查看成员弹窗 -->
     <member-dialog ref="memberDialogRef" />
+
+    <!-- 社团统计弹窗 -->
+    <el-dialog
+      title="社团统计"
+      v-model="statsDialogVisible"
+      :width="700"
+      :close-on-click-modal="false"
+      draggable>
+      <el-table
+        :data="statsData"
+        v-loading="statsLoading"
+        stripe
+        border
+        max-height="400">
+        <el-table-column type="index" label="序号" width="60" align="center" />
+        <el-table-column prop="deptName" label="学院名称" align="center" min-width="150" />
+        <el-table-column prop="associationCount" label="社团数量" align="center" width="120">
+          <template #default="scope">
+            <el-tag :type="scope.row.associationCount > 0 ? 'success' : 'info'" effect="plain">
+              {{ scope.row.associationCount }}
+            </el-tag>
+          </template>
+        </el-table-column>
+      </el-table>
+      <!-- 统计汇总 -->
+      <div v-if="statsData.length > 0" class="stats-summary">
+        <el-row :gutter="20">
+          <el-col :span="12">
+            <div class="summary-item">
+              <span class="label">学院总数：</span>
+              <span class="value">{{ statsData.length }}</span>
+            </div>
+          </el-col>
+          <el-col :span="12">
+            <div class="summary-item">
+              <span class="label">社团总数：</span>
+              <span class="value highlight">{{ totalAssociationCount }}</span>
+            </div>
+          </el-col>
+        </el-row>
+      </div>
+      <template #footer>
+        <el-button @click="statsDialogVisible = false">关 闭</el-button>
+      </template>
+    </el-dialog>
   </div>
 </template>
 
@@ -197,7 +249,7 @@
 import { reactive, ref, onMounted, computed, nextTick } from 'vue'
 import { useRoute } from 'vue-router'
 import { BasicTableProps, useTable } from "/@/hooks/table";
-import { fetchList, delObj } from "/@/api/stuwork/stuassociation";
+import { fetchList, delObj, getAssociationStats } from "/@/api/stuwork/stuassociation";
 import { getDeptList } from "/@/api/basic/basicclass";
 import { getDicts } from "/@/api/admin/dict";
 import { useMessage, useMessageBox } from "/@/hooks/message";
@@ -205,9 +257,9 @@ import { parseTime } from "/@/utils/formatTime";
 import TableColumnControl from '/@/components/TableColumnControl/index.vue'
 import FormDialog from './form.vue'
 import MemberDialog from './member.vue'
-import { 
-  List, Trophy, OfficeBuilding, User, UserFilled, Calendar, 
-  Phone, Collection, Document, Files, Setting, Menu, Search
+import {
+  List, Trophy, OfficeBuilding, User, UserFilled, Calendar,
+  Phone, Collection, Document, Files, Setting, Menu, Search, DataAnalysis
 } from '@element-plus/icons-vue'
 import { useTableColumnControl } from '/@/hooks/tableColumn'
 
@@ -222,6 +274,11 @@ const showSearch = ref(true)
 const deptList = ref<any[]>([])
 const typeList = ref<any[]>([])
 
+// 社团统计相关
+const statsDialogVisible = ref(false)
+const statsLoading = ref(false)
+const statsData = ref<any[]>([])
+
 // 表格列配置
 const tableColumns = [
   { prop: 'associationName', label: '社团名称', minWidth: 200 },
@@ -362,6 +419,31 @@ const getTypeDict = async () => {
   }
 }
 
+// 社团统计
+const handleStats = async () => {
+  statsDialogVisible.value = true
+  statsLoading.value = true
+  statsData.value = []
+  try {
+    const res = await getAssociationStats()
+    if (res.data && Array.isArray(res.data)) {
+      statsData.value = res.data
+    } else {
+      statsData.value = []
+    }
+  } catch (err: any) {
+    useMessage().error(err.msg || '获取统计数据失败')
+    statsData.value = []
+  } finally {
+    statsLoading.value = false
+  }
+}
+
+// 社团总数计算
+const totalAssociationCount = computed(() => {
+  return statsData.value.reduce((sum, item) => sum + (item.associationCount || 0), 0)
+})
+
 // 初始化
 onMounted(() => {
   getDeptListData()
@@ -375,5 +457,32 @@ onMounted(() => {
 
 <style scoped lang="scss">
 @import '/@/assets/styles/modern-page.scss';
+
+.stats-summary {
+  margin-top: 15px;
+  padding: 15px;
+  background: #f5f7fa;
+  border-radius: 4px;
+
+  .summary-item {
+    text-align: center;
+
+    .label {
+      color: #909399;
+      font-size: 14px;
+    }
+
+    .value {
+      font-size: 24px;
+      font-weight: bold;
+      margin-left: 5px;
+      color: #409eff;
+
+      &.highlight {
+        color: #67c23a;
+      }
+    }
+  }
+}
 </style>