\r\n \r\n this.filterChange(\"DateFrom\", e)}\r\n />\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n \r\n this.filterChange(\"DateTo\", e)}\r\n />\r\n
\r\n \r\n \r\n this.filterChange(\"FromCost\", e)}\r\n size={\"small\"}\r\n fullWidth\r\n />\r\n
\r\n\r\n \r\n \r\n \r\n this.filterChange(\"ToCost\", e)}\r\n />\r\n
\r\n \r\n \r\n this.onChangePageProfile(data)}/>\r\n
\r\n );\r\n };\r\n\r\n renderInfo = e => {\r\n const { data } = e.row;\r\n const { classes } = this.props;\r\n return (\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n {data.DepartmentName || \"\"}\r\n
\r\n \r\n
\r\n \r\n {data.ProposalDate && date}\r\n
\r\n \r\n
\r\n );\r\n };\r\n\r\n renderStatus = e => {\r\n const { data } = e.row;\r\n let statusName = \"\";\r\n let key = \"\";\r\n if(Number(data.StatusRegisterEX) === 0) {\r\n key = data.AppStatusID;\r\n statusName = data.AppStatusName;\r\n }\r\n if(Number(data.StatusRegisterEX) !== 0) {\r\n key = data.AppStatusExID;\r\n statusName = data.AppStatusExName;\r\n }\r\n let status = {\r\n AppStatusID: key,\r\n AppStatusName: statusName\r\n };\r\n return (\r\n \r\n {Config.lang(\"Ma\")}:{data.BusinessTravelCode || \"\"}\r\n
\r\n {!isNaN(data.PlanAmount) && +data.PlanAmount >=0 && (\r\n \r\n {Config.lang(\"Tong_chi_phi_du_kien\")}: { new Intl.NumberFormat().format(data.PlanAmount) + ' đ'}\r\n
\r\n )}\r\n {\r\n (data.StatusRegisterEX === 1 || data.StatusRegisterEX === 2) &&\r\n !isNaN(data.ActualAmount) && +data.ActualAmount >=0 && (\r\n \r\n {Config.lang(\"Tong_chi_phi\")}: { new Intl.NumberFormat().format(data.ActualAmount) + ' đ'}\r\n
\r\n )\r\n }\r\n\r\n {!isNaN(data.ProAmountVND) && +data.ProAmountVND >=0 && (\r\n \r\n {Config.lang(\"Tam_ung\")}: {new Intl.NumberFormat().format(data.ProAmountVND) + ' đ'}\r\n { data.StatusRegisterEX === 1 &&
\r\n )}\r\n {data.Reimburse && data.StatusRegisterEX === 2 && (\r\n \r\n {Config.lang(\"Quyet_Toan\")}: { new Intl.NumberFormat().format(Math.abs(data.Reimburse)) + ' đ' || \"\"}\r\n
\r\n )\r\n }\r\n {data.BusinessLocation && (\r\n \r\n {Config.lang(\"Dia_diem\")}: { data.BusinessLocation || \"\"}\r\n
\r\n )}\r\n {data.BTApproverName && (\r\n \r\n {Config.lang(\"Duyet_cong_tac\")}: {data.BTApproverName || \"\"} - {data.DepartmentIDBTApp || \"\"} - {moment.utc(data.BTAppDate).format( \"DD/MM/YYYY\") || \"\"}\r\n
\r\n )}\r\n {data.EXApproverName && data.StatusRegisterEX > 0 && (\r\n \r\n {Config.lang(\"Duyet_quyet_toan_chi_phi\")}: {data.EXApproverName || \"\"} - {data.DepartmentIDEXApp || \"\"} - {moment.utc(data.EXAppDate).format( \"DD/MM/YYYY\") || \"\"}\r\n
\r\n )}\r\n \r\n this.goToPageW77F1013(e)}\r\n />\r\n this.onEdit(e)}\r\n />\r\n this.onDelete(data)}\r\n />\r\n
\r\n );\r\n };\r\n\r\n render() {\r\n const { skip, limit } = this.filter;\r\n const { gridLoading, iPermission, dataGrid, totalDataGrid } = this.state;\r\n if (!iPermission) return null;\r\n return (\r\n <>\r\n {this.renderFilter()}
\r\n \r\n\r\n \r\n {Config.lang(\"DHR_Thong_tin_chung\")}\r\n \r\n
\r\n \r\n {`${item?.EmployeeID} - ${item?.EmployeeName}`}\r\n
\r\n );\r\n }}\r\n value={Employee?.EmployeeID}\r\n disabled={!(iPermission > 2) || disabled || !!voucherID }\r\n label={Config.lang(\"Nhan_vien\")}\r\n inputProps={{\r\n readOnly: disabled,\r\n }}\r\n iconExpr={{\r\n key: \"UserPictureURL\",\r\n prefix: Config.getCDNPath(),\r\n }}\r\n onChange={(e) => this.handleChange(\"EmployeeID\", e)}\r\n onInput={(e) => {\r\n this.filterCboEmployees.skip = 0;\r\n this.filterCboEmployees.strSearch = e.target.value;\r\n this.loadCboEmployees(true);\r\n }}\r\n onLoadMore={(e) => {\r\n this.filterCboEmployees.skip = e.skip;\r\n this.filterCboEmployees.limit = e.limit;\r\n this.loadCboEmployees();\r\n }}\r\n />\r\n \r\n \r\n \r\n {Config.lang(\"DHR_Khoan_chi_phi_du_kien\")} \r\n \r\n
\r\n\r\n \r\n \r\n {Config.lang(\"DHR_Nhat_ky_cong_tac\")} \r\n \r\n
\r\n \r\n {\r\n !e.row.isEditing || !this.addGrid ? (\r\n e.component.deleteRow(e.rowIndex)}\r\n >\r\n e.component.saveEditData()}\r\n >\r\n \r\n \r\n e.component.cancelEditData()}\r\n >\r\n \r\n \r\n \r\n )\r\n }\r\n
\r\n );\r\n };\r\n\r\n renderDisabled = (e) => {\r\n const {classes} = this.props;\r\n return (\r\n \r\n {\r\n gridRef && gridRef(ref);\r\n this.dataGrid = ref;\r\n }}\r\n columnAutoWidth={true}\r\n dataSource={dataCostWorkPlans}\r\n keyExpr={\"RecCostID\"}\r\n elementAttr={{\r\n style: \"min-height: 200px\"\r\n }}\r\n style={{width: \"100%\"}}\r\n editing={{\r\n mode: 'cell',\r\n refreshMode: \"reshape\",\r\n allowUpdating: true,\r\n texts: {\r\n confirmDeleteMessage: \"\"\r\n }\r\n }}\r\n // filterRow={{\r\n // visible: true,\r\n // showOperationChooser: false,\r\n // }}\r\n pagerFullScreen={false}\r\n hoverStateEnabled={true}\r\n typeShort={true}\r\n allowColumnResizing={true}\r\n onInitNewRow={() => {\r\n this.addGrid = true;\r\n }}\r\n onCellClick={this.onCellClick}\r\n onRowInserted={() => {\r\n this.addGrid = false;\r\n this.getDataTotal();\r\n }}\r\n onRowInserting={e => {\r\n if (this.isAdding) {\r\n e.cancel = true;\r\n this.isInserting = true;\r\n }\r\n }}\r\n onEditingStart={(e) => {\r\n // const {data} = e;\r\n // this.keyInserting = data[\"__KEY__\"];\r\n this.fieldUpdating = e.column.dataField;\r\n }}\r\n onRowUpdating={(e) => {\r\n this.isAdding = true;\r\n this.isInserting = true;\r\n this.onConvertibleValueCurrentcies(e)\r\n }}\r\n onRowUpdated={this.getDataTotal}\r\n >\r\n \r\n \r\n {\r\n this.addGrid && this.onChange(e, \"AmountVND\");\r\n }\r\n }}\r\n />\r\n {\r\n this.addGrid && this.onChange(e, \"AmountUSD\");\r\n }\r\n }}\r\n />\r\n\r\n {Number(IsUseForeignCurrency) === 1 && Number(IsDomestic) === 1 &&\r\n {\r\n const {data} = e;\r\n return {\r\n const currency = getLoadCurrency.find(c => c.CurrencyID === lk.value);\r\n if (currency) {\r\n e.setValue(currency.CurrencyName);\r\n e.component.cellValue(e.rowIndex, \"CurrencyID\", currency.CurrencyID);\r\n e.component.cellValue(e.rowIndex, \"ExchangeRate\", currency.ExchangeRate);\r\n if (this.addGrid) this.onChange(currency.CurrencyID,\"CurrencyID\");\r\n }\r\n }}\r\n />;\r\n }}\r\n />\r\n }\r\n\r\n {Number(IsUseForeignCurrency) === 1 && Number(IsDomestic) === 1 &&\r\n {\r\n this.addGrid && this.onChange(e, \"ForeignCurrency\");\r\n }\r\n }}\r\n />\r\n }\r\n\r\n {\r\n return {\r\n e.component.cellValue(e.rowIndex, \"IsCompanyPay\", chk.target.checked ? 1 : 0);\r\n }}\r\n />\r\n }}\r\n />\r\n \r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\nW77F1011TableInfo.propTypes = {\r\n gridRef: PropTypes.func,\r\n IsDomestic: PropTypes.number,\r\n dataCostWorkPlans: PropTypes.array,\r\n getCboCostTypes: PropTypes.array,\r\n getConvertibleValueCurrentcies: PropTypes.func,\r\n getFieldHide: PropTypes.any,\r\n getLoadCurrency: PropTypes.array,\r\n};\r\n\r\n\r\nexport default withStyles(styles)(W77F1011TableInfo) ;","import React, {Component} from 'react';\r\nimport GridContainer from \"../../../grid-container/grid-container\";\r\nimport Config from \"../../../../config\";\r\nimport {Column} from \"devextreme-react/data-grid\";\r\nimport PropTypes from \"prop-types\";\r\nimport UndoIcon from '@material-ui/icons/Undo';\r\nimport IconButton from \"@material-ui/core/IconButton\";\r\nimport Icons from \"../../../common/icons\";\r\n\r\nclass W77F1011TableContent extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.dataGrid = null;\r\n }\r\n\r\n renderButtons = (e) => {\r\n return (\r\n \r\n {\r\n !e.row.isEditing ?\r\n e.component.deleteRow(e.rowIndex)}\r\n >\r\n e.component.saveEditData()}\r\n >\r\n \r\n \r\n e.component.cancelEditData()}\r\n >\r\n \r\n \r\n \r\n }\r\n
\r\n );\r\n };\r\n\r\n render() {\r\n const {gridRef, dataWorkingDiary} = this.props;\r\n return (\r\n \r\n {\r\n gridRef && gridRef(ref);\r\n this.dataGrid = ref;\r\n }}\r\n columnAutoWidth={true}\r\n dataSource={dataWorkingDiary.map((item, idx) => ({ ...item, keyExpr: idx }))}\r\n keyExpr={\"keyExpr\"}\r\n editing={{\r\n mode: 'cell',\r\n refreshMode: \"reshape\",\r\n // allowAdding: true,\r\n allowUpdating: true,\r\n texts: {\r\n confirmDeleteMessage: \"\"\r\n },\r\n }}\r\n // filterRow={{\r\n // visible: true,\r\n // showOperationChooser: false,\r\n // }}\r\n hoverStateEnabled={true}\r\n typeShort={true}\r\n allowColumnResizing={true}\r\n >\r\n
\r\n );\r\n }\r\n}\r\nW77F1011TableContent.propsTypes = {\r\n gridRef: PropTypes.func,\r\n dataWorkingDiary: PropTypes.any\r\n};\r\n\r\n\r\nexport default W77F1011TableContent;","/**\r\n * @copyright 2019 @ DigiNet\r\n * @author NAMDANG\r\n * @create 8/21/2020\r\n * @Example\r\n */\r\nimport React, {Component} from \"react\";\r\nimport {connect} from \"react-redux\";\r\nimport {bindActionCreators, compose} from \"redux\";\r\nimport withStyles from \"@material-ui/core/styles/withStyles\";\r\nimport * as generalActions from \"../../../../redux/general/general_actions\";\r\nimport Config from \"../../../../config\";\r\nimport ActionToolbar from \"../../../common/toolbar/action-toolbar\";\r\nimport {Col, Row, FormGroup, Image} from \"react-bootstrap\";\r\nimport ButtonGeneral from \"../../../common/button/button-general\";\r\nimport moment from 'moment';\r\nimport {\r\n ExpansionPanel,\r\n ExpansionPanelDetails,\r\n ExpansionPanelSummary,\r\n Typography\r\n} from \"@material-ui/core\";\r\nimport Attachments from \"../../../common/attachments/attachments\";\r\nimport _ from \"lodash\";\r\nimport {browserHistory} from \"react-router\";\r\nimport IconButton from \"@material-ui/core/IconButton\";\r\nimport Icons from \"../../../common/icons\";\r\nimport * as W77F1013Actions from \"../../../../redux/W7X/W77F1013/W77F1013_actions\";\r\nimport W77F1013TableCostView from \"./W77F1013TableCostView\";\r\nimport W77F1013TableAllocation from \"./W77F1013TableAllocation\";\r\nimport W77F1013TableRecCost from \"./W77F1013TableRecCost\";\r\nimport UserImage from \"../../../common/user/user-image\";\r\nimport UserName from \"../../../common/user/user-name\";\r\nconst styles = theme => {\r\n return {\r\n heading: {\r\n fontSize: 14,\r\n fontWeight: 'bold',\r\n marginRight: 5\r\n },\r\n noneBorder: {\r\n margin:'0px!important',\r\n \"&:before\": {\r\n backgroundColor: \"transparent\"\r\n }\r\n },\r\n ExpansionPanelSummary: {\r\n padding: 0,\r\n maxWidth: 300,\r\n color: theme.palette.primary.main,\r\n \"& .MuiExpansionPanelSummary-content\": {\r\n margin: \"12px 0\"\r\n },\r\n \"&.Mui-expanded\": {\r\n minHeight: \"inherit\",\r\n },\r\n\r\n },\r\n dateInfo: {\r\n display: \"flex\",\r\n alignItems: \"center\"\r\n },\r\n divText: {\r\n fontSize: \"14px\",\r\n fontWeight: 400,\r\n color: \"#575757\",\r\n whiteSpace: 'pre-line'\r\n },\r\n divDateText: {\r\n fontSize: \"14px\",\r\n fontWeight: 400,\r\n color: \"#000000\"\r\n },\r\n labelTotal: {\r\n margin: 0,\r\n fontWeight: 500,\r\n fontSize: 14,\r\n }\r\n };\r\n};\r\n\r\nclass W77F1013 extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n dataCboProjects: {\r\n rows: [],\r\n total: 0\r\n },\r\n dataTotal:0,\r\n dataHide: [],\r\n iPermission: 0,\r\n error: {},\r\n modeTableRestCost: \"\",\r\n modeTableCostAllocation: \"\",\r\n loadingProjects: false,\r\n expandedFirst: false,\r\n expandedSecond: false,\r\n expandedThird: false,\r\n count: null,\r\n isSave: false,\r\n disabled: false,\r\n dataCostWorkPlansZero: [],\r\n dataCostWorkPlansOne: [],\r\n dataWorkingDiary: [],\r\n disableGridInfo: false,\r\n TotalAmountVND: 0,\r\n TotalAmountUSD: 0,\r\n dataTotalAllocation: 0,\r\n ReimburseVND: 0,\r\n ReimburseUSD: 0,\r\n totalCompanyPay: {\r\n VND: 0,\r\n USD: 0\r\n },\r\n employeePay : {\r\n VND: 0,\r\n USD: 0\r\n },\r\n formData: {\r\n Employee: null,\r\n FromDate: null,\r\n ToDate: null,\r\n BusinessTravelCode: \"\",\r\n BusinessLocation: \"\",\r\n IsDomestic: 0,\r\n Content: \"\",\r\n ProAmountVND: 0,\r\n ProAmountUSD: 0,\r\n ProDateAdvance: \"\",\r\n Reason: \"\"\r\n },\r\n dataOldAttachments: [],\r\n uploading: false,\r\n formLoading: false,\r\n };\r\n\r\n this.attachments = [];\r\n this.deletedFile = [];\r\n this.upload = null;\r\n this.dataGridTableRestCost = null;\r\n this.dataGridTableCostAllocation = null;\r\n }\r\n\r\n setLoading = (key, status = false) => {\r\n if (!key) return;\r\n this.setState({['loading' + key]: status});\r\n\r\n };\r\n\r\n _getAttachments = () => {\r\n const listAttachments = Config.helpers.getFileInfomations(this.attachments);\r\n const { dataOldAttachments } = this.state;\r\n let arrAttachment = [];\r\n listAttachments.forEach(att => {\r\n arrAttachment.push({\r\n URL: att.url ? att.url : \"\",\r\n FileName: att.fileName ? att.fileName : \"\",\r\n FileSize: att.fileSize ? att.fileSize : \"\",\r\n FileExt: att.fileExt ? att.fileExt : \"\"\r\n });\r\n });\r\n if (!_.isEmpty(dataOldAttachments)) {\r\n arrAttachment = dataOldAttachments.concat(arrAttachment);\r\n }\r\n\r\n return arrAttachment;\r\n };\r\n\r\n onAttachment = () => {\r\n if (this.attRef) {\r\n this.attRef.onAttachment();\r\n }\r\n };\r\n\r\n onUploading = value => {\r\n this.setState({ uploading: value });\r\n };\r\n\r\n onChangeAttachments = e => {\r\n this.attachments = e.uploadedFiles ? e.uploadedFiles : [];\r\n if (e.deletedFiles && e.deletedFiles.length > 0) {\r\n this.deletedFile = [...e.deletedFiles];\r\n const _arrRemove = this.deletedFile.map(d => d.AttachmentID);\r\n this.setState(prevState => ({\r\n dataOldAttachments: prevState.dataOldAttachments.filter(att => {\r\n return _arrRemove.indexOf(att.AttachmentID) < 0;\r\n })\r\n }));\r\n }\r\n };\r\n\r\n loadAttachments = () => {\r\n const { TransID } = this.getInfo();\r\n const param = {\r\n KeyID: TransID ? TransID : \"\",\r\n TableName: \"D15T2051\"\r\n };\r\n if (_.isEmpty(param.KeyID)) {\r\n Config.popup.show(\"ERROR\", Config.lang(\"DHR_KeyID_dang_rong_hoac_thieu_khong_the_tai_danh_sach_dinh_kem\"));\r\n return false;\r\n }\r\n this.props.generalActions.getAttachmentsByTransID(param, (error, data) => {\r\n if (error) {\r\n let message = error.message || Config.lang(\"DHR_Loi_chua_xac_dinh\");\r\n Config.popup.show(\"ERROR\", message);\r\n return false;\r\n }\r\n if (data) {\r\n this.setState({\r\n dataOldAttachments: data,\r\n });\r\n }\r\n });\r\n };\r\n\r\n setStateErrorText = (value) => {\r\n const { error } = this.state;\r\n this.setState({\r\n error: {\r\n ...error,\r\n ...value\r\n }\r\n });\r\n return Object.keys(value).length !== 0;\r\n };\r\n\r\n onSave = () => {\r\n const { data } = this.getInfo();\r\n let arrRestCost = [];\r\n let arrCostAllocation = [];\r\n\r\n if (this.dataGridTableRestCost) {\r\n this.dataGridTableRestCost.instance.saveEditData();\r\n let dataRestCost = this.dataGridTableRestCost.instance.option(\"dataSource\");\r\n dataRestCost.forEach(item => {\r\n dataRestCost = {\r\n RecCostID: item.RecCostID,\r\n AmountVND: item.AmountVND,\r\n AmountUSD: item.AmountUSD,\r\n IsCompanyPay: item.IsCompanyPay,\r\n Note: item.Note\r\n };\r\n arrRestCost.push(dataRestCost)\r\n })\r\n\r\n }\r\n if (this.dataGridTableCostAllocation) {\r\n this.dataGridTableCostAllocation.instance.saveEditData();\r\n let dataCostAllocation = this.dataGridTableCostAllocation.instance.option(\"dataSource\");\r\n dataCostAllocation.forEach(item => {\r\n dataCostAllocation = {\r\n AllocationID: item.ProjectID,\r\n Amount: item.Amount,\r\n Note: item.Note,\r\n };\r\n arrCostAllocation.push(dataCostAllocation)\r\n })\r\n }\r\n const { location } = this.props;\r\n const TransID = _.get(location, \"state.TransID\", \"\");\r\n\r\n const arrAttachments = this._getAttachments();\r\n let params = {\r\n TransID: TransID ? TransID : \"\",\r\n FormID: \"W77F1013\",\r\n ModuleID: \"D77\",\r\n Language: Config.language || 84,\r\n TransTypeID: \"\",\r\n Mode: data?.StatusRegisterEX === 1 ? 1 : 0,\r\n StatusApproval: 0,\r\n ApprovalLevel: 1,\r\n TransactionID: \"W77DKQTCP\",\r\n costs: arrRestCost ? JSON.stringify(arrRestCost) : \"\",\r\n diaries: arrCostAllocation ? JSON.stringify(arrCostAllocation) : \"\",\r\n arrAttachment: arrAttachments ? JSON.stringify(arrAttachments) : \"\"\r\n };\r\n this.setState({ formLoading: true });\r\n this.props.w77F1013Actions.add(params, (errors, data) => {\r\n this.setState({ formLoading: false });\r\n if (errors) {\r\n let message = errors.message || Config.lang(\"DHR_Loi_chua_xac_dinh\");\r\n Config.popup.show('ERROR', message);\r\n return false;\r\n }\r\n if (data.Status === 1) {\r\n const msg = data.Message || Config.lang(\"DHR_Loi_chua_xac_dinh\");\r\n Config.popup.show('ERROR', msg);\r\n return false;\r\n } else {\r\n Config.notify.show(\"success\", Config.lang(\"DHR_Luu_thanh_cong\"), 2000);\r\n this.setState({isSave: true});\r\n }\r\n\r\n });\r\n };\r\n\r\n getInfo = (flag, nextProps) => {\r\n const { location } = nextProps ? nextProps : this.props;\r\n const { data,mode } = this.props;\r\n if (location && location.state) {\r\n const voucher_id = location.state.voucher_id ? location.state.voucher_id : \"\";\r\n return {\r\n voucherID: voucher_id,\r\n mode: location.state.mode ? location.state.mode : (voucher_id ? 'edit' : 'add'),\r\n isPermissionForm: location.state.isPermissionForm ? location.state.isPermissionForm : \"\",\r\n TransID: location.state.TransID ? location.state.TransID : \"\",\r\n data: location.state.data ? location.state.data : \"\",\r\n }\r\n } else {\r\n if(data) {\r\n return {\r\n mode: mode,\r\n TransID: data?.TransID ?? \"\",\r\n }\r\n }\r\n else if (flag) {\r\n browserHistory.push(Config.getRootPath() + \"W77F1010\");\r\n return null;\r\n }\r\n return false;\r\n }\r\n };\r\n\r\n loadCboCostTypes = () => {\r\n this.props.w77F1013Actions.getCboCostTypes(error => {\r\n if (error) {\r\n let message = error.message || Config.lang(\"DHR_Loi_chua_xac_dinh\");\r\n Config.popup.show(\"ERROR\", message);\r\n return false;\r\n }\r\n });\r\n };\r\n\r\n loadFieldHide = () => {\r\n const params = {\r\n DivisionID: Config.getDivisionID(),\r\n FormID: \"W77F1013\"\r\n };\r\n\r\n this.props.w77F1013Actions.getFieldHide(params,error => {\r\n if (error) {\r\n let message = error.message || Config.lang(\"DHR_Loi_chua_xac_dinh\");\r\n Config.popup.show(\"ERROR\", message);\r\n return false;\r\n }\r\n });\r\n };\r\n\r\n loadInfoBusinessTrips = () => {\r\n const { TransID, voucherID } = this.getInfo();\r\n const params = {\r\n DivisionID: Config.getDivisionID(),\r\n FormID: \"W77F1013\",\r\n TransID: TransID ? TransID : voucherID,\r\n Language: Config.language || 84\r\n };\r\n\r\n this.props.w77F1013Actions.getInfoBusinessTrips(params,(error, data) => {\r\n if (error) {\r\n let message = error.message || Config.lang(\"DHR_Loi_chua_xac_dinh\");\r\n Config.popup.show(\"ERROR\", message);\r\n return false;\r\n }\r\n if(data) {\r\n this.setState({formData: {\r\n ...this.state.formData,\r\n Employee: data.EmployeeID,\r\n FromDate: data.FromDate,\r\n ToDate: data.ToDate,\r\n BusinessTravelCode: data.BusinessTravelCode,\r\n BusinessLocation: data.BusinessLocation,\r\n IsDomestic: data.IsDomestic,\r\n Content: data.Content,\r\n ProAmountVND: data.ProAmountVND,\r\n ProAmountUSD: data.ProAmountUSD,\r\n ProDateAdvance: data.ProDateAdvance,\r\n Reason: data.Reason\r\n }});\r\n }\r\n });\r\n };\r\n\r\n loadCostWorkPlansZero = () => {\r\n const { TransID, voucherID } = this.getInfo();\r\n const params = {\r\n DivisionID: Config.getDivisionID(),\r\n FormID: \"W77F1013\",\r\n Mode: 0,\r\n TransID: TransID ? TransID : voucherID,\r\n Language: Config.language || 84\r\n };\r\n\r\n this.props.w77F1013Actions.getCostWorkPlansZero(params,(error, data) => {\r\n if (error) {\r\n let message = error.message || Config.lang(\"DHR_Loi_chua_xac_dinh\");\r\n Config.popup.show(\"ERROR\", message);\r\n return false;\r\n }\r\n if(data) {\r\n this.setState({dataCostWorkPlansZero: data});\r\n }\r\n });\r\n };\r\n\r\n loadCostWorkPlansOne = () => {\r\n const { TransID, voucherID } = this.getInfo();\r\n const params = {\r\n DivisionID: Config.getDivisionID(),\r\n FormID: \"W77F1013\",\r\n Mode: 1,\r\n TransID: TransID ? TransID : voucherID,\r\n Language: Config.language || 84\r\n };\r\n\r\n this.props.w77F1013Actions.getCostWorkPlansOne(params,(error, data) => {\r\n if (error) {\r\n let message = error.message || Config.lang(\"DHR_Loi_chua_xac_dinh\");\r\n Config.popup.show(\"ERROR\", message);\r\n return false;\r\n }\r\n if(data) {\r\n let totalCompanyPayVND = 0;\r\n let totalCompanyPayUSD = 0;\r\n let TotalAmountVND = 0;\r\n let TotalAmountUSD = 0;\r\n let EmployeePayVND = 0;\r\n let EmployeePayUSD = 0;\r\n data.forEach(item => {\r\n TotalAmountVND += (item.AmountVND || 0);\r\n TotalAmountUSD += (item.AmountUSD || 0);\r\n if (item.IsCompanyPay) {\r\n totalCompanyPayVND += (item.AmountVND || 0);\r\n totalCompanyPayUSD += (item.AmountUSD || 0);\r\n }\r\n else {\r\n EmployeePayVND += (item.AmountVND || 0);\r\n EmployeePayUSD += (item.AmountUSD || 0);\r\n }\r\n });\r\n\r\n this.setState({TotalAmountVND:TotalAmountVND,TotalAmountUSD:TotalAmountUSD,totalCompanyPay: {VND: totalCompanyPayVND, USD: totalCompanyPayUSD}, employeePay: {VND: EmployeePayVND, USD: EmployeePayUSD}, dataCostWorkPlansOne: data},() => {\r\n const {TotalAmountVND, TotalAmountUSD, totalCompanyPay, formData} = this.state;\r\n const { ProAmountVND, ProAmountUSD } = formData;\r\n let ReimburseVND = 0;\r\n let ReimburseUSD = 0;\r\n ReimburseVND = TotalAmountVND - totalCompanyPay.VND - ProAmountVND;\r\n ReimburseUSD = TotalAmountUSD - totalCompanyPay.USD - ProAmountUSD;\r\n this.setState({ReimburseVND:ReimburseVND,ReimburseUSD:ReimburseUSD});\r\n });\r\n }\r\n });\r\n };\r\n\r\n loadGetWorkingDiary = () => {\r\n const { TransID, voucherID } = this.getInfo();\r\n const params = {\r\n DivisionID: Config.getDivisionID(),\r\n FormID: \"W77F1013\",\r\n TransID: TransID ? TransID : voucherID,\r\n Language: Config.language || 84\r\n };\r\n\r\n this.props.w77F1013Actions.getWorkingDiary(params,(error, data) => {\r\n if (error) {\r\n let message = error.message || Config.lang(\"DHR_Loi_chua_xac_dinh\");\r\n Config.popup.show(\"ERROR\", message);\r\n return false;\r\n }\r\n if(data) {\r\n this.setState({dataWorkingDiary: data});\r\n }\r\n });\r\n };\r\n\r\n loadCostAllocation = () => {\r\n const { TransID, voucherID } = this.getInfo();\r\n const params = {\r\n DivisionID: Config.getDivisionID(),\r\n FormID: \"W77F1013\",\r\n TransID: TransID ? TransID : voucherID,\r\n Language: Config.language || 84\r\n };\r\n\r\n this.props.w77F1013Actions.getCostAllocation(params,(error, data) => {\r\n if (error) {\r\n let message = error.message || Config.lang(\"DHR_Loi_chua_xac_dinh\");\r\n Config.popup.show(\"ERROR\", message);\r\n return false;\r\n }\r\n if(data) {\r\n this.setState({dataCostAllocation: data});\r\n }\r\n });\r\n };\r\n\r\n loadConvertibleValueCurrentcies = (data, cb) => {\r\n const params = {\r\n DivisionID: Config.getDivisionID(),\r\n Mode: data ? data.Mode : 0,\r\n CurrencyID: data ? data.CurrencyID : \"\",\r\n Amount: data ? data.Amount : 0\r\n };\r\n this.props.w77F1013Actions.getConvertibleValueCurrentcies(params,(error, data) => {\r\n if (error) {\r\n let message = error.message || Config.lang(\"DHR_Loi_chua_xac_dinh\");\r\n Config.popup.show(\"ERROR\", message);\r\n return false;\r\n }\r\n if(data) {\r\n cb && cb(error, data);\r\n }\r\n\r\n });\r\n };\r\n\r\n componentDidMount = () => {\r\n if (!this.getInfo(true)) return;\r\n const { data } = this.getInfo();\r\n if(data && data.AppStatusExID > 0) {\r\n this.setState({disabled: true})\r\n }\r\n this.loadInfoBusinessTrips();\r\n this.loadCostWorkPlansZero();\r\n this.loadCostWorkPlansOne();\r\n this.loadGetWorkingDiary();\r\n this.loadAttachments();\r\n this.loadCostAllocation();\r\n this.loadCboCostTypes();\r\n this.loadFieldHide();\r\n };\r\n\r\n onBack = () => {\r\n browserHistory.push(Config.getRootPath() + \"W77F1010\");\r\n };\r\n\r\n onAddNewTableCostAllocation = () => {\r\n this.setState({modeTableCostAllocation: \"add\", expandedThird: true}, () => {\r\n setTimeout(() => {\r\n if (this.dataGridTableCostAllocation) {\r\n this.dataGridTableCostAllocation.instance.addRow();\r\n }\r\n }, 300);\r\n });\r\n };\r\n\r\n onAddNewTableRestCost = () => {\r\n this.setState({modeTableRestCost: \"add\", expandedSecond: true}, () => {\r\n setTimeout(() => {\r\n if (this.dataGridTableRestCost) {\r\n this.dataGridTableRestCost.instance.addRow();\r\n }\r\n }, 300);\r\n });\r\n };\r\n\r\n scrollTopButton = () => {\r\n window.scrollTo({top: 0, behavior: 'smooth'});\r\n };\r\n\r\n renderEmpProfile = () => {\r\n const { classes } = this.props;\r\n const { data } = this.getInfo();\r\n const date = data && data.ProposalDate && moment.utc(data.ProposalDate).format(\"DD/MM/YYYY, HH:mm:ss\");\r\n return (\r\n \r\n this.onChangePageProfile(data)}/>\r\n
\r\n );\r\n };\r\n\r\n calculateCompanyPay = () => {\r\n if (this.dataGridTableRestCost) {\r\n const dataSource = this.dataGridTableRestCost.instance.option(\"dataSource\");\r\n let totalCompanyPayVND = 0;\r\n let totalCompanyPayUSD = 0;\r\n let TotalAmountVND = 0;\r\n let TotalAmountUSD = 0;\r\n let EmployeePayVND = 0;\r\n let EmployeePayUSD = 0;\r\n dataSource.forEach(data => {\r\n TotalAmountVND += (data.AmountVND || 0);\r\n TotalAmountUSD += (data.AmountUSD || 0);\r\n if (data.IsCompanyPay) {\r\n totalCompanyPayVND += (data.AmountVND || 0);\r\n totalCompanyPayUSD += (data.AmountUSD || 0);\r\n }\r\n else {\r\n EmployeePayVND += (data.AmountVND || 0);\r\n EmployeePayUSD += (data.AmountUSD || 0);\r\n }\r\n });\r\n\r\n this.setState({TotalAmountVND:TotalAmountVND,TotalAmountUSD:TotalAmountUSD,totalCompanyPay: {VND: totalCompanyPayVND, USD: totalCompanyPayUSD}, employeePay: {VND: EmployeePayVND, USD: EmployeePayUSD}},() => {\r\n const {TotalAmountVND, TotalAmountUSD, totalCompanyPay, formData} = this.state;\r\n const { ProAmountVND, ProAmountUSD } = formData;\r\n let ReimburseVND = 0;\r\n let ReimburseUSD = 0;\r\n ReimburseVND = TotalAmountVND - totalCompanyPay.VND - ProAmountVND;\r\n ReimburseUSD = TotalAmountUSD - totalCompanyPay.USD - ProAmountUSD;\r\n this.setState({ReimburseVND:ReimburseVND,ReimburseUSD:ReimburseUSD});\r\n });\r\n }\r\n };\r\n\r\n render() {\r\n if (!this.getInfo(true)) return null;\r\n const { data, voucherID, mode } = this.getInfo();\r\n const {classes, getCboCostTypes, getFieldHide} = this.props;\r\n const { expandedFirst, expandedSecond, expandedThird,\r\n dataOldAttachments, formLoading, modeInfo, dataCostWorkPlansZero, dataCostWorkPlansOne, isSave, dataCostAllocation,\r\n formData, TotalAmountVND, TotalAmountUSD, totalCompanyPay, ReimburseVND, ReimburseUSD, disabled, employeePay } = this.state;\r\n const { FromDate, ToDate, BusinessTravelCode, BusinessLocation, Content, ProAmountVND, ProAmountUSD, ProDateAdvance, Reason } = formData;\r\n // const {UseCurency} = getFieldHide;\r\n return (\r\n <>\r\n {mode !== \"view\" && \r\n
\r\n {data?.TransTypeID || \"\"}
\r\n \r\n
\r\n \r\n {date || \"\"}\r\n
\r\n \r\n\r\n \r\n {Config.lang(\"DHR_Thong_tin_chung\")}\r\n \r\n
\r\n \r\n \r\n {Config.lang(\"DHR_Khoan_chi_phi_du_kien\")} \r\n \r\n\r\n
\r\n\r\n \r\n \r\n {Config.lang(\"DHR_Khoan_de_nghi_quyet_toan\")} \r\n \r\n
\r\n \r\n \r\n {Config.lang(\"DHR_Phan_bo_chi_phi\")} \r\n \r\n
\r\n {'(1) =(2)+(3)'}
\r\n{'(5) =(1)-(3)-(4)'}
\r\n \r\n\r\n \r\n \r\n \r\n {\r\n return {\r\n e.component.cellValue(e.rowIndex, \"IsCompanyPay\", chk.target.checked ? 1 : 0);\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 withStyles(styles)(W77F1013TableRecCost) ;","/**\r\n * @copyright 2019 @ DigiNet\r\n * @author NAMDANG\r\n * @create 8/21/2020\r\n * @Example\r\n */\r\nimport React, {PureComponent} from 'react';\r\nimport GridContainer from \"../../../grid-container/grid-container\";\r\nimport Config from \"../../../../config\";\r\nimport {Column, Summary, TotalItem} from \"devextreme-react/data-grid\";\r\nimport PropTypes from \"prop-types\";\r\nimport UndoIcon from '@material-ui/icons/Undo';\r\nimport IconButton from \"@material-ui/core/IconButton\";\r\nimport Icons from \"../../../common/icons\";\r\nimport NumberFormat from 'react-number-format';\r\nimport {bindActionCreators, compose} from \"redux\";\r\nimport {connect} from \"react-redux\";\r\nimport * as generalActions from \"../../../../redux/general/general_actions\";\r\nimport * as W77F1013Actions from \"../../../../redux/W7X/W77F1013/W77F1013_actions\";\r\n\r\nclass W77F1013TableAllocation extends PureComponent {\r\n renderButtons = (e) => {\r\n return (\r\n \r\n {\r\n !e.row.isEditing ?\r\n e.component.deleteRow(e.rowIndex)}\r\n >\r\n e.component.saveEditData()}\r\n >\r\n \r\n \r\n e.component.cancelEditData()}\r\n >\r\n \r\n \r\n \r\n )\r\n }\r\n
\r\n );\r\n };\r\n\r\n formatNumber = (e) => {\r\n if(!e) return false;\r\n return \r\n {\r\n gridRef && gridRef(ref);\r\n this.dataGrid = ref;\r\n }}\r\n columnAutoWidth={true}\r\n dataSource={dataCostAllocation}\r\n elementAttr={{\r\n style: \"min-height: 100px\"\r\n }}\r\n style={{width: \"100%\"}}\r\n editing={{\r\n mode: 'cell',\r\n refreshMode: \"reshape\",\r\n allowUpdating: true,\r\n texts: {\r\n confirmDeleteMessage: \"\"\r\n },\r\n }}\r\n // filterRow={{\r\n // visible: true,\r\n // showOperationChooser: false,\r\n // }}\r\n allowColumnResizing={true}\r\n hoverStateEnabled={true}\r\n typeShort={true}\r\n // rowPrepared={this.getDataTotal}\r\n onRowInserting={this.getDataTotal}\r\n // onRowUpdating={this.getDataTotal}\r\n onRowUpdated={this.getDataTotal}\r\n\r\n >\r\n \r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\nW77F1013TableAllocation.propTypes = {\r\n gridRef: PropTypes.func\r\n};\r\n\r\n\r\nexport default compose(\r\n connect(\r\n state => ({\r\n getMCboProject: state.W77F1013.getMCboProject,\r\n }),\r\n dispatch => ({\r\n generalActions: bindActionCreators(generalActions, dispatch),\r\n w77F1013Actions: bindActionCreators(W77F1013Actions, dispatch)\r\n })\r\n ))(W77F1013TableAllocation);","/**\r\n * @copyright 2019 @ DigiNet\r\n * @author NAMDANG\r\n * @create 8/21/2020\r\n * @Example\r\n */\r\nimport React, {PureComponent} from 'react';\r\nimport GridContainer from \"../../../grid-container/grid-container\";\r\nimport Config from \"../../../../config\";\r\nimport {Column, RequiredRule, Summary, TotalItem} from \"devextreme-react/data-grid\";\r\nimport PropTypes from \"prop-types\";\r\nimport UndoIcon from '@material-ui/icons/Undo';\r\nimport IconButton from \"@material-ui/core/IconButton\";\r\nimport {Checkbox as CheckboxM} from \"@material-ui/core\";\r\nimport withStyles from \"@material-ui/core/styles/withStyles\";\r\nimport Icons from \"../../../common/icons\";\r\nimport NumberFormat from 'react-number-format';\r\n\r\nconst styles = {\r\n checkbox: {\r\n padding: '0 4px'\r\n },\r\n editorGrid: {\r\n \"&:after\": {\r\n content: \"none\"\r\n },\r\n \"& input\": {\r\n height: \"40px !important\",\r\n minHeight: \"40px !important\",\r\n }\r\n },\r\n};\r\n\r\nclass W77F1013TableRecCost extends PureComponent {\r\n constructor(props) {\r\n super(props);\r\n this.dataGrid = null;\r\n this.addGrid = false;\r\n // this.keyInserting = \"\";\r\n }\r\n\r\n renderButtons = (e) => {\r\n return (\r\n \r\n {\r\n !e.row.isEditing ?\r\n e.component.deleteRow(e.rowIndex)}\r\n >\r\n e.component.saveEditData()}\r\n >\r\n \r\n \r\n e.component.cancelEditData()}\r\n >\r\n \r\n \r\n \r\n }\r\n
\r\n );\r\n };\r\n\r\n renderIsCompanyPay = (e) => {\r\n const {classes} = this.props;\r\n return (\r\n \r\n {\r\n gridRef && gridRef(ref);\r\n this.dataGrid = ref;\r\n }}\r\n columnAutoWidth={true}\r\n dataSource={dataCostWorkPlansOne}\r\n elementAttr={{\r\n style: \"min-height: 200px\"\r\n }}\r\n style={{width: \"100%\"}}\r\n editing={{\r\n mode: 'cell',\r\n refreshMode: \"reshape\",\r\n allowUpdating: true,\r\n texts: {\r\n confirmDeleteMessage: \"\"\r\n },\r\n }}\r\n // filterRow={{\r\n // visible: true,\r\n // showOperationChooser: false,\r\n // }}\r\n allowColumnResizing={true}\r\n hoverStateEnabled={true}\r\n typeShort={true}\r\n onInitNewRow={() => {\r\n this.addGrid = true;\r\n // this.setState({isEditing: true});\r\n }}\r\n onRowInserting={e => {\r\n if(this.isAdding) {\r\n e.cancel = true;\r\n this.isInserting = true;\r\n }\r\n }}\r\n onCellClick={this.onCellClick}\r\n onRowInserted={this.onRowInserted}\r\n onEditingStart={this.onEditingStart}\r\n onRowUpdating={(e) => {\r\n this.isAdding = true;\r\n this.isInserting = true;\r\n this.onConvertibleValueCurrentcies(e)\r\n }}\r\n // onRowInserting={this.getDataTotal}\r\n // onRowUpdating={this.getDataTotal}\r\n onRowUpdated={this.getDataTotal}\r\n >\r\n \r\n \r\n {\r\n this.addGrid && this.onChange(e, \"AmountVND\");\r\n }\r\n }}\r\n />\r\n {\r\n this.addGrid && this.onChange(e, \"AmountUSD\");\r\n }\r\n }}\r\n />\r\n\r\n {\r\n return {\r\n e.component.cellValue(e.rowIndex, \"IsCompanyPay\", chk.target.checked ? 1 : 0);\r\n }}\r\n />\r\n }}\r\n />\r\n \r\n \r\n \r\n
\r\n );\r\n }\r\n}\r\nW77F1013TableRecCost.propTypes = {\r\n gridRef: PropTypes.func,\r\n calculateCompanyPay: PropTypes.func,\r\n dataCostWorkPlansOne: PropTypes.array,\r\n getCboCostTypes: PropTypes.array,\r\n getConvertibleValueCurrentcies: PropTypes.func,\r\n getFieldHide: PropTypes.any,\r\n onAddNewTableRestCost: PropTypes.func,\r\n};\r\n\r\n\r\nexport default withStyles(styles)(W77F1013TableRecCost) ;","/**\r\n * @copyright 2019 @ DigiNet\r\n * @author NAMDANG\r\n * @create 12/15/2020\r\n * @Example\r\n */\r\nimport React from \"react\";\r\nimport {connect} from \"react-redux\";\r\nimport {bindActionCreators, compose} from \"redux\";\r\nimport Config from \"../../../../config\";\r\nimport {Col, FormGroup, Row} from \"react-bootstrap\"\r\nimport withStyles from \"@material-ui/core/styles/withStyles\";\r\nimport * as generalActions from \"../../../../redux/general/general_actions\";\r\nimport * as W89F1000Actions from \"../../../../redux/W8X/W89F1000/W89F1000_actions\";\r\nimport { Combo } from \"../../../common/form-material\";\r\nimport {DropDownButton, LoadPanel} from 'devextreme-react';\r\nimport ButtonGeneral from \"../../../common/button/button-general\";\r\nimport Icons from \"../../../common/icons/\";\r\nimport {Divider, IconButton, Tooltip} from '@material-ui/core';\r\nimport moment from \"moment\";\r\nimport _ from \"lodash\";\r\nimport { Checkbox, Radio, DatePicker, DateRangePicker } from 'diginet-core-ui/components';\r\nimport { Input } from \"reactstrap\";\r\nimport {Column} from \"devextreme-react/data-grid\";\r\nimport CloseIcon from '@material-ui/icons/Close';\r\nimport ActionToolbar from \"../../../common/toolbar/action-toolbar\";\r\nimport {ScrollView} from 'devextreme-react';\r\nimport {browserHistory} from \"react-router\";\r\n// import './w89f1000.scss';\r\nconst styles = (theme) => {\r\n\r\n return {\r\n btnExport: {\r\n margin: \"4px 0 0 10px\",\r\n borderRadius: 4,\r\n '& .dx-button-content': {\r\n backgroundColor: theme.palette.info.main,\r\n '& .dx-icon': {\r\n color: \"#FFFFFF\",\r\n },\r\n '& .dx-button-text': {\r\n fontSize: \"0.9375rem\",\r\n color: \"#FFFFFF\",\r\n },\r\n '&:hover': {\r\n opacity: 0.7,\r\n backgroundColor: theme.palette.info.main\r\n },\r\n },\r\n '& .dx-state-disabled': {\r\n borderRadius: 4,\r\n '& .dx-button-mode-outlined': {\r\n border: \"none\",\r\n },\r\n '& .dx-button-content': {\r\n backgroundColor: theme.palette.action.disabled,\r\n '& .dx-icon': {\r\n color: \"#8F9BB3\",\r\n },\r\n '& .dx-button-text': {\r\n fontSize: \"0.9375rem\",\r\n color: \"#8F9BB3\",\r\n }\r\n },\r\n },\r\n [theme.breakpoints.down(\"xs\")]: {\r\n display: \"flex\",\r\n margin: 0\r\n }\r\n },\r\n titleReport: {\r\n whiteSpace: \"nowrap\",\r\n textAlign: \"center\",\r\n },\r\n styleCbo: {\r\n marginTop: 0\r\n },\r\n styleActionToolbar: {\r\n \"& > div[class*='ActionToolbar-root-']\": {\r\n padding: \"0px !important\",\r\n },\r\n [theme.breakpoints.down(\"xs\")]: {\r\n alignItems: \"center\",\r\n flexDirection: \"column\"\r\n }\r\n },\r\n divCbo: {\r\n display: \"flex\",\r\n justifyContent: \"center\",\r\n alignItems: \"center\",\r\n [theme.breakpoints.down(\"xs\")]: {\r\n flexDirection: \"column\"\r\n }\r\n },\r\n classBackdrop: {\r\n top: \"113px\",\r\n left: 0,\r\n right: 0,\r\n bottom: 0,\r\n zIndex: 999,\r\n position: \"fixed\",\r\n backgroundColor: \"rgba(0, 0, 0, 0.5)\",\r\n },\r\n layerDropdown: {\r\n zIndex: \"1000 !important\"\r\n }\r\n }\r\n};\r\nclass W89F1000 extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n iPermission: 0,\r\n ReportID: \"\",\r\n ReportTypeID: \"\",\r\n dataCboReportID: [],\r\n dataFilterReportID: [],\r\n dataFilterPreview: [],\r\n dataForm: [],\r\n loading: {},\r\n requiredFieldNames: [],\r\n dataFilter: [\r\n { \"id\": \"UserID\", \"type\": \"VarChar\", \"value\": Config.profile.UserID },\r\n { \"id\": \"DivisionID\", \"type\": \"VarChar\", \"value\": Config.profile.DivisionID }\r\n ],\r\n showPreview: false,\r\n heightPreview: 0,\r\n downloadURL: \"\",\r\n loadingCboReportStructure: false,\r\n loadingCboReportType: false,\r\n downloadURLExport: \"\",\r\n downloadExt: \"\",\r\n downloadNameExport: \"\",\r\n showBackdrop: false,\r\n };\r\n this.loading = {};\r\n this.minHeightView = 550;\r\n this.refCombo = {};\r\n this.formMaster = null;\r\n this.refDropdown = null;\r\n this.chooseReportType = false;\r\n this.chooseReportID = false;\r\n this.refInput = null;\r\n this.refCheckbox = null;\r\n this.isLoadCboReportStructure = false;\r\n this.dataNotify = null;\r\n this.allowSetDataNotify = false;\r\n this.keyCallNotify = \"\";\r\n }\r\n\r\n loadPermission = async () => {\r\n await this.props.generalActions.getPermission(\"W89F1000\", (isPer) => {\r\n this.setState({iPermission: isPer});\r\n });\r\n };\r\n\r\n loadCboReportType = () => {\r\n const params = {\r\n DivisionID: Config.getDivisionID(),\r\n Language: Config.language || 84,\r\n Type: Config.menuType,\r\n };\r\n this.setState({loadingCboReportType: true});\r\n this.props.w89f1000Actions.getCboReportType(params,(error) => {\r\n this.setState({loadingCboReportType: false});\r\n if (error) {\r\n Config.popup2.show('ERROR', error);\r\n return false;\r\n }\r\n });\r\n };\r\n\r\n handleData = (key, type, vl, cb) => {\r\n const {dataForm} = this.state;\r\n const dataFilterT = type === \"DATETIME\" ? this.state.dataFilter : [...this.state.dataFilter];\r\n const item = {\r\n id: key,\r\n type: type,\r\n value: vl\r\n };\r\n let isExit = false;\r\n dataFilterT.forEach((i, idx) => {\r\n if (i.id === key) {\r\n dataFilterT[idx] = item;\r\n isExit = true;\r\n }\r\n });\r\n if (!isExit) {\r\n dataFilterT.push(item);\r\n }\r\n this.setState({\r\n dataFilter: dataFilterT\r\n }, async () => {\r\n cb && cb();\r\n //xet data lai khi chon combo co ControlDepend(combo phu thuoc)\r\n const formInfo = dataForm.find(d => d.ControlID === key);\r\n const controls = dataForm.filter(\r\n (k) => k.DefaultValue === \"D\" && k.ControlDepend === formInfo.ControlID\r\n );\r\n let valueKeys = _.isArray(vl)\r\n ? vl\r\n : [vl];\r\n let dataDefault = {};\r\n for (let i = 0; i < controls.length; i++) {\r\n const control = controls[i];\r\n let dataControl = control.dataRows?.rows || [];\r\n dataDefault[control.ControlID] = dataControl.filter(d => valueKeys.includes(d[formInfo.valueExpr]));\r\n }\r\n if(dataDefault && Object.keys(dataDefault).length > 0) {\r\n for(let key of Object.keys(dataDefault)) {\r\n const data = dataDefault[key];\r\n const value = data.length > 0 ? data[0] : null;\r\n const control = controls.find(c => c.ControlID === key);\r\n if(control) {\r\n const getData = () => {\r\n return control.ControlType === \"CC\" ?\r\n (value ? [value[control.valueExpr]] : []) :\r\n (value ? value[control.valueExpr] : '');\r\n };\r\n await this.handleData(key,\r\n control.ControlType === \"CC\" ? \"Array\" : \"VarChar\",\r\n getData()\r\n ,\r\n () => {\r\n this.setValueCombo(key, getData());\r\n }\r\n );\r\n }\r\n\r\n }\r\n }\r\n })\r\n };\r\n\r\n getInfo = () => {\r\n const {location} = this.props;\r\n let dataNotify = {};\r\n if (location?.state &&\r\n location?.state?.form_id === \"W89F1000\" &&\r\n location?.state?.Type === 0\r\n ) {\r\n dataNotify = {...location.state, SalaryVoucherID: location.state.voucher_id};\r\n this.allowSetDataNotify = true;\r\n this.dataNotify = dataNotify;\r\n return {\r\n dataNotify\r\n };\r\n } else {\r\n return false\r\n }\r\n };\r\n\r\n _setLoading = (key, value, cb) => {\r\n if (!key) return false;\r\n if (typeof key === \"object\") {\r\n this.loading = {\r\n ...this.loading,\r\n ...key\r\n };\r\n } else {\r\n this.loading[key] = value;\r\n }\r\n this.setState({\r\n loading: {\r\n ...this.loading\r\n }\r\n }, () => {\r\n if (cb) cb();\r\n });\r\n };\r\n\r\n getHeightOfViewer = () => {\r\n let height = 0;\r\n if (this.formMaster) {\r\n const headerHeight = 100;\r\n const hMaster = this.formMaster.offsetHeight;\r\n const hw = window.innerHeight;\r\n height = hw - (hMaster + headerHeight + 90);\r\n }\r\n return height && height < this.minHeightView ? this.minHeightView : height;\r\n };\r\n\r\n loadItemCboReportStructure = () => {\r\n const { ReportTypeID, ReportID } = this.state;\r\n const params = {\r\n DivisionID: Config.getDivisionID(),\r\n ReportTypeID: ReportTypeID,\r\n ReportID: ReportID,\r\n CompanyID: Config.getDatabaseName(),\r\n Language: Config.language || 84,\r\n Type: Config.menuType,\r\n };\r\n this.setState({ loadingCboReportStructure: true });\r\n this.props.w89f1000Actions.getItemCboReportStructure(params,(error,dataStruct) => {\r\n this.setState({ loadingCboReportStructure: false });\r\n if (error) {\r\n Config.popup2.show('ERROR', error);\r\n return false;\r\n }\r\n if(dataStruct) {\r\n const requiredFieldNames = dataStruct.filter(item => item.IsRequired === 1).map(obj => (\r\n {\r\n id: obj.ControlID,\r\n name: Config.language === \"01\" ? obj.Caption01 : obj.CaptionName84\r\n }\r\n ));\r\n\r\n //sắp xếp thứ tự component hiện ra theo DisplayOrder\r\n const dataTemp = dataStruct.sort((a,b) => {\r\n if(a.DisplayOrder < b.DisplayOrder) return -1;\r\n if(a.DisplayOrder > b.DisplayOrder) return 1;\r\n return 0;\r\n });\r\n\r\n //gán dataCombo, valueExpr, displayExpr cho combo\r\n dataStruct.forEach(struct => {\r\n dataTemp.forEach((control, controlIdx) => {\r\n if (control.ControlID === struct.ControlID && (control.ControlType === \"C\" || control.ControlType === \"CC\" || control.ControlType === \"OPT\")) {\r\n struct.Field.forEach(type => {\r\n // // set valueExpr and displayExpr\r\n if (type.Style.includes(\"V\")) {\r\n const styleV = struct.Field.find(f => f.Style.includes(\"V\"));\r\n dataTemp[controlIdx].valueExpr = styleV.FieldName || \"\";\r\n }//displayExpr\r\n if (type.Style.includes(\"D\")) {\r\n const styleV = struct.Field.find(f => f.Style.includes(\"D\"));\r\n dataTemp[controlIdx].displayExpr = styleV.FieldName || \"\";\r\n }//displayExpr\r\n });\r\n }\r\n });\r\n });\r\n\r\n dataTemp.forEach(temp => {\r\n // check dataFilter with default\r\n if (temp.ControlType === \"T\") this.handleData(temp.ControlID, \"VarChar\", temp.DefaultValue);\r\n if (temp.ControlType === \"D\") this.handleData(temp.ControlID, \"VarChar\", moment().format(\"YYYY-MM-DD\"));\r\n if (temp.ControlType === \"CHK\") this.handleData(temp.ControlID, \"INT\", parseInt(temp.DefaultValue) === 0 || parseInt(temp.DefaultValue) === 1 ? parseInt(temp.DefaultValue) : null);\r\n if (temp.ControlType === \"OPT\") this.handleData(temp.ControlID, \"VarChar\", temp.DefaultValue ? temp.DefaultValue : null);\r\n });\r\n this.setState({\r\n dataForm: dataTemp,\r\n requiredFieldNames\r\n }, () => {\r\n this.isLoadCboReportStructure = true;\r\n });\r\n }\r\n });\r\n };\r\n\r\n loadCboReportID = () => {\r\n const params = {\r\n DivisionID: Config.getDivisionID(),\r\n Language: Config.language || 84,\r\n Type: Config.menuType,\r\n };\r\n this.props.w89f1000Actions.getCboReportTypeID(params,(error) => {\r\n if (error) {\r\n Config.popup2.show('ERROR', error);\r\n return false;\r\n }\r\n });\r\n };\r\n\r\n componentDidMount = () => {\r\n this.loadCboReportType();\r\n this.loadCboReportID();\r\n };\r\n\r\n componentDidUpdate(prevProps, prevState, snapshot) {\r\n const {getCboReportIDs} = this.props;\r\n const {dataNotify} = this.getInfo();\r\n if(prevState.ReportTypeID !== this.state.ReportTypeID) {\r\n if(this.chooseReportType) {\r\n this.setState({ReportID: \"\"});\r\n }\r\n }\r\n // set data when click notify\r\n if(getCboReportIDs && getCboReportIDs.length > 0) {\r\n const key = dataNotify?.form_id + dataNotify?.voucher_id; // key check notify\r\n if (dataNotify?.voucher_id && (!this.keyCallNotify || this.keyCallNotify !== key)) {\r\n this.keyCallNotify = key;\r\n this.setState({ReportTypeID: dataNotify?.ReportTypeID || \"D13F4040\"}, () => {\r\n const dataFilterReportID = getCboReportIDs && getCboReportIDs.filter(data => data.ReportTypeID === this.state.ReportTypeID);\r\n this.setState({dataFilterReportID,\r\n dataForm: [],\r\n dataFilter: [\r\n { id: \"UserID\", type: \"VarChar\", value: Config.profile.UserID },\r\n { id: \"DivisionID\", type: \"VarChar\", value: Config.profile.DivisionID},\r\n ],\r\n ReportID: \"\",\r\n }, () => {\r\n const dataReportDefault = dataFilterReportID.find(item => item?.IsDefault === 1);\r\n const reportID = dataReportDefault?.ReportID || dataFilterReportID?.[0]?.ReportID;\r\n this.setState({ReportID: reportID || \"\"}, () => {\r\n const dataFilterPreview = dataFilterReportID.filter(data => data.ReportID === this.state.ReportID);\r\n this.setState({dataFilterPreview});\r\n this.loadItemCboReportStructure();\r\n });\r\n });\r\n })\r\n } else if (dataNotify?.voucher_id && this.keyCallNotify === key ) {\r\n this.keyCallNotify = \"\";\r\n browserHistory.push(Config.getRootPath() + dataNotify?.form_id);\r\n }\r\n }\r\n }\r\n\r\n handleChange = (key,e) => {\r\n if(!key) return false;\r\n switch (key) {\r\n case \"ReportTypeID\":\r\n const { getCboReportIDs } = this.props;\r\n this.setState({ReportTypeID: e.value}, () => {\r\n this.setState({\r\n dataForm: [],\r\n dataFilter: [\r\n { id: \"UserID\", type: \"VarChar\", value: Config.profile.UserID },\r\n {\r\n id: \"DivisionID\",\r\n type: \"VarChar\",\r\n value: Config.profile.DivisionID,\r\n },\r\n ],\r\n });\r\n this.chooseReportType = true;\r\n if(e.value === null) {\r\n this.chooseReportType = false;\r\n if(this.refDropdown) {\r\n this.refDropdown.instance.close();\r\n }\r\n }\r\n if(this.isLoadCboReportStructure) {\r\n this.isLoadCboReportStructure = false;\r\n }\r\n const dataFilterReportID = getCboReportIDs && getCboReportIDs.filter(data => data.ReportTypeID === this.state.ReportTypeID);\r\n this.setState({dataFilterReportID});\r\n });\r\n break;\r\n case \"ReportID\":\r\n this.setState({ReportID: e.value}, () => {\r\n this.chooseReportID = true;\r\n if(this.chooseReportID) {\r\n if(this.refInput) this.refInput.value = \"\";\r\n\r\n if(this.refCheckbox) {\r\n this.refCheckbox.setChecked(false);\r\n }\r\n }\r\n if(e.value === null) {\r\n this.chooseReportID = false;\r\n }\r\n const {dataFilterReportID, ReportID} = this.state;\r\n const dataFilterPreview = dataFilterReportID.filter(data => data.ReportID === ReportID);\r\n this.setState({dataFilterPreview});\r\n if(!this.isLoadCboReportStructure) {\r\n this.loadItemCboReportStructure();\r\n }\r\n });\r\n break;\r\n default:\r\n break;\r\n }\r\n };\r\n\r\n renderRadio = (formInfo, idxForm) => {\r\n const { dataFilter } = this.state;\r\n //check disabled by DependControlEnabled\r\n let disable = false;\r\n if (formInfo.DependControlEnabled) {\r\n disable = [];\r\n formInfo.DependControlEnabled.split(\";\").forEach((depend) => {\r\n let temp = depend;\r\n temp = temp.slice(1, temp.length - 1);\r\n temp = temp.split(\",\");\r\n dataFilter.forEach(i => {\r\n const value = i.value ? i.value.toString() : i.value;\r\n const tmp = temp[1] ? temp[1].toString() : temp[1];\r\n if (i.id === temp[0] && value === tmp) {\r\n disable.push(false)\r\n }\r\n });\r\n });\r\n disable = !(disable.length === formInfo.DependControlEnabled.split(\";\").length);\r\n }\r\n this.checkRequiredStatusData(disable, formInfo); // Dùng để chek Required Theo Disable\r\n return (\r\n this.formMaster = ref}>\r\n {ReportTypeID && ReportID && dataForm && dataForm.map((formInfo, idxForm) => {\r\n if(formInfo.IsHide) return null;\r\n switch (formInfo.ControlType) {\r\n case \"T\": return this.renderInput(formInfo,idxForm);\r\n case \"C\":\r\n case \"CC\":\r\n return this.refCombo[formInfo.ControlID] = ref}\r\n w89f1000Actions={this.props.w89f1000Actions}\r\n dataFilter={dataFilter}\r\n dataForm={dataForm}\r\n clearCombo={this.clearCombo}\r\n setValueCombo={this.setValueCombo}\r\n getColSpan={this.getColSpan}\r\n handleData={this.handleData}\r\n checkRequiredStatusData={this.checkRequiredStatusData}\r\n />;\r\n case \"D\": return this.renderDatePicker(formInfo, idxForm);\r\n case \"CHK\": return this.renderCheckBox(formInfo, idxForm);\r\n case \"OPT\": return this.renderRadio(formInfo, idxForm);\r\n default: return null;\r\n }\r\n\r\n })}\r\n
\r\n \r\n
\r\n \r\n this.handleChange(\"ReportTypeID\", e)}\r\n showClearButton={true}\r\n value={ReportTypeID}\r\n />\r\n this.refDropdown = ref}\r\n style={{marginTop: 0}}\r\n elementAttr={{class: classes.btnExport}}\r\n stylingMode={\"outlined\"}\r\n width={\"100%\"}\r\n onButtonClick={this.onButtonClick}\r\n dropDownContentComponent={this.dropDownContentComponent}\r\n dropDownOptions={{\r\n closeOnOutsideClick: false,\r\n minHeight: 100,\r\n maxHeight: window.innerHeight - (heightToolbar + 50),\r\n overFlowX: \"auto\",\r\n fullScreen: width <= 500,\r\n showCloseButton: width <= 500,\r\n showTitle: width <= 500,\r\n dragEnabled: true,\r\n // ...(width <= 500 ? {elementAttr: 'style=\"height: \"100%\"; overflow: \"auto\"'} : {}),\r\n width: width <= 500 ? width : 500,\r\n onShown: (e) => this.onShown(e),\r\n ...(width > 768 ? {position: positionPopover} : {})\r\n }}\r\n />\r\n
\r\n {Config.lang(\"bao_cao\")}
\r\n \r\n \r\n {\r\n this.hiddenDropdown();\r\n this.exportFile(\"docx\");\r\n }}\r\n >\r\n \r\n \r\n {\r\n this.hiddenDropdown();\r\n this.exportFile(\"xlsx\");\r\n }}\r\n >\r\n \r\n \r\n {\r\n this.hiddenDropdown();\r\n this.exportFile(\"pdf\");\r\n }}\r\n >\r\n \r\n
\r\n {(dataReportID && dataReportID?.ReportName) || \"\"}
\r\n \r\n\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n }\r\n \r\n {data?.map((item, idx) => )}\r\n
\r\n \r\n \r\n {data?.VoucherName}\r\n \r\n
\r\n )\r\n};\r\n\r\nconst Approvals = (props) => {\r\n const {data, ApprovalLevel} = props;\r\n const theme = useTheme();\r\n\r\n const ApprovalStatus = data[ApprovalLevel][0].ApprovalStatus;\r\n\r\n // list icon approved\r\n const icon={\r\n 0: {\r\n icon: PaperFilled,\r\n color: theme.palette.disabled.main\r\n },\r\n 1: {\r\n icon: HourGlass,\r\n color: theme.palette.info.main\r\n },\r\n 2: {\r\n icon: Approval,\r\n color: theme.palette.success.main\r\n },\r\n 4: {\r\n icon: Close,\r\n color: theme.palette.danger.main\r\n },\r\n 5: {\r\n icon: Delete,\r\n color: theme.palette.warning.main\r\n }\r\n };\r\n const dataApproval=data[ApprovalLevel];\r\n\r\n const Icon=icon[ApprovalStatus]?.icon || Approval;\r\n const color=icon[ApprovalStatus]?.color || Config.coreTheme?.colors?.success;\r\n\r\n const classes = useStyles({color});\r\n\r\n return (\r\n \r\n {Object.keys(dataApproval).map((key, idx) => {\r\n return (\r\n <>\r\n {idx !== 0 &&
}\r\n\r\n \r\n )\r\n })}\r\n
\r\n }\r\n
\r\n \r\n \r\n {dataApproval[0].ApprovalStatusName}\r\n \r\n
\r\n\r\n {ApprovalLevel}\r\n \r\n \r\n
\r\n )\r\n};\r\n\r\nconst UserInfo=(props) => {\r\n const { data, length }=props;\r\n const classes=useStyles();\r\n const user=Config.getUser({UserID: data?.ApproverID});\r\n return (\r\n \r\n
\r\n {dataApproval.map((item, idx) => )}\r\n
\r\n \r\n (\r\n \r\n {user?.UserName}\r\n \r\n )}\r\n className={classes.Avatar}\r\n hoverAble={length > 1}\r\n direction={\"down\"}\r\n readOnly\r\n />\r\n {length === 1 &&\r\n
\r\n )\r\n};\r\n\r\nexport default compose(\r\n connect(null,\r\n (dispatch) => ({\r\n w84f3010Actions: bindActionCreators(W84F3010Actions, dispatch),\r\n generalActions: bindActionCreators(generalActions, dispatch),\r\n })\r\n ),\r\n)(W84F3010);\r\n","import React, { useEffect, useRef, useState } from \"react\";\r\nimport {\r\n Modal,\r\n ModalBody,\r\n ModalHeader,\r\n Button,\r\n Col,\r\n Row,\r\n Typography,\r\n ButtonIcon,\r\n Popover,\r\n} from \"diginet-core-ui/components\";\r\nimport * as W82F1000Actions from \"../../../redux/W8X/W82F1000/W82F1000_actions\";\r\nimport * as generalActions from \"../../../redux/general/general_actions\";\r\nimport Config from \"../../../config\";\r\nimport GridContainer from \"../../grid-container/grid-container\";\r\nimport { Column } from \"devextreme-react/data-grid\";\r\nimport { useDispatch } from \"react-redux\";\r\nimport html2canvas from \"html2canvas\";\r\nimport PropTypes from \"prop-types\";\r\nimport { browserHistory } from \"react-router\";\r\n\r\nconst FormID = \"W82F1000\";\r\nconst W82F1000 = props => {\r\n const { open, onClose, data } = props;\r\n\r\n const [dataColumn, setDataColumn] = useState([]);\r\n const [dataGrid, setDataGrid] = useState([]);\r\n const [gridLoading, setGridLoading] = useState(false);\r\n const [isLoadingPrint, setIsLoadingPrint] = useState(false);\r\n const [permission, setPermission] = useState({});\r\n const [disbaledMore, setDisbaledMore] = useState(true);\r\n\r\n const refGrid = useRef(null);\r\n const refPopover = useRef(null);\r\n const refContainerToPrint = useRef(null);\r\n const tmpSelectedRowData = useRef([]);\r\n const tmpDataGrid = useRef([]);\r\n const isChangeDataGrid = useRef(false);\r\n const hasFixedColumn = useRef(false);\r\n const isPrint = useRef(false);\r\n\r\n const dispatch = useDispatch();\r\n\r\n const loadColumn = () => {\r\n const params = {\r\n AlertBaseID: data?.AlertBaseID ?? \"\",\r\n Language: Config.language || \"84\",\r\n };\r\n dispatch(\r\n W82F1000Actions.loadColumn(params, (error, dt) => {\r\n if (error) {\r\n Config.popup.show(\"ERROR\", error);\r\n return false;\r\n }\r\n hasFixedColumn.current = dt.some(f => f.ControlFormat === \"F\");\r\n setDataColumn(dt || []);\r\n })\r\n );\r\n };\r\n\r\n const loadGrid = () => {\r\n const params = {\r\n SQLQuery: data?.SQLQuery ?? \"\",\r\n AlertCode: data?.AlertCode ?? \"\",\r\n AlertBaseID: data?.AlertBaseID ?? \"\",\r\n ModuleID: data?.ModuleID ?? \"\",\r\n DivisionID: data?.DivisionID ?? \"\",\r\n PeriodTime: data?.PeriodTime ?? \"\",\r\n };\r\n setGridLoading(true);\r\n dispatch(\r\n W82F1000Actions.loadGrid(params, (error, dt) => {\r\n setGridLoading(false);\r\n if (error) {\r\n Config.popup.show(\"ERROR\", error);\r\n return false;\r\n }\r\n const _dataGrid = dt?.length > 0 ? dt.map((m, idx) => ({ ...m, ID: idx })) : [];\r\n tmpDataGrid.current = _dataGrid;\r\n setDataGrid(_dataGrid);\r\n })\r\n );\r\n };\r\n\r\n const loadPermission = () => {\r\n dispatch(\r\n generalActions.getPermission(\"W51F2200\", isPer => {\r\n setPermission({ W51F2200: isPer });\r\n })\r\n );\r\n };\r\n\r\n useEffect(() => {\r\n loadPermission();\r\n loadColumn();\r\n loadGrid();\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (isChangeDataGrid.current) {\r\n isChangeDataGrid.current = false;\r\n isPrint.current = true;\r\n }\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, [dataGrid]);\r\n\r\n const onExportExcel = () => {\r\n if (refGrid.current) {\r\n refGrid.current.instance.exportToExcel(true);\r\n }\r\n };\r\n\r\n const onSelectionChanged = e => {\r\n const { currentDeselectedRowKeys, currentSelectedRowKeys, selectedRowsData } = e;\r\n if (currentDeselectedRowKeys.length > 0) {\r\n tmpSelectedRowData.current = tmpSelectedRowData.current?.filter(e => {\r\n return currentDeselectedRowKeys.indexOf(e.ID) < 0;\r\n });\r\n } else if (currentSelectedRowKeys.length > 0) {\r\n currentSelectedRowKeys.forEach(val => {\r\n if (selectedRowsData.length > 0) {\r\n const data = selectedRowsData.find(d => d.ID === val);\r\n if (data) tmpSelectedRowData.current.push(data);\r\n }\r\n });\r\n }\r\n setDisbaledMore(tmpSelectedRowData.current.length === 0);\r\n e.component.selectRows(e.selectedRowKeys);\r\n };\r\n\r\n const onPrint = () => {\r\n if (tmpSelectedRowData.current.length > 0) {\r\n isChangeDataGrid.current = true;\r\n setIsLoadingPrint(true);\r\n setDataGrid(tmpSelectedRowData.current);\r\n }\r\n };\r\n\r\n const onContentReady = async () => {\r\n if (isPrint.current) {\r\n if (refContainerToPrint.current) {\r\n await html2canvas(refContainerToPrint.current, { useCORS: true, allowTaint: true, scale: 1 }).then(\r\n function (canvas) {\r\n try {\r\n const image = canvas.toDataURL(\"image/png\");\r\n const myWindow = window.open(\"\", `${data?.AlertMessage ?? \"\"}`);\r\n myWindow.document.write(\r\n `\r\n \r\n {data.AprroverName}\r\n \r\n \r\n \r\n {data.VoucherDate && moment(data.VoucherDate).isValid() ? Config.convertDate(data.VoucherDate,'', 'DD/MM/YYYY HH:mm:ss') : ''}\r\n \r\n \r\n {data.Notes}\r\n \r\n
\r\n }\r\n \r\n {data?.AlertMessage ?? \"\"} \r\n
\r\n \r\n
\r\n {_.get(data, \"Note\", \"\")}
;\r\n }}\r\n caption={Config.lang(\"Ghi_chu\")}\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
\r\n );\r\n };\r\n\r\n renderApprovers = (e) => {\r\n const classes = useStyles();\r\n const {data} = e.row;\r\n const dataApprover = _.get(data, \"ApproverName.dataApprover\", [])\r\n return (\r\n \r\n {_.map(dataApprover, (approverName, i) => {approverName}
)} \r\n
\r\n )\r\n };\r\n\r\n onOpenPopup = (state, option = {}, cb = () => {\r\n }) => {\r\n this.setState({\r\n [state]: true,\r\n ...option,\r\n }, cb)\r\n }\r\n\r\n onClosePopup = (state, isReload = false) => {\r\n if (isReload) {\r\n this.setState({\r\n selectedRowKeys: [],\r\n selectedRowsData: []\r\n }, () => {\r\n this.loadGrid();\r\n this.preSelectedRowKeys.current = [];\r\n this.preDataRowsSelected.current = []\r\n })\r\n }\r\n this.setState({\r\n [state]: false\r\n })\r\n }\r\n\r\n onSelectionChanged = async (e) => {\r\n const {dataGrid} = this.state;\r\n const {selectedRowKeys, selectedRowsData} = e;\r\n let allSelectedRowKeys = _.uniq([...(this.preSelectedRowKeys.current ?? []), ...selectedRowKeys]);\r\n let allSelectedDataRows = _.uniqBy([...(this.preDataRowsSelected.current ?? []), ...selectedRowsData], \"TransID\");\r\n const currentRowSelected = this.getCurrentRowsSelected(\"key\", dataGrid.rows, allSelectedRowKeys);\r\n const deselectedRowKeys = _.filter(currentRowSelected, rowKey => !_.includes(selectedRowKeys, rowKey));\r\n await (() => {\r\n this.preSelectedRowKeys.current = _.filter(allSelectedRowKeys, rowKey => !_.includes(deselectedRowKeys, rowKey))\r\n this.preDataRowsSelected.current = _.filter(allSelectedDataRows, item => !_.includes(deselectedRowKeys, item.TransID));\r\n })();\r\n this.setState({selectedRowKeys, selectedRowsData});\r\n }\r\n\r\n renderAction = (e) => {\r\n const {iPermission} = this.state;\r\n const {data} = e.row;\r\n const buttonList = [\r\n {\r\n name: \"History\",\r\n onClick: () => this.onOpenPopup(\"showW75F8002\", {transIDSelected: _.get(data, \"TransID\", \"showW75F8002\")}),\r\n disabled: false\r\n },\r\n {\r\n name: \"PersonSync\",\r\n onClick: () => this.setState({dataW75F8003: data, showW75F8003: true}),\r\n disabled: iPermission < 3\r\n }\r\n ]\r\n return _.map(buttonList, (props, i) => )}
{this.renderFilter()}
\r\n \r\n
\r\n \r\n );\r\n }\r\n\r\n componentDidMount = async () => {\r\n await this.loadPermission();\r\n this.loadGrid();\r\n }\r\n\r\n componentDidUpdate(prevProps, prevState, snapshot) {\r\n const {dataGrid} = this.state;\r\n Config.callChildForm({\r\n FormID: \"W75F8000\",\r\n keyExpr: \"TransID\",\r\n data: dataGrid.rows,\r\n onLoad: (params) => {\r\n const rows = _.filter(dataGrid.rows,[\"TransID\", params.ID || \"\"]);\r\n const total = _.size(rows);\r\n this.setState({dataGrid: {rows, total}});\r\n },\r\n onAction: (e, data) => {this.setState({dataW75F8003: data, showW75F8003: true})}\r\n }, this.props);\r\n }\r\n}\r\n\r\nexport default compose(connect((state) => (\r\n {\r\n getCboEmployees: state.general.getCboEmployees,\r\n }), (dispatch) => (\r\n {\r\n generalActions: bindActionCreators(generalActions, dispatch),\r\n }\r\n)))(W75F8000)\r\n","import React, {Component} from 'react';\r\nimport Modal from \"../../../common/modal/modal\";\r\nimport Api from \"../../../../services/api\";\r\nimport Config from \"../../../../config\";\r\nimport {withStyles, Chip, Icon, Paper} from \"@material-ui/core\";\r\nimport _ from \"lodash\";\r\nimport UserImage from \"../../../common/user/user-image\";\r\nimport UserName from \"../../../common/user/user-name\";\r\nimport {Image} from \"react-bootstrap\";\r\nimport moment from \"moment\";\r\nimport KeyboardArrowDownIcon from '@material-ui/icons/KeyboardArrowDown';\r\nimport CircularProgress from \"@material-ui/core/CircularProgress\";\r\n\r\nconst styles = theme => ({\r\n timeline: {\r\n position: \"relative\",\r\n margin: \"0px auto\",\r\n flex: 1,\r\n \"&:before\": {\r\n content: \"''\",\r\n position: \"absolute\",\r\n height: \"100%\",\r\n width: 2,\r\n left: \"29%\",\r\n backgroundColor: \"#3333\",\r\n },\r\n \"& > ul > li\": {\r\n display: \"flex\",\r\n flexDirection: \"row\",\r\n alignItems: \"center\",\r\n listStyleType: \"none\",\r\n }\r\n },\r\n point: {\r\n minWidth: 20,\r\n height: 20,\r\n backgroundColor: \"#687799\",\r\n zIndex: 2,\r\n position: \"relative\",\r\n left: 7,\r\n borderRadius: \"5%\",\r\n textAlign: \"center\",\r\n color: \"#FFF\",\r\n fontWeight: 600\r\n },\r\n leftContent: {\r\n width: \"24%\"\r\n },\r\n rightContent: {\r\n display: \"flex\",\r\n width: \"70%\",\r\n paddingLeft: 25,\r\n alignItems: \"center\"\r\n },\r\n contentLeft: {\r\n display: \"flex\",\r\n alignItems: \"center\"\r\n },\r\n chip: {\r\n flex: 4,\r\n \"& > .MuiChip-label\": {\r\n fontSize: \"1.2rem\",\r\n color: \"#FFF\"\r\n },\r\n \"& > .MuiChip-icon\": {\r\n display: \"flex\",\r\n justifyContent: \"center\",\r\n color: \"#FFF\"\r\n }\r\n },\r\n line: {\r\n flex: 1,\r\n height: 1,\r\n backgroundColor: \"#3333\"\r\n },\r\n rowLine: {\r\n marginBottom: 15,\r\n paddingBottom: 15,\r\n borderBottom: \"0.5px dashed #3333\"\r\n },\r\n chipSuccess: {\r\n backgroundColor: theme.palette.success.main\r\n },\r\n chipWarning: {\r\n backgroundColor: theme.palette.warning.main\r\n },\r\n chipDanger: {\r\n backgroundColor: theme.palette.danger.main\r\n },\r\n chipInfo: {\r\n backgroundColor: theme.palette.info.main\r\n },\r\n info: {\r\n display: \"flex\",\r\n flexDirection: \"column\",\r\n marginLeft: 10,\r\n },\r\n dateInfo: {\r\n display: \"flex\",\r\n },\r\n overlay: {\r\n zIndex: 999,\r\n position: \"absolute\",\r\n display: \"flex\",\r\n alignItems: \"center\",\r\n justifyContent: \"center\",\r\n width: \"100%\",\r\n height: \"100%\",\r\n top: \"50%\",\r\n left: \"50%\",\r\n transform: \"translate(-50%,-50%)\",\r\n backgroundColor: \"#FFFFFF88\"\r\n }\r\n});\r\n\r\nclass W75F8002 extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n dataHistory: {total: 0, rows: []},\r\n isLoading: false,\r\n }\r\n this.filter = {\r\n skip: 0,\r\n limit: 11,\r\n }\r\n }\r\n\r\n onLoadMore = (e) => {\r\n const bottom = e.target.scrollHeight - e.target.scrollTop === e.target.clientHeight;\r\n if (bottom) {\r\n this.filter.skip = this.filter.limit + 11;\r\n this.loadHistory();\r\n }\r\n }\r\n\r\n loadHistory = async () => {\r\n const {transID} = this.props;\r\n const {dataHistory} = this.state;\r\n this.setState({isLoading: true})\r\n const res = await Api.put('/w75f8000/load-history', {\r\n TransID: transID,\r\n Language: Config.language || '84',\r\n ...this.filter\r\n });\r\n _.delay(() => this.setState({isLoading: false}), 1000)\r\n const resData = _.get(res, \"data\", null);\r\n const resMessageErr = _.get(res, \"message\", _.get(resData, \"Message\", \"\"));\r\n const rows = [...dataHistory.rows, ..._.get(resData, \"rows\", [])];\r\n const total = _.get(resData, \"total\", 0);\r\n if (resMessageErr) {\r\n Config.popup.show(\"ERROR\", resMessageErr);\r\n return false;\r\n }\r\n if (resData) {\r\n this.setState({dataHistory: {rows, total}});\r\n return true;\r\n }\r\n }\r\n\r\n componentDidUpdate = (prevProps) => {\r\n if (prevProps.transID !== this.props.transID) {\r\n this.setState({dataHistory: {total: 0, rows: []}}, () => this.loadHistory())\r\n }\r\n }\r\n\r\n renderHistoryTimeline = () => {\r\n const {classes} = this.props;\r\n const {dataHistory} = this.state;\r\n return _.map(_.get(dataHistory, \"rows\", []), (item, i) => {\r\n const voucherDate = _.get(item, \"VoucherDate\", \"\");\r\n const date = moment(voucherDate).isValid() ? moment.utc(voucherDate).format(\"DD/MM/YYYY kk:mm:ss\") : \"\";\r\n let chip = {\r\n iconName: \"fal fa-ellipsis-h\",\r\n classesName: classes.chipInfo\r\n };\r\n switch (_.get(item, \"IsStatus\", null)) {\r\n case 0:\r\n chip = {\r\n iconName: \"far fa-file-plus\",\r\n classesName: \"\"\r\n };\r\n break;\r\n case 2:\r\n chip = {\r\n iconName: \"fas fa-check\",\r\n classesName: classes.chipSuccess\r\n };\r\n break;\r\n case 4:\r\n chip = {\r\n iconName: \"fas fa-times\",\r\n classesName: classes.chipDanger\r\n };\r\n break;\r\n case 5:\r\n chip = {\r\n iconName: \"fas fa-do-not-enter\",\r\n classesName: classes.chipWarning\r\n };\r\n break;\r\n default:\r\n break;\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 \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 {_.get(item, \"ApprovalLevel\", \"\")} \r\n {\r\n this.filter.skip = 0;\r\n this.filter.limit = 11;\r\n onClose('showW75F8002')\r\n }}\r\n title={Config.lang(\"DHR_Lich_su_duyet\")}\r\n >\r\n\r\n \r\n {isLoading ?\r\n \r\n {dataHistory.total > 11 ?\r\n \r\n );\r\n }\r\n\r\n}\r\n\r\nexport default withStyles(styles, {withTheme: true})(W75F8002)","import React, {Component} from 'react';\r\nimport {withStyles} from \"@material-ui/core\";\r\nimport Modal from \"../../../common/modal/modal\";\r\nimport Config from \"../../../../config\";\r\nimport GridContainer from \"../../../grid-container/grid-container\";\r\nimport {Column} from \"devextreme-react/data-grid\";\r\nimport UserImage from \"../../../common/user/user-image\";\r\nimport _ from \"lodash\";\r\nimport {bindActionCreators, compose} from \"redux\";\r\nimport {connect} from \"react-redux\";\r\nimport * as generalActions from \"../../../../redux/general/general_actions\";\r\nimport UserName from \"../../../common/user/user-name\";\r\nimport InputAdornment from \"@material-ui/core/InputAdornment\";\r\nimport SearchIcon from \"@material-ui/icons/Search\";\r\nimport {TextField} from \"../../../common/form-material\";\r\nimport ButtonCustom from \"../../../common/button/button-custom\";\r\nimport Api from \"../../../../services/api\";\r\n\r\nconst styles = () => ({\r\n grid247: {\r\n \"& .grid-container\": {\r\n \"& > .paging\": {\r\n position: \"absolute\",\r\n }\r\n }\r\n\r\n }\r\n})\r\n\r\nclass W75F8001 extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n selectedRowKeys: [],\r\n };\r\n this.preSelectedRowKeys = React.createRef();\r\n }\r\n\r\n getCurSelectedRowKeys = (data = [], dataSelected = []) => _.reduce(data, (acc, item) => {\r\n if (_.includes(dataSelected, _.get(item, \"EmployeeID\", \"\"))) {\r\n acc = [...acc, item.EmployeeID]\r\n }\r\n return acc;\r\n }, []);\r\n\r\n onChangePage = (page) => {\r\n const {selectedRowKeys} = this.state;\r\n this.tmpSelectedRowKeys = selectedRowKeys;\r\n this.props.onChangePage({skip: page * this.props.limit})\r\n };\r\n\r\n onChangePerPage = (perPage) => {\r\n const {selectedRowKeys} = this.state;\r\n this.tmpSelectedRowKeys = selectedRowKeys;\r\n this.props.onChangePage({skip: 0, limit: perPage})\r\n };\r\n\r\n onAgree = () => {\r\n const {onClose, voucherSelected} = this.props;\r\n const {selectedRowKeys} = this.state;\r\n const jsonDataParam = JSON.stringify(_.reduce(selectedRowKeys, (accUser, UserID) => {\r\n accUser = [...accUser, ..._.map(voucherSelected, item => ({\r\n ..._.pick(item, ['ApprovalFlowID', \"ApprovalLevel\", \"TransID\", \"ObjectID\"]),\r\n UserID,\r\n VoucherID: _.get(item, \"TransID\", \"\")\r\n }))];\r\n return accUser;\r\n }, []));\r\n const params = {\r\n delete: jsonDataParam,\r\n data: jsonDataParam\r\n }\r\n Config.popup.show(\"YES_NO\", Config.lang(\"Ban_co_muon_thay_the_nguoi_duyet\"), () => {\r\n (async () => {\r\n const res = await Api.put(\"/w75f8000/choose-approver\", params);\r\n const resData = _.get(res, \"data\", []);\r\n const resDataErrMessage = _.get(resData, \"Message\", \"\");\r\n const resStatus = _.get(resData, \"Status\", 1);\r\n const resErrMessage = _.get(res, \"message\", \"\");\r\n if (resErrMessage || resDataErrMessage || resStatus) {\r\n Config.popup.show(\"ERROR\", resErrMessage);\r\n return false;\r\n }\r\n Config.notify.show(\"success\", Config.lang(\"Thay_the_nguoi_duyet_thanh_cong\"), 2000);\r\n onClose(\"showW75F8001\", true);\r\n })();\r\n });\r\n }\r\n\r\n onSelectionChanged = async ({selectedRowKeys}) => {\r\n const {getCboEmployees} = this.props;\r\n let allSelectedRowKeys = _.uniq([...(this.preSelectedRowKeys.current || []), ...selectedRowKeys]);\r\n const currentRowSelected = this.getCurSelectedRowKeys(getCboEmployees.rows, allSelectedRowKeys);\r\n const deselectedRowKeys = _.filter(currentRowSelected, rowKey => !_.includes(selectedRowKeys, rowKey));\r\n await (() => this.preSelectedRowKeys.current = _.filter(allSelectedRowKeys, rowKey => !_.includes(deselectedRowKeys, rowKey)))();\r\n this.setState({selectedRowKeys});\r\n }\r\n\r\n renderAvatar = (e) => {\r\n const {data} = e.row;\r\n return ( onClose('showW75F8001')}\r\n title={`${Config.lang(\"Them_nguoi_duyet\")} ${!!countNumberAllSelectedRowKeys ? countNumberAllSelectedRowKeys : \"\"}`}\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 compose(connect((state) => ({\r\n getCboEmployees: state.general.getCboEmployees,\r\n}), (dispatch) => ({\r\n generalActions: bindActionCreators(generalActions, dispatch),\r\n})), withStyles(styles, {withTheme: true}))(W75F8001)","import React, {useEffect, useState, useRef} from 'react';\r\nimport {Modal, ModalBody, ModalHeader, Button, ButtonIcon, Dropdown} from \"diginet-core-ui/components\";\r\nimport GridContainer from \"../../../grid-container/grid-container\";\r\nimport Config from \"../../../../config\";\r\nimport {Column, CustomRule} from \"devextreme-react/data-grid\";\r\nimport _ from \"lodash\";\r\nimport {bindActionCreators} from \"redux\";\r\nimport {connect} from \"react-redux\";\r\nimport {FormGroup} from \"react-bootstrap\";\r\nimport * as w75F8003Actions from \"../../../../redux/W75/W75F8003/W75F8003_actions\";\r\n\r\nconst W75F8003 = ({open, data, onClose, w75F8003Actions, iPermission}) => {\r\n const userList = _.filter(Config.listUsers, item => !!item.UserID);\r\n const [dataGrid, setDataGrid] = useState([]);\r\n const [isLoading, setLoading] = useState(false);\r\n\r\n const {\r\n TransID = \"\",\r\n ApprovalFlowID = \"\",\r\n ApprovalLevel = \"\",\r\n ObjectID = \"\"\r\n } = _.pick(data, [\"TransID\", \"ApprovalFlowID\", \"ApprovalLevel\", \"ObjectID\"]);\r\n\r\n let refGrid = null;\r\n let dataSourceListUser = useRef([...userList]);\r\n let userSelected = useRef([]);\r\n\r\n useEffect(() => {\r\n setLoading(true);\r\n w75F8003Actions.loadForm({TransID, ApprovalFlowID, ApprovalLevel}, (err, data) => {\r\n setLoading(false);\r\n if (err) return Config.popup.show(\"ERROR\", err);\r\n if (data) {\r\n setDataGrid(_(data).map(Config.getUser).filter(_.size).map(item => ({\r\n ..._.pick(item, [\"EmployeeID\", \"UserID\", \"UserName\", \"DutyName\", \"DepartmentName\"]),\r\n isError: false,\r\n isNew: false,\r\n isUpdated: false\r\n })).value());\r\n dataSourceListUser.current = _.filter(dataSourceListUser.current, item => !_.includes(_.map(data, \"UserID\"), item.UserID));\r\n }\r\n });\r\n // eslint-disable-next-line react-hooks/exhaustive-deps\r\n }, []);\r\n\r\n const getIndexUser = empID => _.findIndex(dataGrid, [\"EmployeeID\", empID]);\r\n\r\n const setUserSelected = (oldUserID, newUserID = \"\") => {\r\n if (_.some(userSelected.current, userID => userID === oldUserID)) userSelected.current = _.filter(userSelected.current, elm => elm !== oldUserID)\r\n if(newUserID) userSelected.current = _.uniq([...userSelected.current, newUserID]);\r\n }\r\n\r\n const onInsertNewRow = () => refGrid && refGrid.instance.addRow();\r\n\r\n const onSaveRow = (data = {}) => {\r\n if (!data?.UserID) return false;\r\n const indexUser = getIndexUser(data.EmployeeID);\r\n let isError = false;\r\n const params = {\r\n UserIDGrid: data?.UserID ?? \"\",\r\n ObjectID,\r\n TransID,\r\n ApprovalFlowID,\r\n ApprovalLevel\r\n }\r\n setLoading(true);\r\n w75F8003Actions.saveRow(params, err => {\r\n setLoading(false);\r\n if (err) {\r\n isError = true;\r\n Config.popup.show(\"ERROR\", err);\r\n }\r\n if (!isError) Config.popup.show(\"success\", Config.lang(\"Luu_thanh_cong\"));\r\n\r\n setDataGrid([\r\n ..._.slice(dataGrid, 0, indexUser),\r\n {\r\n ...dataGrid[indexUser],\r\n isUpdated: false,\r\n isNew: false,\r\n isError\r\n },\r\n ..._.slice(dataGrid, indexUser + 1)\r\n ]);\r\n })\r\n };\r\n\r\n const onDeleteRow = (data = {}) => {\r\n if (!data?.UserID) return false;\r\n let userRemove;\r\n const params = {\r\n UserIDGrid: data?.UserID || \"\",\r\n TransID,\r\n ApprovalFlowID,\r\n ApprovalLevel\r\n }\r\n const indexUser = getIndexUser(data.EmployeeID);\r\n Config.popup.show(\"YES_NO\", Config.lang(\"Ban_co_chac_muon_xoa?\"), () => {\r\n setLoading(true);\r\n w75F8003Actions.deleteRow(params, err => {\r\n setLoading(false);\r\n if (err) {\r\n userRemove = {\r\n ...dataGrid[indexUser],\r\n isUpdated: false,\r\n isError: true\r\n };\r\n Config.popup.show(\"ERROR\", err);\r\n }\r\n if (!userRemove) {\r\n Config.popup.show(\"success\", Config.lang(\"Xoa_thanh_cong\"));\r\n setUserSelected(data?.UserID);\r\n }\r\n setDataGrid([\r\n ..._.slice(dataGrid, 0, indexUser),\r\n userRemove,\r\n ..._.slice(dataGrid, indexUser + 1)\r\n ]);\r\n })\r\n })\r\n };\r\n\r\n const renderAction = ({data = {}}) => _.map([{\r\n name: \"Save\",\r\n disabled: iPermission < 3 || ((data.isUpdated ? !data.isUpdated : !data.isNew) || false),\r\n onClick: () => onSaveRow(data),\r\n }, {\r\n name: \"Delete\",\r\n disabled: iPermission < 4 || ((data.isUpdated ? data.isUpdated : data.isNew || data.isError) || false),\r\n onClick: () => onDeleteRow(data),\r\n }\r\n ], (props, i) => {\r\n const userID = _.get(ev, \"value\", \"\");\r\n const {DutyName = \"\", DepartmentName = \"\"} = _(dataSourceListUser.current).filter([\"UserID\", userID]).get(\"[0]\", {});\r\n e.setValue(userID);\r\n component.cellValue(rowIndex, \"DutyName\", DutyName);\r\n component.cellValue(rowIndex, \"DepartmentName\", DepartmentName);\r\n setUserSelected(data.UserID, userID);\r\n component.closeEditCell();\r\n }}\r\n />\r\n };\r\n\r\n return onClose(\"showW75F8003\", true)}>\r\n \r\n \r\n \r\n \r\n refGrid = ref}\r\n rowAlternationEnabled={false}\r\n style={{border: 'none'}}\r\n showRowLines={false}\r\n typePaging={\"normal\"}\r\n keyExpr={\"EmployeeID\"}\r\n dataSource={dataGrid}\r\n showBorders={false}\r\n showColumnLines={false}\r\n noDataText={Config.lang(\"No_data\")}\r\n loading={isLoading}\r\n height={Config.getHeightGrid() - 180}\r\n pagerFullScreen={false}\r\n selection={{mode: \"none\"}}\r\n editing={{\r\n mode: 'cell',\r\n refreshMode: 'reshape',\r\n allowUpdating: true,\r\n startEditAction: \"click\"\r\n }}\r\n onInitNewRow={e => {\r\n e.data.isNew = true;\r\n e.data.isUpdated = false;\r\n e.data.isError = false;\r\n }}\r\n onRowUpdated={(e) => {\r\n e.data.isUpdated = true;\r\n e.data.isError = false;\r\n setTimeout(() => e.component.saveEditData(), 300)\r\n }}\r\n onRowPrepared={(e) => {\r\n if (!e) return false;\r\n const {data} = e;\r\n e.rowElement.style.backgroundColor = \"none\";\r\n if (data?.isUpdated) e.rowElement.style.backgroundColor = \"rgba(139, 195, 74, 0.32)\";\r\n if (data?.isError) e.rowElement.style.backgroundColor = \"rgb(217,83,79, 0.32)\";\r\n if (data?.isNew) e.rowElement.style.backgroundColor = \"rgb(100, 149, 237, 0.32)\";\r\n }}\r\n allowColumnResizing={true}\r\n >\r\n \r\n !!e.data.UserID}\r\n message=\"Giá trị bắt buộc nhập\"/>\r\n \r\n \r\n \r\n \r\n \r\n \r\n};\r\n\r\nexport default connect((state) => (\r\n {\r\n getForm: state.W75F8003.getForm,\r\n }), (dispatch) => (\r\n {\r\n w75F8003Actions: bindActionCreators(w75F8003Actions, dispatch),\r\n }\r\n))(W75F8003)","/**\r\n * @copyright 2019 @ DigiNet\r\n * @author TRIHAO\r\n * @create 1/8/2020\r\n * @Example Demo man hinh duyet chung...\r\n */\r\nimport React from \"react\";\r\nimport {connect} from \"react-redux\";\r\nimport {compose} from \"redux\";\r\nimport Config from \"../../../../config\";\r\nimport {Row, Col, FormGroup} from \"react-bootstrap\"\r\nimport ActionToolbar from \"../../../common/toolbar/action-toolbar\";\r\nimport withStyles from \"@material-ui/core/styles/withStyles\";\r\nimport Approvals from \"../../../approvals/approvals\";\r\nimport DateBoxPicker from \"../../../common/form-material/date-box\";\r\nimport {Combo, TextField} from \"../../../common/form-material\";\r\n\r\nconst styles = {\r\n\r\n};\r\nclass W84F3000 extends React.Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {\r\n text: \"\"\r\n };\r\n }\r\n\r\n componentDidMount() {\r\n }\r\n\r\n //Form demo..\r\n renderFormInfo = () => {\r\n const disabled = true;\r\n const loading = false;\r\n return (\r\n <>\r\n \r\n \r\n this.handleChange(\"ProjectID\", e)}\r\n />\r\n \r\n
\r\n \r\n \r\n \r\n this.handleChange('AttendanceDate', e)}\r\n />\r\n \r\n this.handleChange(\"HandOverID\", e)}\r\n />\r\n \r\n
\r\n \r\n \r\n \r\n this.handleChange('MasterNote', e)}\r\n fullWidth\r\n />\r\n \r\n
\r\n \r\n \r\n );\r\n };\r\n\r\n onSelectionChanged = (e) => {\r\n console.log('=== onSelectionChanged', e);\r\n };\r\n\r\n render() {\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\r\nexport default compose(connect(state => ({\r\n //reducers...\r\n}), (dispatch) => ({\r\n //bind ations...\r\n})), withStyles(styles))(W84F3000);\r\n"],"sourceRoot":""}
\r\n }\r\n label={_.get(item, \"StatusName\", \"\")}\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 render() {\r\n const {classes, open, onClose} = this.props;\r\n const {dataHistory, isLoading} = this.state;\r\n return (\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n {_.get(item, \"NotesU\", \"\")}\r\n \r\n {date}\r\n
\r\n \r\n \r\n
\r\n : \"\"}\r\n \r\n
\r\n - \r\n {this.renderHistoryTimeline()}\r\n
\r\n \r\n
\r\n :\r\n \"\"}\r\n \r\n \r\n
);\r\n };\r\n\r\n renderInfo = (e) => {\r\n const {data} = e.row;\r\n return (\r\n \r\n \r\n
\r\n )\r\n }\r\n\r\n render() {\r\n const {selectedRowKeys} = this.state;\r\n const {getCboEmployees, open, onClose, onSearchEmployee, loading, skip, limit} = this.props;\r\n const countNumberAllSelectedRowKeys = _.size(_.uniq([...(this.preSelectedRowKeys.current ?? []), ...selectedRowKeys]))\r\n const hasAEmployeeChecked = countNumberAllSelectedRowKeys > 0;\r\n return (\r\n {_.get(data, \"EmployeeID\", \"\")}
\r\n {_.get(data, \"DutyName\", \"\")}
\r\n \r\n
\r\n