Skip to content

M
mallapp
Commit 48892116 authored by 罗超's avatar 罗超
Browse files
Options

完善购物流程

parent e6250ddb
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 728 additions and 122 deletions
components/coupon/index.vue 0 → 100644
View file @ 48892116
<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>
components/goods/goodsku.vue
View file @ 48892116
......@@ -52,7 +52,7 @@
<text class="label">购买数量</text>
<u-number-box
:disabled="!skuObj"
:value="gc"
v-model="gc"
:min="1"
:max="goodamount"
@change="valChange"
......@@ -190,13 +190,13 @@ export default {
methods: {
joinCar() {
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) {
this.request(
{
url: "",
data: {
r: 'api/cart/add',
r: "api/cart/add",
goods_id: this.g.id,
attr: this.skuObj.id,
num: this.gc == 0 ? 1 : this.gc,
......@@ -215,10 +215,43 @@ export default {
);
} else {
uni.showToast({
title: '请选择商品',
position:"bottom",
icon:"none",
duration: 2000
title: "请选择商品",
position: "bottom",
icon: "none",
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,
});
}
},
......
components/goods/order-good-list.vue 0 → 100644
View file @ 48892116
<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>
components/goods/style1.vue
View file @ 48892116
......@@ -10,7 +10,7 @@
v-for="(item, gli) in goodList"
:key="gli"
class="good-one"
@click="openGood"
@click="openGood(item.page_url)"
:style="{
border: goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '',
background:
......@@ -100,8 +100,10 @@ export default {
this.mainColor = this.$uiConfig.mainColor;
},
methods: {
openGood() {
console.log();
openGood(url) {
uni.navigateTo({
url: url
});
},
},
};
......
components/goods/style2.vue
View file @ 48892116
......@@ -11,7 +11,7 @@
<u-col span="6" v-for="(item, gli) in goodList" :key="gli">
<view
class="good-two"
@click="openGood"
@click="openGood(item.page_url)"
:style="{
border:
goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '',
......@@ -103,9 +103,11 @@ export default {
this.mainColor = this.$uiConfig.mainColor;
},
methods: {
openGood(e) {
console.log(e);
},
openGood(url) {
uni.navigateTo({
url: url
});
}
},
};
</script>
......
components/goods/style3.vue
View file @ 48892116
......@@ -13,7 +13,7 @@
v-for="(item, gli) in goodList"
:key="gli"
>
<div class="good-three" @click="openGood" :style="{
<div class="good-three" @click="openGood(item.page_url)" :style="{
border:
goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '',
background:
......@@ -103,8 +103,10 @@ export default {
this.mainColor = this.$uiConfig.mainColor;
},
methods: {
openGood(e) {
console.log(e);
openGood(url) {
uni.navigateTo({
url: url
});
},
},
};
......
components/goods/style4.vue
View file @ 48892116
......@@ -11,7 +11,7 @@
class="good-four"
v-for="(item, gli) in goodList"
:key="gli"
@click="openGood"
@click="openGood(item.page_url)"
:style="{
border: goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '',
background:
......@@ -92,8 +92,10 @@ export default {
this.mainColor = this.$uiConfig.mainColor;
},
methods: {
openGood(e) {
console.log(e);
openGood(url) {
uni.navigateTo({
url: url
});
},
},
};
......
components/goods/style5.vue
View file @ 48892116
......@@ -9,19 +9,21 @@
>
<view
class="good-five"
@click="openGood"
@click="openGood(item.page_url)"
v-for="(item, gli) in goodList"
:key="gli"
:style="{
'border': goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '',
background:
goodsInfo.goodsStyle == 1 || goodsInfo.goodsStyle == 2
? '#FFF'
: '',
}"
border: goodsInfo.goodsStyle == 2 ? '1px solid rgb(226, 226, 226)' : '',
background:
goodsInfo.goodsStyle == 1 || goodsInfo.goodsStyle == 2 ? '#FFF' : '',
}"
>
<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 class="img-box">
<view class="img-show">
......@@ -32,14 +34,12 @@
/>
</view>
</view>
<view
class="good-info"
>
<view class="good-info">
<view class="good-name" v-if="goodsInfo.showGoodsName">
{{ item.name }}
</view>
<view class="good-price-info">
<view class="price" :style="{'color':mainColor}">{{
<view class="price" :style="{ color: mainColor }">{{
goodsInfo.showGoodsPrice ? item.price_content : ""
}}</view>
<view class="buy" v-if="goodsInfo.showBuyBtn">
......@@ -78,7 +78,7 @@
</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>
</template>
......@@ -95,8 +95,10 @@ export default {
this.mainColor = this.$uiConfig.mainColor;
},
methods: {
openGood(e) {
console.log(e);
openGood(url) {
uni.navigateTo({
url: url,
});
},
},
};
......
components/rubik/index.vue
View file @ 48892116
......@@ -10,7 +10,7 @@
:style="[item.formatStyle]"
@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>
</template>
......@@ -57,7 +57,7 @@ export default {
.ad-box .ad-chi {
position: absolute;
}
.ad-box .ad-chi img {
.ad-box .ad-chi .img {
width: 100%;
}
</style>
node_modules/uview-ui/components/u-number-box/u-number-box.vue
View file @ 48892116
......@@ -126,7 +126,7 @@
},
data() {
return {
inputVal: 0 // 输入框中的值，不能直接使用props中的value，因为应该改变props的状态
inputVal: 1 // 输入框中的值，不能直接使用props中的value，因为应该改变props的状态
};
},
created() {
......
pages.json
View file @ 48892116
......@@ -3,6 +3,9 @@
"^u-(.*)": "uview-ui/components/u-$1/u-$1.vue"
},
"pages": [{
"path": "pages/index/index"
},
{
"path": "pages/order-submit/order-submit"
},
{
......@@ -14,9 +17,6 @@
{
"path": "pages/user-center/user-center"
},
{
"path": "pages/index/index"
},
{
"path": "pages/foot/index/index"
},
......@@ -43,6 +43,9 @@
},
{
"path": "pages/goods/list"
},
{
"path": "pages/order/index"
}
],
"globalStyle": {
......
pages/order-submit/order-submit.vue
View file @ 48892116
This diff is collapsed.
pages/order/index.vue 0 → 100644
View file @ 48892116
<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