index.vue
5.28 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<template>
<view class="workbench-container">
<view class="card">
<view class="card-title">日常管理</view>
<view class="menu-grid">
<view class="menu-item" v-for="item in dailyMenuList" :key="item.id" @click="handleMenuClick(item)">
<image class="menu-icon" :src="item.icon || '/static/imgs/logo.png'" mode="aspectFit"></image>
<view class="menu-text">{{ item.name }}</view>
</view>
</view>
</view>
<view class="card">
<view class="card-title">问题管理</view>
<view class="menu-grid">
<view class="menu-item" v-for="item in problemMenuList" :key="item.id" @click="handleMenuClick(item)">
<image class="menu-icon" :src="item.icon || '/static/imgs/logo.png'" mode="aspectFit"></image>
<view class="menu-text">{{ item.name }}</view>
</view>
</view>
</view>
<view class="card">
<view class="card-title">数据管理</view>
<view class="menu-grid">
<view class="menu-item" v-for="item in dataMenuList" :key="item.id" @click="handleMenuClick(item)">
<image class="menu-icon" :src="item.icon || '/static/imgs/logo.png'" mode="aspectFit"></image>
<view class="menu-text">{{ item.name }}</view>
</view>
</view>
</view>
</view>
</template>
<script setup>
import { ref } from 'vue';
// 关键：导入 uni-app 页面生命周期钩子
import { onLoad } from '@dcloudio/uni-app';
import { useUserStore } from '@/pinia/user';
import { getDailyManageMenu, getProblemManageMenu } from '@/api/workbench';
const userStore = useUserStore();
const dailyMenuList = ref([
{ id: 1, name: '巡查计划', path: '/pages-sub/daily/patrol-manage/patrol-plan/index' },
{ id: 2, name: '工单上报', path: '/pages-sub/daily/work-order/index' },
{ id: 3, name: '快速工单', path: '/pages-sub/daily/quick-order/index' },
{ id: 4, name: '12345工单', path: '/pages-sub/daily/12345-order/index' },
{ id: 5, name: '巡查管理', path: '/pages-sub/daily/patrol-manage/index' },
{ id: 6, name: '养护管理', path: '/pages-sub/daily/maintain-manage/index' }
]);
const problemMenuList = ref([]);
const dataMenuList = ref([
{ id: 1, name: '基础数据', path: '/pages-sub/data/base-data/index' },
{ id: 2, name: '人员轨迹', path: '/pages-sub/data/personnel-track/index' },
{ id: 3, name: '人员管理', path: '/pages-sub/data/personnel-manage/index' },
{ id: 4, name: '行道树档案', path: '/pages-sub/data/tree-archive/index' }
]);
// 页面加载时加载菜单数据
onLoad(async () => {
// await loadMenuData();
});
const loadMenuData = async () => {
try {
const [dailyRes, problemRes] = await Promise.all([getDailyManageMenu(), getProblemManageMenu()]);
dailyMenuList.value = dailyRes || [
{ id: 1, name: '巡查计划', path: '/pages-sub/daily/patrol-manage/patrol-plan/index' },
{ id: 2, name: '工单上报', path: '/pages-sub/daily/work-order/index' },
{ id: 3, name: '快速工单', path: '/pages-sub/daily/quick-order/index' },
{ id: 4, name: '12345工单', path: '/pages-sub/daily/12345-order/index' },
{ id: 5, name: '巡查管理', path: '/pages-sub/daily/patrol-manage/index' },
{ id: 6, name: '养护管理', path: '/pages-sub/daily/maintain-manage/index' }
];
problemMenuList.value = problemRes || [
{ id: 1, name: '工单管理', path: '/pages-sub/problem/order-manage/index' },
{ id: 2, name: '问题分配', path: '/pages-sub/problem/problem-allot/index' }
];
} catch (err) {
console.error('加载菜单失败:', err);
// 兜底数据
dailyMenuList.value = [
{ id: 1, name: '巡查计划', path: '/pages-sub/daily/patrol-manage/patrol-plan/index' },
{ id: 2, name: '工单上报', path: '/pages-sub/daily/work-order/index' },
{ id: 3, name: '快速工单', path: '/pages-sub/daily/quick-order/index' },
{ id: 4, name: '12345工单', path: '/pages-sub/daily/12345-order/index' },
{ id: 5, name: '巡查管理', path: '/pages-sub/daily/patrol-manage/index' },
{ id: 6, name: '养护管理', path: '/pages-sub/daily/maintain-manage/index' }
];
problemMenuList.value = [
{ id: 1, name: '工单管理', path: '/pages-sub/problem/order-manage/index' },
{ id: 2, name: '问题分配', path: '/pages-sub/problem/problem-allot/index' }
];
}
};
const handleMenuClick = (item) => {
// 权限校验
if (item.permission && !userStore.permissions.includes(item.permission)) {
return uni.showToast({ title: '暂无权限', icon: 'none' });
}
// 页面跳转
uni.navigateTo({ url: item.path });
};
</script>
<style scoped>
.workbench-container {
padding: 20rpx;
background: #f8f8f8;
min-height: 100vh;
}
.card {
background: #fff;
border-radius: 10rpx;
padding: 20rpx;
margin-bottom: 20rpx;
}
.card-title {
font-size: 32rpx;
font-weight: bold;
margin-bottom: 20rpx;
padding-bottom: 10rpx;
border-bottom: 1rpx solid #eee;
}
.menu-grid {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
}
.menu-item {
width: 25%;
display: flex;
flex-direction: column;
align-items: center;
padding: 20rpx 10rpx;
box-sizing: border-box;
}
.menu-icon {
width: 80rpx;
height: 80rpx;
margin-bottom: 10rpx;
}
.menu-text {
font-size: 24rpx;
color: #666;
}
</style>
<script setup lang="ts">
</script>