<script setup>
import GameChart from './components/GameChart.vue'
import SearchGrade from './components/SearchGrade.vue'
import Draw from './components/draw/Draw.vue'
import Commit from './components/commit/Commit.vue'
import { reactive, onBeforeMount } from 'vue';
const state = reactive({
  current: '评论'
})

onBeforeMount(() => {
  const href = window.location.href
  const data = {}
  const urlArray = href.split('?')
  const urlLength = urlArray.length
  if (urlLength > 1) {
    urlArray[urlLength - 1].split('&').forEach(item => {
      const itemArray = item.split('=')
      const key = itemArray[0]
      const value = itemArray[1]
      data[key] = value
    })
    console.log('urlArray',urlArray)
    if (data['type'] = 'csdn_game') {
      state.current = '新星赛道选手信息可视化'
    }
    else if(data['type'] = 'csdn_grade'){
      state.current = 'grade查询分数'
    }
    else if(data['type'] = 'draw'){
      state.current = '抽奖'
    }
    else if(data['type'] = 'commit'){
      state.current = '评论'
    }
  }

})
</script>

<template>
  <div class="container-main">
    <div style="text-align: center;padding: 20px;">
      <a-radio-group v-model:value="state.current" name="radioGroup">
        <a-radio value="grade查询分数">grade查询分数</a-radio>
        <a-radio value="新星赛道选手信息可视化">新星赛道选手信息可视化</a-radio>
        <a-radio value="抽奖">抽奖</a-radio>
        <a-radio value="评论">分析评论</a-radio>
      </a-radio-group>
    </div>
    <SearchGrade v-if="state.current === 'grade查询分数'" />
    <GameChart v-else-if="state.current === '新星赛道选手信息可视化'" />
    <Commit v-else-if="state.current === '评论'" />
    <Draw v-else />
  </div>
</template>

<style scoped>
.container-main {
  position: absolute;
  width: 100vw;
  height: 100vh;
  padding: 10px;
  margin: 0;
}
</style>
