añadida pagina para ver discoteca desde cliente

src/app/app-routing.module.ts

@@ -13,6 +13,10 @@ const routes: Routes = [
     path: 'tabs',
     loadChildren: () => import('./tabs/tabs.module').then(m => m.TabsPageModule)
   },
+  {
+    path: 'tabsUser',
+    loadChildren: () => import('./tabs-user/tabs-user.module').then(m => m.TabsUserPageModule)
+  },
   {
     path: 'view-evento',
     loadChildren: () => import('./view-evento/view-evento.module').then( m => m.ViewEventoPageModule)
@@ -26,6 +30,24 @@ const routes: Routes = [
     redirectTo: 'login',
     pathMatch: 'full'
   },
+  {
+    path: 'tabs-user',
+    loadChildren: () => import('./tabs-user/tabs-user.module').then( m => m.TabsUserPageModule)
+  },
+  {
+    path: 'feed',
+    loadChildren: () => import('./feed/feed.module').then( m => m.FeedPageModule)
+  },
+  {
+    path: 'view-evento-cliente',
+    loadChildren: () => import('./view-evento-cliente/view-evento-cliente.module').then( m => m.ViewEventoClientePageModule)
+  },
+  {
+    path: 'view-discoteca-cliente',
+    loadChildren: () => import('./view-discoteca-cliente/view-discoteca-cliente.module').then( m => m.ViewDiscotecaClientePageModule)
+  },
+
+
 
 
 

src/app/feed/feed-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { FeedPage } from './feed.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: FeedPage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class FeedPageRoutingModule {}

src/app/feed/feed.component.html

@@ -1,3 +0,0 @@
-<p>
-  feed works!
-</p>

src/app/feed/feed.component.ts

@@ -1,14 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-feed',
-  templateUrl: './feed.component.html',
-  styleUrls: ['./feed.component.scss'],
-})
-export class FeedComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit() {}
-
-}

src/app/feed/feed.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 { FeedPageRoutingModule } from './feed-routing.module';
+
+import { FeedPage } from './feed.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    FeedPageRoutingModule
+  ],
+  declarations: [FeedPage]
+})
+export class FeedPageModule {}

src/app/feed/feed.page.html

@@ -0,0 +1,35 @@
+<ion-header>
+  <ion-toolbar>
+    <ion-title>Eventos Próximos</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content>
+  <ion-grid>
+  <ion-row>
+    <ion-col size="12">
+    <div *ngIf="eventos.length>0" class="eventos">
+      <ion-list>
+          <ion-item *ngFor="let evento of eventos" button (click)="mostrarEvento(evento)">
+          <div class="evento">
+            <div class="eventoHeader">
+            {{evento.nombre}} · 
+            <ion-icon name="calendar-outline"></ion-icon>
+            {{evento.fecha}} · 
+            <ion-icon name="cash-outline"></ion-icon>
+            {{evento.precio1}},{{evento.precio2}}
+            </div>
+            <div class="eventoDesc">
+            {{evento.descripcion}}
+            </div>
+            <div class="discotecaEvento">
+              {{discotecas[idsDiscoteca.indexOf(evento.discotecaID)]?.nombre}}
+            </div>
+          </div>
+          </ion-item>
+      </ion-list>
+    </div>
+  </ion-col>
+  </ion-row>
+</ion-grid>
+</ion-content>

src/app/feed/feed.page.spec.ts

@@ -1,19 +1,19 @@
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { IonicModule } from '@ionic/angular';
 
-import { FeedComponent } from './feed.component';
+import { FeedPage } from './feed.page';
 
-describe('FeedComponent', () => {
-  let component: FeedComponent;
-  let fixture: ComponentFixture<FeedComponent>;
+describe('FeedPage', () => {
+  let component: FeedPage;
+  let fixture: ComponentFixture<FeedPage>;
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [ FeedComponent ],
+      declarations: [ FeedPage ],
       imports: [IonicModule.forRoot()]
     }).compileComponents();
 
-    fixture = TestBed.createComponent(FeedComponent);
+    fixture = TestBed.createComponent(FeedPage);
     component = fixture.componentInstance;
     fixture.detectChanges();
   }));

