ordo
/
surveyor_indonesia_frontend
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge pull request 'dev-khaidir' (#70) from dev-khaidir into staging 

Reviewed-on: ibnu/generic-ospro-frontend#70
pull/1/head
farhantock 8 months ago
parent
d4d617c85e 17f2663f48
commit
1486b9c8f9
3 changed files with 750 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      src/routes.js
  2. 394
      src/views/Master/MasterWidget/index.js
  3. 352
      src/views/SimproV2/LimitasiUser/index.js

4
src/routes.js
Unescape View File

@ -61,6 +61,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 },
@ -129,6 +131,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 },
];

394
src/views/Master/MasterWidget/index.js
Unescape View File

@ -0,0 +1,394 @@
import * as XLSX from 'xlsx';
import React, { Component } from 'react';
import SweetAlert from 'react-bootstrap-sweetalert';
import axios from 'axios';
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, 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.props.t('action'),
dataIndex: '',
key: 'x',
className: 'nowrap',
render: (text, record) => <>
<Tooltip title={this.props.t('delete')}>
<i className="fa fa-trash" style={{ color: 'red', marginRight: 10, cursor: "pointer" }} onClick={() => this.handleDelete(text.id)}></i>
</Tooltip>
<Tooltip title={this.props.t('edit')}>
<i className="fa fa-edit" style={{ color: 'green', cursor: "pointer" }} onClick={() => this.handleEdit(text)}></i>
</Tooltip>
</>,
},
{
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' ? (
<span>{record.join_first_company_name}</span>
) : null;
}
},
{ title: this.props.t('name'), dataIndex: 'name', key: 'name', className: "nowrap" },
{ title: this.props.t('Alias Name'), dataIndex: 'aliasname', key: 'aliasname' },
{ title: this.props.t('Type Layout'), dataIndex: 'aliasname', key: 'aliasname' },
{ title: this.props.t('Master Data'), dataIndex: 'aliasname', key: 'aliasname' },
];
}
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 () => {
let start = 0;
if (this.state.currentPage !== 1 && this.state.currentPage > 1) {
start = (this.state.currentPage * this.state.rowsPerPage) - this.state.rowsPerPage
}
const formData = {
"paging": { "start": start, "length": this.state.rowsPerPage },
"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") {
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" },
)
formData.joins.push(
{ "name": "m_company", "column_join": "company_id", "column_results": ["company_name"] }
)
formData.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, formData, this.state.config)
.then(res => res)
.catch((error) => error.response);
if (result && result.data && result.data.code == 200) {
this.setState({ dataTable: result.data.data, totalPage: result.data.totalRecord });
} 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 (
<tr>
<td align="center" colSpan="3">{this.props.t('noData')}</td>
</tr>
)
}
}
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 (
<div>
<NotificationContainer />
<SweetAlert
show={this.state.alertDelete}
warning
showCancel
confirmBtnText="Delete"
confirmBtnBsStyle="danger"
title={this.props.t('deleteConfirm')}
onConfirm={this.onConfirmDelete}
onCancel={() => this.setState({ alertDelete: false, idDelete: 0 })}
focusCancelBtn
>
{this.props.t('deleteMsg')}
</SweetAlert>
<SweetAlert
show={this.state.alertNotDelete}
warning
confirmBtnText="Can't Delete"
confirmBtnBsStyle="danger"
title="Data can't be delete!"
onConfirm={() => this.setState({ alertNotDelete: false })}
>
Data project role tidak dapat di hapus!!
</SweetAlert>
<Card>
<CardHeader style={{ display: "flex", justifyContent: "space-between" }}>
<h4>{this.props.params.name}</h4>
<Row>
<Col>
<Input onChange={this.handleSearch} value={search} type="text" name="search" id="search" placeholder={this.props.t('search')} />
</Col>
<Col>
<Tooltip title={this.props.t('exportExcel')}>
<Button style={{ marginLeft: "5px" }} id="TooltipExport" color="primary" onClick={() => this.handleExportExcel()}><i className="fa fa-print"></i></Button>
</Tooltip>
</Col>
</Row>
</CardHeader>
<CardBody>
<Table
rowKey="id"
size="small"
columns={this.columns}
dataSource={dataTable}
pagination={false}
bordered={false}
/>
<Pagination
style={{ marginTop: "25px" }}
showSizeChanger
onShowSizeChange={this.onShowSizeChange}
onChange={this.onPagination}
defaultCurrent={currentPage}
pageSize={rowsPerPage}
total={totalPage}
pageSizeOptions={["10", "15", "20", "25", "30", "35", "40"]}
/>
</CardBody>
</Card>
</div>
)
}
}
export default withTranslation()(index);

352
src/views/SimproV2/LimitasiUser/index.js
Unescape View File

@ -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' ? (
<span>{record.join_first_company_name}</span>
) : 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 (
<tr>
<td align="center" colSpan="3">{this.props.t('noData')}</td>
</tr>
)
}
}
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 (
<div>
<NotificationContainer />
<SweetAlert
show={this.state.alertDelete}
warning
showCancel
confirmBtnText="Delete"
confirmBtnBsStyle="danger"
title={this.props.t('deleteConfirm')}
onConfirm={this.onConfirmDelete}
onCancel={() => this.setState({ alertDelete: false, idDelete: 0 })}
focusCancelBtn
>
{this.props.t('deleteMsg')}
</SweetAlert>
<SweetAlert
show={this.state.alertNotDelete}
warning
confirmBtnText="Can't Delete"
confirmBtnBsStyle="danger"
title="Data can't be delete!"
onConfirm={() => this.setState({ alertNotDelete: false })}
>
Data project role tidak dapat di hapus!!
</SweetAlert>
<Card>
<CardHeader style={{ display: "flex", justifyContent: "space-between" }}>
<h4>{this.props.params.name}</h4>
<Row>
<Col>
<Input onChange={this.handleSearch} value={search} type="text" name="search" id="search" placeholder={this.props.t('search')} />
</Col>
<Col>
<Tooltip title={this.props.t('exportExcel')}>
<Button style={{ marginLeft: "5px" }} id="TooltipExport" color="primary" onClick={() => this.handleExportExcel()}><i className="fa fa-print"></i></Button>
</Tooltip>
</Col>
</Row>
</CardHeader>
<CardBody>
<Table
rowKey="id"
size="small"
columns={this.columns}
dataSource={dataTable}
pagination={false}
bordered={false}
/>
<Pagination
style={{ marginTop: "25px" }}
showSizeChanger
onShowSizeChange={this.onShowSizeChange}
onChange={this.onPagination}
defaultCurrent={currentPage}
pageSize={rowsPerPage}
total={totalPage}
pageSizeOptions={["10", "15", "20", "25", "30", "35", "40"]}
/>
</CardBody>
</Card>
</div>
)
}
}
export default withTranslation()(index);
Write Preview
Loading…
Cancel
Save