This commit is contained in:
surendar.m@watermelon.us 2023-03-24 18:00:01 +05:30
parent a7e3e3037b
commit e64890c7f0
15 changed files with 187 additions and 262 deletions

View File

@ -25,8 +25,6 @@ export const AppRoutes: Routes = [{
loadChildren: () => import('./appoinment/appoinments/appoinments.module').then(m => m.AppoinmentsModule)
},
{
path: 'customers',
loadChildren: () => import('./appoinment/customers/customers.module').then(m => m.CustomersModule)
@ -43,6 +41,10 @@ export const AppRoutes: Routes = [{
path: 'consultant-setting',
loadChildren: () => import('./appoinment/consultant-setting/consultant-setting.module').then(m => m.ConsultantSettingModule)
},
{
path: 'customer-info',
loadChildren: () => import('./appoinment/appoinment.module').then(m => m.AppoinmentModule)
},
]

View File

@ -9,15 +9,19 @@ const routes: Routes = [
// component: AddBusinessListComponent
// },
{
path: 'add-user-list',
component: UserListComponent
},
// {
// path: 'user-list',
// path: 'add-user-list',
// component: UserListComponent
// },
// {
// path: '',
// component: CustomerInfoComponent
// },
// {
// path: '',
// component: PaymentComponent
// },
// {
// path: 'appoinments-list',
// component: AppoinmentsListComponent
// },

View File

@ -2,15 +2,16 @@ import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AppoinmentRoutingModule } from './appoinment-routing.module';
import { DemoMaterialModule } from 'app/shared/demo.module';
import { NgScrollbarModule } from 'ngx-scrollbar';
@NgModule({
declarations: [
declarations: [
],
imports: [
DemoMaterialModule,
CommonModule,
AppoinmentRoutingModule,
NgScrollbarModule
// UserModule,
// AppoinmentsModule,
// CustomersModule,

View File

@ -3,12 +3,21 @@
><mat-icon>close</mat-icon></button></h5>
<form [formGroup]="form" (ngSubmit)="submit()">
<div mat-dialog-content class="my-table">
<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="servicesName" matInput formControlName="servicesName">
<mat-error *ngIf="myError('servicesName', 'required')">ServiceName is required</mat-error>
<mat-error *ngIf="myError('servicesName', 'maxlength')">Limit exceed</mat-error>
</mat-form-field>
<mat-form-field appearance="outline" *ngIf="action != 'Delete'; else elseTemplate" class="mat-pane">
<mat-label>Duration</mat-label>
<mat-select placeholder="Select Role" formControlName="duration" required>
<mat-option>--</mat-option>
<mat-option *ngFor="let data of durationTime" [value]="data.time">
{{data.time}} Mins
</mat-option>
</mat-select>
<mat-error *ngIf="myError('duration', 'required')">Duration is required</mat-error>
</mat-form-field>
<ng-template #elseTemplate>
Sure to delete <b>{{local_data.servicesName}}</b>?
</ng-template>

View File

@ -17,6 +17,7 @@ export class AddServiceComponent implements OnInit {
form: FormGroup;
local_data:any;
action:string;
public durationTime = [{'time':'10'},{'time':'15'},{'time':'20'},{'time':'25'},{'time':'30'},{'time':'35'},{'time':'45'},{'time':'50'},{'time':'55'},{'time':'60'}]
constructor(private router: Router,private formBuilder: FormBuilder,
public dialogRef: MatDialogRef<AddServiceComponent>,
@Optional() @Inject(MAT_DIALOG_DATA) public data: UsersData) {
@ -38,6 +39,7 @@ closeDialog(){
ngOnInit() {
this.form = new FormGroup({
servicesName: new FormControl('', [Validators.required, Validators.maxLength(20)]),
duration: new FormControl('',[Validators.required])
});
this.form.patchValue(this.local_data)
}

View File

@ -1,26 +1,63 @@
<button mat-button (click)="openDialog('Add',{})" class="buttons">Add Services</button><br>
<div fxLayout="row wrap" >
<div fxFlex.xs="100" fxFlex.sm="50" fxFlex.md="50" class="m-gap p-gap flx" *ngFor="let serviceListDetails of servicesList">
<div class="Specialties-list-card">
<mat-card class="mb-2 example-card d-flex Specialties-spContent">
<div class="consultant-card-cover">
<div>
<div class="text-center consultant-thumb">
<img class="img-responsive img-circle" src="https://prodaphstorage.blob.core.windows.net/specialties/bdf0cf0d-754e-4254-aaf7-fdc7aedd7c35.jpg" alt="Online Doctor Consultation - Allergist and Clinical Immunologist" width="120" height="120" alt="user list image">
</div>
</div>
</div>
<mat-card-title-group>
<mat-card-title class="service-info mb">{{serviceListDetails.servicesName}}</mat-card-title>
<mat-card-title class="info service-list">{{serviceListDetails.info}}</mat-card-title>
<a (click)="openDialog('Update',serviceListDetails)" class="Specialties-rightUpdate"><span class="material-icons edit-color">edit</span></a>
<a (click)="confirmBox('Delete',serviceListDetails)" class="Specialties-rightArrow"><span class="material-icons edit-color delete">delete</span></a>
<!-- <span class="Specialties-rightArrow"><img src="https://newassets.apollo247.com/images/ic_arrow_right.svg" alt="Arrow Right - Online Doctor Consultation"></span> -->
<mat-card-subtitle class="service-Specialties">{{serviceListDetails.specialties}}</mat-card-subtitle>
</mat-card-title-group>
</mat-card>
</div>
</div>
</div>
<h3>Services Details</h3>
<mat-form-field>
<mat-label>Filter</mat-label>
<input matInput (keyup)="applyFilter($event)" placeholder="Ex. Mia" #input>
</mat-form-field>
<button mat-button (click)="openDialog('Add',{})" class="button">Add Services</button>
<mat-sidenav-container class="app-inner background-none shadow-none mail-db">
<div class="main-content" fxLayout="row" fxLayoutAlign="center start">
<div fxFlex.gt-sm="90" fxFlex.gt-xs="95" fxFlex="100">
<div class="messages-list material fullscreen">
<mat-accordion>
<mat-expansion-panel>
<mat-expansion-panel-header >
<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">
<th mat-header-cell *matHeaderCellDef class="font-color"> Logo </th>
<td mat-cell *matCellDef="let element"> <img [src]="element.logo" /> </td>
</ng-container> -->
<ng-container matColumnDef="servicesName">
<th mat-header-cell *matHeaderCellDef class="font-color">Service Name </th>
<td mat-cell *matCellDef="let element" class="element-spc"> {{element.servicesName}} </td>
</ng-container>
<ng-container matColumnDef="duration">
<th mat-header-cell *matHeaderCellDef class="font-color"> Duration </th>
<td mat-cell *matCellDef="let element"> {{element.duration}} </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">
<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-expansion-panel-header>
</mat-expansion-panel>
</mat-accordion>
<!-- <div [hidden]="recordStatus">
<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-paginator>
</div> -->
<mat-paginator [pageSizeOptions]="[5, 10, 25, 100]" aria-label="Select page of users"></mat-paginator>
</div>
</div>
</div>
</mat-sidenav-container>

View File

@ -1,92 +1,53 @@
$white: #fff;
$black_10: rgba(0, 0, 0, 0.1);
$black_30: rgba(0, 0, 0, 0.3);
$icon-size: 3rem;
$icon-color: #D8D8D8;
$main-color: #f44336;
.Specialties-list-card {
background: $white;
box-shadow: 0 2px 6px $black_10;
transition: all 0.3s ease-in-out 0s;
&:hover {
box-shadow: 0 0 21px $black_30;
cursor: pointer;
transform: scale(1.04);
}
}
.consultant-card-cover {
// padding: 0rem 6rem;
position: relative;
background-size: cover;
margin-left: 0.5rem;
margin-right: 1rem;
}
.consultant-thumb {
// position: absolute;
// margin-top: 20px;
// margin-left: -45rem;
img {
border: 5px solid #fff;;
border-radius: 100%;
height: 50px;
width: 50px;
// margin-right: -8rem;
}
}
.service-info{
line-height: 1.5rem!important;
}
.info{
font-size: 12px!important;
font-weight: 500;
color: rgba(2,71,91,.6);
padding: 0 0 10px;
max-height: 38px;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.service-Specialties{
font-size: 10px;
font-weight: 600;
color: #02475b;
padding: 10px 0 0;
// border-top: 1px solid rgba(2,71,91,.3);
}
.Specialties-rightArrow{
top: 1rem;
right: 0;
position: absolute;
padding-right: 0.5rem;
}
.flx{
width: 47%;
}
.Specialties-spContent{
.my-table{
width: 100%;
padding: 0 10px 0 0;
position: relative;
// min-height: 60px;
height: 65px;
}
.mb{
margin-bottom: 0.60rem;
}
::ng-deep body .mat-card .mat-card-title {
padding-left: 0rem!important;
}
::ng-deep body .mat-card .mat-card-subtitle {
padding-left: 0rem!important;
}
.buttons{
.button{
float: right;
background-color: #4caf50;
color: #ffff;
}
th.mat-header-cell, td.mat-cell, td.mat-footer-cell {
padding: 6px;
border-bottom-width: 1px;
border-bottom-style: solid;
}
.mat-expansion-panel-header {
display: inline!important;
}
::ng-deep .mat-drawer-content {
overflow: hidden!important;
background-color: #ffff;
}
// ::ng-deep .body-container {
// overflow-x: hidden;
// overflow-y: hidden;
// background-color: #ffff;
// }
::ng-deep .mat-expansion-panel:not([class*='mat-elevation-z']) {
box-shadow: none!important;
}
img {
width: 30px;
height: 30px;
border-radius: 50%;
}
.fullscreen{
position: absolute !important;
height: auto !important;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
tr.mat-header-row {
height: 30px!important;
}
.font-color{
font-weight: 600;
font-size: 14px;
}
.edit-color{
color: white;
color: rgba(0, 0, 0, 0.54);
}
.edit-color:hover {
color: #4caf50;
@ -94,12 +55,31 @@ $main-color: #f44336;
.delete:hover {
color:#ff0000;
}
.icon-lft{
margin-left: 6rem;
}
.Specialties-rightUpdate{
top: 1rem;
right: 0;
position: absolute;
padding-right: 2.5rem;
// ::ng-deep .mat-form-field-appearance-legacy .mat-form-field-wrapper {
// width: 180%;
// }
::ng-deep .mat-content {
display: block!important;
flex: 1;
/* flex-direction: row; */
/* overflow: hidden; */
overflow-x: auto!important;
overflow-y: auto!important;
}
::ng-deep .mat-select-arrow {
margin: 0 15px!important;
}
::ng-deep .mat-paginator {
margin-top: -10px!important;
}
::ng-deep body.swal2-height-auto {
height: 100% !important
}
.example-container {
display: block;
height: 348px;
/* overflow: auto; */
overflow-x: hidden;
overflow-y: auto;
}

View File

@ -20,6 +20,7 @@ export class ServiceListComponent implements OnInit {
addFormData: any;
push: any;
id: number;
displayedColumns: string[] = ['serviceId','servicesName','duration','action'];
serviceId: number;
public servicesList:any = new MatTableDataSource();
constructor(public _api:ApiServiceService, public dialog: MatDialog) { }
@ -100,7 +101,7 @@ export class ServiceListComponent implements OnInit {
openDialog(action,obj) {
obj.action = action;
const dialogRef = this.dialog.open(AddServiceComponent, {
width: '39%',
width: '30%',
height: '100%',
// maxWidth: '38vw',
position: { right: '0' },
@ -122,7 +123,7 @@ export class ServiceListComponent implements OnInit {
let addFormData = {
// busId: 'abc123',
// id: row_obj.id,
duration:row_obj.duration,
serviceId: row_obj.serviceId,
servicesName: row_obj.servicesName
};
@ -130,8 +131,11 @@ export class ServiceListComponent implements OnInit {
}else if(result.event == 'Update'){
console.log(row_obj)
console.log('Update')
let updatevalue = { serviceId: row_obj.serviceId,
servicesName: row_obj.servicesName }
let updatevalue = {
serviceId: row_obj.serviceId,
duration:row_obj.duration,
servicesName: row_obj.servicesName
}
formValue.push(updatevalue);
}
else if(result == 'Delete'){
@ -164,4 +168,12 @@ let updatevalue = { serviceId: row_obj.serviceId,
});
}
applyFilter(event: Event) {
const filterValue = (event.target as HTMLInputElement).value;
this.servicesList.filter = filterValue.trim().toLowerCase();
if (this.servicesList.paginator) {
this.servicesList.paginator.firstPage();
}
}
}

View File

@ -10,7 +10,6 @@ import { ServiceListComponent } from './service-list-details/service-list.compon
import { SearchCategoryComponent } from './search-category/search-category.component';
import { CentersListComponent } from './business-centers/centers-list.component';
import { ConsultantsListComponent } from './consultants/consultants-list.component';
import { DialogBoxComponent } from './service-list-details/dialog-box/dialog-box.component';
import { ConsultantsDetailsComponent } from './consultants/consultants-details/consultants-details.component';
@ -21,7 +20,6 @@ import { ConsultantsDetailsComponent } from './consultants/consultants-details/c
SearchCategoryComponent,
ConsultantsListComponent,
CentersListComponent,
DialogBoxComponent,
ConsultantsDetailsComponent
],
imports: [

View File

@ -1,20 +0,0 @@
<h5 mat-dialog-title> <strong>{{action}} Services</strong>
<button mat-icon-button type="button" matTooltip="Close" class="button" matTooltipPosition="above" (click)="close()"
><mat-icon>close</mat-icon></button></h5>
<form [formGroup]="form" (ngSubmit)="submit()">
<div mat-dialog-content class="my-table">
<mat-form-field appearance="outline" *ngIf="action != 'Delete'; else elseTemplate" class="mat-pane">
<input placeholder="servicesName" matInput formControlName="servicesName">
<mat-error *ngIf="myError('servicesName', 'required')">ServiceName is required</mat-error>
<mat-error *ngIf="myError('servicesName', 'maxlength')">Limit exceed</mat-error>
</mat-form-field>
<ng-template #elseTemplate>
Sure to delete <b>{{local_data.servicesName}}</b>?
</ng-template>
</div>
<div mat-dialog-actions>
<button mat-button type="submit" class="mat-green" mat-raised-button >{{action}}</button>
<button mat-button (click)="closeDialog()" >Cancel</button>
</div>
</form>

View File

@ -1,11 +0,0 @@
.button{
// float: right;
margin-bottom: 1rem;
background-color: #ffff;
margin-top: -1rem;
// margin-left: 6rem;
float: right;
}
.mat-pane{
width: 20rem;
}

View File

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

View File

@ -1,58 +0,0 @@
import { Component, Inject, OnInit, Optional } from '@angular/core';
import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { Router } from '@angular/router';
export interface UsersData {
servicesName: string;
id: number;
}
@Component({
selector: 'app-add-service',
templateUrl: './add-service.component.html',
styleUrls: ['./add-service.component.scss']
})
export class AddServiceComponent implements OnInit {
form: FormGroup;
local_data:any;
action:string;
constructor(private router: Router,private formBuilder: FormBuilder,
public dialogRef: MatDialogRef<AddServiceComponent>,
@Optional() @Inject(MAT_DIALOG_DATA) public data: UsersData) {
console.log(data);
this.local_data = {...data};
this.action = this.local_data.action;
}
get f(){
return this.form.controls;
}
close() {
this.dialogRef.close();
}
closeDialog(){
this.dialogRef.close({event:'Cancel'});
}
ngOnInit() {
this.form = new FormGroup({
servicesName: new FormControl('', [Validators.required, Validators.maxLength(20)]),
});
this.form.patchValue(this.local_data)
}
public myError = (controlName: string, errorName: string) =>{
return this.form.controls[controlName].hasError(errorName);
}
submit(){
console.log(this.form.value);
let tmp = this.form.value
tmp.serviceId = this.local_data.serviceId
this.dialogRef.close({event:this.action,data:tmp});
console.log(this.form.value);
console.log(this.action,this.local_data)
}
}

View File

@ -10,8 +10,8 @@ export class RoleMenuItemsPipe implements PipeTransform {
// // this is for horizontal menu filter
// if(type=="1"){
switch(localStorage.getItem('user_role')){
case 'SADMIN': return value.filter(val=>val.state!="appoinments" && val.state!="customers" && val.state != "consultant-setting");
case 'BADMIN': return value.filter(val=>val.state !="business" && val.state!="appoinments" && val.state!="customers" && val.state!="consultants" && val.state != "consultant-setting");
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 'PRACTITIONER': return value.filter(val=>val.state !="business" && val.state!="consultants" && val.state!="users" && val.state!="services");
// case 'PRACTITIONER':
// case '3': return value.filter(val=>val.state!="settings");

View File

@ -93,12 +93,12 @@ const MENUITEMS : Menu[] = [
// // {state: 'add-user-list', name: 'Add Users '},
// ]
},
// {
// state: 'consultant-setting',
// name: 'My Settings',
// type: 'link',
// icon: 'settings_system_daydream'
// },
{
state: 'consultant-setting',
name: 'My Settings',
type: 'link',
icon: 'settings_system_daydream'
},
// {
// state: 'business-centers',
// name: 'Centers',
@ -110,13 +110,7 @@ const MENUITEMS : Menu[] = [
// name: 'search Category',
// type: 'link',
// icon: 'settings_system_daydream'
// },
// {
// state: 'slot-booking',
// name: 'Slot Booking',
// type: 'link',
// icon: 'settings_system_daydream'
// }
// },
];