src/app/feed/feed.page.ts

@@ -0,0 +1,59 @@
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { Eventoi } from '../interfaces/eventoi';
+import { DiscotecaI } from '../interfaces/discoteca-i';
+import { ApiService } from '../services/api.service';
+import { FeedService } from '../services/feed.service';
+import { Tab1Service } from '../tab1/tab1.service';
+
+@Component({
+  selector: 'app-feed',
+  templateUrl: './feed.page.html',
+  styleUrls: ['./feed.page.scss'],
+})
+export class FeedPage implements OnInit {
+
+  eventos: Eventoi[];
+  discotecas: DiscotecaI[];
+  idsDiscoteca: number[];
+  constructor(private feedService:FeedService, private tab1Service: Tab1Service, private router:Router, private apiService: ApiService ) { }
+
+  ngOnInit() {
+    this.eventos = this.feedService.eventos;
+    this.idsDiscoteca = [];
+    this.discotecas=[];
+    this.getDiscotecasDistintas();
+  }
+
+  mostrarEvento(evento: Eventoi){
+
+    this.feedService.eventoIndex = this.eventos.indexOf(evento);
+    let discotecaDelEvento: DiscotecaI = this.discotecas[this.idsDiscoteca.indexOf(evento.discotecaID)];
+    this.feedService.discotecaEvento = discotecaDelEvento;
+    this.router.navigate(['/tabsUser/tab2/view-evento-cliente']);
+
+  }
+
+  getDiscotecasDistintas(){
+    this.eventos.forEach(
+      evento => {
+         if(!(this.idsDiscoteca.find(id => evento.discotecaID==id))){
+            this.idsDiscoteca.push(evento.discotecaID);
+        }
+      }
+    )
+
+    this.idsDiscoteca.forEach(
+      idDiscoteca => {
+        this.apiService.getUserDiscoteca(idDiscoteca)
+        .subscribe(discoteca => {
+          console.log(discoteca[0]);
+          this.discotecas.push(discoteca[0]);
+        })
+      }
+    )
+  }
+
+
+
+}

src/app/interfaces/eventoi.ts

