Skip to content

Commit

Permalink
MOSIP-19703 Fields will be autopopulate and disabled for editing
Browse files Browse the repository at this point in the history 
Signed-off-by: MadhuMosip <[email protected]>
  • Loading branch information
@MadhuMosip
MadhuMosip committed Mar 11, 2024
1 parent 1c3f60b commit a6b8b73
Show file tree
Hide file tree
Showing 4 changed files with 79 additions and 32 deletions.
26 changes: 23 additions & 3 deletions ...p/features/masterdata/shared/mater-data-common-body/mater-data-common-body.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,7 @@
[value]="primaryData[field.name]"
required={{field.ismandatory}}
*ngIf="field.name !== 'fieldVal'"
[readonly]="!isEditable && id"
/>
</span>
<span *ngIf="pageName === 'Dynamic Field' && field.name !== 'name'">
Expand All @@ -63,6 +64,7 @@
[value]="primaryData[field.name]"
required={{field.ismandatory}}
*ngIf="field.name !== 'fieldVal'"
[readonly]="!isEditable && id"
/>
</span>
<span *ngIf="pageName === 'Blocklisted Word' && !isCreateForm && field.name === 'word'">
Expand Down Expand Up @@ -125,6 +127,7 @@
}}"
[value]="primaryData[field.name]"
required={{field.ismandatory}}
[readonly]="!isEditable && id"
/>
</mat-form-field>

Expand Down Expand Up @@ -193,6 +196,7 @@
[value]="primaryData[field.name]"
required={{field.ismandatory}}
rows="3" cols="40"
[readonly]="!isEditable && id"
></textarea>
</span>
<span *ngIf="pageName === 'Blocklisted Word' && !isCreateForm && field.name === 'description'">
Expand Down Expand Up @@ -254,12 +258,13 @@
placeholder="{{field.label[primaryLang] | translate}}"
[value]="primaryData[field.name]"
required={{field.ismandatory}}
[readonly]="!isEditable && id"
/>
<mat-datepicker-toggle
matSuffix
[for]="picker"
></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
<mat-datepicker [disabled]="!isEditable && id" #picker></mat-datepicker>
</mat-form-field>

