Skip to content

Y
ybf
Commit 03700c6d authored by leiqingsong's avatar leiqingsong
Browse files
Options

活动页面修改

parent 9bff9c37
master
No related merge requests found
Show whitespace changes
Inline Side-by-side
Showing with 100 additions and 44 deletions
wx_application/public/img/wheel.png
View replaced file @ 9bff9c37 View file @ 03700c6d
wx_application/public/img/wheel.png

547 KB | W: 0px | H: 0px

wx_application/public/img/wheel.png

487 KB | W: 0px | H: 0px

  • 2-up
  • Swipe
  • Onion skin
wx_application/src/views/active/activeDetail.vue
View file @ 03700c6d
......@@ -31,7 +31,7 @@
<div class="wheel-container">
<p class="title">{{ activityName }}</p>
<div class="wheel">
<div class="wheel-point" @click="Start_Game"></div>
<div class="wheel-point" @click="Start_Game">开始</div>
<img src="../../../public/img/wheel.png" alt="wheel" />
<!-- <div class="circle"></div> -->
<div
......@@ -45,9 +45,10 @@
class="prize-item"
:style="`transform: rotate(${(360/ prizeList.length) * index }deg)`"
>
<div class="prize-name">{{ item.name }}</div>
<div class="prize-name">{{ item.prizeName }}</div>
<div class="prize-icon">
<img src="/img/counter.png" />
<!-- <p>一等奖</p> -->
<!-- <img src="/img/counter.png" /> -->
</div>
</div>
</div>
......@@ -80,26 +81,28 @@
:style="active_type === 'coupon'? 'bottom: 0': ''"
@click="handleShare"
>立即分享</div>
<van-overlay :show="showAward && !res_error" @click="showAward = false">
<div class="wrapper" @click.stop>
<van-overlay :show="showAward" @click="showAward = false">
<div class="wrapper">
<div v-if="isAward" class="block">
<div class="award-coupon">
<img class="bg_img" src="/img/coupon.png" alt="coupon" />
<div class="other">
<p>{{ awardGood.coupon.type }}</p>
<!-- <p>代金券</p> -->
<div class="split">
<img src="../../../public/img/split.png" alt="split" />
</div>
<p>{{ awardGood.coupon.unit }}元</p>
<!-- <p>2000元</p> -->
</div>
</div>
<p style="font-size: 20px;font-weight: bold;">OLAY全场通用抵扣券</p>
<p style="font-size: 20px;font-weight: bold;">{{ awardGood.prizeName }}！</p>
<p style="font-size: 20px;font-weight: bold;">恭喜您中奖！</p>
<van-button style="background: #f00;color: #fff;" @click="handleGet">领取奖品</van-button>
<van-button style="border-color: #7f7777;" @click="showAward = false">继续抽奖</van-button>
<van-button style="border-color: #7f7777;" @click="handleGoOn">继续抽奖</van-button>
</div>
<div v-if="!isAward" class="block" style="background: #413d3de0;color: #fff;">
<div v-else class="block" style="background: #413d3de0;color: #fff;">
<p style="font-size: 22px;">谢谢惠顾！</p>
<p style="font-size: 14px;">很遗憾，此次未能中奖，再接再厉！</p>
</div>
......@@ -114,16 +117,17 @@ import axios from "axios";
import wxAuth from "@/components/wxAuth";
import * as APi_Active from "@/api/active";
import { CoutDown } from "@/utils/Foundation";
import { Dialog } from "vant";
export default {
name: "active-detail",
components: { wxAuth },
data() {
return {
goOn: false,
env: "",
userIcon: "/img/photo.png",
couponDetail: {},
game_end: false,
res_error: false,
error_message: "",
timer: null,
timeLine: "",
isAward: false,
......@@ -191,11 +195,16 @@ export default {
this.userIcon = this.$route.query.headurl
? decodeURIComponent(this.$route.query.headurl)
: "";
// 验证用户是否登录
if (!sessionStorage.getItem("userId")) {
this.env = window.navigator.userAgent.toLowerCase();
// 微信端才做验证
if (
this.env.match(/MicroMessenger/i) !== "micromessenger" ||
this.env.match(/wxwork/i) == "wxwork"
) {
// 1.获取code
if (this.$route.query.unionid === undefined) {
this.getUnionid();
// this.getUnionid();
} else {
this.userBaseInfo.unionid = JSON.stringify(this.$route.query.unionid);
this.userBaseInfo.openid = JSON.stringify(this.$route.query.openid);
......@@ -203,9 +212,26 @@ export default {
number: 7,
unionId: this.$route.query.unionid
};
console.log("params", params);
//TODO 会员验证提示
APi_Active.isMember(params).then(res => {
this.isMember = res.data.vipId != null;
if (res.data.errMessage === "会员不存在") {
this.isMember = false;
Dialog.confirm({
title: "确认框",
message:
"当前活动为会员才可参加，尚未找到您的会员信息，是否前往注册？"
})
.then(() => {
// on confirm
let url = "http://oysales.oywanhao.com/register";
window.location.href = url;
})
.catch(() => {
// on cancel
return false;
});
}
this.isMember = true;
this.userBaseInfo.vipId = res.data.vipId;
this.userBaseInfo.mobile = res.data.mobile;
this.userBaseInfo.name = res.data.name;
......@@ -233,12 +259,21 @@ export default {
}
},
methods: {
// 继续抽奖
handleGoOn() {
this.goOn = true;
this.showAward = false;
},
// 领取(
handleGet() {
if (this.$route.query.unionid === undefined) {
this.$toast("企业微信端不能领取");
return;
if (
this.env.match(/MicroMessenger/i) !== "micromessenger" ||
this.env.match(/wxwork/i) == "wxwork"
) {
this.$toast("请在微信端领取！");
return false;
}
// 会员领取
let params = {
couponId: this.awardGood.activityPrize
? this.awardGood.coupon.id
......@@ -248,9 +283,15 @@ export default {
};
APi_Active.collectMyCoupon(params).then(res => {
this.showAward = false;
if (res.data == "领取失败") {
this.$toast("领取失败");
return false;
}
if (!this.goOn) {
this.$toast(
"领取成功！奖品已经发送到您的会员账户，请进入欧亚小程序查看。"
);
}
});
},
GET_DetailById(id) {
......@@ -300,35 +341,32 @@ export default {
},
Start_Game() {
// 在微信端打开 会有身份验证 路径中会带上 unionid
if (this.$route.query.unionid === undefined) {
this.$toast("企业微信端不能参与抽奖活动");
return false;
}
// if (
// this.env.match(/MicroMessenger/i) !== "micromessenger" ||
// this.env.match(/wxwork/i) == "wxwork"
// ) {
// this.$toast("请在微信端参与活动！");
// return false;
// }
if (this.game_end) {
this.$toast("活动已结束");
return false;
}
if (this.userBaseInfo.vipId === null) {
this.$toast("非会员,");
let url = "http://oysales.oywanhao.com/register";
window.location.href = url;
return false;
}
if (this.rolling) {
this.$toast("抽奖中，请勿多次点击！");
return false;
}
let params = {
activityId: this.active_id,
openId: this.userBaseInfo.openid,
openId: this.userBaseInfo.openid || "ofoA-xH5niSEVKKdaw2rE4bEZ3KY",
phone: this.userBaseInfo.phone,
unionId: this.userBaseInfo.unionid,
unionId: this.userBaseInfo.unionid || "oCIMxuC30KJI9Kn_y4miMflyQ7BY",
userName: this.userBaseInfo.name
};
APi_Active.play(params)
.then(res => {
if (!res.data.prizedId) {
this.res_error = true;
if (!res.data.prizeId) {
this.showAward = false;
this.$toast(res.data.message);
return false;
}
......@@ -336,7 +374,7 @@ export default {
this.rolling = true;
const random = prizeList
.map(item => item.id)
.indexOf(res.data.prizedId);
.indexOf(res.data.prizeId);
this.wheelDeg =
wheelDeg -
(wheelDeg % 360) +
......@@ -348,12 +386,21 @@ export default {
this.rolling = false;
this.showAward = true;
this.isAward = res.data.prizeName !== "谢谢惠顾";
if (!this.isAward) {
this.$toast("");
}
}, 4500);
})
.catch(err => {
console.log("err", err);
});
},
getUrlParams(name) {
let reg = new RegExp("(^|\\?|&)" + name + "=([^&]*)(\\s|&|$)", "i");
if (reg.test(location.href))
return unescape(RegExp.$2.replace(/\+/g, " "));
return "";
},
// 分享
handleShare() {
let env = window.navigator.userAgent.toLowerCase();
......@@ -381,12 +428,14 @@ export default {
);
} else if (env.match(/micromessenger/i) == "micromessenger") {
console.log("微信客户端");
let wx_url = `http://oysales.oywanhao.com:8087/activeDetail?id=${this.$route.query.id}&active_type=${this.$route.query.active_type}`;
let id = this.getUrlParams("id");
let type = this.getUrlParams("active_type");
let wx_url = `http://oysales.oywanhao.com:8087/activeDetail?id=${id}&active_type=${type}`;
wx.ready(function() {
wx.onMenuShareTimeline({
title: `${this.$route.query.active_type === 'wheel' ? '抽奖' : '送券'}活动`, // 分享标题
link: url, // 分享链接,将当前登录用户转为puid,以便于发展下线
title: `${type === "wheel" ? "抽奖" : "送券"}活动`, // 分享标题
link: wx_url, // 分享链接,将当前登录用户转为puid,以便于发展下线
imgUrl: "", // 分享图标
success: function() {
// 用户确认分享后执行的回调函数
......@@ -532,7 +581,7 @@ export default {
right: 0;
bottom: 0;
margin: auto;
font-size: 32px;
font-size: 20px;
text-align: center;
line-height: 32px;
z-index: 10;
......@@ -580,8 +629,12 @@ export default {
transform-origin: bottom;
.prize-name {
padding: 16px 0 0;
font-size: 14px;
padding: 0.75rem 0 0;
font-size: 0.4375rem;
height: 70%;
width: 0.5rem;
overflow: hidden;
text-overflow: ellipsis;
}
.prize-icon {
......@@ -693,8 +746,11 @@ export default {
width: 90%;
height: 60%;
margin: auto;
text-align: center;
font-size: 32px;
color: #f00;
p {
width: 50%;
margin: 0;
}
}
......
wx_application/src/views/mainSale/active/main/index.vue
View file @ 03700c6d
......@@ -238,7 +238,7 @@ export default {
this.flag = sessionStorage.getItem("role");
}
} else {
this.zReadyUserId()
// this.zReadyUserId()
this.zTestGetNowUrlInfo()
}
this.GET_CurrentActive()
......
wx_application/src/views/mainSale/active/template/index.vue
View file @ 03700c6d
......@@ -74,7 +74,7 @@ export default {
getTemplate(params) {
API_Active.getTemplate(params).then(res => {
this.active.push(...res.data.list);
if (res.data.list === []) {
if (res.data.list.length === 0) {
this.list_finished = true;
}
});
......
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