人力数据分析-企业人数根据在职员工台账读取

gaoluyang

5 天以前 658802bea263dc2acda03459fb023ea741671cf1

 src/views/personnelManagement/analytics/index.vue

@@ -11,13 +11,13 @@
                <component :is="item.icon" />
              </el-icon>
            </div>
            <div class="card-info">
              <div class="card-info">
              <div class="card-number">
                <el-skeleton-item v-if="loading" variant="text" style="width: 60px; height: 32px;" />
                <span v-else>{{ item.value }}{{ item.unit }}</span>
              </div>
              <div class="card-label">{{ item.label }}</div>
              <div class="card-trend" :class="item.trend > 0 ? 'positive' : 'negative'">
              <div class="card-trend" :class="item.trend > 0 ? 'positive' : 'negative'" v-if="item.showTrend !== false">
                <el-icon>
                  <component :is="item.trend > 0 ? 'ArrowUp' : 'ArrowDown'" />
                </el-icon>
@@ -110,6 +110,7 @@
  ArrowDown
} from '@element-plus/icons-vue'
import * as echarts from 'echarts'
import { staffOnJobListPage } from '@/api/personnelManagement/employeeRecord.js'

// 响应式数据
const loading = ref(false)
@@ -163,12 +164,25 @@
    unit: '人',
    icon: 'PieChart',
    type: 'warning',
    trend: 0
    trend: 0,
    showTrend: false
  }
])

// 部门数据
const departmentData = ref([])

// 获取在职员工数
const getStaffCount = async () => {
  try {
    const res = await staffOnJobListPage({ staffState: 1, current: 1, size: 1 })
    if (res && res.data) {
      keyMetrics.value[3].value = res.data.total || 0
    }
  } catch (error) {
    console.error('获取在职员工数失败:', error)
  }
}

// 启动自动刷新
const startAutoRefresh = () => {
@@ -210,9 +224,6 @@
  
  keyMetrics.value[2].value = (Math.random() * 15 + 85).toFixed(1)
  keyMetrics.value[2].trend = (Math.random() * 3 - 1.5).toFixed(1)
  
  keyMetrics.value[3].value = 20
  keyMetrics.value[3].trend = (Math.random() * 2 - 1).toFixed(1)

  // 生成部门数据
  const departments = ['技术部', '销售部', '人事部', '财务部', '生产部', '市场部']
@@ -487,6 +498,7 @@
// 生命周期
onMounted(() => {
  generateMockData()
  getStaffCount()
  initCharts()
  startAutoRefresh()
})