193 lines
4.8 KiB
Vue
193 lines
4.8 KiB
Vue
<template>
|
|
<div>
|
|
<h1 class="brand-info__text">{{dataForm.verify}}</h1>
|
|
<h2 class="brand-info__text">{{dataForm.uuid}}</h2>
|
|
|
|
<el-table
|
|
:data="data"
|
|
style="width: 100%">
|
|
<el-table-column
|
|
prop="name"
|
|
label="姓名"
|
|
width="180">
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="mobile"
|
|
label="电话">
|
|
</el-table-column>
|
|
</el-table>
|
|
<el-button type="primary" round @click="btnClick">{{dataForm.userName}}</el-button>
|
|
<el-table
|
|
:data="luckdata"
|
|
style="width: 100%">
|
|
<el-table-column
|
|
prop="name"
|
|
label="中将姓名"
|
|
width="180">
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
prop="goodsName"
|
|
label="获奖信息">
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="mobile"
|
|
label="电话">
|
|
</el-table-column>
|
|
</el-table>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { apiGetLuck } from '@/api/api_staff'
|
|
import { apiUpdateLuck } from '@/api/api_staff'
|
|
var dingCode
|
|
export default {
|
|
data () {
|
|
return {
|
|
isloading: false,
|
|
dataForm: {
|
|
userName: '开始',
|
|
password: '',
|
|
uuid: '',
|
|
// captcha: ''
|
|
verify: ''
|
|
},
|
|
// captchaPath: '' // 图像验证码请求地址
|
|
time: -1,
|
|
rand: 0,
|
|
timer: false,
|
|
hasSendCode: false,
|
|
query: {
|
|
luckId: 2//活动编号
|
|
},
|
|
data: [],
|
|
luckdata: [],
|
|
requst: []
|
|
}
|
|
},
|
|
created () {
|
|
// this.handleGetImgCaptcha()
|
|
},
|
|
mounted () {
|
|
if(this.getLucData()){
|
|
|
|
}
|
|
},
|
|
methods: {
|
|
btnClick (btn) {
|
|
if(this.requst.isFinish === 0){
|
|
if(this.timer === false){
|
|
this.time++
|
|
this.timer = true
|
|
this.dataTimeChange ();
|
|
this.dataForm.userName = '停止'
|
|
}else{
|
|
this.timer = false
|
|
this.dataForm.userName = '开始'
|
|
for(let item of this.data) {
|
|
item.goodsName = this.requst.luckGoodsReqs[this.time].name
|
|
item.goodsId = this.requst.luckGoodsReqs[this.time].id
|
|
item.luckId = this.requst.id
|
|
item.isLuck = 1
|
|
this.luckdata.unshift(item)
|
|
}
|
|
//这里更新中奖结果，并返回未中奖的数据
|
|
apiUpdateLuck(this.luckdata).then(res => {
|
|
console.log(res)
|
|
if (res && res.code === 0) {
|
|
console.log(res.luck)
|
|
this.requst = res.luck
|
|
if(res.luck.isFinish === 1){
|
|
this.dataForm.verify=res.luck.name + '——活动结束'
|
|
}
|
|
} else {
|
|
this.$message.error(res.msg)
|
|
}
|
|
})
|
|
}
|
|
}
|
|
|
|
|
|
},
|
|
getLucData () {
|
|
apiGetLuck(this.query).then(res => {
|
|
|
|
console.log(res)
|
|
if (res && res.code === 0) {
|
|
console.log('获取token')
|
|
if(res.luck.isFinish === 0){
|
|
this.requst = res.luck
|
|
this.dataForm.verify=res.luck.name
|
|
}else{
|
|
this.dataForm.verify=res.luck.name + '——活动已结束'
|
|
this.luckdata = res.luck.luckRecordReqs
|
|
}
|
|
} else {
|
|
this.dataForm.verify='无法登记。' + res.msg
|
|
this.$message.error(res.msg)
|
|
}
|
|
})
|
|
},
|
|
dataTimeChange () {
|
|
if(this.time < this.requst.luckGoodsReqs.length){
|
|
this.dataForm.uuid = this.requst.luckGoodsReqs[this.time].name
|
|
setTimeout(() =>{
|
|
this.randData(this.requst.luckGoodsReqs[this.time].counts)
|
|
}, 20)
|
|
}
|
|
},
|
|
randData (count) {
|
|
if (this.timer === true) {
|
|
var obj = []
|
|
if(count > this.requst.luckRecordReqs.length){//当奖品数量大于人数时，由人数限制
|
|
console.log('奖品数大于报名人数')
|
|
count = this.requst.luckRecordReqs.length
|
|
console.log(count)
|
|
}
|
|
for(var i = 0; i < count; i++){
|
|
|
|
if(this.rand >= this.requst.luckRecordReqs.length){
|
|
this.rand = 0;
|
|
}
|
|
obj.push(this.requst.luckRecordReqs[this.rand])
|
|
this.rand++
|
|
}
|
|
this.data = obj
|
|
setTimeout(() =>{
|
|
this.randData(count)
|
|
}, 20)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.el-row {
|
|
margin-bottom: 20px;
|
|
}
|
|
.el-col {
|
|
border-radius: 4px;
|
|
}
|
|
.bg-purple-dark {
|
|
background: #99a9bf;
|
|
}
|
|
.bg-purple {
|
|
background: #d3dce6;
|
|
}
|
|
.bg-purple-light {
|
|
background: #e5e9f2;
|
|
}
|
|
.grid-content {
|
|
border-radius: 4px;
|
|
min-height: 36px;
|
|
}
|
|
.row-bg {
|
|
padding: 10px 0;
|
|
background-color: #f9fafc;
|
|
}
|
|
</style>
|
|
|