diff --git a/package.json b/package.json
index 54a922e..3e0a8f8 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
     "dev:mp-qq": "uni -p mp-qq",
     "dev:mp-toutiao": "uni -p mp-toutiao",
     "dev:mp-weixin": "uni -p mp-weixin",
+    "dev:mp-weixin:pro": "uni -p mp-weixin --mode production",
     "dev:mp-xhs": "uni -p mp-xhs",
     "dev:quickapp-webview": "uni -p quickapp-webview",
     "dev:quickapp-webview-huawei": "uni -p quickapp-webview-huawei",
@@ -60,7 +61,7 @@
     "pinia": "2.0.33",
     "pinia-plugin-persistedstate": "^3.2.1",
     "tiny-emitter": "^2.1.0",
-    "uview-plus": "^3.1.41",
+    "uview-plus": "^3.3.4",
     "vue": "^3.4.21",
     "vue-i18n": "^9.1.9",
     "vue3-eventbus": "^2.0.0"
diff --git a/src/components/quiz/modal.vue b/src/components/quiz/modal.vue
new file mode 100644
index 0000000..9819d59
--- /dev/null
+++ b/src/components/quiz/modal.vue
@@ -0,0 +1,515 @@
+<template>
+  <up-modal
+    :show="showGuessModalVisible"
+    :width="335"
+    :closeOnClickOverlay="true"
+    :showConfirmButton="false"
+    :showCancelButton="false"
+    @close="hideGuessModal"
+  >
+    <view class="guess-model w-full" v-if="gameInfo">
+      <view class="slot-content">
+        <view class="guess-title">
+          <view class="flex-1 flex-center">{{ gameInfo.home_field }}</view>
+          <view class="w-170rpx text-center">VS</view>
+          <view class="flex-1 flex-center">{{ gameInfo.away }}</view>
+        </view>
+
+        <template v-if="gameInfo.score_type == 1">
+          <view class="guess-table">
+            <view class="row herder-title">
+              <view class="table-td col-12">单</view>
+            </view>
+            <view class="table-tr row row-3">
+              <view class="row-title table-td row-3 col-10">胜</view>
+              <view class="row-content">
+                <view class="row-1 col-10">
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '1:0' }"
+                    @click="userGuessChange('1:0')"
+                    >1:0</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '2:0' }"
+                    @click="userGuessChange('2:0')"
+                    >2:0</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '2:1' }"
+                    @click="userGuessChange('2:1')"
+                    >2:1</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '3:0' }"
+                    @click="userGuessChange('3:0')"
+                    >3:0</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '3:1' }"
+                    @click="userGuessChange('3:1')"
+                    >3:1</view
+                  >
+                </view>
+                <view class="row-1 col-10">
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '3:2' }"
+                    @click="userGuessChange('3:2')"
+                    >3:2</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '4:0' }"
+                    @click="userGuessChange('4:0')"
+                    >4:0</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '4:1' }"
+                    @click="userGuessChange('4:1')"
+                    >4:1</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '4:2' }"
+                    @click="userGuessChange('4:2')"
+                    >4:2</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '5:0' }"
+                    @click="userGuessChange('5:0')"
+                    >5:0</view
+                  >
+                </view>
+                <view class="row-1 col-10">
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '5:1' }"
+                    @click="userGuessChange('5:1')"
+                    >5:1</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '5:2' }"
+                    @click="userGuessChange('5:2')"
+                    >5:2</view
+                  >
+                  <view
+                    class="table-td col-6"
+                    :class="{ active: userGuess === '胜其他' }"
+                    @click="userGuessChange('胜其他')"
+                    >胜其他</view
+                  >
+                </view>
+              </view>
+            </view>
+            <view class="table-tr row row-1">
+              <view class="row-title table-td row-1 col-10">平</view>
+              <view class="row-content">
+                <view class="row-1 col-10">
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '0:0' }"
+                    @click="userGuessChange('0:0')"
+                    >0:0</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '1:1' }"
+                    @click="userGuessChange('1:1')"
+                    >1:1</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '2:2' }"
+                    @click="userGuessChange('2:2')"
+                    >2:2</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '3:3' }"
+                    @click="userGuessChange('3:3')"
+                    >3:3</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '平其他' }"
+                    @click="userGuessChange('平其他')"
+                    >平其他</view
+                  >
+                </view>
+              </view>
+            </view>
+            <view class="table-tr row row-3">
+              <view class="row-title table-td row-3 col-10">负</view>
+              <view class="row-content">
+                <view class="row-1 col-10">
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '0:1' }"
+                    @click="userGuessChange('0:1')"
+                    >0:1</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '0:2' }"
+                    @click="userGuessChange('0:2')"
+                    >0:2</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '0:3' }"
+                    @click="userGuessChange('0:3')"
+                    >0:3</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '0:4' }"
+                    @click="userGuessChange('0:4')"
+                    >0:4</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '0:5' }"
+                    @click="userGuessChange('0:5')"
+                    >0:5</view
+                  >
+                </view>
+                <view class="row-1 col-10">
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '1:2' }"
+                    @click="userGuessChange('1:2')"
+                    >1:2</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '1:3' }"
+                    @click="userGuessChange('1:3')"
+                    >1:3</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '1:4' }"
+                    @click="userGuessChange('1:4')"
+                    >1:4</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '1:5' }"
+                    @click="userGuessChange('1:5')"
+                    >1:5</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '2:3' }"
+                    @click="userGuessChange('2:3')"
+                    >2:3</view
+                  >
+                </view>
+                <view class="row-1 col-10">
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '2:4' }"
+                    @click="userGuessChange('2:4')"
+                    >2:4</view
+                  >
+                  <view
+                    class="table-td col-2"
+                    :class="{ active: userGuess === '2:5' }"
+                    @click="userGuessChange('2:5')"
+                    >2:5</view
+                  >
+                  <view
+                    class="table-td col-6"
+                    :class="{ active: userGuess === '负其他' }"
+                    @click="userGuessChange('负其他')"
+                    >负其他</view
+                  >
+                </view>
+              </view>
+            </view>
+          </view>
+        </template>
+        <template v-if="gameInfo.score_type == 2">
+          <view class="flex">
+            <view class="flex-1 flex-center">
+              <up-avatar
+                size="48"
+                mode="aspectFit"
+                :src="gameInfo.home_logo"
+              ></up-avatar>
+            </view>
+            <view class="text-center w-170rpx text-12px text-hex-999">
+              <view>{{ gameInfo.game_day }}</view>
+              <view>{{ gameInfo.little_game_at }}</view>
+            </view>
+            <view class="flex-1 flex-center">
+              <up-avatar
+                size="48"
+                mode="aspectFit"
+                :src="gameInfo.home_logo"
+              ></up-avatar>
+            </view>
+          </view>
+          <view class="w-full type2" :class="successGuessClass">
+          
+            <view class="h-34px flex bg-hex-eeeeef rounded-4px text-hex-303133">
+              <view
+                v-for="item in subsectionList"
+                :key="item"
+                :class="{
+                  active: userGuess === item,
+                }"
+                @click="userGuessChange(item)"
+                class="flex-1 flex-center text-12px rounded-4px"
+              >
+                {{ item }}
+              </view>
+            </view>
+          </view>
+        </template>
+
+        <view class="guess-btns" v-if="!readonly">
+          <up-button
+            class="more-btn"
+            :customStyle="{
+              margin: 0,
+              width: '120px',
+              backgroundColor: '#D9D9D9',
+              color: '#000',
+            }"
+            shape="circle"
+            text="取消"
+            @click="hideGuessModal"
+          ></up-button>
+
+          <up-button
+            class="more-btn"
+            :customStyle="{
+              margin: 0,
+              width: '120px',
+              backgroundColor: '#5fb358',
+              color: '#fff',
+            }"
+            shape="circle"
+            text="确定"
+            @click="submitGuessResult"
+          ></up-button>
+        </view>
+      </view>
+    </view>
+  </up-modal>
+</template>
+<script setup>
+import { computed } from 'vue';
+import { ref, watch, watchEffect } from 'vue'
+const props = defineProps({
+  show: {
+    type: Boolean,
+    default: false,
+  },
+  gameInfo: {
+    type: Object,
+    default: () => ({}),
+  },
+  showResult: {
+    type: Boolean,
+    default: false,
+  }
+})
+
+const showGuessModalVisible = ref(props.show)
+const subsectionList = ref(['胜', '平', '负'])
+const userGuess = ref('')
+const readonly = computed(()=>{
+  if(props.gameInfo?.has_guess || props.gameInfo?.game_at_comparison_now){
+    return true
+  }
+  return false
+})
+const isGuess = computed(()=>!!props.gameInfo?.has_guess)
+const successGuess = computed(()=>props.gameInfo?.game_score === props.gameInfo?.has_guess)
+const successGuessClass = computed(()=>{
+  if(isGuess.value){
+    return ''
+  }
+  return successGuess.value ? 'success' : 'fail'
+})
+
+watchEffect(() => {
+  userGuess.value = props.gameInfo?.has_guess || ''
+},{
+  deep: true
+})
+
+watchEffect(() => {
+  showGuessModalVisible.value = props.show
+})
+
+const emit = defineEmits([
+  'update:show',
+  'hideGuessModal',
+  'submitGuessResult',
+  'userGuessChange',
+])
+const hideGuessModal = () => {
+  emit('hideGuessModal')
+}
+const submitGuessResult = () => {
+  emit('submitGuessResult')
+}
+const userGuessChange = (score) => {
+  userGuess.value = score
+}
+
+watch(
+  () => showGuessModalVisible.value,
+  (val) => {
+    emit('update:show', val)
+  }
+)
+</script>
+<style lang="scss" scoped>
+.type2{
+  .active{
+    background-color: #1d2b5c;
+    color: white;
+  }
+}
+.success {
+  .active {
+    background-color: red !important;
+    color: white;
+  }
+}
+
+.fail {
+  .active {
+    background-color: #bbb !important;
+    color: white;
+  }
+}
+
+.guess-model {
+  .slot-content {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+  }
+
+  .guess-title {
+    width: 100%;
+    display: flex;
+    // justify-content: center;
+    // align-items: center;
+    // gap: 58px;
+  }
+
+  .guess-table {
+    width: 100%;
+
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    font-size: 12px;
+
+    .table-td {
+      border: 1px solid #bbb;
+      width: 48px !important;
+    }
+
+    .table-td.active {
+      background-color: #1d2b5c;
+      color: #fff;
+    }
+
+    .row-1 {
+      height: calc(30px * 1 - 2px) !important;
+      line-height: calc(30px * 1 - 2px) !important;
+    }
+
+    .row-2 {
+      height: calc(30px * 2 - 2px) !important;
+      line-height: calc(30px * 2 - 2px) !important;
+    }
+
+    .row-3 {
+      height: calc(30px * 3 - 8px) !important;
+      line-height: calc(30px * 3 - 8px) !important;
+    }
+
+    .row {
+      width: 300px;
+      height: 30px;
+      line-height: 30px;
+      flex-shrink: 0;
+      display: flex;
+      text-align: center;
+
+      .col-1 {
+        width: calc(292px / 12 * 1);
+      }
+
+      .col-2 {
+        width: calc(292px / 12 * 2);
+      }
+
+      .col-10 {
+        display: flex;
+        justify-content: flex-start;
+        align-self: flex-start;
+        flex-grow: 1;
+
+        .table-td {
+          width: 47.7px !important;
+          border: 1px solid #bbb;
+        }
+
+        .col-6 {
+          width: calc(47.7px * 3 + 4px) !important;
+        }
+      }
+
+      .col-12 {
+        width: 292px;
+      }
+    }
+
+    .herder-title {
+      background-color: #1d2b5c;
+      color: #fff;
+
+      .table-td {
+        width: 100% !important;
+      }
+    }
+
+    .row-title {
+      background-color: #d9d9d9;
+      width: 48px !important;
+      justify-content: center !important;
+    }
+
+    .row-content {
+      display: flex;
+      flex-wrap: wrap;
+      width: calc(300px - 48px - 3px) !important;
+    }
+  }
+
+  .guess-btns {
+    display: flex;
+    justify-content: space-around;
+    width: 300px;
+    flex-shrink: 0;
+  }
+}
+</style>
diff --git a/src/pages/charts/charts.vue b/src/pages/charts/charts.vue
index 144601d..86ba9ba 100644
--- a/src/pages/charts/charts.vue
+++ b/src/pages/charts/charts.vue
@@ -659,6 +659,7 @@ function useGameDetail() {
           )
           detail.value.end_at = dayjs(detail.value.end_at).format('YYYY-MM-DD')
           detailLoading.false = false
