diff --git a/pages/subcomponent/promotion-profit-detail.vue b/pages/subcomponent/promotion-profit-detail.vue index 39d6b8e..eba7fad 100644 --- a/pages/subcomponent/promotion-profit-detail.vue +++ b/pages/subcomponent/promotion-profit-detail.vue @@ -1,194 +1,231 @@ \ No newline at end of file + .profit-detail-container { + min-height: 100vh; + background: #f7f7f7; + } + + .nav-bar { + display: flex; + align-items: center; + height: calc(150rpx + var(--status-bar-height)); + padding: 0 32rpx; + padding-top: var(--status-bar-height); + background: #fff; + position: fixed; + top: 0; + left: 0; + right: 0; + z-index: 999; + box-sizing: border-box; + box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.03); + + .back { + padding: 20rpx; + margin-left: -20rpx; + } + + .title { + flex: 1; + text-align: center; + font-size: 34rpx; + font-weight: 500; + color: #222; + } + } + + .main-content { + margin-top: calc(150rpx + var(--status-bar-height)); + margin-bottom: 40rpx; + min-height: 100vh; + overflow-y: auto; + width: 100vw; + box-sizing: border-box; + } + + .profit-list-card { + background: #fff; + border-radius: 40rpx; + margin: 0 32rpx 32rpx 32rpx; + padding: 0 0 0 0; + box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.03); + } + + .profit-item { + display: flex; + align-items: center; + justify-content: flex-start; + padding: 28rpx 36rpx 28rpx 36rpx; + border-bottom: 2rpx solid #f3f3f3; + + &:last-child { + border-bottom: none; + } + } + + .avatar { + width: 60rpx; + height: 60rpx; + border-radius: 50%; + margin-right: 24rpx; + object-fit: cover; + background: #f5f5f5; + } + + .profit-info { + display: flex; + flex-direction: column; + justify-content: center; + min-width: 120rpx; + } + + .profit-name-date { + display: flex; + flex-direction: column; + } + + .profit-name { + font-size: 28rpx; + color: #222; + font-weight: 500; + } + + .profit-date { + font-size: 22rpx; + color: #b3b3b3; + font-weight: 400; + margin-top: 2rpx; + } + + // 添加状态样式,参考wallet.vue + .status { + padding: 4rpx 8rpx; + background: #FFB74D; + border-radius: 8rpx; + display: flex; + align-items: center; + justify-content: center; + margin-top: 8rpx; + width: fit-content; + + .status-text { + font-size: 22rpx; + color: #fff; + } + } + + .profit-type { + flex: 1; + text-align: center; + font-family: PingFang SC; + font-weight: 400; + font-size: 14px; + line-height: 100%; + letter-spacing: 0%; + color: #4c4c4c; + font-weight: 400; + } + + .profit-amount { + font-size: 28rpx; + color: #ff8917; + font-weight: 500; + margin-left: 12rpx; + min-width: 80rpx; + text-align: right; + } + \ No newline at end of file diff --git a/pages/subcomponent/wallet.vue b/pages/subcomponent/wallet.vue index 3159049..8a4f2af 100644 --- a/pages/subcomponent/wallet.vue +++ b/pages/subcomponent/wallet.vue @@ -651,6 +651,8 @@ export default { .record-left { flex: 1; + display: flex; + align-items: center; .type { font-size: 28rpx; @@ -659,11 +661,12 @@ export default { } .status { - display: inline-block; padding: 4rpx 8rpx; background: #FFB74D; border-radius: 8rpx; - margin-top: 8rpx; + display: flex; + align-items: center; + justify-content: center; .status-text { font-size: 22rpx;