118 lines
2.4 KiB
Vue
118 lines
2.4 KiB
Vue
<template>
|
|
<view class="loading-container">
|
|
<image class="logo" src="/static/Logo.jpg" mode="widthFix"></image>
|
|
<view class="spinner"></view>
|
|
<text class="tip">{{ tips_text }}</text>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref } from "vue";
|
|
import { onLoad } from "@dcloudio/uni-app";
|
|
import { appInit } from "@/common/system/system";
|
|
import { verificationHost } from "@/common/env.js";
|
|
import { com } from "@/common/com";
|
|
let tips_text = ref("加载中...");
|
|
onLoad(async (option) => {
|
|
console.log('请求参数', option);
|
|
|
|
// 记录开始时间
|
|
const startTime = Date.now();
|
|
|
|
// 检查网络状态
|
|
const network = await uni.getNetworkType();
|
|
if (network.networkType === "none") {
|
|
tips_text.value = "请检查网络连接";
|
|
// 监听网络状态变化
|
|
uni.onNetworkStatusChange(checkNetwork);
|
|
return;
|
|
}
|
|
const host = await verificationHost();
|
|
if (!host) {
|
|
tips_text.value = "暂无网络";
|
|
return;
|
|
}
|
|
let res = await appInit();
|
|
// 计算总耗时
|
|
const endTime = Date.now();
|
|
const duration = endTime - startTime;
|
|
let endTimeF = 800 - duration;
|
|
console.log(`应用初始化成功，耗时: ${duration}ms,距离动画结束还需要${endTimeF}ms`);
|
|
if (endTimeF > 50) {
|
|
await sleep(endTimeF);
|
|
}
|
|
if (option != null && option.id != null && option.id != "0") {
|
|
uni.setStorageSync('share_id', option.id);
|
|
}
|
|
com.navigateTo("/pages/index/index");
|
|
|
|
});
|
|
/**
|
|
* 检查网络状态
|
|
* @param {Object} res 网络状态
|
|
*/
|
|
function checkNetwork(res) {
|
|
console.log("网络状态变化:", res.isConnected, res.networkType);
|
|
if (res.isConnected) {
|
|
// #ifdef APP
|
|
plus.runtime.restart();
|
|
// #endif
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.loading-container {
|
|
height: 100vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background-color: #ffffff;
|
|
}
|
|
|
|
.logo {
|
|
width: 360rpx;
|
|
margin-bottom: 40rpx;
|
|
animation: slideDown 0.8s ease-out forwards;
|
|
transform: translateY(-100vh);
|
|
}
|
|
|
|
.spinner {
|
|
width: 60rpx;
|
|
height: 60rpx;
|
|
border: 6rpx solid #f0f0f0;
|
|
border-top-color: #18a058;
|
|
border-radius: 50%;
|
|
animation: spin 1s linear infinite;
|
|
margin-bottom: 24rpx;
|
|
}
|
|
|
|
@keyframes spin {
|
|
0% {
|
|
transform: rotate(0deg)
|
|
}
|
|
|
|
100% {
|
|
transform: rotate(360deg)
|
|
}
|
|
}
|
|
|
|
@keyframes slideDown {
|
|
0% {
|
|
transform: translateY(-100vh);
|
|
opacity: 0;
|
|
}
|
|
|
|
100% {
|
|
transform: translateY(0);
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
.tip {
|
|
color: #999999;
|
|
font-size: 28rpx;
|
|
}
|
|
</style>
|