@@ -6,7 +6,7 @@ export interface Eventoi {
     nombre: string,
     localizacion: string, 
     fecha: Date, 
-    hora: Time,
+    hora: Date,
     descripcion: string,
     precio1: number,
     precio2: number,

src/app/login/login.page.html

@@ -6,7 +6,7 @@
 
 <ion-content>
   <span>Usuario: </span><input type="text" id="username">
-  <span>Contraseña: </span><input type="text" id="password">
+  <span>Contraseña: </span><input type="password" id="password">
   <ion-button (click)="login()">
     Login
   </ion-button>

src/app/prompt-evento/prompt-evento.page.html

@@ -32,10 +32,10 @@
   <ion-item>
     <label>
       Hora
-      <ion-datetime displayFormat="HH:MM"placeholder="Elegir Hora" formControlName="hora"></ion-datetime>
+      <ion-datetime displayFormat="HH:mm"placeholder="Elegir Hora" formControlName="hora"></ion-datetime>
     </label>
     <span
-      *ngIf="hora.errors.required && submitted">
+      *ngIf="hora?.errors?.required && submitted">
       Tu evento necesita una hora
     </span>
   </ion-item>

src/app/prompt-evento/prompt-evento.page.ts

@@ -37,21 +37,7 @@ export class PromptEventoPage implements OnInit{
   onSubmit(){
     this.submitted = true;
     if (this.eventoForm.valid){
-      let evento: Eventoi = {
-        id: null,
-        discotecaID: this.tab1Service.discotecaI.discotecaID,
-        nombre: '',
-        localizacion: this.tab1Service.discotecaI.localizacion,
-        fecha: null,
-        hora: null,
-        descripcion: '',
-        precio1: null,
-        precio2: null
-
-
-      };
-      this.asignarEvento(evento);
-
+      this.asignarEvento(this.tab1Service.eventos[this.tab1Service.eventoIndex]);
     }
   }
   asignarEvento(evento: Eventoi){
@@ -60,28 +46,19 @@ export class PromptEventoPage implements OnInit{
     var fecha = this.eventoForm.get('fecha').value;
     fecha = fecha.split("T")[0];
     evento.fecha = fecha;
-    let hora = this.eventoForm.get('hora').value;
-    hora = hora.split("T")[1];
+    var hora = this.eventoForm.get('hora').value;
+    if (!this.tab1Service.editarEvento){
+      hora = hora.split("T")[1];}
     hora = hora.split(":")[0]+(":")+hora.split(":")[1];
+    console.log(hora);
     evento.hora = hora;
     evento.precio1 = this.eventoForm.get('precio1').value;
     evento.precio2 = this.eventoForm.get('precio2').value;
-    //evento.setDia(evento.getFecha()); el datetime de Ion devuelve un String, no se puede 
     if (!this.tab1Service.eventos){
-      this.tab1Service.initEventos();}
+      this.tab1Service.eventos=[];}
     if(!this.tab1Service.eventoForms){
       this.tab1Service.initEventoForms();}
-    if(this.tab1Service.editarEvento==true){
-      this.tab1Service.updateEvento(evento);
-      //this.tab1Service.eventos[this.tab1Service.eventoIndex] = evento;
-      //this.tab1Service.eventoForms[this.tab1Service.eventoIndex] = this.eventoForm;
-    }
-    else{
     this.tab1Service.postEvento(evento);
-      //this.tab1Service.eventos.push(evento);
-      //this.tab1Service.eventoForms.push(this.eventoForm);
-    }
-    
     }
     
   get nombre(){

src/app/services/feed.service.ts

@@ -1,5 +1,6 @@
 import { Injectable } from '@angular/core';
 import { Router } from '@angular/router';
+import { DiscotecaI } from '../interfaces/discoteca-i';
 import { Eventoi } from '../interfaces/eventoi';
 import { ApiService } from './api.service';
 
@@ -9,6 +10,8 @@ import { ApiService } from './api.service';
 export class FeedService {
 
   eventos: Eventoi[];
+  eventoIndex: number;
+  discotecaEvento: DiscotecaI;
 
   constructor(private apiService: ApiService, private router: Router) { }
 
@@ -16,7 +19,13 @@ export class FeedService {
     this.apiService.getEventos()
     .subscribe(eventos => {
       this.eventos = eventos;
-      
+      this.router.navigate(['/tabsUser'])
     })
   }
+
+  getEventoByIndex(eventoIndex: number):Eventoi{
+    return this.eventos[eventoIndex];
+  } 
+
+  
 }

src/app/tab1/tab1.service.ts

@@ -86,12 +86,7 @@ export class Tab1Service implements OnInit{
           precio2: new FormControl(null, Validators.required),
           descripcion: new FormControl(null, Validators.required),
       });
-      thisForm.controls['nombre'].setValue(evento.nombre);
-      thisForm.controls['fecha'].setValue(evento.fecha);
-      thisForm.controls['hora'].setValue(evento.hora);
-      thisForm.controls['precio1'].setValue(evento.precio1);
-      thisForm.controls['precio2'].setValue(evento.precio2);
-      thisForm.controls['descripcion'].setValue(evento.descripcion);
+      thisForm.patchValue(evento);
       this.eventoForms.push(thisForm);
       })
     }

src/app/tab2/tab2-routing.module.ts

@@ -1,11 +1,23 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
+import { FeedPage } from '../feed/feed.page';
 import { Tab2Page } from './tab2.page';
+import { ViewEventoClientePage } from '../view-evento-cliente/view-evento-cliente.page';
+import { ViewDiscotecaClientePage } from '../view-discoteca-cliente/view-discoteca-cliente.page';
 
 const routes: Routes = [
   {
     path: '',
-    component: Tab2Page,
+    component: FeedPage,
+
+  },
+  {
+    path: 'view-evento-cliente',
+    component: ViewEventoClientePage
+  },
+  {
+    path: 'view-discoteca-cliente',
+    component: ViewDiscotecaClientePage
   }
 ];
 

