Files
2025-10-22 08:19:00 +08:00

197 lines
4.5 KiB
Vue

<template>
<view class="admin-center">
<!-- 顶部导航栏 -->
<view class="nav-bar">
<view class="nav-back" @click="navigateBack">
<u-icon name="arrow-left" size="24" color="#606266"></u-icon>
</view>
<view class="nav-title">管理中心</view>
<view class="nav-right"></view>
</view>
<!-- 管理员信息卡片 -->
<view class="admin-card">
<image class="admin-avatar" src="@/static/common/admin.svg" mode="aspectFill"></image>
<view class="admin-info">
<view class="admin-name">{{ adminName }}</view>
<view class="admin-role">系统管理员</view>
</view>
</view>
<!-- 功能模块列表 -->
<view class="module-list">
<u-cell-group>
<u-cell
title="用户管理"
icon="people"
is-link
@click="navigateTo('pages/admin-center/user-management/user-management')"
>
</u-cell>
<u-cell
title="部门管理"
icon="office-building"
is-link
@click="navigateTo('pages/admin-center/dept-management/dept-management')"
>
</u-cell>
<u-cell
title="系统设置"
icon="settings"
is-link
@click="navigateTo('pages/admin-center/system-settings/system-settings')"
>
</u-cell>
</u-cell-group>
</view>
<!-- 统计信息 -->
<view class="stats-section">
<view class="stats-title">系统统计</view>
<view class="stats-grid">
<view class="stat-item">
<view class="stat-number">{{ totalUsers }}</view>
<view class="stat-label">总用户数</view>
</view>
<view class="stat-item">
<view class="stat-number">{{ totalDepartments }}</view>
<view class="stat-label">部门数</view>
</view>
<view class="stat-item">
<view class="stat-number">{{ totalImages }}</view>
<view class="stat-label">图片总数</view>
</view>
<view class="stat-item">
<view class="stat-number">{{ totalTasks }}</view>
<view class="stat-label">任务总数</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
adminName: '管理员',
totalUsers: 125,
totalDepartments: 15,
totalImages: 2580,
totalTasks: 120
}
},
methods: {
navigateBack() {
uni.navigateBack()
},
navigateTo(url) {
uni.navigateTo({
url: '/' + url
})
}
}
}
</script>
<style lang="scss">
.admin-center {
padding-bottom: 20rpx;
background-color: #f5f5f5;
.nav-bar {
display: flex;
align-items: center;
justify-content: space-between;
height: 88rpx;
padding: 0 30rpx;
background-color: #fff;
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
.nav-title {
font-size: 36rpx;
font-weight: bold;
color: #333;
}
}
.admin-card {
display: flex;
align-items: center;
padding: 30rpx;
margin: 20rpx;
background-color: #fff;
border-radius: 12rpx;
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
.admin-avatar {
width: 120rpx;
height: 120rpx;
border-radius: 50%;
margin-right: 20rpx;
}
.admin-info {
flex: 1;
.admin-name {
font-size: 36rpx;
font-weight: bold;
color: #333;
margin-bottom: 8rpx;
}
.admin-role {
font-size: 28rpx;
color: #666;
}
}
}
.module-list {
margin: 20rpx;
background-color: #fff;
border-radius: 12rpx;
overflow: hidden;
}
.stats-section {
margin: 20rpx;
background-color: #fff;
border-radius: 12rpx;
padding: 20rpx;
.stats-title {
font-size: 32rpx;
font-weight: bold;
color: #333;
margin-bottom: 20rpx;
}
.stats-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20rpx;
.stat-item {
text-align: center;
padding: 20rpx;
background-color: #f8f8f8;
border-radius: 8rpx;
.stat-number {
font-size: 48rpx;
font-weight: bold;
color: #007AFF;
margin-bottom: 8rpx;
}
.stat-label {
font-size: 28rpx;
color: #666;
}
}
}
}
}
</style>