Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Sign in / Register
Toggle navigation
N
Neos
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Locked Files
Issues
0
Issues
0
List
Boards
Labels
Service Desk
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Security & Compliance
Security & Compliance
Dependency List
License Compliance
Packages
Packages
List
Container Registry
Analytics
Analytics
CI / CD
Code Review
Insights
Issues
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
love_飞影
Neos
Commits
a38b43bd
Commit
a38b43bd
authored
Mar 18, 2023
by
Chunchi Che
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
optimize status ui
parent
70518c92
Changes
5
Hide whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
73 additions
and
32 deletions
+73
-32
neos.config.json
neos.config.json
+5
-0
neos.config.prod.json
neos.config.prod.json
+5
-0
src/ui/Duel/main.tsx
src/ui/Duel/main.tsx
+2
-10
src/ui/Duel/status.tsx
src/ui/Duel/status.tsx
+53
-22
src/ui/Neos.tsx
src/ui/Neos.tsx
+8
-0
No files found.
neos.config.json
View file @
a38b43bd
...
@@ -61,6 +61,11 @@
...
@@ -61,6 +61,11 @@
"footer"
:
{
"footer"
:
{
"height"
:
80
"height"
:
80
}
}
},
"status"
:
{
"avatarSize"
:
40
,
"meAvatarColor"
:
"#0e63e1"
,
"opAvatarColor"
:
"#e10e68"
}
}
}
}
}
}
neos.config.prod.json
View file @
a38b43bd
...
@@ -61,6 +61,11 @@
...
@@ -61,6 +61,11 @@
"footer"
:
{
"footer"
:
{
"height"
:
80
"height"
:
80
}
}
},
"status"
:
{
"avatarSize"
:
40
,
"meAvatarColor"
:
"#0e63e1"
,
"opAvatarColor"
:
"#e10e68"
}
}
}
}
}
}
src/ui/Duel/main.tsx
View file @
a38b43bd
...
@@ -25,24 +25,16 @@ import DuelTimeLine from "./timeLine";
...
@@ -25,24 +25,16 @@ import DuelTimeLine from "./timeLine";
import
{
Row
}
from
"
antd
"
;
import
{
Row
}
from
"
antd
"
;
import
SendBox
from
"
./sendBox
"
;
import
SendBox
from
"
./sendBox
"
;
import
PlayerStatus
from
"
./status
"
;
import
PlayerStatus
from
"
./status
"
;
import
{
useAppSelector
}
from
"
../../hook
"
;
import
{
selectMeInitInfo
,
selectOpInitInfo
,
}
from
"
../../reducers/duel/initInfoSlice
"
;
// Ref: https://github.com/brianzinn/react-babylonjs/issues/126
// Ref: https://github.com/brianzinn/react-babylonjs/issues/126
const
NeosDuel
=
()
=>
{
const
NeosDuel
=
()
=>
{
const
meInfo
=
useAppSelector
(
selectMeInitInfo
);
const
opInfo
=
useAppSelector
(
selectOpInitInfo
);
return
(
return
(
<>
<>
<
NeosLayout
<
NeosLayout
sider=
{
<
NeosSider
/>
}
sider=
{
<
NeosSider
/>
}
header=
{
<
PlayerStatus
userName=
"UserName"
hp=
{
opInfo
?.
life
||
0
}
/>
}
header=
{
<
PlayerStatus
/>
}
content=
{
<
NeosCanvas
/>
}
content=
{
<
NeosCanvas
/>
}
footer=
{
<
PlayerStatus
userName=
"UserName"
hp=
{
meInfo
?.
life
||
0
}
/>
}
footer=
{
<
><
/>
}
/>
/>
<
CardModal
/>
<
CardModal
/>
<
CardListModal
/>
<
CardListModal
/>
...
...
src/ui/Duel/status.tsx
View file @
a38b43bd
import
React
from
"
react
"
;
import
React
from
"
react
"
;
import
{
UserOutlined
,
BackwardOutlined
}
from
"
@ant-design/icons
"
;
import
{
UserOutlined
}
from
"
@ant-design/icons
"
;
import
{
Avatar
,
Space
,
Statistic
}
from
"
antd
"
;
import
{
Avatar
}
from
"
antd
"
;
import
{
CheckCard
}
from
"
@ant-design/pro-components
"
;
import
NeosConfig
from
"
../../../neos.config.json
"
;
import
{
useAppSelector
}
from
"
../../hook
"
;
import
{
selectMeInitInfo
,
selectOpInitInfo
,
}
from
"
../../reducers/duel/initInfoSlice
"
;
const
spaceSize
=
20
;
const
Config
=
NeosConfig
.
ui
.
status
;
const
avatarSize
=
40
;
const
avatarSize
=
40
;
const
PlayerStatus
=
(
props
:
{
userName
:
string
;
hp
:
number
})
=>
(
const
PlayerStatus
=
()
=>
{
<
Space
size=
{
spaceSize
}
direction=
"horizontal"
>
const
meInfo
=
useAppSelector
(
selectMeInitInfo
);
<
Space
wrap
size=
{
spaceSize
}
>
const
opInfo
=
useAppSelector
(
selectOpInitInfo
);
<
Avatar
size=
{
avatarSize
}
icon=
{
<
UserOutlined
/>
}
/>
</
Space
>
return
(
<
Space
wrap
size=
{
spaceSize
}
>
<
CheckCard
.
Group
{
props
.
userName
}
bordered
</
Space
>
style=
{
{
height
:
`${NeosConfig.ui.layout.header.height}`
}
}
<
Space
wrap
size=
{
spaceSize
}
>
>
<
Statistic
title=
"Hp"
value=
{
props
.
hp
}
/>
<
CheckCard
</
Space
>
avatar=
{
<
Space
wrap
size=
{
spaceSize
}
>
<
Avatar
<
Avatar
size=
{
avatarSize
}
size=
{
avatarSize
}
style=
{
{
backgroundColor
:
Config
.
opAvatarColor
}
}
style=
{
{
color
:
"
red
"
}
}
icon=
{
<
UserOutlined
/>
}
icon=
{
<
BackwardOutlined
/>
}
/>
}
title=
{
`opponent`
}
description=
{
`Hp: ${opInfo?.life || 0}`
}
value=
"opponent"
style=
{
{
position
:
"
absolute
"
,
left
:
`${NeosConfig.ui.layout.sider.width}px`
,
}
}
/>
<
CheckCard
avatar=
{
<
Avatar
size=
{
avatarSize
}
style=
{
{
backgroundColor
:
Config
.
meAvatarColor
}
}
icon=
{
<
UserOutlined
/>
}
/>
}
title=
{
`myself`
}
description=
{
`Hp: ${meInfo?.life || 0}`
}
value=
"myself"
style=
{
{
position
:
"
absolute
"
,
right
:
"
0px
"
,
}
}
/>
/>
</
Space
>
</
CheckCard
.
Group
>
</
Space
>
);
)
;
}
;
export
default
PlayerStatus
;
export
default
PlayerStatus
;
src/ui/Neos.tsx
View file @
a38b43bd
...
@@ -35,6 +35,14 @@ export default function () {
...
@@ -35,6 +35,14 @@ export default function () {
</
Suspense
>
</
Suspense
>
}
}
/>
/>
<
Route
path=
"/test"
element=
{
<
Suspense
fallback=
{
<
Loading
/>
}
>
<
NeosDuel
/>
</
Suspense
>
}
/>
</
Routes
>
</
Routes
>
);
);
}
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment