Merge branch 'anis' of ssh://git.marbelium.com:10023/Viiciouss/XJC into thierry

src/app/app.module.ts

@@ -33,10 +33,12 @@ import { NavParrainComponent } from './components/navigationBar/nav-parrain/nav-
 
 import { AuthGuard } from './core/auth.guard';
 import { AuthService } from './services/auth/auth.service';
+import { NavAdminComponent } from './components/navigationBar/nav-admin/nav-admin.component';
 import { ListeOpCommercialComponent } from './components/admin/liste-op-commercial/liste-op-commercial.component';
 import { DemandeOpCommercialComponent } from './components/admin/demande-op-commercial/demande-op-commercial.component';
 
 
+
 @NgModule({
   declarations: [
     AppComponent,
@@ -55,6 +57,7 @@ import { DemandeOpCommercialComponent } from './components/admin/demande-op-comm
     CarteEnvoyerComponent,
     NavCommercantComponent,
     NavParrainComponent,
+    NavAdminComponent,
     ListeOpCommercialComponent,
     DemandeOpCommercialComponent
   ],

src/app/components/admin/demande-op-commercial/demande-op-commercial.component.html

@@ -1,3 +1,13 @@
-<p>
-  demande-op-commercial works!
-</p>
+<div class="container">
+<app-nav-admin></app-nav-admin>
+  <div class="col-md-12" id="demandes">
+    <h4 class="h5 text-center mb-4" style="padding-top: 5%;">Nouvelles demandes d'opérations</h4>
+  </div>
+  <hr>
+  <div class="col-md-12" id="historique">
+    <h4 class="h5 text-center mb-4" style="padding-top: 5%;">Historique des cartes rejeter</h4>
+  </div>
+
+
+</div>
+

src/app/components/admin/demande-op-commercial/demande-op-commercial.component.scss

@@ -0,0 +1,7 @@
+#demandes {
+  height: 50%;
+}
+
+#historique {
+  height: 50%;
+}

src/app/components/admin/liste-op-commercial/liste-op-commercial.component.html

@@ -1,3 +1,67 @@
-<p>
-  liste-op-commercial works!
-</p>
+<div class="container">
+
+  <!--
+<ul>
+  <li *ngFor="let op of opCommData | async">
+    Operation Commerciale: {{op.name}}
+  </li>
+</ul>
+<button (click)="goToCreaOpCom()">Nouvelle opération Commercial</button>
+<button (click)="goToProfil()">Back</button>
+-->
+  <app-nav-admin></app-nav-admin>
+  <h4 class="h5 text-center mb-4" style="padding-top: 5%;">Liste des operations commerciales</h4>
+  <div class="btn-block flex-center align-middle" style="padding-top: 2%;">
+    <!--<button class="btn btn-primary btn-rounded waves-light" id="nouvelleOp" (click)="goToCreaOpCom()">Nouvelle opération Commerciale</button>-->
+    <!--<button class="btn btn-primary btn-rounded waves-light" (click)="goToCarteEnvoyer()">Historique carte envoyer</button>-->
+    <!--<button class="btn btn-default btn-rounded waves-light" (click)="goToProfil()">Profil</button>-->
+  </div>
+  <div class="list-group">
+
+    <div class="card mainCard" *ngFor="let op of opCommData | async">
+      <div class="row" id="testt">
+        <div class="col-md-6 mb-1 subCard1" id="subCard1">
+          <img src="{{op.carteTemplate.downloadURL}}" id="image1" class="mx-auto d-block flex-center card-img-overlay" alt="Responsive image">
+          <div class="view">
+            <div class="row firstRow">
+              <div class="col-md-6 flex-center card-block cardPart1">{{commercant.commercialName}}</div>
+              <div class="col-md-6 flex-center card-block card-image mb-1 cardPart2 image2" [ngStyle]="{ 'background-image': 'url(' + commercant.image.downloadURL + ')'}">
+
+              </div>
+            </div>
+            <div class="row secondRow">
+              <div class="col-md-6 flex-center cardPart3"><p>{{op.name}}</p></div>
+              <div class="col-md-6 flex-center cardPart4"><p>{{op.uid}}</p></div>
+            </div>
+          </div>
+        </div>
+        <div class="col-md-6 card subCard2">
+          <div class="card-block row">
+            <div class="col-md-8" id="subCard2Part1">
+              <div id="opTitle">
+                <label>Operation Commerciale: {{op.name}}</label>
+              </div>
+              <div id="opAvantages">
+                <label>Avantage parrain: {{op.avantageParrain}}</label>
+                <label>Avantage filleul: {{op.avantageFilleul}}</label>
+              </div>
+              <div id="opLogs">
+                <label>Carte(s) envoyée(s): {{op.nbEnvoie}}</label>
+                <label>Carte(s) scannée(s): {{op.nbScan}}</label>
+                <label>Carte(s) débitée(s): {{op.nbDebiter}}</label>
+              </div>
+            </div>
+            <div class="col-md-2" id="subCard2Part2">
+              <button class="btn btn-outline-primary btn-rounded" (click)="goToEnCart(op.uid)">Envoyer</button>
+              <button class="btn btn-outline-default btn-rounded" (click)="goToScanCart(op.uid)">Scanner</button>
+              <button class="btn btn-outline-info btn-rounded" (click)="goToDebiterCart(op.uid)">Débiter</button>
+            </div>
+          </div>
+          <div class="card-block col-md-12" id="subCard2Part3">
+            <h100 class="float-right">Du {{op.dateDebut | date:'dd/MM/yyyy'}} au {{op.dateFin | date:'dd/MM/yyyy'}}</h100>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>

