refactor: 调整组件、图表样式与逻辑，新增团队成员表格

1. 清空ItemDistribution.vue默认示例数据，调整图表容器高度
2. 修复teamProfile/index.vue的参数获取逻辑错误
3. 优化MemberPositionDistribution.vue的轴标签样式并禁用数据缩放
4. 新增GroupMemberTable组件并重构groupProfile页面的成员表格逻辑

src/pages/components/GroupMemberTable.vue

@@ -0,0 +1,77 @@
+<template>
+  <div class="team-member-table">
+    <scroll-view scroll-x class="table-scroll">
+      <table class="data-table">
+        <thead>
+          <tr>
+            <th>姓名</th>
+            <th>年龄</th>
+            <th>司龄</th>
+            <th>性别</th>
+            <th>民族</th>
+            <th>政治面貌</th>
+            <th>职务</th>
+            <th>职业技能等级</th>
+            <th>开机年限</th>
+            <th>综合得分</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr v-for="(item, index) in chartsData" :key="index">
+            <td>{{ item.personName }}</td>
+            <td>{{ item.age }}</td>
+            <td>{{ item.workYears }}</td>
+            <td>{{ item.sex }}</td>
+            <td>{{ item.nation }}</td>
+            <td>{{ item.politicalStatus }}</td>
+            <td>{{ item.roleNames }}</td>
+            <td>{{ item.qualificationLevel }}</td>
+            <td>{{ item.xrayOperatorYears }}</td>
+            <td>{{ item.totalScore }}</td>
+          </tr>
+        </tbody>
+      </table>
+    </scroll-view>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'TeamMemberTable',
+  props: {
+    chartsData: {
+      type: Array,
+      default: () => []
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.team-member-table {
+  .table-scroll {
+    width: 100%;
+  }
+  
+  .data-table {
+    width: 100%;
+    font-size: 24rpx;
+    border-collapse: collapse;
+    
+    th, td {
+      padding: 16rpx 8rpx;
+      text-align: left;
+      white-space: nowrap;
+    }
+    
+    th {
+      color: rgba(255, 255, 255, 0.5);
+      border-bottom: 1rpx solid rgba(255, 255, 255, 0.1);
+    }
+    
+    td {
+      color: rgba(255, 255, 255, 0.9);
+    }
+  }
+}
+</style>

src/pages/components/ItemDistribution.vue

@@ -20,11 +20,7 @@ export default {
       type: Object,
       default: () => ({
         items: [
-          { name: '刀具', value: 836, color: '#60A5FA' },
-          { name: '易燃易爆', value: 718, color: '#34D399' },
-          { name: '枪支警械', value: 255, color: '#FBBF24' },
-          { name: '管制刀具', value: 1, color: '#EF4444' },
-          { name: '其他', value: 172, color: '#9CA3AF' }
+          
         ]
       })
     }
@@ -90,7 +86,7 @@ export default {
 <style lang="scss" scoped>
 .item-distribution {
   .chart-container {
-    height: 250rpx;
+    height: 300rpx;
   }
   
   .legend-grid {

src/pages/components/MemberPositionDistribution.vue

@@ -215,7 +215,9 @@ export default {
           },
           axisLabel: {
             color: 'rgba(255, 255, 255, 0.5)',
-            fontSize: 10
+            fontSize: 10,
+            rotate: 30,
+            margin: 15
           }
         },
         yAxis: {
@@ -236,22 +238,22 @@ export default {
             fontSize: 10
           }
         },
-        dataZoom: [{
-          type: 'slider',
-          show: true,
-          xAxisIndex: 0,
-          height: 20,
-          bottom: 0,
-          borderColor: 'rgba(255, 255, 255, 0.1)',
-          backgroundColor: 'rgba(45, 42, 85, 0.8)',
-          fillerColor: 'rgba(167, 139, 250, 0.3)',
-          handleStyle: {
-            color: '#A78BFA'
-          },
-          labelStyle: {
-            color: 'rgba(255, 255, 255, 0.5)'
-          }
-        }],
+        // dataZoom: [{
+        //   type: 'slider',
+        //   show: true,
+        //   xAxisIndex: 0,
+        //   height: 20,
+        //   bottom: 0,
+        //   borderColor: 'rgba(255, 255, 255, 0.1)',
+        //   backgroundColor: 'rgba(45, 42, 85, 0.8)',
+        //   fillerColor: 'rgba(167, 139, 250, 0.3)',
+        //   handleStyle: {
+        //     color: '#A78BFA'
+        //   },
+        //   labelStyle: {
+        //     color: 'rgba(255, 255, 255, 0.5)'
+        //   }
+        // }],
         series: [{
           type: 'bar',
           data: this.chartsData.position.data,
@@ -300,7 +302,7 @@ export default {
   }
   
   .chart-container {
-    height: 250rpx;
+    height: 600rpx;
   }
 }
 </style>

src/pages/groupProfile/index.vue

@@ -64,7 +64,7 @@
                 </SectionTitle>
 
                 <SectionTitle title="团队成员">
-                    <TeamMemberTable :chartsData="teamMemberData" />
+                    <GroupMemberTable :chartsData="GroupMemberTable" />
                 </SectionTitle>
 
                 <SectionTitle title="成员基本情况分布">
@@ -132,7 +132,7 @@
 
 <script>
 import SectionTitle from '@/components/SectionTitle.vue'
-import TeamMemberTable from '../components/TeamMemberTable.vue'
+import GroupMemberTable from '../components/GroupMemberTable.vue'
 import MemberBasicDistribution from '../components/MemberBasicDistribution.vue'
 import MemberPositionDistribution from '../components/MemberPositionDistribution.vue'
 import PassengerChart from '../components/PassengerChart.vue'
@@ -151,7 +151,7 @@ import InterceptionDistribution from '../components/InterceptionDistribution.vue
 import DeptStats from '../components/DeptStats.vue'
 import DeptSelector from '../components/DeptSelector.vue'
 import {
-    countStationTeamStats,
+    getDeptMembers,
     getDeptMemberDistribution,
     getDeptPositionDistribution,
     countStationHourlyThroughput,
@@ -180,7 +180,7 @@ export default {
     name: 'DeptProfile',
     components: {
         SectionTitle,
-        TeamMemberTable,
+        GroupMemberTable,
         MemberBasicDistribution,
         MemberPositionDistribution,
         PassengerChart,
@@ -216,7 +216,7 @@ export default {
             deptList: [],
             deptLoading: false,
             radarData: [],
-            teamMemberData: [],
+            GroupMemberTable: [],
             memberBasicData: {
                 gender: { labels: [], data: [] },
                 ethnicity: { labels: [], data: [] },
@@ -499,18 +499,9 @@ export default {
             })
         },
         fetchTeamData(params) {
-            countStationTeamStats(params).then(res => {
+            getDeptMembers(params).then(res => {
                 if (res.code === 200 && res.data) {
-                    this.teamMemberData = (res.data || []).map(item => ({
-                        department: item.deptName,
-                        employeeCount: item.employeeCount,
-                        partyMemberCount: item.partyMemberCount,
-                        avgAge: item.avgAge,
-                        avgTenure: item.avgWorkYears,
-                        certificateCount: item.qualificationLevel,
-                        machineYears: item.avgXrayOperatorYears,
-                        comprehensiveScore: item.totalScore
-                    }))
+                    this.GroupMemberTable = (res.data || [])
                 }
             }).catch(() => { })
         },

src/pages/teamProfile/index.vue

@@ -424,8 +424,12 @@ export default {
         buildTimeParams() {
             const now = new Date()
             const today = this.formatDate(now)
-            const deptId = this.selectedDeptId || 100
-            const teamId = this.selectedTeamId || 100
+            const deptId = this.selectedDeptId;
+            const teamId = this.selectedDeptId;
+            if(!this.selectedDeptId){
+                return 
+                
+            }
             if (this.selectedTimeTag === 4) {
                 if (this.startDate && this.endDate) {
                     return { startDate: this.startDate, endDate: this.endDate, deptId, teamId }