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

Merge branch 'staging' of https://git.oslog.id/ordo/adw-frontend into dev-wahyun

pull/2/head
wahyuun 11 months ago
parent
86e1bf92f1 01cd86be68
commit
dc2be0322c
6 changed files with 1001 additions and 589 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 63
      src/views/Master/MasterRoles/DialogForm.js
  2. 468
      src/views/Master/MasterRoles/DialogMenuRoles.js
  3. 6
      src/views/Master/MasterRoles/index.js
  4. 739
      src/views/Pages/Login/Login.js
  5. 284
      src/views/SimproV2/CreatedProyek/ReportAnalysis.js
  6. 30
      src/views/SimproV2/CreatedProyek/index.js

63
src/views/Master/MasterRoles/DialogForm.js
Unescape View File

@ -3,6 +3,19 @@ import { Modal, ModalHeader, ModalBody, ModalFooter, Row, Col } from 'reactstrap
import { Button, Form, FormGroup, Label, Input } from 'reactstrap'; import { Button, Form, FormGroup, Label, Input } from 'reactstrap';
import 'antd/dist/antd.css'; import 'antd/dist/antd.css';
import { withTranslation } from 'react-i18next'; import { withTranslation } from 'react-i18next';
import axios from 'axios';
import { Select } from 'antd';
import { MENU_SEARCH } from '../../../const/ApiConst.js';
const { Option } = Select
const token = window.localStorage.getItem('token');
const config = {
headers:
{
Authorization: `Bearer ${token}`,
"Content-type": `application/json`
}
};
class DialogForm extends Component { class DialogForm extends Component {
constructor(props) { constructor(props) {
@ -13,11 +26,14 @@ class DialogForm extends Component {
description: "", description: "",
openDialog: false, openDialog: false,
isParentClick: false, isParentClick: false,
menu: [],
selectedMenu: null
} }
} }
async componentDidMount() { async componentDidMount() {
this.props.showDialog(this.showDialog); this.props.showDialog(this.showDialog);
this.getAllMenu();
} }
async componentDidUpdate() { async componentDidUpdate() {
@ -27,19 +43,38 @@ class DialogForm extends Component {
this.setState({ this.setState({
id: dataEdit.id, id: dataEdit.id,
name: dataEdit.name, name: dataEdit.name,
description: dataEdit.description description: dataEdit.description,
selectedMenu: dataEdit.default_page
}) })
} else { } else {
this.setState({ this.setState({
id: 0, id: 0,
name: "", name: "",
description: "" description: "",
selectedMenu: null
}) })
} }
this.setState({ isParentClick: false }); this.setState({ isParentClick: false });
} }
} }
getAllMenu = async () => {
const payload = {
"paging": { "start": 0, "length": -1 },
"columns": [
{ "name": "name", "logic_operator": "ilike", "value": "", "operator": "AND" }
],
"joins": [],
"orders": { "columns": ["id"], "ascending": false }
}
const result = await axios
.post(MENU_SEARCH, payload, config)
.then(res => res)
.catch((error) => error.response);
if (result && result.data && result.data.code == 200) {
this.setState({ menu: result.data.data });
}
}
showDialog = () => { showDialog = () => {
this.setState({ isParentClick: true }); this.setState({ isParentClick: true });
@ -60,7 +95,8 @@ class DialogForm extends Component {
const { const {
id, id,
name, name,
description description,
selectedMenu
} = this.state } = this.state
let data = ''; let data = '';
@ -70,14 +106,16 @@ class DialogForm extends Component {
data = { data = {
id, id,
name, name,
description description,
selectedMenu
} }
this.props.closeDialog('save', data); this.props.closeDialog('save', data);
} else { } else {
data = { data = {
id, id,
name, name,
description description,
selectedMenu
} }
this.props.closeDialog('edit', data); this.props.closeDialog('edit', data);
} }
@ -113,6 +151,21 @@ class DialogForm extends Component {
<Input type="text" value={this.state.description} onChange={(e) => this.setState({ description: e.target.value })} placeholder={this.props.t('inputDescription')} /> <Input type="text" value={this.state.description} onChange={(e) => this.setState({ description: e.target.value })} placeholder={this.props.t('inputDescription')} />
</FormGroup> </FormGroup>
</Col> </Col>
<Col md={12}>
<FormGroup>
<Label>Default Page<span style={{ color: "red" }}>*</span></Label>
<Input type="select" value={this.state.selectedMenu} placeholder={"Select default page"}
onChange={(e) => {
this.setState({ selectedMenu: e.target.value });
}}>
{this.state.menu.map((item) => (
<option key={item.id} value={item.id}>
{item.name}
</option>
))}
</Input>
</FormGroup>
</Col>
</Row> </Row>
</Form> </Form>
) )

468
src/views/Master/MasterRoles/DialogMenuRoles.js
Unescape View File

@ -1,234 +1,234 @@
import React, { Component } from 'react' import React, { Component } from 'react'
import { Modal, ModalHeader, ModalBody, ModalFooter, Row, Col, Table } from 'reactstrap'; import { Modal, ModalHeader, ModalBody, ModalFooter, Row, Col, Table } from 'reactstrap';
import { Button, Form, FormGroup, Label, Input } from 'reactstrap'; import { Button, Form, FormGroup, Label, Input } from 'reactstrap';
import 'antd/dist/antd.css'; import 'antd/dist/antd.css';
import axios from 'axios'; import axios from 'axios';
import { MENU_SEARCH } from '../../../const/ApiConst.js'; import { MENU_SEARCH } from '../../../const/ApiConst.js';
import { withTranslation, WithTranslation } from 'react-i18next'; import { withTranslation, WithTranslation } from 'react-i18next';
const BASE_URL = "http://siopas.co.id/custom-php/api/geohr/"; const BASE_URL = "http://siopas.co.id/custom-php/api/geohr/";
const token = window.localStorage.getItem('token'); const token = window.localStorage.getItem('token');
const config = { const config = {
headers: headers:
{ {
Authorization: `Bearer ${token}`, Authorization: `Bearer ${token}`,
"Content-type": `application/json` "Content-type": `application/json`
} }
}; };
class DialogMenuRoles extends Component { class DialogMenuRoles extends Component {
constructor(props) { constructor(props) {
super(props) super(props)
this.state = { this.state = {
id: 0, id: 0,
name: "", name: "",
description: "", description: "",
openDialog: false, openDialog: false,
isParentClick: false, isParentClick: false,
menu: [], menu: [],
stateMenu: [], stateMenu: [],
allChecked: true, allChecked: true,
} }
} }
async componentDidMount() { async componentDidMount() {
this.props.showDialog(this.showDialog); this.props.showDialog(this.showDialog);
this.getAllMenu(); this.getAllMenu();
} }
async componentDidUpdate() { async componentDidUpdate() {
if (this.state.isParentClick === true) { if (this.state.isParentClick === true) {
const { idRoles } = this.props const { idRoles } = this.props
this.setStateMenu(true); this.setStateMenu(true);
this.setState({ isParentClick: false, id: idRoles }); this.setState({ isParentClick: false, id: idRoles });
} }
} }
showDialog = () => { showDialog = () => {
this.setState({ isParentClick: true }); this.setState({ isParentClick: true });
} }
getAllMenu = async () => { getAllMenu = async () => {
const payload = { const payload = {
"paging": { "start": 0, "length": -1 }, "paging": { "start": 0, "length": -1 },
"columns": [ "columns": [
{ "name": "name", "logic_operator": "ilike", "value": "", "operator": "AND" } { "name": "name", "logic_operator": "ilike", "value": "", "operator": "AND" }
], ],
"joins": [], "joins": [],
"orders": { "columns": ["id"], "ascending": false } "orders": { "columns": ["id"], "ascending": false }
} }
const result = await axios const result = await axios
.post(MENU_SEARCH, payload, config) .post(MENU_SEARCH, payload, config)
.then(res => res) .then(res => res)
.catch((error) => error.response); .catch((error) => error.response);
if (result && result.data && result.data.code == 200) { if (result && result.data && result.data.code == 200) {
this.setState({ menu: result.data.data }, () => { this.setState({ menu: result.data.data }, () => {
this.setStateMenu(false); this.setStateMenu(false);
}); });
} else { } else {
} }
} }
setStateMenu = edit => { setStateMenu = edit => {
const stateMenu = []; const stateMenu = [];
this.state.menu.map((val) => { this.state.menu.map((val) => {
stateMenu.push(false); stateMenu.push(false);
}) })
this.setState({ stateMenu: [] }, () => { this.setState({ stateMenu: [] }, () => {
this.setState({ stateMenu: stateMenu }, () => { this.setState({ stateMenu: stateMenu }, () => {
if (edit) { if (edit) {
this.checkMenuRoles(); this.checkMenuRoles();
} }
}) })
}) })
} }
checkMenuRoles = () => { checkMenuRoles = () => {
let copyStateMenu = [...this.state.stateMenu]; let copyStateMenu = [...this.state.stateMenu];
this.props.menuRoles.map((val, indexMenu) => { this.props.menuRoles.map((val, indexMenu) => {
let index = this.getIndexDataMenu(val.menu_id); let index = this.getIndexDataMenu(val.menu_id);
console.log("index true", val.menu_id); console.log("index true", val.menu_id);
if (index >= 0) { if (index >= 0) {
copyStateMenu[index] = true; copyStateMenu[index] = true;
} }
}) })
this.setState({ stateMenu: [] }, () => { this.setState({ stateMenu: [] }, () => {
let check = copyStateMenu.some(this.checkArray); let check = copyStateMenu.some(this.checkArray);
if (check === false) { if (check === false) {
this.setState({ allChecked: true, stateMenu: copyStateMenu }) this.setState({ allChecked: true, stateMenu: copyStateMenu })
} else { } else {
this.setState({ allChecked: false, stateMenu: copyStateMenu }) this.setState({ allChecked: false, stateMenu: copyStateMenu })
} }
}) })
} }
getIndexDataMenu = (id) => { getIndexDataMenu = (id) => {
let index = this.state.menu.findIndex(obj => obj.id === id); let index = this.state.menu.findIndex(obj => obj.id === id);
return index return index
} }
handleSave = () => { handleSave = () => {
const { const {
stateMenu, stateMenu,
menu, menu,
id id
} = this.state } = this.state
const arrayData = []; const arrayData = [];
menu.map((val, index) => { menu.map((val, index) => {
let data = { let data = {
roles_id: id, roles_id: id,
menu_id: val.id, menu_id: val.id,
checked: stateMenu[index] checked: stateMenu[index]
} }
arrayData.push(data); arrayData.push(data);
}) })
this.props.closeDialog('save', arrayData); this.props.closeDialog('save', arrayData);
this.setState({ id: 0 }); this.setState({ id: 0 });
} }
handleCancel = () => { handleCancel = () => {
this.props.closeDialog('cancel', 'none') this.props.closeDialog('cancel', 'none')
} }
handleChangeCheckbox = (checked, index) => { handleChangeCheckbox = (checked, index) => {
let copyStateMenu = [...this.state.stateMenu]; let copyStateMenu = [...this.state.stateMenu];
copyStateMenu[index] = checked; copyStateMenu[index] = checked;
console.log("cek uncek", copyStateMenu); console.log("cek uncek", copyStateMenu);
this.setState({ stateMenu: copyStateMenu }) this.setState({ stateMenu: copyStateMenu })
} }
renderForm = () => { renderForm = () => {
const { menu, stateMenu } = this.state const { menu, stateMenu } = this.state
return ( return (
menu.map((val, index) => { menu.map((val, index) => {
return ( return (
<tr key={index}> <tr key={index}>
<td>{val.name}</td> <td>{val.name}</td>
<td><input type="checkbox" onClick={(e) => this.handleChangeCheckbox(e.target.checked, index)} defaultChecked={stateMenu[index]} /></td> <td><input type="checkbox" onClick={(e) => this.handleChangeCheckbox(e.target.checked, index)} defaultChecked={stateMenu[index]} /></td>
</tr> </tr>
) )
}) })
) )
} }
checkArray = (val) => { checkArray = (val) => {
return val === false; return val === false;
} }
handleAllChecked = (checked) => { handleAllChecked = (checked) => {
this.setState({ allChecked: !this.state.allChecked }); this.setState({ allChecked: !this.state.allChecked });
if (checked === true) { if (checked === true) {
console.log("test 1") console.log("test 1")
let check = this.state.stateMenu.some(this.checkArray); let check = this.state.stateMenu.some(this.checkArray);
if (check) { if (check) {
const stateMenu = []; const stateMenu = [];
this.state.menu.map((val) => { this.state.menu.map((val) => {
stateMenu.push(true); stateMenu.push(true);
}) })
this.setState({ stateMenu: [] }, () => { this.setState({ stateMenu: [] }, () => {
this.setState({ stateMenu: stateMenu }); this.setState({ stateMenu: stateMenu });
}) })
} }
} else { } else {
console.log("test 1 2 3 ") console.log("test 1 2 3 ")
const stateMenu = []; const stateMenu = [];
this.state.menu.map((val) => { this.state.menu.map((val) => {
stateMenu.push(false); stateMenu.push(false);
}) })
this.setState({ stateMenu: [] }, () => { this.setState({ stateMenu: [] }, () => {
this.setState({ stateMenu: stateMenu }); this.setState({ stateMenu: stateMenu });
}) })
} }
} }
render() { render() {
return ( return (
<Modal scrollable={true} isOpen={this.props.openDialog} toggle={this.props.toggleDialog}> <Modal scrollable={true} isOpen={this.props.openDialog} toggle={this.props.toggleDialog}>
<ModalHeader toggle={this.props.closeDialog}>{this.props.t('menuRoles')}</ModalHeader> <ModalHeader toggle={this.props.closeDialog}>{this.props.t('menuRoles')}</ModalHeader>
<ModalBody> <ModalBody>
<Form> <Form>
<Table> <Table>
<thead> <thead>
<tr> <tr>
<th>Menu</th> <th>Menu</th>
<th> <th>
T/F T/F
</th> </th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
<tr> <tr>
<td>All</td> <td>All</td>
<td><input type="checkbox" onChange={(e) => this.handleAllChecked(e.target.checked)} checked={this.state.allChecked} /></td> <td><input type="checkbox" onChange={(e) => this.handleAllChecked(e.target.checked)} checked={this.state.allChecked} /></td>
</tr> </tr>
{this.renderForm()} {this.renderForm()}
</tbody> </tbody>
</Table> </Table>
</Form> </Form>
</ModalBody> </ModalBody>
<ModalFooter> <ModalFooter>
<Button color="primary" onClick={() => this.handleSave()}>{this.props.t('save')}</Button>{' '} <Button color="primary" onClick={() => this.handleSave()}>{this.props.t('save')}</Button>{' '}
<Button color="secondary" onClick={() => this.handleCancel()}>{this.props.t('cancel')}</Button> <Button color="secondary" onClick={() => this.handleCancel()}>{this.props.t('cancel')}</Button>
</ModalFooter> </ModalFooter>
</Modal> </Modal>
) )
} }
} }
export default withTranslation()(DialogMenuRoles); export default withTranslation()(DialogMenuRoles);

6
src/views/Master/MasterRoles/index.js
Unescape View File

@ -179,7 +179,8 @@ class index extends Component {
const formData = { const formData = {
name: data.name, name: data.name,
description: data.description description: data.description,
default_page : data.selectedMenu
} }
const result = await axios.post(ROLE_ADD, formData, config) const result = await axios.post(ROLE_ADD, formData, config)
@ -198,7 +199,8 @@ class index extends Component {
editRole = async (data) => { editRole = async (data) => {
const formData = { const formData = {
name: data.name, name: data.name,
description: data.description description: data.description,
default_page: data.selectedMenu
} }
const url = ROLE_EDIT(data.id) const url = ROLE_EDIT(data.id)
const result = await axios.put(url, formData, config) const result = await axios.put(url, formData, config)

739
src/views/Pages/Login/Login.js
Unescape View File

@ -1,347 +1,392 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import "slick-carousel/slick/slick.css"; import "slick-carousel/slick/slick.css";
import "slick-carousel/slick/slick-theme.css"; import "slick-carousel/slick/slick-theme.css";
import Slider from "react-slick"; import Slider from "react-slick";
import { Spin } from 'antd'; import { Spin } from 'antd';
import { Checkbox } from 'antd'; import { Checkbox } from 'antd';
import { LoadingOutlined, EyeOutlined, EyeInvisibleOutlined } from '@ant-design/icons'; import { LoadingOutlined, EyeOutlined, EyeInvisibleOutlined } from '@ant-design/icons';
import { import {
Button, Button,
Card, Card,
CardBody, CardBody,
CardGroup, CardGroup,
Col, Col,
Container, Container,
Form, Form,
Input, Input,
InputGroup, InputGroup,
InputGroupAddon, InputGroupAddon,
InputGroupText, InputGroupText,
Row, Row,
UncontrolledAlert, UncontrolledAlert,
Alert, Alert,
Carousel, Carousel,
CarouselIndicators, CarouselIndicators,
CarouselCaption, CarouselCaption,
CarouselItem, CarouselItem,
CarouselControl CarouselControl
} from 'reactstrap'; } from 'reactstrap';
import { USER_LOGIN, USER_LOGIN_V2, CALERTUSER_SEARCH, MENU_MANAGEMENT, APP_MODE } from '../../../const/ApiConst.js'; import { USER_LOGIN, USER_LOGIN_V2, CALERTUSER_SEARCH, MENU_MANAGEMENT, APP_MODE, ROLE_SEARCH } from '../../../const/ApiConst.js';
import { appConfig, reloadConstants } from '../../../const/MapConst.js'; import { appConfig, reloadConstants } from '../../../const/MapConst.js';
import { APP_NAME } from '../../../const/AppConst.js' import { APP_NAME } from '../../../const/AppConst.js'
import moment from "moment" import moment from "moment"
import axios from 'axios'; import axios from 'axios';
import { NotificationContainer, NotificationManager } from 'react-notifications'; import { NotificationContainer, NotificationManager } from 'react-notifications';
import logo_login_adw from '../../../assets/img/logo_adyawinsa.jpg' import logo_login_adw from '../../../assets/img/logo_adyawinsa.jpg'
import logo_login_kit from '../../../assets/img/logo_kit.png' import logo_login_kit from '../../../assets/img/logo_kit.png'
import logo_login_nawakara from '../../../assets/img/logo_nawakara.png' import logo_login_nawakara from '../../../assets/img/logo_nawakara.png'
import logo_login_si from '../../../assets/img/logo-surveyor-indonesia.png' import logo_login_si from '../../../assets/img/logo-surveyor-indonesia.png'
const antIcon = <LoadingOutlined style={{ fontSize: 24 }} spin />; const antIcon = <LoadingOutlined style={{ fontSize: 24 }} spin />;
const settings = { const settings = {
dots: true, dots: true,
infinite: true, infinite: true,
speed: 500, speed: 500,
arrows: false, arrows: false,
autoplay: true, autoplay: true,
slidesToShow: 1, slidesToShow: 1,
slidesToScroll: 1 slidesToScroll: 1
}; };
class Login extends Component { class Login extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
name: '', name: '',
password: '', password: '',
remember: '', remember: '',
alertVisible: false, alertVisible: false,
alertMessage: '', alertMessage: '',
alertColor: 'success', alertColor: 'success',
validate: { validate: {
emailState: '', emailState: '',
}, },
loader: false, loader: false,
type: 'password' type: 'password',
} defaultPage: ''
this.handleChange = this.handleChange.bind(this); }
this.showHide = this.showHide.bind(this); this.handleChange = this.handleChange.bind(this);
} this.showHide = this.showHide.bind(this);
showHide(e) { }
e.preventDefault(); showHide(e) {
e.stopPropagation(); e.preventDefault();
this.setState({ e.stopPropagation();
type: this.state.type === 'input' ? 'password' : 'input' this.setState({
}) type: this.state.type === 'input' ? 'password' : 'input'
} })
validateEmail(e) { }
const emailRex = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; validateEmail(e) {
const { validate } = this.state const emailRex = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
if (emailRex.test(e.target.value)) { const { validate } = this.state
validate.emailState = 'has-success' if (emailRex.test(e.target.value)) {
} else { validate.emailState = 'has-success'
validate.emailState = 'has-danger' } else {
} validate.emailState = 'has-danger'
this.setState({ validate }) }
} this.setState({ validate })
}
handleChange = async (event) => {
const { target } = event; handleChange = async (event) => {
const value = target.type === 'checkbox' ? target.checked : target.value; const { target } = event;
const { name } = target; const value = target.type === 'checkbox' ? target.checked : target.value;
await this.setState({ const { name } = target;
[name]: value, await this.setState({
}); [name]: value,
} });
}
getDataMenu = async (token, role_id) => {
const config = { getDataRole = async (token, role_id) => {
headers: const config = {
{ headers:
Authorization: `Bearer ${token}`, {
"Content-type": `application/json` Authorization: `Bearer ${token}`,
} "Content-type": `application/json`
}; }
};
let url = MENU_MANAGEMENT(role_id)
const result = await axios const payload = {
.get(url, config) "paging": { "start": 0, "length": -1 },
.then(res => res) "columns": [
.catch((error) => error.response); { "name": "id", "logic_operator": "=", "value": `${role_id}`, "operator": "AND" }
],
if (result && result.data && result.data.code == 200) { "joins": [
let resData = result.data.data {
window.localStorage.setItem('menu_login', JSON.stringify(resData)); "name": "m_menu",
this.setState({ loader: false }) "column_join": "default_page",
// custom redirect home after login "column_results": ["id", "name", "url"],
if (role_id == 28) { },
this.props.history.push("/dashboard-customer/58/63"); ],
} "orders": { "columns": ["id"], "ascending": false }
else { }
this.props.history.push("/dashboard");
} const result = await axios
} else { .post(ROLE_SEARCH, payload, config)
NotificationManager.error('Login Failed', 'Failed'); .then(res => res)
this.setState({ loader: false }) .catch((error) => error.response);
}
} if (result && result.data && result.data.code == 200) {
let resData = result.data.data
submitForm = (event) => { this.setState({defaultPage: resData[0].join_first_url})
event.preventDefault(); }
this.submitFormLogin(); }
}
getDataMenu = async (token, role_id) => {
submitFormLogin = async () => { const config = {
this.setState({ loader: true }) headers:
const { name, password, remember } = this.state {
Authorization: `Bearer ${token}`,
if (name === '') { "Content-type": `application/json`
NotificationManager.error('Please fill username', 'Login Failed!'); }
this.setState({ loader: false }) };
return false;
} let url = MENU_MANAGEMENT(role_id)
const result = await axios
if (password === '') { .get(url, config)
NotificationManager.error('Please fill password', 'Login Failed!'); .then(res => res)
this.setState({ loader: false }) .catch((error) => error.response);
return false;
} if (result && result.data && result.data.code == 200) {
let resData = result.data.data
let formData = { window.localStorage.setItem('menu_login', JSON.stringify(resData));
username: name, this.setState({ loader: false })
password, // custom redirect home after login
remember, if (role_id == 28) {
} this.props.history.push("/dashboard-customer/58/63");
}
const doLogin = await axios.post(USER_LOGIN_V2, formData) else {
.then(response => response) this.props.history.push("/dashboard");
.catch(error => { }
this.setState({ loader: false }); if (this.state.defaultPage) {
}); this.props.history.push(this.state.defaultPage);
} else if (role_id == 28) {
if (doLogin && doLogin.data && doLogin.data.code === 200) { this.props.history.push("/dashboard-customer/58/63");
const { access_token, data_user } = doLogin.data.data }
this.getDataMenu(access_token, data_user.role_id) else {
window.localStorage.setItem('isLogin', true); this.props.history.push("/dashboard");
window.localStorage.setItem('token', access_token); }
window.localStorage.setItem('user_id', data_user.id); } else {
window.localStorage.setItem('user_name', data_user.name); NotificationManager.error('Login Failed', 'Failed');
window.localStorage.setItem('role_id', data_user.role_id); this.setState({ loader: false })
} else { }
console.log("kode : ", doLogin.data.code); }
// NotificationManager.error('Cek username atau password anda!', 'Gagal Login!');
NotificationManager.error(doLogin.data.message, 'Login Failed!'); submitForm = (event) => {
this.setState({ loader: false }); event.preventDefault();
} this.submitFormLogin();
}
}
submitFormLogin = async () => {
getConfigAlert = async (token, user_id) => { this.setState({ loader: true })
const config = { const { name, password, remember } = this.state
headers:
{ if (name === '') {
Authorization: `Bearer ${token}`, NotificationManager.error('Please fill username', 'Login Failed!');
"Content-type": `application/json` this.setState({ loader: false })
} return false;
}; }
const payload = { if (password === '') {
"paging": { "start": 0, "length": -1 }, NotificationManager.error('Please fill password', 'Login Failed!');
"columns": [ this.setState({ loader: false })
{ "name": "user_id", "logic_operator": "=", "value": `${user_id}`, "operator": "AND" } return false;
], }
"joins": [],
"orders": { "columns": ["id"], "ascending": false } let formData = {
} username: name,
password,
const result = await axios remember,
.post(CALERTUSER_SEARCH, payload, config) }
.then(res => res)
.catch((error) => error.response); const doLogin = await axios.post(USER_LOGIN_V2, formData)
.then(response => response)
if (result && result.data && result.data.code == 200) { .catch(error => {
let resData = result.data.data this.setState({ loader: false });
let configAlert = [] });
resData.map((val, index) => {
configAlert.push(val.config_alert_id); if (doLogin && doLogin.data && doLogin.data.code === 200) {
}); const { access_token, data_user } = doLogin.data.data
window.localStorage.setItem('userConfigAlert', configAlert.join()); this.getDataRole(access_token, data_user.role_id)
} this.getDataMenu(access_token, data_user.role_id)
} window.localStorage.setItem('isLogin', true);
window.localStorage.setItem('token', access_token);
onShowAlert = (alertColor, alertMessage) => { window.localStorage.setItem('user_id', data_user.id);
this.setState({ alertVisible: true, alertColor: alertColor, alertMessage: alertMessage }, () => { window.localStorage.setItem('user_name', data_user.name);
window.setTimeout(() => { window.localStorage.setItem('role_id', data_user.role_id);
this.setState({ alertVisible: false }) } else {
}, 3000) console.log("kode : ", doLogin.data.code);
}); // NotificationManager.error('Cek username atau password anda!', 'Gagal Login!');
} NotificationManager.error(doLogin.data.message, 'Login Failed!');
this.setState({ loader: false });
getLoginLogo = () => { }
return <div style={{ textAlign: 'center' }}><img style={{ width: '100%' }} src={logo_login_adw} /></div>
} }
getLoginSlider = () => { getConfigAlert = async (token, user_id) => {
return <Slider {...settings} > const config = {
<div> headers:
<img src={require('../../../assets/img/login/slide1.jpg')} className="img-avatar" /> {
</div> Authorization: `Bearer ${token}`,
<div> "Content-type": `application/json`
<img src={require('../../../assets/img/login/slide2.jpg')} className="img-avatar" /> }
</div> };
<div>
<img src={require('../../../assets/img/login/slide3.jpg')} className="img-avatar" /> const payload = {
</div> "paging": { "start": 0, "length": -1 },
<div> "columns": [
<img src={require('../../../assets/img/login/slide4.jpg')} className="img-avatar" /> { "name": "user_id", "logic_operator": "=", "value": `${user_id}`, "operator": "AND" }
</div> ],
</Slider> "joins": [],
} "orders": { "columns": ["id"], "ascending": false }
}
onChecked = (e) => {
this.setState({ remember: e.target.checked }) const result = await axios
}; .post(CALERTUSER_SEARCH, payload, config)
.then(res => res)
render() { .catch((error) => error.response);
const { name, password, remember } = this.state;
const u_group = window.localStorage.getItem('u_group') if (result && result.data && result.data.code == 200) {
if (u_group !== null) { let resData = result.data.data
this.props.history.push("/dashboard"); let configAlert = []
} resData.map((val, index) => {
return ( configAlert.push(val.config_alert_id);
<div className="app flex-row align-items-center"> });
<Container> window.localStorage.setItem('userConfigAlert', configAlert.join());
<NotificationContainer /> }
}
<Alert color={this.state.alertColor} isOpen={this.state.alertVisible} >
{this.state.alertMessage} onShowAlert = (alertColor, alertMessage) => {
</Alert> this.setState({ alertVisible: true, alertColor: alertColor, alertMessage: alertMessage }, () => {
<Row className="justify-content-center"> window.setTimeout(() => {
<Col md="7"> this.setState({ alertVisible: false })
{this.getLoginSlider()} }, 3000)
</Col> });
<Col md="5"> }
<div style={{
boxShadow: '1px 1px 11px 1px rgba(221,211,211,0.75)' getLoginLogo = () => {
}}> return <div style={{ textAlign: 'center' }}><img style={{ width: '100%' }} src={logo_login_adw} /></div>
<CardGroup> }
<Card className="p-4">
<CardBody> getLoginSlider = () => {
<Form onSubmit={this.submitForm}> return <Slider {...settings} >
{this.getLoginLogo()} <div>
<p className="text-muted">Sign In to your account</p> <img src={require('../../../assets/img/login/slide1.jpg')} className="img-avatar" />
<InputGroup className="mb-3"> </div>
<InputGroupAddon addonType="prepend"> <div>
<InputGroupText> <img src={require('../../../assets/img/login/slide2.jpg')} className="img-avatar" />
<i className="icon-user"></i> </div>
</InputGroupText> <div>
</InputGroupAddon> <img src={require('../../../assets/img/login/slide3.jpg')} className="img-avatar" />
<Input </div>
type="text" <div>
name="name" <img src={require('../../../assets/img/login/slide4.jpg')} className="img-avatar" />
id="exampleName" </div>
placeholder="Username" </Slider>
value={name} }
onChange={(e) => {
this.setState({ name: e.target.value }) onChecked = (e) => {
}} this.setState({ remember: e.target.checked })
/> };
</InputGroup>
<InputGroup className="mb-4"> render() {
<InputGroupAddon addonType="prepend"> const { name, password, remember } = this.state;
<InputGroupText> const u_group = window.localStorage.getItem('u_group')
<i className="icon-lock"></i> if (u_group !== null) {
</InputGroupText> this.props.history.push("/dashboard");
</InputGroupAddon> }
<Input return (
type={this.state.type} <div className="app flex-row align-items-center">
name="password" <Container>
id="examplePassword" <NotificationContainer />
placeholder="********"
value={password} <Alert color={this.state.alertColor} isOpen={this.state.alertVisible} >
onChange={(e) => this.setState({ password: e.target.value })} {this.state.alertMessage}
/> </Alert>
<InputGroupAddon addonType="prepend"> <Row className="justify-content-center">
<InputGroupText <Col md="7">
onClick={this.showHide} {this.getLoginSlider()}
> </Col>
{this.state.type === 'input' ? <EyeOutlined /> : <EyeInvisibleOutlined />} <Col md="5">
<div style={{
</InputGroupText> boxShadow: '1px 1px 11px 1px rgba(221,211,211,0.75)'
</InputGroupAddon> }}>
<span className="password__show" ></span> <CardGroup>
</InputGroup> <Card className="p-4">
<Row> <CardBody>
<Col xs="8"> <Form onSubmit={this.submitForm}>
<Checkbox checked={this.state.remember} onChange={this.onChecked}>Remember me (7 days)</Checkbox> {this.getLoginLogo()}
</Col> <p className="text-muted">Sign In to your account</p>
<Col xs="4"> <InputGroup className="mb-3">
{this.state.loader ? ( <InputGroupAddon addonType="prepend">
<Spin indicator={antIcon} /> <InputGroupText>
) : ( <i className="icon-user"></i>
<Button onClick={() => this.submitFormLogin()} color="primary" className="px-4" >Login</Button> </InputGroupText>
)} </InputGroupAddon>
</Col> <Input
</Row> type="text"
<Row> name="name"
<Col className="text-right mt-5"> id="exampleName"
<Button color="link" className="px-0">Forgot password?</Button> placeholder="Username"
</Col> value={name}
</Row> onChange={(e) => {
</Form> this.setState({ name: e.target.value })
</CardBody> }}
</Card> />
</CardGroup> </InputGroup>
</div> <InputGroup className="mb-4">
</Col> <InputGroupAddon addonType="prepend">
</Row> <InputGroupText>
</Container> <i className="icon-lock"></i>
</div> </InputGroupText>
); </InputGroupAddon>
} <Input
} type={this.state.type}
name="password"
export default Login; id="examplePassword"
placeholder="********"
value={password}
onChange={(e) => this.setState({ password: e.target.value })}
/>
<InputGroupAddon addonType="prepend">
<InputGroupText
onClick={this.showHide}
>
{this.state.type === 'input' ? <EyeOutlined /> : <EyeInvisibleOutlined />}
</InputGroupText>
</InputGroupAddon>
<span className="password__show" ></span>
</InputGroup>
<Row>
<Col xs="8">
<Checkbox checked={this.state.remember} onChange={this.onChecked}>Remember me (7 days)</Checkbox>
</Col>
<Col xs="4">
{this.state.loader ? (
<Spin indicator={antIcon} />
) : (
<Button onClick={() => this.submitFormLogin()} color="primary" className="px-4" >Login</Button>
)}
</Col>
</Row>
<Row>
<Col className="text-right mt-5">
<Button color="link" className="px-0">Forgot password?</Button>
</Col>
</Row>
</Form>
</CardBody>
</Card>
</CardGroup>
</div>
</Col>
</Row>
</Container>
</div>
);
}
}
export default Login;

