Improve validation for desktop

This commit is contained in:
Peter Maquiran
2021-07-05 11:15:55 +01:00
parent 382104d058
commit 2d4216a6b0
8 changed files with 66 additions and 35 deletions
@@ -9,24 +9,41 @@
</div>
<div class="overflow-y-auto content-default-padding">
<div class="ion-item-container width-100">
<div class="ion-item-container width-100" [class.input-error]="Form?.get('Subject')?.invalid && validateFrom ">
<ion-input placeholder="Assunto*" [(ngModel)]="postData.Subject"></ion-input>
</div>
<div *ngIf="Form && validateFrom" >
<div *ngIf="Form.get('Subject').invalid " class="input-errror-message">
<div *ngIf="Form.get('Subject').errors?.required">
Campo obrigatório.
</div>
<div *ngIf="Form.get('Subject').errors?.minlength">
O campo deve ter pelo menos 4 caracteres.
</div>
</div>
</div>
<div class="container-div width-100">
<div class="ion-item-class-2 width-100">
<div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-location.svg"></ion-icon>
</div>
<div class="ion-input-class">
<div class="ion-input-class" [class.input-error]="Form?.get('Location')?.invalid && validateFrom ">
<ion-input placeholder="Localização*" [(ngModel)]="postData.Location"></ion-input>
</div>
</div>
<!-- Error messages -->
<span class="error ion-padding" *ngIf="formLocationSatus">
Campo obrigatório
</span>
</div>
<div *ngIf="Form && validateFrom" >
<div *ngIf="Form.get('Location').invalid " class="input-errror-message">
<div *ngIf="Form.get('Location').errors?.required">
Campo obrigatório.
</div>
<div *ngIf="Form.get('Location').errors?.minlength">
O campo deve ter pelo menos 4 caracteres.
</div>
</div>
</div>
<div class="container-div">
@@ -34,7 +51,7 @@
<div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
</div>
<div class="ion-input-class">
<div class="ion-input-class" >
<ion-select
class="d-block d-md-none"
[(ngModel)]="postData.CalendarName"
@@ -46,7 +63,7 @@
</ion-select>
<mat-form-field floatLabel="never" class="d-none d-md-block width-100">
<mat-form-field floatLabel="never" appearance="none" class="d-none d-md-block width-100">
<mat-select placeholder="Selecione agenda" [(ngModel)]="postData.CalendarName" >
<mat-option value="Oficial">
Oficial
@@ -79,11 +96,11 @@
value="2020-11-19T11:06Z">
</ion-datetime>
<mat-form-field class="width-100 date-hour-picker d-none d-md-block">
<mat-form-field class="width-100 date-hour-picker d-md-block">
<input matInput [ngxMatDatetimePicker]="picker1"
placeholder="Choose a date*"
[formControl]="dateControlStart"
[min]="minDate" [max]="maxDate"
[min]="minDate"
[disabled]="disabled"
>
<mat-datepicker-toggle id="new-inicio" matSuffix [for]="picker1"></mat-datepicker-toggle>
@@ -105,7 +122,7 @@
<div class="ion-icon-class">
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
</div>
<div class="ion-input-class">
<div class="ion-input-class flex-grow-1">
<ion-datetime
class="d-block d-md-none"
placeholder="Fim*"
@@ -118,11 +135,11 @@
value="2020-11-19T11:06Z">
</ion-datetime>
<mat-form-field class="date-hour-picker">
<mat-form-field class="date-hour-picker width-100 d-none d-md-block">
<input matInput [ngxMatDatetimePicker]="fim"
placeholder="Choose a date*S"
[formControl]="dateControlEnd"
[min]="minDate" [max]="maxDate"
[min]="endMinDate"
[disabled]="disabled"
>
<mat-datepicker-toggle id="new-fim" matSuffix [for]="fim"></mat-datepicker-toggle>
@@ -168,6 +185,7 @@
value="false"
interface="action-sheet"
required
appearance="none"
>
<mat-select placeholder="Selecione repetição*" [(ngModel)]="postData.IsRecurring" >
<mat-option value="false">
@@ -205,4 +205,4 @@
.close-button {
display: block !important;
}
}
}
@@ -54,8 +54,11 @@ export class BookMeetingModalPage implements OnInit {
public showSeconds = false;
public touchUi = false;
public enableMeridian = false;
public minDate: any;
public maxDate: any;
public minDate = new Date();
// curent timestamp + 15 minutes
public endMinDate = new Date(new Date().getTime() + 15 * 60000);
public stepHour = 1;
public stepMinute = 5;
public stepSecond = 5;
@@ -138,6 +141,9 @@ export class BookMeetingModalPage implements OnInit {
/* Set + 30minutes to seleted datetime */
let selectedEndDate = new Date();
/* this.postData.EndDate = new Date(selectedEndDate.setMinutes(new Date().getMinutes() + 30)); */
this.dateControlStart = new FormControl(moment(new Date()));
this.dateControlEnd = new FormControl(moment(new Date(new Date().getTime() + 15 * 60000)));
}
ngOnInit() {
@@ -53,6 +53,7 @@
float: left;
overflow: hidden;
flex: 1;
min-height: 44px;
}
.ion-input-class-no-height{
border: 1px solid #ebebeb;
@@ -3,20 +3,15 @@ import { ProcessesService } from 'src/app/services/processes.service';
import { AttachmentsService } from 'src/app/services/attachments.service';
import { EventsService } from 'src/app/services/events.service';
import { InAppBrowser } from '@ionic-native/in-app-browser/ngx';
import { DailyWorkTask } from '../../../../models/dailyworktask.model';
import { ActivatedRoute, NavigationExtras, Router } from '@angular/router';
import { formatDate } from '@angular/common';
import { Event } from '../../../../models/event.model';
import { AnimationController, MenuController, ModalController, PopoverController } from '@ionic/angular';
import { AlertService } from 'src/app/services/alert.service';
import { ModalController, PopoverController } from '@ionic/angular';
import { ExpedientTaskModalPage } from '../expedient-task-modal/expedient-task-modal.page';
import { BookMeetingModalPage } from '../book-meeting-modal/book-meeting-modal.page';
import { ViewEventPage } from 'src/app/pages/agenda/view-event/view-event.page';
import { momentG } from 'src/plugin/momentG'
import { DiscartExpedientModalPage } from '../../discart-expedient-modal/discart-expedient-modal.page';
import { OptsExpedientePage } from 'src/app/shared/popover/opts-expediente/opts-expediente.page';
import { SuccessMessagePage } from 'src/app/shared/popover/success-message/success-message.page';
import { BadRequestPage } from 'src/app/shared/popover/bad-request/bad-request.page';
import { ToastService } from 'src/app/services/toast.service';
@Component({
@@ -43,20 +38,16 @@ export class ExpedienteDetailPage implements OnInit {
hideSendToPendentes = true
constructor(
private processes: ProcessesService,
private iab: InAppBrowser,
private attachments: AttachmentsService,
private events: EventsService,
private menu: MenuController,
private router: Router,
private modalController: ModalController,
private alertService: AlertService,
public popoverController: PopoverController,
private activatedRoute: ActivatedRoute,
private toastService: ToastService,
private animationController: AnimationController,
) {
this.activatedRoute.paramMap.subscribe(params => {
if(params["params"].SerialNumber) {
@@ -164,6 +155,11 @@ export class ExpedienteDetailPage implements OnInit {
});
})
console.log('this.task', this.task)
console.log('this.task.DocumentURL', this.task.DocumentURL)
});
@@ -185,9 +181,10 @@ export class ExpedienteDetailPage implements OnInit {
}
}
viewDocument(){
viewDocument() {
this.processes.GetDocumentUrl(this.task.DocId, this.task.FsId).subscribe(res=>{
const url: string = res.replace("webTRIX.Viewer","webTRIX.Viewer.Branch1");
const browser = this.iab.create(url,"_blank");
browser.show();
@@ -70,7 +70,7 @@
</ion-select>
<mat-form-field class="d-none d-md-block width-100" >
<mat-form-field appearance="none" class="d-none d-md-block width-100" >
<mat-select placeholder="Selecione agenda" [(ngModel)]="eventProcess.workflowInstanceDataFields.Agenda" >
<mat-option value="Oficial">
Oficial
@@ -111,7 +111,7 @@
>
</ion-datetime>
<mat-form-field class="width-100 date-hour-picker d-none d-md-block">
<mat-form-field appearance="none" class="width-100 date-hour-picker d-none d-md-block">
<input matInput [ngxMatDatetimePicker]="picker1"
placeholder="Choose a date"
[formControl]="dateControlStart"
@@ -149,7 +149,7 @@
>
</ion-datetime>
<mat-form-field class="width-100 date-hour-picker d-none d-md-block">
<mat-form-field appearance="none" class="width-100 date-hour-picker d-none d-md-block">
<input matInput [ngxMatDatetimePicker]="fim"
placeholder="Choose a date"
[formControl]="dateControlEnd"
@@ -193,6 +193,7 @@
value="false"
interface="action-sheet"
required
appearance="none"
>
<mat-select [(value)]="eventProcess.workflowInstanceDataFields.IsRecurring">
<mat-option value="false">
@@ -134,7 +134,7 @@ export class NewEventPage implements OnInit {
this.loggeduser = userService.ValidatedUser;
this.dateControlStart = new FormControl(moment(new Date()));
this.dateControlEnd = new FormControl(moment(new Date()));
this.dateControlEnd = new FormControl(moment(new Date(new Date().getTime() + 15 * 60000)));
}
ngOnInit() {
+12 -4
View File
@@ -955,11 +955,11 @@ background: rgb(92, 92, 92);
.date-hour-picker {
margin-top: -6px;
label#mat-form-field-label-7 {
display: none;
}
.span.ng-tns-c193-4, .ng-star-inserted {
// display: none;
}
@@ -967,7 +967,7 @@ background: rgb(92, 92, 92);
.ng-star-inserted{
// display: none;
position: absolute;
width: 447px;
width: 100%;
height: 43px;
opacity: 0;
button {
@@ -975,7 +975,15 @@ background: rgb(92, 92, 92);
height: 100%;
}
}
}
button {
width: 100%;
height: 100%;
}
.mat-datepicker-toggle, mat-datepicker-toggle {
width: 100%;
}
}
.mat-active span {
color: #0d89d1 !important;