feat(mobile): SVG icon system + team disband feature
图标/界面优化(问题1): - new MobileIcon.vue: 统一 SVG 图标组件(40+ 图标,2px 描边风,currentColor) - 重画占位图 default-avatar.svg / game-placeholder.svg(去 emoji,纯描边) - 替换全部 emoji 为 SVG:登录品牌🎮、组队🔊、事件🕐📍、胜出🏆、人气🔥、 邀请🔗🎮、状态切换⚫🟢🔴 等 - 重做底部 Tab 栏:van-icon 默认 → 自定义 SVG(激活态主色高亮) - 顶部栏 bell、群组详情快捷入口(账本/资产/黑名单)换 SVG - mobile.css 全局体验增强:按钮按压反馈、空状态、骨架屏工具类、 页面淡入动画、Toast 刘海屏适配、滚动条隐藏、省略号工具类 组队解散功能(问题2): - ActivityFeedMobile 补结束/解散按钮(招募中→解散,游戏中→结束游戏) - 调用 teamStore.finishGame(),带确认弹窗 - 与 PC 端 TeamSessionPanel 行为一致(session 存在且招募/游戏中时群组成员可操作) build verified: vue-tsc + vite build pass
This commit is contained in:
@@ -44,11 +44,11 @@ function selectGroup(groupId: string) {
|
||||
router.push({ name: 'GroupView', params: { id: groupId } })
|
||||
}
|
||||
|
||||
// 一键切换状态(空闲/离开/工作中循环)
|
||||
// 状态切换选项
|
||||
const statusActions = [
|
||||
{ status: 'idle' as const, label: '空闲', icon: '🟢' },
|
||||
{ status: 'away' as const, label: '离开', icon: '⚫' },
|
||||
{ status: 'working' as const, label: '工作中', icon: '🔴' },
|
||||
{ status: 'idle' as const, label: '空闲', color: 'var(--gg-success)' },
|
||||
{ status: 'away' as const, label: '离开', color: 'var(--gg-text-muted)' },
|
||||
{ status: 'working' as const, label: '工作中', color: 'var(--gg-danger)' },
|
||||
]
|
||||
|
||||
const showStatusSheet = ref(false)
|
||||
@@ -191,12 +191,20 @@ function goSession() {
|
||||
</div>
|
||||
|
||||
<!-- 状态切换 ActionSheet -->
|
||||
<van-action-sheet
|
||||
v-model:show="showStatusSheet"
|
||||
title="切换状态"
|
||||
:actions="statusActions.map(a => ({ name: `${a.icon} ${a.label}`, status: a.status, label: a.label }))"
|
||||
@select="onStatusSelect"
|
||||
/>
|
||||
<van-action-sheet v-model:show="showStatusSheet" title="切换状态">
|
||||
<div class="status-sheet">
|
||||
<div
|
||||
v-for="a in statusActions"
|
||||
:key="a.status"
|
||||
class="status-sheet-item"
|
||||
@click="onStatusSelect(a)"
|
||||
>
|
||||
<span class="status-sheet-dot" :style="{ background: a.color }" />
|
||||
<span class="status-sheet-label">{{ a.label }}</span>
|
||||
<van-icon v-if="userStore.userStatus === a.status" name="success" class="status-sheet-check" />
|
||||
</div>
|
||||
</div>
|
||||
</van-action-sheet>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -261,6 +269,21 @@ function goSession() {
|
||||
.dot-working { background: var(--gg-danger); }
|
||||
.dot-away { background: var(--gg-text-muted); }
|
||||
|
||||
/* 状态切换面板 */
|
||||
.status-sheet { padding: 8px 0 calc(16px + env(safe-area-inset-bottom, 0px)); }
|
||||
.status-sheet-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
padding: 14px 24px;
|
||||
font-size: 15px;
|
||||
color: var(--gg-text);
|
||||
}
|
||||
.status-sheet-item:active { background: var(--gg-bg-elevated); }
|
||||
.status-sheet-dot { width: 10px; height: 10px; border-radius: 50%; }
|
||||
.status-sheet-label { flex: 1; }
|
||||
.status-sheet-check { color: var(--gg-primary); font-size: 18px; }
|
||||
|
||||
.status-note {
|
||||
color: var(--gg-text-muted);
|
||||
overflow: hidden;
|
||||
|
||||
Reference in New Issue
Block a user