|
@@ -1,21 +1,5 @@
|
|
|
<template>
|
|
|
- <div class="t-page-v t-page" v-if="dire == 'V'" :style="{background: `url(${staticImg.bgV})`}" >
|
|
|
- <div class="back-icon" >
|
|
|
- <img :src="staticImg.backIcon" alt="" @click="backAppPage" >
|
|
|
- </div>
|
|
|
- <!-- width="200" height="200" -->
|
|
|
- <!-- style="scale: 0.6;" -->
|
|
|
- <div id="rive-ani"><canvas width="200" height="200" id="rive-canvas" ></canvas></div>
|
|
|
- <div class="countdown-container" >
|
|
|
- <div class="countdown" >{{countDown}}s</div>
|
|
|
- <div class="desc" >即将进入下一个环节</div>
|
|
|
- </div>
|
|
|
- <div class="opra" >
|
|
|
- <learn-plan-button :goPage="pageInfo().reload" title="再來一次" style="margin-bottom: 27px;" type="normal" />
|
|
|
- <learn-plan-button :goPage="pageInfo().next" :title="pageInfo().title" type="forward" />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div v-else class="t-page-h t-page" :style="{backgroundImage: `url(${staticImg.bgH})`}">
|
|
|
+ <div v-if="dire == 'H'" class="t-page-h t-page" :style="{backgroundImage: `url(${staticImg.bgH})`}">
|
|
|
<div class="back-icon" >
|
|
|
<img :src="staticImg.backIcon" alt="" @click="backAppPage" >
|
|
|
</div>
|
|
@@ -33,6 +17,23 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div class="t-page-v t-page" v-if="dire == 'V'" :style="{background: `url(${staticImg.bgV})`}" >
|
|
|
+ <div class="back-icon" >
|
|
|
+ <img :src="staticImg.backIcon" alt="" @click="backAppPage" >
|
|
|
+ </div>
|
|
|
+ <!-- width="200" height="200" -->
|
|
|
+ <!-- style="scale: 0.6;" -->
|
|
|
+ <div id="rive-ani"><canvas width="200" height="200" id="rive-canvas" ></canvas></div>
|
|
|
+ <div class="countdown-container" >
|
|
|
+ <div class="countdown" >{{countDown}}s</div>
|
|
|
+ <div class="desc" >即将进入下一个环节</div>
|
|
|
+ </div>
|
|
|
+ <div class="opra" >
|
|
|
+ <learn-plan-button :goPage="pageInfo().reload" title="再來一次" style="margin-bottom: 27px;" type="normal" />
|
|
|
+ <learn-plan-button :goPage="pageInfo().next" :title="pageInfo().title" type="forward" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts" name="Rive">
|
|
@@ -70,8 +71,6 @@ enum FromEnum {
|
|
|
'report' = 'report'
|
|
|
}
|
|
|
|
|
|
-console.log("from:", from);
|
|
|
-
|
|
|
if (!from) {
|
|
|
from = FromEnum.ani
|
|
|
}
|
|
@@ -82,7 +81,7 @@ const [direChange] = useDeviceDire()
|
|
|
|
|
|
const dire = ref<'H' | 'V'>('V')
|
|
|
|
|
|
-const countDown = ref(5)
|
|
|
+const countDown = ref(50)
|
|
|
|
|
|
// 1. 初始化rive动画
|
|
|
const initRive = () => {
|
|
@@ -124,7 +123,9 @@ const [stx] = useScheduler({
|
|
|
stx.start()
|
|
|
|
|
|
const backAppPage = () => {
|
|
|
- appRouter.back()
|
|
|
+
|
|
|
+ // app需要的特殊参数,用来连续返回两次app的路由
|
|
|
+ appRouter.back(JSON.stringify({ "force": true }))
|
|
|
}
|
|
|
|
|
|
// 跳转
|
|
@@ -173,9 +174,11 @@ onMounted(() => {
|
|
|
height: 100vh;
|
|
|
overflow: hidden;
|
|
|
.back-icon {
|
|
|
+ z-index: 999;
|
|
|
img {
|
|
|
width: 38px;
|
|
|
height: 36px;
|
|
|
+ display: block;
|
|
|
}
|
|
|
}
|
|
|
.countdown-container {
|