[DEV] update video-edit
This commit is contained in:
parent
ace8bf5e85
commit
f56e290dd5
@ -1,42 +1,90 @@
|
||||
<div class="main-reduce">
|
||||
<div class="fill-all">
|
||||
<form [formGroup]="videoForm"><!-- (ngSubmit)="submitChange(videoForm.form);" -->
|
||||
<table>
|
||||
<tr>
|
||||
<td>
|
||||
<label>Name:</label>
|
||||
</td>
|
||||
<td>
|
||||
<input type="text"
|
||||
formControlName="name"
|
||||
id="name"
|
||||
class="form-control">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<label>Description:</label>
|
||||
</td>
|
||||
<td>
|
||||
<input type="text"
|
||||
formControlName="description"
|
||||
id="description"
|
||||
class="form-control">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<label>Episode (id):</label>
|
||||
</td>
|
||||
<td>
|
||||
<input type="text"
|
||||
formControlName="episode"
|
||||
id="episode"
|
||||
class="form-control">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<button class="btn btn-primary">Update</button>
|
||||
</form>
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
Title:
|
||||
</div>
|
||||
<div class="input">
|
||||
<input type="text"
|
||||
placeholder="Name of the film"
|
||||
[(value)]="name"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
Description:
|
||||
</div>
|
||||
<div class="input">
|
||||
<input type="text" [(value)]="description"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
Date:
|
||||
</div>
|
||||
<div class="input">
|
||||
<input type="text" [(value)]="time"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
Type:
|
||||
</div>
|
||||
<div class="input">
|
||||
<select [(ngModel)]="type_id">
|
||||
<option *ngFor="let element of listType" [ngValue]="element.value">{{element.label}}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
Univers:
|
||||
</div>
|
||||
<div class="input">
|
||||
<select [(ngModel)]="univers_id">
|
||||
<option *ngFor="let element of listUnivers" [ngValue]="element.value">{{element.label}}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
Group:
|
||||
</div>
|
||||
<div class="input">
|
||||
<select [(ngModel)]="group_id">
|
||||
<option *ngFor="let element of listGroup" [ngValue]="element.value">{{element.label}}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
Saison:
|
||||
</div>
|
||||
<div class="input">
|
||||
<select [(ngModel)]="saison_id">
|
||||
<option *ngFor="let element of listSaison" [ngValue]="element.value">{{element.label}}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
Episode:
|
||||
</div>
|
||||
<div class="input">
|
||||
<input type="text" [(value)]="episode"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="request_raw">
|
||||
<div class="label">
|
||||
Data ID:
|
||||
</div>
|
||||
<div class="input">
|
||||
{{data_id}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="send_value">
|
||||
<button class="button fill-x color-button-validate color-shadow-black" (click)="sendValues()" type="submit"><i class="material-icons">save_alt</i> Save</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -9,50 +9,36 @@
|
||||
box-shadow: 0px 2px 4px 0 rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
table, th, td {
|
||||
border-radius: 9px;
|
||||
padding: 10px;
|
||||
}
|
||||
.error {
|
||||
color: rgba(248, 141, 18, 0.842);
|
||||
}
|
||||
.success {
|
||||
color: green;
|
||||
}
|
||||
|
||||
.title {
|
||||
.request_raw {
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
font-size: 50px;
|
||||
text-align: center;
|
||||
height: 45px;
|
||||
.label {
|
||||
width: 20%;
|
||||
margin-right: 10px;
|
||||
text-align: right;
|
||||
float: left;
|
||||
display: block;
|
||||
}
|
||||
.input {
|
||||
width: 75%;
|
||||
float: left;
|
||||
display: block;
|
||||
input {
|
||||
width: 100%;
|
||||
font-size: 20px;
|
||||
}
|
||||
select {
|
||||
width: 100%;
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.description {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.episode {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.generated_name {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.video_div {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.video_object {
|
||||
width: 100%;
|
||||
.send_value {
|
||||
width: 300px;
|
||||
margin: 0 auto;
|
||||
padding: 10px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.item {
|
||||
|
||||
@ -12,8 +12,20 @@ import { FormGroup, FormControl } from "@angular/forms";
|
||||
import { fadeInAnimation } from '../../_animations/index';
|
||||
import { HttpWrapperService } from '../../service/http-wrapper.service';
|
||||
|
||||
|
||||
import { TypeService } from '../../service/type.service';
|
||||
import { UniversService } from '../../service/univers.service';
|
||||
import { VideoService } from '../../service/video.service';
|
||||
|
||||
export class ElementList {
|
||||
value: number;
|
||||
label: string;
|
||||
constructor(_value: number, _label: string) {
|
||||
this.value = _value;
|
||||
this.label = _label;
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-video-edit',
|
||||
templateUrl: './video-edit.html',
|
||||
@ -21,15 +33,6 @@ import { VideoService } from '../../service/video.service';
|
||||
animations: [fadeInAnimation],
|
||||
host: { '[@fadeInAnimation]': '' }
|
||||
})
|
||||
/*
|
||||
export class Video {
|
||||
name: string;
|
||||
description: string;
|
||||
episode: number;
|
||||
constructor() {
|
||||
}
|
||||
}
|
||||
*/
|
||||
// https://www.sitepoint.com/angular-forms/
|
||||
export class VideoEditComponent implements OnInit {
|
||||
id_video:number = -1;
|
||||
@ -39,6 +42,7 @@ export class VideoEditComponent implements OnInit {
|
||||
name:string = ""
|
||||
description:string = ""
|
||||
episode:number = undefined
|
||||
univers_id:number = undefined
|
||||
group_id:number = undefined
|
||||
saison_id:number = undefined
|
||||
data_id:number = -1
|
||||
@ -46,38 +50,75 @@ export class VideoEditComponent implements OnInit {
|
||||
type_id:number = undefined
|
||||
generated_name:string = ""
|
||||
video_source:string = ""
|
||||
|
||||
videoForm = new FormGroup({
|
||||
name: new FormControl("kjhkjhk"),
|
||||
description: new FormControl(),
|
||||
episode: new FormControl()
|
||||
})
|
||||
//video = new Video();
|
||||
|
||||
listType: ElementList[] = [
|
||||
{value: undefined, label: '---'},
|
||||
];
|
||||
listUnivers: ElementList[] = [
|
||||
{value: undefined, label: '---'},
|
||||
{value: null, label: '---'},
|
||||
];
|
||||
listGroup: ElementList[] = [
|
||||
{value: undefined, label: '---'},
|
||||
];
|
||||
listSaison: ElementList[] = [
|
||||
{value: undefined, label: '---'},
|
||||
];
|
||||
constructor(private route: ActivatedRoute,
|
||||
private router: Router,
|
||||
private locate: Location,
|
||||
private typeService: TypeService,
|
||||
private universService: UniversService,
|
||||
private videoService: VideoService,
|
||||
private httpService: HttpWrapperService) {
|
||||
|
||||
}
|
||||
|
||||
sendValues():void {
|
||||
console.log("send new values....");
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.id_video = parseInt(this.route.snapshot.paramMap.get('video_id'));
|
||||
let self = this;
|
||||
this.universService.getData()
|
||||
.then(function(response2) {
|
||||
self.listUnivers = [{value: undefined, label: '---'}];
|
||||
for(let iii= 0; iii < response2.length; iii++) {
|
||||
self.listUnivers.push({value: response2[iii].id, label: response2[iii].name});
|
||||
}
|
||||
}).catch(function(response2) {
|
||||
console.log("get response22 : " + JSON.stringify(response2, null, 2));
|
||||
});
|
||||
this.videoService.get(this.id_video)
|
||||
.then(function(response) {
|
||||
console.log("get response of video : " + JSON.stringify(response, null, 2));
|
||||
self.error = "";
|
||||
self.videoForm.get("name").setValue(response.name);
|
||||
self.videoForm.get("description").setValue(response.description);
|
||||
self.videoForm.get("episode").setValue(response.episode);
|
||||
|
||||
self.name = response.name;
|
||||
self.description = response.description;
|
||||
self.episode = response.episode;
|
||||
self.group_id = response.group_id;
|
||||
self.type_id = response.type_id;
|
||||
self.typeService.getData()
|
||||
.then(function(response2) {
|
||||
self.listType = [{value: undefined, label: '---'}];
|
||||
for(let iii= 0; iii < response2.length; iii++) {
|
||||
self.listType.push({value: response2[iii].id, label: response2[iii].name});
|
||||
}
|
||||
}).catch(function(response2) {
|
||||
console.log("get response22 : " + JSON.stringify(response2, null, 2));
|
||||
});
|
||||
self.saison_id = response.saison_id;
|
||||
self.group_id = response.group_id;
|
||||
self.listGroup = [{value: undefined, label: '---'}];
|
||||
if (response.type_id != undefined) {
|
||||
self.typeService.getSubGroup(response.type_id)
|
||||
.then(function(response2) {
|
||||
for(let iii= 0; iii < response2.length; iii++) {
|
||||
self.listGroup.push({value: response2[iii].id, label: response2[iii].name});
|
||||
}
|
||||
}).catch(function(response2) {
|
||||
console.log("get response22 : " + JSON.stringify(response2, null, 2));
|
||||
});
|
||||
}
|
||||
self.univers_id = response.univers_id;
|
||||
self.data_id = response.data_id;
|
||||
self.time = response.time;
|
||||
self.generated_name = response.generated_name;
|
||||
@ -94,6 +135,7 @@ export class VideoEditComponent implements OnInit {
|
||||
self.description = "";
|
||||
self.episode = undefined;
|
||||
self.group_id = undefined;
|
||||
self.univers_id = undefined;
|
||||
self.saison_id = undefined;
|
||||
self.data_id = -1;
|
||||
self.time = undefined;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user