wip: test

src/pages/aoshi/index/index.vue

@@ -17,24 +17,11 @@
           <view class="level">积分: {{ userInfo.integral || 0 }}</view>
         </view>
       </view>
-      <view class="right">豆子：{{ userInfo.pulse || 0 }}</view>
-    </view>
-    <view class="turntable">
-      <view class="num-box">
-        <view
-          class="item"
-          v-for="(item, index) in nums"
-          :key="index"
-          :style="{
-            color: item.active ? '#ff0000' : '#000',
-            backgroundImage: `url(${item.optActive ? require('../../../static/dz.png') : 'none'})`,
-          }"
-          @click="handleClick(item)"
-        >
-          <text>{{ item.value }}</text>
-          <!-- <image class="icon" v-show="item.optActive" src="../../../static/dz.png" /> -->
-        </view>
+      <view class="right">
+        <view class="image"></view>
+        <text>{{ userInfo.pulse || 0 }}</text>
       </view>
+      <view class="game_btn" @click="handleRule">游戏规则</view>
     </view>
     <view class="kj-box">
       <view class="title">
@@ -48,6 +35,26 @@
         </view>
       </view>
     </view>
+    <view class="turntable">
+      <view class="num-box">
+        <view
+          class="item"
+          v-for="(item, index) in nums"
+          :key="index"
+          :style="{
+            color: item.active ? '#ff0000' : '#833E16',
+            backgroundColor: item.optActive ? '#FBEDBC' : '#ffeeee',
+          }"
+          @click="handleClick(item)"
+        >
+          <text>{{ item.value }}</text>
+        </view>
+      </view>
+      <view class="bet-btn" @click="handleBet">
+        <view>点击</view>
+        <view>投注</view>
+      </view>
+    </view>
     <view class="countdown">
       <text v-if="isKj">正在开奖中，已停止投注!!!</text>
       <text v-else>
@@ -55,11 +62,18 @@
       </text>
     </view>
     <view class="bet-opt">
-      <view class="item" v-for="(item, index) in betOpts" :key="index" @click="handleBet(item)">
-        {{ item }}豆子
+      <view
+        class="item"
+        v-for="(item, index) in betOpts"
+        :key="index"
+        :style="{
+          backgroundColor: item.isActive ? '#FBDD36' : '#fbedbc',
+        }"
+        @click="handleBetOpt(item)"
+      >
+        {{ item.value }}豆子
       </view>
     </view>
-    <view class="rule-box" @click="handleRule">| 游戏规则 |</view>
   </view>
 </template>
 
@@ -84,7 +98,32 @@ const nums = ref<NumsType[]>([])
 
 const kjNums = ref([1, 2, 3, 4, 5, 6, 7, 8, 9, 10])
 
-const betOpts = ref([100, 500, 1000, 2000, 3000, 5000])
+const betOpts = ref([
+  {
+    isActive: false,
+    value: 100,
+  },
+  {
+    isActive: false,
+    value: 500,
+  },
+  {
+    isActive: false,
+    value: 1000,
+  },
+  {
+    isActive: false,
+    value: 2000,
+  },
+  {
+    isActive: false,
+    value: 3000,
+  },
+  {
+    isActive: false,
+    value: 5000,
+  },
+])
 
 Taro.useDidShow(() => {
   get_info()
@@ -154,16 +193,29 @@ const handleClick = (itemOpt) => {
   itemOpt.optActive = true
 }
 
-const handleBet = (item: number) => {
+const handleBetOpt = (item) => {
+  betOpts.value.forEach((item) => {
+    item.isActive = false
+  })
+  item.isActive = true
+}
+
+const handleBet = () => {
   const newNums = nums.value.filter((item) => item.optActive === true)
   if (newNums.length === 0)
     return Taro.showToast({
       title: '请选择投注项',
       icon: 'none',
     })
+  const item = betOpts.value.filter((item) => item.isActive === true)
+  if (item.length === 0)
+    return Taro.showToast({
+      title: '请选择投注豆子',
+      icon: 'none',
+    })
   Taro.showModal({
     title: '确认投注吗？',
-    content: `投注豆子：${item}`,
+    content: `投注豆子：${item[0].value}`,
     success: async (res) => {
       if (res.confirm) {
         const game_info = Taro.getStorageSync('gameItem')
@@ -171,7 +223,7 @@ const handleBet = (item: number) => {
         const res = await turntable_bet({
           uid: uid,
           aid: nums.value.filter((item) => item.optActive === true)[0].ID,
-          number: item,
+          number: item[0].value,
           game_id: game_info.ID,
         })
         Taro.showToast({
@@ -201,6 +253,6 @@ const toPage = (type: number) => {
 }
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss">
 @import './index.scss';
 </style>