HOTFIX - questionnaire founder birthdate failed when null & fix for min/max when max was in past

actions/questionnaireActions.js

@@ -85,7 +85,7 @@ export const getQuestionnaire = ({ dispatch, id }) =>
 						founder_number: 0, 
 						founder_part: "", 
 						is_beneficial: false, 
-						birthdate: "", 
+						birthdate: null, 
 						identity_document: 
 						{
 							doctype: "", 
@@ -216,10 +216,12 @@ export const getQuestionnaire = ({ dispatch, id }) =>
 									questionnaire.founder_persons[i].identity_document = JSON.parse(JSON.stringify(identity_document_template));
 								}
 
+								/*
 								if(questionnaire.founder_persons[i].birthdate === null)
 								{
 									questionnaire.founder_persons[i].birthdate = moment().subtract(18, 'years').toDate();
 								}
+								*/
 							}
 						}
 
@@ -240,10 +242,12 @@ export const getQuestionnaire = ({ dispatch, id }) =>
 									questionnaire.client_contacts[i].identity_document = JSON.parse(JSON.stringify(identity_document_template));
 								}
 
+								/*
 								if(questionnaire.client_contacts[i].birthdate === null)
 								{
 									questionnaire.client_contacts[i].birthdate = moment().subtract(18, 'years').toDate();
 								}
+								*/
 							}
 						}
 

components/CalendarDatePicker/index.js

@@ -10,10 +10,6 @@ const messages = {
 	dateButton: "Выбрать дату",
 };
 
-const formats = [
-	'DD.MM.YYYY'
-];
-
 export default class CalendarDatePicker extends React.Component 
 {
 	constructor(props)
@@ -43,56 +39,9 @@ export default class CalendarDatePicker extends React.Component
 					this.props.onChange(null, null);
 				}
 			}
-//			this.props.onChange(date.getTime !== undefined ? date.toJSON() : "", date.getTime !== undefined ? raw : null);
-			/*
-			if(!readonly)
-			{
-				this.setState({ value: date });
-			}
-			else
-			{
-			}
-			*/
 		}
 	}
 
-	/*
-	_handle_onKeyDown = (event) => 
-	{
-		const { input_value } = this.state;
-		if(event.keyCode >= 48 && event.keyCode <= 57)
-		{
-			//const input_value 
-			//console.log("CalendarDatePicker", "_handle_onKeyChange", "key", event.key, event);
-
-			let new_value = `${ input_value !== undefined ? input_value : "" }${ event.key }`;
-
-			let masks = "ДД.ММ.ГГГГ".split("");
-			let letters = new_value.split("");
-
-			let chars = [];
-			//console.log({ new_value, letters, masks });
-
-
-			for(let i in masks)
-			{
-				if(letters[i] !== undefined)
-				{
-					chars.push(letters[i]);
-				}
-				else
-				{
-					chars.push(masks[i]);
-				}
-			}
-			//console.log("chars", chars, chars.join(""));
-
-
-			this.setState({ input_value: chars.join("") });
-		}
-	}
-	*/
-
 	_handle_onFocus = () => 
 	{
 		this.setState({ readonly: false });
@@ -139,8 +88,6 @@ export default class CalendarDatePicker extends React.Component
 		const { id, placeholder, value, min, max, disabled, plain, style, required, className } = this.props;
 		const { readonly, input_value } = this.state;
 
-//		console.log("CalendarDatePicker", { value });
-
 		if(disabled)
 		{
 			return (
@@ -172,22 +119,23 @@ export default class CalendarDatePicker extends React.Component
 		}
 		else
 		{
+			const date_value = input_value !== undefined ? input_value : value !== "" && value !== undefined && value !== null ? new Date(Date.parse(moment(value, "YYYY-MM-DD").format('YYYY-MM-DD 00:00:00'))) : max !== undefined ? new Date(Date.parse(moment(max).format('YYYY-MM-DD 00:00:00'))) : null;
+
 			return (
-				<div className={ `date_input_wrapper ${ className }` } style={ this.props.style }>
+				<div className={ `date_input_wrapper ${ className } ${ value !== null ? "" : "date_input_wrapper_with_ph" }` } style={ this.props.style }>
 					<DatePicker 
-						//valueEditFormat={{ dateStyle: "short" }} 
 						messages={ messages } 
 						onFocus={ this._handle_onFocus } 
 						onBlur={ this._handle_onBlur } 
-						//onKeyDown={ this._handle_onKeyDown } 
 						parse={ this._parse } 
 						id={ id } 
 						placeholder={ placeholder } 
-						value={ input_value !== undefined ? input_value : value !== "" && value !== undefined && value !== null ? new Date(Date.parse(moment(value, "YYYY-MM-DD").format('YYYY-MM-DD 00:00:00'))) : null } 
+						value={ date_value } 
 						min={ min !== undefined ? new Date(Date.parse(moment(min).format('YYYY-MM-DD 00:00:00'))) : undefined } 
 						max={ max !== undefined ? new Date(Date.parse(moment(max).format('YYYY-MM-DD 00:00:00'))) : undefined } 
 						onChange={ this._handle_onChange } 
-						inputProps={{ required }} 
+						inputProps={{ required, style: { color: value !== "" && value !== undefined && value !== null ? "#212529" : input_value !== null && input_value !== undefined && input_value !== "" ? "#212529" : "#FFF" } }} 
+						calendarProps={{ onCurrentDateChange: () => { console.log("onCurrentDateChange") } }} 
 					/>
 				</div>
 			)

components/questionnaire/forms/Form_4_Shareholders/index.js

@@ -32,6 +32,7 @@ class ShareholderForm extends React.Component
 	_handle_onCheckboxFieldChange = this.props._handle_onCheckboxFieldChange;
 	_handle_onFieldChange = this.props._handle_onFieldChange;
 	_checkStrValue = this.props._checkStrValue;
+	_checkDateValue = this.props._checkDateValue;
 	_removeError = this.props._removeError;
 	_handle_onIssuerCodeChange = this.props._handle_onIssuerCodeChange;
 	_handle_onIssuerChange = this.props._handle_onIssuerChange;
@@ -305,10 +306,10 @@ class ShareholderForm extends React.Component
 						className={ errors.indexOf("birthdate") > -1 ? "error" : "" } 
 						//style={{ width: "calc(100% - 198px)" }} 
 						placeholder="ДД.ММ.ГГГГ" 
-						min={ moment().subtract(90, 'years').toDate() } 
+						min={ moment().clone().subtract(90, 'years').toDate() } 
-						max={ moment().subtract(18, 'years').toDate() } 
+						max={ moment().clone().subtract(18, 'years').toDate() } 
 						id={ `founder_persons[${ index }].birthdate` } 
-						value={ this._checkStrValue(shareholder.birthdate) !== "" ? this._checkStrValue(shareholder.birthdate) : moment().subtract(18, 'years').toDate() } 
+						value={ this._checkStrValue(shareholder.birthdate) !== "" ? this._checkDateValue(shareholder.birthdate) : null } 
 						onChange={ (date, raw) => { this._removeError("birthdate"); this._handle_onDateFieldChange(`founder_persons[${ index }].birthdate`, date, raw) } } 
 						required={ true } 
 						disabled={ checking } 
@@ -445,6 +446,7 @@ class Shareholder extends React.Component
 	_handle_onTextFieldChange = this.props._handle_onTextFieldChange;
 	_handle_onCheckboxFieldChange = this.props._handle_onCheckboxFieldChange;
 	_checkStrValue = this.props._checkStrValue;
+	_checkDateValue = this.props._checkDateValue;
 	_removeError = this.props._removeError;
 
 	_checkContactListDisabled = (check) => 
@@ -579,7 +581,7 @@ class Form_4_Shareholders extends QuestionnaireForm
 				founder_number: 0, 
 				founder_part: null, 
 				is_beneficial: false, 
-				birthdate: moment().subtract(18, 'years').toDate(), 
+				birthdate: null, 
 				identity_document: 
 				{
 					doctype: 100000000, 
@@ -749,6 +751,7 @@ class Form_4_Shareholders extends QuestionnaireForm
 			"telephone", 
 			"email", 
 			*/
+			"birthdate", 
 			"identity_document.seria", 
 			"identity_document.docnumber", 
 			"identity_document.issuedate", 
@@ -943,6 +946,7 @@ class Form_4_Shareholders extends QuestionnaireForm
 							_handle_onIssuerChange={ this._handle_onIssuerChange } 
 							_handle_onDocumentTypeChange={ this._handle_onDocumentTypeChange } 
 							_checkStrValue={ this._checkStrValue } 
+							_checkDateValue={ this._checkDateValue } 
 							_removeError={ (name) => this._onRemoveError(index, name) } 
 							removeShareholder={ this._handle_onRemoveShareholder } 
 							clearFounderFromListSelection={ this._handle_onClearFounderFromListSelection } 

components/questionnaire/forms/QuestionnaireForm.js

@@ -42,6 +42,11 @@ export default class QuestionnaireForm extends React.Component
 		return value !== undefined && value !== null ? value.toString() : "";
 	}
 
+	_checkDateValue = (value) => 
+	{
+		return typeof value === 'string' ? value : "";
+	}
+
 	_checkStrNotEmpty = (value) => 
 	{
 		if(value === null || value === undefined || value === "")
@@ -114,21 +119,26 @@ export default class QuestionnaireForm extends React.Component
 	{
 //		console.log("QuestionnaireForm", "_handle_onDateFieldChange", { name, value, raw });
 
-		try
+		if(value === null && raw === null)
 		{
-//			console.log("DIFF 1", moment.utc(raw, 'DD.MM.YYYY').format('YYYY-MM-DD'));
-//			console.log("DIFF 2", moment(raw, 'DD.MM.YYYY').utc().format('YYYY-MM-DD'));
-
-			const date = moment.utc(raw, 'DD.MM.YYYY').format('YYYY-MM-DD');
-//			console.log("QuestionnaireForm", "_handle_onDateFieldChange", { date });
-
 			const update = { ...this.state };
-			_set(update, name, date);
+			_set(update, name, null);
 			this._updateQuestionnaire(update);	
 		}
-		catch(e)
+		else
 		{
-			console.error(e);
+			try
+			{
+				const date = moment.utc(raw, 'DD.MM.YYYY').format('YYYY-MM-DD');
+
+				const update = { ...this.state };
+				_set(update, name, date);
+				this._updateQuestionnaire(update);	
+			}
+			catch(e)
+			{
+				console.error(e);
+			}
 		}
 	}
 

css/forms/style.css

@@ -1321,6 +1321,9 @@
   margin-right: 0;
   max-width: 800px;
 }
+.questionnaire .autocomlete {
+  z-index: 2;
+}
 .questionnaire .autocomlete * {
   outline: none;
   box-shadow: none !important;

css/forms/style.less

@@ -1544,7 +1544,7 @@
 
     .autocomlete 
 	{
-        
+		z-index: 2;
         * {
             outline: none;
             box-shadow: none !important;

css/main/style.css

@@ -7229,3 +7229,25 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block .block_body .fines_
 #chat21-launcher-button circle {
   fill: #1c01a9 !important;
 }
+.rw-state-selected {
+  background-color: var(--blue) !important;
+  border: none !important;
+  border-radius: 0px !important;
+}
+.date_input_wrapper_with_ph:before {
+  content: "ДД.ММ.ГГГГ";
+  position: absolute;
+  left: 33px;
+  top: 12px;
+  z-index: 1;
+  font-family: Montserrat, sans-serif;
+  font-size: 15px;
+  color: #919399;
+  pointer-events: none;
+  touch-action: none;
+}
+@media all and (max-width: 960px) {
+  .date_input_wrapper_with_ph:before {
+    font-size: 13px;
+  }
+}

css/main/style.less

@@ -8271,4 +8271,29 @@ main .dropdown_blocks_list.zero-margin.gibdd .dropdown_block {
 
 #chat21-launcher-button circle {
 	fill: #1c01a9 !important;
+}
+
+.rw-state-selected {
+	background-color: var(--blue) !important;
+	border: none !important;
+	border-radius: 0px !important;
+}
+
+.date_input_wrapper_with_ph {
+	&:before {
+		content: "ДД.ММ.ГГГГ";
+		position: absolute;
+		left: 33px;
+		top: 12px;
+		z-index: 1;
+		font-family: Montserrat, sans-serif;
+		font-size: 15px;
+		color: #919399;
+		pointer-events: none;
+		touch-action: none;
+
+		@media all and (max-width: 960px) {
+			font-size: 13px;
+		}
+	}
 }

package.json

@@ -52,7 +52,7 @@
     "react-redux": "^7.2.6",
     "react-select": "^5.7.2",
     "react-slick": "^0.29.0",
-    "react-widgets": "^5.5.1",
+    "react-widgets": "^5.8.4",
     "redux": "^4.1.2",
     "redux-persist": "^6.0.0",
     "ruscryptojs": "^2.6.1",

yarn.lock

@@ -5835,9 +5835,9 @@ react-transition-group@^4.3.0, react-transition-group@^4.4.2:
     loose-envify "^1.4.0"
     prop-types "^15.6.2"
 
-react-widgets@^5.5.1:
+react-widgets@^5.8.4:
   version "5.8.4"
-  resolved "https://registry.npmjs.org/react-widgets/-/react-widgets-5.8.4.tgz"
+  resolved "https://registry.yarnpkg.com/react-widgets/-/react-widgets-5.8.4.tgz#1c57c93cef7fabb88cd48c92a2a418f56553620d"
   integrity sha512-WcA/K+eVKAW+vyeQKdRqo2gmnLqHbNSDDKQ84j/wyhbautCRrGbjWAmKb4+tI3OzUgCAAEJDZ75azAY2WoKWYQ==
   dependencies:
     "@restart/hooks" "^0.4.5"