XJC/src/app/components/opCommercial/scanner-carte/scanner-carte.component.html

<!--

<ul>
  <li *ngFor="let fil of filleulExistList | async">
    Filleuls: {{fil.firstname}} {{fil.familyname}}
  </li>
</ul>-->

<app-nav-commercant></app-nav-commercant>
<div class="container">
  <div class="col-md-12 wow fadeInLeft" id="scanPart1">
    <div class="card">
      <div class="card-block">
        <h5 class="mb-5 mt-1 font-bold wow fadeInDown text-center">Scanner Carte</h5>
        <!--<p class="text-center mb-4" style="padding-top: 2%;">Choisissez quelle type de fieulle voulez-vous scanner la carte</p>
        <form class="form-inline flex-center">
          <div class="md-form" style="padding-left: 2%;">
            <input name="group2" type="radio" class="with-gap" id="Newfilleul" value="Newfilleul"  (click)="initFilSelect()" [(ngModel)]="radioFilleul">
            <label for="Newfilleul">Nouveau Filleul</label>
          </div>
          <div class="md-form" style="padding-left: 2%;">
            <input name="group2" type="radio" class="with-gap" id="FilleulExist" value ="FilleulExist" (click)="initFilSelect()" [(ngModel)]="radioFilleul">
            <label for="FilleulExist">Filleul Existant</label>
          </div>
        </form>
         Si cest un nouveau filleul
        <div *ngIf="radioFilleul === 'Newfilleul'">
          <div class="md-form">
            <i class="fa fa-address-card prefix grey-text"></i>
            <input type="text" id="orangeForm-Familyname" [(ngModel)]="filleul.idCard" placeholder="ID carte">
          </div>
          <div class="md-form">
            <i class="fa fa-user prefix grey-text"></i>
            <input type="text" id="orangeForm-Familyname" [(ngModel)]="filleul.familyname" placeholder="Family name">
          </div>
          <div class="md-form">
            <i class="fa fa-user prefix grey-text"></i>
            <input type="text" id="orangeForm-Firstname" [(ngModel)]="filleul.firstname" placeholder="Firstname">
          </div>
          <form class="form-inline">
            <div class="md-form">
              <i class="fa fa-venus-mars prefix grey-text"></i>
              <input name="group3" type="radio" class="with-gap" id="homme" value="Homme" [(ngModel)]="filleul.sex">
              <label for="homme">Homme</label>
            </div>
            <div class="md-form" style="padding-left: 2%;">
              <input name="group3" type="radio" class="with-gap" id="femme" value="Femme" [(ngModel)]="filleul.sex">
              <label for="femme">Femme</label>
            </div>
          </form>
          <div class="md-form">
            <i class="fa fa-birthday-cake prefix grey-text"></i>
            <input type="date" id="orangeForm-Birthday" [(ngModel)]="filleul.birthday" placeholder="Birthday">
          </div>
          <div class="md-form">
            <i class="fa fa-envelope prefix grey-text"></i>
            <input type="email" id="orangeForm-email" [(ngModel)]="filleul.email" placeholder="Email" name="email" required pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$" #email="ngModel">
            <div *ngIf="email.errors && email.errors.pattern && (email.dirty || email.touched)"  class="alert alert-danger">
              Email is required and format should be <strong><i>john@filleul.fr</i></strong>.
            </div>
          </div>
          <label>
            En cliquant sur Créer un compte, vous acceptez nos Conditions
            et indiquez que vous aves lu notre Politique d'utilisation des
            données, y compris notre Utilisation des cookies.
          </label>
          <div class="text-center" style="margin-top:5%">
            <button class="btn btn-light-green waves-light" [disabled]="email.errors" (click)="registerNewFilleul()">Creer nouveau filleul & scanner carte</button>
            <button class="btn btn-cyan" (click)="goToOpComm()">Back</button>
          </div>
        </div>-->
        <!-- Fin Si cest un nouveau filleul -->

        <!-- Si cest un filleul existant -->
        <div *ngIf="true">

          <p *ngIf="filleulSelect != ''">Vous avez selectionné {{filleulSelect}}</p>


          <div class="md-form">
            <i class="fa fa-user prefix grey-text"></i>
            <input
              #queryF
              (keyup)="filter(queryF.value)"
              type="text" class="form-control" placeholder="Cherchez Filleul Existants...">

            <div *ngFor="let filleul of filteredFilleulsTest">
              <a (click)="getIdFilleul(filleul.uid)">{{filleul.firstname}} {{filleul.familyname}}</a>
            </div>
          </div>

          <button class="btn btn-light-green waves-light" (click)="filleulAnonymous()">Filleul anonyme ?</button>


          <p *ngIf="ParrainCarteSelect != ''">Vous avez selectionné {{ParrainCarteSelect}}</p>
          <div class="md-form">
            <i class="fa fa-address-card prefix grey-text"></i>
            <input
              #query
              (keyup)="filterCarte(query.value)"
              type="text" class="form-control" placeholder="Ecrivez le nom du parrain inscrit sur la carte...">
              <div *ngFor="let carte of filteredCartesTest">
                <a (click)="getIdParrainCarte(carte.parrainCarte.uid)">{{carte.parrainCarte.firstname}} {{carte.parrainCarte.familyname}}</a>
                <p>
                  Carte ID:
                  {{carte.uid}}
                </p>
              </div>
            <!--<input type="text" id="orangeForm-Familyname" placeholder="ID carte" [(ngModel)]="carteIDTemp">[(ngModel)]="filleul.idCard"-->
          </div>

          <label>
            En cliquant sur Créer un compte, vous acceptez nos Conditions
            et indiquez que vous aves lu notre Politique d'utilisation des
            données, y compris notre Utilisation des cookies.
          </label>
          <div class="text-center" style="margin-top:5%">

            <button class="btn btn-light-green waves-light" [disabled]="filleulSelect === '' || ParrainCarteSelect === '' || cartePar.status === 'Inactive'" (click)="scanCarteFil()"><i class="fa fa-shopping-basket ml-1"></i>Scanner Carte de {{filleulSelect}}</button>
            <button class="btn btn-cyan" (click)="goToOpComm()">Retour</button>
          </div>
        </div>
        <!-- Fin Si cest un filleul existant -->
      </div>
    </div>
  </div>

  <hr>

  <div class="card col-md-12 wow fadeInLeft" id="scanPart2">
    <h5 class="mb-5 mt-1 font-bold wow fadeInDown text-center">Liste des scans ({{(scanList | async)?.length}})</h5>
    <div class="row">
      <!--Grid column-->
      <!--*ngFor="let scan of scanList | async"-->
      <div class="col-lg-6 col-md-6" *ngFor="let scan of scanList | async">

        <!--Card-->
        <div class="card card-cascade wider">

          <!--Card image-->
          <div class="view gradient-card-header blue-gradient">
            <h2 class="h3-responsive mb-2">{{scan.operationCommercial.name}}</h2>
            <p class=""><i class="fa fa-calendar"></i>{{scan.dateCreation}}</p>

          </div>
          <!--/Card image-->

          <!--Card content-->
          <div class="card-body text-center">
            <p class="card-text mr-2 ml-2">Scan ID: {{scan.uid}}</p>
            <p class="card-text mr-2 ml-2">Carte ID: {{scan.carteParrainID}}</p>
            <p class="card-text mr-2 ml-2">Valeur Parrain: {{scan.valeurParrain  === ''? '0' : scan.valeurParrain}} €</p>
            <p class="card-text mr-2 ml-2">Valeur Filleul: {{scan.valeurFilleul  === ''? '0' : scan.valeurFilleul}} €</p>
          </div>
          <!--/.Card content-->

        </div>
        <!--/.Card-->

      </div>
    </div>

  </div>
</div>