|
|
@@ -4,6 +4,7 @@
|
|
|
<meta charset="UTF-8">
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
<title>转盘抽奖</title>
|
|
|
+ <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/element-plus/dist/index.css"/>
|
|
|
<style>
|
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
|
[v-cloak] {
|
|
|
@@ -86,9 +87,9 @@
|
|
|
</div>
|
|
|
|
|
|
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
|
|
|
+ <script src="//cdn.jsdelivr.net/npm/element-plus"></script>
|
|
|
<script>
|
|
|
const { createApp, onMounted, onUnmounted, ref, reactive, toRefs, computed, nextTick } = Vue
|
|
|
-
|
|
|
createApp({
|
|
|
setup () {
|
|
|
const state = reactive({
|
|
|
@@ -160,9 +161,13 @@
|
|
|
}
|
|
|
|
|
|
const start = () => {
|
|
|
+ ElementPlus.ElMessage({
|
|
|
+ message: '已无抽奖次数！',
|
|
|
+ type: 'warning',
|
|
|
+ })
|
|
|
+ return
|
|
|
if (!state.isRunning) {
|
|
|
state.isRunning = true
|
|
|
-
|
|
|
console.log('开始抽奖，后台请求中奖奖品')
|
|
|
// 请求返回的奖品编号 这里使用随机数
|
|
|
const prizeId = getRandomNum()
|
|
|
@@ -201,7 +206,7 @@
|
|
|
start
|
|
|
}
|
|
|
}
|
|
|
- }).mount('#app')
|
|
|
+ }).use(ElementPlus).mount('#app')
|
|
|
</script>
|
|
|
</body>
|
|
|
</html>
|
