283 lines
7.6 KiB
Vue
283 lines
7.6 KiB
Vue
<template>
|
||
<view class="container">
|
||
<v-navigation-bar title-color="#333" background-color="#fff" title="活动列表">
|
||
</v-navigation-bar>
|
||
<view class="body">
|
||
<uni-card :title="item.name" v-for="item in activeList">
|
||
<text class="uni-body">{{ item.remark }}</text>
|
||
<view slot="actions" class="card-actions">
|
||
<picker v-if="item.type=='kkyl'" @change="bindPickerChange" :value="index" :range="array">
|
||
<button type="primary">参加</button>
|
||
</picker>
|
||
<view v-if="item.type=='zcyl'">
|
||
<button @click="joinAct(item)" v-if="item.isJoin!='1'" type="primary">参加</button>
|
||
<button @click="joinAct(item)" v-if="item.isJoin=='1'" disabled type="primary">参加</button>
|
||
</view>
|
||
<view v-if="item.type=='czyl'">
|
||
<button @click="joinCzylActPrex(item)" type="primary">参加</button>
|
||
</view>
|
||
</view>
|
||
</uni-card>
|
||
<view style="text-align: center" v-if="activeList.length==0">
|
||
<image class="" src="@/static/images/nothing.png" ></image>
|
||
</view>
|
||
</view>
|
||
<view>
|
||
<!-- 输入框示例 -->
|
||
<uni-popup ref="inputDialog" type="dialog">
|
||
<uni-popup-dialog ref="inputClose" mode="input" title="充值" value=""
|
||
placeholder="请输入充值金额" @confirm="dialogInputConfirm"></uni-popup-dialog>
|
||
</uni-popup>
|
||
</view>
|
||
</view>
|
||
|
||
</template>
|
||
|
||
<script>
|
||
import VNavigationBar from '@/components/VNavigationBar.vue'
|
||
import request from "@/utils/request";
|
||
import {getToken,getUserInfo} from '@/utils/auth'
|
||
export default {
|
||
components: {
|
||
VNavigationBar,
|
||
},
|
||
data() {
|
||
return {
|
||
//可以点击
|
||
canClick:true,
|
||
value:"",
|
||
index:0,
|
||
array:[],
|
||
couponList:[],
|
||
orderInfo:{},
|
||
customInfo: {},
|
||
activeList: [],
|
||
//开卡有礼活动id
|
||
kkylActId:"",
|
||
//充值有礼活动id
|
||
czylActId:"",
|
||
//充值金额
|
||
topUpAmount:0.0,
|
||
tabList: [{
|
||
value: 0,
|
||
title: '礼包券'
|
||
},
|
||
{
|
||
value: 1,
|
||
title: '卡包'
|
||
}
|
||
],
|
||
activeKey: 0
|
||
};
|
||
},
|
||
onShow(data) {
|
||
if(!getToken()){
|
||
uni.reLaunch({
|
||
url: '/pages/login/login'
|
||
})
|
||
}else{
|
||
//直接取缓存中的用户信息
|
||
this.customInfo = JSON.parse(getUserInfo())
|
||
}
|
||
},
|
||
onLoad(data) {
|
||
|
||
},
|
||
methods: {
|
||
preventKeyboard(e) {
|
||
// 阻止键盘弹出
|
||
e.preventDefault();
|
||
// 将焦点移除，这样就不会有键盘弹出
|
||
e.target.blur();
|
||
},
|
||
isNumber(value) {
|
||
return /^\d+(\.\d+)?$/.test(value);
|
||
},
|
||
dialogInputConfirm(val) {
|
||
if(this.isNumber(val)){
|
||
console.log(val)
|
||
this.topUpAmount = val
|
||
//充值下单
|
||
this.joinCzylAct()
|
||
// 关闭窗口后，恢复默认内容
|
||
this.$refs.inputDialog.close()
|
||
}else{
|
||
uni.showToast({
|
||
title: '请输入数字！',
|
||
icon: 'none'
|
||
})
|
||
}
|
||
},
|
||
bindPickerChange(e){
|
||
this.index = e.detail.value
|
||
console.log("index",this.index)
|
||
this.joinKkylAct()
|
||
},
|
||
//查询营销活动列表
|
||
async getActive() {
|
||
this.activeList=[]
|
||
this.couponList=[]
|
||
this.array=[]
|
||
const data = {
|
||
cusId: this.customInfo.id
|
||
}
|
||
await request({
|
||
url: '/userClient/customer/activeList',
|
||
method: 'get',
|
||
params:data
|
||
}).then((res) => {
|
||
this.activeList = res.data
|
||
for(var i = 0; i < this.activeList.length; i++) {
|
||
if(this.activeList[i].type=="kkyl"){
|
||
this.kkylActId = this.activeList[i].id
|
||
request({
|
||
url: "/userClient/customer/getActive",
|
||
method: "get",
|
||
params:{id:this.activeList[i].id}
|
||
}).then((res) => {
|
||
if(res.data.hasOwnProperty("couponList")&&res.data.couponList.length>0){
|
||
this.couponList = res.data.couponList
|
||
for(var i = 0; i < res.data.couponList.length; i++) {
|
||
var coupon = res.data.couponList[i]
|
||
this.array.push(coupon.name+"("+coupon.amount+")")
|
||
}
|
||
this.$forceUpdate()
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
|
||
},
|
||
/**
|
||
* 参加注册活动
|
||
* @param item
|
||
* @returns {Promise<void>}
|
||
*/
|
||
async joinAct(item) {
|
||
if(this.canClick){
|
||
this.canClick = false
|
||
let dataObj = {}
|
||
dataObj.cusId = this.customInfo.id
|
||
dataObj.activeId = item.id
|
||
await request({
|
||
url: "/userClient/customer/attendActive",
|
||
method: "POST",
|
||
data: dataObj
|
||
}).then((res) => {
|
||
this.getActive()
|
||
uni.showToast({
|
||
title: '礼包领取成功！',
|
||
icon: 'none'
|
||
})
|
||
this.canClick = true
|
||
console.log(res);
|
||
})
|
||
}
|
||
},
|
||
/**
|
||
* 参加开卡有礼活动
|
||
* @returns {Promise<void>}
|
||
*/
|
||
async joinKkylAct(){
|
||
let dataObj = {}
|
||
dataObj.cusId = this.customInfo.id
|
||
dataObj.activeId = this.kkylActId
|
||
dataObj.accountType='01'
|
||
dataObj.selectCoupon=[this.couponList[this.index]]
|
||
await request({
|
||
url: "/userClient/customer/attendActive",
|
||
method: "POST",
|
||
data:dataObj
|
||
}).then((res) => {
|
||
console.log(res);
|
||
//拿到开卡有礼订单 TODO 对接支付
|
||
this.orderInfo = res.data
|
||
this.goPay(this.orderInfo)
|
||
|
||
})
|
||
},
|
||
async goPay(data) {
|
||
let that = this
|
||
await request({
|
||
url: '/userClient/pay/toPay',
|
||
method: 'get',
|
||
params: {orderId: data.id}
|
||
}).then((ress) => {
|
||
wx.requestPayment({
|
||
timeStamp: ress.data.timeStamp, // 时间戳，从1970年1月1日00:00:00至今的秒数，即当前的时间
|
||
nonceStr: ress.data.nonceStr, // 随机字符串，长度为32个字符以下。
|
||
package: ress.data.package, // 统一下单接口返回的 prepay_id 参数值，格式如“prepay_id=*”
|
||
signType: ress.data.signType, // 签名算法类型，默认为 MD5，支持RSA等其他加密算法
|
||
paySign: ress.data.paySign, // 签名，详见签名生成算法
|
||
success: function (res) {
|
||
console.log('成功',res);
|
||
if( res.errMsg = 'requestPayment:ok'){
|
||
uni.showToast({
|
||
title:'支付成功'
|
||
})
|
||
}
|
||
// 支付成功后的回调函数， res.errMsg = 'requestPayment:ok'
|
||
},
|
||
|
||
})
|
||
})
|
||
},
|
||
/**
|
||
* 充值有礼前置方法
|
||
* @returns {Promise<void>}
|
||
*/
|
||
async joinCzylActPrex(item){
|
||
this.$refs.inputDialog.open()
|
||
this.czylActId = item.id
|
||
},
|
||
/**
|
||
* 充值有礼
|
||
* @returns {Promise<void>}
|
||
*/
|
||
async joinCzylAct(){
|
||
let dataObj = {}
|
||
dataObj.cusId = this.customInfo.id
|
||
dataObj.activeId = this.czylActId
|
||
dataObj.accountType='01'
|
||
dataObj.topUpAmount=this.topUpAmount
|
||
await request({
|
||
url: "/userClient/customer/attendActive",
|
||
method: "POST",
|
||
data:dataObj
|
||
}).then((res) => {
|
||
console.log(res);
|
||
//拿到充值有礼订单 TODO 对接支付
|
||
this.orderInfo = res.data
|
||
this.goPay(this.orderInfo)
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.container {
|
||
height: 100%;
|
||
background-color: #F0F1F5;
|
||
|
||
display: flex;
|
||
flex-direction: column;
|
||
|
||
.body {
|
||
flex: 1;
|
||
height: 0;
|
||
box-sizing: border-box;
|
||
padding: 30rpx 32rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
row-gap: 20rpx;
|
||
|
||
overflow: auto;
|
||
|
||
}
|
||
}
|
||
|
||
</style>
|
||
|