| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061 |
- <script setup lang="ts">
- const { statusBarHeight, MenuButtonHeight } = storeToRefs(useSysStore())
- const tab = ref<number>(0)
- const tabsList = ref(['全部', '成功', '失败'])
- </script>
- <template>
- <view class="video-rights-order-page">
- <wd-navbar
- title="订单" custom-style="background-color:#FFF" :bordered="false" :z-index="99"
- safe-area-inset-top fixed
- />
- <view :style="{ paddingTop: `${(Number(statusBarHeight) || 44) + MenuButtonHeight + 12}px` }" />
- <wd-tabs v-model="tab" animated>
- <block v-for="item in tabsList" :key="item">
- <wd-tab :title="item">
- <view class="box-border bg-#f6f6f6 px24rpx">
- <view class="h-28rpx" />
- <view class="rounded-16rpx bg-#FFF p-24rpx">
- <view class="flex items-center justify-between">
- <view class="text-28rpx">
- 2024-12-13 11:12:30
- </view>
- <view class="text-28rpx font-bold">
- 充值成功
- </view>
- </view>
- <view class="mt-24rpx h-2rpx w-full bg-#F0F0F0" />
- <view class="mt-24rpx flex items-center justify-between">
- <view class="flex items-center gap-20rpx">
- <view class="h-160rpx w-160rpx">
- image
- </view>
- <view>
- <view class="text-32rpx font-bold">
- 网易云黑胶VIP月卡
- </view>
- <view class="mt-16rpx text-#FF4D3A">
- <text class="text-22rpx font-500">
- ¥
- </text>
- <text class="text-36rpx font-800">
- 18
- </text>
- </view>
- <view class="mt-16rpx text-24rpx">
- XN123458625484359845
- </view>
- </view>
- </view>
- <wd-icon name="chevron-right" size="22px" color="#222222" />
- </view>
- </view>
- </view>
- </wd-tab>
- </block>
- </wd-tabs>
- </view>
- </template>
- <style lang="scss" scoped></style>
|