Toggle navigation
Toggle navigation
This project
Loading...
Sign in
Hooke
/
lls_program
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Snippets
Network
Create a new issue
Builds
Commits
Issue Boards
Authored by
hookehuyr
2025-09-01 18:23:51 +0800
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
beab8b5775d775d6b0e9c6bda34535488c0d69bc
beab8b57
1 parent
48cc0f97
feat(界面): 添加加载动画效果并修复加载状态
在Dashboard页面添加步数加载时的动画效果 在WeRunAuth组件中修复加载状态未重置的问题
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
52 additions
and
8 deletions
src/components/WeRunAuth.vue
src/pages/Dashboard/index.vue
src/components/WeRunAuth.vue
View file @
beab8b5
...
...
@@ -146,13 +146,14 @@ const getWeRunData = async () => {
// 同步微信步数
const { code, data } = await syncWxStepAPI({ encryptedData: weRunRes.encryptedData, iv: weRunRes.iv });
if (code) {
// 提示获取步数成功
// Taro.showToast({
// title: `获取步数成功:${mockSteps}步`,
// icon: 'none'
// })
console.warn('同步微信步数成功', data);
// todaySteps.value = decryptedData.todaySteps
// 提示获取步数成功
// Taro.showToast({
// title: `获取步数成功:${mockSteps}步`,
// icon: 'none'
// })
console.warn('同步微信步数成功', data);
// todaySteps.value = decryptedData.todaySteps
isLoading.value = false
}
} catch (error) {
...
...
src/pages/Dashboard/index.vue
View file @
beab8b5
...
...
@@ -29,7 +29,16 @@
<view class="flex justify-between items-center">
<view class="flex items-baseline">
<span class="text-4xl font-bold">
{{ isLoading ? '...' : steps.toLocaleString() }}
<template v-if="isLoading">
<span class="loading-dots">
<span class="dot">.</span>
<span class="dot">.</span>
<span class="dot">.</span>
</span>
</template>
<template v-else>
{{ steps.toLocaleString() }}
</template>
</span>
<span class="ml-1 text-gray-500">步</span>
</view>
...
...
@@ -341,3 +350,37 @@ useDidShow(() => {
initPageData();
})
</script>
<style lang="less">
.loading-dots {
display: inline-block;
.dot {
display: inline-block;
animation: loading-bounce 1.4s ease-in-out infinite both;
&:nth-child(1) {
animation-delay: -0.32s;
}
&:nth-child(2) {
animation-delay: -0.16s;
}
&:nth-child(3) {
animation-delay: 0s;
}
}
}
@keyframes loading-bounce {
0%, 80%, 100% {
transform: scale(0.8);
opacity: 0.5;
}
40% {
transform: scale(1);
opacity: 1;
}
}
</style>
...
...
Please
register
or
login
to post a comment