+          detailId.value = res.data.activity.id
           resolve(detail)
         })
         .catch((err) => {
diff --git a/src/pages/index/index.vue b/src/pages/index/index.vue
index bd2bfc6..36dbc35 100644
--- a/src/pages/index/index.vue
+++ b/src/pages/index/index.vue
@@ -1,95 +1,188 @@
 <template>
-	<view class="home-page">
-		<mescroll-body @init="mescrollInit" @down="downCallback" @up="upCallback" :up="{
-			empty: {
-				use: false,
-			}
-		}">
-			<view class="home-banner" v-if="homeBannerList.length">
-				<up-swiper class="bg" :radius="0" height="200" :list="homeBannerList"
-					:displayMultipleItems="displayMultipleItems" keyName="url" @click="clickHomeBanner"></up-swiper>
-			</view>
-			<view class="home-content" v-if="gameInfo || articleList.length ||  gameLogs.length">
-				<image class="bg" mode="widthFix" :src="`${config.baseUrl}/images/mini-bg.jpg`"></image>
+  <view class="home-page">
+    <mescroll-body
+      @init="mescrollInit"
+      @down="downCallback"
+      @up="upCallback"
+      :up="{
+        empty: {
+          use: false,
+        },
+      }"
+    >
+      <view class="home-banner" v-if="homeBannerList.length">
+        <up-swiper
+          class="bg"
+          :radius="0"
+          height="200"
+          :list="homeBannerList"
+          :displayMultipleItems="displayMultipleItems"
+          keyName="url"
+          @click="clickHomeBanner"
+        ></up-swiper>
+      </view>
+      <view
+        class="home-content"
+        v-if="gameInfo || articleList.length || gameLogs.length"
+      >
+        <image
+          class="bg"
+          mode="widthFix"
+          :src="`${config.baseUrl}/images/mini-bg.jpg`"
+        ></image>
 
-				<view class="today-guess-box" v-if="gameInfo">
-					<view class="title">今日竞猜</view>
-					<view class="vs-box">
-						<view class="left">
-							<up-avatar class="item-box" size="48" mode="aspectFit"
-								:src="gameInfo.home_logo"></up-avatar>
-							<view class="item-text">{{ gameInfo.home_field }}</view>
-						</view>
-						<view class="middle">
-							<view class="item-box">vs</view>
-							<view class="item-text">{{ gameInfo.little_game_at }}</view>
-						</view>
-						<view class="right">
-							<up-avatar class="item-box" size="48" mode="aspectFit"
-								:src="gameInfo.away_logo"></up-avatar>
-							<view class="item-text">{{ gameInfo.away }}</view>
-						</view>
-					</view>
+        <view class="today-guess-box" v-if="gameInfo">
+          <view class="title">今日竞猜</view>
+          <view class="vs-box">
+            <view class="left">
+              <up-avatar
+                class="item-box"
+                size="48"
+                mode="aspectFit"
+                :src="gameInfo.home_logo"
+              ></up-avatar>
+              <view class="item-text">{{ gameInfo.home_field }}</view>
+            </view>
+            <view class="middle">
+              <view class="item-box">vs</view>
+              <view class="item-text">{{ gameInfo.little_game_at }}</view>
+            </view>
+            <view class="right">
+              <up-avatar
+                class="item-box"
+                size="48"
+                mode="aspectFit"
+                :src="gameInfo.away_logo"
+              ></up-avatar>
+              <view class="item-text">{{ gameInfo.away }}</view>
+            </view>
+          </view>
 
-					<view class="operation-box">
-						<up-button class="guess-btn" :disabled="false" shape="circle" @click="showGuessModal(gameInfo)"
-							:customStyle="{ margin: 0, width: '132px', backgroundColor: '#1D2B5C', color: '#fff', opacity: 1 }"
-							v-if="!gameInfo.game_at_comparison_now && !gameInfo.has_guess">立即竞猜</up-button>
+          <view class="operation-box">
+            <up-button
+              class="guess-btn"
+              :disabled="false"
+              shape="circle"
+              @click="showGuessModal(gameInfo)"
+              :customStyle="{
+                margin: 0,
+                width: '132px',
+                backgroundColor: '#1D2B5C',
+                color: '#fff',
+                opacity: 1,
+              }"
+              v-if="!gameInfo.game_at_comparison_now && !gameInfo.has_guess"
+              >立即竞猜</up-button
+            >
 
-						<up-button class="guess-btn disabled" :disabled="false" shape="circle"
-							@click="showGuessModal(gameInfo)"
-							:customStyle="{ margin: 0, width: '132px', backgroundColor: '#1D2B5C', color: '#fff', opacity: 0.7 }"
-							v-if="gameInfo.has_guess">已竞猜</up-button>
+            <up-button
+              class="guess-btn disabled"
+              :disabled="false"
+              shape="circle"
+              @click="showGuessModal(gameInfo)"
+              :customStyle="{
+                margin: 0,
+                width: '132px',
+                backgroundColor: '#1D2B5C',
+                color: '#fff',
+                opacity: 0.7,
+              }"
+              v-if="gameInfo.has_guess"
+              >已竞猜</up-button
+            >
 
-						<up-button class="guess-btn disabled" :disabled="true" shape="circle"
-							@click="showGuessModal(gameInfo)"
-							:customStyle="{ margin: 0, width: '132px', backgroundColor: '#1D2B5C', color: '#fff', opacity: 0.7 }"
-							v-if="gameInfo.game_at_comparison_now && !gameInfo.has_guess">已结束</up-button>
+            <up-button
+              class="guess-btn disabled"
+              :disabled="true"
+              shape="circle"
+              @click="showGuessModal(gameInfo)"
+              :customStyle="{
+                margin: 0,
+                width: '132px',
+                backgroundColor: '#1D2B5C',
+                color: '#fff',
+                opacity: 0.7,
+              }"
+              v-if="gameInfo.game_at_comparison_now && !gameInfo.has_guess"
+              >已结束</up-button
+            >
 
