Skip to content

N
Neos
Commit ee8e6422 authored by Chunchi Che's avatar Chunchi Che
Browse files
Options

update small

parent 101382ff
Pipeline #23161 passed with stages
            in 10 minutes and 11 seconds
            Hide whitespace changes
            Inline Side-by-side
            Showing with 112 additions and 114 deletions
            src/ui/Match/index.tsx
            View file @ ee8e6422
            import { EditFilled, SettingFilled } from "@ant-design/icons"; import { PlayCircleOutlined, SettingFilled } from "@ant-design/icons";
            import { Space } from "antd"; import { Button, Space } from "antd";
            import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
            import { useNavigate } from "react-router-dom"; import { useNavigate } from "react-router-dom";
            import { useSnapshot } from "valtio"; import { useSnapshot } from "valtio";
            ...@@ -72,6 +72,12 @@ export const Component: React.FC = () => { ...@@ -72,6 +72,12 @@ export const Component: React.FC = () => {
            label: deck.deckName, label: deck.deckName,
            }))} }))}
            /> />
            <Button
            style={{ width: 150, fontSize: "14px" }}
            onClick={() => navigate("/build")}
            >
            卡组编辑
            </Button>
            </Space> </Space>
            <div className={styles["mode-select"]}> <div className={styles["mode-select"]}>
            <Mode <Mode
            ...@@ -114,10 +120,9 @@ export const Component: React.FC = () => { ...@@ -114,10 +120,9 @@ export const Component: React.FC = () => {
            onClick={replayOpen} onClick={replayOpen}
            /> />
            <Mode <Mode
            title="卡组编辑" title="观战列表"
            desc="创建和编辑卡组，在上万种卡片中选择，组建独一无二的构筑。" desc="观看MyCard上正在进行的决斗"
            icon={<EditFilled />} icon={<PlayCircleOutlined />}
            onClick={() => navigate("/build")}
            /> />
            </div> </div>
            </div> </div>
            ......
            src/ui/WaitRoom/index.tsx
            View file @ ee8e6422
            ...@@ -14,7 +14,7 @@ import { ...@@ -14,7 +14,7 @@ import {
            import socketMiddleWare, { socketCmd } from "@/middleware/socket"; import socketMiddleWare, { socketCmd } from "@/middleware/socket";
            import PlayerState = ygopro.StocHsPlayerChange.State; import PlayerState = ygopro.StocHsPlayerChange.State;
            import SelfType = ygopro.StocTypeChange.SelfType; import SelfType = ygopro.StocTypeChange.SelfType;
            import { Avatar, Button, ConfigProvider, Skeleton, Space } from "antd"; import { Avatar, Button, Skeleton, Space } from "antd";
            import classNames from "classnames"; import classNames from "classnames";
            import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
            import { useNavigate } from "react-router-dom"; import { useNavigate } from "react-router-dom";
            ...@@ -38,22 +38,6 @@ import { Mora, MoraPopover, Tp, TpPopover } from "./Popover"; ...@@ -38,22 +38,6 @@ import { Mora, MoraPopover, Tp, TpPopover } from "./Popover";
            const NeosConfig = useConfig(); const NeosConfig = useConfig();
            const theme = {
            components: {
            Button: {
            lineWidth: 0,
            fontSizeLG: 14,
            fontSize: 12,
            colorBgContainer: "hsla(0, 0%, 100%, 0.05)",
            colorPrimaryHover: "#ccc",
            colorPrimaryActive: "#aaa",
            },
            Popover: {
            colorBgElevated: "hsla(0, 0%, 100%, 0.1)",
            },
            },
            };
            export const Component: React.FC = () => { export const Component: React.FC = () => {
            const { user } = useSnapshot(accountStore); const { user } = useSnapshot(accountStore);
            const [collapsed, setCollapsed] = useState(false); const [collapsed, setCollapsed] = useState(false);
            ...@@ -73,105 +57,103 @@ export const Component: React.FC = () => { ...@@ -73,105 +57,103 @@ export const Component: React.FC = () => {
            }, [room.stage]); }, [room.stage]);
            return ( return (
            <ConfigProvider theme={theme}> <div
            <div className={classNames(styles.container, {
            className={classNames(styles.container, { [styles.collapsed]: collapsed,
            [styles.collapsed]: collapsed, })}
            })} >
            > <Background />
            <Background /> <div className={styles.sider}>
            <div className={styles.sider}> <Chat />
            <Chat /> </div>
            </div> <div className={styles.content}>
            <div className={styles.content}> <SideButtons
            <SideButtons collapsed={collapsed}
            collapsed={collapsed} switchCollapse={() => setCollapsed(!collapsed)}
            switchCollapse={() => setCollapsed(!collapsed)} />
            <div className={styles.wrap}>
            <Controller
            onDeckChange={(deckName: string) => {
            const deck = deckStore.get(deckName);
            // 同步后端
            if (deck) {
            setDeck(deck);
            } else {
            alert(`Deck ${deckName} not found`);
            }
            }}
            /> />
            <div className={styles.wrap}> <div className={styles["both-side-container"]}>
            <Controller <PlayerZone
            onDeckChange={(deckName: string) => { who={Who.Me}
            const deck = deckStore.get(deckName); player={me}
            // 同步后端 avatar={user?.avatar_url}
            if (deck) { btn={
            setDeck(deck); room.stage === RoomStage.WAITING ? (
            } else { <Button
            alert(`Deck ${deckName} not found`); size="large"
            } className={styles["btn-join"]}
            }} onClick={() => {
            /> if (me?.state === PlayerState.NO_READY) {
            <div className={styles["both-side-container"]}> sendUpdateDeck(deck);
            <PlayerZone window.myExtraDeckCodes = [...deck.extra];
            who={Who.Me} sendHsReady();
            player={me} } else {
            avatar={user?.avatar_url} sendHsNotReady();
            btn={
            room.stage === RoomStage.WAITING ? (
            <Button
            size="large"
            className={styles["btn-join"]}
            onClick={() => {
            if (me?.state === PlayerState.NO_READY) {
            sendUpdateDeck(deck);
            window.myExtraDeckCodes = [...deck.extra];
            sendHsReady();
            } else {
            sendHsNotReady();
            }
            }}
            >
            {me?.state === PlayerState.NO_READY
            ? "决斗准备"
            : "取消准备"}
            </Button>
            ) : (
            <MoraAvatar
            mora={
            me?.moraResult !== undefined &&
            me.moraResult !== HandType.UNKNOWN
            ? Object.values(Mora)[me.moraResult - 1]
            : undefined
            } }
            /> }}
            ) >
            } {me?.state === PlayerState.NO_READY
            /> ? "决斗准备"
            {room.players : "取消准备"}
            .filter((player) => player !== undefined && !player.isMe) </Button>
            .map((player, idx) => ( ) : (
            <PlayerZone <MoraAvatar
            key={idx} mora={
            who={Who.Op} me?.moraResult !== undefined &&
            player={player} me.moraResult !== HandType.UNKNOWN
            btn={ ? Object.values(Mora)[me.moraResult - 1]
            room.stage === RoomStage.WAITING ? null : ( : undefined
            <MoraAvatar
            mora={
            op?.moraResult !== undefined &&
            op.moraResult !== HandType.UNKNOWN
            ? Object.values(Mora)[op.moraResult - 1]
            : undefined
            }
            />
            )
            } }
            /> />
            ))} )
            </div> }
            <ActionButton
            onMoraSelect={(mora) => {
            sendHandResult(mora);
            roomStore.stage = RoomStage.HAND_SELECTED;
            }}
            onTpSelect={(tp) => {
            sendTpResult(tp === Tp.First);
            roomStore.stage = RoomStage.TP_SELECTED;
            }}
            /> />
            {room.players
            .filter((player) => player !== undefined && !player.isMe)
            .map((player, idx) => (
            <PlayerZone
            key={idx}
            who={Who.Op}
            player={player}
            btn={
            room.stage === RoomStage.WAITING ? null : (
            <MoraAvatar
            mora={
            op?.moraResult !== undefined &&
            op.moraResult !== HandType.UNKNOWN
            ? Object.values(Mora)[op.moraResult - 1]
            : undefined
            }
            />
            )
            }
            />
            ))}
            </div> </div>
            <ActionButton
            onMoraSelect={(mora) => {
            sendHandResult(mora);
            roomStore.stage = RoomStage.HAND_SELECTED;
            }}
            onTpSelect={(tp) => {
            sendTpResult(tp === Tp.First);
            roomStore.stage = RoomStage.TP_SELECTED;
            }}
            />
            </div> </div>
            </div> </div>
            </ConfigProvider> </div>
            ); );
            }; };
            ......
            src/ui/theme.ts
            View file @ ee8e6422
            ...@@ -41,5 +41,16 @@ export const theme: ThemeConfig = { ...@@ -41,5 +41,16 @@ export const theme: ThemeConfig = {
            Layout: { Layout: {
            colorBgBody: "transparent", colorBgBody: "transparent",
            }, },
            Button: {
            lineWidth: 0,
            fontSizeLG: 14,
            fontSize: 12,
            colorBgContainer: "hsla(0, 0%, 100%, 0.05)",
            colorPrimaryHover: "#ccc",
            colorPrimaryActive: "#aaa",
            },
            Popover: {
            colorBgElevated: "hsla(0, 0%, 100%, 0.1)",
            },
            }, },
            }; };
            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