src/app/tab2/tab2.page.html

@@ -1,56 +0,0 @@
-<head>
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <meta charset="utf-8">
-  <meta name="keywords" content="">
-  <meta name="description" content="">
-  <meta name="page_type" content="np-template-header-footer-from-plugin">
-  <title>Página 1</title>
-  <link rel="stylesheet" href="nicepage.css" media="screen">
-<link rel="stylesheet" href="Página-1.css" media="screen">
-  <script class="u-script" type="text/javascript" src="jquery.js" defer=""></script>
-  <script class="u-script" type="text/javascript" src="nicepage.js" defer=""></script>
-  <meta name="generator" content="Nicepage 3.0.9, nicepage.com">
-  <link id="u-theme-google-font" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i|Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i">
-  
-  
-  
-  <meta property="og:title" content="Página 1">
-  <meta property="og:type" content="website">
-  <meta name="theme-color" content="#478ac9">
-  <link rel="canonical" href="index.html">
-  <meta property="og:url" content="index.html">
-</head>
-<body class="u-body">
-  <section class="u-clearfix u-section-1" id="sec-6396">
-    <div class="u-clearfix u-sheet u-sheet-1">
-      <div class="u-clearfix u-expanded-width u-layout-wrap u-layout-wrap-1">
-        <div class="u-layout">
-          <div class="u-layout-row">
-            <div class="u-size-30">
-              <div class="u-layout-col">
-                <div class="u-container-style u-layout-cell u-size-60 u-layout-cell-1">
-                  
-                  <div class="u-container-layout u-container-layout-1"></div>
-                </div>
-              </div>
-            </div>
-            <div class="u-size-30">
-              <div class="u-layout-col">
-                <div class="u-container-style u-layout-cell u-size-30 u-layout-cell-2">
-                  <div class="u-container-layout u-container-layout-2"></div>
-                </div>
-                <div class="u-container-style u-layout-cell u-size-30 u-layout-cell-3">
-                  <div class="u-container-layout u-container-layout-3"></div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </section>
-  
-  
-  
-  
-</body>

src/app/tab2/tab2.page.ts

@@ -1,12 +1,19 @@
-import { Component } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
+import { Eventoi } from '../interfaces/eventoi';
+import { FeedService } from '../services/feed.service';
 
 @Component({
   selector: 'app-tab2',
   templateUrl: 'tab2.page.html',
   styleUrls: ['tab2.page.scss']
 })
-export class Tab2Page {
+export class Tab2Page implements OnInit{
+
 
   constructor() {}
 
+  ngOnInit(){
+    
+  }
+
 }

src/app/tabs-user/tabs-user-routing.module.ts

@@ -0,0 +1,34 @@
+import { FullscreenOverlayContainer } from '@angular/cdk/overlay';
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { TabsUserPage } from './tabs-user.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: TabsUserPage,
+    children: [
+      {
+        path: 'tab2',
+        loadChildren: ()=> import('../tab2/tab2.module').then(m=>m.Tab2PageModule),
+      },
+
+      {
+        path: 'tab3',
+        loadChildren: ()=> import('../tab3/tab3.module').then(m=>m.Tab3PageModule),
+      },
+
+      {
+        path:'',
+        redirectTo: 'tab2',
+        pathMatch: 'full'
+      }
+    ]
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class TabsUserPageRoutingModule {}

src/app/tabs-user/tabs-user.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 { TabsUserPageRoutingModule } from './tabs-user-routing.module';
+
+import { TabsUserPage } from './tabs-user.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    TabsUserPageRoutingModule
+  ],
+  declarations: [TabsUserPage]
+})
+export class TabsUserPageModule {}

src/app/tabs-user/tabs-user.page.html

@@ -0,0 +1,17 @@
+<ion-tabs>
+
+  <ion-tab-bar slot="bottom">
+    <ion-tab-button tab="tab2">
+      <ion-icon name="search-outline"></ion-icon>
+      <ion-label>Feed</ion-label>
+    </ion-tab-button>
+
+    <ion-tab-button tab="tab3">
+      <ion-icon name="accessibility-outline"></ion-icon>
+      <ion-label>Me</ion-label>
+    </ion-tab-button>
+
+
+  </ion-tab-bar>
+
+</ion-tabs>

