\n
\n );\n }\n}\n\nexport default Days;\n","import React from \"react\";\n\nimport IconButton from '@material-ui/core/IconButton';\nimport Icon from '@material-ui/core/Icon';\n\nclass Months extends React.Component {\n constructor(props) {\n super(props);\n this.state = {\n months: [\n \"فروردین\",\n \"اردیبهشت\",\n \"خرداد\",\n \"تیر\",\n \"مرداد\",\n \"شهریور\",\n \"مهر\",\n \"آبان\",\n \"آذر\",\n \"دی\",\n \"بهمن\",\n \"اسفند\"\n ],\n monthPickerView: false,\n selectedMonth: this.props.month\n };\n }\n monthClicked(i, e) {\n let { clickEvent } = this.props;\n if (clickEvent) clickEvent(i);\n this.setState({ monthPickerView: false, selectedMonth: i });\n }\n renderMonths() {\n let { months, selectedMonth } = this.state;\n let result = [];\n for (let i = 1; months.length >= i; i++) {\n if (selectedMonth == i)\n result.push(\n \n {!!this.state.daysCount && this.renderDays()}\n
\n \n {months[i - 1]}\n
\n );\n else\n result.push(\n \n {monthTitleEnable && ماه: }\n
\n );\n }\n}\nconst inlineStyles = {\n month: {\n display: 'flex',\n marginTop: '4px',\n alignItems: 'center',\n marginBottom: '15px',\n justifyContent: 'space-between'\n }\n};\n\nexport default Months;\n//return (\n// \n this.monthClicked(month - 1)}>\n chevron_right \n \n\n this.monthClicked(month + 1)}>\n chevron_left \n \n\n {monthPickerView && (\n
\n { this.setState({ monthPickerView: !monthPickerView }); }} style={{ cursor: 'pointer', marginTop: '1rem',fontWeight: 'bold', fontSize: '1.5rem'}}>\n {months[month - 1]}\n
\n\n {this.renderMonths()}
\n )}\n \n// {monthTitleEnable && ماه: }\n//
\n// \n//);","let Styles = nDays => {\n return `\n .days-titles div {\n width: 14.28%;\n display: inline-block;\n font-size: 14px;\n font-weight: 300;\n text-align: center;\n color: rgba(0, 0, 0, 0.38);\n }\n .monthPicker {\n position: absolute;\n right: -6px;\n width: 100%;\n background: #fff;\n text-align: center;\n padding: 5px;\n border-radius: 5px;\n top: 26px;\n box-shadow: 0px 0px 7px -2px #000;\n z-index: 1;\n }\n .month-items:hover, .month-items.selected {\n background: aliceblue;\n color: #ccc;\n }\n .month-items {\n width: 32.5%;\n float: right;\n text-align: center;\n cursor: pointer;\n padding: 4px 0px;\n border: 1px solid #ccc;\n font-size: 14px;\n }\n \n .print-month {\n width: 60%;\n text-align: center;\n float: right;\n cursor: pointer;\n }\n\n .JC-days {\n position: relative;\n display: inline-block;\r\n margin-top: 12px;\n }\n .JC-days .holder {\n line-height: 40px;\n }\n .day-items{\n width: 14.28%;\n float: right;\n text-align: center;\n cursor: pointer;\n }\n .day-items:hover{\n background-color: #00000014;\n border-radius: 50%;\n }\n .day-items.selected {\n color: #fff;\n background-color: #2196f3;\n border-radius: 50%;\n }\n .day-items.current-date{\n color: #fff;\n background-color: #64b5f6;\n border-radius: 50%;\n }\n\n .JDsubmit{\n background: #7fc6ff;\n }\n .jdtrp > div {\n display: initial;\n margin: 0 6px;\n }\n `;\n};\nexport default Styles;\n","import React from \"react\";\nimport { relative } from \"path\";\r\nconst mapObj = {\n 1: \"۱\",\n 2: \"۲\",\n 3: \"۳\",\n 4: \"۴\",\n 5: \"۵\",\n 6: \"۶\",\n 7: \"۷\",\n 8: \"۸\",\n 9: \"۹\",\n 0: \"۰\"\n};\n\nclass Years extends React.Component {\n constructor(props) {\n super(props);\n this.yearChanged = this.yearChanged.bind(this);\n this.state = { year: this.props.year, error: \"\" };\n }\n yearChanged() {\n let { year } = this.refs;\n let { changeEvent } = this.props;\n this.setState({ year: year.value });\n if (year.value.length == 4 && year.value > 1300 && year.value < 1500) {\n this.setState({ editable: false, error: \"\" });\n if (!!changeEvent) changeEvent(parseInt(year.value));\n } else this.setState({ error: \"سال ۴ رقم و درفاصله ۱۳۰۰ تا ۱۵۰۰ باشد\" });\n }\n componentWillReceiveProps(nextprops) {\n this.setState({ year: nextprops.year });\n }\n render() {\n let { error, year, editable } = this.state;\n let yearString = year\n .toString()\n .replace(/1|2|3|4|5|6|7|8|9|0/gi, function (e) {\n return mapObj[e];\n });\n return (\n \n// {\n// this.setState({ monthPickerView: !monthPickerView });\n// }}\n// className=\"print-month\"\n// >\n// {months[month - 1]}\n//
\n// this.monthClicked(month - 1)} className=\"prev\">\n// {\">\"}\n//
\n// this.monthClicked(month + 1)} className=\"next\">\n// {\"<\"}\n//
\n// {monthPickerView && (\n// {this.renderMonths()}
\n// )}\n// \n this.setState({ editable: !editable })}>کلیک جهت تغیییر سال: \n {!editable && (\n this.setState({ editable: !editable })}\n >\n {yearString}\n \n )}\n {editable && (\n
\n );\n }\n}\nconst inlineStyles = {\n container: {\r\n display: 'flex',\r\n flexDirection: 'row'\r\n },\r\n child1: {\r\n position: 'relative',\r\n width: '125px'\r\n },\r\n child2: {\r\n position: 'relative',\r\n width: '60px'\r\n },\r\n tooltip: {\r\n position: 'absolute',\r\n top: 80\r\n }\r\n};\nexport default Years;\n","import React from \"react\";\n\nexport default ({ onClick }) => {\n return (\n \n
\n )}\n {error}
\n\r\n {this.props.progressType === \"Page\" &&\r\n \r\n \r\n
\r\n \r\n }\r\n {this.props.progressType === \"Component\" &&\r\n \r\n \r\n
\r\n \r\n }\r\n {this.props.progressType === \"Control\" &&\r\n \r\n \r\n
\r\n \r\n }\r\n {this.props.progressType === \"Command\" &&\r\n
\r\n );\r\n }\r\n}","import React, { Component } from 'react';\r\nimport JSUtil from '../service/JSUtil';\r\nimport Progress from './Progress';\r\nimport IconButton from '@material-ui/core/IconButton';\r\nimport Icon from '@material-ui/core/Icon';\r\n\r\nclass MaterialInput extends Component {\r\n static defaultProps = {\r\n type: \"text\",\r\n name: \"\",\r\n value: \"\",\r\n maxLength: 1000000000,\r\n label: \"\",\r\n disabled: false,\r\n rows: 4,\r\n loading: false,\r\n refs: () => { },\r\n onFocus: () => { },\r\n onBlur: () => { },\r\n onKeyDown: () => { },\r\n onKeyUp: () => { },\r\n autoComplete: \"off\",\r\n autoCorrect: \"off\",\r\n //invalid: false,\r\n //invalidMsg: \"\"\r\n }\r\n constructor(props) {\r\n super(props);\r\n\r\n this.state = {\r\n isFocused: false,\r\n NotEmpty: false,\r\n HasValue: false,\r\n NationalCode: false,\r\n Mobile: false,\r\n Digit: false,\r\n Email: false,\r\n Date: false,\r\n Time: false,\r\n Capcha: false,\r\n Icon: false,\r\n // invalid: false,\r\n // Msg: ''\r\n };\r\n this.JSUtil = new JSUtil();\r\n this.onChange = this.onChange.bind(this);\r\n this.onFocus = this.onFocus.bind(this);\r\n this.onBlur = this.onBlur.bind(this);\r\n this.onIconClicked = this.onIconClicked.bind(this);\r\n this.validate = this.validate.bind(this);\r\n this.GetInputType = this.GetInputType.bind(this);\r\n this.input = this;\r\n }\r\n componentDidMount() {\r\n this.props.refs(this.input);\r\n\r\n if (this.props.value !== \"\") {\r\n this.setState({ isFocused: true });\r\n }\r\n\r\n this.setState({\r\n NotEmpty: typeof this.props.NotEmpty !== 'undefined',\r\n HasValue: typeof this.props.HasValue !== 'undefined',\r\n NationalCode: typeof this.props.NationalCode !== 'undefined',\r\n Mobile: typeof this.props.Mobile !== 'undefined',\r\n Digit: typeof this.props.Digit !== 'undefined',\r\n Email: typeof this.props.Email !== 'undefined',\r\n Date: typeof this.props.Date !== 'undefined',\r\n Time: typeof this.props.Time !== 'undefined',\r\n Capcha: typeof this.props.Capcha !== 'undefined',\r\n Icon: typeof this.props.Icon !== 'undefined',\r\n });\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n //console.log(\"componentWillReceiveProps\", nextProps);\r\n //this.setState({ data: nextProps.data, selectedID: nextProps.selectedID });\r\n if (nextProps.value !== \"\") {\r\n this.setState({ isFocused: true });\r\n }\r\n }\r\n\r\n onChange(e) {\r\n if (this.state.Digit && this.JSUtil.isDigit(e.target.value) === false) return;\r\n // var element = e.target;\r\n this.validate(e.target.name, e.target.value, e).then((res) => {\r\n // element.previousElementSibling.style.borderColor = \"#03a9f4\";\r\n // element.nextElementSibling.innerText = \"\";\r\n // this.setState({ Msg: \"\", invalid: false });\r\n }, (res) => {\r\n // element.previousElementSibling.style.borderColor = \"#f44336\";\r\n // element.nextElementSibling.innerText = res;\r\n // this.setState({ Msg: res, invalid: true });\r\n });\r\n\r\n this.props.onChange(e);\r\n }\r\n\r\n validate(name, value, event) {\r\n var result;\r\n if (this.state.NotEmpty) {\r\n result = this.JSUtil.validation_NotEmpty(name, value, this);\r\n if (!result.valid) {\r\n return Promise.reject(result.msg);\r\n }\r\n }\r\n if (this.state.HasValue) {\r\n result = this.JSUtil.validation_HasValue(name, value, this);\r\n if (!result.valid) {\r\n return Promise.reject(result.msg);\r\n }\r\n }\r\n if (this.state.NationalCode) {\r\n result = this.JSUtil.validation_NationalCode(name, value, this);\r\n if (!result.valid) {\r\n return Promise.reject(result.msg);\r\n }\r\n }\r\n if (this.state.Mobile) {\r\n result = this.JSUtil.validation_Mobile(name, value, this);\r\n if (!result.valid) {\r\n return Promise.reject(result.msg);\r\n }\r\n }\r\n if (this.state.Email) {\r\n result = this.JSUtil.validation_Email(name, value, this);\r\n if (!result.valid) {\r\n return Promise.reject(result.msg);\r\n }\r\n }\r\n if (this.state.Date) {\r\n result = this.JSUtil.validation_Date(name, value, this);\r\n if (!result.valid) {\r\n return Promise.reject(result.msg);\r\n }\r\n }\r\n if (this.state.Time) {\r\n result = this.JSUtil.validation_Time(name, value, this);\r\n if (!result.valid) {\r\n return Promise.reject(result.msg);\r\n }\r\n }\r\n if (this.state.Capcha) {\r\n result = this.JSUtil.validation_Capcha(name, value, this);\r\n if (!result.valid) {\r\n return Promise.reject(result.msg);\r\n }\r\n }\r\n return Promise.resolve('');\r\n }\r\n\r\n onFocus(e) {\r\n this.props.onFocus(e);\r\n this.setState({ isFocused: true });\r\n this.refField.style.borderColor = \"#03a9f4\";\r\n }\r\n onBlur(e) {\r\n this.props.onBlur(e);\r\n if (this.props.value === \"\") {\r\n this.setState({ isFocused: false });\r\n }\r\n this.validate(e.target.name, e.target.value, e).then((res) => {\r\n this.refField.style.borderColor = \"#b9b9b9\";\r\n this.refMsg.innerText = \"\";\r\n }, (res) => {\r\n // this.refField.style.borderColor = \"#f44336\";\r\n // this.refMsg.innerText = res;\r\n });\r\n }\r\n\r\n onIconClicked(e) {\r\n this.props.onIconClicked(e);\r\n }\r\n\r\n GetInputType() {\r\n if (this.props.type === \"textarea\") {\r\n return this.refMsg = ref}>{/*this.state.Msg*/}
\r\n this.refMsg = ref}>{/*this.state.Msg*/}
\r\n \r\n \r\n {this.GetInputType()}\r\n \r\n {this.state.Icon === true && this.props.loading === false && {this.props.Icon}
\r\n );\r\n\r\n }\r\n}\r\n{/* {this.props.Icon} */ }\r\n\r\nconst styles = {\r\n inputBox: {\r\n position: 'relative'\r\n },\r\n input: {\r\n fontSize: '14px',\r\n color: '#000',\r\n background: '#fff',\r\n width: '100%',\r\n padding: '10px 15px',\r\n marginBottom: '30px',\r\n border: 'none',\r\n borderRadius: '3px',\r\n outline: 'none'\r\n },\r\n invalidMsg: {\r\n display: 'block',\r\n color: '#f44336',\r\n position: 'absolute',\r\n top: '40px',\r\n right: '10px',\r\n fontSize: '12px'\r\n },\r\n invalidMsg1: {\r\n display: 'block',\r\n color: '#f44336',\r\n // position: 'absolute',\r\n // top: '40px',\r\n // right: '10px',\r\n fontSize: '12px'\r\n },\r\n Icon: {\r\n position: 'absolute',\r\n top: -3,\r\n left: 5,\r\n cursor: 'pointer',\r\n // '&:hover': {\r\n // backgroundColor: 'rgba(0, 0, 0, 0.08)',\r\n // borderRadius: '50%',\r\n // color: 'rgba(0, 0, 0, 0.54)',\r\n // transition: 'background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms'\r\n // }\r\n },\r\n loading: {\r\n position: 'absolute',\r\n top: 5,\r\n left: 5,\r\n cursor: 'pointer',\r\n }\r\n};\r\nexport default MaterialInput;","import React from \"react\";\r\nimport moment from \"moment-jalaali\";\r\nimport Days from \"./Partials/Days\";\r\nimport Months from \"./Partials/Months\";\r\nimport Styles from \"./Partials/Styles\";\r\nimport Years from \"./Partials/Years\";\r\nimport Input from \"./Partials/Input\";\r\nimport Background from \"./Partials/Background\";\r\n\r\nimport { Button, Dialog, DialogActions } from '@material-ui/core';\r\nimport { Modal, ModalBody, ModalFooter, Col, Row } from 'reactstrap';\r\nimport Portal from '../../componentsUtils/Portal';\r\nimport MaterialInput from '../../componentsUtils/MaterialInput';\r\n\r\nconst canUseDOM = !!(\r\n typeof window !== \"undefined\" &&\r\n window.document &&\r\n window.document.createElement\r\n);\r\nmoment.loadPersian([]);\r\n\r\nclass JDatePicker extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.daysInMonth = this.daysInMonth.bind(this);\r\n this.onTodayClicked = this.onTodayClicked.bind(this);\r\n this.toggleClose = this.toggleClose.bind(this);\r\n let preSelected = \"\";\r\n if (this.props.preSelected) preSelected = this.props.preSelected;\r\n this._element = null;\r\n this.state = {\r\n openPicker: false,\r\n timeSeted: false,\r\n //MaterialInput: false,\r\n selectedYear: preSelected.length > 1 ? parseInt(moment(preSelected, this.props.format).format(\"jYYYY\")) : parseInt(moment().format(\"jYYYY\")),\r\n currentMonth: preSelected.length > 1 ? parseInt(moment(preSelected, this.props.format).format(\"jMM\")) : parseInt(moment().format(\"jMM\")),\r\n selectedMonthFirstDay: preSelected.length > 1 ? moment(moment(preSelected, this.props.format).format(\"jYYYY\") + \"/\" + moment(preSelected, this.props.format).format(\"jMM\") + \"/01\", \"jYYYY/jMM/jDD\").weekday() : moment(moment().format(\"jYYYY\") + \"/\" + moment().format(\"jMM\") + \"/01\", \"jYYYY/jMM/jDD\").weekday(),\r\n selectedDay:\r\n preSelected.length > 1\r\n ? moment(preSelected, this.props.format).format(\"jYYYYjMMjDD\")\r\n : moment().format(\"jYYYYjMMjDD\"),\r\n inputValue: preSelected,\r\n months: [\r\n { id: 1, name: \"فروردین\" },\r\n { id: 2, name: \"اردیبهشت\" },\r\n { id: 3, name: \"خرداد\" },\r\n { id: 4, name: \"تیر\" },\r\n { id: 5, name: \"مرداد\" },\r\n { id: 6, name: \"شهریور\" },\r\n { id: 7, name: \"مهر\" },\r\n { id: 8, name: \"آبان\" },\r\n { id: 9, name: \"آذر\" },\r\n { id: 10, name: \"دی\" },\r\n { id: 11, name: \"بهمن\" },\r\n { id: 12, name: \"اسفند\" }\r\n ]\r\n };\r\n this.state.daysCount = this.daysInMonth(\r\n moment().format(\"jMM\"),\r\n moment().format(\"jYYYY\")\r\n );\r\n }\r\n componentWillMount() {\r\n //this.setState({ MaterialInput: typeof this.props.MaterialInput !== 'undefined' });\r\n let { selectedMonthFirstDay } = this.state;\r\n if (canUseDOM && !document.getElementById(\"jdstyle\")) {\r\n let css = Styles(selectedMonthFirstDay),\r\n head = document.head || document.getElementsByTagName(\"head\")[0],\r\n style = document.createElement(\"style\");\r\n\r\n style.type = \"text/css\";\r\n style.id = \"jdstyle\";\r\n if (style.styleSheet) {\r\n style.styleSheet.cssText = css;\r\n } else {\r\n style.appendChild(document.createTextNode(css));\r\n }\r\n\r\n head.appendChild(style);\r\n }\r\n }\r\n init() {\r\n this._element = document.createElement('div');\r\n document.body.appendChild(this._element);\r\n }\r\n\r\n destroy() {\r\n if (this._element) {\r\n document.body.removeChild(this._element);\r\n this._element = null;\r\n }\r\n }\r\n daysInMonth(month, selectedYear) {\r\n if (0 < month && month < 7) return 31;\r\n else if (6 < month && month < 12) return 30;\r\n else if (month == 12 && moment.jIsLeapYear(selectedYear)) return 30;\r\n else if (month == 12 && !moment.jIsLeapYear(selectedYear)) return 29;\r\n }\r\n daysClicked(day, momentDay) {\r\n let { onChange, format } = this.props;\r\n if (!format) format = \"jYYYY-jMM-jDD\";\r\n if (this.state.selectedDay != momentDay) {\r\n this.setState({\r\n selectedDay: momentDay,\r\n inputValue: moment(\r\n momentDay + \" 23:59:59\",\r\n \"jYYYYjMMjDD HH:mm:ss\"\r\n ).format(format)\r\n });\r\n //this.setState({ openPicker: false });\r\n }\r\n let formatted;\r\n if (!!format)\r\n formatted = moment(\r\n momentDay + \" 23:59:59\",\r\n \"jYYYYjMMjDD HH:mm:ss\"\r\n ).format(format);\r\n if (onChange) {\r\n this.setState({ timeSeted: false });\r\n this.setState({ openPicker: false });\r\n this.props.onChange(\r\n moment(momentDay + \" 23:59:59\", \"jYYYYjMMjDD HH:mm:ss\").unix(),\r\n formatted,\r\n this.props.name\r\n );\r\n }\r\n }\r\n monthsClicked(month) {\r\n let { selectedYear } = this.state;\r\n let year = selectedYear;\r\n let thisMonth = month;\r\n this.setState({ daysCount: 0 });\r\n if (month == 0) {\r\n this.setState({\r\n currentMonth: 12,\r\n daysCount: this.daysInMonth(12, selectedYear - 1),\r\n selectedYear: selectedYear - 1\r\n });\r\n thisMonth = 12;\r\n year = selectedYear - 1;\r\n } else if (month == 13) {\r\n this.setState({\r\n currentMonth: 1,\r\n daysCount: this.daysInMonth(1, selectedYear + 1),\r\n selectedYear: selectedYear + 1\r\n });\r\n thisMonth = 1;\r\n year = selectedYear + 1;\r\n } else\r\n this.setState({\r\n currentMonth: month,\r\n daysCount: this.daysInMonth(month, selectedYear)\r\n });\r\n this.firstDayOfMonth(thisMonth, year);\r\n }\r\n firstDayOfMonth(mo, ye) {\r\n let month = mo.toString();\r\n let year = ye.toString();\r\n if (month.length == 1) month = \"0\" + month;\r\n this.setState({\r\n selectedMonthFirstDay: moment(\r\n year + \"/\" + month + \"/01\",\r\n \"jYYYY/jMM/jDD\"\r\n ).weekday()\r\n });\r\n }\r\n yearSelected(year) {\r\n this.setState({ selectedYear: year });\r\n this.firstDayOfMonth(this.state.currentMonth, year);\r\n }\r\n onTodayClicked() {\r\n if (this.props.onChange) {\r\n this.props.onChange(\r\n moment(moment().format(\"jYYYYjMMjDD\") + \" 23:59:59\", \"jYYYYjMMjDD HH:mm:ss\").unix(),\r\n moment().format(this.props.format),\r\n this.props.name\r\n );\r\n this.setState({ inputValue: moment().format(this.props.format), openPicker: false, timeSeted: false });\r\n }\r\n }\r\n\r\n toggleClose() {\r\n if (this.state.timeSeted) {\r\n this.setState({\r\n openPicker: false,\r\n //timeSeted: false\r\n });\r\n }\r\n if (!this.state.timeSeted) {\r\n this.onTodayClicked();\r\n }\r\n }\r\n\r\n render() {\r\n let {\r\n openPicker,\r\n daysCount,\r\n selectedDay,\r\n currentMonth,\r\n selectedYear,\r\n selectedMonthFirstDay,\r\n inputValue\r\n } = this.state;\r\n let {\r\n id,\r\n placeholder,\r\n disableFromUnix,\r\n customClass,\r\n containerClass,\r\n inputTextAlign,\r\n monthTitleEnable,\r\n inputComponent,\r\n cancelOnBackgroundClick\r\n } = this.props;\r\n let inputAlign =\r\n !!inputTextAlign && typeof inputTextAlign != \"undefined\"\r\n ? inputTextAlign\r\n : \"right\";\r\n let input = {\r\n textAlign: inputAlign,\r\n height: 'calc(2.0625rem + 2px)',\r\n border: this.props.invalid ? '1px solid #f44336' : '1px solid #bbbbbb',\r\n //borderColor:\r\n borderRadius: '0.25rem',\r\n padding: '0.375rem 0.75rem'\r\n }\r\n return (\r\n \r\n\r\n { this.setState({ openPicker: !openPicker }); }}\r\n onClick={() => { this.setState({ openPicker: !openPicker }); }}\r\n autoComplete=\"off\"\r\n />\r\n\r\n {/*!this.state.MaterialInput &&\r\n \r\n {placeholder}:\r\n {\r\n this.setState({ openPicker: !openPicker });\r\n }}\r\n name={this.props.name}\r\n component={inputComponent}\r\n />\r\n \r\n */}\r\n\r\n {cancelOnBackgroundClick && openPicker && (\r\n {\r\n this.setState({ openPicker: false });\r\n }}\r\n />\r\n )}\r\n\r\n {openPicker && (\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n \r\n )}\r\n
\r\n );\r\n }\r\n}\r\n\r\nconst inlineStyles = {\r\n header: {\r\n height: '100px',\r\n display: 'flex',\r\n alignItems: 'flex-start',\r\n flexDirection: 'column',\r\n justifyContent: 'center',\r\n backgroundColor: '#2196f3',\r\n padding: '0 24px'\r\n },\r\n h6: {\r\n color: 'rgba(255, 255, 255, 0.54)',\r\n cursor: 'pointer',\r\n fontSize: '1rem',\r\n marginBottom: '0.5rem'\r\n },\r\n h4: {\r\n color: '#fff',\r\n fontSize: '1.5rem'\r\n },\r\n daysTitle: {\r\n //display: 'flex',\r\n maxHeight: '16px',\r\n alignItems: 'center',\r\n justifyContent: 'center',\r\n marginBottom: '0.5rem'\r\n },\r\n button: {\r\n fontFamily: 'IRANSans',\r\n\r\n }\r\n};\r\n\r\nexport default JDatePicker;","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\n//import \"@material/form-field/dist/mdc.form-field.css\";\r\n//import \"@material/checkbox/dist/mdc.checkbox.css\";\r\n\r\nclass CheckBox extends Component {\r\n static propTypes = {\r\n name: PropTypes.string.isRequired,\r\n //value: PropTypes.bool,\r\n disabled: PropTypes.bool,\r\n }\r\n\r\n static defaultProps = {\r\n disabled: false\r\n }\r\n\r\n constructor(props) {\r\n super(props);\r\n this.onChange = this.onChange.bind(this);\r\n }\r\n\r\n onChange(e) {\r\n this.props.onChange(this.props.name, !this.props.value);\r\n }\r\n\r\n render() {\r\n return (\r\n {this.props.invalidMsg}
\r\n \r\n
\r\n \r\n {moment(this.state.selectedDay, \"jYYYYjMMjDD\").format(\"jDD\")}{this.state.months.filter(item => { return item.id == moment(this.state.selectedDay, \"jYYYYjMMjDD\").format(\"jM\") })[0].name}{moment(this.state.selectedDay, \"jYYYYjMMjDD\").format(\"jYYYY\")}\r\n
\r\n\r\n this.yearSelected(returnedYear)}\r\n year={selectedYear}\r\n />\r\n
\r\n \r\n this.monthsClicked(returnedMonth)}\r\n month={currentMonth}\r\n />\r\n
\r\n \r\n
\r\n \r\n
\r\n ش
\r\n ی
\r\n د
\r\n س
\r\n چ
\r\n پ
\r\n ج
\r\n \r\n this.daysClicked(day, momentDay)}\r\n />\r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\nexport default CheckBox;","import React, { Component } from 'react';\r\nimport { Col, FormGroup } from 'reactstrap';\r\n\r\nclass CheckBoxGroup extends Component {\r\n static defaultProps = {\r\n name: 'test',\r\n disabled: false,\r\n }\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n data: this.props.data,\r\n selected: this.props.selected,\r\n Id: 0\r\n };\r\n this.onChange = this.onChange.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n // console.log(\"this is chkbox props\", this.props);\r\n this.setState({ Id: Math.floor(Math.random() * 1000) })\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n // console.log(\"this is chkbox nextProps\", this.props);\r\n // if(nextProps.data!==this.props.data){\r\n // this.setState({data: nextProps.data});\r\n // }\r\n if (nextProps.selected !== this.props.selected) {\r\n this.setState({ selected: nextProps.selected });\r\n }\r\n // this.setState({\r\n // data: nextProps.data,\r\n // selected: nextProps.selected,\r\n // });\r\n }\r\n\r\n onChange(e) {\r\n e.target.parentElement.parentElement.parentElement.parentElement.previousElementSibling.style.borderColor = '#03a9f4';\r\n e.target.parentElement.parentElement.parentElement.parentElement.nextElementSibling.innerText = '';\r\n this.props.onChange(this.props.name, this.ReturnValue(e.target.value));\r\n }\r\n\r\n ReturnValue(item) {\r\n // console.log(\"ReturnValue\")\r\n // console.log(\"item:\",[item])\r\n item = parseInt(item);\r\n var array = this.str2array(this.state.selected);\r\n // console.log(\"array\", array)\r\n if (array.includes(item) === false) {\r\n array.push(item);\r\n console.log(\"pushed\", array)\r\n var string = this.array2str(array);\r\n return string\r\n }\r\n if (array.includes(item) === true) {\r\n var array2 = array.filter(obj => (obj !== item));\r\n console.log(\"poped\", array2)\r\n var string = this.array2str(array2);\r\n return string\r\n }\r\n }\r\n\r\n str2array(Str) {\r\n console.log(\"Str:\", typeof Str)\r\n if (typeof Str !== 'null' && typeof Str !== 'undefined') {\r\n var array = Str.split(',');\r\n var filtered = array.filter(item => item !== \"\");\r\n var arrInt = filtered.map(item => parseInt(item));\r\n return arrInt;\r\n }\r\n else {\r\n return []\r\n }\r\n }\r\n\r\n array2str(Array) {\r\n var array = Array;\r\n var str = array.toString();\r\n return str;\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\nconst styles = {\r\n legend: {\r\n width: 70\r\n },\r\n fieldset: {\r\n position: 'absolute',\r\n top: 0,\r\n bottom: 0,\r\n right: 0,\r\n left: 0,\r\n borderStyle: 'solid',\r\n borderWidth: 1,\r\n borderRadius: 4,\r\n pointerEvents: 'none',\r\n borderColor: '#b9b9b9',\r\n paddingRight: 12\r\n },\r\n row: {\r\n display: 'flex',\r\n flexWrap: 'wrap'\r\n },\r\n invalidMsg: {\r\n display: 'block',\r\n color: '#f44336',\r\n position: 'absolute',\r\n bottom: -15,\r\n right: 10,\r\n fontSize: '12px'\r\n },\r\n floatLabel: {\r\n position: 'absolute',\r\n top: -10,\r\n right: 15,\r\n padding: '0px 0px',\r\n fontSize: '12px',\r\n color: '#03a9f4',\r\n pointerEvents: 'none',\r\n transition: '.5s'\r\n }\r\n};\r\nexport default CheckBoxGroup;\r\nCheckBoxGroup.defaultProps = {\r\n md: 4\r\n};","import React, { Component } from 'react';\r\nimport { Col, Input, FormFeedback } from 'reactstrap';\r\nimport { withStyles } from '@material-ui/styles';\r\nimport List from '@material-ui/core/List';\r\nimport ListItem from '@material-ui/core/ListItem';\r\nimport ListItemIcon from '@material-ui/core/ListItemIcon';\r\nimport ListItemText from '@material-ui/core/ListItemText';\r\n\r\nconst styles = theme => ({\r\n root: {\r\n width: '100%',\r\n maxWidth: 360,\r\n backgroundColor: theme.palette.background.paper,\r\n },\r\n nested: {\r\n paddingLeft: theme.spacing(4),\r\n },\r\n})\r\n\r\nclass CheckboxList extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n data: this.props.data,\r\n selectedID: this.props.selectedID\r\n }\r\n this.onChange = this.onChange.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n this.setState({ data: nextProps.data, selectedID: nextProps.selectedID });\r\n //console.log(\"componentWillReceiveProps\", nextProps);\r\n }\r\n\r\n onChange(item) {\r\n //console.log(\"DropDown_OnChange\", item);\r\n this.props.onChange(item);\r\n }\r\n\r\n handleClick(e) {\r\n console.log('handleClick', e);\r\n }\r\n render() {\r\n let optionItems = this.state.data.map((item, index) =>\r\n \r\n );\r\n return (\r\n \r\n {this.state.data.map((item, index) => {\r\n return (\r\n
\r\n \r\n
\r\n \r\n );\r\n })}\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n this.refMsg = ref}>{this.props.invalidMsg}
\r\n \r\n - Nested List Items }\r\n // className={classes.root} >\r\n // {this.state.data.map((item, index) => {\r\n // return (\r\n //
\n {\n isDayEnabled ?\n
;\n }\n\n static Seperator = ({ clockSeparator, shouldShow = true }) => {\n return {shouldShow ? (clockSeparator ? clockSeparator : '.') : ''};\n }\n\n static Hour = () => {\n return \n {/*
:\n ''\n }\n {startDate ? 'DAYS' : 'DAY'}
*/}\n {startDate ? daysLeft : moment().format('DD')}
\n \n {/*
;\n }\n\n static Minutes = () => {\n return hours
*/}\n {moment().format('HH')}
\n \n {/*
\n }\n\n static Seconds = () => {\n return minutes
*/}\n {moment().format('mm')}
\n \n {/*
\n }\n\n render() {\n const { startDate, day, style, clockSeparator } = this.props;\n const daysLeft = this.pad(this.calculateNumberOfDaysLeft(startDate).toString());\n const isDayEnabled = day === undefined ? false : day;\n return (\n seconds
*/}\n {moment().format('ss')}
\n - \r\n {this.props.data.map((item, index) => {\r\n return (\r\n
- \r\n \r\n \r\n {item.text}\r\n{item.intAttachmentCount > 0 &&\r\n
{ this.handleClicked(item) }} />} \r\n );\r\n })}\r\n
\r\n {this.props.Icon} \r\n
\r\n );\r\n }\r\n}","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport Cropper from 'cropperjs';\r\n//npm install cropperjs\r\n//import MaterialInput from './MaterialInput';\r\nimport IconButton from '@material-ui/core/IconButton';\r\nimport Icon from '@material-ui/core/Icon';\r\nimport Tooltip from '@material-ui/core/Tooltip';\r\n//import { Row, Col } from 'reactstrap';\r\n\r\nconst optionProps = [\r\n 'dragMode',\r\n 'aspectRatio',\r\n 'data',\r\n 'crop',\r\n // unchangeable props start from here\r\n 'viewMode',\r\n 'preview',\r\n 'responsive',\r\n 'restore',\r\n 'checkCrossOrigin',\r\n 'checkOrientation',\r\n 'modal',\r\n 'guides',\r\n 'center',\r\n 'highlight',\r\n 'background',\r\n 'autoCrop',\r\n 'autoCropArea',\r\n 'movable',\r\n 'rotatable',\r\n 'scalable',\r\n 'zoomable',\r\n 'zoomOnTouch',\r\n 'zoomOnWheel',\r\n 'wheelZoomRation',\r\n 'cropBoxMovable',\r\n 'cropBoxResizable',\r\n 'toggleDragModeOnDblclick',\r\n 'minContainerWidth',\r\n 'minContainerHeight',\r\n 'minCanvasWidth',\r\n 'minCanvasHeight',\r\n 'minCropBoxWidth',\r\n 'minCropBoxHeight',\r\n 'ready',\r\n 'cropstart',\r\n 'cropmove',\r\n 'cropend',\r\n 'zoom',\r\n 'responseType',\r\n];\r\n\r\nconst unchangeableProps = optionProps.slice(4);\r\n\r\nclass ImageEditorRc extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n rotateAngle: 0,\r\n image: '',\r\n degree: 90\r\n };\r\n this.rotateToLeft = this.rotateToLeft.bind(this);\r\n this.rotateToRight = this.rotateToRight.bind(this);\r\n this.crop = this.crop.bind(this);\r\n this.handleChange = this.handleChange.bind(this);\r\n }\r\n componentDidMount() {\r\n const options = Object.keys(this.props)\r\n .filter(propKey => optionProps.indexOf(propKey) !== -1)\r\n .reduce((prevOptions, propKey) =>\r\n Object.assign({}, prevOptions, { [propKey]: this.props[propKey] })\r\n , {});\r\n this.cropper = new Cropper(this.img, options);\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n if (nextProps.src !== this.props.src) {\r\n this.cropper.reset().clear().replace(nextProps.src);\r\n }\r\n if (nextProps.aspectRatio !== this.props.aspectRatio) {\r\n this.setAspectRatio(nextProps.aspectRatio);\r\n }\r\n if (nextProps.data !== this.props.data) {\r\n this.setData(nextProps.data);\r\n }\r\n if (nextProps.dragMode !== this.props.dragMode) {\r\n this.setDragMode(nextProps.dragMode);\r\n }\r\n if (nextProps.cropBoxData !== this.props.cropBoxData) {\r\n this.setCropBoxData(nextProps.cropBoxData);\r\n }\r\n if (nextProps.canvasData !== this.props.canvasData) {\r\n this.setCanvasData(nextProps.canvasData);\r\n }\r\n if (nextProps.moveTo !== this.props.moveTo) {\r\n if (nextProps.moveTo.length > 1) {\r\n this.moveTo(nextProps.moveTo[0], nextProps.moveTo[1]);\r\n } else {\r\n this.moveTo(nextProps.moveTo[0]);\r\n }\r\n }\r\n if (nextProps.zoomTo !== this.props.zoomTo) {\r\n this.zoomTo(nextProps.zoomTo);\r\n }\r\n if (nextProps.scaleX !== this.props.scaleX) {\r\n this.scaleX(nextProps.scaleX);\r\n }\r\n if (nextProps.scaleY !== this.props.scaleY) {\r\n this.scaleY(nextProps.scaleY);\r\n }\r\n if (nextProps.enable !== this.props.enable) {\r\n if (nextProps.enable) {\r\n this.enable();\r\n } else {\r\n this.disable();\r\n }\r\n }\r\n\r\n Object.keys(nextProps).forEach((propKey) => {\r\n let isDifferentVal = nextProps[propKey] !== this.props[propKey];\r\n const isUnchangeableProps = unchangeableProps.indexOf(propKey) !== -1;\r\n\r\n if (typeof nextProps[propKey] === 'function' && typeof this.props[propKey] === 'function') {\r\n isDifferentVal = nextProps[propKey].toString() !== this.props[propKey].toString();\r\n }\r\n\r\n if (isDifferentVal && isUnchangeableProps) {\r\n throw new Error(`prop: ${propKey} can't be change after componentDidMount`);\r\n }\r\n });\r\n }\r\n\r\n componentWillUnmount() {\r\n if (this.img) {\r\n // Destroy the cropper, this makes sure events such as resize are cleaned up and do not leak\r\n this.cropper.destroy();\r\n delete this.img;\r\n delete this.cropper;\r\n }\r\n }\r\n\r\n setDragMode(mode) {\r\n return this.cropper.setDragMode(mode);\r\n }\r\n\r\n setAspectRatio(aspectRatio) {\r\n return this.cropper.setAspectRatio(aspectRatio);\r\n }\r\n\r\n getCroppedCanvas(options) {\r\n return this.cropper.getCroppedCanvas(options);\r\n }\r\n\r\n setCropBoxData(data) {\r\n return this.cropper.setCropBoxData(data);\r\n }\r\n\r\n getCropBoxData() {\r\n return this.cropper.getCropBoxData();\r\n }\r\n\r\n setCanvasData(data) {\r\n return this.cropper.setCanvasData(data);\r\n }\r\n\r\n getCanvasData() {\r\n return this.cropper.getCanvasData();\r\n }\r\n\r\n getImageData() {\r\n return this.cropper.getImageData();\r\n }\r\n\r\n getContainerData() {\r\n return this.cropper.getContainerData();\r\n }\r\n\r\n setData(data) {\r\n return this.cropper.setData(data);\r\n }\r\n\r\n getData(rounded) {\r\n return this.cropper.getData(rounded);\r\n }\r\n\r\n crop(options, cb) {\r\n this.setState({\r\n image: this.cropper.getCroppedCanvas(options),\r\n }, cb);\r\n }\r\n\r\n move(offsetX, offsetY) {\r\n return this.cropper.move(offsetX, offsetY);\r\n }\r\n\r\n moveTo(x, y) {\r\n return this.cropper.moveTo(x, y);\r\n }\r\n\r\n zoom(ratio) {\r\n return this.cropper.zoom(ratio);\r\n }\r\n\r\n zoomTo(ratio) {\r\n return this.cropper.zoomTo(ratio);\r\n }\r\n\r\n rotate(degree) {\r\n return this.cropper.rotate(degree);\r\n }\r\n\r\n rotateToLeft() {\r\n this.setState({ rotateAngle: this.state.rotateAngle - this.state.degree });\r\n return this.cropper.rotateTo(this.state.rotateAngle - this.state.degree);\r\n }\r\n rotateToRight() {\r\n this.setState({ rotateAngle: this.state.rotateAngle + this.state.degree });\r\n return this.cropper.rotateTo(this.state.rotateAngle + this.state.degree);\r\n }\r\n\r\n enable() {\r\n return this.cropper.enable();\r\n }\r\n\r\n disable() {\r\n return this.cropper.disable();\r\n }\r\n\r\n reset() {\r\n return this.cropper.reset();\r\n }\r\n\r\n clear() {\r\n return this.cropper.clear();\r\n }\r\n\r\n replace(url, onlyColorChanged) {\r\n return this.cropper.replace(url, onlyColorChanged);\r\n }\r\n\r\n scale(scaleX, scaleY) {\r\n return this.cropper.scale(scaleX, scaleY);\r\n }\r\n\r\n scaleX(scaleX) {\r\n return this.cropper.scaleX(scaleX);\r\n }\r\n\r\n scaleY(scaleY) {\r\n return this.cropper.scaleY(scaleY);\r\n }\r\n\r\n saveImage() {\r\n switch (this.props.responseType) {\r\n case 'blob':\r\n this.state.image.toBlob(\r\n (blob) => { this.props.saveImage(blob); },\r\n );\r\n break;\r\n case 'base64':\r\n this.props.saveImage(this.state.image.toDataURL());\r\n break;\r\n default:\r\n this.props.saveImage(this.state.image.toDataURL());\r\n }\r\n }\r\n\r\n handleChange(e) {\r\n this.setState({ [e.target.name]: e.target.value });\r\n }\r\n\r\n render() {\r\n const {\r\n src,\r\n alt,\r\n crossOrigin,\r\n } = this.props;\r\n\r\n return (\r\n \r\n میزان چرخش : \r\n
*/}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n Please select an Image for Preview
);\r\n }\r\n\r\n return (\r\n شمال جغرافیایی :{this.state.lat}
\r\n شرق جغرافیایی :{this.state.lng}
\r\n \r\n \r\n \r\n my_location \r\n \r\n \r\n
\r\n \r\n \r\n \r\n delete \r\n \r\n \r\n
\r\n \r\n );\r\n }\r\n}\r\n\r\nconst styles = {\r\n map: {\r\n position: 'relative',\r\n width: '100%',\r\n height: '80vh'\r\n },\r\n currentBtn: {\r\n position: 'absolute',\r\n top: 0,\r\n right: 0,\r\n zIndex: 400\r\n },\r\n resetMarkerBtn: {\r\n position: 'absolute',\r\n top: 0,\r\n right: 50,\r\n zIndex: 400\r\n }\r\n}","import React, { Component } from 'react';\r\nimport { Container, Row, Col } from 'reactstrap';\r\nimport LinearProgress from '@material-ui/core/LinearProgress';\r\nimport CircularProgress from '@material-ui/core/CircularProgress';\r\n//import login from '../../wwwroot/images/login.svg';\r\n\r\nclass Loading extends Component {\r\n static defaultProps = {\r\n title: \"درحال بارگذاری\",\r\n subtitle: \"لطفا منتظر بمانید...\",\r\n titleStyle: { color: '#000' },\r\n subtitleStyle: { color: '#000' }\r\n }\r\n\r\n render() {\r\n return (\r\n {this.props.title}
\r\n{this.props.subtitle}
\r\n\r\n this.setState({ open: true })}\r\n //onClick={() => this.setState({ open: true })}\r\n autoComplete=\"off\"\r\n Icon=\"calendar_today\"\r\n onIconClicked={() => { if (!this.props.disabled) { this.loadDate(); this.setState({ open: true }); } }}\r\n Date\r\n maxLength={10}\r\n disabled={this.props.disabled}\r\n ref={this.props.innerRef}\r\n />\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\nexport default React.forwardRef((props, ref) => \r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nconst styles = {\r\n fieldset: {\r\n position: 'absolute',\r\n top: 0,\r\n bottom: 20,\r\n right: 0,\r\n left: 0,\r\n borderStyle: 'solid',\r\n borderWidth: 1,\r\n borderRadius: 4,\r\n pointerEvents: 'none',\r\n borderColor: '#b9b9b9',\r\n paddingRight: 12\r\n },\r\n inputBox: {\r\n position: 'relative'\r\n },\r\n inputValid: {\r\n fontSize: '12px',\r\n color: '#000',\r\n background: '#fff',\r\n width: '100%',\r\n //height: '44px',\r\n padding: '5px 15px',\r\n marginBottom: '20px',\r\n border: 'none',\r\n //border: '1px solid #b9b9b9',\r\n borderRadius: '3px',\r\n outline: 'none'\r\n },\r\n inputInValid: {\r\n fontSize: '12px',\r\n color: '#000',\r\n background: '#fff',\r\n width: '100%',\r\n //height: '44px',\r\n padding: '5px 15px',\r\n marginBottom: '20px',\r\n border: 'none',\r\n //border: '1px solid #f44336',\r\n borderRadius: '3px',\r\n outline: 'none'\r\n },\r\n label: {\r\n position: 'absolute',\r\n top: '0px',\r\n right: '10px',\r\n padding: '6px 8px',\r\n fontSize: '14px',\r\n color: '#b9b9b9',\r\n //background: '#fff',\r\n pointerEvents: 'none',\r\n transition: '.5s'\r\n },\r\n labelFocused: {\r\n position: 'absolute',\r\n top: '-10px',\r\n right: '15px',\r\n padding: '0px 8px',\r\n fontSize: '12px',\r\n color: '#03a9f4',\r\n //background: '#fff',\r\n pointerEvents: 'none',\r\n transition: '.5s'\r\n },\r\n invalidMsg: {\r\n display: 'block',\r\n color: '#f44336',\r\n position: 'absolute',\r\n top: '35px',\r\n right: '10px',\r\n fontSize: '12px'\r\n },\r\n validMsg: {\r\n display: 'block',\r\n color: '#f44336',\r\n position: 'absolute',\r\n top: '35px',\r\n right: '10px',\r\n fontSize: '12px'\r\n }\r\n};","import React, { Component } from 'react';\r\nimport JSUtil from '../service/JSUtil';\r\nimport MaterialInput from './MaterialInput';\r\nimport './MaterialDropDownS.css';\r\n\r\nclass MaterialDropDownS extends Component {\r\n static defaultProps = {\r\n disabled: false\r\n }\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n data: this.props.data,\r\n filtered: this.props.data,\r\n selectedID: this.props.selectedID,\r\n selectedName: '',\r\n selectedNames: [],\r\n\r\n open: false,\r\n founded: false,\r\n values: [],\r\n valuesWithDetails: [],\r\n loading: false,\r\n HasValue: typeof this.props.HasValue !== 'undefined',\r\n NotEmpty: typeof this.props.NotEmpty !== 'undefined',\r\n Stream: typeof this.props.Stream !== 'undefined',\r\n SmartSearch: typeof this.props.SmartSearch !== 'undefined',\r\n MultiSelect: typeof this.props.MultiSelect !== 'undefined',\r\n };\r\n this.JSUtil = new JSUtil();\r\n this.onInputClick = this.onInputClick.bind(this);\r\n this.onSelect = this.onSelect.bind(this);\r\n this.onChange = this.onChange.bind(this);\r\n this.onBlur = this.onBlur.bind(this);\r\n this.validate = this.validate.bind(this);\r\n this.onKeyDown = this.onKeyDown.bind(this);\r\n this.PreElement = null;\r\n this.element = null;\r\n this.handleClickOutside = this.handleClickOutside.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n if (this.state.selectedID > 0 || this.props.selectedID !== '') {\r\n if (this.props.data.filter(item => item.id == this.props.selectedID)[0]) {\r\n //this.setState({ selectedName: this.props.data.filter(item => item.id == this.props.selectedID)[0].name });\r\n this.LoadValue(\"compdidmount\");\r\n }\r\n }\r\n document.addEventListener('mousedown', this.handleClickOutside);\r\n }\r\n\r\n UNSAFE_componentWillReceiveProps(nextProps) {\r\n if (nextProps.data !== this.props.data || nextProps.selectedID !== this.props.selectedID) {\r\n this.setState({ data: nextProps.data, filtered: nextProps.data, selectedID: nextProps.selectedID/*, selectedName: ''*/ });\r\n if (nextProps.data.length > 0) {\r\n this.setState({ loading: false });\r\n }\r\n if ((!this.state.Stream && nextProps.selectedID > 0) || (!this.state.Stream && nextProps.selectedID !== '')) {\r\n if (nextProps.data.filter(item => item.id == nextProps.selectedID)[0])\r\n this.setState({ selectedName: nextProps.data.filter(item => item.id == nextProps.selectedID)[0].name });\r\n }\r\n }\r\n }\r\n //componentWillReceiveProps(nextProps) {\r\n // this.setState({ data: nextProps.data, filtered: nextProps.data, selectedID: nextProps.selectedID/*, selectedName: ''*/ });\r\n // if (nextProps.data.length > 0) {\r\n // this.setState({ loading: false });\r\n // }\r\n // if ((!this.state.Stream && nextProps.selectedID > 0) || (!this.state.Stream && nextProps.selectedID !== '')) {\r\n // if (nextProps.data.filter(item => item.id == nextProps.selectedID)[0])\r\n // this.setState({ selectedName: nextProps.data.filter(item => item.id == nextProps.selectedID)[0].name });\r\n // }\r\n //}\r\n\r\n componentWillUnmount() {\r\n document.removeEventListener('mousedown', this.handleClickOutside);\r\n }\r\n\r\n //shouldComponentUpdate(nextProps, nextState) {\r\n // if (this.state.selectedName === '') {\r\n // return true;\r\n // }\r\n // else {\r\n // return true;\r\n // }\r\n //}\r\n\r\n validate(name, value, event) {\r\n var result;\r\n if (this.state.HasValue) {\r\n result = this.JSUtil.validation_HasValue(name, value, this.MTInput);\r\n if (!result.success) {\r\n return Promise.reject(result.msg);\r\n }\r\n }\r\n if (this.state.NotEmpty) {\r\n result = this.JSUtil.validation_NotEmpty(name, value, this.MTInput);\r\n if (!result.success) {\r\n return Promise.reject(result.msg);\r\n }\r\n }\r\n return Promise.resolve('');\r\n }\r\n\r\n LoadValue = (name) => {\r\n console.log(\"LoadValue in mdds:\", this.props.data)\r\n console.log(\"LoadValue from:\", name)\r\n if (this.props.data.length > 0)\r\n this.setState({ selectedName: this.props.data.filter(item => item.id == this.props.selectedID)[0].name }, () => {\r\n this.Input = this.wrapperRef.firstElementChild.firstElementChild.nextElementSibling;\r\n this.validate(this.props.name, this.state.selectedName, document).then((res) => {\r\n this.Input.previousElementSibling.style.borderColor = \"#b9b9b9\";\r\n this.Input.nextElementSibling.innerText = \"\";\r\n }, (res) => {\r\n // this.Input.previousElementSibling.style.borderColor = \"#f44336\";\r\n // this.Input.nextElementSibling.innerText = res;\r\n });\r\n })\r\n }\r\n\r\n // LoadElement=()=>{\r\n // console.log(\"loadElement in mdds\")\r\n // for(let item of document.querySelectorAll(\"#item-\" + this.props.name)) {\r\n // console.log(\"item.attributes\")\r\n // console.log([item.attributes.value.value],[this.state.selectedID])\r\n // if (parseInt(item.attributes.value.value) === this.state.selectedID) {\r\n // this.element=item;\r\n // console.log(\"this.element\",this.element)\r\n // if(!this.element.classList.contains('dropDownSelected')){\r\n // this.element.classList.add('dropDownSelected');\r\n // }\r\n // //this.element.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'start' });\r\n // //founded = true;\r\n // console.log('founded = true');\r\n // this.setState({founded:true});\r\n // }\r\n // }\r\n // }\r\n\r\n handleClickOutside(event) {\r\n if (this.wrapperRef && !this.wrapperRef.contains(event.target)) {\r\n this.setState({ open: false });\r\n this.LoadValue(\"handleClickOutside\");\r\n }\r\n }\r\n\r\n onInputClick(e, event) {\r\n if (e === true) {\r\n this.setState({ open: true });\r\n }\r\n if (e === 'semi') {\r\n this.setState({ open: !this.state.open });\r\n }\r\n //this.LoadElement();\r\n }\r\n\r\n onBlur(e) {\r\n this.LoadValue(\"onBlur\");\r\n }\r\n\r\n onFocus = (e) => {\r\n this.setState({ selectedName: \"\" })\r\n }\r\n\r\n onSelect(e) {\r\n console.log(\"this is onchange:\");\r\n var element = document.getElementsByName(this.props.name)[0];\r\n console.log('element:', element);\r\n console.log('element.value:', element.value);\r\n this.validate(this.props.name, element.value, e).then((res) => {\r\n // element.previousElementSibling.style.borderColor = \"#03a9f4\";\r\n // element.nextElementSibling.innerText = \"\";\r\n // this.setState({ Msg: \"\", invalid: false });\r\n }, (res) => {\r\n // element.previousElementSibling.style.borderColor = \"#f44336\";\r\n // element.nextElementSibling.innerText = res;\r\n // this.setState({ Msg: res, invalid: true });\r\n });\r\n\r\n if (this.state.MultiSelect) {\r\n this.setState({ selectedName: \"\", open: false });\r\n this.state.values.push(e.target.attributes.value.value);\r\n this.state.valuesWithDetails.push({ id: e.target.attributes.value.value, name: e.target.innerText });\r\n this.props.onChange(this.props.name, this.state.values, this.state.valuesWithDetails);\r\n }\r\n else {\r\n this.setState({ selectedName: e.target.innerText, open: false });\r\n this.props.onChange(this.props.name, e.target.attributes.value.value);\r\n }\r\n }\r\n\r\n onChange(e) {\r\n var element = e.target;\r\n var and = true;\r\n var string = e.target.value;\r\n if (e.target.value.includes(\"#\")) {\r\n and = false;\r\n string = string.replace('#', '');\r\n }\r\n this.setState({ selectedName: e.target.value.toLowerCase(), selectedNames: string.split(\" \") }, () => {\r\n console.log('selectedName', this.state.selectedName);\r\n if (this.state.Stream) {\r\n if (this.state.selectedName.length >= 3) {\r\n this.setState({ loading: true });\r\n var typingTimer = null;\r\n var doneTypingInterval = 2000;\r\n clearTimeout(typingTimer);\r\n typingTimer = setTimeout(() => {\r\n this.props.updateData(this.state.selectedName);\r\n }, doneTypingInterval);\r\n }\r\n else {\r\n this.setState({ filtered: this.state.data, loading: false });\r\n this.wrapperRef.lastElementChild.style.borderColor = \"#f44336\"\r\n element.previousElementSibling.style.borderColor = \"#f44336\";\r\n element.nextElementSibling.innerText = 'حداقل 3 کاراکتر تایپ کنید';\r\n }\r\n }\r\n else if (this.state.SmartSearch) {\r\n if (this.state.selectedName.length >= 3) {\r\n this.setState({ loading: true });\r\n var typingTimer = null;\r\n var doneTypingInterval = 2000;\r\n clearTimeout(typingTimer);\r\n typingTimer = setTimeout(() => {\r\n if (and) {\r\n var filtered = this.state.data;\r\n let promises = this.state.selectedNames.map((item, index) => {\r\n filtered = filtered.filter(object => object.name.includes(item.toUpperCase()))\r\n if (index + 1 === this.state.selectedNames.length) {\r\n return (\"\");\r\n }\r\n });\r\n Promise.all(promises)\r\n .then(results => {\r\n this.setState({\r\n filtered: filtered,\r\n loading: false\r\n });\r\n })\r\n //.catch(e => {\r\n // console.error(e);\r\n //})\r\n }\r\n else {\r\n var filtered = [];\r\n let promises = this.state.selectedNames.map((item, index) => {\r\n filtered = [...filtered, ...this.state.data.filter(object => object.name.includes(item.toUpperCase()))]\r\n if (index + 1 === this.state.selectedNames.length) {\r\n return (\"\");\r\n }\r\n });\r\n Promise.all(promises)\r\n .then(results => {\r\n console.log('filtered:', filtered.filter((value, index, self) => self.indexOf(value) === index));\r\n this.setState({\r\n filtered: filtered.filter((value, index, self) => self.indexOf(value) === index),\r\n loading: false\r\n });\r\n })\r\n }\r\n this.wrapperRef.lastElementChild.style.borderColor = \"#03a9f4\"\r\n element.previousElementSibling.style.borderColor = \"#03a9f4\";\r\n element.nextElementSibling.innerText = '';\r\n }, doneTypingInterval);\r\n }\r\n else {\r\n this.setState({ filtered: this.state.data, loading: false });\r\n this.wrapperRef.lastElementChild.style.borderColor = \"#f44336\"\r\n element.previousElementSibling.style.borderColor = \"#f44336\";\r\n element.nextElementSibling.innerText = 'حداقل 3 کاراکتر تایپ کنید';\r\n }\r\n }\r\n else {\r\n this.setState({ filtered: this.state.data.filter(item => item.name.includes(this.state.selectedName)) });\r\n }\r\n });\r\n }\r\n\r\n onKeyDown(e) {\r\n var founded = false;\r\n var target = e.target;\r\n var keyCode = e.keyCode;\r\n var shiftKey = e.shiftKey;\r\n\r\n for (let item of document.querySelectorAll(\"#item-\" + this.props.name)) {\r\n if (item === this.element) {\r\n founded = true;\r\n console.log('founded = true');\r\n break;\r\n }\r\n }\r\n\r\n this.setState({ open: true }, (e) => {\r\n if (founded === false) {\r\n this.element = target.nextElementSibling.nextElementSibling.nextElementSibling.nextElementSibling.firstElementChild;\r\n // if(!this.element.classList.contains('dropDownSelected')){\r\n // this.element.classList.add('dropDownSelected');\r\n // }\r\n // this.element.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'start' });\r\n console.log('element after not found:', this.element);\r\n }\r\n if (this.state.filtered.length > 0) {\r\n if (keyCode === DOWN_ARROW_KEY_CODE) {\r\n console.log('DOWN_ARROW_KEY_CODE');\r\n this.PreElement = this.element;\r\n this.element = this.element.nextElementSibling ? this.element.nextElementSibling : this.element;\r\n if (this.PreElement && this.PreElement.classList.contains('dropDownSelected')) {\r\n this.PreElement.classList.remove('dropDownSelected');\r\n }\r\n this.element.classList.add('dropDownSelected');\r\n this.element.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'start' });\r\n // console.log(\"down:\",this.element)\r\n }\r\n if (keyCode === UP_ARROW_KEY_CODE) {\r\n console.log('UP_ARROW_KEY_CODE');\r\n this.PreElement = this.element;\r\n this.element = this.element.previousElementSibling ? this.element.previousElementSibling : this.element;\r\n if (this.PreElement && this.PreElement.classList.contains('dropDownSelected')) {\r\n this.PreElement.classList.remove('dropDownSelected');\r\n }\r\n this.element.classList.add('dropDownSelected');\r\n this.element.scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'start' });\r\n // console.log(\"up:\",this.element)\r\n }\r\n if (keyCode === ENTER_KEY_CODE) {\r\n console.log('ENTER_KEY_CODE');\r\n if (this.element) {\r\n console.log('selected element:', this.element);\r\n if (this.state.MultiSelect) {\r\n this.setState({ selectedName: \"\", open: false });\r\n this.state.values.push(this.element.attributes.value.value);\r\n this.state.valuesWithDetails.push({ id: this.element.attributes.value.value, name: this.element.innerText });\r\n this.props.onChange(this.props.name, this.state.values, this.state.valuesWithDetails);\r\n }\r\n else {\r\n this.setState({ selectedName: this.element.innerText, open: false });\r\n this.props.onChange(this.props.name, this.element.attributes.value.value);\r\n }\r\n }\r\n }\r\n }\r\n if (keyCode === ESCAPE_KEY_CODE) {\r\n console.log('ESCAPE_KEY_CODE');\r\n this.setState({\r\n selectedName: \"\",\r\n filtered: this.state.data\r\n });\r\n }\r\n if (keyCode === Tab_KEY_CODE) {\r\n console.log('Tab_KEY_CODE');\r\n this.setState({ open: false });\r\n\r\n }\r\n if (shiftKey && keyCode === Tab_KEY_CODE) {\r\n console.log('Shift+Tab_KEY_CODE');\r\n this.setState({ open: false });\r\n }\r\n });\r\n }\r\n\r\n render() {\r\n let options = this.state.filtered.slice(0, 20).map((item, index) =>\r\n this.refMsg = ref}>{this.state.Msg}
\r\n \r\n {item.name}
\r\n );\r\n //options.push({this.state.filtered.length} از {this.state.data.length}
);\r\n\r\n return (\r\n this.wrapperRef = node}>\r\n this.onInputClick(true, e)}\r\n onFocus={this.onFocus}\r\n onBlur={this.onBlur}\r\n autoComplete=\"off\"\r\n disabled={this.props.disabled}\r\n Icon={this.state.open === false ? \"arrow_drop_down\" : \"arrow_drop_up\"}\r\n onIconClicked={() => this.onInputClick('semi')}\r\n loading={this.state.loading}\r\n ref={this.props.innerRef}\r\n refs={ref => this.MTInput = ref}\r\n >\r\n {this.state.open &&\r\n \r\n \r\n }\r\n \r\n
\r\n );\r\n }\r\n}\r\n\r\nconst SPACEBAR_KEY_CODE = [0, 32];\r\nconst ENTER_KEY_CODE = 13;\r\nconst DOWN_ARROW_KEY_CODE = 40;\r\nconst UP_ARROW_KEY_CODE = 38;\r\nconst ESCAPE_KEY_CODE = 27;\r\nconst Tab_KEY_CODE = 9;\r\nconst BACKSPACE_KEY_CODE = 8;\r\n\r\nconst styles = {\r\n inputBox: {\r\n position: 'relative'\r\n },\r\n dropdownContent: {\r\n borderColor: '#03a9f4',\r\n display: 'block',\r\n position: 'absolute',\r\n top: 34,\r\n right: 0,\r\n left: 0,\r\n backgroundColor: '#fff',\r\n //minWidth: '230px',\r\n border: '1px solid #b9b9b9',\r\n borderRadius: 4,\r\n borderTop: 'none',\r\n zIndex: 1,\r\n cursor: 'pointer',\r\n height: 200,\r\n overflowY: 'scroll'\r\n },\r\n dropdownContentA: {\r\n color: 'black',\r\n padding: '12px 16px',\r\n textDecoration: 'none',\r\n display: 'block',\r\n '&:hover': {\r\n backgroundColor: '#ddd',\r\n }\r\n },\r\n dropdownDetails: {\r\n color: 'black',\r\n backgroundColor: '#dadada',\r\n padding: '5px 16px',\r\n textDecoration: 'none',\r\n textAlign: 'center',\r\n position: 'absolute',\r\n bottom: -192,\r\n right: 0,\r\n left: 0,\r\n zIndex: 1\r\n }\r\n};\r\n\r\nexport default React.forwardRef((props, ref) => \r\n {options}\r\n
\r\n {this.state.filtered.length} از {this.state.data.length}
\r\n \r\n this.setState({ open: true })}\r\n //onClick={() => this.setState({ open: true })}\r\n autoComplete=\"off\"\r\n Icon=\"access_time\"\r\n onIconClicked={() => { if (!this.props.disabled) { this.LoadTime(); this.setState({ open: true }); } }}\r\n Time\r\n maxLength={5}\r\n disabled={this.props.disabled}\r\n ref={this.props.innerRef}\r\n />\r\n\r\n \r\n \r\n setState({ open: false })}\r\n />\r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\nexport default React.forwardRef((props, ref) => \r\n {this.props.modal === true &&\r\n \r\n \r\n }\r\n
\r\n );\r\n }\r\n}\r\nexport default ModalCustom;\r\n","import React, { Component } from 'react';\r\nimport PropTypes from 'prop-types';\r\n//import \"@material/form-field/dist/mdc.form-field.css\";\r\n//import \"@material/radio/dist/mdc.radio.css\";\r\n\r\nclass Radio extends Component {\r\n static propTypes = {\n name: PropTypes.string.isRequired,\n //value: PropTypes.number,\n //checked: PropTypes.number,\n disabled: PropTypes.bool,\n label: PropTypes.string,\n }\n\n static defaultProps = {\n //value: 1,\n //checked: 0,\n disabled: false,\n label: \"انتخاب کنید\",\n }\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n Id: 0\r\n }\r\n this.onChange = this.onChange.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n this.setState({ Id: Math.floor(Math.random() * 1000) })\r\n }\r\n\r\n onChange(e) {\r\n this.props.onChange(e);\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n {this.props.Header}\r\n
\r\n {this.props.children}
\r\n \r\n {this.props.Footer}\r\n
\r\n \r\n
\r\n );\r\n }\r\n}\r\nexport default Radio;","import React, { Component } from 'react';\r\nimport { Col } from 'reactstrap';\r\n//import \"@material/form-field/dist/mdc.form-field.css\";\r\n//import \"@material/radio/dist/mdc.radio.css\";\r\n\r\nclass RadioGroup extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n data: this.props.data,\r\n name: this.props.name,\r\n selected: this.props.selected,\r\n disabled: this.props.disabled,\r\n Id: 0\r\n };\r\n this.onChange = this.onChange.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n this.setState({ Id: Math.floor(Math.random() * 1000) })\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n this.setState({\r\n data: nextProps.data,\r\n name: nextProps.name,\r\n selected: nextProps.selected,\r\n disabled: nextProps.disabled\r\n });\r\n }\r\n\r\n onChange(e) {\r\n e.target.parentElement.parentElement.parentElement.parentElement.previousElementSibling.style.borderColor = '#03a9f4';\r\n e.target.parentElement.parentElement.parentElement.parentElement.nextElementSibling.innerText = '';\r\n this.props.onChange(e);\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\nconst styles = {\r\n legend: {\r\n width: 70\r\n },\r\n fieldset: {\r\n position: 'absolute',\r\n top: 0,\r\n bottom: 0,\r\n right: 0,\r\n left: 0,\r\n borderStyle: 'solid',\r\n borderWidth: 1,\r\n borderRadius: 4,\r\n pointerEvents: 'none',\r\n borderColor: '#b9b9b9',\r\n paddingRight: 12\r\n },\r\n row: {\r\n display: 'flex',\r\n flexWrap: 'wrap'\r\n },\r\n invalidMsg: {\r\n display: 'block',\r\n color: '#f44336',\r\n position: 'absolute',\r\n bottom: -15,\r\n right: 10,\r\n fontSize: '12px'\r\n },\r\n floatLabel: {\r\n position: 'absolute',\r\n top: -10,\r\n right: 15,\r\n padding: '0px 0px',\r\n fontSize: '12px',\r\n color: '#03a9f4',\r\n pointerEvents: 'none',\r\n transition: '.5s'\r\n }\r\n};\r\nexport default RadioGroup;\r\nRadioGroup.defaultProps = {\r\n md: 4\r\n};","import React, { Component } from 'react';\r\nimport { Col, Row } from 'reactstrap';\r\nimport Icon from '@material-ui/core/Icon';\r\nimport './RadioBoxGroup.css';\r\n\r\nexport default class RadioBoxGroup extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n data: this.props.data,\r\n name: this.props.name,\r\n selected: this.props.selected,\r\n disabled: this.props.disabled,\r\n Id: 0,\r\n Image: false,\r\n Icon: false\r\n };\r\n this.onChange = this.onChange.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n this.setState({\r\n Id: Math.floor(Math.random() * 1000),\r\n Image: typeof this.props.Image !== 'undefined',\r\n Icon: typeof this.props.Icon !== 'undefined'\r\n });\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n this.setState({\r\n data: nextProps.data,\r\n name: nextProps.name,\r\n selected: nextProps.selected,\r\n disabled: nextProps.disabled\r\n });\r\n }\r\n\r\n onChange(e) {\r\n this.props.onChange(e);\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n {this.state.data.map((item, index) => {\r\n return (\r\n
\r\n \r\n
\r\n \r\n );\r\n })}\r\n \r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n this.refMsg = ref}>{this.props.invalidMsg}
\r\n \r\n - \r\n {items.map((value,index) => {\r\n const labelId = `transfer-list-all-item-${value.name}-label`;\r\n\r\n return (\r\n
- \r\n {this.state.data.filter(item => item.refCode === parentCode).map((item,key) => {\r\n return (\r\n
- \r\n \r\n {this.state.hasCheckBox === true &&\r\n \r\n\r\n }\r\n \r\n {this.TreeNode(item.id)}\r\n\r\n \r\n\r\n\r\n \r\n \r\n\r\n \r\n );\r\n })}\r\n
\r\n
\r\n );\r\n }\r\n}\r\nconst styles={\r\n label:{\r\n marginRight:5\r\n }\r\n}","import React, { Component } from 'react';\r\nimport MaterialInput from './MaterialInput';\r\nimport Tree from './Tree';\r\n\r\nclass TreeDropdown extends Component {\r\n static defaultProps = {\r\n name: 'test',\r\n disabled: false,\r\n hasCheckBox: false,\r\n rootNode: 0\r\n }\r\n\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n open: false,\r\n data: this.props.data,\r\n selectedID: this.props.selectedID,\r\n selectedName: this.props.selectedName,\r\n MultiSelect: false,\r\n ShowParents: false\r\n };\r\n this.NodeClick = this.NodeClick.bind(this);\r\n this.dropDownToggler = this.dropDownToggler.bind(this);\r\n this.handleClickOutside = this.handleClickOutside.bind(this);\r\n this.ReturnValue = this.ReturnValue.bind(this);\r\n this.LoadValue = this.LoadValue.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n // console.log('componentDidMountTreeDropdown props',this.props)\r\n document.addEventListener('mousedown', this.handleClickOutside);\r\n this.setState({\r\n MultiSelect: typeof this.props.MultiSelect !== 'undefined',\r\n ShowParents: typeof this.props.ShowParents !== 'undefined',\r\n });\r\n this.LoadValue();\r\n }\r\n\r\n componentWillReceiveProps(nextProps) {\r\n // console.log('componentWillReceivePropsTreeDropdown props',nextProps)\r\n // if (nextProps.data !==this.props.data) {\r\n // this.setState({data:nextProps.data});\r\n // }\r\n // if (nextProps.selectedID !==this.props.selectedID) {\r\n // this.setState({selectedID:nextProps.selectedID},()=>{\r\n // this.LoadValue();\r\n // });\r\n // }\r\n this.setState({ data: nextProps.data, selectedID: nextProps.selectedID }, () => {\r\n this.LoadValue();\r\n });\r\n }\r\n\r\n componentWillUnmount() {\r\n document.removeEventListener('mousedown', this.handleClickOutside);\r\n }\r\n\r\n NodeClick(item, e) {\r\n this.props.onNodeClicked(this.props.name, this.ReturnValue(item));\r\n this.setState({ open: false })\r\n }\r\n\r\n dropDownToggler() {\r\n console.log(document.getElementById(this.props.name))\r\n this.setState({ open: !this.state.open });\r\n }\r\n\r\n handleClickOutside(event) {\r\n if (this.TreeDropdownRef && !this.TreeDropdownRef.contains(event.target)) {\r\n this.setState({ open: false });\r\n }\r\n }\r\n\r\n ReturnValue(item) {\r\n if (this.state.MultiSelect) {\r\n var array = this.str2array(this.state.selectedID === null ? \"\" : this.state.selectedID);\r\n array.push(item.id)\r\n var disticted = [...new Set(array)];\r\n var string = this.array2str(disticted);\r\n return string\r\n }\r\n else {\r\n return item.id\r\n }\r\n }\r\n\r\n LoadValue() {\r\n console.log(\"LoadValue started\")\r\n if (this.state.MultiSelect) {\r\n var array = this.str2array(this.state.selectedID);\r\n var array2 = [];\r\n array.map(item => {\r\n array2.push(this.state.data.filter(obj => obj.id === item).map(obj2 => { return (obj2.name) }))\r\n })\r\n var string = this.array2str(array2);\r\n this.setState({ selectedName: string })\r\n }\r\n else if (this.state.ShowParents && this.state.selectedID !== 0 && this.state.data.length > 0) {\r\n var items = [this.state.selectedID];\r\n var endNode = this.state.selectedID;\r\n var end = false;\r\n while (end === false) {\r\n // console.log(\"end:\",end);\r\n // console.log(\"endNode:\",endNode);\r\n\r\n var item = this.state.data.filter(item => (item.id === endNode))[0].refCode;\r\n endNode = item\r\n items.push(item);\r\n if (item === this.props.rootNode) {\r\n end = true;\r\n }\r\n\r\n // console.log(\"item:\",item);\r\n // console.log(\"items:\",items);\r\n }\r\n // console.log(\"items:\",items);\r\n var selectedName = \"\";\r\n items.reverse().map(item => (\r\n selectedName = selectedName + \"-\" + this.state.data.filter(obj => (obj.id === item)).map(obj => (obj.name))\r\n ))\r\n this.setState({ selectedName: selectedName })\r\n }\r\n else {\r\n this.setState({ selectedName: this.state.data.filter(item => (item.id === this.state.selectedID)).map(item => { return (item.name) }) })\r\n }\r\n }\r\n\r\n str2array(Str) {\r\n console.log(\"Str:\", typeof Str)\r\n var str;\r\n if (Str === null) {\r\n str = \"\";\r\n }\r\n else if (isNaN(Str)) {\r\n str = Str;\r\n }\r\n else {\r\n str = JSON.stringify(Str)\r\n }\r\n var array = str.split(',');\r\n var filtered = array.filter(item => item !== \"\");\r\n var arrInt = filtered.map(item => parseInt(item));\r\n return arrInt;\r\n }\r\n\r\n array2str(Array) {\r\n var array = Array;\r\n var str = array.toString();\r\n return str;\r\n }\r\n\r\n render() {\r\n return (\r\n - \r\n {this.state.data.filter(item => item.refCode === this.props.rootNode).map((item,key) => {\r\n return (\r\n
- \r\n \r\n {this.state.hasCheckBox === true &&\r\n \r\n\r\n }\r\n \r\n {this.TreeNode(item.id)}\r\n\r\n \r\n\r\n\r\n \r\n \r\n\r\n \r\n );\r\n })}\r\n
this.TreeDropdownRef = ref}>\r\n
\r\n );\r\n }\r\n}\r\nconst styles = {\r\n dropdown: {\r\n position: 'relative',\r\n //display: 'inline-block',\r\n },\r\n dropdownContent: {\r\n display: 'block',\r\n position: 'absolute',\r\n top: 55,\r\n backgroundColor: '#ffffff',\r\n minWidth: 280,\r\n overflow: 'auto',\r\n boxShadow: '0px 8px 16px 0px rgba(0,0,0,0.2)',\r\n zIndex: 1,\r\n }\r\n}\r\nexport default React.forwardRef((props, ref) => \r\n
\r\n }\r\n \r\n
\r\n }\r\n {this.props.multiple === true && this.state.list.length > 0 &&\r\n \r\n {this.state.list.map((item, index) => {\r\n return (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n );\r\n })}\r\n \r\n }\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n { this.handleRemove(item); }}>clear \r\n
\r\n this.IconRef = ref}>\r\n \r\n
\r\n )\r\n }\r\n\r\n}\r\nexport default AnimatedIcon;\r\n{/* \r\n {this.props.second}\r\n
\r\n )}\r\n \r\n {this.props.first}\r\n
\r\n )}\r\n \r\n \r\n \r\n \r\n \r\n {this.state.fileprogress>0 &&
\r\n )\r\n }\r\n\r\n}\r\n\r\nexport default withStyles(styles)(UploadButton);","import React, { Component } from 'react';\r\nimport Icon from '@material-ui/core/Icon';\r\nimport PropTypes from 'prop-types';\r\n\r\nexport default class StaticIcon extends Component {\r\n static defaultProps = {\r\n fontSize:\"default\",\r\n style:{\r\n color:'#fff'\r\n },\r\n animationType:'swing'\r\n }\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n ParentHover: typeof this.props.ParentHover !== 'undefined',\r\n ParentClick: typeof this.props.ParentClick !== 'undefined',\r\n Hover: typeof this.props.Hover !== 'undefined',\r\n Click: typeof this.props.Click !== 'undefined',\r\n };\r\n this.onMouseEnter=this.onMouseEnter.bind(this);\r\n this.onMouseLeave=this.onMouseLeave.bind(this);\r\n }\r\n\r\n componentDidMount() {\r\n if(this.state.ParentHover||this.state.ParentClick){\r\n this.IconRef.parentElement.parentElement.addEventListener('mouseenter', this.onMouseEnter);\r\n this.IconRef.parentElement.parentElement.addEventListener('mouseleave', this.onMouseLeave);\r\n }\r\n }\r\n\r\n componentWillUnmount() {\r\n if(this.state.ParentHover||this.state.ParentClick){\r\n this.IconRef.parentElement.parentElement.removeEventListener('mouseenter', this.onMouseEnter);\r\n this.IconRef.parentElement.parentElement.removeEventListener('mouseleave', this.onMouseLeave);\r\n }\r\n }\r\n\r\n onMouseEnter(e){\r\n if(this.state.ParentHover||this.state.Hover){\r\n this.IconRef.classList.add(this.props.animationType);\r\n }\r\n }\r\n\r\n onMouseLeave(e){\r\n if(this.state.ParentHover||this.state.Hover){\r\n this.IconRef.classList.remove(this.props.animationType);\r\n }\r\n }\r\n\r\n onClick=(e)=>{\r\n if(this.state.ParentClick||this.state.Click){\r\n if(this.IconRef.classList.contains(this.props.animationType)){\r\n this.IconRef.classList.remove(this.props.animationType);\r\n }\r\n this.IconRef.classList.add(this.props.animationType);\r\n }\r\n }\r\n\r\n render() {\r\n return (\r\n \r\n
\r\n this.onParentNodeClicked(e, item)}*/>\r\n {item.icon} \r\n this.onNodeClicked(e, item)}>{item.name}\r\n {item.children && expand_more }\r\n
\r\n {item.children && this.child(item.children)}\r\n this.onParentNodeClicked(e, item)}*/>\r\n {item.icon} \r\n this.onNodeClicked(e, item)}>{item.name}\r\n {item.children && expand_more }\r\n
\r\n {item.children && this.child(item.children)}\r\n - \r\n {data.map((item, index) => {\r\n return (\r\n \r\n
- \r\n