26 lines
2.7 KiB
Plaintext
26 lines
2.7 KiB
Plaintext
|
<template>
|
||
|
|
<view class="analyzing-page">
|
||
|
|
<view class="safe"></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/images/robot-cutout.png" mode="aspectFit"></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">
|
||
|
|
const progress = ref(0)
|
||
|
|
const items = ['数据解析中', '信用评估中', '匹配方案中', '风险检测中']
|
||
|
|
let timer = setInterval(() => { if (progress.value < 4) progress.value++; else clearInterval(timer) }, 550)
|
||
|
|
const finish = () => { clearInterval(timer); uni.redirectTo({ url: '/pages/report/report' }) }
|
||
|
|
setTimeout(() => finish(), 3200)
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
.analyzing-page { min-height: 100vh; background: linear-gradient(160deg, #061c49, #002c75); align-items: center; color: #fff; }.safe { height: calc(var(--status-bar-height) + 80rpx); }.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>
|