-						<up-button class="more-btn" :disabled="false" shape="circle" @click="goToActivateDetailPage"
-							:customStyle="{ margin: 0, width: '75px', backgroundColor: '#f0f0f0', color: '#000', opacity: 1 }">更多</up-button>
-					</view>
-				</view>
-				<view class="news-box" v-if="articleList.length">
-					<view class="news-title-box">
-						<text class="title">体彩资讯</text>
-						<text class="more" @click="$goToPage('pages/news/news', true)">查看更多</text>
-					</view>
+            <up-button
+              class="more-btn"
+              :disabled="false"
+              shape="circle"
+              @click="goToActivateDetailPage"
+              :customStyle="{
+                margin: 0,
+                width: '75px',
+                backgroundColor: '#f0f0f0',
+                color: '#000',
+                opacity: 1,
+              }"
+              >更多</up-button
+            >
+          </view>
+        </view>
+        <view class="news-box" v-if="articleList.length">
+          <view class="news-title-box">
+            <text class="title">体彩资讯</text>
+            <text class="more" @click="$goToPage('pages/news/news', true)"
+              >查看更多</text
+            >
+          </view>
 
-					<view v-for="(item, index) in articleList" :key="index"
-						@click="$goToPage({ url: 'packages/pages/news/newDetail/newDetail', params: { id: item.id } })">
-						<view class="news-image-box" :class="{ 'last': index === articleList.length - 1 }"
-							v-if="item.cover">
-							<image class="news-image" :src="item.cover"></image>
-							<view class="news-info">
-								<view class="news-info-title">{{ item.title }}</view>
-								<view class="news-info-publish_time">{{ item.published_at }}</view>
-							</view>
-						</view>
+          <view
+            v-for="(item, index) in articleList"
+            :key="index"
+            @click="
+              $goToPage({
+                url: 'packages/pages/news/newDetail/newDetail',
+                params: { id: item.id },
+              })
+            "
+          >
+            <view
+              class="news-image-box"
+              :class="{ last: index === articleList.length - 1 }"
+              v-if="item.cover"
+            >
+              <image class="news-image" :src="item.cover"></image>
+              <view class="news-info">
+                <view class="news-info-title">{{ item.title }}</view>
+                <view class="news-info-publish_time">{{
+                  item.published_at
+                }}</view>
+              </view>
+            </view>
 
-						<view class="news-content-box" :class="{ 'last': index === articleList.length - 1 }" v-else>
-							<view class="news-info">
-								<view class="news-info-title">{{ item.title }}</view>
-								<view class="news-info-publish_time">{{ item.published_at }}</view>
-							</view>
-						</view>
-					</view>
-				</view>
+            <view
+              class="news-content-box"
+              :class="{ last: index === articleList.length - 1 }"
+              v-else
+            >
+              <view class="news-info">
+                <view class="news-info-title">{{ item.title }}</view>
+                <view class="news-info-publish_time">{{
+                  item.published_at
+                }}</view>
+              </view>
+            </view>
+          </view>
+        </view>
 
-				<view class="news-box">
-					<view class="news-title-box">
-						<text class="title">最新竞猜</text>
-						<!-- <text class="more" @click="$goToPage('pages/news/news', true)">查看更多</text> -->
-					</view>
-					<view v-for="(item,i) in gameLogs" :key="i"> 
-						<QuizItem :data="item"></QuizItem>
-					</view>
-				</view>
+        <view class="news-box">
+          <view class="news-title-box">
+            <text class="title">最新竞猜</text>
+            <!-- <text class="more" @click="$goToPage('pages/news/news', true)">查看更多</text> -->
+          </view>
+          <view v-for="(item, i) in gameLogs" :key="i">
+            <QuizItem :data="item"></QuizItem>
+          </view>
+        </view>
+      </view>
 
-			</view>
-
-			<view class="guess-model" v-if="gameInfo">
-				<up-modal :show="showGuessModalVisible" :width="335" :closeOnClickOverlay="true"
+      <!-- <view class="guess-model" v-if="gameInfo">
+				<up-modal v-model:show="showGuessModalVisible" :width="335" :closeOnClickOverlay="true"
 					:showConfirmButton="false" :showCancelButton="false" @close="hideGuessModal">
 					<view class="slot-content">
 						<view class="guess-title">
@@ -206,532 +299,563 @@
 						</view>
 					</view>
 				</up-modal>
-			</view>
-		</mescroll-body>
-	</view>
+			</view> -->
+    </mescroll-body>
+    <QuizModal
+      :gameInfo="gameInfo"
+      :userGuess="userGuess"
+      :readonly="readonly"
+			@hideGuessModal="hideGuessModal"
+			@submitGuessResult="submitGuessResult"
+			@userGuessChange="userGuessChange"
+      v-model:show="showGuessModalVisible"
+    ></QuizModal>
+  </view>
 </template>
 
 <script setup>
-import { ref, getCurrentInstance } from 'vue';
+import QuizModal from '@/components/quiz/modal.vue'
+import { ref, getCurrentInstance } from 'vue'
 import config from '@/common/config'
-import { queryAds, queryLatestgame, queryRecommendArticles, submitGuess ,getLatestGameLogs} from '@/api/xinjiang_guess';
-import useAuthUser from '@/utils/hooks/useAuthUser';
+import {
+  queryAds,
+  queryLatestgame,
+  queryRecommendArticles,
+  submitGuess,
+  getLatestGameLogs,
+} from '@/api/xinjiang_guess'
+import useAuthUser from '@/utils/hooks/useAuthUser'
 import jumpFun from '@/utils/jump.js'
-import QuizItem from '@/components/quiz/item-new.vue' 
-const vm = getCurrentInstance();
+import QuizItem from '@/components/quiz/item-new.vue'
+const vm = getCurrentInstance()
 
-const loading = ref(false);
-const homeBannerLoading = ref(false);
-const homeBannerInfo = ref(null);
-const homeBannerList = ref([]);
-const displayMultipleItems = ref(0);
+const loading = ref(false)
+const homeBannerLoading = ref(false)
+const homeBannerInfo = ref(null)
+const homeBannerList = ref([])
+const displayMultipleItems = ref(0)
 
