1.修改肯德基 星巴克 会员充值订单详情

yj-dev
杨杰 2 years ago
parent daaa71c3ae
commit e76161559d
  1. 2
      pages/user/order_list/order_list.vue
  2. 219
      qianzhu-KFC/order-details/order-details.vue
  3. 13
      uni.scss

@ -58,7 +58,7 @@
<view class="width96 mart10 font12 fcor999"> <view class="width96 mart10 font12 fcor999">
订单编号:{{row.orderNo}} 订单编号:{{row.orderNo}}
</view> </view>
<view class="width96 height25 alijusstart"> <view class="width96 height25 paddbotm10 alijusstart">
<view class="width70 fotlt "> <view class="width70 fotlt ">
<view class="font12 text1 fcor999 mart5"> <view class="font12 text1 fcor999 mart5">
下单时间 : {{row.createTime | formatDate('-')}} 下单时间 : {{row.createTime | formatDate('-')}}

@ -15,7 +15,7 @@
</view> </view>
</view> </view>
<view class=" paddtop10 paddbotm10 headsbg backcorfff fotct" v-if="orderList.orderStatus != 1 "> <view class=" paddtop10 paddbotm10 headsbg backcorfff fotct" v-if="orderList.orderStatus != 1 && typeid != 10">
<view class="headotherstu alijus font18 fontwig6" <view class="headotherstu alijus font18 fontwig6"
v-if="orderList.orderStatus != 2 && orderList.orderStatus != 3"> v-if="orderList.orderStatus != 2 && orderList.orderStatus != 3">
<image mode="widthFix" class="width50" src="../static/imgs/otherstu.png"></image> <image mode="widthFix" class="width50" src="../static/imgs/otherstu.png"></image>
@ -25,26 +25,45 @@
{{typeText[orderList.orderStatus]}} {{typeText[orderList.orderStatus]}}
</view> </view>
<view v-if="(orderList.orderStatus == 2 || orderList.orderStatus == 3 ) && typeid != 10"> <view v-if="(orderList.orderStatus == 2 || orderList.orderStatus == 3 )">
<view class="fotct font16 width100 fcorfff">{{orderList.statusDesc}}</view>
<view v-if="typeid == 4 && orderList.list && phonestu == 2"> <view v-if="typeid == 4 && orderList.list && phonestu == 2">
<view class="width90 alijusstart mart10" v-for="(item,index) in orderList.list" :key='index'> <view class="width90 mart15" style="display: flow-root;">
<view class="font14 width50 fcor666">取餐号: <text class="colorc3 font18">{{item.code}}</text> <view class="fcor333 mart15 font24 fontspec width50 fotlt flleft height30h fontwig6"
</view> v-for="(item,index) in orderList.list" :key='index'>{{item.code}}
<view class="font14 width50 fcor666">手机尾号: <text class="medldcode fcorfff border-r font11">尾号{{item.phone}}</text>
<text class="colorc3 font18">{{item.phone}}</text>
</view> </view>
</view> </view>
</view> </view>
<view class="fotct" v-if="typeid == 4 && orderList.list && phonestu == 1"> <view class="fotct" v-if="typeid == 4 && orderList.list && phonestu == 1">
<view class="width90 alicntend mart10 " v-for="(item,index) in orderList.list" :key='index'> <view class="width90 mart15" style="display: flow-root;">
<view class="font14 width100 fcor666">取餐号: <text class="colorc3 font18">{{item.code}}</text> <view class="fcor333 mart15 font24 fontspec width50 fotlt flleft height30h fontwig6"
v-for="(item,index) in orderList.list" :key='index'>{{item.code}}
<text class="medldcode fcorfff border-r font11">取餐码</text>
</view>
</view>
</view>
<view class="font12 width90 fcor666 mart10 marb10 fotlt">订单已准备完毕喜欢您再来</view>
<view class="width90 height70 backcorfff border-r alijusstart paddbotm10">
<view class="width70 fotlt">
<view class="width94 fcor333 font14">请至柜台凭取餐码取餐</view>
<view class="width94 fcor666 font12 mart5">如有询问手机尾号请点击右侧按钮查看</view>
</view>
<view class="width30">
<view class="phoneck width85 border-r" v-if="typeid == 4 && orderList.list && phonestu == 1"
@click="updatestu(2)">
查看手机尾号
</view> </view>
<view class="phoneck width85 border-r" v-if="typeid == 4 && orderList.list && phonestu == 2"
@click="updatestu(1)">
隐藏手机尾号
</view> </view>
</view> </view>
<!-- <view class="fotct font20 width100 mart10 colorc3" v-if="typeid == 4 && orderList.list">请取餐</view> -->
<view class="phoneck" v-if="typeid == 4 && orderList.list && phonestu == 1" @click="updatestu">查看手机号
</view> </view>
<!-- 星巴克 -->
<view v-if="typeid == 9 && orderList.object.orderItems[0].code"> <view v-if="typeid == 9 && orderList.object.orderItems[0].code">
<view class="fotct font18 width100 mart10 color2f6f43" <view class="fotct font18 width100 mart10 color2f6f43"
v-for="(item,index) in orderList.object.orderItems" :key='index'>{{item.code}}</view> v-for="(item,index) in orderList.object.orderItems" :key='index'>{{item.code}}</view>
@ -54,20 +73,14 @@
</view> </view>
<view class="fotct font20 width100 mart10 color2f6f43" <view class="fotct font20 width100 mart10 color2f6f43"
v-if="typeid == 9 && !orderList.object.orderItems[0].code">{{orderList.statusDesc}}</view> v-if="typeid == 9 && !orderList.object.orderItems[0].code">{{orderList.statusDesc}}</view>
<!-- <view class="fotct font13 width100 mart15 fcor666">请至柜台凭取餐码取餐</view>
<view class="fotct font13 width100 mart5 fcor666">如有询问手机号尾号请告知</view>
<view class="fotct font13 width100 mart5 colorc3">:平台取餐手机号皆为虚拟号码</view> -->
<!-- <view class="fotct font20 width100 mart10 color2f6f43"
v-if="typeid == 9 && orderList.object.orderItems[0].code">请取餐</view> -->
</view> </view>
</view> </view>
<!-- <view class="width96 mart20 colorc3 font12 fotct"> <view class="concont width94 mart10 backcorfff">
:约5分钟后取餐,请尽快到餐厅取餐哦 <view class="width94 paddtop15 font16 fontwig6" v-if="typeid == 10">
</view> --> 充值明细
</view>
<view class="concont width94 mart20 backcorfff"> <view class="width94 paddtop15 font16 fontwig6 alijusstart" v-else>
<view class="width94 paddtop15 font16 fontwig6 alijusstart">
<image src="../static/imgs/desloca.png" mode="widthFix" class="icon20 marglerig"></image> 南充麦当劳潆华南路餐厅 <image src="../static/imgs/desloca.png" mode="widthFix" class="icon20 marglerig"></image> 南充麦当劳潆华南路餐厅
</view> </view>
<view class="width100 mart5"> <view class="width100 mart5">
@ -90,84 +103,86 @@
¥{{item.goodsPrice}}</view> ¥{{item.goodsPrice}}</view>
</view> </view>
</view> </view>
<view class="width90 fotrt height50 font13 fcor999">
<text class="fcor333 fontwig6" style="margin: 0px 5px;"> {{coutnums}} </text> 小计:
<text class="font16 colorc3 fontwig6 margle" v-if="typeid == 4 || typeid == 10">
¥{{orderList.totalPrice}}</text>
<text class="font16 color2f6f43 fontwig6 margle" v-if="typeid == 9 ">
¥{{orderList.totalPrice}}</text>
</view> </view>
<view class="width95 height20 borderleft alijusnostart">
<view style="width: 5%;"></view>
<view class="width95" style="border-bottom: 1px dashed #bebcbc;"></view>
</view>
<!-- <view class="width96" style="border:1px dashed #f4f4f4;"></view> -->
</view>
<view class="gooddes width94 backcorfff marb20">
<view class="width90w height20 bordertopleft alijusnostart">
<view class="width10"></view>
</view>
<view class="width94 alijusstart paddtop10 ">
<view class="font15 fcor333 fontwig6 width50">商品小计</view>
<view class="font14 fcor666 fotrt width50">金额 <text
class="margle fontwig6 font18 fcor333">¥{{orderList.totalPrice}}</text>
</view>
</view>
<view class="width92 fotrt mart5 font14 fcor999">
优惠券 <text class="margle fcoreb5 font16 fontwig6">¥ {{orderList.deductionPrice}}</text>
</view>
<view class="width92 fotrt mart5 font14 fcor999">
积分抵扣 <text class="margle fcoreb5 font16 fontwig6">¥ {{(orderList.payGold / 100).toFixed(2)}}</text>
</view> </view>
<view class="width96 mart10 marb5" style="border:1px dashed #f4f4f4;"></view> <view class="width90 mart10 marb10" style="border-bottom: 1px dashed #bebcbc;"></view>
<view class="width92 fotrt mart14 font14 fcor333">
实付 <text class="margle fcoreb5 font22 fontwig6">¥ {{orderList.payPrice}}</text>
</view>
<view class="width100 height20"></view>
</view> </view>
<view class="concont width94 mart10 backcorfff marb30">
<view class="width94 alijusstart paddtop10 font14 fcor666"> <view class="width94 backcorfff marb30" style="border-radius: 12px;">
<view class="width94 alijusstart paddtop10 font16 fontwig6 fcor333">
订单信息 订单信息
</view> </view>
<!-- <view class="width94 alijusstart mart20 font14 fcor666">
<view class="width30">取餐门店</view>
<view class="width70 fotrt">{{orderList.storeName}}-{{orderList.storeAddress}}</view>
</view> -->
<view class="width94 alijusstart mart20 font14 fcor666"> <view class="width94 alijusstart mart20 font14 fcor666">
<view class="width30">订单号</view> <view class="width30">交易单号</view>
<view class="width70 fotrt">{{orderList.orderNo}}</view> <view class="width70 fcor333 fotrt">{{orderList.orderNo}}</view>
</view> </view>
<view class="width94 alijusstart mart20 font14 fcor666" v-if="orderList.paySerialNo"> <view class="width94 alijusstart mart20 font14 fcor666" v-if="orderList.paySerialNo">
<view class="width30">支付流水号</view> <view class="width30">流水号</view>
<view class="width70 fotrt">{{orderList.paySerialNo}}</view> <view class="width70 fcor333 fotrt">{{orderList.paySerialNo}}</view>
</view> </view>
<view class="width94 alijusstart mart20 font14 fcor666" v-if="orderList.paySerialNo"> <view class="width94 alijusstart mart20 font14 fcor666" v-if="orderList.paySerialNo">
<view class="width30">下单时间</view> <view class="width30">下单时间</view>
<view class="width70 fotrt">{{orderList.createTime | timeFormat('yyyy-mm-dd hh:mm:ss')}}</view> <view class="width70 fcor333 fotrt">{{orderList.createTime | timeFormat('yyyy-mm-dd hh:mm:ss')}}</view>
</view> </view>
<view class="width94 alijusstart mart20 font14 fcor666" v-if="typeid == 4"> <view class="width94 alijusstart mart20 font14 fcor666" v-if="typeid == 4">
<view class="width30">就餐方式</view> <view class="width30">就餐方式</view>
<view class="width70 fotrt" v-if="orderList.eatType == 1">店内就餐</view> <view class="width70 fotrt" v-if="orderList.eatType == 1">店内就餐</view>
<view class="width70 fotrt" v-if="orderList.eatType == 2">打包带走</view> <view class="width70 fcor333 fotrt" v-if="orderList.eatType == 2">打包带走</view>
</view>
<view class="width94 alijusstart mart20 font14 fcor666">
<view class="width30">实付金额</view>
<view class="width70 fotrt">¥ {{orderList.payPrice}}</view>
</view>
<view class="width94 alijusstart mart20 font14 fcor666">
<view class="width30">积分抵扣</view>
<view class="width70 fotrt">¥ {{(orderList.payGold / 100).toFixed(2)}}</view>
</view>
<view class="width94 alijusstart mart20 font14 fcor666">
<view class="width30">优惠券抵扣</view>
<view class="width70 fotrt">¥ {{orderList.deductionPrice}}</view>
</view> </view>
<view class="width94 alijusstart mart20 font14 fcor666" v-if="orderList.payType"> <view class="width94 alijusstart mart20 font14 fcor666" v-if="orderList.payType">
<view class="width30">支付方式</view> <view class="width30">支付方式</view>
<view class="width70 fotrt" v-if="orderList.payType == 2">微信</view> <view class="width70 fcor333 fotrt" v-if="orderList.payType == 2">微信</view>
<view class="width70 fotrt" v-if="orderList.payType == 3">积分</view> <view class="width70 fcor333 fotrt" v-if="orderList.payType == 3">积分</view>
<view class="width70 fotrt" v-if="orderList.payType == 4">工会卡</view> <view class="width70 fcor333 fotrt" v-if="orderList.payType == 4">工会卡</view>
<view class="width70 fotrt" v-if="orderList.payType == 5">银联支付</view> <view class="width70 fcor333 fotrt" v-if="orderList.payType == 5">银联支付</view>
</view>
<view class="width94 alijusstart mart20 font14 fcor666" v-if="orderList.remarks && typeid != 10">
<view class="width30">联系方式</view>
<view class="width70 fotrt">{{orderList.remarks}}</view>
</view> </view>
<view class="width94 alijusstart mart20 font14 fcor666" v-if="typeid == 10"> <view class="width94 alijusstart mart20 font14 fcor666" v-if="typeid == 10">
<view class="width30">充值手机号</view> <view class="width30">充值手机号</view>
<view class="width70 fotrt">{{orderList.remarks}}</view> <view class="width70 fotrt fcor333">{{orderList.remarks}}</view>
</view>
<view class="width94 alijusstart mart20 font14 fcor666">
<view class="width30">支付状态</view>
<view class="width70 fotrt">{{typeText[orderList.orderStatus]}}</view>
</view>
<view class="width94 alijusend mart20 font14 fcor666" v-if="orderList.orderStatus == 1">
<view class="canbtn height30 marRight20" @click="thirdCancelOrder()">取消订单</view>
<!-- <view class="canbtn height30">联系客服</view> -->
</view> </view>
<view class="width100 height20"></view> <view class="width100 height20"></view>
</view> </view>
<view class="width90 mart10 font13 fcor666" v-if="typeid != 10">友情提示</view> <view class="width90 mart10 font13 fcor666" v-if="typeid != 10">友情提示</view>
<view class="width90 mart10 font12 fcor999" v-if="typeid != 10">1如遇到商品售罄将导致您无法取到所定食物系统将自动为您安排退款1个工作日内到账 <view class="width90 mart10 font12 fcor999" v-if="typeid != 10">1如遇到商品售罄将导致您无法取到所定食物系统将自动为您安排退款1个工作日内到账
</view> </view>
<view class="width90 mart5 font12 fcor999 marb40" v-if="typeid != 10">2如遇更多问题请及时联系在线客服处理</view> <view class="width90 mart5 font12 fcor999 marb40" v-if="typeid != 10">2如遇更多问题请及时联系在线客服处理</view>
<!-- 再来一单 -->
<view class="height50 width100"></view>
<view class="bottomstu backcorfff width100 height50 alijusend">
<button open-type="contact" class="cusservice font12 fcor666">联系客服</button>
<view class="buybtn font12 fcorfff">再来一单</view>
</view>
</view> </view>
</template> </template>
@ -215,8 +230,8 @@
}, },
methods: { methods: {
// //
updatestu() { updatestu(item) {
this.phonestu = 2 this.phonestu = item;
}, },
getAllCount() { getAllCount() {
this.orderList.highChildOrderList.forEach((food) => { this.orderList.highChildOrderList.forEach((food) => {
@ -393,14 +408,11 @@
.phoneck { .phoneck {
height: 35px; height: 35px;
width: 120px;
line-height: 35px; line-height: 35px;
font-size: 14px; font-size: 12px;
border-radius: 39px;
border: 1px solid #CD2314;
box-sizing: border-box; box-sizing: border-box;
color: #CD2314; background-color: #0F8FE8;
margin: 10px auto; color: #ffffff;
} }
.headsbg { .headsbg {
@ -408,9 +420,22 @@
background: linear-gradient(to bottom, #3da7e7, #e8eff4); background: linear-gradient(to bottom, #3da7e7, #e8eff4);
} }
.borderleft {
background-image: radial-gradient(10px at bottom left, #f0f0f0 10px, #ffffff);
}
.bordertopleft {
background-image: radial-gradient(10px at top left, #f0f0f0 10px, #ffffff);
}
.concont { .concont {
border-radius: 12px 12px 0 0; border-radius: 12px 12px 0 0;
background-image: radial-gradient(6px at bottom right, #f0f0f0 50px, #ffffff); background-image: radial-gradient(10px at bottom right, #f0f0f0 10px, #ffffff);
}
.gooddes {
border-radius: 0 0 12px 12px;
background-image: radial-gradient(10px at top right, #f0f0f0 10px, #ffffff);
} }
.footbtn { .footbtn {
@ -444,4 +469,36 @@
border-radius: 25px; border-radius: 25px;
text-align: center; text-align: center;
} }
.bottomstu {
position: fixed;
bottom: 0px;
border-top: 1px solid #cecdcd;
}
.cusservice {
height: 30px;
width: 90px;
margin-right: 20px;
border: 1px solid #6c6c6c;
border-radius: 25px;
}
.buybtn {
height: 30px;
width: 90px;
line-height: 30px;
text-align: center;
margin-right: 20px;
background-color: #009dff;
border-radius: 25px;
}
.medldcode {
background-color: #D20507;
padding-left: 8px;
padding-right: 8px;
position: absolute;
margin-left: 2px;
}
</style> </style>

@ -111,6 +111,10 @@ $uni-font-size-paragraph:30upx;
font-size: 20px; font-size: 20px;
} }
.font22 {
font-size: 22px;
}
.font24 { .font24 {
font-size: 24px; font-size: 24px;
} }
@ -550,6 +554,10 @@ $uni-font-size-paragraph:30upx;
line-height: 30px; line-height: 30px;
} }
.height30h {
height: 30px;
}
.height40 { .height40 {
height: 40px; height: 40px;
line-height: 40px; line-height: 40px;
@ -835,6 +843,11 @@ $uni-font-size-paragraph:30upx;
display: flex; display: flex;
} }
.alijusnostart{
justify-content: flex-start;
display: flex;
}
.alijusend{ .alijusend{
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;

Loading…
Cancel
Save