|
@@ -0,0 +1,55 @@
|
|
|
+<route lang="json">
|
|
|
+{ "style": { "navigationBarTitleText": "订单详情", "navigationBarBackgroundColor": "#fff" } }
|
|
|
+</route>
|
|
|
+<script setup lang="ts">
|
|
|
+import SectionHeading from '@/components/section-heading.vue'
|
|
|
+const data = ref([{}, {}, {}])
|
|
|
+</script>
|
|
|
+<template>
|
|
|
+ <div class="flex-grow flex flex-col gap-4 px-3.5 bg-white">
|
|
|
+ <div class="h-8.5 flex items-center justify-center mx--3.5 box-border bg-[#ffecec]">
|
|
|
+ <div
|
|
|
+ class="text-right text-[#ef4343] text-sm font-normal font-['PingFang SC'] leading-normal"
|
|
|
+ >
|
|
|
+ 已完成
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="flex gap-4 border-b border-b-solid border-b-[#f2f2f2] pb-5">
|
|
|
+ <wd-img
|
|
|
+ width="94"
|
|
|
+ height="94"
|
|
|
+ custom-class="rounded-2xl overflow-hidden"
|
|
|
+ src="https://via.placeholder.com/94x94"
|
|
|
+ />
|
|
|
+ <div class="flex flex-col flex-1">
|
|
|
+ <div class="text-black text-base font-normal font-['PingFang SC'] leading-normal">
|
|
|
+ 方晓峰
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="text-start text-black/40 text-sm font-normal font-['PingFang SC'] leading-normal"
|
|
|
+ >
|
|
|
+ x1
|
|
|
+ </div>
|
|
|
+ <div class="flex-1"></div>
|
|
|
+ <div
|
|
|
+ class="text-start text-black/60 text-sm font-normal font-['PingFang SC'] leading-normal"
|
|
|
+ >
|
|
|
+ 1600积分
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <div class="text-black/40 text-sm font-normal font-['PingFang SC'] leading-normal">
|
|
|
+ 已完成
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <SectionHeading title="订单金额" size="sm" end-text="¥ 200"></SectionHeading>
|
|
|
+ <SectionHeading title="总积分" size="sm" end-text="¥ 200"></SectionHeading>
|
|
|
+ <SectionHeading title="实际支付积分" size="sm" end-text="¥ 200"></SectionHeading>
|
|
|
+ <SectionHeading title="订单号" size="sm" end-text="¥ 200"></SectionHeading>
|
|
|
+ <SectionHeading title="支付时间" size="sm" end-text="¥ 200"></SectionHeading>
|
|
|
+ <SectionHeading title="支付方式" size="sm" end-text="¥ 200"></SectionHeading>
|
|
|
+ <div class="flex-1"></div>
|
|
|
+ <div><wd-button :round="false" block>取消订单</wd-button></div>
|
|
|
+ </div>
|
|
|
+</template>
|