sai/vpUni
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

第一次上传

Browse Source
This commit is contained in:
Ls
2026-03-09 16:39:03 +08:00
commit 3d9efaf15c
924 changed files with 326227 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

141
.svn/pristine/b1/b142524908904c13332ef231ba5b7b1319484481.svn-base Normal file
View File

@@ -0,0 +1,141 @@
<template>
<view class="skeleton-order-card">
<!-- 头部骨架 -->
<view class="skeleton-order-header">
<view class="skeleton-shop-avatar"></view>
<view class="skeleton-shop-info">
<view class="skeleton-shop-name"></view>
<view class="skeleton-order-time"></view>
</view>
<view class="skeleton-order-status"></view>
</view>
<!-- 详情骨架 -->
<view class="skeleton-order-details">
<view class="skeleton-detail-row">
<view class="skeleton-detail-label"></view>
<view class="skeleton-detail-value"></view>
</view>
<view class="skeleton-detail-row">
<view class="skeleton-detail-label"></view>
<view class="skeleton-detail-value-short"></view>
</view>
</view>
</view>
</template>
<script setup>
</script>
<style lang="scss" scoped>
.skeleton-order-card {
background: #FFFFFF;
border-radius: 16rpx;
padding: 24rpx;
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.04);
}
/* 头部骨架 */
.skeleton-order-header {
display: flex;
align-items: center;
margin-bottom: 20rpx;
padding-bottom: 20rpx;
border-bottom: 1rpx solid #F5F5F5;
}
.skeleton-shop-avatar {
width: 80rpx;
height: 80rpx;
border-radius: 12rpx;
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
background-size: 200% 100%;
animation: loading 1.5s ease-in-out infinite;
margin-right: 16rpx;
flex-shrink: 0;
}
.skeleton-shop-info {
flex: 1;
display: flex;
flex-direction: column;
gap: 6rpx;
}
.skeleton-shop-name {
height: 28rpx;
width: 200rpx;
border-radius: 4rpx;
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
background-size: 200% 100%;
animation: loading 1.5s ease-in-out infinite;
}
.skeleton-order-time {
height: 22rpx;
width: 180rpx;
border-radius: 4rpx;
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
background-size: 200% 100%;
animation: loading 1.5s ease-in-out infinite;
}
.skeleton-order-status {
width: 100rpx;
height: 40rpx;
border-radius: 24rpx;
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
background-size: 200% 100%;
animation: loading 1.5s ease-in-out infinite;
flex-shrink: 0;
}
/* 详情骨架 */
.skeleton-order-details {
display: flex;
flex-direction: column;
gap: 12rpx;
}
.skeleton-detail-row {
display: flex;
justify-content: space-between;
align-items: center;
}
.skeleton-detail-label {
width: 120rpx;
height: 24rpx;
border-radius: 4rpx;
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
background-size: 200% 100%;
animation: loading 1.5s ease-in-out infinite;
}
.skeleton-detail-value {
flex: 1;
height: 26rpx;
border-radius: 4rpx;
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
background-size: 200% 100%;
animation: loading 1.5s ease-in-out infinite;
}
.skeleton-detail-value-short {
width: 100rpx;
height: 26rpx;
border-radius: 4rpx;
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
background-size: 200% 100%;
animation: loading 1.5s ease-in-out infinite;
}
@keyframes loading {
0% {
background-position: 200% 0;
}
100% {
background-position: -200% 0;
}
}
</style>