-const showGuessModalVisible = ref(false);
-const gameInfoLoading = ref(false);
-const gameInfo = ref(null);
-const readonly = ref(false);
-const userGuess = ref('0:0');
-const submitGuessLoading = ref(false);
+const showGuessModalVisible = ref(false)
+const gameInfoLoading = ref(false)
+const gameInfo = ref(null)
+const readonly = ref(false)
+const userGuess = ref('0:0')
+const submitGuessLoading = ref(false)
 
-const articleListLoading = ref(false);
-const articleList = ref([]);
+const articleListLoading = ref(false)
+const articleList = ref([])
 
 const gameLogs = ref([])
 
 function clickHomeBanner(index) {
-	// if (!homeBannerList.value.length) {
-	// 	return;
-	// }
-	const item = homeBannerList.value[index]
-	jumpFun(item)
+  // if (!homeBannerList.value.length) {
+  // 	return;
+  // }
+  const item = homeBannerList.value[index]
+  jumpFun(item)
 }
 
 function userGuessChange(score) {
-	if (readonly.value) {
-		return;
-	}
-	userGuess.value = score;
+	userGuess.value = score
+  if (readonly.value) {
+    return
+  }
+  userGuess.value = score
 }
 function showGuessModal(item) {
-	const { user } = useAuthUser();
-	if (user.is_need_bind_phone) {
-		vm.proxy.$goToPage('packages/pages/login/login?previous=index');
-		return;
-	}
+  const { user } = useAuthUser()
+  if (user.is_need_bind_phone) {
+    vm.proxy.$goToPage('packages/pages/login/login?previous=index')
+    return
+  }
 
-	gameInfo.value = item;
+  gameInfo.value = item
 
-	if (gameInfo.value.has_guess) {
-		readonly.value = true;
-	}
-	if (gameInfo.value.game_at_comparison_now) {
-		readonly.value = true;
-	}
+  if (gameInfo.value.has_guess) {
+    readonly.value = true
+  }
+  if (gameInfo.value.game_at_comparison_now) {
+    readonly.value = true
+  }
 
-	if (readonly.value) {
-		userGuess.value = item.has_guess;
-	} else {
-		userGuess.value = '0:0';
-	}
+  if (readonly.value) {
+    userGuess.value = item.has_guess
+  } else {
+    userGuess.value = '0:0'
+  }
 
-	showGuessModalVisible.value = true;
+  showGuessModalVisible.value = true
 }
 function hideGuessModal() {
-	showGuessModalVisible.value = false;
-	setTimeout(() => {
-		userGuess.value = '0:0';
-	}, 300);
+  showGuessModalVisible.value = false
+  setTimeout(() => {
+    userGuess.value = '0:0'
+  }, 300)
 }
 
 function goToActivateDetailPage() {
-	vm.proxy.$goToPage({
-		url: 'packages/pages/activeDetail/activeDetail',
-		params: {
-			id: gameInfo.value.activity_id,
-		}
-	})
+  vm.proxy.$goToPage({
+    url: 'packages/pages/activeDetail/activeDetail',
+    params: {
+      id: gameInfo.value.activity_id,
+    },
+  })
 }
 
 async function getHomeBanner() {
-	try {
-		homeBannerLoading.value = true;
-		const resp = await queryAds({
-			address: "index-top",
-		});
-		homeBannerInfo.value = resp.data;
+  try {
+    homeBannerLoading.value = true
+    const resp = await queryAds({
+      address: 'index-top',
+    })
+    homeBannerInfo.value = resp.data
 
-		homeBannerList.value = resp.data?.ads.map(item => {
-			return {
-				url: item.resource,
-				title: "",
-				poster: "",
-				jump_type: item.jump_type,
-				jump_config: item.jump_config,
-			}
-		}) || [];
+    homeBannerList.value =
+      resp.data?.ads.map((item) => {
+        return {
+          url: item.resource,
+          title: '',
+          poster: '',
+          jump_type: item.jump_type,
+          jump_config: item.jump_config,
+        }
+      }) || []
 
-		displayMultipleItems.value = 1;
-		if (homeBannerList.value.length > 3) {
-			displayMultipleItems.value = 3;
-		}
-	} catch (err) {
-		console.error(err);
-	} finally {
-		homeBannerLoading.value = false;
-	}
+    displayMultipleItems.value = 1
+    if (homeBannerList.value.length > 3) {
+      displayMultipleItems.value = 3
+    }
+  } catch (err) {
+    console.error(err)
+  } finally {
+    homeBannerLoading.value = false
+  }
 }
 
 async function getLatestGuess() {
-	try {
-		gameInfoLoading.value = true;
-		const resp = await queryLatestgame()
-		gameInfo.value = resp.data;
-		if (gameInfo.value && gameInfo.value.has_guess) {
-			userGuess.value = gameInfo.value.has_guess;
-		}
-	} catch (err) {
-		console.error(err);
-	} finally {
-		gameInfoLoading.value = false;
-	}
+  try {
+    gameInfoLoading.value = true
+    const resp = await queryLatestgame()
+    gameInfo.value = resp.data
+    if (gameInfo.value && gameInfo.value.has_guess) {
+      userGuess.value = gameInfo.value.has_guess
+    }
+  } catch (err) {
+    console.error(err)
+  } finally {
+    gameInfoLoading.value = false
+  }
 }
 
 async function getRecommendArticles(params) {
-	try {
-		articleListLoading.value = true;
-		const resp = await queryRecommendArticles(params)
-		articleList.value = resp.data?.articles || [];
-	} catch (err) {
-		console.error(err);
-	} finally {
-		articleListLoading.value = false;
-	}
+  try {
+    articleListLoading.value = true
+    const resp = await queryRecommendArticles(params)
+    articleList.value = resp.data?.articles || []
+  } catch (err) {
+    console.error(err)
+  } finally {
+    articleListLoading.value = false
+  }
 }
 
