Commit 48892116 authored by 罗超's avatar 罗超

完善购物流程

parent e6250ddb
<template>
<u-popup
mode="bottom"
border-radius="20"
:popup="false"
v-model="show"
:maskCloseAble="true"
length="auto"
:safeAreaInsetBottom="true"
@close="popupClose"
:z-index="9999"
close-icon="cross"
:closeable="true"
>
<view class="coupon">
<view class="title">优惠券</view>
<view class="chosentips">请选择要使用的优惠券</view>
<view class="details">
<view class="item" v-for="(x, i) in ts" :key="i">
<view class="ticket">
<view class="miane">
<view class="money">
<text class="small" v-if="x.coupon_data.type==2"></text>
<text style="font-size: 44px;">{{x.sub_price.toString().split('.')[0]}}</text>
<text class="small" v-if="x.coupon_data.type==1"></text>
</view>
<view class="tiaojian">{{x.coupon_min_price}}元可用</view>
</view>
</view>
<view class="detail">
<view class="coupond">
<view class="name">{{x.coupon_data.name}}</view>
<view class="date">{{x.start_time+"-"+x.end_time}}</view>
<view class="rule">{{x.coupon_data.rule}}</view>
</view>
<view class="chosen">
<u-radio-group v-model="currentChosen">
<u-radio
shape="circle"
:name="x.id"
:icon-size="36"
:active-color="mc"
></u-radio>
</u-radio-group>
</view>
</view>
</view>
</view>
<view class="btton-box">
<u-button
size="80"
:ripple="true"
shape="circle"
:custom-style="{
backgroundColor: mc,
height: '80rpx',
color: '#FFF',
fontSize: '14px',
margin: '0 3vw',
width: '90vw',
}"
@click="popupClose"
>确定</u-button
>
</view>
</view>
</u-popup>
</template>
<script>
export default {
props: ["list", "current"],
data() {
return {
mc: "",
show: true,
currentChosen: "",
ts:[]
};
},
mounted() {
this.mc = this.$uiConfig.mainColor;
this.currentChosen = this.current;
this.ts=this.list
this.ts.forEach(x=>{
x.start_time=x.start_time.split(' ')[0].replace(/-/g,'.')
x.end_time=x.end_time.split(' ')[0].replace(/-/g,'.')
})
},
methods: {
popupClose(){
if(this.currentChosen!=this.current){
this.$emit('close',this.currentChosen)
}else{
this.$emit('close',-1)
}
}
},
};
</script>
<style>
.coupon {
min-height: 70vh;
background: #f5f5f5;
padding-bottom: 50px;
text-align: left !important;
border-top-left-radius: 20rpx;
border-top-right-radius: 20rpx;
overflow: hidden;
}
.coupon .title {
font-size: 22px;
color: #000;
padding: 20px;
background: #fff;
}
.coupon .chosentips {
padding: 12px 20px;
border-bottom: 1px solid #f5f5f5;
border-top: 1px solid #f5f5f5;
color: #777;
background: #fff;
font-size: 12px;
}
.coupon .details {
padding: 10px;
display: flex;
flex-direction: column;
}
.coupon .details .item {
display: flex;
margin-bottom: 10px;
align-items: flex-start;
background: #fff;
}
.coupon .details .item .ticket {
position: relative;
background-image: linear-gradient(
to bottom right,
rgb(95, 154, 220),
rgb(112, 125, 195)
);
width: 125px;
height: 100px;
display: flex;
align-items: center;
color: #fff;
}
.coupon .details .item .ticket .miane .money {
font-family: "oswald";
font-weight: bold;
size: 64px;
width: 125px;
text-align: center;
}
.coupon .details .item .ticket .miane .money .small {
font-size: 20px;
}
.coupon .details .item .ticket .miane .tiaojian {
font-size: 14px;
width: 125px;
text-align: center;
}
.coupon .details .item .detail {
width: 1px;
flex: 1;
background: #fff;
padding: 10px;
display: flex;
align-items: flex-end;
}
.coupon .details .item .detail .coupond {
flex: 1;
}
.coupon .details .item .detail .coupond .name {
font-size: 13px;
font-weight: 600;
color: #000;
}
.coupon .details .item .detail .coupond .date {
margin-top: 5px;
font-size: 11px;
color: #777;
}
.coupon .details .item .detail .coupond .rule{
font-size: 11px;
color:#777;
margin-top: 5px;
}
.coupon .details .item .detail .chosen {
width: 20px;
}
.coupon .details .item .ticket:before {
content: "";
display: block;
width: 12px;
height: 100%;
background-size: 12px 12px; /* 一个repeat的大小 */
background-repeat: repeat-y;
background-image: radial-gradient(#f5f5f5 4px, transparent 4px);
position: absolute;
top: 0;
}
.coupon .details .item .ticket:before {
left: -6px;
}
.pesongBox .btton-box {
height: 50px;
display: flex;
padding: 5px 10px;
border-top: 1px solid #f5f5f5;
position: fixed;
bottom: 0;
left: 0;
right: 0;
align-items: center;
background: #fff;
}
</style>
...@@ -52,7 +52,7 @@ ...@@ -52,7 +52,7 @@
<text class="label">购买数量</text> <text class="label">购买数量</text>
<u-number-box <u-number-box
:disabled="!skuObj" :disabled="!skuObj"
:value="gc" v-model="gc"
:min="1" :min="1"
:max="goodamount" :max="goodamount"
@change="valChange" @change="valChange"
...@@ -190,13 +190,13 @@ export default { ...@@ -190,13 +190,13 @@ export default {
methods: { methods: {
joinCar() { joinCar() {
let h = this.apiheader(); let h = this.apiheader();
h['content-type']='application/x-www-form-urlencoded' h["content-type"] = "application/x-www-form-urlencoded";
if (this.skuObj && this.skuObj.id) { if (this.skuObj && this.skuObj.id) {
this.request( this.request(
{ {
url: "", url: "",
data: { data: {
r: 'api/cart/add', r: "api/cart/add",
goods_id: this.g.id, goods_id: this.g.id,
attr: this.skuObj.id, attr: this.skuObj.id,
num: this.gc == 0 ? 1 : this.gc, num: this.gc == 0 ? 1 : this.gc,
...@@ -215,10 +215,43 @@ export default { ...@@ -215,10 +215,43 @@ export default {
); );
} else { } else {
uni.showToast({ uni.showToast({
title: '请选择商品', title: "请选择商品",
position:"bottom", position: "bottom",
icon:"none", icon: "none",
duration: 2000 duration: 2000,
});
}
},
buy() {
if (this.skuObj && this.skuObj.id) {
let goods=[]
let g={
id:this.skuObj.goods_id,
num:this.gc,
cart_id:0,
goods_attr_id:this.skuObj.id,
attr:[]
}
this.skuObj.attr_list.forEach(x=>{
g.attr.push({
attr_id: x.attr_id,
attr_group_id: x.attr_group_id
})
})
goods.push(g)
console.log(goods)
uni.navigateTo({
url: '/pages/order-submit/order-submit?goods='+encodeURIComponent(JSON.stringify(goods)),
complete(res){
console.log(res)
}
});
} else {
uni.showToast({
title: "请选择商品",
position: "bottom",
icon: "none",
duration: 2000,
}); });
} }
}, },
......
<template>
<u-popup
mode="bottom"
border-radius="20"
:popup="false"
v-model="show"
:maskCloseAble="true"
length="auto"
:safeAreaInsetBottom="true"
@close="popupClose"
:z-index="9999"
close-icon="cross"
:closeable="true"
>
<scroll-view
:scroll-y="true"
:enable-back-to-top="true"
:enable-flex="true"
class="ordergoodlist"
>
<view class="title-box">
<view class="title">商品清单</view>
<view class="tips">共6件</view>
</view>
<view class="goodbox update-goodbox" v-for="(y, i) in list" :key="i">
<image :src="y.cover_pic" mode="aspectFill" class="image" />
<view class="goodinfo">
<view class="name">{{ y.name }}</view>
<view class="attr">已选择 {{ y.attrStr }}</view>
<view class="price">
<view class="left" :style="{ color: mc }">
<text class="small"></text>
<text>{{ y.goods_attr.price.split(".")[0] }}</text>
<text class="small"
>.{{ y.goods_attr.price.split(".")[1] || "00" }}</text
>
</view>
<view class="right">x{{ y.num }}</view>
</view>
</view>
</view>
</scroll-view>
</u-popup>
</template>
<script>
export default {
props: ["list"],
data() {
return {
show: true,
mc: "",
};
},
mounted() {
this.mc = this.$uiConfig.mainColor;
},
methods: {
popupClose() {
this.$emit("close");
},
},
};
</script>
<style>
.ordergoodlist {
height: 75vh;
padding-bottom: 50px;
text-align: left !important;
border-top-left-radius: 20rpx;
border-top-right-radius: 20rpx;
overflow-y: auto;
position: relative;
padding: 69px 10px 0 10px;
}
.ordergoodlist .title-box {
display: flex;
align-items: center;
position: fixed;
top: 0;
left: 0;
right: 0;
background: #fff;
border-top-left-radius: 20rpx;
border-top-right-radius: 20rpx;
overflow: hidden;
z-index: 2;
}
.ordergoodlist .title-box .title {
font-size: 22px;
color: #000;
padding: 20px;
background: #fff;
flex: 1;
}
.ordergoodlist .title-box .tips {
font-size: 13px;
color: #777;
flex: 1;
text-align: right;
padding-right: 12px;
}
.ordergoodlist .goodbox.update-goodbox {
width: calc(100% - 20px);
padding-bottom: 10px;
border-bottom: 1px solid #f5f5f5;
margin-bottom: 10px;
}
.ordergoodlist .goodbox.update-goodbox:last-child {
border: none;
}
</style>
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
v-for="(item, gli) in goodList" v-for="(item, gli) in goodList"
:key="gli" :key="gli"
class="good-one" class="good-one"
@click="openGood" @click="openGood(item.page_url)"
:style="{ :style="{
border: goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '', border: goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '',
background: background:
...@@ -100,8 +100,10 @@ export default { ...@@ -100,8 +100,10 @@ export default {
this.mainColor = this.$uiConfig.mainColor; this.mainColor = this.$uiConfig.mainColor;
}, },
methods: { methods: {
openGood() { openGood(url) {
console.log(); uni.navigateTo({
url: url
});
}, },
}, },
}; };
......
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<u-col span="6" v-for="(item, gli) in goodList" :key="gli"> <u-col span="6" v-for="(item, gli) in goodList" :key="gli">
<view <view
class="good-two" class="good-two"
@click="openGood" @click="openGood(item.page_url)"
:style="{ :style="{
border: border:
goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '', goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '',
...@@ -103,9 +103,11 @@ export default { ...@@ -103,9 +103,11 @@ export default {
this.mainColor = this.$uiConfig.mainColor; this.mainColor = this.$uiConfig.mainColor;
}, },
methods: { methods: {
openGood(e) { openGood(url) {
console.log(e); uni.navigateTo({
}, url: url
});
}
}, },
}; };
</script> </script>
......
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
v-for="(item, gli) in goodList" v-for="(item, gli) in goodList"
:key="gli" :key="gli"
> >
<div class="good-three" @click="openGood" :style="{ <div class="good-three" @click="openGood(item.page_url)" :style="{
border: border:
goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '', goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '',
background: background:
...@@ -103,8 +103,10 @@ export default { ...@@ -103,8 +103,10 @@ export default {
this.mainColor = this.$uiConfig.mainColor; this.mainColor = this.$uiConfig.mainColor;
}, },
methods: { methods: {
openGood(e) { openGood(url) {
console.log(e); uni.navigateTo({
url: url
});
}, },
}, },
}; };
......
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
class="good-four" class="good-four"
v-for="(item, gli) in goodList" v-for="(item, gli) in goodList"
:key="gli" :key="gli"
@click="openGood" @click="openGood(item.page_url)"
:style="{ :style="{
border: goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '', border: goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '',
background: background:
...@@ -92,8 +92,10 @@ export default { ...@@ -92,8 +92,10 @@ export default {
this.mainColor = this.$uiConfig.mainColor; this.mainColor = this.$uiConfig.mainColor;
}, },
methods: { methods: {
openGood(e) { openGood(url) {
console.log(e); uni.navigateTo({
url: url
});
}, },
}, },
}; };
......
...@@ -9,19 +9,21 @@ ...@@ -9,19 +9,21 @@
> >
<view <view
class="good-five" class="good-five"
@click="openGood" @click="openGood(item.page_url)"
v-for="(item, gli) in goodList" v-for="(item, gli) in goodList"
:key="gli" :key="gli"
:style="{ :style="{
'border': goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '', border: goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '',
background: background:
goodsInfo.goodsStyle == 1 || goodsInfo.goodsStyle == 2 goodsInfo.goodsStyle == 1 || goodsInfo.goodsStyle == 2 ? '#FFF' : '',
? '#FFF' }"
: '',
}"
> >
<view class="tips" v-if="goodsInfo.showGoodsTag"> <view class="tips" v-if="goodsInfo.showGoodsTag">
<image :src="goodsInfo.goodsTagPicUrl" mode="widthFix" style="width:100%" /> <image
:src="goodsInfo.goodsTagPicUrl"
mode="widthFix"
style="width: 100%;"
/>
</view> </view>
<view class="img-box"> <view class="img-box">
<view class="img-show"> <view class="img-show">
...@@ -32,14 +34,12 @@ ...@@ -32,14 +34,12 @@
/> />
</view> </view>
</view> </view>
<view <view class="good-info">
class="good-info"
>
<view class="good-name" v-if="goodsInfo.showGoodsName"> <view class="good-name" v-if="goodsInfo.showGoodsName">
{{ item.name }} {{ item.name }}
</view> </view>
<view class="good-price-info"> <view class="good-price-info">
<view class="price" :style="{'color':mainColor}">{{ <view class="price" :style="{ color: mainColor }">{{
goodsInfo.showGoodsPrice ? item.price_content : "" goodsInfo.showGoodsPrice ? item.price_content : ""
}}</view> }}</view>
<view class="buy" v-if="goodsInfo.showBuyBtn"> <view class="buy" v-if="goodsInfo.showBuyBtn">
...@@ -78,7 +78,7 @@ ...@@ -78,7 +78,7 @@
</view> </view>
</view> </view>
</view> </view>
<view style="color:rgba(0,0,0,0);font-size:12px;">0</view> <view style="color: rgba(0, 0, 0, 0); font-size: 12px;">0</view>
</view> </view>
</template> </template>
...@@ -95,8 +95,10 @@ export default { ...@@ -95,8 +95,10 @@ export default {
this.mainColor = this.$uiConfig.mainColor; this.mainColor = this.$uiConfig.mainColor;
}, },
methods: { methods: {
openGood(e) { openGood(url) {
console.log(e); uni.navigateTo({
url: url,
});
}, },
}, },
}; };
......
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
:style="[item.formatStyle]" :style="[item.formatStyle]"
@click="clickHandler(item.link.new_link_url)" @click="clickHandler(item.link.new_link_url)"
> >
<img :src="item.pic_url" mode="widthFix" /> <image :src="item.pic_url" mode="widthFix" class="img"></image>
</view> </view>
</view> </view>
</template> </template>
...@@ -57,7 +57,7 @@ export default { ...@@ -57,7 +57,7 @@ export default {
.ad-box .ad-chi { .ad-box .ad-chi {
position: absolute; position: absolute;
} }
.ad-box .ad-chi img { .ad-box .ad-chi .img {
width: 100%; width: 100%;
} }
</style> </style>
...@@ -126,7 +126,7 @@ ...@@ -126,7 +126,7 @@
}, },
data() { data() {
return { return {
inputVal: 0 // 输入框中的值,不能直接使用props中的value,因为应该改变props的状态 inputVal: 1 // 输入框中的值,不能直接使用props中的value,因为应该改变props的状态
}; };
}, },
created() { created() {
......
...@@ -3,6 +3,9 @@ ...@@ -3,6 +3,9 @@
"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue" "^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
}, },
"pages": [{ "pages": [{
"path": "pages/index/index"
},
{
"path": "pages/order-submit/order-submit" "path": "pages/order-submit/order-submit"
}, },
{ {
...@@ -14,9 +17,6 @@ ...@@ -14,9 +17,6 @@
{ {
"path": "pages/user-center/user-center" "path": "pages/user-center/user-center"
}, },
{
"path": "pages/index/index"
},
{ {
"path": "pages/foot/index/index" "path": "pages/foot/index/index"
}, },
...@@ -43,6 +43,9 @@ ...@@ -43,6 +43,9 @@
}, },
{ {
"path": "pages/goods/list" "path": "pages/goods/list"
},
{
"path": "pages/order/index"
} }
], ],
"globalStyle": { "globalStyle": {
......
...@@ -2,9 +2,9 @@ ...@@ -2,9 +2,9 @@
<view class="ordersubmit" v-if="!loading"> <view class="ordersubmit" v-if="!loading">
<view class="add-box" @click="chosenAddress(ds.address.id)"> <view class="add-box" @click="chosenAddress(ds.address.id)">
<view class="add-info"> <view class="add-info">
<view class="address">{{ <view class="address">
address.province + address.city + address.district {{ address.province + address.city + address.district }}
}}</view> </view>
<view class="area">{{ address.detail }}</view> <view class="area">{{ address.detail }}</view>
<view class="address"> <view class="address">
<text style="margin-right: 10px;">{{ address.name }}</text> <text style="margin-right: 10px;">{{ address.name }}</text>
...@@ -24,29 +24,66 @@ ...@@ -24,29 +24,66 @@
<u-icon name="shop-o" size="30" color="#232323"></u-icon> <u-icon name="shop-o" size="30" color="#232323"></u-icon>
<text style="margin-left: 10px;">{{ x.mch.name }}</text> <text style="margin-left: 10px;">{{ x.mch.name }}</text>
</view> </view>
<view v-if="x.goods_list.length == 1" class="store-list"> <view class="store-list">
<view class="goodbox" v-for="(y, yi) in x.goods_list" :key="yi"> <template v-if="x.goods_list.length == 1">
<image :src="y.cover_pic" mode="aspectFill" class="image" /> <view class="goodbox" v-for="(y, yi) in x.goods_list" :key="yi">
<view class="goodinfo"> <image :src="y.cover_pic" mode="aspectFill" class="image" />
<view class="name">{{ y.name }}</view> <view class="goodinfo">
<view class="attr">已选择 {{ y.attrStr }}</view> <view class="name">{{ y.name }}</view>
<view class="price"> <view class="attr">已选择 {{ y.attrStr }}</view>
<view class="left" :style="{ color: mc }"> <view class="price">
<text class="small"></text> <view class="left" :style="{ color: mc }">
<text>{{ y.goods_attr.price.split(".")[0] }}</text> <text class="small"></text>
<text class="small" <text>{{ y.goods_attr.price.split(".")[0] }}</text>
>.{{ y.goods_attr.price.split(".")[1] || "00" }}</text <text class="small"
> >.{{ y.goods_attr.price.split(".")[1] || "00" }}</text
>
</view>
<view class="right">x{{ y.num }}</view>
</view> </view>
<view class="right">x{{ y.num }}</view>
</view> </view>
</view> </view>
</view> </template>
<template v-else>
<view class="goodboxmore">
<view class="good-list">
<view style="white-space: nowrap">
<image
v-for="(y, yi) in x.goods_list"
:key="yi"
:src="y.cover_pic"
mode="aspectFill"
class="item"
/>
</view>
</view>
<view class="infos">
<view class="text">{{ x.goods_list.length }}</view>
<u-icon
name="ellipsis"
size="36"
@click="showGoodListHandler(i)"
></u-icon>
</view>
</view>
</template>
<view class="peisong"> <view class="peisong">
<view>配送</view> <view>配送</view>
<view style="text-align:right;padding-right:5px">{{x.delivery.send_type_name}}</view> <view style="text-align: right; padding-right: 5px;">
<u-icon name="ellipsis" size="36" @click="showPeisongHandler(i)"></u-icon> {{ x.delivery.send_type_name }}
<peisong :list="x.delivery.send_type_list" :index="i" @close="changeSendTypeHandler" :send-type="x.delivery.send_type" v-if="x.delivery.showDelivery"></peisong> </view>
<u-icon
name="ellipsis"
size="36"
@click="showPeisongHandler(i)"
></u-icon>
<peisong
:list="x.delivery.send_type_list"
:index="i"
@close="changeSendTypeHandler"
:send-type="x.delivery.send_type"
v-if="x.delivery.showDelivery"
></peisong>
</view> </view>
<view class="liuyan"> <view class="liuyan">
<u-field <u-field
...@@ -63,16 +100,26 @@ ...@@ -63,16 +100,26 @@
<view class="filed"> <view class="filed">
<view class="left">优惠券</view> <view class="left">优惠券</view>
<view class="right"> <view class="right">
<text class="content">选择优惠券</text> <text class="content" v-if="mchs[0].coupon.user_coupon_id == 0"
<u-icon name="ellipsis" size="36"></u-icon> >选择优惠券</text
>
<text class="content" v-else :style="{ color: mc }"
>已优惠{{ mchs[0].coupon.coupon_discount }}元</text
>
<u-icon
name="ellipsis"
size="36"
v-if="couponList.length > 0"
@click="showCouponHandler"
></u-icon>
</view> </view>
</view> </view>
<view class="filed" v-if="integral.can_use"> <view class="filed" v-if="integral.can_use">
<view class="left">积分抵扣</view> <view class="left">积分抵扣</view>
<view class="right"> <view class="right">
<text class="content" :style="{ color: secondary }">{{ <text class="content" :style="{ color: secondary }">
`使用${integral.use_num}积分抵扣${integral.deduction_price}元` {{ `使用${integral.use_num}积分抵扣${integral.deduction_price}元` }}
}}</text> </text>
<u-checkbox-group> <u-checkbox-group>
<u-checkbox <u-checkbox
v-model="userInt" v-model="userInt"
...@@ -90,7 +137,7 @@ ...@@ -90,7 +137,7 @@
<text class="content">100积分</text> <text class="content">100积分</text>
<u-icon name="ellipsis" size="36"></u-icon> <u-icon name="ellipsis" size="36"></u-icon>
</view> </view>
</view> --> </view>-->
</view> </view>
<view class="discountbox"> <view class="discountbox">
<view class="filed"> <view class="filed">
...@@ -115,6 +162,14 @@ ...@@ -115,6 +162,14 @@
> >
</view> </view>
</view> </view>
<view class="filed" v-if="integral.can_use">
<view class="left">积分抵扣</view>
<view class="right">
<text class="price" :style="{ color: mc }">
-¥{{ userInt ? integral.deduction_price.toFixed(2) : "0.00" }}
</text>
</view>
</view>
</view> </view>
<view class="btton-box"> <view class="btton-box">
<view class="left" :style="{ color: mc }"> <view class="left" :style="{ color: mc }">
...@@ -127,24 +182,43 @@ ...@@ -127,24 +182,43 @@
size="80" size="80"
:ripple="true" :ripple="true"
shape="circle" shape="circle"
@click="submitOrderHandler"
:custom-style="{ :custom-style="{
backgroundColor: mc, backgroundColor: mc,
height: '80rpx', height: '80rpx',
color: '#FFF', color: '#FFF',
fontSize: '14px', fontSize: '14px',
}" }"
>提交订单</u-button
> >
<u-loading
mode="circle"
style="margin-right: 5px;"
v-if="submitOrder"
></u-loading
>提交订单
</u-button>
</view> </view>
</view> </view>
<coupon
v-if="couponList.length > 0 && showCoupon"
:list="couponList"
:current="formData.list[0].user_coupon_id"
@close="closeCouponHandler"
></coupon>
<view class="notOption" v-if="submitOrder"></view>
<good-list :list="goodData" v-if="showGoodList" @close="closeGoodListHandler"></good-list>
</view> </view>
</template> </template>
<script> <script>
import peisong from "@/components/peisong/index"; import peisong from "@/components/peisong/index";
import coupon from "@/components/coupon/index";
import goodList from '@/components/goods/order-good-list'
export default { export default {
components: { components: {
peisong, peisong,
coupon,
goodList
}, },
data() { data() {
return { return {
...@@ -181,23 +255,23 @@ export default { ...@@ -181,23 +255,23 @@ export default {
secondary: "", secondary: "",
userInt: false, userInt: false,
loading: true, loading: true,
couponList: [],
showCoupon: false,
submitOrder: false,
isLeave: false,
goodData:[],
showGoodList:false
}; };
}, },
onLoad(option) { onLoad(option) {
if (option.goods) { if (option.goods) {
this.formData.list[0].goods_list = JSON.parse( this.formData.list[0].goods_list = JSON.parse(decodeURIComponent(option.goods));
decodeURIComponent(option.goods) } else if (option.formData) {
); this.formData = JSON.parse(option.formData);
} else { } else {
this.formData.list[0].goods_list = [ uni.redirectTo({
{ url: '/pages/index/index'
id: 74997, });
attr: [{ attr_id: 1, attr_group_id: 1 }],
num: 1,
cart_id: 77092,
goods_attr_id: 160655,
},
];
} }
this.initPage(); this.initPage();
this.mc = this.$uiConfig.mainColor; this.mc = this.$uiConfig.mainColor;
...@@ -205,28 +279,127 @@ export default { ...@@ -205,28 +279,127 @@ export default {
}, },
onShow() { onShow() {
this.init(); this.init();
this.initCoupon();
if (this.isLeave) {
uni.navigateBack({
delta: 1,
});
}
}, },
methods: { methods: {
changeSendTypeHandler(e){ closeGoodListHandler(){
let i=e.index this.goodData=[]
console.log(i) this.showGoodList=false
let obj=this.mchs[i] },
obj.delivery.showDelivery=false showGoodListHandler(i){
this.$set(this.mchs,i,obj) this.goodData=this.mchs[i].goods_list
this.$forceUpdate() this.showGoodList=true
if(e && e.val){ },
if(this.mchs[i].delivery.send_type!=e.val){ submitOrderHandler() {
this.formData.list[i].send_type=e.val if (!this.submitOrder) {
this.init() this.submitOrder = true;
let that=this
uni.requestSubscribeMessage({
tmplIds: this.ds.template_message_list,
complete (res) {
that.submitOrder = false;
let list = [];
that.mchs.forEach((x) => {
list.push(x.form_data);
});
let forms = {
list,
};
forms.address_id = that.ds.address.id;
forms.address = {
name: that.ds.address.name,
mobile: that.ds.address.mobile,
};
console.log(forms);
let h = that.apiheader();
h["content-type"] = "application/x-www-form-urlencoded";
that.request(
{
data: {
r: "api/order/submit",
form_data: JSON.stringify(forms),
},
header: h,
method: "POST",
},
(res) => {
console.log(res.data);
uni.showModal({
title: "下单提醒",
content:
"订单已经创建成功,等待后端实现支付调用,是否前往订单列表",
success: function (res) {
if (res.confirm) {
that.isLeave = true;
uni.navigateTo({
url: "/pages/order/index",
});
} else if (res.cancel) {
console.log("用户点击取消");
}
},
});
}
);
}
})
}
},
closeCouponHandler(e) {
if (e != -1) {
this.formData.list.forEach((x) => {
x.user_coupon_id = e;
});
this.init();
}
this.showCoupon = false;
},
showCouponHandler() {
this.showCoupon = true;
},
initCoupon() {
let h = this.apiheader();
h["content-type"] = "application/x-www-form-urlencoded";
this.request(
{
url: "",
data: {
r: "api/order/usable-coupon-list",
form_data: JSON.stringify(this.formData.list[0]),
},
header: h,
method: "POST",
},
(res) => {
this.couponList = res.data.list;
}
);
},
changeSendTypeHandler(e) {
let i = e.index;
console.log(i);
let obj = this.mchs[i];
obj.delivery.showDelivery = false;
this.$set(this.mchs, i, obj);
this.$forceUpdate();
if (e && e.val) {
if (this.mchs[i].delivery.send_type != e.val) {
this.formData.list[i].send_type = e.val;
this.init();
} }
} }
}, },
showPeisongHandler(x){ showPeisongHandler(x) {
let obj=this.mchs[x] let obj = this.mchs[x];
obj.delivery.showDelivery=true obj.delivery.showDelivery = true;
this.$set(this.mchs,x,obj) this.$set(this.mchs, x, obj);
this.$forceUpdate() this.$forceUpdate();
}, },
chosenAddress(id) { chosenAddress(id) {
uni.navigateTo({ uni.navigateTo({
...@@ -235,19 +408,10 @@ export default { ...@@ -235,19 +408,10 @@ export default {
}, },
changeUseInt(e) { changeUseInt(e) {
this.userInt = e.value; this.userInt = e.value;
if (this.userInt) { this.formData.list.forEach((x) => {
this.couponPrice += parseFloat(this.integral.deduction_price); x.use_integral = this.userInt ? 1 : 0;
this.ds.total_price = ( });
parseFloat(this.ds.total_price) - this.init();
parseFloat(this.integral.deduction_price)
).toFixed(2);
} else {
this.couponPrice -= parseFloat(this.integral.deduction_price);
this.ds.total_price = (
parseFloat(this.ds.total_price) +
parseFloat(this.integral.deduction_price)
).toFixed(2);
}
}, },
initPage() { initPage() {
let currentPages = getCurrentPages(); let currentPages = getCurrentPages();
...@@ -282,6 +446,15 @@ export default { ...@@ -282,6 +446,15 @@ export default {
this.address = res.data.address; this.address = res.data.address;
this.mchs = res.data.mch_list; this.mchs = res.data.mch_list;
this.ds = res.data; this.ds = res.data;
this.expressPrice = 0.0;
this.goodPrice = 0.0;
this.couponPrice = 0.0;
this.integral = {
can_use: false,
use: false,
use_num: 0,
deduction_price: 0,
};
this.formatPrice(); this.formatPrice();
this.formatAttr(); this.formatAttr();
this.loading = false; this.loading = false;
...@@ -290,14 +463,14 @@ export default { ...@@ -290,14 +463,14 @@ export default {
}, },
formatPrice() { formatPrice() {
this.mchs.forEach((x) => { this.mchs.forEach((x) => {
x.delivery.showDelivery=false x.delivery.showDelivery = false;
x.delivery.send_type_list.forEach(y=>{ x.delivery.send_type_list.forEach((y) => {
console.log(y.value==x.delivery.send_type) console.log(y.value == x.delivery.send_type);
if(y.value==x.delivery.send_type){ if (y.value == x.delivery.send_type) {
x.delivery.send_type_name=y.name x.delivery.send_type_name = y.name;
} }
}) });
this.goodPrice += parseFloat(x.total_goods_price); this.goodPrice += parseFloat(x.total_goods_original_price);
this.expressPrice += parseFloat(x.express_price); this.expressPrice += parseFloat(x.express_price);
this.couponPrice += parseFloat(x.coupon.coupon_discount || 0.0); this.couponPrice += parseFloat(x.coupon.coupon_discount || 0.0);
if (x.integral.can_use) { if (x.integral.can_use) {
...@@ -312,6 +485,7 @@ export default { ...@@ -312,6 +485,7 @@ export default {
}, },
formatAttr() { formatAttr() {
this.mchs.forEach((x) => { this.mchs.forEach((x) => {
this.userInt = x.integral.use;
x.goods_list.forEach((y) => { x.goods_list.forEach((y) => {
let attrStr = ""; let attrStr = "";
y.attr_list.forEach((z, i) => { y.attr_list.forEach((z, i) => {
...@@ -329,17 +503,18 @@ export default { ...@@ -329,17 +503,18 @@ export default {
</script> </script>
<style> <style>
@font-face { /* @font-face {
font-family: "oswald"; font-family: "oswald";
src: url("https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/smallapp/Oswald-Regular.ttf"); src: url("https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/smallapp/Oswald-Regular.ttf");
} } */
.ordersubmit { .ordersubmit {
height: 100vh; min-height: 100vh;
padding: 0 5px; padding: 0 5px;
background: #f6f6f6; background: #f6f6f6;
padding-bottom: 40px; padding-bottom: 40px;
overflow-y: auto; font-family: "oswald";
} }
.ordersubmit .add-box { .ordersubmit .add-box {
padding: 10px; padding: 10px;
background: #fff; background: #fff;
...@@ -464,6 +639,32 @@ export default { ...@@ -464,6 +639,32 @@ export default {
color: #444; color: #444;
font-size: 13px; font-size: 13px;
} }
.ordersubmit .goodboxmore {
margin-bottom: 20px;
display: flex;
}
.ordersubmit .goodboxmore .good-list {
display: flex;
flex: 1;
overflow-x: auto;
}
.ordersubmit .goodboxmore .good-list .item {
width: 70px;
height: 70px;
border-radius: 5px;
margin-right: 10px;
}
.ordersubmit .goodboxmore .infos {
display: flex;
width: 80px;
}
.ordersubmit .goodboxmore .infos .text {
text-align: center;
font-size: 13px;
width: 57px;
margin-right: 5px;
line-height: 70px;
}
.ordersubmit .store-list .peisong { .ordersubmit .store-list .peisong {
margin-bottom: 20px; margin-bottom: 20px;
display: flex; display: flex;
...@@ -530,6 +731,16 @@ export default { ...@@ -530,6 +731,16 @@ export default {
right: 0; right: 0;
align-items: center; align-items: center;
background: #fff; background: #fff;
z-index: 3;
}
.ordersubmit .notOption {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: transparent;
z-index: 2;
} }
.ordersubmit .btton-box .left { .ordersubmit .btton-box .left {
font-size: 16px; font-size: 16px;
......
<template>
<view>
订单首页
</view>
</template>
<script>
export default {
}
</script>
<style>
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment