85 lines
2.5 KiB
Vue
85 lines
2.5 KiB
Vue
<script setup lang="ts">
|
|
import { onMounted,ref } from 'vue'
|
|
import useStore from '@/store'
|
|
import { storeToRefs } from 'pinia'
|
|
import PlayMusic from '@/components/PlayMusic/index.vue'
|
|
|
|
import { themeChange } from 'theme-change'
|
|
|
|
const globalConfig = useStore().globalConfig
|
|
const prizeConfig = useStore().prizeConfig
|
|
const system=useStore().system
|
|
const { getTheme: localTheme } = storeToRefs(globalConfig)
|
|
const { getPrizeConfig: prizeList } = storeToRefs(prizeConfig)
|
|
// const { getIsMobile: isMobile } = storeToRefs(system)
|
|
|
|
const tipDialog=ref()
|
|
// const isMobileValue = ref(structuredClone(isMobile.value))
|
|
const setLocalTheme = (theme: any) => {
|
|
themeChange(theme.name)
|
|
}
|
|
|
|
// 设置当前奖列表
|
|
const setCurrentPrize = () => {
|
|
if (prizeList.value.length <= 0) {
|
|
return
|
|
}
|
|
for (let i = 0; i < prizeList.value.length; i++) {
|
|
if (!prizeList.value[i].isUsed) {
|
|
prizeConfig.setCurrentPrize(prizeList.value[i])
|
|
|
|
break
|
|
}
|
|
}
|
|
|
|
return
|
|
}
|
|
// 判断是否手机端访问
|
|
const judgeMobile=()=>{
|
|
const ua = navigator.userAgent
|
|
const isAndroid = ua.indexOf('Android') > -1 || ua.indexOf('Adr') > -1
|
|
const isIOS =!!ua.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)
|
|
|
|
system.setIsMobile(isAndroid||isIOS)
|
|
|
|
return isAndroid||isIOS
|
|
}
|
|
// 判断是否chrome或者edge访问
|
|
const judgeChromeOrEdge=()=>{
|
|
const ua = navigator.userAgent
|
|
const isChrome = ua.indexOf('Chrome') > -1
|
|
const isEdge = ua.indexOf('Edg') > -1
|
|
|
|
system.setIsChrome(isChrome)
|
|
|
|
return isChrome||isEdge
|
|
}
|
|
onMounted(() => {
|
|
setLocalTheme(localTheme.value)
|
|
setCurrentPrize()
|
|
if(judgeMobile()||!judgeChromeOrEdge()){
|
|
tipDialog.value.showModal()
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<dialog id="my_modal_1" ref="tipDialog" class="border-none modal">
|
|
<div class="modal-box">
|
|
<h3 class="text-lg font-bold">提示!</h3>
|
|
<p class="py-4" v-if="judgeMobile()">请使用PC进行访问以获得最佳显示效果</p>
|
|
<p class="py-4" v-if=" !judgeChromeOrEdge()">请使用最新版Chrome或者Edge浏览器</p>
|
|
<div class="modal-action">
|
|
<form method="dialog" class="flex justify-start w-full gap-3">
|
|
<!-- if there is a button in form, it will close the modal -->
|
|
<button class="btn">确定</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</dialog>
|
|
<router-view></router-view>
|
|
<PlayMusic class="absolute right-0 bottom-1/2"></PlayMusic>
|
|
</template>
|
|
|
|
<style scoped lang="scss"></style>
|