提交 a70adcc7 作者: e

feat: 修复登录页报复和弹框文字不居中的问题

上级 f0caf954
...@@ -206,10 +206,6 @@ ...@@ -206,10 +206,6 @@
} }
onHide(() => { onHide(() => {
loop && clearInterval(loop)
loop = null
direction = 'right'
count.value = 0
model.show = false model.show = false
}) })
...@@ -456,6 +452,18 @@ ...@@ -456,6 +452,18 @@
width:650rpx; width:650rpx;
} }
.fui-descr {
letter-spacing: 1rpx;
padding: 50rpx;
font-size: 24rpx;
color: #b2b2b2;
padding-top: 12rpx;
padding-bottom: 48rpx;
::v-deep(.fui-text__content) {
text-indent: 0 !important;
}
}
.form { .form {
position: absolute; position: absolute;
......
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted,onUnmounted } from 'vue'; // import { onMounted, onUnmounted, ref } from 'vue'
import { getQueryByType } from '/@/api/model/dict'; import { getQueryByType } from '/@/api/model/dict'
const mediaUrl = ref("");
const seconds = ref(4); const mediaUrl = ref('')
let timer = null; const seconds = ref(4)
let timer = null
onLoad(() => { onLoad(() => {
getServiceItems() getServiceItems()
}) })
onMounted(() => { onMounted(() => {
countdown(); countdown()
}); })
onUnmounted(() => { onUnmounted(() => {
clearTimerInterval() clearTimerInterval()
}); })
function clearTimerInterval(){ function clearTimerInterval() {
clearInterval(timer); clearInterval(timer)
} }
function getServiceItems() { function getServiceItems() {
getQueryByType({ type: 2 }).then((res) => { getQueryByType({ type: 2 }).then((res) => {
mediaUrl.value = res[0].mediaUrl; mediaUrl.value = res[0].mediaUrl
}) })
} }
function countdown() { function countdown() {
timer = setInterval(() => { timer = setInterval(() => {
if (seconds.value > 0) { if (seconds.value > 0) {
seconds.value -= 1; seconds.value -= 1
console.log(seconds.value)
} else { } else {
clearTimerInterval() clearTimerInterval()
navigateToLogin(); navigateToLogin()
} }
}, 1000); }, 1000)
} }
function navigateToLogin() { function navigateToLogin() {
uni.redirectTo({ uni.redirectTo({
url: '/pages/login/login' url: '/pages/login/login',
}); })
} }
</script> </script>
<template> <template>
<view class="container"> <view class="container">
<image class="splash_bg" :src="mediaUrl" mode="aspectFill"></image> <image class="splash_bg" :src="mediaUrl" mode="aspectFill" />
<!-- <view class="middle_logo_content"> <!-- <view class="middle_logo_content">
<view class="logo_view"> <view class="logo_view">
<image class="splash_logo" src="/static/images/home/icon.png" /> <image class="splash_logo" src="/static/images/home/icon.png" />
...@@ -53,7 +53,9 @@ ...@@ -53,7 +53,9 @@
<view class="countdown_view"> <view class="countdown_view">
<image class="shadow_img" src="/static/images/splash/shadow.png" /> <image class="shadow_img" src="/static/images/splash/shadow.png" />
<view class="countdown_val"><text>{{ seconds }}s</text></view> <view class="countdown_val"
><text>{{ seconds }}s</text></view
>
</view> </view>
<view class="under_btn_view"> <view class="under_btn_view">
...@@ -69,83 +71,81 @@ ...@@ -69,83 +71,81 @@
</view> </view>
</template> </template>
<style lang="less" scoped> <style lang="less" scoped>
.container { .container {
height: 100vh; height: 100vh;
width:750rpx; width: 750rpx;
position: relative; position: relative;
.splash_bg { .splash_bg {
width: 100%; width: 100%;
height: 100vh; height: 100vh;
} }
.middle_logo_content{ .middle_logo_content {
position: absolute; position: absolute;
top: 250rpx; top: 250rpx;
left: 0rpx; left: 0rpx;
right: 0rpx; right: 0rpx;
display:flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
.logo_view{ .logo_view {
width: 136rpx; width: 136rpx;
height: 136rpx; height: 136rpx;
border-radius: 24rpx; border-radius: 24rpx;
background-color: #fff; background-color: #fff;
display:flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.splash_logo{ .splash_logo {
width:110rpx; width: 110rpx;
height:110rpx; height: 110rpx;
} }
} }
.logo_text_bg{ .logo_text_bg {
margin-top:32rpx; margin-top: 32rpx;
width: 192rpx; width: 192rpx;
height: 64rpx; height: 64rpx;
} }
.server_text_bg{ .server_text_bg {
width: 528rpx; width: 528rpx;
height: 116rpx; height: 116rpx;
} }
.outline_bg{ .outline_bg {
margin-top:-36rpx; margin-top: -36rpx;
width: 464rpx; width: 464rpx;
height: 54rpx; height: 54rpx;
} }
} }
.countdown_view{ .countdown_view {
position: absolute; position: absolute;
left: 612rpx; left: 612rpx;
top: 118rpx; top: 118rpx;
width: 108rpx; width: 108rpx;
height: 52rpx; height: 52rpx;
.shadow_img{ .shadow_img {
width: 108rpx; width: 108rpx;
height: 52rpx; height: 52rpx;
} }
.countdown_val{ .countdown_val {
width: 108rpx; width: 108rpx;
height: 52rpx; height: 52rpx;
position: absolute; position: absolute;
left:0rpx; left: 0rpx;
top:0rpx; top: 0rpx;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
font-size: 26rpx; font-size: 26rpx;
color:#fff; color: #fff;
font-weight: 400; font-weight: 400;
} }
} }
.under_btn_view{ .under_btn_view {
width:650rpx; width: 650rpx;
position: absolute; position: absolute;
bottom: 52rpx; bottom: 52rpx;
left:50rpx; left: 50rpx;
}
} }
}
</style> </style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论