hujun
046a03e5e9
- 新增微信小程序胶囊区域避让布局逻辑 - 统一首页导航与标题对齐规则 - 更新多处演示提示文案为正式表述 - 调整个人中心账户状态显示 - 优化产品页分享按钮条件渲染
57 lines
3.3 KiB
Plaintext
57 lines
3.3 KiB
Plaintext
<template>
|
|
<view class="analyzing-page" :style="pageStyle()">
|
|
<view class="safe" :style="statusStyle(80)"></view>
|
|
<text class="analyzing-title">AI分析中</text>
|
|
<text class="analyzing-sub">正在整理融资评估信息…</text>
|
|
<view class="orbital"><view class="orbit orbit-one"></view><view class="orbit orbit-two"></view><view class="ai-core"><image src="/static/mobile/images/robot-cutout.png" mode="aspectFit" class="ai-core-image"></image></view></view>
|
|
<view class="analysis-list"><view class="analysis-item" v-for="(item,index) in items" :key="item"><view :class="progress > index ? 'analysis-check done' : 'analysis-check'"><text class="analysis-mark">{{ progress > index ? '✓' : '·' }}</text></view><text class="analysis-label">{{ item }}</text></view></view>
|
|
<text class="estimate">正在生成评估报告，请稍候…</text>
|
|
<text class="view-now" @click="finish">查看评估结果</text>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup lang="uts">
|
|
import { usePageLayout } from '@/services/layout.uts'
|
|
const { statusStyle, pageStyle } = usePageLayout()
|
|
const progress = ref(0)
|
|
const items = ['数据解析中', '信用评估中', '匹配方案中', '风险检测中']
|
|
let timer = 0
|
|
let finishTimer = 0
|
|
let finished = false
|
|
const finish = () => {
|
|
if (finished) return
|
|
finished = true
|
|
clearInterval(timer)
|
|
clearTimeout(finishTimer)
|
|
uni.redirectTo({ url: '/packages/finance/report/report' })
|
|
}
|
|
onShow(() => {
|
|
if (finished) return
|
|
timer = setInterval(() => { if (progress.value < 4) progress.value++; else clearInterval(timer) }, 550)
|
|
finishTimer = setTimeout(() => finish(), 3200)
|
|
})
|
|
onHide(() => { clearInterval(timer); clearTimeout(finishTimer) })
|
|
onUnmounted(() => { clearInterval(timer); clearTimeout(finishTimer) })
|
|
</script>
|
|
|
|
<style>
|
|
.analyzing-page { background: linear-gradient(160deg, #061c49, #002c75); align-items: center; color: #fff; }
|
|
.safe { }
|
|
.analyzing-title { font-size: 45rpx; font-weight: 800; }
|
|
.analyzing-sub { margin-top: 20rpx; color: #c6d9ff; font-size: 25rpx; }
|
|
.orbital { width: 400rpx; height: 400rpx; margin-top: 55rpx; align-items: center; justify-content: center; position: relative; }
|
|
.orbit { position: absolute; border-radius: 50%; border: 2rpx solid rgba(79, 176, 255, .46); }
|
|
.orbit-one { width: 350rpx; height: 350rpx; }
|
|
.orbit-two { width: 280rpx; height: 280rpx; border-color: rgba(57, 235, 255, .5); }
|
|
.ai-core { width: 220rpx; height: 220rpx; border-radius: 50%; background-color: rgba(10, 102, 247, .32); box-shadow: 0 0 70rpx rgba(0, 165, 255, .48); align-items: center; justify-content: center; }
|
|
.ai-core-image { width: 185rpx; height: 185rpx; border-radius: 50%; }
|
|
.analysis-list { margin-top: 30rpx; width: 390rpx; }
|
|
.analysis-item { flex-direction: row; align-items: center; margin-top: 23rpx; font-size: 26rpx; color: #d8e6ff; }
|
|
.analysis-label { font-size: 27rpx; color: #d8e6ff; }
|
|
.analysis-mark { font-size: 24rpx; color: #ffffff; }
|
|
.analysis-check { width: 38rpx; height: 38rpx; border-radius: 50%; border: 2rpx solid #4c73a7; align-items: center; justify-content: center; margin-right: 17rpx; }
|
|
.analysis-check.done { background-color: #158aff; border-color: #41d7ff; color: white; }
|
|
.estimate { margin-top: 64rpx; color: #8faeda; font-size: 22rpx; }
|
|
.view-now { margin-top: 28rpx; color: #62c8ff; font-size: 23rpx; }
|
|
</style>
|