|
@@ -3,13 +3,14 @@
|
|
|
|
|
|
<view class="top">
|
|
<view class="top">
|
|
<view class="orderState">
|
|
<view class="orderState">
|
|
- <image src="../../static/img/icon_order_def.png" mode="" style="width: 44rpx;height: 44rpx;"></image>
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- <view class="SheetState" v-if="orderData.orderSheet.sheetState == 0">待确认</view>
|
|
|
|
- <view class="SheetState" v-if="orderData.orderSheet.sheetState == 1">预约中</view>
|
|
|
|
- <view class="SheetState" v-if="orderData.orderSheet.sheetState == 2">已到店</view>
|
|
|
|
- <view class="SheetState" v-if="orderData.orderSheet.sheetState == 3">已取消</view>
|
|
|
|
|
|
+ <image src="../../../static/img/icon_order_def.png" mode="" style="width: 44rpx;height: 44rpx;"></image>
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ <view class="SheetState" v-if="orderData.orderSheet.sheetState == 1">待付款</view>
|
|
|
|
+ <view class="SheetState" v-if="orderData.orderSheet.sheetState == 2">待服务</view>
|
|
|
|
+ <view class="SheetState" v-if="orderData.orderSheet.sheetState == 3">已完成</view>
|
|
|
|
+ <view class="SheetState" v-if="orderData.orderSheet.sheetState == 4">已取消</view>
|
|
|
|
+
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
|
|
@@ -17,118 +18,191 @@
|
|
|
|
|
|
<!-- 店铺信息 -->
|
|
<!-- 店铺信息 -->
|
|
<view class="shopBox">
|
|
<view class="shopBox">
|
|
- <image src="../../static/img/icon_store.png" mode="" class="shopBoximg"></image>
|
|
|
|
|
|
+ <image src="../../../static/img/icon_store.png" mode="" class="shopBoximg"></image>
|
|
<view class="shopCont">
|
|
<view class="shopCont">
|
|
<view class="shopName">{{orderData.shopInfo.shopName}}</view>
|
|
<view class="shopName">{{orderData.shopInfo.shopName}}</view>
|
|
- <view class="Address">{{orderData.shopInfo.province}}{{orderData.shopInfo.city}}{{orderData.shopInfo.area}}{{orderData.shopInfo.address}}</view>
|
|
|
|
|
|
+ <view class="Address">
|
|
|
|
+ {{orderData.shopInfo.provinceName}}{{orderData.shopInfo.cityName}}{{orderData.shopInfo.areaName}}{{orderData.shopInfo.address}}
|
|
|
|
+ </view>
|
|
|
|
|
|
</view>
|
|
</view>
|
|
<view class="shopRightBox" @click="map">
|
|
<view class="shopRightBox" @click="map">
|
|
|
|
|
|
- <image src="../../static/img/icon_ditu.png" mode="" class="shopRightImg"></image>
|
|
|
|
|
|
+ <image src="../../../static/img/icon_ditu.png" mode="" class="shopRightImg"></image>
|
|
|
|
|
|
<view class="shopRihgtTxt">地图</view>
|
|
<view class="shopRihgtTxt">地图</view>
|
|
</view>
|
|
</view>
|
|
<view class="shopsx"></view>
|
|
<view class="shopsx"></view>
|
|
<view class="shopRightBox" @click="call">
|
|
<view class="shopRightBox" @click="call">
|
|
|
|
|
|
- <image src="../../static/img/icon_phone.png" mode="" class="shopRightImg"></image>
|
|
|
|
|
|
+ <image src="../../../static/img/icon_phone.png" mode="" class="shopRightImg"></image>
|
|
|
|
|
|
<view class="shopRihgtTxt">电话</view>
|
|
<view class="shopRihgtTxt">电话</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
+ <!-- 订单内容 -->
|
|
|
|
+ <view class="information">
|
|
|
|
+ <view class="detailedTitle">订单内容</view>
|
|
|
|
+ <view class="goodsName">{{orderData.OpenSheetQRCodeList.itemName}}轮毂去污护理(4支)</view>
|
|
|
|
+ <view class="informationLine2">
|
|
|
|
+ <view class="informationNum">¥{{orderData.OpenSheetQRCodeList.totalPrice}}24</view>
|
|
|
|
+ <view class="informationNum">
|
|
|
|
+ x2{{orderData.OpenSheetQRCodeList.noWriteoffQty+orderData.OpenSheetQRCodeList.writeoffQty}}</view>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ <view>
|
|
|
|
+ <view class="goodsName">券码信息({{orderData.OpenSheetQRCodeList.noWriteoffQty}}张可用)</view>
|
|
|
|
+ <view class="detailedLine" v-for="(v,index) in orderData.OpenSheetQRCodeList.OpenSheetQRCode">
|
|
|
|
+ <view class="detailedName"><span class="redPoint"></span> 938393 <span class="quanState"
|
|
|
|
+ v-if="v.WriteoffState==3">待使用</span></view>
|
|
|
|
+ <view class="detailedName old"><span class="redPoint"></span> 938393 <span class="quanState"
|
|
|
|
+ v-if="v.WriteoffState==1">已使用</span></view>
|
|
|
|
+ <image src="../../../static/img/icon_erweima.png" mode="" style="width: 36rpx;height: 36rpx;"
|
|
|
|
+ v-if="v.WriteoffState==3"></image>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
|
|
- <!-- 订单信息 -->
|
|
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ <!-- 套餐内容 -->
|
|
<view class="information">
|
|
<view class="information">
|
|
- <view class="detailedTitle">基本信息</view>
|
|
|
|
- <view class="informationLine">
|
|
|
|
- <view class="informationTxt">车牌号:</view>
|
|
|
|
- <view class="informationNum">{{orderData.orderSheet.plateNumber}}</view>
|
|
|
|
|
|
+ <view class="detailedTitle">套餐内容</view>
|
|
|
|
+ <!-- 项目 -->
|
|
|
|
+ <view class="itemBox">
|
|
|
|
+ <!-- 头 -->
|
|
|
|
+ <view class="itemTop">
|
|
|
|
+ <view class="topTitle leftItem">项目名称</view>
|
|
|
|
+ <view class="topTitle">数量</view>
|
|
|
|
+ <view class="topTitle">有效期</view>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ <view v-for="(item,index) in orderData.projectList" :key="index">
|
|
|
|
+ <view class="itemContent">
|
|
|
|
+ <view class="topTitle leftItem">{{item.flowName}}</view>
|
|
|
|
+ <view class="topTitle">{{item.flowQty}}</view>
|
|
|
|
+ <view class="topTitle">{{item.date}}</view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
</view>
|
|
</view>
|
|
|
|
+
|
|
|
|
+ <!-- 商品 -->
|
|
|
|
+ <view class="itemBox">
|
|
|
|
+ <!-- 头 -->
|
|
|
|
+ <view class="itemTop">
|
|
|
|
+ <view class="topTitle leftItem">商品名称</view>
|
|
|
|
+ <view class="topTitle">数量</view>
|
|
|
|
+ <view class="topTitle">有效期</view>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ <view v-for="(item,index) in orderData.shopList" :key="index">
|
|
|
|
+ <view class="itemContent">
|
|
|
|
+ <view class="topTitle leftItem">{{item.flowName}}</view>
|
|
|
|
+ <view class="topTitle">{{item.flowQty}}</view>
|
|
|
|
+ <view class="topTitle">{{item.date}}</view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ <!-- 实付款 -->
|
|
|
|
+ <view class="money">
|
|
|
|
+ <view class="informationNum">实付款:</view>
|
|
|
|
+ <view class="informationNum" style="color: #FF0000;">¥235{{orderData.data.realMoney}}</view>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ <!-- 订单信息 -->
|
|
|
|
+ <view class="information">
|
|
|
|
+ <view class="detailedTitle">订单信息</view>
|
|
<view class="informationLine">
|
|
<view class="informationLine">
|
|
- <view class="informationTxt">手机号:</view>
|
|
|
|
- <view class="informationNum">{{orderData.orderSheet.mobilePhone}}</view>
|
|
|
|
|
|
+ <view class="informationTxt">订单单号:</view>
|
|
|
|
+ <view class="informationNum">{{orderData.data.code}}<span class="codeCopy"
|
|
|
|
+ @click="copy(orderData.data.code)">复制</span></view>
|
|
</view>
|
|
</view>
|
|
<view class="informationLine">
|
|
<view class="informationLine">
|
|
- <view class="informationTxt">预约时间:</view>
|
|
|
|
- <view class="informationNum">{{orderData.orderSheet.billDate}}</view>
|
|
|
|
|
|
+ <view class="informationTxt">下单人:</view>
|
|
|
|
+ <view class="informationNum">{{orderData.data.nickName}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="informationLine">
|
|
<view class="informationLine">
|
|
- <view class="informationTxt">单号:</view>
|
|
|
|
- <view class="informationNum">{{orderData.orderSheet.code}}</view>
|
|
|
|
|
|
+ <view class="informationTxt">下单时间:</view>
|
|
|
|
+ <view class="informationNum">{{orderData.data.createTime}}</view>
|
|
</view>
|
|
</view>
|
|
|
|
+
|
|
<view class="informationLine">
|
|
<view class="informationLine">
|
|
- <view class="informationTxt">备注:</view>
|
|
|
|
- <view class="informationNum">{{orderData.orderSheet.comment}}</view>
|
|
|
|
|
|
+ <view class="informationTxt">订单备注:</view>
|
|
|
|
+ <view class="informationNum">{{orderData.data.comment}}</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
- <!-- 项目明细 -->
|
|
|
|
- <view class="detailedBox itemBox" v-if=" orderData.orderDetails.length!=0">
|
|
|
|
- <view class="detailedTitle">预约项目</view>
|
|
|
|
- <view class="detailedLineBox">
|
|
|
|
- <view class="detailedLine" v-for="(v,index) in orderData.orderDetails">
|
|
|
|
- <view class="detailedName">{{v.itemName}}</view>
|
|
|
|
- <span>¥{{v.amountMoney}}</span>
|
|
|
|
- </view>
|
|
|
|
- <view class="detailedLine" v-if=" orderData.orderDetails.length!=0">
|
|
|
|
- <view class="detailedName">预估总价</view>
|
|
|
|
- <span v-if="orderData.sumMoney>0">¥{{orderData.sumMoney}}</span>
|
|
|
|
- </view>
|
|
|
|
- <view class="content">温馨提示:该报价仅为参考价格,实际以门店为准(不同品牌和车型费用会不同)</view>
|
|
|
|
|
|
+ <!-- 支付信息 -->
|
|
|
|
+ <view class="information">
|
|
|
|
+ <view class="detailedTitle">支付信息</view>
|
|
|
|
+ <view class="informationLine">
|
|
|
|
+ <view class="informationTxt">支付状态:</view>
|
|
|
|
+ <view class="informationNum" v-if="orderData.data.payState==1">未支付</view>
|
|
|
|
+ <view class="informationNum" v-if="orderData.data.payState==2">已支付</view>
|
|
</view>
|
|
</view>
|
|
|
|
+ <view class="informationLine">
|
|
|
|
+ <view class="informationTxt">支付方式:</view>
|
|
|
|
+ <view class="informationNum" v-if="orderData.data.payType==1">在线支付</view>
|
|
|
|
+ <view class="informationNum" v-if="orderData.data.payType==2">线下支付</view>
|
|
|
|
+ </view>
|
|
|
|
+ <view class="informationLine">
|
|
|
|
+ <view class="informationTxt">支付时间:</view>
|
|
|
|
+ <view class="informationNum">{{orderData.data.payTime}}</view>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
</view>
|
|
</view>
|
|
|
|
|
|
-
|
|
|
|
- <view class="bottom" v-if="(orderData.orderSheet.sheetState == 0)||(orderData.orderSheet.sheetState == 1)">
|
|
|
|
-
|
|
|
|
- <view class="cancel" @click="cancelBespeak" >取消预约</view>
|
|
|
|
- <view class="defer" @click="cktime">延期</view>
|
|
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ <view class="bottom" v-if="orderData.orderSheet.sheetState == 1">
|
|
|
|
+
|
|
|
|
+ <view class="cancel" @click="cancelBespeak">取消订单</view>
|
|
|
|
+ <view class="defer" @click="pay">立即支付</view>
|
|
</view>
|
|
</view>
|
|
-
|
|
|
|
- <!-- 预约时间 -->
|
|
|
|
- <timeSelect ref="timeSelect" :timedata="timedata" @changeTime="changeTime"></timeSelect>
|
|
|
|
|
|
+
|
|
|
|
|
|
</view>
|
|
</view>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
- import timeSelect from '@/components/timeSelect/timeSelect.vue'
|
|
|
|
export default {
|
|
export default {
|
|
- components: {
|
|
|
|
- timeSelect
|
|
|
|
- },
|
|
|
|
-
|
|
|
|
|
|
+
|
|
|
|
+
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
- location: '',
|
|
|
|
|
|
+
|
|
id: '',
|
|
id: '',
|
|
orderData: '',
|
|
orderData: '',
|
|
- timedata:'',
|
|
|
|
- billDate:'',
|
|
|
|
|
|
+
|
|
|
|
|
|
}
|
|
}
|
|
},
|
|
},
|
|
onLoad(opt) {
|
|
onLoad(opt) {
|
|
-
|
|
|
|
|
|
+
|
|
this.id = opt.id
|
|
this.id = opt.id
|
|
-
|
|
|
|
|
|
+
|
|
if (this.id) {
|
|
if (this.id) {
|
|
this.getData()
|
|
this.getData()
|
|
}
|
|
}
|
|
|
|
|
|
},
|
|
},
|
|
-
|
|
|
|
|
|
+
|
|
methods: {
|
|
methods: {
|
|
- changeTime(data){
|
|
|
|
- console.log(data)
|
|
|
|
- this.billDate=data
|
|
|
|
- this.upTime();
|
|
|
|
- },
|
|
|
|
- cktime(){
|
|
|
|
- this.$refs.timeSelect.open();
|
|
|
|
|
|
+ copy(txt) {
|
|
|
|
+ uni.setClipboardData({
|
|
|
|
+ data: txt,
|
|
|
|
+ success: function() {
|
|
|
|
+ uni.showToast({
|
|
|
|
+ title: '复制成功',
|
|
|
|
+ icon: 'none',
|
|
|
|
+ duration: 2000
|
|
|
|
+ });
|
|
|
|
+ }
|
|
|
|
+ });
|
|
},
|
|
},
|
|
upTime() {
|
|
upTime() {
|
|
uni.showLoading({
|
|
uni.showLoading({
|
|
@@ -136,15 +210,15 @@
|
|
})
|
|
})
|
|
var that = this
|
|
var that = this
|
|
this.$http('openreservation/carOwner/updateTimeOfAppointment', {
|
|
this.$http('openreservation/carOwner/updateTimeOfAppointment', {
|
|
-
|
|
|
|
|
|
+
|
|
id: this.id,
|
|
id: this.id,
|
|
shopId: this.orderData.shopInfo.id,
|
|
shopId: this.orderData.shopInfo.id,
|
|
- billDate:this.billDate
|
|
|
|
|
|
+ billDate: this.billDate
|
|
}, 'POST').then(res => {
|
|
}, 'POST').then(res => {
|
|
uni.hideLoading();
|
|
uni.hideLoading();
|
|
// var list = res.data.Items
|
|
// var list = res.data.Items
|
|
var list = res.data
|
|
var list = res.data
|
|
- console.log("result+=",res.data);
|
|
|
|
|
|
+ console.log("result+=", res.data);
|
|
uni.showToast({
|
|
uni.showToast({
|
|
title: '延期成功',
|
|
title: '延期成功',
|
|
icon: 'none',
|
|
icon: 'none',
|
|
@@ -153,8 +227,8 @@
|
|
setTimeout(function() {
|
|
setTimeout(function() {
|
|
that.getData();
|
|
that.getData();
|
|
}, 1000);
|
|
}, 1000);
|
|
-
|
|
|
|
-
|
|
|
|
|
|
+
|
|
|
|
+
|
|
})
|
|
})
|
|
},
|
|
},
|
|
cancelBespeak() {
|
|
cancelBespeak() {
|
|
@@ -162,11 +236,10 @@
|
|
title: '加载中'
|
|
title: '加载中'
|
|
})
|
|
})
|
|
var that = this
|
|
var that = this
|
|
- this.$http('openreservation/carOwner/updateState', {
|
|
|
|
-
|
|
|
|
|
|
+ this.$http('openOrderManagement/updateSheetState', {
|
|
|
|
+
|
|
id: this.id,
|
|
id: this.id,
|
|
- shopId: this.orderData.shopInfo.id,
|
|
|
|
- sheetState:3
|
|
|
|
|
|
+
|
|
}, 'POST').then(res => {
|
|
}, 'POST').then(res => {
|
|
uni.hideLoading();
|
|
uni.hideLoading();
|
|
// var list = res.data.Items
|
|
// var list = res.data.Items
|
|
@@ -195,7 +268,8 @@
|
|
latitude: Number(that.orderData.shopInfo.lat),
|
|
latitude: Number(that.orderData.shopInfo.lat),
|
|
longitude: Number(that.orderData.shopInfo.lng),
|
|
longitude: Number(that.orderData.shopInfo.lng),
|
|
name: that.orderData.shopInfo.shopName,
|
|
name: that.orderData.shopInfo.shopName,
|
|
- address: that.orderData.shopInfo.province+that.orderData.shopInfo.city+that.orderData.shopInfo.area+that.orderData.shopInfo.address,
|
|
|
|
|
|
+ address: that.orderData.shopInfo.provinceName + that.orderData.shopInfo.cityName + that
|
|
|
|
+ .orderData.shopInfo.areaName + that.orderData.shopInfo.address,
|
|
success: function() {
|
|
success: function() {
|
|
console.log('success');
|
|
console.log('success');
|
|
},
|
|
},
|
|
@@ -220,28 +294,27 @@
|
|
});
|
|
});
|
|
|
|
|
|
this.$http('openreservation/orderSheetDetails', {
|
|
this.$http('openreservation/orderSheetDetails', {
|
|
- // lat: this.location.lat,
|
|
|
|
- // lng: this.location.lng,
|
|
|
|
|
|
+
|
|
id: this.id,
|
|
id: this.id,
|
|
}, 'GET').then(res => {
|
|
}, 'GET').then(res => {
|
|
uni.hideLoading();
|
|
uni.hideLoading();
|
|
this.orderData = res.data;
|
|
this.orderData = res.data;
|
|
|
|
|
|
-
|
|
|
|
-
|
|
|
|
|
|
+
|
|
|
|
+
|
|
})
|
|
})
|
|
},
|
|
},
|
|
-
|
|
|
|
|
|
+
|
|
goback() {
|
|
goback() {
|
|
|
|
|
|
uni.navigateBack({})
|
|
uni.navigateBack({})
|
|
|
|
|
|
|
|
|
|
},
|
|
},
|
|
-
|
|
|
|
|
|
+
|
|
},
|
|
},
|
|
onPullDownRefresh() {
|
|
onPullDownRefresh() {
|
|
-
|
|
|
|
|
|
+
|
|
this.getData()
|
|
this.getData()
|
|
setTimeout(function() {
|
|
setTimeout(function() {
|
|
uni.stopPullDownRefresh();
|
|
uni.stopPullDownRefresh();
|
|
@@ -346,97 +419,13 @@
|
|
}
|
|
}
|
|
|
|
|
|
.shopRightBox {
|
|
.shopRightBox {
|
|
-
|
|
|
|
- padding-left: 28rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .peopleCont {
|
|
|
|
- font-size: 28rpx;
|
|
|
|
- color: #3C3C3C;
|
|
|
|
- padding-left: 20rpx;
|
|
|
|
- }
|
|
|
|
|
|
|
|
- .people {
|
|
|
|
- display: flex;
|
|
|
|
- padding-left: 20rpx;
|
|
|
|
- padding-top: 30rpx;
|
|
|
|
- padding-bottom: 36rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .PlateNumberBox {
|
|
|
|
- display: flex;
|
|
|
|
- padding-left: 20rpx;
|
|
|
|
- padding-bottom: 30rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .PlateNumbercx {
|
|
|
|
- font-size: 28rpx;
|
|
|
|
-
|
|
|
|
- color: #3C3C3C;
|
|
|
|
- padding-left: 20rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .PlateNumber {
|
|
|
|
- width: 130rpx;
|
|
|
|
- height: 32rpx;
|
|
|
|
- border-radius: 4rpx;
|
|
|
|
- border: 1px solid #F19D01;
|
|
|
|
- line-height: 32rpx;
|
|
|
|
- text-align: center;
|
|
|
|
- font-size: 22rpx;
|
|
|
|
- color: #F19D01;
|
|
|
|
- margin-left: 26rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .PlateNumberBoxTop {
|
|
|
|
- display: flex;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .CarModel {
|
|
|
|
- font-size: 26rpx;
|
|
|
|
- color: #999999;
|
|
|
|
- padding-left: 20rpx;
|
|
|
|
- padding-top: 6rpx;
|
|
|
|
- padding-right: 20rpx;
|
|
|
|
- padding-bottom: 15rpx;
|
|
|
|
- width: 600rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .detailedBox {
|
|
|
|
-
|
|
|
|
- background: #FFFFFF;
|
|
|
|
- border-radius: 10px;
|
|
|
|
- margin: 20rpx 24rpx;
|
|
|
|
- padding-bottom: 20rpx;
|
|
|
|
|
|
+ padding-left: 28rpx;
|
|
}
|
|
}
|
|
|
|
|
|
- .itemBox {
|
|
|
|
- margin-top: 20rpx;
|
|
|
|
- }
|
|
|
|
|
|
|
|
- .carMes {
|
|
|
|
- padding: 23rpx 20rpx;
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
- justify-content: flex-start;
|
|
|
|
- border-bottom: 1rpx solid #EEEEEE;
|
|
|
|
- }
|
|
|
|
|
|
|
|
- .plate {
|
|
|
|
- font-size: 30rpx;
|
|
|
|
- color: #3C3C3C;
|
|
|
|
- font-weight: bold;
|
|
|
|
- margin-right: 20rpx;
|
|
|
|
- }
|
|
|
|
|
|
|
|
- .mileage {
|
|
|
|
- font-size: 24rpx;
|
|
|
|
- color: #F19D01;
|
|
|
|
- padding: 0rpx 10rpx;
|
|
|
|
- border: 1rpx solid #F19D01;
|
|
|
|
- border-radius: 4rpx;
|
|
|
|
- height: 36rpx;
|
|
|
|
- }
|
|
|
|
|
|
|
|
.detailedTitle {
|
|
.detailedTitle {
|
|
padding: 23rpx 20rpx;
|
|
padding: 23rpx 20rpx;
|
|
@@ -453,8 +442,9 @@
|
|
|
|
|
|
.detailedLine {
|
|
.detailedLine {
|
|
display: flex;
|
|
display: flex;
|
|
- padding: 20rpx 20rpx 0rpx;
|
|
|
|
|
|
+ padding: 15rpx 20rpx;
|
|
justify-content: space-between;
|
|
justify-content: space-between;
|
|
|
|
+ align-items: center;
|
|
}
|
|
}
|
|
|
|
|
|
.detailedImg {
|
|
.detailedImg {
|
|
@@ -463,73 +453,90 @@
|
|
border-radius: 10rpx;
|
|
border-radius: 10rpx;
|
|
}
|
|
}
|
|
|
|
|
|
-
|
|
|
|
|
|
+
|
|
|
|
|
|
.detailedName {
|
|
.detailedName {
|
|
font-size: 26rpx;
|
|
font-size: 26rpx;
|
|
- color: #3C3C3C;
|
|
|
|
|
|
+ color: #333333;
|
|
}
|
|
}
|
|
|
|
|
|
- span{
|
|
|
|
- font-size: 26rpx;
|
|
|
|
|
|
+ .old {
|
|
color: #999999;
|
|
color: #999999;
|
|
|
|
+ text-decoration: line-through;
|
|
}
|
|
}
|
|
|
|
|
|
- .goodscost {
|
|
|
|
- width: 702rpx;
|
|
|
|
- background: #FFFFFF;
|
|
|
|
- border-radius: 10px;
|
|
|
|
- margin-left: 24rpx;
|
|
|
|
- margin-top: 20rpx;
|
|
|
|
- padding: 15rpx 0;
|
|
|
|
|
|
+ .redPoint {
|
|
|
|
+ width: 10rpx;
|
|
|
|
+ height: 10rpx;
|
|
|
|
+ background: #FF0000;
|
|
|
|
+ border-radius: 5rpx;
|
|
|
|
+ margin-right: 10rpx;
|
|
}
|
|
}
|
|
|
|
|
|
- .goodscostLine {
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: space-between;
|
|
|
|
- font-size: 28rpx;
|
|
|
|
- padding: 20rpx 20rpx;
|
|
|
|
- color: #666666;
|
|
|
|
- }
|
|
|
|
|
|
|
|
- .goodsCostNum {
|
|
|
|
- color: #3C3C3C;
|
|
|
|
- }
|
|
|
|
|
|
+
|
|
|
|
+
|
|
|
|
|
|
.information {
|
|
.information {
|
|
- width: 702rpx;
|
|
|
|
|
|
+
|
|
background: #FFFFFF;
|
|
background: #FFFFFF;
|
|
- border-radius: 10px;
|
|
|
|
- margin-left: 24rpx;
|
|
|
|
- margin-top: 20rpx;
|
|
|
|
- padding: 0rpx 0 15rpx 0;
|
|
|
|
|
|
+ border-radius: 10rpx;
|
|
|
|
+
|
|
|
|
+ margin: 20rpx 24rpx;
|
|
|
|
+ padding-bottom: 15rpx;
|
|
}
|
|
}
|
|
|
|
|
|
.informationLine {
|
|
.informationLine {
|
|
display: flex;
|
|
display: flex;
|
|
|
|
+
|
|
|
|
+ padding: 15rpx 20rpx;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .informationLine2 {
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: space-between;
|
|
font-size: 26rpx;
|
|
font-size: 26rpx;
|
|
padding: 15rpx 20rpx;
|
|
padding: 15rpx 20rpx;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+ .money {
|
|
|
|
+ background: #FFFFFF;
|
|
|
|
+ border-radius: 10rpx;
|
|
|
|
+
|
|
|
|
+ margin: 20rpx 24rpx;
|
|
|
|
+
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: space-between;
|
|
|
|
+ font-size: 26rpx;
|
|
|
|
+ padding: 30rpx 20rpx;
|
|
|
|
+ }
|
|
|
|
+
|
|
.informationTxt {
|
|
.informationTxt {
|
|
width: 190rpx;
|
|
width: 190rpx;
|
|
|
|
+ font-size: 26rpx;
|
|
color: #999999;
|
|
color: #999999;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+ .goodsName {
|
|
|
|
+ padding: 20rpx 20rpx 15rpx;
|
|
|
|
+ border-top: 1rpx solid #EEEEEE;
|
|
|
|
+ }
|
|
|
|
+
|
|
.informationNum {
|
|
.informationNum {
|
|
color: #333333;
|
|
color: #333333;
|
|
|
|
+ font-size: 26rpx;
|
|
}
|
|
}
|
|
|
|
|
|
- .copyBtn {
|
|
|
|
- width: 86rpx;
|
|
|
|
- height: 40rpx;
|
|
|
|
|
|
+ .codeCopy {
|
|
|
|
+ width: 77rpx;
|
|
|
|
+ height: 36rpx;
|
|
background: #F4F5F7;
|
|
background: #F4F5F7;
|
|
- border-radius: 20rpx;
|
|
|
|
|
|
+ border-radius: 22rpx;
|
|
font-size: 24rpx;
|
|
font-size: 24rpx;
|
|
color: #333333;
|
|
color: #333333;
|
|
text-align: center;
|
|
text-align: center;
|
|
- line-height: 40rpx;
|
|
|
|
- margin-left: 20rpx;
|
|
|
|
|
|
+ line-height: 33rpx;
|
|
|
|
+ padding: 0 15rpx;
|
|
}
|
|
}
|
|
|
|
|
|
.orderBottom {
|
|
.orderBottom {
|
|
@@ -543,231 +550,11 @@
|
|
justify-content: flex-end;
|
|
justify-content: flex-end;
|
|
}
|
|
}
|
|
|
|
|
|
- .cancelBtn {
|
|
|
|
- width: 150rpx;
|
|
|
|
- height: 56rpx;
|
|
|
|
- border-radius: 36rpx;
|
|
|
|
- border: 2rpx solid #DDDDDD;
|
|
|
|
- text-align: center;
|
|
|
|
- line-height: 56rpx;
|
|
|
|
- font-size: 28rpx;
|
|
|
|
- color: #3C3C3C;
|
|
|
|
- margin-top: 21rpx;
|
|
|
|
- margin-right: 16rpx;
|
|
|
|
- margin-left: 20rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .payBtn {
|
|
|
|
- width: 150rpx;
|
|
|
|
- height: 56rpx;
|
|
|
|
- border-radius: 36rpx;
|
|
|
|
- border: 2rpx solid #FF4F00;
|
|
|
|
- text-align: center;
|
|
|
|
- line-height: 56rpx;
|
|
|
|
- font-size: 28rpx;
|
|
|
|
- color: #FF4F00;
|
|
|
|
- margin-top: 21rpx;
|
|
|
|
- margin-right: 16rpx;
|
|
|
|
- margin-left: 20rpx;
|
|
|
|
- }
|
|
|
|
|
|
|
|
- .timeBox2 {
|
|
|
|
- width: 100vw;
|
|
|
|
- height: 100vh;
|
|
|
|
- background: rgba(0, 0, 0, 0.5);
|
|
|
|
- position: fixed;
|
|
|
|
- top: 0;
|
|
|
|
- left: 0;
|
|
|
|
- }
|
|
|
|
|
|
|
|
- .timeLeftActive {
|
|
|
|
- background: #FFFFFF;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timeMain {
|
|
|
|
- width: 100vw;
|
|
|
|
- height: 70vh;
|
|
|
|
- margin-top: 30vh;
|
|
|
|
- background: #FFFFFF;
|
|
|
|
- border-radius: 24rpx 24rpx 0px 0px;
|
|
|
|
- }
|
|
|
|
|
|
|
|
- .timesfNo {
|
|
|
|
- background: #F5F5F5;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timesfActive {
|
|
|
|
- background: #FF4F00;
|
|
|
|
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timesfActive .timeSfNum {
|
|
|
|
- color: #FFFFFF;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timesfActive .timeyy {
|
|
|
|
- color: #FFFFFF;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- .timeTop {
|
|
|
|
- display: flex;
|
|
|
|
- line-height: 90rpx;
|
|
|
|
- padding-left: 24rpx;
|
|
|
|
- padding-right: 24rpx;
|
|
|
|
- justify-content: space-between;
|
|
|
|
- }
|
|
|
|
|
|
|
|
- .timeTopTitle {
|
|
|
|
- font-size: 30rpx;
|
|
|
|
- font-family: PingFangSC-Medium, PingFang SC;
|
|
|
|
- font-weight: 600;
|
|
|
|
- color: #3C3C3C;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .close {
|
|
|
|
- color: #999999;
|
|
|
|
- font-size: 30rpx;
|
|
|
|
- padding-left: 30rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timeCont {
|
|
|
|
- height: calc(70vh - 210rpx);
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timeSv {
|
|
|
|
- height: calc(70vh - 210rpx);
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timeLeft2 {
|
|
|
|
- width: 162rpx;
|
|
|
|
- background: #F4F5F7;
|
|
|
|
- border-top: 1px soid #F4F5F7;
|
|
|
|
- border-right: 1px soid #F4F5F7;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timeRight2 {
|
|
|
|
- width: 588rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timesf {
|
|
|
|
- width: 165rpx;
|
|
|
|
- height: 98rpx;
|
|
|
|
- border-radius: 7rpx;
|
|
|
|
- border: 2rpx solid #EEEEEE;
|
|
|
|
- text-align: center;
|
|
|
|
- margin-left: 20rpx;
|
|
|
|
- margin-bottom: 24rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timeBottom {
|
|
|
|
- width: 750rpx;
|
|
|
|
- height: 120rpx;
|
|
|
|
- background: #FFFFFF;
|
|
|
|
- box-shadow: 0px -2px 20rpx 0px rgba(153, 153, 153, 0.2);
|
|
|
|
- display: flex;
|
|
|
|
- align-items: center;
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timerightBox {
|
|
|
|
- display: flex;
|
|
|
|
- flex-wrap: wrap;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timeCont {
|
|
|
|
- display: flex;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timeSfNum {
|
|
|
|
- color: #666666;
|
|
|
|
- font-size: 28rpx;
|
|
|
|
- padding-top: 15rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timeyy {
|
|
|
|
- font-size: 24rpx;
|
|
|
|
- color: #999999;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timecomplete {
|
|
|
|
- width: 690rpx;
|
|
|
|
- height: 74rpx;
|
|
|
|
- background: linear-gradient(124deg, #FF8700 0%, #FF4F00 100%);
|
|
|
|
- border-radius: 37rpx;
|
|
|
|
- line-height: 74rpx;
|
|
|
|
- text-align: center;
|
|
|
|
- font-size: 30rpx;
|
|
|
|
- color: #FFFFFF;
|
|
|
|
- margin-left: 30rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .timeleftLine {
|
|
|
|
- font-size: 30rpx;
|
|
|
|
- color: #999999;
|
|
|
|
- text-align: center;
|
|
|
|
- padding: 28rpx 10rpx;
|
|
|
|
- border-bottom: 1px solid #EEEEEE;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .yuyueBox {
|
|
|
|
-
|
|
|
|
- background: #FFFFFF;
|
|
|
|
- border-radius: 10rpx;
|
|
|
|
- margin-left: 24rpx;
|
|
|
|
- margin-right: 24rpx;
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .yuyueTime {
|
|
|
|
- display: flex;
|
|
|
|
- padding-left: 20rpx;
|
|
|
|
- padding-top: 30rpx;
|
|
|
|
- padding-bottom: 36rpx;
|
|
|
|
- align-items: center;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .yuyueState {
|
|
|
|
- display: flex;
|
|
|
|
- padding-left: 20rpx;
|
|
|
|
- padding-top: 30rpx;
|
|
|
|
- padding-bottom: 36rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .maBox {
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: space-between;
|
|
|
|
- padding: 24rpx 20rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .querenMa {
|
|
|
|
-
|
|
|
|
- margin: 20rpx 0;
|
|
|
|
- padding-bottom: 30rpx;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .maBoximg {
|
|
|
|
- width: 308rpx;
|
|
|
|
- height: 308rpx;
|
|
|
|
- margin: 30rpx 197rpx;
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .rightShou {
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: flex-start;
|
|
|
|
- align-items: center;
|
|
|
|
- }
|
|
|
|
- .content{
|
|
|
|
- background-color: #F4F5F7;
|
|
|
|
- border-radius: 10rpx;
|
|
|
|
- padding: 16rpx;
|
|
|
|
- color: #999999;
|
|
|
|
- font-size: 24rpx;
|
|
|
|
- margin: 20rpx;
|
|
|
|
- }
|
|
|
|
.bottom {
|
|
.bottom {
|
|
display: flex;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
justify-content: flex-end;
|
|
@@ -779,7 +566,8 @@
|
|
position: fixed;
|
|
position: fixed;
|
|
bottom: 0rpx;
|
|
bottom: 0rpx;
|
|
}
|
|
}
|
|
- .cancel{
|
|
|
|
|
|
+
|
|
|
|
+ .cancel {
|
|
color: #3C3C3C;
|
|
color: #3C3C3C;
|
|
font-size: 28rpx;
|
|
font-size: 28rpx;
|
|
width: 150rpx;
|
|
width: 150rpx;
|
|
@@ -790,6 +578,7 @@
|
|
line-height: 56rpx;
|
|
line-height: 56rpx;
|
|
margin-right: 40rpx;
|
|
margin-right: 40rpx;
|
|
}
|
|
}
|
|
|
|
+
|
|
.defer {
|
|
.defer {
|
|
color: #D53533;
|
|
color: #D53533;
|
|
font-size: 28rpx;
|
|
font-size: 28rpx;
|
|
@@ -801,6 +590,39 @@
|
|
line-height: 56rpx;
|
|
line-height: 56rpx;
|
|
margin-right: 40rpx;
|
|
margin-right: 40rpx;
|
|
}
|
|
}
|
|
-
|
|
|
|
-
|
|
|
|
-</style>
|
|
|
|
|
|
+
|
|
|
|
+ .itemBox {
|
|
|
|
+ margin: 20rpx;
|
|
|
|
+ border-radius: 10rpx;
|
|
|
|
+ border: 2rpx solid #EEEEEE;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .itemTop {
|
|
|
|
+ padding: 18rpx 20rpx;
|
|
|
|
+ background-color: #FFEFD5;
|
|
|
|
+
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: space-between;
|
|
|
|
+ align-content: center;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .topTitle {
|
|
|
|
+
|
|
|
|
+ font-size: 26rpx;
|
|
|
|
+ color: #333333;
|
|
|
|
+ margin-right: 10rpx;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .leftItem {
|
|
|
|
+ flex-grow: 1;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .itemContent {
|
|
|
|
+ padding: 20rpx;
|
|
|
|
+ background-color: #FFFFFF;
|
|
|
|
+
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: space-between;
|
|
|
|
+ align-content: center;
|
|
|
|
+ }
|
|
|
|
+</style>
|