Initial commit of akmon project
This commit is contained in:
118
pages/admins/admintypes.uts
Normal file
118
pages/admins/admintypes.uts
Normal file
@@ -0,0 +1,118 @@
|
||||
// 用户类型
|
||||
export type User = {
|
||||
id: string
|
||||
username: string
|
||||
email: string
|
||||
avatar_url?: string
|
||||
role: string
|
||||
}
|
||||
|
||||
// 通知类型
|
||||
export type Notification = {
|
||||
id: string
|
||||
user_id: string
|
||||
title: string
|
||||
content: string
|
||||
status: string
|
||||
created_at: string
|
||||
}
|
||||
|
||||
// 修改密码表单类型
|
||||
export type PasswordForm = {
|
||||
oldPassword: string
|
||||
newPassword: string
|
||||
confirmPassword: string
|
||||
}
|
||||
|
||||
// 用户详情页相关类型
|
||||
export type UserDetail = {
|
||||
id: string
|
||||
name?: string
|
||||
username: string
|
||||
email?: string
|
||||
phone?: string
|
||||
is_active: boolean
|
||||
created_at: string
|
||||
last_login?: string
|
||||
}
|
||||
|
||||
export type UserRole = {
|
||||
id: string
|
||||
user_id: string
|
||||
role_id: string
|
||||
role_name: string
|
||||
level: number
|
||||
scope_type?: string
|
||||
scope_id?: string
|
||||
scope_name?: string
|
||||
}
|
||||
|
||||
export type EditForm = {
|
||||
name?: string
|
||||
email?: string
|
||||
phone?: string
|
||||
is_active: boolean
|
||||
}
|
||||
|
||||
// 角色类型
|
||||
export type Role = {
|
||||
id: string
|
||||
name: string
|
||||
description?: string
|
||||
level: number
|
||||
is_system: boolean
|
||||
created_at: string
|
||||
}
|
||||
|
||||
// 角色表单类型
|
||||
export type RoleForm = {
|
||||
id?: string
|
||||
name: string
|
||||
description?: string
|
||||
level: number
|
||||
is_system?: boolean
|
||||
scope_type?: string
|
||||
scope_id?: string
|
||||
role_id?: string
|
||||
role_name?: string
|
||||
}
|
||||
|
||||
export type RoleOption = {
|
||||
id: string
|
||||
name: string
|
||||
level: number
|
||||
requires_scope: boolean
|
||||
}
|
||||
|
||||
export type RegionOption = {
|
||||
id: string
|
||||
name: string
|
||||
}
|
||||
|
||||
export type SchoolOption = {
|
||||
id: string
|
||||
name: string
|
||||
region_id: string
|
||||
}
|
||||
|
||||
export type GradeOption = {
|
||||
id: string
|
||||
name: string
|
||||
school_id: string
|
||||
}
|
||||
|
||||
export type ClassOption = {
|
||||
id: string
|
||||
name: string
|
||||
grade_id: string
|
||||
}
|
||||
|
||||
export type Permission = {
|
||||
id: string;
|
||||
code: string;
|
||||
name: string;
|
||||
description?: string;
|
||||
resource_type?: string;
|
||||
action?: string;
|
||||
is_system?: boolean;
|
||||
}
|
||||
908
pages/admins/layout.uvue
Normal file
908
pages/admins/layout.uvue
Normal file
@@ -0,0 +1,908 @@
|
||||
<template>
|
||||
<view class="admin-layout">
|
||||
<view class="admin-sidebar" :class="{ collapsed: sidebarCollapsed }">
|
||||
<view class="sidebar-header">
|
||||
<image class="logo" src="/static/logo.png" mode="aspectFit"></image>
|
||||
<text v-if="!sidebarCollapsed" class="logo-text">智跑后台管理</text>
|
||||
<text class="toggle-btn" @click="toggleSidebar">{{ sidebarCollapsed ? '<27>? : '<27>? }}</text>
|
||||
</view>
|
||||
|
||||
<scroll-view scroll-y class="menu-container">
|
||||
<view class="menu-section">
|
||||
<view class="menu-header" v-if="!sidebarCollapsed">
|
||||
<text>数据中心</text>
|
||||
</view>
|
||||
<view
|
||||
class="menu-item"
|
||||
:class="{ active: isActive('/pages/admin/index') }"
|
||||
@click="navigateTo('/pages/admin/index')"
|
||||
>
|
||||
<text class="menu-icon">📊</text>
|
||||
<text v-if="!sidebarCollapsed" class="menu-text">总览</text>
|
||||
</view>
|
||||
<view
|
||||
class="menu-item"
|
||||
:class="{ active: isActive('/pages/admin/analytics') }"
|
||||
@click="navigateTo('/pages/admin/analytics')"
|
||||
>
|
||||
<text class="menu-icon">📈</text>
|
||||
<text v-if="!sidebarCollapsed" class="menu-text">数据分析</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="menu-section">
|
||||
<view class="menu-header" v-if="!sidebarCollapsed">
|
||||
<text>学校管理</text>
|
||||
</view>
|
||||
<view
|
||||
class="menu-item"
|
||||
:class="{ active: isActive('/pages/admin/schools') }"
|
||||
@click="navigateTo('/pages/admin/schools/index')"
|
||||
v-if="canViewSchools"
|
||||
>
|
||||
<text class="menu-icon">🏫</text>
|
||||
<text v-if="!sidebarCollapsed" class="menu-text">学校列表</text>
|
||||
</view>
|
||||
<view
|
||||
class="menu-item"
|
||||
:class="{ active: isActive('/pages/admin/classes') }"
|
||||
@click="navigateTo('/pages/admin/classes/index')"
|
||||
v-if="canManageClass"
|
||||
>
|
||||
<text class="menu-icon">👨></text>
|
||||
<text v-if="!sidebarCollapsed" class="menu-text">班级管理</text>
|
||||
</view>
|
||||
<view
|
||||
class="menu-item"
|
||||
:class="{ active: isActive('/pages/admin/teachers') }"
|
||||
@click="navigateTo('/pages/admin/teachers/index')"
|
||||
v-if="canManageTeachers"
|
||||
>
|
||||
<text class="menu-icon">👨></text>
|
||||
<text v-if="!sidebarCollapsed" class="menu-text">教师管理</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="menu-section">
|
||||
<view class="menu-header" v-if="!sidebarCollapsed">
|
||||
<text>训练管理</text>
|
||||
</view>
|
||||
<view
|
||||
class="menu-item"
|
||||
:class="{ active: isActive('/pages/admin/training') }"
|
||||
@click="navigateTo('/pages/admin/training/index')"
|
||||
>
|
||||
<text class="menu-icon">🏃</text>
|
||||
<text v-if="!sidebarCollapsed" class="menu-text">训练计划</text>
|
||||
</view>
|
||||
<view
|
||||
class="menu-item"
|
||||
:class="{ active: isActive('/pages/admin/assignments') }"
|
||||
@click="navigateTo('/pages/admin/assignments/index')"
|
||||
>
|
||||
<text class="menu-icon">📝</text>
|
||||
<text v-if="!sidebarCollapsed" class="menu-text">作业管理</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="menu-section">
|
||||
<view class="menu-header" v-if="!sidebarCollapsed">
|
||||
<text>系统设置</text>
|
||||
</view>
|
||||
<view
|
||||
class="menu-item"
|
||||
:class="{ active: isActive('/pages/admin/roles') }"
|
||||
@click="navigateTo('/pages/admin/roles/index')"
|
||||
v-if="canManageRoles"
|
||||
>
|
||||
<text class="menu-icon">🔑</text>
|
||||
<text v-if="!sidebarCollapsed" class="menu-text">角色权限</text>
|
||||
</view>
|
||||
<view
|
||||
class="menu-item"
|
||||
:class="{ active: isActive('/pages/admin/users') }"
|
||||
@click="navigateTo('/pages/admin/users/index')"
|
||||
v-if="canManageUsers"
|
||||
>
|
||||
<text class="menu-icon">👤</text>
|
||||
<text v-if="!sidebarCollapsed" class="menu-text">用户管理</text>
|
||||
</view>
|
||||
<view
|
||||
class="menu-item"
|
||||
:class="{ active: isActive('/pages/admin/settings') }"
|
||||
@click="navigateTo('/pages/admin/settings/index')"
|
||||
>
|
||||
<text class="menu-icon">⚙️</text>
|
||||
<text v-if="!sidebarCollapsed" class="menu-text">系统设置</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
||||
<view class="admin-main" :style="{ marginLeft: sidebarCollapsed ? '60px' : '240px' }">
|
||||
<view class="admin-header">
|
||||
<view class="header-left">
|
||||
<view class="header-title">{{ pageTitle }}</view>
|
||||
</view>
|
||||
|
||||
<view class="header-right">
|
||||
<view class="notification-btn" @click="showNotifications">
|
||||
<text class="notification-icon">🔔</text>
|
||||
<view v-if="unreadCount > 0" class="badge">{{ unreadCount > 99 ? '99+' : unreadCount }}</view>
|
||||
</view>
|
||||
|
||||
<view class="user-dropdown" @click="toggleUserMenu">
|
||||
<image class="avatar" :src="currentUser.avatar_url ?? '/static/avatar-default.png'" mode="aspectFill"></image>
|
||||
<text v-if="!sidebarCollapsed" class="username">{{ currentUser.username }}</text>
|
||||
<text class="dropdown-icon">></text>
|
||||
|
||||
<view class="dropdown-menu" v-if="showUserMenu">
|
||||
<view class="dropdown-item" @click="navigateTo('/pages/user/profile')">
|
||||
<text>个人信息</text>
|
||||
</view>
|
||||
<view class="dropdown-item" @click="changePassword">
|
||||
<text>修改密码</text>
|
||||
</view>
|
||||
<view class="dropdown-item logout" @click="logout">
|
||||
<text>退出登></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="admin-content">
|
||||
<slot></slot>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 通知抽屉 -->
|
||||
<view class="notification-drawer" v-if="showNotificationDrawer" @click.stop>
|
||||
<view class="drawer-content" @click.stop>
|
||||
<view class="drawer-header">
|
||||
<text class="drawer-title">消息通知</text>
|
||||
<text class="close-btn" @click="showNotificationDrawer = false">×</text>
|
||||
</view>
|
||||
|
||||
<view class="drawer-tabs">
|
||||
<view
|
||||
class="drawer-tab"
|
||||
:class="{ active: notificationTab === 'unread' }"
|
||||
@click="notificationTab = 'unread'"
|
||||
>
|
||||
未读 ({{ unreadCount }})
|
||||
</view>
|
||||
<view
|
||||
class="drawer-tab"
|
||||
:class="{ active: notificationTab === 'all' }"
|
||||
@click="notificationTab = 'all'"
|
||||
>
|
||||
全部
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="drawer-body">
|
||||
<view v-if="loadingNotifications" class="loading-state">
|
||||
<text>加载<E58AA0>?..</text>
|
||||
</view>
|
||||
|
||||
<view v-else-if="notifications.length === 0" class="empty-state">
|
||||
<text>暂无通知</text>
|
||||
</view>
|
||||
|
||||
<view v-else class="notification-list">
|
||||
<view
|
||||
v-for="(notification, index) in (filteredNotifications as UTSJSONObject[] ?? [])"
|
||||
:key="notification.get('id')"
|
||||
class="notification-item"
|
||||
:class="{ unread: notification.get('status') === 'unread' }"
|
||||
@click="readNotification(notification)"
|
||||
>
|
||||
<text class="notification-title">{{ notification.get('title') }}</text>
|
||||
<text class="notification-content">{{ notification.get('content') }}</text>
|
||||
<text class="notification-time">{{ formatNotificationTime(`${notification.get('created_at') ?? ''}`) }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="drawer-footer">
|
||||
<button v-if="unreadCount > 0" class="mark-all-read" @click="markAllAsRead">
|
||||
全部标为已读
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 修改密码模态框 -->
|
||||
<view class="modal" v-if="showPasswordModal">
|
||||
<view class="modal-content">
|
||||
<view class="modal-header">
|
||||
<text class="modal-title">修改密码</text>
|
||||
<text class="close-btn" @click="showPasswordModal = false">×</text>
|
||||
</view>
|
||||
|
||||
<view class="modal-body">
|
||||
<view class="form-group">
|
||||
<text class="form-label">当前密码:</text>
|
||||
<input type="password" v-model="passwordForm.oldPassword" placeholder="请输入当前密<E5898D>? />
|
||||
</view>
|
||||
|
||||
<view class="form-group">
|
||||
<text class="form-label">新密<E696B0>?</text>
|
||||
<input type="password" v-model="passwordForm.newPassword" placeholder="请输入新密码" />
|
||||
</view>
|
||||
|
||||
<view class="form-group">
|
||||
<text class="form-label">确认密码:</text>
|
||||
<input type="password" v-model="passwordForm.confirmPassword" placeholder="请再次输入新密码" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="modal-footer">
|
||||
<button class="cancel-btn" @click="showPasswordModal = false">取消</button>
|
||||
<button class="submit-btn" @click="updatePassword">确定</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 遮罩<E981AE>?-->
|
||||
<view
|
||||
class="overlay"
|
||||
v-if="showUserMenu || showNotificationDrawer"
|
||||
@click="closeAllPopups"
|
||||
></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="uts">
|
||||
import { ref, reactive, computed, onMounted, onUnmounted } from 'vue'
|
||||
import { hasPermission, getUserPermissions } from '@/utils/permissionService.uts'
|
||||
import { state as userStore, getCurrentUser, logout as doLogout } from '../../utils/store.uts'
|
||||
import { User, Notification, PasswordForm } from './admintypes.uts'
|
||||
import db from '@/components/supadb/aksupainstance.uts'
|
||||
|
||||
// 侧边栏状<E6A08F>?
|
||||
const sidebarCollapsed = ref(false)
|
||||
// 用户相关
|
||||
const currentUser = reactive<User>({
|
||||
id: '', username: '', email: '', avatar_url: '', role: ''
|
||||
})
|
||||
const showUserMenu = ref(false)
|
||||
// 权限状<E99990>?
|
||||
const canManageRoles = ref(false)
|
||||
const canManageUsers = ref(false)
|
||||
const canViewSchools = ref(false)
|
||||
const canManageClass = ref(false)
|
||||
const canManageTeachers = ref(false)
|
||||
// 页面标题
|
||||
const pageTitle = ref('后台管理')
|
||||
// 通知相关
|
||||
const notifications = ref<UTSJSONObject[]>([])
|
||||
const unreadCount = ref(0)
|
||||
const showNotificationDrawer = ref(false)
|
||||
const notificationTab = ref('unread')
|
||||
const loadingNotifications = ref(false)
|
||||
// 修改密码相关
|
||||
const showPasswordModal = ref(false)
|
||||
const passwordForm = reactive<PasswordForm>({
|
||||
oldPassword: '', newPassword: '', confirmPassword: ''
|
||||
})
|
||||
// 计算属性:根据当前选项卡过滤通知
|
||||
const filteredNotifications = computed<UTSJSONObject[]>(() => {
|
||||
if (notificationTab.value === 'unread') {
|
||||
// Replace filter with for loop for UTS compatibility
|
||||
const unreadNotifications: UTSJSONObject[] = []
|
||||
for (let i = 0; i < notifications.value.length; i++) {
|
||||
const n = notifications.value[i]
|
||||
if (n.get('status') === 'unread') {
|
||||
unreadNotifications.push(n)
|
||||
}
|
||||
}
|
||||
return unreadNotifications
|
||||
}
|
||||
return notifications.value
|
||||
})
|
||||
// 获取当前用户信息
|
||||
|
||||
// 检查各项权<E9A1B9>?
|
||||
const checkPermissions = async () => {
|
||||
const userId = currentUser.id
|
||||
canManageRoles.value = await hasPermission({ userId, permissionCode: 'admin.roles.manage' })
|
||||
canManageUsers.value = await hasPermission({ userId, permissionCode: 'admin.users.manage' })
|
||||
canViewSchools.value = await hasPermission({ userId, permissionCode: 'school_admin.class.manage' }) ||
|
||||
await hasPermission({ userId, permissionCode: 'admin.system.manage' })
|
||||
canManageClass.value = await hasPermission({ userId, permissionCode: 'school_admin.class.manage' })
|
||||
canManageTeachers.value = await hasPermission({ userId, permissionCode: 'school_admin.teacher.manage' })
|
||||
}
|
||||
// 设置页面标题,根据当前路<E5898D>?
|
||||
const setPageTitle = () => {
|
||||
const pages = getCurrentPages()
|
||||
const currentPage = pages[pages.length - 1]
|
||||
// @ts-ignore
|
||||
const route = currentPage?.route ?? ''
|
||||
if (route.includes('/admin/index')) pageTitle.value = '后台首页'
|
||||
else if (route.includes('/admin/schools')) pageTitle.value = '学校管理'
|
||||
else if (route.includes('/admin/classes')) pageTitle.value = '班级管理'
|
||||
else if (route.includes('/admin/teachers')) pageTitle.value = '教师管理'
|
||||
else if (route.includes('/admin/users')) pageTitle.value = '用户管理'
|
||||
else if (route.includes('/admin/roles')) pageTitle.value = '角色权限管理'
|
||||
else if (route.includes('/admin/settings')) pageTitle.value = '系统设置'
|
||||
else if (route.includes('/admin/training')) pageTitle.value = '训练计划'
|
||||
else if (route.includes('/admin/assignments')) pageTitle.value = '作业管理'
|
||||
else if (route.includes('/admin/analytics')) pageTitle.value = '数据分析'
|
||||
else pageTitle.value = '后台管理'
|
||||
}
|
||||
// 获取通知列表
|
||||
const fetchNotifications = async () => {
|
||||
loadingNotifications.value = true
|
||||
try {
|
||||
const { data, error } = await db.from('ak_notifications')
|
||||
.select('*', {})
|
||||
.eq('user_id', currentUser.id)
|
||||
.order('created_at', { ascending: false })
|
||||
.limit(50)
|
||||
.execute()
|
||||
if (error != null) return if (Array.isArray(data)) {
|
||||
notifications.value = data as UTSJSONObject[]
|
||||
|
||||
// Replace filter with for loop for UTS compatibility
|
||||
let unreadCountValue = 0
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
const n = data[i] as UTSJSONObject
|
||||
if (n.get('status') === 'unread') {
|
||||
unreadCountValue++
|
||||
}
|
||||
}
|
||||
unreadCount.value = unreadCountValue
|
||||
} else {
|
||||
notifications.value = []
|
||||
unreadCount.value = 0
|
||||
}
|
||||
} catch (error) {
|
||||
} finally {
|
||||
loadingNotifications.value = false
|
||||
}
|
||||
}
|
||||
// 阅读通知
|
||||
const readNotification = async (notification: UTSJSONObject) => {
|
||||
if (notification.get('status') === 'unread') {
|
||||
try {
|
||||
const result = await db.from('ak_notifications')
|
||||
.update({ status: 'read' })
|
||||
.eq('id', `${notification.get('id') ?? ''}`)
|
||||
.execute()
|
||||
const error = result.error
|
||||
if (error == null) {
|
||||
notification.set('status', 'read')
|
||||
unreadCount.value--
|
||||
}
|
||||
} catch (error) {}
|
||||
}
|
||||
}
|
||||
// 标记所有为已读
|
||||
const markAllAsRead = async () => {
|
||||
try {
|
||||
const result = await db.from('ak_notifications')
|
||||
.update({ status: 'read' })
|
||||
.eq('user_id', currentUser.id)
|
||||
.eq('status', 'unread')
|
||||
.execute()
|
||||
const error = result.error if (error == null) {
|
||||
// Replace map with for loop for UTS compatibility
|
||||
for (let i = 0; i < notifications.value.length; i++) {
|
||||
const n = notifications.value[i]
|
||||
n.set('status', 'read')
|
||||
}
|
||||
unreadCount.value = 0
|
||||
}
|
||||
} catch (error) {}
|
||||
}
|
||||
const padZero = (num: number): string => num < 10 ? `0${num}` : `${num}`
|
||||
const formatNotificationTime = (timeStr: string): string => {
|
||||
const date = new Date(timeStr)
|
||||
const now = new Date()
|
||||
const diffMs = now.getTime() - date.getTime()
|
||||
const diffMins = Math.floor(diffMs / 60000)
|
||||
const diffHours = Math.floor(diffMins / 60)
|
||||
const diffDays = Math.floor(diffHours / 24)
|
||||
if (diffMins < 1) return '刚刚'
|
||||
else if (diffMins < 60) return `${diffMins}分钟前`
|
||||
else if (diffHours < 24) return `${diffHours}小时前`
|
||||
else if (diffDays < 30) return `${diffDays}天前`
|
||||
else return `${date.getFullYear()}-${padZero(date.getMonth() + 1)}-${padZero(date.getDate())}`
|
||||
}
|
||||
const toggleSidebar = () => { sidebarCollapsed.value = !sidebarCollapsed.value }
|
||||
const toggleUserMenu = (e: Event) => { e.stopPropagation(); showUserMenu.value = !showUserMenu.value }
|
||||
const closeAllPopups = () => { showUserMenu.value = false; showNotificationDrawer.value = false }
|
||||
const showNotifications = () => { showNotificationDrawer.value = true; fetchNotifications() }
|
||||
const updatePassword = async () => {
|
||||
if (passwordForm.oldPassword == null || passwordForm.oldPassword == '') { uni.showToast({ title: '请输入当前密<E5898D>?, icon: 'none' }); return }
|
||||
if (passwordForm.newPassword == null || passwordForm.newPassword == '') { uni.showToast({ title: '请输入新密码', icon: 'none' }); return }
|
||||
if (passwordForm.newPassword !== passwordForm.confirmPassword) { uni.showToast({ title: '两次输入的密码不一<E4B88D>?, icon: 'none' }); return }
|
||||
try {
|
||||
const { error } = await db.rpc('change_user_password', {
|
||||
p_old_password: passwordForm.oldPassword,
|
||||
p_new_password: passwordForm.newPassword
|
||||
})
|
||||
if (error != null) {
|
||||
uni.showToast({ title: '更新密码失败: ' + (error?.message ?? ''), icon: 'none' }); return
|
||||
}
|
||||
uni.showToast({ title: '密码更新成功', icon: 'success' })
|
||||
showPasswordModal.value = false
|
||||
passwordForm.oldPassword = ''
|
||||
passwordForm.newPassword = ''
|
||||
passwordForm.confirmPassword = ''
|
||||
} catch (error) {
|
||||
uni.showToast({ title: '更新密码失败', icon: 'none' })
|
||||
}
|
||||
}
|
||||
const changePassword = () => { showUserMenu.value = false; showPasswordModal.value = true }
|
||||
const logout = async () => {
|
||||
try {
|
||||
await doLogout()
|
||||
uni.reLaunch({ url: '/pages/user/login' })
|
||||
} catch (error) {}
|
||||
}
|
||||
const isActive = (route: string): boolean => {
|
||||
const pages = getCurrentPages()
|
||||
const currentPage = pages[pages.length - 1]
|
||||
let currentRoute = ''
|
||||
if (currentPage != null && typeof currentPage.route === 'string') {
|
||||
currentRoute = currentPage.route ?? ''
|
||||
}
|
||||
return currentRoute.indexOf(route) !== -1
|
||||
}
|
||||
const navigateTo = (url: string) => { uni.navigateTo({ url }) }
|
||||
const init = async () => {
|
||||
// 检查是否已登录,未登录直接跳转登录<E799BB>?
|
||||
console.log('layout init')
|
||||
const userData = await getCurrentUser()
|
||||
console.log('layout getcurrentuser',userData)
|
||||
if (userData == null || userData.id==null) {
|
||||
uni.redirectTo({ url: '/pages/user/login' })
|
||||
return
|
||||
}
|
||||
else
|
||||
{
|
||||
currentUser.id = userData.id??""
|
||||
currentUser.username = userData.username??""
|
||||
currentUser.email = userData.email??""
|
||||
currentUser.avatar_url = userData.avatar_url
|
||||
currentUser.role = userData.role??"anon"
|
||||
}
|
||||
await checkPermissions()
|
||||
fetchNotifications()
|
||||
setPageTitle()
|
||||
}
|
||||
onMounted(() => { init() })
|
||||
onUnmounted(() => {})
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.admin-layout {
|
||||
display: flex;
|
||||
width: 100%; }
|
||||
|
||||
/* 侧边栏样<E6A08F>?*/
|
||||
.admin-sidebar {
|
||||
width: 240px; background-color: #001529;
|
||||
color: rgba(255, 255, 255, 0.65);
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
z-index: 1000;
|
||||
transition: width 0.2s;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.admin-sidebar.collapsed {
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.sidebar-header {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 16px;
|
||||
box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.1);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.logo {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.logo-text {
|
||||
margin-left: 10px;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #fff;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.toggle-btn {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 18px;
|
||||
font-size: 14px;
|
||||
color: rgba(255, 255, 255, 0.65);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.menu-container {
|
||||
height: calc(100% - 60px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.menu-section {
|
||||
padding: 10px 0;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.menu-section:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.menu-header {
|
||||
padding: 8px 16px;
|
||||
font-size: 12px;
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
padding: 8px 16px;
|
||||
display: flex; align-items: center;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.3s ease;
|
||||
}
|
||||
|
||||
.menu-item.active {
|
||||
background-color: #1890ff;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
font-size: 18px;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
.menu-text {
|
||||
font-size: 14px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
/* 主内容区样式 */
|
||||
.admin-main {
|
||||
flex: 1;
|
||||
margin-left: 240px; transition: margin-left 0.2s;
|
||||
display: flex;
|
||||
flex-direction: column; }
|
||||
|
||||
.admin-header {
|
||||
height: 60px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
padding: 0 20px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.header-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.header-title {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.header-right {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.notification-btn {
|
||||
position: relative;
|
||||
margin-right: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.notification-icon {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.badge {
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
right: -8px;
|
||||
min-width: 16px;
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
padding: 0 4px;
|
||||
border-radius: 8px;
|
||||
background-color: #f5222d;
|
||||
color: white;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.user-dropdown {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border-radius: 16px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.username {
|
||||
font-size: 14px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.dropdown-icon {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
right: 0;
|
||||
background-color: #fff;
|
||||
min-width: 120px;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
|
||||
overflow: hidden;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
padding: 8px 16px;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.dropdown-item.logout {
|
||||
color: #f5222d;
|
||||
}
|
||||
|
||||
.admin-content {
|
||||
flex: 1;
|
||||
padding: 20px;
|
||||
background-color: #f0f2f5;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
/* 通知抽屉样式 */
|
||||
.notification-drawer {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: 380px;
|
||||
z-index: 1001;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.drawer-content {
|
||||
width: 100%; background-color: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.drawer-header {
|
||||
padding: 16px;
|
||||
border-bottom: 1px solid #e8e8e8;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.drawer-title {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.close-btn {
|
||||
font-size: 20px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.drawer-tabs {
|
||||
display: flex;
|
||||
border-bottom: 1px solid #e8e8e8;
|
||||
}
|
||||
|
||||
.drawer-tab {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
padding: 10px 0;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.drawer-tab.active {
|
||||
color: #1890ff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.drawer-tab.active::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: -1px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 2px;
|
||||
background-color: #1890ff;
|
||||
}
|
||||
|
||||
.drawer-body {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.loading-state, .empty-state {
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.notification-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.notification-item {
|
||||
padding: 12px 16px;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.notification-item.unread {
|
||||
background-color: #e6f7ff;
|
||||
}
|
||||
|
||||
.notification-title {
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 4px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.notification-content {
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
margin-bottom: 4px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.notification-time {
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.drawer-footer {
|
||||
padding: 16px;
|
||||
border-top: 1px solid #e8e8e8;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.mark-all-read {
|
||||
width: 100%;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
background-color: #1890ff;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
/* 修改密码模态框 */
|
||||
.modal {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 1002;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
background-color: white;
|
||||
width: 400px;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.modal-header {
|
||||
padding: 15px;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.modal-title {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.form-label {
|
||||
display: block;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.modal-body input {
|
||||
width: 100%;
|
||||
height: 36px;
|
||||
border: 1px solid #dcdfe6;
|
||||
border-radius: 4px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
padding: 10px 15px;
|
||||
border-top: 1px solid #ebeef5;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.cancel-btn, .submit-btn {
|
||||
padding: 8px 15px;
|
||||
border-radius: 4px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.cancel-btn {
|
||||
border: 1px solid #dcdfe6;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
background-color: #1890ff;
|
||||
color: white;
|
||||
border: none;
|
||||
}
|
||||
|
||||
/* 遮罩<E981AE>?*/
|
||||
.overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
z-index: 999;
|
||||
}
|
||||
</style>
|
||||
77
pages/admins/permission-management.uvue
Normal file
77
pages/admins/permission-management.uvue
Normal file
@@ -0,0 +1,77 @@
|
||||
<template>
|
||||
<view class="permission-management-page">
|
||||
<text class="page-title">{{ $t('perm_mgmt.title') }}</text>
|
||||
<supadb
|
||||
ref="permdb"
|
||||
:collection="'ak_roles'"
|
||||
:field="'*'"
|
||||
:where="where"
|
||||
:orderby="'level desc'"
|
||||
:page-size="pageSize"
|
||||
:page-current="pageCurrent"
|
||||
getcount="exact"
|
||||
loadtime="manual"
|
||||
v-slot:default="{ data, pagination, loading, error }"
|
||||
@load="onRoleLoad"
|
||||
>
|
||||
<view v-if="loading">{{ $t('common.loading') }}</view>
|
||||
<view v-else-if="error">{{ error }}</view>
|
||||
<view v-else>
|
||||
<view class="table-header">
|
||||
<text>{{ $t('role.name') }}</text>
|
||||
<text>{{ $t('role.level') }}</text>
|
||||
<text>{{ $t('role.description') }}</text>
|
||||
<text>{{ $t('common.action') }}</text>
|
||||
</view>
|
||||
<view v-for="role in data" :key="role.get('id')" class="table-row">
|
||||
<text>{{ role.get('name') }}</text>
|
||||
<text>{{ role.get('level') }}</text>
|
||||
<text>{{ role.get('description') }}</text>
|
||||
<button @click="editRole(role)">{{ $t('common.edit') }}</button>
|
||||
<button @click="deleteRole(role)">{{ $t('common.delete') }}</button>
|
||||
</view>
|
||||
<view class="pagination">
|
||||
<button @click="prevPage(pagination)" :disabled="pagination.current <= 1">{{ $t('common.prev') }}</button>
|
||||
<span>{{ pagination.current }}/{{ pagination.total }}</span>
|
||||
<button @click="nextPage(pagination)" :disabled="pagination.current >= pagination.total">{{ $t('common.next') }}</button>
|
||||
</view>
|
||||
</view>
|
||||
</supadb>
|
||||
<!-- 权限分配、编辑弹窗等可后续补<E7BBAD>?-->
|
||||
</view>
|
||||
</template>
|
||||
<script lang="uts">
|
||||
export default {
|
||||
name: 'PermissionManagement',
|
||||
data() {
|
||||
return {
|
||||
where: {},
|
||||
pageSize: 10,
|
||||
pageCurrent: 1
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onRoleLoad(data: any[]) {
|
||||
// 可处理数<E79086>?
|
||||
},
|
||||
prevPage(pagination: any) {
|
||||
if (pagination.current > 1) this.pageCurrent--;
|
||||
},
|
||||
nextPage(pagination: any) {
|
||||
if (pagination.current < pagination.total) this.pageCurrent++;
|
||||
},
|
||||
editRole(role: any) {
|
||||
// 编辑逻辑
|
||||
},
|
||||
deleteRole(role: any) {
|
||||
// 删除逻辑
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.permission-management-page { padding: 20px; }
|
||||
.table-header, .table-row { display: flex; padding: 16px; align-items: center; }
|
||||
.table-header { font-weight: bold; }
|
||||
.pagination { margin-top: 16px; }
|
||||
</style>
|
||||
1189
pages/admins/roles/index.uvue
Normal file
1189
pages/admins/roles/index.uvue
Normal file
File diff suppressed because it is too large
Load Diff
143
pages/admins/sports/index.uvue
Normal file
143
pages/admins/sports/index.uvue
Normal file
@@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<view class="sports-admin-page">
|
||||
<admin-layout>
|
||||
<view class="container">
|
||||
<view class="page-header">
|
||||
<text class="page-title">运动管理</text>
|
||||
</view>
|
||||
|
||||
<!-- Tabs -->
|
||||
<view class="swiper-tabs">
|
||||
<scroll-view direction="horizontal" :show-scrollbar="false">
|
||||
<view class="flex-row">
|
||||
<text v-for="(tab, idx) in tabList" :key="tab.key" class="swiper-tabs-item"
|
||||
:class="swiperIndex == idx ? 'swiper-tabs-item-active' : ''" @click="onTabClick(idx)">
|
||||
{{ tab.name }}
|
||||
</text>
|
||||
</view>
|
||||
</scroll-view>
|
||||
<view class="swiper-tabs-indicator" :style="indicatorStyle ?? {}"></view>
|
||||
</view>
|
||||
|
||||
<!-- Swiper Content -->
|
||||
<swiper class="swiper-view" :current="swiperIndex" @change="onSwiperChange">
|
||||
<swiper-item class="swiper-item">
|
||||
<sports-stats />
|
||||
</swiper-item>
|
||||
<swiper-item class="swiper-item">
|
||||
<sports-notifications />
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
</admin-layout>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="uts">
|
||||
import { ref, computed } from 'vue'
|
||||
import SportsStats from './stats.uvue'
|
||||
import SportsNotifications from './notifications.uvue'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
SportsStats,
|
||||
SportsNotifications
|
||||
},
|
||||
setup() {
|
||||
const swiperIndex = ref(0)
|
||||
const tabList = [
|
||||
{ key: 'stats', name: '运动统计' },
|
||||
{ key: 'notifications', name: '通知管理' }
|
||||
]
|
||||
|
||||
const indicatorStyle = computed(() => {
|
||||
const tabWidth = 100 / tabList.length
|
||||
const left = swiperIndex.value * tabWidth
|
||||
return {
|
||||
width: `${tabWidth}%`,
|
||||
left: `${left}%`
|
||||
}
|
||||
})
|
||||
|
||||
const onTabClick = (index: number) => {
|
||||
swiperIndex.value = index
|
||||
}
|
||||
|
||||
const onSwiperChange = (e: any) => {
|
||||
swiperIndex.value = e.detail.current
|
||||
}
|
||||
|
||||
return {
|
||||
swiperIndex,
|
||||
tabList,
|
||||
indicatorStyle,
|
||||
onTabClick,
|
||||
onSwiperChange
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.sports-admin-page {
|
||||
background-color: #f5f5f5;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding: 20px;
|
||||
background-color: #ffffff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
margin: 16px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.swiper-tabs {
|
||||
position: relative;
|
||||
background-color: #FFF;
|
||||
border-bottom: 1px solid #ddd;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.swiper-tabs-item {
|
||||
padding: 10px 20px;
|
||||
font-size: 16px;
|
||||
color: #555;
|
||||
cursor: pointer;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.swiper-tabs-item-active {
|
||||
color: #007aff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.swiper-tabs-indicator {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
height: 3px;
|
||||
background-color: #007aff;
|
||||
transition: left 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
.swiper-view {
|
||||
height: 600px; /* Adjust based on content */
|
||||
}
|
||||
|
||||
.swiper-item {
|
||||
overflow-y: auto;
|
||||
}
|
||||
</style>
|
||||
161
pages/admins/sports/notifications.uvue
Normal file
161
pages/admins/sports/notifications.uvue
Normal file
@@ -0,0 +1,161 @@
|
||||
<template>
|
||||
<view class="notifications-page">
|
||||
<view class="notification-form">
|
||||
<textarea class="textarea" :value="notificationMessage" @input="notificationMessage = $event.detail.value" placeholder="输入通知内容..."></textarea>
|
||||
<button class="send-button" @click="sendNotification">发送通知</button>
|
||||
</view>
|
||||
|
||||
<view class="history-section">
|
||||
<text class="history-title">发送历史</text>
|
||||
<scroll-view class="history-list" direction="vertical">
|
||||
<view v-if="loading" class="loading-container">加载中...</view>
|
||||
<view v-else-if="error" class="error-container">{{ error }}</view>
|
||||
<view v-else-if="history.length === 0" class="empty-data">
|
||||
<text>暂无历史记录</text>
|
||||
</view>
|
||||
<view v-else v-for="item in history" :key="item.id" class="history-item">
|
||||
<text class="history-message">{{ item.message }}</text>
|
||||
<text class="history-date">{{ new Date(item.created_at).toLocaleString() }}</text>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="uts">
|
||||
import { ref, onMounted } from 'vue'
|
||||
import supa from '@/components/supadb/aksupainstance.uts'
|
||||
|
||||
type NotificationHistory = {
|
||||
id: number
|
||||
message: string
|
||||
created_at: string
|
||||
}
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
const notificationMessage = ref('')
|
||||
const history = ref<NotificationHistory[]>([])
|
||||
const loading = ref(false)
|
||||
const error = ref<string | null>(null)
|
||||
|
||||
const fetchHistory = async () => {
|
||||
loading.value = true
|
||||
error.value = null
|
||||
const result = await supa.from('ak_sports_notifications').select('*').order('created_at', { ascending: false }).limit(50).execute()
|
||||
|
||||
if (result.error) {
|
||||
error.value = `加载历史记录失败: ${result.error.message}`
|
||||
} else {
|
||||
history.value = result.data as NotificationHistory[]
|
||||
}
|
||||
loading.value = false
|
||||
}
|
||||
|
||||
const sendNotification = async () => {
|
||||
if (notificationMessage.value.trim() === '') {
|
||||
uni.showToast({ title: '通知内容不能为空', icon: 'none' })
|
||||
return
|
||||
}
|
||||
|
||||
// In a real app, this would trigger a push notification service.
|
||||
// Here, we just save it to the database as a record.
|
||||
const insertResult = await supa.from('ak_sports_notifications').insert({ message: notificationMessage.value }).execute()
|
||||
|
||||
if (insertResult.error) {
|
||||
uni.showToast({ title: `发送失败: ${insertResult.error.message}`, icon: 'none' })
|
||||
} else {
|
||||
uni.showToast({ title: '通知已记录', icon: 'success' })
|
||||
notificationMessage.value = ''
|
||||
fetchHistory() // Refresh history
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
fetchHistory()
|
||||
})
|
||||
|
||||
return {
|
||||
notificationMessage,
|
||||
history,
|
||||
loading,
|
||||
error,
|
||||
sendNotification
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.notifications-page {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.notification-form {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.textarea {
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 5px;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.send-button {
|
||||
background-color: #007aff;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 12px 15px;
|
||||
border-radius: 5px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.history-section {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.history-title {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 10px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.history-list {
|
||||
max-height: 400px;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.empty-data, .loading-container, .error-container {
|
||||
text-align: center;
|
||||
padding: 40px;
|
||||
color: #888;
|
||||
}
|
||||
|
||||
.history-item {
|
||||
padding: 15px;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.history-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.history-message {
|
||||
display: block;
|
||||
color: #333;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.history-date {
|
||||
display: block;
|
||||
color: #999;
|
||||
font-size: 12px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
</style>
|
||||
155
pages/admins/sports/stats.uvue
Normal file
155
pages/admins/sports/stats.uvue
Normal file
@@ -0,0 +1,155 @@
|
||||
<template>
|
||||
<view class="sports-stats-page">
|
||||
<view class="stats-controls">
|
||||
<picker mode="date" :value="selectedDate" @change="onDateChange">
|
||||
<view class="picker">
|
||||
当前选择: {{ selectedDate }}
|
||||
</view>
|
||||
</picker>
|
||||
<button @click="fetchStats">查询</button>
|
||||
</view>
|
||||
|
||||
<view v-if="loading" class="loading-container">加载中...</view>
|
||||
<view v-else-if="error" class="error-container">{{ error }}</view>
|
||||
<view v-else class="stats-container">
|
||||
<view class="stat-card">
|
||||
<text class="stat-title">总步数</text>
|
||||
<text class="stat-value">{{ summary.total_steps ?? 0 }}</text>
|
||||
</view>
|
||||
<view class="stat-card">
|
||||
<text class="stat-title">总距离 (米)</text>
|
||||
<text class="stat-value">{{ summary.total_distance?.toFixed(2) ?? 0 }}</text>
|
||||
</view>
|
||||
<view class="stat-card">
|
||||
<text class="stat-title">平均心率</text>
|
||||
<text class="stat-value">{{ summary.avg_heart_rate?.toFixed(1) ?? 0 }}</text>
|
||||
</view>
|
||||
<view class="stat-card">
|
||||
<text class="stat-title">活跃用户</text>
|
||||
<text class="stat-value">{{ summary.active_users ?? 0 }}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- Add charts here later -->
|
||||
<view class="chart-container">
|
||||
<text>图表区域</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="uts">
|
||||
import { ref, reactive, onMounted } from 'vue'
|
||||
import supa from '@/components/supadb/aksupainstance.uts'
|
||||
|
||||
type SportsSummary = {
|
||||
total_steps: number
|
||||
total_distance: number
|
||||
avg_heart_rate: number
|
||||
active_users: number
|
||||
}
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
const selectedDate = ref(new Date().toISOString().slice(0, 10))
|
||||
const loading = ref(false)
|
||||
const error = ref<string | null>(null)
|
||||
const summary = reactive < SportsSummary > ({
|
||||
total_steps: 0,
|
||||
total_distance: 0,
|
||||
avg_heart_rate: 0,
|
||||
active_users: 0
|
||||
})
|
||||
|
||||
const onDateChange = (e: any) => {
|
||||
selectedDate.value = e.detail.value
|
||||
}
|
||||
|
||||
const fetchStats = async () => {
|
||||
loading.value = true
|
||||
error.value = null
|
||||
|
||||
const date = selectedDate.value
|
||||
const result = await supa.rpc('get_daily_sports_stats', { query_date: date })
|
||||
|
||||
if (result.error) {
|
||||
error.value = `获取统计数据失败: ${result.error.message}`
|
||||
console.error(result.error)
|
||||
} else if (result.data) {
|
||||
const stats = result.data[0]
|
||||
summary.total_steps = stats.total_steps
|
||||
summary.total_distance = stats.total_distance
|
||||
summary.avg_heart_rate = stats.avg_heart_rate
|
||||
summary.active_users = stats.active_users
|
||||
}
|
||||
|
||||
loading.value = false
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
fetchStats()
|
||||
})
|
||||
|
||||
return {
|
||||
selectedDate,
|
||||
loading,
|
||||
error,
|
||||
summary,
|
||||
onDateChange,
|
||||
fetchStats
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.sports-stats-page {
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
.stats-controls {
|
||||
display: flex;
|
||||
gap: 15px;
|
||||
margin-bottom: 20px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.stats-controls .picker {
|
||||
border: 1px solid #ccc;
|
||||
padding: 8px 12px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.stats-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
.stat-card {
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 4px rgba(0,0,0,0.05);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.stat-title {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
display: block;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.stat-value {
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.chart-container {
|
||||
margin-top: 30px;
|
||||
padding: 20px;
|
||||
background-color: #fff;
|
||||
border-radius: 8px;
|
||||
}
|
||||
</style>
|
||||
303
pages/admins/user-management.uvue
Normal file
303
pages/admins/user-management.uvue
Normal file
@@ -0,0 +1,303 @@
|
||||
<template>
|
||||
<view class="user-management-page">
|
||||
<text class="page-title">{{ $t('user_mgmt.title') }}</text>
|
||||
<view class="search-bar">
|
||||
<input class="searchinput" type="text" v-model="searchQuery" placeholder="Search users..." />
|
||||
<button class="searchbutton" @click="searchUsers">{{ $t('common.search') }}</button>
|
||||
</view>
|
||||
<supadb
|
||||
ref="userdb"
|
||||
:collection="'ak_users'"
|
||||
:field="'*'"
|
||||
:filter="where"
|
||||
:orderby="'id.desc'"
|
||||
:page-size="pageSize"
|
||||
:page-current="pageCurrent"
|
||||
getcount="exact"
|
||||
loadtime="manual"
|
||||
v-slot:default="{ data, pagination, loading, current, total, error }"
|
||||
@load="onUserLoad"
|
||||
>
|
||||
<view v-if="loading">{{ $t('common.loading') }}</view>
|
||||
<view v-else-if="error">{{ error }}</view>
|
||||
<view v-else>
|
||||
<!-- Large Screen Layout (Table) -->
|
||||
<view class="table-view">
|
||||
<view class="table-header">
|
||||
<text>{{ $t('user.username') }}</text>
|
||||
<text>{{ $t('user.email') }}</text>
|
||||
<text>{{ $t('user.role') }}</text>
|
||||
<text>{{ $t('user.created_at') }}</text>
|
||||
<text>{{ $t('common.action') }}</text>
|
||||
</view>
|
||||
<view v-for="(user, idx) in (data as Array<UTSJSONObject>)" :key="user.get('id')" :class="['table-row', idx % 2 === 0 ? 'row-even' : 'row-odd']">
|
||||
<text>{{ user.get('username') }}</text>
|
||||
<text>{{ user.get('email') }}</text>
|
||||
<text>{{ user.get('role') }}</text>
|
||||
<text>{{ user.get('created_at') }}</text>
|
||||
<view class="action-buttons">
|
||||
<button @click="editUser(user)">{{ $t('common.edit') }}</button>
|
||||
<button @click="deleteUser(user)">{{ $t('common.delete') }}</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- Small Screen Layout (Cards) -->
|
||||
<view class="card-view">
|
||||
<view v-for="(user, idx) in (data as Array<UTSJSONObject>)" :key="user.get('id')" :class="['user-card', idx % 2 === 0 ? 'row-even' : 'row-odd']">
|
||||
<view class="card-row">
|
||||
<text class="card-label">{{ $t('user.username') }}:</text>
|
||||
<text class="card-value">{{ user.get('username') }}</text>
|
||||
</view>
|
||||
<view class="card-row">
|
||||
<text class="card-label">{{ $t('user.email') }}:</text>
|
||||
<text class="card-value">{{ user.get('email') }}</text>
|
||||
</view>
|
||||
<view class="card-row">
|
||||
<text class="card-label">{{ $t('user.role') }}:</text>
|
||||
<text class="card-value">{{ user.get('role') }}</text>
|
||||
</view>
|
||||
<view class="card-row">
|
||||
<text class="card-label">{{ $t('user.created_at') }}:</text>
|
||||
<text class="card-value">{{ user.get('created_at') }}</text>
|
||||
</view>
|
||||
<view class="card-actions">
|
||||
<button @click="editUser(user)">{{ $t('common.edit') }}</button>
|
||||
<button @click="deleteUser(user)">{{ $t('common.delete') }}</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="pagination">
|
||||
<button @click="prevPage(pagination!!)">{{ $t('common.prev') }}</button>
|
||||
<text>{{ current}}/{{ total }}</text>
|
||||
<button @click="nextPage(pagination!!)">{{ $t('common.next') }}</button>
|
||||
<button v-if="hasMoreData" @click="continueIteration()">{{ $t('common.continueToIterate') }}</button>
|
||||
</view>
|
||||
</view>
|
||||
</supadb>
|
||||
<!-- 编辑/新增弹窗等可后续补充 -->
|
||||
</view>
|
||||
</template>
|
||||
<script lang="uts">
|
||||
import supa from '@/components/supadb/aksupainstance.uts';
|
||||
|
||||
|
||||
export default {
|
||||
name: 'UserManagement',
|
||||
data() {
|
||||
return {
|
||||
supadb: null as SupadbComponentPublicInstance | null,
|
||||
where: {},
|
||||
pageSize: 10,
|
||||
pageCurrent: 1,
|
||||
searchQuery: '',
|
||||
screenWidth: uni.getSystemInfoSync().windowWidth,
|
||||
hasMoreData: false
|
||||
}
|
||||
},
|
||||
onReady() {
|
||||
this.supadb = this.$refs["userdb"] as SupadbComponentPublicInstance;
|
||||
// supa.from('system_dept').select(*).or('"name.like.%20%,email.like.%202%");
|
||||
this.supadb?.loadData?.({ clear: false })
|
||||
|
||||
},
|
||||
methods: {
|
||||
onUserLoad(data: any[]) {
|
||||
// 可处理数<E79086>?
|
||||
this.hasMoreData = data.length === this.pageSize;
|
||||
},
|
||||
async prevPage(pagination: any) {
|
||||
this.pageCurrent--;
|
||||
await nextTick();
|
||||
this.supadb?.loadData?.({ clear: false })
|
||||
},
|
||||
async nextPage(pagination: any) {
|
||||
this.pageCurrent++;
|
||||
await nextTick();
|
||||
this.supadb?.loadData?.({ clear: false })
|
||||
},
|
||||
editUser(user: UTSJSONObject) {
|
||||
// 编辑逻辑
|
||||
console.log(user)
|
||||
uni.navigateTo({
|
||||
url:'/pages/admins/users/detail?id='+ user.getString("id")
|
||||
})
|
||||
},
|
||||
deleteUser(user: any) {
|
||||
// 删除逻辑
|
||||
},
|
||||
async searchUsers() {
|
||||
// Implement search logic
|
||||
if (this.searchQuery!=null) {
|
||||
// this.where = {
|
||||
// text: this.searchQuery,
|
||||
// column: ['username', 'email', 'role']
|
||||
// };
|
||||
// this.where = { email: { ilike: '%'+this.searchQuery+'%' }} as UTSJSONObject
|
||||
this.where ={ or:"username.like.%"+this.searchQuery+"%,email.like.%"+this.searchQuery+"%"}
|
||||
} else {
|
||||
this.where = {};
|
||||
}
|
||||
console.log(this.where)
|
||||
this.pageCurrent = 1;
|
||||
await nextTick();
|
||||
this.supadb?.loadData?.({ clear: true });
|
||||
},
|
||||
async continueIteration() {
|
||||
this.pageCurrent++;
|
||||
await nextTick();
|
||||
this.supadb?.loadData?.({ clear: false })
|
||||
}
|
||||
},
|
||||
onResize(size) {
|
||||
// 这里处理页面尺寸变化
|
||||
this.screenWidth = size.size.windowWidth;
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.user-management-page {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.search-bar {
|
||||
display: flex;
|
||||
margin-bottom: 16px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
/* Table View (Large Screens) */
|
||||
.table-view {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.table-header, .table-row {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
padding: 16px;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.table-header {
|
||||
font-weight: bold;
|
||||
padding-bottom: 8px;
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.table-header text, .table-row text {
|
||||
flex: 1;
|
||||
padding: 8px 4px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.table-row {
|
||||
border-bottom: 1px solid #eee;
|
||||
padding: 8px 0;
|
||||
}
|
||||
|
||||
.table-row:nth-child(even) {
|
||||
background-color: #f7f7fa;
|
||||
}
|
||||
.table-row:nth-child(odd) {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.action-buttons {
|
||||
display: flex;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
/* Card View (Small Screens) */
|
||||
.card-view {
|
||||
display: none;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.user-card {
|
||||
border: 1px solid #eee;
|
||||
border-radius: 8px;
|
||||
padding: 16px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.user-card:nth-child(even) {
|
||||
background-color: #f7f7fa;
|
||||
}
|
||||
.user-card:nth-child(odd) {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.card-row {
|
||||
display: flex;
|
||||
padding: 4px 0;
|
||||
}
|
||||
|
||||
.card-label {
|
||||
font-weight: bold;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.card-value {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.card-actions {
|
||||
display: flex;
|
||||
padding: 8px;
|
||||
margin-top: 12px;
|
||||
/* justify-content: flex-end; */
|
||||
}
|
||||
|
||||
.pagination {
|
||||
margin-top: 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 16px;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* Responsive Design */
|
||||
@media screen and (max-width: 768px) {
|
||||
.table-view {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.card-view {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.search-bar {
|
||||
flex-direction: row;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 769px) {
|
||||
.table-view {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.card-view {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.row-even { background-color: #f7f7fa; }
|
||||
.row-odd { background-color: #fff; }
|
||||
.searchbutton{
|
||||
width:200rpx;
|
||||
height:80rpx;
|
||||
}
|
||||
.searchinput{
|
||||
flex:1;
|
||||
}
|
||||
</style>
|
||||
1423
pages/admins/users/detail.uvue
Normal file
1423
pages/admins/users/detail.uvue
Normal file
File diff suppressed because it is too large
Load Diff
1423
pages/admins/users/detail.uvue.backup
Normal file
1423
pages/admins/users/detail.uvue.backup
Normal file
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user