From 32c6e010c90374441cf3cc6f5d2d18e4ef1a5b98 Mon Sep 17 00:00:00 2001 From: Rajaneesh Date: Thu, 28 Nov 2024 17:53:03 +0530 Subject: [PATCH] Fixed hidden field status --- .../components/notice-choice/notice-choice.ts | 218 +++++++++--------- 1 file changed, 111 insertions(+), 107 deletions(-) diff --git a/packages/web-components/src/components/notice-choice/notice-choice.ts b/packages/web-components/src/components/notice-choice/notice-choice.ts index 85cd8b835fa..a0c48f01f3c 100644 --- a/packages/web-components/src/components/notice-choice/notice-choice.ts +++ b/packages/web-components/src/components/notice-choice/notice-choice.ts @@ -104,6 +104,9 @@ class NoticeChoice extends StableSelectorMixin(LitElement) { @property({ type: Boolean, attribute: false }) telephonePrechecked = false; + @property({ type: Boolean, attribute: false }) + combinedEmailPhonePrechecked = false; + /** * End properties for passed attributes. */ @@ -218,7 +221,17 @@ class NoticeChoice extends StableSelectorMixin(LitElement) { const hiddenFieldName = `NC_HIDDEN_${key}`; newValues[hiddenFieldName] = option[hiddenFieldName]; - this._onChange(hiddenFieldName, newValues[key] ? 'OPT_IN' : 'OPT_OUT'); + if (this.combineEmailPhone) { + this._onChange( + hiddenFieldName, + newValues.EMAIL ? 'OPT_IN' : 'OPT_OUT' + ); + } else { + this._onChange( + hiddenFieldName, + newValues[key] ? 'OPT_IN' : 'OPT_OUT' + ); + } }); if (JSON.stringify(this.values) !== JSON.stringify(newValues)) { this.values = newValues; @@ -236,7 +249,7 @@ class NoticeChoice extends StableSelectorMixin(LitElement) { const mrsField = this.ncData?.mandatoryCheckbox[countyCode] .countryTransferText ? this.ncData?.mandatoryCheckbox[countyCode].countryTransferText - .mrs_field + .mrs_field : this.ncData?.mandatoryCheckbox[countyCode].chinaPIPLtext.mrs_field; this._onChange(mrsField, 'countyBasedCheckedNo'); @@ -257,6 +270,7 @@ class NoticeChoice extends StableSelectorMixin(LitElement) { * @description * change checkbox checked option based on new country. */ + this.setDefaultSelections(); } } @@ -366,10 +380,10 @@ class NoticeChoice extends StableSelectorMixin(LitElement) { this.emailPrechecked && !checked ? 'CU' : !this.emailPrechecked && checked - ? 'UC' - : this.emailPrechecked && checked - ? 'CC' - : 'UU'; + ? 'UC' + : this.emailPrechecked && checked + ? 'CC' + : 'UU'; break; case 'PHONE': @@ -377,10 +391,10 @@ class NoticeChoice extends StableSelectorMixin(LitElement) { this.telephonePrechecked && checked ? 'CC' : this.telephonePrechecked && !checked - ? 'CU' - : !this.telephonePrechecked && checked - ? 'UC' - : 'UU'; + ? 'CU' + : !this.telephonePrechecked && checked + ? 'UC' + : 'UU'; break; } @@ -412,8 +426,8 @@ class NoticeChoice extends StableSelectorMixin(LitElement) { const mrsField = this.ncData?.mandatoryCheckbox[countyCode] .countryTransferText ? this.ncData?.mandatoryCheckbox[ - this.isMandatoryCheckboxDisplayed.countryCode - ].countryTransferText.mrs_field + this.isMandatoryCheckboxDisplayed.countryCode + ].countryTransferText.mrs_field : this.ncData?.mandatoryCheckbox[countyCode].chinaPIPLtext.mrs_field; legalCheckbox.value = isChecked ? 1 : 0; this.preventFormSubmission = !isChecked; @@ -464,13 +478,13 @@ class NoticeChoice extends StableSelectorMixin(LitElement) { ${!this.hideErrorMessage && this.preventFormSubmission - ? html`${mandatoryCheckbox.error}` - : ''} + : ''}

@@ -626,7 +640,7 @@ class NoticeChoice extends StableSelectorMixin(LitElement) { Object.keys(this.checkboxes).map((id) => { newValues[id] = !!checked; this.values = newValues; - + console.log(this.combinedEmailPhonePrechecked) const hiddenFieldName = `NC_HIDDEN_${id}`; const hiddenFieldStatus = checked ? 'PERMISSION' : 'SUPPRESSION'; this.values[id] = {}; @@ -634,25 +648,15 @@ class NoticeChoice extends StableSelectorMixin(LitElement) { let statusPrechecked = ''; switch (id) { case 'EMAIL': - statusPrechecked = - this.emailPrechecked && !checked - ? 'CU' - : !this.emailPrechecked && checked - ? 'UC' - : this.emailPrechecked && checked - ? 'CC' - : 'UU'; - - break; case 'PHONE': statusPrechecked = - this.telephonePrechecked && checked - ? 'CC' - : this.telephonePrechecked && !checked + this.combinedEmailPhonePrechecked && !checked ? 'CU' - : !this.telephonePrechecked && checked - ? 'UC' - : 'UU'; + : !this.combinedEmailPhonePrechecked && checked + ? 'UC' + : this.combinedEmailPhonePrechecked && checked + ? 'CC' + : 'UU'; break; } @@ -662,7 +666,6 @@ class NoticeChoice extends StableSelectorMixin(LitElement) { `${hiddenFieldName}_VALUE`, `NC_HIDDEN_${hiddenFieldStatus}` ); - console.log('Test ME'); }); } renderCheckbox(preText, checked) { @@ -711,35 +714,38 @@ class NoticeChoice extends StableSelectorMixin(LitElement) { ${this.countryBasedLegalNotice()} ${this.combinedPreTextTemplate()}

${Object.keys(this.checkboxes).map((key) => { - const checked = this.values.EMAIL; - const punsStatus = getPunsStatus(key, checked); - const hiddenBox = { - id: `NC_HIDDEN_${key}`, - value: this.values[key]['checkBoxStatus'] - ? this.values[key]['checkBoxStatus'] - : this.values[key] - ? 'PERMISSION' - : 'SUPPRESSION', - }; + const checked = this.values.EMAIL; + const punsStatus = getPunsStatus(key, checked); + const hiddenBox = { + id: `NC_HIDDEN_${key}`, + value: this.values[key]['checkBoxStatus'] + ? this.values[key]['checkBoxStatus'] + : this.values.EMAIL + ? 'PERMISSION' + : 'SUPPRESSION', + }; + if (typeof checked !== 'object') { + this.combinedEmailPhonePrechecked = checked ? true : false; + } + this._onChange( + `NC_${key === 'PHONE' ? 'TELE' : key}_DETAIL`, + `${key}_${punsStatus}` + ); - this._onChange( - `NC_${key === 'PHONE' ? 'TELE' : key}_DETAIL`, - `${key}_${punsStatus}` - ); - this._onChange( - `${hiddenBox.id}_VALUE`, - `NC_HIDDEN_${hiddenBox.value}` - ); + this._onChange( + `${hiddenBox.id}_VALUE`, + `NC_HIDDEN_${hiddenBox.value}` + ); - return createHiddenInput(hiddenBox.id, hiddenBox.value); - })} + return createHiddenInput(hiddenBox.id, hiddenBox.value); + })}
${this.postTextTemplate()}
${createHiddenInput( - 'preventFormSubmission', - this.preventFormSubmission - )} + 'preventFormSubmission', + this.preventFormSubmission + )}

