multiples improvements

This commit is contained in:
Tiago Kayaya
2020-12-15 19:37:42 +01:00
parent d4d08c6039
commit be03b9c0d3
21 changed files with 434 additions and 263 deletions
+3
View File
@@ -0,0 +1,3 @@
import { Animation, AnimationController } from '@ionic/angular';
/* export const enterAnimation = (base) */
+6 -6
View File
@@ -1,20 +1,20 @@
<ion-tabs>
<ion-tab-bar slot="bottom">
<ion-tab-button tab="events">
<ion-icon name="home"></ion-icon>
<!-- <ion-icon class="nav-icon" src="assets/images/icons-nav-home.svg"></ion-icon> -->
<!-- <ion-icon name="home"></ion-icon> -->
<ion-icon class="nav-icon" src="assets/images/icons-nav-home.svg"></ion-icon>
<ion-badge color="danger">{{totalEvent}}</ion-badge>
<ion-label>Início</ion-label>
</ion-tab-button>
<ion-tab-button tab="agenda">
<ion-icon name="calendar"></ion-icon>
<!-- <ion-icon class="nav-icon" src="assets/images/icons-nav-calendar.svg"></ion-icon> -->
<!-- <ion-icon name="calendar"></ion-icon> -->
<ion-icon class="nav-icon" src="assets/images/icons-nav-calendar.svg"></ion-icon>
<ion-label>Agenda</ion-label>
</ion-tab-button>
<ion-tab-button tab="gabinete-digital">
<ion-icon name="file-tray-stacked"></ion-icon>
<!-- <ion-icon class="nav-icon" src="assets/images/icons-nav-gabinete.svg"></ion-icon> -->
<!-- <ion-icon name="file-tray-stacked"></ion-icon> -->
<ion-icon class="nav-icon" src="assets/images/icons-nav-gabinete-inactive.svg"></ion-icon>
<ion-badge color="danger">{{totalExpediente}}</ion-badge>
<ion-label>Gabinete Digital</ion-label>
</ion-tab-button>
+10 -4
View File
@@ -1,6 +1,5 @@
<ion-header>
<ion-toolbar class="bg-blue">
<ion-header class="ion-no-border">
<ion-toolbar class="ion-no-border" class="bg-blue">
<div class="div-top-header">
<div class="div-search">
<ion-icon src='assets/images/icons-search.svg'></ion-icon>
@@ -12,8 +11,12 @@
<ion-icon src='assets/images/icons-profile.svg'></ion-icon>
</div>
</div>
</ion-toolbar>
</ion-toolbar>
</ion-header>
<ion-header>
<ion-toolbar class="bg-blue">
<div class="main-content">
<ion-toolbar>
<ion-buttons slot="end">
<!-- customized TOGGLE button -->
<div class="toggleBox">
@@ -38,6 +41,9 @@
Pessoal
</ion-segment-button>
</ion-segment>
</ion-toolbar>
</div>
</ion-toolbar>
</ion-header>
<ion-content>
+36 -21
View File
@@ -214,34 +214,49 @@ label{
font-size: 25px;
margin: 0 5px 0 25px;
padding: 0;
color:#ffffff;
/* color:#ffffff; */
color:#000;
float: left;
}
.div-top-header{
width: 400px;
height: 50px;
margin: 6px auto;
margin: 0 auto;
background-color: #0782c9;
overflow: auto;
padding-top: 15px;
border: 0!important;
.div-search{
font-size: 45px;
float: left;
margin: 0 0 0 10px
}
.div-logo{
background: transparent;
width: 140px;
margin: 5px 0 0px 71px;
float: left;
}
.div-logo img{
width: 100%;
}
.div-profile{
font-size: 45px;
float: right;
margin-right: 10px;
}
}
.div-search{
font-size: 45px;
float: left;
margin: 0 0 0 10px
}
.div-logo{
background: transparent;
width: 150px;
margin: 2.5px 0 2.5px 71px;
float: left;
}
.div-logo img{
width: 100%;
}
.div-profile{
font-size: 45px;
float: right;
margin-right: 10px;
.main-content{
width: 100%; /* 400px */
height: 100%;
font-family: Roboto;
margin: 0 auto;
border-top-left-radius: 25px;
border-top-right-radius: 25px;
background-color: #fff;
overflow:auto;
/* padding: 25px 20px 0 20px; */
color: #000 !important;
}
+4 -2
View File
@@ -1,5 +1,5 @@
<ion-header translucent="true">
<ion-toolbar class="bg-blue">
<ion-header class="ion-no-border">
<ion-toolbar class="ion-no-border" class="bg-blue">
<div class="div-top-header">
<div class="div-search">
<ion-icon src='assets/images/icons-search.svg'></ion-icon>
@@ -12,6 +12,8 @@
</div>
</div>
</ion-toolbar>
</ion-header>
<ion-header translucent="true">
<ion-toolbar class="bg-blue">
<ion-buttons slot="end">
<div class="toggleBox">
+23 -20
View File
@@ -21,28 +21,31 @@ ion-toolbar{
}
.div-top-header{
width: 400px;
margin: 6px auto;
margin: 0 auto;
background-color: #0782c9;
overflow: auto;
}
.div-search{
font-size: 45px;
float: left;
margin: 0 0 0 10px
}
.div-logo{
background: transparent;
width: 150px;
margin: 2.5px 0 2.5px 71px;
float: left;
}
.div-logo img{
width: 100%;
}
.div-profile{
font-size: 45px;
float: right;
margin-right: 10px;
padding-top: 15px;
border: 0!important;
.div-search{
font-size: 45px;
float: left;
margin: 0 0 0 10px
}
.div-logo{
background: transparent;
width: 140px;
margin: 5px 0 0px 71px;
float: left;
}
.div-logo img{
width: 100%;
}
.div-profile{
font-size: 45px;
float: right;
margin-right: 10px;
}
}
.ion-text-header-top p{
--background: transparent;
@@ -1,5 +1,5 @@
<ion-header>
<ion-toolbar class="bg-blue">
<ion-header class="ion-no-border">
<ion-toolbar class="ion-no-border" class="bg-blue">
<div class="div-top-header">
<div class="div-search">
<ion-icon src='assets/images/icons-search.svg'></ion-icon>
@@ -11,20 +11,24 @@
<ion-icon src='assets/images/icons-profile.svg'></ion-icon>
</div>
</div>
</ion-toolbar>
<ion-toolbar class="bg-blue">
<ion-title class="header-title">Gabinete Digital</ion-title>
</ion-toolbar>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
<ion-refresher-content>
</ion-refresher-content>
</ion-refresher>
<div class="expedient-content">
<div class="main-content">
<div class="title-content">
<div class="div-title">
<ion-label class="title">Gabinete Digital</ion-label>
</div>
<div class="div-icon">
<ion-icon slot="end" src='assets/images/icons-add.svg'></ion-icon>
</div>
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
<ion-refresher-content>
</ion-refresher-content>
</ion-refresher>
</div>
<div class="exp-card" (click)="openEventsToApproveList('MDGPR')">
<div class="exp-card-icon">
<ion-icon src="assets/images/icons-agenda.svg"></ion-icon>
@@ -1,11 +1,13 @@
ion-content{
--padding-top:15px;
--padding-end:15px;
--padding-start:15px;
--padding-bottom:15px;
--background:#ecf8ff;
/* --padding-top:15px; */
/* --padding-end:15px;
--padding-start:15px; */
/* --padding-bottom:15px; */
/* --background:#ecf8ff; */
--background: transparent;
}
:host{
background: #0782c9;
ion-card-title{
text-align: center;
}
@@ -34,10 +36,66 @@ ion-label{
margin-bottom: 10px;
border-radius: 5px;
}
.div-top-header{
width: 400px;
margin: 0 auto;
background-color: #0782c9;
overflow: auto;
padding-top: 15px;
border: 0!important;
.div-search{
font-size: 45px;
float: left;
margin: 0 0 0 10px
}
.div-logo{
background: transparent;
width: 140px;
margin: 5px 0 0px 71px;
float: left;
}
.div-logo img{
width: 100%;
}
.div-profile{
font-size: 45px;
float: right;
margin-right: 10px;
}
}
/* NEW CSS */
.expedient-content{
width: 100%;
.main-content{
width: 100%; /* 400px */
height: 100%;
font-family: Roboto;
margin: 0 auto;
border-top-left-radius: 25px;
border-top-right-radius: 25px;
background:#ecf8ff;;
overflow:auto;
padding: 25px 15px 15px 15px;
}
.title-content{
width: 360px;
height: auto;
margin: 0 auto;
overflow: hidden;
padding: 0 !important;
background: transparent;
}
.div-title{
padding: 0!important;
float: left;
}
.title{
font-size: 25px;
}
.div-icon{
width: 40px;
float: right;
font-size: 35px;
overflow: auto;
}
.exp-card{
@@ -97,29 +155,3 @@ ion-label{
}
.div-top-header{
width: 400px;
height: 50px;
margin: 6px auto;
background-color: #0782c9;
overflow: auto;
}
.div-search{
font-size: 45px;
float: left;
margin: 0 0 0 10px
}
.div-logo{
background: transparent;
width: 150px;
margin: 2.5px 0 2.5px 71px;
float: left;
}
.div-logo img{
width: 100%;
}
.div-profile{
font-size: 45px;
float: right;
margin-right: 10px;
}
@@ -40,7 +40,7 @@
<ion-label class="attached-title">Fotografia Anexada</ion-label>
<ion-item lines="none">
<ion-thumbnail slot="start">
<ion-img [(ngModel)]="pub.FileBase64" name="image" ngDefaultControl [src]="'data:image/png;base64,'+capturedImage"></ion-img>
<ion-img [(ngModel)]="capturedImage" name="image" ngDefaultControl [src]="'data:image/png;base64,'+capturedImage"></ion-img>
</ion-thumbnail>
<!-- <ion-thumbnail *ngIf="!publication" slot="start">
<ion-img [(ngModel)]="publication.imageUrl" [src]="guestPicture"></ion-img>
@@ -58,18 +58,18 @@
</div>
<div class="ion-item-container-no-border">
<ion-label>
<ion-label (click)="takePicture()">
<div class="attach-icon">
<ion-icon src="assets/images/icons-add-photo.svg"></ion-icon>
</div>
<div class="attach-document">
<ion-label (click)="takePictureCodova()">Tirar Fotografia</ion-label>
<ion-label>Tirar Fotografia</ion-label>
</div>
</ion-label>
</div>
<div hidden class="ion-item-container-no-border">
<ion-label (click)="takePictureCodova()">
<div class="ion-item-container-no-border">
<ion-label (click)="getPicture()">
<div class="attach-icon">
<ion-icon src="assets/images/icons-add-photos.svg"></ion-icon>
</div>
@@ -14,6 +14,9 @@ import { AlertService } from 'src/app/services/alert.service';
/* const { Camera } = Plugins; */
import { Camera, CameraOptions } from '@ionic-native/camera/ngx';
import { PublicationFolder } from 'src/app/models/publicationfolder';
import { ViewPublicationsPage } from '../view-publications/view-publications.page';
import { LoadingService } from 'src/app/services/loading.service';
@Component({
selector: 'app-new-publication',
@@ -21,6 +24,7 @@ import { Camera, CameraOptions } from '@ionic-native/camera/ngx';
styleUrls: ['./new-publication.page.scss'],
})
export class NewPublicationPage implements OnInit {
showLoader: boolean;
publication: Publication;
pub: Publication = new Publication();
folderId: string;
@@ -45,9 +49,6 @@ export class NewPublicationPage implements OnInit {
private modalController: ModalController,
public photoService: PhotoService,
private navParams: NavParams,
private alertService: AlertService,
/* private camera: Camera, */
private sanitizer: DomSanitizer,
private publications: PublicationsService,
private camera: Camera,
) {
@@ -59,14 +60,16 @@ export class NewPublicationPage implements OnInit {
ngOnInit() {
this.setTitle();
this.clear();
this.takePicture();
}
takePictureCodova(){
takePicture(){
const options: CameraOptions = {
quality: 100,
destinationType: this.camera.DestinationType.DATA_URL,
encodingType: this.camera.EncodingType.JPEG,
mediaType: this.camera.MediaType.PICTURE
mediaType: this.camera.MediaType.PICTURE,
targetWidth: 720,
targetHeight: 720,
}
this.camera.getPicture(options).then((imageData) => {
@@ -74,42 +77,34 @@ export class NewPublicationPage implements OnInit {
// If it's base64 (DATA_URL):
let base64Image = 'data:image/jpeg;base64,' + imageData;
this.capturedImage = imageData;
this.capturedImageTitle = new Date().getTime();
this.capturedImageTitle = new Date().getTime() + '.jpeg';
}, (err) => {
// Handle error
console.log(err);
});
}
/* takePictureCapacitor() {
this.photoService.addNewToGallery();
this.pub.FileBase64 = this.photoService.photos[0].webviewPath;
console.log(this.pub.FileBase64);
} */
/* async takePictures() {
try {
const profilePicture = await Camera.getPhoto({
quality: 90,
allowEditing: false,
resultType: CameraResultType.Base64,
}).then(res =>{
console.log(res);
});
console.log(profilePicture);
this.guestPicture = "data:image/jpg;base64," + profilePicture.base64String;
} catch (error) {
console.error(error);
getPicture(){
const options: CameraOptions = {
quality: 100,
sourceType: this.camera.PictureSourceType.PHOTOLIBRARY,
destinationType: this.camera.DestinationType.DATA_URL,
encodingType: this.camera.EncodingType.JPEG,
mediaType: this.camera.MediaType.PICTURE,
targetWidth: 720,
targetHeight: 720,
}
} */
this.camera.getPicture(options).then((imageData) => {
// imageData is either a base64 encoded string or a file URI
// If it's base64 (DATA_URL):
let base64Image = 'data:image/jpeg;base64,' + imageData;
this.capturedImage = imageData;
this.capturedImageTitle = new Date().getTime() + '.jpeg';
}, (err) => {
console.log(err);
});
}
async save(){
console.log(this.pub.FileBase64);
if(this.publicationType == '3'){
if(this.capturedImage != ''){
this.publication = {
@@ -122,6 +117,10 @@ export class NewPublicationPage implements OnInit {
FileBase64: this.capturedImage,
FileExtension: 'jpg',
}
console.log('Edit change image');
console.log(this.publication);
this.publications.UpdatePublication(this.publication.ProcessId, this.publication);
this.close();
}
else{
this.publication = {
@@ -134,12 +133,11 @@ export class NewPublicationPage implements OnInit {
FileBase64: this.publication.FileBase64,
FileExtension: 'jpg',
}
console.log('Edit - keep image');
console.log(this.publication);
this.publications.UpdatePublication(this.publication.ProcessId, this.publication);
this.close();
}
console.log('Edit');
console.log(this.publication);
this.publications.UpdatePublication(this.publication.ProcessId, this.publication);
this.close();
}
else{
@@ -163,7 +161,9 @@ export class NewPublicationPage implements OnInit {
close(){
this.modalController.dismiss();
this.modalController.dismiss().then(()=>{
this.showLoader=true;
});
}
clear(){
this.capturedImage = '';
@@ -204,29 +204,5 @@ export class NewPublicationPage implements OnInit {
this.photo = this.sanitizer.bypassSecurityTrustResourceUrl(image && (image.dataUrl));
} */
openCamera(){
/* this.camera.getPicture({
sourceType: this.camera.PictureSourceType.CAMERA,
destinationType: this.camera.DestinationType.FILE_URI,
}).then((res)=>{
this.imgUrl = res;
}).catch(e=>{
console.log(e);
});
console.log('camera'); */
}
getGallery(){
/* this.camera.getPicture({
sourceType: this.camera.PictureSourceType.PHOTOLIBRARY,
destinationType: this.camera.DestinationType.DATA_URL,
}).then((res)=>{
this.imgUrl = 'data:image/jpeg;base64,' + res;
}).catch(e=>{
console.log(e);
}); */
}
Add
}
@@ -1,5 +1,5 @@
<ion-header class="ion-no-border">
<ion-toolbar class="ion-no-border" class="bg-blue">
<ion-toolbar class="bg-blue">
<div class="div-top-header">
<div class="div-search">
<ion-icon src='assets/images/icons-search.svg'></ion-icon>
@@ -13,23 +13,30 @@
</div>
</ion-toolbar>
</ion-header>
<ion-header class="ion-no-border">
<ion-toolbar class="bg-blue">
<div class="main-header">
<div class="title-content">
<div class="div-title">
<ion-label class="title">Ações Presidenciais</ion-label>
</div>
<div class="div-icon">
<ion-icon (click)="AddPublicationFolder()" slot="end" src='assets/images/icons-add.svg'></ion-icon>
</div>
</div>
</div>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
<ion-refresher-content>
</ion-refresher-content>
</ion-refresher>
<ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
<ion-refresher-content>
</ion-refresher-content>
</ion-refresher>
<div class="main-content">
<div class="title-content">
<div class="div-title">
<ion-label class="title">Ações Presidenciais</ion-label>
</div>
<div class="div-icon">
<ion-icon (click)="AddPublicationFolder()" slot="end" src='assets/images/icons-add.svg'></ion-icon>
</div>
</div>
<!-- [routerLink]="['/home/publications/view-publications', folder.ProcessId]" -->
<div class="item"
*ngFor="let viagem of publicationsTravelFolderList"
@@ -5,8 +5,11 @@ ion-content{
--background: transparent;
}
ion-toolbar{
background: transparent;
border-width: 0 !important;
--padding-top: 0px !important;
--padding-start: 0px !important;
--padding-right: 0px !important;
--padding-end: 0px !important;
}
.div-top-header{
width: 400px;
@@ -15,40 +18,52 @@ ion-toolbar{
overflow: auto;
padding-top: 15px;
border: 0!important;
.div-search{
font-size: 45px;
float: left;
margin: 0 0 0 10px
}
.div-logo{
background: transparent;
width: 140px;
margin: 5px 0 0px 71px;
float: left;
}
.div-logo img{
width: 100%;
}
.div-profile{
font-size: 45px;
float: right;
margin-right: 10px;
}
}
.div-search{
font-size: 45px;
float: left;
margin: 0 0 0 10px
}
.div-logo{
background: transparent;
width: 140px;
margin: 5px 0 0px 71px;
float: left;
}
.div-logo img{
width: 100%;
}
.div-profile{
font-size: 45px;
float: right;
margin-right: 10px;
}
ion-content{
--background:#0782c9;
--border: none;
}
.main-header{
width: 100%; /* 400px */
height: 100%;
font-family: Roboto;
border-top-left-radius: 25px;
border-top-right-radius: 25px;
background-color: #fff;
overflow:hidden;
padding: 30px 20px 0px 20px;
color:#000;
transform: translate3d(0, 5px, 0);
}
.main-content{
width: 100%; /* 400px */
height: 100%;
font-family: Roboto;
margin: 0 auto;
border-top-left-radius: 25px;
border-top-right-radius: 25px;
background-color: #fff;
overflow:auto;
padding: 25px 20px 0 20px;
padding: 15px 20px 0 20px;
}
.title-content{
width: 360px;
@@ -7,6 +7,11 @@ import { PublicationsService } from 'src/app/services/publications.service';
import { NewActionPage } from './new-action/new-action.page';
import { ViewPublicationsPage } from './view-publications/view-publications.page';
import { Animation, AnimationController } from '@ionic/angular';
import { LoadingController } from '@ionic/angular';
import { LoadingService } from 'src/app/services/loading.service';
@Component({
selector: 'app-publications',
templateUrl: './publications.page.html',
@@ -31,6 +36,8 @@ export class PublicationsPage implements OnInit {
constructor(
private router: Router,
private modalController: ModalController,
private animationController: AnimationController,
private loading: LoadingService,
private publications: PublicationsService,
) {
this.months = ["Janeiro", "Fevereiro", "Março", "Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro"];
@@ -53,6 +60,7 @@ export class PublicationsPage implements OnInit {
}
getActions(){
this.showLoader = true;
this.publications.GetPublicationFolderList().subscribe(res=>{
this.publicationFolderList = res;
console.log(res);
@@ -76,6 +84,7 @@ export class PublicationsPage implements OnInit {
this.publicationsTravelFolderList.push(folder);
}
});
this.showLoader = false;
});
}
@@ -89,13 +98,43 @@ export class PublicationsPage implements OnInit {
backdropDismiss: false
});
await modal.present();
modal.onDidDismiss();
modal.onDidDismiss().then(()=>{
this.doRefresh(event);
});
}
async viewPublications(folder: PublicationFolder) {
/* const enterAnimation = (baseEl: any) => {
const backdropAnimation = this.animationController.create()
.addElement(baseEl.querySelector('ion-backdrop')!)
.fromTo('opacity', '0.01', 'var(--backdrop-opacity)');
const wrapperAnimation = this.animationController.create()
.addElement(baseEl.querySelector('.modal-wrapper')!)
.keyframes([
{ offset: 0, opacity: '0', transform: 'scale(0)' },
{ offset: 1, opacity: '0.99', transform: 'scale(1)' }
]);
return this.animationController.create()
.addElement(baseEl)
.easing('ease-out')
.duration(500)
.addAnimation([backdropAnimation, wrapperAnimation]);
}
const leaveAnimation = (baseEl: any) => {
return enterAnimation(baseEl).direction('reverse');
}
*/
/* let item = this.publicationFolderList; */
const modal = await this.modalController.create({
component: ViewPublicationsPage,
/* enterAnimation,
leaveAnimation, */
componentProps:{
item:folder,
},
@@ -56,7 +56,7 @@
background: #ffffff;
height: 100%;
box-shadow: 0px 0px 18px rgba(0, 0, 0, 0.6);
padding: 25px 20px 0 20px;
padding: 25px 0px 0 0px;
overflow: auto;
}
.title-content{
@@ -81,8 +81,8 @@
font-size: 25px;
}
.post-img{
width: 360px;
height: 200px;
width: 100%;
height: 400px;
margin: 0 auto;
border-radius: 0px!important;
overflow: hidden;
@@ -91,4 +91,9 @@
width: 100%;
height: 100%;
object-fit: cover;
}
.post-description{
width: 360px;
margin: 0 auto;
margin-bottom: 35px;
}
@@ -37,25 +37,21 @@ export class PublicationDetailPage implements OnInit {
}
ngOnInit() {
console.log(this.publication.FileBase64);
/* console.log(this.publication.FileBase64); */
this.getPublicationDetail();
}
getPublicationDetail(){
console.log(this.publicationId);
console.log(this.folderId);
this.publications.GetPublicationById(this.folderId,this.publicationId).subscribe(res=>{
let itemImage = {
title: 'Title',
url: "data:image/jpg;base64," + res.FileBase64,
format: 'png'
}
console.log(res);
this.publication = {
DocumentId: res.DocumentId,
ProcessId:res.ProcessId,
Title:res.Title,
Message: res.Message,
DatePublication: res.DatePublication,
/* image: itemImage, */
FileBase64: "data:image/jpg;base64," + res.FileBase64,
OriginalFileName: '',
FileExtension: '',
@@ -68,11 +64,10 @@ export class PublicationDetailPage implements OnInit {
}
deletePost(){
console.log(this.folderId);
console.log(this.publicationId);
this.publications.DeletePublication(this.folderId, this.publicationId);
this.publications.DeletePublication(this.folderId, this.publicationId).then(res =>{
console.log(res);
});
this.close();
}
@@ -89,7 +84,9 @@ export class PublicationDetailPage implements OnInit {
backdropDismiss: false
});
await modal.present();
modal.onDidDismiss();
modal.onDidDismiss().then(()=>{
this.getPublicationDetail();
});
}
openPreview(imageUrl:string){
@@ -1,5 +1,5 @@
<ion-header class="ion-no-border">
<ion-toolbar class="ion-no-border">
<ion-toolbar class="bg-blue">
<div class="div-top-header">
<div class="div-search">
<ion-icon src='assets/images/icons-search.svg'></ion-icon>
@@ -12,17 +12,12 @@
</div>
</div>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
<ion-refresher-content>
</ion-refresher-content>
</ion-refresher>
<ion-header class="ion-no-border">
<ion-toolbar class="bg-blue">
<div class="content-top"></div>
<div class="content-container">
<div class="main-header">
<div class="title-content">
<div class="back-icon">
<ion-icon (click)="close()" slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
@@ -33,10 +28,21 @@
<p class="item-content-date">{{item.DateBegin}}</p>
</div>
<div class="actions-icon">
<ion-icon (click)="AddPublication('1',item.ProcessId)" slot="end" src='assets/images/icons-add-photo.svg'></ion-icon>
<!-- <ion-icon (click)="AddPublication('1',item.ProcessId)" slot="end" src='assets/images/icons-add-photo.svg'></ion-icon> -->
<ion-icon (click)="AddPublication('2',item.ProcessId)" slot="end" src='assets/images/icons-add.svg'></ion-icon>
</div>
</div>
</div>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-refresher name="refresher" slot="fixed" (ionRefresh)="doRefresh($event)">
<ion-progress-bar type="indeterminate" *ngIf="showLoader"></ion-progress-bar>
<ion-refresher-content>
</ion-refresher-content>
</ion-refresher>
<div class="main-container">
<ion-list>
<!-- [routerLink]="['/home/publications/view-publications/publication-detail', publication.publicationId]" -->
<div class="post-item"
@@ -1,5 +1,6 @@
:host{
background: #0782c9;
background: transparent;
padding: 0!important;
}
ion-content{
--background: transparent;
@@ -7,8 +8,13 @@
--border-radius: 30px;
}
ion-toolbar{
--background:#0782c9;
border-width: 0 !important;
--border-width: 0 !important;
--border-style: none;
--padding-top: 0px !important;
--padding-start: 0px !important;
--padding-right: 0px !important;
--padding-end: 0px !important;
}
.div-top-header{
@@ -38,6 +44,27 @@
float: right;
margin-right: 10px;
}
.main-header{
width: 100%; /* 400px */
height: 100%;
font-family: Roboto;
border-top-left-radius: 25px;
border-top-right-radius: 25px;
background-color: #fff;
overflow:hidden;
padding: 25px 20px 0px 20px;
color:#000;
}
.main-content{
width: 100%; /* 400px */
height: 100%;
font-family: Roboto;
margin: 0 auto;
background-color: #fff;
overflow:auto;
padding: 15px 20px 0 20px;
}
.content-top{
width: 344px;
background: #f3f2f2;
@@ -45,6 +72,7 @@
margin: 0 auto;
border-top-left-radius: 25px;
border-top-right-radius: 25px;
transform: translate3d(0, 1px, 0);
}
.content-container{
width: 100%;
@@ -54,7 +82,7 @@
background: #ffffff;
height: 100%;
box-shadow: 0px 0px 18px rgba(0, 0, 0, 0.6);
padding: 25px 20px 0 20px;
padding: 25px 0px 0 0px;
overflow: auto;
}
.title-content{
@@ -63,6 +91,7 @@
overflow: auto;
padding: 0 !important;
}
.back-icon{
width: 37px;
float: left;
@@ -88,6 +117,7 @@
.actions-icon ion-icon{
margin-left: 10px;
font-size: 35px;
float: right;
}
.item-content-date{
color: #797979;
@@ -98,14 +128,15 @@
font-size: 13px;
}
.post-item{
width: 360px;
width: 100%;
overflow: auto;
margin: 0 auto;
border-radius: 0px;
padding: 0!important;
}
.post-img{
width: 360px;
height: 200px;
width: 100%;
height: 400px;
margin: 0 auto;
border-radius: 0px!important;
overflow: hidden;
@@ -118,11 +149,12 @@
.post-content{
width: 360px;
margin: 0 auto;
margin-bottom: 35px;
}
.post-title-time{
width: 100%;
overflow: auto;
margin-top: 5px;
margin-top: 10px;
}
.post-title{
width: 60%;
@@ -130,12 +162,13 @@
font-size: 15px;
color: #0d89d1;
}
.post-data{
width: 40%;
float: left;
font-size: 13px;
color: #797979;
}
.post-data{
width: 40%;
float: left;
font-size: 13px;
color: #797979;
text-align: right;
}
.post-description{
font-size: 13px;
color: #000;
@@ -2,6 +2,7 @@ import { Component, OnInit } from '@angular/core';
import { ModalController, NavParams } from '@ionic/angular';
import { Publication } from 'src/app/models/publication';
import { PublicationFolder } from 'src/app/models/publicationfolder';
import { LoadingService } from 'src/app/services/loading.service';
import { PublicationsService } from 'src/app/services/publications.service';
import { NewPublicationPage } from '../new-publication/new-publication.page';
import { PublicationDetailPage } from './publication-detail/publication-detail.page';
@@ -13,11 +14,13 @@ import { PublicationDetailPage } from './publication-detail/publication-detail.p
})
export class ViewPublicationsPage implements OnInit {
showLoader: boolean;
loading: any;
publicationList: Publication[];
item: PublicationFolder;
constructor(
private loadingController: LoadingService,
private modalController: ModalController,
private publications: PublicationsService,
private navParams: NavParams,
@@ -27,20 +30,19 @@ export class ViewPublicationsPage implements OnInit {
ngOnInit() {
this.getPublications()
/* console.log(this.item); */
}
doRefresh(event) {
this.getPublications()
this.getPublications();
setTimeout(() => {
event.target.complete();
/* event.target.complete(); */
}, 2000);
}
close(){
this.modalController.dismiss();
}
getPublications(){
/* console.log(this.item.ProcessId); */
this.showLoader = true;
this.publications.GetPublications(this.item.ProcessId).subscribe(res=>{
this.publicationList = new Array();
@@ -65,7 +67,9 @@ export class ViewPublicationsPage implements OnInit {
this.publicationList.push(item);
});
console.log(this.publicationList);
this.showLoader = false;
});
}
async AddPublication(publicationType:any, folderId:string) {
@@ -79,7 +83,9 @@ export class ViewPublicationsPage implements OnInit {
backdropDismiss: false
});
await modal.present();
modal.onDidDismiss();
modal.onDidDismiss().then(()=>{
this.doRefresh(event);
});
}
async viewPublicationDetail(processId:string, publicationId:string) {
@@ -93,7 +99,9 @@ export class ViewPublicationsPage implements OnInit {
backdropDismiss: false
});
await modal.present();
modal.onDidDismiss();
modal.onDidDismiss().then(()=>{
this.doRefresh(event);
});
}
}
+5 -6
View File
@@ -5,18 +5,17 @@ import { LoadingController } from '@ionic/angular';
providedIn: 'root'
})
export class LoadingService {
loading:any;
constructor(public loadingController: LoadingController) { }
async simpleLoading(message:string) {
const loading = await this.loadingController.create({
async simpleLoading() {
this.loading = await this.loadingController.create({
cssClass: 'my-custom-class',
message:message,
message:'A carregar!...',
duration: 2000
});
await loading.present();
const { role, data } = await loading.onDidDismiss();
await this.loading.present();
}
async customizedLoading() {
+1 -3
View File
@@ -139,9 +139,7 @@ export class PublicationsService {
headers: this.headers,
/* params: params */
};
return this.http.delete(`${geturl}`, options).toPromise().then(res =>{
console.log(res);
});
return this.http.delete(`${geturl}`, options).toPromise();
}
@@ -0,0 +1,23 @@
<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40">
<defs>
<filter id="zmg57upsha">
<feColorMatrix in="SourceGraphic" values="0 0 0 0 0.476308 0 0 0 0 0.476308 0 0 0 0 0.476308 0 0 0 1.000000 0"/>
</filter>
</defs>
<g fill="none" fill-rule="evenodd">
<g>
<g>
<g>
<g>
<path stroke="#797979" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M26 31H8V13h25v18m0 0h-7M26 9L26 13 15 13 15 9 23 9z" transform="translate(-180 -740) translate(0 740) translate(164) translate(16)"/>
<g filter="url(#zmg57upsha)" transform="translate(-180 -740) translate(0 740) translate(164) translate(16)">
<g>
<path stroke="#061B52" d="M.5 15.5L22.5.5M2.5 17.5L24.5 2.5" transform="translate(8 13)"/>
</g>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB