feat: 球局状态操作done

src/game_pages/detail/index.tsx

@@ -13,6 +13,7 @@ import Taro, {
   useShareTimeline,
   useDidShow,
 } from "@tarojs/taro";
+import classnames from 'classnames'
 import dayjs from "dayjs";
 import "dayjs/locale/zh-cn";
 // 导入API服务
@@ -27,7 +28,7 @@ import {
   SceneType,
   DisplayConditionType,
 } from "@/components/NTRPEvaluatePopup";
-import DetailService, { MATCH_STATUS } from "@/services/detailService";
+import DetailService, { MATCH_STATUS, IsSubstituteSupported } from "@/services/detailService";
 import * as LoginService from "@/services/loginService";
 import OrderService from "@/services/orderService";
 import { getCurrentLocation, calculateDistance } from "@/utils/locationUtils";
@@ -228,11 +229,19 @@ function toast(message) {
   Taro.showToast({ title: message, icon: "none" });
 }
 
+function isFull (counts) {
+  const { max_players, current_players, max_substitute_players, current_substitute_count, is_substitute_supported } = counts
+  if (is_substitute_supported === IsSubstituteSupported.SUPPORT) {
+    return max_substitute_players === current_substitute_count
+  }
+  return max_players === current_players
+}
+
 // 底部操作栏
 function StickyButton(props) {
   const { handleShare, handleJoinGame, detail, onStatusChange } = props;
   const ntrpRef = useRef(null);
-  const { id, price, user_action_status, end_time, is_organizer } =
+  const { id, price, user_action_status, match_status, start_time, end_time, is_organizer } =
     detail || {};
 
   const gameManageRef = useRef();
@@ -244,7 +253,7 @@ function StickyButton(props) {
 
   function generateTextAndAction(
     user_action_status: null | { [key: string]: boolean }
-  ): undefined | { text: string | React.FC; action: () => void } {
+  ): undefined | { text: string | React.FC; action?: () => void; available?: boolean } {
     if (!user_action_status) {
       return;
     }
@@ -259,13 +268,29 @@ function StickyButton(props) {
       is_substituting,
       waiting_start,
     } = user_action_status || {};
-    if (
-      Object.values(user_action_status).every((value) => !value) &&
-      dayjs(end_time).isBefore(dayjs())
-    ) {
+    if (MATCH_STATUS.CANCELED === match_status) {
+      return {
+        text: "活动已取消",
+        available: false,
+        // action: () => toast("活动已取消"),
+      };
+    } else if (dayjs(end_time).isBefore(dayjs())) {
       return {
         text: "活动已结束",
-        action: () => toast("活动已结束"),
+        available: false,
+        // action: () => toast("活动已结束"),
+      };
+    } else if (dayjs(start_time).isBefore(dayjs())) {
+      return {
+        text: "活动已开始",
+        available: false,
+        // action: () => toast("活动已开始"),
+      };
+    } else if (isFull(detail)) {
+      return {
+        text: "活动已满员",
+        available: false,
+        // action: () => toast("活动已满员"),
       };
     }
     if (waiting_start) {
@@ -284,7 +309,9 @@ function StickyButton(props) {
         action: async () => {
           const res = await OrderService.getUnpaidOrder(id);
           if (res.code === 0) {
-            navto(`/order_pages/orderDetail/index?id=${res.data.order_info.order_id}`);
+            navto(
+              `/order_pages/orderDetail/index?id=${res.data.order_info.order_id}`
+            );
           }
         },
       };
@@ -317,7 +344,8 @@ function StickyButton(props) {
     }
     return {
       text: "球局无法加入",
-      action: () => {},
+      available: false,
+      // action: () => {},
     };
   }
 
@@ -325,7 +353,7 @@ function StickyButton(props) {
     return "";
   }
 
-  const { text, action } = generateTextAndAction(user_action_status)!;
+  const { text, available = true, action = () => {} } = generateTextAndAction(user_action_status)!;
 
   let ActionText: React.FC | string = text;
 
@@ -360,8 +388,12 @@ function StickyButton(props) {
             <Text className="sticky-bottom-bar-comment-text">32</Text>
           </View>
         </View>
-        <View className="detail-main-action">
-          <View className="sticky-bottom-bar-join-game" onClick={action}>
+        <View className={classnames("detail-main-action", available ? '' : 'disabled')}>
+          <View
+            style={is_organizer ? {} : { margin: "auto" }}
+            className="sticky-bottom-bar-join-game"
+            onClick={action}
+          >
             <ActionText />
           </View>
           {is_organizer && (