File
|
images
|
Type : []
|
Default value : [
{
imageSrc: './assets/images/carousel-auth/orange-with-variant.png',
imageAlt: 'nature1',
},
{
imageSrc: './assets/images/carousel-auth/silver-modern-with-variant.png',
imageAlt: 'nature1',
},
]
|
|
|
|
isActive
|
Default value : false
|
|
|
import { CommonModule } from '@angular/common';
import { Component } from '@angular/core';
import { ReactiveFormsModule, FormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { RouterLink } from '@angular/router';
import { CarouselComponent } from 'src/app/shared/carousel/carousel.component';
@Component({
selector: 'bgui-create-users',
standalone: true,
imports: [
CommonModule,
CarouselComponent,
MatFormFieldModule,
ReactiveFormsModule,
MatInputModule,
MatButtonModule,
MatIconModule,
MatCheckboxModule,
RouterLink,
FormsModule,
],
templateUrl: './create-users.component.html',
styleUrl: './create-users.component.scss',
})
export class CreateUsersComponent {
name!: string;
lastName!: string;
email!: string;
password!: string;
ffPassword!: string;
images = [
{
imageSrc: './assets/images/carousel-auth/orange-with-variant.png',
imageAlt: 'nature1',
},
{
imageSrc: './assets/images/carousel-auth/silver-modern-with-variant.png',
imageAlt: 'nature1',
},
];
isActive = false;
register() {}
}
<!-- <section
class="fxt-template-animation fxt-template-layout20 imagedefont m-125 d-flex justify-content-center align-items-center">
<div class="container-fluid">
<div
[class.mat-elevation-z1]="!isActive"
class="row fxt-bg-color fxt-templateshadow-01">
<div class="row mt-5">
<div class="col"></div>
<div class="col-4">
<div class="card shadow">
<div class="card-body">
<form>
<div class="mb-3">
<h4 class="text-dark text-muted">Ajouter un Utilisateur</h4>
</div>
<div class="mb-3">
<label for="exampleInputName" class="form-label">Nom</label>
<input
type="text"
class="form-control"
name="name"
[(ngModel)]="name" />
</div>
<div class="mb-3">
<label for="exampleInputLastName" class="form-label"
>Prenoms</label
>
<input
type="text"
class="form-control"
name="lastName"
[(ngModel)]="lastName" />
</div>
<div class="mb-3">
<label for="exampleInputEmail1" class="form-label"
>Email</label
>
<input
type="email"
class="form-control"
name="email"
[(ngModel)]="email" />
</div>
<div class="mb-3">
<label for="exampleInputPassword1" class="form-label"
>Password</label
>
<input
type="password"
class="form-control"
name="password"
[(ngModel)]="password" />
</div>
<div class="mb-3">
<label for="exampleInputPassword1" class="form-label"
>Confirmer mot de passe</label
>
<input
type="password"
class="form-control"
name="password"
[(ngModel)]="ffPassword" />
</div>
<button type="button" class="btn btn-info" (click)="register()">
S'enregistrer
</button>
<div class="row">
<div class="col-md-8"></div>
</div>
</form>
</div>
</div>
</div>
<div class="col"></div>
</div>
</div>
</div>
</section> -->
<div class="content sm-gutter">
<div class="row">
<div class="col-md-12 col-vlg-12 m-b-10">
<div class="row-fluid">
<div class="span12">
<div class="grid simple">
<div class="card">
<div class="card-title">
<div class="card-body m-3">
<h5 class="mb-3">Ajouter Utilisateur</h5>
<form method="post">
<div class="row">
<div class="col-md-5 mb-2">
<input
type="text"
placeholder="Nom"
class="form-control"
name="first_name"
value=""
required="" />
</div>
<div class="col-md-5">
<input
type="text"
placeholder="Prénoms"
class="form-control"
name="last_name"
value=""
required="" />
</div>
<div class="col-md-5">
<input
type="email"
placeholder="Email"
class="form-control"
name="username"
value=""
required="" />
</div>
<div class="col-md-5">
<input
type="text"
placeholder="Mot de passe"
class="form-control"
name="password"
value=""
required="" />
</div>
<input
type="hidden"
class="form-control"
name="user_id"
value="2807" />
<input
type="hidden"
class="form-control"
name="id"
value="" />
<div class="col-md-12 row" style="margin-top: 30px">
<div class="col-md-3">
<label>
<input
type="checkbox"
name="access[]"
value="Transactions" />
Transactions
</label>
</div>
<div class="col-md-3">
<label>
<input
type="checkbox"
name="access[]"
value="Liste reversement" />
Liste reversement
</label>
</div>
<div class="col-md-3">
<label>
<input
type="checkbox"
name="access[]"
value="Demande de reversement" />
Demande de reversement
</label>
</div>
<div class="col-md-3">
<label>
<input
type="checkbox"
name="access[]"
value="Services" />
Services
</label>
</div>
<div class="col-md-3">
<label>
<input
type="checkbox"
name="access[]"
value="Intégrations" />
Intégrations
</label>
</div>
<div class="col-md-3">
<label>
<input
type="checkbox"
name="access[]"
value="Application android" />
Application android
</label>
</div>
<div class="col-md-3">
<label>
<input
type="checkbox"
name="access[]"
value="Compte associé" />
Compte associé
</label>
</div>
<div class="col-md-3">
<label>
<input
type="checkbox"
name="access[]"
value="Utilisateurs" />
Utilisateurs
</label>
</div>
<div class="col-md-3">
<label>
<input
type="checkbox"
name="access[]"
value="Mon profile" />
Mon profile
</label>
</div>
<div class="col-md-3">
<label>
<input
type="checkbox"
name="access[]"
value="Modifer" />
Modifer
</label>
</div>
<div class="col-md-3">
<label>
<input
type="checkbox"
name="access[]"
value="Mot de passe" />
Mot de passe
</label>
</div>
</div>
<div class="col-md-12 text-center">
<br />
<div class="card-title">
<button
id="add_ppci_other_user"
class="btn-round btn btn-primary btn-sm m-1">
Enregistrer <i class="fa fa-save"></i>
</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--
<form wire:submit.prevent="save" class="modal-content">
<input
type="hidden"
name="_token"
value="PN3yV71V0PnUv5xQGSpaHSOlUAPt5ZJ60AN2NWit" />
<div class="modal-header">
<h1 class="modal-title fs-5" id="exampleModalLabel">
Modifier l'utilisateur
</h1>
<button
type="button"
class="btn-close"
data-bs-dismiss="modal"
aria-label="Close"></button>
</div>
<div class="text-center" id="update-loader" style="display: none">
<div class="spinner-border" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
<div class="modal-body row" id="update-body">
<div class="mb-3 col-md-12">
<label for="lastname" class="form-label">Nom</label>
<input
wire:model="lastname"
type="text"
required=""
id="lastname"
class="form-control" />
</div>
<div class="mb-3 col-md-12">
<label for="firstname" class="form-label">Prénom(s)</label>
<input
wire:model="firstname"
type="text"
required=""
id="firstname"
class="form-control" />
</div>
<div class="mb-3 col-md-12">
<label for="email" class="form-label">Email</label>
<input
wire:model="email"
type="text"
required=""
id="email"
class="form-control" />
</div>
<div class="mb-3 col-md-12">
<label for="role" class="form-label">Rôle</label>
<select wire:model="role" required="" class="form-select" id="role">
<option value="67">Administrateur</option>
<option value="68">Finance Edition</option>
<option value="69">Finance Consultation</option>
<option value="70">Support & Assistance</option>
<option value="71">Exploitation historique transactions</option>
<option value="72">Exploitation historique paiement entrant</option>
</select>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-link" data-bs-dismiss="modal">
Retour
</button>
<button type="submit" class="btn btn-primary">
Modifier
<span wire:loading="" wire:target="save">
<svg
wire:id="ik25iNsobRi2FZQu80We"
width="38"
height="20"
viewBox="0 0 38 38"
xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient
x1="8.042%"
y1="0%"
x2="65.682%"
y2="23.865%"
id="a">
<stop stop-color="#fff" stop-opacity="0" offset="0%"></stop>
<stop
stop-color="#fff"
stop-opacity=".631"
offset="63.146%"></stop>
<stop stop-color="#fff" offset="100%"></stop>
</linearGradient>
</defs>
<g fill="none" fill-rule="evenodd">
<g transform="translate(1 1)">
<path
d="M36 18c0-9.94-8.06-18-18-18"
id="Oval-2"
stroke="url(#a)"
stroke-width="2">
<animateTransform
attributeName="transform"
type="rotate"
from="0 18 18"
to="60 18 18"
dur="0.9s"
repeatCount="indefinite"></animateTransform>
</path>
<circle fill="#fff" cx="36" cy="18" r="1">
<animateTransform
attributeName="transform"
type="rotate"
from="0 18 18"
to="360 18 18"
dur="0.9s"
repeatCount="indefinite"></animateTransform>
</circle>
</g>
</g>
</svg>
</span>
</button>
</div>
</form>
-->
<!-- Formulaire modal -->
<!-- <div class="display mt-n4">
<div
class="modal fade"
id="exampleModal"
tabindex="-1"
aria-labelledby="exampleModalLabel"
aria-hidden="true">
<div class="modal-dialog modal-xl">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-4" id="exampleModalLabel">
Ajouter un User
</h1>
</div>
<div class="modal-body">
<div class="row">
<div class="col-md-6 mb-2">
<input
type="text"
placeholder="Prénoms"
class="form-control"
name="last_name"
value=""
required="" />
</div>
<div class="col">
<input
type="text"
placeholder="Prénoms"
class="form-control"
name="last_name"
value=""
required="" />
</div>
<div class="col-md-6">
<input
type="text"
placeholder="Prénoms"
class="form-control"
name="last_name"
value=""
required="" />
</div>
<div class="col">
<input
type="text"
placeholder="Prénoms"
class="form-control"
name="last_name"
value=""
required="" />
</div>
<div class="col-md-6 mb-2">
<input
type="text"
placeholder="Prénoms"
class="form-control"
name="last_name"
value=""
required="" />
</div>
<div class="col">
<input
type="text"
placeholder="Prénoms"
class="form-control"
name="last_name"
value=""
required="" />
</div>
<div class="col-md-6 mb-2">
<input
type="text"
placeholder="Prénoms"
class="form-control"
name="last_name"
value=""
required="" />
</div>
<div class="col">
<input
type="text"
placeholder="Prénoms"
class="form-control"
name="last_name"
value=""
required="" />
</div>
</div>
</div>
<div class="modal-footer">
<button
type="button"
class="btn btn-secondary"
data-bs-dismiss="modal">
Close
</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
</div> -->
Legend
Html element with directive