Commit 9849c806 authored by leiqingsong's avatar leiqingsong

抽奖活动

parent b6e580da
......@@ -17,13 +17,61 @@ export function createActive(params) {
/**
* 获取活动列表
*/
export function getActiveList(inData) {
let getData = {
args: inData
}
return requestB({
url: '',
export function getActiveList(params) {
return request({
url: `activity/list`,
method: 'post',
data: params
})
}
/**
* 判断是否会员
*/
export function isMember(params) {
return request({
url: `activity/isMember`,
method: 'get',
getData
data: params
})
}
/**
* 获取活动详情
* @param {*} id
*/
export function getActiveDetailById(id) {
return request({
url: `activity/getById?id=${id}`,
method: 'get'
})
}
/**
* 抽奖
*/
export function play(params) {
return request({
url: `activity/play`,
method: 'post',
data: params
})
}
/**
* 获取优惠券
* @param {*} id
*/
export function getAllCouponsByOyStallCode(id) {
return request({
url: `admin/auth/coupon/getAllCouponsByOyStallCode?deptId=${id}`,
method: 'get'
})
}
export function getUserBaseInfo(code) {
return request({
url: `activity/getUserInfo?code=${code}`,
method: 'get'
})
}
\ No newline at end of file
......@@ -24,9 +24,9 @@
</template>
<template v-if="type === 'wheel'">
<div class="wheel-container">
<p class="title">幸运大抽奖!</p>
<p class="title">{{ activityName }}</p>
<div class="wheel">
<div class="wheel-point" @click="Start_Game">Start</div>
<div class="wheel-point" @click="Start_Game"></div>
<img src="../../../public/img/wheel.png" alt="wheel" />
<div
class="wheel-bg"
......@@ -51,8 +51,9 @@
<div class="awards">
<ul>
<li>
<span>一等奖:</span>
<span>价值280元的优惠券</span>
<span>{{ prizeDesc }}</span>
<!-- <span>一等奖:</span>
<span>价值280元的优惠券</span>-->
</li>
</ul>
</div>
......@@ -62,25 +63,48 @@
</div>
<div class="description">
<div class="t">活动介绍</div>
<div
class="content"
>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar sic tempor. Sociis natoque penatibus et magn</div>
<div class="content">{{ des }}</div>
</div>
</div>
</template>
<div class="btn-share" :style="type === 'coupon'? 'bottom: 0': ''" @click="handleShare">立即分享</div>
<van-overlay :show="showAward" @click="showAward = false">
<div class="wrapper" @click.stop>
<div v-if="isAward" class="block">
<p style="font-size: 20px;font-weight: bold;">OLAY全场通用抵扣券</p>
<p style="font-size: 20px;font-weight: bold;">一等奖!</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>
</div>
<div v-else class="block" style="background: #413d3de0;color: #fff;">
<p style="font-size: 22px;">谢谢惠顾!</p>
<p style="font-size: 14px;">很遗憾,此次未能中奖,再接再厉!</p>
</div>
</div>
</van-overlay>
<wx-auth :show-auth="showAuthDialog" @confirm="handleCheckAuth"></wx-auth>
</div>
</template>
<script>
import axios from "axios";
import wxAuth from "@/components/wxAuth";
import * as APi_Active from "@/api/active";
export default {
name: "active-detail",
components: { wxAuth },
data() {
return {
isAward: false,
showAward: false,
userBaseInfo: "",
isMember: false,
openid: "",
unionid: "",
userIds: [],
currentUrl: "",
showAuthDialog: false,
nowUrl: "",
userId: "",
......@@ -122,13 +146,15 @@ export default {
icon:
"http://wuhanshangcheng.oss-cn-beijing.aliyuncs.com/shangchengnormal/7E4C1866C2874AA5A788B5E59630A7ED.png"
}
]
],
activityName: "",
prizeDesc: "",
des: ""
};
},
created() {
async created() {
console.log("活动详情1");
window.console.log("活动详情2");
console.log("url", location.href);
this.currentUrl = location.href;
this.active_id = this.$route.query.id;
this.type = this.$route.query.type;
console.log("query", this.$route.query);
......@@ -138,12 +164,28 @@ export default {
if (this.$route.query.code === undefined) {
this.showAuthDialog = true;
} else {
console.log("code", this.$route.query.code);
// 拿code 换取access_token
this.getAccessToken();
this.userBaseInfo = await this.getUserBaseInfo(code);
console.log("userbaseInfo", this.userBaseInfo);
if (this.userBaseInfo.unionid) {
let params = {
number: 7,
unionId: this.userBaseInfo.unionid
};
APi_Active.isMember(params).then(res => {
this.isMember = res.data.vipId !== "";
this.userBaseInfo.phone = res.data.mobile ? res.data.mobile : "";
});
} else {
console.log("没有unionid");
this.isMember = false;
}
}
}
},
mounted() {
this.getAgentAuth();
this.GET_DetailById(this.active_id);
},
watch: {
prizeNumber() {
this.freeze = true;
......@@ -160,20 +202,27 @@ export default {
}
},
methods: {
getAccessToken() {
const base = {
baseUrl: "https://api.weixin.qq.com/sns/oauth2/access_token?",
appId: "ww4df265003b43fa0d",
secret: "kF8_-TZE2qad9OMaE2wYAED5rKjOb3Y5IUhHFLHVQAo",
code: this.code,
grant_type: "authorization_code"
};
// 领取
handleGet() {
this.showAward = false;
this.$toast('领取成功!奖品已经发送到您的会员账户,请进入欧亚小程序查看。')
},
GET_DetailById(id) {
APi_Active.getActiveDetailById(id).then(res => {
console.log("获取到活动详情");
this.activityName = res.data.activityName;
this.des = res.data.des;
this.prizeDesc = res.data.prizeDesc;
});
},
handleCheckAuth() {
this.showAuthDialog = false;
this.getAuthCode();
},
async getUserBaseInfo(code) {
const res = await APi_Active.getUserBaseInfo(code);
return res;
},
// 获取code
getAuthCode() {
// alert('获取code')
......@@ -188,7 +237,6 @@ export default {
state: "ztest",
tail: "#wechat_redirect"
};
console.log("redir_url", basicInfo.redirectUrI);
let url =
basicInfo.head +
"appid=" +
......@@ -204,73 +252,46 @@ export default {
basicInfo.tail;
window.location.href = url;
},
getUserInfo() {
let headerData = {
agentId: "1000033",
corpId: "ww4df265003b43fa0d"
};
axios({
url:
"http://139.155.48.151:8085/workWx/auth/user/get?userId=" +
this.userId,
method: "get",
headers: headerData
})
.then(res => {
window.console.log("用户信息", res);
})
.catch(err => {
console.log(err);
});
},
getUserId() {
if (this.$route.query.code === undefined) {
alert("没code");
this.zTestPreAuthCode();
} else {
alert("有code");
this.zTestGetNowUrlInfo();
this.zTestGetUserInfoByOldToken();
}
},
zTestGetNowUrlInfo() {
this.nowUrl = JSON.stringify(this.$route.query);
this.code = String(this.$route.query.code);
console.log("nowUrl", this.nowUrl);
console.log("code", this.code);
getUnionid() {
// window.location.href = 'http://wxmc.oysd.cn/GetWXUserInfo.aspx'
// 获取用户 unionid、openid
// http://wxmc.oysd.cn/GetWXUserInfo.aspx
// axios({
// url: `http://wxmc.oysd.cn/GetWXUserInfo.aspx`,
// method: 'get'
// }).then(res => {
// console.log(res);
// this.unionid = res.msg.unionid;
// this.openid = res.msg.openid;
// let params = {
// number: 7,
// unionId: this.unionid
// }
// APi_Active.isMember(params).then(res => {
// this.isMember = res.data.vipId !== '';
// })
// })
},
zTestGetUserInfoByOldToken() {
let postData = {
code: this.code
};
let headerData = {
agentId: "1000033",
corpId: "ww4df265003b43fa0d"
Start_Game() {
if (!this.isMember) {
this.$toast("非会员,");
let url = "http://oysales.oywanhao.com/register";
window.location.href = url;
return;
}
let params = {
activityId: this.active_id,
openId: this.userBaseInfo.openId,
phone: this.userBaseInfo.phone,
unionId: this.userBaseInfo.unionId,
// userId:
userName: this.getUserBaseInfo.nickname
};
this.zcache.userInfoResOld = "PostData:" + JSON.stringify(postData);
axios({
url:
"http://139.155.48.151:8085/workWx/auth/oauth2/getUserInfo?code=" +
this.code,
method: "post",
headers: headerData
})
APi_Active.play(params)
.then(res => {
alert("获取用户信息接口成功");
this.userId = String(res.data.data.userId);
this.getUserInfo();
})
.catch(err => {
console.log(err);
});
},
Start_Game() {
this.rolling = true;
const { wheelDeg, prizeList } = this;
const random = parseInt(6 * Math.random(0, 5));
console.log(random);
this.wheelDeg =
wheelDeg -
(wheelDeg % 360) +
......@@ -278,23 +299,35 @@ export default {
(360 / prizeList.length) * random;
setTimeout(() => {
this.rolling = false;
this.showAward = true;
this.isAward = res.data.prizeName !== "谢谢惠顾";
}, 4500);
})
.catch(err => {
console.log("err", err);
});
},
// 分享
handleShare() {
console.log("立即分享");
// wx.onMenuShareWechat({
// title: "测试", // 分享标题
// desc: "分享到微信", // 分享描述
// link: "", // 分享链接
// imgUrl: "", // 分享图标
// success: function() {
// // 用户确认分享后执行的回调函数
// console.log("share---", "background: limegreen;");
// },
// cancel: function() {
// // 用户取消分享后执行的回调函数
// }
// });
let url = `http://oysales.oywanhao.com:8087/activeDetail?id=${this.active_id}&type=${this.type}`;
console.log("url", url);
wx.invoke(
"shareToExternalContact",
{
title: "大转盘", // 分享标题
desc: "抽奖活动", // 分享描述
link: url, // 分享链接
imgUrl: "" // 分享封面
},
function(res) {
if (res.err_msg == "shareToExternalContact:ok") {
console.log("分享成功");
} else {
console.log(res.err_msg, "错误信息");
}
}
);
}
}
};
......@@ -543,5 +576,32 @@ export default {
line-height: 45px;
background-color: #169bd5;
}
.van-overlay {
z-index: 100;
}
.wrapper {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
.block {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
width: 70%;
background-color: #fff;
p {
margin-bottom: 8px;
}
.van-button {
width: 80%;
border-radius: 5px;
margin: 5px 0;
}
}
}
</style>
<template>
<div class="container">
<div class="title">
<span>会员分裂</span>
<span>大转盘抽奖</span>
<span class="fr">查看更多<span class="icon">></span></span>
</div>
<div class="active">
<div class="list" v-for="item in activeList" :key="item.id" @click="toDetail(item.id, item.type)">
<div class="list" v-for="item in activeList" :key="item.id" @click="toDetail(item.id, item.activityType)">
<div class="left"></div>
<div class="right">
<h3>{{ item.activeName }}</h3>
<p>{{ item.description }}</p>
<h3>{{ item.activityName }}</h3>
<p>{{ item.des }}</p>
</div>
</div>
</div>
<div class="fg">复购</div>
<div v-if="couponList.length > 0" class="fg">送券活动</div>
<div class="active">
<div class="list">
<div class="list" v-for="item in couponList" :key="item.id" @click="toDetail(item.id, item.activityType)">
<div class="left"></div>
<div class="right">
<h3>大转盘抽奖</h3>
<p>由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。</p>
</div>
</div>
<div class="list list3">
<div class="left"></div>
<div class="right">
<h3>砸金蛋抽奖</h3>
<p>由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。</p>
<h3>{{ item.activityName }}</h3>
<p>{{ item.des }}</p>
</div>
</div>
</div>
......@@ -34,30 +27,54 @@
</template>
<script>
import * as API from '@/api/active';
import * as API_Active from '@/api/active';
export default {
data() {
return {
activeList: [
{
id: 1,
type: 'coupon',
activeName: '砍价',
description: '由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。'
activityType: 'coupon',
activityName: '砍价',
des: '由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。'
},
{
id: 2,
activityType: 'wheel',
activityName: '集赞',
des: '由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。'
}
],
couponList: [
{
id: 1,
activityType: 'coupon',
activityName: '砍价',
des: '由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。'
},
{
id: 2,
type: 'wheel',
activeName: '集赞',
description: '由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。'
activityType: 'wheel',
activityName: '集赞',
des: '由各种物质组成的巨型球状天体,叫做星球。星球有一定的形状。'
}
],
params: {
pageNo: 1,
pageSize: 10
}
]
}
},
mounted() {
this.getActiveList(this.params);
},
methods: {
// 获取 欧亚 活动列表
getOYActiveList() {
// 获取 活动列表
getActiveList(params) {
API_Active.getActiveList(params).then(res => {
console.log('获取到数据');
this.activeList = res.data.list;
})
},
// 跳转到 活动详情
toDetail(active_id, type) {
......
......@@ -4,10 +4,10 @@
<div class="topb">
</div>
<div class="title">
<span class="bt">服装店幸运抽奖</span>
<span class="bt">送券活动</span>
<div class="tb">
<img src="../../../public/img/zp.png" alt="" />
大转盘抽奖
送券活动
</div>
</div>
<div class="wtitle">
......
<template>
<div class="container">
<div class="title">基础设置</div>
<div class="title">活动设置</div>
<van-cell-group class="all">
<van-cell title="活动标题" style="font-size:14px;">
<template slot="default">
<van-field
v-model="title"
placeholder="请输入活动标题"
class="right"
style="font-size:14px;"
/>
</template>
</van-cell>
<van-cell title="消费后领券" style="font-size:14px;">
<template slot="default">
<van-switch v-model="coupon" size="20px" class="right" />
</template>
</van-cell>
<van-cell title="新客专享" style="font-size:14px;">
<template slot="default">
<van-switch v-model="newCustomer" size="20px" class="right" />
</template>
</van-cell>
<van-cell title="领券条件" style="font-size:14px;">
<template slot="default">
<div class="condition">
<span class="phone">手机号必填</span>
<van-switch v-model="condition" size="20px" />
</div>
</template>
</van-cell>
</van-cell-group>
<div class="title">券设置</div>
<van-cell-group class="all">
<van-cell title="活动标题" style="font-size:14px;">
<template slot="default">
<van-field
v-model="title2"
placeholder="请输入活动标题"
class="right"
style="font-size:14px;"
/>
</template>
</van-cell>
<van-cell title="券类型" style="font-size:14px;">
<template slot="default">
<van-radio-group v-model="type" class="right">
<van-radio name="1" style="float:left;">代金券</van-radio>
<van-radio name="2" style="float:right;">折扣券</van-radio>
</van-radio-group>
</template>
</van-cell>
<van-cell title="代金券金额" style="font-size:14px;">
<template slot="default">
<div class="npbr">
<van-field
class="right noborder"
readonly
clickable
:value="cashCoupon"
placeholder="输入代金券金额"
@touchstart.native.stop="show = true"
/>
<van-number-keyboard
v-model="cashCoupon"
:show="show"
:maxlength="6"
@blur="show = false"
/>
</div>
</template>
</van-cell>
<van-cell title="使用门槛" style="font-size:14px;">
<template slot="default">
<div class="npbr">
<van-field
class="right noborder"
readonly
clickable
:value="limit"
placeholder="输入使用门槛"
@touchstart.native.stop="show2 = true"
/>
<van-number-keyboard
v-model="limit"
:show="show2"
:maxlength="6"
@blur="show2 = false"
/>
</div>
<van-field v-model="title" placeholder="请输入活动标题" class="right" style="font-size:14px;" />
</template>
</van-cell>
<van-cell title="活动开始时间" style="font-size:14px;">
<template slot="default">
<div class="npbr">
<div class="nobr">
<van-field
class="right"
v-model="startTime1"
placeholder="选择活动开始时间"
placeholder="请选择开始时间"
readonly="readonly"
@click="startShow = true"
/>
......@@ -115,11 +31,11 @@
</van-cell>
<van-cell title="活动结束时间" style="font-size:14px;">
<template slot="default">
<div class="npbr">
<div class="jpsl">
<van-field
class="right"
v-model="endTime1"
placeholder="选择活动结束时间"
placeholder="请选择结束时间"
readonly="readonly"
@click="endShow = true"
/>
......@@ -135,26 +51,87 @@
</div>
</template>
</van-cell>
<div class="des">描述</div>
<van-cell title="背景图片" style="font-size: 14px">
<van-uploader v-model="bg_imgs" :max-count="1" :after-read="afterBGRead" />
</van-cell>
<van-cell title="活动Logo" style="font-size: 14px">
<van-uploader :max-count="1" v-model="logo_imgs" :after-read="afterLogoRead"></van-uploader>
</van-cell>
<van-cell title="单日最大发放数量">
<template slot="default">
<div class="jpsl">
<van-field
class="right noborder"
readonly
clickable
:value="maxNumber"
placeholder="请输入限制次数"
@touchstart.native.stop="maxNumber_show = true"
/>
<van-number-keyboard
v-model="maxNumber"
:show="maxNumber_show"
:maxlength="6"
@blur="maxNumber_show = false"
/>
</div>
</template>
</van-cell>
<van-cell title="总发放数量">
<template slot="default">
<div class="jpsl">
<van-field
class="right noborder"
readonly
clickable
:value="totalLimit"
placeholder="请输入限制次数"
@touchstart.native.stop="totalLimit_show = true"
/>
<van-number-keyboard
v-model="totalLimit"
:show="totalLimit_show"
:maxlength="6"
@blur="totalLimit_show = false"
/>
</div>
</template>
</van-cell>
<van-cell title="选择优惠券" value="1" is-link @click="showCoupon = true" center />
</van-cell-group>
<!-- 活动描述 -->
<div class="detail">
<div class="border">
<div class="des">活动描述</div>
<van-field
class="area"
v-model="message"
rows="3"
rows="2"
autosize
type="textarea"
placeholder="请输入描述"
show-word-limit
/>
</van-cell-group>
<div class="creat">创建活动</div>
</div>
</div>
<!-- 活动图片 -->
<div class="detail" style="margin-top:0;">
<div class="des">活动图片</div>
<van-uploader v-model="fileList" multiple :max-count="9" />
</div>
<div class="creat" @click="handleCreate">创建活动</div>
<van-action-sheet v-model="showCoupon" :actions="coupons" cancel-text="取消" />
</div>
</template>
<script>
import * as API_Active from "@/api/active";
export default {
data() {
return {
title: "",
logo_imgs: [],
bg_imgs: [],
title: "送券",
title2: "",
coupon: "",
newCustomer: "",
......@@ -165,33 +142,118 @@ export default {
cashCoupon: "",
limit: "",
startTime: new Date(),
startTime1: "",
startTime1: "2020-04-09 08:25:25",
endTime: new Date(),
endTime1: "",
endTime1: "2020-04-10 08:25:25",
startShow: false,
endShow: false,
message: ""
message: "123",
fileList: [],
showCoupon: false,
coupons: [
{ name: "选项" },
{ name: "选项" },
{ name: "选项", subname: "描述信息" }
],
maxNumber: "1",
maxNumber_show: false,
totalLimit: "2",
totalLimit_show: false
};
},
methods: {
getCoupons() {
let id = sessionStorage.getItem("oyStallCode") || 1;
API_Active.getAllCouponsByOyStallCode(id).then(res => {
this.coupons = res.data;
});
},
async afterLogoRead(file) {
let logo_img = await this.getImgUrl(file.file);
if (logo_img.result === "success") {
let item = {
url: bg_img.data.imgPath,
status: "done",
message: "上传成功"
};
this.logo_imgs.push(item);
}
},
async afterBGRead(file) {
let bg_img = await this.getImgUrl(file.file);
if (bg_img.result === "success") {
let item = {
url: bg_img.data.imgPath,
status: "done",
message: "上传成功"
};
this.bg_imgs.push(item);
}
},
// 上传图片
async getImgUrl(file) {
let params = new FormData();
params.append("file", file);
let url = "http://139.155.48.151:8084/admin/auth/util/saveImg";
const res = await axios.post(url, params);
return res;
},
handleCreate() {
let params = {
activityInfo: {
activityName: this.title,
startTime: this.startTime1,
endTime: this.endTime1,
backImage: this.bg_imgs[0] ? this.bg_imgs[0].url : "",
logo: this.logo_imgs[0] ? this.logo_imgs[0].url : "",
joinLimit: this.maxNumber,
totalLimit: this.totalLimit,
des: this.message,
image: JSON.stringify(this.fileList)
}
};
API_Active.createActive(params).then(res => {
if (res.result === "fail") {
this.$toast(res.errorMsg);
return;
}
Toast.success("创建成功");
setTimeout(() => {
this.$router.push("/createSuccess");
}, 200);
});
},
timeFormat(time) {
let year = 1900 + time.getYear();
let month = "0" + (time.getMonth() + 1);
let date = "0" + time.getDate();
return year + "-" + month.substring(month.length-2, month.length) + "-" + date.substring(date.length-2, date.length)
+ " "
let hour = "0" + time.getHours();
let minute = "0" + time.getMinutes();
return (
year +
"-" +
month.substring(month.length - 2, month.length) +
"-" +
date.substring(date.length - 2, date.length) +
" " +
hour.substring(hour.length - 2, hour.length) +
":" +
minute.substring(minute.length - 2, minute.length) +
":00"
);
},
startTimeChange(e) {
let startTimeArr = e.getValues();
this.startTime1 = `${startTimeArr[0]}-${startTimeArr[1]}-${startTimeArr[2]}`;
},
handleStartTime(value) {
this.startTime1 = this.timeFormat(value)
this.startShow = false
this.startTime1 = this.timeFormat(value);
this.startShow = false;
},
handleEndTime(value) {
this.endTime1 = this.timeFormat(value)
this.endShow = false
this.endTime1 = this.timeFormat(value);
this.endShow = false;
},
endTimeChange(e) {
let endTimeArr = e.getValues();
......
<template>
<div class="container">
<div class="title">基础设置</div>
<div class="title">活动设置</div>
<van-cell-group class="all">
<van-cell title="活动标题" style="font-size:14px;">
<template slot="default">
......@@ -25,7 +25,7 @@
<van-popup v-model="basicInfo.startShow" position="bottom" :overlay="true">
<van-datetime-picker
v-model="basicInfo.startTime"
type="date"
type="datetime"
@cancel="basicInfo.startShow = false"
@confirm="handleBasicSTime"
@change="startTimeChange"
......@@ -47,7 +47,7 @@
<van-popup v-model="basicInfo.endShow" position="bottom" :overlay="true">
<van-datetime-picker
v-model="basicInfo.endTime"
type="date"
type="datetime"
@cancel="basicInfo.endShow = false"
@confirm="handleBasicETime"
@change="endTimeChange"
......@@ -56,113 +56,48 @@
</div>
</template>
</van-cell>
<van-cell title="领券条件" style="font-size:14px;">
<template slot="default">
<div class="condition">
<span class="phone">手机号必填</span>
<van-switch v-model="condition" size="20px" />
</div>
</template>
</van-cell>
</van-cell-group>
<div class="title">抽奖设置</div>
<van-cell-group class="all">
<van-cell style="font-size:14px;" center class="cs">
<template slot="title">
<span class="custom-title">每天抽奖</span>
<span class="small">(单人最多可抽奖次数)</span>
</template>
<template slot="default">
<div class="jpsl">
<van-field
class="right noborder"
readonly
clickable
:value="LuckyDraw.number"
placeholder="请输入次数"
@touchstart.native.stop="LuckyDraw.show = true"
/>
<van-number-keyboard
v-model="LuckyDraw.number"
:show="LuckyDraw.show"
@blur="LuckyDraw.show = false"
/>
</div>
</template>
<van-cell title="背景图片" style="font-size: 14px">
<van-uploader v-model="bg_imgs" :max-count="1" :after-read="afterBGRead" />
</van-cell>
<van-cell style="font-size:14px;" class="cs">
<template slot="title">
<span class="custom-title">最多中奖</span>
<span class="small">(单人最多可中奖次数)</span>
</template>
<template slot="default">
<div class="jpsl">
<van-field
class="right noborder"
readonly
clickable
:value="LuckyDraw.winningNumber"
placeholder="请输入次数"
@touchstart.native.stop="LuckyDraw.show2 = true"
/>
<van-number-keyboard
v-model="LuckyDraw.winningNumber"
:show="LuckyDraw.show2"
@blur="LuckyDraw.show2 = false"
/>
</div>
</template>
<van-cell title="活动Logo" style="font-size: 14px">
<van-uploader :max-count="1" v-model="logo_imgs" :after-read="afterLogoRead"></van-uploader>
</van-cell>
<van-cell style="font-size:14px;" class="cs gl">
<template slot="title">
<span class="custom-title">中奖概率</span>
</template>
<van-cell title="会员单日参与次数" style="font-size: 14px">
<template slot="default">
<div class="jpsl">
<van-field
class="right noborder"
readonly
clickable
:value="LuckyDraw.probability"
@touchstart.native.stop="LuckyDraw.show3 = true"
:value="basicInfo.jointimes"
placeholder="请输入限制次数"
@touchstart.native.stop="basicInfo.jointimes_show = true"
/>
<span class="bfb">%</span>
<van-number-keyboard
v-model="LuckyDraw.probability"
:show="LuckyDraw.show3"
@blur="LuckyDraw.show3 = false"
v-model="basicInfo.jointimes"
:show="basicInfo.jointimes_show"
:maxlength="6"
@blur="basicInfo.jointimes_show = false"
/>
</div>
</template>
</van-cell>
<van-cell style="font-size:14px;" class="task">
<template slot="title">
<span class="custom-title">做任务奖次数</span>
<div style="font-size:10px;">(开启后提醒顾客领取任务,如发朋友圈、加好友等,增加抽奖次数)</div>
</template>
<template slot="default">
<van-switch v-model="LuckyDraw.quantity" size="20px" class="right" />
</template>
</van-cell>
<van-cell style="font-size:14px;" class="cs">
<template slot="title">
<span class="custom-title">增加次数</span>
<span class="small">(点击“增加次数”按钮增加几次次数)</span>
</template>
<van-cell title="会员总参与次数" style="font-size: 14px">
<template slot="default">
<div class="jpsl">
<van-field
class="right noborder"
readonly
clickable
:value="LuckyDraw.addNumber"
placeholder="请输入次数"
@touchstart.native.stop="LuckyDraw.show4 = true"
:value="basicInfo.total_join"
placeholder="请输入限制次数"
@touchstart.native.stop="basicInfo.total_join_show = true"
/>
<van-number-keyboard
v-model="LuckyDraw.addNumber"
:show="LuckyDraw.show4"
@blur="LuckyDraw.show4 = false"
v-model="basicInfo.total_join"
:show="basicInfo.total_join_show"
:maxlength="6"
@blur="basicInfo.total_join_show = false"
/>
</div>
</template>
......@@ -177,6 +112,13 @@
class="close"
@click="removePrice(index)"
/>
<van-cell title="奖项设置">
<van-radio-group v-model="prizeList[index].type" class="right">
<van-radio name="1" style="float:left;margin-right:10px;">优惠券</van-radio>
<van-radio name="2" style="float:right;">谢谢参与</van-radio>
</van-radio-group>
</van-cell>
<template v-if="prizeList[index].type == 1">
<van-cell center>
<template slot="title">
<span class="custom-title">奖项名称</span>
......@@ -185,124 +127,48 @@
<van-field class="right" v-model="prizeList[index].name" placeholder="请输入奖项名称" />
</template>
</van-cell>
<div class="yhType">
<div class="yhbr">
<div class="top">
<span style="color:#2d476a;">优惠券类型</span>
<van-radio-group v-model="prizeList[index].type" class="right">
<van-radio name="1" style="float:left;margin-right:10px;">代金券</van-radio>
<van-radio name="2" style="float:right;">折扣券</van-radio>
</van-radio-group>
</div>
<div class="mj">
<div class="l-yh">
<div class="je">
<van-field
class="tm"
readonly
clickable
:value="prizeList[index].discountsMoney"
@touchstart.native.stop="
prizeList[index].discountsShow = true
"
placeholder="输入金额"
/>
<van-number-keyboard
v-model="prizeList[index].discountsMoney"
:show="prizeList[index].discountsShow"
@blur="prizeList[index].discountsShow = false"
/>
</div>
<span class="word">元优惠</span>
</div>
<div class="r-yh">
<van-checkbox v-model="prizeList[index].full"></van-checkbox>
<span class="word"></span>
<div class="je">
<van-cell title="选择优惠券" value="1" is-link @click="show = true" center />
<van-cell title="总发放数量限制" style="font-size:14px;">
<template slot="default">
<div class="jpsl">
<van-field
class="tm"
class="right noborder"
readonly
clickable
:value="prizeList[index].fullMoney"
@touchstart.native.stop="prizeList[index].fullShow = true"
placeholder="输入金额"
:value="prizeList[index].prize"
placeholder="请输入限制次数"
@touchstart.native.stop="prizeList[index].prizeShow = true"
/>
<van-number-keyboard
v-model="prizeList[index].fullMoney"
:show="prizeList[index].fullShow"
@blur="prizeList[index].fullShow = false"
/>
</div>
<span class="word end">元可用</span>
</div>
</div>
</div>
</div>
<div class="yhbr" style="padding: 0.4375rem;">
<div class="top">
<span style="color:#2d476a;">券有效期</span>
<van-radio-group
v-model="prizeList[index].timeline_type"
class="right"
@change="radioChange"
>
<van-radio name="1" style="float:left;margin-right:10px;">指定日期</van-radio>
<van-radio name="2" style="float:right;">有效天数</van-radio>
</van-radio-group>
</div>
</div>
<template v-if="prizeList[index].timeline_type == 1">
<van-cell title="开始时间" style="font-size:14px;">
<template slot="default">
<div class="jpsl">
<van-field
class="right"
v-model="prizeList[index].startTime1"
placeholder="选择活动开始时间"
readonly="readonly"
@click="prizeList[index].startShow = true"
/>
<van-popup v-model="prizeList[index].startShow" position="bottom" :overlay="true">
<van-datetime-picker
v-model="prizeList[index].startTime"
type="date"
@cancel="prizeList[index].startShow = false"
@confirm="handleStartTime(prizeList[index].startTime,index)"
@change="startTimeChange2(prizeList[index].startTime, index)"
v-model="prizeList[index].prize"
:show="prizeList[index].prizeShow"
:maxlength="6"
@blur="prizeList[index].prizeShow = false"
/>
</van-popup>
</div>
</template>
</van-cell>
<van-cell title="结束时间" style="font-size:14px;">
<van-cell title="每日发放数量限制" style="font-size:14px;">
<template slot="default">
<div class="jpsl">
<van-field
class="right"
v-model="prizeList[index].endTime1"
placeholder="选择活动结束时间"
readonly="readonly"
@click="prizeList[index].endShow = true"
class="right noborder"
readonly
clickable
:value="prizeList[index].prize"
placeholder="请输入限制次数"
@touchstart.native.stop="prizeList[index].prizeShow = true"
/>
<van-popup v-model="prizeList[index].endShow" position="bottom" :overlay="true">
<van-datetime-picker
v-model="prizeList[index].endTime"
type="date"
@cancel="prizeList[index].endShow = false"
@confirm="handleEndTime(prizeList[index].endTime,index)"
@change="endTimeChange2(prizeList[index].endTime, index)"
<van-number-keyboard
v-model="prizeList[index].prize"
:show="prizeList[index].prizeShow"
:maxlength="6"
@blur="prizeList[index].prizeShow = false"
/>
</van-popup>
</div>
</template>
</van-cell>
</template>
<template v-else></template>
<van-cell title="奖品数量" style="font-size:14px;">
<van-cell title="每人限领数量" style="font-size:14px;">
<template slot="default">
<div class="jpsl">
<van-field
......@@ -310,7 +176,7 @@
readonly
clickable
:value="prizeList[index].prize"
placeholder="请输入数量"
placeholder="请输入限制数量"
@touchstart.native.stop="prizeList[index].prizeShow = true"
/>
<van-number-keyboard
......@@ -322,29 +188,32 @@
</div>
</template>
</van-cell>
<van-cell style="font-size:14px;" center class="cs" label="此奖项每天最多可抽中的数量">
</template>
<van-cell style="font-size:14px;" class="cs gl">
<template slot="title">
<span class="custom-title">每日上限</span>
<!-- <span class="small"></span> -->
<span class="custom-title">中奖概率</span>
</template>
<template slot="default">
<div class="jpsl">
<van-field
class="right noborder"
readonly
clickable
:value="prizeList[index].limit"
placeholder="请输入次数"
@touchstart.native.stop="prizeList[index].limitShow = true"
:value="prizeList[index].probability"
@touchstart.native.stop="prizeList[index].probability_show = true"
/>
<span class="bfb">%</span>
<van-number-keyboard
v-model="prizeList[index].limit"
:show="prizeList[index].limitShow"
@blur="prizeList[index].limitShow = false"
v-model="prizeList[index].probability"
:show="prizeList[index].probability_show"
@blur="prizeList[index].probability_show = false"
/>
</div>
</template>
</van-cell>
<div class="add" @click="addPrice">添加奖项</div>
</van-cell-group>
<!-- 活动描述 -->
<div class="detail">
<div class="border">
<div class="des">活动描述</div>
......@@ -359,38 +228,67 @@
/>
</div>
</div>
<!-- 活动图片 -->
<div class="detail" style="margin-top:0;">
<div class="des">活动图片</div>
<van-uploader v-model="fileList" multiple :max-count="9" />
</div>
<!-- 奖品介绍 -->
<div class="detail">
<div class="border">
<div class="des">奖品介绍</div>
<van-field
class="area"
v-model="prize_produce"
rows="2"
autosize
type="textarea"
placeholder="请输入描述"
show-word-limit
/>
</div>
</div>
<div class="creat" @click="handleCreate">创建活动</div>
<van-action-sheet v-model="show" :actions="coupons" cancel-text="取消" />
</div>
</template>
<script>
import axios from "axios";
import * as API_Active from "@/api/active";
import { Toast } from 'vant';
import { Toast } from "vant";
export default {
data() {
return {
// 基础信息
logo_imgs: [],
bg_imgs: [],
show: false,
coupons: [
{ name: "选项" },
{ name: "选项" },
{ name: "选项", subname: "描述信息" }
],
basicInfo: {
title: "",
title: "第一个转盘活动",
startTime: new Date(),
startTime1: "",
startTime1: "2020-04-09 08:25:25",
endTime: new Date(),
endTime1: "",
endTime1: "2020-04-10 18:25:25",
startShow: false,
endShow: false
endShow: false,
jointimes: "2",
jointimes_show: false,
total_join: "4",
total_join_show: false
},
// 抽奖设置
LuckyDraw: {
name: "",
number: "",
winningNumber: "",
probability: "",
quantity: "",
addNumber: "",
number: "1",
winningNumber: "1",
quantity: true,
addNumber: "1",
show: false,
show2: false,
show3: false,
......@@ -399,55 +297,95 @@ export default {
// 奖品设置
prizeList: [
{
name: "",
timeLine_type: "",
type: "",
discountsMoney: "",
name: "奖1",
timeLine_type: "1",
type: "1",
discountsMoney: "1",
discountsShow: false,
full: "",
fullMoney: "",
fullShow: false,
validity: "",
startTime: new Date(),
startTime1: "",
startTime1: "2020-04-08 08:25:25",
startShow: false,
endTime: new Date(),
endTime1: "",
endTime1: "2020-04-16 18:25:25",
endShow: false,
prize: "",
prize: "1",
prizeShow: false,
limit: "",
limitShow: false
limit: "1",
limitShow: false,
probability: "5",
probability_show: false
}
],
title: "",
title2: "",
coupon: "",
newCustomer: "",
condition: "",
condition: "1",
type: "",
startShow: false,
endShow: false,
// 活动描述
message: "",
message: "123",
// 活动图片
fileList: [],
prize_produce: "456",
pTime: new Date(),
confirmTime: new Date()
};
},
methods: {
getCoupons() {
let id = sessionStorage.getItem("oyStallCode") || 1;
API_Active.getAllCouponsByOyStallCode(id).then(res => {
this.coupons = res.data;
});
},
async afterLogoRead(file) {
let logo_img = await this.getImgUrl(file.file);
if (logo_img.result === "success") {
let item = {
url: bg_img.data.imgPath,
status: "done",
message: "上传成功"
};
this.logo_imgs.push(item);
}
},
async afterBGRead(file) {
let bg_img = await this.getImgUrl(file.file);
if (bg_img.result === "success") {
let item = {
url: bg_img.data.imgPath,
status: "done",
message: "上传成功"
};
this.bg_imgs.push(item);
}
},
// 上传图片
async getImgUrl(file) {
let params = new FormData();
params.append("file", file);
let url = "http://139.155.48.151:8084/admin/auth/util/saveImg";
const res = await axios.post(url, params);
return res;
},
radioChange(val) {
// console.log(val);
},
handleCreate() {
console.log("创建活动");
// console.log(this.basicInfo);
// console.log(this.LuckyDraw);
// console.log(this.prizeList);
// console.log(this.message);
// console.log(this.fileList);
console.log(this.basicInfo);
console.log(this.LuckyDraw);
console.log(this.prizeList);
console.log(this.message);
console.log(this.fileList);
let params_prizeList = [];
this.prizeList.forEach(p => {
let temp = {};
temp.prizeName = p.name;
......@@ -459,29 +397,37 @@ export default {
temp.startTime = p.startTime1;
temp.endTime = p.endTime1;
temp.quantity = p.prize;
temp.probability = p.probability;
temp.limitReceive = p.limit;
params_prizeList.push(temp);
});
let params = {
activityInfo: {
id: 0,
activityName: this.basicInfo.title,
activityType: "wheel",
startTime: this.basicInfo.startTime1,
endTime: this.basicInfo.endTime1,
backImage: this.bg_imgs[0] ? this.bg_imgs[0].url : "",
logo: this.logo_imgs[0] ? this.logo_imgs[0].url : "",
joinLimit: this.basicInfo.jointimes,
totalLimit: this.basicInfo.total_join,
joinLimit: this.LuckyDraw.number,
winLimit: this.LuckyDraw.winningNumber,
isAdd: this.LuckyDraw.addNumber ? 1 : 0,
addLimit: this.LuckyDraw.addNumber
desc: this.message,
image: JSON.stringify(this.fileList),
prizeDesc: this.prize_produce
},
activityPrizes: params_prizeList
};
console.log(params);
API_Active.createActive(params).then(res => {
Toast.success('创建成功');
if (res.result === "fail") {
this.$toast(res.errorMsg);
return;
}
Toast.success("创建成功");
setTimeout(() => {
this.$router.push('/createSuccess');
this.$router.push("/createSuccess");
}, 200);
});
},
......@@ -495,7 +441,6 @@ export default {
this.prizeList[index].startTime1 = this.timeFormat(e);
console.log(this.prizeList[index].startTime1, "2222");
},
////////
handlePSTime(index) {
this.prizeList[index].startTime1 = this.timeFormat(this.confirmTime);
this.prizeList[index].startShow = false;
......@@ -504,13 +449,19 @@ export default {
let year = 1900 + time.getYear();
let month = "0" + (time.getMonth() + 1);
let date = "0" + time.getDate();
let hour = "0" + time.getHours();
let minute = "0" + time.getMinutes();
return (
year +
"-" +
month.substring(month.length - 2, month.length) +
"-" +
date.substring(date.length - 2, date.length) +
" "
" " +
hour.substring(hour.length - 2, hour.length) +
":" +
minute.substring(minute.length - 2, minute.length) +
":00"
);
},
endTimeChange(e) {
......@@ -596,6 +547,10 @@ export default {
return newString;
},
addPrice() {
if (this.prizeList.length > 7) {
this.$toast("最多设置8个奖项");
return;
}
this.prizeList.push({
name: "",
type: "",
......@@ -628,6 +583,7 @@ export default {
mounted() {
this.pTime = this.timeFormat(this.pTime);
console.log(this.pTime, "time");
this.getCoupons();
}
};
</script>
......
......@@ -5,7 +5,7 @@
<!-- <img src="../../../public/img/zpbg.png" alt="" /> -->
</div>
<div class="title">
<span class="bt">服装店幸运抽奖</span>
<span class="bt">大转盘活动</span>
<div class="tb">
<img src="../../../public/img/zp.png" alt="" />
大转盘抽奖
......
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