src/app/tabs-user/tabs-user.page.spec.ts

@@ -0,0 +1,24 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { TabsUserPage } from './tabs-user.page';
+
+describe('TabsUserPage', () => {
+  let component: TabsUserPage;
+  let fixture: ComponentFixture<TabsUserPage>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ TabsUserPage ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(TabsUserPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/tabs-user/tabs-user.page.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-tabs-user',
+  templateUrl: './tabs-user.page.html',
+  styleUrls: ['./tabs-user.page.scss'],
+})
+export class TabsUserPage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

src/app/tabs/tabs-routing.module.ts

@@ -11,14 +11,7 @@ const routes: Routes = [
         path: 'tab1',
         loadChildren: () => import('../tab1/tab1.module').then(m => m.Tab1PageModule),
       },
-      {
-        path: 'tab2',
-        loadChildren: () => import('../tab2/tab2.module').then(m => m.Tab2PageModule)
-      },
-      {
-        path: 'tab3',
-        loadChildren: () => import('../tab3/tab3.module').then(m => m.Tab3PageModule)
-      },
+
       {
         path: '',
         redirectTo: 'tab1',

src/app/tabs/tabs.page.html

@@ -2,19 +2,11 @@
 
   <ion-tab-bar slot="bottom">
     <ion-tab-button tab="tab1">
-      <ion-icon name="triangle"></ion-icon>
-      <ion-label>Tab 1</ion-label>
+      <ion-icon name="home-outline"></ion-icon>
+      <ion-label>Perfil</ion-label>
     </ion-tab-button>
 
-    <ion-tab-button tab="tab2">
-      <ion-icon name="ellipse"></ion-icon>
-      <ion-label>Tab 2</ion-label>
-    </ion-tab-button>
 
-    <ion-tab-button tab="tab3">
-      <ion-icon name="square"></ion-icon>
-      <ion-label>Tab 3</ion-label>
-    </ion-tab-button>
   </ion-tab-bar>
 
 </ion-tabs>

src/app/view-discoteca-cliente/view-discoteca-cliente-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { ViewDiscotecaClientePage } from './view-discoteca-cliente.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: ViewDiscotecaClientePage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class ViewDiscotecaClientePageRoutingModule {}

src/app/view-discoteca-cliente/view-discoteca-cliente.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 { ViewDiscotecaClientePageRoutingModule } from './view-discoteca-cliente-routing.module';
+
+import { ViewDiscotecaClientePage } from './view-discoteca-cliente.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    ViewDiscotecaClientePageRoutingModule
+  ],
+  declarations: [ViewDiscotecaClientePage]
+})
+export class ViewDiscotecaClientePageModule {}

src/app/view-discoteca-cliente/view-discoteca-cliente.page.html

@@ -0,0 +1,9 @@
+<ion-header>
+  <ion-toolbar>
+    <ion-title>view-discoteca-cliente</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content>
+
+</ion-content>

src/app/view-discoteca-cliente/view-discoteca-cliente.page.spec.ts

