mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-18 20:47:54 +00:00
Merge branch 'feature/calendar' into feature/chat
This commit is contained in:
tiago.kayaya
@@ -13,9 +13,9 @@
|
||||
<div class="d-flex height-100">
|
||||
|
||||
<!-- -->
|
||||
<div class="d-flex aside-wrapper flex-column pt-25 justify-center max-width-md-40 width-40">
|
||||
<div class="d-flex aside-wrapper flex-column pt-25 justify-center width-md-40 ">
|
||||
<p class="text-center mt-0 aside-title px-20">Gabinete Digital</p>
|
||||
<div class="aside overflow-y-auto d-flex flex-wrap justify-center width-100">
|
||||
<div class="aside overflow-y-auto d-flex d-md-block flex-wrap justify-center width-100 px-20">
|
||||
<div class="exp-card d-flex flex-column justify-center" (click)="openEventsToApproveList('MDGPR')">
|
||||
<div class="d-flex justify-center">
|
||||
<ion-icon src="assets/images/icons-agenda.svg"></ion-icon>
|
||||
@@ -23,7 +23,7 @@
|
||||
<p class="text-center exp-card-title ">Eventos para Aprovação</p>
|
||||
<p class="text-center exp-card-content">{{count_ev_md+count_ev_pr}} <span class="title1">Documentos</span></p>
|
||||
</div>
|
||||
<div class="exp-card d-flex flex-column justify-center width-md-100" (click)="openExpedientList()">
|
||||
<div class="exp-card d-flex flex-column justify-center" (click)="openExpedientList()">
|
||||
<div class="d-flex justify-center">
|
||||
<ion-icon src="assets/images/icons-correspondencia.svg"></ion-icon>
|
||||
</div>
|
||||
|
||||
@@ -82,7 +82,6 @@ ion-content{
|
||||
}
|
||||
}
|
||||
.title-content{
|
||||
width: 360px;
|
||||
height: auto;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
@@ -162,9 +161,6 @@ ion-content{
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
.aside{
|
||||
width: 340px;
|
||||
}
|
||||
.aside-content{
|
||||
display: flex !important;
|
||||
background-color: white;
|
||||
@@ -174,7 +170,7 @@ ion-content{
|
||||
.exp-card{
|
||||
margin: 5px auto;
|
||||
flex-direction: row !important;
|
||||
width: 300px;
|
||||
width: 100%;
|
||||
padding-right: 11px;
|
||||
padding-bottom: 5px;
|
||||
padding-top: 5px;
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
import { PublicationDetailPage } from './publication-detail.page';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: PublicationDetailPage
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class PublicationDetailPageRoutingModule {}
|
||||
@@ -0,0 +1,20 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { PublicationDetailPageRoutingModule } from './publication-detail-routing.module';
|
||||
|
||||
import { PublicationDetailPage } from './publication-detail.page';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
IonicModule,
|
||||
PublicationDetailPageRoutingModule
|
||||
],
|
||||
declarations: [PublicationDetailPage]
|
||||
})
|
||||
export class PublicationDetailPageModule {}
|
||||
@@ -0,0 +1,84 @@
|
||||
<ion-header class="ion-no-border">
|
||||
<ion-toolbar class="ion-no-border bg-blue">
|
||||
<div class="div-top-header">
|
||||
<div class="div-search">
|
||||
<ion-icon src='assets/images/icons-search.svg'></ion-icon>
|
||||
</div>
|
||||
<div class="div-logo">
|
||||
<img src='assets/images/logo-no-bg.png' alt='logo'>
|
||||
</div>
|
||||
<div class="div-profile">
|
||||
<ion-icon src='assets/images/icons-profile.svg'></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
</ion-toolbar>
|
||||
|
||||
</ion-header>
|
||||
<ion-content>
|
||||
<div class="content-top"></div>
|
||||
<div class="content-container">
|
||||
<div *ngIf="publication.Title != ''">
|
||||
<div class="title-content">
|
||||
<div class="back-icon">
|
||||
<ion-icon (click)="close()" slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
|
||||
</div>
|
||||
<div class="div-title">
|
||||
<ion-label class="title"> {{publication.Title}}</ion-label>
|
||||
<p class="post-data">{{publication.DatePublication | date: 'dd-MM-yy | h:mm'}}</p>
|
||||
</div>
|
||||
</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 class="post-item">
|
||||
<div *ngIf="publication.FileBase64.length > 30" class="post-img">
|
||||
<img src="{{publication.FileBase64}}" alt="image" tappable (click)="openPreview(publication.FileBase64)">
|
||||
</div>
|
||||
<div *ngIf="publication.FileBase64.length < 30" class="post-img">
|
||||
<img src="/assets/icon/icon-no-image.svg" alt="image">
|
||||
</div>
|
||||
<div class="post-description">
|
||||
<p>{{publication.Message}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="publication.Title == ''">
|
||||
<div class="title-content">
|
||||
<div class="back-icon">
|
||||
<ion-icon (click)="close()" slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
|
||||
</div>
|
||||
<div class="div-title">
|
||||
<ion-label class="title"><ion-skeleton-text animated style="width: 60%;"></ion-skeleton-text></ion-label>
|
||||
<p class="post-data"><ion-skeleton-text animated style="width: 20%;"></ion-skeleton-text></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="post-item">
|
||||
<div class="post-img">
|
||||
<img src="/assets/icon/icon-no-image.svg" alt="image">
|
||||
</div>
|
||||
<div class="post-description">
|
||||
<p><ion-skeleton-text animated></ion-skeleton-text></p>
|
||||
<p><ion-skeleton-text animated></ion-skeleton-text></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</ion-content>
|
||||
<ion-footer>
|
||||
<ion-toolbar class="footer-toolbar">
|
||||
<ion-buttons slot="start">
|
||||
<ion-button class="btn-delete" fill="clear" color="#ffe0e0" (click)="deletePost()">
|
||||
<ion-label>Eliminar</ion-label>
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
<ion-buttons slot="end">
|
||||
<ion-button class="btn-ok" fill="clear" color="#fff" (click)="editPost('3')">
|
||||
<ion-label>Editar</ion-label>
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
</ion-footer>
|
||||
|
||||
@@ -0,0 +1,99 @@
|
||||
:host{
|
||||
background: #0782c9;
|
||||
}
|
||||
ion-content{
|
||||
--background: transparent;
|
||||
transform: translate3d(0, 5px, 0);
|
||||
--border-radius: 30px;
|
||||
}
|
||||
ion-footer{
|
||||
background: #fff;
|
||||
}
|
||||
ion-toolbar{
|
||||
/* --background:#0782c9; */
|
||||
border-width: 0 !important;
|
||||
}
|
||||
.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;
|
||||
}
|
||||
.content-top{
|
||||
width: 344px;
|
||||
background: #f3f2f2;
|
||||
height: 20px;
|
||||
margin: 0 auto;
|
||||
border-top-left-radius: 25px;
|
||||
border-top-right-radius: 25px;
|
||||
}
|
||||
.content-container{
|
||||
width: 100%;
|
||||
margin:0 auto;
|
||||
border-top-left-radius: 25px;
|
||||
border-top-right-radius: 25px;
|
||||
background: #ffffff;
|
||||
height: 100%;
|
||||
box-shadow: 0px 0px 18px rgba(0, 0, 0, 0.6);
|
||||
padding: 25px 0px 0 0px;
|
||||
overflow: auto;
|
||||
}
|
||||
.title-content{
|
||||
width: 360px;
|
||||
margin: 0px auto;
|
||||
overflow: auto;
|
||||
padding: 0 !important;
|
||||
}
|
||||
.back-icon{
|
||||
width: auto;
|
||||
float: left;
|
||||
font-size: 35px;
|
||||
overflow: auto;
|
||||
}
|
||||
.div-title{
|
||||
width: 270px;
|
||||
/* padding: 0!important; */
|
||||
float: left;
|
||||
margin: 2.5px 0 0 5px;
|
||||
}
|
||||
.title{
|
||||
font-size: 25px;
|
||||
}
|
||||
.post-img{
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
margin: 0 auto;
|
||||
border-radius: 0px!important;
|
||||
overflow: hidden;
|
||||
}
|
||||
.post-img img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
.post-description{
|
||||
width: 360px;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { PublicationDetailPage } from './publication-detail.page';
|
||||
|
||||
describe('PublicationDetailPage', () => {
|
||||
let component: PublicationDetailPage;
|
||||
let fixture: ComponentFixture<PublicationDetailPage>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ PublicationDetailPage ],
|
||||
imports: [IonicModule.forRoot()]
|
||||
}).compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(PublicationDetailPage);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
}));
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,115 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { ModalController, NavParams } from '@ionic/angular';
|
||||
import { Publication } from 'src/app/models/publication';
|
||||
import { PublicationsService } from 'src/app/services/publications.service';
|
||||
import { ImageModalPage } from '../gallery/image-modal/image-modal.page';
|
||||
import { NewPublicationPage } from '../new-publication/new-publication.page';
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-publication-detail',
|
||||
templateUrl: './publication-detail.page.html',
|
||||
styleUrls: ['./publication-detail.page.scss'],
|
||||
})
|
||||
export class PublicationDetailPage implements OnInit {
|
||||
showLoader: boolean;
|
||||
publicationId: string;
|
||||
folderId: string;
|
||||
publication: Publication;
|
||||
|
||||
constructor(
|
||||
private modalController: ModalController,
|
||||
private navParams:NavParams,
|
||||
private publications:PublicationsService,
|
||||
) {
|
||||
this.publicationId = this.navParams.get('publicationId');
|
||||
/* this.folderId = this.navParams.get('folderIdId'); */
|
||||
this.publication = {
|
||||
DateIndex: null,
|
||||
DocumentId: '',
|
||||
ProcessId:'',
|
||||
Title:'',
|
||||
Message: '',
|
||||
/* image: null, */
|
||||
DatePublication: null,
|
||||
FileBase64: '',
|
||||
OriginalFileName: '',
|
||||
FileExtension: '',
|
||||
};
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
/* console.log(this.publication.FileBase64); */
|
||||
this.getPublicationDetail();
|
||||
}
|
||||
doRefresh(event) {
|
||||
this.getPublicationDetail();
|
||||
|
||||
setTimeout(() => {
|
||||
event.target.complete();
|
||||
}, 2000);
|
||||
}
|
||||
|
||||
getPublicationDetail(){
|
||||
this.showLoader = true;
|
||||
console.log(this.publicationId);
|
||||
/* console.log(this.folderId); */
|
||||
this.publications.GetPublicationById(this.publicationId).subscribe(res=>{
|
||||
console.log(res);
|
||||
/* this.publication = res; */
|
||||
this.publication = {
|
||||
DateIndex: res.DateIndex,
|
||||
DocumentId: res.DocumentId,
|
||||
ProcessId:res.ProcessId,
|
||||
Title:res.Title,
|
||||
Message: res.Message,
|
||||
DatePublication: res.DatePublication,
|
||||
FileBase64: "data:image/jpg;base64," + res.FileBase64,
|
||||
OriginalFileName: res.OriginalFileName,
|
||||
FileExtension: 'jpeg',
|
||||
}
|
||||
this.showLoader = false;
|
||||
});
|
||||
}
|
||||
|
||||
close(){
|
||||
this.modalController.dismiss();
|
||||
}
|
||||
|
||||
deletePost(){
|
||||
this.publications.DeletePublication(this.folderId, this.publicationId).then(res =>{
|
||||
console.log(res);
|
||||
|
||||
});
|
||||
this.close();
|
||||
}
|
||||
|
||||
async editPost(publicationType:any) {
|
||||
console.log(this.publication);
|
||||
const modal = await this.modalController.create({
|
||||
component: NewPublicationPage,
|
||||
componentProps:{
|
||||
publicationType: publicationType,
|
||||
publication: this.publication,
|
||||
},
|
||||
cssClass: 'new-publication',
|
||||
backdropDismiss: false
|
||||
});
|
||||
await modal.present();
|
||||
modal.onDidDismiss().then(()=>{
|
||||
setTimeout(() => {
|
||||
this.getPublicationDetail();
|
||||
}, 5000);
|
||||
});
|
||||
}
|
||||
|
||||
openPreview(imageUrl:string){
|
||||
this.modalController.create({
|
||||
component: ImageModalPage,
|
||||
componentProps: {
|
||||
imageUrl:imageUrl,
|
||||
}
|
||||
}).then(modal => modal.present());
|
||||
}
|
||||
|
||||
}
|
||||
@@ -8,6 +8,8 @@ import { PublicationsPageRoutingModule } from './publications-routing.module';
|
||||
|
||||
import { PublicationsPage } from './publications.page';
|
||||
import { SharedModule } from 'src/app/shared/shared.module';
|
||||
import { ViewPublicationsPage } from 'src/app/shared/publication/view-publications/view-publications.page';
|
||||
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
@@ -17,6 +19,9 @@ import { SharedModule } from 'src/app/shared/shared.module';
|
||||
SharedModule,
|
||||
PublicationsPageRoutingModule
|
||||
],
|
||||
declarations: [PublicationsPage]
|
||||
declarations: [
|
||||
PublicationsPage,
|
||||
ViewPublicationsPage
|
||||
]
|
||||
})
|
||||
export class PublicationsPageModule {}
|
||||
|
||||
@@ -10,11 +10,12 @@
|
||||
</ion-refresher>
|
||||
|
||||
<!-- Main container -->
|
||||
<div class="d-flex height-100">
|
||||
<div class="d-flex height-100 background-white overflow-hidden border-t-radius ">
|
||||
<!-- Left -->
|
||||
<div class="d-flex flex-grow-1 flex-column aside max-width-md-40">
|
||||
<!-- Header -->
|
||||
<ion-toolbar class="bg-blue">
|
||||
<div class="main-header">
|
||||
<ion-toolbar >
|
||||
<div class="main-header pt-25">
|
||||
<div class="title-content">
|
||||
<div class="div-title">
|
||||
<ion-label class="title">Ações Presidenciais</ion-label>
|
||||
@@ -60,22 +61,17 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-none d-md-flex flex-grow-1 flex-column">
|
||||
<!-- Header -->
|
||||
<ion-toolbar class="bg-blue">
|
||||
<div class="main-header">
|
||||
<div class="title-content">
|
||||
<div class="div-title">
|
||||
<ion-label class="title">Header</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ion-toolbar>
|
||||
<!-- Content -->
|
||||
|
||||
<div class="main-content overflow-auto-y">
|
||||
123
|
||||
</div>
|
||||
<!-- Right -->
|
||||
<div class="d-none d-md-flex flex-grow-1 flex-column max-width-60">
|
||||
<!-- <app-view-publications></app-view-publications> -->
|
||||
|
||||
<app-view-publications
|
||||
*ngIf="desktopComponent.showViewPublication"
|
||||
[folderId]="folderId"
|
||||
class="height-100 d-flex flex-column overflow-hidden"
|
||||
>
|
||||
</app-view-publications>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -31,6 +31,13 @@ export class PublicationsPage implements OnInit {
|
||||
months: string[];
|
||||
days:string[];
|
||||
|
||||
|
||||
desktopComponent: any = {
|
||||
showViewPublication: false,
|
||||
}
|
||||
|
||||
folderId: string;
|
||||
|
||||
constructor(
|
||||
private router: Router,
|
||||
private modalController: ModalController,
|
||||
@@ -130,19 +137,31 @@ export class PublicationsPage implements OnInit {
|
||||
}
|
||||
|
||||
|
||||
/* let item = this.publicationFolderList; */
|
||||
const modal = await this.modalController.create({
|
||||
component: ViewPublicationsPage,
|
||||
enterAnimation,
|
||||
leaveAnimation,
|
||||
componentProps:{
|
||||
folderId:folderId,
|
||||
},
|
||||
cssClass: 'new-action',
|
||||
backdropDismiss: false
|
||||
});
|
||||
await modal.present();
|
||||
modal.onDidDismiss();
|
||||
|
||||
// OpenModal
|
||||
if( window.innerWidth <= 1024){
|
||||
/* let item = this.publicationFolderList; */
|
||||
const modal = await this.modalController.create({
|
||||
component: ViewPublicationsPage,
|
||||
enterAnimation,
|
||||
leaveAnimation,
|
||||
componentProps:{
|
||||
folderId:folderId,
|
||||
},
|
||||
cssClass: 'new-action',
|
||||
backdropDismiss: false
|
||||
});
|
||||
await modal.present();
|
||||
modal.onDidDismiss();
|
||||
|
||||
} else {
|
||||
// open angular component
|
||||
this.folderId = folderId
|
||||
this.desktopComponent.showViewPublication = true;
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -0,0 +1,12 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
import { ViewPublicationsPage } from './view-publications.page';
|
||||
|
||||
const routes: Routes = [];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class ViewPublicationsPageRoutingModule {}
|
||||
@@ -0,0 +1,20 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { ViewPublicationsPageRoutingModule } from './view-publications-routing.module';
|
||||
|
||||
import { ViewPublicationsPage } from 'src/app/pages/publications/view-publications/view-publications.page';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
IonicModule,
|
||||
ViewPublicationsPageRoutingModule
|
||||
],
|
||||
declarations: [ViewPublicationsPage]
|
||||
})
|
||||
export class ViewPublicationsPageModule {}
|
||||
@@ -0,0 +1,86 @@
|
||||
|
||||
|
||||
<ion-header class="ion-no-border">
|
||||
<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> -->
|
||||
</div>
|
||||
<div class="div-title">
|
||||
<ion-label class="title">{{item.Description}}</ion-label>
|
||||
<p class="item-content-detail">{{item.Detail}}</p>
|
||||
<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('2',item.ProcessId)" slot="end" src='assets/images/icons-add.svg'></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</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 px-20">
|
||||
<ion-list>
|
||||
<!-- [routerLink]="['/home/publications/view-publications/publication-detail', publication.publicationId]" -->
|
||||
<div class="post-item d-md-flex mb-10"
|
||||
*ngFor="let publication of publicationList"
|
||||
(click)="viewPublicationDetail(publication.DocumentId)">
|
||||
<div *ngIf="publication.FileBase64.length > 30" class="mb-10 post-img max-width-md-50">
|
||||
<img src="{{publication.FileBase64}}" alt="image">
|
||||
</div>
|
||||
<div *ngIf="publication.FileBase64.length < 30" class="mb-10 post-img">
|
||||
<img src="/assets/icon/icon-no-image.svg" alt="image">
|
||||
</div>
|
||||
<div class="post-content px-20 width-md-50">
|
||||
<div class="post-title-time">
|
||||
<div class="post-title">
|
||||
<ion-label>{{publication.Title}}</ion-label>
|
||||
</div>
|
||||
<div class="post-data">{{publication.DatePublication | date: 'dd-MM-yy | h:mm'}}</div>
|
||||
</div>
|
||||
<div class="post-description">
|
||||
<p>{{publication.Message}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="!publicationList" class="post-item">
|
||||
<div class="post-img">
|
||||
<img src="/assets/icon/icon-no-image.svg" alt="image">
|
||||
</div>
|
||||
<div class="post-content">
|
||||
<div class="post-title-time">
|
||||
<div class="post-title">
|
||||
<ion-label><ion-skeleton-text animated animated style="width: 60%;"></ion-skeleton-text></ion-label>
|
||||
</div>
|
||||
<div class="post-data"><ion-skeleton-text animated style="width: 25%; float: right;"></ion-skeleton-text></div>
|
||||
</div>
|
||||
<div class="post-description">
|
||||
<p><ion-skeleton-text animated></ion-skeleton-text></p>
|
||||
<p><ion-skeleton-text animated></ion-skeleton-text></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="post-img">
|
||||
<img src="/assets/icon/icon-no-image.svg" alt="image">
|
||||
</div>
|
||||
<div class="post-content">
|
||||
<div class="post-title-time">
|
||||
<div class="post-title">
|
||||
<ion-label><ion-skeleton-text animated animated style="width: 60%;"></ion-skeleton-text></ion-label>
|
||||
</div>
|
||||
<div class="post-data"><ion-skeleton-text animated style="width: 25%; float: right;"></ion-skeleton-text></div>
|
||||
</div>
|
||||
<div class="post-description">
|
||||
<p><ion-skeleton-text animated></ion-skeleton-text></p>
|
||||
<p><ion-skeleton-text animated></ion-skeleton-text></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ion-list>
|
||||
</div>
|
||||
</ion-content>
|
||||
@@ -0,0 +1,169 @@
|
||||
:host{
|
||||
background: transparent;
|
||||
padding: 0!important;
|
||||
}
|
||||
ion-content{
|
||||
--background: transparent;
|
||||
transform: translate3d(0, 5px, 0);
|
||||
--border-radius: 30px;
|
||||
}
|
||||
ion-toolbar{
|
||||
--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{
|
||||
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;
|
||||
}
|
||||
.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{
|
||||
background: #f3f2f2;
|
||||
height: 20px;
|
||||
margin: 0 auto;
|
||||
border-top-left-radius: 25px;
|
||||
border-top-right-radius: 25px;
|
||||
transform: translate3d(0, 1px, 0);
|
||||
}
|
||||
.content-container{
|
||||
width: 100%;
|
||||
margin:0 auto;
|
||||
border-top-left-radius: 25px;
|
||||
border-top-right-radius: 25px;
|
||||
background: #ffffff;
|
||||
height: 100%;
|
||||
box-shadow: 0px 0px 18px rgba(0, 0, 0, 0.6);
|
||||
padding: 25px 0px 0 0px;
|
||||
overflow: auto;
|
||||
}
|
||||
.title-content{
|
||||
margin: 0px auto;
|
||||
overflow: auto;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.back-icon{
|
||||
width: 37px;
|
||||
float: left;
|
||||
font-size: 35px;
|
||||
overflow: auto;
|
||||
|
||||
}
|
||||
.div-title{
|
||||
/* padding: 0!important; */
|
||||
float: left;
|
||||
margin: 2.5px 0 0 5px;
|
||||
}
|
||||
.title{
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.actions-icon{
|
||||
width: 92px;
|
||||
float: right;
|
||||
overflow: auto;
|
||||
}
|
||||
.actions-icon ion-icon{
|
||||
margin-left: 10px;
|
||||
font-size: 35px;
|
||||
float: right;
|
||||
}
|
||||
.item-content-date{
|
||||
color: #797979;
|
||||
font-size: 13px;
|
||||
}
|
||||
.item-content-detail{
|
||||
color: #000000;
|
||||
font-size: 13px;
|
||||
}
|
||||
.post-item{
|
||||
width: 100%;
|
||||
|
||||
border-radius: 0px;
|
||||
padding: 0!important;
|
||||
}
|
||||
.post-img{
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
|
||||
border-radius: 0px!important;
|
||||
overflow: hidden;
|
||||
}
|
||||
.post-img img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
.post-content{
|
||||
margin: 0 auto;
|
||||
margin-bottom: 35px;
|
||||
}
|
||||
.post-title-time{
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
.post-title{
|
||||
width: 60%;
|
||||
float: left;
|
||||
font-size: 15px;
|
||||
color: #0d89d1;
|
||||
}
|
||||
.post-data{
|
||||
width: 40%;
|
||||
float: left;
|
||||
font-size: 13px;
|
||||
color: #797979;
|
||||
text-align: right;
|
||||
}
|
||||
.post-description{
|
||||
font-size: 13px;
|
||||
color: #000;
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { ViewPublicationsPage } from './view-publications.page';
|
||||
|
||||
describe('ViewPublicationsPage', () => {
|
||||
let component: ViewPublicationsPage;
|
||||
let fixture: ComponentFixture<ViewPublicationsPage>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ ViewPublicationsPage ],
|
||||
imports: [IonicModule.forRoot()]
|
||||
}).compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(ViewPublicationsPage);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
}));
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,129 @@
|
||||
import { Component, OnInit, Input, Output } 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 { PublicationDetailPage } from 'src/app/pages/publications/publication-detail/publication-detail.page';
|
||||
import { NewPublicationPage } from 'src/app/pages/publications/new-publication/new-publication.page';
|
||||
|
||||
@Component({
|
||||
selector: 'app-view-publications',
|
||||
templateUrl: './view-publications.page.html',
|
||||
styleUrls: ['./view-publications.page.scss'],
|
||||
})
|
||||
export class ViewPublicationsPage implements OnInit {
|
||||
showLoader: boolean;
|
||||
loading: any;
|
||||
|
||||
publicationList: Publication[];
|
||||
item: PublicationFolder;
|
||||
|
||||
@Input() folderId: string;
|
||||
|
||||
|
||||
constructor(
|
||||
private loadingController: LoadingService,
|
||||
private modalController: ModalController,
|
||||
private publications: PublicationsService,
|
||||
) {
|
||||
this.item = new PublicationFolder();
|
||||
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
console.log(this.folderId);
|
||||
|
||||
this.getPublications();
|
||||
this.getPublicationDetail();
|
||||
}
|
||||
|
||||
ngOnChanges(changes: any): void {
|
||||
console.log(this.folderId)
|
||||
|
||||
this.getPublications();
|
||||
this.getPublicationDetail();
|
||||
}
|
||||
|
||||
doRefresh(event) {
|
||||
this.getPublications();
|
||||
|
||||
setTimeout(() => {
|
||||
this.getPublications();
|
||||
this.getPublicationDetail();
|
||||
event.target.complete();
|
||||
}, 3000);
|
||||
}
|
||||
close(){
|
||||
this.modalController.dismiss();
|
||||
}
|
||||
getPublicationDetail(){
|
||||
this.publications.GetPublicationFolderById(this.folderId).subscribe(res=>{
|
||||
console.log(res);
|
||||
this.item = res;
|
||||
});
|
||||
}
|
||||
getPublications(){
|
||||
this.showLoader = true;
|
||||
|
||||
this.publications.GetPublications(this.folderId).subscribe(res=>{
|
||||
this.publicationList = new Array();
|
||||
console.log(res);
|
||||
res.forEach(element => {
|
||||
let itemImage = {
|
||||
title: 'Title',
|
||||
url: "data:image/jpg;base64," + element.FileBase64,
|
||||
format: 'png'
|
||||
}
|
||||
let item: Publication = {
|
||||
"DateIndex": element.DateIndex,
|
||||
"DocumentId":element.DocumentId,
|
||||
"ProcessId":element.ProcessId,
|
||||
"Title":element.Title,
|
||||
"Message": element.Message,
|
||||
"DatePublication": element.DatePublication,
|
||||
/* image:itemImage, */
|
||||
"FileBase64": "data:image/jpg;base64," + element.FileBase64,
|
||||
"OriginalFileName": '',
|
||||
"FileExtension": '',
|
||||
}
|
||||
this.publicationList.push(item);
|
||||
});
|
||||
console.log(this.publicationList);
|
||||
this.showLoader = false;
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
async AddPublication(publicationType:any, folderId:string) {
|
||||
const modal = await this.modalController.create({
|
||||
component: NewPublicationPage,
|
||||
componentProps:{
|
||||
publicationType: publicationType,
|
||||
folderId: folderId,
|
||||
},
|
||||
cssClass: 'new-publication',
|
||||
backdropDismiss: false
|
||||
});
|
||||
await modal.present();
|
||||
modal.onDidDismiss().then(()=>{
|
||||
this.doRefresh(event);
|
||||
});
|
||||
}
|
||||
|
||||
async viewPublicationDetail(publicationId:string) {
|
||||
const modal = await this.modalController.create({
|
||||
component: PublicationDetailPage,
|
||||
componentProps:{
|
||||
publicationId: publicationId,
|
||||
},
|
||||
cssClass: 'publication-detail',
|
||||
backdropDismiss: false
|
||||
});
|
||||
await modal.present();
|
||||
modal.onDidDismiss().then(()=>{
|
||||
this.doRefresh(event);
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
+1
-1
@@ -353,7 +353,7 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
|
||||
@media only screen and (min-width: 1024px) {
|
||||
.gabinete-digital-mobile-modal-to-Desktop{
|
||||
top: 75px;
|
||||
left: 340px;
|
||||
left: 40%;
|
||||
|
||||
.modal-wrapper{
|
||||
transform: none !important;
|
||||
|
||||
Reference in New Issue
Block a user