diff --git a/src/pages/aoshi/index/index.scss b/src/pages/aoshi/index/index.scss
index 8fa91eb..11bb854 100644
--- a/src/pages/aoshi/index/index.scss
+++ b/src/pages/aoshi/index/index.scss
@@ -1,5 +1,7 @@
 .taro_page {
-  background-color: #fff !important;
+  // background-color: #fff !important;
+  background-image: url('../static/bj.png');
+  background-size: 100% 100%;
 }
 
 .container {
@@ -11,13 +13,14 @@
     display: flex;
     justify-content: space-between;
     align-items: center;
+    color: #fff;
 
     .right {
       display: flex;
 
       .btn {
         padding: 5px 10px;
-        border: 1px solid #a6a6a6;
+        border: 1px solid #fff;
         border-radius: 10px;
 
         &:active {
@@ -35,10 +38,10 @@
     justify-content: space-between;
     align-items: center;
     margin-top: 40px;
-    border: 1px solid #a6a6a6;
-    padding: 20px 50px;
-    background-color: #f4f4f4;
-    border-radius: 15px;
+    padding: 20px;
+    background-color: #ff0606;
+    color: #fff;
+    border-radius: 26px;
 
     .left {
       display: flex;
@@ -53,84 +56,111 @@
         }
       }
     }
+
+    .right {
+      width: 200px;
+      height: 80px;
+      background-color: rgba(255, 255, 255, 0.4);
+      border-radius: 40px;
+      text-align: center;
+      line-height: 80px;
+      font-size: 40px;
+      display: flex;
+      align-items: center;
+      justify-content: space-around;
+
+      .image {
+        width: 50px;
+        height: 50px;
+        background-image: url('../../../static/dz.png');
+        background-size: 100% 100%;
+      }
+    }
+
+    .game_btn {
+      padding: 10px;
+      background: linear-gradient(0deg, #ff9600, #feec89);
+      border-radius: 34px;
+      color: #ff0606;
+      font-weight: bold;
+      text-align: center;
+    }
   }
 
   .turntable {
-    // width: 500px;
-    // height: 500px;
-    // border: 1px solid #a6a6a6;
-    // border-radius: 50%;
     margin: 30px auto;
-    // position: relative;
-
-    // &::before,
-    // &::after {
-    //   content: '';
-    //   position: absolute;
-    //   width: 100%;
-    //   height: 100%;
-    //   border-radius: 50%;
-    //   background-color: #a6a6a6;
-    // }
-
-    // &::before {
-    //   width: 2px;
-    //   height: 100%;
-    //   left: 50%;
-    //   top: 0;
-    //   transform: translateX(-50%);
-    // }
-
-    // &::after {
-    //   width: 100%;
-    //   height: 2px;
-    //   left: 0;
-    //   top: 50%;
-    //   transform: translateY(-50%);
-    // }
+    background-image: url('../static/zpbj.png');
+    background-size: 100% 100%;
+    position: relative;
 
     .num-box {
       display: flex;
-      // flex-direction: row;
       flex-wrap: wrap;
-      justify-content: space-between;
       align-items: center;
-      position: relative;
-      // padding: 50px;
-      position: relative;
+      padding: 80px;
+      margin: auto;
 
       .item {
-        width: 200px;
-        height: 200px;
+        height: 240px;
         text-align: center;
-        line-height: 200px;
+        line-height: 240px;
         font-size: 80px;
-        // background-size: cover;
-        background-repeat: no-repeat;
-
-        .icon {
-          position: absolute;
-          top: 20%;
-          width: 70px;
-          height: 70px;
-        }
+        font-weight: bold;
+        border: 5px solid #833e16;
       }
+      .item:nth-child(1) {
+        width: 48%;
+        // height: 240px;
+        border-radius: 100px 30px 30px 30px;
+      }
+      .item:nth-child(2) {
+        width: 48%;
+        // height: 240px;
+        border-radius: 30px 100px 30px 30px;
+      }
+      .item:nth-child(3) {
+        flex: 1;
+        // height: 240px;
+        border-radius: 30px 30px 100px 100px;
+      }
+    }
+
+    .bet-btn {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      width: 170px;
+      height: 170px;
+      background: #fbdd36;
+      border: 5px solid #b72100;
+      border-radius: 57px;
+      color: #ff0606;
+      font-size: 60px;
+      font-weight: bold;
+      text-align: center;
+      line-height: 1.4;
     }
   }
 
   .kj-box {
+    background-color: #ff0606;
+    border-radius: 26px;
+    padding: 20px 30px;
+    margin-top: 20px;
+    color: #fff;
     .title {
       font-size: 35px;
       font-weight: bold;
 
       .num {
-        color: red;
+        color: #fbdd36;
       }
     }
 
     .title-sub {
       text-align: center;
-      margin-top: 20px;
+      margin-top: 10px;
       font-size: 40px;
       display: flex;
 
@@ -143,16 +173,12 @@
 
       .item:nth-child(1) {
         font-weight: bold;
-        color: red;
+        color: #fbdd36;
       }
       .item:nth-child(2) {
         font-weight: bold;
-        color: red;
+        color: #fbdd36;
       }
-      // .item:nth-child(3) {
-      //   font-weight: bold;
-      //   color: red;
-      // }
     }
   }
 
@@ -160,12 +186,14 @@
     margin: 30px auto;
     width: 100%;
     height: 100px;
-    background-color: #ff0000;
+    background-color: #fbdd36;
     text-align: center;
     line-height: 100px;
-    border-radius: 15px;
-    color: #fff;
+    border-radius: 38px;
+    border: #ff0606 5px solid;
+    color: #ff0606;
     font-size: 40px;
+    font-weight: bold;
   }
 
   .bet-opt {
@@ -176,19 +204,12 @@
     .item {
       width: 200px;
       height: 100px;
-      border: 1px solid #ff0000;
-      border-radius: 10px;
+      // border: 1px solid #ff0000;
+      border-radius: 26px;
       margin-bottom: 20px;
       text-align: center;
       line-height: 100px;
+      color: #843e16;
     }
   }
-
-  .rule-box {
-    color: #ff0000;
-    font-size: 35px;
-    font-weight: bold;
-    margin-top: 20px;
-    text-align: center;
-  }
 }
diff --git a/src/pages/aoshi/index/index.vue b/src/pages/aoshi/index/index.vue
index a57edbb..796ecff 100644
--- a/src/pages/aoshi/index/index.vue
+++ b/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>
diff --git a/src/pages/aoshi/static/bj.png b/src/pages/aoshi/static/bj.png
new file mode 100644
index 0000000..3e9f830
Binary files /dev/null and b/src/pages/aoshi/static/bj.png differ
diff --git a/src/pages/aoshi/static/zpbj.png b/src/pages/aoshi/static/zpbj.png
new file mode 100644
index 0000000..4c59eb4
Binary files /dev/null and b/src/pages/aoshi/static/zpbj.png differ