feat: 球局详情管理 未完

src/components/GameManagePopup/index.module.scss

@@ -0,0 +1,27 @@
+.container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  padding-bottom: 40px;
+
+  .button {
+    width: 100%;
+    padding: 20px 0;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    color: #000;
+    text-align: center;
+    font-feature-settings: 'liga' off, 'clig' off;
+    font-family: "PingFang SC";
+    font-size: 16px;
+    font-style: normal;
+    font-weight: 600;
+    line-height: 20px;
+
+    &:last-child {
+      border-top: 8px solid #f5f5f5;
+    }
+  }
+}

src/components/GameManagePopup/index.tsx

@@ -0,0 +1,145 @@
+import React, {
+  useState,
+  forwardRef,
+  useImperativeHandle,
+  useRef,
+} from "react";
+import Taro from "@tarojs/taro";
+import { View } from "@tarojs/components";
+import CommonPopup from "../CommonPopup";
+import styles from "./index.module.scss";
+import detailService from "@/services/detailService";
+import { useUserInfo } from "@/store/userStore";
+
+const CancelPopup = forwardRef((props, ref) => {
+  const [visible, setVisible] = useState(false);
+  const onFinish = useRef(null);
+
+  useImperativeHandle(ref, () => ({
+    show: (onAct) => {
+      onFinish.current = onAct;
+      setVisible(true);
+    },
+  }));
+
+  function onClose() {
+    setVisible(false);
+  }
+  return (
+    <>
+      <CommonPopup
+        visible={visible}
+        showHeader={false}
+        hideFooter
+        zIndex={1001}
+        enableDragToClose={false}
+        onClose={onClose}
+      >
+        <View className={styles.container}></View>
+      </CommonPopup>
+    </>
+  );
+});
+
+export default forwardRef(function GameManagePopup(props, ref) {
+  const [visible, setVisible] = useState(false);
+  const [detail, setDetail] = useState({});
+  const onStatusChange = useRef(null);
+  const cancelRef = useRef(null);
+  const userInfo = useUserInfo();
+
+  useImperativeHandle(ref, () => ({
+    show: (gameDetail, onChange) => {
+      onStatusChange.current = onChange;
+      setDetail(gameDetail);
+      setVisible(true);
+    },
+  }));
+
+  function handleEditGame() {
+    Taro.navigateTo({
+      url: `/publish_pages/publishBall/index?gameId=${detail.id}`,
+    });
+    onClose()
+  }
+
+  const handleRepubGame = handleEditGame;
+
+  async function handleCancelGame() {
+    cancelRef.current.show(async (result) => {
+      if (result) {
+        try {
+          const res = await detailService.disbandGame({
+            game_id: detail.id,
+            settle_reason: result,
+          });
+          if (res.code === 0) {
+            Taro.showToast({ title: "活动取消成功" });
+            onStatusChange.current?.(true);
+          }
+        } catch (e) {
+          Taro.showToast({ title: e.message, icon: "error" });
+        } finally {
+          onClose();
+        }
+      }
+    });
+  }
+
+  async function handleQuitGame() {
+    try {
+      const res = await detailService.organizerQuit({
+        game_id: detail.id,
+        quit_reason: "组织者主动退出",
+      });
+      if (res.code === 0) {
+        Taro.showToast({ title: "活动退出成功" });
+        onStatusChange.current?.(true);
+      }
+    } catch (e) {
+      Taro.showToast({ title: e.message, icon: "error" });
+    } finally {
+      onClose();
+    }
+  }
+
+  function onClose() {
+    setVisible(false);
+  }
+
+  const hasJoin = (detail.participants || []).some(item => item.user.id === userInfo.id)
+
+  return (
+    <>
+      <CommonPopup
+        visible={visible}
+        showHeader={false}
+        hideFooter
+        zIndex={1001}
+        enableDragToClose={false}
+        onClose={onClose}
+      >
+        <View className={styles.container}>
+          <View className={styles.button} onClick={handleEditGame}>
+            编辑活动
+          </View>
+          <View className={styles.button} onClick={handleRepubGame}>
+            重新发布
+          </View>
+          <View className={styles.button} onClick={handleCancelGame}>
+            取消活动
+          </View>
+          {!hasJoin && (
+            <View className={styles.button} onClick={handleQuitGame}>
+              退出活动
+            </View>
+          )}
+          <View className={styles.button} onClick={onClose}>
+            取消
+          </View>
+        </View>
+      </CommonPopup>
+      <CancelPopup ref={cancelRef} />
+    </>
+  );
+});