邓平艺
4 years ago
8 changed files with 2355 additions and 1414 deletions
-
6components/lf-price/lf-price.vue
-
62pages.json
-
54pages/article/details.vue
-
596pages/coupon/index/index.vue
-
445pages/coupon/index/index1.vue
-
574pages/shop/goodsdetail.vue
-
1072pages/store/cart/cart.vue
-
956pages/store/cart/carttemplate.vue
@ -0,0 +1,54 @@ |
|||||
|
<template> |
||||
|
<view> |
||||
|
<lf-nav :spreadOut="true" :showIcon="true" bgColor="#F8F8F8" title="文章详情"></lf-nav> |
||||
|
<view style="height: 30rpx;"></view> |
||||
|
<view class="lf-m-l-32 lf-m-r-32"> |
||||
|
<view> |
||||
|
<view class="lf-font-36 lf-color-222 lf-m-b-20 lf-font-bold"> |
||||
|
苦等一年！阳澄湖大闸蟹又肥了，让你安心吃螃蟹的文章也来了 |
||||
|
</view> |
||||
|
<view class="lf-flex lf-m-b-24"> |
||||
|
<view class="lf-font-28" style="color: #2D6361;"> |
||||
|
金城优选线上商城 |
||||
|
</view> |
||||
|
<view class="lf-color-777 lf-font-28 lf-m-l-25"> |
||||
|
2021.09.01 16:28:22 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<rich-text :nodes="content" v-if="content"></rich-text> |
||||
|
<!-- <lf-nocontent v-else></lf-nocontent> --> |
||||
|
<!-- 回到顶部 --> |
||||
|
<u-back-top :scroll-top="pageScrollTop" :custom-style="{background: 'rgba(51, 51 51, 0.3)'}"></u-back-top> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data(){ |
||||
|
return { |
||||
|
content: '', |
||||
|
notice_id: 0, |
||||
|
title_content: '' |
||||
|
} |
||||
|
}, |
||||
|
onLoad(e){ |
||||
|
this.notice_id = e.notice_id; |
||||
|
if(this.notice_id) { |
||||
|
// this.getData(); |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
getData(){ |
||||
|
this.$http(this.API.API_NOTICEDETAILS,{id:this.notice_id}).then(res => { |
||||
|
this.content = res.data?.content; |
||||
|
this.title_content = res.data |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
</style> |
||||
@ -1,445 +1,161 @@ |
|||||
<template> |
<template> |
||||
<view id="coupon-index"> |
|
||||
|
|
||||
<view class="navbar mx-1px-top"> |
|
||||
<block v-for="(item, index) in tabList" :key="index"> |
|
||||
<view :id="index" class="navbar-item activity" :hidden="activeIndex != index" |
|
||||
:style="'color: ' + config.mainColor" @tap="tabClick"> |
|
||||
<view class="navbar-title">{{item.title}}</view> |
|
||||
</view> |
|
||||
|
|
||||
<view :id="index" :hidden="activeIndex == index" class="navbar-item" @tap="tabClick"> |
|
||||
<view class="navbar-title">{{item.title}}</view> |
|
||||
</view> |
|
||||
</block> |
|
||||
|
|
||||
<view class="navbar-slider" |
|
||||
:style="'width: ' + width + 'px; transform: translateX(' + sliderOffset + 'px); -webkit-transform: translateX(' + sliderOffset + 'px); background: ' + config.mainColor"></view> |
|
||||
</view> |
|
||||
|
|
||||
<view class="tab-panel"> |
|
||||
<view class="tab-content" :hidden="activeIndex != 0"> |
|
||||
|
|
||||
<view class="no-list" v-if="(!dataList[0].length || !dataList[0][0].length) && tabList[0].init"> |
|
||||
<i class="iconfont icon-youhuiquan"></i> |
|
||||
<view>报告主人，您暂无 |
|
||||
<span v-if="is_coupon == 1">优惠券~</span> |
|
||||
<span v-else>促销活动</span> |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
<view v-for="(items, idx) in dataList[0]" :key="idx"> |
|
||||
<view class="coupon" :data-id="item.discount.id" @tap="jumpDetailOn" |
|
||||
v-for="(item, index) in dataList[0][idx]" :key="index"> |
|
||||
<view class="coupon-left" :class="is_coupon != 1 ? 'discount' : ''" |
|
||||
:style="'background: ' + config.mainColor"> |
|
||||
<view class="text-wrap"> |
|
||||
<view class="text-box"> |
|
||||
<view class="text"> |
|
||||
<text class="money" v-if="item.discount.action_type.type == 'cash'">￥</text> |
|
||||
<span>{{ item.discount.action_type.value }}</span> |
|
||||
|
|
||||
<text class="money" v-if="item.discount.action_type.type == 'discount'">折</text> |
|
||||
</view> |
|
||||
<text class="label text">{{ item.discount.label }}</text> |
|
||||
</view> |
|
||||
|
|
||||
</view> |
|
||||
<view class="dot-wrap"> |
|
||||
<view class="dot-item"> |
|
||||
|
|
||||
</view> |
|
||||
<view class="dot-item"> |
|
||||
|
|
||||
</view> |
|
||||
<view class="dot-item"> |
|
||||
|
|
||||
</view> |
|
||||
<view class="dot-item"> |
|
||||
|
|
||||
</view> |
|
||||
<view class="dot-item"> |
|
||||
|
|
||||
</view> |
|
||||
<view class="dot-item"> |
|
||||
|
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
<view class="coupon-right"> |
|
||||
<view class="top"> |
|
||||
<span class="type"> |
|
||||
<span v-if="item.discount.channel == 'ec'">商城</span> |
|
||||
<span v-else>门店</span> |
|
||||
</span> |
|
||||
<text class="info">{{item.discount.title}}</text> |
|
||||
</view> |
|
||||
|
|
||||
<view class="bottom"> |
|
||||
<view class="bottom-use"> |
|
||||
<view class="tiem-box"> |
|
||||
<text>{{item.discount.use_start_time}}至{{item.discount.use_end_time}}</text> |
|
||||
</view> |
|
||||
<view v-if="is_coupon == 1"> |
|
||||
|
|
||||
<!--<view class="btn use" data-code="item.discount.code" data-index="idx"--> |
|
||||
<!--data-findex="index" v-if="!item.discount.has_get" @tap.stop="getCoupon">--> |
|
||||
<!--点击领取--> |
|
||||
<!--</view>--> |
|
||||
<!----> |
|
||||
<view class="btn already" |
|
||||
:style="'color: ' + config.mainColor + '; border-color: ' + config.mainColor" |
|
||||
:data-id="item.id" @tap.stop="jumpList"> |
|
||||
去使用 |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
|
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
|
|
||||
|
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="tab-content" :hidden="activeIndex != 1"> |
|
||||
<view class="no-list" v-if="(!dataList[1].length || !dataList[1][0].length) && tabList[1].init"> |
|
||||
<i class="iconfont icon-youhuiquan"></i> |
|
||||
<view>报告主人，您暂无 |
|
||||
<span v-if="is_coupon == 1">优惠券~</span> |
|
||||
<span v-else>促销活动</span> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view v-for="(items, idx) in dataList[1]" :key="idx"> |
|
||||
<view class="coupon" :data-id="item.discount.id" :data-coupon="item.id" @tap="jumpDetail" |
|
||||
v-for="(item, index) in dataList[1][idx]" :key="index"> |
|
||||
<view class="coupon-left" :class="is_coupon != 1 ? 'discount' : ''" |
|
||||
:style="'background: ' + config.mainColor"> |
|
||||
<view class="text-wrap"> |
|
||||
<view class="text-box"> |
|
||||
<view class="text"> |
|
||||
<text class="money" v-if="item.discount.action_type.type == 'cash'">￥</text> |
|
||||
<span>{{ item.discount.action_type.value }}</span> |
|
||||
|
|
||||
<text class="money" v-if="item.discount.action_type.type == 'discount'">折</text> |
|
||||
</view> |
|
||||
<text class="label text">{{ item.discount.label }}</text> |
|
||||
</view> |
|
||||
|
|
||||
</view> |
|
||||
<view class="dot-wrap"> |
|
||||
<view class="dot-item"> |
|
||||
|
|
||||
</view> |
|
||||
<view class="dot-item"> |
|
||||
|
|
||||
</view> |
|
||||
<view class="dot-item"> |
|
||||
|
|
||||
</view> |
|
||||
<view class="dot-item"> |
|
||||
|
|
||||
</view> |
|
||||
<view class="dot-item"> |
|
||||
|
|
||||
</view> |
|
||||
<view class="dot-item"> |
|
||||
|
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="coupon-right"> |
|
||||
<view class="top"> |
|
||||
<span class="type"> |
|
||||
<span v-if="item.discount.channel == 'ec'">商城</span> |
|
||||
<span v-else>门店</span> |
|
||||
</span> |
|
||||
<text class="info">{{item.discount.title}}</text> |
|
||||
</view> |
|
||||
<view class="bottom"> |
|
||||
<view class="bottom-use"> |
|
||||
<view class="tiem-box"> |
|
||||
<text>{{item.discount.use_start_time}}至{{item.discount.use_end_time}}</text> |
|
||||
</view> |
|
||||
<view v-if="is_coupon == 1"> |
|
||||
<!--<view class="btn use" :data-code="item.discount.code" |
|
||||
:data-index="idx" :data-findex="index" |
|
||||
v-if="!item.discount.has_get" @tap.stop="getCoupon"> |
|
||||
点击领取 |
|
||||
</view>--> |
|
||||
<view class="btn already" |
|
||||
:style="'color: ' + config.mainColor + '; border-color: ' + config.mainColor" |
|
||||
:data-id="item.discount.id" :data-coupon="item.id" @tap.stop="jumpDetail"> |
|
||||
去使用 |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="see-over" @tap="toast"> |
|
||||
查看已失效优惠券 |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
|
<view> |
||||
|
<lf-nav :spreadOut="true" :showIcon="true" bgColor="white" title="优惠券"></lf-nav> |
||||
|
<view class="special_tab"> |
||||
|
<u-tabs :list="tab_list" active-color="#15716E" inactive-color='#777777' :is-scroll="true" :current="current" @change="tabChange"></u-tabs> |
||||
|
</view> |
||||
|
<view class="coupon-wrap"> |
||||
|
<view class="coupon-card lf-m-b-30" v-for="i of 3"> |
||||
|
<view class="coupon-circle-top"> |
||||
|
<view class="coupon-circle1"></view> |
||||
|
</view> |
||||
|
<view class="coupon-circle-bottom"> |
||||
|
<view class="coupon-circle1"></view> |
||||
|
</view> |
||||
|
<view class="coupon-radius"> |
||||
|
<view class="coupon-left"> |
||||
|
<view class="lf-font-24 lf-color-white">￥<text class="lf-font-36 lf-color-white lf-font-bold">200</text></view> |
||||
|
<view class="coupon-tag"> |
||||
|
待使用 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="coupon-right"> |
||||
|
<view class="lf-font-32 lf-font-bold lf-color-white">满1200减200</view> |
||||
|
<view class="lf-font-24 lf-color-white">有效期2021.09.09-2021-09.15</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
</template> |
</template> |
||||
<script> |
|
||||
import {pageLogin, getUrl, config} from '@/common/js/utils.js'; |
|
||||
|
|
||||
export default { |
|
||||
data() { |
|
||||
return { |
|
||||
activeIndex: 0, |
|
||||
sliderOffset: 0, |
|
||||
width: 0, |
|
||||
tabList: [{ |
|
||||
title: '线上', |
|
||||
init: false, |
|
||||
page: 0, |
|
||||
more: true |
|
||||
}, { |
|
||||
title: '线下', |
|
||||
init: false, |
|
||||
page: 0, |
|
||||
more: true |
|
||||
}], |
|
||||
dataList: { |
|
||||
0: [], |
|
||||
1: [] |
|
||||
}, |
|
||||
is_coupon: 1, |
|
||||
// 用于判断是否为优惠券 1：优惠券 0：促销折扣 |
|
||||
gbConfig: '', |
|
||||
}; |
|
||||
}, |
|
||||
|
|
||||
onReachBottom(e) { |
|
||||
var status = this.activeIndex; |
|
||||
var page = this.tabList[status].page + 1; |
|
||||
var tabList = `tabList[${status}]`; |
|
||||
|
|
||||
if (this.tabList[status].more) { |
|
||||
this.queryCouponList(status, page); |
|
||||
} else { |
|
||||
wx.showToast({ |
|
||||
image: '../../../static/error.png', |
|
||||
title: '再拉也没有啦' |
|
||||
}); |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
onShow(e) { |
|
||||
wx.getSystemInfo({ |
|
||||
success: res => { |
|
||||
this.setData({ |
|
||||
width: res.windowWidth / this.tabList.length, |
|
||||
sliderOffset: res.windowWidth / this.tabList.length * this.activeIndex |
|
||||
}); |
|
||||
} |
|
||||
}); |
|
||||
}, |
|
||||
|
|
||||
onLoad(e) { |
|
||||
// 第三方平台配置颜色 |
|
||||
var gbConfig = this.$cookieStorage.get('globalConfig') || ''; |
|
||||
// this.setData({ |
|
||||
// config: gbConfig |
|
||||
// }); |
|
||||
// |
|
||||
this.config = gbConfig; |
|
||||
|
|
||||
if (e.type) { |
|
||||
this.setData({ |
|
||||
activeIndex: e.type |
|
||||
}); |
|
||||
} |
|
||||
|
|
||||
; |
|
||||
this.queryCouponList(); |
|
||||
}, |
|
||||
|
|
||||
components: {}, |
|
||||
props: {}, |
|
||||
methods: { |
|
||||
tabClick(e) { |
|
||||
var status = e.currentTarget.id; |
|
||||
this.setData({ |
|
||||
sliderOffset: e.currentTarget.offsetLeft, |
|
||||
activeIndex: status |
|
||||
}); |
|
||||
|
|
||||
if (!this.tabList[status].init) { |
|
||||
this.queryCouponList(status); |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
jumpOff() { |
|
||||
wx.navigateTo({ |
|
||||
url: '/pages/coupon/over/over' |
|
||||
}); |
|
||||
}, |
|
||||
|
|
||||
jumpDetailOn(e) { |
|
||||
var id = e.currentTarget.dataset.id; |
|
||||
wx.navigateTo({ |
|
||||
url: '/pages/coupon/onDetail/onDetail?id=' + id + '&is_coupon=' + this.is_coupon |
|
||||
}); |
|
||||
}, |
|
||||
|
|
||||
jumpDetail(e) { |
|
||||
var id = e.currentTarget.dataset.id; |
|
||||
var coupon_id = e.currentTarget.dataset.coupon; |
|
||||
wx.navigateTo({ |
|
||||
url: '/pages/coupon/offDetail/offDetail?id=' + id + '&is_coupon=' + this.is_coupon + '&coupon_id=' + coupon_id |
|
||||
}); |
|
||||
}, |
|
||||
|
|
||||
jumpList(e) { |
|
||||
var id = e.currentTarget.dataset.id; |
|
||||
wx.navigateTo({ |
|
||||
url: '/pages/coupon/goods/goods?id=' + id |
|
||||
}); |
|
||||
}, |
|
||||
|
|
||||
convert() { |
|
||||
var code = this.code; |
|
||||
|
|
||||
if (code == '') { |
|
||||
wx.showModal({ |
|
||||
title: '', |
|
||||
content: "请输入兑换码", |
|
||||
showCancel: false |
|
||||
}); |
|
||||
} else { |
|
||||
this.convertCoupon(code); |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
input(e) { |
|
||||
var vlaue = e.detail.value; |
|
||||
this.setData({ |
|
||||
code: vlaue |
|
||||
}); |
|
||||
}, |
|
||||
|
|
||||
viewDetail(e) { |
|
||||
var type = e.currentTarget.dataset.info.discount.type; |
|
||||
var id = e.currentTarget.dataset.info.id; |
|
||||
|
|
||||
if (type == 0) { |
|
||||
wx.navigateTo({ |
|
||||
url: '/pages/coupon/onDetail/onDetail?id=' + id |
|
||||
}); |
|
||||
} else { |
|
||||
wx.navigateTo({ |
|
||||
url: '/pages/coupon/offDetail/offDetail?id=' + id |
|
||||
}); |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
// 查询优惠券列表 |
|
||||
queryCouponList(type = 0, page = 1) { |
|
||||
wx.showLoading({ |
|
||||
title: "加载中", |
|
||||
mask: true |
|
||||
}); |
|
||||
var token = this.$cookieStorage.get('user_token') || ''; |
|
||||
this.$http.get({ |
|
||||
api: 'api/coupon', |
|
||||
header: { |
|
||||
Authorization: token |
|
||||
}, |
|
||||
data: { |
|
||||
page, |
|
||||
channel: type ? 'shop' : 'ec', |
|
||||
is_active: 1 |
|
||||
} |
|
||||
}).then(res => { |
|
||||
if (res.statusCode == 200) { |
|
||||
res = res.data; |
|
||||
|
|
||||
if (res.status) { |
|
||||
var pages = res.meta.pagination; |
|
||||
var current_page = pages.current_page; |
|
||||
var total_pages = pages.total_pages; |
|
||||
|
|
||||
|
|
||||
// var tabList = `tabList[${type}]`; |
|
||||
// this.setData({ |
|
||||
// [`dataList.${type}[${page - 1}]`]: res.data, |
|
||||
// [`${tabList}.init`]: true, |
|
||||
// [`${tabList}.page`]: current_page, |
|
||||
// [`${tabList}.more`]: current_page < total_pages |
|
||||
// }); |
|
||||
|
|
||||
this.dataList[type][page - 1] = res.data; |
|
||||
this.tabList[type].init = true; |
|
||||
this.tabList[type].page = current_page; |
|
||||
this.tabList[type].more = current_page < total_pages; |
|
||||
|
|
||||
|
|
||||
} else { |
|
||||
wx.showModal({ |
|
||||
content: res.message || '请求失败', |
|
||||
showCancel: false |
|
||||
}); |
|
||||
} |
|
||||
} else { |
|
||||
wx.showModal({ |
|
||||
content: res.message || '请求失败', |
|
||||
showCancel: false |
|
||||
}); |
|
||||
} |
|
||||
|
|
||||
wx.hideLoading(); |
|
||||
}).catch(rej => { |
|
||||
wx.hideLoading(); |
|
||||
wx.showModal({ |
|
||||
content: res.message || '请求失败', |
|
||||
showCancel: false |
|
||||
}); |
|
||||
}); |
|
||||
}, |
|
||||
|
|
||||
toast() { |
|
||||
wx.navigateTo({ |
|
||||
url: '/pages/coupon/over/over' |
|
||||
}); |
|
||||
}, |
|
||||
|
|
||||
setData: function (obj) { |
|
||||
let that = this; |
|
||||
let keys = []; |
|
||||
let val, data; |
|
||||
Object.keys(obj).forEach(function (key) { |
|
||||
keys = key.split('.'); |
|
||||
val = obj[key]; |
|
||||
data = that.$data; |
|
||||
keys.forEach(function (key2, index) { |
|
||||
if (index + 1 == keys.length) { |
|
||||
that.$set(data, key2, val); |
|
||||
} else { |
|
||||
if (!data[key2]) { |
|
||||
that.$set(data, key2, {}); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
data = data[key2]; |
|
||||
}); |
|
||||
}); |
|
||||
} |
|
||||
}, |
|
||||
computed: {}, |
|
||||
watch: {} |
|
||||
}; |
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
current: 0, |
||||
|
tab_list: [ |
||||
|
{name: '全部'}, |
||||
|
{name: '待使用'}, |
||||
|
{name: '已使用'}, |
||||
|
{name: '已过期'} |
||||
|
] |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
tabChange(index){ |
||||
|
this.current = index; |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
</script> |
</script> |
||||
<style rel="stylesheet/less" lang="less"> |
|
||||
@import "index"; |
|
||||
|
|
||||
|
<style scoped lang="scss"> |
||||
|
.coupon-circle1 { |
||||
|
width: 40rpx; |
||||
|
height: 40rpx; |
||||
|
background-color: white; |
||||
|
border-radius: 50%; |
||||
|
} |
||||
|
.coupon-circle-top { |
||||
|
width: 50rpx; |
||||
|
height: 50rpx; |
||||
|
border-radius: 50%; |
||||
|
// background-color: red; |
||||
|
position: absolute; |
||||
|
border: 1px dashed #ccc; |
||||
|
left: 190rpx; |
||||
|
top: -20rpx; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
text-align: center; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
.coupon-circle-bottom { |
||||
|
width: 50rpx; |
||||
|
height: 50rpx; |
||||
|
border-radius: 50%; |
||||
|
// background-color: red; |
||||
|
position: absolute; |
||||
|
border: 1px dashed #ccc; |
||||
|
left: 190rpx; |
||||
|
bottom: -20rpx; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
text-align: center; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
.coupon-right { |
||||
|
text-align: left; |
||||
|
justify-content: center; |
||||
|
align-items: flex-start; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
margin-left: 84rpx; |
||||
|
} |
||||
|
.coupon-left { |
||||
|
margin-left: 40rpx; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
} |
||||
|
.coupon-tag { |
||||
|
width: max-content; |
||||
|
margin-top: 10rpx; |
||||
|
padding: 0 24rpx; |
||||
|
height: 43rpx; |
||||
|
border-radius: 22rpx; |
||||
|
border: 2rpx solid #FFFFFF; |
||||
|
font-size: 24rpx; |
||||
|
color: white; |
||||
|
} |
||||
|
.coupon-wrap { |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
margin-top: 30rpx; |
||||
|
flex-direction: column; |
||||
|
align-content: center; |
||||
|
align-items: center; |
||||
|
} |
||||
|
.coupon-card { |
||||
|
overflow: hidden; |
||||
|
position: relative; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
width: 674rpx; |
||||
|
// display: flex; |
||||
|
height: 171rpx; |
||||
|
// opacity: 0.59; |
||||
|
// border: 1rpx solid #FFFFFF; |
||||
|
background: #15716E; |
||||
|
border-radius: 20rpx; |
||||
|
} |
||||
|
.coupon-radius { |
||||
|
width: 664rpx; |
||||
|
display: flex; |
||||
|
height: 161rpx; |
||||
|
border: 1rpx dashed #ccc; |
||||
|
// background: #15716E; |
||||
|
border-radius: 20rpx; |
||||
|
} |
||||
|
/deep/.u-scroll-box { |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
border-bottom: 1rpx solid rgba(0, 0, 0, 0.1); |
||||
|
} |
||||
|
/deep/.special_tab .u-tabs .u-scroll-box .u-tab-bar { |
||||
|
background-color: #15716E!important; |
||||
|
width: 80rpx!important; |
||||
|
position: absolute; |
||||
|
height: 10rpx; |
||||
|
left: 0; |
||||
|
border-radius: 8rpx 8rpx 0px 0px!important; |
||||
|
bottom: -12rpx; |
||||
|
} |
||||
|
/deep/ .u-tab-item { |
||||
|
font-size: 28rpx!important; |
||||
|
} |
||||
</style> |
</style> |
||||
@ -0,0 +1,445 @@ |
|||||
|
<template> |
||||
|
<view id="coupon-index"> |
||||
|
|
||||
|
<view class="navbar mx-1px-top"> |
||||
|
<block v-for="(item, index) in tabList" :key="index"> |
||||
|
<view :id="index" class="navbar-item activity" :hidden="activeIndex != index" |
||||
|
:style="'color: ' + config.mainColor" @tap="tabClick"> |
||||
|
<view class="navbar-title">{{item.title}}</view> |
||||
|
</view> |
||||
|
|
||||
|
<view :id="index" :hidden="activeIndex == index" class="navbar-item" @tap="tabClick"> |
||||
|
<view class="navbar-title">{{item.title}}</view> |
||||
|
</view> |
||||
|
</block> |
||||
|
|
||||
|
<view class="navbar-slider" |
||||
|
:style="'width: ' + width + 'px; transform: translateX(' + sliderOffset + 'px); -webkit-transform: translateX(' + sliderOffset + 'px); background: ' + config.mainColor"></view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="tab-panel"> |
||||
|
<view class="tab-content" :hidden="activeIndex != 0"> |
||||
|
|
||||
|
<view class="no-list" v-if="(!dataList[0].length || !dataList[0][0].length) && tabList[0].init"> |
||||
|
<i class="iconfont icon-youhuiquan"></i> |
||||
|
<view>报告主人，您暂无 |
||||
|
<span v-if="is_coupon == 1">优惠券~</span> |
||||
|
<span v-else>促销活动</span> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view v-for="(items, idx) in dataList[0]" :key="idx"> |
||||
|
<view class="coupon" :data-id="item.discount.id" @tap="jumpDetailOn" |
||||
|
v-for="(item, index) in dataList[0][idx]" :key="index"> |
||||
|
<view class="coupon-left" :class="is_coupon != 1 ? 'discount' : ''" |
||||
|
:style="'background: ' + config.mainColor"> |
||||
|
<view class="text-wrap"> |
||||
|
<view class="text-box"> |
||||
|
<view class="text"> |
||||
|
<text class="money" v-if="item.discount.action_type.type == 'cash'">￥</text> |
||||
|
<span>{{ item.discount.action_type.value }}</span> |
||||
|
|
||||
|
<text class="money" v-if="item.discount.action_type.type == 'discount'">折</text> |
||||
|
</view> |
||||
|
<text class="label text">{{ item.discount.label }}</text> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-wrap"> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="coupon-right"> |
||||
|
<view class="top"> |
||||
|
<span class="type"> |
||||
|
<span v-if="item.discount.channel == 'ec'">商城</span> |
||||
|
<span v-else>门店</span> |
||||
|
</span> |
||||
|
<text class="info">{{item.discount.title}}</text> |
||||
|
</view> |
||||
|
|
||||
|
<view class="bottom"> |
||||
|
<view class="bottom-use"> |
||||
|
<view class="tiem-box"> |
||||
|
<text>{{item.discount.use_start_time}}至{{item.discount.use_end_time}}</text> |
||||
|
</view> |
||||
|
<view v-if="is_coupon == 1"> |
||||
|
|
||||
|
<!--<view class="btn use" data-code="item.discount.code" data-index="idx"--> |
||||
|
<!--data-findex="index" v-if="!item.discount.has_get" @tap.stop="getCoupon">--> |
||||
|
<!--点击领取--> |
||||
|
<!--</view>--> |
||||
|
<!----> |
||||
|
<view class="btn already" |
||||
|
:style="'color: ' + config.mainColor + '; border-color: ' + config.mainColor" |
||||
|
:data-id="item.id" @tap.stop="jumpList"> |
||||
|
去使用 |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="tab-content" :hidden="activeIndex != 1"> |
||||
|
<view class="no-list" v-if="(!dataList[1].length || !dataList[1][0].length) && tabList[1].init"> |
||||
|
<i class="iconfont icon-youhuiquan"></i> |
||||
|
<view>报告主人，您暂无 |
||||
|
<span v-if="is_coupon == 1">优惠券~</span> |
||||
|
<span v-else>促销活动</span> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view v-for="(items, idx) in dataList[1]" :key="idx"> |
||||
|
<view class="coupon" :data-id="item.discount.id" :data-coupon="item.id" @tap="jumpDetail" |
||||
|
v-for="(item, index) in dataList[1][idx]" :key="index"> |
||||
|
<view class="coupon-left" :class="is_coupon != 1 ? 'discount' : ''" |
||||
|
:style="'background: ' + config.mainColor"> |
||||
|
<view class="text-wrap"> |
||||
|
<view class="text-box"> |
||||
|
<view class="text"> |
||||
|
<text class="money" v-if="item.discount.action_type.type == 'cash'">￥</text> |
||||
|
<span>{{ item.discount.action_type.value }}</span> |
||||
|
|
||||
|
<text class="money" v-if="item.discount.action_type.type == 'discount'">折</text> |
||||
|
</view> |
||||
|
<text class="label text">{{ item.discount.label }}</text> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-wrap"> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="coupon-right"> |
||||
|
<view class="top"> |
||||
|
<span class="type"> |
||||
|
<span v-if="item.discount.channel == 'ec'">商城</span> |
||||
|
<span v-else>门店</span> |
||||
|
</span> |
||||
|
<text class="info">{{item.discount.title}}</text> |
||||
|
</view> |
||||
|
<view class="bottom"> |
||||
|
<view class="bottom-use"> |
||||
|
<view class="tiem-box"> |
||||
|
<text>{{item.discount.use_start_time}}至{{item.discount.use_end_time}}</text> |
||||
|
</view> |
||||
|
<view v-if="is_coupon == 1"> |
||||
|
<!--<view class="btn use" :data-code="item.discount.code" |
||||
|
:data-index="idx" :data-findex="index" |
||||
|
v-if="!item.discount.has_get" @tap.stop="getCoupon"> |
||||
|
点击领取 |
||||
|
</view>--> |
||||
|
<view class="btn already" |
||||
|
:style="'color: ' + config.mainColor + '; border-color: ' + config.mainColor" |
||||
|
:data-id="item.discount.id" :data-coupon="item.id" @tap.stop="jumpDetail"> |
||||
|
去使用 |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="see-over" @tap="toast"> |
||||
|
查看已失效优惠券 |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
</template> |
||||
|
<script> |
||||
|
import {pageLogin, getUrl, config} from '@/common/js/utils.js'; |
||||
|
|
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
activeIndex: 0, |
||||
|
sliderOffset: 0, |
||||
|
width: 0, |
||||
|
tabList: [{ |
||||
|
title: '线上', |
||||
|
init: false, |
||||
|
page: 0, |
||||
|
more: true |
||||
|
}, { |
||||
|
title: '线下', |
||||
|
init: false, |
||||
|
page: 0, |
||||
|
more: true |
||||
|
}], |
||||
|
dataList: { |
||||
|
0: [], |
||||
|
1: [] |
||||
|
}, |
||||
|
is_coupon: 1, |
||||
|
// 用于判断是否为优惠券 1：优惠券 0：促销折扣 |
||||
|
gbConfig: '', |
||||
|
}; |
||||
|
}, |
||||
|
|
||||
|
onReachBottom(e) { |
||||
|
var status = this.activeIndex; |
||||
|
var page = this.tabList[status].page + 1; |
||||
|
var tabList = `tabList[${status}]`; |
||||
|
|
||||
|
if (this.tabList[status].more) { |
||||
|
this.queryCouponList(status, page); |
||||
|
} else { |
||||
|
wx.showToast({ |
||||
|
image: '../../../static/error.png', |
||||
|
title: '再拉也没有啦' |
||||
|
}); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
onShow(e) { |
||||
|
wx.getSystemInfo({ |
||||
|
success: res => { |
||||
|
this.setData({ |
||||
|
width: res.windowWidth / this.tabList.length, |
||||
|
sliderOffset: res.windowWidth / this.tabList.length * this.activeIndex |
||||
|
}); |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
onLoad(e) { |
||||
|
// 第三方平台配置颜色 |
||||
|
var gbConfig = this.$cookieStorage.get('globalConfig') || ''; |
||||
|
// this.setData({ |
||||
|
// config: gbConfig |
||||
|
// }); |
||||
|
// |
||||
|
this.config = gbConfig; |
||||
|
|
||||
|
if (e.type) { |
||||
|
this.setData({ |
||||
|
activeIndex: e.type |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
; |
||||
|
this.queryCouponList(); |
||||
|
}, |
||||
|
|
||||
|
components: {}, |
||||
|
props: {}, |
||||
|
methods: { |
||||
|
tabClick(e) { |
||||
|
var status = e.currentTarget.id; |
||||
|
this.setData({ |
||||
|
sliderOffset: e.currentTarget.offsetLeft, |
||||
|
activeIndex: status |
||||
|
}); |
||||
|
|
||||
|
if (!this.tabList[status].init) { |
||||
|
this.queryCouponList(status); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
jumpOff() { |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/coupon/over/over' |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
jumpDetailOn(e) { |
||||
|
var id = e.currentTarget.dataset.id; |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/coupon/onDetail/onDetail?id=' + id + '&is_coupon=' + this.is_coupon |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
jumpDetail(e) { |
||||
|
var id = e.currentTarget.dataset.id; |
||||
|
var coupon_id = e.currentTarget.dataset.coupon; |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/coupon/offDetail/offDetail?id=' + id + '&is_coupon=' + this.is_coupon + '&coupon_id=' + coupon_id |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
jumpList(e) { |
||||
|
var id = e.currentTarget.dataset.id; |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/coupon/goods/goods?id=' + id |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
convert() { |
||||
|
var code = this.code; |
||||
|
|
||||
|
if (code == '') { |
||||
|
wx.showModal({ |
||||
|
title: '', |
||||
|
content: "请输入兑换码", |
||||
|
showCancel: false |
||||
|
}); |
||||
|
} else { |
||||
|
this.convertCoupon(code); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
input(e) { |
||||
|
var vlaue = e.detail.value; |
||||
|
this.setData({ |
||||
|
code: vlaue |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
viewDetail(e) { |
||||
|
var type = e.currentTarget.dataset.info.discount.type; |
||||
|
var id = e.currentTarget.dataset.info.id; |
||||
|
|
||||
|
if (type == 0) { |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/coupon/onDetail/onDetail?id=' + id |
||||
|
}); |
||||
|
} else { |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/coupon/offDetail/offDetail?id=' + id |
||||
|
}); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
// 查询优惠券列表 |
||||
|
queryCouponList(type = 0, page = 1) { |
||||
|
wx.showLoading({ |
||||
|
title: "加载中", |
||||
|
mask: true |
||||
|
}); |
||||
|
var token = this.$cookieStorage.get('user_token') || ''; |
||||
|
this.$http.get({ |
||||
|
api: 'api/coupon', |
||||
|
header: { |
||||
|
Authorization: token |
||||
|
}, |
||||
|
data: { |
||||
|
page, |
||||
|
channel: type ? 'shop' : 'ec', |
||||
|
is_active: 1 |
||||
|
} |
||||
|
}).then(res => { |
||||
|
if (res.statusCode == 200) { |
||||
|
res = res.data; |
||||
|
|
||||
|
if (res.status) { |
||||
|
var pages = res.meta.pagination; |
||||
|
var current_page = pages.current_page; |
||||
|
var total_pages = pages.total_pages; |
||||
|
|
||||
|
|
||||
|
// var tabList = `tabList[${type}]`; |
||||
|
// this.setData({ |
||||
|
// [`dataList.${type}[${page - 1}]`]: res.data, |
||||
|
// [`${tabList}.init`]: true, |
||||
|
// [`${tabList}.page`]: current_page, |
||||
|
// [`${tabList}.more`]: current_page < total_pages |
||||
|
// }); |
||||
|
|
||||
|
this.dataList[type][page - 1] = res.data; |
||||
|
this.tabList[type].init = true; |
||||
|
this.tabList[type].page = current_page; |
||||
|
this.tabList[type].more = current_page < total_pages; |
||||
|
|
||||
|
|
||||
|
} else { |
||||
|
wx.showModal({ |
||||
|
content: res.message || '请求失败', |
||||
|
showCancel: false |
||||
|
}); |
||||
|
} |
||||
|
} else { |
||||
|
wx.showModal({ |
||||
|
content: res.message || '请求失败', |
||||
|
showCancel: false |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
wx.hideLoading(); |
||||
|
}).catch(rej => { |
||||
|
wx.hideLoading(); |
||||
|
wx.showModal({ |
||||
|
content: res.message || '请求失败', |
||||
|
showCancel: false |
||||
|
}); |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
toast() { |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/coupon/over/over' |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
setData: function (obj) { |
||||
|
let that = this; |
||||
|
let keys = []; |
||||
|
let val, data; |
||||
|
Object.keys(obj).forEach(function (key) { |
||||
|
keys = key.split('.'); |
||||
|
val = obj[key]; |
||||
|
data = that.$data; |
||||
|
keys.forEach(function (key2, index) { |
||||
|
if (index + 1 == keys.length) { |
||||
|
that.$set(data, key2, val); |
||||
|
} else { |
||||
|
if (!data[key2]) { |
||||
|
that.$set(data, key2, {}); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
data = data[key2]; |
||||
|
}); |
||||
|
}); |
||||
|
} |
||||
|
}, |
||||
|
computed: {}, |
||||
|
watch: {} |
||||
|
}; |
||||
|
</script> |
||||
|
<style rel="stylesheet/less" lang="less"> |
||||
|
@import "index"; |
||||
|
</style> |
||||
@ -0,0 +1,574 @@ |
|||||
|
<template> |
||||
|
<view> |
||||
|
<lf-nav :spreadOut="false" :showIcon="true" bgColor="transparent!important"></lf-nav> |
||||
|
<skeleton :loading="skeletonLoading" :row="12" :showAvatar="false" :showTitle="true"> |
||||
|
<block> |
||||
|
<!-- 商品图片轮播 --> |
||||
|
<swiper :current="current" :indicator-dots="2 > 1 ? false : true" :circular="true" class="swiper-box" indicator-active-color="#1998FE"> |
||||
|
<swiper-item v-for="(item, index) in pictures" :key="index"> |
||||
|
<image mode="aspectFill" :src="item" style="width: 100%; height: 100%;" @click="lookImg(index)"></image> |
||||
|
</swiper-item> |
||||
|
</swiper> |
||||
|
<!-- 商品主要信息 --> |
||||
|
<view class="head-info"> |
||||
|
<view class="lf-row-between"> |
||||
|
<lf-price :iftext="false" :price="111"></lf-price> |
||||
|
<text class="lf-iconfont icon-fenxiang lf-font-40" @click="shareGraphic()"></text> |
||||
|
</view> |
||||
|
<view class="lf-row-between lf-font-24 lf-m-t-20 lf-p-b-20"> |
||||
|
<view class="lf-font-bold lf-font-32 lf-color-222">颐莲喷雾 500ml</view> |
||||
|
</view> |
||||
|
<view class="lf-row-between lf-font-24 lf-p-b-30"> |
||||
|
<view class="lf-font-28 lf-color-777">门店自提</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<self-line></self-line> |
||||
|
<view class="bg-white"> |
||||
|
<view class="cu-bar padding-lr"> |
||||
|
<view class="lf-flex"> |
||||
|
<text class="lf-color-777 lf-font-28">优惠</text> |
||||
|
<view v-if="orderDetails.coupon == ''"> |
||||
|
<text class="lf-color-price lf-font-28 lf-m-l-10" v-for="(item,index) of orderDetails.coupon">{{item.tag}}</text> |
||||
|
</view> |
||||
|
<view v-else> |
||||
|
<text class="lf-color-222 lf-font-26 lf-m-l-30">化妆品教师节满1200减200</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view> |
||||
|
<text class="lf-font-24 lf-color-777 lf-iconfont icon-xiangyou"></text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<self-line></self-line> |
||||
|
<view class="bg-white"> |
||||
|
<view class="cu-bar padding-lr"> |
||||
|
<view class="lf-flex"> |
||||
|
<text class="lf-color-777 lf-font-28">服务</text> |
||||
|
<view style="width: 600rpx;flex-wrap: wrap;display: flex;margin-top: 32rpx;"> |
||||
|
<view class="lf-m-l-30" v-for="i of 5"> |
||||
|
<text class="lf-iconfont icon-xuanzhong lf-font-30" style="color: #15716E;"></text> |
||||
|
<text class="lf-m-l-10 lf-font-26 lf-color-black">正品保障</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view> |
||||
|
<text class="lf-font-24 lf-color-777 lf-iconfont icon-xiangyou"></text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="bg-white"> |
||||
|
<view class="cu-bar padding-lr"> |
||||
|
<view class="lf-flex"> |
||||
|
<text class="lf-color-777 lf-font-28">已选</text> |
||||
|
<text class="lf-color-222 lf-font-26 lf-m-l-30">已选500ml x1</text> |
||||
|
</view> |
||||
|
<view> |
||||
|
<text class="lf-font-24 lf-color-777 lf-iconfont icon-xiangyou"></text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<self-line></self-line> |
||||
|
<view> |
||||
|
<view class="user-top"> |
||||
|
<view class="lf-row-between lf-w-100"> |
||||
|
<view class="lf-flex"> |
||||
|
<view class="tag-father"> |
||||
|
<image src="https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png" mode="aspectFill" class="head-img"></image> |
||||
|
</view> |
||||
|
<view class="lf-flex-column lf-m-l-20"> |
||||
|
<text class="lf-font-28 lf-color-black lf-font-bold">颐莲官方店</text> |
||||
|
<view class="lf-font-24 lf-color-777"><u-icon name="map" class="lf-m-r-10"></u-icon>L2</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view> |
||||
|
<button class="head-btn"><u-icon name="chat" class="lf-m-r-10"></u-icon>客服</button> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<scroll-view class="scroll-view" :scroll-x="true"> |
||||
|
<view class="scroll-content"> |
||||
|
<view class="goods-item" v-for="(item, index) in 5" :key="index"> |
||||
|
<image class="goods-img"></image> |
||||
|
<view class="goods-info"> |
||||
|
<view class="lf-line-1">猪大肠卖咯 5毛钱一斤咯</view> |
||||
|
<view>￥0.5</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="goods-item"> |
||||
|
<view class="more-box"> |
||||
|
<text>查看更多</text> |
||||
|
<text class="lf-iconfont icon--2 lf-text-vertical"></text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</scroll-view> |
||||
|
</view> |
||||
|
<!-- 商品详情 --> |
||||
|
<view class="goods-detail"> |
||||
|
<view class="lf-font-32 lf-font-bold lf-m-b-20">商品详情</view> |
||||
|
<rich-text :nodes="formatRichText('商品详情商品详情商品详情商品详情商品详情商品详情商品详情商品详情商品详情商品详情商品详情商品详情')"></rich-text> |
||||
|
<!-- <image class="goods-img" :src="item" v-for="(item, index) in goods_detail.content" :key="index" v-if="goods_detail.content_type == 'img'"></image> --> |
||||
|
</view> |
||||
|
<!-- 修饰专用 --> |
||||
|
<view class="extra"></view> |
||||
|
<!-- 吸底操作按钮 --> |
||||
|
<view class="lf-row-between fixed-bottom"> |
||||
|
<view class="lf-flex lf-p-t-10 lf-p-b-10"> |
||||
|
<view class="lf-flex-column lf-row-center icon-item" open-type="contact"> |
||||
|
<text class="lf-iconfont icon-shoucang icon-img"></text> |
||||
|
<view class="lf-m-t-1">客服</view> |
||||
|
</view> |
||||
|
<view class="lf-flex-column lf-row-center icon-item" @click="switchCollect"> |
||||
|
<text class="lf-iconfont icon-shoucang icon-img" v-if="is_collect"></text> |
||||
|
<text class="lf-iconfont icon-shoucang icon-img" v-else></text> |
||||
|
<view class="lf-m-t-1">{{ is_collect ? '已收藏' : '收藏' }}</view> |
||||
|
</view> |
||||
|
<button class="lf-flex-column lf-row-center icon-item"> |
||||
|
<text class="lf-iconfont icon-shoucang icon-img"></text> |
||||
|
<view class="lf-m-t-1">购物车</view> |
||||
|
</button> |
||||
|
</view> |
||||
|
<view class="lf-flex"> |
||||
|
<button class="btn1" @click="toAddOrder">加入购物车</button> |
||||
|
<button class="btn lf-m-l-15" @click="toAddOrder">立即购买</button> |
||||
|
</view> |
||||
|
</view> |
||||
|
<!-- 回到顶部 --> |
||||
|
<!-- <u-back-top :scroll-top="pageScrollTop" :custom-style="{background: 'rgba(51, 51 51, 0.3)'}" :icon-style="{color: '#ffffff'}"></u-back-top> --> |
||||
|
<u-back-top :scroll-top="pageScrollTop" :custom-style="{background: 'rgba(51, 51 51, 0.3)'}"></u-back-top> |
||||
|
</block> |
||||
|
</skeleton> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data(){ |
||||
|
return { |
||||
|
current: 0, // 轮播下标 |
||||
|
goods_id: 0, |
||||
|
goods_detail: {}, |
||||
|
is_collect: false, // 1为当前收藏商品了，0为否 |
||||
|
skeletonLoading: false, |
||||
|
pictures: [ |
||||
|
'https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png', |
||||
|
'https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png', |
||||
|
'https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png' |
||||
|
] |
||||
|
} |
||||
|
}, |
||||
|
onLoad(options){ |
||||
|
this.goods_id = options.goods_id; |
||||
|
|
||||
|
console.log('商品',this.goods_id) |
||||
|
// this.getGoodsDetail(); |
||||
|
}, |
||||
|
computed: { |
||||
|
isRight() { |
||||
|
return function(val) { |
||||
|
return this.$shared.isRight(val); |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
shareGraphic(){ |
||||
|
this.getCreateShareImg(); |
||||
|
}, |
||||
|
//请求h5的图片接口 |
||||
|
getCreateShareImg(){ |
||||
|
wx.showLoading({ |
||||
|
title:"生成中", |
||||
|
mask:true |
||||
|
}) |
||||
|
let origin = window.location.origin; |
||||
|
let share_url = origin+'/pages/store/detail/detail'; |
||||
|
this.$http.get({ |
||||
|
api:'api/distribution/createH5ShareImg', |
||||
|
data:{ |
||||
|
goods_id:this.id, |
||||
|
share_url:share_url |
||||
|
} |
||||
|
}).then(res=>{ |
||||
|
res = res.data; |
||||
|
if(res.status){ |
||||
|
this.qr_code_image = res.data.image; |
||||
|
|
||||
|
if(this.qr_code_image){ |
||||
|
this.share_gaphic =!this.share_gaphic; |
||||
|
this.is_toggle_share = false; |
||||
|
} |
||||
|
} else{ |
||||
|
wx.showModal({ |
||||
|
content: res.message || '请求失败，请重试', |
||||
|
showCancel: false |
||||
|
}); |
||||
|
} |
||||
|
wx.hideLoading() |
||||
|
}).catch(rej=>{ |
||||
|
wx.hideLoading() |
||||
|
wx.showModal({ |
||||
|
content: rej.message || '内部错误，请重试', |
||||
|
showCancel: false |
||||
|
}); |
||||
|
}) |
||||
|
|
||||
|
}, |
||||
|
getGoodsDetail(){ |
||||
|
this.$http(this.API.API_ADVICEDETAILS, {id: this.goods_id}).then(res => { |
||||
|
this.skeletonLoading = false; |
||||
|
this.goods_detail = res.data; |
||||
|
this.is_collect = Boolean(res.data.is_collect) || false; |
||||
|
}).catch(err => { |
||||
|
this.skeletonLoading = false; |
||||
|
setTimeout(() => { |
||||
|
this.$toBack(); |
||||
|
}, 1000); |
||||
|
}) |
||||
|
}, |
||||
|
// 切换商品收藏 |
||||
|
switchCollect(){ |
||||
|
let userInfo = uni.getStorageSync('userinfo') || {}; |
||||
|
if(!userInfo.id || !userInfo.nickname || !userInfo.avatar){ |
||||
|
this.$url('/pages/login/index?type=userinfo'); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
if(this.is_collect) { |
||||
|
this.$http(this.API.API_DELCOLLECT, {agent_product_id:this.goods_id}).then(res => { |
||||
|
this.$msg('取消收藏成功!') |
||||
|
this.is_collect = false |
||||
|
console.log(res) |
||||
|
}) |
||||
|
}else { |
||||
|
this.$http(this.API.API_ADDCOLLECT, {agent_product_id:this.goods_id}).then(res => { |
||||
|
this.$msg('添加收藏成功!') |
||||
|
this.is_collect = true |
||||
|
console.log(res) |
||||
|
}) |
||||
|
} |
||||
|
}, |
||||
|
// 拨打电话 |
||||
|
makePhoneCall(phoneStr){ |
||||
|
uni.makePhoneCall({ |
||||
|
phoneNumber: String(phoneStr) |
||||
|
}) |
||||
|
}, |
||||
|
// 打开地图 |
||||
|
openMap(){ |
||||
|
let { address, lat, lng } = this.goods_detail?.store || {}; |
||||
|
uni.openLocation({ |
||||
|
longitude: Number(lat), |
||||
|
latitude: Number(lng), |
||||
|
scale: 20, |
||||
|
name: address |
||||
|
}); |
||||
|
}, |
||||
|
// 跳转到确认下单页面 |
||||
|
toAddOrder(){ |
||||
|
let goods_id = this.goods_detail.id; |
||||
|
this.$url('/pages/order/confirm_order?goods_id='+ goods_id); |
||||
|
}, |
||||
|
// 预览图片 |
||||
|
lookImg(index){ |
||||
|
this.$u.throttle(() => { |
||||
|
let goods_banner = this.goods_detail.banners || []; |
||||
|
let banners = goods_banner.map(item => item.cover); |
||||
|
uni.previewImage({ |
||||
|
urls: banners, |
||||
|
current: index |
||||
|
}) |
||||
|
}, 200); |
||||
|
}, |
||||
|
// 富文本处理 |
||||
|
formatRichText(richText){ |
||||
|
if(richText != null){ |
||||
|
let newRichText= richText.replace(/<img[^>]*>/gi, function(match, capture){ |
||||
|
match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, ''); |
||||
|
match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, ''); |
||||
|
match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, ''); |
||||
|
return match; |
||||
|
}); |
||||
|
newRichText = newRichText.replace(/style="[^"]+"/gi,function(match, capture){ |
||||
|
match = match.replace(/width:[^;]+;/gi, 'width:100%;').replace(/width:[^;]+;/gi, 'width:100%;'); |
||||
|
return match; |
||||
|
}); |
||||
|
newRichText = newRichText.replace(/<br[^>]*\/>/gi, ''); |
||||
|
newRichText = newRichText.replace(/\<img/gi, '<img style="width:100%;height:auto;display:block;margin:10px 0;"'); |
||||
|
return newRichText; |
||||
|
}else{ |
||||
|
return null; |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
onShareAppMessage(){ |
||||
|
let goods = this.goods_detail; |
||||
|
let title = goods.name; |
||||
|
let imageUrl = goods.share_cover || goods.cover; |
||||
|
let path = '/pages/route/index?route=goods_detail&id='+ goods.id; |
||||
|
|
||||
|
return { |
||||
|
title, |
||||
|
path, |
||||
|
imageUrl |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
page{ |
||||
|
background-color: #f5f5f5; |
||||
|
overflow-x: hidden; |
||||
|
} |
||||
|
</style> |
||||
|
<style lang="scss" scoped="scoped"> |
||||
|
//商品上去scrollview部分 |
||||
|
.scroll-view{ |
||||
|
height: 310rpx; |
||||
|
width: 100%; |
||||
|
// margin-top: 20rpx; |
||||
|
padding: 0 30rpx 30rpx 30rpx; |
||||
|
background-color: white; |
||||
|
.scroll-content{ |
||||
|
display: flex; |
||||
|
width: 100%; |
||||
|
.goods-item{ |
||||
|
margin-right: 15rpx; |
||||
|
width: 180rpx; |
||||
|
} |
||||
|
.goods-img{ |
||||
|
width: 180rpx; |
||||
|
height: 180rpx; |
||||
|
background-color: #EEEEEE; |
||||
|
} |
||||
|
.goods-info{ |
||||
|
text-align: center; |
||||
|
color: #222222; |
||||
|
&>view:nth-child(1n){ |
||||
|
font-size: 24rpx; |
||||
|
} |
||||
|
&>view:nth-child(2n){ |
||||
|
font-size: 28rpx; |
||||
|
font-weight: bold; |
||||
|
text-align: left; |
||||
|
color: #F63434; |
||||
|
} |
||||
|
} |
||||
|
.more-box{ |
||||
|
width: 180rpx; |
||||
|
height: 180rpx; |
||||
|
background-color: #EEEEEE; |
||||
|
text-align: center; |
||||
|
line-height: 180rpx; |
||||
|
font-size: 24rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
//scrollview结束 |
||||
|
.tag-father { |
||||
|
position: relative; |
||||
|
} |
||||
|
.head-tag { |
||||
|
color: white; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
text-align: center; |
||||
|
font-size: 24rpx; |
||||
|
width: 36rpx; |
||||
|
height: 36rpx; |
||||
|
border-radius: 50%; |
||||
|
background-color: #15716E; |
||||
|
border: 1rpx solid #FFFFFF; |
||||
|
position: absolute; |
||||
|
left: 76rpx; |
||||
|
top: 86rpx; |
||||
|
z-index: 99; |
||||
|
} |
||||
|
.qzone-img { |
||||
|
width: 220rpx; |
||||
|
height: 220rpx; |
||||
|
border-radius: 10rpx; |
||||
|
margin-right: 12rpx; |
||||
|
&:nth-child(3n) { |
||||
|
margin-right: 0; |
||||
|
} |
||||
|
&:nth-child(n + 4) { |
||||
|
margin-top: 12rpx; |
||||
|
} |
||||
|
} |
||||
|
.user-top { |
||||
|
background-color: #F3F8F8; |
||||
|
padding: 30rpx; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
background-color: white; |
||||
|
} |
||||
|
.head-img { |
||||
|
width: 80rpx; |
||||
|
height: 80rpx; |
||||
|
border-radius: 50%; |
||||
|
} |
||||
|
.head-btn { |
||||
|
display: flex; |
||||
|
width: max-content; |
||||
|
height: 45rpx; |
||||
|
background: white; |
||||
|
border: 2rpx solid #15716E; |
||||
|
align-items: center; |
||||
|
font-size: 22rpx; |
||||
|
color: #15716E; |
||||
|
justify-content: space-between; |
||||
|
border-radius: 35rpx; |
||||
|
padding: 10rpx!important; |
||||
|
} |
||||
|
.swiper-box{ |
||||
|
width: 750rpx; |
||||
|
height: 750rpx; |
||||
|
background-color: #FFFFFF; |
||||
|
} |
||||
|
|
||||
|
.head-info{ |
||||
|
width: 750rpx; |
||||
|
height: auto; |
||||
|
box-sizing: border-box; |
||||
|
padding: 0 32rpx; |
||||
|
padding-top: 20rpx; |
||||
|
background-color: #FFFFFF; |
||||
|
// .price>view:nth-of-type(1){ |
||||
|
// color: #FF0000; |
||||
|
// margin-right: 22rpx; |
||||
|
// font-weight: bold; |
||||
|
// } |
||||
|
.price>view:nth-of-type(1){ |
||||
|
text-decoration: line-through; |
||||
|
color: #777777; |
||||
|
margin-right: 22rpx; |
||||
|
} |
||||
|
.price>view:nth-of-type(2){ |
||||
|
width: max-content; |
||||
|
padding: 0 18rpx; |
||||
|
height: 46rpx; |
||||
|
background-color: #1998FE; |
||||
|
border-radius: 10rpx; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
.label-box{ |
||||
|
min-height: 130rpx; |
||||
|
width: 100%; |
||||
|
border-top: 1rpx solid #E5E5E5; |
||||
|
display: flex; |
||||
|
flex-wrap: wrap; |
||||
|
padding: 30rpx 0 10rpx 0; |
||||
|
.label-item{ |
||||
|
width: max-content; |
||||
|
padding: 20rpx; |
||||
|
height: 70rpx; |
||||
|
border-radius: 10rpx; |
||||
|
border: 2rpx solid #1998FE; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
font-size: 28rpx; |
||||
|
color: #1998FE; |
||||
|
margin-right: 20rpx; |
||||
|
margin-bottom: 20rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.address-box{ |
||||
|
width: 750rpx; |
||||
|
height: auto; |
||||
|
box-sizing: border-box; |
||||
|
background-color: #FFFFFF; |
||||
|
padding: 32rpx; |
||||
|
margin-top: 20rpx; |
||||
|
.shop-img{ |
||||
|
width: 60rpx; |
||||
|
height: 60rpx; |
||||
|
border-radius: 50%; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.goods-detail{ |
||||
|
width: 750rpx; |
||||
|
height: auto; |
||||
|
background-color: #FFFFFF; |
||||
|
padding: 32rpx; |
||||
|
box-sizing: border-box; |
||||
|
margin-top: 20rpx; |
||||
|
.goods-img{ |
||||
|
width: 100%; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.extra{ |
||||
|
width: 100%; |
||||
|
height: 110rpx; |
||||
|
padding-bottom: constant(safe-area-inset-bottom); |
||||
|
padding-bottom: env(safe-area-inset-bottom); |
||||
|
box-sizing: content-box; |
||||
|
} |
||||
|
|
||||
|
.fixed-bottom{ |
||||
|
position: fixed; |
||||
|
bottom: 0; |
||||
|
left: 0; |
||||
|
background-color: #FFFFFF; |
||||
|
width: 100%; |
||||
|
height: auto; |
||||
|
padding: 0 32rpx; |
||||
|
border-top: 1rpx solid #e5e5e5; |
||||
|
padding-bottom: constant(safe-area-inset-bottom); |
||||
|
padding-bottom: env(safe-area-inset-bottom); |
||||
|
.icon-item{ |
||||
|
text-align: center; |
||||
|
margin-right: 16rpx; |
||||
|
background-color: transparent; |
||||
|
margin: 0; |
||||
|
line-height: initial; |
||||
|
font-size: 28rpx; |
||||
|
font-weight: inherit; |
||||
|
margin-right: 10rpx; |
||||
|
padding: 0; |
||||
|
width: 88rpx; |
||||
|
position: relative; |
||||
|
&:first-child{ |
||||
|
padding-left: 0; |
||||
|
} |
||||
|
.icon-img{ |
||||
|
height: 50rpx; |
||||
|
width: 50rpx; |
||||
|
} |
||||
|
} |
||||
|
.btn1{ |
||||
|
margin: 0; |
||||
|
width: max-content; |
||||
|
height: 80rpx; |
||||
|
background-color: rgba(21, 113, 110, 0.1); |
||||
|
color: #15716E; |
||||
|
line-height: 80rpx; |
||||
|
font-size: 32rpx; |
||||
|
padding: 0 20rpx; |
||||
|
border-radius: 42rpx; |
||||
|
font-size: 26rpx; |
||||
|
border: 2rpx solid #15716E; |
||||
|
} |
||||
|
.btn{ |
||||
|
margin: 0; |
||||
|
padding: 0 20rpx; |
||||
|
width: max-content; |
||||
|
height: 80rpx; |
||||
|
background-color: #15716E; |
||||
|
color: #FFFFFF; |
||||
|
line-height: 80rpx; |
||||
|
font-size: 26rpx; |
||||
|
border-radius: 42rpx; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
1072
pages/store/cart/cart.vue
File diff suppressed because it is too large
View File
File diff suppressed because it is too large
View File
@ -0,0 +1,956 @@ |
|||||
|
<template> |
||||
|
<view id="store-cart"> |
||||
|
<lf-nav title="购物车"></lf-nav> |
||||
|
<view class="discount-box"> |
||||
|
<!--登录状态--> |
||||
|
<view class="is-login" v-if="(is_login && discounts.length) || (is_login && coupons.length)"> |
||||
|
<view class="promotion-box"> |
||||
|
<view class="promotion" @tap="changeDiscounts" v-if="discounts.length"> |
||||
|
<view class="title" :style="'color: ' + config.mainColor + '; border-color: ' + config.mainColor"> |
||||
|
{{discounts[0].tags}} |
||||
|
</view> |
||||
|
<view> |
||||
|
{{discounts[0].label}} > |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="coupon mx-1px-left" :style="'color: ' + config.mainColor + ';'" @tap="changeCoupons" v-if="coupons.length"> |
||||
|
优惠券 |
||||
|
</view> |
||||
|
</view> |
||||
|
<!--未登录状态--> |
||||
|
<div class="no-login" v-if="!is_login" @tap="goLogin"> |
||||
|
<div class="left"> |
||||
|
<i class="iconfont icon-warning"></i> |
||||
|
<div> |
||||
|
<span>登录</span>后查看是否享受优惠 |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="right"> |
||||
|
登录 > |
||||
|
</div> |
||||
|
</div> |
||||
|
</view> |
||||
|
<view class="no-goods" v-if="list && list.length == 0"> |
||||
|
<image mode="widthFix" src="https://cdn.guojiang.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20200323164958.png"></image> |
||||
|
</view> |
||||
|
<view class="goods-box" v-if="list && list.length"> |
||||
|
<checkbox-group @change="changeCheck"> |
||||
|
<view class="goods-item mx-1px-bottom" v-for="(item, index) in list" :key="index"> |
||||
|
<view class="input"> |
||||
|
<label class="checkbox"> |
||||
|
<!-- #ifdef APP-PLUS --> |
||||
|
<checkbox :value="String(index)" color="red" :checked="item.checked"></checkbox> |
||||
|
<!-- #endif --> |
||||
|
<!-- #ifdef MP-WEIXIN --> |
||||
|
<checkbox :value="String(index)" color="#FFFFFF" :checked="item.checked"></checkbox> |
||||
|
<!-- #endif --> |
||||
|
<!-- #ifdef H5 --> |
||||
|
<checkbox :value="String(index)" color="red" :checked="item.checked"></checkbox> |
||||
|
<!-- #endif --> |
||||
|
{{item.value!=undefined?item.value:''}} |
||||
|
</label> |
||||
|
</view> |
||||
|
<view class="img-box" :data-id="item.com_id" @tap.stop="jump"> |
||||
|
<image :src="item.img"></image> |
||||
|
</view> |
||||
|
<view class="item-info"> |
||||
|
<view class="name" :data-id="item.com_id" @tap.stop="jump"> |
||||
|
{{item.name}} |
||||
|
</view> |
||||
|
<view class="money-box" :data-id="item.com_id" @tap.stop="jump"> |
||||
|
<view class="model"> |
||||
|
{{item.color}} <span v-if="item.color && item.size">,</span> {{item.size}} |
||||
|
</view> |
||||
|
<view class="money"> |
||||
|
￥{{item.total}} |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="mun-box"> |
||||
|
<view class="change-num"> |
||||
|
<view class="ul-list-content"> |
||||
|
<view class="item" :data-index="index" data-change="0" @tap="changeCount">-</view> |
||||
|
<view class="item"><input type="number" :value="item.qty" :data-index="index" @change="modifyCount" /></view> |
||||
|
<view class="item" :data-index="index" data-change="1" @tap="changeCount">+</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="remove" @tap="removeFromCart" :data-index="index"> |
||||
|
移除 |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
</checkbox-group> |
||||
|
</view> |
||||
|
<view class="buy-box"> |
||||
|
<label class="checkbox"> |
||||
|
<!-- #ifdef APP-PLUS --> |
||||
|
<checkbox value="all" color="red" :checked="allCheck" @tap="selectAll"></checkbox> |
||||
|
<!-- #endif --> |
||||
|
<!-- #ifdef MP-WEIXIN --> |
||||
|
<checkbox value="all" color="#FFFFFF" :checked="allCheck" @tap="selectAll"></checkbox> |
||||
|
<!-- #endif --> |
||||
|
<!-- #ifdef H5 --> |
||||
|
<checkbox value="all" color="red" :checked="allCheck" @tap="selectAll"></checkbox> |
||||
|
<!-- #endif --> |
||||
|
<text>全选</text> |
||||
|
</label> |
||||
|
<view class="money-box"> |
||||
|
商品总计：<text>￥{{select_products.total!=undefined?select_products.total:''}}</text> |
||||
|
</view> |
||||
|
<button class="num-box" :style="'background: ' + config.mainColor" @tap="order" :loading="loading"> |
||||
|
结算<text>{{'('+ select_products.count + ')' || 0}}</text> |
||||
|
</button> |
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<!--选择优惠券部分--> |
||||
|
<view class="maks" :class="show_coupons ? 'cur' : ''" @tap="showCoupons"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="select-coupon-box" :class="show_coupons ? 'cur' : ''"> |
||||
|
<view class="select-coupon"> |
||||
|
<view class="select-coupon-top"> |
||||
|
<view class="title"> |
||||
|
领取优惠券 |
||||
|
|
||||
|
<view class="close" @tap="showCoupons"> |
||||
|
X |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="select-coupon-bottom"> |
||||
|
<view class="title"> |
||||
|
可领优惠券 |
||||
|
</view> |
||||
|
<view class="coupon-box"> |
||||
|
<view class="coupon-item" v-for="(item, index) in coupons" :key="index" v-if="item.is_open"> |
||||
|
<view class="coupon"> |
||||
|
<view class="coupon-left"> |
||||
|
<view class="text-wrap"> |
||||
|
<view class="text-box"> |
||||
|
<view class="text"> |
||||
|
<span class="money" v-if="item.action_type.type == 'cash'">￥</span> |
||||
|
<span class="num">{{ item.action_type.value }}</span> |
||||
|
|
||||
|
|
||||
|
<span class="money" v-if="item.action_type.type == 'discount'">折</span> |
||||
|
</view> |
||||
|
<span class="label text">{{ item.label }}</span> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-wrap"> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
<view class="dot-item"> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="coupon-right"> |
||||
|
<view class="top"> |
||||
|
<span> |
||||
|
<span class="type" v-if="item.channel == 'ec'">商店</span> |
||||
|
<span class="type" v-if="item.channel == 'shop'">门店</span> |
||||
|
</span> |
||||
|
<span class="info">{{item.title}}</span> |
||||
|
</view> |
||||
|
<view class="bottom"> |
||||
|
<view class="bottom-use"> |
||||
|
<view class="tiem-box"> |
||||
|
<text>{{item.use_start_time}}至{{item.use_end_time}}</text> |
||||
|
</view> |
||||
|
<view class="btn use" :style="'background: ' + config.mainColor + '; border-color: ' + config.mainColor" :data-code="item.code" :data-index="index" v-if="!coupons[index].receive" @tap="getCoupon"> |
||||
|
点击领取 |
||||
|
|
||||
|
</view> |
||||
|
<view class="btn already" v-else> |
||||
|
已领取 |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
<!--查看促销部分--> |
||||
|
|
||||
|
<view class="maks" :class="show_discounts ? 'cur' : ''" @tap="showDiscounts"> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
<view class="see-discounts-box" :class="show_discounts ? 'cur' : ''"> |
||||
|
<view class="select-discounts"> |
||||
|
<view class="select-discounts-top"> |
||||
|
<view class="title"> |
||||
|
促销 |
||||
|
<view class="close" @tap="showDiscounts"> |
||||
|
X |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="select-discounts-bottom"> |
||||
|
<view class="discounts-box"> |
||||
|
<view class="disconts-item mx-1px-bottom" v-for="(item, index) in discounts" :key="index"> |
||||
|
<view class="discounts-tags-title" :style="'color: ' + config.mainColor + '; border-color: ' + config.mainColor"> |
||||
|
{{item.tags}} |
||||
|
</view> |
||||
|
<view class="tags-item"> |
||||
|
{{item.label}} |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
</view> |
||||
|
<lf-tabbar></lf-tabbar> |
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
</template> |
||||
|
<script> |
||||
|
import {pageLogin, getUrl,config} from '@/common/js/utils.js'; |
||||
|
import lfNav from '@/components/lf-nav/lf-nav.vue'; |
||||
|
import lfTabbar from '@/components/lf-tabbar/lf-tabbar.vue'; |
||||
|
|
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
is_login: '', |
||||
|
list: [], |
||||
|
groupList: [], |
||||
|
select_products: {}, |
||||
|
allCheck: true, |
||||
|
channel: 'normal', |
||||
|
loading: false, |
||||
|
show_coupons: false, |
||||
|
// 领取优惠券 |
||||
|
show_discounts: false, |
||||
|
// 查看促销活动 |
||||
|
goodsList: [], |
||||
|
// 购物车里存在的商品id |
||||
|
config: '', |
||||
|
author: config.PACKAGES.author, |
||||
|
discounts:'', |
||||
|
coupons:'' |
||||
|
}; |
||||
|
}, |
||||
|
|
||||
|
onShow() { |
||||
|
// var oauth = Cache.get(cache_keys.token); |
||||
|
// var locals = Cache.get(cache_keys.cart); |
||||
|
var is_login = this.$cookieStorage.get('user_token'); |
||||
|
this.setData({ |
||||
|
is_login: is_login, |
||||
|
loading: false |
||||
|
}); |
||||
|
var oauth = this.is_login; |
||||
|
|
||||
|
var locals = this.$cookieStorage.get('cart'); |
||||
|
|
||||
|
if (oauth && locals && locals.length) { |
||||
|
// 提交本地购物车 |
||||
|
this.appendToCart(locals); |
||||
|
} else { |
||||
|
this.queryCartList(); |
||||
|
} // let app =getApp(); |
||||
|
// app.isBirthday().then(()=>{ |
||||
|
// if(this.$cookieStorage.get("birthday_gift")){ |
||||
|
// var giftData=this.$cookieStorage.get("birthday_gift").data; |
||||
|
// new app.ToastPannel().__page.showText(giftData); |
||||
|
// } |
||||
|
// }); |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
onLoad() { |
||||
|
// 第三方平台配置颜色 |
||||
|
var bgConfig = this.$cookieStorage.get('globalConfig') || ''; |
||||
|
this.setData({ |
||||
|
config: bgConfig |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
components: { |
||||
|
lfNav, |
||||
|
lfTabbar |
||||
|
}, |
||||
|
props: {}, |
||||
|
methods: { |
||||
|
jump(e) { |
||||
|
var id = e.currentTarget.dataset.id; |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/store/detail/detail?id=' + id |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
select_product() { |
||||
|
var data = { |
||||
|
count: 0, |
||||
|
total: 0, |
||||
|
__ids: [] |
||||
|
}; |
||||
|
this.list.forEach(v => { |
||||
|
if (v.checked) { |
||||
|
data.count += parseInt(v.qty); |
||||
|
data.total += Number(v.total); |
||||
|
|
||||
|
data.__ids.push(v.__raw_id || v.index); |
||||
|
} else { |
||||
|
this.setData({ |
||||
|
allCheck: false |
||||
|
}); |
||||
|
} |
||||
|
}); |
||||
|
this.setData({ |
||||
|
select_products: data |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
addCart(success, message) { |
||||
|
// this.$refs.button.finish(); |
||||
|
|
||||
|
// this.setData({ |
||||
|
// loading: false |
||||
|
// }); |
||||
|
|
||||
|
console.log(success); |
||||
|
|
||||
|
this.loading=false; |
||||
|
|
||||
|
if (success) { |
||||
|
this.$cookieStorage.clear('cart'); // wx.removeStorageSync('cart') |
||||
|
// TODO |
||||
|
//this.$emit('readyCheckout'); |
||||
|
|
||||
|
this.queryCartList(); |
||||
|
} else { |
||||
|
this.$cookieStorage.clear('cart'); // wx.removeStorageSync('cart') |
||||
|
|
||||
|
wx.showModal({ |
||||
|
title: message || '保存本地购物车失败,请重试！' |
||||
|
}); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
order() { |
||||
|
var data = this.select_products; |
||||
|
|
||||
|
if (!data.count) { |
||||
|
// this.$refs.button.finish(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
; |
||||
|
this.setData({ |
||||
|
loading: true |
||||
|
}); |
||||
|
var oauth = this.is_login; |
||||
|
|
||||
|
if (!oauth) { |
||||
|
// 滚去登录 |
||||
|
var url = getUrl(); // this.$router.go({ name: 'user-quick-login', query: { source: this.$route.path } }); |
||||
|
|
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/user/register/register?url=' + url |
||||
|
}); |
||||
|
return; |
||||
|
} // var locals = wx.getStorageSync('cart'); |
||||
|
|
||||
|
|
||||
|
var locals = this.$cookieStorage.get('cart'); |
||||
|
|
||||
|
if (locals && locals.length) { |
||||
|
// 提交本地购物车 |
||||
|
this.appendToCart(locals); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
this.readyCheckout(); |
||||
|
}, |
||||
|
|
||||
|
readyCheckout() { |
||||
|
var ids = this.select_products.__ids; |
||||
|
var type = this.channel; |
||||
|
this.checkoutOrder(ids, type); |
||||
|
}, |
||||
|
|
||||
|
checkoutOrder(ids, type) { |
||||
|
var oauth = this.is_login; |
||||
|
var cart_ids = ids.filter(id => id); |
||||
|
var wechat_group_id = this.$cookieStorage.get('openGId') || ''; |
||||
|
var that = this; |
||||
|
this.$http.post({ |
||||
|
api: `api/shopping/order/checkout`, |
||||
|
data: { |
||||
|
cart_ids, |
||||
|
type, |
||||
|
wechat_group_id |
||||
|
}, |
||||
|
header: { |
||||
|
Authorization: oauth |
||||
|
}, |
||||
|
method: 'POST' |
||||
|
}).then(res => { |
||||
|
res = res.data; |
||||
|
|
||||
|
if (res.status) { |
||||
|
// Cache.set(cache_keys.order, res.data); |
||||
|
// wx.setStorageSync('local_order',res.data) |
||||
|
this.$cookieStorage.set('local_order', res.data); |
||||
|
that.checkout(true); |
||||
|
} else { |
||||
|
that.checkout(false, res.message); |
||||
|
} |
||||
|
}).catch(() => { |
||||
|
that.checkout(false); |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
checkout(success, message) { |
||||
|
// this.$refs.button.finish(); |
||||
|
this.setData({ |
||||
|
loading: false |
||||
|
}); |
||||
|
|
||||
|
if (success) { |
||||
|
// this.$router.go({ name: 'store-order'}); |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/store/order/order' |
||||
|
}); |
||||
|
} else { |
||||
|
// this.$Alert(message || '结算失败，请重试!'); |
||||
|
if (message == 'User unbind mobile') { |
||||
|
wx.showModal({ |
||||
|
content: '请先绑定手机号', |
||||
|
showCancel: false, |
||||
|
success: res => { |
||||
|
if (res.confirm || !res.cancel && !res.confirm) { |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/user/phone/phone?url=' + getUrl() |
||||
|
}); |
||||
|
} |
||||
|
} |
||||
|
}); |
||||
|
} else { |
||||
|
wx.showModal({ |
||||
|
content: message || '结算失败,请重试！', |
||||
|
showCancel: false |
||||
|
}); |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
queryCartList() { |
||||
|
// var data = wx.getStorageSync('cart') || []; |
||||
|
var data = this.$cookieStorage.get('cart') || []; // var oauth = Cache.get(cache_keys.token); |
||||
|
|
||||
|
var oauth = this.is_login; |
||||
|
|
||||
|
if (!oauth) { |
||||
|
this.setData({ |
||||
|
list: data |
||||
|
}); |
||||
|
this.select_product(); |
||||
|
this.groupListF(); |
||||
|
return; |
||||
|
} |
||||
|
|
||||
|
var that = this; |
||||
|
this.$http.get({ |
||||
|
api: `api/shopping/cart`, |
||||
|
header: { |
||||
|
Authorization: oauth |
||||
|
} |
||||
|
}).then(res => { |
||||
|
res = res.data; |
||||
|
var data = []; |
||||
|
|
||||
|
if (res.status && res.data) { |
||||
|
data = Object.keys(res.data).map(key => { |
||||
|
res.data[key].checked = true; |
||||
|
return res.data[key]; |
||||
|
}).concat(data); // 购物车领券 |
||||
|
|
||||
|
if (data.length) { |
||||
|
var list = []; |
||||
|
data.forEach(v => { |
||||
|
if (that.goodsList.indexOf(v.com_id) == -1) { |
||||
|
list.push(v.com_id); |
||||
|
} |
||||
|
|
||||
|
; |
||||
|
}); |
||||
|
this.setData({ |
||||
|
goodsList: list |
||||
|
}); |
||||
|
this.cardDiscount(list); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
that.setData({ |
||||
|
list: data |
||||
|
}); |
||||
|
that.select_product(); |
||||
|
that.groupListF(); |
||||
|
}).catch(rej=> { |
||||
|
this.addCart(false); |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
updated(success, data, item, index) { |
||||
|
if (success) { |
||||
|
item.qty = data.qty; |
||||
|
item.total = data.total; |
||||
|
} else { |
||||
|
// TODO; |
||||
|
item.qty = data.qty; |
||||
|
item.total = item.qty * Number(item.price); |
||||
|
wx.showToast({ |
||||
|
title: '超过最大库存', |
||||
|
image: '../../../static/error.png' |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
var list = this.list; |
||||
|
list[index] = item; |
||||
|
this.setData({ |
||||
|
list: list |
||||
|
}); |
||||
|
this.select_product(); |
||||
|
this.groupListF(); |
||||
|
}, |
||||
|
|
||||
|
change(item, data, index) { |
||||
|
|
||||
|
|
||||
|
if (item.local) { |
||||
|
var locals = uni.getStorageInfo('cart') || []; |
||||
|
locals[item.index].qty = data.qty; |
||||
|
locals[item.index].total = data.total; // Cache.set(cache_keys.cart, locals, 0, null); |
||||
|
// wx.setStorageSync('cart',locals) |
||||
|
|
||||
|
this.$cookieStorage.set('cart', locals); // this.$emit('updated', true, data, item); |
||||
|
|
||||
|
this.updated(true, data, item, index); |
||||
|
} else { |
||||
|
// clearTimeout(this.countTimer); |
||||
|
// |
||||
|
// this.countTimer = setTimeout(() => { |
||||
|
// this.updateToCart(data, item); |
||||
|
// }, 200); |
||||
|
this.updateToCart(data, item, index); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
modifyCount(e) { |
||||
|
var index = e.currentTarget.dataset.index; |
||||
|
var item = this.list[index]; |
||||
|
var val = e.detail.value; |
||||
|
var store_count = item.store_count; |
||||
|
|
||||
|
if (!val) { |
||||
|
val = 1; |
||||
|
} else if (!/^[1-9]\d*$/.test(val)) { |
||||
|
val = val.replace(/[^\d].*$/, ''); |
||||
|
val = parseInt(val) || 1; |
||||
|
} |
||||
|
|
||||
|
if (store_count != undefined) { |
||||
|
if (val > store_count) { |
||||
|
val = store_count; |
||||
|
wx.showToast({ |
||||
|
title: '超过最大库存' |
||||
|
}); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
var data = { |
||||
|
qty: val, |
||||
|
total: val * Number(item.price) |
||||
|
}; |
||||
|
this.change(item, data); |
||||
|
}, |
||||
|
|
||||
|
updateToCart(attr, data, index) { |
||||
|
var oauth = this.is_login; |
||||
|
var that = this; |
||||
|
this.$http.ajax({ |
||||
|
api: `api/shopping/cart/${data.__raw_id}`, |
||||
|
data: { |
||||
|
attributes: { |
||||
|
qty: attr.qty |
||||
|
} |
||||
|
}, |
||||
|
method: 'PUT', |
||||
|
header: { |
||||
|
Authorization: oauth |
||||
|
} |
||||
|
}).then(res => { |
||||
|
res = res.data; |
||||
|
|
||||
|
if (res.status !== false) { |
||||
|
// this.$emit('updated', true, attr, data); |
||||
|
that.updated(true, attr, data, index); |
||||
|
} else { |
||||
|
// this.$emit('updated', false, { qty: res.data.stock_qty }, data); |
||||
|
that.updated(false, { |
||||
|
qty: res.data.stock_qty |
||||
|
}, data, index); |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
changeCount(e) { |
||||
|
|
||||
|
|
||||
|
var index = e.currentTarget.dataset.index, |
||||
|
change = e.currentTarget.dataset.change, |
||||
|
list = this.list, |
||||
|
val = (parseInt(list[index].qty) || 0) + (parseInt(change) ? 1 : -1), |
||||
|
store_count = list[index].store_count; |
||||
|
|
||||
|
if (store_count == undefined) { |
||||
|
if (val > 0 && val <= 99) { |
||||
|
var data = { |
||||
|
qty: val, |
||||
|
total: val * Number(list[index].price) |
||||
|
}; |
||||
|
this.change(list[index], data, index); |
||||
|
} |
||||
|
} else { |
||||
|
if (val > 0 && val <= store_count) { |
||||
|
var data = { |
||||
|
qty: val, |
||||
|
total: val * Number(list[index].price) |
||||
|
}; |
||||
|
this.change(list[index], data, index); |
||||
|
} else { |
||||
|
wx.showToast({ |
||||
|
title: '超过最大库存', |
||||
|
image: '../../../static/error.png' |
||||
|
}); |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
groupListF() { |
||||
|
if (this.list) { |
||||
|
var data = []; |
||||
|
var groups = {}; |
||||
|
this.list.forEach((v, i) => { |
||||
|
let channel = v.channel || 'normal'; |
||||
|
|
||||
|
if (groups[channel] !== undefined) { |
||||
|
data[groups[channel]].items.push(v); |
||||
|
data[groups[channel]].index.push(i); |
||||
|
} else { |
||||
|
groups[channel] = data.length; |
||||
|
data.push({ |
||||
|
channel, |
||||
|
items: [v], |
||||
|
checked: [], |
||||
|
index: [i] |
||||
|
}); |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
this.setData({ |
||||
|
groupList: data |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
appendToCart(data) { |
||||
|
// var oauth = Cache.get(cache_keys.token); |
||||
|
var oauth = this.is_login; |
||||
|
if (!oauth) return; |
||||
|
|
||||
|
if (!Array.isArray(data)) { |
||||
|
data = [data]; |
||||
|
} |
||||
|
|
||||
|
var json = {}; |
||||
|
data.forEach((v, i) => json[i] = v); |
||||
|
data = json; |
||||
|
var that = this; |
||||
|
this.$http.post({ |
||||
|
api: `api/shopping/cart`, |
||||
|
data: data, |
||||
|
header: { |
||||
|
Authorization: oauth |
||||
|
} |
||||
|
}).then(res => { |
||||
|
res = res.data; |
||||
|
|
||||
|
if (res.status) { |
||||
|
that.addCart(true); |
||||
|
} else { |
||||
|
that.addCart(false, res.message); |
||||
|
} |
||||
|
}).catch(rej => { |
||||
|
that.addCart(false); |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
removeFromCart(e) { |
||||
|
var oauth = this.is_login; |
||||
|
var index = e.currentTarget.dataset.index; |
||||
|
var list = this.list; |
||||
|
var data = list[index]; |
||||
|
|
||||
|
if (list[index].local) { |
||||
|
// var locals = wx.getStorageSync('cart') || []; |
||||
|
var locals = this.$cookieStorage.get('cart') || []; |
||||
|
|
||||
|
for (let i = 0; i < locals.length; i++) { |
||||
|
if (locals[i].index === list[index].index) { |
||||
|
locals.splice(i, 1); |
||||
|
break; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
if (locals.length) { |
||||
|
this.$cookieStorage.set('cart', locals); // wx.setStorageSync('cart',locals) |
||||
|
} else { |
||||
|
this.$cookieStorage.clear('cart'); // wx.removeStorageSync('cart') |
||||
|
} |
||||
|
|
||||
|
this.removed(true, index); |
||||
|
} else { |
||||
|
this.$http.ajax({ |
||||
|
api: `api/shopping/cart/${data.__raw_id}`, |
||||
|
header: { |
||||
|
Authorization: oauth |
||||
|
}, |
||||
|
method: 'DELETE' |
||||
|
}).then(res => { |
||||
|
res = res.data; |
||||
|
this.removed(true, index); |
||||
|
}).catch(rej => { |
||||
|
this.removed(false); |
||||
|
}); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
removed(success, index) { |
||||
|
if (success) { |
||||
|
var list = this.list; |
||||
|
var product = list.splice(index, 1)[0]; |
||||
|
this.setData({ |
||||
|
list: list |
||||
|
}); |
||||
|
this.select_product(); |
||||
|
this.groupListF(); |
||||
|
} else { |
||||
|
wx.showToast({ |
||||
|
title: '删除购物车商品失败！', |
||||
|
image: '../../../static/error.png' |
||||
|
}); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
changeCheck(e) { |
||||
|
var ids = e.detail.value; |
||||
|
var list = this.list; |
||||
|
list.forEach(item => { |
||||
|
item.checked = false; |
||||
|
}); |
||||
|
ids.forEach(item => { |
||||
|
list[item].checked = true; |
||||
|
}); |
||||
|
this.setData({ |
||||
|
list: list |
||||
|
}); |
||||
|
this.select_product(); |
||||
|
this.groupListF(); |
||||
|
}, |
||||
|
|
||||
|
selectAll(e) { |
||||
|
var allCheck = this.allCheck; |
||||
|
var list = this.list; |
||||
|
this.setData({ |
||||
|
allCheck: !allCheck |
||||
|
}); |
||||
|
list.forEach(item => { |
||||
|
item.checked = this.allCheck ? true : false; |
||||
|
}); |
||||
|
this.setData({ |
||||
|
list: list |
||||
|
}); |
||||
|
this.select_product(); |
||||
|
this.groupListF(); |
||||
|
}, |
||||
|
|
||||
|
showCoupons() { |
||||
|
this.setData({ |
||||
|
show_coupons: !this.show_coupons |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
showDiscounts() { |
||||
|
this.setData({ |
||||
|
show_discounts: !this.show_discounts |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
getCoupon(e) { |
||||
|
var is_login = this.$cookieStorage.get('user_token'); |
||||
|
var code = e.currentTarget.dataset.code; |
||||
|
var index = e.currentTarget.dataset.index; |
||||
|
|
||||
|
if (is_login) { |
||||
|
this.goodsConvertCoupon(code, index); |
||||
|
} else { |
||||
|
var url = getUrl(); |
||||
|
wx.showModal({ |
||||
|
tiele: '', |
||||
|
content: '请先登录', |
||||
|
success: res => { |
||||
|
if (res.confirm) { |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/user/register/register?url=' + url |
||||
|
}); |
||||
|
} |
||||
|
} |
||||
|
}); |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
// 领取优惠券 |
||||
|
goodsConvertCoupon(code, index) { |
||||
|
var token = this.$cookieStorage.get('user_token'); |
||||
|
this.$http.post({ |
||||
|
api: 'api/coupon/convert', |
||||
|
header: { |
||||
|
Authorization: token |
||||
|
}, |
||||
|
data: { |
||||
|
coupon_code: code |
||||
|
} |
||||
|
}).then(res => { |
||||
|
if (res.statusCode == 200) { |
||||
|
res = res.data; |
||||
|
|
||||
|
if (res.status) { |
||||
|
this.coupons[index].receive = true; |
||||
|
wx.showToast({ |
||||
|
title: '领取成功' |
||||
|
}); |
||||
|
} else { |
||||
|
wx.showToast({ |
||||
|
title: res.message, |
||||
|
image: '../../../static/error.png' |
||||
|
}); |
||||
|
} |
||||
|
} else { |
||||
|
wx.showToast({ |
||||
|
title: '领取失败', |
||||
|
image: '../../../static/error.png' |
||||
|
}); |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
goLogin() { |
||||
|
var url = getUrl(); |
||||
|
wx.navigateTo({ |
||||
|
url: '/pages/user/register/register?url=' + url |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
changeCoupons() { |
||||
|
this.setData({ |
||||
|
show_coupons: !this.show_coupons |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
changeDiscounts() { |
||||
|
this.setData({ |
||||
|
show_discounts: !this.show_discounts |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
// 购物车领券 |
||||
|
cardDiscount(ids) { |
||||
|
var wechat_group_id = this.$cookieStorage.get('openGId') || ''; |
||||
|
wx.request({ |
||||
|
url: config.GLOBAL.baseUrl + 'api/shoppingCart/discount', |
||||
|
method: 'POST', |
||||
|
data: { |
||||
|
ids: ids, |
||||
|
wechat_group_id: wechat_group_id |
||||
|
}, |
||||
|
success: res => { |
||||
|
if (res.statusCode == 200) { |
||||
|
res = res.data; |
||||
|
|
||||
|
if (res.status && res.data) { |
||||
|
res.data.coupons.forEach(v => v.receive = false); |
||||
|
// this.setData({ |
||||
|
// coupons: res.data.coupons, |
||||
|
// discounts: res.data.discounts |
||||
|
// }); |
||||
|
this.coupons=res.data.coupons; |
||||
|
this.discounts=res.data.discounts; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
setData: function (obj) { |
||||
|
let that = this; |
||||
|
let keys = []; |
||||
|
let val, data; |
||||
|
Object.keys(obj).forEach(function (key) { |
||||
|
keys = key.split('.'); |
||||
|
val = obj[key]; |
||||
|
data = that.$data; |
||||
|
keys.forEach(function (key2, index) { |
||||
|
if (index + 1 == keys.length) { |
||||
|
that.$set(data, key2, val); |
||||
|
} else { |
||||
|
if (!data[key2]) { |
||||
|
that.$set(data, key2, {}); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
data = data[key2]; |
||||
|
}); |
||||
|
}); |
||||
|
} |
||||
|
}, |
||||
|
computed: {}, |
||||
|
watch: {} |
||||
|
}; |
||||
|
</script> |
||||
|
<style rel="stylesheet/less" lang="less"> |
||||
|
@import "cart"; |
||||
|
</style> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue