细节优化

src/container/listContainer/index.scss

@@ -1,6 +1,6 @@
 .listContentWrapper {
-  padding: 0 5px;
+  // padding: 0 5px;
-  background: #fafafa;
+  // background: #fafafa;
   display: flex;
   flex-direction: column;
   gap: 5px;

src/user_pages/billDetail/index.scss

@@ -1,7 +1,9 @@
 .bill-detail-page {
-  min-height: 100vh;
+  height: 100vh;
   background-color: #f5f5f5;
   padding: 5px;
+  box-sizing: border-box;
+  overflow: hidden;
   .title-text-box {
     height: 118px;
     display: flex;

src/user_pages/downloadBillRecords/index.scss

@@ -7,6 +7,15 @@
     line-height: 24px;
     letter-spacing: 0px;
     padding: 20px;
+    height: 100vh;
+    overflow-y: auto;
+
+    &::-webkit-scrollbar {
+        display: none;
+        width: 0;
+        height: 0;
+        color: transparent;
+    }
 
 
     .records-container {

src/user_pages/edit/index.scss

@@ -1,10 +1,18 @@
 // 编辑资料页面样式
 .edit_profile_page {
-  min-height: 100vh;
+  height: 100vh;
   background: radial-gradient(circle at 50% 0%, rgba(238, 255, 220, 1) 0%, rgba(255, 255, 255, 1) 37%);
   position: relative;
   // overflow: hidden;
   box-sizing: border-box;
+  overflow-y: auto;
+
+  &::-webkit-scrollbar {
+    display: none;
+    width: 0;
+    height: 0;
+    color: transparent;
+  }
 }
 
 .custom-navbar {
@@ -20,7 +28,6 @@
   position: sticky;
   top: 0;
   z-index: 100;
-  overflow: hidden;
   background-color: rgb(238, 255, 220);
 }
 
@@ -285,10 +292,12 @@
             flex: 1;
             text-align: right;
             background-color: unset;
+
             &.placeholer {
               font-weight: 400;
               color: rgba(60, 60, 67, 0.3);
             }
+
             &:after {
               border: none;
             }
@@ -305,10 +314,10 @@
         }
       }
 
-      .divider{
+      .divider {
         height: 1px;
-        background-color: rgba(0, 0, 0, 0.06) ;
+        background-color: rgba(0, 0, 0, 0.06);
-        margin-left:35px;
+        margin-left: 35px;
         box-sizing: border-box;
       }
     }

src/user_pages/myself/index.scss

@@ -2,21 +2,28 @@
 
 // 个人页面样式
 .myself_page {
-  min-height: 100vh;
+  height: 100vh;
   background: radial-gradient(circle at 50% 0,
       /* 光晕圆心在顶部中间 */
       rgba(173, 216, 230, 0.9) 0px,
       /* 中间更深的浅蓝 */
       rgba(173, 216, 230, 0.5) 200px,
       /* 100px 处开始淡化 */
-      rgba(255, 255, 255, 1) 300px,
+      #fafafa 300px,
       /* 到 200px 变成白色 */
-      #ffffff 100%
+      #fafafa 100%
       /* 200px 以下全白 */
     );
   position: relative;
-  overflow: hidden;
+  overflow-y: auto;
   box-sizing: border-box;
+
+  &::-webkit-scrollbar {
+    display: none;
+    width: 0;
+    height: 0;
+    color: transparent;
+  }
 }
 
 // 主要内容区域
@@ -26,7 +33,6 @@
   flex: 1;
   margin-top: 0;
   box-sizing: border-box;
-  overflow-y: auto;
   padding: 0px 15px 15px 15px;
 
   // 用户信息区域

src/user_pages/myself/index.tsx

@@ -170,6 +170,12 @@ const MyselfPage: React.FC = () => {
     }
   };
 
+  const goPublish = () => {
+    Taro.navigateTo({
+      url: "/publish_pages/publishBall/index",
+    });
+  }
+
   // 处理球局订单
   const handle_game_orders = () => {
     Taro.navigateTo({
@@ -237,9 +243,8 @@ const MyselfPage: React.FC = () => {
               <Text className="tab_text">我主办的</Text>
             </View>
             <View
-              className={`tab_item ${
+              className={`tab_item ${active_tab === "participated" ? "active" : ""
-                active_tab === "participated" ? "active" : ""
+                }`}
-              }`}
               onClick={() => setActiveTab("participated")}
             >
               <Text className="tab_text">我参与的</Text>
@@ -259,8 +264,8 @@ const MyselfPage: React.FC = () => {
               emptyText="暂未发布球局"
               btnText="去发布"
               btnImg="ICON_ADD"
-              reload={load_game_data}
+              reload={goPublish}
-              loadMoreMatches={() => {}}
+              loadMoreMatches={() => { }}
             />
           </ScrollView>
         </View>
@@ -283,7 +288,7 @@ const MyselfPage: React.FC = () => {
               loading={loading}
               error={null}
               errorImg="ICON_LIST_EMPTY"
-              loadMoreMatches={() => {}}
+              loadMoreMatches={() => { }}
             />
           </ScrollView>
           {/* </View> */}

src/user_pages/queryTransactions/index.scss

@@ -1,6 +1,14 @@
 .listSearchContainer {
   padding: 0 15px;
-  padding-top: 16px;
+  height: 100vh;
+  box-sizing: border-box;
+
+  &::-webkit-scrollbar {
+    display: none;
+    width: 0;
+    height: 0;
+    color: transparent;
+  }
 
   .icon16 {
     width: 16px;
@@ -8,12 +16,11 @@
   }
 
   .topSearchWrapper {
-    position: fixed;
+    position: sticky;
-    top: 0;
+    top: -1px;
-    left: 0;
     background-color: #fff;
-    width: 100vw;
+    width: calc(100vw - 28px);
-    padding: 5px 15px;
+    padding: 5px 0;
     box-sizing: border-box;
   }
 
@@ -36,7 +43,7 @@
   }
 
   .historySearch {
-    padding-top: 50px;
+    // padding-top: 50px;
   }
 
   .searchRight {
@@ -135,7 +142,15 @@
   }
 
   .transaction_list {
-    padding: 40px 0 70px;
+    padding: 0 0 80px;
+    // overflow-y: auto;
+
+    // &::-webkit-scrollbar {
+    //   display: none;
+    //   width: 0;
+    //   height: 0;
+    //   color: transparent;
+    // }
 
     .loading_state,
     .empty_state {

src/user_pages/queryTransactions/index.tsx

@@ -46,11 +46,11 @@ const QueryTransactions = () => {
     getSearchHistory();
   }, []);
 
-  useEffect(() => {
+  // useEffect(() => {
-    if (ref?.current) {
+  //   if (ref?.current) {
-      ref.current.focus();
+  //     ref.current.focus();
-    }
+  //   }
-  }, [ref.current]);
+  // }, [ref.current]);
 
   useReachBottom(() => {
     if (load_transactions_params.page >= totalpages) return;
@@ -99,7 +99,8 @@ const QueryTransactions = () => {
   /**
    * @description 点击清空输入内容
    */
-  const handleClear = () => {
+  const handleClear = (e) => {
+    e.stopPropagation();
     setKeyword("");
     setTransactions([]);
     set_load_transactions_params((prev) => {
@@ -247,7 +248,7 @@ const QueryTransactions = () => {
               defaultValue={keyword}
               onChange={handleChange}
               onClear={handleClear}
-              autoFocus
+              onBlur={() => {setKeyword(load_transactions_params.keyword)}}
               clearable={false}
               ref={ref}
             />

src/user_pages/setTransactionPassword/index.scss

@@ -1,7 +1,9 @@
 .set-transaction-password-page {
-    min-height: 100vh;
+    height: 100vh;
     background-color: #f5f5f5;
     padding: 20px;
+    box-sizing: border-box;
+    overflow: hidden;
 
     .form-item {
         height: 50px;
@@ -29,6 +31,7 @@
     }
 
     .btn {
+        width: 78px;
         height: 24px;
         border: 1px solid rgba(0, 0, 0, 0.06);
         display: flex;

src/user_pages/setTransactionPassword/index.tsx

@@ -16,6 +16,8 @@ interface FormFields {
 const SetTransactionPassword: React.FC = () => {
   // 使用全局键盘状态
   const { keyboardHeight, isKeyboardVisible, addListener, initializeKeyboardListener } = useKeyboardHeight()
+  const [smsCodeSended, setSmsCodeSended] = useState(false);
+  const [smsCodeText, setSmsCodeText] = useState('获取验证码');
   // 使用全局键盘状态监听
   useEffect(() => {
     // 初始化全局键盘监听器
@@ -86,9 +88,22 @@ const SetTransactionPassword: React.FC = () => {
         type: "set_password",
       });
       Taro.showToast({
-        title: "验证码发送成功",
+        title: "验证码已发送",
         icon: "none",
       });
+      let time = 60;
+      setSmsCodeText(`${time}秒后重发`);
+      const timer = setInterval(() => {
+        if (time > 0) {
+          time--;
+          setSmsCodeText(`${time}秒后重发`);
+        } else {
+          setSmsCodeText('获取验证码');
+          setSmsCodeSended(false);
+          clearInterval(timer);
+        }
+      }, 1000);
+      setSmsCodeSended(true);
     } catch (error) {
       Taro.showToast({
         title: "验证码发送失败",
@@ -142,9 +157,7 @@ const SetTransactionPassword: React.FC = () => {
               handleInput(e, "sms_code");
             }}
           ></Input>
-          <Button className="btn" onClick={getSMSCode}>
+          <Button className={`btn ${smsCodeSended ? 'disabled' : ''}`} disabled={smsCodeSended} onClick={getSMSCode}>{smsCodeText}</Button>
-            获取验证码
-          </Button>
         </View>
       )}
       <Text className="tips">* 密码由6位数字组成</Text>

src/user_pages/validPhone/index.scss

@@ -1,7 +1,9 @@
 .set-transaction-password-page {
-    min-height: 100vh;
     background-color: #f5f5f5;
     padding: 20px;
+    box-sizing: border-box;
+    height: 100vh;
+    overflow-y: hidden;
 
     .form-item {
         height: 50px;
@@ -18,6 +20,7 @@
     }
 
     .btn {
+        width: 78px;
         height: 24px;
         border: 1px solid rgba(0, 0, 0, 0.06);
         display: flex;
@@ -34,6 +37,10 @@
         line-height: normal;
         border-radius: 8px;
         margin-right: 0;
+
+        &.disabled {
+            color: rgba(255, 255, 255, 0.30);
+        }
     }
 
     .bottom-btn {
@@ -45,9 +52,5 @@
         border-radius: 16px;
         font-size: 16px;
         font-weight: 600;
-
-        &.disabled {
-            color: rgba(255, 255, 255, 0.30);
-        }
     }
 }

src/user_pages/validPhone/index.tsx

@@ -15,6 +15,8 @@ interface FormFields {
 const ValidPhone: React.FC = () => {
   // 使用全局键盘状态
   const { keyboardHeight, isKeyboardVisible, addListener, initializeKeyboardListener } = useKeyboardHeight()
+  const [smsCodeSended, setSmsCodeSended] = useState(false);
+  const [smsCodeText, setSmsCodeText] = useState('获取验证码');
   // 使用全局键盘状态监听
   useEffect(() => {
     // 初始化全局键盘监听器
@@ -69,6 +71,19 @@ const ValidPhone: React.FC = () => {
     try {
       await httpService.post("/wallet/send_reset_password_sms", { phone });
       Taro.showToast({ title: "验证码已发送", icon: "none" });
+      let time = 60;
+      setSmsCodeText(`${time}秒后重发`);
+      const timer = setInterval(() => {
+        if (time > 0) {
+          time--;
+          setSmsCodeText(`${time}秒后重发`);
+        } else {
+          setSmsCodeText('获取验证码');
+          setSmsCodeSended(false);
+          clearInterval(timer);
+        }
+      }, 1000);
+      setSmsCodeSended(true);
     } catch (error) {
       console.log(error);
       Taro.showToast({ title: "获取验证码失败", icon: "none" });
@@ -84,7 +99,7 @@ const ValidPhone: React.FC = () => {
       <View className="form-item">
         <Text className="form-label">验证码</Text>
         <Input placeholder="请输入验证码" type="number" onInput={(e) => { handleInput(e, "sms_code") }}></Input>
-        <Button className="btn" onClick={getSMSCode}>获取验证码</Button>
+        <Button className={`btn ${smsCodeSended ? 'disabled' : ''}`} disabled={smsCodeSended} onClick={getSMSCode}>{smsCodeText}</Button>
       </View>
       <Button className={`btn bottom-btn ${formData.sms_code === "" ? 'disabled' : ''}`} disabled={formData.sms_code === ""} onClick={handleConfirm} style={{ bottom: isKeyboardVisible ? `${keyboardHeight + 20}px` : undefined }}>提交</Button>
     </View>

src/user_pages/wallet/index.scss

@@ -1,11 +1,16 @@
 // @use '../../scss/common.scss' as *;
 
 .wallet_page {
-  min-height: 100vh;
   background-color: #f5f5f5;
-  padding: 5px;
+  padding: 0 5px 5px;
   box-sizing: border-box;
 
+  &::-webkit-scrollbar {
+    display: none;
+    width: 0;
+    height: 0;
+  }
+
   .wallet_main_card {
     background: #000;
     border-radius: 20px;
@@ -155,7 +160,7 @@
       padding: 12px 20px;
       border-bottom: 0.5px solid rgba(120, 120, 128, 0.12);
       position: sticky;
-      top: 0;
+      top: -1px;
       background-color: #fff;
 
       .history_title {
@@ -363,6 +368,7 @@
     .form_section {
       .form_item {
         margin-bottom: 20px;
+
         .form_label {
           display: inline-block;
           font-family: PingFang SC;
@@ -376,11 +382,13 @@
           display: grid;
           grid-template-columns: repeat(3, 1fr);
           gap: 8px;
+
           .option_item {
             background-color: #0000000D;
             text-align: center;
             padding: 8px;
             border-radius: 4px;
+
             &.active {
               background-color: #000000;
               color: #fff;

src/user_pages/wallet/index.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from "react";
-import { View, Text, Input, Button, Image } from "@tarojs/components";
+import { View, Text, Input, Button, Image, ScrollView } from "@tarojs/components";
 import Taro, { useDidShow } from "@tarojs/taro";
 import "./index.scss";
 import { CommonPopup } from "@/components";
@@ -430,7 +430,7 @@ const WalletPage: React.FC = () => {
   };
 
   return (
-    <View className="wallet_page">
+    <ScrollView className="wallet_page" scrollY enhanced showScrollbar={false}>
       {/* 钱包主卡片 */}
       <View className="wallet_main_card">
         {/* 头部信息 */}
@@ -700,7 +700,7 @@ const WalletPage: React.FC = () => {
           </View>
         </View>
       </CommonPopup>
-    </View>
+    </ScrollView>
   );
 };