138 lines
3.6 KiB
Vue
138 lines
3.6 KiB
Vue
<template>
|
||
<view class="u-m-l-32 u-m-r-32">
|
||
<view class="u-p-32 br16 bg-white u-m-t-16">
|
||
滨江区XXX门店
|
||
</view>
|
||
|
||
<view class="bg-white u-p-32 u-m-t-36 br8">
|
||
<view class="row u-col-top">
|
||
<view>
|
||
<u-image :src="cloudPath + 'img/banner.png'" width="124" height="124" border-radius="8"></u-image>
|
||
</view>
|
||
<view>
|
||
<view class="u-font-32 u-m-l-16">
|
||
<text class="bold-600">煎饼果子套餐</text>
|
||
<text class="u-font-24 u-m-l-8">x1</text>
|
||
</view>
|
||
<view class="sm text-999 u-m-l-16 u-m-t-8">
|
||
<text>味浓芳香</text>
|
||
<text class="u-m-l-8 u-m-r-8">|</text>
|
||
<text>味浓芳香</text>
|
||
<text class="u-m-l-8 u-m-r-8">|</text>
|
||
<text>味浓芳香</text>
|
||
</view>
|
||
<view class="u-m-l-16 u-m-t-8 row">
|
||
<view>
|
||
<price-format color="#FF4A18" :price="12.9" :subscriptSize="22" :firstSize="34" :secondSize="26"></price-format>
|
||
</view>
|
||
<view class="u-m-l-8">
|
||
<price-format :lineThrough="true" color="#C0C0C0" :subscriptSize="22" :firstSize="22" :secondSize="22" :price="16.9"></price-format>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="bg-white u-p-32 u-m-t-32">
|
||
<view class="row-between">
|
||
<view class="nr">商品总价</view>
|
||
<view>
|
||
<price-format color="#000" :price="12.9" :subscriptSize="22" :firstSize="34" :secondSize="26"></price-format>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="u-m-t-24 u-m-b-24">
|
||
<u-line color="#E5E6EB" />
|
||
</view>
|
||
|
||
<view class="row-between mt10">
|
||
<view>订单运费</view>
|
||
<view>￥130.00</view>
|
||
</view>
|
||
|
||
<view class="u-m-t-24 u-m-b-24">
|
||
<u-line color="#E5E6EB" />
|
||
</view>
|
||
|
||
<view class="row-between mt10">
|
||
<view>优惠券</view>
|
||
<view class="primary">
|
||
<price-format :price="12.9" :subscriptSize="22" :firstSize="34" :secondSize="26"></price-format>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="u-m-t-24 u-m-b-24">
|
||
<u-line color="#E5E6EB" />
|
||
</view>
|
||
|
||
<view class="row-between mt10">
|
||
<view>实付款</view>
|
||
<view class="primary">
|
||
<price-format :price="12.9" :subscriptSize="22" :firstSize="34" :secondSize="26"></price-format>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="bg-white u-p-32 u-m-t-40 br8">
|
||
<view class="bold-600 u-font-28">订单信息</view>
|
||
<view class="text-attr u-m-t-16">
|
||
<view class="u-m-t-8 row-between">
|
||
<view>订单编号：</view>
|
||
<view>134213234122321232123</view>
|
||
</view>
|
||
<view class="u-m-t-8 row-between">
|
||
<view>支付方式：</view>
|
||
<view>微信支付</view>
|
||
</view>
|
||
<view class="u-m-t-8 row-between">
|
||
<view>下单时间：</view>
|
||
<view>2022-11-10 15:26:07</view>
|
||
</view>
|
||
<view class="u-m-t-8 row-between">
|
||
<view>付款时间：</view>
|
||
<view>2022-11-10 15:26:07</view>
|
||
</view>
|
||
<view class="u-m-t-8 row-between">
|
||
<view>取餐时间：</view>
|
||
<view>2022-11-10 15:26:07</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="fixed row-end u-text-center btn-group bg-white u-p-t-20">
|
||
<view>
|
||
<u-button @click="mpLogin" hover-class="none" :customStyle="{width: '160rpx', height: '80rpx', backgroundColor: themeColor, color: '#fff', border: 'none', padding: '16rpx 0', borderRadius: '8rpx'}" :hair-line="false">确认退款</u-button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
page {
|
||
background-color: #F6F8FA;
|
||
}
|
||
|
||
.text-attr {
|
||
color: #86909C;
|
||
}
|
||
|
||
.fixed {
|
||
position: fixed;
|
||
bottom: 0;
|
||
left: 0;
|
||
right: 0;
|
||
padding-bottom: env(safe-area-inset-bottom);
|
||
}
|
||
|
||
.btn-group {
|
||
& > view {
|
||
height: 100rpx;
|
||
}
|
||
}
|
||
</style> |