add win ui

src/reducers/duel/mod.ts

@@ -3,6 +3,7 @@
  *
  * */
 
+import { ygopro } from "../../api/ocgcore/idl/ocgcore";
 import { createSlice, PayloadAction } from "@reduxjs/toolkit";
 import { InitInfo, infoInitImpl, updateHpImpl } from "./initInfoSlice";
 import { TimeLimit, updateTimeLimitImpl } from "./timeLimit";
@@ -102,6 +103,7 @@ import {
   removeExtraDeckImpl,
   addExtraDeckIdleInteractivitiesImpl,
 } from "./extraDeckSlice";
+import MsgWin = ygopro.StocGameMessage.MsgWin;
 
 export interface DuelState {
   selfType?: number;
@@ -139,6 +141,8 @@ export interface DuelState {
 
   phase?: PhaseState;
 
+  result?: MsgWin.ActionType;
+
   // UI相关
   modalState: ModalState;
 }
@@ -250,6 +254,11 @@ const duelSlice = createSlice({
     // 通用的`Reducer`
     clearAllIdleInteractivities: clearAllIdleInteractivitiesImpl,
     clearAllPlaceInteractivities: clearAllPlaceInteractivitiesImpl,
+
+    // 对局结果`Reducer`
+    setResult: (state, action: PayloadAction<MsgWin.ActionType>) => {
+      state.result = action.payload;
+    },
   },
   extraReducers(builder) {
     handsCase(builder);
@@ -329,8 +338,12 @@ export const {
   setCheckCardModalV2ResponseAble,
   clearAllIdleInteractivities,
   clearAllPlaceInteractivities,
+  setResult,
 } = duelSlice.actions;
 export const selectDuelHsStart = (state: RootState) => {
   return state.duel.meInitInfo != null;
 };
+export const selectDuelResult = (state: RootState) => {
+  return state.duel.result;
+};
 export default duelSlice.reducer;

src/ui/Duel/hintNotification.tsx

@@ -3,11 +3,17 @@ import { useAppSelector } from "../../hook";
 import { selectMeHint, selectOpHint } from "../../reducers/duel/hintSlice";
 import { selectCurrentPhase } from "../../reducers/duel/phaseSlice";
 import { notification } from "antd";
+import { selectDuelResult } from "../../reducers/duel/mod";
+import { useNavigate } from "react-router-dom";
+import { ygopro } from "../../api/ocgcore/idl/ocgcore";
+import MsgWin = ygopro.StocGameMessage.MsgWin;
 
 const HintNotification = () => {
   const meHint = useAppSelector(selectMeHint);
   const opHint = useAppSelector(selectOpHint);
   const currentPhase = useAppSelector(selectCurrentPhase);
+  const result = useAppSelector(selectDuelResult);
+  const navigate = useNavigate();
 
   const [api, contextHolder] = notification.useNotification();
   useEffect(() => {
@@ -37,6 +43,24 @@ const HintNotification = () => {
     }
   }, [currentPhase]);
 
+  useEffect(() => {
+    if (result) {
+      const message =
+        result == MsgWin.ActionType.Win
+          ? "胜利"
+          : MsgWin.ActionType.Defeated
+          ? "失败"
+          : "未知结果";
+      api.info({
+        message,
+        placement: "bottom",
+        onClose() {
+          navigate("/");
+        },
+      });
+    }
+  }, [result]);
+
   return <>{contextHolder}</>;
 };