mirror of
https://code.equilibrium.co.ao/ITO/doneit-web.git
synced 2026-04-19 04:57:52 +00:00
New action page and new publication page finished.
This commit is contained in:
Tiago Kayaya
@@ -1,9 +1,62 @@
|
||||
<ion-header>
|
||||
<ion-header class="ion-no-border">
|
||||
<ion-toolbar>
|
||||
<ion-title>new-action</ion-title>
|
||||
<div class="title-content">
|
||||
<div class="div-title">
|
||||
<ion-label class="title">Nova Ação</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<div class="ion-item-container">
|
||||
<ion-input placeholder="Assunto" ></ion-input>
|
||||
</div>
|
||||
|
||||
<div class="container-div">
|
||||
<div class="ion-item-class-2">
|
||||
<div class="ion-icon-class">
|
||||
<ion-icon slot="start" src="assets/images/icons-calendar.svg"></ion-icon>
|
||||
</div>
|
||||
<div class="ion-input-class">
|
||||
<ion-datetime
|
||||
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">
|
||||
<div class="ion-icon-class">
|
||||
<ion-icon slot="start" src="assets/images/icons-description.svg"></ion-icon>
|
||||
</div>
|
||||
<div class="ion-textarea-class">
|
||||
<ion-textarea rows="3" cols="20" placeholder="Descrição da ação..."></ion-textarea>
|
||||
</div>
|
||||
</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>Criar</ion-label>
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
</ion-footer>
|
||||
|
||||
@@ -0,0 +1,67 @@
|
||||
|
||||
ion-content{
|
||||
--background: transparent;
|
||||
transform: translate3d(0, 5px, 0);
|
||||
}
|
||||
ion-toolbar{
|
||||
--padding-top: 15px;
|
||||
--background: transparent;
|
||||
border-width: 0 !important;
|
||||
}
|
||||
.title-content{
|
||||
width: 360px;
|
||||
margin: 0px auto;
|
||||
overflow: auto;
|
||||
padding: 0 !important;
|
||||
}
|
||||
.div-title{
|
||||
width: 221px;
|
||||
/* padding: 0!important; */
|
||||
float: left;
|
||||
margin: 5px 0 0 5px;
|
||||
}
|
||||
.title{
|
||||
font-size: 25px;
|
||||
}
|
||||
.container-div{
|
||||
margin-bottom: 15px;
|
||||
overflow: auto;
|
||||
}
|
||||
.ion-item-container{
|
||||
width: 360px;
|
||||
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{
|
||||
width: 360px;
|
||||
margin: 0px auto;
|
||||
}
|
||||
.ion-icon-class{
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
float: left;
|
||||
padding: 10px;
|
||||
font-size: 25px;
|
||||
}
|
||||
.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;
|
||||
}
|
||||
@@ -1,4 +1,5 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { ModalController } from '@ionic/angular';
|
||||
|
||||
@Component({
|
||||
selector: 'app-new-action',
|
||||
@@ -7,9 +8,17 @@ import { Component, OnInit } from '@angular/core';
|
||||
})
|
||||
export class NewActionPage implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
constructor(
|
||||
private modalController: ModalController,
|
||||
) { }
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
save(){
|
||||
console.log('Salvar...');
|
||||
}
|
||||
close(){
|
||||
this.modalController.dismiss();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -1,9 +1,64 @@
|
||||
<ion-header>
|
||||
<ion-header class="ion-no-border">
|
||||
<ion-toolbar>
|
||||
<ion-title>new-publication</ion-title>
|
||||
<div class="title-content">
|
||||
<div class="div-title">
|
||||
<ion-label class="title">{{publicationTitle}}</ion-label>
|
||||
</div>
|
||||
</div>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
|
||||
<ion-content>
|
||||
<div *ngIf="publicationType=='2'" class="ion-item-container">
|
||||
<ion-input placeholder="Título" ></ion-input>
|
||||
</div>
|
||||
|
||||
<div *ngIf="publicationType=='2'" class="container-div">
|
||||
<div class="ion-item-class-2">
|
||||
<div class="ion-icon-class">
|
||||
<ion-icon slot="start" src="assets/images/icons-description.svg"></ion-icon>
|
||||
</div>
|
||||
<div class="ion-textarea-class">
|
||||
<ion-textarea rows="6" cols="20" placeholder="Corpo de texto..."></ion-textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="ion-item-container-no-border">
|
||||
<ion-label>
|
||||
<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>
|
||||
<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>
|
||||
|
||||
</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>Criar</ion-label>
|
||||
</ion-button>
|
||||
</ion-buttons>
|
||||
</ion-toolbar>
|
||||
</ion-footer>
|
||||
|
||||
@@ -0,0 +1,81 @@
|
||||
|
||||
ion-content{
|
||||
--background: transparent;
|
||||
transform: translate3d(0, 5px, 0);
|
||||
--padding-start: 20px;
|
||||
--padding-end: 20px;
|
||||
}
|
||||
ion-toolbar{
|
||||
--padding-top: 15px;
|
||||
--background: transparent;
|
||||
border-width: 0 !important;
|
||||
}
|
||||
.title-content{
|
||||
width: 360px;
|
||||
margin: 0px auto;
|
||||
overflow: auto;
|
||||
padding: 0 !important;
|
||||
}
|
||||
.div-title{
|
||||
width: 100%;
|
||||
float: left;
|
||||
margin: 5px 0 0 5px;
|
||||
}
|
||||
.title{
|
||||
font-size: 25px;
|
||||
}
|
||||
.container-div{
|
||||
margin-bottom: 15px;
|
||||
overflow: auto;
|
||||
}
|
||||
.ion-item-container{
|
||||
width: 360px;
|
||||
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{
|
||||
width: 360px;
|
||||
margin: 0px auto;
|
||||
}
|
||||
.ion-icon-class{
|
||||
width: 45px;
|
||||
height: 45px;
|
||||
float: left;
|
||||
padding: 10px;
|
||||
font-size: 25px;
|
||||
}
|
||||
.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;
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
@@ -1,4 +1,5 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { ModalController, NavParams } from '@ionic/angular';
|
||||
|
||||
@Component({
|
||||
selector: 'app-new-publication',
|
||||
@@ -6,10 +7,32 @@ import { Component, OnInit } from '@angular/core';
|
||||
styleUrls: ['./new-publication.page.scss'],
|
||||
})
|
||||
export class NewPublicationPage implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
publicationType:string;
|
||||
publicationTitle:string;
|
||||
constructor(
|
||||
private modalController: ModalController,
|
||||
private navParams: NavParams,
|
||||
) {
|
||||
this.publicationType = this.navParams.get('publicationType');
|
||||
this.publicationTitle = 'Nova Publicação';
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.setTitle();
|
||||
}
|
||||
save(){
|
||||
|
||||
}
|
||||
close(){
|
||||
this.modalController.dismiss();
|
||||
}
|
||||
setTitle(){
|
||||
if(this.publicationType == '1'){
|
||||
this.publicationTitle = 'Nova Publicação Rápida'
|
||||
}
|
||||
else{
|
||||
this.publicationTitle = 'Nova Publicação'
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -21,7 +21,7 @@
|
||||
<ion-label class="title">Ações Presidenciais</ion-label>
|
||||
</div>
|
||||
<div class="div-icon">
|
||||
<ion-icon slot="end" src='assets/images/icons-add.svg'></ion-icon>
|
||||
<ion-icon (click)="AddPublicationFolder()" slot="end" src='assets/images/icons-add.svg'></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item" [routerLink]="['/publications/view-publications']">
|
||||
|
||||
@@ -1,4 +1,6 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { ModalController } from '@ionic/angular';
|
||||
import { NewActionPage } from './new-action/new-action.page';
|
||||
|
||||
@Component({
|
||||
selector: 'app-publications',
|
||||
@@ -7,9 +9,22 @@ import { Component, OnInit } from '@angular/core';
|
||||
})
|
||||
export class PublicationsPage implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
constructor(private modalController: ModalController,) { }
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
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();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -27,8 +27,8 @@
|
||||
<p class="item-content-date">12 de Janeiro</p>
|
||||
</div>
|
||||
<div class="actions-icon">
|
||||
<ion-icon slot="end" src='assets/images/icons-add-photo.svg'></ion-icon>
|
||||
<ion-icon slot="end" src='assets/images/icons-add.svg'></ion-icon>
|
||||
<ion-icon (click)="AddPublication('1')" slot="end" src='assets/images/icons-add-photo.svg'></ion-icon>
|
||||
<ion-icon (click)="AddPublication('2')" slot="end" src='assets/images/icons-add.svg'></ion-icon>
|
||||
</div>
|
||||
</div>
|
||||
<ion-list>
|
||||
|
||||
@@ -1,4 +1,6 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { ModalController } from '@ionic/angular';
|
||||
import { NewPublicationPage } from '../new-publication/new-publication.page';
|
||||
|
||||
@Component({
|
||||
selector: 'app-view-publications',
|
||||
@@ -7,9 +9,22 @@ import { Component, OnInit } from '@angular/core';
|
||||
})
|
||||
export class ViewPublicationsPage implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
constructor(private modalController: ModalController,) { }
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
async AddPublication(publicationType:any) {
|
||||
const modal = await this.modalController.create({
|
||||
component: NewPublicationPage,
|
||||
componentProps:{
|
||||
publicationType: publicationType,
|
||||
},
|
||||
cssClass: 'new-publication',
|
||||
backdropDismiss: false
|
||||
});
|
||||
await modal.present();
|
||||
modal.onDidDismiss();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user