wangyifang
/
h5-service-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

up

Browse Source
master
刘翔宇-旅管家 2 years ago
parent c7449e4ecf c5f0bf3218
commit feb70a9b06
4 changed files with 291 additions and 237 deletions
Show Stats Download Patch File Download Diff File

1
src/api/activity/drawPrize.js
Unescape View File

@ -29,7 +29,6 @@ export function destroyDrawLog(params) {
export function save(data) { export function save(data) {
return request({ return request({
url: '/api/admin/draw-prize/save', url: '/api/admin/draw-prize/save',

6
src/components/XyTable/index.vue
Unescape View File

@ -166,7 +166,10 @@ export default {
}, },
toggleAllSelection() { toggleAllSelection() {
this.$refs.table.toggleAllSelection() this.$refs.table.toggleAllSelection()
} },
getSelection(){
return this.$refs.table?.store?.states?.selection ?? []
},
}, },
created() { created() {
this.initLoad() this.initLoad()
@ -310,6 +313,7 @@ export default {
prop={item.prop} prop={item.prop}
sortable={item.sortable ?? true} sortable={item.sortable ?? true}
type={item.type} type={item.type}
reserve-selection={ item.type === 'selection' ? item.reserveSelection : false }
selectable={item.selectable} selectable={item.selectable}
scopedSlots={item.type === 'expand' ? { scopedSlots={item.type === 'expand' ? {
default(props){ default(props){

35
src/views/activity/drawPrizeLog.vue
Unescape View File

@ -1,3 +1,4 @@
<template> <template>
<div> <div>
<lx-header icon="md-apps" style="margin-bottom: 10px; border: 0px; margin-top: 15px" text="项目抽奖日志"> <lx-header icon="md-apps" style="margin-bottom: 10px; border: 0px; margin-top: 15px" text="项目抽奖日志">
@ -26,12 +27,13 @@
<Button style="margin-left: 10px" type="error" @click="doExcel">导出</Button> <Button style="margin-left: 10px" type="error" @click="doExcel">导出</Button>
<Button style="margin-left: 10px" type="primary" @click="doGet">设置已领取</Button> <Button style="margin-left: 10px" type="primary" @click="doGet">设置已领取</Button>
<Button style="margin-left: 10px" type="warning" @click="doNoGet">设置未领取</Button> <Button style="margin-left: 10px" type="warning" @click="doNoGet">设置未领取</Button>
<Button style="margin-left: 10px" type="warning" ghost @click="del">批量删除</Button>
</div> </div>
</slot> </slot>
</lx-header> </lx-header>
<xy-table :list="list" :table-item="table" @pageSizeChange="pageSizeChange" @pageIndexChange="pageChange" <xy-table ref="table" :list="list" :table-item="table" @pageSizeChange="pageSizeChange" @pageIndexChange="pageChange"
:total="total" @delete="deleteitem" @selectAllClick="handleSelectionChange">> :total="total" @delete="deleteitem" @selectAllClick="handleSelectionChange">>
<template v-slot:btns> <template v-slot:btns>
@ -69,7 +71,8 @@
width: 36, width: 36,
sortable: false, sortable: false,
type: 'selection', type: 'selection',
fixed: "left" fixed: "left",
reserveSelection: true
}, },
{ {
prop: 'activity_list.name', prop: 'activity_list.name',
@ -120,6 +123,34 @@
} }
}, },
methods: { methods: {
del () {
let that = this
this.$confirm("确认删除吗？",{
beforeClose(action,instance,done){
if (action === 'confirm') {
instance.confirmButtonLoading = true;
instance.confirmButtonText = '删除中..';
instance.confirmButtonLoading = false;
let option = {}
that.$refs['table'].getSelection().forEach((i,index) => {
option[`id[${index}]`] = i.id
})
destroyDrawLog(option).then(res => {
done()
})
} else {
done()
}
}
}).then(res => {
this.$message({
type: 'success',
message: '删除成功'
})
this.load()
})
},
doGet() { doGet() {
}, },

86
src/views/page/MidAutumnLotteryDraw.vue
Unescape View File

@ -31,14 +31,14 @@
</div> </div>
<div class="right" :style="{ 'height': maxHeight }"> <div class="right" :style="{ 'height': maxHeight }">
<div class="numbers" :class="{ 'numbers-active': isEnd }" ref="numbers"> <div class="numbers" :class="{ 'numbers-active': !isEnd }" ref="numbers">
<div <div
class="numbers__item" class="numbers__item"
:style="{ :style="{
'animation-timing-function': flag ? '' : 'ease-out' 'animation-timing-function': flag ? '' : 'ease-out'
}" }"
:class="{ :class="{
'numbers__item--active': isEnd 'numbers__item--active': !isEnd
? !!resultNumbers.find((i) => i === index) ? !!resultNumbers.find((i) => i === index)
: !!resultNumbers.find((i) => i === item), : !!resultNumbers.find((i) => i === item),
}" }"
@ -51,13 +51,13 @@
</div> </div>
<div <div
v-show="isEnd" v-show="!isEnd"
class="numbers__item" class="numbers__item"
:style="{ :style="{
'animation-timing-function': flag ? '' : 'ease-out' 'animation-timing-function': flag ? '' : 'ease-out'
}" }"
:class="{ :class="{
'numbers__item--active': isEnd 'numbers__item--active': !isEnd
? !!resultNumbers.find((i) => i === index) ? !!resultNumbers.find((i) => i === index)
: !!resultNumbers.find((i) => i === item), : !!resultNumbers.find((i) => i === item),
}" }"
@ -72,15 +72,21 @@
</div> </div>
</div> </div>
<el-image <button class="btn" :disabled="isOver"
:style="{ filter: flag ? 'grayscale(90%)' : '' }" :style="{ filter: isOver ? 'grayscale(90%)' : '' }"
v-if="$route.query.result != 1" v-if="$route.query.result != 1"
:lazy="false" @click="draw">
class="btn" <strong>{{ (flag || isOver) ? '结束抽奖' : '开始抽奖' }}</strong>
:src="require('@/assets/mdLotteryDraw/button.png')" </button>
fit="cover" <!-- <el-image-->
@click="draw" <!-- :style="{ filter: flag ? 'grayscale(90%)' : '' }"-->
></el-image> <!-- v-if="$route.query.result != 1"-->
<!-- :lazy="false"-->
<!-- class="btn"-->
<!-- :src="require('@/assets/mdLotteryDraw/button.png')"-->
<!-- fit="cover"-->
<!-- @click="draw"-->
<!-- ></el-image>-->
</div> </div>
</template> </template>
@ -95,7 +101,8 @@ export default {
maxHeight: '40vh', maxHeight: '40vh',
bkg, bkg,
flag: false, //是否开始 flag: false, //是否开始
isEnd: false, //视图结束 isEnd: true, //视图结束
isOver: false,//抽奖是否结束
timer: null, timer: null,
config: { config: {
draw_prize: {}, draw_prize: {},
@ -144,6 +151,7 @@ export default {
}, },
draw: throttle(async function () { draw: throttle(async function () {
if (this.isOver) return
if (!this.flag) { if (!this.flag) {
console.log("开始抽奖"); console.log("开始抽奖");
try { try {
@ -156,35 +164,36 @@ export default {
); );
this.result = result.draw_numbers; this.result = result.draw_numbers;
this.flag = true; this.flag = true;
this.isEnd = true; this.isEnd = false;
this.timer = setInterval(() => { this.timer = setInterval(() => {
let set = new Set(); // let set = new Set();
while (set.size < result.draw_numbers.length) { // while (set.size < result.draw_numbers.length) {
let num = Math.floor( // let num = Math.floor(
Math.random() * this.config.numbers_list.length // Math.random() * this.config.numbers_list.length
); // );
set.add(num); // set.add(num);
} // }
//
this.resultNumbers = Array.from(set); // this.resultNumbers = Array.from(set);
if (!this.flag) { if (!this.flag) {
clearInterval(this.timer); clearInterval(this.timer);
setTimeout(() => { setTimeout(() => {
this.resultNumbers = result.draw_numbers; this.resultNumbers = result.draw_numbers;
this.isEnd = false; this.isEnd = true;
this.isOver = true;
}, 150); }, 150);
} }
}, 150); }, 150);
setTimeout(() => {
this.flag = false;
console.log("结束抽奖");
}, 3000);
} catch (err) { } catch (err) {
console.log(err); console.log(err);
} }
} else {
this.flag = false;
console.log("结束抽奖");
} }
}), }),
}, },
@ -201,12 +210,13 @@ export default {
set.add( set.add(
this.config.numbers_list[ this.config.numbers_list[
Math.floor(Math.random() * this.config.numbers_list.length) Math.floor(Math.random() * this.config.numbers_list.length)
] ].toString().padStart(3,'0')
); );
} }
return Array.from(set).sort(() => Math.random() - 0.5); return Array.from(set).sort(() => Math.random() - 0.5);
} }
return this.config.numbers_list return this.config.numbers_list
.sort(() => Math.random() - 0.5) .sort(() => Math.random() - 0.5)
.slice(0, 36); .slice(0, 36);
@ -311,11 +321,13 @@ export default {
} }
@keyframes blur { @keyframes blur {
from { from {
text-shadow: 2px 4px #00000066;
filter: blur(1.5px) drop-shadow(0 0 4px #00000055) drop-shadow(0 0 8px #00000033); filter: blur(1.5px) drop-shadow(0 0 4px #00000055) drop-shadow(0 0 8px #00000033);
} }
to { to {
text-shadow: 2px 4px #00000066;
filter: blur(1.5px) drop-shadow(0 0 4px #00000055) drop-shadow(0 0 8px #00000033); filter: blur(1.5px) drop-shadow(0 0 4px #00000055) drop-shadow(0 0 8px #00000033);
transform: translateY(-300%); transform: translateY(-200%);
} }
} }
&__item { &__item {
@ -374,13 +386,21 @@ export default {
} }
} }
.btn { .btn {
border-width: 0 2px 2px 0;
display: block;
cursor: pointer; cursor: pointer;
text-align: center;
font-size: 2.6em;
width: 46.67%; width: 46.67%;
display: flex; font-weight: 900;
justify-content: center;
transition: all 0.2s; transition: all 0.2s;
background: linear-gradient(to bottom,rgb(242, 172, 106),rgb(247, 232, 203));
border-radius: 6px;
color: rgb(152, 50, 22);
box-shadow: 1px 4px 10px 6px #00000055;
margin: 4.5vh auto 0 auto; margin: 4.2vh auto 0 auto;
padding: 10px 0;
} }
} }
</style> </style>

Write Preview
Loading…
Cancel
Save