284
src/views/SimproV2/CreatedProyek/ReportAnalysis.js
Unescape View File

@ -0,0 +1,284 @@
import React, {useState, useEffect} from 'react'
import { Modal, ModalHeader, ModalBody, ModalFooter, Card, CardHeader, CardBody } from 'reactstrap';
import { TabContent, TabPane, Nav, NavItem, NavLink, Row, Col, Input } from 'reactstrap';
import { Button } from 'reactstrap';
import axios from "../../../const/interceptorApi";
import {
NotificationManager,
} from "react-notifications";
import { BASE_SIMPRO_LUMEN } from "../../../const/ApiConst";
import 'antd/dist/antd.css';
import './style.css'
import { Select, Table } from 'antd';
const { Option } = Select
const ReportAnalysis = ({ openDialog, closeDialog, toggleDialog, projectId }) => {
const token = localStorage.getItem("token");
const [activeTab, setActiveTab] = useState('1');
const [search, setSearch] = useState('');
const [avgActivity, setAvgActivity] = useState(0);
const [dataTable, setDatatable] = useState([]);
const [dataTableActivityToHr, setDataTableActivityToHr] = useState([]);
const [hrList, setHrList] = useState([]);
const [selectedHr, setSelectedHr] = useState(null);
const toggle = (tab) => {
if (activeTab !== tab) {
setActiveTab(tab);
}
};
const HEADER = {
headers: {
"Content-Type": "application/json",
Authorization: `Bearer ${token}`,
},
};
const columns = [
{title: "Activity Name", dataIndex: "name", key: "name"}
]
const columnActivityToHr = [
{title: "Activity", dataIndex: "join_third_name", key: "join_third_name"},
{title: "Human Resource", dataIndex: "join_second_name", key: "join_second_name"},
{title: "Report Date", dataIndex: "report_date", key: "report_date"},
{title: "Volume Actual", dataIndex: "qty", key: "qty"},
{title: "Volume Planned", dataIndex: "join_first_qty_planning", key: "join_first_qty_planning"},
{title: "Description", dataIndex: "description", key: "description"}
]
useEffect(() => {
if (search) {
getDataActivity()
}
}, [search]);
useEffect(() => {
if (selectedHr) {
getDataActivityToHr()
}
}, [selectedHr]);
useEffect(() => {
getDataHr()
}, []);
const handleSearch = (e) => {
const value = e.target.value;
setSearch(value);
};
const getDataHr = async () => {
const result = await axios
.get(`${BASE_SIMPRO_LUMEN}/human-resource/list`, HEADER)
.then((res) => res)
.catch((error) => error.response);
if (result && result.data && result.data.code == 200) {
let dataRes = result.data.data || [];
setHrList(dataRes);
} else {
NotificationManager.error("Gagal Mengambil Data!!", "Failed");
}
}
const getDataActivityToHr = async () => {
setAvgActivity(0);
let sum = 0;
const payload = {
columns: [
{
name: "user_id",
logic_operator: "=",
value: selectedHr,
operator: "AND",
},
{
name: "proyek_id",
logic_operator: "=",
value: projectId,
table_name: "m_activity",
operator: "AND",
}
],
joins: [
{
name: "assign_material_to_activity",
column_join: "assign_material_id",
column_results: ["qty_planning"]
},
{
name: "m_users",
column_join: "user_id",
column_results: ["name"]
},
{
name: "m_activity",
column_join: "activity_id",
column_results: ["name", "persentase_progress"]
}
],
orders: { columns: ["id"], ascending: false },
paging: { start: 0, length: -1 },
};
const result = await axios
.post(`${BASE_SIMPRO_LUMEN}/report-activity-material/search`, payload, HEADER)
.then((res) => res)
.catch((error) => error.response);
if (result && result.data && result.data.code == 200) {
let dataRes = result.data.data || [];
dataRes.forEach(element => {
element.join_third_persentase_progress ? sum += parseInt(element.join_third_persentase_progress) : sum += 0;
});
setAvgActivity(sum / dataRes.length);
setDataTableActivityToHr(dataRes);
} else {
NotificationManager.error("Gagal Mengambil Data!!", "Failed");
}
};
const getDataActivity = async () => {
setAvgActivity(0);
let sum = 0;
const payload = {
columns: [
{
name: "name",
logic_operator: "ilike",
value: search,
operator: "AND",
},
],
orders: { columns: ["id"], ascending: false },
paging: { start: 0, length: -1 },
};
const result = await axios
.post(`${BASE_SIMPRO_LUMEN}/activity/search`, payload, HEADER)
.then((res) => res)
.catch((error) => error.response);
if (result && result.data && result.data.code == 200) {
let dataRes = result.data.data || [];
dataRes.forEach(element => {
element.persentase_progress ? sum += parseInt(element.persentase_progress) : sum += 0;
});
setAvgActivity(sum / dataRes.length);
setDatatable(dataRes);
} else {
NotificationManager.error("Gagal Mengambil Data!!", "Failed");
}
};
return (
<>
<Modal size="xl" isOpen={openDialog} toggle={toggleDialog}>
<ModalHeader className="capitalize" toggle={closeDialog}>Project</ModalHeader>
<ModalBody>
<div>
<Nav tabs>
<NavItem>
<NavLink
className={activeTab === '1' ? "active" : null}
onClick={() => {
toggle('1');
}}
>
Activity
</NavLink>
</NavItem>
<NavItem>
<NavLink
className={activeTab === '2' ? "active" : null}
onClick={() => {
toggle('2');
}}
>
Human Resource
</NavLink>
</NavItem>
</Nav>
<TabContent activeTab={activeTab}>
<TabPane tabId="1">
<Card>
<CardHeader>
<Row>
<Col>
<Input
onChange={handleSearch}
value={search}
type="text"
name="search"
id="search"
placeholder={`Search Activity Name`}
style={{ width: 200 }}
/>
</Col>
</Row>
</CardHeader>
<CardBody>
<div style={{ textAlign: 'center' }}>
<h1>
{
search && avgActivity ? `Activity ${search} adalah ${avgActivity.toFixed(2)} %` : null
}
</h1>
</div>
<Table
size="small"
columns={columns}
dataSource={dataTable}
pagination={false}
rowKey={"id"}
/>
</CardBody>
</Card>
</TabPane>
<TabPane tabId="2">
<Card>
<CardHeader>
<Row>
<Col>
<Select showSearch value={selectedHr} onChange={(val) => setSelectedHr(val)} placeholder="Select Human Resource" filterOption={(input, option) =>
option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
} style={{ width: '100%' }}>
{hrList && hrList.map(res => (
<Option key={res.id} value={res.id}>{`${res.name}`}</Option>
))}
</Select>
</Col>
</Row>
</CardHeader>
<CardBody>
<div style={{ textAlign: 'center' }}>
<h1>
{
selectedHr && avgActivity ? `Activity user ini adalah ${avgActivity.toFixed(2)} %` : null
}
</h1>
</div>
<Table
size="small"
columns={columnActivityToHr}
dataSource={dataTableActivityToHr}
pagination={false}
rowKey={"id"}
/>
</CardBody>
</Card>
</TabPane>
</TabContent>
</div>
</ModalBody>
<ModalFooter>
<Button color="primary" onClick={closeDialog}>Close</Button>
</ModalFooter>
</Modal>
</>
)
}
export default ReportAnalysis;

