zhangjing/ysdH5
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[本时生活h5端]

Browse Source
This commit is contained in:
张慢慢
2023-06-21 17:19:58 +08:00
commit ebb9575bd0
284 changed files with 39689 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

229
pages/draw/orderDetails.vue Normal file
View File

@@ -0,0 +1,229 @@
<template>
<view class="content">
<view class="orderData">
<view class="While">
<view class="orderData-cont-label">
<image class="orderData-cont-img" src="/static/icon/orderIcon_01.png" mode="aspectFill"></image>
<view class="orderData-cont-text">
<view class="orderData-cont-name">订单编号</view>
<view class="orderData-cont-copy">
<text class="nowrap">57843657846357834</text>
<view bindtap="copyUrl">复制</view>
</view>
</view>
</view>
<view class="orderData-cont-label">
<image class="orderData-cont-img" src="/static/icon/orderIcon_00.png" mode="aspectFill"></image>
<view class="orderData-cont-text">
<view class="orderData-cont-name">慢慢悠 <text>1800000000</text></view>
<view class="orderData-cont-copy">
汗水里156高
</view>
</view>
</view>
</view>
<view class="While reserveCont">
<view class="reserveCont-title">订单信息</view>
<view class="reserve-label">
<view class="reserve-name">商品</view>
<view class="reserve-text">乐心血压仪</view>
</view>
<view class="reserve-label">
<view class="reserve-name">金额</view>
<view class="reserve-text reserve-red">￥399</view>
</view>
<view class="reserve-label">
<view class="reserve-name">交易时间</view>
<view class="reserve-text">2022-09-23 15:00</view>
</view>
<view class="reserve-label">
<view class="reserve-name">运费金额</view>
<view class="reserve-text">免邮</view>
</view>
<view class="reserve-label">
<view class="reserve-name">交易状态</view>
<view class="reserve-text green">待发货</view>
</view>
</view>
<view class="While reserveCont">
<view class="reserveCont-title">物流信息</view>
<view class="reserve-label">
<view class="reserve-name">物流公司</view>
<view class="reserve-text">顺丰速递</view>
</view>
<view class="reserve-label">
<view class="reserve-name">收货姓名</view>
<view class="reserve-text green">慢悠悠</view>
</view>
<view class="reserve-label">
<view class="reserve-name">收货电话</view>
<view class="reserve-text green">15000000000</view>
</view>
<view class="reserve-label">
<view class="reserve-name">物流单号</view>
<view class="reserve-text">6546546546546<view class="reserve-copy" bindtap="copyUrl">复制</view>
</view>
</view>
</view>
</view>
<view class="order-data-footer">
<navigator hover-class="none" class="order-btn" open-type="navigateBack">返回订单</navigator>
<view class="order-btn" bindtap="signClick">签收订单</view>
</view>
</view>
</template>
<script>
import { } from '@/apis/interfaces/draw'
export default {
data() {
return {
}
},
onShow() {
// 存储环境-用户抽奖活动
getApp().globalData.envType = 'drawEnv'
},
methods: {
}
}
</script>
<style lang="scss">
page {
padding: 30rpx;
box-sizing: border-box;
}
.orderData {
border-bottom: 70rpx transparent solid;
}
.While {
border-radius: 10rpx;
margin-bottom: 30rpx;
background-color: #FFFFFF;
box-shadow: 0 0 10rpx rgba(0, 0, 0, .05);
}
/* 订单 */
.orderData-cont-label {
padding: 40rpx 30rpx;
display: flex;
box-sizing: border-box;
border-bottom: #f2f2f2 2rpx solid;
.orderData-cont-img {
width: 48rpx;
height: 48rpx;
vertical-align: middle;
}
.orderData-cont-text {
width: calc(100% - 68rpx);
margin-left: 20rpx;
box-sizing: border-box;
}
.orderData-cont-name {
margin-bottom: 10rpx;
}
.orderData-cont-name text {
color: #999;
padding-left: 20rpx;
}
.orderData-cont-copy {
display: flex;
font-size: 28rpx;
color: #999;
}
.orderData-cont-copy text {
flex: 1;
display: inline-block;
margin-right: 20rpx;
}
.orderData-cont-copy view {
color: #e31828;
}
}
/* 规格 */
.reserveCont-title {
font-weight: 600;
padding: 30rpx;
}
.reserve-label {
display: flex;
padding: 0 30rpx 30rpx;
box-sizing: border-box;
font-size: 28rpx;
}
.reserve-name {
flex: 1;
width: 200rpx;
margin-right: 20rpx;
color: #7e7e7e;
}
.reserve-text {
width: calc(100% - 240rpx);
text-align: right;
line-height: 50rpx;
}
.reserve-copy {
color: #fa8524;
border: #fa8524 2rpx solid;
display: inline-block;
height: 34rpx;
line-height: 34rpx;
font-size: 26rpx;
padding: 0 10rpx;
border-radius: 4rpx;
margin-left: 10rpx;
}
.reserve-red {
font-weight: 600;
color: #e31828;
}
/* 底部菜单 */
.order-data-footer {
position: fixed;
bottom: 0;
left: 0;
right: 0;
border-top: solid 1rpx #f2f2f2;
padding-top: 17rpx;
padding-right: 30rpx;
padding-left: 30rpx;
height: 83rpx;
background: white;
display: flex;
flex-wrap: wrap;
flex-direction: row-reverse;
z-index: 9;
}
.order-btn {
margin-left: 20rpx;
height: 58rpx;
line-height: 58rpx;
box-sizing: border-box;
border: solid 1rpx #747788;
padding: 0 20rpx;
font-size: 26rpx;
border-radius: 10rpx;
margin-top: 5rpx;
}
</style>