Commit 55f0b27c authored by chechunchi's avatar chechunchi

optimize Menu.tsx

parent e2bf6c92
Pipeline #21506 passed with stages
in 16 minutes and 27 seconds
import "@/styles/mat.css"; import "@/styles/mat.css";
import Icon from "@ant-design/icons";
import { Button, Modal } from "antd"; import { Button, Modal } from "antd";
import { ReactComponent as BattleSvg } from "neos-assets/crossed-swords.svg";
import { ReactComponent as EpSvg } from "neos-assets/power-button.svg";
import { ReactComponent as Main2Svg } from "neos-assets/sword-in-stone.svg";
import { ReactComponent as SurrenderSvg } from "neos-assets/truce.svg";
import React, { useState } from "react"; import React, { useState } from "react";
import { useSnapshot } from "valtio"; import { useSnapshot } from "valtio";
...@@ -19,23 +14,15 @@ import { ...@@ -19,23 +14,15 @@ import {
matStore, matStore,
} from "@/stores"; } from "@/stores";
const IconSize = "150%";
const PhaseButton = (props: { const PhaseButton = (props: {
text: string; text: string;
enable: boolean; enable: boolean;
onClick: () => void; onClick: () => void;
icon?: React.ReactNode;
}) => { }) => {
return ( return (
<Button <button disabled={!props.enable} onClick={props.onClick}>
icon={props.icon}
disabled={!props.enable}
onClick={props.onClick}
size="large"
>
{props.text} {props.text}
</Button> </button>
); );
}; };
...@@ -61,20 +48,20 @@ export const Menu = () => { ...@@ -61,20 +48,20 @@ export const Menu = () => {
const onBp = () => { const onBp = () => {
sendSelectIdleCmdResponse(6); sendSelectIdleCmdResponse(6);
clearAllIdleInteractivities(0); // 为什么要clear两次?
clearAllIdleInteractivities(0); clearAllIdleInteractivities(0);
clearAllIdleInteractivities(1);
phase.enableBp = false; phase.enableBp = false;
}; };
const onM2 = () => { const onM2 = () => {
sendSelectBattleCmdResponse(2); sendSelectBattleCmdResponse(2);
clearAllIdleInteractivities(0); clearAllIdleInteractivities(0);
clearAllIdleInteractivities(0); clearAllIdleInteractivities(1);
phase.enableM2 = false; phase.enableM2 = false;
}; };
const onEp = () => { const onEp = () => {
sendSelectIdleCmdResponse(response); sendSelectIdleCmdResponse(response);
clearAllIdleInteractivities(0); clearAllIdleInteractivities(0);
clearAllIdleInteractivities(0); clearAllIdleInteractivities(1);
phase.enableEp = false; phase.enableEp = false;
}; };
const onSurrender = () => { const onSurrender = () => {
...@@ -83,30 +70,16 @@ export const Menu = () => { ...@@ -83,30 +70,16 @@ export const Menu = () => {
return ( return (
<div id="controller"> <div id="controller">
<PhaseButton <button disabled={!enableBp} onClick={onBp}>
icon={<Icon component={BattleSvg} style={{ fontSize: IconSize }} />} 战斗阶段
enable={enableBp} </button>
text="战斗阶段" <button disabled={!enableM2} onClick={onM2}>
onClick={onBp} 主要阶段2
/> </button>
<PhaseButton <button disabled={!enableEp} onClick={onEp}>
icon={<Icon component={Main2Svg} style={{ fontSize: IconSize }} />} 结束回合
enable={enableM2} </button>
text="主要阶段2" <button onClick={onSurrender}>投降</button>
onClick={onM2}
/>
<PhaseButton
icon={<Icon component={EpSvg} style={{ fontSize: IconSize }} />}
enable={enableEp}
text="结束回合"
onClick={onEp}
/>
<PhaseButton
icon={<Icon component={SurrenderSvg} style={{ fontSize: IconSize }} />}
enable={true}
text="投降"
onClick={onSurrender}
/>
<Modal <Modal
title="是否确认要投降?" title="是否确认要投降?"
open={modalOpen} open={modalOpen}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment