yunzerwebsite/yunzerwebsiteallinone
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

主要更新uniapp相关功能

Browse Source
This commit is contained in:
hero920103 committed 2026-10-07 00:59:05 +08:00
1 parent aa92ca40a2
commit 5b4dbb2b46
65 files changed
+8532 -1921
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

uniapp/pages/features/features.vue
+157 -170
View File
@@ -1,7 +1,7 @@
<template>
<view class="page">
<!-- 吸顶搜索 -->
<view class="search-wrap">
<view class="search-wrap" :style="headPad">
<view class="search-bar">
<FaIcon name="magnifying-glass" color="#8a94ad" :size="16" />
<input
@@ -28,22 +28,21 @@
<FaIcon name="magnifying-glass" color="#c0c4cc" :size="32" />
<text class="empty-text">没有找到「{{ keyword.trim() }}」相关功能</text>
</view>
<view v-else class="list-card">
<view
v-for="item in searchResults"
:key="item.menu.id"
class="list-item"
@tap="openMenu(item.menu, item.menu.title)"
>
<view class="row-icon" :class="item.locked ? 'tint-off' : item.tint">
<FaIcon :name="item.icon" color="#ffffff" :size="16" />
<view v-else class="group-card">
<view class="grid">
<view
v-for="item in searchResults"
:key="item.menu.id"
class="cell"
@tap="openMenu(item.menu, item.menu.title)"
>
<view class="fn-card" :class="{ locked: item.locked }">
<view class="tint-icon fn-icon" :class="item.tint">
<FaIcon :name="item.icon" color="#ffffff" :size="18" />
</view>
<text class="fn-name">{{ item.menu.title }}</text>
</view>
</view>
<view class="row-body">
<text class="row-title">{{ item.menu.title }}</text>
<text class="row-sub">{{ item.moduleName }}</text>
</view>
<text v-if="item.locked" class="row-lock">未开通</text>
<FaIcon v-else name="chevron-right" color="#c8cfdf" :size="12" />
</view>
</view>
</block>
@@ -55,67 +54,39 @@
<text class="empty-text">尚未配置应用模块</text>
</view>
<view v-for="group in groups" :key="group.code || group.id" class="group">
<view v-for="group in groups" :key="group.id" class="group-card">
<view class="group-head">
<view class="tint-icon group-icon" :class="group.tint">
<FaIcon :name="group.icon" color="#ffffff" :size="18" />
</view>
<view class="group-meta">
<view class="group-title-row">
<text class="group-name">{{ group.name }}</text>
<text v-if="group.locked" class="group-lock">未开通</text>
</view>
<text class="group-count">{{ group.items.length }} 个功能</text>
<FaIcon :name="group.icon" color="#ffffff" :size="16" />
</view>
<text class="group-title">{{ group.name }}</text>
<text v-if="group.locked" class="group-lock">未开通</text>
<text class="group-count">{{ group.items.length }}</text>
</view>
<view class="list-card">
<view v-if="group.items.length" class="grid">
<view
v-for="item in group.items"
:key="item.id"
class="list-item"
class="cell"
@tap="openMenu(item, item.title)"
>
<view class="dot" :class="item.locked ? 'off' : 'primary'" />
<view class="row-body">
<text class="row-title">{{ item.title }}</text>
<text v-if="item.path" class="row-sub">{{ item.path }}</text>
<view class="fn-card" :class="{ locked: group.locked || item.locked }">
<view
class="tint-icon fn-icon"
:class="group.locked || item.locked ? 'tint-off' : group.tint"
>
<FaIcon :name="item.icon || group.icon" color="#ffffff" :size="18" />
</view>
<text class="fn-name">{{ item.title }}</text>
</view>
<FaIcon name="chevron-right" color="#c8cfdf" :size="12" />
</view>
<view v-if="group.items.length === 0" class="group-empty">
<text class="group-empty-text">该模块下暂无你可见的功能</text>
</view>
</view>
<view v-else class="group-empty">
<text class="group-empty-text">该模块下暂无你可见的功能</text>
</view>
</view>
<view v-if="commonMenus.length" class="group">
<view class="group-head">
<view class="tint-icon group-icon tint-3">
<FaIcon name="wrench" color="#ffffff" :size="18" />
</view>
<view class="group-meta">
<view class="group-title-row">
<text class="group-name">协作工具</text>
</view>
<text class="group-count">{{ commonMenus.length }} 个功能</text>
</view>
</view>
<view class="list-card">
<view
v-for="item in commonMenus"
:key="item.id"
class="list-item"
@tap="openMenu(item, item.title)"
>
<view class="dot primary" />
<view class="row-body">
<text class="row-title">{{ item.title }}</text>
</view>
<FaIcon name="chevron-right" color="#c8cfdf" :size="12" />
</view>
</view>
</view>
</block>
<view class="bottom-space" />
@@ -127,6 +98,9 @@
<script setup>
import { ref, computed, onMounted } from 'vue'
import { mpHeadPad } from '@/utils/mpHead.js'
const headPad = mpHeadPad()
import { onShow } from '@dcloudio/uni-app'
import { isLoggedIn } from '@/utils/auth.js'
import { fetchHome } from '@/api/workspace.js'
@@ -148,51 +122,77 @@ const loading = ref(true)
const modules = ref([])
const menus = ref([])
/** 按模块 code 归组的全部菜单（含目录与锁定项，便于浏览） */
/**
* 按「一级分类目录」归组，与子系统功能页（SubFunctions.vue）保持一致：
* 菜单层级形如 模块根 → 个人办公 → 通讯录，分组取一级目录名（个人办公 / 人事管理 …）；
* 模块根仅作容器被跳过；无分类归属的顶层功能统一归入「常用功能」。
*/
const groups = computed(() => {
const byCode = {}
const byId = {}
menus.value.forEach((m) => {
if (!m.module) return
if (!byCode[m.module]) byCode[m.module] = []
byCode[m.module].push(m)
byId[m.id] = m
})
// 只有叶子菜单才是可点功能；目录只作为分组标题，避免二级目录被当成卡片塞进组内
const leaves = menus.value
.filter((m) => m.leaf !== false)
.sort((a, b) => (a.sort || 0) - (b.sort || 0))
// 这里展示全部模块（含 type=2 系统设置），与工作台首页只展示业务模块形成分工
const list = modules.value.map((mod, index) => ({
id: mod.id,
code: mod.code,
name: mod.name || '未命名应用',
icon: mod.type === 2 ? 'gear' : MODULE_ICONS[String(mod.code || '').toLowerCase()] || 'cube',
tint: mod.enabled === false ? 'tint-off' : 'tint-' + (index % 8),
locked: mod.enabled === false,
items: (byCode[mod.code] || []).slice().sort((a, b) => a.sort - b.sort)
}))
// 兜底：模块表里没有对应记录（或已删除）的菜单
const known = {}
list.forEach((g) => {
known[String(g.code || '').toLowerCase()] = true
})
const orphan = []
menus.value.forEach((m) => {
const code = String(m.module || '').toLowerCase()
if (code && !known[code]) orphan.push(m)
})
if (orphan.length) {
list.push({
id: 'other',
code: 'other',
name: '其他功能',
icon: 'file-lines',
tint: 'tint-7',
locked: false,
items: orphan
})
// 取该菜单所属的「一级分组」节点（自底向上找到链上最顶层节点）
function groupNodeOf(m) {
const chain = [m]
let cur = m
let guard = 0
while (byId[cur.pid] && guard++ < 20) {
cur = byId[cur.pid]
chain.unshift(cur)
}
const top = chain[0]
if (top.pid === 0) {
// 模块根在列表内：跳过根，取它下一层（个人办公 / 人事管理 …）
if (chain.length >= 2) return chain[1]
// 顶层节点自身：目录容器跳过，叶子归入「常用功能」
return top.leaf === false ? null : top
}
// 模块根不在列表内：链上顶层节点本身就是一级分组
return top
}
return list
})
const commonMenus = computed(() => menus.value.filter((m) => !m.module))
const groupMap = new Map()
const common = { id: 'common', name: '常用功能', sort: -1, icon: 'star', items: [] }
leaves.forEach((m) => {
const g = groupNodeOf(m)
if (!g) return
if (g.id === m.id) {
// 无分类归属的顶层散装功能
common.items.push(m)
return
}
if (!groupMap.has(g.id)) {
groupMap.set(g.id, { id: g.id, name: g.title, sort: g.sort, icon: g.icon, items: [] })
}
groupMap.get(g.id).items.push(m)
})
const dirGroups = []
groupMap.forEach((g) => dirGroups.push(g))
dirGroups.sort((a, b) => (a.sort || 0) - (b.sort || 0))
const all = []
if (common.items.length) all.push(common)
all.push(...dirGroups)
// 组级「未开通」：整组菜单均被锁定；图标底色按分组下标轮换
return all.map((group, gi) => {
const locked = group.items.length > 0 && group.items.every((it) => it.locked === true)
return {
...group,
icon: group.icon || 'file-lines',
tint: locked ? 'tint-off' : 'tint-' + (gi % 8),
locked
}
})
})
/** 跨模块搜索：应用名 + 模块名 + 菜单标题 */
const searchResults = computed(() => {
@@ -257,6 +257,9 @@ onShow(() => {
.search-wrap {
flex-shrink: 0;
padding: calc(var(--status-bar-height, 44px) + 16rpx) $page-padding-x 20rpx;
/* #ifdef MP-WEIXIN */
padding-top: calc(env(safe-area-inset-top, 25px) + 80rpx);
/* #endif */
background: $color-card;
box-shadow: $shadow-header;
}
@@ -323,116 +326,100 @@ onShow(() => {
color: $color-text-muted;
}
.group {
margin-bottom: 32rpx;
/* ============ 分组卡：外层一个 card，内含一行 4 个功能 card ============ */
.group-card {
@include card;
padding: 24rpx 20rpx 8rpx;
& + & {
margin-top: 24rpx;
}
}
.group-head {
display: flex;
align-items: center;
gap: 18rpx;
margin-bottom: 18rpx;
padding: 0 4rpx;
gap: 14rpx;
padding: 0 4rpx 20rpx;
}
.group-icon {
@include tint-icon(72rpx, 18rpx);
@include tint-icon(56rpx, 14rpx);
}
.group-meta {
.group-title {
flex: 1;
min-width: 0;
}
.group-title-row {
display: flex;
align-items: center;
gap: 12rpx;
}
.group-name {
font-size: 30rpx;
font-size: 28rpx;
font-weight: 600;
color: $color-text;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.group-lock {
@include chip(#fef3f2, $color-danger);
flex-shrink: 0;
}
.group-count {
display: block;
margin-top: 4rpx;
font-size: 22rpx;
color: $color-text-muted;
@include chip;
flex-shrink: 0;
}
.list-card {
@include card;
overflow: hidden;
}
.list-item {
/* 功能格子：一行 4 个；cell 占 25% 并自带右间隙，容器负 margin 抵消末列间隙，
避免使用 calc 除法——小程序端 wxss 对复杂 calc 支持不稳。 */
.grid {
display: flex;
align-items: center;
gap: 18rpx;
padding: 26rpx 24rpx;
flex-wrap: wrap;
margin-right: -16rpx;
}
& + & {
border-top: 1rpx solid $color-divider;
}
.cell {
width: 25%;
padding-right: 16rpx;
margin-bottom: 16rpx;
box-sizing: border-box;
}
.fn-card {
height: 100%;
padding: 18rpx 6rpx 16rpx;
border-radius: $radius-md;
background: $color-bg-page;
display: flex;
flex-direction: column;
align-items: center;
gap: 12rpx;
transition: transform 0.15s ease;
&:active {
background: $color-bg-page;
transform: scale(0.95);
}
}
.row-icon {
@include tint-icon(60rpx, 16rpx);
.fn-icon {
@include tint-icon(64rpx, 18rpx);
}
.row-body {
flex: 1;
min-width: 0;
}
.row-title {
display: block;
font-size: 28rpx;
color: $color-text;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-sub {
display: block;
margin-top: 4rpx;
.fn-name {
max-width: 100%;
font-size: 22rpx;
color: $color-text-muted;
line-height: 1.3;
color: $color-text;
text-align: center;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.row-lock {
@include chip(#fef3f2, $color-danger);
}
.dot {
width: 14rpx;
height: 14rpx;
border-radius: 50%;
flex-shrink: 0;
background: $color-text-muted;
&.primary { background: $color-primary; }
&.off { background: $color-border; }
.fn-card.locked .fn-name {
color: $color-text-muted;
}
.group-empty {
padding: 40rpx 24rpx;
text-align: center;
padding: 20rpx 4rpx 16rpx;
}
.group-empty-text {