更新动画

This commit is contained in:
weipengfei 2023-10-13 15:48:16 +08:00
parent b9328987d0
commit c826bd2538
2 changed files with 14 additions and 2 deletions

View File

@ -1,12 +1,22 @@
<template> <template>
<div class="spin">
<div class="loader"> <div class="loader">
<div class="outer" /> <div class="outer" />
<div class="middle" /> <div class="middle" />
<div class="inner" /> <div class="inner" />
</div> </div>
</div>
</template> </template>
<style scoped> <style scoped>
.spin{
display: flex;
justify-content: center;
align-items: center;
width: 20em;
height: 20em;
transform: scale(5);
}
.loader { .loader {
position: relative; position: relative;
} }

View File

@ -26,6 +26,7 @@ import recording from "@/components/animation/recording.vue"
import inputing from "@/components/animation/inputing.vue" import inputing from "@/components/animation/inputing.vue"
import loding from "@/components/animation/loding.vue" import loding from "@/components/animation/loding.vue"
import lodingCir from "@/components/animation/lodingCir.vue" import lodingCir from "@/components/animation/lodingCir.vue"
import lodingSpin from "@/components/animation/lodingSpin.vue"
import IatRecorder from '@/utils/test.js' import IatRecorder from '@/utils/test.js'
// import IatRecorder from '@/utils/larRcorder.js' // import IatRecorder from '@/utils/larRcorder.js'
@ -613,7 +614,8 @@ window.addEventListener('test', (e) => {
<transition mode="out-in" name="fade"> <transition mode="out-in" name="fade">
<inputing v-if="nowStatus=='input'" key="input"></inputing> <inputing v-if="nowStatus=='input'" key="input"></inputing>
<recording v-else-if="nowStatus=='record'" key="record"></recording> <recording v-else-if="nowStatus=='record'" key="record"></recording>
<loding v-else-if="nowStatus=='loding'" key="loding"></loding> <!-- <loding v-else-if="nowStatus=='loding'" key="loding"></loding> -->
<lodingSpin v-else-if="nowStatus=='loding'" key="loding"></lodingSpin>
<!-- <lodingCir v-else-if="nowStatus=='loding'" key="loding"></lodingCir> --> <!-- <lodingCir v-else-if="nowStatus=='loding'" key="loding"></lodingCir> -->
</transition> </transition>
</indexBG> </indexBG>