-async function getNewQuiz(){
-	try {
-		const resData = await getLatestGameLogs()
-		gameLogs.value = resData.data?.list || [];
-	} catch (error) {
-		console.error(error);
-	}
+async function getNewQuiz() {
+  try {
+    const resData = await getLatestGameLogs()
+    gameLogs.value = resData.data?.list || []
+  } catch (error) {
+    console.error(error)
+  }
 }
 
 async function submitGuessResult() {
-	try {
-		uni.showLoading({
-			title: "加载中..."
-		});
+  try {
+    uni.showLoading({
+      title: '加载中...',
+    })
 
-		const params = {
-			game: gameInfo.value.id,
-			score: userGuess.value,
-		};
-		submitGuessLoading.value = true;
-		const res = await submitGuess(params, { custom: { catch: true } });
+    const params = {
+      game: gameInfo.value.id,
+      score: userGuess.value,
+    }
+    submitGuessLoading.value = true
+    const res = await submitGuess(params, { custom: { catch: true } })
 
-		console.log('submitGuess', res);
+    console.log('submitGuess', res)
 
-		uni.showToast({
-			title: res.message,
-			icon: "none",
-		});
+    uni.showToast({
+      title: res.message,
+      icon: 'none',
+    })
 
-		getLatestGuess();
-		setTimeout(hideGuessModal, 0);
-	} catch (err) {
-		console.error(err);
-	} finally {
-		submitGuessLoading.value = false;
-	}
+    getLatestGuess()
+    setTimeout(hideGuessModal, 0)
+  } catch (err) {
+    console.error(err)
+  } finally {
+    submitGuessLoading.value = false
+  }
 }
 
 function getData(page = 1, per_page = 10) {
-	return new Promise(async (resolve, reject) => {
-		try {
-			loading.value = true;
-			setTimeout(async () => {
-				await getHomeBanner();
-				await getLatestGuess();
-				// await getRecommendArticles();
-				getNewQuiz()
-				resolve();
-			}, 1500);
-		} catch (err) {
-			console.log('getData index', err);
-			reject();
-		} finally {
-			loading.value = false;
-		}
-	});
+  return new Promise(async (resolve, reject) => {
+    try {
+      loading.value = true
+      setTimeout(async () => {
+        await getHomeBanner()
+        await getLatestGuess()
+        // await getRecommendArticles();
+        getNewQuiz()
+        resolve()
+      }, 1500)
+    } catch (err) {
+      console.log('getData index', err)
+      reject()
+    } finally {
+      loading.value = false
+    }
+  })
 }
 
-import { onShow, onLoad, onPullDownRefresh, onPageScroll, onReachBottom, onShareAppMessage } from "@dcloudio/uni-app";
-import useMescroll from "@/uni_modules/mescroll-uni/hooks/useMescroll.js";
-const { mescrollInit, downCallback, getMescroll } = useMescroll(onPageScroll, onReachBottom)
+import {
+  onShow,
+  onLoad,
+  onPullDownRefresh,
+  onPageScroll,
+  onReachBottom,
+  onShareAppMessage,
+} from '@dcloudio/uni-app'
+import useMescroll from '@/uni_modules/mescroll-uni/hooks/useMescroll.js'
+const { mescrollInit, downCallback, getMescroll } = useMescroll(
+  onPageScroll,
+  onReachBottom
+)
 
-const list = ref([]);
+const list = ref([])
 const upCallback = (mescroll) => {
-	typeof getData === 'function' && getData(mescroll.num, mescroll.size).then(data => {
-		let curPageData = [] // 当前页数据
-		if (Array.isArray(data)) {
-			curPageData = data;
-		}
-		if (mescroll.num == 1) list.value = []; // 第一页需手动制空列表
-		list.value = list.value.concat(curPageData); //追加新数据
-		//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
-		//mescroll会根据传的参数,自动判断列表如果无任何数据,则提示空;列表无下一页数据,则提示无更多数据;
+  typeof getData === 'function' &&
+    getData(mescroll.num, mescroll.size)
+      .then((data) => {
+        let curPageData = [] // 当前页数据
+        if (Array.isArray(data)) {
+          curPageData = data
+        }
+        if (mescroll.num == 1) list.value = [] // 第一页需手动制空列表
+        list.value = list.value.concat(curPageData) //追加新数据
+        //联网成功的回调,隐藏下拉刷新和上拉加载的状态;
+        //mescroll会根据传的参数,自动判断列表如果无任何数据,则提示空;列表无下一页数据,则提示无更多数据;
 
-		//方法一(推荐): 后台接口有返回列表的总页数 totalPage
-		//mescroll.endByPage(curPageData.length, totalPage); //必传参数(当前页的数据个数, 总页数)
+        //方法一(推荐): 后台接口有返回列表的总页数 totalPage
+        //mescroll.endByPage(curPageData.length, totalPage); //必传参数(当前页的数据个数, 总页数)
 
-		//方法二(推荐): 后台接口有返回列表的总数据量 totalSize
-		//mescroll.endBySize(curPageData.length, totalSize); //必传参数(当前页的数据个数, 总数据量)
+        //方法二(推荐): 后台接口有返回列表的总数据量 totalSize
+        //mescroll.endBySize(curPageData.length, totalSize); //必传参数(当前页的数据个数, 总数据量)
 
-		//方法三(推荐): 您有其他方式知道是否有下一页 hasNext
-		//mescroll.endSuccess(curPageData.length, hasNext); //必传参数(当前页的数据个数, 是否有下一页true/false)
+        //方法三(推荐): 您有其他方式知道是否有下一页 hasNext
+        //mescroll.endSuccess(curPageData.length, hasNext); //必传参数(当前页的数据个数, 是否有下一页true/false)
 
-		//方法四 (不推荐),会存在一个小问题:比如列表共有20条数据,每页加载10条,共2页.如果只根据当前页的数据个数判断,则需翻到第三页才会知道无更多数据.
-		mescroll.endSuccess(curPageData.length); // 请求成功, 结束加载
-	}).catch((err) => {
-		console.error(err);
-		mescroll.endErr(); // 请求失败, 结束加载
-	})
-};
+        //方法四 (不推荐),会存在一个小问题:比如列表共有20条数据,每页加载10条,共2页.如果只根据当前页的数据个数判断,则需翻到第三页才会知道无更多数据.
+        mescroll.endSuccess(curPageData.length) // 请求成功, 结束加载
+      })
+      .catch((err) => {
+        console.error(err)
+        mescroll.endErr() // 请求失败, 结束加载
+      })
+}
 </script>
 
 <style lang="scss">
 .home-banner {
-	height: 200px;
+  height: 200px;
 
-	image.bg {
-		width: 100%;
-		height: 200px;
-	}
+  image.bg {
+    width: 100%;
+    height: 200px;
+  }
 }
 
 .home-content {
-	position: relative;
-	padding: 20px 16px;
-	display: flex;
-	flex-direction: column;
-	justify-content: flex-start;
-	align-items: center;
-	gap: 20px;
+  position: relative;
+  padding: 20px 16px;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: center;
+  gap: 20px;
 
-	background-color: #1b2f85;
+  background-color: #1b2f85;
 
-	.bg {
-		position: absolute;
-		top: 0;
-		left: 0;
-		width: 100vw;
-	}
+  .bg {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100vw;
+  }
 }
 
 .today-guess-box {
-	padding: 12px;
-	width: calc(100% - 32px);
-	border-radius: 4px;
-	background-color: #fff;
-	z-index: 999;
+  padding: 12px;
+  width: calc(100% - 32px);
+  border-radius: 4px;
+  background-color: #fff;
+  z-index: 999;
 
-	.title {
-		font-size: 12px;
-		text-align: center;
-	}
+  .title {
+    font-size: 12px;
+    text-align: center;
+  }
 
-	.vs-box {
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		gap: 30px;
-		padding: 12px;
-	}
+  .vs-box {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 30px;
+    padding: 12px;
+  }
 
-	.item-box {
-		width: 48px;
-		height: 48px;
-		text-align: center;
-		line-height: 48px;
-	}
+  .item-box {
+    width: 48px;
+    height: 48px;
+    text-align: center;
+    line-height: 48px;
+  }
 
-	.item-text {
-		margin-top: 12px;
-		font-size: 12px;
-	}
+  .item-text {
+    margin-top: 12px;
+    font-size: 12px;
+  }
 
-	.left,
-	.middle,
-	.right {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-	}
+  .left,
+  .middle,
+  .right {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+  }
 
-	.operation-box {
-		display: flex;
-		gap: 12px;
-		justify-content: center;
+  .operation-box {
+    display: flex;
+    gap: 12px;
+    justify-content: center;
 
-		.guess-btn {
-			margin: 0;
-			width: 132px;
-			background-color: #1D2B5C;
-			color: #fff;
-			border-radius: 50px;
-			height: 36px;
-			line-height: 36px;
-		}
+    .guess-btn {
+      margin: 0;
+      width: 132px;
+      background-color: #1d2b5c;
+      color: #fff;
+      border-radius: 50px;
+      height: 36px;
+      line-height: 36px;
+    }
 
-		.guess-btn.disabled {
-			opacity: .5;
-		}
+    .guess-btn.disabled {
+      opacity: 0.5;
+    }
 
-		.more-btn {
-			margin: 0;
-			width: 75px;
-			background-color: #f0f0f0;
-			color: #000;
-			border-radius: 50px;
-			height: 36px;
-			line-height: 36px;
-		}
-	}
+    .more-btn {
+      margin: 0;
+      width: 75px;
+      background-color: #f0f0f0;
+      color: #000;
+      border-radius: 50px;
+      height: 36px;
+      line-height: 36px;
+    }
+  }
 }
 
 .news-box {
-	padding: 12px;
-	width: calc(100% - 32px);
-	border-radius: 4px;
-	background-color: #fff;
-	z-index: 999;
+  padding: 12px;
+  width: calc(100% - 32px);
+  border-radius: 4px;
+  background-color: #fff;
+  z-index: 999;
 
-	.news-title-box {
-		padding-left: 12px;
-		border-left: 4px solid #D8524C;
-		font-weight: bold;
-		font-size: 16px;
+  .news-title-box {
+    padding-left: 12px;
+    border-left: 4px solid #d8524c;
+    font-weight: bold;
+    font-size: 16px;
 
-		display: flex;
-		justify-content: space-between;
-		margin-bottom: 12px;
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 12px;
 
-		.more {
-			font-weight: normal;
-			font-size: 12px;
-		}
-	}
+    .more {
+      font-weight: normal;
+      font-size: 12px;
+    }
+  }
 
-	.news-image-box,
-	.news-content-box {
-		padding-bottom: 12px;
-		border-bottom: 2px solid #f0f0f0;
-		margin-bottom: 12px;
-	}
+  .news-image-box,
+  .news-content-box {
+    padding-bottom: 12px;
+    border-bottom: 2px solid #f0f0f0;
+    margin-bottom: 12px;
+  }
 
-	.news-image-box {
-		display: flex;
-		justify-content: flex-start;
-		align-items: center;
+  .news-image-box {
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
 
-		.news-image {
-			flex-shrink: 0;
-			width: 75px;
-			height: 75px;
-		}
-	}
+    .news-image {
+      flex-shrink: 0;
+      width: 75px;
+      height: 75px;
+    }
+  }
 
-	.news-info {
-		height: 100%;
-		padding: 8px;
+  .news-info {
+    height: 100%;
+    padding: 8px;
 
-		display: flex;
-		flex-direction: column;
-		justify-content: flex-start;
-		align-items: flex-start;
-		align-self: flex-start;
-		gap: 12px;
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: flex-start;
+    align-self: flex-start;
+    gap: 12px;
 
-		&-title {
-			font-size: 16px;
-		}
+    &-title {
+      font-size: 16px;
+    }
 
-		&-publish_time {
-			color: #999;
-			font-size: 12px;
-		}
-	}
+    &-publish_time {
+      color: #999;
+      font-size: 12px;
+    }
+  }
 
-	.last {
-		border-bottom: none;
-		padding-bottom: 0;
-	}
+  .last {
+    border-bottom: none;
+    padding-bottom: 0;
+  }
 }
 
 .u-modal {
-	width: calc(100% - 16px * 2);
+  width: calc(100% - 16px * 2);
 
-	.u-modal__content {
-		padding: 12px !important;
-	}
+  .u-modal__content {
+    padding: 12px !important;
+  }
 }
 
