zhaoma/src/App.vue

<script setup>
import { Howl, Howler } from 'howler';
import { onMounted, ref, watch } from "vue"
import globalToastEvent, { ToastType } from './globalToastEvent';
import { isWeixin, isLogin, getParam, Storage, Request } from "./libs/utils"
import Login from './components/Login.vue'
import HomePage from './components/HomePage.vue'
import Address from "./components/Address.vue"
import PrizeList from "./components/PrizeList.vue"
import Todolist from "./components/TodoList.vue";
import Rule from "./components/Rule.vue";
import Ad from "./components/Ad.vue"
import Lottery from './components/Lottery.vue';
import { globalStore } from "./globalstore";
import bgmUrl from "./assets/audio/bgm.mp3"
var bgmSound = new Howl({
  src: [bgmUrl],
  loop: true
});

const loginShow = ref(false)
const homePageShow = ref(false)
const todolistShow = ref(false)
const prizeListShow = ref(false)
const ruleShow = ref(false)
const prizelist = ref([])
const addressShow = ref(false)
const activePrizeId = ref(0)
const adShow = ref(false)
const lotteryShow = ref(false)

// 登录状态
const userStatus = async (callback) => {
  const pageCode = getParam("code")
  const userinfos = Storage.get("userinfos")
  if (isWeixin()) {
    if (!pageCode) {
      weui.alert("未获取到code")
      return
    }
    const weixinResult = await Request("wechat/login", {
      code: pageCode
    })
    Storage.set("userinfos", weixinResult.json)
    if (weixinResult.json && weixinResult.json.phone) {
      loginShow.value = false
      callback && callback()
    } else {
      loginShow.value = true
    }
  } else {
    loginShow.value = true
  }
}

//初始化持久数据
const initUserGameInfos = async (refresh_official, refresh_cap_scan) => {
  const result = await Request('game/info', { refresh_official: refresh_official, refresh_cap_scan: refresh_cap_scan }, "GET")

  if (result.res.status === 200) {
    globalStore.draw_chances = result.json.draw_chances
    globalStore.game_chances = result.json.game_chances
    globalStore.invitees = result.json.invitees
    globalStore.followed_official = result.json.followed_official
    globalStore.cap_scan = result.json.cap_scan
    globalStore.game_chances_view_recipes = result.json.game_chances_view_recipes
    globalStore.MAX_VIEW_RECIPES_DAILY = result.json.constants.MAX_VIEW_RECIPES_DAILY
    globalStore.CONSUME_POINT_1_PER_DRAW = result.json.constants.CONSUME_POINT_1_PER_DRAW
    globalStore.MAX_CAP_SCAN = result.json.constants.MAX_CAP_SCAN
    globalStore.MAX_INVITE_DAILY = result.json.constants.MAX_INVITE_DAILY

    globalToastEvent.emit(ToastType.MOUNTED)
  }
}

const handleLoginSuccess = async () => {
  console.log("已登录")
  loginShow.value = false

  await initUserGameInfos(true, true)
}

// if (isLogin()) {
//   handleLoginSuccess()
// } else {
//   userStatus(handleLoginSuccess)
// }
const getUserLottery = async () => {
  const result = await Request("lottery", { pool: "all" }, "GET")
  if (result.res.status === 200) {
    prizelist.value = result.json.lottery_logs.length > 0 ? result.json.lottery_logs : []
  }
  //TODO 上线换成上面的
  // prizelist.value = [
  //   { id: 1, prize_code: "FIRST", prize_name: "一等奖", coupon_type: "scene", pushed: 0 },
  //   { id: 2, prize_code: "FIRST1", prize_name: "二等奖", coupon_type: "scene", pushed: 1 }
  // ]
}
const handleAddressSubmitAfter = (data) => {
  const targetItem = prizelist.value.find(item => item.id === data.id)
  targetItem.pushed = 1
  addressShow.value = false
}

const handleAddress = (id) => {
  activePrizeId.value = id
  addressShow.value = true
}

globalToastEvent.on(ToastType.SHOW_TODO, () => {
  todolistShow.value = true
})
globalToastEvent.on(ToastType.SHOW_PRIZELIST, async () => {
  await getUserLottery()
  prizeListShow.value = true
})
globalToastEvent.on(ToastType.SHOW_RULE, () => {
  ruleShow.value = true
})
globalToastEvent.on(ToastType.SHOW_AD, () => {
  adShow.value = true
})
globalToastEvent.on(ToastType.SHOW_LOTTERY, () => {
  lotteryShow.value = true
})
globalToastEvent.on(ToastType.SHOW_ADDRESS, (id) => {
  activePrizeId.value = id
  addressShow.value = true
})


</script>

<template>
  <PrizeList :show="prizeListShow" @close="prizeListShow = false" :prizelist="prizelist" @address="handleAddress">
  </PrizeList>
  <Todolist :show="todolistShow" @close="todolistShow = false"></Todolist>
  <Rule :show="ruleShow" @close="ruleShow = false"></Rule>
  <Address :show="addressShow" :prizeId="activePrizeId" @address-submit="handleAddressSubmitAfter"
    @address-close="addressShow = false"></Address>
  <Ad :show="adShow" @close="adShow = false"></Ad>
  <!-- <Lottery :show="lotteryShow" @close="lotteryShow = false"></Lottery> -->
</template>

<style scoped>
.logo {
  height: 6em;
  padding: 1.5em;
  will-change: filter;
  transition: filter 300ms;
}

.logo:hover {
  filter: drop-shadow(0 0 2em #646cffaa);
}

.logo.vue:hover {
  filter: drop-shadow(0 0 2em #42b883aa);
}
</style>