Merge pull request #60 from AlineRinquin/isa2
Toutes les fonctionnalités to do list ok
This commit is contained in:
commit
46a6e3b506
@ -2,11 +2,13 @@
|
|||||||
type="text"
|
type="text"
|
||||||
class="todo-title"
|
class="todo-title"
|
||||||
placeholder="Titre"
|
placeholder="Titre"
|
||||||
value = "{{todo.nom}}"
|
value="{{ todo.nom }}"
|
||||||
|
[(ngModel)]="todo.nom"
|
||||||
|
(keyup.enter)="updateTodo(todo)"
|
||||||
/>
|
/>
|
||||||
<div>
|
|
||||||
<button (click)="effacerList()">Effacer la To Do List</button>
|
<i class="bi bi-trash3" (click)="deleteTodo(todo.id)"></i>
|
||||||
</div>
|
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
class="todo-input"
|
class="todo-input"
|
||||||
@ -15,8 +17,6 @@
|
|||||||
(keyup.enter)="addTache(todo.id)"
|
(keyup.enter)="addTache(todo.id)"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="element" *ngFor="let tache of todo.taches">
|
<div class="element" *ngFor="let tache of todo.taches">
|
||||||
<div class="element-gauche">
|
<div class="element-gauche">
|
||||||
<input
|
<input
|
||||||
@ -45,11 +45,9 @@
|
|||||||
/>
|
/>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
</div>
|
</div>
|
||||||
<div class="deleteTache" (click)="deleteTodo(tache.id)">×</div>
|
<div class="deleteTache" (click)="deleteTache(tache.id)">×</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="extra-container">
|
<div class="extra-container">
|
||||||
<div>
|
<div>
|
||||||
<label
|
<label
|
||||||
@ -60,7 +58,7 @@
|
|||||||
/>Selectionner toutes les tâches</label
|
/>Selectionner toutes les tâches</label
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
<div>{{ toDoRest() }} tâches</div>
|
<div>{{ toDoRest() }} tâches restantes</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="extra-container">
|
<div class="extra-container">
|
||||||
<!-- <div>
|
<!-- <div>
|
||||||
@ -81,5 +79,4 @@
|
|||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
-->
|
-->
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import { Component, Input, OnInit } from '@angular/core';
|
import { Component, Input, OnInit } from '@angular/core';
|
||||||
import { Router } from '@angular/router';
|
import { Router } from '@angular/router';
|
||||||
import { Tache} from 'src/app/models/tache';
|
import { Tache } from 'src/app/models/tache';
|
||||||
import { ToDoList} from 'src/app/models/to-do-list';
|
import { ToDoList } from 'src/app/models/to-do-list';
|
||||||
import { TodoService } from 'src/app/services/todo.service';
|
import { TodoService } from 'src/app/services/todo.service';
|
||||||
import { TodoList } from 'src/app/todo-list';
|
import { TodoList } from 'src/app/todo-list';
|
||||||
|
|
||||||
@ -16,49 +16,59 @@ export class ToDoListComponent implements OnInit {
|
|||||||
//public todos: ToDoList[];
|
//public todos: ToDoList[];
|
||||||
public todoTitle: string;
|
public todoTitle: string;
|
||||||
public idTodo: number;
|
public idTodo: number;
|
||||||
public filter : string;
|
public filter: string;
|
||||||
public casesRestantes : boolean;
|
public casesRestantes: boolean;
|
||||||
public masterSelected: boolean;
|
public masterSelected: boolean;
|
||||||
public result : any;
|
public result: any;
|
||||||
public tache : Tache [];
|
public tache: Tache[];
|
||||||
|
|
||||||
constructor(private TodoService : TodoService, private router: Router ) {
|
constructor(private TodoService: TodoService, private router: Router) {
|
||||||
this.beforeEditCache = '';
|
this.beforeEditCache = '';
|
||||||
//this.todos = [];
|
//this.todos = [];
|
||||||
this.todoTitle = '';
|
this.todoTitle = '';
|
||||||
this.idTodo = 0;
|
this.idTodo = 0;
|
||||||
this.filter ='';
|
this.filter = '';
|
||||||
this.casesRestantes=true;
|
this.casesRestantes = true;
|
||||||
this.masterSelected= false;
|
this.masterSelected = false;
|
||||||
this.tache = [];
|
this.tache = [];
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
this.beforeEditCache = '';
|
this.beforeEditCache = '';
|
||||||
this.casesRestantes=true;
|
this.casesRestantes = true;
|
||||||
this.filter='tous';
|
this.filter = 'tous';
|
||||||
this.idTodo = 4;
|
this.idTodo = 4;
|
||||||
this.todoTitle = '';
|
this.todoTitle = '';
|
||||||
|
}
|
||||||
|
//supprimer la todoList
|
||||||
|
deleteTodo(id: number): void {
|
||||||
|
this.TodoService.deleteTodoById(id).subscribe((resp) => {
|
||||||
|
window.location.reload();
|
||||||
|
});
|
||||||
}
|
}
|
||||||
//ajouter tache
|
//ajouter tache
|
||||||
|
|
||||||
addTache(idTodoList : number) {//idTodoList id que la todoList que l'on récupère
|
addTache(idTodoList: number) {
|
||||||
console.log(idTodoList);
|
//idTodoList id que la todoList que l'on récupère
|
||||||
|
console.log(idTodoList);
|
||||||
const tache: Tache = {
|
const tache: Tache = {
|
||||||
id : 0,
|
id: 0,
|
||||||
texte: this.todoTitle,
|
texte: this.todoTitle,
|
||||||
etat : false,
|
etat: false,
|
||||||
editing : false,
|
editing: false,
|
||||||
|
};
|
||||||
}
|
|
||||||
console.log(this.tache);
|
console.log(this.tache);
|
||||||
this.TodoService.addTache(tache,idTodoList).subscribe((resp)=>{
|
this.TodoService.addTache(tache, idTodoList).subscribe((resp) => {
|
||||||
window.location.reload();
|
window.location.reload();
|
||||||
})
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
//modifier le titre de la to-do-list
|
||||||
|
updateTodo(todoList: ToDoList): void {
|
||||||
|
this.TodoService.updateTodo(todoList)?.subscribe((resp) => {
|
||||||
|
window.location.reload();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
//modifier par l'input
|
//modifier par l'input
|
||||||
modifier(tache: Tache): void {
|
modifier(tache: Tache): void {
|
||||||
@ -71,13 +81,12 @@ console.log(idTodoList);
|
|||||||
if (tache.texte.trim().length === 0) {
|
if (tache.texte.trim().length === 0) {
|
||||||
tache.texte = this.beforeEditCache;
|
tache.texte = this.beforeEditCache;
|
||||||
}
|
}
|
||||||
this.casesRestantes= this.casesQuiRestes();
|
this.casesRestantes = this.casesQuiRestes();
|
||||||
tache.editing = false;
|
tache.editing = false;
|
||||||
this.TodoService.updateTache(tache).subscribe((resp)=>{
|
this.TodoService.updateTache(tache).subscribe((resp) => {
|
||||||
console.log(tache);
|
console.log(tache);
|
||||||
window.location.reload();
|
window.location.reload();
|
||||||
})
|
});
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// annuler la modification
|
// annuler la modification
|
||||||
@ -87,23 +96,20 @@ console.log(idTodoList);
|
|||||||
}
|
}
|
||||||
|
|
||||||
//supprimer la tache
|
//supprimer la tache
|
||||||
deleteTodo(id: number) {
|
deleteTache(id: number) {
|
||||||
this.TodoService.deleteTacheById(id).subscribe(
|
this.TodoService.deleteTacheById(id).subscribe((resp) => {
|
||||||
resp =>{
|
|
||||||
window.location.reload();
|
window.location.reload();
|
||||||
}
|
});
|
||||||
);}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
//nombre de tâches restantes
|
//nombre de tâches restantes
|
||||||
toDoRest(): number{
|
toDoRest(): number {
|
||||||
return this.todo.taches.filter((tache: Tache)=> !tache.etat).length;
|
return this.todo.taches.filter((tache: Tache) => !tache.etat).length;
|
||||||
}
|
}
|
||||||
|
|
||||||
//Cocher toutes les tâches de la liste
|
//Cocher toutes les tâches de la liste
|
||||||
listComplete(): boolean {
|
listComplete(): boolean {
|
||||||
return this.todo.taches.filter((tache: Tache)=> tache).length>0;
|
return this.todo.taches.filter((tache: Tache) => tache).length > 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
//Effacer la to do list
|
//Effacer la to do list
|
||||||
@ -125,7 +131,7 @@ console.log(idTodoList);
|
|||||||
}
|
}
|
||||||
|
|
||||||
//barre de filtre des tâches
|
//barre de filtre des tâches
|
||||||
/* todosFilter(): ToDoList[] {
|
/* todosFilter(): ToDoList[] {
|
||||||
if(this.filter === 'tous'){
|
if(this.filter === 'tous'){
|
||||||
return this.todo.taches
|
return this.todo.taches
|
||||||
}else if (this.filter === 'active'){
|
}else if (this.filter === 'active'){
|
||||||
@ -135,6 +141,4 @@ console.log(idTodoList);
|
|||||||
}
|
}
|
||||||
return this.todo
|
return this.todo
|
||||||
} */
|
} */
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -3,9 +3,6 @@ import { Team } from './team';
|
|||||||
|
|
||||||
export interface ToDoList {
|
export interface ToDoList {
|
||||||
nom: string;
|
nom: string;
|
||||||
team: Team;
|
taches: Tache[];
|
||||||
taches: Tache [];
|
id: number;
|
||||||
id:number;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -1,10 +1,23 @@
|
|||||||
<app-header></app-header>
|
<app-header></app-header>
|
||||||
<app-side-bar></app-side-bar>
|
<div class="row">
|
||||||
|
<div class="col-md-auto">
|
||||||
|
<app-side-bar></app-side-bar>
|
||||||
|
</div>
|
||||||
|
<div class="col menu text-center">
|
||||||
|
<h2>To-Do-List</h2>
|
||||||
|
<div class="d-flex align-items-stretch"></div>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
class="todo-input"
|
||||||
|
placeholder="+ Nouvelle To-Do-List"
|
||||||
|
[(ngModel)]="todoListTitle"
|
||||||
|
(keyup.enter)="addTodoByTeamId()"
|
||||||
|
/>
|
||||||
|
|
||||||
<div class="d-flex align-items-stretch">
|
<div class="d-flex align-items-stretch">
|
||||||
<div class="row">
|
<div class="col" *ngFor="let todos of listTodos">
|
||||||
<div class="col" *ngFor="let todos of result">
|
<app-to-do-list [todo]="todos"> </app-to-do-list>
|
||||||
<app-to-do-list [todo]="todos"> </app-to-do-list>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,26 +1,50 @@
|
|||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, OnInit } from '@angular/core';
|
||||||
|
import { ToDoList } from 'src/app/models/to-do-list';
|
||||||
import { TodoService } from 'src/app/services/todo.service';
|
import { TodoService } from 'src/app/services/todo.service';
|
||||||
|
import { Team } from 'src/app/models/team';
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-page-to-do-list',
|
selector: 'app-page-to-do-list',
|
||||||
templateUrl: './page-to-do-list.component.html',
|
templateUrl: './page-to-do-list.component.html',
|
||||||
styleUrls: ['./page-to-do-list.component.scss']
|
styleUrls: ['./page-to-do-list.component.scss'],
|
||||||
})
|
})
|
||||||
export class PageToDoListComponent implements OnInit {
|
export class PageToDoListComponent implements OnInit {
|
||||||
public result : any;
|
public result: any;
|
||||||
|
public listTodos: any[];
|
||||||
constructor(private TodoService : TodoService) { }
|
public todoListTitle: string;
|
||||||
|
public idTodo: number;
|
||||||
ngOnInit(): void {
|
|
||||||
this.TodoService.getToDoListByTeamId().subscribe((data :any)=>{
|
|
||||||
|
|
||||||
this.result = data;
|
|
||||||
console.log(data);
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
|
constructor(private TodoService: TodoService) {
|
||||||
|
this.listTodos = [];
|
||||||
|
this.todoListTitle = '';
|
||||||
|
this.idTodo = 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
ngOnInit(): void {
|
||||||
|
this.TodoService.getToDoListByTeamId()?.subscribe((listTodos: any) => {
|
||||||
|
console.log(listTodos);
|
||||||
|
this.listTodos = listTodos;
|
||||||
|
this.todoListTitle = '';
|
||||||
|
this.idTodo = 0;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//Ajouter une todo List
|
||||||
|
addTodoByTeamId() {
|
||||||
|
const todoList: ToDoList = {
|
||||||
|
nom: this.todoListTitle,
|
||||||
|
taches: [],
|
||||||
|
id: 0,
|
||||||
|
};
|
||||||
|
this.TodoService.addTodoByTeamId(todoList)?.subscribe((resp) => {
|
||||||
|
console.log(todoList);
|
||||||
|
window.location.reload();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteTodo(id: number): void {
|
||||||
|
window.alert('La to-do-List a bien été supprimé!');
|
||||||
|
this.TodoService.deleteTodoById(id).subscribe((resp) => {
|
||||||
|
window.location.reload();
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -4,6 +4,8 @@ import { Observable } from 'rxjs';
|
|||||||
import { environment } from 'src/environments/environment';
|
import { environment } from 'src/environments/environment';
|
||||||
import { Tache } from '../models/tache';
|
import { Tache } from '../models/tache';
|
||||||
import { ToDoList } from '../models/to-do-list';
|
import { ToDoList } from '../models/to-do-list';
|
||||||
|
import { TodoList } from '../todo-list';
|
||||||
|
import { TokenService } from './token.service';
|
||||||
|
|
||||||
@Injectable({
|
@Injectable({
|
||||||
providedIn: 'root',
|
providedIn: 'root',
|
||||||
@ -12,12 +14,13 @@ export class TodoService {
|
|||||||
private toDoList: any;
|
private toDoList: any;
|
||||||
private apiUrl: string;
|
private apiUrl: string;
|
||||||
|
|
||||||
constructor(private http: HttpClient) {
|
constructor(private http: HttpClient, private tokenService: TokenService) {
|
||||||
this.apiUrl = environment.apiUrl;
|
this.apiUrl = environment.apiUrl;
|
||||||
}
|
}
|
||||||
|
|
||||||
getToDoListByTeamId(): Observable<any> {
|
getToDoListByTeamId(): Observable<any> | void {
|
||||||
return this.http.get(`${this.apiUrl}/todolist/team/1`);
|
const teamId = this.tokenService.getCurrentTeamId();
|
||||||
|
return this.http.get(`${this.apiUrl}/todolist/team/${teamId}`);
|
||||||
}
|
}
|
||||||
|
|
||||||
deleteTacheById(idTache: any): Observable<any> {
|
deleteTacheById(idTache: any): Observable<any> {
|
||||||
@ -27,12 +30,27 @@ export class TodoService {
|
|||||||
}
|
}
|
||||||
|
|
||||||
addTache(newtache: Tache, idTodoList: number): Observable<any> {
|
addTache(newtache: Tache, idTodoList: number): Observable<any> {
|
||||||
// console.log(newtache);
|
// console.log(newtache);
|
||||||
return this.http.post(`${this.apiUrl}/taches/add/${idTodoList}`, newtache);
|
return this.http.post(`${this.apiUrl}/taches/add/${idTodoList}`, newtache);
|
||||||
}
|
}
|
||||||
|
|
||||||
updateTache(tache: Tache): Observable<any> {
|
updateTache(tache: Tache): Observable<any> {
|
||||||
console.log(tache);
|
console.log(tache);
|
||||||
return this.http.put(`${this.apiUrl}/taches/update/1`, tache);
|
return this.http.put(`${this.apiUrl}/taches/update/1`, tache);
|
||||||
}
|
}
|
||||||
|
addTodoByTeamId(newtodoList: TodoList): Observable<any> {
|
||||||
|
const teamId = this.tokenService.getCurrentTeamId();
|
||||||
|
console.log(newtodoList + 'newtodoList');
|
||||||
|
return this.http.post(`${this.apiUrl}/todolist/add/${teamId}`, newtodoList);
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteTodoById(idTodo: any): Observable<any> {
|
||||||
|
return this.http.delete(`${this.apiUrl}/todolist/delete/${idTodo}`, {
|
||||||
|
responseType: 'text',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
updateTodo(todoList: TodoList): Observable<any> {
|
||||||
|
console.log(todoList);
|
||||||
|
return this.http.put(`${this.apiUrl}/todolist/update/666`, todoList);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user