Commit 1cab92fb by sawit

Edit form password

parent dcab6692
...@@ -227,24 +227,62 @@ ...@@ -227,24 +227,62 @@
</div> </div>
</div> </div>
<div class="xl:col-span-6 col-span-12" *ngIf="action !== 'edit'"> <!-- Change Password Section -->
<label for="password" class="form-label">{{'Password' | translate}}</label> <div class="xl:col-span-12 col-span-12" *ngIf="action === 'edit'">
<input type="password" class="form-control" id="password" placeholder="" [(ngModel)]="password"> <div class="flex justify-end">
<div class="text-danger" *ngIf="!password"> <button type="button" (click)="togglePasswordFields()" class="ti-btn ti-btn-link text-primary !p-0">
{{ 'Please fill in information' | translate }} {{ (showPasswordFields ? ('Cancel' | translate) : ('Change Password' | translate)) }}
</button>
</div> </div>
</div> </div>
<div class="xl:col-span-6 col-span-12" *ngIf="action !== 'edit'"> <!-- Unified password form for both add and edit -->
<label for="deal-title" class="form-label">{{'Confirm Password' | translate}}</label> <ng-container *ngIf="action === 'add' || (showPasswordFields && action === 'edit')">
<input type="password" class="form-control" id="deal-title" placeholder="" [(ngModel)]="confirmPassword"> <div class="xl:col-span-6 col-span-12">
<div class="text-danger" *ngIf="!confirmPassword"> <label class="form-label">{{'Password' | translate}}</label>
{{'Please fill in information' | translate}} <div class="relative">
<input *ngIf="action === 'add'" [type]="newPasswordVisible ? 'text' : 'password'" class="form-control" id="password" [placeholder]="'Password' | translate" [(ngModel)]="password">
<input *ngIf="action !== 'add'" [type]="newPasswordVisible ? 'text' : 'password'" class="form-control" id="newPassword" [placeholder]="'Enter new password' | translate" [(ngModel)]="newPassword">
<button type="button" class="absolute top-1/2 end-3 -translate-y-1/2" (click)="newPasswordVisible = !newPasswordVisible">
<i class="ri-eye-line" *ngIf="!newPasswordVisible"></i>
<i class="ri-eye-off-line" *ngIf="newPasswordVisible"></i>
</button>
</div>
<div class="text-danger" *ngIf="action === 'add' && !password">
{{ 'Please fill in information' | translate }}
</div>
<div class="text-danger" *ngIf="action !== 'add' && !newPassword">
{{ 'Please fill in information' | translate }}
</div>
<!-- <div class="text-danger text-xs mt-1" *ngIf="newPassword && newPassword.length < 8">
{{ 'Password must be at least 8 characters' | translate }}
</div> -->
</div> </div>
<div class="text-danger" *ngIf="confirmPassword && (confirmPassword != password)">
{{'Password Not Match' | translate}} <div class="xl:col-span-6 col-span-12">
<label class="form-label">{{'Confirm Password' | translate}}</label>
<div class="relative">
<input *ngIf="action === 'add'" [type]="confirmNewPasswordVisible ? 'text' : 'password'" class="form-control" id="confirmPassword" [placeholder]="'Confirm Password' | translate" [(ngModel)]="confirmPassword">
<input *ngIf="action !== 'add'" [type]="confirmNewPasswordVisible ? 'text' : 'password'" class="form-control" id="confirmNewPassword" [placeholder]="'Confirm new password' | translate" [(ngModel)]="confirmNewPassword">
<button type="button" class="absolute top-1/2 end-3 -translate-y-1/2" (click)="confirmNewPasswordVisible = !confirmNewPasswordVisible">
<i class="ri-eye-line" *ngIf="!confirmNewPasswordVisible"></i>
<i class="ri-eye-off-line" *ngIf="confirmNewPasswordVisible"></i>
</button>
</div>
<div class="text-danger" *ngIf="action === 'add' && !confirmPassword">
{{ 'Please fill in information' | translate }}
</div>
<div class="text-danger" *ngIf="action !== 'add' && !confirmNewPassword">
{{ 'Please fill in information' | translate }}
</div>
<div class="text-danger text-xs mt-1" *ngIf="action === 'add' && confirmPassword && (confirmPassword != password)">
{{'Password Not Match' | translate}}
</div>
<div class="text-danger text-xs mt-1" *ngIf="action !== 'add' && confirmNewPassword && (confirmNewPassword != newPassword)">
{{'Password Not Match' | translate}}
</div>
</div> </div>
</div> </ng-container>
<!-- <div class="xl:col-span-12 col-span-12"> <!-- <div class="xl:col-span-12 col-span-12">
<label for="companyDetail" class="form-label">{{'ข้อมูลบริษัท' | translate}}</label> <label for="companyDetail" class="form-label">{{'ข้อมูลบริษัท' | translate}}</label>
...@@ -287,52 +325,6 @@ ...@@ -287,52 +325,6 @@
</ng-select> </ng-select>
</div> </div>
<!-- Change Password Section -->
<div class="xl:col-span-12 col-span-12" *ngIf="action === 'edit'">
<hr class="my-4 border-gray-200 dark:border-white/10">
<div class="flex justify-end">
<button type="button" (click)="togglePasswordFields()" class="ti-btn ti-btn-link text-primary !p-0">
{{ (showPasswordFields ? ('Cancel' | translate) : ('Change Password' | translate)) }}
</button>
</div>
</div>
<ng-container *ngIf="showPasswordFields && action === 'edit'">
<div class="xl:col-span-6 col-span-12">
<label for="newPassword" class="form-label">{{'Password' | translate}}</label>
<div class="relative">
<input [type]="newPasswordVisible ? 'text' : 'password'" class="form-control" id="newPassword" placeholder="{{'Enter new password' | translate}}" [(ngModel)]="newPassword">
<button type="button" class="absolute top-1/2 end-3 -translate-y-1/2" (click)="newPasswordVisible = !newPasswordVisible">
<i class="ri-eye-line" *ngIf="!newPasswordVisible"></i>
<i class="ri-eye-off-line" *ngIf="newPasswordVisible"></i>
</button>
</div>
<div class="text-danger" *ngIf="!newPassword">
{{ 'Please fill in information' | translate }}
</div>
<!-- <div class="text-danger text-xs mt-1" *ngIf="newPassword && newPassword.length < 8">
{{ 'Password must be at least 8 characters' | translate }}
</div> -->
</div>
<div class="xl:col-span-6 col-span-12">
<label for="confirmNewPassword" class="form-label">{{'Confirm Password' | translate}}</label>
<div class="relative">
<input [type]="confirmNewPasswordVisible ? 'text' : 'password'" class="form-control" id="confirmNewPassword" placeholder="{{'Confirm new password' | translate}}" [(ngModel)]="confirmNewPassword">
<button type="button" class="absolute top-1/2 end-3 -translate-y-1/2" (click)="confirmNewPasswordVisible = !confirmNewPasswordVisible">
<i class="ri-eye-line" *ngIf="!confirmNewPasswordVisible"></i>
<i class="ri-eye-off-line" *ngIf="confirmNewPasswordVisible"></i>
</button>
</div>
<div class="text-danger" *ngIf="!confirmNewPassword">
{{ 'Please fill in information' | translate }}
</div>
<div class="text-danger text-xs mt-1" *ngIf="confirmNewPassword && (confirmNewPassword != newPassword)">
{{'Password Not Match' | translate}}
</div>
</div>
</ng-container>
</div> </div>
</div> </div>
<div class="ti-modal-footer"> <div class="ti-modal-footer">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment