hujun
b0ee4f9d7e
1. 新增layout.uts统一管理页面尺寸与安全区计算 2. 修正图片资源路径到static/mobile目录 3. 调整App.vue与AppIcon组件样式适配多端 4. 为微信小程序配置打包忽略规则减少包体积 5. 修复API请求错误抛出类型，完善类型定义 6. 补充README文档说明项目运行与维护规范 7. 优化多个页面的样式与生命周期逻辑
55 lines
3.1 KiB
Plaintext
55 lines
3.1 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>{{ progress > index ? '✓' : '·' }}</text></view><text>{{ item }}</text></view></view>
|
|
<text class="estimate">预计需要30-60秒，请稍候...</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: '/pages/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-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>
|