@@ -0,0 +1,24 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { ViewDiscotecaClientePage } from './view-discoteca-cliente.page';
+
+describe('ViewDiscotecaClientePage', () => {
+  let component: ViewDiscotecaClientePage;
+  let fixture: ComponentFixture<ViewDiscotecaClientePage>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ViewDiscotecaClientePage ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(ViewDiscotecaClientePage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/view-discoteca-cliente/view-discoteca-cliente.page.ts

@@ -0,0 +1,27 @@
+import { Component, OnInit } from '@angular/core';
+import { DiscotecaI } from '../interfaces/discoteca-i';
+import { Eventoi } from '../interfaces/eventoi';
+import { FeedService } from '../services/feed.service';
+
+@Component({
+  selector: 'app-view-discoteca-cliente',
+  templateUrl: './view-discoteca-cliente.page.html',
+  styleUrls: ['./view-discoteca-cliente.page.scss'],
+})
+export class ViewDiscotecaClientePage implements OnInit {
+
+  discoteca: DiscotecaI
+  eventos: Eventoi[]
+
+  constructor(private feedService: FeedService) { }
+
+  ngOnInit() {
+    this.discoteca = this.feedService.discotecaEvento;
+    this.feedService.eventos.forEach(evento => {
+      if (this.discoteca.discotecaID == evento.discotecaID){
+        this.eventos.push(evento);
+      }
+    })
+  }
+
+}

src/app/view-evento-cliente/view-evento-cliente-routing.module.ts

@@ -0,0 +1,22 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { ViewDiscotecaClientePage } from '../view-discoteca-cliente/view-discoteca-cliente.page';
+
+import { ViewEventoClientePage } from './view-evento-cliente.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: ViewEventoClientePage
+  },
+  {
+    path: 'view-discoteca-cliente',
+    component: ViewDiscotecaClientePage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class ViewEventoClientePageRoutingModule {}

src/app/view-evento-cliente/view-evento-cliente.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 { ViewEventoClientePageRoutingModule } from './view-evento-cliente-routing.module';
+
+import { ViewEventoClientePage } from './view-evento-cliente.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    ViewEventoClientePageRoutingModule
+  ],
+  declarations: [ViewEventoClientePage]
+})
+export class ViewEventoClientePageModule {}

src/app/view-evento-cliente/view-evento-cliente.page.html

@@ -0,0 +1,31 @@
+<ion-header>
+  <ion-toolbar>
+    <ion-title>ViewEvento</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content>
+  <ion-grid>
+      <div class="evento">
+        <ion-row>
+          <div class="eventoHeader">
+          {{evento.nombre}} · 
+          <ion-icon name="calendar-outline"></ion-icon>
+          {{evento.fecha}} · 
+          <ion-icon name="cash-outline"></ion-icon>
+          {{evento.precio1}},{{evento.precio2}}
+          </div>
+        </ion-row>
+        <ion-row>
+          <div class="eventoDesc">
+          {{evento.descripcion}}
+          </div>
+        </ion-row>
+        <ion-row>
+          <div class="discotecaEvento">
+            <a [routerLink]="['/tabsUser/tab2/view-discoteca-cliente']">{{discoteca?.nombre}}</a>
+          </div>
+        </ion-row>
+      </div>
+  </ion-grid>
+</ion-content>

src/app/view-evento-cliente/view-evento-cliente.page.scss

@@ -0,0 +1,3 @@
+.discotecaEvento{
+    padding: 40px;
+}

src/app/view-evento-cliente/view-evento-cliente.page.spec.ts

@@ -0,0 +1,24 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { IonicModule } from '@ionic/angular';
+
+import { ViewEventoClientePage } from './view-evento-cliente.page';
+
+describe('ViewEventoClientePage', () => {
+  let component: ViewEventoClientePage;
+  let fixture: ComponentFixture<ViewEventoClientePage>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ViewEventoClientePage ],
+      imports: [IonicModule.forRoot()]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(ViewEventoClientePage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  }));
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/view-evento-cliente/view-evento-cliente.page.ts

@@ -0,0 +1,22 @@
+import { Component, OnInit } from '@angular/core';
+import { DiscotecaI } from '../interfaces/discoteca-i';
+import { Eventoi } from '../interfaces/eventoi';
+import { FeedService } from '../services/feed.service';
+
+@Component({
+  selector: 'app-view-evento-cliente',
+  templateUrl: './view-evento-cliente.page.html',
+  styleUrls: ['./view-evento-cliente.page.scss'],
+})
+export class ViewEventoClientePage implements OnInit {
+
+  evento: Eventoi;
+  discoteca: DiscotecaI;
+  constructor(private feedService: FeedService) { }
+
+  ngOnInit() {
+    this.evento = this.feedService.getEventoByIndex(this.feedService.eventoIndex);
+    this.discoteca = this.feedService.discotecaEvento;
+  }
+
+}