30
src/views/SimproV2/CreatedProyek/index.js
Unescape View File

@ -87,6 +87,7 @@ import AssignHrProject from "./AsignHrProject";
import AssignCustProject from "./AsignCustProject"; import AssignCustProject from "./AsignCustProject";
import AssignK3Project from "./AssignK3Project"; import AssignK3Project from "./AssignK3Project";
import ViewProject from "./ViewProject"; import ViewProject from "./ViewProject";
import ReportAnalysis from "./ReportAnalysis";
import { Icon } from "@iconify/react"; import { Icon } from "@iconify/react";
// import { Link } from 'react-router-dom'; // import { Link } from 'react-router-dom';
// import SubProyekComp from './SubProyekComp'; // import SubProyekComp from './SubProyekComp';
@ -116,12 +117,14 @@ const CreatedProyek = ({ params, ...props }) => {
}; };
const [idTask, setidTask] = useState(0); const [idTask, setidTask] = useState(0);
const [projectId, setProjectId] = useState(0);
const [dataTable, setDatatable] = useState([]); const [dataTable, setDatatable] = useState([]);
const [search, setSearch] = useState(""); const [search, setSearch] = useState("");
const [currentPage, setCurrentPage] = useState(1); const [currentPage, setCurrentPage] = useState(1);
const [totalPage, setTotalPage] = useState(0); const [totalPage, setTotalPage] = useState(0);
const [openDialog, setOpenDialog] = useState(false); const [openDialog, setOpenDialog] = useState(false);
const [openDialogViewDetail, setOpenDialogViewDetail] = useState(false); const [openDialogViewDetail, setOpenDialogViewDetail] = useState(false);
const [openDialogRA, setOpenDialogRA] = useState(false);
const [openDialogMaterial, setOpenDialogMaterial] = useState(false); const [openDialogMaterial, setOpenDialogMaterial] = useState(false);
const [openDialogTools, setOpenDialogTools] = useState(false); const [openDialogTools, setOpenDialogTools] = useState(false);
const [openDialogGantt, setOpenDialogGantt] = useState(false); const [openDialogGantt, setOpenDialogGantt] = useState(false);
@ -593,6 +596,13 @@ const CreatedProyek = ({ params, ...props }) => {
getProjectDetail(data.id); getProjectDetail(data.id);
}; };
const handleOpenReport = async (data) => {
setOpenDialogRA(true);
setProjectId(data.id);
}
const handleCloseReport = async (data) => {
setOpenDialogRA(false);
}
const getDataProject = async (proyek_id) => { const getDataProject = async (proyek_id) => {
const url = PROYEK_GET_ID(proyek_id); const url = PROYEK_GET_ID(proyek_id);
const result = await axios const result = await axios
@ -851,6 +861,7 @@ const CreatedProyek = ({ params, ...props }) => {
const toggleAddDialog = () => setOpenDialog(!openDialog); const toggleAddDialog = () => setOpenDialog(!openDialog);
const toggleAddDialogProyek = () => setOpenDialogProyek(!openDialogProyek); const toggleAddDialogProyek = () => setOpenDialogProyek(!openDialogProyek);
const toggleAddDialogRA = () => setOpenDialogRA(!openDialogRA);
const toggleAddDialogView = () => { const toggleAddDialogView = () => {
if (openDialogViewDetail) { if (openDialogViewDetail) {
setProjectApproval(null); setProjectApproval(null);
@ -1506,6 +1517,12 @@ const CreatedProyek = ({ params, ...props }) => {
</span> </span>
<span className="menu-text">S Curve</span> <span className="menu-text">S Curve</span>
</div> </div>
<div className="menu-list" onClick={() => handleOpenReport(text)}>
<span className="menu-icon">
<i className="fa fa-pie-chart"></i>
</span>
<span className="menu-text">Report Analysis</span>
</div>
{/* </Link> */} {/* </Link> */}
<div <div
className="menu-list" className="menu-list"
@ -1889,7 +1906,17 @@ const CreatedProyek = ({ params, ...props }) => {
), ),
[openDialogViewDetail] [openDialogViewDetail]
); );
const renderReportAnalysis = useMemo(
() => (
<ReportAnalysis
openDialog={openDialogRA}
closeDialog={handleCloseReport}
toggleDialog={toggleAddDialogRA}
projectId={projectId}
/>
),
[openDialogRA]
);
const renderDialogGantt = useMemo( const renderDialogGantt = useMemo(
() => ( () => (
<DialogGantt <DialogGantt
@ -1933,6 +1960,7 @@ const CreatedProyek = ({ params, ...props }) => {
Delete this data Delete this data
</SweetAlert> </SweetAlert>
{ViewProyek} {ViewProyek}
{renderReportAnalysis}
{RenderDialogForm} {RenderDialogForm}
{RenderDialogFormProyek} {RenderDialogFormProyek}
{RenderDialogFormMaterial} {RenderDialogFormMaterial}

Write Preview
Loading…
Cancel
Save