<div *ngIf="field.showInSingleView === 'true' && field.inputType === 'dropdown' && field.name === 'locationCode'">
Expand All @@ -268,7 +273,8 @@
id="{{field.name}}"
[value]="primaryData[field.name]"
placeholder="{{ field.label[primaryLang] }}"
required={{field.ismandatory}}>
required={{field.ismandatory}}
[disabled]="!isEditable && id">
<input placeholder="Search..." matInput type="text" (keyup)="onKey($event.target.value, 'primary')" class="example-input">
<mat-option *ngFor="let data of dropDownValues['locationCode']['primary']"
(onSelectionChange)="captureDropDownValue($event, field.name, 'primary')"
Expand Down Expand Up @@ -322,6 +328,7 @@
[value]="primaryData[field.name]"
placeholder="{{ field.label[primaryLang] }}"
required={{field.ismandatory}}
[disabled]="!isEditable && id"
>
<mat-option
*ngFor="let data of dropDownValues.fileFormatCode.primary"
Expand All @@ -340,6 +347,7 @@
[value]="primaryData[field.name]"
placeholder="{{ field.label[primaryLang] }}"
required={{field.ismandatory}}
[disabled]="!isEditable && id"
>
<mat-option
*ngFor="let data of dropDownValues.templateTypeCode.primary"
Expand All @@ -358,6 +366,7 @@
[value]="primaryData[field.name]"
placeholder="{{ field.label[primaryLang] }}"
required={{field.ismandatory}}
[disabled]="!isEditable && id"
>
<mat-option
*ngFor="let data of dropDownValues.moduleId.primary"
Expand Down Expand Up @@ -470,6 +479,7 @@
}}"
[value]="secondaryData[field.name]"
*ngIf="field.name !== 'fieldVal'"
[readonly]="!isEditable && id"
/>
</span>
<span *ngIf="pageName === 'Dynamic Field' && field.name !== 'name'">
Expand All @@ -485,6 +495,7 @@
}}"
[value]="secondaryData[field.name]"
*ngIf="field.name !== 'fieldVal'"
[readonly]="!isEditable && id"
/>
</span>
<span *ngIf="pageName !== 'Dynamic Field'">
Expand All @@ -500,6 +511,7 @@
}}"
[value]="secondaryData[field.name]"
*ngIf="field.name !== 'fieldVal'"
[readonly]="!isEditable && id"
/>
</span>
</mat-form-field>
Expand All @@ -515,6 +527,7 @@
field.label[secondaryLang]
}}"
[value]="secondaryData[field.name]"
[readonly]="!isEditable && id"
/>
</mat-form-field>
<mat-form-field *ngIf="field.showInSingleView === 'true' && field.inputType === 'text' && field.name === 'code' && !isCreateForm && pageName !== 'Dynamic Field'">
Expand Down Expand Up @@ -592,6 +605,7 @@
}}"
[value]="secondaryData[field.name]"
rows="3" cols="40"
[readonly]="!isEditable && id"
></textarea>
</span>
</mat-form-field>
Expand All @@ -605,10 +619,12 @@
placeholder="{{field.label[secondaryLang] | translate}}"
[value]="secondaryData[field.name]"
field.required
[readonly]="!isEditable && id"
/>
<mat-datepicker-toggle
matSuffix
[for]="picker1"
[disabled]="!isEditable && id"
></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker>
</mat-form-field>
Expand All @@ -618,7 +634,8 @@
<mat-select
id="{{field.name}}{{secondaryLang}}"
[value]="secondaryData[field.name]"
placeholder="{{ field.label[secondaryLang] }}">
placeholder="{{ field.label[secondaryLang] }}"
[disabled]="!isEditable && id">
<mat-option *ngFor="let data of dropDownValues['locationCode']['secondary']"
(onSelectionChange)="captureDropDownValue($event, field.name, 'secondary')"
[value]="data.fieldCode">
Expand Down Expand Up @@ -668,6 +685,7 @@
id="{{field.name}}{{secondaryLang}}"
[value]="secondaryData[field.name]"
placeholder="{{ field.label[secondaryLang] }}"
[disabled]="!isEditable && id"
>
<mat-option
*ngFor="let data of dropDownValues.fileFormatCode.secondary"
Expand All @@ -685,6 +703,7 @@
id="{{field.name}}{{secondaryLang}}"
[value]="secondaryData[field.name]"
placeholder="{{ field.label[secondaryLang] }}"
[disabled]="!isEditable && id"
>
<mat-option
*ngFor="let data of dropDownValues.templateTypeCode.secondary"
Expand All @@ -702,6 +721,7 @@
id="{{field.name}}{{secondaryLang}}"
[value]="secondaryData[field.name]"
placeholder="{{ field.label[secondaryLang] }}"
[disabled]="!isEditable && id"
>
<mat-option
*ngFor="let data of dropDownValues.moduleId.secondary"
Expand Down
27 changes: 13 additions & 14 deletions ...app/features/masterdata/shared/mater-data-common-body/mater-data-common-body.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -89,6 +89,7 @@ export class MaterDataCommonBodyComponent implements OnInit {
searchResult:any;
appConfig:any;
confirmationPopupMessage:any;
isEditable:any;

constructor(
private location: Location,
Expand All @@ -113,14 +114,6 @@ export class MaterDataCommonBodyComponent implements OnInit {
this.fieldsCount = 0;
this.primaryLangCode = this.headerService.getUserPreferredLanguage();
this.dateAdapter.setLocale(defaultJson.keyboardMapping[this.primaryLangCode]);
console.log("this.primaryLangCode>>>"+this.primaryLangCode);
console.log("config>>>"+defaultJson.languages["ara"].name);
/*if(url === "blocklisted-words"){
this.primaryLang = this.primaryData.langCode;
if(this.primaryData.langCode === "ara"){
this.isPrimaryLangRTL = true;
}
}*/
if(this.primaryLang === "ara"){
this.isPrimaryLangRTL = true;
}
Expand All @@ -132,6 +125,7 @@ export class MaterDataCommonBodyComponent implements OnInit {
}
});
this.queryParamLangCode = this.activatedRoute.snapshot.queryParamMap.get('langCode');
this.isEditable = this.activatedRoute.snapshot.queryParamMap.get('editable')
this.activatedRoute.params.subscribe(response => {
this.id = response.id;
this.masterdataType = response.type;
Expand Down Expand Up @@ -239,7 +233,12 @@ export class MaterDataCommonBodyComponent implements OnInit {
if(this.router.url.split('/')[4] !== "new"){
name = this.router.url.split('/')[4];
this.dataStorageService.getDynamicfieldDescriptionValue(name, this.primaryLang).subscribe(response => {
this.primaryData = {"name":name,"description":response.response.description,"dataType":"string","value":"", "code":"","langCode":this.primaryLang};
if(response.response){
this.primaryData = {"name":name,"description":response.response.description,"dataType":"string","value":"", "code":"","langCode":this.primaryLang};
}else{
this.primaryData = {"name":name,"description":"","dataType":"string","value":"", "code":"","langCode":this.primaryLang};
}

});
}else{
this.primaryData = {"name":name,"description":"","dataType":"string","value":"", "code":"","langCode":this.primaryLang};
Expand Down Expand Up @@ -368,11 +367,11 @@ export class MaterDataCommonBodyComponent implements OnInit {
this.secondaryData = response.response.data[0];
this.setSecondaryFrom("");
if(this.queryParamLangCode){
document.getElementById("code").setAttribute("disabled", "true");
document.getElementById("code"+this.queryParamLangCode).setAttribute("disabled", "true");
if(!this.primaryData.code){
this.primaryData.code = this.secondaryData.code;
}
Object.keys(this.primaryData).forEach(item =>{
if(!this.primaryData[item]){
this.primaryData[item] = this.secondaryData[item]
}
})
}
}else{
this.secondaryData = null;
Expand Down
12 changes: 6 additions & 6 deletions admin-ui/src/app/features/resources/center/edit/edit.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,7 @@ <h3>{{ "center.location-details" | translate }}</h3>
<button [disabled]="!primaryForm.dirty" id="createButton" mat-raised-button *ngIf="isEditable['editable']" (click)="submitPrimaryPanel()">
{{ "center.update" | translate }}
</button>
<button [disabled]="!primaryForm.dirty" id="createButton" mat-raised-button *ngIf="isEditable['langCode']" (click)="submitPrimaryPanel()">
<button id="createButton" mat-raised-button *ngIf="isEditable['langCode']" (click)="submitPrimaryPanel()">
{{ "center.create" | translate }}
</button>
<button mat-raised-button id="cancel" (click)="cancel()" *ngIf="secondaryLang">
Expand Down Expand Up @@ -257,7 +257,7 @@ <h3>{{ secondaryLanguageLabels["location-details"] }}</h3>
</mat-form-field>
</div>
<mat-card-actions class="action-buttons">
<button [disabled]="!secondaryForm.dirty" id="createButton" mat-raised-button *ngIf="showUpdateButton"
<button [disabled]="!secondaryForm.dirty" id="createButton" mat-raised-button *ngIf="isEditable.editable"
(click)="submitSecondaryPanel()">
{{ "center.update" | translate }}
</button>
Expand Down Expand Up @@ -392,7 +392,7 @@ <h3>{{ "center.location-details" | translate }}</h3>
<div>
<mat-form-field *ngFor="let fieldName of locationFieldNameList; let i = index; let odd = odd" [ngClass]="odd ? 'right-sizing-container' : 'left-sizing-container'">
<mat-label>{{ fieldName }}</mat-label>
<mat-select [value]="dynamicFieldValue[fieldName]" id="{{fieldName}}" (selectionChange)="
<mat-select [disabled]="isEditable.langCode" [value]="dynamicFieldValue[fieldName]" id="{{fieldName}}" (selectionChange)="
loadLocationDataDynamically($event, i);">
<mat-option *ngFor="let data of dynamicDropDown[fieldName]" [value]="data.code">
{{ data.name }}
Expand Down Expand Up @@ -520,7 +520,7 @@ <h3>{{ "center.operational-details" | translate }}</h3>
</mat-form-field>
<div class="flex-display">
<mat-form-field>
<input formControlName="noKiosk" id="noKiosk" matInput placeholder="{{ 'center.no-kiosk' | translate }}" required/>
<input [readonly]="isEditable.langCode" formControlName="noKiosk" id="noKiosk" matInput placeholder="{{ 'center.no-kiosk' | translate }}" required/>
<mat-error *ngIf="
common.noKiosk.touched &&
common.noKiosk.hasError('required')
Expand Down Expand Up @@ -660,10 +660,10 @@ <h3>{{ "center.operational-details" | translate }}</h3>
<mat-label>{{ "center.holidays" | translate }}</mat-label>
<br /><br />
<mat-form-field style="width: 70% !important;">
<input matInput [(ngModel)]="holidayDate" id="holidayDate" [min]="minDate" [ngModelOptions]="{ standalone: true }"
<input [disabled]="isEditable.langCode" matInput [(ngModel)]="holidayDate" id="holidayDate" [min]="minDate" [ngModelOptions]="{ standalone: true }"
[matDatepicker]="picker" placeholder="{{ 'center.datepicker-placeholder' | translate }}" />
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
<mat-datepicker [disabled]="isEditable.langCode" #picker></mat-datepicker>
</mat-form-field>&nbsp;&nbsp;&nbsp;&nbsp;
<button [disabled]="disablePrimaryForm" id ="createExceptionalHoliday" mat-raised-button (click)="createExceptionalHoliday()">
{{ "center.add-button" | translate }}
Expand Down
46 changes: 37 additions & 9 deletions admin-ui/src/app/features/resources/center/edit/edit.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -122,6 +122,9 @@ export class EditComponent {
this.initializeComponent();
}
});
this.activatedRoute.queryParams.subscribe(params => {
this.isEditable = params
});
this.initialLocationCode = this.appConfigService.getConfig()['countryCode'];
this.locCode = this.appConfigService.getConfig()['locationHierarchyLevel'];

Expand All @@ -140,15 +143,13 @@ export class EditComponent {
}

loadLanguages(primaryLangCode: string) {
console.log(`loadLanguages: primary: ${primaryLangCode}`);
// Set the primary language
this.primaryLang = this.headerService.getUserPreferredLanguage();
this.translateService.use(this.primaryLang);
//Set the "Select Language" dropdown options
this.selectLanguagesArr = [];
let self = this;
let otherLangsArr = this.supportedLanguages.filter(function(lang){if(lang.trim() && lang.trim() !== self.primaryLang.trim()){return lang.trim()}});
console.log("otherLangsArr>>>"+otherLangsArr);
if(otherLangsArr.length > 0){
otherLangsArr.forEach((language) => {
if (defaultJson.languages && defaultJson.languages[language]) {
Expand All @@ -159,7 +160,8 @@ export class EditComponent {
}
});
//Set the secondary language
this.secondaryLang = this.selectLanguagesArr[0]["code"];
this.secondaryLang = this.isEditable.langCode ? this.isEditable['langCode'] : this.selectLanguagesArr[0]["code"];

this.primaryLang === this.secondaryLang ? this.showSecondaryForm = false : this.showSecondaryForm = true;
}else{
this.showSecondaryForm = false;
Expand Down Expand Up @@ -216,7 +218,6 @@ export class EditComponent {
}

initializeComponent() {
console.log(`initializeComponent -- primaryLang: ${this.primaryLang}`);
//this.translateService.use(this.primaryLang);
this.activatedRoute.params.subscribe(params => {
this.centerId = params.id;
Expand All @@ -227,10 +228,6 @@ export class EditComponent {
this.filteredLanguages = this.supportedLanguages;
this.getPrimaryPanelData(this.primaryLang);
});

this.activatedRoute.queryParams.subscribe(params => {
this.isEditable = params
});
}

setLocaleForDatePicker = (localeId) => {
Expand Down Expand Up @@ -334,6 +331,36 @@ export class EditComponent {
});
}

isNotEditible(){
if(this.isEditable.langCode){
this.primaryForm.controls.contactPerson.disable()
this.primaryForm.controls.addressLine1.disable()
this.primaryForm.controls.addressLine2.disable()
this.primaryForm.controls.addressLine3.disable()

this.secondaryForm.controls.name.disable()
this.secondaryForm.controls.contactPerson.disable()
this.secondaryForm.controls.addressLine1.disable()
this.secondaryForm.controls.addressLine2.disable()
this.secondaryForm.controls.addressLine3.disable()

this.commonForm.controls.centerTypeCode.disable()
this.commonForm.controls.contactPhone.disable()
this.commonForm.controls.longitude.disable()
this.commonForm.controls.latitude.disable()
this.commonForm.controls.workingDays.disable()
this.commonForm.controls.zone.disable()
this.commonForm.controls.holidayZone.disable()
this.commonForm.controls.processingTime.disable()
this.commonForm.controls.startTime.disable()
this.commonForm.controls.endTime.disable()
this.commonForm.controls.lunchStartTime.disable()
this.commonForm.controls.lunchEndTime.disable()
this.commonForm.controls.startTime.disable()
}
}


get primary() {
return this.primaryForm.controls;
}
Expand Down Expand Up @@ -449,7 +476,8 @@ export class EditComponent {
}
},
//error => this.showErrorPopup()
);
);
this.isNotEditible()
}

showErrorPopup() {
Expand Down

0 comments on commit a6b8b73

Please sign in to comment.