123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475 |
- <template>
- <div class="prizeDrawBox">
- <!-- <city @inputChange="null"></city> -->
- <gridPage v-if="props.type === '1'" :lotteryId="props.lotteryId" @end="endCallback"></gridPage>
- <slotMachinePage v-if="props.type === '2'" :lotteryId="props.lotteryId" height="120" @end="endCallback"></slotMachinePage>
- <CtDialog :visible="showDialog" titleClass="text-h6" :footer="false" :widthType="3" title="抽奖详情" @close="showDialog = false">
- <div class="d-flex align-center flex-column">
- <svg-icon name="submit" size="300"></svg-icon>
- {{ prizeData?.prompt }}
- <!-- <div class="mt-5 font-weight-bold color-primary text-decoration-underline cursor-pointer" @click="emit('success')">点击前往“我的-我的奖品”中领取</div> -->
- <div class="my-10">
- <v-btn color="primary" variant="outlined" width="120" @click="showDialog = false">取 消</v-btn>
- <v-btn color="primary" width="120" class="ml-5" @click.stop="handleReceive">前往领取</v-btn>
- </div>
- </div>
- </CtDialog>
- </div>
- </template>
- <script setup>
- defineOptions({ name: 'prizeDraw'})
- import city from './prizeDraw/city.vue'
- import gridPage from './prizeDraw/grid.vue'
- import slotMachinePage from './prizeDraw/slotMachine.vue'
- import { ref } from 'vue'
- const emit = defineEmits(['success'])
- const props = defineProps({
- lotteryId: [Number, String],
- type: {
- type:String,
- default: '1'
- }
- })
- // 抽中奖品信息
- const showDialog = ref(false)
- const prizeData = ref({})
- const endCallback = (value) => {
- console.log(value.prize, '抽中的奖品')
- prizeData.value = value.prize
- showDialog.value = true
- }
- // const handleReceive = () => {
- // showDialog.value = false
- // }
- </script>
- <style scoped lang="scss">
- .prizeDrawBox {
- padding: 40px;
- background-color: var(--default-bgc);
- display: flex;
- flex-direction: column;
- // justify-content: center;
- align-items: center;
- }
- .prizeDraw {
- margin: 0 auto;
- cursor: pointer;
- }
- .numberBox {
- font-size: 20px;
- font-weight: bold;
- padding: 2px 38px;
- border-bottom: 3px solid var(--v-primary-base);
- }
- .colorBase {
- color: var(--v-primary-base);
- margin: 0 6px;
- font-size: 22px;
- }
- </style>
|