draft document are been listed and open on tiny

src/app/tiny-mce/tiny-mce.module.ts

@@ -9,6 +9,7 @@ import { TinyMCEPageRoutingModule } from './tiny-mce-routing.module';
 import { TinyMCEPage } from './tiny-mce.page';
 import {Editor} from 'tinymce';
 import { EditorModule } from '@tinymce/tinymce-angular';
+import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
 
 @NgModule({
   imports: [
@@ -16,7 +17,8 @@ import { EditorModule } from '@tinymce/tinymce-angular';
     FormsModule,
     IonicModule,
     TinyMCEPageRoutingModule,
-    EditorModule
+    EditorModule,
+    FontAwesomeModule
   ],
   declarations: [TinyMCEPage]
 })

src/app/tiny-mce/tiny-mce.page.html

@@ -1,6 +1,26 @@
+<ion-header class="ion-no-border">
+<ion-toolbar class="d-flex">
+  <div class="d-flex align-items-center px-20 pt-20 font-25">
+    <div class="left cursor-pointer" (click)="close()">
+      <fa-icon icon="chevron-left" class="menu-icon font-awesome-1"></fa-icon>
+    </div>
+
+    <div class="middle add-ellipsis">
+      {{Document.Assunto}}
+    </div>
+
+    <div class="right cursor-pointer" (click)="openOptions()">
+      <fa-icon icon="ellipsis-v" class="menu-icon font-awesome-1"></fa-icon>
+    </div>
+
+  </div>
+</ion-toolbar>
+</ion-header>
+
 <editor
 apiKey="wr5dk69kive0qr9ig6y5spqvlj3a0tsiwnzdsexnz241k69p"
-  [init]="{   
+[(ngModel)]="editorContent"
+  [init]="{ 
     height: 500,
     menubar: false,
     plugins: [
@@ -11,6 +31,9 @@ apiKey="wr5dk69kive0qr9ig6y5spqvlj3a0tsiwnzdsexnz241k69p"
     toolbar:
       'undo redo | formatselect | bold italic backcolor | \
       alignleft aligncenter alignright alignjustify | \
-      bullist numlist outdent indent | removeformat | print | help'
-  }"
-></editor>
+      bullist numlist outdent indent | removeformat | print | help' }"
+  initialValue='{{content}}'
+  [(ngModel)]="editorContent"
+  (onSaveContent)="somefunction()"
+></editor>
+<button (click)="somefunction()">Save Content</button>

src/app/tiny-mce/tiny-mce.page.scss

@@ -0,0 +1,27 @@
+.left{
+    float: left;
+  }
+  .middle{
+    float: left;
+    padding-left: 5px !important;
+  }
+  .right{
+    float: right;
+    margin-left: auto;
+  }
+  
+  
+  .container-img {
+    background-image: url(/assets/gif/theme/gov/Blocks-loader.svg);
+    background-repeat: no-repeat;
+    background-position-x: center;
+    background-position-y: center;
+  }
+  
+  
+  @media only screen and (max-width: 650px) {
+  
+    .container-img {
+      background-size: 25%;
+    }
+  }

src/app/tiny-mce/tiny-mce.page.ts

@@ -1,5 +1,7 @@
 import { Component, OnInit } from '@angular/core';
-
+import { NavParams } from '@ionic/angular';
+import { EventDetailsDocumentsOptionsPage } from '../shared/popover/event-details-documents-options/event-details-documents-options.page';
+import { AlertController, ModalController } from '@ionic/angular';
 @Component({
   selector: 'app-tiny-mce',
   templateUrl: './tiny-mce.page.html',
@@ -7,12 +9,51 @@ import { Component, OnInit } from '@angular/core';
 })
 export class TinyMCEPage implements OnInit {
 
-  initialContent = '<h1>Hello, World!</h1><p>This is my HTML document.</p>';
+
+
+  title = '<h1>Hello, World!</h1><p>This is my HTML document.</p>';
+  Document: any
+  content: any
+  editorContent: string;
   
 
-  constructor() { }
+
+  constructor(
+    private navParams: NavParams,
+    private modalController: ModalController,
+    
+  ) {
+    this.Document = this.navParams.get('Document')
+    this.content = this.navParams.get('content')
+  }
 
   ngOnInit() {
   }
 
+  close() {
+    throw new Error('Method not implemented.');
+  }
+
+  somefunction() {
+    console.log(this.title)
+  }
+
+  async openOptions() {
+    const modal = await this.modalController.create({
+      component: EventDetailsDocumentsOptionsPage,
+      cssClass: 'model aside-modal search-submodal',
+      componentProps: {
+       /*  fulltask: this.task,
+        task: this.task */
+      }
+    });
+    await modal.present();
+
+    modal.onDidDismiss().then((res)=>{
+
+    
+
+    })
+  }
+
 }