${this.countryBasedLegalNotice()} ${this.preTextTemplate()}

- ${ - Object.keys(this.checkboxes).length !== 0 - ? Object.keys(this.checkboxes).length > 0 && - Object.keys(this.checkboxes).map((key) => { - const checked = this.values[key]; - const checkbox = this.checkboxes[key]; - const punsStatus = this.values[key]['punsStatus'] - ? this.values[key]['punsStatus'] - : checked - ? 'CC' - : 'UU'; - const hiddenBox = { - id: 'NC_HIDDEN_' + key, - value: this.values[key]['checkBoxStatus'] - ? this.values[key]['checkBoxStatus'] - : this.values[key] - ? 'PERMISSION' - : 'SUPPRESSION', - }; - switch (key) { - case 'EMAIL': - this.hiddenEmail = hiddenBox.value; - this.ncEmailDetail = punsStatus; - if (typeof checked !== 'object') { - this.emailPrechecked = checked ? true : false; - } - break; - case 'PHONE': - this.hiddenPhone = hiddenBox.value; - this.ncTeleDetail = punsStatus; - if (typeof checked !== 'object') { - this.telephonePrechecked = checked ? true : false; - } - break; - } - const punsValue = key === 'PHONE' ? 'TELE' : key; - this._onChange( - `NC_${punsValue}_DETAIL`, - `${key}_${punsStatus}` - ); - return this.checkBoxTemplate(checkbox, checked, hiddenBox); - }) - : '' - } + ${Object.keys(this.checkboxes).length !== 0 + ? Object.keys(this.checkboxes).length > 0 && + Object.keys(this.checkboxes).map((key) => { + const checked = this.values[key]; + const checkbox = this.checkboxes[key]; + const punsStatus = this.values[key]['punsStatus'] + ? this.values[key]['punsStatus'] + : checked + ? 'CC' + : 'UU'; + const hiddenBox = { + id: 'NC_HIDDEN_' + key, + value: this.values[key]['checkBoxStatus'] + ? this.values[key]['checkBoxStatus'] + : this.values[key] + ? 'PERMISSION' + : 'SUPPRESSION', + }; + switch (key) { + case 'EMAIL': + this.hiddenEmail = hiddenBox.value; + this.ncEmailDetail = punsStatus; + if (typeof checked !== 'object') { + this.emailPrechecked = checked ? true : false; + } + break; + case 'PHONE': + this.hiddenPhone = hiddenBox.value; + this.ncTeleDetail = punsStatus; + if (typeof checked !== 'object') { + this.telephonePrechecked = checked ? true : false; + } + break; + } + const punsValue = key === 'PHONE' ? 'TELE' : key; + this._onChange( + `NC_${punsValue}_DETAIL`, + `${key}_${punsStatus}` + ); + return this.checkBoxTemplate(checkbox, checked, hiddenBox); + }) + : '' + }
${this.postTextTemplate()}
- + `; }