src/app/components/admin/liste-op-commercial/liste-op-commercial.component.scss

@@ -0,0 +1,86 @@
+.mainCard {
+  margin-top: 5%;
+  width: 100%;
+}
+
+.view {
+  height:102%;
+  width: 103%;
+}
+
+.container {
+  padding-top:5%;
+}
+
+.subCard1 {
+  height: auto;
+  background-color: white;
+  // background-repeat: no-repeat;
+  // background-size:20% auto;
+  // background-position : center;
+}
+
+.firstRow {
+  height: 50%;
+}
+
+.secondRow {
+  height: 50%;
+}
+
+
+.cardPart1 {
+  //background-color: red;
+}
+
+.cardPart2 {
+  //background-color: orange;
+  background-repeat: no-repeat;
+  background-size:50% auto;
+  background-position : center;
+}
+
+
+.cardPart3 {
+  //background-color: green;
+}
+
+.cardPart4 {
+  //background-color: yellow;
+}
+
+#subCard2Part1 {
+  padding-top: 5%;
+  display: flex;
+  flex-direction: column
+}
+
+#subCard2Part2 {
+  padding-top: 5%;
+}
+
+#subCard2Part3 {
+  padding-right: 5%;
+  padding-top: 0%;
+  padding-bottom: 1%;
+}
+
+#opTitle {
+  display: flex;
+  flex-direction: column
+}
+
+#opAvantages {
+  display: flex;
+  flex-direction: column;
+  padding-top: 2%;
+}
+
+#opLogs {
+  display: flex;
+  flex-direction: column;
+  padding-top: 5%;
+}
+
+
+

src/app/components/navigationBar/nav-admin/nav-admin.component.html

@@ -0,0 +1,31 @@
+<navbar SideClass="navbar navbar-expand-lg navbar-dark fixed-top scrolling-navbar indigo">
+  <logo>
+    <a class="logo navbar-brand waves-light" mdbRippleRadius><strong>ParrainApp</strong></a>
+  </logo>
+  <links>
+    <ul class="navbar-nav mr-auto">
+      <li class="nav-item active waves-light" [class.active]="validationOpLink.classList.contains('active')"> <a class="nav-link waves-light" #validationOpLink routerLink="/demandeOpCommercialAdmin" routerLinkActive="active">Validation d'opération</a></li>
+      <li class="nav-item active waves-light" [class.active]="listeOpLink.classList.contains('active')"> <a class="nav-link waves-light" #listeOpLink routerLink="/listOpCommercialAdmin" routerLinkActive="active">Liste des opérations</a></li>
+    </ul>
+
+
+    <!--      <li class="nav-item waves-light" mdbRippleRadius *ngIf="afficheLogout === true" >
+            <a class="nav-link"  (click)="logout()">Logout</a>
+          </li>
+    -->
+    <ul class="navbar-nav nav-flex-icons">
+      <li class="nav-item avatar">
+        <ul class="navbar-nav mr-auto">
+          <li class="nav-item waves-light" mdbRippleRadius>
+            <a class="nav-link dropdown-toggle waves-effect waves-light" id="navbarDropdownMenuLink-5" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><img src="{{avatarCommercant}}" class="circle-avatar img-fluid rounded-circle"></a>
+          </li>
+        </ul>
+      </li>
+      <li class="nav-item dropdown" dropdown>
+        <a dropdownToggle mdbRippleRadius type="button" class="nav-link dropdown-toggle waves-light" mdbRippleRadius>
+          {{nameCommercant}}<span class="caret"></span></a>
+      </li>
+    </ul>
+
+  </links>
+</navbar>

src/app/components/navigationBar/nav-admin/nav-admin.component.scss

@@ -0,0 +1,23 @@
+logo a, a:hover {
+  color: white;
+  text-decoration: none;
+  cursor: default;
+}
+
+logo a:hover {
+  color: white;
+  text-decoration: none;
+
+}
+
+.top-nav-collapse {
+  background-color: #82b1ff !important;
+}
+.navbar:not(.top-nav-collapse) {
+  background: transparent !important;
+}
+@media (max-width: 768px) {
+  .navbar:not(.top-nav-collapse) {
+    background: #82b1ff !important;
+  }
+}

src/app/components/navigationBar/nav-admin/nav-admin.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { NavAdminComponent } from './nav-admin.component';
+
+describe('NavAdminComponent', () => {
+  let component: NavAdminComponent;
+  let fixture: ComponentFixture<NavAdminComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ NavAdminComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(NavAdminComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/components/navigationBar/nav-admin/nav-admin.component.ts

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