Appointment/appointments_frontend
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bug fix

Browse Source
This commit is contained in:
surendar.m@watermelon.us 2023-04-11 10:04:07 +05:30
parent 8bc35ad306
commit 15694ecde1
24 changed files with 592 additions and 835 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

286
ng-seed/src/app/appoinment/appoinments/appoinments-list/appoinments-list.component.html
View File

@ -1,195 +1,107 @@
<!-- <h3>Appointment Details</h3>
<mat-form-field>
<mat-label>Filter</mat-label> <h3>Appointment Details</h3>
<input matInput (keyup)="applyFilter($event)" placeholder="Enter Text" #input> <mat-form-field style="width:30%">
<mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event.target.value)" placeholder="Type Here" #input>
</mat-form-field> </mat-form-field>
<div class="calender "> <!-- <div class="calender ">
<i style="font-size:24px" class="fa" [routerLink]="['/appoinment/calendar-list']">&#xf073;</i> <i style="font-size:24px" class="fa" [routerLink]="['/appoinment/calendar-list']">&#xf073;</i>
</div> </div> -->
<button mat-button (click)="openDialog('Add',{})" class="button">Add Appointment</button> <button mat-button (click)="openDialog('Add',{})" class="button">Add Appointment</button>
<mat-sidenav-container class="app-inner background-none shadow-none mail-db"> <mat-sidenav-container class="app-inner background-none shadow-none mail-db">
<div class="main-content" fxLayout="row" fxLayoutAlign="center start"> <ng-scrollbar class="scrollHV">
<div fxFlex.gt-sm="90" fxFlex.gt-xs="95" fxFlex="100"> <div class="main-content" fxLayout="row" fxLayoutAlign="center start">
<div class="messages-list material fullscreen"> <div fxFlex.gt-sm="90" fxFlex.gt-xs="95" fxFlex="100">
<mat-accordion> <div class="messages-list material fullscreen">
<mat-expansion-panel> <!-- <mat-accordion> -->
<mat-expansion-panel-header > <!-- <mat-expansion-panel>
<div class="example-container mat-elevation-z8 "> <mat-expansion-panel-header > -->
<table mat-table [dataSource]="appoinmentsList" #mytable class="my-table mat-elevation-z8 len-table"> <!-- <div class="example-container mat-elevation-z8 "> -->
<ng-container matColumnDef="Profile">
<th mat-header-cell *matHeaderCellDef class="font-color"> Profile </th>
<td mat-cell *matCellDef="let element"><img src="assets/images/profile.jpg" /> </td>
</ng-container>
<ng-container matColumnDef="ClientName">
<th mat-header-cell *matHeaderCellDef class="font-color"> Client Name </th>
<td mat-cell *matCellDef="let element"> {{element.customer[0].cusName || null }} </td>
<table mat-table [dataSource]="appointmentListSource" matSort *ngIf="appointmentListLength > 0" class="my-table mat-elevation-z8 len-table">
</ng-container>
<ng-container matColumnDef="datetime"> <!-- ID Column -->
<th mat-header-cell *matHeaderCellDef class="font-color">Appointment Date and Time</th> <!-- <ng-container matColumnDef="id">
<td mat-cell *matCellDef="let element">{{element.appoinmentDate | date:'dd-MMM-YYYY'}}, {{element.appoinmentSlots}} <mat-header-cell *matHeaderCellDef mat-sort-header> S.No </mat-header-cell>
</td> <mat-cell *matCellDef="let row; let i = index;"> {{row.id}} </mat-cell>
</ng-container> </ng-container> -->
<ng-container matColumnDef="phoneNo">
<th mat-header-cell *matHeaderCellDef class="font-color"> Mobile No </th> <!-- Progress Column -->
<td mat-cell *matCellDef="let element">{{element.customer[0].phoneNo}} </td> <ng-container matColumnDef="ClientName">
</ng-container> <mat-header-cell *matHeaderCellDef mat-sort-header> Client Name </mat-header-cell>
<mat-cell *matCellDef="let row"> {{row.customer[0].cusName || null }}</mat-cell>
</ng-container>
<!-- Name Column -->
<ng-container matColumnDef="datetime">
<mat-header-cell *matHeaderCellDef mat-sort-header> Date and Time </mat-header-cell>
<mat-cell *matCellDef="let row"> {{row.appoinmentDate | date:'dd-MMM-YYYY'}}, {{row.appoinmentSlots | date:'shortTime'}} </mat-cell>
</ng-container>
<!-- Color Column -->
<ng-container matColumnDef="phoneNo">
<mat-header-cell *matHeaderCellDef mat-sort-header> Mobile No </mat-header-cell>
<mat-cell *matCellDef="let row" > {{row.customer[0].phoneNo}} </mat-cell>
</ng-container>
<!-- Color Column -->
<ng-container matColumnDef="email"> <ng-container matColumnDef="email">
<th mat-header-cell *matHeaderCellDef class="font-color"> Email </th> <mat-header-cell *matHeaderCellDef mat-sort-header> Email </mat-header-cell>
<td mat-cell *matCellDef="let element"> {{element.customer[0].email}} </td> <mat-cell *matCellDef="let row" > {{row.customer[0].email}} </mat-cell>
</ng-container> </ng-container>
<ng-container matColumnDef="address">
<th mat-header-cell *matHeaderCellDef class="font-color">Client Address</th>
<td mat-cell *matCellDef="let element">{{element.customer[0].address_1}}, {{element.customer[0].city}}, {{element.customer[0].state}}, {{element.customer[0].pincode }}</td>
</ng-container>
<ng-container matColumnDef="status">
<th mat-header-cell *matHeaderCellDef class="font-color"> Status </th>
<td mat-cell *matCellDef="let element"><span style="font-weight: 700;" [ngStyle] = "{'color':element.status == '0' ? '#4caf50' : '#ffd740'}">{{element.status == 0 ? 'Booked':'Cancelled'}} </span></td>
</ng-container>
<ng-container matColumnDef="action">
<th mat-header-cell *matHeaderCellDef class="font-color"> Action </th>
<td mat-cell *matCellDef="let element" class="action-link"> <br>
<a (click)="openDialog('Update',element)"><span class="material-icons edit-color">edit</span></a>
<a (click)="confirmBox('Delete',element)"><span class="material-icons edit-color delete">delete</span></a>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</div>
<mat-paginator
#paginator
[pageSizeOptions]="pageSizes"
showFirstLastButtons
></mat-paginator>
</mat-expansion-panel-header>
</mat-expansion-panel>
</mat-accordion>
</div>
</div>
</div>
</mat-sidenav-container> -->
<mat-card class="p-2">
<div fxLayout="row wrap">
<div fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="50" fxFlex.lg="50" fxFlex.xl="50">
<h3>Appointment Details</h3>
</div>
<div fxFlex.xs="50" fxFlex.sm="50" fxFlex.md="50" fxFlex.lg="50" fxFlex.xl="50">
<div class="calender ">
<i style="font-size:24px" class="fa" [routerLink]="['/appoinment/calendar-list']">&#xf073;</i>
</div>
<button mat-button (click)="openDialog('Add',{})" class="button">Add Appointment</button> </div>
</div>
<!-- <mat-form-field>
<mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event)" placeholder="Enter Text" #input>
</mat-form-field> -->
<ng-data-table <!-- Color Column -->
[id]="'appoinmentsList.id'" <ng-container matColumnDef="address">
[title]="''" <mat-header-cell *matHeaderCellDef mat-sort-header> Client Address </mat-header-cell>
[items]="appoinmentsList" <mat-cell *matCellDef="let row"> {{row.customer[0].address_1}} <br> {{row.customer[0].city}} <br> {{row.customer[0].state}} </mat-cell>
[indexColumnTitle]="'#'" </ng-container >
[showIndexColumn]="false"
[indexColumnWidth]="10" <!-- Color Column -->
[minContentHeight]="200" <ng-container matColumnDef="status">
[minContentWidth]="900" <mat-header-cell *matHeaderCellDef mat-sort-header> Status </mat-header-cell>
[showHeader]="false" <mat-cell *matCellDef="let row"> <span style="font-weight: 700;" [ngStyle] = "{'color':row.status == '0' ? '#4caf50' : '#ffd740'}">{{row.status == 0 ? 'Booked':'Cancelled'}} </span> </mat-cell>
[pageable]="true" </ng-container>
[showRefreshButton]="false"
[persistTableState]="false" <!-- Color Column -->
[showColumnSelector]="false" <ng-container matColumnDef="action">
[showLoadingSpinner]="false"> <mat-header-cell *matHeaderCellDef mat-sort-header> Action </mat-header-cell>
<ng-data-table-column <mat-cell *matCellDef="let row">
[field]="''" <a (click)="openDialog('Update',row)"><span class="material-icons edit-color">edit</span></a>
[title]="'Profile'" <a (click)="confirmBox('Delete',row)"><span class="material-icons edit-color delete">delete</span></a>
[width]="60"> </mat-cell>
<ng-template #ngDataTableCell let-row="row"> </ng-container>
<td>
<span><img src="assets/images/profile.jpg" /></span> <mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></mat-header-row>
</td> <mat-row *matRowDef="let row; columns: displayedColumns;">
</ng-template> </mat-row>
</ng-data-table-column>
<ng-data-table-column </table>
[field]="'cusName'" <mat-card *ngIf="isLoading" style="display: flex; justify-content: center; align-items: center">
[title]="'Client Name'" <mat-progress-spinner
[width]="100"> color="primary"
<ng-template #ngDataTableCell let-row="row"> mode="indeterminate">
<td> </mat-progress-spinner>
<span>{{row.item.customer[0].cusName}}</span> </mat-card>
</td> <div [hidden]="recordStatus">
</ng-template> <mat-paginator #paginator class="mat-elevation-z1" [length]="appointmentListLength" [pageIndex]="pageIndex" [pageSize]="pageSize"
</ng-data-table-column> [pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons>
<ng-data-table-column </mat-paginator>
[field]="''" </div>
[title]="'Date and Time'" <!-- </div> -->
[filterable]="false" <!-- </mat-expansion-panel-header>
[width]="100"> </mat-expansion-panel> -->
<ng-template #ngDataTableCell let-row="row"> <!-- </mat-accordion> -->
<td>
<span>{{row.item.appoinmentDate | date:'dd-MMM-YYYY'}},<br> {{row.item.appoinmentSlots | date:'shortTime'}}</span> <mat-card-content *ngIf="recordStatus">
</td> <h5 align="center" style="font-weight: bold;
</ng-template> color: brown;">No Data Available</h5>
</ng-data-table-column> </mat-card-content>
<ng-data-table-column </div>
[field]="''" </div>
[title]="'Mobile No'" </div>
[filterable]="false" </ng-scrollbar>
[width]="100"> </mat-sidenav-container>
<ng-template #ngDataTableCell let-row="row">
<td>
<span>{{row.item.customer[0].phoneNo}}</span>
</td>
</ng-template>
</ng-data-table-column>
<ng-data-table-column
[field]="''"
[title]="'Email'"
[filterable]="false"
[width]="100">
<ng-template #ngDataTableCell let-row="row">
<td>
<span>{{row.item.customer[0].email}}</span>
</td>
</ng-template>
</ng-data-table-column>
<ng-data-table-column
[field]="''"
[title]="'Address'"
[filterable]="false"
[width]="150">
<ng-template #ngDataTableCell let-row="row">
<td>
<span>{{row.item.customer[0].address_1}}, {{row.item.customer[0].city}}, {{row.item.customer[0].state}}, {{row.item.customer[0].pincode }}</span>
</td>
</ng-template>
</ng-data-table-column>
<ng-data-table-column
[field]="''"
[title]="'Status'"
[filterable]="false"
[width]="60">
<ng-template #ngDataTableCell let-row="row">
<td>
<span style="font-weight: 700;" [ngStyle] = "{'color':row.item.status == '0' ? '#4caf50' : '#ffd740'}">{{row.item.status == 0 ? 'Booked':'Cancelled'}} </span>
</td>
</ng-template>
</ng-data-table-column>
<ng-data-table-column
[field]="''"
[title]="'Action'"
[filterable]="false"
[width]="70">
<ng-template #ngDataTableCell let-row="row">
<td>
<a (click)="openDialog('Update',row.item)"><span class="material-icons edit-color">edit</span></a>
<a (click)="confirmBox('Delete',row.item)"><span class="material-icons edit-color delete">delete</span></a>
</td>
</ng-template>
</ng-data-table-column>
</ng-data-table>
</mat-card>
<notifier-container></notifier-container> <notifier-container></notifier-container>

412
ng-seed/src/app/appoinment/appoinments/appoinments-list/appoinments-list.component.scss
View File

@ -1,372 +1,114 @@
.my-table{ .my-table{
width: 100%; width: 100%;
}
.scrollHV {
height: calc(100vh - 0px);
} }
.button{ .button{
float: right; float: right;
background-color: #4caf50; background-color: #4caf50;
color: #ffff; color: #ffff;
} }
th.mat-header-cell, td.mat-cell, td.mat-footer-cell { th.mat-header-cell, td.mat-cell, td.mat-footer-cell {
padding: 6px; padding: 6px;
border-bottom-width: 1px; border-bottom-width: 1px;
border-bottom-style: solid; border-bottom-style: solid;
} }
.mat-expansion-panel-header { .mat-expansion-panel-header {
display: inline!important; display: inline!important;
} }
::ng-deep .mat-drawer-content { ::ng-deep .mat-drawer-content {
overflow: hidden!important; overflow: hidden!important;
background-color: #ffff; background-color: #ffff;
} }
// ::ng-deep .body-container { // ::ng-deep .body-container {
// overflow-x: hidden; // overflow-x: hidden;
// overflow-y: hidden!important; // overflow-y: hidden;
// background-color: #ffff; // background-color: #ffff;
// } // }
::ng-deep .mat-expansion-panel:not([class*='mat-elevation-z']) { ::ng-deep .mat-expansion-panel:not([class*='mat-elevation-z']) {
box-shadow: none!important; box-shadow: none!important;
} }
img { img {
width: 30px; width: 40px;
height: 30px; height: 40px;
border-radius: 50%; border-radius: 50%;
} }
.fullscreen{ .fullscreen{
position: absolute !important; position: absolute !important;
height: auto !important; height: auto !important;
top: 0; top: 0;
left: 0; left: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
} }
tr.mat-header-row { tr.mat-header-row {
height: 30px!important; height: 30px!important;
} }
.font-color{ .font-color{
font-weight: 600; font-weight: 600;
font-size: 14px; font-size: 14px;
} }
.edit-color{ .edit-color{
color: rgba(0, 0, 0, 0.54); color: rgba(0, 0, 0, 0.54);
} }
.edit-color:hover { .edit-color:hover {
color: #4caf50; color: #4caf50;
} }
.delete:hover { .delete:hover {
color:#ff0000; color:#ff0000;
} }
// ::ng-deep .mat-form-field-appearance-legacy .mat-form-field-wrapper { // ::ng-deep .mat-form-field-appearance-legacy .mat-form-field-wrapper {
// width: 180%; // width: 180%;
// } // }
::ng-deep .mat-content { ::ng-deep .mat-content {
display: block!important; display: block!important;
flex: 1; flex: 1;
/* flex-direction: row; */ /* flex-direction: row; */
/* overflow: hidden; */ /* overflow: hidden; */
overflow-x: auto!important; overflow-x: auto!important;
overflow-y: auto!important; overflow-y: auto!important;
}
.calender{
float: right;
margin-left: 1rem;
padding-top: 6px;
cursor: pointer;
}
::ng-deep .mat-paginator {
margin-top: -22px!important;
} }
::ng-deep .mat-select-arrow { ::ng-deep .mat-select-arrow {
margin: 0 15px!important; margin: 0 15px!important;
} }
::ng-deep tr.mat-row, tr.mat-footer-row { ::ng-deep .mat-paginator {
height: 80px!important; margin-top: -10px!important;
}
.label{
color: #111;
font-weight: 600;
margin-bottom: -9px;
white-space: nowrap;
margin-top: -12px;
} }
::ng-deep body.swal2-height-auto { ::ng-deep body.swal2-height-auto {
height: 100% !important height: 100% !important
}
.example-container {
display: block;
height: 365px;
/* overflow: auto; */
overflow-x: hidden;
overflow-y: auto;
}
::ng-deep .ng-data-table-container .ng-data-table-top-header-container{
min-height: 4rem !important;
background-color: #fff !important;
border: 0;
border-bottom: none;
}
::ng-deep .ng-data-table-container .ng-data-table-top-header-container .ng-data-table-top-header-title {
font-size: 24px;
line-height: 1.8rem;
color: black;
margin: 0;
} }
::ng-deep .ng-data-table-container .ng-data-table thead > tr > th{ .example-container {
color: #fff !important; display: block;
} height: 348px;
::ng-deep .ng-data-table-container .ng-data-table tbody > tr.row-even td { /* overflow: auto; */
background: #fff; overflow-x: hidden;
color: black; overflow-y: auto;
font-size: 12px;
font-family: Roboto, "Helvetica Neue", sans-serif;
line-height: 1.4rem;
}
::ng-deep .ng-data-table-container .ng-data-table tbody > tr.row-odd td {
background: #fff;
color: black;
font-size: 12px;
font-family: Roboto, "Helvetica Neue", sans-serif;
line-height: 1.4rem;
} }
.mat-table {
.align-left{ overflow: auto;
text-align: left !important; max-height: 500px;
} }
.align-center{
// text-align: center !important; .example-container {
text-align: -webkit-center !important; display: flex;
flex-direction: column;
} min-width: 300px;
.center2 { }
font-size: large;
margin-left: auto; .example-header {
margin-right: auto; min-height: 64px;
} padding: 8px 24px 0;
#delete{ }
color: black;
font-size: 20px; .mat-form-field {
} font-size: 14px;
#delete:hover{ width: 100%;
color: red; }
}
.align-right{ .mat-table {
text-align: right !important; overflow: auto;
} max-height: 500px;
::ng-deep :not(.dark-theme) .ng-data-table-container .ng-data-table tbody > tr.row-even td {
background: white;
border: 1px solid #000;
padding: 5px;
}
#my{
//zoom: 90%;
}
::ng-deep :not(.dark-theme) .ng-data-table-container .ng-data-table tbody > tr.row-odd td {
border: 1px solid #000;
}
::ng-deep :not(.dark-theme) .ng-data-table-container .ng-data-table-content-container .ng-data-table-content {
min-height: 100px !important;
}
::ng-deep :not(.dark-theme) .ng-data-table-container .ng-data-table thead > tr:last-child th {
color: white;
background-color:#1d7d67;
}
tr{
color: white;
background-color:#1d7d67;
}
th{
color: white;
background-color:#1d7d67;
}
* {
box-sizing: border-box;
}
.row {
display: flex;
background-color:#1d7d67;
}
/* Create two equal columns that sits next to each other */
.column {
flex: 50%;
// padding: 10px;
// height: 300px; /* Should be removed. Only for demonstration */
}
::ng-deep .mat-select-value{
color: black!important; }
.column1 {
width: 87px;
text-align: center;
text-overflow: ellipsis;
padding: 3px;
//height: 300px; /* Should be removed. Only for demonstration */
}
input {
text-align: right;
}
h2 {
padding-bottom: 10px;
display: block;
//transform: rotate(-90deg);
text-align: right;
margin-top: 13px;
}
::ng-deep :not(.dark-theme) .ng-data-table-container .ng-data-table-content-container .ng-data-table-content {
min-height: 41px !important;
}
header {
background: #1d7d67;
display: flex;
color: white;
padding-top: 13px;
height: 69px;
}
header:before,
header:after {
content: '';
margin: auto 1em;
border-bottom: solid 1px;
flex: 1;
}
h1 {
position: relative;
padding: 0.25em 1em;
overflow: hidden;
background: linear-gradient(currentcolor, currentcolor) no-repeat top center, linear-gradient(currentcolor, currentcolor) no-repeat bottom center;
background-size: calc(100% - 1.65em) 1px;
}
h1:before,
h1:after {
content: '';
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
border: solid 1px;
border-top: none;
border-bottom: none;
transform: skew(45deg)
}
h1:after {
transform: skew(-45deg)
}
header + header {
color:pink;
}
header + header + header {
color:gold;
}
a {
background-image: linear-gradient(
to right,
#1d7d67,
#1d7d67 50%,
);
background-size: 200% 100%;
background-position: -100%;
display: inline-block;
padding: 5px 0;
position: relative;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
transition: all 0.3s ease-in-out;
}
a:before{
content: '';
background: #1d7d67;
display: block;
position: absolute;
bottom: -3px;
left: 0;
width: 0;
height: 3px;
transition: all 0.3s ease-in-out;
}
a:hover {
background-position: 0;
}
a:hover::before{
width: 100%;
}
.center{
text-align: -webkit-center !important;
padding-left: 22px;
}
::ng-deep :not(.dark-theme) .ng-data-table-container .ng-data-table tbody > tr.row-odd td {
border: 1px solid #000;
padding: 5px !important
}
// .sticky {
// height: 64px;
// opacity: 1;
// transition: opacity .25s ease-out, height .15s ease;
// }
table, th, td {
//border: 1px solid black;
border-collapse: collapse;
}
.fixed-header {
position: fixed;
z-index:999;
height: 50px;
// width: 77%;
//max-width: auto;
}
#frugalmap {
height: 300px;
width: 100%;
top: 50px;
position: relative;
background: #2ab4c0;
}
.mat-elevation-z5 {
position: relative;
}
.sticky {
position: fixed;
top: 50px;
}
h4{
font: 400 12px/17px Roboto, "Helvetica Neue", sans-serif !important;
}
::ng-deep .ng-data-table-container .ng-data-table-pagination-container{
background: #008467 !important;
}
::ng-deep .ng-data-table-container .ng-data-table thead > tr .ng-data-table-column-header .ng-data-table-column-header-label {
font-size: 14px;
line-height: 4rem;
} }
::ng-deep .ng-data-table-container .ng-data-table tbody > tr.row-even:hover td{
color: #000;
}

108
ng-seed/src/app/appoinment/appoinments/appoinments-list/appoinments-list.component.ts
View File

@ -1,9 +1,11 @@
import { DatePipe } from '@angular/common'; import { DatePipe } from '@angular/common';
import { Component, OnInit, ViewChild } from '@angular/core'; import { Component, OnInit, ViewChild } from '@angular/core';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { MatPaginator } from '@angular/material/paginator'; import { MatPaginator, PageEvent } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { MatTable, MatTableDataSource } from '@angular/material/table'; import { MatTable, MatTableDataSource } from '@angular/material/table';
import { NotifierService } from 'angular-notifier'; import { NotifierService } from 'angular-notifier';
import { environment } from 'environments/environment';
import Swal from 'sweetalert2'; import Swal from 'sweetalert2';
import { AppointmentsService } from '../appointments-service/appointments.service'; import { AppointmentsService } from '../appointments-service/appointments.service';
import { DialogBoxComponent } from '../dialog-box/dialog-box.component'; import { DialogBoxComponent } from '../dialog-box/dialog-box.component';
@ -31,45 +33,80 @@ export interface UsersData {
export class AppoinmentsListComponent implements OnInit { export class AppoinmentsListComponent implements OnInit {
push: any; push: any;
displayedColumns: string[] = ['Profile', 'ClientName','datetime','phoneNo','email','address','status', 'action']; displayedColumns: string[] = ['ClientName','datetime','phoneNo','email','address','status', 'action'];
// dataSource: any; public appointmentListLength: number;
public appoinmentsList:any = new MatTableDataSource(); @ViewChild(MatPaginator) paginator: MatPaginator;
// dataSource: any = new MatTableDataSource(ELEMENT_DATA); @ViewChild(MatSort) sort: MatSort;
@ViewChild(MatTable,{static:true}) table: MatTable<any>;
// @ViewChild(MatPaginator) paginator: MatPaginator;
recordStatus: boolean; recordStatus: boolean;
@ViewChild(MatTable,{static:true}) table: MatTable<any>
// pagination variable details
length = 5;
pageIndex = 0;
pageSize = 5;
pageEvent: PageEvent;
appoinmentsList: any[] = [];
private apiUrl = environment.apiEndpoint;
// dataSource: any;
public appointmentListSource:any = new MatTableDataSource();
// dataSource: any = new MatTableDataSource(ELEMENT_DATA);
// @ViewChild(MatPaginator) paginator: MatPaginator;
addFormData: any; addFormData: any;
@ViewChild('paginator') paginator: MatPaginator;
@ViewChild('paginatorPageSize') paginatorPageSize: MatPaginator;
pageSizes = [3, 5, 7];
pipe = new DatePipe('en-US'); pipe = new DatePipe('en-US');
isLoading = true
constructor(private notifierService: NotifierService,public dialog: MatDialog, public _app:AppointmentsService) { } constructor(private notifierService: NotifierService,public dialog: MatDialog, public _app:AppointmentsService) { }
ngOnInit(): void { ngOnInit(): void {
// this.dataSource = new MatTableDataSource(ELEMENT_DATA) this.recordStatus=false;
this.getAppoinmentsList() this.getAppoinmentsList()
} }
ngAfterViewInit() {
this.appointmentListSource.paginator = this.paginator;
console.log(this.appointmentListSource,this.paginator)
this.appointmentListSource.sort = this.sort;
}
applyFilter(filterValue: string) {
filterValue = filterValue.trim(); // Remove whitespace
filterValue = filterValue.toLowerCase(); // Datasource defaults to lowercase matches
this.appointmentListSource.filter = filterValue;
console.log(this.appointmentListSource)
}
getAppoinmentsList() { getAppoinmentsList() {
//this._pd.getTabStatusPdDetails(this.tabStatus) //this._pd.getTabStatusPdDetails(this.tabStatus)
this._app.getAppoinmentsListDetails().subscribe(res => { this._app.getAppoinmentsListDetails().subscribe(res => {
if (res.status == 200) {
this.appoinmentsList = res.data; if (res.status == 200) {
let user_role = localStorage.getItem('user_role'); this.isLoading = false
if(user_role == 'PRACTITIONER'){ this.appoinmentsList = res.data;
let id = localStorage.getItem('user_id')
console.log(id)
this.appoinmentsList
console.log(this.appoinmentsList) console.log(this.appoinmentsList)
this.appointmentListLength = res.data.length;
let filter = this.appoinmentsList.filter(arr=>{return arr["ServicesMapDetail.userId"] == id}) console.log(this.appointmentListLength)
console.log(filter) this.appointmentListSource['data'] = this.appoinmentsList;
this.appoinmentsList = filter console.log(this.appointmentListSource)
} this.recordStatus=false;
}
else{ let user_role = localStorage.getItem('user_role');
if(user_role == 'PRACTITIONER'){
} let id = localStorage.getItem('user_id')
}) console.log(id)
this.appointmentListSource
console.log(this.appointmentListSource)
let filter = this.appointmentListSource['data'].filter(arr=>{return arr["ServicesMapDetail.userId"] == id})
console.log(filter)
this.appointmentListSource['data'] = filter
this.appointmentListLength = filter.length;
}
}
else{
this.appoinmentsList=[];
this.appointmentListLength= null;
this.recordStatus=true;
}
}, error => this.isLoading = false)
// let param ={'userId':"5" // let param ={'userId':"5"
// } // }
// this._app.getServicesMapDetails(param).subscribe(res => { // this._app.getServicesMapDetails(param).subscribe(res => {
@ -86,18 +123,7 @@ export class AppoinmentsListComponent implements OnInit {
} }
ngAfterViewInit() {
this.appoinmentsList.paginator = this.paginator;
this.appoinmentsList.paginator = this.paginatorPageSize;
}
applyFilter(event: Event) {
const filterValue = (event.target as HTMLInputElement).value;
this.appoinmentsList.filter = filterValue.trim().toLowerCase();
if (this.appoinmentsList.paginator) {
this.appoinmentsList.paginator.firstPage();
}
}
pageChange(e) { pageChange(e) {
console.log(e); console.log(e);
} }

10
ng-seed/src/app/appoinment/business/business-list/business-list.component.html
View File

@ -1,3 +1,4 @@
<h3>Business Details</h3> <h3>Business Details</h3>
<mat-form-field style="width:30%"> <mat-form-field style="width:30%">
<mat-label>Filter</mat-label> <mat-label>Filter</mat-label>
@ -6,6 +7,7 @@
<button mat-button (click)="openDialog('Add',{})" class="button">Add Business</button> <button mat-button (click)="openDialog('Add',{})" class="button">Add Business</button>
<!-- <div class="example-container mat-elevation-z8 "> --> <!-- <div class="example-container mat-elevation-z8 "> -->
<mat-sidenav-container class="app-inner background-none shadow-none mail-db"> <mat-sidenav-container class="app-inner background-none shadow-none mail-db">
<ng-scrollbar class="scrollHV">
<div class="main-content" fxLayout="row" fxLayoutAlign="center start"> <div class="main-content" fxLayout="row" fxLayoutAlign="center start">
<div fxFlex.gt-sm="90" fxFlex.gt-xs="95" fxFlex="100"> <div fxFlex.gt-sm="90" fxFlex.gt-xs="95" fxFlex="100">
<div class="messages-list material fullscreen"> <div class="messages-list material fullscreen">
@ -66,6 +68,12 @@
</mat-row> </mat-row>
</table> </table>
<mat-card *ngIf="isLoading" style="display: flex; justify-content: center; align-items: center">
<mat-progress-spinner
color="primary"
mode="indeterminate">
</mat-progress-spinner>
</mat-card>
<div [hidden]="recordStatus"> <div [hidden]="recordStatus">
<mat-paginator #paginator class="mat-elevation-z1" [length]="businessListLength" [pageIndex]="pageIndex" [pageSize]="pageSize" <mat-paginator #paginator class="mat-elevation-z1" [length]="businessListLength" [pageIndex]="pageIndex" [pageSize]="pageSize"
[pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons> [pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons>
@ -83,7 +91,7 @@
</div> </div>
</div> </div>
</div> </div>
</ng-scrollbar>
</mat-sidenav-container> </mat-sidenav-container>
<notifier-container></notifier-container> <notifier-container></notifier-container>

3
ng-seed/src/app/appoinment/business/business-list/business-list.component.scss
View File

@ -1,6 +1,9 @@
.my-table{ .my-table{
width: 100%; width: 100%;
} }
.scrollHV {
height: calc(100vh - 0px);
}
.button{ .button{
float: right; float: right;
background-color: #4caf50; background-color: #4caf50;

11
ng-seed/src/app/appoinment/business/business-list/business-list.component.ts
View File

@ -33,7 +33,7 @@ export class BusinessListComponent implements OnInit {
pageEvent: PageEvent; pageEvent: PageEvent;
businessList: any[] = []; businessList: any[] = [];
private apiUrl = environment.apiEndpoint; private apiUrl = environment.apiEndpoint;
isLoading = true
constructor(private notifierService: NotifierService,private router:Router,public dialog: MatDialog,public _bus:BusinessService) { constructor(private notifierService: NotifierService,private router:Router,public dialog: MatDialog,public _bus:BusinessService) {
} }
@ -59,6 +59,7 @@ export class BusinessListComponent implements OnInit {
//this._pd.getTabStatusPdDetails(this.tabStatus) //this._pd.getTabStatusPdDetails(this.tabStatus)
this._bus.getBusinessListDetails().subscribe(res => { this._bus.getBusinessListDetails().subscribe(res => {
if (res.status == 200) { if (res.status == 200) {
this.isLoading = false
this.businessList = res.data; this.businessList = res.data;
console.log(this.businessList) console.log(this.businessList)
this.businessListLength = res.data.length; this.businessListLength = res.data.length;
@ -72,13 +73,7 @@ export class BusinessListComponent implements OnInit {
this.businessListLength= null; this.businessListLength= null;
this.recordStatus=true; this.recordStatus=true;
} }
} }, error => this.isLoading = false);
// , error => {this.errorMessage = <any> error});
,error => {
// this.errorMessage.push(error);
// this.notifier.notify('error', 'Something Went Wrong Try Again.! \t\"' + (error.error_type == 2 ? error.error_status + ' ( ' + error.error_text + ' ) ' : ' ( ' + error.error_text + ' ) ') +'\" Error Occur.!');
// alert(error.html_format);
})
} }

17
ng-seed/src/app/appoinment/customers/add-customers/add-customers.component.html
View File

@ -13,17 +13,20 @@
</mat-form-field> </mat-form-field>
<mat-form-field appearance="outline" *ngIf="action != 'Delete'; else elseTemplate" class="mat-pane"> <mat-form-field appearance="outline" *ngIf="action != 'Delete'; else elseTemplate" class="mat-pane">
<input placeholder=" Email" matInput [(ngModel)]="local_data.email" formControlName="email"> <input type="email" placeholder=" Email" matInput [(ngModel)]="local_data.email" formControlName="email">
<mat-error *ngIf="!form.get('email')?.errors?.required && (form.get('email')?.errors?.pattern)"> <mat-error *ngIf="!form.get('email')?.errors?.required && (form.get('email')?.errors?.pattern)">
Please enter a valid email address Please enter a valid email address
</mat-error> </mat-error>
<mat-error *ngIf="form.get('email')?.invalid && (form.get('email')?.dirty || form.get('email')?.touched) && form.get('email')?.errors?.required"> <mat-error *ngIf="myError('email', 'required')">email is required</mat-error>
Email is required <mat-error *ngIf="form.get('email')?.invalid && (form.get('email')?.dirty || form.get('email')?.touched) && form.get('email')?.errors?.required">
</mat-error> Email is required
</mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field appearance="outline" *ngIf="action != 'Delete'; else elseTemplate" class="mat-pane"> <mat-form-field appearance="outline" *ngIf="action != 'Delete'; else elseTemplate" class="mat-pane">
<input placeholder=" Phone" matInput [(ngModel)]="local_data.phoneNo" formControlName="phoneNo"> <input placeholder=" Phone" matInput [(ngModel)]="local_data.phoneNo" formControlName="phoneNo">
<mat-error *ngIf="myError('phoneNo', 'required')">Contact No is required</mat-error> <mat-error *ngIf="myError('phoneNo', 'required')">Contact No is required</mat-error>
<mat-error *ngIf="myError('phoneNo', 'pattern')">Invalid Contact No </mat-error>
<mat-error *ngIf="myError('phoneNo', 'minlength')"> Contact No must be at least 10 characters</mat-error>
<mat-error *ngIf="myError('phoneNo', 'maxlength')">Limit exceed</mat-error> <mat-error *ngIf="myError('phoneNo', 'maxlength')">Limit exceed</mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field appearance="outline" *ngIf="action != 'Delete'; else elseTemplate" class="mat-pane"> <mat-form-field appearance="outline" *ngIf="action != 'Delete'; else elseTemplate" class="mat-pane">

9
ng-seed/src/app/appoinment/customers/add-customers/add-customers.component.ts
View File

@ -50,7 +50,7 @@ export class AddCustomersComponent implements OnInit {
} }
ngOnInit() { ngOnInit() {
this.form = new FormGroup({ this.form = new FormGroup({
businessselect: new FormControl('', [Validators.required]), // businessselect: new FormControl('', [Validators.required]),
// image: new FormControl('', null), // image: new FormControl('', null),
cusName: new FormControl('', [Validators.required, Validators.maxLength(20)]), cusName: new FormControl('', [Validators.required, Validators.maxLength(20)]),
address_1: new FormControl('', [Validators.required, Validators.maxLength(50)]), address_1: new FormControl('', [Validators.required, Validators.maxLength(50)]),
@ -60,7 +60,8 @@ export class AddCustomersComponent implements OnInit {
email: new FormControl('', [Validators.required, Validators.email,Validators.pattern( email: new FormControl('', [Validators.required, Validators.email,Validators.pattern(
'[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,63}$', '[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,63}$',
),]), ),]),
phoneNo: new FormControl('', [Validators.required, Validators.maxLength(10)]), phoneNo: new FormControl('', [Validators.required, Validators.minLength(10),Validators.maxLength(10), Validators.pattern('^[0-9]{10}$')]),
}); });
this.form.patchValue(this.local_data) this.form.patchValue(this.local_data)
} }
@ -71,6 +72,10 @@ export class AddCustomersComponent implements OnInit {
console.log(this.form.value); console.log(this.form.value);
let tmp = this.form.value let tmp = this.form.value
tmp.id = this.local_data.id tmp.id = this.local_data.id
if (!this.form.valid) {
console.log("check")
return;
}
this.dialogRef.close({event:this.action,data:tmp}); this.dialogRef.close({event:this.action,data:tmp});
console.log(this.form.value); console.log(this.form.value);
console.log(this.action,this.local_data) console.log(this.action,this.local_data)

152
ng-seed/src/app/appoinment/customers/customers-list/customers-list.component.html
View File

@ -1,89 +1,95 @@
<h3>Customers Details</h3> <h3>Customers Details</h3>
<mat-form-field> <mat-form-field style="width:30%">
<mat-label>Filter</mat-label> <mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event)" placeholder="Ex. Mia" #input> <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Type Here" #input>
</mat-form-field> </mat-form-field>
<button mat-button (click)="openDialog('Add',{})" class="button">Add Customers</button> <!-- <div class="calender ">
<i style="font-size:24px" class="fa" [routerLink]="['/appoinment/calendar-list']">&#xf073;</i>
</div> -->
<button mat-button (click)="openDialog('Add',{})" class="button">Add customers</button>
<mat-sidenav-container class="app-inner background-none shadow-none mail-db"> <mat-sidenav-container class="app-inner background-none shadow-none mail-db">
<ng-scrollbar class="scrollHV">
<div class="main-content" fxLayout="row" fxLayoutAlign="center start"> <div class="main-content" fxLayout="row" fxLayoutAlign="center start">
<div fxFlex.gt-sm="90" fxFlex.gt-xs="95" fxFlex="100"> <div fxFlex.gt-sm="90" fxFlex.gt-xs="95" fxFlex="100">
<div class="messages-list material fullscreen"> <div class="messages-list material fullscreen">
<mat-accordion> <!-- <mat-accordion> -->
<mat-expansion-panel> <!-- <mat-expansion-panel>
<mat-expansion-panel-header > <mat-expansion-panel-header > -->
<div class="example-container mat-elevation-z8 "> <!-- <div class="example-container mat-elevation-z8 "> -->
<table mat-table [dataSource]="customersList" #mytable class="my-table mat-elevation-z8 len-table">
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef class="font-color"> S.NO </th>
<td mat-cell *matCellDef="let element" class="element-spc"> {{element.id}} </td>
</ng-container>
<!-- <ng-container matColumnDef="logo"> <table mat-table [dataSource]="customersListSource" matSort *ngIf="customersListLength > 0" class="my-table mat-elevation-z8 len-table">
<th mat-header-cell *matHeaderCellDef class="font-color"> Logo </th>
<td mat-cell *matCellDef="let element"> <img [src]="element.logo" /> </td> <!-- ID Column -->
</ng-container> --> <ng-container matColumnDef="id">
<mat-header-cell *matHeaderCellDef mat-sort-header> S.No </mat-header-cell>
<ng-container matColumnDef="name"> <mat-cell *matCellDef="let row; let i = index;"> {{row.id}} </mat-cell>
<th mat-header-cell *matHeaderCellDef class="font-color"> Name </th> </ng-container>
<td mat-cell *matCellDef="let element" class="element-spc"> {{element.cusName}} </td>
</ng-container> <!-- Progress Column -->
<ng-container matColumnDef="name">
<ng-container matColumnDef="email"> <mat-header-cell *matHeaderCellDef mat-sort-header>Name </mat-header-cell>
<th mat-header-cell *matHeaderCellDef class="font-color"> Email </th> <mat-cell *matCellDef="let row"> {{row.cusName}}</mat-cell>
<td mat-cell *matCellDef="let element"> {{element.email}} </td> </ng-container>
</ng-container>
<!-- Name Column -->
<ng-container matColumnDef="phone"> <ng-container matColumnDef="email">
<th mat-header-cell *matHeaderCellDef class="font-color"> Phone </th> <mat-header-cell *matHeaderCellDef mat-sort-header> Email </mat-header-cell>
<td mat-cell *matCellDef="let element"> {{element.phoneNo}} </td> <mat-cell *matCellDef="let row"> {{row.email}} </mat-cell>
</ng-container> </ng-container>
<ng-container matColumnDef="address" >
<th mat-header-cell *matHeaderCellDef class="font-color th-mat"> Address </th>
<td mat-cell *matCellDef="let element"> {{element.address_1}} <br> {{element.city}} <br> {{element.state}} </td>
</ng-container>
<!-- <ng-container matColumnDef="state">
<th mat-header-cell *matHeaderCellDef class="font-color"> State </th>
<td mat-cell *matCellDef="let element"> {{element.state}} </td>
</ng-container>
<ng-container matColumnDef="city"> <!-- Color Column -->
<th mat-header-cell *matHeaderCellDef class="font-color"> City </th> <ng-container matColumnDef="phone">
<td mat-cell *matCellDef="let element"> {{element.city}} </td> <mat-header-cell *matHeaderCellDef mat-sort-header> Mobile No </mat-header-cell>
</ng-container> <mat-cell *matCellDef="let row" > {{row.phoneNo}} </mat-cell>
</ng-container>
<ng-container matColumnDef="pincode"> <!-- Color Column -->
<th mat-header-cell *matHeaderCellDef class="font-color"> Pincode </th> <ng-container matColumnDef="address">
<td mat-cell *matCellDef="let element"> {{element.pincode}} </td> <mat-header-cell *matHeaderCellDef mat-sort-header> Address </mat-header-cell>
</ng-container> --> <mat-cell *matCellDef="let row"> {{row.address_1}} <br> {{row.city}} <br> {{row.state}} </mat-cell>
</ng-container >
<ng-container matColumnDef="action">
<th mat-header-cell *matHeaderCellDef class="font-color"> Action </th> <!-- Color Column -->
<td mat-cell *matCellDef="let element" class="action-link"> <ng-container matColumnDef="action">
<a (click)="openDialog('Update',element)"><span class="material-icons edit-color">edit</span></a> <mat-header-cell *matHeaderCellDef mat-sort-header> Action </mat-header-cell>
<a (click)="confirmBox('Delete',element)"><span class="material-icons edit-color delete">delete</span></a> <mat-cell *matCellDef="let row">
</td> <a (click)="openDialog('Update',row)"><span class="material-icons edit-color">edit</span></a>
</ng-container> <a (click)="confirmBox('Delete',row)"><span class="material-icons edit-color delete">delete</span></a>
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr> </mat-cell>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> </ng-container>
</table>
<mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;">
</mat-row>
</table>
<mat-card *ngIf="isLoading" style="display: flex; justify-content: center; align-items: center">
<mat-progress-spinner
color="primary"
mode="indeterminate">
</mat-progress-spinner>
</mat-card>
<div [hidden]="recordStatus">
<mat-paginator #paginator class="mat-elevation-z1" [length]="customersListLength" [pageIndex]="pageIndex" [pageSize]="pageSize"
[pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons>
</mat-paginator>
</div> </div>
</mat-expansion-panel-header> <!-- </div> -->
</mat-expansion-panel> <!-- </mat-expansion-panel-header>
</mat-accordion> </mat-expansion-panel> -->
<!-- <div [hidden]="recordStatus"> <!-- </mat-accordion> -->
<mat-paginator #paginator class="mat-elevation-z1" [length]="customersList.length" [pageIndex]="pageIndex"
[pageSize]="pageSize" [pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons> <mat-card-content *ngIf="recordStatus">
</mat-paginator> <h5 align="center" style="font-weight: bold;
</div> --> color: brown;">No Data Available</h5>
</mat-card-content>
<mat-paginator [pageSizeOptions]="[5, 10, 25, 100]" aria-label="Select page of users"></mat-paginator>
</div> </div>
</div> </div>
</div> </div>
</ng-scrollbar>
</mat-sidenav-container> </mat-sidenav-container>
<notifier-container></notifier-container> <notifier-container></notifier-container>

14
ng-seed/src/app/appoinment/customers/customers-list/customers-list.component.scss
View File

@ -1,6 +1,9 @@
.my-table{ .my-table{
width: 100%; width: 100%;
} }
.scrollHV {
height: calc(100vh - 0px);
}
.button{ .button{
float: right; float: right;
background-color: #4caf50; background-color: #4caf50;
@ -23,9 +26,7 @@ th.mat-header-cell, td.mat-cell, td.mat-footer-cell {
// overflow-y: hidden; // overflow-y: hidden;
// background-color: #ffff; // background-color: #ffff;
// } // }
::ng-deep .mat-expansion-panel:not([class*='mat-elevation-z']) {
box-shadow: none!important;
}
img { img {
width: 30px; width: 30px;
height: 30px; height: 30px;
@ -82,10 +83,3 @@ mat-paginator{
::ng-deep body.swal2-height-auto { ::ng-deep body.swal2-height-auto {
height: 100% !important height: 100% !important
} }
.example-container {
display: block;
height: 365px;
/* overflow: auto; */
overflow-x: hidden;
overflow-y: auto;
}

110
ng-seed/src/app/appoinment/customers/customers-list/customers-list.component.ts
View File

@ -1,6 +1,7 @@
import { Component, OnInit, ViewChild } from '@angular/core'; import { Component, OnInit, ViewChild } from '@angular/core';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { MatPaginator, PageEvent } from '@angular/material/paginator'; import { MatPaginator, PageEvent } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { MatTable, MatTableDataSource } from '@angular/material/table'; import { MatTable, MatTableDataSource } from '@angular/material/table';
import { NotifierService } from 'angular-notifier'; import { NotifierService } from 'angular-notifier';
import { AppointmentsService } from 'app/appoinment/appoinments/appointments-service/appointments.service'; import { AppointmentsService } from 'app/appoinment/appoinments/appointments-service/appointments.service';
@ -41,34 +42,51 @@ export class CustomersListComponent implements OnInit {
push: any; push: any;
displayedColumns: string[] = ['id','name', 'email','phone', 'address', 'action']; displayedColumns: string[] = ['id','name', 'email','phone', 'address', 'action'];
// dataSource: any; public customersListLength: number;
public customersList:any = new MatTableDataSource(); public customersListSource = new MatTableDataSource();
// dataSource: any = new MatTableDataSource(ELEMENT_DATA);
@ViewChild(MatTable,{static:true}) table: MatTable<any>;
@ViewChild(MatPaginator) paginator: MatPaginator; @ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
recordStatus: boolean; recordStatus: boolean;
// length = 5;
// pageIndex = 0; @ViewChild(MatTable,{static:true}) table: MatTable<any>
// pageSize = 10; // pagination variable details
// pageEvent: PageEvent; length = 5;
pageIndex = 0;
pageSize = 5;
pageEvent: PageEvent;
customersList: any[] = [];
addFormData: any; addFormData: any;
appoinmentsList:any =[]; appoinmentsList:any =[];
appoinmentsIds:any = []; appoinmentsIds:any = [];
isLoading = true
constructor(private notifierService: NotifierService,public dialog: MatDialog,public _cus:CustomersService,public _app:AppointmentsService) { } constructor(private notifierService: NotifierService,public dialog: MatDialog,public _cus:CustomersService,public _app:AppointmentsService) { }
ngOnInit(): void {
// console.log('IN') ngOnInit(): void {
// this.dataSource = new MatTableDataSource(ELEMENT_DATA) this.recordStatus=false;
this.getCustomersList() this.getCustomersList()
} }
ngAfterViewInit() {
this.customersListSource.paginator = this.paginator;
console.log(this.customersListSource,this.paginator)
this.customersListSource.sort = this.sort;
}
applyFilter(filterValue: string) {
filterValue = filterValue.trim(); // Remove whitespace
filterValue = filterValue.toLowerCase(); // Datasource defaults to lowercase matches
this.customersListSource.filter = filterValue;
}
getCustomersList() { getCustomersList() {
//this._pd.getTabStatusPdDetails(this.tabStatus) //this._pd.getTabStatusPdDetails(this.tabStatus)
let user_role = localStorage.getItem('user_role'); let user_role = localStorage.getItem('user_role');
if(user_role == 'PRACTITIONER'){ if(user_role == 'PRACTITIONER'){
this._app.getAppoinmentsListDetails().subscribe(res => { this._app.getAppoinmentsListDetails().subscribe(res => {
if (res.status == 200) { if (res.status == 200) {
this.appoinmentsList = res.data; this.appoinmentsList = res.data;
let id = localStorage.getItem('user_id') let id = localStorage.getItem('user_id')
console.log(id) console.log(id)
@ -90,50 +108,40 @@ export class CustomersListComponent implements OnInit {
}) })
} }
this._cus.getCustomersListDetails().subscribe(res => { this._cus.getCustomersListDetails().subscribe(res => {
if (res.status == 200) { if (res.status == 200) {
this.customersList = res.data; this.isLoading = false
console.log(this.customersList,this.appoinmentsIds) this.customersList = res.data;
let user_role = localStorage.getItem('user_role'); console.log(this.customersList)
if(user_role == 'PRACTITIONER'){ this.customersListLength = res.data.length;
console.log(this.customersListLength)
this.customersListSource['data'] = this.customersList;
console.log(this.customersListSource)
this.recordStatus=false;
console.log(this.customersList,this.appoinmentsIds)
let user_role = localStorage.getItem('user_role');
if(user_role == 'PRACTITIONER'){
const activeIds = this.appoinmentsIds
const serviceList = this.customersList
const result = serviceList.filter(({id}) => activeIds.includes(id));
console.log(result)
this.customersList = result
this.customersListSource['data'] = this.customersList;
const activeIds = this.appoinmentsIds }
const serviceList = this.customersList
const result = serviceList.filter(({id}) => activeIds.includes(id)); }
console.log(result) else{
this.customersList = result this.customersList=[];
} this.customersListLength= null;
this.recordStatus=true;
// this.dataSource = res.data.length; }
// console.log(this.dataSource) }, error => this.isLoading = false);
// this.dataSource.data = this.customersList;
// console.log(this.dataSource.data)
// this.recordStatus=false;
}
else{
// this.customersList=[];
// this.dataSource = null;
// this.recordStatus=true;
}
}
,error => {
// this.errorMessage.push(error);
// this.notifier.notify('error', 'Something Went Wrong Try Again.! \t\"' + (error.error_type == 2 ? error.error_status + ' ( ' + error.error_text + ' ) ' : ' ( ' + error.error_text + ' ) ') +'\" Error Occur.!');
// alert(error.html_format);
});
} }
ngAfterViewInit() {
this.customersList.paginator = this.paginator;
}
applyFilter(event: Event) {
const filterValue = (event.target as HTMLInputElement).value;
this.customersList.filter = filterValue.trim().toLowerCase();
if (this.customersList.paginator) {
this.customersList.paginator.firstPage();
}
}
pageChange(e) { pageChange(e) {
console.log(e); console.log(e);

4
ng-seed/src/app/appoinment/service-list-details/add-service/add-service.component.html
View File

@ -20,8 +20,8 @@
</mat-form-field> </mat-form-field>
<mat-form-field appearance="outline" *ngIf="action != 'Delete'; else elseTemplate" class="mat-pane"> <mat-form-field appearance="outline" *ngIf="action != 'Delete'; else elseTemplate" class="mat-pane">
<mat-label>Description</mat-label> <mat-label>Description</mat-label>
<textarea matInput placeholder="Description" formControlName="serviceDescription"></textarea> <textarea matInput placeholder="Description" formControlName="description"></textarea>
<mat-error *ngIf="myError('serviceDescription', 'required')">Duration is required</mat-error> <mat-error *ngIf="myError('description', 'required')">Duration is required</mat-error>
</mat-form-field> </mat-form-field>
<ng-template #elseTemplate> <ng-template #elseTemplate>
Sure to delete <b>{{local_data.servicesName}}</b>? Sure to delete <b>{{local_data.servicesName}}</b>?

6
ng-seed/src/app/appoinment/service-list-details/add-service/add-service.component.ts
View File

@ -40,7 +40,7 @@ ngOnInit() {
this.form = new FormGroup({ this.form = new FormGroup({
servicesName: new FormControl('', [Validators.required, Validators.maxLength(20)]), servicesName: new FormControl('', [Validators.required, Validators.maxLength(20)]),
duration: new FormControl('',[Validators.required]), duration: new FormControl('',[Validators.required]),
serviceDescription: new FormControl('',[Validators.required]) description: new FormControl('',[Validators.required])
}); });
this.form.patchValue(this.local_data) this.form.patchValue(this.local_data)
} }
@ -53,6 +53,10 @@ ngOnInit() {
console.log(this.form.value); console.log(this.form.value);
let tmp = this.form.value let tmp = this.form.value
tmp.serviceId = this.local_data.serviceId tmp.serviceId = this.local_data.serviceId
if (!this.form.valid) {
console.log("check")
return;
}
this.dialogRef.close({event:this.action,data:tmp}); this.dialogRef.close({event:this.action,data:tmp});
console.log(this.form.value); console.log(this.form.value);
console.log(this.action,this.local_data) console.log(this.action,this.local_data)

2
ng-seed/src/app/appoinment/service-list-details/service-list.module.ts
View File

@ -6,6 +6,7 @@ import { ServiceListComponent } from './service-list/service-list.component';
import { DemoMaterialModule } from 'app/shared/demo.module'; import { DemoMaterialModule } from 'app/shared/demo.module';
import { AddServiceComponent } from './add-service/add-service.component'; import { AddServiceComponent } from './add-service/add-service.component';
import { NotifierModule, NotifierOptions } from 'angular-notifier'; import { NotifierModule, NotifierOptions } from 'angular-notifier';
import { NgScrollbarModule } from 'ngx-scrollbar';
const customNotifierOptions: NotifierOptions = { const customNotifierOptions: NotifierOptions = {
position: { position: {
@ -56,6 +57,7 @@ const customNotifierOptions: NotifierOptions = {
DemoMaterialModule, DemoMaterialModule,
CommonModule, CommonModule,
ServiceListRoutingModule, ServiceListRoutingModule,
NgScrollbarModule,
NotifierModule.withConfig(customNotifierOptions), NotifierModule.withConfig(customNotifierOptions),
], ],

115
ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.html
View File

@ -1,69 +1,84 @@
<h3>Services Details</h3> <h3>Services Details</h3>
<mat-form-field> <mat-form-field style="width:30%">
<mat-label>Filter</mat-label> <mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event)" placeholder="Ex. Mia" #input> <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Type Here" #input>
</mat-form-field> </mat-form-field>
<button mat-button (click)="openDialog('Add',{})" class="button">Add Services</button> <button mat-button (click)="openDialog('Add',{})" class="button">Add Services</button>
<!-- <div class="example-container mat-elevation-z8 "> -->
<mat-sidenav-container class="app-inner background-none shadow-none mail-db"> <mat-sidenav-container class="app-inner background-none shadow-none mail-db">
<ng-scrollbar class="scrollHV">
<div class="main-content" fxLayout="row" fxLayoutAlign="center start"> <div class="main-content" fxLayout="row" fxLayoutAlign="center start">
<div fxFlex.gt-sm="90" fxFlex.gt-xs="95" fxFlex="100"> <div fxFlex.gt-sm="90" fxFlex.gt-xs="95" fxFlex="100">
<div class="messages-list material fullscreen"> <div class="messages-list material fullscreen">
<mat-accordion> <mat-accordion>
<mat-expansion-panel> <!-- <mat-expansion-panel>
<mat-expansion-panel-header > <mat-expansion-panel-header > -->
<div class="example-container mat-elevation-z8 "> <!-- <div class="example-container mat-elevation-z8 "> -->
<table mat-table [dataSource]="servicesList" #mytable class="my-table mat-elevation-z8 len-table">
<ng-container matColumnDef="serviceId">
<th mat-header-cell *matHeaderCellDef class="font-color"> S.NO </th>
<td mat-cell *matCellDef="let element" class="element-spc"> {{element.serviceId}} </td>
</ng-container>
<!-- <ng-container matColumnDef="logo"> <table mat-table [dataSource]="servicesListSource" matSort *ngIf="servicesListLength > 0" class="my-table mat-elevation-z8 len-table">
<th mat-header-cell *matHeaderCellDef class="font-color"> Logo </th>
<td mat-cell *matCellDef="let element"> <img [src]="element.logo" /> </td> <!-- ID Column -->
</ng-container> --> <ng-container matColumnDef="serviceId">
<mat-header-cell *matHeaderCellDef mat-sort-header> S.No </mat-header-cell>
<ng-container matColumnDef="servicesName"> <mat-cell *matCellDef="let row; let i = index;"> {{row.serviceId}} </mat-cell>
<th mat-header-cell *matHeaderCellDef class="font-color">Service Name </th> </ng-container>
<td mat-cell *matCellDef="let element" class="element-spc"> {{element.servicesName}} </td>
</ng-container> <!-- Duration Column -->
<ng-container matColumnDef="servicesName">
<ng-container matColumnDef="duration"> <mat-header-cell *matHeaderCellDef mat-sort-header> Service Name </mat-header-cell>
<th mat-header-cell *matHeaderCellDef class="font-color"> Duration </th> <mat-cell *matCellDef="let row"> {{row.servicesName}} </mat-cell>
<td mat-cell *matCellDef="let element"> {{element.duration}} Mins </td> </ng-container>
</ng-container>
<ng-container matColumnDef="description"> <!-- Description Column -->
<th mat-header-cell *matHeaderCellDef class="font-color"> Description </th> <ng-container matColumnDef="duration">
<td mat-cell *matCellDef="let element"> {{element.serviceDescription}}</td> <mat-header-cell *matHeaderCellDef mat-sort-header> Duration </mat-header-cell>
</ng-container> <mat-cell *matCellDef="let row"> {{row.duration}} </mat-cell>
</ng-container>
<ng-container matColumnDef="action">
<th mat-header-cell *matHeaderCellDef class="font-color"> Action </th> <!-- Description Column -->
<td mat-cell *matCellDef="let element" class="action-link"> <ng-container matColumnDef="description">
<a (click)="openDialog('Update',element)"><span class="material-icons edit-color">edit</span></a> <mat-header-cell *matHeaderCellDef mat-sort-header> Description </mat-header-cell>
<a (click)="confirmBox('Delete',element)"><span class="material-icons edit-color delete">delete</span></a> <mat-cell *matCellDef="let row"> {{row.description}} </mat-cell>
</td> </ng-container>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr> <!-- Action Column -->
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> <ng-container matColumnDef="action">
</table> <mat-header-cell *matHeaderCellDef mat-sort-header> Action </mat-header-cell>
<mat-cell *matCellDef="let row">
<a (click)="openDialog('Update',row)"><span class="material-icons edit-color">edit</span></a>
<a (click)="confirmBox('Delete',row)"><span class="material-icons edit-color delete">delete</span></a>
</mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;">
</mat-row>
</table>
<mat-card *ngIf="isLoading" style="display: flex; justify-content: center; align-items: center">
<mat-progress-spinner
color="primary"
mode="indeterminate">
</mat-progress-spinner>
</mat-card>
<div [hidden]="recordStatus">
<mat-paginator #paginator class="mat-elevation-z1" [length]="servicesListLength" [pageIndex]="pageIndex" [pageSize]="pageSize"
[pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons>
</mat-paginator>
</div> </div>
</mat-expansion-panel-header> <!-- </div> -->
</mat-expansion-panel> <!-- </mat-expansion-panel-header>
</mat-expansion-panel> -->
</mat-accordion> </mat-accordion>
<!-- <div [hidden]="recordStatus">
<mat-paginator #paginator class="mat-elevation-z1" [length]="customersList.length" [pageIndex]="pageIndex" <mat-card-content *ngIf="recordStatus">
[pageSize]="pageSize" [pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons> <h5 align="center" style="font-weight: bold;
</mat-paginator> color: brown;">No Data Available</h5>
</div> --> </mat-card-content>
<mat-paginator [pageSizeOptions]="[5, 10, 25, 100]" aria-label="Select page of users"></mat-paginator>
</div> </div>
</div> </div>
</div> </div>
</ng-scrollbar>
</mat-sidenav-container> </mat-sidenav-container>
<notifier-container></notifier-container> <notifier-container></notifier-container>

3
ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.scss
View File

@ -1,6 +1,9 @@
.my-table{ .my-table{
width: 100%; width: 100%;
} }
.scrollHV {
height: calc(100vh - 0px);
}
.button{ .button{
float: right; float: right;
background-color: #4caf50; background-color: #4caf50;

100
ng-seed/src/app/appoinment/service-list-details/service-list/service-list.component.ts
View File

@ -1,6 +1,8 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit, ViewChild } from '@angular/core';
import { MatDialog } from '@angular/material/dialog'; import { MatDialog } from '@angular/material/dialog';
import { MatTableDataSource } from '@angular/material/table'; import { MatPaginator, PageEvent } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import { MatTable, MatTableDataSource } from '@angular/material/table';
import { NotifierService } from 'angular-notifier'; import { NotifierService } from 'angular-notifier';
import Swal from 'sweetalert2'; import Swal from 'sweetalert2';
import { AddServiceComponent } from '../add-service/add-service.component'; import { AddServiceComponent } from '../add-service/add-service.component';
@ -12,45 +14,72 @@ import { ApiServiceService } from '../service-api-services/api-service.service';
styleUrls: ['./service-list.component.scss'] styleUrls: ['./service-list.component.scss']
}) })
export class ServiceListComponent implements OnInit { export class ServiceListComponent implements OnInit {
// doctors = ['Dr. Sanjeev', 'Dr. Gopi', 'Dr. Surendar', 'Dr. Kamali', 'Dr. Venkatadesh', 'Dr.Javeed', 'Dr.Cyril'];
// serviceId = ['1', '2', '3'];
servicesName = ['Allergist and Clinical Immunologist', 'Bariatrics', 'Breast surgery','Cardiology','Cardiothoracic &amp; Vascular Surgery','Cold, Cough and Fever', 'Colorectal Surgery'];
info = ['Manage allergies and treat immunity', 'For obesity-related disorders', 'For breast tissue removal', 'For heart and blood pressure problems', 'For surgical treatments of thoracic organs', 'For common health concerns', 'For disorders of rectum, anus, and colon'];
specialties = ['Recurring infections, Immunity deficiency', 'Overweight, BMI over 30', 'Breast tissue surgery &amp; removal, Mastectomy', 'Chest pain, Heart Failure, Cholesterol', 'Heart &amp; lung disease, Cardiac transplantation','Fever, Eye Infection, Stomach Ache, Headache', 'Inflammatory bowel disease, Fistula, Intestinal blockage'];
serviceData: any = []; serviceData: any = [];
addFormData: any; addFormData: any;
push: any; push: any;
id: number; id: number;
displayedColumns: string[] = ['serviceId','servicesName','duration','description','action']; displayedColumns: string[] = ['serviceId','servicesName','duration','description','action'];
serviceId: number; serviceId: number;
public servicesList:any = new MatTableDataSource();
public servicesListLength: number;
public servicesListSource = new MatTableDataSource();
@ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
recordStatus: boolean;
@ViewChild(MatTable,{static:true}) table: MatTable<any>
// pagination variable details
length = 5;
pageIndex = 0;
pageSize = 5;
pageEvent: PageEvent;
servicesList: any[] = [];
isLoading = true;
constructor(private notifierService: NotifierService,public _api:ApiServiceService, public dialog: MatDialog) { } constructor(private notifierService: NotifierService,public _api:ApiServiceService, public dialog: MatDialog) { }
ngOnInit(): void {
ngOnInit(): void {
for (let i = 0; i < 7; i++) { this.recordStatus=false;
const random = i % 7;
const obj: any = {
servicesName: this.servicesName[random],
// isFavourite: i % 5 === 0 ? true : false,
// doctors: this.doctors,
info: this.info[random],
specialties: this.specialties[random],
// apino: 21,
// state: state[i % 4],
//version: this.dropdown[0].name,
};
// this.serviceData.push(obj);
}
this.getServicesList() this.getServicesList()
} }
ngAfterViewInit() {
this.servicesListSource.paginator = this.paginator;
console.log(this.servicesListSource,this.paginator)
this.servicesListSource.sort = this.sort;
}
applyFilter(filterValue: string) {
filterValue = filterValue.trim(); // Remove whitespace
filterValue = filterValue.toLowerCase(); // Datasource defaults to lowercase matches
this.servicesListSource.filter = filterValue;
}
getServicesList() { getServicesList() {
this._api.getServicesListDetails().subscribe(res => { this._api.getServicesListDetails().subscribe(res => {
if (res.status == 200) { if (res.status == 200) {
this.servicesList = res.data; this.isLoading = false;
this.servicesList = res.data;
console.log(this.servicesList)
this.servicesListLength = res.data.length;
console.log(this.servicesListLength)
this.servicesListSource['data'] = this.servicesList;
console.log(this.servicesListSource)
this.recordStatus=false;
} }
} ); else{
this.servicesList=[];
this.servicesListLength= null;
this.recordStatus=true;
}
}, error => this.isLoading = false);
}
pageChange(e) {
console.log(e);
} }
confirmBox(event,element){ confirmBox(event,element){
@ -107,8 +136,8 @@ export class ServiceListComponent implements OnInit {
let addFormData = { let addFormData = {
// busId: 'abc123', // busId: 'abc123',
// id: row_obj.id, // id: row_obj.id,
serviceDescription:row_obj.serviceDescription, description:row_obj.description,
duration:row_obj.duration, duration: parseInt(row_obj.duration),
serviceId: row_obj.serviceId, serviceId: row_obj.serviceId,
servicesName: row_obj.servicesName servicesName: row_obj.servicesName
}; };
@ -117,9 +146,9 @@ export class ServiceListComponent implements OnInit {
console.log(row_obj) console.log(row_obj)
console.log('Update') console.log('Update')
let updatevalue = { let updatevalue = {
serviceDescription:row_obj.serviceDescription, description:row_obj.description,
serviceId: row_obj.serviceId, serviceId: row_obj.serviceId,
duration:row_obj.duration, duration: parseInt(row_obj.duration),
servicesName: row_obj.servicesName servicesName: row_obj.servicesName
} }
formValue.push(updatevalue); formValue.push(updatevalue);
@ -159,12 +188,5 @@ export class ServiceListComponent implements OnInit {
}); });
} }
applyFilter(event: Event) {
const filterValue = (event.target as HTMLInputElement).value;
this.servicesList.filter = filterValue.trim().toLowerCase();
if (this.servicesList.paginator) {
this.servicesList.paginator.firstPage();
}
}
} }

11
ng-seed/src/app/appoinment/user/user-list/user-list.component.html
View File

@ -1,3 +1,4 @@
<h3>Users Details</h3> <h3>Users Details</h3>
<mat-form-field style="width:30%"> <mat-form-field style="width:30%">
<mat-label>Filter</mat-label> <mat-label>Filter</mat-label>
@ -30,6 +31,7 @@
<button mat-button (click)="openDialog('Add',{})" class="button">Add Users</button> <button mat-button (click)="openDialog('Add',{})" class="button">Add Users</button>
<!-- <div class="example-container mat-elevation-z8 "> --> <!-- <div class="example-container mat-elevation-z8 "> -->
<mat-sidenav-container class="app-inner background-none shadow-none mail-db"> <mat-sidenav-container class="app-inner background-none shadow-none mail-db">
<ng-scrollbar class="scrollHV">
<div class="main-content" fxLayout="row" fxLayoutAlign="center start"> <div class="main-content" fxLayout="row" fxLayoutAlign="center start">
<div fxFlex.gt-sm="90" fxFlex.gt-xs="95" fxFlex="100"> <div fxFlex.gt-sm="90" fxFlex.gt-xs="95" fxFlex="100">
<div class="messages-list material fullscreen"> <div class="messages-list material fullscreen">
@ -104,6 +106,12 @@
<tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr> <tr mat-header-row *matHeaderRowDef="displayedColumns; sticky: true"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table> </table>
<mat-card *ngIf="isLoading" style="display: flex; justify-content: center; align-items: center">
<mat-progress-spinner
color="primary"
mode="indeterminate">
</mat-progress-spinner>
</mat-card>
<div [hidden]="recordStatus"> <div [hidden]="recordStatus">
<mat-paginator #paginator class="mat-elevation-z1" [length]="usersListLength" [pageIndex]="pageIndex" [pageSize]="pageSize" <mat-paginator #paginator class="mat-elevation-z1" [length]="usersListLength" [pageIndex]="pageIndex" [pageSize]="pageSize"
[pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons> [pageSizeOptions]="[5, 10, 25,50, 100]" (page)="pageEvent = $event; pageChange($event)" showFirstLastButtons>
@ -121,7 +129,6 @@
</div> </div>
</div> </div>
</div> </div>
</ng-scrollbar>
</mat-sidenav-container> </mat-sidenav-container>
<notifier-container></notifier-container> <notifier-container></notifier-container>

3
ng-seed/src/app/appoinment/user/user-list/user-list.component.scss
View File

@ -1,6 +1,9 @@
.my-table{ .my-table{
width: 100%; width: 100%;
} }
.scrollHV {
height: calc(100vh - 0px);
}
.button{ .button{
float: right; float: right;
background-color: #4caf50; background-color: #4caf50;

10
ng-seed/src/app/appoinment/user/user-list/user-list.component.ts
View File

@ -60,6 +60,7 @@ export class UserListComponent implements OnInit {
recordStatus: boolean= true; recordStatus: boolean= true;
usersListLength: any=5; usersListLength: any=5;
businessList: any; businessList: any;
isLoading = true
constructor(private notifierService: NotifierService,public dialog: MatDialog, public _use:UserService,public _bus:BusinessService) { constructor(private notifierService: NotifierService,public dialog: MatDialog, public _use:UserService,public _bus:BusinessService) {
let open_go_admin = localStorage.getItem('go_admin') let open_go_admin = localStorage.getItem('go_admin')
if(open_go_admin == '0'){ if(open_go_admin == '0'){
@ -78,6 +79,7 @@ export class UserListComponent implements OnInit {
//this._pd.getTabStatusPdDetails(this.tabStatus) //this._pd.getTabStatusPdDetails(this.tabStatus)
this._use.getUsersListDetails().subscribe(res => { this._use.getUsersListDetails().subscribe(res => {
if (res.status == 200) { if (res.status == 200) {
this.isLoading = false
let usersList = res.data let usersList = res.data
this.usersList['data'] = usersList; this.usersList['data'] = usersList;
this.usersListLength = res.data.length; this.usersListLength = res.data.length;
@ -88,12 +90,7 @@ export class UserListComponent implements OnInit {
// this.dataSource = null; // this.dataSource = null;
this.recordStatus=true; this.recordStatus=true;
} }
} },error => this.isLoading = false);
,error => {
// this.errorMessage.push(error);
// this.notifier.notify('error', 'Something Went Wrong Try Again.! \t\"' + (error.error_type == 2 ? error.error_status + ' ( ' + error.error_text + ' ) ' : ' ( ' + error.error_text + ' ) ') +'\" Error Occur.!');
// alert(error.html_format);
});
} }
getBusinessList() { getBusinessList() {
//this._pd.getTabStatusPdDetails(this.tabStatus) //this._pd.getTabStatusPdDetails(this.tabStatus)
@ -128,6 +125,7 @@ export class UserListComponent implements OnInit {
filterValue = filterValue.trim(); // Remove whitespace filterValue = filterValue.trim(); // Remove whitespace
filterValue = filterValue.toLowerCase(); // Datasource defaults to lowercase matches filterValue = filterValue.toLowerCase(); // Datasource defaults to lowercase matches
this.usersList.filter = filterValue; this.usersList.filter = filterValue;
console.log(this.usersList)
} }
} }

32
ng-seed/src/app/layouts/admin/admin-layout.component.html
View File

@ -90,14 +90,14 @@
</mat-sidenav> </mat-sidenav>
<mat-toolbar class="main-header"> <mat-toolbar class="main-header">
<div class="horizontal-top-bar w-100"> <div class="horizontal-top-bar w-100">
<div fxFlex.sm="100" fxFlex.xs="100" fxFlex.md="33.33" fxFlex.lg="33.33" fxFlex.xl="33.33" fxFlex="100"> <!-- <div fxFlex.sm="100" fxFlex.xs="100" fxFlex.md="33.33" fxFlex.lg="33.33" fxFlex.xl="33.33" fxFlex="100">
<div class="search-bar" fxFlex> <div class="search-bar" fxFlex>
<form class="search-form"> <form class="search-form">
<mat-icon>search</mat-icon> <mat-icon>search</mat-icon>
<input type="text" placeholder="Search" /> <input type="text" placeholder="Search" />
</form> </form>
</div> </div>
</div> </div> -->
<div fxFlex.sm="100" fxFlex.xs="100" fxFlex.md="33.33" fxFlex.lg="33.33" fxFlex.xl="33.33" fxFlex="100"> <div fxFlex.sm="100" fxFlex.xs="100" fxFlex.md="33.33" fxFlex.lg="33.33" fxFlex.xl="33.33" fxFlex="100">
<div class="horizontal-logo"> <div class="horizontal-logo">
<div class="branding text-center"> <div class="branding text-center">
@ -191,20 +191,20 @@
<!-- <button (click)="menuToggleFunc()" mat-icon-button class="lines-btn"> <!-- <button (click)="menuToggleFunc()" mat-icon-button class="lines-btn">
<mat-icon>menu</mat-icon> <mat-icon>menu</mat-icon>
</button> --> </button> -->
<div class="search-bar" fxFlex [class.search-active]="searchFocus"> <!-- <div class="search-bar" fxFlex [class.search-active]="searchFocus">
<form class="search-form"> <form class="search-form">
<mat-icon>search</mat-icon> <mat-icon>search</mat-icon>
<input type="text" placeholder="Search" (focus)="searchFocus = true" (focusout)="searchFocus = false " /> <input type="text" placeholder="Search" (focus)="searchFocus = true" (focusout)="searchFocus = false " />
</form> </form>
</div> </div> -->
<span fxFlex></span> <span fxFlex></span>
<button appToggleFullscreen mat-icon-button class="sm-disable"> <!-- <button appToggleFullscreen mat-icon-button class="sm-disable">
<mat-icon>fullscreen</mat-icon> <mat-icon>fullscreen</mat-icon>
</button> </button> -->
<button [mat-menu-trigger-for]="user2" mat-icon-button class="ml-xs overflow-visible"> <!-- <button [mat-menu-trigger-for]="user2" mat-icon-button class="ml-xs overflow-visible">
<mat-icon>message</mat-icon> <mat-icon>message</mat-icon>
</button> </button> -->
<mat-menu #user2="matMenu" class="opt-menu" x-position="after"> <!-- <mat-menu #user2="matMenu" class="opt-menu" x-position="after">
<div mat-menu-item class="head-menu grad-blue"> <div mat-menu-item class="head-menu grad-blue">
Message Menu Message Menu
</div> </div>
@ -224,12 +224,12 @@
<img width="40" src="assets/images/user-4.jpg" alt=""> <img width="40" src="assets/images/user-4.jpg" alt="">
Lorem ipsum dolor sit amet consectetur. Lorem ipsum dolor sit amet consectetur.
</button> </button>
</mat-menu> </mat-menu> -->
<button [mat-menu-trigger-for]="user1" mat-icon-button class="ml-xs overflow-visible sm-disable"> <!-- <button [mat-menu-trigger-for]="user1" mat-icon-button class="ml-xs overflow-visible sm-disable">
<mat-icon>reorder</mat-icon> <mat-icon>reorder</mat-icon>
<span class="notification-label">3</span> <span class="notification-label">3</span>
</button> </button> -->
<mat-menu #user1="matMenu" class="opt-menu " x-position="before"> <!-- <mat-menu #user1="matMenu" class="opt-menu " x-position="before">
<div mat-menu-item class="head-menu grad-blue"> <div mat-menu-item class="head-menu grad-blue">
User Menu User Menu
</div> </div>
@ -245,7 +245,7 @@
<mat-icon>web</mat-icon> <mat-icon>web</mat-icon>
Calendar Settings Calendar Settings
</button> </button>
</mat-menu> </mat-menu> -->
<button (click)="end.toggle()" mat-icon-button class="ml-xs overflow-visible"> <button (click)="end.toggle()" mat-icon-button class="ml-xs overflow-visible">
<mat-icon>notifications</mat-icon> <mat-icon>notifications</mat-icon>
<span class="notification-label">2</span> <span class="notification-label">2</span>
@ -254,7 +254,7 @@
<mat-icon>person</mat-icon> <mat-icon>person</mat-icon>
</button> </button>
<mat-menu #user="matMenu" class="opt-menu" x-position="before"> <mat-menu #user="matMenu" class="opt-menu" x-position="before">
<div mat-menu-item class="head-menu grad-blue"> <!-- <div mat-menu-item class="head-menu grad-blue">
Settings Settings
</div> </div>
<button mat-menu-item> <button mat-menu-item>
@ -268,7 +268,7 @@
<button mat-menu-item> <button mat-menu-item>
<mat-icon>notifications_off</mat-icon> <mat-icon>notifications_off</mat-icon>
Disable notifications Disable notifications
</button> </button> -->
<button mat-menu-item> <button mat-menu-item>
<mat-icon>exit_to_app</mat-icon> <mat-icon>exit_to_app</mat-icon>
Sign Out Sign Out

2
ng-seed/src/app/layouts/role-menu-items.pipe.ts
View File

@ -11,7 +11,7 @@ export class RoleMenuItemsPipe implements PipeTransform {
// if(type=="1"){ // if(type=="1"){
switch(localStorage.getItem('user_role')){ switch(localStorage.getItem('user_role')){
case 'SADMIN': return value.filter(val=>val.state!="appoinments" && val.state!="customers" && val.state != "consultant-setting" && val.state!="consultants" && val.state!="services"); case 'SADMIN': return value.filter(val=>val.state!="appoinments" && val.state!="customers" && val.state != "consultant-setting" && val.state!="consultants" && val.state!="services");
case 'BADMIN': return value.filter(val=>val.state !="business" && val.state != "consultant-setting"); case 'BADMIN': return value.filter(val=>val.state !="business" && val.state != "consultant-setting" && val.state!="users" && val.state!="consultants");
case 'PRACTITIONER': return value.filter(val=>val.state !="business" && val.state!="consultants" && val.state!="users" && val.state!="services"); case 'PRACTITIONER': return value.filter(val=>val.state !="business" && val.state!="consultants" && val.state!="users" && val.state!="services");
// case 'PRACTITIONER': // case 'PRACTITIONER':
// case '3': return value.filter(val=>val.state!="settings"); // case '3': return value.filter(val=>val.state!="settings");

3
ng-seed/src/assets/styles/scss/core/_main-sidebar.scss
View File

@ -182,7 +182,7 @@
.mat-sidenav-content { .mat-sidenav-content {
overflow-x: hidden !important; overflow-x: hidden !important;
padding: 0 !important; padding: 0 !important;
background: $main-content; // background: $main-content;
display: flex; display: flex;
// background: #f2f4f8; // background: #f2f4f8;
} }
@ -195,6 +195,7 @@
padding: 2rem; padding: 2rem;
margin-bottom: 2rem; margin-bottom: 2rem;
// background: #f2f4f8; // background: #f2f4f8;
background-color: #fff;
} }
@media(max-width:991px) { @media(max-width:991px) {

4
ng-seed/src/environments/environment.ts
View File

@ -6,8 +6,8 @@
export const environment = { export const environment = {
production: false, production: false,
environmentName: 'Testing Environment',//Localhost Environment. environmentName: 'Testing Environment',//Localhost Environment.
apiEndpoint:'http://venbainfotech.com:5000/api/', // apiEndpoint:'http://venbainfotech.com:5000/api/',
// apiEndpoint:'http://192.168.1.20:8080/api/', apiEndpoint:'http://192.168.1.20:8080/api/',
// apiEndpoint:'https://api.venbait.in/api/', // apiEndpoint:'https://api.venbait.in/api/',
firebase: { firebase: {