-.guess-model {
-	.slot-content {
-		display: flex;
-		flex-direction: column;
-		gap: 12px;
-	}
+// .guess-model {
+//   .slot-content {
+//     display: flex;
+//     flex-direction: column;
+//     gap: 12px;
+//   }
 
-	.guess-title {
-		width: 100%;
+//   .guess-title {
+//     width: 100%;
 
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		gap: 58px;
-	}
+//     display: flex;
+//     justify-content: center;
+//     align-items: center;
+//     gap: 58px;
+//   }
 
-	.guess-table {
-		width: 100%;
+//   .guess-table {
+//     width: 100%;
 
-		display: flex;
-		flex-direction: column;
-		justify-content: center;
-		align-items: center;
-		font-size: 12px;
+//     display: flex;
+//     flex-direction: column;
+//     justify-content: center;
+//     align-items: center;
+//     font-size: 12px;
 
-		.table-td {
-			border: 1px solid #bbb;
-			width: 48px !important;
-		}
+//     .table-td {
+//       border: 1px solid #bbb;
+//       width: 48px !important;
+//     }
 
-		.table-td.active {
-			background-color: #1D2B5C;
-			color: #fff;
-		}
+//     .table-td.active {
+//       background-color: #1d2b5c;
+//       color: #fff;
+//     }
 
-		.row-1 {
-			height: calc(30px * 1 - 2px) !important;
-			line-height: calc(30px * 1 - 2px) !important;
-		}
+//     .row-1 {
+//       height: calc(30px * 1 - 2px) !important;
+//       line-height: calc(30px * 1 - 2px) !important;
+//     }
 
-		.row-2 {
-			height: calc(30px * 2 - 2px) !important;
-			line-height: calc(30px * 2 - 2px) !important;
-		}
+//     .row-2 {
+//       height: calc(30px * 2 - 2px) !important;
+//       line-height: calc(30px * 2 - 2px) !important;
+//     }
 
-		.row-3 {
-			height: calc(30px * 3 - 8px) !important;
-			line-height: calc(30px * 3 - 8px) !important;
-		}
+//     .row-3 {
+//       height: calc(30px * 3 - 8px) !important;
+//       line-height: calc(30px * 3 - 8px) !important;
+//     }
 
-		.row {
-			width: 300px;
-			height: 30px;
-			line-height: 30px;
-			flex-shrink: 0;
-			display: flex;
-			text-align: center;
+//     .row {
+//       width: 300px;
+//       height: 30px;
+//       line-height: 30px;
+//       flex-shrink: 0;
+//       display: flex;
+//       text-align: center;
 
-			.col-1 {
-				width: calc(292px / 12 * 1);
-			}
+//       .col-1 {
+//         width: calc(292px / 12 * 1);
+//       }
 
-			.col-2 {
-				width: calc(292px / 12 * 2);
-			}
+//       .col-2 {
+//         width: calc(292px / 12 * 2);
+//       }
 
-			.col-10 {
-				display: flex;
-				justify-content: flex-start;
-				align-self: flex-start;
-				flex-grow: 1;
+//       .col-10 {
+//         display: flex;
+//         justify-content: flex-start;
+//         align-self: flex-start;
+//         flex-grow: 1;
 
-				.table-td {
-					width: 47.7px !important;
-					border: 1px solid #bbb;
-				}
+//         .table-td {
+//           width: 47.7px !important;
+//           border: 1px solid #bbb;
+//         }
 
-				.col-6 {
-					width: calc(47.7px * 3 + 4px) !important;
-				}
-			}
+//         .col-6 {
+//           width: calc(47.7px * 3 + 4px) !important;
+//         }
+//       }
 
-			.col-12 {
-				width: 292px;
-			}
-		}
+//       .col-12 {
+//         width: 292px;
+//       }
+//     }
 
-		.herder-title {
-			background-color: #1D2B5C;
-			color: #fff;
+//     .herder-title {
+//       background-color: #1d2b5c;
+//       color: #fff;
 
-			.table-td {
-				width: 100% !important;
-			}
-		}
+//       .table-td {
+//         width: 100% !important;
+//       }
+//     }
 
-		.row-title {
-			background-color: #D9D9D9;
-			width: 48px !important;
-			justify-content: center !important;
-		}
+//     .row-title {
+//       background-color: #d9d9d9;
+//       width: 48px !important;
+//       justify-content: center !important;
+//     }
 
-		.row-content {
-			display: flex;
-			flex-wrap: wrap;
-			width: calc(300px - 48px - 3px) !important;
-		}
-	}
+//     .row-content {
+//       display: flex;
+//       flex-wrap: wrap;
+//       width: calc(300px - 48px - 3px) !important;
+//     }
+//   }
 
-	.guess-btns {
-		display: flex;
-		justify-content: space-around;
-		width: 300px;
-		flex-shrink: 0;
-	}
-}
+//   .guess-btns {
+//     display: flex;
+//     justify-content: space-around;
+//     width: 300px;
+//     flex-shrink: 0;
+//   }
+// }
 </style>
diff --git a/yarn.lock b/yarn.lock
index a77d036..662d363 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5045,10 +5045,10 @@ utils-merge@1.0.1:
   resolved "https://mirrors.cloud.tencent.com/npm/utils-merge/-/utils-merge-1.0.1.tgz#9f95710f50a267947b2ccc124741c1028427e713"
   integrity sha512-pMZTvIkT1d+TFGvDOqodOclx0QWkkgi6Tdoa8gC8ffGAAqz9pzPTZWAybbsHHoED/ztMtkv/VoYTYyShUn81hA==
 
-uview-plus@^3.1.41:
-  version "3.2.22"
-  resolved "https://mirrors.cloud.tencent.com/npm/uview-plus/-/uview-plus-3.2.22.tgz#579320499be2a75f4becde8f928a11cc52374821"
-  integrity sha512-ouhq0CCGP/ElR7eCCu0rBFNPTGW/EctcrxKIerjj1DOkEIY9BwKBbdI0VTSSkMFnr6RFejSQLBw/aKkqd6Q+7g==
+uview-plus@^3.3.4:
+  version "3.3.4"
+  resolved "https://registry.npmmirror.com/uview-plus/-/uview-plus-3.3.4.tgz#9aa745de6292a067d8afde380f8a719c355eebc1"
+  integrity sha512-WSh4sGdSzam7rtNuUIxIOm+O7+3gNm0O25JFv2BUkAAuLimdic17c2Xg7VpVdd2yhAGcVYMTrD5u4dJb8he02A==
   dependencies:
     clipboard "^2.0.11"
     dayjs "^1.11.3"