Imporve pages

This commit is contained in:
Peter Maquiran
2021-05-26 11:22:50 +01:00
parent 503109053b
commit 6973720c92
12 changed files with 279 additions and 186 deletions
@@ -294,4 +294,9 @@ export class DespachosPrPage implements OnInit {
this.dicIndex = index; this.dicIndex = index;
} }
goBack(){
this.router.navigate(['/home/gabinete-digital']);
}
} }
@@ -17,6 +17,8 @@ import { SharedModule } from 'src/app/shared/shared.module';
SharedModule, SharedModule,
DespachoPageRoutingModule DespachoPageRoutingModule
], ],
declarations: [DespachoPage] declarations: [
DespachoPage,
]
}) })
export class DespachoPageModule {} export class DespachoPageModule {}
@@ -15,8 +15,10 @@ import { SharedModule } from 'src/app/shared/shared.module';
FormsModule, FormsModule,
IonicModule, IonicModule,
SharedModule, SharedModule,
DespachosPageRoutingModule DespachosPageRoutingModule,
], ],
declarations: [DespachosPage] declarations: [
DespachosPage,
]
}) })
export class DespachosPageModule {} export class DespachosPageModule {}
@@ -1,5 +1,13 @@
<ion-header class="ion-no-border"> <ion-header class="ion-no-border">
<app-header > </app-header>
</ion-header>
<ion-header class="ion-no-border header-2">
<div class="title"> <div class="title">
<app-btn-modal-dismiss (click)="goBack()" ></app-btn-modal-dismiss>
<div class="thetitle"><ion-label >Despachos</ion-label></div> <div class="thetitle"><ion-label >Despachos</ion-label></div>
<div class="theicon"> <div class="theicon">
<button class="btn-no-color" (click)="doRefresh($event)"> <button class="btn-no-color" (click)="doRefresh($event)">
@@ -9,77 +17,81 @@
</div> </div>
</ion-header> </ion-header>
<ion-content> <ion-content>
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<div class="main-content">
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-refresher-content <ion-refresher-content
pullingIcon="chevron-down-circle-outline" pullingIcon="chevron-down-circle-outline"
pullingText="deslize para actualizar" pullingText="deslize para actualizar"
refreshingSpinner="circles" refreshingSpinner="circles"
refreshingText="A actualizar..."> refreshingText="A actualizar...">
</ion-refresher-content> </ion-refresher-content>
</ion-refresher> </ion-refresher>
<div class="width-100"> <div class="width-100">
<div *ngIf="despachoList"> <div *ngIf="despachoList">
<ion-list> <ion-list>
<ion-item <ion-item
class="expediente ion-no-padding cursor-pointer" class="expediente ion-no-padding cursor-pointer"
*ngFor = "let task of despachoList; let i = index" *ngFor = "let task of despachoList; let i = index"
(click)="viewExpedientDetail(task.SerialNumber)" (click)="viewExpedientDetail(task.SerialNumber)"
> >
<!-- [routerLink]="['/home/gabinete-digital/expediente',task.SerialNumber]" --> <!-- [routerLink]="['/home/gabinete-digital/expediente',task.SerialNumber]" -->
<div class="item width-100"> <div class="item width-100">
<div class="exp-top-detail"> <div class="exp-top-detail">
<div class="exp-date"> <div class="exp-date">
<ion-label>{{ task.CreateDate | date: 'dd-MM-yy' }}</ion-label> <ion-label>{{ task.CreateDate | date: 'dd-MM-yy' }}</ion-label>
</div> </div>
<div class="exp-remetente"> <div class="exp-remetente">
<ion-label>{{task.Senders}}</ion-label> <ion-label>{{task.Senders}}</ion-label>
</div> </div>
<div class="exp-workflow"> <div class="exp-workflow">
<span class="label">{{task.activityInstanceName}}</span> <span class="label">{{task.activityInstanceName}}</span>
</div> </div>
<div class="exp-icon d-flex align-center"> <div class="exp-icon d-flex align-center">
<ion-icon src="assets/images/icons-expediente-attachment.svg"></ion-icon>
<label>{{task.DocumentsQty}}</label>
<!-- <ion-menu-button (click)="docIndex(i)" style="width: 35px; height: 41px;" autoHide="false">
<ion-icon src="assets/images/icons-expediente-attachment.svg"></ion-icon> <ion-icon src="assets/images/icons-expediente-attachment.svg"></ion-icon>
</ion-menu-button> --> <label>{{task.DocumentsQty}}</label>
<!-- <ion-menu-button (click)="docIndex(i)" style="width: 35px; height: 41px;" autoHide="false">
<ion-icon src="assets/images/icons-expediente-attachment.svg"></ion-icon>
</ion-menu-button> -->
</div>
</div>
<div class="exp-bottom-detail">
<ion-label>{{ task.Folio }}</ion-label>
</div> </div>
</div> </div>
<div class="exp-bottom-detail"> </ion-item>
<ion-label>{{ task.Folio }}</ion-label> </ion-list>
</div>
</div>
</ion-item>
</ion-list>
</div>
</div>
<div *ngIf="despachoList.length < 1">
<ion-list>
<ion-item>
<ion-thumbnail slot="end">
<ion-skeleton-text animated></ion-skeleton-text>
</ion-thumbnail>
<ion-label>
<h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
<p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
<p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
</ion-label>
</ion-item>
<ion-item>
<ion-thumbnail slot="end">
<ion-skeleton-text animated></ion-skeleton-text>
</ion-thumbnail>
<ion-label>
<h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
<p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
<p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
</ion-label>
</ion-item>
</ion-list>
</div> </div>
</div> </div>
<div *ngIf="despachoList.length < 1">
<ion-list>
<ion-item>
<ion-thumbnail slot="end">
<ion-skeleton-text animated></ion-skeleton-text>
</ion-thumbnail>
<ion-label>
<h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
<p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
<p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
</ion-label>
</ion-item>
<ion-item>
<ion-thumbnail slot="end">
<ion-skeleton-text animated></ion-skeleton-text>
</ion-thumbnail>
<ion-label>
<h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
<p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
<p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
</ion-label>
</ion-item>
</ion-list>
</div>
</ion-content> </ion-content>
@@ -1,9 +1,22 @@
@import '~src/function.scss'; @import '~src/function.scss';
/* CONTENT */ /* CONTENT */
:host{ :host{
padding: 30px 20px 0 20px !important; margin: 0;
margin: 0;
} }
.header-2 {
border-top-right-radius: 24px;
border-top-left-radius: 24px;
}
ion-content, .header-2, .main-content{
padding: 30px 20px 0 20px !important;
background-color: white;
}
.main-content {
padding-top: 0px !important;
}
.title{ .title{
font-family: Roboto; font-family: Roboto;
font-size: 25px; font-size: 25px;
@@ -64,10 +64,15 @@ export class DespachosPage implements OnInit {
console.log(res); console.log(res);
}); });
} }
segmentChanged(ev: any) { segmentChanged(ev: any) {
this.LoadList(); this.LoadList();
} }
goBack(){
this.router.navigate(['/home/gabinete-digital']);
}
notImplemented(){ notImplemented(){
this.alertService.presentAlert('Funcionalidade em desenvolvimento'); this.alertService.presentAlert('Funcionalidade em desenvolvimento');
} }
@@ -1,5 +1,9 @@
<ion-header class="ion-no-border"> <ion-header class="ion-no-border">
<app-btn-modal-dismiss></app-btn-modal-dismiss> <app-header > </app-header>
</ion-header>
<ion-header class="ion-no-border header-2">
<app-btn-modal-dismiss (click)="goBack()"></app-btn-modal-dismiss>
<div class="title"> <div class="title">
<div class="thetitle"><ion-label >Pedidos</ion-label></div> <div class="thetitle"><ion-label >Pedidos</ion-label></div>
<div class="theicon"> <div class="theicon">
@@ -19,8 +23,11 @@
</ion-segment> </ion-segment>
</ion-toolbar> </ion-toolbar>
</ion-header> </ion-header>
<ion-content> <ion-content>
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<div class="main-content">
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-refresher-content <ion-refresher-content
pullingIcon="chevron-down-circle-outline" pullingIcon="chevron-down-circle-outline"
pullingText="deslize para actualizar" pullingText="deslize para actualizar"
@@ -29,97 +36,100 @@
</ion-refresher-content> </ion-refresher-content>
</ion-refresher> </ion-refresher>
<div class="width-100" [ngSwitch]="segment"> <div class="width-100" [ngSwitch]="segment">
<div *ngIf="parecerList"> <div *ngIf="parecerList">
<ion-list *ngSwitchCase="'parecer'"> <ion-list *ngSwitchCase="'parecer'">
<!-- *ngFor = "let task of parecerList; let i = index" <!-- *ngFor = "let task of parecerList; let i = index"
(click)="viewExpedientDetail(task.SerialNumber)" --> (click)="viewExpedientDetail(task.SerialNumber)" -->
<ion-item <ion-item
class="expediente ion-no-padding" class="expediente ion-no-padding"
*ngFor = "let task of parecerList" *ngFor = "let task of parecerList"
(click)="goToPedido(task.SerialNumber)" (click)="goToPedido(task.SerialNumber)"
> >
<!-- (click)="viewExpedientDetail(task.SerialNumber)" --> <!-- (click)="viewExpedientDetail(task.SerialNumber)" -->
<!-- [routerLink]="['/home/gabinete-digital/expediente',task.SerialNumber]" --> <!-- [routerLink]="['/home/gabinete-digital/expediente',task.SerialNumber]" -->
<div class="item width-100"> <div class="item width-100">
<div class="exp-top-detail"> <div class="exp-top-detail">
<div class="exp-date"> <div class="exp-date">
<ion-label>{{ task.CreateDate | date: 'dd-MM-yy' }}</ion-label> <ion-label>{{ task.CreateDate | date: 'dd-MM-yy' }}</ion-label>
</div> </div>
<div class="exp-remetente"> <div class="exp-remetente">
<ion-label>{{task.Remetente}}</ion-label> <ion-label>{{task.Remetente}}</ion-label>
</div> </div>
<div class="exp-icon"> <div class="exp-icon">
<ion-icon src="assets/images/icons-expediente-attachment.svg"></ion-icon>
<label></label>
</div>
</div>
<div class="exp-bottom-detail">
<ion-label>{{ task.Folio }}</ion-label>
</div>
</div>
</ion-item>
</ion-list>
</div>
<div *ngIf="deferimentoList">
<ion-list *ngSwitchCase="'deferimento'">
<ion-item
class="expediente ion-no-padding"
*ngFor = "let task of deferimentoList"
(click)="viewPedidoDetail(task.SerialNumber)"
>
<!-- (click)="viewExpedientDetail(task.SerialNumber)" -->
<!-- [routerLink]="['/home/gabinete-digital/expediente',task.SerialNumber]" -->
<div class="item width-100">
<div class="exp-top-detail">
<div class="exp-date">
<ion-label>{{ task.CreateDate | date: 'dd-MM-yy' }}</ion-label>
</div>
<div class="exp-remetente">
<ion-label>{{task.Remetente}}</ion-label>
</div>
<div class="exp-workflow">
<span class="label">{{task.WorkflowName}}</span>
</div>
<div class="exp-icon">
<ion-menu-button style="width: 35px; height: 41px;" autoHide="false">
<ion-icon src="assets/images/icons-expediente-attachment.svg"></ion-icon> <ion-icon src="assets/images/icons-expediente-attachment.svg"></ion-icon>
</ion-menu-button> <label></label>
</div>
</div>
<div class="exp-bottom-detail">
<ion-label>{{ task.Folio }}</ion-label>
</div> </div>
</div> </div>
<div class="exp-bottom-detail"> </ion-item>
<ion-label>{{ task.Folio }}</ion-label> </ion-list>
</div>
<div *ngIf="deferimentoList">
<ion-list *ngSwitchCase="'deferimento'">
<ion-item
class="expediente ion-no-padding"
*ngFor = "let task of deferimentoList"
(click)="viewPedidoDetail(task.SerialNumber)"
>
<!-- (click)="viewExpedientDetail(task.SerialNumber)" -->
<!-- [routerLink]="['/home/gabinete-digital/expediente',task.SerialNumber]" -->
<div class="item width-100">
<div class="exp-top-detail">
<div class="exp-date">
<ion-label>{{ task.CreateDate | date: 'dd-MM-yy' }}</ion-label>
</div>
<div class="exp-remetente">
<ion-label>{{task.Remetente}}</ion-label>
</div>
<div class="exp-workflow">
<span class="label">{{task.WorkflowName}}</span>
</div>
<div class="exp-icon">
<ion-menu-button style="width: 35px; height: 41px;" autoHide="false">
<ion-icon src="assets/images/icons-expediente-attachment.svg"></ion-icon>
</ion-menu-button>
</div>
</div>
<div class="exp-bottom-detail">
<ion-label>{{ task.Folio }}</ion-label>
</div>
</div> </div>
</div> </ion-item>
</ion-item> </ion-list>
</div>
</div>
<div *ngIf="!parecerList && !deferimentoList">
<ion-list>
<ion-item>
<ion-thumbnail slot="end">
<ion-skeleton-text animated></ion-skeleton-text>
</ion-thumbnail>
<ion-label>
<h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
<p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
<p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
</ion-label>
</ion-item>
<ion-item>
<ion-thumbnail slot="end">
<ion-skeleton-text animated></ion-skeleton-text>
</ion-thumbnail>
<ion-label>
<h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
<p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
<p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
</ion-label>
</ion-item>
</ion-list> </ion-list>
</div> </div>
</div> </div>
<div *ngIf="!parecerList && !deferimentoList">
<ion-list>
<ion-item>
<ion-thumbnail slot="end">
<ion-skeleton-text animated></ion-skeleton-text>
</ion-thumbnail>
<ion-label>
<h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
<p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
<p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
</ion-label>
</ion-item>
<ion-item>
<ion-thumbnail slot="end">
<ion-skeleton-text animated></ion-skeleton-text>
</ion-thumbnail>
<ion-label>
<h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
<p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
<p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
</ion-label>
</ion-item>
</ion-list>
</div>
</ion-content> </ion-content>
@@ -1,9 +1,22 @@
@import '~src/function.scss'; @import '~src/function.scss';
/* CONTENT */ /* CONTENT */
:host{ :host{
padding: 30px 20px 0 20px !important; margin: 0;
margin: 0;
} }
.header-2 {
border-top-right-radius: 24px;
border-top-left-radius: 24px;
}
ion-content, .header-2, .main-content{
padding: 30px 20px 0 20px !important;
background-color: white;
}
.main-content {
padding-top: 0px !important;
}
.title{ .title{
font-family: Roboto; font-family: Roboto;
font-size: 25px; font-size: 25px;
@@ -52,6 +52,10 @@ export class PedidosPage implements OnInit {
this.LoadList(); this.LoadList();
} }
goBack(){
this.router.navigate(['/home/gabinete-digital']);
}
segmentChanged(ev: any) { segmentChanged(ev: any) {
this.LoadList(); this.LoadList();
} }
@@ -1,5 +1,10 @@
<ion-header class="ion-no-border"> <ion-header class="ion-no-border">
<app-btn-modal-dismiss></app-btn-modal-dismiss> <app-header > </app-header>
</ion-header>
<ion-header class="ion-no-border header-2">
<app-btn-modal-dismiss (click)="goBack()" ></app-btn-modal-dismiss>
<div class="title"> <div class="title">
<div class="thetitle"><ion-label >Pendentes</ion-label></div> <div class="thetitle"><ion-label >Pendentes</ion-label></div>
<div class="theicon"> <div class="theicon">
@@ -9,8 +14,11 @@
</div> </div>
</div> </div>
</ion-header> </ion-header>
<ion-content> <ion-content>
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<div class="main-content">
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-refresher-content <ion-refresher-content
pullingIcon="chevron-down-circle-outline" pullingIcon="chevron-down-circle-outline"
pullingText="deslize para actualizar" pullingText="deslize para actualizar"
@@ -53,30 +61,32 @@
</div> </div>
</div> </div>
<div *ngIf="!pendentesList"> <div *ngIf="!pendentesList">
<ion-list> <ion-list>
<ion-item> <ion-item>
<ion-thumbnail slot="end"> <ion-thumbnail slot="end">
<ion-skeleton-text animated></ion-skeleton-text> <ion-skeleton-text animated></ion-skeleton-text>
</ion-thumbnail> </ion-thumbnail>
<ion-label> <ion-label>
<h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3> <h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
<p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p> <p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
<p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p> <p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
</ion-label> </ion-label>
</ion-item> </ion-item>
<ion-item> <ion-item>
<ion-thumbnail slot="end"> <ion-thumbnail slot="end">
<ion-skeleton-text animated></ion-skeleton-text> <ion-skeleton-text animated></ion-skeleton-text>
</ion-thumbnail> </ion-thumbnail>
<ion-label> <ion-label>
<h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3> <h3><ion-skeleton-text animated style="width: 50%"></ion-skeleton-text></h3>
<p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p> <p><ion-skeleton-text animated style="width: 80%"></ion-skeleton-text></p>
<p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p> <p><ion-skeleton-text animated style="width: 60%"></ion-skeleton-text></p>
</ion-label> </ion-label>
</ion-item> </ion-item>
</ion-list> </ion-list>
</div>
</div> </div>
</ion-content> </ion-content>
@@ -1,9 +1,22 @@
@import '~src/function.scss'; @import '~src/function.scss';
/* CONTENT */ /* CONTENT */
:host{ :host{
padding: 30px 20px 0 20px !important; margin: 0;
margin: 0;
} }
.header-2 {
border-top-right-radius: 24px;
border-top-left-radius: 24px;
}
ion-content, .header-2, .main-content{
padding: 30px 20px 0 20px !important;
background-color: white;
}
.main-content {
padding-top: 0px !important;
}
.title{ .title{
font-family: Roboto; font-family: Roboto;
font-size: 25px; font-size: 25px;
@@ -52,6 +52,10 @@ export class PendentesPage implements OnInit {
this.LoadList(); this.LoadList();
} }
goBack() {
this.router.navigate(['/home/gabinete-digital']);
}
notImplemented(){ notImplemented(){
this.alertService.presentAlert('Funcionalidade em desenvolvimento'); this.alertService.presentAlert('Funcionalidade em desenvolvimento');
} }