2022-01-06 01:08:39 +01:00
|
|
|
import { Component, OnInit } from '@angular/core';
|
|
|
|
import { ActivatedRoute } from '@angular/router';
|
2022-01-08 00:41:28 +01:00
|
|
|
import { FormBuilder, Validators } from '@angular/forms';
|
2022-01-06 01:08:39 +01:00
|
|
|
import { ApiClientService } from 'src/app/_services/api-client.service';
|
2022-01-06 22:14:16 +01:00
|
|
|
import { ToastrService } from 'ngx-toastr';
|
2022-03-01 00:07:51 +01:00
|
|
|
import { TranslateService } from '@ngx-translate/core';
|
2022-01-06 01:08:39 +01:00
|
|
|
|
|
|
|
@Component({
|
|
|
|
selector: 'app-edit-service',
|
|
|
|
templateUrl: './edit-service.component.html',
|
|
|
|
styleUrls: ['./edit-service.component.scss']
|
|
|
|
})
|
|
|
|
export class EditServiceComponent implements OnInit {
|
2022-01-11 23:52:06 +01:00
|
|
|
addingService = false;
|
2022-01-08 00:41:28 +01:00
|
|
|
serviceId: string | undefined;
|
2022-01-11 23:52:06 +01:00
|
|
|
loadedService = {
|
|
|
|
start: '',
|
|
|
|
end: '',
|
|
|
|
code: '',
|
|
|
|
chief: '',
|
|
|
|
drivers: [],
|
|
|
|
crew: [],
|
|
|
|
place: '',
|
|
|
|
notes: '',
|
|
|
|
type: ''
|
|
|
|
};
|
2022-02-24 23:41:46 +01:00
|
|
|
loadedServiceLat = "";
|
|
|
|
loadedServiceLng = "";
|
2022-01-08 00:41:28 +01:00
|
|
|
|
|
|
|
users: any[] = [];
|
|
|
|
types: any[] = [];
|
2022-01-11 23:52:06 +01:00
|
|
|
|
|
|
|
place_lat: number = 0;
|
|
|
|
place_lng: number = 0;
|
2022-01-08 00:41:28 +01:00
|
|
|
|
|
|
|
addingType = false;
|
|
|
|
newType = "";
|
|
|
|
|
2022-01-09 14:31:19 +01:00
|
|
|
serviceForm: any;
|
|
|
|
private formSubmitAttempt: boolean = false;
|
2022-01-11 13:33:39 +01:00
|
|
|
submittingForm = false;
|
2022-01-09 14:31:19 +01:00
|
|
|
|
|
|
|
get start() { return this.serviceForm.get('start'); }
|
|
|
|
get end() { return this.serviceForm.get('end'); }
|
|
|
|
get code() { return this.serviceForm.get('code'); }
|
|
|
|
get chief() { return this.serviceForm.get('chief'); }
|
|
|
|
get drivers() { return this.serviceForm.get('drivers'); }
|
|
|
|
get crew() { return this.serviceForm.get('crew'); }
|
|
|
|
get place() { return this.serviceForm.get('place'); }
|
|
|
|
get type() { return this.serviceForm.get('type'); }
|
|
|
|
|
|
|
|
ngOnInit() {
|
|
|
|
this.serviceForm = this.fb.group({
|
2022-01-11 23:52:06 +01:00
|
|
|
start: [this.loadedService.start, [Validators.required]],
|
|
|
|
end: [this.loadedService.end, [Validators.required]],
|
|
|
|
code: [this.loadedService.code, [Validators.required, Validators.minLength(3)]],
|
|
|
|
chief: [this.loadedService.chief, [Validators.required]],
|
|
|
|
drivers: [this.loadedService.drivers, [Validators.required]],
|
|
|
|
crew: [this.loadedService.crew, [Validators.required]],
|
|
|
|
place: [this.loadedService.place, [Validators.required, Validators.minLength(3)]],
|
|
|
|
notes: [this.loadedService.notes],
|
|
|
|
type: [this.loadedService.type, [Validators.required, Validators.minLength(1)]]
|
2022-01-09 14:31:19 +01:00
|
|
|
});
|
|
|
|
}
|
2022-01-06 01:08:39 +01:00
|
|
|
|
2022-01-06 22:14:16 +01:00
|
|
|
constructor(
|
|
|
|
private route: ActivatedRoute,
|
|
|
|
private api: ApiClientService,
|
2022-01-08 00:41:28 +01:00
|
|
|
private toastr: ToastrService,
|
2022-03-01 00:07:51 +01:00
|
|
|
private fb: FormBuilder,
|
|
|
|
private translate: TranslateService
|
2022-01-06 22:14:16 +01:00
|
|
|
) {
|
2022-01-06 01:08:39 +01:00
|
|
|
this.route.paramMap.subscribe(params => {
|
|
|
|
this.serviceId = params.get('id') || undefined;
|
2022-01-11 23:52:06 +01:00
|
|
|
if(this.serviceId === "new") {
|
|
|
|
this.addingService = true;
|
|
|
|
} else {
|
|
|
|
this.api.get(`services/${this.serviceId}`).then((service) => {
|
|
|
|
this.loadedService = service;
|
2022-02-24 23:41:46 +01:00
|
|
|
this.loadedServiceLat = service.lat;
|
|
|
|
this.loadedServiceLng = service.lng;
|
2022-01-11 23:52:06 +01:00
|
|
|
|
|
|
|
let patch = Object.assign({}, service);
|
|
|
|
patch.start = new Date(parseInt(patch.start));
|
|
|
|
patch.end = new Date(parseInt(patch.end));
|
|
|
|
patch.drivers = patch.drivers.split(";");
|
|
|
|
patch.crew = patch.crew.split(";");
|
|
|
|
this.serviceForm.patchValue(patch);
|
|
|
|
});
|
|
|
|
}
|
2022-01-06 01:08:39 +01:00
|
|
|
console.log(this.serviceId);
|
|
|
|
});
|
|
|
|
this.api.get("users").then((users) => {
|
|
|
|
this.users = users;
|
|
|
|
console.log(this.users);
|
|
|
|
});
|
2022-01-06 22:14:16 +01:00
|
|
|
this.loadTypes();
|
|
|
|
}
|
|
|
|
|
|
|
|
loadTypes() {
|
|
|
|
this.api.get("service_types").then((types) => {
|
|
|
|
console.log(types);
|
|
|
|
this.types = types;
|
|
|
|
});
|
2022-01-06 01:08:39 +01:00
|
|
|
}
|
|
|
|
|
2022-01-06 22:14:16 +01:00
|
|
|
addType() {
|
|
|
|
if(this.newType.length < 2) {
|
2022-03-01 00:07:51 +01:00
|
|
|
this.translate.get('edit_service.type_must_be_two_characters_long').subscribe((res: string) => {
|
|
|
|
this.toastr.error(res);
|
|
|
|
});
|
2022-01-06 22:14:16 +01:00
|
|
|
return;
|
|
|
|
}
|
|
|
|
if(this.types.find(t => t.name == this.newType)) {
|
2022-03-01 00:07:51 +01:00
|
|
|
this.translate.get('edit_service.type_already_exists').subscribe((res: string) => {
|
|
|
|
this.toastr.error(res);
|
|
|
|
});
|
2022-01-06 22:14:16 +01:00
|
|
|
return;
|
|
|
|
}
|
|
|
|
this.api.post("service_types", {
|
|
|
|
name: this.newType
|
|
|
|
}).then((type) => {
|
|
|
|
this.addingType = false;
|
|
|
|
this.newType = "";
|
|
|
|
console.log(type);
|
2022-03-01 00:07:51 +01:00
|
|
|
if(type == 1) {
|
|
|
|
this.translate.get('edit_service.type_added_successfully').subscribe((res: string) => {
|
|
|
|
this.toastr.success(res);
|
|
|
|
});
|
|
|
|
this.loadTypes();
|
|
|
|
}
|
2022-01-06 22:14:16 +01:00
|
|
|
});
|
|
|
|
}
|
2022-01-07 18:37:00 +01:00
|
|
|
|
2022-01-09 14:31:19 +01:00
|
|
|
onDriversCheckboxChange(event: any) {
|
|
|
|
if (event.target.checked) {
|
|
|
|
this.drivers.setValue([...this.drivers.value, event.target.value]);
|
|
|
|
} else {
|
|
|
|
this.drivers.setValue(this.drivers.value.filter((x: number) => x !== event.target.value));
|
|
|
|
}
|
|
|
|
}
|
2022-01-11 23:52:06 +01:00
|
|
|
isDriverSelected(id: number) {
|
|
|
|
return this.drivers.value.find((x: number) => x == id);
|
|
|
|
}
|
2022-01-09 14:31:19 +01:00
|
|
|
|
|
|
|
onCrewCheckboxChange(event: any) {
|
|
|
|
if (event.target.checked) {
|
|
|
|
this.crew.setValue([...this.crew.value, event.target.value]);
|
|
|
|
} else {
|
|
|
|
this.crew.setValue(this.crew.value.filter((x: number) => x !== event.target.value));
|
|
|
|
}
|
|
|
|
}
|
2022-01-11 23:52:06 +01:00
|
|
|
isCrewSelected(id: number) {
|
|
|
|
return this.crew.value.find((x: number) => x == id);
|
|
|
|
}
|
2022-01-09 14:31:19 +01:00
|
|
|
|
2022-01-07 18:37:00 +01:00
|
|
|
setPlace(lat: number, lng: number) {
|
2022-01-11 23:52:06 +01:00
|
|
|
this.place_lat = lat;
|
|
|
|
this.place_lng = lng;
|
2022-01-09 14:31:19 +01:00
|
|
|
this.place.setValue(lat + ";" + lng);
|
2022-01-11 23:52:06 +01:00
|
|
|
console.log("Place selected", lat, lng);
|
2022-01-09 14:31:19 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
//https://loiane.com/2017/08/angular-reactive-forms-trigger-validation-on-submit/
|
|
|
|
isFieldValid(field: string) {
|
|
|
|
return this.formSubmitAttempt ? this.serviceForm.get(field).valid : true;
|
2022-01-07 18:37:00 +01:00
|
|
|
}
|
2022-01-08 00:41:28 +01:00
|
|
|
|
|
|
|
formSubmit() {
|
2022-01-15 00:38:53 +01:00
|
|
|
console.log("form values", this.serviceForm.value);
|
2022-01-09 14:31:19 +01:00
|
|
|
this.formSubmitAttempt = true;
|
|
|
|
if(this.serviceForm.valid) {
|
2022-01-11 13:33:39 +01:00
|
|
|
this.submittingForm = true;
|
2022-01-11 14:47:16 +01:00
|
|
|
let values = Object.assign({}, this.serviceForm.value);
|
2022-01-09 14:31:19 +01:00
|
|
|
values.start = values.start.getTime();
|
|
|
|
values.end = values.end.getTime();
|
|
|
|
values.drivers = values.drivers.join(";");
|
|
|
|
values.crew = values.crew.join(";");
|
|
|
|
console.log(values);
|
2022-04-01 00:15:05 +02:00
|
|
|
let submit_url = "services";
|
|
|
|
if(!this.addingService) {
|
|
|
|
submit_url = `services/${this.serviceId}`;
|
|
|
|
}
|
|
|
|
this.api.post(submit_url, values).then((res) => {
|
2022-01-09 14:31:19 +01:00
|
|
|
console.log(res);
|
2022-04-01 00:15:05 +02:00
|
|
|
this.translate.get(this.addingService ? 'edit_service.service_added_successfully' : 'edit_service.service_updated_successfully').subscribe((res: string) => {
|
2022-03-01 00:07:51 +01:00
|
|
|
this.toastr.success(res);
|
|
|
|
});
|
2022-01-11 13:33:39 +01:00
|
|
|
this.submittingForm = false;
|
2022-01-09 14:31:19 +01:00
|
|
|
}).catch((err) => {
|
|
|
|
console.error(err);
|
2022-04-01 00:15:05 +02:00
|
|
|
this.translate.get(this.addingService ? 'edit_service.service_add_failed' : 'edit_service.service_update_failed').subscribe((res: string) => {
|
2022-03-01 00:07:51 +01:00
|
|
|
this.toastr.error(res);
|
|
|
|
});
|
2022-01-11 13:33:39 +01:00
|
|
|
this.submittingForm = false;
|
2022-01-09 14:31:19 +01:00
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
formReset() {
|
|
|
|
this.formSubmitAttempt = false;
|
|
|
|
this.serviceForm.reset();
|
2022-01-08 00:41:28 +01:00
|
|
|
}
|
2022-01-06 01:08:39 +01:00
|
|
|
}
|