update placeStore

src/service/duel/selectPlace.ts

@@ -14,12 +14,15 @@ export default (selectPlace: MsgSelectPlace) => {
       case ygopro.CardZone.MZONE:
       case ygopro.CardZone.SZONE:
         placeStore.set(place.zone, place.controller, place.sequence, {
+          interactivity: {
             interactType: InteractType.PLACE_SELECTABLE,
             response: {
               controller: place.controller,
               zone: place.zone,
               sequence: place.sequence,
             },
+          },
+          disabled: false,
         });
         break;
     }

src/stores/placeStore.ts

@@ -15,31 +15,60 @@ export type PlaceInteractivity =
 
 const { MZONE, SZONE } = ygopro.CardZone;
 
+export interface BlockState {
+  interactivity?: PlaceInteractivity; // 互动性
+  disabled: boolean;
+}
+
 export const placeStore = proxy({
   inner: {
     [MZONE]: {
-      me: Array.from({ length: 7 }).map(() => undefined as PlaceInteractivity),
-      op: Array.from({ length: 7 }).map(() => undefined as PlaceInteractivity),
+      me: Array.from({ length: 7 }).map(
+        () =>
+          ({
+            interactivity: undefined,
+            disabled: false,
+          } as BlockState)
+      ),
+      op: Array.from({ length: 7 }).map(
+        () =>
+          ({
+            interactivity: undefined,
+            disabled: false,
+          } as BlockState)
+      ),
     },
     [SZONE]: {
-      me: Array.from({ length: 6 }).map(() => undefined as PlaceInteractivity),
-      op: Array.from({ length: 6 }).map(() => undefined as PlaceInteractivity),
+      me: Array.from({ length: 6 }).map(
+        () =>
+          ({
+            interactivity: undefined,
+            disabled: false,
+          } as BlockState)
+      ),
+      op: Array.from({ length: 6 }).map(
+        () =>
+          ({
+            interactivity: undefined,
+            disabled: false,
+          } as BlockState)
+      ),
     },
   },
   set(
     zone: ygopro.CardZone.MZONE | ygopro.CardZone.SZONE,
     controller: number,
     sequence: number,
-    placeInteractivity: PlaceInteractivity
+    state: BlockState
   ) {
     placeStore.inner[zone][matStore.isMe(controller) ? "me" : "op"][sequence] =
-      placeInteractivity;
+      state;
   },
-  clearAll() {
+  clearAllInteractivity() {
     (["me", "op"] as const).forEach((who) => {
       ([MZONE, SZONE] as const).forEach((where) => {
-        placeStore.inner[where][who] = placeStore.inner[where][who].map(
-          () => undefined
+        placeStore.inner[where][who].forEach(
+          (block) => (block.interactivity = undefined)
         );
       });
     });

src/ui/Duel/PlayMat/Bg/index.tsx

@@ -5,11 +5,16 @@ import { type FC } from "react";
 import { type INTERNAL_Snapshot as Snapshot, useSnapshot } from "valtio";
 
 import { sendSelectPlaceResponse, ygopro } from "@/api";
-import { cardStore, type PlaceInteractivity, placeStore } from "@/stores";
+import {
+  BlockState,
+  cardStore,
+  type PlaceInteractivity,
+  placeStore,
+} from "@/stores";
 
 const BgExtraRow: FC<{
-  meSnap: Snapshot<PlaceInteractivity[]>;
-  opSnap: Snapshot<PlaceInteractivity[]>;
+  meSnap: Snapshot<BlockState[]>;
+  opSnap: Snapshot<BlockState[]>;
 }> = ({ meSnap, opSnap }) => {
   return (
     <div className={classnames("bg-row")}>
@@ -20,8 +25,8 @@ const BgExtraRow: FC<{
             highlight: !!meSnap[i] || !!opSnap[i],
           })}
           onClick={() => {
-            onBlockClick(meSnap[i]);
-            onBlockClick(opSnap[i]);
+            onBlockClick(meSnap[i].interactivity);
+            onBlockClick(opSnap[i].interactivity);
           }}
         ></div>
       ))}
@@ -32,7 +37,7 @@ const BgExtraRow: FC<{
 const BgRow: FC<{
   isSzone?: boolean;
   opponent?: boolean;
-  snap: Snapshot<PlaceInteractivity[]>;
+  snap: Snapshot<BlockState[]>;
 }> = ({ isSzone = false, opponent = false, snap }) => (
   <div className={classnames("bg-row", { opponent })}>
     {Array.from({ length: 5 }).map((_, i) => (
@@ -42,7 +47,7 @@ const BgRow: FC<{
           szone: isSzone,
           highlight: !!snap[i],
         })}
-        onClick={() => onBlockClick(snap[i])}
+        onClick={() => onBlockClick(snap[i].interactivity)}
       ></div>
     ))}
   </div>
@@ -68,6 +73,6 @@ const onBlockClick = (placeInteractivity: PlaceInteractivity) => {
   if (placeInteractivity) {
     sendSelectPlaceResponse(placeInteractivity.response);
     cardStore.inner.forEach((card) => (card.idleInteractivities = []));
-    placeStore.clearAll();
+    placeStore.clearAllInteractivity();
   }
 };