mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-18 20:47:54 +00:00
Stuled expedient-detail page
This commit is contained in:
+55
-10
@@ -3,13 +3,13 @@
|
||||
<ion-buttons slot="start">
|
||||
<ion-back-button defaultHref="/expediente"></ion-back-button>
|
||||
</ion-buttons>
|
||||
<ion-title>Detalhes do Processo</ion-title>
|
||||
<ion-title>Expediente</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content padding>
|
||||
<div *ngIf="task">
|
||||
|
||||
<h3 class="h3-event-title">Detalhes do Expediente</h3>
|
||||
<ion-item-group>
|
||||
<ion-item>
|
||||
<ion-label position="stacked">Assunto</ion-label>
|
||||
@@ -21,14 +21,16 @@
|
||||
</ion-item>
|
||||
<ion-item>
|
||||
<ion-label position="stacked">Data</ion-label>
|
||||
<ion-input disabled="true" value=''>{{ task.CreateDate }}</ion-input>
|
||||
<ion-input disabled="true" value=''>{{ task.CreateDate | date: 'dd-MM-yy | hh:mm'}}</ion-input>
|
||||
</ion-item>
|
||||
<ion-button (click)="viewDocument()" shape="round" expand="outline">
|
||||
<ion-button (click)="viewDocument()" shape="round" expand="block">
|
||||
<ion-icon name="attach" slot="start"></ion-icon>
|
||||
Ver documento
|
||||
</ion-button>
|
||||
</ion-item-group>
|
||||
<div *ngIf="eventsList">
|
||||
<h3 class="h3-event-title">Eventos Associados</h3>
|
||||
<ion-list>
|
||||
<ion-item-group>
|
||||
<ion-item-sliding>
|
||||
<ion-item lines="none"
|
||||
*ngFor="let event of eventsList"
|
||||
@@ -40,7 +42,7 @@
|
||||
</div>
|
||||
<div class="div-content-{{event.CalendarName}}">
|
||||
<h3 class="capitalizeText">{{event.Subject}}</h3>
|
||||
<p>{{event.StartDate | date: 'hh:mm'}} - {{event.EndDate| date: 'hh:mm'}}</p>
|
||||
<p>{{event.StartDate | date: 'dd-MM-yy | hh:mm'}} - {{event.EndDate| date: 'hh:mm'}}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="div-botton">
|
||||
@@ -57,9 +59,52 @@
|
||||
</div>
|
||||
</ion-item>
|
||||
</ion-item-sliding>
|
||||
</ion-item-group>
|
||||
</ion-list>
|
||||
</ion-item-group>
|
||||
</div>
|
||||
<div *ngIf="!eventsList">
|
||||
<ion-list>
|
||||
<ion-list-header>
|
||||
<ion-label>
|
||||
<ion-skeleton-text animated style="width: 50%"></ion-skeleton-text>
|
||||
</ion-label>
|
||||
</ion-list-header>
|
||||
<ion-item>
|
||||
<ion-thumbnail slot="start">
|
||||
<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="start">
|
||||
<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 *ngIf="!task">
|
||||
<ion-list>
|
||||
@@ -91,8 +136,8 @@
|
||||
</p>
|
||||
</ion-label>
|
||||
</ion-item>
|
||||
<ion-button color="medium" shape="round" expand="outline">
|
||||
<ion-icon color="medium" name="attach" slot="start"></ion-icon>
|
||||
<ion-button color="medium" shape="round" expand="block">
|
||||
<!-- <ion-icon color="medium" name="attach" slot="start"></ion-icon> -->
|
||||
<ion-skeleton-text animated style="width: 50%"></ion-skeleton-text>
|
||||
</ion-button>
|
||||
</ion-list>
|
||||
|
||||
+115
-2
@@ -4,5 +4,118 @@ ion-item-group{
|
||||
ion-button{
|
||||
display: block;
|
||||
width: 80%;
|
||||
margin: 15px auto;
|
||||
}
|
||||
margin: 20px auto;
|
||||
}
|
||||
.h3-event-title{
|
||||
padding: 15px 0 0px 25px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
//DIV
|
||||
.div-item-Oficial{
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
border-bottom: 1px solid #ccc;
|
||||
margin: 10px 0 5px 0;
|
||||
/* background: #cab0dc; */
|
||||
/* border-radius: 20px; */
|
||||
/* padding: 10px; */
|
||||
/* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); */
|
||||
}
|
||||
.div-item-Pessoal{
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
border-bottom: 1px solid #ccc;
|
||||
margin: 10px 0 5px 0;
|
||||
/* background: #cbeecb; */
|
||||
/* border-radius: 20px; */
|
||||
/* padding: 10px; */
|
||||
/* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); */
|
||||
}
|
||||
.div-up{
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
.div-up h3{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 17px;
|
||||
width: 100%;
|
||||
}
|
||||
.div-icon{
|
||||
width: 10%;
|
||||
font-size: 22px;
|
||||
float: left;
|
||||
color: #808080;
|
||||
}
|
||||
.div-icon ion-icon{
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
|
||||
}
|
||||
.div-content-Oficial{
|
||||
width: 85%;
|
||||
float: left;
|
||||
border-left: 4px solid #cab0dc;
|
||||
padding: 0 0 0 12px;
|
||||
}
|
||||
.div-content-Pessoal{
|
||||
width: 85%;
|
||||
float: left;
|
||||
border-left: 4px solid #cbeecb;
|
||||
padding: 0 0 0 12px;
|
||||
}
|
||||
.div-content-Oficial h3, .div-content-Pessoal h3{
|
||||
font-size: 14pt;
|
||||
/* border: 1px solid red; */
|
||||
}
|
||||
.div-content-Oficial p, .div-content-Pessoal p{
|
||||
font-size: 12pt;
|
||||
color: rgb(94, 92, 92);
|
||||
padding: 0 !important;
|
||||
margin: 0 !important;
|
||||
}
|
||||
.div-botton{
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
margin: 10px 0 5px 0;
|
||||
}
|
||||
.div-botton-left{
|
||||
width: 10%;
|
||||
float: left;
|
||||
}
|
||||
.ion-icon-location{
|
||||
text-align: center;
|
||||
display: block;
|
||||
color: #000;
|
||||
font-size: 16px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.div-botton-middle{
|
||||
width: 75%;
|
||||
float: left;
|
||||
margin-top: 0.5px;
|
||||
}
|
||||
.div-botton-middle p{
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
.div-botton-right{
|
||||
width: 10%;
|
||||
float: left;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.ion-icon-attach{
|
||||
color: #666666;
|
||||
font-size: 20px;
|
||||
}
|
||||
/* TOGGLE BUTTON */
|
||||
.switch {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 90px;
|
||||
height: 34px;
|
||||
float: right;
|
||||
margin:20px 20px 0 0;
|
||||
}
|
||||
Reference in New Issue
Block a user