Merge pull request 'dev-wahyun' (#74) from dev-wahyun into staging

Reviewed-on: ibnu/generic-ospro-frontend#74

src/const/ApiConst.js

@@ -279,6 +279,10 @@ export const TRANSACTION_GET_ID = (id) => {
 export const TRANSACTION_EDIT = (id) => {
   return `${BASE_SIMPRO_LUMEN}/product-transaction/update/${id}`;
 };
+export const TRANSACTION_DELETE = (id) => {
+  return `${BASE_SIMPRO_LUMEN}/product-transaction/delete/${id}`;
+};
+export const TRANSACTION_LIST = `${BASE_SIMPRO_LUMEN}/product-transaction/list`;
 
 export const STORAGE_LIMIT_INFORMATION = (company_name) => {
   return `${BASE_SIMPRO_LUMEN}/information-storage/${company_name}`;

src/routes.js

@@ -58,6 +58,7 @@ const DashboardProjectCarousell = React.lazy(() => import('./views/Dashboard/Das
 const MapMonitoring = React.lazy(() => import('./views/MapMonitoring'));
 const Settings = React.lazy(() => import('./views/SimproV2/Settings/Desktop'));
 const CompanyManagement = React.lazy(() => import('./views/Master/MasterCompany'))
+const TransactionManagement = React.lazy(() => import('./views/Master/MasterTransaction'))
 const DemoRequest = React.lazy(() => import('./views/SimproV2/DemoRequest'))
 const ReferralCode = React.lazy(() => import('./views/SimproV2/ReferralCode'))
 const SalesContact = React.lazy(() => import('./views/SimproV2/SalesContact'))
@@ -127,6 +128,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: '/transaction-management', exact: true, name: 'Transaksi Management', component: TransactionManagement },
 	{ path: '/register-management', exact: true, name: 'Register Management', component: CompanyManagement },
 	{ path: '/demo-request', exact: true, name: 'Request Demo', component: DemoRequest },
 	{ path: '/referral-code-management', exact: true, name: 'Referral Code Management', component: ReferralCode },

src/views/Master/MasterTransaction/DialogForm.js

@@ -0,0 +1,203 @@
+import React, { Component } from 'react'
+import { Modal, ModalHeader, ModalBody, ModalFooter, Button, Form, FormGroup, Label, Input } from 'reactstrap';
+import 'antd/dist/antd.css';
+import axios from 'axios';
+import { COMPANY_MANAGEMENT_LIST } from '../../../const/ApiConst.js';
+import { withTranslation } from 'react-i18next';
+import { NotificationManager } from 'react-notifications';
+import { Select, DatePicker } from 'antd';
+import moment from "moment";
+
+const { Option } = Select
+class DialogForm extends Component {
+  constructor(props) {
+    super(props)
+    this.state = {
+      id: 0,
+      name: "",
+      ExpiredDateOspro: moment(),
+      description: "",
+      openDialog: false,
+      companyList: [],
+      scompany_id:null,
+      isParentClick: false,
+      company_id: props.company_id || null,
+      role_name: props.role_name || '',
+      token: props.token || '',
+      config: {
+        headers: {
+          Authorization: `Bearer ${props.token || ''}`,
+          "Content-type": "application/json",
+        }
+      }
+    }
+  }
+
+  async componentDidMount() {
+    this.props.showDialog(this.showDialog);
+    this.getDataProyekCompany();
+  }
+
+  async componentDidUpdate() {
+    if (this.state.isParentClick === true) {
+      if (this.props.typeDialog === "Edit") {
+        const { dataEdit } = this.props
+        this.setState({
+          id: dataEdit.id,
+          name: dataEdit.name,
+          description: dataEdit.description,
+          scompany_id : dataEdit.company_id
+        })
+      } else {
+        this.setState({
+          id: 0,
+          name: "",
+          description: "",
+          scompany_id:null
+        })
+      }
+      this.setState({ isParentClick: false });
+    }
+  }
+
+
+  showDialog = () => {
+    this.setState({ isParentClick: true });
+  }
+
+  getDataProyekCompany = async () => {
+    const result = await axios
+      .get(COMPANY_MANAGEMENT_LIST, this.state.config)
+      .then((res) => res)
+      .catch((error) => error.response);
+
+    if (result && result.data && result.data.code == 200) {
+      let dataRes = result.data.data || [];
+      this.setState({companyList: dataRes})
+    } else {
+      NotificationManager.error("Gagal Mengambil Data!!", "Failed");
+    }
+  };
+
+  handleDatePicker = (date, dateString) => {
+    this.setState({ ExpiredDateOspro: date })
+	};
+
+  validation = () => {
+    if (this.state.role_name === 'Super Admin' && !this.state.scompany_id || this.state.scompany_id === "") {
+			alert("Company data cannot be empty!");
+			return true;
+		}
+  }
+
+  handleSave = () => {
+    const {
+      id,
+      name,
+      description,
+      role_name,
+      company_id,
+      scompany_id
+    } = this.state
+
+    let data = '';
+    const err = this.validation();
+    if(!err) {
+      if (this.props.typeDialog === "Save") {
+        data = {
+          id,
+          name,
+          description,
+          company_id : role_name !== 'Super Admin' ? company_id : scompany_id,
+        }
+        this.props.closeDialog('save', data);
+      } else {
+        data = {
+          id,
+          name,
+          description,
+          company_id : role_name !== 'Super Admin' ? company_id : scompany_id,
+        }
+        this.props.closeDialog('edit', data);
+      }
+    }
+    this.setState({ id: 0 });
+  }
+
+  handleCancel = () => {
+    this.props.closeDialog('cancel', 'none')
+  }
+
+  onChangeCompanyProject = (val) => {
+		this.setState({scompany_id : val});
+	};
+
+  renderForm = () => {
+    const { t } = this.props;
+    return (
+      <Form>
+          {
+            this.state.role_name === 'Super Admin' && (
+              <FormGroup>
+                <Label className="capitalize">Assign Company Project<span style={{ color: "red" }}>*</span></Label>
+                <Select
+                  showSearch
+                  filterOption={(inputValue, option) =>
+                    option.children.toLowerCase().includes(inputValue.toLowerCase())
+                  }
+                  value={this.state.scompany_id}
+                  defaultValue={this.state.scompany_id}
+                  onChange={this.onChangeCompanyProject}
+                  style={{ width: "100%" }}
+                >
+                  {this.state.companyList.map((res) => (
+                    <Option key={res.id} value={res.id}>
+                      {res.company_name}
+                    </Option>
+                  ))}
+                </Select>
+              </FormGroup>
+            )
+          }
+        <FormGroup>
+          <Label>{this.props.t('Type Paket')}</Label>
+          <Input type="text" value={this.state.name} onChange={(e) => this.setState({ name: e.target.value })} placeholder={this.props.t('inputName')} />
+        </FormGroup>
+        <FormGroup>
+          <Label className="capitalize" style={{ fontWeight: "bold" }}>
+            End Date<span style={{ color: "red" }}>*</span>
+          </Label>
+          {/* <DatePicker
+            // disabledDate={(current) => {
+            //   let currentDate = moment(current).format("YYYY-MM-DD");
+            //   let customDate = moment(this.state.ExpiredDateOspro)
+            //     .add(1, "days")
+            //     .format("YYYY-MM-DD");
+            //   return current && currentDate < customDate;
+            // }}
+            format={"DD-MM-YYYY"}
+            style={{ width: "100%" }}
+            value={this.state.ExpiredDateOspro}
+            onChange={this.handleDatePicker()}
+          /> */}
+        </FormGroup>
+      </Form>
+    )
+  }
+
+  render() {
+    return (
+      <Modal isOpen={this.props.openDialog} toggle={this.props.toggleDialog}>
+        <ModalHeader toggle={this.props.closeDialog}>{this.props.typeDialog == "Save" ? "Tambah" : "Edit"} {this.props.t('Transaksi')}</ModalHeader>
+        <ModalBody>
+          {this.renderForm()}
+        </ModalBody>
+        <ModalFooter>
+          <Button color="primary" onClick={() => this.handleSave()}>{this.props.typeDialog}</Button>{' '}
+          <Button color="secondary" onClick={() => this.handleCancel()}>{this.props.t('cancel')}</Button>
+        </ModalFooter>
+      </Modal>
+    )
+  }
+}
+export default withTranslation()(DialogForm);

src/views/Master/MasterTransaction/index.js

@@ -0,0 +1,465 @@
+import * as XLSX from 'xlsx';
+import DialogForm from './DialogForm';
+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, TRANSACTION_SEARCH, PROJECT_ROLE_EDIT, PROJECT_ROLE_DELETE } from '../../../const/ApiConst.js';
+import { Pagination, Tooltip, Table } from 'antd';
+import { withTranslation } from 'react-i18next';
+import { checkActMenup } from '../../../const/CustomFunc';
+import moment from "moment";
+
+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: [],
+      dialogMenuForm: false,
+      idDelete: 0,
+      idRoles: 0,
+      menuRoles: [],
+      openDialog: false,
+      page: 0,
+      rowsPerPage: LENGTH_DATA,
+      search: "",
+      tooltipDelete: false,
+      tooltipEdit: false,
+      tooltipExport: false,
+      tooltipImport: false,
+      tooltipMenu: false,
+      tooltipTambah: false,
+      totalPage: 0,
+      typeDialog: 'Save',
+      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>
+          {/* {
+            checkActMenup('/product-transaction', 'delete') ?
+              <i className="fa fa-trash" style={{ color: 'red', marginRight: 10, cursor: "pointer" }} onClick={() => this.handleDelete(text.id)}></i>
+              :
+              null
+          } */}
+          </Tooltip>
+          <Tooltip title={this.props.t('edit')}>
+          <i className="fa fa-edit" style={{ color: 'green', cursor: "pointer" }} onClick={() => this.handleEdit(text)}></i>
+          {/* {
+            checkActMenup('/product-transaction', 'update') ?
+              <i className="fa fa-edit" style={{ color: 'green', cursor: "pointer" }} onClick={() => this.handleEdit(text)}></i>
+              :
+              null
+          } */}
+          </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: 'Type Paket', dataIndex: 'type_paket', key: 'type_paket', className: "nowrap" },
+      {
+        title: this.props.t('Expired Date'), dataIndex: 'exp_ospro', key: 'exp_ospro',
+        render: (text,record) => {
+          return moment(record.exp_ospro).format('DD MMMM, YYYY');
+        }
+      },
+    ];
+  }
+
+  async componentDidMount() {
+    this.getDataTransaction();
+  }
+
+  async componentDidUpdate(prevProps, prevState) {
+    const { search } = this.state
+    if (search !== prevState.search) this.getDataTransaction()
+  }
+
+  handleSearch = e => {
+    const value = e.target.value
+    this.setState({ search: value, currentPage: 1 })
+  };
+
+  getDataTransaction = 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": "type_paket",
+            "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": parseInt(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(TRANSACTION_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');
+    }
+  }
+
+  handleOpenDialog = (type) => {
+    this.setState({ openDialog: true, typeDialog: type })
+    this.showChildDialog();
+  }
+
+  handleCloseDialog = (type, data) => {
+    if (type === "save") {
+      this.saveRole(data);
+    } else if (type === "edit") {
+      this.editRole(data);
+    }
+    this.setState({ openDialog: false })
+  }
+
+
+  handleOpenDialogMr = () => {
+    this.setState({ dialogMenuForm: true })
+    this.showMenuRolesDialog();
+  }
+  handleCloseDialogMr = (type, data) => {
+    if (type === "save") {
+      this.saveMenuRoles(data)
+    }
+    this.setState({ dialogMenuForm: false })
+  }
+
+  toggleAddDialog = () => {
+    this.setState({ openDialog: !this.state.openDialog })
+  }
+
+  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.getDataTransaction()
+      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.getDataTransaction();
+      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.getDataTransaction();
+      NotificationManager.success(`Data project role berhasil diedit`, 'Success!!');
+    } else {
+      NotificationManager.error(`Data project role gagal di edit`, `Failed!!`);
+    }
+
+  }
+
+
+  handleEdit = (data) => {
+    this.setState({ dataEdit: data });
+    this.handleOpenDialog('Edit');
+  }
+
+  handleDelete = (id) => {
+    id == '1' ? this.setState({ alertNotDelete: true }) :
+      this.setState({ alertDelete: true, idDelete: id });
+  }
+
+  onShowSizeChange = (current, pageSize) => {
+    this.setState({ rowsPerPage: pageSize }, () => {
+      this.getDataTransaction();
+    })
+  }
+
+  onPagination = (current, pageSize) => {
+    this.setState({ currentPage: current, page: (current - 1) * pageSize }, () => {
+      this.getDataTransaction();
+    })
+  }
+
+  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(TRANSACTION_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 { 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>
+        <DialogForm
+          openDialog={openDialog}
+          closeDialog={this.handleCloseDialog}
+          toggleDialog={() => this.toggleAddDialog}
+          typeDialog={this.state.typeDialog}
+          dataEdit={this.state.dataEdit}
+          showDialog={showDialog => this.showChildDialog = showDialog}
+          dataHs={this.state.dataIdHo}
+          company_id={this.state.company_id}
+					role_name={this.state.role_name}
+          token={this.state.token}
+        />
+        <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('rolesAdd')}>
+                {
+                  checkActMenup('/roles', 'create') ?
+                      <Button Button id="TooltipTambah" color="success" onClick={() => this.handleOpenDialog('Save')}><i className="fa fa-plus"></i>
+                      </Button>
+                      :
+                      null
+                }
+                </Tooltip>
+                <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);

