IQBall
/
Application-Web
6
0
Fork 0
Code Issues 49 Pull Requests Packages Projects 5 Releases Wiki Activity

Add the structure and some style

Browse Source
pull/81/head
DahmaneYanis 1 year ago committed by d_yanis
parent 15ff5db339
commit eecf0e03c7
4 changed files with 86 additions and 49 deletions
Show Stats Download Patch File Download Diff File

46
front/style/home.css
Unescape View File

@ -1,10 +1,44 @@
/* #header {
background-color: var(--white); #main {
transition: box-shadow .3s linear; margin-left : 2%;
outline: 0; margin-right: 2%;
box-shadow: 0 10px 15px #00000026; border : solid 2px purple;
} */ display: flex;
flex-direction: column;
}
button {
border-radius: 100%;
}
#header { #header {
text-align: center;
background-color: green;
margin : 0px;
}
#body {
display: flex;
flex-direction: row;
border : solid 10px yellow;
margin:0px
}
#personal-space {
background-color: red;
}
#sideMenu {
background-color: blue;
}
#ps-title {
text-align: center;
}
#sideMenu h2 {
display: inline-block;
margin-right : 5%;
} }

61
front/views/Home.tsx
Unescape View File

@ -1,24 +1,17 @@
import "../style/home.css" import "../style/home.css"
import { CSSProperties } from "react"
interface Tactic { interface Tactic {
id : number id : number
name : string name : string
creationDate : number creation_date : string
} }
export default function Home({ export default function Home({ lastTactics } : { lastTactics : Tactic[] }) {
tactics
} : {
tactics : Tactic[]
}) {
console.log(tactics);
return ( return (
<div id="main"> <div id="main">
<Title/> <Title/>
{tactics.map(tactic => ( <Body lastTactics={lastTactics}/>
<div>{tactic.name}</div>
))}
<Body tactics={tactics}/>
</div> </div>
) )
} }
@ -27,18 +20,41 @@ export function Title() {
return ( return (
<div id="header"> <div id="header">
<h1 id="IQBall"><span id="IQ">IQ</span><span id="B">B</span>all</h1> <h1 id="IQBall"><span id="IQ">IQ</span><span id="B">B</span>all</h1>
<img src=""></img>
</div> </div>
) )
} }
export function Body({ lastTactics } : { lastTactics : Tactic[] }) {
const widthPersonalSpace = 70;
const widthSideMenu = 100-widthPersonalSpace
return (
<div id="body">
<PersonalSpace width = {widthPersonalSpace}/>
<SideMenu width = {widthSideMenu} lastTactics={lastTactics} />
</div>
)
}
export function SideMenu({ width, lastTactics } : { width : number, lastTactics : Tactic[] }) {
export function Body({tactics} : {tactics : Tactic[]}) {
return ( return (
<div id="body"> <div id="sideMenu" style={{
width : width + "%",
}}>
<Team/> <Team/>
<Tactic tactics={tactics}/> <Tactic lastTactics={lastTactics}/>
</div>
)
}
export function PersonalSpace({ width }: { width : number }) {
return (
<div id="personal-space" style={{
width : width + "%",
}}>
<h2 id="ps-title">Espace Personnel</h2>
</div> </div>
) )
} }
@ -47,28 +63,29 @@ export function Team() {
return ( return (
<div id="team"> <div id="team">
<h2>Mes équipes</h2> <h2>Mes équipes</h2>
<button id="createTeam">+</button> <button onClick={() => location.pathname="/tactic/new"}>+</button>
</div> </div>
) )
} }
export function Tactic({tactics} : { tactics : Tactic[]}) { export function Tactic({lastTactics} : { lastTactics : Tactic[]}) {
const listTactic = tactics.map(tactic =>
const listTactic = lastTactics.map(tactic =>
<li <li
key = {tactic.id} key = {tactic.id}
> >
{tactic.name} : {tactic.creationDate} {tactic.name} : {tactic.creation_date}
<button onClick={() => {location.pathname="/tactic/"+tactic.id+"/edit"}}>open</button>
</li> </li>
); );
return ( return (
<div id="tactic"> <div id="tactic">
<div id="titreTactic"> <div id="titreTactic">
<h2>Mes stratégies</h2> <h2>Mes cinq dernières stratégies</h2>
<button id="createTactic" onClick={() => (location.pathname = "/tactic/new")}>+</button> <button id="createTactic" onClick={() => (location.pathname = "/tactic/new")}>+</button>
<ul> <ul>
{listTactic} {listTactic}
</ul> </ul>
</div> </div>
</div> </div>
) )

1
front/views/ProfilPage.tsx
Unescape View File

@ -0,0 +1 @@

19
src/App/Controller/UserController.php
Unescape View File

@ -24,28 +24,13 @@ class UserController {
*/ */
public function home(SessionHandle $session): ViewHttpResponse { public function home(SessionHandle $session): ViewHttpResponse {
$lastTactic = $this->tactics->getLast(5); $lastTactic = $this->tactics->getLast(5);
var_dump($lastTactic); // var_dump($lastTactic);
return ViewHttpResponse::react("views/Home.tsx", [ return ViewHttpResponse::react("views/Home.tsx", [
"tactics" => $lastTactic "lastTactics" => $lastTactic
]); ]);
// return ViewHttpResponse::react("views/Home.tsx", []); // return ViewHttpResponse::react("views/Home.tsx", []);
} }
private function listTacticToJson(array $listTactic) : array {
$jsonReturn = [];
foreach ($listTactic as $tactic){
//var_dump($tactic);
$jsonTactic = [
"id" => $tactic["id"],
"name" => $tactic["name"],
"creationDate" => $tactic["creation_date"]
];
array_push($jsonReturn, $jsonTactic);
}
// var_dump($jsonReturn);
return $jsonReturn;
}
public function homeTwig(SessionHandle $session): ViewHttpResponse { public function homeTwig(SessionHandle $session): ViewHttpResponse {
return ViewHttpResponse::twig("home.twig", []); return ViewHttpResponse::twig("home.twig", []);
} }

Write Preview
Loading…
Cancel
Save