1.银联 改版2.0

master
杨杰 3 years ago
parent e34c3241d4
commit 02a7098a88
  1. 16
      high-unionPay/App.vue
  2. 5
      high-unionPay/Utils/Api.js
  3. 18
      high-unionPay/pages.json
  4. 281
      high-unionPay/pages/goods/goods-list/goods-list.vue
  5. 1149
      high-unionPay/pages/goods/goods.vue
  6. 1085
      high-unionPay/pages/tabBar/home/home.vue
  7. 1049
      high-unionPay/pages/tabBar/user/user.vue
  8. 335
      high-unionPay/pages/user/coupon/coupon.vue
  9. 120
      high-unionPay/pages/user/news/news.vue
  10. 335
      high-unionPay/pages/user/order_details/order_details.vue
  11. 389
      high-unionPay/pages/user/order_list/order_list.vue
  12. 311
      high-unionPay/qianzhu-KFC/order-details/order-details.vue
  13. BIN
      high-unionPay/qianzhu-KFC/static/imgs/desloca.png
  14. BIN
      high-unionPay/static/img/cusservice.png
  15. BIN
      high-unionPay/static/img/home/cusser.png
  16. BIN
      high-unionPay/static/img/home/home3.png
  17. BIN
      high-unionPay/static/img/home/home4.png
  18. BIN
      high-unionPay/static/img/home/home5.png
  19. BIN
      high-unionPay/static/img/home/home6.png
  20. BIN
      high-unionPay/static/img/home/home7.png
  21. BIN
      high-unionPay/static/img/user/user1.png
  22. BIN
      high-unionPay/static/img/user/user10.png
  23. BIN
      high-unionPay/static/img/user/user11.png
  24. BIN
      high-unionPay/static/img/user/user12.png
  25. BIN
      high-unionPay/static/img/user/user13.png
  26. BIN
      high-unionPay/static/img/user/user14.png
  27. BIN
      high-unionPay/static/img/user/user15.png
  28. BIN
      high-unionPay/static/img/user/user16.png
  29. BIN
      high-unionPay/static/img/user/user2.png
  30. BIN
      high-unionPay/static/img/user/user3.png
  31. BIN
      high-unionPay/static/img/user/user4.png
  32. BIN
      high-unionPay/static/img/user/user5.png
  33. BIN
      high-unionPay/static/img/user/user6.png
  34. BIN
      high-unionPay/static/img/user/user7.png
  35. BIN
      high-unionPay/static/img/user/user8.png
  36. BIN
      high-unionPay/static/img/user/user9.png
  37. 57
      high-unionPay/uni.scss

@ -5,15 +5,15 @@
// brestUrl: 'http://192.168.3.4:9302/brest',
// imgUrl: 'https://192.168.3.4:9301/filesystem/',
//
url: 'https://hsg.dctpay.com/crest',
imgUrl: 'https://hsg.dctpay.com/filesystem/',
brestUrl : 'https://hsg.dctpay.com/brest',
imageWxImg:'https://hsg.dctpay.com/filesystem/wxApplets/',
// url: 'https://hsg.dctpay.com/crest',
// imgUrl: 'https://hsg.dctpay.com/filesystem/',
// brestUrl : 'https://hsg.dctpay.com/brest',
// imageWxImg:'https://hsg.dctpay.com/filesystem/wxApplets/',
//
// url: 'https://hsgcs.dctpay.com/crest',
// brestUrl : 'https://hsgcs.dctpay.com/brest',
// imgUrl: 'https://hsgcs.dctpay.com/filesystem/',
// imageWxImg:'https://hsgcs.dctpay.com/filesystem/wxApplets/',
url: 'https://hsgcs.dctpay.com/crest',
brestUrl : 'https://hsgcs.dctpay.com/brest',
imgUrl: 'https://hsgcs.dctpay.com/filesystem/',
imageWxImg:'https://hsgcs.dctpay.com/filesystem/wxApplets/',
userInfo: "",
brestUserInfo : '',
openId: '',

@ -131,6 +131,11 @@ export const cancelOrder = params => {
export const getOrderById = params => {
return POST('GET', `${base}/highOrder/getOrderById`, params).then(res => res.data);
}
//已完成未查看
export const orderCheck = params => {
return POST('GET', `${base}/highOrder/orderCheck`, params).then(res => res.data);
}
//获取商户列表
export const getMerchantList = params => {
return POST('GET', `${base}/highMerchantStore/getMerchantList`, params).then(res => res.data);

@ -5,8 +5,8 @@
"style": {
"navigationBarTextStyle": "white",
"navigationBarTitleText": "嗨森逛",
"navigationBarBackgroundColor": "#0083f5",
"backgroundColorTop": "#0083f5",
"navigationBarBackgroundColor": "#3da7e7",
"backgroundColorTop": "#3da7e7",
"onReachBottomDistance": 50,
"app-plus": {
"titleNView": false, //
@ -700,7 +700,19 @@
}
}
],
,{
"path" : "pages/user/news/news",
"style" :
{
"navigationBarTitleText": "",
"enablePullDownRefresh": false,
"app-plus": {
"titleNView": false //
}
}
}
],
"subpackages": [{
"root": "subPages",
"pages": [{

@ -2,7 +2,7 @@
<view>
<view class="input-box">
<view class="icon search"></view>
<input placeholder="搜索卡券" v-model="couponName" placeholder-style="color:#c0c0c0;" @input="toSearch()" />
<input placeholder="搜索商品" v-model="couponName" placeholder-style="color:#c0c0c0;" @input="toSearch()" />
</view>
<view class="swiper">
@ -24,35 +24,21 @@
@click="switchid(item)" :class="[goodtyid == item.id ? 'fcor089 borbtom fontwig6' : '']" :key="index">
{{item.title}}</view>
</view>
<view v-if="goodsList == '' " class="mart60 fotct font14 fcor666">
<image mode="widthFix" style="width: 70vw;" :src="imagewxUrl+imgadres"></image>
</view>
<view class="width90 height110 mart5" v-for="(row, index) in goodsList" :key="index" @click="toGoods(row.id)">
<image class="goodsimg flleft mart5" mode="widthFix" :src="imageUrl+row.couponImg"></image>
<view class="goodsli ">
<view class="text2 fcor333 font14 fontwig6">{{row.couponName}}</view>
<view class="width90 height110 mart10 backcorfff border-8r alijusstart" v-for="(row, index) in goodsList" :key="index" @click="toGoods(row.id)">
<image class="goodsimg mart5" mode="widthFix" :src="imageUrl+row.couponImg"></image>
<view class="goodsli width65">
<view class="text1 fcor333 font16 fontwig6">{{row.couponName}}</view>
<view class="goodsxg font12 fotct">限购{{row.limitNumber}}</view>
<view class="info mart10">
<view class="price" v-if="row.payType != 1">
<image style="width: 15px;height: 15px;vertical-align: sub;" src="../../../static/img/jfx.png">
</image> {{ row.discountPrice*100}}
</view>
<view class="price" v-else>
{{ row.discountPrice}}
<view class="alijusstart mart10">
<view class="price">
{{ row.discountPrice}}
</view>
<!-- v-if="product.discountPrice !== product.salesPrice" -->
<view class="slogan" v-if="row.discountPrice !== row.salesPrice">
<!-- <image v-if="row.payType != 1" style="width: 15px;height: 15px;vertical-align: sub;"
src="../../../static/img/jfh.png">
</image>{{ row.salesPrice*100}} <text v-else></text>{{row.salesPrice}} -->
<view v-if="row.payType != 1">
<image style="width: 15px;height: 15px;vertical-align: sub;"
src="../../../static/img/jfh.png">
</image>{{ row.salesPrice*100}}
</view>
<view v-else>{{ row.salesPrice}}</view>
<view class="slogan margle10" v-if="row.discountPrice !== row.salesPrice">
<view>{{ row.salesPrice}}</view>
</view>
</view>
</view>
@ -61,6 +47,7 @@
</view>
</template>
<script>
import {
getCouponList,
@ -284,127 +271,129 @@
</script>
<style lang="scss">
.input-box {
width: 90%;
margin-left: 5%;
margin-top: 15px;
height: 70rpx;
background-color: #f5f5f5;
border-radius: 10rpx;
position: relative;
display: flex;
align-items: center;
.icon {
display: flex;
align-items: center;
position: absolute;
top: 2px;
left: 5px;
width: 60upx;
height: 60upx;
font-size: 34upx;
color: #c0c0c0;
}
input {
padding-left: 50upx;
height: 28upx;
font-size: 28upx;
width: 100%;
}
}
.swiper {
width: 100%;
display: flex;
justify-content: center;
margin-top: 20px;
margin-bottom: 20px;
.swiper-box {
width: 92%;
height: 150px;
overflow: hidden;
border-radius: 15upx;
box-shadow: 0upx 8upx 25upx rgba(0, 0, 0, 0.2);
//ios
position: relative;
z-index: 1;
swiper {
width: 100%;
height: 150px;
swiper-item {
image {
width: 100%;
height: 150px;
}
}
}
.indicator {
position: absolute;
bottom: 20upx;
left: 20upx;
background-color: rgba(255, 255, 255, 0.4);
width: 150upx;
height: 5upx;
border-radius: 3upx;
overflow: hidden;
display: flex;
.dots {
width: 0upx;
background-color: rgba(255, 255, 255, 1);
transition: all 0.3s ease-out;
&.on {
width: (100%/3);
}
}
}
}
}
.goodsimg {
width: 90px;
height: 90px;
}
.goodsli {
margin-left: 100px;
padding-top: 5px;
}
.goodsxg {
margin-top: 5px;
border: 1px solid #eb5823;
border-radius: 5px;
color: #eb5823;
width: 55px;
padding: 3px;
}
.info {
display: flex;
justify-content: space-between;
align-items: flex-end;
width: 100%;
.price {
color: #e65339;
font-size: 30upx;
font-weight: 600;
width: 50%;
}
.slogan {
width: 50%;
color: #807c87;
font-size: 24upx;
text-decoration: line-through;
}
page {
background-color: #f3f3f3;
}
.input-box {
width: 90%;
margin-left: 5%;
margin-top: 15px;
height: 70rpx;
background-color: #ffffff;
border-radius: 10rpx;
position: relative;
display: flex;
align-items: center;
.icon {
display: flex;
align-items: center;
position: absolute;
top: 2px;
left: 5px;
width: 60upx;
height: 60upx;
font-size: 34upx;
color: #c0c0c0;
}
input {
padding-left: 50upx;
height: 28upx;
font-size: 28upx;
width: 100%;
}
}
.swiper {
width: 100%;
display: flex;
justify-content: center;
margin-top: 20px;
margin-bottom: 20px;
.swiper-box {
width: 92%;
height: 150px;
overflow: hidden;
border-radius: 15upx;
box-shadow: 0upx 8upx 25upx rgba(0, 0, 0, 0.2);
//ios
position: relative;
z-index: 1;
swiper {
width: 100%;
height: 150px;
swiper-item {
image {
width: 100%;
height: 150px;
}
}
}
.indicator {
position: absolute;
bottom: 20upx;
left: 20upx;
background-color: rgba(255, 255, 255, 0.4);
width: 150upx;
height: 5upx;
border-radius: 3upx;
overflow: hidden;
display: flex;
.dots {
width: 0upx;
background-color: rgba(255, 255, 255, 1);
transition: all 0.3s ease-out;
&.on {
width: (100%/3);
}
}
}
}
}
.goodsimg {
width: 90px;
height: 90px;
}
.goodsli {
margin-left: 10px;
padding-top: 5px;
}
.goodsxg {
margin-top: 5px;
border: 1px solid #3da7e7;
border-radius: 5px;
color: #3da7e7;
width: 55px;
padding: 3px;
}
.price {
color: #e65339;
font-size: 40upx;
font-weight: 600;
// width: 50%;
}
.slogan {
width: 50%;
color: #807c87;
font-size: 24upx;
text-decoration: line-through;
}
// }
.borbtom {
border-bottom: 2px solid #089bf5;
}
</style>

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

@ -1,68 +1,75 @@
<template>
<view>
<view class="tabr" :style="{top:headerTop}">
<view :class="{on:typeClass=='valid'}" @tap="switchType('valid')">可用({{couponcout}})</view>
<view :class="{on:typeClass=='invalid'}" @tap="switchType('invalid')">已失效</view>
<view class="border" :class="typeClass"></view>
<!-- ({{couponcout}}) -->
<view :class="{on:typeClass=='valid'}" @tap="switchType('valid')">待使用</view>
<view :class="{on:typeClass=='invalid'}" @tap="switchType('invalid')">已使用</view>
<view :class="{on:typeClass=='noinvalid'}" @tap="switchType('noinvalid')">已过期</view>
</view>
<scroll-view scroll-x='true' class="srollview width100" scroll-with-animation>
<view class="conent" :class="[ordertypeid == index ? 'activeconent' : 'frontconent']"
v-for="(item,index) in orderTyplist" :key="index">{{item}}</view>
</scroll-view>
<view class="place"></view>
<view class="list">
<!-- 优惠券列表 -->
<view class="sub-list valid" :class="subState">
<view class="sub-list" v-if="typeClass == 'valid'">
<view class="tis" v-if="couponValidList.length==0">
<image mode="widthFix" style="width: 70vw;" :src="imagewxUrl+imgadres"></image>
</view>
<view class="row" v-for="(row,index) in couponValidList" :key="index" @click="jumpcoupons(row)">
<!-- 删除按钮 -->
<view class="menu" @tap.stop="deleteCoupon(row.id,couponValidList)">
<view class="icon shanchu"></view>
</view>
<!-- content -->
<view class="carrier">
<view class="left">
<view class="title">
{{row.highDiscount.discountName}}
<view class="alijusstart" style="margin-top: -7px;">
<view class="alijus font12 fotct fcorfff"
style="width: 70px;height: 20px;background-color: #3ecbb0;margin-right: 2px;">
<image src="../../../static/img/user/user15.png" mode="widthFix" class="icon12">
</image>
折扣券
</view>
</view>
<view class="title alijusstart">
<text class="height20 fotct fcorfff font11"
style="width: 50px;background-color: #347edd;border-radius: 20px;">话费券</text>
<view class="text1 width70">{{row.highDiscount.discountName}}</view>
</view>
<view class="term">
截止时间:{{row.useEndTime | formatDate('-')}}
有效期:{{row.useEndTime | formatDate('-')}}
</view>
<view class="gap-top"></view>
<view class="gap-bottom"></view>
</view>
<view class="right">
<view class="ticket">
<view class="num" v-if="row.highDiscount.discountType == 3">
{{row.highDiscount.discountPrice * 10}}
</view>
<view class="num" v-else>
{{row.highDiscount.discountPrice}}
</view>
<view class="num" v-else>
{{row.highDiscount.discountPrice}}
</view>
<view class="unit" v-if="row.highDiscount.discountType == 3">
</view>
<view class="unit" v-else>
</view>
<view class="unit" v-else>
</view>
</view>
<!-- <view class="criteria">
{{row.highDiscount.discountName}}
</view> -->
<view class="use" >
<view class="use">
去使用
</view>
</view>
</view>
</view>
</view>
<view class="sub-list invalid" :class="subState">
<!-- //使 -->
<view class="sub-list" v-if="typeClass == 'invalid'">
<view class="tis" v-if="couponinvalidList.length==0">
<image mode="widthFix" style="width: 70vw;" :src="imagewxUrl+imgadres"></image>
</view>
<view class="row" v-for="(row,index) in couponinvalidList" :key="index">
<!-- 删除按钮 -->
<view class="menu" @tap.stop="deleteCoupon(row.id,couponinvalidList)">
<view class="icon shanchu"></view>
</view>
<!-- content -->
<view class="carrier">
<view class="left">
@ -70,13 +77,43 @@
{{row.highDiscount.discountName}}
</view>
<view class="term">
截止时间:{{row.highDiscount.salesEndTime | formatDate('-')}}
使用时间:{{row.useTime | formatDate('-')}}
</view>
<view class="icon shixiao">
</view>
<view class="right invalid">
<view class="ticket">
<view class="num">
{{row.highDiscount.discountPrice}}
</view>
<view class="unit">
</view>
</view>
<view class="criteria">
{{row.highDiscount.discountName}}
</view>
<view class="use">
已使用
</view>
</view>
</view>
</view>
</view>
<!-- 已过期 -->
<view class="sub-list" v-if="typeClass == 'noinvalid'">
<view class="tis" v-if="couponnoinvalidList.length==0">
<image mode="widthFix" style="width: 70vw;" :src="imagewxUrl+imgadres"></image>
</view>
<view class="row" v-for="(row,index) in couponnoinvalidList" :key="index">
<!-- content -->
<view class="carrier">
<view class="left">
<view class="title">
{{row.highDiscount.discountName}}
</view>
<view class="term">
过期时间:{{row.useEndTime | formatDate('-')}}
</view>
<view class="gap-top"></view>
<view class="gap-bottom"></view>
</view>
<view class="right invalid">
<view class="ticket">
@ -91,7 +128,7 @@
{{row.highDiscount.discountName}}
</view>
<view class="use">
失效
过期
</view>
</view>
</view>
@ -112,8 +149,9 @@
return {
couponValidList: [],
couponinvalidList: [],
couponnoinvalidList: [],
imagewxUrl: app.globalData.imageWxImg,
imgadres:'noorder.png',
imgadres: 'noorder.png',
headerTop: 0,
//
typeClass: 'valid',
@ -124,8 +162,10 @@
pageNum: 1,
pageSize: 10,
isNoMoreData: false,
loadingText: '',
couponcout:0
loadingText: '',
couponcout: 0,
orderTyplist: ['全部订单', '在线加油', '肯德基', '星巴克', '话费充值', '卡券订单'], //
ordertypeid: 1 //id
}
},
onPageScroll(e) {
@ -172,8 +212,10 @@
onReachBottom() {
if (this.typeClass == 'valid') {
this.getUserDiscountList(1);
} else {
} else if (this.typeClass == 'invalid') {
this.getUserDiscountList(2);
} else {
this.getUserDiscountList(0);
}
},
methods: {
@ -201,49 +243,52 @@
this.isNoMoreData = true;
}
if (this.typeClass == 'valid') {
this.couponValidList = this.couponValidList.concat(res.return_data.list);
this.couponValidList = this.couponValidList.concat(res.return_data.list);
this.couponcout = res.return_data.total;
} else {
} else if (this.typeClass == 'invalid') {
this.couponinvalidList = this.couponinvalidList.concat(res.return_data.list);
} else {
this.couponnoinvalidList = this.couponnoinvalidList.concat(res.return_data.list);
}
this.pageNum = res.return_data.list.length == this.pageSize ? ++pagenum : pagenum;
} else {
this.couponValidList = [];
this.couponinvalidList = [];
this.couponnoinvalidList = [];
uni.hideLoading()
}
})
},
//
jumpcoupons(e) {
if(e.highDiscount.useScope == 3){
uni.navigateTo({
url: '../../unionPay/recharge/recharge'
})
}else if (e.highDiscount.useScope == 4) {
jumpcoupons(e) {
if (e.highDiscount.useScope == 3) {
uni.navigateTo({
url: '../../../subPages/recharge/recharge'
})
} else if (e.highDiscount.useScope == 4) {
app.globalData.distinguishid = 1;
uni.navigateTo({
url: '/qianzhu-KFC/buffet-order/buffet-order'
})
} else if (e.highDiscount.useScope == 5) {
} else if (e.highDiscount.useScope == 5) {
app.globalData.distinguishid = 2;
uni.navigateTo({
url: '/qianzhu-KFC/buffet-order/buffet-order'
url: '/qianzhu-KFC/buffet-order/buffet-order'
})
} else if (e.highDiscount.useScope == 6) {
uni.navigateTo({
url: '/member-Recharge/choicepage/choicepage'
})
}else if (e.highDiscount.useScope == 7) {
} else if (e.highDiscount.useScope == 7) {
uni.navigateTo({
url: '../../goods/refuel/refuel'
})
} else{
uni.navigateTo({
url: '../mineCouponsDestails/mineCouponsDestails?id=' + e.id
})
} else {
uni.navigateTo({
url: '../mineCouponsDestails/mineCouponsDestails?id=' + e.id
})
}
},
switchType(type) {
if (this.typeClass == type) {
@ -255,91 +300,28 @@
})
this.typeClass = type;
this.subState = this.typeClass == '' ? '' : 'show' + type;
setTimeout(() => {
this.oldIndex = null;
this.theIndex = null;
this.subState = this.typeClass == 'valid' ? '' : this.subState;
}, 200)
// setTimeout(() => {
// this.oldIndex = null;
// this.theIndex = null;
// this.subState = this.typeClass == 'valid' ? '' : this.subState;
// }, 200)
if (this.typeClass == 'valid') {
this.pageNum = 1;
this.couponValidList = []
this.isNoMoreData = false;
this.getUserDiscountList(1);
} else {
} else if (this.typeClass == 'invalid') {
this.pageNum = 1;
this.couponinvalidList = []
this.isNoMoreData = false;
this.getUserDiscountList(2);
} else {
this.pageNum = 1;
this.couponnoinvalidList = []
this.isNoMoreData = false;
this.getUserDiscountList(0);
}
},
//-begin
touchStart(index, event) {
//
if (event.touches.length > 1) {
this.isStop = true;
return;
}
this.oldIndex = this.theIndex;
this.theIndex = null;
//
this.initXY = [event.touches[0].pageX, event.touches[0].pageY];
},
touchMove(index, event) {
//
if (event.touches.length > 1) {
this.isStop = true;
return;
}
let moveX = event.touches[0].pageX - this.initXY[0];
let moveY = event.touches[0].pageY - this.initXY[1];
if (this.isStop || Math.abs(moveX) < 5) {
return;
}
if (Math.abs(moveY) > Math.abs(moveX)) {
// -
this.isStop = true;
return;
}
if (moveX < 0) {
this.theIndex = index;
this.isStop = true;
} else if (moveX > 0) {
if (this.theIndex != null && this.oldIndex == this.theIndex) {
this.oldIndex = index;
this.theIndex = null;
this.isStop = true;
setTimeout(() => {
this.oldIndex = null;
}, 150)
}
}
},
touchEnd(index, $event) {
//
this.isStop = false;
},
//
deleteCoupon(id, List) {
let len = List.length;
for (let i = 0; i < len; i++) {
if (id == List[i].id) {
List.splice(i, 1);
break;
}
}
this.oldIndex = null;
this.theIndex = null;
},
discard() {
//
}
}
}
</script>
@ -350,6 +332,44 @@
}
.srollview {
position: fixed;
z-index: 9999;
top: 45px;
height: 60px;
background-color: #ffffff;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
white-space: nowrap;
.conent {
height: 24px;
line-height: 24px;
margin-top: 15px;
padding-left: 10px;
font-size: 10px;
padding-right: 10px;
border-radius: 20px;
margin-left: 15px;
display: inline-flex;
flex-direction: column;
text-align: center;
position: relative;
}
}
.frontconent {
background-color: #eeeeee;
color: #333333;
}
.activeconent {
background-color: #e8eff4;
color: #009DFF;
}
page {
position: relative;
background-color: #f5f5f5;
@ -361,7 +381,7 @@
.place {
width: 100%;
height: 95upx;
height: 110px;
}
.tabr {
@ -375,7 +395,7 @@
z-index: 10;
view {
width: 50%;
width: 33.3%;
height: 90upx;
justify-content: center;
align-items: center;
@ -385,16 +405,7 @@
.on {
color: #0083f5;
}
.border {
height: 4upx;
background-color: #0083f5;
transition: all .3s ease-out;
&.invalid {
transform: translate3d(100%, 0, 0);
}
border-bottom: 2px solid #0083f5;
}
}
@ -425,6 +436,16 @@
}
}
@keyframes shownoInvalid {
0% {
transform: translateX(0);
}
100% {
transform: translateX(-200%);
}
}
.sub-list {
&.invalid {
position: absolute;
@ -443,6 +464,11 @@
animation: showInvalid 0.20s linear both;
}
&.shownoinvalid {
display: flex;
animation: shownoInvalid 0.20s linear both;
}
width: 100%;
padding: 20upx 0 120upx 0;
@ -456,7 +482,7 @@
.row {
width: 92%;
height: 24vw;
height: 27vw;
margin: 20upx auto 10upx auto;
border-radius: 8upx;
// box-shadow: 0upx 0 10upx rgba(0,0,0,0.1);
@ -512,7 +538,6 @@
animation: closeMenu 0.15s linear both;
}
background-color: #fff;
position: absolute;
width: 100%;
padding: 0 0;
@ -521,18 +546,20 @@
flex-wrap: nowrap;
.left {
width: 100%;
background-color: #fff;
width: 72%;
background-image: radial-gradient(6px at top right, #f5f5f5 50px, #ffffff);
.title {
padding-top: 3vw;
width: 90%;
margin: 0 5%;
font-size: 36upx;
}
.term {
width: 90%;
margin: 0 5%;
width: 95%;
background-image: radial-gradient(6px at bottom right, #f5f5f5 50px, #ffffff);
margin-left: 5%;
font-size: 26upx;
color: #999;
}
@ -570,7 +597,8 @@
flex-shrink: 0;
width: 28%;
color: #fff;
background: linear-gradient(to right, #ec625c, #ee827f);
background: linear-gradient(to right, #66c4ff, #009DFF);
background-image: radial-gradient(6px at bottom left, #f5f5f5 50px, #009DFF);
&.invalid {
background: linear-gradient(to right, #aaa, #999);
@ -588,18 +616,18 @@
}
.ticket {
background-image: radial-gradient(6px at top left, #f5f5f5 50px, #009DFF);
padding-top: 1vw;
justify-content: center;
align-items: baseline;
height: 6vw;
.num {
font-size: 42upx;
font-size: 60upx;
font-weight: 600;
}
.unit {
font-size: 24upx;
font-size: 28upx;
}
}
@ -610,18 +638,19 @@
}
.use {
width: 50%;
height: 40upx;
width: 70%;
height: 60rpx;
justify-content: center;
align-items: center;
font-size: 24upx;
font-size: 28rpx;
background-color: #fff;
color: #ee827f;
border-radius: 40upx;
padding: 0 10upx;
color: #009DFF;
border-radius: 40rpx;
padding: 0 10rpx;
}
}
}
}
}
</style>

@ -0,0 +1,120 @@
<template>
<view>
<!-- 顶部类型 -->
<scroll-view scroll-x='true' class="srollview width100" scroll-with-animation>
<view class="conent" :class="[newstypeid == index ? 'activeconent' : 'frontconent']"
v-for="(item,index) in newsTyplist" :key="index">{{item}}</view>
</scroll-view>
<view class="mart10 height70"></view>
<!-- 内容 -->
<view class="newscont width90 border-8r backcorfff mart20" v-for="(item,index) in newsTyplist" :key="index">
<view class="alijusstart mart10 margle10">
<image src="../../../static/img/cusservice.png" mode="widthFix" class="icon30"></image>
<text class="font18 margle" style="color: #0B1D83;">服务通知</text>
</view>
<view class="width90 line1 mart10"></view>
<!-- 服务通知 -->
<view class="width90 mart20" v-if="index != 1">
<view class="font18 fcor333">最新电影已上映快来抢购</view>
<image mode="widthFix" class="width100 mart10" src="../../../static/img/user/1.png"></image>
</view>
<!-- 交易信息 -->
<view class="width90 mart20" v-if="index == 1">
<view class="font18 fcor333">付款成功</view>
<view class="mart10 border-r backcor9">
<view class="font20 colore95 fontwig6 paddtop10 fotct">¥9.58</view>
<view class="width94 mart10 alijusstart font14">
<view class="fontwig6 fcor333 width30">交易对象</view>
<view class="width70 fcor666 fotrt">电信话费充值200元</view>
</view>
<view class="width94 mart15 alijusstart font14">
<view class="fontwig6 fcor333 width30">交易时间</view>
<view class="width70 fcor666 fotrt">2022年9月30日</view>
</view>
<view class="font16 fcor666 alijus mart10 fotct paddbotm20">查看详情<image
src="../../../static/img/jt.png" mode="widthFix" class="icon15 margle"></image>
</view>
</view>
</view>
<!-- 客服消息 -->
<view class="width90 mart20" v-if="index == 2">
<view class="font18 fcor333">客服消息提醒</view>
<view class="mart10 border-r backcor9">
<view class="width92 fcor333 fontwig6 paddtop15">
你的问题我们已提交技术人员处理请耐心等候
</view>
<view class="font16 fcor666 alijus mart10 fotct paddbotm20">查看详情<image
src="../../../static/img/jt.png" mode="widthFix" class="icon15 margle"></image>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
newsTyplist: ['全部订单', '在线加油', '肯德基', '星巴克', '话费充值', '卡券订单'], //
newstypeid: 1 ,//id
}
},
onLoad() {
},
methods: {
}
}
</script>
<style lang="scss">
page {
background-color: #f3f3f3;
}
.srollview {
position: fixed;
top: 0px;
height: 70px;
background-color: #ffffff;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
white-space: nowrap;
.conent {
height: 24px;
line-height: 24px;
margin-top: 15px;
padding-left: 10px;
font-size: 11px;
padding-right: 10px;
margin-left: 15px;
display: inline-flex;
flex-direction: column;
text-align: center;
position: relative;
}
}
.frontconent {
background-color: #eeeeee;
color: #333333;
}
.activeconent {
background-color: #e8eff4;
color: #009DFF;
}
.newscont {
padding-top: 10px;
padding-bottom: 10px;
}
</style>

@ -1,16 +1,131 @@
<template>
<view>
<view class="width100 font18 fcorfff fotct height40 backcorf06" v-if="recinfo.orderStatus == 1">待支付</view>
<view class="width100 font18 fcorfff fotct height40 backcorf06" v-if="recinfo.orderStatus == 2">已支付</view>
<view class="width100 font18 fcorfff fotct height40 backcorf06" v-if="recinfo.orderStatus == 3">已完成</view>
<view class="width100 font18 fcorfff fotct height40 backcorf06" v-if="recinfo.orderStatus == 4">已退款</view>
<view class="width100 font18 fcorfff fotct height40 backcorf06" v-if="recinfo.orderStatus == 5">已取消</view>
<view class="width100 font18 fcorfff fotct height40 backcorf06" v-if="recinfo.orderStatus == 6">退款中</view>
<view class="width100 font18 fcorfff fotct height40 backcorf06" v-if="recinfo.orderStatus == 7">退款失败</view>
<!-- 待支付 -->
<view class="width100 paddtop10 paddbotm10 backcorfff fotct" v-if="recinfo.orderStatus == 1">
<view class="height20"></view>
<view class="headstu font24 fontwig6">
{{countdownm}}:{{countdowns}}
</view>
<view class="width100 font13 fcor666 mart10">若超时未支付,订单将自动取消</view>
<view class="stubtn mart15" style="background-color: #0F8FE8;" @click="jumppay()">立即支付
</view>
</view>
<view class="width100 headsbg paddbotm15" v-if="recinfo.orderStatus != 1">
<view class="width100 font18 fcorfff fotct height40p">
{{typeText[recinfo.orderStatus]}}
</view>
<view class="width90 fcorfff font18 mart10">实付:{{recinfo.payRealPrice}}</view>
<view class="width90 fcorfff font14 mart10">{{recinfo.createTime | formatDate('-')}}</view>
<view class="width90 mart20" style="border-bottom: 1px dashed #7BC1F5;"></view>
<view class="width90 mart20 alijusnostart font12">
<view class="paddleft5 paddtright5 border-r" style="border: 1px solid #5BB5F3;color: #5BB5F3;">本单优惠
</view>
<view class="fcorfff margle">立减-¥8.15</view>
</view>
<view class="width90 mart20 paddleft10 backcorfff height50 fcor333 font15 border-8r">感谢您信任嗨森逛欢迎再次消费</view>
</view>
<!-- 订单信息 -->
<view class="width90 backcorfff border-8r mart10 paddbotm15">
<view class="paddtop20 font22 width94 fcor333">商家/订单信息</view>
<view class="mart15 alijusstart font14 width94">
<view class="width20 fcor777">交易单号</view>
<view class="width80p fotrt fcor333">HF202220823829374671902</view>
</view>
<view class="mart15 alijusstart font14 width94">
<view class="width20 fcor777">流水号</view>
<view class="width80p fotrt fcor333">433423423425123123123211</view>
</view>
<view class="mart15 alijusstart font14 width94">
<view class="width20 fcor777">下单时间</view>
<view class="width80p fotrt fcor333">2022-09-06 10:36:38</view>
</view>
<view class="mart15 alijusstart font14 width94">
<view class="width20 fcor777">油站名称</view>
<view class="width80p fotrt fcor333">延长壳牌南充亚华加油站</view>
</view>
<view class="mart15 alijusstart font14 width94">
<view class="width20 fcor777">支付方式</view>
<view class="width80p fotrt fcor333">微信</view>
</view>
<view class="mart15 alijusstart font14 width94">
<view class="width20 fcor777">地址</view>
<view class="width80p fotrt fcor333 text1">四川省南充市顺庆区金鱼领路541号1</view>
</view>
</view>
<!-- 商品信息 -->
<view class="width90 backcorfff border-8r mart10 paddbotm15">
<view class="paddtop20 font22 width94 fcor333">商品信息</view>
<view class="mart15 alijusstart font14 width94">
<view class="width50 fcor777">商品名称</view>
<view class="width50 fotrt fcor333">100元电信话费充值</view>
</view>
<view class="mart15 alijusstart font14 width94">
<view class="width50 fcor777">商品单价</view>
<view class="width50 fotrt fcor333">¥99.00</view>
</view>
<view class="mart15 alijusstart font14 width94">
<view class="width50 fcor777">商品数量</view>
<view class="width50 fotrt fcor333">2</view>
</view>
<view class="mart15 alijusstart font14 width94">
<view class="width50 fcor777">商品总金额</view>
<view class="width50 fotrt fcor333">¥188.00</view>
</view>
<!-- <view class="mart15 alijusstart font14 width94">
<view class="width50 fcor777">油号/枪号</view>
<view class="width50 fotrt fcor333">92#/25号枪</view>
</view>
<view class="mart15 alijusstart font14 width94">
<view class="width50 fcor777">油站单价</view>
<view class="width50 fotrt fcor333">¥7.14/L</view>
</view>
<view class="mart15 alijusstart font14 width94">
<view class="width70 fcor777">加油升数<text class="font11 fcor999">实际升数以油站加油机为准</text> </view>
<view class="width30 fotrt fcor333">44.12</view>
</view>
<view class="mart15 alijusstart font14 width94">
<view class="width50 fcor777">加油金额</view>
<view class="width50 fotrt fcor333">¥315.00</view>
</view> -->
</view>
<!-- 支付信息 -->
<view class="width90 backcorfff mart10 concont">
<view class="paddtop20 font22 width94 fcor333">商品信息</view>
<view class="mart15 alijusstart font14 width94">
<view class="width50 fcor777">加油优惠</view>
<view class="width50 fotrt fcoreb5">-¥2.86</view>
</view>
<view class="mart15 alijusstart font14 width94">
<view class="width50 fcor777">积分抵扣</view>
<view class="width50 fotrt fcoreb5">-¥1.86</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>
<view class="gooddes width90 backcorfff marb20">
<view class="width90w height20 bordertopleft alijusnostart">
</view>
<view class="width90 height50 fotrt fcor777 font16 paddbotm10">
加油实付 <text class="font24 fcor333 margle">{{recinfo.payRealPrice}}</text>
</view>
</view>
<!-- 购买商品列表 -->
<view class="buy-list" v-for="rec in recinfo.highChildOrderList" :key="rec.id"
<!-- <view class="buy-list" v-for="rec in recinfo.highChildOrderList" :key="rec.id"
@click="toGoods(rec.goodsId,rec.goodsType)">
<!-- v-for="(row,index) in buylist" :key="index" -->
<view class="row">
<view class="goods-info">
<view class="img">
@ -36,9 +151,9 @@
</view>
</view>
</view>
</view>
</view> -->
<!-- 提示-备注 -->
<view class="order">
<!-- <view class="order">
<view class="row" v-if="recinfo.orderNo">
<view class="left">
订单流水号 :
@ -63,6 +178,47 @@
{{recinfo.paySerialNo}}
</view>
</view>
<view class="row" v-if="recinfo.payModel">
<view class="left">
支付模式 :
</view>
<view class="right" v-if="recinfo.payModel == 1">
积分
</view>
<view class="right" v-if="recinfo.payModel == 2">
第三方平台
</view>
<view class="right" v-if="recinfo.payModel == 3">
混合
</view>
<view class="right" v-if="recinfo.payModel == 4">
油卡
</view>
</view>
<view class="row" v-if="recinfo.payType">
<view class="left">
支付方式 :
</view>
<view class="right" v-if="recinfo.payType == 1">
支付宝
</view>
<view class="right" v-if="recinfo.payType == 2">
微信
</view>
<view class="right" v-if="recinfo.payType == 3">
积分
</view>
<view class="right" v-if="recinfo.payType == 4">
工会卡
</view>
<view class="right" v-if="recinfo.payType == 5">
银联支付
</view>
<view class="right" v-if="recinfo.payType == 7">
嗨森逛油卡
</view>
</view>
<view class="row" v-if="recinfo.totalPrice">
<view class="left">
订单总额 :
@ -72,7 +228,7 @@
</view>
<view class="right" v-else>
<image style="width: 15px;height: 15px;vertical-align: sub;" src="../../../static/img/jfx.png">
</image>{{recinfo.totalPrice*100}}
</image>{{(recinfo.totalPrice * 10 * 10).toFixed(0)}}
</view>
</view>
<view class="row" v-if="recinfo.payPrice">
@ -84,7 +240,7 @@
</view>
<view class="right" v-else>
<image style="width: 15px;height: 15px;vertical-align: sub;" src="../../../static/img/jfx.png">
</image>{{recinfo.payPrice*100}}
</image>{{(recinfo.payPrice* 10 * 10).toFixed(0)}}
</view>
</view>
<view class="row" v-if="recinfo.payRealPrice">
@ -96,7 +252,7 @@
</view>
<view class="right" v-else>
<image style="width: 15px;height: 15px;vertical-align: sub;" src="../../../static/img/jfx.png">
</image>{{recinfo.payRealPrice*100}}
</image>{{(recinfo.payRealPrice * 10 * 10).toFixed(0)}}
</view>
</view>
<view class="row" v-if="recinfo.deductionPrice">
@ -108,16 +264,16 @@
</view>
<view class="right" v-else>
<image style="width: 15px;height: 15px;vertical-align: sub;" src="../../../static/img/jfx.png">
</image>{{recinfo.deductionPrice*100}}
</image>{{(recinfo.deductionPrice * 10 * 10).toFixed(0)}}
</view>
</view>
<view class="row" v-if="recinfo.payGold">
<view class="left">
积分抵扣 :
</view>
<view class="right">
{{(recinfo.payGold / 100).toFixed(2)}}
</view>
</view>
<view class="row" v-if="recinfo.payGold">
<view class="left">
抵扣积分 :
</view>
<view class="right">
{{recinfo.payGold}}
</view>
</view>
<view class="row">
<view class="left">
@ -159,9 +315,9 @@
{{recinfo.finishTime | formatDate('-')}}
</view>
</view>
</view>
</view> -->
<!-- 优选商品 -->
<view class="width94 font18 fcor333 fontwig6 height40" v-if="preByOrderInfo">预约订单详情</view>
<!-- <view class="width94 font18 fcor333 fontwig6 height40" v-if="preByOrderInfo">预约订单详情</view>
<view class="order" v-if="preByOrderInfo">
<view class="row">
<view class="left">
@ -239,13 +395,15 @@
{{preByOrderInfo.preUserRemark}}
</view>
</view>
</view>
</view> -->
<view class="width100 height60"></view>
<view class="footer" @click="orderComplete" v-if="preByOrderInfo && preByOrderInfo.status == 2">
<view class="settlement">
<view class="btn" style="background-color: #0083f5;color: #fff;width: 100% !important;">预约完成</view>
</view>
</view>
<view class="footer"
v-if="recinfo.orderStatus == 1 && recinfo.highChildOrderList[0].goodsType !=6 && recinfo.highChildOrderList[0].goodsType !=5 && recinfo.highChildOrderList[0].goodsType !=4">
<view class="settlement">
@ -260,6 +418,13 @@
<view class="btn" @tap="toPay" style="background-color: #0083f5;color: #fff;">去支付</view>
</view>
</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>
</template>
@ -286,15 +451,33 @@
imageUrl: app.globalData.imgUrl,
imagewxUrl: app.globalData.imageWxImg,
imgadres1: 'dhf.png',
preByOrderInfo: ''
preByOrderInfo: '',
countdownh: '', //
countdownm: '', //
countdowns: '', //
timer: null, //
typeText: {
1: '待支付',
2: '已支付',
3: '已完成',
4: '已退款',
5: '已取消',
6: '退款中',
7: '退款失败'
},
};
},
onShow() {
//
this.getOrderById();
this.getPreByOrderIdId();
},
onHide() {
},
onUnload() {
clearInterval(this.timer);
},
onLoad(option) {
this.orderId = option.id
@ -360,6 +543,29 @@
}
})
},
//
showtime() {
var nowtime = new Date(), //
endtime = this.orderList.createTime + 900000; //
var lefttime = endtime - nowtime, //
leftd = Math.floor(lefttime / (1000 * 60 * 60 * 24)), //
lefth = Math.floor((lefttime / (1000 * 60 * 60) % 24) + leftd * 24) < 10 ? "0" + Math.floor((lefttime /
(1000 * 60 * 60) % 24) + leftd * 24) : Math.floor((lefttime / (1000 * 60 * 60) % 24) + leftd *
24), //
leftm = Math.floor(lefttime / (1000 * 60) % 60) < 10 ? "0" + Math.floor(lefttime / (1000 * 60) % 60) :
Math.floor(lefttime / (1000 * 60) % 60), //
lefts = Math.floor(lefttime / 1000 % 60) < 10 ? "0" + Math.floor(lefttime / 1000 % 60) : Math.floor(
lefttime / 1000 % 60); //
this.countdownh = lefth //
this.countdownm = leftm //
this.countdowns = lefts //
// 00:00:00
if (lefttime < 0) {
this.getThirdOrderByOrderId();
clearInterval(this.timer);
this.countdownh = this.countdownm = this.countdowns = "00"
}
},
//
orderComplete() {
let that = this;
@ -468,6 +674,23 @@
</script>
<style lang="scss">
page {
background-color: #f0f0f0;
}
.headstu {
width: 90px;
height: 90px;
line-height: 90px;
text-align: center;
border-radius: 50%;
background-color: #C6DEF4;
color: #0189E7;
margin-left: auto;
margin-right: auto;
border: 1px solid #0096FF;
}
.addr {
width: 86%;
padding: 20upx 3%;
@ -713,4 +936,62 @@
}
}
}
.headsbg {
background: linear-gradient(to bottom, #3da7e7, #e8eff4);
}
.stubtn {
width: 30%;
height: 35px;
line-height: 35px;
border-radius: 25px;
color: #ffffff;
margin-left: 35%;
}
.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;
}
.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 {
border-radius: 8px 8px 0 0;
background-image: radial-gradient(10px at bottom right, #f0f0f0 10px, #ffffff);
}
.gooddes {
border-radius: 0 0 8px 8px;
background-image: radial-gradient(10px at top right, #f0f0f0 10px, #ffffff);
}
</style>

@ -1,108 +1,85 @@
<template>
<view>
<!-- 顶部导航 -->
<view class="topTabBar" :style="{position:headerPosition,top:headerTop}">
<view class="grid" v-for="(grid,tbIndex) in orderType" :key="tbIndex" @tap="showType(tbIndex)">
<view class="text" :class="[tbIndex==tabbarIndex?'on':'']">{{grid}}</view>
<!-- 搜索 -->
<view class="backcorfff width100 height120" style="position: fixed;z-index: 999;" :style="{top:headerTop}" >
<view class="alijusstart">
<view class="input-box">
<view class="icon search"></view>
<input placeholder="搜索我的订单" v-model="couponName" placeholder-style="color:#c0c0c0;"
@input="toSearch()" />
</view>
<view class="searbtn">搜索</view>
</view>
<view class="width100 bor-botm1 mart10 marb5"></view>
<!-- 顶部导航 -->
<view class="topTabBar">
<view class="grid" v-for="(grid,tbIndex) in orderType" :key="tbIndex" @tap="showType(tbIndex)">
<view class="text" :class="[tbIndex==tabbarIndex?'on':'']">{{grid}}
</view>
</view>
</view>
</view>
<scroll-view scroll-x='true' :style="{top:headerswper}" class="srollview width100" scroll-with-animation>
<view class="conent" :class="[ordertypeid == index ? 'activeconent' : 'frontconent']"
v-for="(item,index) in orderTyplist" :key="index">{{item}}</view>
</scroll-view>
<!-- 考虑非APP端长列表和复杂的DOM使用scroll-view会卡顿所以漂浮顶部选项卡使用page本身的滑动 -->
<view class="order-list">
<view class="list">
<view class="onorder" v-if="orderList.length==0">
<image :src="imagewxUrl+imgadres"></image>
</view>
<view class="row" v-for="(row,index) in orderList" :key="index">
<view class="width96 height40" @click="jumpDetails(row.highChildOrderList[0].goodsType,row.id)">
<view class="width40 flleft aliitem fotlt font16"
v-if="row.highChildOrderList[0].goodsType == 1">
<image src="../../../static/img/order2.png" class="marglerig"
style="width: 50rpx;height: 50rpx;"></image>
卡券订单
</view>
<view class="width40 flleft aliitem fotlt font16"
v-if="row.highChildOrderList[0].goodsType == 2">
<image src="../../../static/img/order2.png" class="marglerig"
style="width: 50rpx;height: 50rpx;"></image>
积分充值
</view>
<view class="width40 flleft aliitem fotlt font16"
v-if="row.highChildOrderList[0].goodsType == 7">
<image src="../../../static/img/order9.png" class="marglerig"
style="width: 50rpx;height: 50rpx;"></image>
优惠券包
</view>
<view class="width40 flleft aliitem fotlt font16"
v-if="row.highChildOrderList[0].goodsType == 3">
<image src="../../../static/img/order4.png" class="marglerig"
style="width: 50rpx;height: 50rpx;"></image>
加油订单
<view class="row" v-for="(row,index) in orderList" :key="index"
@click="jumpDetails(row.highChildOrderList[0].goodsType,row.id)">
<view class="width96 mart10 alijusstart">
<view class="width70">
<view class="orderlabel">在线加油</view>
<view class="unread" v-if="row.orderStatus == 3 && !row.whetherCheck"></view>
</view>
<view class="width40 flleft aliitem fotlt font16"
v-if="row.highChildOrderList[0].goodsType == 5">
<image src="../../../static/img/order5.png" class="marglerig"
style="width: 50rpx;height: 50rpx;"></image>
电影票
</view>
<view class="width40 flleft aliitem fotlt font16"
v-if="row.highChildOrderList[0].goodsType == 4">
<image src="../../../static/img/order3.png" class="marglerig"
style="width: 50rpx;height: 50rpx;"></image>
KFC<view class="unread" v-if="row.orderStatus == 3 && !row.whetherCheck"></view>
</view>
<view class="width40 flleft aliitem fotlt font16"
v-if="row.highChildOrderList[0].goodsType == 9">
<image src="../../../static/img/xbk.png" class="marglerig"
style="width: 50rpx;height: 50rpx;"></image>
星巴克<view class="unread" v-if="row.orderStatus == 3 && !row.whetherCheck"></view>
</view>
<view class="width40 flleft aliitem fotlt font16"
v-if="row.highChildOrderList[0].goodsType == 10">
<image src="../../../static/img/Vip.png" class="marglerig"
style="width: 50rpx;height: 50rpx;"></image>
会员充值<view class="unread" v-if="row.orderStatus == 3 && !row.whetherCheck"></view>
</view>
<view class="width40 flleft aliitem fotlt font16"
v-if="row.highChildOrderList[0].goodsType == 8">
<image src="../../../static/img/ghkpay.png" class="marglerig"
style="width: 50rpx;height: 50rpx;"></image>
工会卡充值
</view>
<view class="width60 flright fotrt fcor666 font15">
{{row.createTime | formatDate('-')}}
<view class="width30 fotrt fcor666 font12">
{{typeText[row.orderStatus]}}
</view>
</view>
<view class="width96 line1 mart10"></view>
<view class="width96 height60 mart10" @click="jumpDetails(row.highChildOrderList[0].goodsType,row.id)">
<view class="width96 height25 mart10">
<view class="width70 flleft fotlt ">
<view class="font16 fontwig6 text1 fcor333">
{{row.highChildOrderList[0].goodsName}}
</view>
<view class="font15 text1 fcor999 mart5">
数量 : {{row.highChildOrderList[0].saleCount}}
<view class="font16 fontwig6 text1 fcor333 alijusstart">
<image src="../../../static/img/order5.png" class="marglerig"
style="width: 50rpx;height: 50rpx;"></image>{{row.highChildOrderList[0].goodsName}}
</view>
</view>
<view class="width30 flright fotrt fcor666 font15 fotrt">
<view class="font16 fontwig6 text1 fcor333" v-if="row.payType != 3">
{{row.payPrice}}
<view class="font14 fcor333">
x1
</view>
</view>
</view>
<view class="width96 mart10 font12 fcor999">
订单编号:{{row.orderNo}}
</view>
<view class="width96 height25 paddbotm10 alijusstart">
<view class="width70 fotlt ">
<view class="font12 text1 fcor999 mart5">
下单时间 : {{row.createTime | formatDate('-')}}
</view>
<view class="font16 fontwig6 text1 fcor333 aliitem" style="justify-content: flex-end;"
v-else>
<image style="width: 15px;height: 15px;" src="../../../static/img/jfx.png">
</image>{{row.payPrice * 10 * 10}}
</view>
<view class="width30 fotrt fcor666 font15 fotrt">
<view class="fotrt font12 text1 fcor999 mart5">
合计:<text class="fcor333 font18"> {{row.payPrice}} </text>
</view>
<view class="fotrt font15 text1 fcor999 mart5">{{typeText[row.orderStatus]}}</view>
</view>
</view>
<view class="width96 line1 mart10 marb5"
<view class="width96 mart10 marb5" style="border:1px dashed #f4f4f4;"
v-if="(row.orderStatus==1 && row.highChildOrderList[0].goodsType !=6 && row.highChildOrderList[0].goodsType !=5)">
</view>
<view class="btns"
v-if="(row.orderStatus==1 && row.highChildOrderList[0].goodsType !=6 && row.highChildOrderList[0].goodsType !=5)">
<block>
<view class="default" @tap="cancelOrder(row.id)">取消订单</view>
<view class="pay" @tap="toPayment(row)">付款</view>
<view class="default" @click.stop="cancelOrder(row.id,row.highChildOrderList[0].goodsType)">
取消订单
</view>
<view class="pay" @click.stop="toPayment(row)">立即支付</view>
</block>
</view>
</view>
@ -113,17 +90,19 @@
<script>
import {
getUserOrderList,
cancelOrder
cancelOrder,
thirdCancelOrder,
orderCheck
} from '../../../Utils/Api.js';
let app = getApp()
export default {
data() {
return {
headerPosition: "fixed",
imagewxUrl: app.globalData.imageWxImg,
imgadres: 'noorder.png',
imgadres1: 'dhf.png',
headerTop: "0px",
headerTop: "0px",
headerswper:'120px',
typeText: {
1: '等待付款',
2: '订单已支付',
@ -134,7 +113,7 @@
7: '订单退款失败'
},
// 退
orderType: ['全部', '待支付', '已支付', '已完成', '已退款', '已取消'],
orderType: ['全部', '待支付', '已支付', '已完成', '已退款'],
//
orderList: [],
list: [],
@ -145,25 +124,23 @@
loadingText: '',
typeId: '',
imageUrl: app.globalData.imgUrl,
reFresh: ""
reFresh: "",
orderTyplist: ['全部订单', '在线加油', '肯德基', '星巴克', '话费充值', '卡券订单'], //
ordertypeid: 1 //id
}
},
onLoad(option) {
// #ifdef H5
this.headerTop = '0px';
// #endif
let tbIndex = parseInt(option.tbIndex) + 1;
this.list = this.orderList[tbIndex];
if (tbIndex == 0) {
this.typeId = '';
} else {
this.typeId = tbIndex;
}
this.list = this.orderList[this.typeId];
this.tabbarIndex = tbIndex;
this.typeId = tbIndex;
this.getUserOrderList();
},
onPageScroll(e) {
return;
//iOS
this.headerPosition = e.scrollTop >= 0 ? "fixed" : "absolute";
},
onReachBottom() {
this.getUserOrderList();
},
@ -241,16 +218,28 @@
},
//
jumpDetails(item,e) {
if (item == 4 || item == 9 || item == 10) {
uni.navigateTo({
url: '/qianzhu-KFC/order-details/order-details?id=' + e
})
return;
}
uni.navigateTo({
url: '../order_details/order_details?id=' + e
jumpDetails(item, e) {
console.log('===========')
this.orderCheck(e);
if (item == 4 || item == 9 || item == 10) {
uni.navigateTo({
url: '/qianzhu-KFC/order-details/order-details?id=' + e
})
return;
}
uni.navigateTo({
url: '../order_details/order_details?id=' + e
})
},
//
orderCheck(item) {
let datas = {
orderId: item
}
orderCheck(datas).then(res => {
});
},
showType(tbIndex) {
this.tabbarIndex = tbIndex;
@ -272,7 +261,7 @@
title: '已提醒商家发货'
})
},
cancelOrder(row) {
cancelOrder(row, item) {
let that = this;
uni.showModal({
title: '取消订单',
@ -285,6 +274,30 @@
let params = {
orderId: row,
}
if (item == 9 || item == 4) {
thirdCancelOrder(params).then(res => {
if (res.return_code == '000000') {
uni.hideLoading();
uni.showToast({
title: res.return_data,
icon: 'none',
duration: 2000
})
this.pageNum = 1;
this.orderList = []
this.isNoMoreData = false;
that.getUserOrderList();
} else {
uni.showToast({
title: res.return_msg,
icon: 'none',
duration: 2000
})
uni.hideLoading()
}
})
return;
}
cancelOrder(params).then(res => {
if (res.return_code == '000000') {
uni.hideLoading();
@ -312,22 +325,7 @@
}
});
},
doCancelOrder(ordersn) {
let typeNum = this.orderList.length;
for (let i = 0; i < typeNum; i++) {
let list = this.orderList[i];
let orderNum = list.length;
if (orderNum > 0 && list[0].type == 'unpaid') {
for (let j = 0; j < orderNum; j++) {
if (this.orderList[i][j].ordersn == ordersn) {
this.orderList[i][j].type = 'cancelled';
break;
}
}
}
}
},
//
toPayment(row) {
let payTypes;
if (row.payType == 1 || row.payType == null) {
@ -336,14 +334,14 @@
payTypes = 1;
} else {
payTypes = 2;
}
if (row.highChildOrderList[0].goodsType == 4 || row.highChildOrderList[0].goodsType == 9 || row
.highChildOrderList[0].goodsType == 10) {
uni.redirectTo({
url: '/qianzhu-KFC/payment-method/payment-method?orderId=' + row.id + '&amount=' + row
.payPrice + '&productType=' + row.productType
})
return;
}
if (row.highChildOrderList[0].goodsType == 4 || row.highChildOrderList[0].goodsType == 9 || row
.highChildOrderList[0].goodsType == 10) {
uni.redirectTo({
url: '/qianzhu-KFC/payment-method/payment-method?orderId=' + row.id + '&amount=' + row
.payPrice + '&productType=' + row.productType
})
return;
}
uni.redirectTo({
url: "/pages/pay/payment/payment?amount=" + row.payPrice +
@ -361,41 +359,54 @@
background-color: #f3f3f3;
}
.zspec {
font-size: 22rpx;
background-color: #0083f5;
color: #FFFFFF;
height: 40rpx;
display: -webkit-box;
display: -webkit-flex;
.input-box {
width: 72%;
margin-left: 5%;
margin-top: 15px;
height: 70rpx;
background-color: #f5f5f5;
border-radius: 10rpx;
position: relative;
display: flex;
width: 44px;
-webkit-box-align: center;
-webkit-align-items: center;
align-items: center;
padding: 0 15rpx;
border-radius: 4px;
margin-bottom: 10px;
margin-left: 5px;
}
border-radius: 15px 0 0 15px;
.icon {
display: flex;
align-items: center;
position: absolute;
top: 2px;
left: 5px;
width: 60upx;
height: 60upx;
font-size: 34upx;
color: #c0c0c0;
}
.loading-text {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
height: 60upx;
color: #979797;
font-size: 24upx;
input {
padding-left: 50upx;
height: 28upx;
font-size: 26upx;
width: 100%;
}
}
.searbtn {
height: 35px;
width: 18%;
background-color: #009DFF;
font-size: 16px;
text-align: center;
margin-top: 15px;
line-height: 35px;
color: #ffffff;
letter-spacing: 2px;
border-radius: 0 15px 15px 0;
}
.topTabBar {
width: 100%;
position: fixed;
top: 0;
z-index: 10;
background-color: #f8f8f8;
background-color: #ffffff;
height: 80upx;
display: flex;
justify-content: space-around;
@ -415,16 +426,53 @@
align-items: center;
&.on {
color: #0083f5;
border-bottom: solid 4upx #0083f5;
color: #009dff;
border-bottom: solid 8upx #0083f5;
}
}
}
}
.srollview {
position: fixed;
z-index: 999;
height: 50px;
top: 120px;
background-color: #f3f3f3;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
white-space: nowrap;
.conent {
height: 24px;
line-height: 24px;
margin-top: 15px;
padding-left: 10px;
font-size: 12px;
padding-right: 10px;
border-radius: 20px;
margin-left: 10px;
display: inline-flex;
flex-direction: column;
text-align: center;
position: relative;
}
}
.frontconent {
background-color: #ffffff;
color: #333333;
}
.activeconent {
background-color: #e8eff4;
color: #009DFF;
}
.order-list {
margin-top: 80upx;
margin-top: 170px;
padding-top: 20upx;
width: 100%;
@ -461,7 +509,17 @@
padding: 10upx 20upx;
border-radius: 10upx;
background-color: #fff;
margin-bottom: 20upx;
margin-bottom: 30upx;
.unread {
width: 10px;
height: 10px;
background-color: #e75e58;
border-radius: 50%;
margin-top: -25px;
position: absolute;
margin-left: 60px;
}
.type {
font-size: 26upx;
@ -547,7 +605,7 @@
view {
min-width: 120upx;
height: 70rpx;
height: 60rpx;
padding: 0 20upx;
border-radius: 50upx;
display: flex;
@ -570,4 +628,17 @@
}
}
}
.orderlabel {
width: 50px;
border-radius: 5px;
height: 22px;
line-height: 22px;
background-color: #eeebeb;
color: #797979;
text-align: center;
padding-left: 10px;
padding-right: 10px;
font-size: 12px;
}
</style>

@ -1,171 +1,183 @@
<template>
<view>
<view class="width100 paddtop10 paddbotm10 headsbg backcorfff fotct" v-if="orderList.orderStatus == 1">
<view class="width100 paddtop10 paddbotm10 backcorfff fotct" v-if="orderList.orderStatus == 1">
<view class="height20"></view>
<view class="headstu font18 fontwig6">
<view class="headstu font24 fontwig6">
{{countdownm}}:{{countdowns}}
</view>
<view class="width100 font18 colorc72 mart5">
{{typeText[orderList.orderStatus]}}
</view>
<view class="width100 font13 fcor666 mart5">若超时未支付,订单将自动取消</view>
<view class="stubtn mart15 backcorf2f6" v-if="typeid == 9" @click="jumppay()">立即支付</view>
<!-- <view class="stubtn mart15 backcorf2f6" v-if="colorc3 == 9">¥ {{orderList.payPrice}}</view>
<view class="stubtn mart15 backcorf2f6" v-if="typeid == 4 || typeid == 10">¥ {{orderList.payPrice}}</view> -->
<view class="stubtn mart15" v-if="typeid == 4 || typeid == 10" style="background-color: #c72a20;"
@click="jumppay()">立即支付
<view class="width100 font13 fcor666 mart10">若超时未支付,订单将自动取消</view>
<view class="stubtn mart15" style="background-color: #0F8FE8;" @click="jumppay()">立即支付
</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"
v-if="orderList.orderStatus != 2 && orderList.orderStatus != 3">
<image mode="widthFix" class="width50" src="../static/imgs/otherstu.png"></image>
</view>
<view class="width100 font18 fcor666 mart15"
<view class="width100 font18 fcorfff mart15"
v-if=" orderList.orderStatus != 2 && orderList.orderStatus != 3">
{{typeText[orderList.orderStatus]}}
</view>
<view v-if="(orderList.orderStatus == 2 || orderList.orderStatus == 3 ) && typeid != 10">
<view class="fotct font14 width100 fcor999">您的取餐码为</view>
<view v-if="typeid == 4 && orderList.list && phonestu == 2">
<view class="width90 alijusstart mart20" v-for="(item,index) in orderList.list" :key='index'>
<view class="font14 width50 fcor666">取餐号: <text class="colorc3 font18">{{item.code}}</text>
<view v-if="(orderList.orderStatus == 2 || orderList.orderStatus == 3 )">
<view v-if="typeid == 4 && orderList.list && phonestu == 2">
<view class="width90 mart15" style="display: flow-root;">
<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">尾号{{item.phone}}</text>
</view>
<view class="font14 width50 fcor666">手机尾号: <text class="colorc3 font18">{{item.phone}}</text>
</view>
</view>
<view class="fotct" v-if="typeid == 4 && orderList.list && phonestu == 1">
<view class="width90 mart15" style="display: flow-root;">
<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="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="font14 width100 fcor666">取餐号: <text class="colorc3 font18">{{item.code}}</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 class="phoneck width85 border-r" v-if="typeid == 4 && orderList.list && phonestu == 2"
@click="updatestu(1)">
隐藏手机尾号
</view>
</view>
</view>
<!-- 星巴克 -->
<view v-if="typeid == 9 && orderList.object.orderItems[0].code">
<view class="fotct font18 width100 mart10 color2f6f43"
v-for="(item,index) in orderList.object.orderItems" :key='index'>{{item.code}}</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 class="fotct font20 width100 mart10 colorc3" v-if="typeid == 4 && !orderList.list">
{{orderList.statusDesc}}
</view>
<view class="fotct font20 width100 mart10 color2f6f43"
v-if="typeid == 9 && orderList.object.orderItems[0].code">请取餐</view>
<view class="fotct font20 width100 mart10 color2f6f43"
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>
</view>
<!-- <view class="width96 mart20 colorc3 font12 fotct">
:约5分钟后取餐,请尽快到餐厅取餐哦
</view> -->
<view class="concont width94 mart10 backcorfff">
<view class="width94 paddtop10 font16 fontwig6" v-if="typeid == 10">
<view class="width94 paddtop15 font16 fontwig6" v-if="typeid == 10">
充值明细
</view>
<view class="width94 paddtop10 font16 fontwig6" v-else>
餐品明细
<view class="width94 paddtop15 font16 fontwig6 alijusstart" v-else>
<image src="../static/imgs/desloca.png" mode="widthFix" class="icon20 marglerig"></image> 南充麦当劳潆华南路餐厅
</view>
<view class="width100 bor-botm1 mart10 marb10"></view>
<view class="width100">
<view class="width90 alijusstart mart10 bor-botm1" v-for="(item,index) in orderList.highChildOrderList"
<view class="width100 mart5">
<view class="width90 alijusstart mart15" v-for="(item,index) in orderList.highChildOrderList"
:key="index">
<view class="width30">
<image :src="item.goodsImg" v-if="item.goodsImg" mode="widthFix" class="width100"></image>
<image src="../static/imgs/vipcz.png" v-else mode="widthFix" class="width90w"></image>
</view>
<view class="width40 font13 fcor666">{{item.goodsName}}</view>
<view class="width10 font12 fcor999">x{{item.saleCount}}</view>
<view class="width50 font13 fcor666">
<view>{{item.goodsName}}</view>
<view class="font12 fcor999">{{item.saleCount}} </view>
</view>
<view class="width20">
<view class="width100 fcor333 font12">¥<text class="fontwig6 font16">{{item.goodsActualPrice}}</text>
<view class="width100 fcor333 font12">¥<text
class="fontwig6 font16">{{item.goodsActualPrice}}</text>
</view>
<view class="width100 fcor999 font12" v-if="item.goodsActualPrice != item.goodsPrice" style="text-decoration: line-through;">
<view class="width100 fcor999 font12" v-if="item.goodsActualPrice != item.goodsPrice"
style="text-decoration: line-through;">
¥{{item.goodsPrice}}</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 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 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 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 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="width30">订单号</view>
<view class="width70 fotrt">{{orderList.orderNo}}</view>
<view class="width30">交易单号</view>
<view class="width70 fcor333 fotrt">{{orderList.orderNo}}</view>
</view>
<view class="width94 alijusstart mart20 font14 fcor666" v-if="orderList.paySerialNo">
<view class="width30">支付流水号</view>
<view class="width70 fotrt">{{orderList.paySerialNo}}</view>
<view class="width30">流水号</view>
<view class="width70 fcor333 fotrt">{{orderList.paySerialNo}}</view>
</view>
<view class="width94 alijusstart mart20 font14 fcor666" v-if="orderList.paySerialNo">
<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 class="width94 alijusstart mart20 font14 fcor666" v-if="typeid == 4">
<view class="width30">就餐方式</view>
<view class="width70 fotrt" v-if="orderList.eatType == 1">店内就餐</view>
<view class="width70 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 class="width70 fcor333 fotrt" v-if="orderList.eatType == 2">打包带走</view>
</view>
<view class="width94 alijusstart mart20 font14 fcor666" v-if="orderList.payType">
<view class="width30">支付方式</view>
<view class="width70 fotrt" v-if="orderList.payType == 2">微信</view>
<view class="width70 fotrt" v-if="orderList.payType == 3">积分</view>
<view class="width70 fotrt" v-if="orderList.payType == 4">工会卡</view>
<view class="width70 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 class="width70 fcor333 fotrt" v-if="orderList.payType == 2">微信</view>
<view class="width70 fcor333 fotrt" v-if="orderList.payType == 3">积分</view>
<view class="width70 fcor333 fotrt" v-if="orderList.payType == 4">工会卡</view>
<view class="width70 fcor333 fotrt" v-if="orderList.payType == 5">银联支付</view>
</view>
<view class="width94 alijusstart mart20 font14 fcor666" v-if="typeid == 10">
<view class="width30">充值手机号</view>
<view class="width70 fotrt">{{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 class="width70 fotrt fcor333">{{orderList.remarks}}</view>
</view>
<view class="width100 height20"></view>
</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>
<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>
</template>
@ -196,7 +208,7 @@
5: '已取消',
6: '退款中',
7: '退款失败'
},
},
phonestu: 1 //
}
},
@ -205,15 +217,16 @@
},
onShow() {
this.getThirdOrderByOrderId();
},
onUnload() {
},
onUnload() {
clearInterval(this.timer);
clearInterval(this.timerdjs);
clearInterval(this.timerdjs);
console.log('')
},
methods: {
//
updatestu() {
this.phonestu = 2
methods: {
//
updatestu(item) {
this.phonestu = item;
},
getAllCount() {
this.orderList.highChildOrderList.forEach((food) => {
@ -240,7 +253,7 @@
}
if (this.orderList.orderStatus == 2) {
this.setTimer();
}
}
this.coutnums = 0;
this.getAllCount();
} else {
@ -310,8 +323,8 @@
let holdTime = 10;
this.timerdjs = setInterval(() => {
if (holdTime <= 0) {
clearInterval(this.timerdjs);
this.getThirdOrderByOrderId();
clearInterval(this.timerdjs);
this.getThirdOrderByOrderId();
holdTime = 10;
return;
}
@ -351,15 +364,16 @@
}
.headstu {
width: 80px;
height: 80px;
line-height: 80px;
width: 90px;
height: 90px;
line-height: 90px;
text-align: center;
border-radius: 50%;
background-color: #faf1f1;
color: #c72a20;
margin-left: 40%;
border: 1px solid #c72a20;
background-color: #C6DEF4;
color: #0189E7;
margin-left: auto;
margin-right: auto;
border: 1px solid #0096FF;
}
.headotherstu {
@ -368,7 +382,8 @@
line-height: 80px;
text-align: center;
border-radius: 50%;
margin-left: 40%;
margin-left: auto;
margin-right: auto;
background-color: #999999;
}
@ -386,12 +401,36 @@
color: #c72a20;
}
.phoneck {
height: 35px;
line-height: 35px;
font-size: 12px;
box-sizing: border-box;
background-color: #0F8FE8;
color: #ffffff;
}
.headsbg {
border-radius: 0 0 30px 30px;
// border-radius: 0 0 30px 30px;
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 {
border-radius: 12px;
border-radius: 12px 12px 0 0;
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 {
@ -424,17 +463,37 @@
width: 80px;
border-radius: 25px;
text-align: center;
}
.phoneck {
height: 35px;
width: 120px;
line-height: 35px;
font-size: 14px;
border-radius: 39px;
border: 1px solid #CD2314;
box-sizing: border-box;
color: #CD2314;
margin: 10px auto;
}
.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>

Binary file not shown.

After

Width:  |  Height:  |  Size: 904 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 154 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 89 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 44 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 312 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 487 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 KiB

@ -111,6 +111,10 @@ $uni-font-size-paragraph:30upx;
font-size: 20px;
}
.font22 {
font-size: 22px;
}
.font24 {
font-size: 24px;
}
@ -278,6 +282,20 @@ $uni-font-size-paragraph:30upx;
background-color: #333333;
}
.backcolor3da7e7 {
background-color: #3da7e7;
}
.backcolor87c8f1 {
background-color: #87c8f1;
}
//渐变
.backcorlr{
background: linear-gradient(to right, #fe1a1a, #ff722e);
}
.backcorltop{
background: linear-gradient(to bottom, #3da7e7, #6fbdee);
}
.backcorf06{
background-color: #0083f5;
@ -349,6 +367,10 @@ $uni-font-size-paragraph:30upx;
width: 50%;
}
.width45 {
width: 45%;
}
.width40 {
width: 40%;
}
@ -371,6 +393,11 @@ $uni-font-size-paragraph:30upx;
width: 30%;
margin-left: 3%;
}
.width31{
width: 31%;
margin-right: auto;
margin-left: auto;
}
.width35 {
width: 35%;
}
@ -493,6 +520,9 @@ $uni-font-size-paragraph:30upx;
height: 30px;
line-height: 30px;
}
.height30h {
height: 30px;
}
.height40 {
height: 40px;
@ -518,11 +548,6 @@ $uni-font-size-paragraph:30upx;
height: 25px;
}
.height20 {
height: 20px;
line-height: 20px;
}
.height50 {
height: 50px;
@ -692,6 +717,10 @@ $uni-font-size-paragraph:30upx;
border-radius: 5px;
}
.border-8r{
border-radius: 8px;
}
/* button样式 */
.btnw70 {
width: 70%;
@ -754,6 +783,11 @@ $uni-font-size-paragraph:30upx;
display: flex;
}
.alijusnostart{
justify-content: flex-start;
display: flex;
}
.font12{
font-size: 12px;
}
@ -777,6 +811,19 @@ $uni-font-size-paragraph:30upx;
.icon12 {
width: 12px;
}
.icon25 {
width: 25px;
}
.icon30 {
width: 30px;
}
.icon40 {
width: 40px;
}
.icon45 {
width: 45px;
}
Loading…
Cancel
Save