src/views/SimproV2/CreatedProyek/DialogDocument.js

@@ -5,7 +5,7 @@ import { Table, Tooltip, Popover, Spin } from 'antd';
 import 'antd/dist/antd.css';
 import moment from 'moment';
 import SweetAlert from 'react-bootstrap-sweetalert';
-import { DOCUMENT_DOWNLOAD, DOCUMENT_GET, BASE_SIMPRO_LUMEN_FILE_COMPANY, REQUEST_MATERIAL_EDIT, DOCUMENT_DELETE, DOCUMENT_SEARCH, FOLDER_DOCUMENT_PROYEK_GET_TREE, FOLDER_DOCUMENT_PROYEK_DELETE } from '../../../const/ApiConst';
+import { DOCUMENT_DOWNLOAD, BASE_SIMPRO_LUMEN_FILE_COMPANY, DOCUMENT_DELETE, FOLDER_DOCUMENT_PROYEK_GET_TREE, FOLDER_DOCUMENT_PROYEK_DELETE } from '../../../const/ApiConst';
 import axios from "../../../const/interceptorApi"
 import { NotificationContainer, NotificationManager } from 'react-notifications';
 import DialogRequest from './FormDocument';
@@ -28,14 +28,13 @@ const DialogDocument = ({ openDialog, closeDialog, toggleDialog, idTask, proyekN
   const [dataEdit, setDataEdit] = useState(null)
   const [parentIdNewFolder, setParentIdNewFolder] = useState(0)
   const [loading, setLoading] = useState(true);
-  const company_id = window.localStorage.getItem('company_id');
 
   useEffect(() => {
-    if (idTask > 0) {
+    if (parseInt(idTask) > 0) {
       setLoading(true);
       getDataDocument();
     }
-  }, [idTask, openDialog])
+  }, [parseInt(idTask), openDialog])
 
   useEffect(() => {
     if (!openDialog) {
@@ -45,13 +44,8 @@ const DialogDocument = ({ openDialog, closeDialog, toggleDialog, idTask, proyekN
     }
   }, [openDialog])
 
-
-
-
-
-
   const getDataDocument = async () => {
-    const url = FOLDER_DOCUMENT_PROYEK_GET_TREE(idTask)
+    const url = FOLDER_DOCUMENT_PROYEK_GET_TREE(parseInt(idTask))
     const result = await axios
       .get(url, HEADER)
       .then(res => res)
@@ -81,7 +75,7 @@ const DialogDocument = ({ openDialog, closeDialog, toggleDialog, idTask, proyekN
   }
 
   const handleDownload = (id, file) => {
-    fetch(DOCUMENT_DOWNLOAD(id, company_id), {
+    fetch(DOCUMENT_DOWNLOAD(id, parseInt(idTask)), {
       headers: new Headers({
         'Content-Type': 'application/json',
         'Authorization': `Bearer ${token}`
@@ -211,7 +205,7 @@ const DialogDocument = ({ openDialog, closeDialog, toggleDialog, idTask, proyekN
   }
 
   const onConfirmDelete = async () => {
-    let urlDel = DOCUMENT_DELETE(idDelete, company_id)
+    let urlDel = DOCUMENT_DELETE(idDelete, parseInt(idTask))
     const result = await axios.delete(urlDel, HEADER)
       .then(res => res)
       .catch((error) => error.response);
@@ -322,7 +316,7 @@ const DialogDocument = ({ openDialog, closeDialog, toggleDialog, idTask, proyekN
         openDialog={openDialogReq}
         closeDialog={closeDialogReq}
         toggleDialog={toggleDialogReq}
-        idTask={idTask}
+        idTask={parseInt(idTask)}
         parentIdNewFolder={parentIdNewFolder}
         dataEdit={dataEdit}
       />
@@ -331,7 +325,7 @@ const DialogDocument = ({ openDialog, closeDialog, toggleDialog, idTask, proyekN
         openDialog={openDialogNewFolder}
         closeDialog={closeDialogNewFolder}
         toggleDialog={toggleDialogNewFolder}
-        idTask={idTask}
+        idTask={parseInt(idTask)}
         parentIdNewFolder={parentIdNewFolder}
         dataEdit={dataEdit}
       />

src/views/SimproV2/CreatedProyek/FormDocument.js

@@ -34,7 +34,7 @@ const DialogRequest = ({ openDialog, closeDialog, toggleDialog, idTask, parentId
   }
 
   const uploadDokumen = async () => {
-    let configApp = '';
+    let configApp = ''
     const formData = new FormData;
     if (role !== 'Super Admin') {
       configApp = JSON.parse(window.localStorage.getItem('configApp'));

src/views/SimproV2/CreatedProyek/FormFolderDocument.js

@@ -1,96 +1,96 @@
-import React, { useEffect, useState } from 'react'
+import React, { useEffect, useState } from 'react'
-import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
+import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
-import { Button, Form, FormGroup, Label, Input, Col, Row } from 'reactstrap';
+import { Button, Form, FormGroup, Label, Input, Col, Row } from 'reactstrap';
-import axios from "../../../const/interceptorApi";
+import axios from "../../../const/interceptorApi";
-import { DOCUMENT_ADD, FOLDER_DOCUMENT_PROYEK_ADD } from '../../../const/ApiConst';
+import { FOLDER_DOCUMENT_PROYEK_ADD } from '../../../const/ApiConst';
-import 'antd/dist/antd.css';
+import 'antd/dist/antd.css';
-import { NotificationManager } from 'react-notifications';
+import { NotificationManager } from 'react-notifications';
-
+
-const DialogRequestFolder = ({ openDialog, closeDialog, toggleDialog, idTask, parentIdNewFolder }) => {
+const DialogRequestFolder = ({ openDialog, closeDialog, toggleDialog, idTask, parentIdNewFolder }) => {
-  const token = localStorage.getItem("token")
+  const token = localStorage.getItem("token")
-  const HEADER = {
+  const HEADER = {
-    headers: {
+    headers: {
-      "Content-Type": "application/json",
+      "Content-Type": "application/json",
-      "Authorization": `Bearer ${token}`
+      "Authorization": `Bearer ${token}`
-    }
+    }
-  }
+  }
-  const [id, setId] = useState(0)
+  const [id, setId] = useState(0)
-  const [folderName, setFolderName] = useState('')
+  const [folderName, setFolderName] = useState('')
-
+
-
+
-  const handleClearData = () => {
+  const handleClearData = () => {
-    setId(0)
+    setId(0)
-    setFolderName('')
+    setFolderName('')
-  }
+  }
-
+
-  useEffect(() => {
+  useEffect(() => {
-    handleClearData()
+    handleClearData()
-  }, [openDialog])
+  }, [openDialog])
-
+
-  const handleSave = () => {
+  const handleSave = () => {
-    saveFolder()
+    saveFolder()
-    handleClearData()
+    handleClearData()
-  }
+  }
-
+
-  const saveFolder = async () => {
+  const saveFolder = async () => {
-
+
-
+
-
+
-
+
-    let payload = {
+    let payload = {
-      "proyek_id": idTask,
+      "proyek_id": idTask,
-      "name_folder": folderName
+      "name_folder": folderName
-    }
+    }
-
+
-    if (parentIdNewFolder > 0) {
+    if (parentIdNewFolder > 0) {
-      payload.parent_id = parentIdNewFolder
+      payload.parent_id = parentIdNewFolder
-    }
+    }
-
+
-    const result = await axios
+    const result = await axios
-      .post(FOLDER_DOCUMENT_PROYEK_ADD, payload, HEADER)
+      .post(FOLDER_DOCUMENT_PROYEK_ADD, payload, HEADER)
-      .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) {
-      NotificationManager.success('Success create folder!!', 'Success');
+      NotificationManager.success('Success create folder!!', 'Success');
-      closeDialog("upload");
+      closeDialog("upload");
-    } else {
+    } else {
-      NotificationManager.error('Failed to create folder!!', 'Failed');
+      NotificationManager.error('Failed to create folder!!', 'Failed');
-    }
+    }
-  }
+  }
-
+
-  const handleCancel = () => {
+  const handleCancel = () => {
-    closeDialog('cancel')
+    closeDialog('cancel')
-    handleClearData()
+    handleClearData()
-  }
+  }
-
+
-  const renderForm = () => {
+  const renderForm = () => {
-    return (
+    return (
-      <Form>
+      <Form>
-        <FormGroup>
+        <FormGroup>
-          <Label className="capitalize">Folder Name</Label>
+          <Label className="capitalize">Folder Name</Label>
-          <Input type="text" onChange={(e) => setFolderName(e.target.value)} />
+          <Input type="text" onChange={(e) => setFolderName(e.target.value)} />
-        </FormGroup>
+        </FormGroup>
-      </Form>
+      </Form>
-    )
+    )
-  }
+  }
-
+
-
+
-  return (
+  return (
-    <>
+    <>
-      <Modal isOpen={openDialog} toggle={toggleDialog}>
+      <Modal isOpen={openDialog} toggle={toggleDialog}>
-        <ModalHeader className="capitalize" toggle={closeDialog}>Create New Folder</ModalHeader>
+        <ModalHeader className="capitalize" toggle={closeDialog}>Create New Folder</ModalHeader>
-        <ModalBody>
+        <ModalBody>
-          {renderForm()}
+          {renderForm()}
-        </ModalBody>
+        </ModalBody>
-        <ModalFooter>
+        <ModalFooter>
-          <Button color="primary" onClick={() => handleSave()}>Save</Button>{' '}
+          <Button color="primary" onClick={() => handleSave()}>Save</Button>{' '}
-          <Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Cancel</Button>
+          <Button className="capitalize" color="secondary" onClick={() => handleCancel()}>Cancel</Button>
-        </ModalFooter>
+        </ModalFooter>
-      </Modal>
+      </Modal>
-    </>
+    </>
-  )
+  )
-
+
-}
+}
-
+
-export default DialogRequestFolder;
+export default DialogRequestFolder;