diff --git a/src/routes.js b/src/routes.js index 85e3523..7fdb466 100644 --- a/src/routes.js +++ b/src/routes.js @@ -49,6 +49,7 @@ const DashboardCustomer = React.lazy(() => import('./views/Dashboard/DashboardCu const DashboardProject = React.lazy(() => import('./views/Dashboard/DashboardProject')); const MapMonitoring = React.lazy(() => import('./views/MapMonitoring')); const Settings = React.lazy(() => import('./views/SimproV2/Settings')); +const CompanyManagement = React.lazy(() => import('./views/Master/MasterCompany')) const routes = [ { path: '/', exact: true, name: 'Home' }, // { path: '/dashboard', name: 'Dashboard', component: Dashboard}, @@ -109,6 +110,7 @@ const routes = [ { path: '/map-monitoring', exact: true, name: 'Map Monitoring', component: MapMonitoring }, // { path: '/dashboard-project/:ID/:GANTTID', exact: true, name: 'Dashboard Project', component: DashboardProject }, { path: '/settings', exact: true, name: 'Settings', component: Settings }, + { path: '/company-management', exact: true, name: 'Company Management', component: CompanyManagement }, ]; export default routes; diff --git a/src/views/Master/MasterCompany/DialogForm.js b/src/views/Master/MasterCompany/DialogForm.js new file mode 100644 index 0000000..9b39d14 --- /dev/null +++ b/src/views/Master/MasterCompany/DialogForm.js @@ -0,0 +1,399 @@ +import React, { useState, useMemo, useEffect } from 'react' +import { + Modal, ModalHeader, ModalBody, ModalFooter, + Button, Form, FormGroup, Label, Input, Col, Row, Card, CardBody, Fade +} from 'reactstrap'; +import { Pagination, Table, Tooltip, Select, Input as InputAntd } from 'antd'; +import moment from 'moment'; +import { NotificationContainer, NotificationManager } from 'react-notifications'; +import DialogFormUser from './DialogFormUser'; +import 'antd/dist/antd.css'; +import { useTranslation } from 'react-i18next'; +import axios from "../../../const/interceptorApi" +import { + USER_SEARCH, USER_EDIT, USER_DELETE, ROLE_SEARCH, DIVISI_SEARCH, +} from '../../../const/ApiConst'; +const token = window.localStorage.getItem('token'); +const config = { + headers: + { + Authorization: `Bearer ${token}`, + "Content-type": `application/json` + } +}; +const { Option } = Select +const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdit, roleList, companyID }) => { + const { t } = useTranslation() + const [registrationnumber, setRegistrationNumber] = useState('') + const [companyName, setCompanyName] = useState('') + const [addressCompany, setAddressCompany] = useState('') + const [phoneNumber, setPhoneNumber] = useState('') + const [emailCompany, setEmailCompany] = useState('') + const [description, setDescription] = useState('') + const [logoLogin, setLogoLogin] = useState([]) + const [logoHeader, setLogoHeader] = useState([]) + const [favIcon, setFavIcon] = useState([]) + const [loginInstruction, setLoginInstruction] = useState('') + const [about, setAbout] = useState('') + const [htmlTitle, setHtmlTitle] = useState('') + const [appName, setAppName] = useState('') + const [baseUrl, setBaseUrl] = useState([]) + const [statusCompany, setStatusCompany] = useState('active') + const [template, setTemplate] = useState('') + + const [dataTable, setDatatable] = useState([]) + const [openDialogUser, setOpenDialogUser] = useState(false) + const [typeDialogUser, setTypeDialogUser] = useState("add") + const [currentPage, setCurrentPage] = useState(1) + const [rowsPerPage, setRowsPerPage] = useState(10) + const [totalPage, setTotalPage] = useState(0) + const [search, setSearch] = useState('') + + useEffect(() => { + if (companyID) { + getDataUser() + } + }, [companyID, rowsPerPage, currentPage]) + + const onShowSizeChange = (current, pageSize) => { + setRowsPerPage(pageSize) + } + + const onPagination = (current, pageSize) => { + setCurrentPage(current) + } + + const getDataUser = async () => { + let start = 0; + + if (currentPage !== 1 && currentPage > 1) { + start = (currentPage * rowsPerPage) - rowsPerPage + } + + const payload = { + "paging": { + "start": start, + "length": rowsPerPage + }, + "columns": [], + "group_column": { + "operator": "AND", + "group_operator": "OR", + "where": [ + { + "name": "name", + "logic_operator": "~*", + "value": search + }, + { + "name": "ktp_number", + "logic_operator": "~*", + "value": search + }, + { + "name": "name", + "logic_operator": "~*", + "value": search, + "table_name": "m_divisi" + }, + { + "name": "employee_type", + "logic_operator": "~*", + "value": search + }, + { + "name": "name", + "logic_operator": "~*", + "value": search, + "table_name": "m_roles" + }, + { + "name": "phone_number", + "logic_operator": "~*", + "value": search + }, + { + "name": "email", + "logic_operator": "~*", + "value": search + }, + { + "name": "status_resource", + "logic_operator": "~*", + "value": search + }, + { + "name": "company_id", + "logic_operator": "=", + "value": companyID + }, + ] + }, + "joins": [ + { + "name": "m_roles", + "column_join": "role_id", + "column_results": [ + "name", + "description" + ] + }, + { + "name": "m_divisi", + "column_join": "divisi_id", + "column_results": [ + "name" + ] + } + ], + "orders": { + "columns": [ + "id" + ], + "ascending": false + } + } + + const result = await axios + .post(USER_SEARCH, payload, config) + .then(res => res) + .catch((error) => error.response); + + if (result && result.data && result.data.code == 200) { + setDatatable(result.data.data); + setTotalPage(result.data.totalRecord); + } else { + NotificationManager.error('Gagal Mengambil Data!!', 'Failed'); + } + } + + + + const handleAddUser = async () => { + await setTypeDialogUser("Save") + setOpenDialogUser(true) + } + + const closeDialogUser = () => { + setOpenDialogUser(false); + }; + + const handleSave = () => { + let data = ''; + + if (!registrationnumber && registrationnumber === "") { + alert("Please input Registration Number"); + return; + } + if (!companyName && companyName === "") { + alert("Please input the name"); + return; + } + + if (typeDialog === "Save") { + data = { + registration_no: registrationnumber, + company_name: companyName, + address: addressCompany, + phone_no: phoneNumber, + email: emailCompany, + description: description, + logo_login: logoLogin, + logo_header: logoHeader, + favicon_image: favIcon, + login_instruction: loginInstruction, + about: about, + html_title: htmlTitle, + app_name: appName, + base_url: baseUrl, + is_active: statusCompany, + template_id: template + } + console.log(data) + + closeDialog('save', data); + } else if (typeDialog === "Set") { + // if (!password && password === "") { + // alert("Please fill password"); + // return; + // } + // if (password !== retryPassword) { + // alert("Password doesn't match"); + // return; + // } + // if (password.length < 8) { + // alert("Password minimum 8 character"); + // return; + // } + // data = { + // id, + // username, + // password, + // email, + // } + + closeDialog('edit', data); + } else { + + // data = { + // id, + // name: resourceName, + // username, + // employee_type: employeeType, + // phone_number: phoneNo, + // email, + // gender, + // birth_place: birthPlace, + // blood_type: bloodType, + // ktp_number: ktpNumber, + // biaya_per_jam: biayaPerJam.replace('.', ''), + // role_id: roleId, + // divisi_id: divisionId, + // address, + // status_resource: statusResource, + // status_boundary: statusRestriction, + // company_id: company_id + // } + + // if (birthDate && birthDate != "") { + // data['birth_date'] = birthDate; + // } + + closeDialog('edit', data); + } + } + + const handleCancel = () => { + closeDialog('cancel', 'none') + } + + const isValidEmail = (email) => { + const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; + return emailRegex.test(email); + }; + + const setupSelectRole = () => { + return ( + <> + {roleList.map((val, index) => { + return ( + + ) + })} + + ) + } + + + const renderFromCompany = () => { + return ( +
+ + + *required. + + +
+ ) + } + + + + const RenderTable = useMemo(() => { + const columns = [ + { title: t('nik'), dataIndex: 'ktp_number', key: 'ktp_number' }, + { title: t('nameHR'), dataIndex: 'name', key: 'name' }, + + { title: t('employeeType'), dataIndex: 'employee_type', key: 'employee_type' }, + { + title: t('roles'), + dataIndex: 'join_first_name', + key: 'join_first_name', + render: (text, record) => <>{record.join_first_name} + }, + { title: 'Phone No.', dataIndex: 'phone_number', key: 'phone_number' }, + { title: 'Email', dataIndex: 'email', key: 'email' }, + { title: 'Status', dataIndex: 'status_resource', key: 'status_status' } + // title: t('action'), + // dataIndex: '', + // key: 'x', + // render: (text, record) => <> + // + // + // + + // + // + // + // + // + // + // , + // }, + + // { title: "Number Registration", dataIndex: 'registration_no', key: 'registration_no' }, + // { title: "Name", dataIndex: 'company_name', key: 'company_name' }, + // { title: 'Phone No.', dataIndex: 'phone_no', key: 'phone_no' }, + // { title: 'Email', dataIndex: 'email', key: 'email' }, + // { title: 'Status', dataIndex: 'is_active', key: 'is_active', render: (text, record) => <>{text && text !== false ? "Active" : 'Inactive'} } + ]; + return ( + + ) + }, [dataTable]) + + return ( + <> + + + + {typeDialog === "Save" ? `Add` : typeDialog === "Set" ? "Manage Admin" : "Edit"} Company + {typeDialog === "Set" && ( + + + + )} + + + + {typeDialog !== "Set" && renderFromCompany()} + {typeDialog === "Set" && ( + <> + {RenderTable} + + + )} + + + + {typeDialog !== "Set" && ( + + )} + + + + + ) + +} +export default DialogForm; \ No newline at end of file diff --git a/src/views/Master/MasterCompany/DialogFormUser.js b/src/views/Master/MasterCompany/DialogFormUser.js new file mode 100644 index 0000000..d95e4a3 --- /dev/null +++ b/src/views/Master/MasterCompany/DialogFormUser.js @@ -0,0 +1,258 @@ +import React, { useState, useMemo } from 'react' +import { + Modal, ModalHeader, ModalBody, ModalFooter, + Button, Form, FormGroup, Label, Input, Col, Row, Card, CardBody, Fade +} from 'reactstrap'; +import { DatePicker, Table, Tooltip, Select, Input as InputAntd } from 'antd'; +import moment from 'moment'; +import 'antd/dist/antd.css'; +import { useTranslation } from 'react-i18next'; +const { Option } = Select +const DialogFormUser = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdit, roleList }) => { + const { t } = useTranslation() + + const [resourceName, setResourceName] = useState('') + const [username, setUsername] = useState('') + const [password, setPassword] = useState('') + const [retryPassword, setRetryPassword] = useState('') + const [employeeType, setEmployeeType] = useState('') + const [phoneNo, setPhoneNo] = useState('') + const [email, setEmail] = useState('') + const [gender, setGender] = useState('') + const [birthDate, setBirthDate] = useState('') + const [birthPlace, setBirthPlace] = useState('') + const [ktpNumber, setKtpNumber] = useState('') + const [roleId, setRoleId] = useState('') + const [address, setAddress] = useState('') + const [statusResource, setStatusResource] = useState('active') + const [statusRestriction, setStatusRestriction] = useState(false) + + + + const handleSave = () => { + let data = ''; + + if (typeDialog === "Save") { + data = { + // registration_no: registrationnumber, + // company_name: companyName, + // address: addressCompany, + // phone_no: phoneNumber, + // email: emailCompany, + // description: description, + // logo_login: logoLogin, + // logo_header: logoHeader, + // favicon_image: favIcon, + // login_instruction: loginInstruction, + // about: about, + // html_title: htmlTitle, + // app_name: appName, + // base_url: baseUrl, + // is_active: statusCompany, + // template_id: template + } + console.log(data) + + closeDialog('save', data); + } else if (typeDialog === "Set") { + // if (!password && password === "") { + // alert("Please fill password"); + // return; + // } + // if (password !== retryPassword) { + // alert("Password doesn't match"); + // return; + // } + // if (password.length < 8) { + // alert("Password minimum 8 character"); + // return; + // } + // data = { + // id, + // username, + // password, + // email, + // } + + closeDialog('edit', data); + } else { + + // data = { + // id, + // name: resourceName, + // username, + // employee_type: employeeType, + // phone_number: phoneNo, + // email, + // gender, + // birth_place: birthPlace, + // blood_type: bloodType, + // ktp_number: ktpNumber, + // biaya_per_jam: biayaPerJam.replace('.', ''), + // role_id: roleId, + // divisi_id: divisionId, + // address, + // status_resource: statusResource, + // status_boundary: statusRestriction, + // company_id: company_id + // } + + // if (birthDate && birthDate != "") { + // data['birth_date'] = birthDate; + // } + + closeDialog('edit', data); + } + } + + const handleCancel = () => { + closeDialog('cancel', 'none') + } + + const isValidEmail = (email) => { + const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; + return emailRegex.test(email); + }; + + const setupSelectRole = () => { + return ( + <> + {roleList.map((val, index) => { + return ( + + ) + })} + + ) + } + + + const renderFormSetAdmin = () => { + return ( +
+ + + *required. + + + + + + + setKtpNumber(e.target.value.replace(/[^0-9]/g, ''))} placeholder={t('inputNik')} maxLength="16" /> + + + + + + setResourceName(e.target.value)} placeholder={t('inputName')} /> + + + + + + + + + + + + + + + setPhoneNo(e.target.value.replace(/[^0-9]/g, ''))} placeholder={t('inputNoPhone')} maxLength="15" /> + + + + + + + + setEmail(e.target.value)} placeholder={t('inputEmail')} + onBlur={(e) => { + if (!isValidEmail(e.target.value)) { + alert("Masukkan email yang valid."); + } + }} + /> + + + + + + + + + + + + + + setBirthPlace(e.target.value)} placeholder={t('inputBrithPlace')} /> + + + + + + setBirthDate(date)} /> + + + + + + + + + + + + + + + + + + + + + setAddress(e.target.value)} placeholder={t('inputAddress')} /> + + + + + + ) + } + + return ( + <> + + + {typeDialog === "Save" ? `Add` : typeDialog === "Set" ? "Add " : "Edit"} User + + + {renderFormSetAdmin()} + + + {''} + + + + + ) + +} +export default DialogFormUser; \ No newline at end of file diff --git a/src/views/Master/MasterCompany/index.js b/src/views/Master/MasterCompany/index.js index b26057b..c3d692a 100644 --- a/src/views/Master/MasterCompany/index.js +++ b/src/views/Master/MasterCompany/index.js @@ -51,6 +51,7 @@ const MasterCompany = ({ params }) => { const [totalPage, setTotalPage] = useState(0) const [typeDialog, setTypeDialog] = useState('Save') const [typeDialogShift, setTypeDialogShift] = useState('Save') + const [companyID, setCompanyID] = useState('') const pageName = params.name; const { t } = useTranslation(); useEffect(() => { @@ -158,7 +159,7 @@ const MasterCompany = ({ params }) => { "columns": [ "id" ], - "ascending": false + "ascending": true } } @@ -310,6 +311,7 @@ const MasterCompany = ({ params }) => { } const handleSetWorker = async (data) => { + setCompanyID(data.id) await setDataEdit(data) handleOpenDialog('Set'); } @@ -434,7 +436,7 @@ const MasterCompany = ({ params }) => { - + , }, @@ -472,7 +474,7 @@ const MasterCompany = ({ params }) => { > {t('deleteMsg')} - {/* toggleAddDialog} @@ -481,24 +483,26 @@ const MasterCompany = ({ params }) => { clickOpenModal={clickOpenModal} roleList={roleList} divisiList={divisiList} - /> */} + companyID={companyID} + /> +

{pageName}

- + - + - + {/* - + */} diff --git a/src/views/Master/RoleProject/index.js b/src/views/Master/RoleProject/index.js index 0337895..d96c1d7 100644 --- a/src/views/Master/RoleProject/index.js +++ b/src/views/Master/RoleProject/index.js @@ -11,6 +11,7 @@ import { Pagination, Tooltip, Table } from 'antd'; import { withTranslation } from 'react-i18next'; const token = window.localStorage.getItem('token'); const company_id = localStorage.getItem("company_id") +const role_name = window.localStorage.getItem('role_name'); const BASE_URL = "http://siopas.co.id/custom-php/api/geohr/"; const config = { @@ -110,12 +111,19 @@ class index extends Component { "paging": { "start": start, "length": this.state.rowsPerPage }, "columns": [ { "name": "name", "logic_operator": "ilike", "value": this.state.search, "operator": "AND" }, - { "name": "company_id", "logic_operator": "=", "value": this.state.company_id, "operator": "AND" } ], "joins": [], "orders": { "columns": ["id"], "ascending": false } } - + if (role_name !== "Super Admin") { + formData.columns.push( + { "name": "company_id", "logic_operator": "=", "value": this.state.company_id, "operator": "AND" }, + ) + } else { + formData.columns.push( + { "name": "company_id", "logic_operator": "is null", "value": "", "operator": "AND" }, + ) + } const result = await axios .post(PROJECT_ROLE_SEARCH, formData, config) .then(res => res)