simpo-component-library 2.1.88 → 2.1.89
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/sections/registration-form/registration-form.component.mjs +3 -3
- package/fesm2022/simpo-component-library.mjs +2 -2
- package/fesm2022/simpo-component-library.mjs.map +1 -1
- package/package.json +1 -1
- package/simpo-component-library-2.1.89.tgz +0 -0
- package/simpo-component-library-2.1.88.tgz +0 -0
@@ -9443,7 +9443,7 @@ class RegistrationFormComponent extends BaseSection {
|
|
9443
9443
|
return response;
|
9444
9444
|
}
|
9445
9445
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.1.4", ngImport: i0, type: RegistrationFormComponent, deps: [{ token: RestService }, { token: i2$3.MatSnackBar }, { token: EventsService }, { token: i2$2.ActivatedRoute }, { token: i1.DomSanitizer }, { token: ImageUplaodService }], target: i0.ɵɵFactoryTarget.Component }); }
|
9446
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.4", type: RegistrationFormComponent, isStandalone: true, selector: "simpo-registration-form", inputs: { data: "data", index: "index", edit: "edit", nextComponentColor: "nextComponentColor" }, usesInheritance: true, ngImport: i0, template: "<section simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\">\n <div #mainContainer class=\"rowFlex\" [id]=\"data?.id\" [simpoOverlay]=\"styles?.background\"\n [simpoBorder]=\"styles?.border\">\n <div class=\"main-section\"\n [ngClass]=\"{'justify-content-md-start': styles?.layout?.align === 'left' , 'justify-content-md-end': styles?.layout?.align === 'right'}\"\n [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\">\n <div class=\"body-section\">\n <div [simpoAnimation]=\"styles?.animation\" [id]=\"data?.id\">\n <div>\n <simpo-text-element [textData]=\"content?.inputText?.[0]?.value\" [textLabel]=\"content?.inputText?.[0]?.label\"></simpo-text-element>\n </div>\n <div class=\"d-flex gap-2 d-md-flex mt-15\" *ngIf=\"data?.action?.display\" [ngClass]=\"[\n styles?.layout?.align === 'left' ? 'justify-content-md-start' : '',\n styles?.layout?.align === 'center' ? 'justify-content-md-center' : '',\n styles?.layout?.align === 'right' ? 'justify-content-md-end' : ''\n ]\">\n </div>\n </div>\n </div>\n </div>\n </div>\n\n </div>\n\n <section class=\"main-section\">\n <div *ngIf=\"formStatus != 'REGISTERED' && formStatus != 'ADMITTED'\">\n <div class=\"subTabs_section\">\n <div class=\"list_tabs d-flex align-items-center\">\n <ng-container *ngFor=\"let key of Object.keys(fieldData)\">\n <div class=\"single_tab cursor-pointer\" (click)=\"selectedKey = key\"\n [ngClass]=\"selectedKey === key ? 'single_tab_active' : 'single_tab'\">\n {{key | titlecase}}\n </div>\n </ng-container>\n <div class=\"single_tab cursor-pointer\" (click)=\"selectedKey = 'Document'\" *ngIf=\"data?.sectionType === 'admissionForm'\"\n [ngClass]=\"selectedKey === 'Document' ? 'single_tab_active' : 'single_tab'\">\n Document\n </div>\n <div class=\"single_tab cursor-pointer\" (click)=\"redirectToPayment()\"\n *ngIf=\"data?.sectionType === 'admissionForm'\"\n [ngClass]=\"selectedKey === 'Payment' ? 'single_tab_active' : 'single_tab'\">\n Payment\n </div>\n </div>\n </div>\n\n <div class=\"main-content\">\n <ng-container *ngFor=\"let group of fieldData[selectedKey] ? Object.keys(fieldData[selectedKey]) : [];let groupIndex = index\">\n <div class=\"body\" *ngIf=\"group !== 'Backup Contact'\">\n <div class=\"list_tabs backToLeads d-flex align-items-center\">\n {{group}}\n </div>\n\n <ng-container *ngIf=\"groupIndex == 0 && Object.keys(fieldData)[0] === selectedKey\">\n <div class=\"image-box\" *ngIf=\"!payload.imgUrl\">\n <img class=\"dummy-image\" src=\"../../../../../../../../../assets/images/master/add-image.svg\"\n (click)=\"fileInput.click()\" alt=\"\">\n <div class=\"image_box\">\n <span class=\"fc_browse_btn\" id=\"display_browse_btn\" (click)=\"fileInput.click()\">Click to\n upload</span>\n </div>\n </div>\n <input style=\"display: none;\" id=\"vendorImage\" type=\"file\" name=\"myfile\"\n accept=\"image/x-png,image/jpeg,image/jpg\" (change)=\"updateAdmissionImage($event)\" class=\"pc-btn\"\n id=\"browse_contact_image\" #fileInput />\n\n <div *ngIf=\"payload.imgUrl\" class=\"addedImg\">\n <div class=\"uploadedImg\">\n <img alt=\"\" [src]=\"ds.bypassSecurityTrustUrl(payload.imgUrl)\">\n </div>\n <div class=\"image-buttons\">\n <div class=\"button\" (click)=\"fileInput.click()\">\n <img src=\"../../../../../../../../../assets/images/blogs/change_image.svg\" alt=\"\">\n Change Image\n </div>\n <div class=\"button delete-change\" (click)=\"deleteImg()\">\n\n <div class=\"delete\">\n <img src=\"./../../../../../../../../../assets/images/blogs/delete_image.svg\" alt=\"\">\n <div>Delete</div>\n </div>\n\n </div>\n </div>\n\n </div>\n </ng-container>\n\n <div class=\"row mt-1\">\n <div class=\"col-md-4 col-12 mt-1\" *ngFor=\"let info of fieldData[selectedKey][group]\">\n <label for=\"\" class=\"label-text\">{{info.fieldLabel}}</label> <span style=\"color: red;\" *ngIf=\"info.required\">*</span> <br>\n <ng-container *ngTemplateOutlet=\"inputData; context: {data: info}\"></ng-container>\n </div>\n </div>\n </div>\n\n <div class=\"body\" *ngIf=\"fieldData[selectedKey].hasOwnProperty('Backup Contact') && studentLiveWith === 'single parent' && groupIndex == 0 && Object.keys(fieldData)[0] === selectedKey\">\n <div class=\"list_tabs backToLeads d-flex align-items-center\">\n Backup Contact (Optional)\n </div>\n\n <div class=\"row mt-1\">\n <div class=\"col-md-12\">\n <label class=\"mtb-15 checkbox-label\">\n <input type=\"checkbox\" name=\"\" id=\"\" [(ngModel)]=\"payload.parentAuthorization\">\n I authorize the school to release the child only to the parent listed above\n </label>\n </div>\n <div class=\"col-md-4 col-12 mt-1\" *ngFor=\"let info of fieldData[selectedKey]['Backup Contact']\">\n <label for=\"\" class=\"label-text\">{{info.fieldLabel}}</label> <span style=\"color: red;\"\n *ngIf=\"info.required\">*</span> <br>\n <ng-container *ngTemplateOutlet=\"inputData; context: {data: info}\"></ng-container>\n </div>\n <div class=\"col-md-4 col-12 mt-1\">\n <label for=\"\" class=\"label-text\">Upload Supporting Document (Optional)</label>\n <div class=\"input-text upload-file\" (click)=\"backUpDocInput.click()\">\n <p>{{backupDocFile ? 'File Uploaded' : 'Upload File'}}</p>\n <mat-icon>cloud_upload</mat-icon>\n </div>\n <input id=\"vendorImage\" type=\"file\" name=\"myfile\" hidden\n accept=\".doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,image/x-png,image/jpeg,image/jpg,.pdf, video/mp4,video/x-matroska,video/x-msvideo,video/quicktime\"\n (change)=\"uploadBackUpDocument($event)\" class=\"pc-btn\"\n id=\"browse_contact_image\" #backUpDocInput />\n </div>\n </div>\n </div>\n\n </ng-container>\n <div class=\"payment-details\" *ngIf=\"selectedKey === 'Document' && data?.sectionType === 'admissionForm'\">\n <simpo-document [documentList]=\"documentList\"></simpo-document>\n </div>\n <div class=\"payment-details\" *ngIf=\"selectedKey === 'Payment' && data?.sectionType === 'admissionForm'\">\n <simpo-payment-details [admissionData]=\"payload\"\n [subscriptionsData]=\"subscriptionsData\" [termPaymentList]=\"termPaymentList\"></simpo-payment-details>\n </div>\n </div>\n\n <div class=\"button-parent\">\n <ng-container *ngFor=\"let button of data?.action?.buttons\">\n <button class=\"button\" (click)=\"submitForm()\" simpoButtonDirective [id]=\"data?.id+button.id\"\n [buttonStyle]=\"button.styles\" *ngIf=\"(data?.sectionType === 'admissionForm' && selectedKey == 'Payment') ||\n (data?.sectionType === 'registrationForm' &&\n (Object.keys(fieldData)[Object.keys(fieldData).length - 1] == selectedKey))\"\n [color]=\"data?.styles?.background?.accentColor\">{{button?.content?.label}}</button>\n\n <button class=\"button\" (click)=\"continueAdmission()\" simpoButtonDirective [id]=\"data?.id+button.id\"\n [buttonStyle]=\"button.styles\" *ngIf=\"selectedKey != 'Payment' && data?.sectionType === 'admissionForm'\"\n [color]=\"data?.styles?.background?.accentColor\">Continue</button>\n\n <button class=\"button\" (click)=\"continueAdmission()\" simpoButtonDirective [id]=\"data?.id+button.id\"\n [buttonStyle]=\"button.styles\"\n *ngIf=\"data?.sectionType === 'registrationForm' && (Object.keys(fieldData)[Object.keys(fieldData).length - 1] != selectedKey)\"\n [color]=\"data?.styles?.background?.accentColor\">Continue</button>\n </ng-container>\n </div>\n </div>\n\n <div class=\"emptyText\" *ngIf=\"formStatus == 'REGISTERED' || formStatus == 'ADMITTED'\">\n <img [src]=\"content?.image?.url\" alt=\"\" *ngIf=\"content?.image?.showImage\">\n <div class=\"heading-large\" [innerHtml]=\"content?.inputText?.[1]?.value\"></div>\n </div>\n </section>\n\n <ng-template #inputData let-field=\"data\">\n <div *ngIf=\"field.dataType == 'IMAGE'\">\n <div class=\"image-box\">\n <img class=\"dummy-image\" src=\"../../../../../../../../../assets/images/master/add-image.svg\"\n (click)=\"fileInput.click()\" alt=\"\">\n <div class=\"d-flex align-items-center\">\n <span class=\"fc_browse_btn\" id=\"display_browse_btn\" (click)=\"fileInput.click()\">Click to\n upload</span>\n </div>\n </div>\n <input style=\"display: none;\" id=\"vendorImage\" type=\"file\" name=\"myfile\" accept=\"image/x-png,image/jpeg,image/jpg\"\n (change)=\"updateAdmissionImage($event)\" class=\"pc-btn\" id=\"browse_contact_image\" #fileInput />\n </div>\n <div *ngIf=\"field.dataType === 'TEXT'\">\n <input type=\"text\" class=\"input-text\" [placeholder]=\"'Enter'+field.label\" [(ngModel)]=\"field.fieldValue\">\n </div>\n <div *ngIf=\"field.dataType === 'NUMBER'\">\n <input type=\"number\" class=\"input-text\" [placeholder]=\"'Enter'+field.label\" [(ngModel)]=\"field.fieldValue\">\n </div>\n <div *ngIf=\"field.dataType === 'MONEY'\">\n <input type=\"text\" class=\"input-text\" [placeholder]=\"'Enter'+field.label\" [(ngModel)]=\"field.fieldValue\">\n </div>\n <div *ngIf=\"field.dataType === 'DATE'\">\n <input type=\"date\" class=\"input-text\" [(ngModel)]=\"field.fieldValue\" [placeholder]=\"'Select'+field.label\">\n </div>\n <div *ngIf=\"field.dataType === 'DROPDOWN'\" class=\"admission\">\n <mat-form-field class=\"input-text\" appearance=\"outline\">\n <mat-select class=\"inputStyle\" placeholder=\"--Select--\" [(ngModel)]=\"field.fieldValue\" [multiple]=\"field.multipleSelection\">\n <ng-container *ngIf=\"(field?.value?.length || 0) > 0\">\n <mat-option *ngFor=\"let item of field.value\" [value]=\"item?.value\" (click)=\"masterDropdownValueChange(item, field)\">{{item.label}}</mat-option>\n </ng-container>\n <ng-container *ngIf=\"(field?.value?.length || 0) == 0\">\n <mat-option *ngFor=\"let item of field.sourceData[field.dataSourceType]\"\n (click)=\"inputFieldChange(item, field)\" [value]=\"item?.name\">{{item.name}}</mat-option>\n </ng-container>\n </mat-select>\n </mat-form-field>\n </div>\n <div *ngIf=\"field.dataType === 'CHECKBOX'\">\n <ng-container *ngIf=\"(field?.value?.length || 0) > 0\">\n <div class=\"form-check mb-5\" *ngFor=\"let data of field.value\">\n <input class=\"form-check-input\" type=\"checkbox\" value=\"\" id=\"flexCheckChecked\" [(ngModel)]=\"data.checked\">\n <label class=\"form-check-label\" for=\"flexCheckChecked\">\n {{data.label}}\n </label>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"(field?.value?.length || 0) == 0\">\n <div class=\"form-check mb-5\" *ngFor=\"let data of field.sourceData[field.dataSourceType]\">\n <input class=\"form-check-input\" type=\"checkbox\" value=\"\" id=\"flexCheckChecked\" [(ngModel)]=\"data.checked\">\n <label class=\"form-check-label\" for=\"flexCheckChecked\">\n {{data.name}}\n </label>\n </div>\n </ng-container>\n </div>\n </ng-template>\n\n\n <ng-container *ngIf=\"styles?.devider?.display\">\n <simpo-svg-divider [dividerType]=\"styles?.devider?.deviderType\"\n [color]=\"nextComponentColor?.color\"></simpo-svg-divider>\n </ng-container>\n <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total_container{height:auto;position:relative}.body-section{padding:4% 15px}.button-section{margin-top:15px}.clipPath{clip-path:polygon(0% 100%,50% 0%,100% 100%);height:100px;background-color:#00f}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:auto}.mt-15{margin-top:15px}@media only screen and (max-width: 475px){.d-flex{justify-content:center;margin-bottom:25px}}.main-section{width:100%;overflow-y:hidden}.subTabs_section{padding:1rem 5rem;height:12vh}.active_route_section{height:89%;border:1px solid #0000000F;padding:15px 20px;background-color:#fff;border-radius:6px}.active_route_section_normal{background-color:#f6f6f6;border:none;padding:10px 4rem}.list_tabs{border:1px solid #0000001A;background-color:#ffffffe5;padding:10px;border-radius:6px;gap:10px;height:50px}.single_tab{color:#0e233c99;font-size:14px;font-weight:500;font-family:interReg;padding:10px 20px}.single_tab_active{width:max-content;height:32px;background-color:#0015800a;display:flex;align-items:center;font-weight:600;padding:10px 20px;border-radius:4px;color:#0e233c}.align-items-center{align-items:center}.header{height:8vh;padding:10px;border-bottom:2px solid rgba(0,0,0,.06);display:flex}.p-5{padding:5rem}.backToLeads{color:#000!important}.body{margin:1rem 5rem 0rem;box-shadow:#00000029 0 1px 4px;padding:2rem;border-radius:10px}.profile-img{display:flex;align-items:center;gap:2rem}.mt-2{margin-top:2rem!important}.mt-1{margin-top:1rem!important}.image-box{display:flex;gap:1rem;margin-top:3rem;cursor:pointer}.image-box span{color:#0189ea;font-size:14px;font-weight:500;padding:11px 7rem;border:2px solid rgba(0,0,0,.06);height:47px;border-radius:10px}.image_box{display:flex;align-items:center}.dummy-image{height:55px}.label-text{font-weight:400;font-family:Inter;font-size:14px;color:#434443}.input-text{border-radius:7px;border:2px solid rgba(208,213,221,1);height:42px;width:100%;margin-top:5px;padding-left:10px}.footer{display:flex;gap:1rem;align-items:center;justify-content:flex-end;height:8vh;padding:10px;border-top:2px solid rgba(0,0,0,.06);position:absolute;bottom:0;width:100%}.footer .continue{font-size:13px;font-family:interMedium;color:#242424;font-weight:500;border:none;background-color:#f6c318;padding:10px 20px;border-radius:8px;width:max-content}.footer .cancel{font-size:13px;font-family:interMedium;color:#f6c318;font-weight:500;border:1px solid #F6C318;background-color:#fff;padding:10px 20px;border-radius:8px;width:max-content}.main-content{overflow:scroll;padding-top:5px;padding-bottom:10px}.button-parent{padding:1rem 5rem 1rem 2rem;align-items:center;display:flex;justify-content:flex-end}.button{font-size:16px!important;padding:1rem 2rem;display:inline-flex;align-items:center;justify-content:center;width:fit-content!important}.payment-details{margin:1rem 5rem 0rem;box-shadow:#00000029 0 1px 4px;border-radius:10px}.mb-5{margin-bottom:5px!important}.addedImg{display:flex;gap:5%;width:95%;margin-top:2rem}.addedImg .uploadedImg img{height:65px;width:65px;border-radius:50%}.addedImg .image-buttons{display:flex;gap:3%;padding-top:20px}.addedImg .image-buttons .button{display:flex;gap:8px;width:142px;height:40px;padding:12px 8px;font-family:lexandMedium;color:#3f3b3b;font-style:normal;font-weight:500;font-size:12px!important;border:1px dashed #E4E7EC;border-radius:12px;cursor:pointer}.addedImg .image-buttons .button img{width:20px}.addedImg .image-buttons .button .delete{display:flex;gap:15%;width:60%;margin:auto}.addedImg .image-buttons .button .delete img{width:12px}.emptyText{height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:50px}.emptyText img{height:200px}@media screen and (max-width: 475px){.body{margin:0rem}.emptyText{padding:1rem}.emptyText img{width:100%}.subTabs_section{padding:1rem .5rem}.list_tabs{white-space:nowrap;overflow:scroll;justify-content:flex-start}.payment-details{margin:0rem}}.mtb-15{margin-top:15px;margin-bottom:15px}.checkbox-label{display:flex;align-items:center;gap:15px}.checkbox-label input{height:16px;width:16px}.upload-file{display:flex;align-items:center;justify-content:space-between;padding-right:10px}.upload-file mat-icon{color:#4caf50}.upload-file p{margin-bottom:0}@media only screen and (min-width: 320px) and (max-width : 500px){.image-box span{padding:11px 4rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i4.TitleCasePipe, name: "titlecase" }, { kind: "ngmodule", type: MatGridListModule }, { kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: TextElementComponent, selector: "simpo-text-element", inputs: ["textData", "textLabel"] }, { kind: "component", type: SvgDividerComponent, selector: "simpo-svg-divider", inputs: ["dividerType", "color"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions", "isMerged", "isEcommerce"], outputs: ["edit"] }, { kind: "component", type: PaymentDetailsComponent, selector: "simpo-payment-details", inputs: ["admissionData", "subscriptionsData", "termPaymentList"] }, { kind: "component", type: DocumentComponent, selector: "simpo-document", inputs: ["documentList"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type:
|
9446
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.1.4", type: RegistrationFormComponent, isStandalone: true, selector: "simpo-registration-form", inputs: { data: "data", index: "index", edit: "edit", nextComponentColor: "nextComponentColor" }, usesInheritance: true, ngImport: i0, template: "<section simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\">\n <div #mainContainer class=\"rowFlex\" [id]=\"data?.id\" [simpoOverlay]=\"styles?.background\"\n [simpoBorder]=\"styles?.border\">\n <div class=\"main-section\"\n [ngClass]=\"{'justify-content-md-start': styles?.layout?.align === 'left' , 'justify-content-md-end': styles?.layout?.align === 'right'}\"\n [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\">\n <div class=\"body-section\">\n <div [simpoAnimation]=\"styles?.animation\" [id]=\"data?.id\">\n <div>\n <simpo-text-element [textData]=\"content?.inputText?.[0]?.value\" [textLabel]=\"content?.inputText?.[0]?.label\"></simpo-text-element>\n </div>\n <div class=\"d-flex gap-2 d-md-flex mt-15\" *ngIf=\"data?.action?.display\" [ngClass]=\"[\n styles?.layout?.align === 'left' ? 'justify-content-md-start' : '',\n styles?.layout?.align === 'center' ? 'justify-content-md-center' : '',\n styles?.layout?.align === 'right' ? 'justify-content-md-end' : ''\n ]\">\n </div>\n </div>\n </div>\n </div>\n </div>\n\n </div>\n\n <section class=\"main-section\">\n <div *ngIf=\"formStatus != 'REGISTERED' && formStatus != 'ADMITTED'\">\n <div class=\"subTabs_section\">\n <div class=\"list_tabs d-flex align-items-center\">\n <ng-container *ngFor=\"let key of Object.keys(fieldData)\">\n <div class=\"single_tab cursor-pointer\" (click)=\"selectedKey = key\"\n [ngClass]=\"selectedKey === key ? 'single_tab_active' : 'single_tab'\">\n {{key | titlecase}}\n </div>\n </ng-container>\n <div class=\"single_tab cursor-pointer\" (click)=\"selectedKey = 'Document'\" *ngIf=\"data?.sectionType === 'admissionForm'\"\n [ngClass]=\"selectedKey === 'Document' ? 'single_tab_active' : 'single_tab'\">\n Document\n </div>\n <div class=\"single_tab cursor-pointer\" (click)=\"redirectToPayment()\"\n *ngIf=\"data?.sectionType === 'admissionForm'\"\n [ngClass]=\"selectedKey === 'Payment' ? 'single_tab_active' : 'single_tab'\">\n Payment\n </div>\n </div>\n </div>\n\n <div class=\"main-content\">\n <ng-container *ngFor=\"let group of fieldData[selectedKey] ? Object.keys(fieldData[selectedKey]) : [];let groupIndex = index\">\n <div class=\"body\" *ngIf=\"group !== 'Backup Contact'\">\n <div class=\"list_tabs backToLeads d-flex align-items-center\">\n {{group}}\n </div>\n\n <ng-container *ngIf=\"groupIndex == 0 && Object.keys(fieldData)[0] === selectedKey\">\n <div class=\"image-box\" *ngIf=\"!payload.imgUrl\">\n <img class=\"dummy-image\" src=\"../../../../../../../../../assets/images/master/add-image.svg\"\n (click)=\"fileInput.click()\" alt=\"\">\n <div class=\"image_box\">\n <span class=\"fc_browse_btn\" id=\"display_browse_btn\" (click)=\"fileInput.click()\">Click to\n upload</span>\n </div>\n </div>\n <input style=\"display: none;\" id=\"vendorImage\" type=\"file\" name=\"myfile\"\n accept=\"image/x-png,image/jpeg,image/jpg\" (change)=\"updateAdmissionImage($event)\" class=\"pc-btn\"\n id=\"browse_contact_image\" #fileInput />\n\n <div *ngIf=\"payload.imgUrl\" class=\"addedImg\">\n <div class=\"uploadedImg\">\n <img alt=\"\" [src]=\"ds.bypassSecurityTrustUrl(payload.imgUrl)\">\n </div>\n <div class=\"image-buttons\">\n <div class=\"button\" (click)=\"fileInput.click()\">\n <img src=\"../../../../../../../../../assets/images/blogs/change_image.svg\" alt=\"\">\n Change Image\n </div>\n <div class=\"button delete-change\" (click)=\"deleteImg()\">\n\n <div class=\"delete\">\n <img src=\"./../../../../../../../../../assets/images/blogs/delete_image.svg\" alt=\"\">\n <div>Delete</div>\n </div>\n\n </div>\n </div>\n\n </div>\n </ng-container>\n\n <div class=\"row mt-1\">\n <div class=\"col-md-4 col-12 mt-1\" *ngFor=\"let info of fieldData[selectedKey][group]\">\n <label for=\"\" class=\"label-text\">{{info.fieldLabel}}</label> <span style=\"color: red;\" *ngIf=\"info.required\">*</span> <br>\n <ng-container *ngTemplateOutlet=\"inputData; context: {data: info}\"></ng-container>\n </div>\n </div>\n </div>\n\n <div class=\"body\" *ngIf=\"fieldData[selectedKey].hasOwnProperty('Backup Contact') && studentLiveWith === 'single parent' && groupIndex == 0 && Object.keys(fieldData)[0] === selectedKey\">\n <div class=\"list_tabs backToLeads d-flex align-items-center\">\n Backup Contact (Optional)\n </div>\n\n <div class=\"row mt-1\">\n <div class=\"col-md-12\">\n <label class=\"mtb-15 checkbox-label\">\n <input type=\"checkbox\" name=\"\" id=\"\" [(ngModel)]=\"payload.parentAuthorization\">\n I authorize the school to release the child only to the parent listed above\n </label>\n </div>\n <div class=\"col-md-4 col-12 mt-1\" *ngFor=\"let info of fieldData[selectedKey]['Backup Contact']\">\n <label for=\"\" class=\"label-text\">{{info.fieldLabel}}</label> <span style=\"color: red;\"\n *ngIf=\"info.required\">*</span> <br>\n <ng-container *ngTemplateOutlet=\"inputData; context: {data: info}\"></ng-container>\n </div>\n <div class=\"col-md-4 col-12 mt-1\">\n <label for=\"\" class=\"label-text\">Upload Supporting Document (Optional)</label>\n <div class=\"input-text upload-file\" (click)=\"backUpDocInput.click()\">\n <p>{{backupDocFile ? 'File Uploaded' : 'Upload File'}}</p>\n <mat-icon>cloud_upload</mat-icon>\n </div>\n <input id=\"vendorImage\" type=\"file\" name=\"myfile\" hidden\n accept=\".doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,image/x-png,image/jpeg,image/jpg,.pdf, video/mp4,video/x-matroska,video/x-msvideo,video/quicktime\"\n (change)=\"uploadBackUpDocument($event)\" class=\"pc-btn\"\n id=\"browse_contact_image\" #backUpDocInput />\n </div>\n </div>\n </div>\n\n </ng-container>\n <div class=\"payment-details\" *ngIf=\"selectedKey === 'Document' && data?.sectionType === 'admissionForm'\">\n <simpo-document [documentList]=\"documentList\"></simpo-document>\n </div>\n <div class=\"payment-details\" *ngIf=\"selectedKey === 'Payment' && data?.sectionType === 'admissionForm'\">\n <simpo-payment-details [admissionData]=\"payload\"\n [subscriptionsData]=\"subscriptionsData\" [termPaymentList]=\"termPaymentList\"></simpo-payment-details>\n </div>\n </div>\n\n <div class=\"button-parent\">\n <ng-container *ngFor=\"let button of data?.action?.buttons\">\n <button class=\"button\" (click)=\"submitForm()\" simpoButtonDirective [id]=\"data?.id+button.id\"\n [buttonStyle]=\"button.styles\" *ngIf=\"(data?.sectionType === 'admissionForm' && selectedKey == 'Payment') ||\n (data?.sectionType === 'registrationForm' &&\n (Object.keys(fieldData)[Object.keys(fieldData).length - 1] == selectedKey))\"\n [color]=\"data?.styles?.background?.accentColor\">{{button?.content?.label}}</button>\n\n <button class=\"button\" (click)=\"continueAdmission()\" simpoButtonDirective [id]=\"data?.id+button.id\"\n [buttonStyle]=\"button.styles\" *ngIf=\"selectedKey != 'Payment' && data?.sectionType === 'admissionForm'\"\n [color]=\"data?.styles?.background?.accentColor\">Continue</button>\n\n <button class=\"button\" (click)=\"continueAdmission()\" simpoButtonDirective [id]=\"data?.id+button.id\"\n [buttonStyle]=\"button.styles\"\n *ngIf=\"data?.sectionType === 'registrationForm' && (Object.keys(fieldData)[Object.keys(fieldData).length - 1] != selectedKey)\"\n [color]=\"data?.styles?.background?.accentColor\">Continue</button>\n </ng-container>\n </div>\n </div>\n\n <div class=\"emptyText\" *ngIf=\"formStatus == 'REGISTERED' || formStatus == 'ADMITTED'\">\n <img [src]=\"content?.image?.url\" alt=\"\" *ngIf=\"content?.image?.showImage\">\n <div class=\"heading-large\" [innerHtml]=\"content?.inputText?.[1]?.value\"></div>\n </div>\n </section>\n\n <ng-template #inputData let-field=\"data\">\n <div *ngIf=\"field.dataType == 'IMAGE'\">\n <div class=\"image-box\">\n <img class=\"dummy-image\" src=\"../../../../../../../../../assets/images/master/add-image.svg\"\n (click)=\"fileInput.click()\" alt=\"\">\n <div class=\"d-flex align-items-center\">\n <span class=\"fc_browse_btn\" id=\"display_browse_btn\" (click)=\"fileInput.click()\">Click to\n upload</span>\n </div>\n </div>\n <input style=\"display: none;\" id=\"vendorImage\" type=\"file\" name=\"myfile\" accept=\"image/x-png,image/jpeg,image/jpg\"\n (change)=\"updateAdmissionImage($event)\" class=\"pc-btn\" id=\"browse_contact_image\" #fileInput />\n </div>\n <div *ngIf=\"field.dataType === 'TEXT'\">\n <input type=\"text\" class=\"input-text\" [placeholder]=\"'Enter '+field.fieldLabel\" [(ngModel)]=\"field.fieldValue\">\n </div>\n <div *ngIf=\"field.dataType === 'NUMBER'\">\n <input type=\"number\" class=\"input-text\" [placeholder]=\"'Enter '+field.fieldLabel\" [(ngModel)]=\"field.fieldValue\">\n </div>\n <div *ngIf=\"field.dataType === 'MONEY'\">\n <input type=\"text\" class=\"input-text\" [placeholder]=\"'Enter '+field.fieldLabel\" [(ngModel)]=\"field.fieldValue\">\n </div>\n <div *ngIf=\"field.dataType === 'DATE'\">\n <input type=\"date\" class=\"input-text\" [(ngModel)]=\"field.fieldValue\" [placeholder]=\"'Select '+field.fieldLabel\">\n </div>\n <div *ngIf=\"field.dataType === 'DROPDOWN'\" class=\"admission\">\n <mat-form-field class=\"input-text\" appearance=\"outline\">\n <mat-select class=\"inputStyle\" placeholder=\"--Select--\" [(ngModel)]=\"field.fieldValue\" [multiple]=\"field.multipleSelection\">\n <ng-container *ngIf=\"(field?.value?.length || 0) > 0\">\n <mat-option *ngFor=\"let item of field.value\" [value]=\"item?.value\" (click)=\"masterDropdownValueChange(item, field)\">{{item.label}}</mat-option>\n </ng-container>\n <ng-container *ngIf=\"(field?.value?.length || 0) == 0\">\n <mat-option *ngFor=\"let item of field.sourceData[field.dataSourceType]\"\n (click)=\"inputFieldChange(item, field)\" [value]=\"item?.name\">{{item.name}}</mat-option>\n </ng-container>\n </mat-select>\n </mat-form-field>\n </div>\n <div *ngIf=\"field.dataType === 'CHECKBOX'\">\n <ng-container *ngIf=\"(field?.value?.length || 0) > 0\">\n <div class=\"form-check mb-5\" *ngFor=\"let data of field.value\">\n <input class=\"form-check-input\" type=\"checkbox\" value=\"\" id=\"flexCheckChecked\" [(ngModel)]=\"data.checked\">\n <label class=\"form-check-label\" for=\"flexCheckChecked\">\n {{data.label}}\n </label>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"(field?.value?.length || 0) == 0\">\n <div class=\"form-check mb-5\" *ngFor=\"let data of field.sourceData[field.dataSourceType]\">\n <input class=\"form-check-input\" type=\"checkbox\" value=\"\" id=\"flexCheckChecked\" [(ngModel)]=\"data.checked\">\n <label class=\"form-check-label\" for=\"flexCheckChecked\">\n {{data.name}}\n </label>\n </div>\n </ng-container>\n </div>\n </ng-template>\n\n\n <ng-container *ngIf=\"styles?.devider?.display\">\n <simpo-svg-divider [dividerType]=\"styles?.devider?.deviderType\"\n [color]=\"nextComponentColor?.color\"></simpo-svg-divider>\n </ng-container>\n <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total_container{height:auto;position:relative}.body-section{padding:4% 15px}.button-section{margin-top:15px}.clipPath{clip-path:polygon(0% 100%,50% 0%,100% 100%);height:100px;background-color:#00f}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:auto}.mt-15{margin-top:15px}@media only screen and (max-width: 475px){.d-flex{justify-content:center;margin-bottom:25px}}.main-section{width:100%;overflow-y:hidden}.subTabs_section{padding:1rem 5rem;height:12vh}.active_route_section{height:89%;border:1px solid #0000000F;padding:15px 20px;background-color:#fff;border-radius:6px}.active_route_section_normal{background-color:#f6f6f6;border:none;padding:10px 4rem}.list_tabs{border:1px solid #0000001A;background-color:#ffffffe5;padding:10px;border-radius:6px;gap:10px;height:50px}.single_tab{color:#0e233c99;font-size:14px;font-weight:500;font-family:interReg;padding:10px 20px}.single_tab_active{width:max-content;height:32px;background-color:#0015800a;display:flex;align-items:center;font-weight:600;padding:10px 20px;border-radius:4px;color:#0e233c}.align-items-center{align-items:center}.header{height:8vh;padding:10px;border-bottom:2px solid rgba(0,0,0,.06);display:flex}.p-5{padding:5rem}.backToLeads{color:#000!important}.body{margin:1rem 5rem 0rem;box-shadow:#00000029 0 1px 4px;padding:2rem;border-radius:10px}.profile-img{display:flex;align-items:center;gap:2rem}.mt-2{margin-top:2rem!important}.mt-1{margin-top:1rem!important}.image-box{display:flex;gap:1rem;margin-top:3rem;cursor:pointer}.image-box span{color:#0189ea;font-size:14px;font-weight:500;padding:11px 7rem;border:2px solid rgba(0,0,0,.06);height:47px;border-radius:10px}.image_box{display:flex;align-items:center}.dummy-image{height:55px}.label-text{font-weight:400;font-family:Inter;font-size:14px;color:#434443}.input-text{border-radius:7px;border:2px solid rgba(208,213,221,1);height:42px;width:100%;margin-top:5px;padding-left:10px}.footer{display:flex;gap:1rem;align-items:center;justify-content:flex-end;height:8vh;padding:10px;border-top:2px solid rgba(0,0,0,.06);position:absolute;bottom:0;width:100%}.footer .continue{font-size:13px;font-family:interMedium;color:#242424;font-weight:500;border:none;background-color:#f6c318;padding:10px 20px;border-radius:8px;width:max-content}.footer .cancel{font-size:13px;font-family:interMedium;color:#f6c318;font-weight:500;border:1px solid #F6C318;background-color:#fff;padding:10px 20px;border-radius:8px;width:max-content}.main-content{overflow:scroll;padding-top:5px;padding-bottom:10px}.button-parent{padding:1rem 5rem 1rem 2rem;align-items:center;display:flex;justify-content:flex-end}.button{font-size:16px!important;padding:1rem 2rem;display:inline-flex;align-items:center;justify-content:center;width:fit-content!important}.payment-details{margin:1rem 5rem 0rem;box-shadow:#00000029 0 1px 4px;border-radius:10px}.mb-5{margin-bottom:5px!important}.addedImg{display:flex;gap:5%;width:95%;margin-top:2rem}.addedImg .uploadedImg img{height:65px;width:65px;border-radius:50%}.addedImg .image-buttons{display:flex;gap:3%;padding-top:20px}.addedImg .image-buttons .button{display:flex;gap:8px;width:142px;height:40px;padding:12px 8px;font-family:lexandMedium;color:#3f3b3b;font-style:normal;font-weight:500;font-size:12px!important;border:1px dashed #E4E7EC;border-radius:12px;cursor:pointer}.addedImg .image-buttons .button img{width:20px}.addedImg .image-buttons .button .delete{display:flex;gap:15%;width:60%;margin:auto}.addedImg .image-buttons .button .delete img{width:12px}.emptyText{height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:50px}.emptyText img{height:200px}@media screen and (max-width: 475px){.body{margin:0rem}.emptyText{padding:1rem}.emptyText img{width:100%}.subTabs_section{padding:1rem .5rem}.list_tabs{white-space:nowrap;overflow:scroll;justify-content:flex-start}.payment-details{margin:0rem}}.mtb-15{margin-top:15px;margin-bottom:15px}.checkbox-label{display:flex;align-items:center;gap:15px}.checkbox-label input{height:16px;width:16px}.upload-file{display:flex;align-items:center;justify-content:space-between;padding-right:10px}.upload-file mat-icon{color:#4caf50}.upload-file p{margin-bottom:0}@media only screen and (min-width: 320px) and (max-width : 500px){.image-box span{padding:11px 4rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i4.TitleCasePipe, name: "titlecase" }, { kind: "ngmodule", type: MatGridListModule }, { kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: TextElementComponent, selector: "simpo-text-element", inputs: ["textData", "textLabel"] }, { kind: "component", type: SvgDividerComponent, selector: "simpo-svg-divider", inputs: ["dividerType", "color"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions", "isMerged", "isEcommerce"], outputs: ["edit"] }, { kind: "component", type: PaymentDetailsComponent, selector: "simpo-payment-details", inputs: ["admissionData", "subscriptionsData", "termPaymentList"] }, { kind: "component", type: DocumentComponent, selector: "simpo-document", inputs: ["documentList"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type:
|
9447
9447
|
//directive
|
9448
9448
|
AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground", "scrollValue"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: ButtonDirectiveDirective, selector: "[simpoButtonDirective]", inputs: ["buttonStyle", "color", "scrollValue"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "component", type: i13.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i11.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i5$1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i8.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i8.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i8.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
|
9449
9449
|
}
|
@@ -9477,7 +9477,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.1.4", ngImpor
|
|
9477
9477
|
MatSelectModule,
|
9478
9478
|
FormsModule,
|
9479
9479
|
MatIconModule
|
9480
|
-
], template: "<section simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\">\n <div #mainContainer class=\"rowFlex\" [id]=\"data?.id\" [simpoOverlay]=\"styles?.background\"\n [simpoBorder]=\"styles?.border\">\n <div class=\"main-section\"\n [ngClass]=\"{'justify-content-md-start': styles?.layout?.align === 'left' , 'justify-content-md-end': styles?.layout?.align === 'right'}\"\n [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\">\n <div class=\"body-section\">\n <div [simpoAnimation]=\"styles?.animation\" [id]=\"data?.id\">\n <div>\n <simpo-text-element [textData]=\"content?.inputText?.[0]?.value\" [textLabel]=\"content?.inputText?.[0]?.label\"></simpo-text-element>\n </div>\n <div class=\"d-flex gap-2 d-md-flex mt-15\" *ngIf=\"data?.action?.display\" [ngClass]=\"[\n styles?.layout?.align === 'left' ? 'justify-content-md-start' : '',\n styles?.layout?.align === 'center' ? 'justify-content-md-center' : '',\n styles?.layout?.align === 'right' ? 'justify-content-md-end' : ''\n ]\">\n </div>\n </div>\n </div>\n </div>\n </div>\n\n </div>\n\n <section class=\"main-section\">\n <div *ngIf=\"formStatus != 'REGISTERED' && formStatus != 'ADMITTED'\">\n <div class=\"subTabs_section\">\n <div class=\"list_tabs d-flex align-items-center\">\n <ng-container *ngFor=\"let key of Object.keys(fieldData)\">\n <div class=\"single_tab cursor-pointer\" (click)=\"selectedKey = key\"\n [ngClass]=\"selectedKey === key ? 'single_tab_active' : 'single_tab'\">\n {{key | titlecase}}\n </div>\n </ng-container>\n <div class=\"single_tab cursor-pointer\" (click)=\"selectedKey = 'Document'\" *ngIf=\"data?.sectionType === 'admissionForm'\"\n [ngClass]=\"selectedKey === 'Document' ? 'single_tab_active' : 'single_tab'\">\n Document\n </div>\n <div class=\"single_tab cursor-pointer\" (click)=\"redirectToPayment()\"\n *ngIf=\"data?.sectionType === 'admissionForm'\"\n [ngClass]=\"selectedKey === 'Payment' ? 'single_tab_active' : 'single_tab'\">\n Payment\n </div>\n </div>\n </div>\n\n <div class=\"main-content\">\n <ng-container *ngFor=\"let group of fieldData[selectedKey] ? Object.keys(fieldData[selectedKey]) : [];let groupIndex = index\">\n <div class=\"body\" *ngIf=\"group !== 'Backup Contact'\">\n <div class=\"list_tabs backToLeads d-flex align-items-center\">\n {{group}}\n </div>\n\n <ng-container *ngIf=\"groupIndex == 0 && Object.keys(fieldData)[0] === selectedKey\">\n <div class=\"image-box\" *ngIf=\"!payload.imgUrl\">\n <img class=\"dummy-image\" src=\"../../../../../../../../../assets/images/master/add-image.svg\"\n (click)=\"fileInput.click()\" alt=\"\">\n <div class=\"image_box\">\n <span class=\"fc_browse_btn\" id=\"display_browse_btn\" (click)=\"fileInput.click()\">Click to\n upload</span>\n </div>\n </div>\n <input style=\"display: none;\" id=\"vendorImage\" type=\"file\" name=\"myfile\"\n accept=\"image/x-png,image/jpeg,image/jpg\" (change)=\"updateAdmissionImage($event)\" class=\"pc-btn\"\n id=\"browse_contact_image\" #fileInput />\n\n <div *ngIf=\"payload.imgUrl\" class=\"addedImg\">\n <div class=\"uploadedImg\">\n <img alt=\"\" [src]=\"ds.bypassSecurityTrustUrl(payload.imgUrl)\">\n </div>\n <div class=\"image-buttons\">\n <div class=\"button\" (click)=\"fileInput.click()\">\n <img src=\"../../../../../../../../../assets/images/blogs/change_image.svg\" alt=\"\">\n Change Image\n </div>\n <div class=\"button delete-change\" (click)=\"deleteImg()\">\n\n <div class=\"delete\">\n <img src=\"./../../../../../../../../../assets/images/blogs/delete_image.svg\" alt=\"\">\n <div>Delete</div>\n </div>\n\n </div>\n </div>\n\n </div>\n </ng-container>\n\n <div class=\"row mt-1\">\n <div class=\"col-md-4 col-12 mt-1\" *ngFor=\"let info of fieldData[selectedKey][group]\">\n <label for=\"\" class=\"label-text\">{{info.fieldLabel}}</label> <span style=\"color: red;\" *ngIf=\"info.required\">*</span> <br>\n <ng-container *ngTemplateOutlet=\"inputData; context: {data: info}\"></ng-container>\n </div>\n </div>\n </div>\n\n <div class=\"body\" *ngIf=\"fieldData[selectedKey].hasOwnProperty('Backup Contact') && studentLiveWith === 'single parent' && groupIndex == 0 && Object.keys(fieldData)[0] === selectedKey\">\n <div class=\"list_tabs backToLeads d-flex align-items-center\">\n Backup Contact (Optional)\n </div>\n\n <div class=\"row mt-1\">\n <div class=\"col-md-12\">\n <label class=\"mtb-15 checkbox-label\">\n <input type=\"checkbox\" name=\"\" id=\"\" [(ngModel)]=\"payload.parentAuthorization\">\n I authorize the school to release the child only to the parent listed above\n </label>\n </div>\n <div class=\"col-md-4 col-12 mt-1\" *ngFor=\"let info of fieldData[selectedKey]['Backup Contact']\">\n <label for=\"\" class=\"label-text\">{{info.fieldLabel}}</label> <span style=\"color: red;\"\n *ngIf=\"info.required\">*</span> <br>\n <ng-container *ngTemplateOutlet=\"inputData; context: {data: info}\"></ng-container>\n </div>\n <div class=\"col-md-4 col-12 mt-1\">\n <label for=\"\" class=\"label-text\">Upload Supporting Document (Optional)</label>\n <div class=\"input-text upload-file\" (click)=\"backUpDocInput.click()\">\n <p>{{backupDocFile ? 'File Uploaded' : 'Upload File'}}</p>\n <mat-icon>cloud_upload</mat-icon>\n </div>\n <input id=\"vendorImage\" type=\"file\" name=\"myfile\" hidden\n accept=\".doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,image/x-png,image/jpeg,image/jpg,.pdf, video/mp4,video/x-matroska,video/x-msvideo,video/quicktime\"\n (change)=\"uploadBackUpDocument($event)\" class=\"pc-btn\"\n id=\"browse_contact_image\" #backUpDocInput />\n </div>\n </div>\n </div>\n\n </ng-container>\n <div class=\"payment-details\" *ngIf=\"selectedKey === 'Document' && data?.sectionType === 'admissionForm'\">\n <simpo-document [documentList]=\"documentList\"></simpo-document>\n </div>\n <div class=\"payment-details\" *ngIf=\"selectedKey === 'Payment' && data?.sectionType === 'admissionForm'\">\n <simpo-payment-details [admissionData]=\"payload\"\n [subscriptionsData]=\"subscriptionsData\" [termPaymentList]=\"termPaymentList\"></simpo-payment-details>\n </div>\n </div>\n\n <div class=\"button-parent\">\n <ng-container *ngFor=\"let button of data?.action?.buttons\">\n <button class=\"button\" (click)=\"submitForm()\" simpoButtonDirective [id]=\"data?.id+button.id\"\n [buttonStyle]=\"button.styles\" *ngIf=\"(data?.sectionType === 'admissionForm' && selectedKey == 'Payment') ||\n (data?.sectionType === 'registrationForm' &&\n (Object.keys(fieldData)[Object.keys(fieldData).length - 1] == selectedKey))\"\n [color]=\"data?.styles?.background?.accentColor\">{{button?.content?.label}}</button>\n\n <button class=\"button\" (click)=\"continueAdmission()\" simpoButtonDirective [id]=\"data?.id+button.id\"\n [buttonStyle]=\"button.styles\" *ngIf=\"selectedKey != 'Payment' && data?.sectionType === 'admissionForm'\"\n [color]=\"data?.styles?.background?.accentColor\">Continue</button>\n\n <button class=\"button\" (click)=\"continueAdmission()\" simpoButtonDirective [id]=\"data?.id+button.id\"\n [buttonStyle]=\"button.styles\"\n *ngIf=\"data?.sectionType === 'registrationForm' && (Object.keys(fieldData)[Object.keys(fieldData).length - 1] != selectedKey)\"\n [color]=\"data?.styles?.background?.accentColor\">Continue</button>\n </ng-container>\n </div>\n </div>\n\n <div class=\"emptyText\" *ngIf=\"formStatus == 'REGISTERED' || formStatus == 'ADMITTED'\">\n <img [src]=\"content?.image?.url\" alt=\"\" *ngIf=\"content?.image?.showImage\">\n <div class=\"heading-large\" [innerHtml]=\"content?.inputText?.[1]?.value\"></div>\n </div>\n </section>\n\n <ng-template #inputData let-field=\"data\">\n <div *ngIf=\"field.dataType == 'IMAGE'\">\n <div class=\"image-box\">\n <img class=\"dummy-image\" src=\"../../../../../../../../../assets/images/master/add-image.svg\"\n (click)=\"fileInput.click()\" alt=\"\">\n <div class=\"d-flex align-items-center\">\n <span class=\"fc_browse_btn\" id=\"display_browse_btn\" (click)=\"fileInput.click()\">Click to\n upload</span>\n </div>\n </div>\n <input style=\"display: none;\" id=\"vendorImage\" type=\"file\" name=\"myfile\" accept=\"image/x-png,image/jpeg,image/jpg\"\n (change)=\"updateAdmissionImage($event)\" class=\"pc-btn\" id=\"browse_contact_image\" #fileInput />\n </div>\n <div *ngIf=\"field.dataType === 'TEXT'\">\n <input type=\"text\" class=\"input-text\" [placeholder]=\"'Enter'+field.label\" [(ngModel)]=\"field.fieldValue\">\n </div>\n <div *ngIf=\"field.dataType === 'NUMBER'\">\n <input type=\"number\" class=\"input-text\" [placeholder]=\"'Enter'+field.label\" [(ngModel)]=\"field.fieldValue\">\n </div>\n <div *ngIf=\"field.dataType === 'MONEY'\">\n <input type=\"text\" class=\"input-text\" [placeholder]=\"'Enter'+field.label\" [(ngModel)]=\"field.fieldValue\">\n </div>\n <div *ngIf=\"field.dataType === 'DATE'\">\n <input type=\"date\" class=\"input-text\" [(ngModel)]=\"field.fieldValue\" [placeholder]=\"'Select'+field.label\">\n </div>\n <div *ngIf=\"field.dataType === 'DROPDOWN'\" class=\"admission\">\n <mat-form-field class=\"input-text\" appearance=\"outline\">\n <mat-select class=\"inputStyle\" placeholder=\"--Select--\" [(ngModel)]=\"field.fieldValue\" [multiple]=\"field.multipleSelection\">\n <ng-container *ngIf=\"(field?.value?.length || 0) > 0\">\n <mat-option *ngFor=\"let item of field.value\" [value]=\"item?.value\" (click)=\"masterDropdownValueChange(item, field)\">{{item.label}}</mat-option>\n </ng-container>\n <ng-container *ngIf=\"(field?.value?.length || 0) == 0\">\n <mat-option *ngFor=\"let item of field.sourceData[field.dataSourceType]\"\n (click)=\"inputFieldChange(item, field)\" [value]=\"item?.name\">{{item.name}}</mat-option>\n </ng-container>\n </mat-select>\n </mat-form-field>\n </div>\n <div *ngIf=\"field.dataType === 'CHECKBOX'\">\n <ng-container *ngIf=\"(field?.value?.length || 0) > 0\">\n <div class=\"form-check mb-5\" *ngFor=\"let data of field.value\">\n <input class=\"form-check-input\" type=\"checkbox\" value=\"\" id=\"flexCheckChecked\" [(ngModel)]=\"data.checked\">\n <label class=\"form-check-label\" for=\"flexCheckChecked\">\n {{data.label}}\n </label>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"(field?.value?.length || 0) == 0\">\n <div class=\"form-check mb-5\" *ngFor=\"let data of field.sourceData[field.dataSourceType]\">\n <input class=\"form-check-input\" type=\"checkbox\" value=\"\" id=\"flexCheckChecked\" [(ngModel)]=\"data.checked\">\n <label class=\"form-check-label\" for=\"flexCheckChecked\">\n {{data.name}}\n </label>\n </div>\n </ng-container>\n </div>\n </ng-template>\n\n\n <ng-container *ngIf=\"styles?.devider?.display\">\n <simpo-svg-divider [dividerType]=\"styles?.devider?.deviderType\"\n [color]=\"nextComponentColor?.color\"></simpo-svg-divider>\n </ng-container>\n <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total_container{height:auto;position:relative}.body-section{padding:4% 15px}.button-section{margin-top:15px}.clipPath{clip-path:polygon(0% 100%,50% 0%,100% 100%);height:100px;background-color:#00f}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:auto}.mt-15{margin-top:15px}@media only screen and (max-width: 475px){.d-flex{justify-content:center;margin-bottom:25px}}.main-section{width:100%;overflow-y:hidden}.subTabs_section{padding:1rem 5rem;height:12vh}.active_route_section{height:89%;border:1px solid #0000000F;padding:15px 20px;background-color:#fff;border-radius:6px}.active_route_section_normal{background-color:#f6f6f6;border:none;padding:10px 4rem}.list_tabs{border:1px solid #0000001A;background-color:#ffffffe5;padding:10px;border-radius:6px;gap:10px;height:50px}.single_tab{color:#0e233c99;font-size:14px;font-weight:500;font-family:interReg;padding:10px 20px}.single_tab_active{width:max-content;height:32px;background-color:#0015800a;display:flex;align-items:center;font-weight:600;padding:10px 20px;border-radius:4px;color:#0e233c}.align-items-center{align-items:center}.header{height:8vh;padding:10px;border-bottom:2px solid rgba(0,0,0,.06);display:flex}.p-5{padding:5rem}.backToLeads{color:#000!important}.body{margin:1rem 5rem 0rem;box-shadow:#00000029 0 1px 4px;padding:2rem;border-radius:10px}.profile-img{display:flex;align-items:center;gap:2rem}.mt-2{margin-top:2rem!important}.mt-1{margin-top:1rem!important}.image-box{display:flex;gap:1rem;margin-top:3rem;cursor:pointer}.image-box span{color:#0189ea;font-size:14px;font-weight:500;padding:11px 7rem;border:2px solid rgba(0,0,0,.06);height:47px;border-radius:10px}.image_box{display:flex;align-items:center}.dummy-image{height:55px}.label-text{font-weight:400;font-family:Inter;font-size:14px;color:#434443}.input-text{border-radius:7px;border:2px solid rgba(208,213,221,1);height:42px;width:100%;margin-top:5px;padding-left:10px}.footer{display:flex;gap:1rem;align-items:center;justify-content:flex-end;height:8vh;padding:10px;border-top:2px solid rgba(0,0,0,.06);position:absolute;bottom:0;width:100%}.footer .continue{font-size:13px;font-family:interMedium;color:#242424;font-weight:500;border:none;background-color:#f6c318;padding:10px 20px;border-radius:8px;width:max-content}.footer .cancel{font-size:13px;font-family:interMedium;color:#f6c318;font-weight:500;border:1px solid #F6C318;background-color:#fff;padding:10px 20px;border-radius:8px;width:max-content}.main-content{overflow:scroll;padding-top:5px;padding-bottom:10px}.button-parent{padding:1rem 5rem 1rem 2rem;align-items:center;display:flex;justify-content:flex-end}.button{font-size:16px!important;padding:1rem 2rem;display:inline-flex;align-items:center;justify-content:center;width:fit-content!important}.payment-details{margin:1rem 5rem 0rem;box-shadow:#00000029 0 1px 4px;border-radius:10px}.mb-5{margin-bottom:5px!important}.addedImg{display:flex;gap:5%;width:95%;margin-top:2rem}.addedImg .uploadedImg img{height:65px;width:65px;border-radius:50%}.addedImg .image-buttons{display:flex;gap:3%;padding-top:20px}.addedImg .image-buttons .button{display:flex;gap:8px;width:142px;height:40px;padding:12px 8px;font-family:lexandMedium;color:#3f3b3b;font-style:normal;font-weight:500;font-size:12px!important;border:1px dashed #E4E7EC;border-radius:12px;cursor:pointer}.addedImg .image-buttons .button img{width:20px}.addedImg .image-buttons .button .delete{display:flex;gap:15%;width:60%;margin:auto}.addedImg .image-buttons .button .delete img{width:12px}.emptyText{height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:50px}.emptyText img{height:200px}@media screen and (max-width: 475px){.body{margin:0rem}.emptyText{padding:1rem}.emptyText img{width:100%}.subTabs_section{padding:1rem .5rem}.list_tabs{white-space:nowrap;overflow:scroll;justify-content:flex-start}.payment-details{margin:0rem}}.mtb-15{margin-top:15px;margin-bottom:15px}.checkbox-label{display:flex;align-items:center;gap:15px}.checkbox-label input{height:16px;width:16px}.upload-file{display:flex;align-items:center;justify-content:space-between;padding-right:10px}.upload-file mat-icon{color:#4caf50}.upload-file p{margin-bottom:0}@media only screen and (min-width: 320px) and (max-width : 500px){.image-box span{padding:11px 4rem}}\n"] }]
|
9480
|
+
], template: "<section simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\">\n <div #mainContainer class=\"rowFlex\" [id]=\"data?.id\" [simpoOverlay]=\"styles?.background\"\n [simpoBorder]=\"styles?.border\">\n <div class=\"main-section\"\n [ngClass]=\"{'justify-content-md-start': styles?.layout?.align === 'left' , 'justify-content-md-end': styles?.layout?.align === 'right'}\"\n [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\">\n <div class=\"body-section\">\n <div [simpoAnimation]=\"styles?.animation\" [id]=\"data?.id\">\n <div>\n <simpo-text-element [textData]=\"content?.inputText?.[0]?.value\" [textLabel]=\"content?.inputText?.[0]?.label\"></simpo-text-element>\n </div>\n <div class=\"d-flex gap-2 d-md-flex mt-15\" *ngIf=\"data?.action?.display\" [ngClass]=\"[\n styles?.layout?.align === 'left' ? 'justify-content-md-start' : '',\n styles?.layout?.align === 'center' ? 'justify-content-md-center' : '',\n styles?.layout?.align === 'right' ? 'justify-content-md-end' : ''\n ]\">\n </div>\n </div>\n </div>\n </div>\n </div>\n\n </div>\n\n <section class=\"main-section\">\n <div *ngIf=\"formStatus != 'REGISTERED' && formStatus != 'ADMITTED'\">\n <div class=\"subTabs_section\">\n <div class=\"list_tabs d-flex align-items-center\">\n <ng-container *ngFor=\"let key of Object.keys(fieldData)\">\n <div class=\"single_tab cursor-pointer\" (click)=\"selectedKey = key\"\n [ngClass]=\"selectedKey === key ? 'single_tab_active' : 'single_tab'\">\n {{key | titlecase}}\n </div>\n </ng-container>\n <div class=\"single_tab cursor-pointer\" (click)=\"selectedKey = 'Document'\" *ngIf=\"data?.sectionType === 'admissionForm'\"\n [ngClass]=\"selectedKey === 'Document' ? 'single_tab_active' : 'single_tab'\">\n Document\n </div>\n <div class=\"single_tab cursor-pointer\" (click)=\"redirectToPayment()\"\n *ngIf=\"data?.sectionType === 'admissionForm'\"\n [ngClass]=\"selectedKey === 'Payment' ? 'single_tab_active' : 'single_tab'\">\n Payment\n </div>\n </div>\n </div>\n\n <div class=\"main-content\">\n <ng-container *ngFor=\"let group of fieldData[selectedKey] ? Object.keys(fieldData[selectedKey]) : [];let groupIndex = index\">\n <div class=\"body\" *ngIf=\"group !== 'Backup Contact'\">\n <div class=\"list_tabs backToLeads d-flex align-items-center\">\n {{group}}\n </div>\n\n <ng-container *ngIf=\"groupIndex == 0 && Object.keys(fieldData)[0] === selectedKey\">\n <div class=\"image-box\" *ngIf=\"!payload.imgUrl\">\n <img class=\"dummy-image\" src=\"../../../../../../../../../assets/images/master/add-image.svg\"\n (click)=\"fileInput.click()\" alt=\"\">\n <div class=\"image_box\">\n <span class=\"fc_browse_btn\" id=\"display_browse_btn\" (click)=\"fileInput.click()\">Click to\n upload</span>\n </div>\n </div>\n <input style=\"display: none;\" id=\"vendorImage\" type=\"file\" name=\"myfile\"\n accept=\"image/x-png,image/jpeg,image/jpg\" (change)=\"updateAdmissionImage($event)\" class=\"pc-btn\"\n id=\"browse_contact_image\" #fileInput />\n\n <div *ngIf=\"payload.imgUrl\" class=\"addedImg\">\n <div class=\"uploadedImg\">\n <img alt=\"\" [src]=\"ds.bypassSecurityTrustUrl(payload.imgUrl)\">\n </div>\n <div class=\"image-buttons\">\n <div class=\"button\" (click)=\"fileInput.click()\">\n <img src=\"../../../../../../../../../assets/images/blogs/change_image.svg\" alt=\"\">\n Change Image\n </div>\n <div class=\"button delete-change\" (click)=\"deleteImg()\">\n\n <div class=\"delete\">\n <img src=\"./../../../../../../../../../assets/images/blogs/delete_image.svg\" alt=\"\">\n <div>Delete</div>\n </div>\n\n </div>\n </div>\n\n </div>\n </ng-container>\n\n <div class=\"row mt-1\">\n <div class=\"col-md-4 col-12 mt-1\" *ngFor=\"let info of fieldData[selectedKey][group]\">\n <label for=\"\" class=\"label-text\">{{info.fieldLabel}}</label> <span style=\"color: red;\" *ngIf=\"info.required\">*</span> <br>\n <ng-container *ngTemplateOutlet=\"inputData; context: {data: info}\"></ng-container>\n </div>\n </div>\n </div>\n\n <div class=\"body\" *ngIf=\"fieldData[selectedKey].hasOwnProperty('Backup Contact') && studentLiveWith === 'single parent' && groupIndex == 0 && Object.keys(fieldData)[0] === selectedKey\">\n <div class=\"list_tabs backToLeads d-flex align-items-center\">\n Backup Contact (Optional)\n </div>\n\n <div class=\"row mt-1\">\n <div class=\"col-md-12\">\n <label class=\"mtb-15 checkbox-label\">\n <input type=\"checkbox\" name=\"\" id=\"\" [(ngModel)]=\"payload.parentAuthorization\">\n I authorize the school to release the child only to the parent listed above\n </label>\n </div>\n <div class=\"col-md-4 col-12 mt-1\" *ngFor=\"let info of fieldData[selectedKey]['Backup Contact']\">\n <label for=\"\" class=\"label-text\">{{info.fieldLabel}}</label> <span style=\"color: red;\"\n *ngIf=\"info.required\">*</span> <br>\n <ng-container *ngTemplateOutlet=\"inputData; context: {data: info}\"></ng-container>\n </div>\n <div class=\"col-md-4 col-12 mt-1\">\n <label for=\"\" class=\"label-text\">Upload Supporting Document (Optional)</label>\n <div class=\"input-text upload-file\" (click)=\"backUpDocInput.click()\">\n <p>{{backupDocFile ? 'File Uploaded' : 'Upload File'}}</p>\n <mat-icon>cloud_upload</mat-icon>\n </div>\n <input id=\"vendorImage\" type=\"file\" name=\"myfile\" hidden\n accept=\".doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,image/x-png,image/jpeg,image/jpg,.pdf, video/mp4,video/x-matroska,video/x-msvideo,video/quicktime\"\n (change)=\"uploadBackUpDocument($event)\" class=\"pc-btn\"\n id=\"browse_contact_image\" #backUpDocInput />\n </div>\n </div>\n </div>\n\n </ng-container>\n <div class=\"payment-details\" *ngIf=\"selectedKey === 'Document' && data?.sectionType === 'admissionForm'\">\n <simpo-document [documentList]=\"documentList\"></simpo-document>\n </div>\n <div class=\"payment-details\" *ngIf=\"selectedKey === 'Payment' && data?.sectionType === 'admissionForm'\">\n <simpo-payment-details [admissionData]=\"payload\"\n [subscriptionsData]=\"subscriptionsData\" [termPaymentList]=\"termPaymentList\"></simpo-payment-details>\n </div>\n </div>\n\n <div class=\"button-parent\">\n <ng-container *ngFor=\"let button of data?.action?.buttons\">\n <button class=\"button\" (click)=\"submitForm()\" simpoButtonDirective [id]=\"data?.id+button.id\"\n [buttonStyle]=\"button.styles\" *ngIf=\"(data?.sectionType === 'admissionForm' && selectedKey == 'Payment') ||\n (data?.sectionType === 'registrationForm' &&\n (Object.keys(fieldData)[Object.keys(fieldData).length - 1] == selectedKey))\"\n [color]=\"data?.styles?.background?.accentColor\">{{button?.content?.label}}</button>\n\n <button class=\"button\" (click)=\"continueAdmission()\" simpoButtonDirective [id]=\"data?.id+button.id\"\n [buttonStyle]=\"button.styles\" *ngIf=\"selectedKey != 'Payment' && data?.sectionType === 'admissionForm'\"\n [color]=\"data?.styles?.background?.accentColor\">Continue</button>\n\n <button class=\"button\" (click)=\"continueAdmission()\" simpoButtonDirective [id]=\"data?.id+button.id\"\n [buttonStyle]=\"button.styles\"\n *ngIf=\"data?.sectionType === 'registrationForm' && (Object.keys(fieldData)[Object.keys(fieldData).length - 1] != selectedKey)\"\n [color]=\"data?.styles?.background?.accentColor\">Continue</button>\n </ng-container>\n </div>\n </div>\n\n <div class=\"emptyText\" *ngIf=\"formStatus == 'REGISTERED' || formStatus == 'ADMITTED'\">\n <img [src]=\"content?.image?.url\" alt=\"\" *ngIf=\"content?.image?.showImage\">\n <div class=\"heading-large\" [innerHtml]=\"content?.inputText?.[1]?.value\"></div>\n </div>\n </section>\n\n <ng-template #inputData let-field=\"data\">\n <div *ngIf=\"field.dataType == 'IMAGE'\">\n <div class=\"image-box\">\n <img class=\"dummy-image\" src=\"../../../../../../../../../assets/images/master/add-image.svg\"\n (click)=\"fileInput.click()\" alt=\"\">\n <div class=\"d-flex align-items-center\">\n <span class=\"fc_browse_btn\" id=\"display_browse_btn\" (click)=\"fileInput.click()\">Click to\n upload</span>\n </div>\n </div>\n <input style=\"display: none;\" id=\"vendorImage\" type=\"file\" name=\"myfile\" accept=\"image/x-png,image/jpeg,image/jpg\"\n (change)=\"updateAdmissionImage($event)\" class=\"pc-btn\" id=\"browse_contact_image\" #fileInput />\n </div>\n <div *ngIf=\"field.dataType === 'TEXT'\">\n <input type=\"text\" class=\"input-text\" [placeholder]=\"'Enter '+field.fieldLabel\" [(ngModel)]=\"field.fieldValue\">\n </div>\n <div *ngIf=\"field.dataType === 'NUMBER'\">\n <input type=\"number\" class=\"input-text\" [placeholder]=\"'Enter '+field.fieldLabel\" [(ngModel)]=\"field.fieldValue\">\n </div>\n <div *ngIf=\"field.dataType === 'MONEY'\">\n <input type=\"text\" class=\"input-text\" [placeholder]=\"'Enter '+field.fieldLabel\" [(ngModel)]=\"field.fieldValue\">\n </div>\n <div *ngIf=\"field.dataType === 'DATE'\">\n <input type=\"date\" class=\"input-text\" [(ngModel)]=\"field.fieldValue\" [placeholder]=\"'Select '+field.fieldLabel\">\n </div>\n <div *ngIf=\"field.dataType === 'DROPDOWN'\" class=\"admission\">\n <mat-form-field class=\"input-text\" appearance=\"outline\">\n <mat-select class=\"inputStyle\" placeholder=\"--Select--\" [(ngModel)]=\"field.fieldValue\" [multiple]=\"field.multipleSelection\">\n <ng-container *ngIf=\"(field?.value?.length || 0) > 0\">\n <mat-option *ngFor=\"let item of field.value\" [value]=\"item?.value\" (click)=\"masterDropdownValueChange(item, field)\">{{item.label}}</mat-option>\n </ng-container>\n <ng-container *ngIf=\"(field?.value?.length || 0) == 0\">\n <mat-option *ngFor=\"let item of field.sourceData[field.dataSourceType]\"\n (click)=\"inputFieldChange(item, field)\" [value]=\"item?.name\">{{item.name}}</mat-option>\n </ng-container>\n </mat-select>\n </mat-form-field>\n </div>\n <div *ngIf=\"field.dataType === 'CHECKBOX'\">\n <ng-container *ngIf=\"(field?.value?.length || 0) > 0\">\n <div class=\"form-check mb-5\" *ngFor=\"let data of field.value\">\n <input class=\"form-check-input\" type=\"checkbox\" value=\"\" id=\"flexCheckChecked\" [(ngModel)]=\"data.checked\">\n <label class=\"form-check-label\" for=\"flexCheckChecked\">\n {{data.label}}\n </label>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"(field?.value?.length || 0) == 0\">\n <div class=\"form-check mb-5\" *ngFor=\"let data of field.sourceData[field.dataSourceType]\">\n <input class=\"form-check-input\" type=\"checkbox\" value=\"\" id=\"flexCheckChecked\" [(ngModel)]=\"data.checked\">\n <label class=\"form-check-label\" for=\"flexCheckChecked\">\n {{data.name}}\n </label>\n </div>\n </ng-container>\n </div>\n </ng-template>\n\n\n <ng-container *ngIf=\"styles?.devider?.display\">\n <simpo-svg-divider [dividerType]=\"styles?.devider?.deviderType\"\n [color]=\"nextComponentColor?.color\"></simpo-svg-divider>\n </ng-container>\n <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total_container{height:auto;position:relative}.body-section{padding:4% 15px}.button-section{margin-top:15px}.clipPath{clip-path:polygon(0% 100%,50% 0%,100% 100%);height:100px;background-color:#00f}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:auto}.mt-15{margin-top:15px}@media only screen and (max-width: 475px){.d-flex{justify-content:center;margin-bottom:25px}}.main-section{width:100%;overflow-y:hidden}.subTabs_section{padding:1rem 5rem;height:12vh}.active_route_section{height:89%;border:1px solid #0000000F;padding:15px 20px;background-color:#fff;border-radius:6px}.active_route_section_normal{background-color:#f6f6f6;border:none;padding:10px 4rem}.list_tabs{border:1px solid #0000001A;background-color:#ffffffe5;padding:10px;border-radius:6px;gap:10px;height:50px}.single_tab{color:#0e233c99;font-size:14px;font-weight:500;font-family:interReg;padding:10px 20px}.single_tab_active{width:max-content;height:32px;background-color:#0015800a;display:flex;align-items:center;font-weight:600;padding:10px 20px;border-radius:4px;color:#0e233c}.align-items-center{align-items:center}.header{height:8vh;padding:10px;border-bottom:2px solid rgba(0,0,0,.06);display:flex}.p-5{padding:5rem}.backToLeads{color:#000!important}.body{margin:1rem 5rem 0rem;box-shadow:#00000029 0 1px 4px;padding:2rem;border-radius:10px}.profile-img{display:flex;align-items:center;gap:2rem}.mt-2{margin-top:2rem!important}.mt-1{margin-top:1rem!important}.image-box{display:flex;gap:1rem;margin-top:3rem;cursor:pointer}.image-box span{color:#0189ea;font-size:14px;font-weight:500;padding:11px 7rem;border:2px solid rgba(0,0,0,.06);height:47px;border-radius:10px}.image_box{display:flex;align-items:center}.dummy-image{height:55px}.label-text{font-weight:400;font-family:Inter;font-size:14px;color:#434443}.input-text{border-radius:7px;border:2px solid rgba(208,213,221,1);height:42px;width:100%;margin-top:5px;padding-left:10px}.footer{display:flex;gap:1rem;align-items:center;justify-content:flex-end;height:8vh;padding:10px;border-top:2px solid rgba(0,0,0,.06);position:absolute;bottom:0;width:100%}.footer .continue{font-size:13px;font-family:interMedium;color:#242424;font-weight:500;border:none;background-color:#f6c318;padding:10px 20px;border-radius:8px;width:max-content}.footer .cancel{font-size:13px;font-family:interMedium;color:#f6c318;font-weight:500;border:1px solid #F6C318;background-color:#fff;padding:10px 20px;border-radius:8px;width:max-content}.main-content{overflow:scroll;padding-top:5px;padding-bottom:10px}.button-parent{padding:1rem 5rem 1rem 2rem;align-items:center;display:flex;justify-content:flex-end}.button{font-size:16px!important;padding:1rem 2rem;display:inline-flex;align-items:center;justify-content:center;width:fit-content!important}.payment-details{margin:1rem 5rem 0rem;box-shadow:#00000029 0 1px 4px;border-radius:10px}.mb-5{margin-bottom:5px!important}.addedImg{display:flex;gap:5%;width:95%;margin-top:2rem}.addedImg .uploadedImg img{height:65px;width:65px;border-radius:50%}.addedImg .image-buttons{display:flex;gap:3%;padding-top:20px}.addedImg .image-buttons .button{display:flex;gap:8px;width:142px;height:40px;padding:12px 8px;font-family:lexandMedium;color:#3f3b3b;font-style:normal;font-weight:500;font-size:12px!important;border:1px dashed #E4E7EC;border-radius:12px;cursor:pointer}.addedImg .image-buttons .button img{width:20px}.addedImg .image-buttons .button .delete{display:flex;gap:15%;width:60%;margin:auto}.addedImg .image-buttons .button .delete img{width:12px}.emptyText{height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:50px}.emptyText img{height:200px}@media screen and (max-width: 475px){.body{margin:0rem}.emptyText{padding:1rem}.emptyText img{width:100%}.subTabs_section{padding:1rem .5rem}.list_tabs{white-space:nowrap;overflow:scroll;justify-content:flex-start}.payment-details{margin:0rem}}.mtb-15{margin-top:15px;margin-bottom:15px}.checkbox-label{display:flex;align-items:center;gap:15px}.checkbox-label input{height:16px;width:16px}.upload-file{display:flex;align-items:center;justify-content:space-between;padding-right:10px}.upload-file mat-icon{color:#4caf50}.upload-file p{margin-bottom:0}@media only screen and (min-width: 320px) and (max-width : 500px){.image-box span{padding:11px 4rem}}\n"] }]
|
9481
9481
|
}], ctorParameters: () => [{ type: RestService }, { type: i2$3.MatSnackBar }, { type: EventsService }, { type: i2$2.ActivatedRoute }, { type: i1.DomSanitizer }, { type: ImageUplaodService }], propDecorators: { data: [{
|
9482
9482
|
type: Input
|
9483
9483
|
}], index: [{
|