i

src/app.config.ts

@@ -11,5 +11,5 @@ export default defineAppConfig({
     navigationBarTitleText: 'Game',
     navigationBarTextStyle: 'black'
   },
-  // animation: false
+  animation: false
 })

src/pages/game_detail/index.scss

@@ -1,5 +1,7 @@
 .index {
   position: relative;
+  width: 100%;
+  height: 100vh;
 
   .swiper {
     background-color: white;

src/pages/index/index.scss

@@ -1,4 +1,6 @@
 .index {
+  width: 100%;
+  height: 100vh;
   .title {
     margin: 60px;
     font-size: 50px;

src/pages/yaotouzi/index/index.scss

@@ -3,14 +3,14 @@
   width: 100%;
   height: 100%;
 
-  .tips {
+  //.tips {
-    border-radius: 0;
+  //  border-radius: 0;
-    width: 100%;
+  //  width: 100%;
-    height: 60px;
+  //  height: 60px;
-  }
+  //}
 
   .userInfo {
-    width: 680px;
+    width: 90%;
     margin: 20px auto;
     //margin: auto;
     padding: 20px;
@@ -73,7 +73,7 @@
   }
 
   .gameInfo {
-    width: 680px;
+    width: 90%;
     margin: 20px auto;
     padding: 20px;
     display: flex;
@@ -90,7 +90,7 @@
 
       .game_box {
         margin-left: 10px;
-        width: 250px;
+        width: 200px;
         // 文字超出显示省略号
         overflow: hidden;
         white-space: nowrap;
@@ -119,6 +119,10 @@
       }
     }
 
+    .center {
+      font-size: 30px;
+    }
+
     .right {
 
       .btn {
@@ -178,25 +182,42 @@
 
   .opt1 {
     display: flex;
-    justify-content: space-evenly;
+    justify-content: space-between;
     flex-wrap: wrap;
     text-align: center;
+    box-sizing: border-box;
+    height: 400px;
+    padding: 10px;
+
+    .optt {
+      width: 27%;
+      height: 100%;
+    }
 
     .item {
-      width: 200px;
+      width: 100%;
       margin-bottom: 10px;
       text-align: center;
-      padding: 31px 0;
       border: 1px dashed #228960;
       position: relative;
+      height: 48%;
 
       .name {
         font-size: 55px;
         font-weight: bold;
+        position: absolute;
+        top: 40%;
+        left: 50%;
+        transform: translate(-50%, -50%);
       }
 
       .odd {
         font-size: 25px;
+        position: absolute;
+        width: 100%;
+        top: 60%;
+        left: 50%;
+        transform: translate(-50%, -10%);
       }
 
       .mask {
@@ -222,8 +243,9 @@
     .base {
       background-image: url("../../../static/cais.png");
       background-size: 100% 100%;
-      width: 300px;
+      //flex: 1;
-      height: 400px;
+      width: 43%;
+      height: 100%;
       display: flex;
       flex-direction: column;
       justify-content: flex-end;
@@ -234,8 +256,8 @@
       .qz {
         background-image: url("../../../static/qz.png");
         background-size: 100% 100%;
-        width: 300px;
+        width: 100%;
-        height: 100px;
+        height: 25%;
         margin-bottom: 20px;
         line-height: 100px;
         color: #FBE039;
@@ -318,12 +340,15 @@
 @keyframes flicker {
   0% {
     border: 1px dashed #228960;
+    background-color: #228960;
   }
   50% {
     border: 1px dashed white;
+    background: rgba(225, 225, 225, 0.5);
   }
   100% {
     border: 1px dashed #228960;
+    background-color: #228960;
   }
 }
 

src/pages/yaotouzi/index/index.vue

@@ -2,6 +2,7 @@
   <view class="index">
     <!--  公告  -->
     <view class="subColor tips"></view>
+    <scroll-view style="height: 100vh" scroll-y>
       <!--  用户信息  -->
       <view class="subColor userInfo">
         <view class="left">
@@ -29,6 +30,9 @@
             </view>
           </view>
         </view>
+        <view class="center">
+          <view>剩余{{ time }}s开奖</view>
+        </view>
         <view class="right">
           <view class="btn" @click="toPage(1)">开奖记录</view>
           <view class="btn mt-15" @click="toPage(2)">投注记录</view>
@@ -45,9 +49,8 @@
           </view>
         </view>
       </view>
-    <view style="height: 8px"></view>
       <view class="opt1" v-if="odds1.length > 0">
-      <view>
+        <view class="optt">
           <view class="subColor item" :class="{flicker: odds1[0].flicker}" @click.stop="addNum(odds1[0])">
             <view class="name">{{ odds1[0].name }}</view>
             <view class="odd">赢{{ odds1[0].odds }}倍</view>
@@ -71,7 +74,7 @@
           </view>
           <view class="expanding-div" v-if="isShow">{{ nowKJInfo.Start }} - {{ nowKJInfo.End }}</view>
         </view>
-      <view>
+        <view class="optt">
           <view class="subColor item" :class="{flicker: odds1[2].flicker}" @click.stop="addNum(odds1[2])">
             <view class="name">{{ odds1[2].name }}</view>
             <view class="odd">赢{{ odds1[2].odds }}倍</view>
@@ -88,7 +91,6 @@
           </view>
         </view>
       </view>
-    <view style="height: 4px"></view>
       <view class="opt">
         <view
           class="subColor item"
@@ -106,6 +108,7 @@
         </view>
         <view style="width: 18%;"></view>
       </view>
+    </scroll-view>
     <!--  底部操作栏  -->
     <view class="subColor bottomBar">
       <view class="btn1" @click="clearBet">重置</view>
@@ -146,6 +149,8 @@ const odds2 = ref<Odd[]>([])
 
 const qzTitle = ref('请投注')
 
+const time = ref(0)
+
 const nowKJInfo = ref<{
   Start?: string
   End?: string
@@ -159,7 +164,7 @@ const userInfo = ref<{
   avatarUrl?: string
 }>({})
 
-const zjObj = ref({})
+const zjObj = ref<any>([])
 
 const iMsgNum = ref(0)
 
@@ -235,6 +240,7 @@ const initWs = () => {
     switch (res.code) {
       case 200:
         let num = Number(res.data)
+        time.value = num
         if (num === 5) {
           openDraw()
         }
@@ -268,15 +274,12 @@ const initWs = () => {
         })
         break
       case 666:
+        break
+      default:
         iMsgNum.value++
-        const newObj = JSON.parse(res.data)
+        const arr = Object.values(res)
-        const arr = Object.values(newObj)
+        zjObj.value.push(...arr)
-        // zjObj.value = {
+        if (iMsgNum.value === 3 || zjObj.value.length === 1) {
-        //   ...zjObj.value,
-        //   ...newObj
-        // }
-        console.log(arr)
-        if (iMsgNum.value === 19) {
           iMsgNum.value = 0
           startFlicker()
         }
@@ -314,17 +317,17 @@ const openDraw = () => {
   }, 5000)
 }
 
-const oddVal = ref(1)
+const oddVal = ref(10)
 const changeOdd = () => {
   switch (oddVal.value) {
-    case 1:
-      oddVal.value = 10
-      break
     case 10:
       oddVal.value = 100
       break
+    // case 10:
+    //   oddVal.value = 100
+    //   break
     case 100:
-      oddVal.value = 1
+      oddVal.value = 10
       break
   }
 }
@@ -357,6 +360,12 @@ const addNum = (item: any) => {
 
 // 投注
 const verifyBet = () => {
+
+  if (isKj.value) return Taro.showToast({
+    title: '正在开奖，不能下注',
+    icon: 'none'
+  })
+
   let numCount = 0
 
   odds.value.forEach((item: any) => {
@@ -424,7 +433,9 @@ const verifyBet = () => {
     data: data
   }))
 
+  setTimeout(() => {
     getUserInfo()
+  }, 1000)
 
   qzTitle.value = '已投注'
   clearBet()
@@ -448,22 +459,22 @@ const playAminExpand = () => {
 
 // 开始闪烁
 const startFlicker = () => {
-  console.log('开始闪烁', zjObj.value)
   flickerItems(odds.value)
   flickerItems(odds1.value)
   flickerItems(odds2.value)
+  zjObj.value = []
 }
 
 const flickerItems = (items: any[]) => {
   items.forEach((item) => {
-    for (const val in zjObj.value) {
+    zjObj.value.forEach((item2: any) => {
-      if (item.name === zjObj.value[val]) {
+      if (item.name === item2) {
         item.flicker = true
         setTimeout(() => {
           item.flicker = false
         }, 3000)
       }
-    }
+    })
   })
 }
 </script>

src/pages/yaotouzi/records/index.config.ts

@@ -1,3 +1,4 @@
 export default definePageConfig({
-    navigationBarBackgroundColor: '#23684B'
+  navigationBarBackgroundColor: '#23684B',
+  enablePullDownRefresh: true
 })

src/pages/yaotouzi/records/index.vue

@@ -13,6 +13,7 @@
       </view>
     </template>
     <template v-else>
+      <view v-if="list.length > 0">
         <view class="card desc" v-for="(item,index) in list as any[]" :key="index">
           <view>
             <view>第{{ item.Periods }}期投注:
@@ -25,11 +26,16 @@
               <text>{{ item.DrawTime }}</text>
             </view>
           </view>
-        <view>
+          <view style="text-align: right">
             <view style="color: red" v-if="item.State === 1">+{{ item.DrawNum }}积分</view>
-          <view style="color: green">-{{ item.Number }}</view>
+            <view style="color: green">-{{ item.Number }}豆子</view>
           </view>
         </view>
+      </view>
+      <view v-else>
+        <view style="margin-top: 100px">暂无记录.....</view>
+      </view>
+
     </template>
   </view>
 </template>
@@ -46,17 +52,26 @@ const typeNum = ref(0)
 Taro.useLoad((options) => {
   typeNum.value = Number(options.type)
   Taro.setNavigationBarTitle({title: options.type === '1' ? '开奖记录' : '投注记录'})
-  getData(options.type)
+  getData()
 })
 
-const getData = async (type: string) => {
+Taro.usePullDownRefresh(() => {
+  getData()
+})
+
+const getData = async () => {
   let res: any
-  if (type === '1') {
+  if (typeNum.value === 1) {
     res = await getKaiJiangList()
+    list.value = res.data.data
   } else {
     res = await getTzJl(Taro.getStorageSync('uid'))
+    console.log(res)
+    list.value = res.data.data.sort(
+      (a: any, b: any) => b.Periods - a.Periods
+    )
   }
-  list.value = res.data.data
+  Taro.stopPullDownRefresh()
 }
 </script>
 
@@ -65,8 +80,11 @@ const getData = async (type: string) => {
   display: flex;
   flex-direction: column;
   align-items: center;
-  justify-content: center;
+  //justify-content: center;
   font-size: 35px;
+  width: 100%;
+  padding: 10px;
+  box-sizing: border-box;
 }
 
 .card {
@@ -86,6 +104,7 @@ const getData = async (type: string) => {
   display: flex;
   justify-content: space-between;
   align-items: center;
+  width: 100%;
 }
 
 </style>

src/utils/request.ts

@@ -9,6 +9,9 @@ export interface RequestParams {
 }
 
 const request = (request: RequestParams): Promise<any> => {
+  Taro.showLoading({
+    title: '加载中',
+  })
   return new Promise((resolve, reject) => {
     Taro.request({
       url: `${app.API_URL()}${request.url}`,
@@ -19,9 +22,11 @@ const request = (request: RequestParams): Promise<any> => {
       data: request.data || {},
       success: (res) => {
         resolve(res.data);
+        Taro.hideLoading();
       },
       fail: (err) => {
         reject(err);
+        Taro.hideLoading();
       },
     });
   });