Skip to content

M
mayi-mp-shop
Commit 311bf256 by 李嘉林
Options

新人有礼

parent 55f07ed7
Showing with 509 additions and 31 deletions
src/api/index.js
...@@ -45,7 +45,13 @@ console.log(process.env,'-----------------config------') ...@@ -45,7 +45,13 @@ console.log(process.env,'-----------------config------')
data data
} }
); );
} },
// 取消新客活动按钮
cancelNewCustome(params) {
return requestPOST(
`${process.env.OLSHOP_URL}/user/cancelNewCustomerGiftDialog/` + params
);
},
} }
\ No newline at end of file
src/api/promote.js
...@@ -4,11 +4,19 @@ export default { ...@@ -4,11 +4,19 @@ export default {
return requestPOST(`${process.env.OLSHOP_URL}/promotion/v2/query_single_item_activity_detail`, data); return requestPOST(`${process.env.OLSHOP_URL}/promotion/v2/query_single_item_activity_detail`, data);
}, },
// 根据列表查询活动 // 根据列表查询活动
query_single_item_activity_list_by_ids(data) { query_single_item_activity_list_by_ids(data) {
return requestPOST(`${process.env.OLSHOP_URL}/promotion/query_single_item_activity_list_by_ids`, data); return requestPOST(`${process.env.OLSHOP_URL}/promotion/query_single_item_activity_list_by_ids`, data);
}, },
// 组件查询优惠券列表 // 组件查询优惠券列表
queryCouponIdsList(data) { queryCouponIdsList(data) {
return requestPOST(`${process.env.OLSHOP_URL}/promotion/query_coupon_detail_by_ids`, data ) return requestPOST(`${process.env.OLSHOP_URL}/promotion/query_coupon_detail_by_ids`, data )
},
// 查询这个商城是否有这个活动
query_org_new_customer_gift(data) {
return requestPOST(`${process.env.OLSHOP_URL}/promotion/query_org_new_customer_gift_activity`, data)
},
//优惠券领取弹框
queryDialogCoupons(data) {
return requestPOST(`${process.env.OLSHOP_URL}/promotion/query_dialog_coupons`, data)
}, },
}; };
\ No newline at end of file
src/components/newCustomer/newPolite.vue 0 → 100644
<template>
<div class="domain" v-if="showgiftBag">
<div class="content">
<p class="name" v-if="!sessionId">新人礼包</p>
<div class="name1" v-else>
<p class="congratulation">恭喜！</p>
<p class="newBag">您的新人礼包已到账</p>
</div>
<div class="items">
<div class="item" v-for="(item,index) in MyNewGiftList" :key="index">
<div class="item-bg">
<img src="http://cdn.mayi888.com/public/png/4b4bad13-38b1-4c00-b19f-ee3b17c12cfc.png" alt />
</div>
<div class="item-content">
<div class="left">
<p v-if="item.preferentialType!=1"><span>￥</span><span class="price">{{item.preferentialMoney}}</span></p>
<p v-else><span class="price">{{item.preferentialDiscount}}</span><span>折</span></p>
<p v-if="item.thresholdType==1">满{{item.meetMoneyUse}}可用</p>
<p v-else>无门槛</p>
</div>
<div class="right">
<!-- <p style="font-size:14px;">数量：{{item.couponQty}}张</p> -->
<p class="info" v-if="item.applyGoodsType==1">仅限部分商品可用</p>
<p class="info" v-else-if="item.applyGoodsType==2">仅限部分分类可用</p>
<p class="info" v-else-if="item.applyGoodsType==3">仅限部分标签可用</p>
<p class="info" v-else>全品类通用</p>
<p
class="time" v-if="item.periodOfValidityType == 0"
>有效期 {{item.effectiveDate.split(" ")[0]}} - {{item.expiryDate.split(" ")[0]}}</p>
<p
class="time" v-if="item.periodOfValidityType == 1"
>领到券当日开始{{item.effectiveDaysFromToday}}天内有效</p>
<p
class="time" v-if="item.periodOfValidityType == 2"
>领到券次日开始{{item.effectiveDaysFromTomorrow}}天内有效</p>
<p
class="time" v-if="item.periodOfValidityType == 3"
>领到券开始到月底有效</p>
<!-- <p class="time">{{item.effectiveDate | filterTime}}-{{item.expiryDate | filterTime}}</p> -->
</div>
</div>
</div>
</div>
<div class="btn">
<img src="http://cdn.mayi888.com/public/png/e5922aa4-5edd-4aee-909d-4a63c3459cd9.png" alt />
<span v-if="sessionId" @click="closeHandle">立即收下</span>
<span v-else @click="toReceive">立即领取</span>
</div>
<div class="bg">
<img src="http://cdn.mayi888.com/public/png/649d4190-80a8-43b2-a2ac-b8cb83daee1f.png" alt />
</div>
<div class="close">
<img src="http://cdn.mayi888.com/public/png/2cb205c7-22fb-48ff-8de4-876bc085d20b.png" @click="closeHandle" alt="">
</div>
</div>
</div>
</template>
<script>
import promote from "@/api/promote.js"
export default {
name:"new-polite",
props:{
showgiftBag:Boolean,
MyNewGiftList: {
type: Array,
default: () => []
},
},
data() {
return {
datas: [],
sessionId:"",
};
},
mounted(){
this.sessionId = wx.getStorageSync('sessionid');
if(process.browser && wx.getStorageSync("sessionid")){
// this.init();
}
},
activated(){
if(process.browser && wx.getStorageSync("sessionid")){
// this.init();
}
},
filters:{
// filterTime(val){
// let time1=val.split(" ")[0].split("-").join('.');
// return time1;
// },
},
methods: {
init(){
promote.queryDialogCoupons().then((response)=>{
if(response.code==200){
this.datas=response.data;
if(response.data.toString().length<=0){
this.show=false
}else{
this.show=true
}
}
})
// if(this.$store.state.showSendingCoupon){
// this.$store.dispatch('showCouponPop',false)
// }
},
closeHandle() {
this.$emit('closeHandle');
},
toReceive(){
setTimeout(() => {
// 未登录的
if(!wx.getStorageSync("sessionid")){
this.toEnvPage();
return;
}else {
// 已经登陆的
}
}, 1000);
},
toEnvPage() {
let backUrl = `/home/main`;
const url = `/pages/login/main?back=${encodeURIComponent(
backUrl
)}&params=${JSON.stringify({
fromType: "mini"
})}`;
wx.navigateTo({
url: url
});
// let backUrl = location.href.slice(location.href.indexOf("//")+2);
// let url = backUrl.slice(backUrl.indexOf("/"))
// let webQuery = {
// back: url,
// };
//TODO 登录页面
},
}
};
</script>
<style lang="scss" scoped>
.domain {
z-index: 999;
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: rgba(#000000, 0.75);
.content {
text-align: center;
position: absolute;
width: 100%;
margin: auto;
top: 4%;
.name{
position: absolute;
width: 100%;
color: #FFFFFF;
text-align: center;
top: 60px;
font-size: 17px;
}
.name1{
position: absolute;
width: 100%;
color: #FFFFFF;
text-align: center;
top: 50px;
font-size:14px;
.congratulation{
font-size: 20px;
}
}
.items {
position: absolute;
width: 100%;
height: 260px;
overflow-y: auto;
overflow-x: hidden;
top: 100px;
padding-top: 10px;
padding-bottom:10px;
.item {
position: relative;
left: 40px;
height: 100px;
overflow: hidden;
margin-top: 10px;
.item-bg {
position: absolute;
width: 280px;
height: 100px;
img{
width: 100%;
height: 100%;
}
}
.item-content {
width: 100%;
position: absolute;
display: flex;
left: 26px;
height: 95px;
.left {
display: flex;
flex-direction: column;
justify-content: center;
width: 93px;
height: 100%;
color: #fff;
font-weight: bold;
text-align: center;
font-size: 15px;
.price{
font-size: 25px;
}
}
.right{
width: 40vw;
height: 95px;
display: flex;
flex-direction: column;
justify-content: center;
.info{
font-size: 16px;
color: #333;
font-weight:bold;
}
.time{
font-size:12px;
color: #A3A3A3;
margin-top: 10px;
}
}
}
}
}
i {
color: #ff7422;
font-size: 24px;
}
.bg {
width: 95%;
height: 80vh;
margin:0 auto;
img{
width: 100%;
height: 100%;
}
}
.btn {
position: absolute;
width: 70%;
height: 60px;
left: 50px;
bottom: 25px;
img{
width: 100%;
height: 100%;
}
span {
width: 98%;
height: 40px;
line-height: 40px;
font-size: 18px;
color: #f53610;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
}
.close {
position: absolute;
bottom: -40px;
width: 100%;
img{
width: 30px;
height: 30px;
margin: 0 auto;
}
}
}
}
</style>
src/components/newCustomer/newUser.vue 0 → 100644
<template>
<div class="newUser" v-if="showNewUser" @click="togiftbag()">
<img src="http://cdn.mayi888.com/public/gif/81447d46-2d3c-4dd3-9b44-f0910d124115.gif" alt="">
</div>
</template>
<script>
export default {
name:"new-user",
props:{
// 是否滚动一点点才显示
showNewUser:Boolean,
},
data() {
return {
}
},
created() {
},
mounted(){
if(process.browser){
// 在这里面判断是否是新用户，是否展示点击入口，点击完之后隐藏
}
},
methods: {
togiftbag(){
// 在这判断是否展示弹框
console.log("---弹框")
this.$emit('togiftbag');
}
}
}
</script>
<style lang="scss" scoped>
.newUser{
width: 80px;
height: 80px;
position: fixed;
bottom:140px;
right:-15px;
z-index: 99;
img{
width: 100%;
height: 100%;
}
}
</style>
src/pages/home/index.vue
...@@ -70,7 +70,7 @@ ...@@ -70,7 +70,7 @@
<official-account></official-account> <official-account></official-account>
</div> </div>
<div v-if="item.componentCode == 'transverse-label' && item.componentInfo.visible == 1"> <div v-if="item.componentCode == 'transverse-label' && item.componentInfo.visible == 1">
<transverse-label :datas="item" :ref="'transverse-label' + index" :componentIndex="index"></transverse-label> <transverse-label :datas="item" :componentIndex="index"></transverse-label>
</div> </div>
<div v-if="item.componentCode == 'photo-gallery' && item.componentInfo.visible == 1"> <div v-if="item.componentCode == 'photo-gallery' && item.componentInfo.visible == 1">
<photo-gallery :datas="item"></photo-gallery> <photo-gallery :datas="item"></photo-gallery>
...@@ -104,6 +104,8 @@ ...@@ -104,6 +104,8 @@
<div v-if="applySucessEntry"> <div v-if="applySucessEntry">
<apply-sucess-entry></apply-sucess-entry> <apply-sucess-entry></apply-sucess-entry>
</div> </div>
<NewUser :showNewUser="showNewUser" @togiftbag="togiftbag"></NewUser>
<new-polite :showgiftBag="showgiftBag" @closeHandle="closeHandle" :MyNewGiftList="newGiftList"></new-polite>
<!-- 底部栏 --> <!-- 底部栏 -->
<custom-tab-bar class="custom-tab-bar" :selected="active"></custom-tab-bar> <custom-tab-bar class="custom-tab-bar" :selected="active"></custom-tab-bar>
</div> </div>
...@@ -111,6 +113,9 @@ ...@@ -111,6 +113,9 @@
<script> <script>
import shop from "@/api/shop"; import shop from "@/api/shop";
import promote from "@/api/promote";
import index from "@/api/index";
import live from "@/api/live";
import bottomCont from "../../components/bottomCont" import bottomCont from "../../components/bottomCont"
import ThemeDataPlant from "../../components/ThemeDataPlant" import ThemeDataPlant from "../../components/ThemeDataPlant"
import links from '@/components/basicTool/link/index.vue' import links from '@/components/basicTool/link/index.vue'
...@@ -124,6 +129,8 @@ import imgText from '@/components/content/imgText' ...@@ -124,6 +129,8 @@ import imgText from '@/components/content/imgText'
import coupon from '@/components/activity/coupon' import coupon from '@/components/activity/coupon'
import integralTurntable from '@/components/activity/integralTurntable' import integralTurntable from '@/components/activity/integralTurntable'
import spellGroup from '@/components/activity/spellGroup' import spellGroup from '@/components/activity/spellGroup'
import NewUser from "../../components/newCustomer/newUser";
import NewPolite from "../../components/newCustomer/newPolite";
import { setTabBarActive, checkTabbarPage,themeColor } from "../../utils/mayi.js"; import { setTabBarActive, checkTabbarPage,themeColor } from "../../utils/mayi.js";
import { throttle, concatUrl } from "../../utils/index.js" import { throttle, concatUrl } from "../../utils/index.js"
const app = getApp(); const app = getApp();
...@@ -147,6 +154,12 @@ export default { ...@@ -147,6 +154,12 @@ export default {
active:-1, active:-1,
toHomePage: false,//是否分销隔断 toHomePage: false,//是否分销隔断
options: 1, options: 1,
// 新人有礼
newGiftList:[],
newCustomerGiftActivityId: "", //新客活动id
showNewUser: false, //新客有礼入口
showgiftBag: false, //新客礼包弹框
timer: null,
}; };
}, },
components:{ components:{
...@@ -162,7 +175,9 @@ export default { ...@@ -162,7 +175,9 @@ export default {
integralTurntable, integralTurntable,
transverseLabel, transverseLabel,
information, information,
spellGroup spellGroup,
NewUser,
NewPolite
}, },
onShareAppMessage(res) { onShareAppMessage(res) {
let {shopCode} = app.globalData.shopInfo; let {shopCode} = app.globalData.shopInfo;
...@@ -217,18 +232,6 @@ export default { ...@@ -217,18 +232,6 @@ export default {
data: JSON.stringify(options) data: JSON.stringify(options)
}); });
} }
if(options.scene&&options.scene.indexOf('_')>-1) {
let querys = options.scene.split("_");
if(querys[0] == "home"){
let query = options;
query.userId = querys[4]
query.spokesmanRelId = querys[2]
wx.setStorage({
key: "becomeInfo",
data: JSON.stringify(query)
});
}
}
Object.assign(this.$data, this.$options.data()); Object.assign(this.$data, this.$options.data());
if (options.from && options.from == "logout") { if (options.from && options.from == "logout") {
//来自用户登出 //来自用户登出
...@@ -239,7 +242,6 @@ export default { ...@@ -239,7 +242,6 @@ export default {
key: "openid" key: "openid"
}); });
} }
console.log(wx.getStorageSync("becomeInfo"),111111111)
this.options = wx.getStorageSync("becomeInfo"); this.options = wx.getStorageSync("becomeInfo");
this.changeLocation = options.changeLocation || '' this.changeLocation = options.changeLocation || ''
...@@ -286,8 +288,8 @@ export default { ...@@ -286,8 +288,8 @@ export default {
} }
} }
// 新人有礼弹窗
this.newUserFun();
}, },
onShow() { onShow() {
...@@ -305,8 +307,6 @@ export default { ...@@ -305,8 +307,6 @@ export default {
this.active=checkTabbarPage('/') this.active=checkTabbarPage('/')
} }
console.log(this,'this--==================')
this.$mp.page.onPageScroll= (el)=>{ this.$mp.page.onPageScroll= (el)=>{
throttle(this.scrolls(el),100) throttle(this.scrolls(el),100)
}; };
...@@ -445,10 +445,6 @@ export default { ...@@ -445,10 +445,6 @@ export default {
let com=this.$mp.page.selectComponent(".merchants-list"+i) ; let com=this.$mp.page.selectComponent(".merchants-list"+i) ;
com && com.getScroll(el); com && com.getScroll(el);
} }
if(element.componentCode=="transverse-label"){
let com=this.$refs["transverse-label"+i][0];
com && com.getScroll();
}
} }
} }
...@@ -487,7 +483,127 @@ export default { ...@@ -487,7 +483,127 @@ export default {
this.$mp.page.selectComponent(".custom-tab-bar").setData({"cartNum": Number(res.data.data)}); this.$mp.page.selectComponent(".custom-tab-bar").setData({"cartNum": Number(res.data.data)});
} }
}); });
} },
newUserFun(){
promote.query_org_new_customer_gift().then(res=>{
if (res.data.code == 200 && res.data.data) {
console.log(res.data.data,'----------------------------res.data')
this.newGiftList = [];
res.data.data.coupons.forEach((item) => {
if (item.couponQty >= 1) {
for (var i = 0; i < item.couponQty; i++) {
item.preferentialMoney = parseFloat(item.preferentialMoney);
item.preferentialDiscount = parseFloat(item.preferentialDiscount);
item.meetMoneyUse = parseFloat(item.meetMoneyUse);
this.newGiftList.push(item);
}
}
});
this.newCustomerGiftActivityId = res.data.data.id;
// 如果有活动
if (res.data.data != null) {
setTimeout(() => {
if (!wx.getStorageSync("sessionid")) {
this.showNewUser = true;
} else {
this.showNewUser = false; //入口隐藏
live.getUserInfo().then((res) => {
if (res.data.code == 200) {
// 已经领取过的话，就判断是否展示弹框
// 判断是否是新人
let isNewUser = false;
res.data.data.tagNames.forEach(function (item) {
console.log(item.tagName + "999999");
if (item.tagName == "新人") {
isNewUser = true;
}
});
if (res.data.data.obtainNewCustomerGiftFlag == "true") {
//如果领取过
this.showNewUser = false;
// 判断是否需要展示弹框
// 如果需要弹，并且是新用户的话
if (
res.data.data.showDialogNewCustomerGiftFlag == "true" &&
isNewUser == true
) {
this.showgiftBag = true; //弹框展示
this.showNewUser = false; //入口隐藏
this.getUserreceiveGift(); //定时查我领取的新客礼包
} else {
// 不是新用户，
this.showNewUser = false; //入口关闭
this.showgiftBag = false; //弹框不显示
}
} else {
// 未领取过的,判断是不是新用户
if (isNewUser == true) {
// 是新用户的，弹弹框提示，
this.showgiftBag = true;
this.getUserreceiveGift();
} else {
// 不是新用户，
this.showNewUser = false; //入口关闭
this.showgiftBag = false; //弹框不显示
}
}
}
});
}
}, 1000);
} else {
// 没活动
this.showNewUser = false;
}
} else {
// Toast(res.msg);
}
})
},
getUserreceiveGift() {
this.timer = setInterval(() => {
// 查询我领取的新客礼品
promote.query_my_new_customer_gift().then((res) => {
if (res.code == 200) {
// data为null就是没有查询到我领取的优惠券，就再调一次领取优惠券接口手动领取下
if (res.data == null) {
console.log("没领到");
} else {
clearInterval(this.timer);
}
} else {
Toast(res.msg);
clearInterval(this.timer);
}
});
}, 5000);
},
togiftbag() {
// 弹框展开之后，点击立即领取，然后去判断是否登录
// 如果没有登录，就到登录页面去完成注册，登录，如果是已经登录过的，点击立即领取之后就直接显示知道了
if (this.newGiftList.toString().length <= 0) {
this.showgiftBag = false;
} else {
this.showgiftBag = true;
}
},
closeHandle() {
// 关闭弹框之后调取消接口就隐藏，不展示
if (wx.getStorageSync("sessionid")) {
index.cancelNewCustome(this.newCustomerGiftActivityId).then((res) => {
// console.log(res,'ooooooooo123');
if (res.code == 200) {
// 接口调成功之后，就关闭弹框
this.showgiftBag = false;
} else {
Toast(res.msg);
this.showgiftBag = false;
}
});
} else {
this.showgiftBag = false;
}
},
}, },
async onShareAppMessage(res){ async onShareAppMessage(res){
console.log(res) console.log(res)
......
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