From 69adde5b1638c09672e23bc479386619109b8e25 Mon Sep 17 00:00:00 2001 From: khaidralirahman Date: Wed, 20 Mar 2024 08:44:42 +0700 Subject: [PATCH] create limitasi user --- src/routes.js | 4 + src/views/SimproV2/LimitasiUser/index.js | 352 +++++++++++++++++++++++ 2 files changed, 356 insertions(+) create mode 100644 src/views/SimproV2/LimitasiUser/index.js diff --git a/src/routes.js b/src/routes.js index 71c45c6..103604a 100644 --- a/src/routes.js +++ b/src/routes.js @@ -60,6 +60,8 @@ const CompanyManagement = React.lazy(() => import('./views/Master/MasterCompany' const DemoRequest = React.lazy(() => import('./views/SimproV2/DemoRequest')) const ReferralCode = React.lazy(() => import('./views/SimproV2/ReferralCode')) const SalesContact = React.lazy(() => import('./views/SimproV2/SalesContact')) +const MasterWidget = React.lazy(() => import('./views/Master/MasterWidget')) +const LimitasiUser = React.lazy(() => import('./views/SimproV2/LimitasiUser')) const routes = [ { path: '/', exact: true, name: 'Home' }, { path: '/dashboard', name: 'DashboardBOD', component: DashboardBOD }, @@ -127,6 +129,8 @@ const routes = [ { path: '/demo-request', exact: true, name: 'Request Demo', component: DemoRequest }, { path: '/referral-code-management', exact: true, name: 'Referral Code Management', component: ReferralCode }, { path: '/sales-contact', exact: true, name: 'Sales Contact', component: SalesContact }, + { path: '/master-widget', exact: true, name: 'Master Widget', component: MasterWidget }, + { path: '/limitasi-user', exact: true, name: 'Limitasi User', component: LimitasiUser }, ]; diff --git a/src/views/SimproV2/LimitasiUser/index.js b/src/views/SimproV2/LimitasiUser/index.js new file mode 100644 index 0000000..0c837d5 --- /dev/null +++ b/src/views/SimproV2/LimitasiUser/index.js @@ -0,0 +1,352 @@ +import * as XLSX from 'xlsx'; +import React, { Component } from 'react'; +import SweetAlert from 'react-bootstrap-sweetalert'; +import axios from 'axios'; +import moment from 'moment'; +import { Button } from 'reactstrap'; +import { Card, CardBody, CardHeader, Col, Row, Input } from 'reactstrap'; +import { NotificationContainer, NotificationManager } from 'react-notifications'; +import { PROJECT_ROLE_ADD, PROJECT_ROLE_SEARCH, STORAGE_LIMIT_INFORMATION_ALL_COMPANY, PROJECT_ROLE_EDIT, PROJECT_ROLE_DELETE } from '../../../const/ApiConst.js'; +import { Pagination, Tooltip, Table } from 'antd'; +import { withTranslation } from 'react-i18next'; +const LENGTH_DATA = 10 +class index extends Component { + constructor(props) { + super(props); + this.state = { + alertDelete: false, + alertNotDelete: false, + currentPage: 1, + dataEdit: null, + dataExport: [], + dataGs: [], + dataIdHo: [], + dataTable: [], + idDelete: 0, + idRoles: 0, + menuRoles: [], + page: 0, + rowsPerPage: LENGTH_DATA, + search: "", + tooltipDelete: false, + tooltipEdit: false, + tooltipExport: false, + tooltipImport: false, + tooltipMenu: false, + tooltipTambah: false, + totalPage: 0, + company_id: props.company_id || 0, + role_name: props.role_name || '', + role_id: props.role_id || 0, + user_id: props.user_id || 0, + isLogin: props.isLogin || false, + token: props.token || '', + all_project: props.all_project || null, + hierarchy: props.hierarchy || [], + user_name: props.user_name || '', + config: { + headers: { + Authorization: `Bearer ${props.token || ''}`, + "Content-type": "application/json", + } + } + }; + + this.columns = [ + + { + title: this.state.role_name === 'Super Admin' ? "Company Name" : null, + dataIndex: "join_first_company_name", + key: "join_first_company_name", + render: (text, record) => { + return this.state.role_name === 'Super Admin' ? ( + {record.join_first_company_name} + ) : null; + } + }, + { title: this.props.t('Company'), dataIndex: 'company_name', key: 'company_name', className: "nowrap" }, + { + title: this.props.t('Expired'), + dataIndex: 'exp_ospro', + key: 'exp_ospro', + render: (text, record) => { + return text ? moment(text).format("D-M-YYYY HH:mm:ss") : '-'; + } + }, + { title: this.props.t('Storage'), dataIndex: 'size', key: 'size' }, + { title: this.props.t('Total Project'), dataIndex: 'project_total', key: 'project_total' }, + ]; + } + + async componentDidMount() { + this.getDataRoles(); + } + + async componentDidUpdate(prevProps, prevState) { + const { search } = this.state + if (search !== prevState.search) this.getDataRoles() + } + + handleSearch = e => { + const value = e.target.value + this.setState({ search: value, currentPage: 1 }) + }; + + getDataRoles = async () => { + const result = await axios + .get(STORAGE_LIMIT_INFORMATION_ALL_COMPANY, this.state.config) + .then(res => res) + .catch((error) => error.response); + + if (result) { + this.setState({ dataTable: result.data}); + } else { + NotificationManager.error('Gagal Mengambil Data!!', 'Failed'); + } + } + + + + onConfirmDelete = async () => { + const { idDelete } = this.state + const url = PROJECT_ROLE_DELETE(idDelete) + + const result = await axios.delete(url, this.state.config) + .then(res => res) + .catch((error) => error.response); + + if (result && result.data && result.data.code === 200) { + this.getDataRoles() + this.setState({ idDelete: 0, alertDelete: false }) + NotificationManager.success(`Data project role berhasil dihapus`, 'Success!!'); + } else { + this.setState({ idDelete: 0, alertDelete: false }) + NotificationManager.error(`Data project role gagal dihapus`, 'Failed!!'); + } + } + + saveRole = async (data) => { + + const formData = { + name: data.name, + description: data.description, + company_id: data.company_id + } + + const result = await axios.post(PROJECT_ROLE_ADD, formData, this.state.config) + .then(res => res) + .catch((error) => error.response); + + if (result && result.data && result.data.code === 200) { + this.getDataRoles(); + NotificationManager.success(`Data project role berhasil ditambah`, 'Success!!'); + } else { + NotificationManager.error(`${result.data.message}`, 'Failed!!'); + } + + } + + editRole = async (data) => { + + const formData = { + name: data.name, + description: data.description, + company_id : data.company_id + } + const url = PROJECT_ROLE_EDIT(data.id) + const result = await axios.put(url, formData, this.state.config) + .then(res => res) + .catch((error) => error.response); + + if (result && result.data && result.data.code === 200) { + this.getDataRoles(); + NotificationManager.success(`Data project role berhasil diedit`, 'Success!!'); + } else { + NotificationManager.error(`Data project role gagal di edit`, `Failed!!`); + } + + } + + + handleEdit = (data) => { + this.setState({ dataEdit: data }); + } + + handleDelete = (id) => { + id == '1' ? this.setState({ alertNotDelete: true }) : + this.setState({ alertDelete: true, idDelete: id }); + } + + onShowSizeChange = (current, pageSize) => { + this.setState({ rowsPerPage: pageSize }, () => { + this.getDataRoles(); + }) + } + + onPagination = (current, pageSize) => { + this.setState({ currentPage: current, page: (current - 1) * pageSize }, () => { + this.getDataRoles(); + }) + } + + toggle = (param) => { + if (param === "edit") { + this.setState(prevState => ({ tooltipEdit: !prevState.tooltipEdit })) + } else if (param === "delete") { + this.setState(prevState => ({ tooltipDelete: !prevState.tooltipDelete })) + } else if (param === "menu") { + this.setState(prevState => ({ tooltipMenu: !prevState.tooltipMenu })) + } else if (param === "tambah") { + this.setState(prevState => ({ tooltipTambah: !prevState.tooltipTambah })) + } else if (param === "export") { + this.setState(prevState => ({ tooltipExport: !prevState.tooltipExport })) + } + } + + dataNotAvailable = () => { + if (this.state.dataTable.length === 0) { + return ( + + {this.props.t('noData')} + + ) + } + } + + handleExportExcel = async () => { + const payload = { + "paging": { "start": 0, "length": -1 }, + "columns": [], + "group_column": { + "operator": "AND", + "group_operator": "OR", + "where": [ + { + "name": "name", + "logic_operator": "~*", + "value": this.state.search, + } + ] + }, + "joins": [], + "orders": { "columns": ["id"], "ascending": false } + } + if (this.state.role_name !== "Super Admin") { + payload.columns.push( + { "name": "company_id", "logic_operator": "=", "value": this.state.company_id, "operator": "AND" }, + ) + } else { + payload.columns.push( + { "name": "company_id", "logic_operator": "is null", "value": "", "operator": "AND" }, + ) + payload.joins.push( + { "name": "m_company", "column_join": "company_id", "column_results": ["company_name"] } + ) + payload.group_column.where.push( + { name: "company_name", logic_operator: "~*", value: this.state.search, table_name: "m_company" } + ) + } + const result = await axios + .post(PROJECT_ROLE_SEARCH, payload, this.state.config) + .then(res => res) + .catch((error) => error.response); + if (result && result.data && result.statusText == "OK") { + const dataRes = result.data.data || []; + const dataExport = []; + dataRes.map((val, index) => { + let row = {}; + if (this.state.role_name === 'Super Admin') { + row.Company = val.join_first_company_name; + } + row.Nama = val.name; + row.Deskripsi = val.description; + dataExport.push(row); + }) + this.setState({ dataExport: dataExport }, () => { + this.exportExcel(); + }); + } else { + NotificationManager.error('Failed retreiving data!!', 'Failed'); + } + } + + exportExcel = () => { + const dataExcel = this.state.dataExport || []; + const fileName = "Data Project Role.xlsx"; + const ws = XLSX.utils.json_to_sheet(dataExcel); + const wb = XLSX.utils.book_new(); + XLSX.utils.book_append_sheet(wb, ws, 'Data Project Role'); + XLSX.writeFile(wb, fileName); + } + + render() { + const { t } = this.props; + const { tooltipTambah, tooltipExport, dialogMenuForm, dataTable, openDialog, currentPage, rowsPerPage, totalPage, search, tooltipEdit, tooltipDelete, tooltipMenu } = this.state + let noSeq = 0; + return ( +
+ + this.setState({ alertDelete: false, idDelete: 0 })} + focusCancelBtn + > + {this.props.t('deleteMsg')} + + this.setState({ alertNotDelete: false })} + > + Data project role tidak dapat di hapus!! + + + +

{this.props.params.name}

+ + + + + + + + + + + + + + + + + + + ) + } +} +export default withTranslation()(index);