refactor(mobile-uni): 彻底移除底部悬浮胶囊Bar,恢复原生App纯净卡片流与流内快捷动作
This commit is contained in:
@@ -331,15 +331,18 @@
|
||||
{{ showPrepDetail ? '收起 ▲' : '展开红线与推荐话术 ▼' }}
|
||||
</button>
|
||||
</view>
|
||||
<view v-else-if="!prepLoading" class="app-empty-state">
|
||||
<view class="empty-icon-circle circle-blue">
|
||||
<uni-icons type="paperplane-filled" size="22" color="#2d80ff" />
|
||||
</view>
|
||||
<text class="empty-title">预习准备</text>
|
||||
<text class="empty-desc">暂无可用预习卡,可直接开启实操对练!</text>
|
||||
<!-- 流式嵌入快捷操作入口 -->
|
||||
<view class="sop-inline-actions">
|
||||
<button class="sop-act-btn outline" @click="askTopic(activeTopic)">
|
||||
<uni-icons type="chatboxes" size="15" color="#1a1a1a" />
|
||||
<text class="sop-act-text">咨询师傅</text>
|
||||
</button>
|
||||
<button class="sop-act-btn primary-gradient-btn" @click="goPractice">
|
||||
<uni-icons type="paperplane-filled" size="15" color="#ffffff" />
|
||||
<text class="sop-act-text text-white">开启实操对练</text>
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dock-spacer" />
|
||||
</view>
|
||||
|
||||
<!-- Tab 3: 考试与资格 (岗前任务 + 考试 + 上岗资格) -->
|
||||
@@ -445,19 +448,6 @@
|
||||
<text class="empty-desc">等待 HR 或组织系统派发正式任务</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="dock-spacer" />
|
||||
</view>
|
||||
|
||||
<!-- 3. 原生 App 悬浮 Dock (Floating CTA Bar) -->
|
||||
<view class="floating-action-dock">
|
||||
<button class="dock-btn secondary-dock-btn" @click="askTopic(activeTopic)">
|
||||
<uni-icons type="chatboxes-filled" size="18" color="#e60012" />
|
||||
<text class="dock-btn-text">问师傅</text>
|
||||
</button>
|
||||
<button class="dock-btn primary-dock-btn" @click="goPractice">
|
||||
<uni-icons type="paperplane-filled" size="18" color="#ffffff" />
|
||||
<text class="dock-btn-text text-white">⚡ 练一遍</text>
|
||||
</button>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
@@ -926,7 +916,7 @@ onUnload(invalidateRequests);
|
||||
|
||||
<style scoped>
|
||||
.learning-page {
|
||||
padding-bottom: 120px;
|
||||
padding-bottom: 32px;
|
||||
background: #f7f8fa;
|
||||
min-height: 100vh;
|
||||
}
|
||||
@@ -1086,7 +1076,7 @@ onUnload(invalidateRequests);
|
||||
|
||||
/* 3. Tab Content View */
|
||||
.tab-content-view {
|
||||
padding: 0 16px 140px;
|
||||
padding: 0 16px 24px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 14px;
|
||||
@@ -1384,60 +1374,41 @@ onUnload(invalidateRequests);
|
||||
.qualification-status.not-configured { background: #fff8e6; color: #d97706; }
|
||||
.qualification-status.blocked, .qualification-status.expired { background: #fff4f4; color: #e60012; }
|
||||
|
||||
/* 4. Floating Action Dock */
|
||||
.floating-action-dock {
|
||||
position: fixed;
|
||||
bottom: 60px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: calc(100% - 32px);
|
||||
max-width: 440px;
|
||||
/* In-flow SOP Inline Actions */
|
||||
.sop-inline-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
padding: 8px;
|
||||
background: rgba(255, 255, 255, 0.94);
|
||||
backdrop-filter: blur(16px);
|
||||
-webkit-backdrop-filter: blur(16px);
|
||||
border: 1px solid rgba(0, 0, 0, 0.08);
|
||||
border-radius: 999px;
|
||||
box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
|
||||
z-index: 99;
|
||||
margin-top: 16px;
|
||||
padding-top: 14px;
|
||||
border-top: 1px dashed #e2e8f0;
|
||||
}
|
||||
|
||||
.dock-btn {
|
||||
.sop-act-btn {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 6px;
|
||||
height: 44px;
|
||||
border-radius: 999px;
|
||||
height: 40px;
|
||||
border-radius: 12px;
|
||||
border: none;
|
||||
padding: 0;
|
||||
transition: transform 0.15s ease;
|
||||
font-size: 13px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.dock-btn:active {
|
||||
transform: scale(0.97);
|
||||
}
|
||||
|
||||
.secondary-dock-btn {
|
||||
.sop-act-btn.outline {
|
||||
background: #f1f5f9;
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
.primary-dock-btn {
|
||||
background: linear-gradient(135deg, #ff4d4f 0%, #e60012 100%);
|
||||
box-shadow: 0 6px 16px rgba(230, 0, 18, 0.28);
|
||||
}
|
||||
|
||||
.dock-btn-text {
|
||||
font-size: 14px;
|
||||
.sop-act-text {
|
||||
font-size: 13px;
|
||||
font-weight: 800;
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
.dock-btn-text.text-white {
|
||||
.sop-act-text.text-white {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user