fix(mobile): replace emoji glyphs with uni-icons and flex centering app-wide
- ChatComposer panel contract: callers now pass uni-icons type names
(image/sound/list/help/checkmark) instead of emoji
- voice playback buttons: sound icon + pulse animation, no more 🔊/◼ chars
- practice recent list: rare symbols ⌕⌁◉ (tofu risk) -> wallet/gear/chatbubble
- sop resource icon ▶/文 -> 视/文 character badges
- back arrows: 22 char-based ← -> uni-icons back across 21 pages
- line-height centering -> flex in 8 spots (back buttons, media-remove,
turn-voice capsule, option-marker, text-button, play-question)
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view class="page employee-page-shell memories-page">
|
||||
<view class="subpage-header">
|
||||
<button class="subpage-back-button" aria-label="返回" @click="goBack">←</button>
|
||||
<button class="subpage-back-button" aria-label="返回" @click="goBack"><uni-icons type="back" size="20" color="#25282d" /></button>
|
||||
<view class="subpage-heading">
|
||||
<text class="employee-kicker">工作助手</text>
|
||||
<text class="page-title">我的资料与记忆</text>
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
title="返回今日"
|
||||
@click="navigateBackToToday"
|
||||
>
|
||||
←
|
||||
<uni-icons type="back" size="20" color="#25282d" />
|
||||
</button>
|
||||
<view class="subpage-heading">
|
||||
<text class="page-title">案例素材</text>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view class="page employee-page-shell exam-page">
|
||||
<view class="subpage-header">
|
||||
<button class="subpage-back-button" aria-label="返回学习" :disabled="submitting" @click="goBack">←</button>
|
||||
<button class="subpage-back-button" aria-label="返回学习" :disabled="submitting" @click="goBack"><uni-icons type="back" size="20" color="#25282d" /></button>
|
||||
<view class="subpage-heading">
|
||||
<text class="employee-kicker">岗前 / 入职考试</text>
|
||||
<text class="page-title">{{ exam?.title || '考试任务' }}</text>
|
||||
@@ -39,7 +39,7 @@
|
||||
:disabled="Boolean(result)"
|
||||
@click="toggleOption(item, option)"
|
||||
>
|
||||
<text class="option-marker">{{ isSelected(item, option) ? '✓' : '' }}</text>
|
||||
<text class="option-marker"><uni-icons v-if="isSelected(item, option)" type="checkmark" size="13" color="#e60012" /></text>
|
||||
<text>{{ option }}</text>
|
||||
</button>
|
||||
</view>
|
||||
@@ -178,7 +178,7 @@ onBeforeUnmount(() => speechController.destroy());
|
||||
.option-list { display: grid; gap: 9px; }
|
||||
.option-button { display: flex; gap: 10px; min-height: 48px; align-items: center; padding: 10px 12px; border: 1px solid var(--line); background: #fff; color: var(--ink); text-align: left; }
|
||||
.option-button.selected { border-color: #ef9ca4; background: var(--employee-primary-soft); }
|
||||
.option-marker { flex: 0 0 24px; height: 24px; border: 1px solid #c8d0db; border-radius: 50%; color: var(--brand); line-height: 22px; text-align: center; }
|
||||
.option-marker { display: flex; flex: 0 0 24px; height: 24px; align-items: center; justify-content: center; border: 1px solid #c8d0db; border-radius: 50%; color: var(--brand); line-height: 1; text-align: center; }
|
||||
.short-answer { min-height: 120px; }
|
||||
.explanation { display: grid; gap: 6px; padding: 12px; border-radius: 10px; background: #f1f6fb; color: #435268; font-size: 13px; line-height: 1.6; }
|
||||
.explanation-title { font-weight: 900; }
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view class="page history-detail-page">
|
||||
<view class="subpage-header">
|
||||
<button class="subpage-back-button" aria-label="返回我的页面" title="返回我的页面" @click="goBack">←</button>
|
||||
<button class="subpage-back-button" aria-label="返回我的页面" title="返回我的页面" @click="goBack"><uni-icons type="back" size="20" color="#25282d" /></button>
|
||||
<view class="subpage-heading">
|
||||
<text class="page-title">训练详情</text>
|
||||
<text class="page-subtitle">{{ detail ? `${detail.scene} · ${detail.time}` : '训练记录' }}</text>
|
||||
@@ -175,16 +175,18 @@ onUnload(releaseAudio);
|
||||
}
|
||||
|
||||
.subpage-back-button {
|
||||
display: flex;
|
||||
width: 36px;
|
||||
min-width: 36px;
|
||||
height: 36px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
border: 1px solid #e1e2e5;
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
color: #25282d;
|
||||
font-size: 20px;
|
||||
line-height: 34px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.subpage-heading {
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
title="返回今日"
|
||||
@click="navigateBackToToday"
|
||||
>
|
||||
←
|
||||
<uni-icons type="back" size="20" color="#25282d" />
|
||||
</button>
|
||||
<view class="subpage-heading">
|
||||
<text class="page-title">学</text>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view class="page employee-page-shell points-page">
|
||||
<view class="subpage-header">
|
||||
<button class="subpage-back-button" aria-label="返回" @click="goBack">←</button>
|
||||
<button class="subpage-back-button" aria-label="返回" @click="goBack"><uni-icons type="back" size="20" color="#25282d" /></button>
|
||||
<view class="subpage-heading">
|
||||
<text class="employee-kicker">积分与学分分账</text>
|
||||
<text class="page-title">我的积分</text>
|
||||
|
||||
@@ -60,7 +60,7 @@
|
||||
</view>
|
||||
<view v-if="recentPracticeItems.length" class="assignment-list">
|
||||
<view v-for="item in recentPracticeItems" :key="item.id" class="assignment-row recent-row" :class="{ highlighted: item.assignment && highlightedAssignmentId === item.assignment.id }" @click="openRecentItem(item)">
|
||||
<view class="recent-icon" aria-hidden="true">{{ item.icon }}</view>
|
||||
<view class="recent-icon" aria-hidden="true"><uni-icons :type="item.icon" size="22" color="#e60012" /></view>
|
||||
<view class="assignment-copy">
|
||||
<text v-if="item.sourceLabel" class="assignment-badge" :class="item.assignment?.source || 'manual'">
|
||||
{{ item.sourceLabel }}
|
||||
@@ -186,7 +186,13 @@
|
||||
:class="{ playing: isTurnPlaying(index) }"
|
||||
@click="playTurnVoice(index, turn.text)"
|
||||
>
|
||||
<text class="voice-icon">{{ isTurnPlaying(index) ? '◼' : '🔊' }}</text>
|
||||
<uni-icons
|
||||
class="voice-icon"
|
||||
:class="{ playing: isTurnPlaying(index) }"
|
||||
type="sound"
|
||||
size="17"
|
||||
:color="isTurnPlaying(index) ? '#e70014' : '#5a6270'"
|
||||
/>
|
||||
<text class="voice-duration">{{ turnVoiceLabel(index) }}</text>
|
||||
</view>
|
||||
<view v-if="turnVoice(index).unread" class="voice-dot" />
|
||||
@@ -465,7 +471,7 @@ const recentPracticeItems = computed<RecentPracticeItem[]>(() => {
|
||||
desc: item.status === '已完成' ? '已完成' : '待复盘',
|
||||
sourceLabel: assignmentSourceLabel(item.source),
|
||||
status: item.status,
|
||||
icon: item.scenarioName?.includes('催费') ? '⌕' : item.scenarioName?.includes('报修') ? '⌁' : '◉',
|
||||
icon: item.scenarioName?.includes('催费') ? 'wallet' : item.scenarioName?.includes('报修') ? 'gear' : 'chatbubble',
|
||||
assignment: item
|
||||
}));
|
||||
const historyItems: RecentPracticeItem[] = practiceHistory.value.map((item) => ({
|
||||
@@ -473,7 +479,7 @@ const recentPracticeItems = computed<RecentPracticeItem[]>(() => {
|
||||
title: item.scene || '场景训练',
|
||||
desc: `${item.score || 0} 分 · ${item.status || '已完成'}`,
|
||||
status: item.status,
|
||||
icon: item.scene?.includes('催费') ? '⌕' : item.scene?.includes('报修') ? '⌁' : '◉'
|
||||
icon: item.scene?.includes('催费') ? 'wallet' : item.scene?.includes('报修') ? 'gear' : 'chatbubble'
|
||||
}));
|
||||
return [...assignmentItems, ...historyItems].slice(0, 3);
|
||||
});
|
||||
@@ -572,9 +578,9 @@ const toggleTurnTranscript = (index: number) => {
|
||||
};
|
||||
|
||||
const practicePanelItems = computed(() => [
|
||||
{ key: 'audio', icon: '🎵', label: '选音频转文字', disabled: transcribing.value },
|
||||
{ key: 'help', icon: '🧭', label: helpLoading.value ? '求助中…' : '求助 SOP', disabled: helpLoading.value },
|
||||
{ key: 'finish', icon: '🏁', label: '结束评分', disabled: !canFinishPractice.value }
|
||||
{ key: 'audio', icon: 'sound', label: '选音频转文字', disabled: transcribing.value },
|
||||
{ key: 'help', icon: 'help', label: helpLoading.value ? '求助中…' : '求助 SOP', disabled: helpLoading.value },
|
||||
{ key: 'finish', icon: 'checkmark', label: '结束评分', disabled: !canFinishPractice.value }
|
||||
]);
|
||||
|
||||
const handlePanelAction = (key: string) => {
|
||||
@@ -2189,9 +2195,7 @@ onUnload(() => {
|
||||
margin-right: 12px;
|
||||
border-radius: 50%;
|
||||
background: var(--employee-primary-soft);
|
||||
color: var(--employee-primary);
|
||||
font-size: 24px;
|
||||
font-weight: 800;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.recent-row .assignment-copy {
|
||||
@@ -2461,9 +2465,12 @@ onUnload(() => {
|
||||
}
|
||||
|
||||
.turn-voice-button {
|
||||
display: flex;
|
||||
width: auto;
|
||||
min-width: 76px;
|
||||
min-height: 32px;
|
||||
height: 32px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 10px;
|
||||
border: 1px solid #f2b9bf;
|
||||
border-radius: 999px;
|
||||
@@ -2471,7 +2478,7 @@ onUnload(() => {
|
||||
color: #e60012;
|
||||
font-size: 12px;
|
||||
font-weight: 800;
|
||||
line-height: 30px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.daily-question-voice {
|
||||
@@ -2729,10 +2736,18 @@ onUnload(() => {
|
||||
}
|
||||
|
||||
.voice-icon {
|
||||
font-size: 15px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.voice-icon.playing {
|
||||
animation: voice-icon-pulse 1s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes voice-icon-pulse {
|
||||
0%, 100% { opacity: 1; }
|
||||
50% { opacity: 0.4; }
|
||||
}
|
||||
|
||||
.voice-duration {
|
||||
color: #232a33;
|
||||
font-size: 15px;
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view class="page employee-page-shell detail-page">
|
||||
<view class="subpage-header">
|
||||
<button class="subpage-back-button" aria-label="返回问题榜" @click="goBack">←</button>
|
||||
<button class="subpage-back-button" aria-label="返回问题榜" @click="goBack"><uni-icons type="back" size="20" color="#25282d" /></button>
|
||||
<view class="subpage-heading">
|
||||
<text class="page-title">问题详情</text>
|
||||
<text class="page-subtitle">回答经审核后公开,最佳答案按当前规则获得积分或学习学分。</text>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view class="page employee-page-shell question-page">
|
||||
<view class="subpage-header">
|
||||
<button class="subpage-back-button" aria-label="返回今日" @click="goToday">←</button>
|
||||
<button class="subpage-back-button" aria-label="返回今日" @click="goToday"><uni-icons type="back" size="20" color="#25282d" /></button>
|
||||
<view class="subpage-heading">
|
||||
<text class="employee-kicker">广谱师傅</text>
|
||||
<text class="page-title">开放问题榜</text>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view class="page employee-page-shell publish-page">
|
||||
<view class="subpage-header">
|
||||
<button class="subpage-back-button" aria-label="返回" @click="goBack">←</button>
|
||||
<button class="subpage-back-button" aria-label="返回" @click="goBack"><uni-icons type="back" size="20" color="#25282d" /></button>
|
||||
<view class="subpage-heading">
|
||||
<text class="page-title">发起求助</text>
|
||||
<text class="page-subtitle">员工可发布真实工作问题;有奖征题由运营审核发布。</text>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view class="page report-page employee-page-shell">
|
||||
<view class="report-header">
|
||||
<button class="header-button back-button" aria-label="返回" @click="goBack">←</button>
|
||||
<button class="header-button back-button" aria-label="返回" @click="goBack"><uni-icons type="back" size="22" color="#25282d" /></button>
|
||||
<view class="report-heading">
|
||||
<text class="page-title">工作上报</text>
|
||||
<text class="page-subtitle">数字师傅帮你整理</text>
|
||||
@@ -308,8 +308,8 @@ const mediaSelecting = ref(false);
|
||||
const speechState = ref<{ key: string; status: SpeechPlaybackStatus }>({ key: '', status: 'idle' });
|
||||
|
||||
const composerPanelItems = [
|
||||
{ key: 'media', icon: '🖼', label: '照片/视频' },
|
||||
{ key: 'audio', icon: '🎵', label: '选择音频' }
|
||||
{ key: 'media', icon: 'image', label: '照片/视频' },
|
||||
{ key: 'audio', icon: 'sound', label: '选择音频' }
|
||||
];
|
||||
|
||||
let messageSeq = 0;
|
||||
@@ -1011,13 +1011,17 @@ onUnload(() => {
|
||||
}
|
||||
|
||||
.play-question {
|
||||
display: flex;
|
||||
min-height: 30px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 10px;
|
||||
border: 1px solid #dde2e8;
|
||||
border-radius: 9px;
|
||||
background: #ffffff;
|
||||
color: #5d6774;
|
||||
font-size: 12px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.system-row {
|
||||
|
||||
@@ -52,7 +52,13 @@
|
||||
:class="{ playing: isVoicePlaying(msg) }"
|
||||
@click="playVoice(msg)"
|
||||
>
|
||||
<text class="voice-icon">{{ isVoicePlaying(msg) ? '◼' : '🔊' }}</text>
|
||||
<uni-icons
|
||||
class="voice-icon"
|
||||
:class="{ playing: isVoicePlaying(msg) }"
|
||||
type="sound"
|
||||
size="17"
|
||||
:color="isVoicePlaying(msg) ? '#e70014' : '#5a6270'"
|
||||
/>
|
||||
<text class="voice-duration">{{ voiceLabel(msg) }}</text>
|
||||
</view>
|
||||
<view v-if="msg.unread" class="voice-dot" />
|
||||
@@ -139,7 +145,7 @@
|
||||
:class="{ video: resource.type === 'VIDEO' }"
|
||||
@click="openKnowledgeResource(resource)"
|
||||
>
|
||||
<view class="resource-icon">{{ resource.type === 'VIDEO' ? '▶' : '文' }}</view>
|
||||
<view class="resource-icon">{{ resource.type === 'VIDEO' ? '视' : '文' }}</view>
|
||||
<view class="resource-copy">
|
||||
<text class="resource-title">{{ resource.title }}</text>
|
||||
<text class="resource-meta">
|
||||
@@ -1989,16 +1995,19 @@ onUnload(() => {
|
||||
}
|
||||
|
||||
.media-remove {
|
||||
display: flex;
|
||||
width: 32px;
|
||||
min-width: 32px;
|
||||
height: 32px;
|
||||
min-height: 32px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
border-radius: 50%;
|
||||
background: #ffffff;
|
||||
color: var(--employee-muted);
|
||||
font-size: 21px;
|
||||
line-height: 32px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.answer-title-row {
|
||||
@@ -2467,10 +2476,18 @@ onUnload(() => {
|
||||
}
|
||||
|
||||
.voice-icon {
|
||||
font-size: 15px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.voice-icon.playing {
|
||||
animation: voice-icon-pulse 1s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes voice-icon-pulse {
|
||||
0%, 100% { opacity: 1; }
|
||||
50% { opacity: 0.4; }
|
||||
}
|
||||
|
||||
.voice-duration {
|
||||
color: #232a33;
|
||||
font-size: 15px;
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<view class="chat-head">
|
||||
<view class="chat-head-row">
|
||||
<view class="chat-head-left">
|
||||
<button class="chat-back" aria-label="返回工作助手" @click="goBack">←</button>
|
||||
<button class="chat-back" aria-label="返回工作助手" @click="goBack"><uni-icons type="back" size="20" color="#25282d" /></button>
|
||||
<text class="chat-title">查全网</text>
|
||||
</view>
|
||||
<text class="chat-context">互联网信息 · 独立来源</text>
|
||||
@@ -103,7 +103,7 @@
|
||||
:transcribing="voiceTranscribing"
|
||||
placeholder="例如:最近物业服务行业有哪些官方新规?"
|
||||
:maxlength="capabilities?.maxQuestionLength || 500"
|
||||
:panel-items="[{ key: 'audio', icon: '🎵', label: '选音频转文字' }]"
|
||||
:panel-items="[{ key: 'audio', icon: 'sound', label: '选音频转文字' }]"
|
||||
@send="handleComposerSend"
|
||||
@voice-blob="handleVoiceBlob"
|
||||
@panel="handlePanelAction"
|
||||
@@ -389,16 +389,18 @@ onUnload(() => {
|
||||
}
|
||||
|
||||
.chat-back {
|
||||
display: flex;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 1px solid #e3e6ea;
|
||||
border-radius: 10px;
|
||||
background: #ffffff;
|
||||
color: #232a33;
|
||||
font-size: 17px;
|
||||
line-height: 30px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.chat-title {
|
||||
|
||||
Reference in New Issue
Block a user