mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-19 21:06:06 +00:00
Merge branch 'feature/calendar' into developer
This commit is contained in:
tiago.kayaya
@@ -53,7 +53,8 @@ export class NewPublicationPage implements OnInit {
|
||||
private publications: PublicationsService,
|
||||
private camera: Camera,
|
||||
) {
|
||||
|
||||
|
||||
alert('!!!!!')
|
||||
this.publicationType = this.navParams.get('publicationType');
|
||||
this.folderId = this.navParams.get('folderId');
|
||||
this.publicationTitle = 'Nova Publicação';
|
||||
|
||||
@@ -1,16 +1,12 @@
|
||||
: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{
|
||||
@@ -55,7 +51,6 @@
|
||||
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;
|
||||
}
|
||||
|
||||
@@ -9,6 +9,9 @@ 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';
|
||||
import { NewPublicationPage } from 'src/app/shared/publication/new-publication/new-publication.page';
|
||||
import { PublicationDetailPage } from 'src/app/shared/publication/view-publications/publication-detail/publication-detail.page';
|
||||
import { NewActionPage } from 'src/app/shared/publication/new-action/new-action.page';
|
||||
|
||||
|
||||
@NgModule({
|
||||
@@ -21,7 +24,10 @@ import { ViewPublicationsPage } from 'src/app/shared/publication/view-publicatio
|
||||
],
|
||||
declarations: [
|
||||
PublicationsPage,
|
||||
ViewPublicationsPage
|
||||
ViewPublicationsPage,
|
||||
NewPublicationPage,
|
||||
PublicationDetailPage,
|
||||
NewActionPage
|
||||
]
|
||||
})
|
||||
export class PublicationsPageModule {}
|
||||
|
||||
@@ -44,10 +44,9 @@
|
||||
</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item"
|
||||
|
||||
*ngFor="let evento of publicationsEventFolderList"
|
||||
(click)="viewPublications(evento)">
|
||||
<div class="item width-100"
|
||||
*ngFor="let evento of publicationsEventFolderList"
|
||||
(click)="viewPublications(evento)">
|
||||
<div class="item-icon2">
|
||||
<ion-icon slot="end" src='assets/images/icons-nav-actions.svg'></ion-icon>
|
||||
</div>
|
||||
@@ -62,16 +61,50 @@
|
||||
</div>
|
||||
|
||||
<!-- Right -->
|
||||
<div class="d-none d-md-flex flex-grow-1 flex-column max-width-60">
|
||||
<!-- <app-view-publications></app-view-publications> -->
|
||||
<div class="d-none d-md-flex flex-grow-1 flex-column max-width-60"
|
||||
style="border-left: 1px solid #d8d8d8;">
|
||||
|
||||
<div class="width-100 height-100 d-flex align-center justify-center"
|
||||
*ngIf="(
|
||||
desktopComponent.showViewPublication == false &&
|
||||
desktopComponent.showAddNewPublication == false &&
|
||||
desktopComponent.showPublicationDetail == false &&
|
||||
desktopComponent.showAddActions == false
|
||||
)"><div>Nenhuma publicação delecionado</div></div>
|
||||
|
||||
<!-- View Publication -->
|
||||
<app-view-publications
|
||||
*ngIf="desktopComponent.showViewPublication"
|
||||
[folderId]="folderId"
|
||||
class="height-100 d-flex flex-column overflow-hidden"
|
||||
class="height-100 d-flex flex-column overflow-hidden flex-grow-1"
|
||||
(addNewPublication)="addNewPublication($event)"
|
||||
(openPublicationDetails)="openPublicationDetails($event)"
|
||||
>
|
||||
</app-view-publications>
|
||||
|
||||
<app-new-publication *ngIf="desktopComponent.showAddNewPublication"
|
||||
class="height-100 d-flex flex-column overflow-hidden background-white flex-grow-1"
|
||||
[folderId]="folderId"
|
||||
[publicationType]="publicationType"
|
||||
[publication]="publication"
|
||||
(closeDesktopComponent)="closeDesktopComponent($event)"
|
||||
>
|
||||
</app-new-publication>
|
||||
|
||||
<app-publication-detail-shared
|
||||
*ngIf="desktopComponent.showPublicationDetail"
|
||||
class="height-100 d-flex flex-column overflow-hidden background-white flex-grow-1"
|
||||
[publicationId]="publicationId"
|
||||
(addNewPublication)="addNewPublication($event)"
|
||||
(closeDesktopComponent)="closeDesktopComponent($event)"
|
||||
></app-publication-detail-shared>
|
||||
|
||||
<app-new-action
|
||||
*ngIf="desktopComponent.showAddActions"
|
||||
class="height-100 d-flex flex-column overflow-hidden background-white flex-grow-1"
|
||||
(closeDesktopComponent)="closeDesktopComponent($event)"
|
||||
></app-new-action>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -91,7 +91,6 @@ ion-toolbar{
|
||||
padding: 15px 20px 0 20px;
|
||||
}
|
||||
.item{
|
||||
width: 360px;
|
||||
padding: 0 0px 0 0px;
|
||||
overflow: auto;
|
||||
margin: 0px auto;
|
||||
|
||||
@@ -34,9 +34,18 @@ export class PublicationsPage implements OnInit {
|
||||
|
||||
desktopComponent: any = {
|
||||
showViewPublication: false,
|
||||
showAddNewPublication: false,
|
||||
showPublicationDetail: false,
|
||||
showAddActions: false
|
||||
}
|
||||
|
||||
folderId: string;
|
||||
// data set from child component
|
||||
publicationType: any;
|
||||
publicationId: string;
|
||||
|
||||
// from publication details
|
||||
publication: object;
|
||||
|
||||
constructor(
|
||||
private router: Router,
|
||||
@@ -96,18 +105,26 @@ export class PublicationsPage implements OnInit {
|
||||
}
|
||||
|
||||
async AddPublicationFolder(item:any) {
|
||||
const modal = await this.modalController.create({
|
||||
component: NewActionPage,
|
||||
componentProps:{
|
||||
item: item,
|
||||
},
|
||||
cssClass: 'new-action',
|
||||
backdropDismiss: false
|
||||
});
|
||||
await modal.present();
|
||||
modal.onDidDismiss().then(()=>{
|
||||
this.doRefresh();
|
||||
});
|
||||
|
||||
this.closeDesktopComponent();
|
||||
if(window.innerHeight >= 1024){
|
||||
const modal = await this.modalController.create({
|
||||
component: NewActionPage,
|
||||
componentProps:{
|
||||
item: item,
|
||||
},
|
||||
cssClass: 'new-action',
|
||||
backdropDismiss: false
|
||||
});
|
||||
await modal.present();
|
||||
modal.onDidDismiss().then(()=>{
|
||||
this.doRefresh();
|
||||
});
|
||||
} else {
|
||||
this.desktopComponent.showAddActions = true;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
async viewPublications(folderId: string) {
|
||||
@@ -137,6 +154,7 @@ export class PublicationsPage implements OnInit {
|
||||
}
|
||||
|
||||
|
||||
this.closeDesktopComponent();
|
||||
|
||||
// OpenModal
|
||||
if( window.innerWidth <= 1024){
|
||||
@@ -164,4 +182,35 @@ export class PublicationsPage implements OnInit {
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
async addNewPublication({publicationType, folderId, publication}){
|
||||
|
||||
this.closeDesktopComponent();
|
||||
|
||||
// propr to add new publication
|
||||
this.publicationType = publicationType;
|
||||
this.folderId = folderId;
|
||||
this.publication = publication;
|
||||
|
||||
this.desktopComponent.showAddNewPublication = true;
|
||||
}
|
||||
|
||||
async openPublicationDetails(publicationId: string){
|
||||
|
||||
this.publicationId = publicationId;
|
||||
|
||||
this.closeDesktopComponent();
|
||||
this.desktopComponent.showPublicationDetail = true;
|
||||
|
||||
}
|
||||
|
||||
async closeDesktopComponent (xx?: any){
|
||||
|
||||
this.desktopComponent = {
|
||||
showViewPublication: false,
|
||||
showAddNewPublication: false,
|
||||
showPublicationDetail: false,
|
||||
showAddActions: false,
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
import { NewActionPage } from './new-action.page';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: NewActionPage
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class NewActionPageRoutingModule {}
|
||||
@@ -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 { NewActionPageRoutingModule } from './new-action-routing.module';
|
||||
|
||||
import { NewActionPage } from './new-action.page';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
IonicModule,
|
||||
NewActionPageRoutingModule
|
||||
],
|
||||
declarations: [NewActionPage]
|
||||
})
|
||||
export class NewActionPageModule {}
|
||||
@@ -0,0 +1,95 @@
|
||||
<ion-header class="ion-no-border pt-20 px-20">
|
||||
<div class="title-content d-flex align-center justify-space-between ">
|
||||
<div class="div-title">
|
||||
<ion-label class="title"> Nova Acção</ion-label>
|
||||
</div>
|
||||
<div class="actionType">
|
||||
<ion-segment [(ngModel)]="segment" (ionChange)="segmentChanged($event)">
|
||||
<ion-segment-button value="Viagem">
|
||||
<ion-label>Viagem</ion-label>
|
||||
</ion-segment-button>
|
||||
<ion-segment-button value="Evento">
|
||||
<ion-label>Evento</ion-label>
|
||||
</ion-segment-button>
|
||||
</ion-segment>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<div class="content-container">
|
||||
|
||||
<div class="ion-item-container">
|
||||
<ion-input [(ngModel)]="folder.Description" placeholder="Assunto" ></ion-input>
|
||||
</div>
|
||||
|
||||
<div class="container-div">
|
||||
<div class="ion-item-class-2 d-flex ">
|
||||
<div class="ion-icon-class">
|
||||
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
|
||||
</div>
|
||||
<div class="ion-input-class flex-grow-1">
|
||||
<ion-datetime
|
||||
[(ngModel)]="folder.DateBegin"
|
||||
placeholder="Início"
|
||||
displayFormat="D MMM YYYY H:mm"
|
||||
minuteValues="0,15,30,45"
|
||||
monthShortNames="Jan, Fev, Mar, Abr, Mai, Jun, Jul, Aug, Sep, Out, Nov, Dez"
|
||||
min="2018"
|
||||
max="2022">
|
||||
</ion-datetime>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container-div">
|
||||
<div class="ion-item-class-2 d-flex">
|
||||
<div class="ion-icon-class">
|
||||
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
|
||||
</div>
|
||||
<div class="ion-input-class d-flex flex-grow-1">
|
||||
<ion-datetime
|
||||
class="flex-grow-1"
|
||||
[(ngModel)]="folder.DateEnd"
|
||||
placeholder="Fim"
|
||||
displayFormat="D MMM YYYY H:mm"
|
||||
minuteValues="0,15,30,45"
|
||||
monthShortNames="Jan, Fev, Mar, Abr, Mai, Jun, Jul, Aug, Sep, Out, Nov, Dez"
|
||||
min="2018"
|
||||
max="2022">
|
||||
</ion-datetime>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container-div">
|
||||
<div class="ion-item-class-2 d-flex">
|
||||
<div class="ion-icon-class">
|
||||
<ion-icon slot="start" src="assets/images/icons-description.svg"></ion-icon>
|
||||
</div>
|
||||
<div class="ion-textarea-class flex-grow-1">
|
||||
<ion-textarea [(ngModel)]="folder.Detail" rows="12" cols="20" placeholder="Descrição da acção..."></ion-textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</ion-content>
|
||||
|
||||
<ion-footer class="ion-no-border">
|
||||
<ion-toolbar class="footer-toolbar width-100 justify-space-between d-flex px-20">
|
||||
<ion-buttons slot="start">
|
||||
<ion-button class="btn-cancel" fill="clear" color="#061b52" (click)="close()">
|
||||
<ion-label>Cancelar</ion-label>
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
<ion-buttons slot="end">
|
||||
<ion-button class="btn-ok" fill="clear" color="#fff" (click)="save()">
|
||||
<ion-label>Criar</ion-label>
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
</ion-footer>
|
||||
@@ -0,0 +1,128 @@
|
||||
:host{
|
||||
background: #fff;
|
||||
}
|
||||
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{
|
||||
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{
|
||||
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%;
|
||||
padding: 25px 20px 0 20px;
|
||||
overflow: auto;
|
||||
}
|
||||
.title-content{
|
||||
margin: 0px auto;
|
||||
overflow: auto;
|
||||
padding: 0 !important;
|
||||
}
|
||||
.div-title{
|
||||
width: 180px;
|
||||
/* padding: 0!important; */
|
||||
float: left;
|
||||
margin: 2.5px 0 0 5px;
|
||||
}
|
||||
.title{
|
||||
font-size: 25px;
|
||||
}
|
||||
.container-div{
|
||||
margin-bottom: 15px;
|
||||
overflow: auto;
|
||||
}
|
||||
.ion-item-container{
|
||||
margin: 15px auto;
|
||||
border: 1px solid #ebebeb;
|
||||
border-radius: 5px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
.ion-item-container-no-border{
|
||||
width: 100%;
|
||||
margin: 0px auto;
|
||||
padding: 0 !important;
|
||||
overflow: auto;
|
||||
}
|
||||
.ion-item-class-2{
|
||||
margin: 0px auto;
|
||||
}
|
||||
.ion-icon-class{
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
float: left;
|
||||
padding: 10px;
|
||||
font-size: 25px;
|
||||
}
|
||||
.ion-input-class{
|
||||
height: auto;
|
||||
border: 1px solid #ebebeb;
|
||||
border-radius: 5px;
|
||||
padding-left: 5px;
|
||||
padding-right: 10px;
|
||||
float: left;
|
||||
}
|
||||
.ion-textarea-class{
|
||||
width: 315px;
|
||||
height: auto;
|
||||
border: 1px solid #ebebeb;
|
||||
border-radius: 5px;
|
||||
padding-left: 5px;
|
||||
padding-right: 10px;
|
||||
float: left;
|
||||
}
|
||||
.ion-input-class-no-height{
|
||||
border: 1px solid #ebebeb;
|
||||
border-radius: 5px;
|
||||
overflow: auto;
|
||||
}
|
||||
.actionType{
|
||||
float: right;
|
||||
overflow: auto;
|
||||
border-radius: 30px;
|
||||
}
|
||||
.ion-segment{
|
||||
--background: #0782c9;
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { NewActionPage } from './new-action.page';
|
||||
|
||||
describe('NewActionPage', () => {
|
||||
let component: NewActionPage;
|
||||
let fixture: ComponentFixture<NewActionPage>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ NewActionPage ],
|
||||
imports: [IonicModule.forRoot()]
|
||||
}).compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(NewActionPage);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
}));
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,52 @@
|
||||
import { Component, EventEmitter, OnInit, Output } from '@angular/core';
|
||||
import { ModalController } from '@ionic/angular';
|
||||
import { PublicationFolder } from 'src/app/models/publicationfolder';
|
||||
import { PublicationsService } from 'src/app/services/publications.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-new-action',
|
||||
templateUrl: './new-action.page.html',
|
||||
styleUrls: ['./new-action.page.scss'],
|
||||
})
|
||||
export class NewActionPage implements OnInit {
|
||||
|
||||
folder: PublicationFolder;
|
||||
segment:string;
|
||||
|
||||
@Output() closeDesktopComponent= new EventEmitter<any>();
|
||||
|
||||
constructor(
|
||||
private modalController: ModalController,
|
||||
private publication: PublicationsService
|
||||
) {
|
||||
this.folder = new PublicationFolder();
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.segment = "Viagem";
|
||||
}
|
||||
|
||||
segmentChanged(ev: any) {
|
||||
console.log(ev.detail.value);
|
||||
}
|
||||
|
||||
save(){
|
||||
this.folder = {
|
||||
ProcessId: null,
|
||||
Description: this.folder.Description,
|
||||
Detail: this.folder.Detail,
|
||||
DateBegin: this.folder.DateBegin,
|
||||
DateEnd: this.folder.DateEnd,
|
||||
ActionType: this.segment,
|
||||
}
|
||||
console.log(this.folder);
|
||||
|
||||
this.publication.CreatePublicationFolder(this.folder);
|
||||
this.close();
|
||||
}
|
||||
|
||||
close(){
|
||||
this.closeDesktopComponent.emit();
|
||||
}
|
||||
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
import { NewPublicationPage } from './new-publication.page';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: NewPublicationPage
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class NewPublicationPageRoutingModule {}
|
||||
@@ -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 { NewPublicationPageRoutingModule } from './new-publication-routing.module';
|
||||
|
||||
import { NewPublicationPage } from './new-publication.page';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
IonicModule,
|
||||
NewPublicationPageRoutingModule
|
||||
],
|
||||
declarations: [NewPublicationPage]
|
||||
})
|
||||
export class NewPublicationPageModule {}
|
||||
@@ -0,0 +1,86 @@
|
||||
<ion-header class="ion-no-border background-white px-20 pt-25">
|
||||
<div class="title-content">
|
||||
<div class="div-title">
|
||||
<ion-label class="title">{{publicationTitle}}</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<div class="content-container">
|
||||
|
||||
<div *ngIf="publicationType!='1'" class="ion-item-container">
|
||||
<ion-input [(ngModel)]="pub.Title" name="title" ngDefaultControl placeholder="Título" ></ion-input>
|
||||
</div>
|
||||
|
||||
<div *ngIf="publicationType!='1'" class="container-div">
|
||||
<div class="ion-item-class-2 d-flex">
|
||||
<div class="ion-icon-class">
|
||||
<ion-icon slot="start" src="assets/images/icons-description.svg"></ion-icon>
|
||||
</div>
|
||||
<div class="ion-textarea-class flex-grow-1">
|
||||
<ion-textarea [(ngModel)]="pub.Message" name="description" ngDefaultControl rows="12" cols="20" placeholder="Corpo de texto..."></ion-textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="capturedImage != ''" class="ion-item-container-no-border">
|
||||
<ion-label class="attached-title">Fotografia Anexada</ion-label>
|
||||
<ion-item lines="none">
|
||||
<ion-thumbnail slot="start">
|
||||
<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>
|
||||
</ion-thumbnail> -->
|
||||
<ion-label>
|
||||
<p>{{capturedImageTitle}}</p>
|
||||
<p hidden>size</p>
|
||||
</ion-label>
|
||||
<ion-icon (click)="clear()" name="close"></ion-icon>
|
||||
</ion-item>
|
||||
|
||||
<!-- <ion-thumbnail>
|
||||
<ion-img src="{{imgUrl}}"></ion-img>
|
||||
</ion-thumbnail> -->
|
||||
</div>
|
||||
|
||||
<div class="ion-item-container-no-border">
|
||||
<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>Tirar Fotografia</ion-label>
|
||||
</div>
|
||||
</ion-label>
|
||||
</div>
|
||||
|
||||
<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>
|
||||
<div class="attach-document">
|
||||
<ion-label>Anexar Fotografia</ion-label>
|
||||
</div>
|
||||
</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</ion-content>
|
||||
|
||||
|
||||
<ion-footer class="ion-no-border">
|
||||
<ion-toolbar class="footer-toolbar">
|
||||
<ion-buttons slot="start">
|
||||
<ion-button class="btn-cancel" fill="clear" color="#061b52" (click)="close()">
|
||||
<ion-label>Cancelar</ion-label>
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
<ion-buttons slot="end">
|
||||
<ion-button class="btn-ok" fill="clear" color="#fff" (click)="save()">
|
||||
<ion-label>Gravar</ion-label>
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
</ion-footer>
|
||||
@@ -0,0 +1,134 @@
|
||||
|
||||
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%;
|
||||
padding: 25px 20px 0 20px;
|
||||
overflow: auto;
|
||||
}
|
||||
.title-content{
|
||||
width: 360px;
|
||||
overflow: auto;
|
||||
padding: 0 !important;
|
||||
}
|
||||
.div-title{
|
||||
width: 270px;
|
||||
/* padding: 0!important; */
|
||||
float: left;
|
||||
margin: 2.5px 0 0 5px;
|
||||
}
|
||||
.title{
|
||||
font-size: 25px;
|
||||
}
|
||||
.container-div{
|
||||
margin-bottom: 15px;
|
||||
overflow: auto;
|
||||
}
|
||||
.ion-item-container{
|
||||
margin: 15px auto;
|
||||
border: 1px solid #ebebeb;
|
||||
border-radius: 5px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
.ion-item-container-no-border{
|
||||
width: 100%;
|
||||
margin: 0px auto;
|
||||
padding: 0 !important;
|
||||
overflow: auto;
|
||||
}
|
||||
.ion-item-class-2{
|
||||
margin: 0px auto;
|
||||
}
|
||||
.ion-icon-class{
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
float: left;
|
||||
padding: 10px;
|
||||
font-size: 25px;
|
||||
}
|
||||
.ion-textarea-class{
|
||||
height: auto;
|
||||
border: 1px solid #ebebeb;
|
||||
border-radius: 5px;
|
||||
padding-left: 5px;
|
||||
padding-right: 10px;
|
||||
float: left;
|
||||
}
|
||||
.ion-input-class-no-height{
|
||||
border: 1px solid #ebebeb;
|
||||
border-radius: 5px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.attach-document{
|
||||
font-size: 15px;
|
||||
color: #0d89d1;
|
||||
margin: 5px 5px 20px 10px;
|
||||
padding: 5px;
|
||||
float: left;
|
||||
}
|
||||
.attach-icon{
|
||||
width: 37px;
|
||||
font-size: 35px;
|
||||
float: left;
|
||||
}
|
||||
.attached-title{
|
||||
font-family: Roboto;
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
font-stretch: normal;
|
||||
font-style: normal;
|
||||
line-height: normal;
|
||||
letter-spacing: normal;
|
||||
color: #000;
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
|
||||
import { NewPublicationPage } from './new-publication.page';
|
||||
|
||||
describe('NewPublicationPage', () => {
|
||||
let component: NewPublicationPage;
|
||||
let fixture: ComponentFixture<NewPublicationPage>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ NewPublicationPage ],
|
||||
imports: [IonicModule.forRoot()]
|
||||
}).compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(NewPublicationPage);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
}));
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,208 @@
|
||||
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
|
||||
import { AlertController, ModalController, NavParams } from '@ionic/angular';
|
||||
|
||||
/* import {Plugins, CameraResultType, CameraSource} from '@capacitor/core'; */
|
||||
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
|
||||
import { PublicationsService } from 'src/app/services/publications.service';
|
||||
import { Publication } from 'src/app/models/publication';
|
||||
import { Image } from 'src/app/models/image';
|
||||
import { ThrowStmt } from '@angular/compiler';
|
||||
import { PhotoService } from 'src/app/services/photo.service';
|
||||
//Capacitor
|
||||
/* const { Camera } = Plugins; */
|
||||
|
||||
//Cordova
|
||||
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',
|
||||
templateUrl: './new-publication.page.html',
|
||||
styleUrls: ['./new-publication.page.scss'],
|
||||
})
|
||||
export class NewPublicationPage implements OnInit {
|
||||
showLoader: boolean;
|
||||
pub: Publication = new Publication();
|
||||
image: Image = new Image();
|
||||
|
||||
publicationTitle:string;
|
||||
imgUrl:any;
|
||||
|
||||
Defaultimage:any = '';
|
||||
|
||||
|
||||
photo: SafeResourceUrl;
|
||||
|
||||
@Input() publication: Publication;
|
||||
@Input() publicationType: string;
|
||||
@Input() folderId: string;
|
||||
@Output() closeDesktopComponent = new EventEmitter<any>();
|
||||
|
||||
|
||||
guestPicture:any;
|
||||
|
||||
capturedImage:any;
|
||||
capturedImageTitle:any;
|
||||
|
||||
constructor(
|
||||
private modalController: ModalController,
|
||||
public photoService: PhotoService,
|
||||
private publications: PublicationsService,
|
||||
private camera: Camera,
|
||||
) {
|
||||
this.publicationTitle = 'Nova Publicação';
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.setTitle();
|
||||
this.clear();
|
||||
this.takePicture();
|
||||
}
|
||||
takePicture(){
|
||||
const options: CameraOptions = {
|
||||
quality: 90,
|
||||
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);
|
||||
});
|
||||
}
|
||||
|
||||
getPicture(){
|
||||
const options: CameraOptions = {
|
||||
quality: 90,
|
||||
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(){
|
||||
if(this.publicationType == '3'){
|
||||
|
||||
if(this.capturedImage != ''){
|
||||
this.publication = {
|
||||
DateIndex: this.publication.DateIndex,
|
||||
DocumentId:this.publication.DocumentId,
|
||||
ProcessId:this.publication.ProcessId,
|
||||
Title: this.pub.Title,
|
||||
Message: this.pub.Message,
|
||||
DatePublication: this.publication.DatePublication,
|
||||
OriginalFileName: this.capturedImageTitle,
|
||||
FileBase64: this.capturedImage,
|
||||
FileExtension: 'jpeg',
|
||||
}
|
||||
console.log('Edit change image');
|
||||
console.log(this.publication);
|
||||
this.publications.UpdatePublication(this.publication.ProcessId, this.publication);
|
||||
this.closeDesktopComponent.emit();
|
||||
}
|
||||
else{
|
||||
this.publication = {
|
||||
DateIndex: this.publication.DateIndex,
|
||||
DocumentId:this.publication.DocumentId,
|
||||
ProcessId:this.publication.ProcessId,
|
||||
Title: this.pub.Title,
|
||||
Message: this.pub.Message,
|
||||
DatePublication: this.publication.DatePublication,
|
||||
OriginalFileName: this.publication.OriginalFileName,
|
||||
FileBase64: this.publication.FileBase64,
|
||||
FileExtension: 'jpeg',
|
||||
}
|
||||
console.log('Edit - keep image');
|
||||
console.log(this.publication);
|
||||
this.publications.UpdatePublication(this.publication.ProcessId, this.publication);
|
||||
this.closeDesktopComponent.emit();
|
||||
}
|
||||
}
|
||||
else{
|
||||
|
||||
this.publication = {
|
||||
DateIndex: new Date(),
|
||||
DocumentId:null,
|
||||
ProcessId:this.folderId,
|
||||
Title: this.pub.Title,
|
||||
Message: this.pub.Message,
|
||||
DatePublication: new Date(),
|
||||
OriginalFileName: this.capturedImageTitle,
|
||||
FileBase64: this.capturedImage,
|
||||
FileExtension: 'jpeg',
|
||||
}
|
||||
|
||||
console.log(this.publication);
|
||||
this.publications.CreatePublication(this.folderId, this.publication);
|
||||
|
||||
this.closeDesktopComponent.emit();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
close(){
|
||||
this.closeDesktopComponent.emit('!???____!!');
|
||||
}
|
||||
clear(){
|
||||
this.capturedImage = '';
|
||||
}
|
||||
setTitle(){
|
||||
if(this.publicationType == '1'){
|
||||
this.publicationTitle = 'Nova Publicação Rápida';
|
||||
}
|
||||
else if(this.publicationType == '2'){
|
||||
this.publicationTitle = 'Nova Publicação';
|
||||
}
|
||||
else if(this.publicationType == '3'){
|
||||
this.publicationTitle = 'Editar Publicação';
|
||||
this.pub = this.publication;
|
||||
}
|
||||
}
|
||||
|
||||
/* async openGallery() {
|
||||
const modal = await this.modalController.create({
|
||||
component: GalleryPage,
|
||||
componentProps:{
|
||||
},
|
||||
cssClass: 'new-publication',
|
||||
backdropDismiss: false
|
||||
});
|
||||
await modal.present();
|
||||
modal.onDidDismiss();
|
||||
} */
|
||||
|
||||
/* async takePicture(){
|
||||
const image = await Plugins.Camera.getPhoto({
|
||||
quality: 100,
|
||||
allowEditing: false,
|
||||
resultType: CameraResultType.DataUrl,
|
||||
source: CameraSource.Camera
|
||||
});
|
||||
console.log(image);
|
||||
|
||||
this.photo = this.sanitizer.bypassSecurityTrustResourceUrl(image && (image.dataUrl));
|
||||
} */
|
||||
|
||||
}
|
||||
+17
@@ -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 {}
|
||||
+20
@@ -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 {}
|
||||
+73
@@ -0,0 +1,73 @@
|
||||
<!-- <ion-header class="ion-no-border">
|
||||
|
||||
|
||||
</ion-header> -->
|
||||
|
||||
<ion-content>
|
||||
|
||||
<div class="content-container">
|
||||
<div *ngIf="publication.Title != ''">
|
||||
<div class="title-content d-flex pl-20">
|
||||
<div class="back-icon d-md-none" >
|
||||
<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 px-20">
|
||||
<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 width-md-100 px-md-20">
|
||||
<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>
|
||||
|
||||
+91
@@ -0,0 +1,91 @@
|
||||
|
||||
ion-content{
|
||||
--background: transparent;
|
||||
--border-radius: 30px;
|
||||
}
|
||||
ion-footer{
|
||||
background: #fff;
|
||||
}
|
||||
ion-toolbar{
|
||||
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%;
|
||||
padding: 25px 0px 0 0px;
|
||||
overflow: auto;
|
||||
}
|
||||
.title-content{
|
||||
overflow: auto;
|
||||
}
|
||||
.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;
|
||||
}
|
||||
+24
@@ -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();
|
||||
});
|
||||
});
|
||||
+125
@@ -0,0 +1,125 @@
|
||||
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
|
||||
import { ModalController, NavParams } from '@ionic/angular';
|
||||
import { Publication } from 'src/app/models/publication';
|
||||
import { ImageModalPage } from 'src/app/pages/publications/gallery/image-modal/image-modal.page';
|
||||
import { NewPublicationPage } from 'src/app/pages/publications/new-publication/new-publication.page';
|
||||
import { PublicationsService } from 'src/app/services/publications.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-publication-detail-shared',
|
||||
templateUrl: './publication-detail.page.html',
|
||||
styleUrls: ['./publication-detail.page.scss'],
|
||||
})
|
||||
export class PublicationDetailPage implements OnInit {
|
||||
showLoader: boolean;
|
||||
folderId: string;
|
||||
publication: Publication;
|
||||
|
||||
@Input() publicationId: string;
|
||||
@Output() addNewPublication = new EventEmitter<any>();
|
||||
|
||||
constructor(
|
||||
private modalController: ModalController,
|
||||
private publications:PublicationsService,
|
||||
) {
|
||||
|
||||
/* 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);
|
||||
|
||||
if(window.innerHeight >= 1024){
|
||||
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);
|
||||
});
|
||||
} else {
|
||||
this.addNewPublication.emit({
|
||||
publicationType: publicationType,
|
||||
folderId: this.folderId,
|
||||
publication: this.publication,
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
openPreview(imageUrl:string){
|
||||
this.modalController.create({
|
||||
component: ImageModalPage,
|
||||
componentProps: {
|
||||
imageUrl:imageUrl,
|
||||
}
|
||||
}).then(modal => modal.present());
|
||||
}
|
||||
|
||||
}
|
||||
@@ -28,16 +28,16 @@
|
||||
<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">
|
||||
<div class="post-item d-md-block mb-10"
|
||||
*ngFor="let publication of publicationList"
|
||||
(click)="viewPublicationDetail(publication.DocumentId)">
|
||||
<div *ngIf="publication.FileBase64.length > 30" class="mb-10 post-img width-md-100">
|
||||
<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-content px-20 width-md-100 ">
|
||||
<div class="post-title-time">
|
||||
<div class="post-title">
|
||||
<ion-label>{{publication.Title}}</ion-label>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { Component, OnInit, Input, Output } from '@angular/core';
|
||||
import { ModalController, NavParams } from '@ionic/angular';
|
||||
import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
|
||||
import { ModalController } 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';
|
||||
@@ -20,7 +20,8 @@ export class ViewPublicationsPage implements OnInit {
|
||||
item: PublicationFolder;
|
||||
|
||||
@Input() folderId: string;
|
||||
|
||||
@Output() addNewPublication = new EventEmitter<any>();
|
||||
@Output() openPublicationDetails= new EventEmitter<any>();
|
||||
|
||||
constructor(
|
||||
private loadingController: LoadingService,
|
||||
@@ -29,7 +30,7 @@ export class ViewPublicationsPage implements OnInit {
|
||||
) {
|
||||
this.item = new PublicationFolder();
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
console.log(this.folderId);
|
||||
@@ -96,34 +97,53 @@ export class ViewPublicationsPage implements OnInit {
|
||||
}
|
||||
|
||||
async AddPublication(publicationType:any, folderId:string) {
|
||||
const modal = await this.modalController.create({
|
||||
component: NewPublicationPage,
|
||||
componentProps:{
|
||||
|
||||
if( window.innerWidth <= 1024) {
|
||||
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);
|
||||
});
|
||||
} else {
|
||||
this.addNewPublication.emit({
|
||||
publicationType: publicationType,
|
||||
folderId: folderId,
|
||||
},
|
||||
cssClass: 'new-publication',
|
||||
backdropDismiss: false
|
||||
});
|
||||
await modal.present();
|
||||
modal.onDidDismiss().then(()=>{
|
||||
this.doRefresh(event);
|
||||
});
|
||||
folderId: folderId
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
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);
|
||||
});
|
||||
|
||||
console.log(publicationId);
|
||||
|
||||
if( window.innerWidth <= 1024) {
|
||||
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);
|
||||
});
|
||||
} else {
|
||||
// open publication details
|
||||
this.openPublicationDetails.emit(publicationId);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user