diff --git a/src/app/pages/publications/publications.module.ts b/src/app/pages/publications/publications.module.ts index f703cefa2..518e20e3c 100644 --- a/src/app/pages/publications/publications.module.ts +++ b/src/app/pages/publications/publications.module.ts @@ -9,6 +9,7 @@ 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'; @NgModule({ @@ -21,7 +22,8 @@ import { ViewPublicationsPage } from 'src/app/shared/publication/view-publicatio ], declarations: [ PublicationsPage, - ViewPublicationsPage + ViewPublicationsPage, + NewPublicationPage ] }) export class PublicationsPageModule {} diff --git a/src/app/pages/publications/publications.page.html b/src/app/pages/publications/publications.page.html index f62a31e2f..2b29f27b9 100644 --- a/src/app/pages/publications/publications.page.html +++ b/src/app/pages/publications/publications.page.html @@ -62,16 +62,26 @@ -
- - +
+ + + + +
diff --git a/src/app/pages/publications/publications.page.ts b/src/app/pages/publications/publications.page.ts index afab58fdf..0f5d3132f 100644 --- a/src/app/pages/publications/publications.page.ts +++ b/src/app/pages/publications/publications.page.ts @@ -34,9 +34,11 @@ export class PublicationsPage implements OnInit { desktopComponent: any = { showViewPublication: false, + showAddNewPublication: false } folderId: string; + publicationType: any; constructor( private router: Router, @@ -96,6 +98,9 @@ export class PublicationsPage implements OnInit { } async AddPublicationFolder(item:any) { + + this.closeDesktopComponent(); + const modal = await this.modalController.create({ component: NewActionPage, componentProps:{ @@ -137,6 +142,7 @@ export class PublicationsPage implements OnInit { } + this.closeDesktopComponent(); // OpenModal if( window.innerWidth <= 1024){ @@ -164,4 +170,26 @@ export class PublicationsPage implements OnInit { } -} + async addNewPublication({publicationType, folderId}){ + + this.closeDesktopComponent(); + + // propr to add new publication + this.publicationType = publicationType; + this.folderId = folderId; + + this.desktopComponent.showAddNewPublication = true; + } + + async closeDesktopComponent (){ + + this.desktopComponent.showViewPublication = false; + this.desktopComponent.showAddNewPublication = false; + + this.desktopComponent = { + showViewPublication: false, + showAddNewPublication: false + } + } + +} \ No newline at end of file diff --git a/src/app/shared/publication/new-publication/new-publication-routing.module.ts b/src/app/shared/publication/new-publication/new-publication-routing.module.ts new file mode 100644 index 000000000..69521e65c --- /dev/null +++ b/src/app/shared/publication/new-publication/new-publication-routing.module.ts @@ -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 {} diff --git a/src/app/shared/publication/new-publication/new-publication.module.ts b/src/app/shared/publication/new-publication/new-publication.module.ts new file mode 100644 index 000000000..c91c34b29 --- /dev/null +++ b/src/app/shared/publication/new-publication/new-publication.module.ts @@ -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 {} diff --git a/src/app/shared/publication/new-publication/new-publication.page.html b/src/app/shared/publication/new-publication/new-publication.page.html new file mode 100644 index 000000000..6faa78d0a --- /dev/null +++ b/src/app/shared/publication/new-publication/new-publication.page.html @@ -0,0 +1,86 @@ + +
+
+ {{publicationTitle}} +
+
+ + + +
+ +
+ +
+ +
+
+
+ +
+
+ +
+
+
+
+ Fotografia Anexada + + + + + + +

{{capturedImageTitle}}

+ + + + + + +
+ +
+ +
+ +
+
+ Tirar Fotografia +
+ +
+ +
+ +
+ +
+
+ Anexar Fotografia +
+ +
+
+ + + + + + + + + Cancelar + + + + + Gravar + + + + diff --git a/src/app/shared/publication/new-publication/new-publication.page.scss b/src/app/shared/publication/new-publication/new-publication.page.scss new file mode 100644 index 000000000..733e5e2d4 --- /dev/null +++ b/src/app/shared/publication/new-publication/new-publication.page.scss @@ -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; + } \ No newline at end of file diff --git a/src/app/shared/publication/new-publication/new-publication.page.spec.ts b/src/app/shared/publication/new-publication/new-publication.page.spec.ts new file mode 100644 index 000000000..09d8beae8 --- /dev/null +++ b/src/app/shared/publication/new-publication/new-publication.page.spec.ts @@ -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; + + 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(); + }); +}); diff --git a/src/app/shared/publication/new-publication/new-publication.page.ts b/src/app/shared/publication/new-publication/new-publication.page.ts new file mode 100644 index 000000000..1b38527ea --- /dev/null +++ b/src/app/shared/publication/new-publication/new-publication.page.ts @@ -0,0 +1,209 @@ +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'; +import { AlertService } from 'src/app/services/alert.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; + publication: Publication; + pub: Publication = new Publication(); + image: Image = new Image(); + + publicationTitle:string; + imgUrl:any; + + Defaultimage:any = ''; + + + photo: SafeResourceUrl; + + @Input() publicationType: string; + @Input() folderId: string; + @Output() closeDesktopComponent = new EventEmitter(); + + + 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.close(); + } + 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.close(); + } + } + 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'; + } + } + + /* 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)); + } */ + +} diff --git a/src/app/shared/publication/view-publications/view-publications.page.ts b/src/app/shared/publication/view-publications/view-publications.page.ts index e0cea01f9..95f9dcdf7 100644 --- a/src/app/shared/publication/view-publications/view-publications.page.ts +++ b/src/app/shared/publication/view-publications/view-publications.page.ts @@ -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,6 +20,7 @@ export class ViewPublicationsPage implements OnInit { item: PublicationFolder; @Input() folderId: string; + @Output() addNewPublication = new EventEmitter(); constructor( @@ -96,19 +97,28 @@ 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) {