public/traque
1
0
Fork 0
mirror of https://git.rezel.net/LudoTech/traque.git synced 2026-02-09 18:20:17 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

starting zone element done

Browse Source
This commit is contained in:
Quentin Roussel
2024-03-28 21:53:43 +01:00
parent 27e5a6615a
commit 1a5405b4e8
4 changed files with 113 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
traque-front/components/admin/teamEdit.jsx
View File

@@ -2,10 +2,15 @@ import React, { useEffect, useState } from 'react'
import TextInput from '../util/textInput'
import Button from '../util/button';
import useAdmin from '@/hook/useAdmin';
import dynamic from 'next/dynamic';
export default function TeamEdit({selectedTeamId, setSelectedTeamId}) {
const CircularAreaPicker = dynamic(() => import('./mapPicker').then((mod) => mod.CircularAreaPicker), {
ssr: false
});
export default function TeamEdit({ selectedTeamId, setSelectedTeamId }) {
const [newTeamName, setNewTeamName] = React.useState('');
const {setTeamName, getTeamName, removeTeam, getTeam} = useAdmin();
const { setTeamName, getTeamName, removeTeam, getTeam } = useAdmin();
const [team, setTeam] = useState({})
useEffect(() => {
@@ -13,9 +18,9 @@ export default function TeamEdit({selectedTeamId, setSelectedTeamId}) {
if (team != undefined) {
setNewTeamName(team.name);
}
},[selectedTeamId])
}, [selectedTeamId])
useEffect(() => {
let team = getTeam(selectedTeamId);
if (team != undefined) {
@@ -34,30 +39,37 @@ export default function TeamEdit({selectedTeamId, setSelectedTeamId}) {
setSelectedTeamId(null);
}
return (team &&
<div className='flex flex-row'>
<div className='w-1/2 flex flex-col space-y-3 mx-2'>
<h2 className='text-2xl text-center'>Actions</h2>
<form className='flex flex-row' onSubmit={handleSubmit}>
<div className='w-4/5'>
<TextInput name="teamName" label='Team name' value={newTeamName} onChange={(e) => setNewTeamName(e.target.value)}/>
return (team &&
<div className='flex flex-col h-full'>
<div className='flex flex-row'>
<div className='w-1/2 flex flex-col space-y-3 mx-2'>
<h2 className='text-2xl text-center'>Actions</h2>
<form className='flex flex-row' onSubmit={handleSubmit}>
<div className='w-4/5'>
<TextInput name="teamName" label='Team name' value={newTeamName} onChange={(e) => setNewTeamName(e.target.value)} />
</div>
<div className='w-2/5'>
<Button type="submit">Rename</Button>
</div>
</form>
<Button onClick={handleRemove}>Eliminate</Button>
</div>
<div className='w-2/5'>
<Button type="submit">Rename</Button>
<div className='w-1/2 flex flex-col space-y-2 mx-2'>
<h2 className='text-2xl text-center'>Team details</h2>
<div>
<p>Secret : {String(team.id).padStart(6, '0')}</p>
<p>Name : {team.name}</p>
<p>Chasing : {getTeamName(team.chasing)}</p>
<p>Chased by : {getTeamName(team.chased)}</p>
<p>Capture code : {String(team.captureCode).padStart(4, '0')}</p>
</div>
</div>
</form>
<Button onClick={handleRemove}>Eliminate</Button>
</div>
<div className='w-1/2 flex flex-col space-y-2 mx-2'>
<h2 className='text-2xl text-center'>Team details</h2>
<div>
<p>Secret : {String(team.id).padStart(6,'0')}</p>
<p>Name : {team.name}</p>
<p>Chasing : {getTeamName(team.chasing)}</p>
<p>Chased by : {getTeamName(team.chased)}</p>
<p>Capture code : {String(team.captureCode).padStart(4,'0')}</p>
</div>
<div className='m-5 h-full flex flex-col'>
<h2 className='text-2xl text-center'>Starting area</h2>
<CircularAreaPicker area={team.startingArea} setArea={(startingArea) => setTeam({ ...team, startingArea })} />
</div>
</div>
</div>
)
)
}