From 19f34bfd76b487665a7d457c7e06934704511947 Mon Sep 17 00:00:00 2001 From: farhan048 Date: Mon, 13 Feb 2023 09:59:52 +0700 Subject: [PATCH 1/6] project phase export, search, download document --- src/views/Master/ProjectPhase/index.js | 88 +++++++++++++++---- .../SimproV2/CreatedProyek/DialogDocument.js | 20 ++++- 2 files changed, 87 insertions(+), 21 deletions(-) diff --git a/src/views/Master/ProjectPhase/index.js b/src/views/Master/ProjectPhase/index.js index e6718d9..0f0ad32 100644 --- a/src/views/Master/ProjectPhase/index.js +++ b/src/views/Master/ProjectPhase/index.js @@ -6,7 +6,7 @@ import axios from "../../../const/interceptorApi" import moment from 'moment' import { Card, CardBody, CardHeader, Col, Row, Input } from 'reactstrap'; import { NotificationContainer, NotificationManager } from 'react-notifications'; -import { PROJECT_PHASE_ADD, PROJECT_PHASE_EDIT, PROJECT_PHASE_DELETE, PROJECT_PHASE_SEARCH, BASE_OSPRO } from '../../../const/ApiConst'; +import { PROJECT_PHASE_ADD, PROJECT_PHASE_EDIT, PROJECT_PHASE_DELETE, PROJECT_PHASE_SEARCH, PROJECT_PHASE_LIST, BASE_OSPRO } from '../../../const/ApiConst'; import { Pagination, Button, Tooltip, Table } from 'antd'; const token = window.localStorage.getItem('token'); @@ -40,6 +40,7 @@ const ProjectPhase = ({ params }) => { const [clickOpenModal, setClickOpenModal] = useState(false) const [currentPage, setCurrentPage] = useState(1) const [dataEdit, setDataEdit] = useState([]) + const [dataExport, setDataExport] = useState([]) const [dataTable, setDatatable] = useState([]) const [idDelete, setIdDelete] = useState(0) const [idPhaseProject, setIdPhaseProject] = useState(0) @@ -54,17 +55,23 @@ const ProjectPhase = ({ params }) => { getDataProjectPhase() }, [currentPage, rowsPerPage, search]) + useEffect(() => { + const cekData = dataExport || [] + if (cekData.length > 0) { + exportExcel() + } + }, [dataExport]) + const getDataProjectPhase = async () => { let start = 0; if (currentPage !== 1 && currentPage > 1) { start = (currentPage * rowsPerPage) - rowsPerPage } - const payload = { "columns": [ { "name": "name", - "logic_operator": "like", + "logic_operator": "ilike", "value": search, "operator": "AND" } @@ -80,18 +87,16 @@ const ProjectPhase = ({ params }) => { "start": start } } - - /*const result = await axios - .post(PROJECT_PHASE_SEARCH, payload, config) - .then(res => res) - .catch((error) => error.response);*/ - //const result = await axios.post(PROJECT_PHASE_SEARCH, payload, HEADER).then(res => res).catch(err => err.response) - - const URL = `${BASE_OSPRO}/api/project-phase/list` - const result = await axios.get(URL, HEADER).then(res => res).catch(err => err.response) - console.log(result) + // let url = `${BASE_OSPRO}/api/project-phase/list?start=${start}&length=${rowsPerPage}&orderby=id&asc=false&column=name&logic=ilike&value=${search}` + const result = await axios + .post(PROJECT_PHASE_SEARCH, payload, HEADER) + .then((res) => res) + .catch((err) => err.response); if (result && result.data && result.data.code == 200) { + result.data.data.map((res) => { + res.key = res.id.toString() + }); setDatatable(result.data.data); setTotalPage(result.data.totalRecord); } else { @@ -104,7 +109,6 @@ const ProjectPhase = ({ params }) => { setSearch(value); setCurrentPage(1) }; - const handleOpenDialog = (type) => { setOpenDialog(true) setTypeDialog(type) @@ -113,19 +117,59 @@ const ProjectPhase = ({ params }) => { const handleExportExcel = async () => { let start = 0; + if (currentPage !== 1 && currentPage > 1) { + start = (currentPage * rowsPerPage) - rowsPerPage + } + const payload = { - "paging": { "start": start, "length": -1 }, "columns": [ - { "name": "name", "logic_operator": "ilike", "value": search, "operator": "AND" } + { + "name": "name", + "logic_operator": "like", + "value": search, + "operator": "AND" + } ], - "joins": [], - "orders": { "columns": ["id"], "ascending": false } + "orders": { + "ascending": true, + "columns": [ + 'id' + ] + }, + "paging": { + "length": rowsPerPage, + "start": start + } } const result = await axios - .post(PROJECT_PHASE_SEARCH, payload) + .post(PROJECT_PHASE_SEARCH, payload, HEADER) .then(res => res) .catch((error) => error.response); + if (result && result.data && result.data.code == 200) { + let resData = result.data.data; + const excelData = []; + resData.map((val, index) => { + let dataRow = { + "Nama": val.name, + "Color": val.color, + } + excelData.push(dataRow) + }) + await setDataExport(excelData) + } else { + NotificationManager.error('Gagal Export Data!!', 'Failed'); + } + } + + const exportExcel = () => { + const dataExcel = dataExport || []; + const fileName = `Data ${pageName}.xlsx`; + const ws = XLSX.utils.json_to_sheet(dataExcel); + const wb = XLSX.utils.book_new(); + XLSX.utils.book_append_sheet(wb, ws, `Data ${pageName}`); + XLSX.writeFile(wb, fileName); + setDataExport([]) } const handleEdit = (data) => { @@ -309,10 +353,16 @@ const ProjectPhase = ({ params }) => {

{pageName}

+ + + + + + diff --git a/src/views/SimproV2/CreatedProyek/DialogDocument.js b/src/views/SimproV2/CreatedProyek/DialogDocument.js index 12a160c..dac19ae 100644 --- a/src/views/SimproV2/CreatedProyek/DialogDocument.js +++ b/src/views/SimproV2/CreatedProyek/DialogDocument.js @@ -82,8 +82,24 @@ const DialogDocument = ({ openDialog, closeDialog, toggleDialog, idTask, proyekN } const handleDownload = (id) => { - const urlDownload = DOCUMENT_DOWNLOAD(id); - window.open(urlDownload); + fetch(DOCUMENT_DOWNLOAD(id), { + headers: new Headers({ + 'Content-Type': 'application/json', + 'Authorization': `Bearer ${token}` + }) + }) + .then(response => { + response.blob().then(blob => { + let url = window.URL.createObjectURL(blob); + let a = document.createElement('a'); + a.href = url; + a.download = 'Project Documents'; + a.click(); + }); + //window.location.href = response.url; + }); + // const urlDownload = DOCUMENT_DOWNLOAD(id); + // window.open(urlDownload); } const handleShow = (file) => { From 18f50fe6ee621701be98bc63bf211ebcd1c374cc Mon Sep 17 00:00:00 2001 From: farhan048 Date: Tue, 14 Feb 2023 17:57:51 +0700 Subject: [PATCH 2/6] update search, icon, export presence, project --- src/views/SimproV2/ChecklistK3/index.js | 8 +- src/views/SimproV2/CreatedProyek/index.js | 80 +++++++++++--------- src/views/SimproV2/Divisi/index.js | 91 +++++++++++++++++++++-- src/views/SimproV2/Presence/index.js | 7 +- 4 files changed, 137 insertions(+), 49 deletions(-) diff --git a/src/views/SimproV2/ChecklistK3/index.js b/src/views/SimproV2/ChecklistK3/index.js index 89051cf..4cd4cb5 100644 --- a/src/views/SimproV2/ChecklistK3/index.js +++ b/src/views/SimproV2/ChecklistK3/index.js @@ -7,7 +7,7 @@ import { Card, CardBody, CardHeader, Col, Row, Input, Table } from 'reactstrap'; import { NotificationContainer, NotificationManager } from 'react-notifications'; import { Pagination, Button, Tooltip } from 'antd'; import { - CHECKLIST_K3_ADD, CHECKLIST_K3_EDIT, CHECKLIST_K3_DELETE,CHECKLIST_K3_SEARCH + CHECKLIST_K3_ADD, CHECKLIST_K3_EDIT, CHECKLIST_K3_DELETE, CHECKLIST_K3_SEARCH } from '../../../const/ApiConst'; const token = window.localStorage.getItem('token'); @@ -283,7 +283,7 @@ const ChecklistK3 = ({ params }) => { - + @@ -307,10 +307,10 @@ const ChecklistK3 = ({ params }) => { - handleDelete(n.id)}> + handleDelete(n.id)}> - handleEdit(n)}> + handleEdit(n)}> {n.name} diff --git a/src/views/SimproV2/CreatedProyek/index.js b/src/views/SimproV2/CreatedProyek/index.js index 2936b7f..8474055 100644 --- a/src/views/SimproV2/CreatedProyek/index.js +++ b/src/views/SimproV2/CreatedProyek/index.js @@ -763,25 +763,25 @@ const CreatedProyek = ({ params, ...props }) => { Sortname: n.kode_sortname ? n.kode_sortname : "", "Nama Project": n.nama ? n.nama : "", "Tanggal Mulai": n.mulai_proyek - ? moment(n.mulai_proyek).format(format) - : "-", + ? moment(n.mulai_proyek).format(format) + : "-", "Tanggal Selesai": n.akhir_proyek - ? moment(n.akhir_proyek).format(format) - : "-", + ? moment(n.akhir_proyek).format(format) + : "-", "Area Kerja": n.area_kerja ? n.area_kerja : "", Perusahaan: n.company ? n.company : "", Keterangan: n.keterangan ? n.keterangan : "", "Dianggap sukses ketika": n.considered_success_when - ? n.considered_success_when - : "", + ? n.considered_success_when + : "", "Tujuan Proyek": n.project_objectives ? n.project_objectives : "", "Resiko potensial": n.potential_risk ? n.potential_risk : "", "Rencana Biaya": n.rencana_biaya - ? formatThousand(n.rencana_biaya) - : "-", + ? formatThousand(n.rencana_biaya) + : "-", "Testing Environment": n.testing_environment - ? n.testing_environment - : "-", + ? n.testing_environment + : "-", }; excelData.push(dataRow); }); @@ -791,33 +791,45 @@ const CreatedProyek = ({ params, ...props }) => { } }; - const handleExportPdf = () => { + const handleExportPdf = async () => { const doc = new jsPDF(); const headers = [ ["Project Name", "Budget", "Project Type", "PM", "Time Project"], ]; - const data = dataTable.map((elt) => [ - elt.nama, - `Rp. ${formatThousand(elt.rencana_biaya)}`, - elt.join_second_name, - elt.join_first_name, - `${moment(elt.mulai_proyek).format(format)} - ${moment( - elt.akhir_proyek - ).format(format)}`, - ]); - // Or use javascript directly: - doc.text(4, 15, "Project Charter"); - autoTable(doc, { - startY: 20, - margin: { horizontal: 4 }, - styles: { overflow: "linebreak", columnWidth: "auto", fontSize: 8 }, - columnStyles: { text: { columnWidth: "auto" } }, - head: headers, - body: data, - }); + const payload = { + paging: { start: 0, length: -1 }, + joins: [], + orders: { columns: ["id"], ascending: false }, + }; - doc.save("table.pdf"); + const result = await axios + .post(PROYEK_SEARCH, payload, HEADER) + .then((res) => res) + .catch((error) => error.response); + if (result && result.data && result.data.code == 200) { + let resData = result.data.data; + const data = resData.map((elt) => [ + elt.nama, + `Rp. ${formatThousand(elt.rencana_biaya)}`, + elt.join_second_name, + elt.join_first_name, + `${moment(elt.mulai_proyek).format(format)} - ${moment( + elt.akhir_proyek + ).format(format)}`, + ]); + // Or use javascript directly: + doc.text(4, 15, "Project Charter"); + autoTable(doc, { + startY: 20, + margin: { horizontal: 4 }, + styles: { overflow: "linebreak", columnWidth: "auto", fontSize: 8 }, + columnStyles: { text: { columnWidth: "auto" } }, + head: headers, + body: data, + }); + } + doc.save("Project.pdf"); // const unit = "pt"; // const size = "A4"; // Use A1, A2, A3 or A4 // const orientation = "portrait"; // portrait or landscape @@ -1321,12 +1333,12 @@ const CreatedProyek = ({ params, ...props }) => { } - // visible={visible} - // onVisibleChange={handleVisibleChange} + // visible={visible} + // onVisibleChange={handleVisibleChange} > diff --git a/src/views/SimproV2/Divisi/index.js b/src/views/SimproV2/Divisi/index.js index acab2bd..269e8f2 100644 --- a/src/views/SimproV2/Divisi/index.js +++ b/src/views/SimproV2/Divisi/index.js @@ -54,14 +54,23 @@ const ProjectType = ({ params }) => { const [typeDialog, setTypeDialog] = useState('Save') const [dataDivisions, setDataDivisions] = useState([]) + + useEffect(() => { + getListDivision() + }, []) + useEffect(() => { getDataProjectType() }, [currentPage, rowsPerPage, search]) - const getDataProjectType = async () => { - - let start = 0; + useEffect(() => { + const cekData = dataExport || [] + if (cekData.length > 0) { + exportExcel() + } + }, [dataExport]) + const getListDivision = async () => { const listDivions = await axios .get(DIVISI_LIST, HEADER) .then(res => res) @@ -76,11 +85,12 @@ const ProjectType = ({ params }) => { } else { NotificationManager.error('Gagal Mengambil Data!!', 'Failed'); } - + } + const getDataProjectType = async () => { + let start = 0; if (currentPage !== 1 && currentPage > 1) { start = (currentPage * rowsPerPage) - rowsPerPage } - const payload = { "columns": [ { @@ -101,19 +111,78 @@ const ProjectType = ({ params }) => { "start": start } } - const result = await axios - .post(DIVISI_SEARCH, payload, config) + .post(DIVISI_SEARCH, payload, HEADER) .then(res => res) .catch((error) => error.response); if (result && result.data && result.data.code == 200) { + result.data.data.map((res) => { + res.key = res.id.toString() + }); setDatatable(result.data.data); setTotalPage(result.data.totalRecord); } else { NotificationManager.error('Gagal Mengambil Data!!', 'Failed'); } } + const handleExportExcel = async () => { + let start = 0; + + if (currentPage !== 1 && currentPage > 1) { + start = (currentPage * rowsPerPage) - rowsPerPage + } + + const payload = { + "columns": [ + { + "name": "name", + "logic_operator": "like", + "value": search, + "operator": "AND" + } + ], + "orders": { + "ascending": true, + "columns": [ + 'id' + ] + }, + "paging": { + "length": rowsPerPage, + "start": start + } + } + + const result = await axios + .post(DIVISI_SEARCH, payload, HEADER) + .then(res => res) + .catch((error) => error.response); + if (result && result.data && result.data.code == 200) { + let resData = result.data.data; + const excelData = []; + resData.map((val, index) => { + let dataRow = { + "Nama Divisi": val.name, + "Deskripsi": val.description, + } + excelData.push(dataRow) + }) + await setDataExport(excelData) + } else { + NotificationManager.error('Gagal Export Data!!', 'Failed'); + } + } + + const exportExcel = () => { + const dataExcel = dataExport || []; + const fileName = `Data ${pageName}.xlsx`; + const ws = XLSX.utils.json_to_sheet(dataExcel); + const wb = XLSX.utils.book_new(); + XLSX.utils.book_append_sheet(wb, ws, `Data ${pageName}`); + XLSX.writeFile(wb, fileName); + setDataExport([]) + } const handleSearch = e => { const value = e.target.value @@ -248,10 +317,16 @@ const ProjectType = ({ params }) => {

{pageName}

+ + + + + + @@ -280,7 +355,7 @@ const ProjectType = ({ params }) => { handleEdit(n)}> - {n.displayName} + {n.name} {n.description} ) diff --git a/src/views/SimproV2/Presence/index.js b/src/views/SimproV2/Presence/index.js index 5cefa3e..e368342 100644 --- a/src/views/SimproV2/Presence/index.js +++ b/src/views/SimproV2/Presence/index.js @@ -196,12 +196,13 @@ const Index = ({ params }) => { let dataRow = { "NIK/ID Card": val.join_first_ktp_number ? val.join_first_ktp_number : '-', "Nama Human Resource": val.join_first_name ? val.join_first_name : '', - "Tanggal Kehadiran": val.date_presence ? moment(val.date_presence).format("D-M-YYYY") : '-', "Jam Masuk": val.clock_in ? moment(val.clock_in).format("D-M-YYYY HH:mm:ss") : '-', "Jam Keluar": val.clock_out ? moment(val.clock_out).format("D-M-YYYY HH:mm:ss") : '-', "Durasi Kerja": renderDurasiKerja(val.clock_in, val.clock_out), - "Clock-in Location": val.clock_in_loc && val.clock_in_loc !== '' ? val.clock_in_loc : '-', - "Clock-out Location": val.clock_out_loc && val.clock_out_loc !== '' ? val.clock_out_loc : '-' + "Lokasi Masuk": val.clock_in_loc && val.clock_in_loc !== '' ? val.clock_in_loc : '-', + "Lokasi Pulang": val.clock_out_loc && val.clock_out_loc !== '' ? val.clock_out_loc : '-', + "Area Kerja In": val.clock_in_boundary ? "Sesuai" : "Tidak Sesuai", + "Area Kerja Out": val.clock_out_boundary == null ? "-" : val.clock_out_boundary ? "Sesuai" : "Tidak Sesuai", } excelData.push(dataRow) }) From 81a16c28ac115b67192a1c069c86ade9aa4b3508 Mon Sep 17 00:00:00 2001 From: Wahyu Ramadhan Date: Thu, 16 Feb 2023 13:26:16 +0700 Subject: [PATCH 3/6] Fix ui dashboard bod --- src/views/Dashboard/DashboardBOD.js | 35 ++++++++++++++++++----------- 1 file changed, 22 insertions(+), 13 deletions(-) diff --git a/src/views/Dashboard/DashboardBOD.js b/src/views/Dashboard/DashboardBOD.js index f22d136..8515a48 100644 --- a/src/views/Dashboard/DashboardBOD.js +++ b/src/views/Dashboard/DashboardBOD.js @@ -406,6 +406,15 @@ const DashboardBOD = () => { { datalabels: { color: '#FFFFFF', formatter: function(value, context) { - return value ? toRupiah(value, {useUnit: 'jt'}) : 0 + return value ? toRupiah(value, { useUnit: 'jt' }) : 0 } } }, @@ -489,10 +498,10 @@ const DashboardBOD = () => { label: "", // data: [2, 4, 10], data: [ - PROJECT_BY_FINANCIAL_HEALTH && PROJECT_BY_FINANCIAL_HEALTH.overrun ? PROJECT_BY_FINANCIAL_HEALTH.overrun : 0, - PROJECT_BY_FINANCIAL_HEALTH && PROJECT_BY_FINANCIAL_HEALTH.warning ? PROJECT_BY_FINANCIAL_HEALTH.warning : 0, - PROJECT_BY_FINANCIAL_HEALTH && PROJECT_BY_FINANCIAL_HEALTH['on-budget'] ? PROJECT_BY_FINANCIAL_HEALTH['on-budget'] : 0 - ], + PROJECT_BY_FINANCIAL_HEALTH && PROJECT_BY_FINANCIAL_HEALTH.overrun ? PROJECT_BY_FINANCIAL_HEALTH.overrun : '', + PROJECT_BY_FINANCIAL_HEALTH && PROJECT_BY_FINANCIAL_HEALTH.warning ? PROJECT_BY_FINANCIAL_HEALTH.warning : '', + PROJECT_BY_FINANCIAL_HEALTH && PROJECT_BY_FINANCIAL_HEALTH['on-budget'] ? PROJECT_BY_FINANCIAL_HEALTH['on-budget'] : '' + ].filter(value => value !== null), borderColor: ["#E80053", "#FFD600", "#52AC0B",], backgroundColor: ["#E80053", "#FFD600", "#52AC0B",], borderWidth: 2, @@ -515,9 +524,9 @@ const DashboardBOD = () => { label: "", // data: [1, 3, 11], data: [ - PROJECT_BY_SCHEDULE_HEALTH && PROJECT_BY_SCHEDULE_HEALTH['behind-schedule'] ? PROJECT_BY_SCHEDULE_HEALTH['behind-schedule'] : 0, - PROJECT_BY_SCHEDULE_HEALTH && PROJECT_BY_SCHEDULE_HEALTH.warning ? PROJECT_BY_SCHEDULE_HEALTH.warning : 0, - PROJECT_BY_SCHEDULE_HEALTH && PROJECT_BY_SCHEDULE_HEALTH['on-schedule'] ? PROJECT_BY_SCHEDULE_HEALTH['on-schedule'] : 0 + PROJECT_BY_SCHEDULE_HEALTH && PROJECT_BY_SCHEDULE_HEALTH['behind-schedule'] ? PROJECT_BY_SCHEDULE_HEALTH['behind-schedule'] : '', + PROJECT_BY_SCHEDULE_HEALTH && PROJECT_BY_SCHEDULE_HEALTH.warning ? PROJECT_BY_SCHEDULE_HEALTH.warning : '', + PROJECT_BY_SCHEDULE_HEALTH && PROJECT_BY_SCHEDULE_HEALTH['on-schedule'] ? PROJECT_BY_SCHEDULE_HEALTH['on-schedule'] : '' ], borderColor: ["#E80053", "#FFD600", "#52AC0B"], backgroundColor: ["#E80053", "#FFD600", "#52AC0B"], @@ -571,8 +580,8 @@ const DashboardBOD = () => { label: "", // data: [7, 2, 4, 3], data: PROJECT_PER_DIVISION ? PROJECT_PER_DIVISION.map((item, idx) => item.total) : [], - borderColor: ["#023E8A", "#C851B7", "#FD7034", "#3A0CA3"], - backgroundColor: ["#023E8A", "#C851B7", "#FD7034", "#3A0CA3"], + borderColor: ["#023E8A", "#C851B7", "#FD7034", "#3A0CA3", "#A36A16"], + backgroundColor: ["#023E8A", "#C851B7", "#FD7034", "#3A0CA3", "#A36A16"], borderWidth: 2, borderSkipped: false }, @@ -622,9 +631,9 @@ const DashboardBOD = () => { { label: "", // data: [50, 120, 72, 60], - data: PROJECT_VALUE_PER_DIVISION ? PROJECT_VALUE_PER_DIVISION.map((item, idx) => item.total) : [], - borderColor: ["#023E8A", "#C851B7", "#FD7034", "#3A0CA3"], - backgroundColor: ["#023E8A", "#C851B7", "#FD7034", "#3A0CA3"], + data: PROJECT_VALUE_PER_DIVISION ? PROJECT_VALUE_PER_DIVISION.map((item, idx) => item.total).filter(value => value !== 0) : [], + borderColor: ["#023E8A", "#C851B7", "#FD7034", "#3A0CA3", "#A36A16"], + backgroundColor: ["#023E8A", "#C851B7", "#FD7034", "#3A0CA3", "#A36A16"], borderWidth: 2, borderSkipped: false }, From b954abcfaabc613aeead9c50044e06322a498a07 Mon Sep 17 00:00:00 2001 From: Wahyu Ramadhan Date: Thu, 16 Feb 2023 13:54:32 +0700 Subject: [PATCH 4/6] Fix date --- src/views/Report/k3/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/views/Report/k3/index.js b/src/views/Report/k3/index.js index 497a300..cd87fe9 100644 --- a/src/views/Report/k3/index.js +++ b/src/views/Report/k3/index.js @@ -451,7 +451,7 @@ export default class index extends Component { return ( { n.join_first_name ? n.join_first_name : "-" } - { n.report_date ? moment(n.report_date).format("DD-MM-YYYY HH:mm:ss") : "-" } + {n.report_date ? moment(n.report_date).format("DD-MM-YYYY") : "-"} { n.k3_checked.length ? n.k3_checked.join() : "-"} { n.k3_not_checked.length ? n.k3_not_checked.join() : "-"} { n.description ? n.description : "-"} From d580bab3c57f444c2f113793380ac8eb89c2e8c3 Mon Sep 17 00:00:00 2001 From: farhan048 Date: Thu, 16 Feb 2023 15:27:32 +0700 Subject: [PATCH 5/6] add kolom status_boundary --- .../SimproV2/ResourceWorker/DialogForm.js | 53 +++++++++---------- 1 file changed, 24 insertions(+), 29 deletions(-) diff --git a/src/views/SimproV2/ResourceWorker/DialogForm.js b/src/views/SimproV2/ResourceWorker/DialogForm.js index e293ea4..e198a02 100644 --- a/src/views/SimproV2/ResourceWorker/DialogForm.js +++ b/src/views/SimproV2/ResourceWorker/DialogForm.js @@ -40,7 +40,7 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi const [address, setAddress] = useState('') const [divisionId, setDivisionId] = useState('') const [statusResource, setStatusResource] = useState('active') - + const [statusRestriction, setStatusRestriction] = useState(false) useEffect(() => { if (typeDialog === "Edit" || typeDialog === "Set") { console.log("cel data Edit", dataEdit) @@ -112,8 +112,10 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi role_id: roleId, divisi_id: divisionId, address, - status_resource: statusResource + status_resource: statusResource, + status_boundary: statusRestriction } + console.log(data) if (birthDate && birthDate != "") { data['birth_date'] = birthDate; @@ -154,7 +156,8 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi role_id: roleId, divisi_id: divisionId, address, - status_resource: statusResource + status_resource: statusResource, + status_boundary: statusRestriction } if (birthDate && birthDate != "") { @@ -196,42 +199,30 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi const renderForm = () => { return (
+ + + * Wajib diisi. + + - - + {/* setKtpNumber(e.target.value.replace(/[^0-9]/g, ''))} placeholder={`Input NIK (KTP)...`} maxLength="16" /> */} setKtpNumber(e.target.value)} placeholder={`Input NIK (KTP)...`} maxLength="16" /> - + setResourceName(e.target.value)} placeholder={`Input resource name...`} /> - {/* {typeDialog === 'Save' && - - - - - setPassword(e.target.value)} placeholder={`Password...`} /> - - - - - - setRetryPassword(e.target.value)} placeholder={`Retry password...`} /> - - - - } */} - + setRoleId(val)} placeholder="Select Role" style={{ width: '100%' }}> {setupSelectRole()} @@ -290,11 +281,7 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - - {/* */} + @@ -310,12 +297,20 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi + + + + setAddress(e.target.value)} placeholder="Input address..." /> +
) From bb279c5769a5b918653a0778de4e327a44e1f5b2 Mon Sep 17 00:00:00 2001 From: farhan048 Date: Thu, 16 Feb 2023 16:11:49 +0700 Subject: [PATCH 6/6] trans --- package.json | 2 + src/const/ApiConst.js | 2 +- src/const/en.json | 75 ++++ src/const/i18n.js | 24 ++ src/const/id.json | 75 ++++ src/utils/LangUtils.js | 6 + src/views/Master/MasterAbsensi/index.js | 395 +++++++++-------- src/views/Master/MasterMenu/DialogForm.js | 159 +++---- src/views/Master/MasterMenu/index.js | 130 +++--- src/views/Master/MasterRoles/DialogForm.js | 107 ++--- .../Master/MasterRoles/DialogMenuRoles.js | 202 ++++----- src/views/Master/MasterRoles/index.js | 29 +- src/views/Master/ProjectPhase/DialogForm.js | 10 +- src/views/Master/ProjectPhase/index.js | 28 +- src/views/Master/RoleProject/DialogForm.js | 107 ++--- src/views/Master/RoleProject/index.js | 28 +- src/views/Report/k3/index.js | 400 +++++++++--------- src/views/SimproV2/ChecklistK3/DialogForm.js | 15 +- src/views/SimproV2/ChecklistK3/index.js | 30 +- src/views/SimproV2/Divisi/DialogForm.js | 33 +- src/views/SimproV2/Divisi/index.js | 26 +- src/views/SimproV2/Presence/DialogFoto.js | 28 +- src/views/SimproV2/Presence/index.js | 40 +- src/views/SimproV2/ProjectType/DialogForm.js | 117 ++--- .../ProjectType/DialogInitialGantt.js | 26 +- src/views/SimproV2/ProjectType/index.js | 33 +- src/views/SimproV2/Satuan/DialogForm.js | 13 +- src/views/SimproV2/Satuan/index.js | 30 +- 28 files changed, 1185 insertions(+), 985 deletions(-) create mode 100644 src/const/en.json create mode 100644 src/const/i18n.js create mode 100644 src/const/id.json create mode 100644 src/utils/LangUtils.js diff --git a/package.json b/package.json index 456954b..fa1c3a8 100644 --- a/package.json +++ b/package.json @@ -46,6 +46,7 @@ "enzyme-adapter-react-16": "^1.14.0", "flag-icon-css": "^3.3.0", "font-awesome": "^4.7.0", + "i18next": "^22.4.9", "interactjs": "^1.10.11", "jspdf": "^2.5.1", "jspdf-autotable": "^3.5.25", @@ -73,6 +74,7 @@ "react-dom": "^16.14.0", "react-grid-layout": "^1.2.5", "react-highlight-words": "^0.18.0", + "react-i18next": "^12.1.5", "react-leaflet": "^3.2.0", "react-leaflet-draw": "^0.19.8", "react-loader-spinner": "^3.1.5", diff --git a/src/const/ApiConst.js b/src/const/ApiConst.js index 1c8c8d9..ed3b5ec 100644 --- a/src/const/ApiConst.js +++ b/src/const/ApiConst.js @@ -113,7 +113,7 @@ export const TOKEN_ADW = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiIxMjAyI // export let BASE_OSPRO = "https://ospro-api.ospro.id"; export let BASE_OSPRO = "https://adw-api.ospro.id"; -// export let BASE_OSPRO = "http://localhost:8444"; +// export let BASE_OSPRO = "http://localhost:8444/adw-backend"; // export let BASE_OSPRO = "http://192.168.1.123:8444"; // local // export let BASE_OSPRO = "http://103.73.125.81:8444"; // ip public adw export let BASE_SIMPRO_LUMEN = `${BASE_OSPRO}/api`; diff --git a/src/const/en.json b/src/const/en.json new file mode 100644 index 0000000..e3285d2 --- /dev/null +++ b/src/const/en.json @@ -0,0 +1,75 @@ +{ + "3days": "3 Days Ago", + "7days": "7 Days Ago", + "action": "Action", + "add": "Add", + "ChecklistK3Add": "Add Checklist K3", + "cancel": "Cancel", + "close": "Close", + "color": "Color", + "date": "Date", + "dateAbsent": "Absent Date", + "dateReport": "Report Date", + "delete": "Delete", + "deleteMsg": "Delete this data ?", + "deleteConfirm": "Are you sure ?", + "description": "Description", + "division": "Division", + "divisionAdd": "Add Division", + "edit": "Edit", + "export": "Export", + "exportExcel": "Export Excel", + "exportPdf": "Export Pdf", + "gearUse": "Gear Used", + "gearNotUse": "Gear Not used", + "hr": "Human Resource", + "icon": "Icon", + "inputIcon": "Input Code Icon", + "inputName": "Input Name", + "inputDescription": "Input Description", + "inputParentMenu": "Select Parent Menu", + "inputAliasMenu": "Input Menu Alias", + "inputOrder": "Input Order", + "inputUrl": "Input URL", + "image": "Image", + "imageCheck": "Selfie Presence", + "locIn": "Location In", + "locOut": "Location Out", + "menuRoles": "Roles Menu", + "menuAdd": "Add Menu", + "nik": "ID Card", + "name": "Name", + "nameHR": "Name Human Resource", + "nameRole": "Name Role", + "nameDivision": "Name Division", + "nameProjectType": "Project Type", + "nameProjectRole": "Project Role", + "noData": "Data not yet available", + "order": "Order", + "parentMenu": "Parent Menu", + "phase": "Project Phase", + "projectType": "Add Project Type", + "projectPhase": "Add Project Phase", + "presenceIn": "Presence In", + "presenceOut": "Presence Out", + "rolesAdd": "Add Roles", + "roles": "Roles", + "search": "Search", + "save": "Save", + "searchType": "Search Project Type", + "searchPhase": "Search Project Phase", + "searchDivision": "Search Division", + "searchUom": "Search UOM", + "searchChecklistK3": "Search checklist K3", + "searchRoles": "Search Roles", + "searchProjectRoles": "Search Project Roles", + "searchProject": "All / Select Projects", + "searchMenu": "Search Menu", + "searchHR": "Search Human Resource", + "today": "Today", + "uom": "UOM", + "uomAdd": "Add UOM", + "workDuration": "Work Duration", + "workAreaIn": "Work Area In", + "workAreaOut": "Work Area Out" +} \ No newline at end of file diff --git a/src/const/i18n.js b/src/const/i18n.js new file mode 100644 index 0000000..30f2fe2 --- /dev/null +++ b/src/const/i18n.js @@ -0,0 +1,24 @@ +import i18n from "i18next"; +import { initReactI18next } from "react-i18next"; +import en from "./en.json"; +import id from "./id.json"; +i18n + .use(initReactI18next) + .init({ + debug: true, + fallbackLng: 'id', + interpolation: { + escapeValue: false, // not needed for react as it escapes by default + }, + resources: { + en: { + translation: en, + }, + id: { + translation: id, + } + }, + + lng: localStorage.getItem("lng") || "id", + }); +export default i18n; \ No newline at end of file diff --git a/src/const/id.json b/src/const/id.json new file mode 100644 index 0000000..35863af --- /dev/null +++ b/src/const/id.json @@ -0,0 +1,75 @@ +{ + "3days": "3 Hari Yang lalu", + "7days": "7 Hari Yang lalu", + "action": "Aksi", + "add": "Tambah", + "ChecklistK3Add": "Tambah Ceklis K3", + "cancel": "Batal", + "close": "Tutup", + "color": "Warna", + "date": "Tanggal", + "dateAbsent": "Tanggal Absen", + "dateReport": "Tanggal Lapor", + "delete": "Hapus", + "deleteMsg": "Hapus Data Ini ?", + "deleteConfirm": "Apakah Anda Yakin ?", + "description": "Deskripsi", + "division": "Divisi", + "divisionAdd": "Tambah Divisi", + "edit": "Ubah", + "export": "Ekspor", + "exportExcel": "Ekspor Excel", + "exportPdf": "Ekspor Pdf", + "gearUse": "Perlengkapan Dikenakan", + "gearNotUse": "Perlengkapan Tidak Dikenakan", + "hr": "Pegawai", + "icon": "Ikon", + "inputIcon": "Masukan Kode Ikon", + "inputName": "Masukan Nama", + "inputDescription": "Masukan Deskripsi", + "inputParentMenu": "Pilih Induk Menu", + "inputAliasMenu": "Masukan Alias Menu", + "inputOrder": "Masukan Urutan", + "inputUrl": "Masukan URL", + "image": "Gambar", + "imageCheck": "Lihat Selfie Presensi", + "locIn": "Lokasi Masuk", + "locOut": "Lokasi Pulang", + "menuRoles": "Menu Peran", + "menuAdd": "Tambah Menu", + "nik": "NIK", + "nameDivision": "Nama Divisi", + "name": "Nama", + "nameHR": "Nama Pegawai", + "nameRole": "Nama Peran", + "nameProjectType": "Tipe Proyek", + "nameProjectRole": "Peran Proyek", + "noData": "Data Belum tersedia", + "order": "Urutan", + "parentMenu": "Menu Induk", + "phase": "Fase Proyek", + "projectType": "Tambah Tipe Proyek", + "projectPhase": "Tambah Fase Proyek", + "presenceIn": "Waktu Masuk", + "presenceOut": "Waktu Pulang", + "rolesAdd": "Tambah Roles", + "roles": "Peran", + "save": "Simpan", + "search": "Cari", + "searchType": "Cari Tipe Proyek", + "searchPhase": "Cari Fase Proyek", + "searchDivision": "Cari Divisi", + "searchUom": "Cari Satuan", + "searchChecklistK3": "Cari Ceklis K3", + "searchRoles": "Cari Peran", + "searchProjectRoles": "Cari Peran Proyek", + "searchProject": "Semua / Pilih Proyek", + "searchMenu": "Cari Menu", + "searchHR": "Cari Nama Pegawai", + "today": "Hari Ini", + "uom": "Satuan", + "uomAdd": "Tambah Satuan", + "workDuration": "Durasi Kerja", + "workAreaIn": "Area Kerja In", + "workAreaOut": "Area Kerja Out" +} \ No newline at end of file diff --git a/src/utils/LangUtils.js b/src/utils/LangUtils.js new file mode 100644 index 0000000..ef1f15f --- /dev/null +++ b/src/utils/LangUtils.js @@ -0,0 +1,6 @@ +import i18n from "../const/i18n"; + +export const handleChangeLng = (lng) => { + i18n.changeLanguage(lng); + localStorage.setItem("lng", lng); +}; \ No newline at end of file diff --git a/src/views/Master/MasterAbsensi/index.js b/src/views/Master/MasterAbsensi/index.js index 02bbc58..8c06b9e 100644 --- a/src/views/Master/MasterAbsensi/index.js +++ b/src/views/Master/MasterAbsensi/index.js @@ -7,34 +7,27 @@ import SweetAlert from 'react-bootstrap-sweetalert'; import DialogForm from './DialogForm'; import { NotificationContainer, NotificationManager } from 'react-notifications'; import { Pagination, Tooltip } from 'antd'; -import { DatePicker,Select } from 'antd'; +import { DatePicker, Select } from 'antd'; import * as XLSX from 'xlsx'; -import { ABSENSI_SEARCH, ABSENSI_ADD, ABSENSI_DELETE, ABSENSI_EDIT,PROYEK_SEARCH, USERPROYEK_SEARCH } from '../../../const/ApiConst.js'; +import { ABSENSI_SEARCH, ABSENSI_ADD, ABSENSI_DELETE, ABSENSI_EDIT, PROYEK_SEARCH, USERPROYEK_SEARCH } from '../../../const/ApiConst.js'; import MapConfig from '../../MapConfig/MapConfig'; +import { withTranslation } from 'react-i18next'; const { RangePicker } = DatePicker; const { Option } = Select const token = window.localStorage.getItem('token'); const config = { - headers: - { - Authorization : `Bearer ${token}`, - "Content-type" : `application/json` + headers: + { + Authorization: `Bearer ${token}`, + "Content-type": `application/json` } }; const BASE_URL = ""; - - -const column = [ - { name: "Nama Human Resource" }, - { name: "Deskripsi"}, - { name: "Tanggal Absensi"}, -] - const LENGTH_DATA = 10 -export default class index extends Component { +class index extends Component { constructor(props) { super(props) this.state = { @@ -54,15 +47,15 @@ export default class index extends Component { totalPage: 0, tooltipEdit: false, tooltipDelete: false, - startDate:moment(moment().format("YYYY-M-D")), - endDate:moment(moment().format("YYYY-M-D")), + startDate: moment(moment().format("YYYY-M-D")), + endDate: moment(moment().format("YYYY-M-D")), currentDay: 'today', - tooltipTambah:false, - tooltipExport:false, - currentProyek:parseInt(localStorage.getItem('role_id'))===2 ? parseInt(localStorage.getItem('proyek_id')) : null, - allUserToProyek:[], - allDataProyek:[], - finishSetupOption:false + tooltipTambah: false, + tooltipExport: false, + currentProyek: parseInt(localStorage.getItem('role_id')) === 2 ? parseInt(localStorage.getItem('proyek_id')) : null, + allUserToProyek: [], + allDataProyek: [], + finishSetupOption: false } } @@ -73,29 +66,29 @@ export default class index extends Component { } async componentDidUpdate(prevProps, prevState) { - const { search,startDate, dataExport,currentProyek,allUserToProyek } = this.state + const { search, startDate, dataExport, currentProyek, allUserToProyek } = this.state if (search !== prevState.search) this.getDataAbsensi() if (startDate !== prevState.startDate) this.getDataAbsensi() - if (dataExport !== prevState.dataExport){ - if(dataExport.length > 0){ + if (dataExport !== prevState.dataExport) { + if (dataExport.length > 0) { this.exportExcel() } } - if(currentProyek!== prevState.currentProyek){ - if(localStorage.getItem('role_id')!==2){ + if (currentProyek !== prevState.currentProyek) { + if (localStorage.getItem('role_id') !== 2) { this.getUserProyek(); } } - if(allUserToProyek!== prevState.allUserToProyek){ + if (allUserToProyek !== prevState.allUserToProyek) { this.getDataAbsensi(); } } setUpFirstProyek = () => { - if(parseInt(localStorage.getItem('role_id'))===2){ - this.setState({disableProyek:true}); - }else{ - this.setState({currentProyek:null}) + if (parseInt(localStorage.getItem('role_id')) === 2) { + this.setState({ disableProyek: true }); + } else { + this.setState({ currentProyek: null }) } } @@ -106,12 +99,12 @@ export default class index extends Component { getAllProyek = async () => { const payload = { - "paging": {"start": 0, "length": -1}, + "paging": { "start": 0, "length": -1 }, "columns": [ - {"name": "nama", "logic_operator": "ilike", "value": "", "operator": "AND"} + { "name": "nama", "logic_operator": "ilike", "value": "", "operator": "AND" } ], "joins": [], - "orders": {"columns": ["id"], "ascending": false} + "orders": { "columns": ["id"], "ascending": false } } const result = await axios @@ -120,29 +113,29 @@ export default class index extends Component { .catch((error) => error.response); - if(result && result.data && result.data.code == 200){ - this.setState({allDataProyek:result.data.data}) - }else{ + if (result && result.data && result.data.code == 200) { + this.setState({ allDataProyek: result.data.data }) + } else { } } getUserProyek = async () => { const payload = { - "paging": {"start": 0, "length": -1}, + "paging": { "start": 0, "length": -1 }, "joins": [], - "orders": {"columns": ["id"], "ascending": false} + "orders": { "columns": ["id"], "ascending": false } } - if(parseInt(localStorage.getItem('role_id'))===1){ - if(this.state.currentProyek && this.state.currentProyek > 0){ + if (parseInt(localStorage.getItem('role_id')) === 1) { + if (this.state.currentProyek && this.state.currentProyek > 0) { payload['columns'] = [ - {"name": "proyek_id", "logic_operator": "=", "value": `${this.state.currentProyek}`, "operator": "AND"} + { "name": "proyek_id", "logic_operator": "=", "value": `${this.state.currentProyek}`, "operator": "AND" } ] } - }else{ + } else { payload['columns'] = [ - {"name": "proyek_id", "logic_operator": "=", "value": `${localStorage.getItem('proyek_id')}`, "operator": "AND"} + { "name": "proyek_id", "logic_operator": "=", "value": `${localStorage.getItem('proyek_id')}`, "operator": "AND" } ] } @@ -153,9 +146,9 @@ export default class index extends Component { .catch((error) => error.response); - if(result && result.data && result.data.code == 200){ - this.setState({allUserToProyek:result.data.data}) - }else{ + if (result && result.data && result.data.code == 200) { + this.setState({ allUserToProyek: result.data.data }) + } else { } } @@ -171,53 +164,53 @@ export default class index extends Component { let dateEnd = moment(this.state.endDate).format("YYYY-MM-DD 23:59:59"); const payload = { - "paging":{ - "start":start, - "length":this.state.rowsPerPage + "paging": { + "start": start, + "length": this.state.rowsPerPage }, - "filter_columns":[ - { - "name":"name", - "value":"", - "table_name":"m_users" - } + "filter_columns": [ + { + "name": "name", + "value": "", + "table_name": "m_users" + } ], - "columns":[ - {"name": "created_at", "logic_operator": "range", "value": dateStart, "value1": dateEnd, "operator": "AND"}, - {"name": "name", "logic_operator": "ilike", "value": this.state.search, "operator": "AND", "table_name":"m_users"} + "columns": [ + { "name": "created_at", "logic_operator": "range", "value": dateStart, "value1": dateEnd, "operator": "AND" }, + { "name": "name", "logic_operator": "ilike", "value": this.state.search, "operator": "AND", "table_name": "m_users" } ], - "joins":[ - { - "name":"m_users", - "column_join":"user_id", - "column_results":[ - "name", - ] - } + "joins": [ + { + "name": "m_users", + "column_join": "user_id", + "column_results": [ + "name", + ] + } ], - "orders":{ - "columns":[ - "id" - ], - "ascending":false + "orders": { + "columns": [ + "id" + ], + "ascending": false } } - - + + const result = await axios .post(ABSENSI_SEARCH, payload, config) .then(res => res) .catch((error) => error.response); - if(result && result.data && result.data.code == 200){ + if (result && result.data && result.data.code == 200) { console.log("cek res", result.data.data) let totalRecord = result.data.totalRecord let resData = result.data.data || [] this.setState({ dataTable: resData, totalPage: totalRecord }); - }else{ + } else { NotificationManager.error('Gagal Mengambil Data!!', 'Failed'); } } @@ -248,11 +241,11 @@ export default class index extends Component { .then(res => res) .catch((error) => error.response); - if(result && result.data && result.data.code==200){ + if (result && result.data && result.data.code == 200) { this.getDataAbsensi() this.setState({ idDelete: 0, alertDelete: false }) NotificationManager.success('Data absensi berhasil dihapus!!', 'Success!!'); - }else{ + } else { this.getDataAbsensi() this.setState({ idDelete: 0, alertDelete: false }) NotificationManager.error('Data absensi gagal dihapus!!', 'Failed!!'); @@ -260,44 +253,44 @@ export default class index extends Component { } saveAbsensi = async (data) => { - + const formData = { - user_id:data.idEmployee, - description:data.description, - created_at:data.dateAbsent + user_id: data.idEmployee, + description: data.description, + created_at: data.dateAbsent } const result = await axios.post(ABSENSI_ADD, formData, config) .then(res => res) .catch((error) => error.response); - if(result && result.data && result.data.code==200){ + if (result && result.data && result.data.code == 200) { this.getDataAbsensi(); NotificationManager.success('Data absensi berhasil ditambahkan!!', 'Success!!'); - }else{ + } else { NotificationManager.error(`${result.data.message}`, 'Failed!!'); } - + } editDataAbsensi = async (data) => { let url = ABSENSI_EDIT(data.id) - + const formData = { - user_id:data.idEmployee, - description:data.description, - created_at:data.dateAbsent + user_id: data.idEmployee, + description: data.description, + created_at: data.dateAbsent } const result = await axios.put(url, formData, config) .then(res => res) .catch((error) => error.response); - if(result && result.data && result.data.code==200){ + if (result && result.data && result.data.code == 200) { this.getDataAbsensi(); NotificationManager.success('Data absensi berhasil diedit!!', 'Success!!'); - }else{ + } else { NotificationManager.error('Data absensi gagal diedit!!', 'Failed!!'); } - + } @@ -329,19 +322,19 @@ export default class index extends Component { this.setState(prevState => ({ tooltipDelete: !prevState.tooltipDelete })) } else if (param === "tambah") { this.setState(prevState => ({ tooltipTambah: !prevState.tooltipTambah })) - } else if (param === "export") { + } else if (param === "export") { this.setState(prevState => ({ tooltipExport: !prevState.tooltipExport })) } } handleDatePicker = (date, dateString) => { - this.setState({ startDate:date[0],endDate:date[1] },()=>{ + this.setState({ startDate: date[0], endDate: date[1] }, () => { this.getDataAbsensi(); }) } handleTipe = (e) => { - this.setState({ typeClock:e.target.value }, () => { + this.setState({ typeClock: e.target.value }, () => { this.getDataAbsensi(); }); } @@ -350,101 +343,102 @@ export default class index extends Component { let dateStart = moment(this.state.startDate).format("YYYY-MM-DD 00:00:00"); let dateEnd = moment(this.state.endDate).format("YYYY-MM-DD 23:59:59"); const payload = { - "paging":{ - "start":0, - "length":-1 - }, - "filter_columns":[ + "paging": { + "start": 0, + "length": -1 + }, + "filter_columns": [ { - "name":"name", - "value":"", - "table_name":"m_users" + "name": "name", + "value": "", + "table_name": "m_users" } - ], - "columns":[ - {"name": "created_at", "logic_operator": "range", "value": dateStart, "value1": dateEnd, "operator": "AND"}, - {"name": "name", "logic_operator": "ilike", "value": this.state.search, "operator": "AND", "table_name":"m_users"} - ], - "joins":[ + ], + "columns": [ + { "name": "created_at", "logic_operator": "range", "value": dateStart, "value1": dateEnd, "operator": "AND" }, + { "name": "name", "logic_operator": "ilike", "value": this.state.search, "operator": "AND", "table_name": "m_users" } + ], + "joins": [ { - "name":"m_users", - "column_join":"user_id", - "column_results":[ - "name", - ] + "name": "m_users", + "column_join": "user_id", + "column_results": [ + "name", + ] } - ], - "orders":{ - "columns":[ - "id" + ], + "orders": { + "columns": [ + "id" ], - "ascending":false - } - } - + "ascending": false + } + } + + - const result = await axios .post(ABSENSI_SEARCH, payload, config) .then(res => res) .catch((error) => error.response); - if(result && result.data && result.data.code == 200){ + if (result && result.data && result.data.code == 200) { let resData = result.data.data || [] const excelData = []; resData.map((n, index) => { let dataRow = { - "Nama Human Resource":n.join_first_name ? n.join_first_name : "", - "Deskripsi":n.description ? n.description : "", - "Tanggal Absensi" :n.created_at!==null ? moment(n.created_at).format("DD-MM-YYYY") : "-", + "Nama Human Resource": n.join_first_name ? n.join_first_name : "", + "Deskripsi": n.description ? n.description : "", + "Tanggal Absensi": n.created_at !== null ? moment(n.created_at).format("DD-MM-YYYY") : "-", } excelData.push(dataRow) }) - this.setState({dataExport:excelData}) - }else{ + this.setState({ dataExport: excelData }) + } else { NotificationManager.error('Gagal Export Data!!', 'Failed'); - } + } } exportExcel = () => { const dataExcel = this.state.dataExport || []; const fileName = `Data Absensi.xlsx`; const ws = XLSX.utils.json_to_sheet(dataExcel); - const wb = XLSX.utils.book_new(); - XLSX.utils.book_append_sheet(wb, ws, `Data Absensi`); + const wb = XLSX.utils.book_new(); + XLSX.utils.book_append_sheet(wb, ws, `Data Absensi`); - XLSX.writeFile(wb, fileName); - this.setState({dataExport:[] }) + XLSX.writeFile(wb, fileName); + this.setState({ dataExport: [] }) } setupSelectProyek = () => { let allDataProyek = this.state.allDataProyek - return( + return ( <> - {allDataProyek.map((val, index)=> { - return( - - ) - }) - } + {allDataProyek.map((val, index) => { + return ( + + ) + }) + } ) } onChangeProyek = (val) => { - this.setState({currentProyek:val}); + this.setState({ currentProyek: val }); } renderTable = () => { + const t = this.props; const dataTable2 = this.state.dataTable || []; return ( - {dataTable2.length!==0 ? dataTable2.map((n) => { - return ( - - {/* + {dataTable2.length !== 0 ? dataTable2.map((n) => { + return ( + + {/* this.handleDelete(n.id)}> this.toggle("delete")}> Delete @@ -455,55 +449,58 @@ export default class index extends Component { Edit */} - {n.join_first_name ? n.join_first_name : ""} - { n.description ? n.description : "-" } - { n.created_at ? moment(n.created_at).format("YYYY-MM-DD") : "-" } - - ) - }) : - No Data Available - - } - + {n.join_first_name ? n.join_first_name : ""} + {n.description ? n.description : "-"} + {n.created_at ? moment(n.created_at).format("YYYY-MM-DD") : "-"} + + ) + }) : + {this.props.t('noData')} + + } + ) } handleChangeDay = (e) => { const val = e.target.value; - this.setState({ currentDay:val }); - if(val==="today"){ - console.log("test 1 test",val); + this.setState({ currentDay: val }); + if (val === "today") { this.setState({ - startDate:moment(moment().format("YYYY-M-D")), - endDate:moment(moment().format("YYYY-M-D")), + startDate: moment(moment().format("YYYY-M-D")), + endDate: moment(moment().format("YYYY-M-D")), currentPage: 1 }) - }else if(val==="3 day"){ - console.log("test test",val); + } else if (val === "3 day") { this.setState({ - startDate:moment(moment().subtract(3, "days").format("YYYY-M-D")), - endDate:moment(moment().format("YYYY-M-D")), + startDate: moment(moment().subtract(3, "days").format("YYYY-M-D")), + endDate: moment(moment().format("YYYY-M-D")), currentPage: 1 }) - }else if(val==="7 day"){ - console.log("test test",val); + } else if (val === "7 day") { this.setState({ - startDate:moment(moment().subtract(7, "days").format("YYYY-M-D")), - endDate:moment(moment().format("YYYY-M-D")), + startDate: moment(moment().subtract(7, "days").format("YYYY-M-D")), + endDate: moment(moment().format("YYYY-M-D")), currentPage: 1 }) - }else{ - console.log("test 2 test",val); + } else { + console.log("test 2 test", val); this.setState({ - startDate:moment(moment().format("YYYY-M-D")), - endDate:moment(moment().format("YYYY-M-D")), + startDate: moment(moment().format("YYYY-M-D")), + endDate: moment(moment().format("YYYY-M-D")), currentPage: 1 }) } } render() { - const { tooltipTambah,tooltipExport,dataTable, openDialog, currentPage, rowsPerPage, totalPage, search, tooltipEdit, tooltipDelete } = this.state + const t = this.props; + const column = [ + { name: this.props.t('nameHR') }, + { name: this.props.t('description') }, + { name: this.props.t('dateAbsent') }, + ] + const { tooltipTambah, tooltipExport, dataTable, openDialog, currentPage, rowsPerPage, totalPage, search, tooltipEdit, tooltipDelete } = this.state return (
@@ -513,12 +510,12 @@ export default class index extends Component { showCancel confirmBtnText="Delete" confirmBtnBsStyle="danger" - title="Are you sure?" + title={this.props.t('deleteConfirm')} onConfirm={this.onConfirmDelete} onCancel={() => this.setState({ alertDelete: false, idDelete: 0 })} focusCancelBtn > - Data Absensi karyawan akan terhapus!! + {this.props.t('deleteMsg')}

{this.props.params.name}

- {/* */} - - - - {/* */} - {/* this.toggle("tambah")}> - Tambah Absensi - */} + + +
-
-
-
- this.handleChangeDay(e)} defaultValue={this.state.currentDay}> - - - - -
-
- {' '} - -
+
+
+
+ this.handleChangeDay(e)} defaultValue={this.state.currentDay}> + + + + +
+
+ {' '} +
-
+ +
@@ -571,7 +563,7 @@ export default class index extends Component { })} - { this.renderTable() } + {this.renderTable()}
{ +const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdit, dataMenu }) => { const [id, setId] = useState(0) const [name, setName] = useState('') const [url, setUrl] = useState('') @@ -15,10 +16,10 @@ const DialogForm = ({openDialog, closeDialog, toggleDialog, typeDialog, dataEdit const [icon, setIcon] = useState('') const [sequence, setSequence] = useState(0) const [parentId, setParentId] = useState(null) + const { t } = useTranslation() - - useEffect(()=> { - if(typeDialog==="Edit"){ + useEffect(() => { + if (typeDialog === "Edit") { console.log("data edit", dataEdit) setId(dataEdit.id) setName(dataEdit.name) @@ -27,7 +28,7 @@ const DialogForm = ({openDialog, closeDialog, toggleDialog, typeDialog, dataEdit setParentId(dataEdit.parent_id) setSequence(dataEdit.sequence) setAliasName(dataEdit.alias_name) - }else{ + } else { setId(0) setName('') setUrl('') @@ -36,47 +37,47 @@ const DialogForm = ({openDialog, closeDialog, toggleDialog, typeDialog, dataEdit setSequence(0) setAliasName('') } - },[dataEdit,openDialog]) + }, [dataEdit, openDialog]) const handleSave = () => { - let data = ''; - if(typeDialog==="Save"){ - data = { - name, - url, - sequence:parseInt(sequence), - icon, - alias_name:aliasName - } - - if(parentId && parentId > 0){ - data['parent_id'] = parentId - } - - closeDialog('save', data); - }else{ - data = { - id, - name, - url, - sequence: parseInt(sequence), - icon, - alias_name:aliasName - } - - if(parentId && parentId > 0){ - data['parent_id'] = parentId - } - - closeDialog('edit', data); + let data = ''; + if (typeDialog === "Save") { + data = { + name, + url, + sequence: parseInt(sequence), + icon, + alias_name: aliasName } - setId(0) - setName('') - setUrl('') - setIcon('') - setParentId(null) - setSequence(0) - setAliasName('') + + if (parentId && parentId > 0) { + data['parent_id'] = parentId + } + + closeDialog('save', data); + } else { + data = { + id, + name, + url, + sequence: parseInt(sequence), + icon, + alias_name: aliasName + } + + if (parentId && parentId > 0) { + data['parent_id'] = parentId + } + + closeDialog('edit', data); + } + setId(0) + setName('') + setUrl('') + setIcon('') + setParentId(null) + setSequence(0) + setAliasName('') } const handleCancel = () => { @@ -95,71 +96,71 @@ const DialogForm = ({openDialog, closeDialog, toggleDialog, typeDialog, dataEdit } const setupSelectParent = () => { - return( + return ( <> - {dataMenu.map((val, index)=> { - return( - - ) - })} + {dataMenu.map((val, index) => { + return ( + + ) + })} ) } - + const renderForm = () => { - return( + return (
- - - setName(e.target.value)} placeholder={`Menu..`}/> - - + + + setName(e.target.value)} placeholder={t('inputName')} /> + + - setUrl(e.target.value)} placeholder={`Url..`} /> - - - - setIcon(e.target.value)} placeholder={`Ikon..`} /> - + setUrl(e.target.value)} placeholder={t('inputUrl')} /> + + + + setIcon(e.target.value)} placeholder={t('inputIcon')} /> + - - - setSequence(e.target.value)} placeholder={`urutan..`} /> - - - - setSequence(e.target.value)} placeholder={t('inputOrder')} /> + + + + - - + + - setAliasName(e.target.value)} placeholder={`Alias..`} /> - + setAliasName(e.target.value)} placeholder={t('inputAliasMenu')} /> + - +
) } - + return ( - {typeDialog=="Save" ? `Tambah` : "Edit"} Menu + {typeDialog == "Save" ? `Tambah` : "Edit"} Menu - {renderForm()} + {renderForm()} {' '} - + ) - + } export default DialogForm; \ No newline at end of file diff --git a/src/views/Master/MasterMenu/index.js b/src/views/Master/MasterMenu/index.js index 8756d9e..bbb960d 100644 --- a/src/views/Master/MasterMenu/index.js +++ b/src/views/Master/MasterMenu/index.js @@ -5,10 +5,10 @@ import SweetAlert from 'react-bootstrap-sweetalert'; import axios from 'axios'; import { Button } from 'reactstrap'; import { Card, CardBody, CardHeader, Col, Row, Input } from 'reactstrap'; -import { MENU_ADD,MENU_SEARCH,MENU_EDIT,MENU_DELETE } from '../../../const/ApiConst.js'; +import { MENU_ADD, MENU_SEARCH, MENU_EDIT, MENU_DELETE } from '../../../const/ApiConst.js'; import { NotificationContainer, NotificationManager } from 'react-notifications'; import { Pagination, Tooltip, Table } from 'antd'; - +import { useTranslation } from 'react-i18next'; const token = window.localStorage.getItem('token'); const column = [ @@ -20,7 +20,7 @@ const column = [ { name: "Parent" }, ] -const Index = ({params}) => { +const Index = ({ params }) => { const [alertDelete, setAlertDelete] = useState(false) const [allDataMenu, setAllDataMenu] = useState([]) const [clickOpenModal, setClickOpenModal] = useState(false) @@ -38,33 +38,33 @@ const Index = ({params}) => { const [tooltipTambah, setTooltipTambah] = useState(false) const [totalPage, setTotalPage] = useState(0) const [typeDialog, setTypeDialog] = useState('Save') - + const { t } = useTranslation() const pageName = params.name; const config = { headers: { - Authorization : `Bearer ${token}`, - "Content-type" : `application/json` + Authorization: `Bearer ${token}`, + "Content-type": `application/json` } }; - useEffect(()=> { + useEffect(() => { getDataMenu(); getDataAllMenu(); - },[]) + }, []) - useEffect(()=> { - getDataMenu(); - },[search,currentPage,rowsPerPage]) + useEffect(() => { + getDataMenu(); + }, [search, currentPage, rowsPerPage]) - useEffect(()=> { + useEffect(() => { const cekData = dataExport || [] - if(cekData.length > 0){ + if (cekData.length > 0) { exportExcel() } - },[dataExport]) + }, [dataExport]) const handleSearch = e => { const value = e.target.value @@ -74,21 +74,21 @@ const Index = ({params}) => { const getDataAllMenu = async () => { const payload = { - "paging": {"start": 0, "length": -1}, + "paging": { "start": 0, "length": -1 }, "columns": [ - {"name": "name", "logic_operator": "ilike", "value": "", "operator": "AND"} + { "name": "name", "logic_operator": "ilike", "value": "", "operator": "AND" } ], "joins": [], - "orders": {"columns": ["id"], "ascending": false} + "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){ + if (result && result.data && result.data.code == 200) { setAllDataMenu(result.data.data); - }else{ + } else { } } @@ -100,18 +100,18 @@ const Index = ({params}) => { } const payload = { - "paging": {"start": start, "length": rowsPerPage}, + "paging": { "start": start, "length": rowsPerPage }, "columns": [ - {"name": "name", "logic_operator": "ilike", "value": search, "operator": "AND"} + { "name": "name", "logic_operator": "ilike", "value": search, "operator": "AND" } ], "joins": [{ - "name":"m_menu", - "column_join":"parent_id", - "column_results":[ - "name" - ] - }], - "orders": {"columns": ["id"], "ascending": false} + "name": "m_menu", + "column_join": "parent_id", + "column_results": [ + "name" + ] + }], + "orders": { "columns": ["id"], "ascending": false } } const result = await axios @@ -119,10 +119,10 @@ const Index = ({params}) => { .then(res => res) .catch((error) => error.response); - if(result && result.data && result.data.code == 200){ + if (result && result.data && result.data.code == 200) { setDatatable(result.data.data); setTotalPage(result.data.totalRecord); - }else{ + } else { NotificationManager.error('Gagal Mengambil Data!!', 'Failed'); } } @@ -170,7 +170,7 @@ const Index = ({params}) => { .then(res => res) .catch((error) => error.response); - if(result && result.data && result.data.code===200){ + if (result && result.data && result.data.code === 200) { getDataMenu(); getDataAllMenu(); NotificationManager.success(`Data menu berhasil ditambah`, 'Success!!'); @@ -187,7 +187,7 @@ const Index = ({params}) => { .then(res => res) .catch((error) => error.response); - if(result && result.data && result.data.code===200){ + if (result && result.data && result.data.code === 200) { getDataMenu(); NotificationManager.success(`Data menu berhasil diedit`, 'Success!!'); } else { @@ -220,25 +220,25 @@ const Index = ({params}) => { setTooltipDelete(!tooltipDelete) } else if (param === "tambah") { setTooltipTambah(!tooltipTambah) - } else if (param === "export") { + } else if (param === "export") { setTooltipExport(!tooltipExport) } } const handleExportExcel = async () => { const payload = { - "paging": {"start": 0, "length": -1}, + "paging": { "start": 0, "length": -1 }, "columns": [ - {"name": "name", "logic_operator": "ilike", "value": search, "operator": "AND"} + { "name": "name", "logic_operator": "ilike", "value": search, "operator": "AND" } ], "joins": [{ - "name":"m_menu", - "column_join":"parent_id", - "column_results":[ + "name": "m_menu", + "column_join": "parent_id", + "column_results": [ "name" ] - }], - "orders": {"columns": ["id"], "ascending": false} + }], + "orders": { "columns": ["id"], "ascending": false } } const result = await axios @@ -246,22 +246,22 @@ const Index = ({params}) => { .then(res => res) .catch((error) => error.response); - if(result && result.data && result.data.code == 200){ + if (result && result.data && result.data.code == 200) { let resData = result.data.data; const excelData = []; resData.map((val, index) => { let dataRow = { - "Nama":val.name, - "Url" :val.url, - "Icon" :val.icon, - "Alias Name":val.alias_name, - "Urutan" :val.sequence, - "Parent Name":val.join_first_name ? val.join_first_name : "-" + "Nama": val.name, + "Url": val.url, + "Icon": val.icon, + "Alias Name": val.alias_name, + "Urutan": val.sequence, + "Parent Name": val.join_first_name ? val.join_first_name : "-" } excelData.push(dataRow) }) await setDataExport(excelData); - }else{ + } else { NotificationManager.error('Gagal Export Data!!', 'Failed'); } } @@ -270,9 +270,9 @@ const Index = ({params}) => { const dataExcel = dataExport || []; const fileName = `Data ${pageName}.xlsx`; const ws = XLSX.utils.json_to_sheet(dataExcel); - const wb = XLSX.utils.book_new(); - XLSX.utils.book_append_sheet(wb, ws, `Data ${pageName}`); - XLSX.writeFile(wb, fileName); + const wb = XLSX.utils.book_new(); + XLSX.utils.book_append_sheet(wb, ws, `Data ${pageName}`); + XLSX.writeFile(wb, fileName); setDataExport([]) } @@ -284,24 +284,24 @@ const Index = ({params}) => { const renderTable = useMemo(() => { const columns = [ { - title: 'Action', + title: t('action'), dataIndex: '', key: 'x', render: (text, record) => <> - + handleDelete(text.id)}> - + handleEdit(text)}> , }, - { title: 'Nama Menu', dataIndex: 'name', key: 'name' }, + { title: t('name'), dataIndex: 'name', key: 'name' }, { title: 'Url', dataIndex: 'url', key: 'url' }, - { title: 'Ikon', dataIndex: 'icon', key: 'icon' }, + { title: t('icon'), dataIndex: 'icon', key: 'icon' }, { title: 'Alias', dataIndex: 'alias_name', key: 'alias_name' }, - { title: 'Urutan', dataIndex: 'sequence', key: 'sequence' }, - { title: 'Parent Menu', dataIndex: 'join_first_name', key: 'join_first_name', render: (text, record) => (text ? text : "-") } + { title: t('order'), dataIndex: 'sequence', key: 'sequence' }, + { title: t('parentMenu'), dataIndex: 'join_first_name', key: 'join_first_name', render: (text, record) => (text ? text : "-") } ]; return ( { showCancel confirmBtnText="Delete" confirmBtnBsStyle="danger" - title={`Apakah anda yakin?`} + title={t('deleteConfirm')} onConfirm={onConfirmDelete} onCancel={() => cancelDelete()} focusCancelBtn > - Data akan terhapus + {t('deleteMsg')} {

{pageName}

- + - + - - + + @@ -359,7 +359,7 @@ const Index = ({params}) => { {renderTable} { - this.setState({ isParentClick : true }); + this.setState({ isParentClick: true }); } handleSave = () => { - const { - id, + const { + id, + name, + description + } = this.state + + let data = ''; + if (this.props.typeDialog === "Save") { + data = { + id, + name, + description + } + this.props.closeDialog('save', data); + } else { + data = { + id, name, description - } = this.state - - let data = ''; - if(this.props.typeDialog==="Save"){ - data = { - id, - name, - description - } - this.props.closeDialog('save', data); - }else{ - data = { - id, - name, - description - } - this.props.closeDialog('edit', data); } - - this.setState({ id:0 }); - + this.props.closeDialog('edit', data); + } + + this.setState({ id: 0 }); + } handleCancel = () => { @@ -78,15 +79,16 @@ export default class DialogForm extends Component { } renderForm = () => { - return( + const { t } = this.props; + return (
- - this.setState({ name:e.target.value })} placeholder="name roles.." /> + + this.setState({ name: e.target.value })} placeholder={this.props.t('inputName')} /> - - this.setState({ description:e.target.value })} placeholder="deskripsi.." /> + + this.setState({ description: e.target.value })} placeholder={this.props.t('inputDescription')} /> ) @@ -95,15 +97,16 @@ export default class DialogForm extends Component { render() { return ( - {this.props.typeDialog=="Save" ? "Tambah" : "Edit"} Roles + {this.props.typeDialog == "Save" ? "Tambah" : "Edit"} {this.props.t('roles')} - {this.renderForm()} + {this.renderForm()} {' '} - + ) } } +export default withTranslation()(DialogForm); diff --git a/src/views/Master/MasterRoles/DialogMenuRoles.js b/src/views/Master/MasterRoles/DialogMenuRoles.js index 6beabe9..2ab0523 100644 --- a/src/views/Master/MasterRoles/DialogMenuRoles.js +++ b/src/views/Master/MasterRoles/DialogMenuRoles.js @@ -4,87 +4,88 @@ import { Button, Form, FormGroup, Label, Input } from 'reactstrap'; import 'antd/dist/antd.css'; import axios from 'axios'; import { MENU_SEARCH } from '../../../const/ApiConst.js'; +import { withTranslation, WithTranslation } from 'react-i18next'; const BASE_URL = "http://siopas.co.id/custom-php/api/geohr/"; const token = window.localStorage.getItem('token'); const config = { - headers: - { - Authorization : `Bearer ${token}`, - "Content-type" : `application/json` + headers: + { + Authorization: `Bearer ${token}`, + "Content-type": `application/json` } }; -export default class DialogMenuRoles extends Component { +class DialogMenuRoles extends Component { constructor(props) { super(props) this.state = { id: 0, - name:"", - description:"", + name: "", + description: "", openDialog: false, isParentClick: false, - menu:[], - stateMenu:[], - allChecked:true, + menu: [], + stateMenu: [], + allChecked: true, } } - async componentDidMount(){ + async componentDidMount() { this.props.showDialog(this.showDialog); this.getAllMenu(); } - async componentDidUpdate (){ - if(this.state.isParentClick===true){ - const { idRoles } = this.props - this.setStateMenu(true); - this.setState({isParentClick:false, id:idRoles}); + async componentDidUpdate() { + if (this.state.isParentClick === true) { + const { idRoles } = this.props + this.setStateMenu(true); + this.setState({ isParentClick: false, id: idRoles }); } } showDialog = () => { - this.setState({ isParentClick : true }); + this.setState({ isParentClick: true }); } getAllMenu = async () => { const payload = { - "paging": {"start": 0, "length": -1}, + "paging": { "start": 0, "length": -1 }, "columns": [ - {"name": "name", "logic_operator": "ilike", "value": "", "operator": "AND"} + { "name": "name", "logic_operator": "ilike", "value": "", "operator": "AND" } ], "joins": [], - "orders": {"columns": ["id"], "ascending": false} + "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 },() => { + if (result && result.data && result.data.code == 200) { + this.setState({ menu: result.data.data }, () => { this.setStateMenu(false); - }); - }else{ + }); + } else { } - + } setStateMenu = edit => { const stateMenu = []; - this.state.menu.map((val)=>{ - stateMenu.push(false); + this.state.menu.map((val) => { + stateMenu.push(false); }) - this.setState({ stateMenu:[] },()=> { - this.setState({stateMenu:stateMenu},()=> { - if(edit){ + this.setState({ stateMenu: [] }, () => { + this.setState({ stateMenu: stateMenu }, () => { + if (edit) { this.checkMenuRoles(); } }) @@ -92,22 +93,22 @@ export default class DialogMenuRoles extends Component { } checkMenuRoles = () => { - let copyStateMenu = [...this.state.stateMenu]; - this.props.menuRoles.map((val, indexMenu)=> { - let index = this.getIndexDataMenu(val.menu_id); - console.log("index true", val.menu_id); - if(index >= 0){ - copyStateMenu[index] = true; - } - }) - this.setState({ stateMenu:[] },()=>{ - let check = copyStateMenu.some(this.checkArray); - if(check===false){ - this.setState({ allChecked:true,stateMenu:copyStateMenu }) - }else{ - this.setState({ allChecked:false,stateMenu:copyStateMenu }) - } - }) + let copyStateMenu = [...this.state.stateMenu]; + this.props.menuRoles.map((val, indexMenu) => { + let index = this.getIndexDataMenu(val.menu_id); + console.log("index true", val.menu_id); + if (index >= 0) { + copyStateMenu[index] = true; + } + }) + this.setState({ stateMenu: [] }, () => { + let check = copyStateMenu.some(this.checkArray); + if (check === false) { + this.setState({ allChecked: true, stateMenu: copyStateMenu }) + } else { + this.setState({ allChecked: false, stateMenu: copyStateMenu }) + } + }) } @@ -117,24 +118,24 @@ export default class DialogMenuRoles extends Component { } handleSave = () => { - const { - stateMenu, - menu, - id + const { + stateMenu, + menu, + id } = this.state const arrayData = []; - + menu.map((val, index) => { let data = { - roles_id:id, - menu_id:val.id, - checked:stateMenu[index] + roles_id: id, + menu_id: val.id, + checked: stateMenu[index] } arrayData.push(data); }) this.props.closeDialog('save', arrayData); - this.setState({ id:0 }); + this.setState({ id: 0 }); } handleCancel = () => { @@ -145,20 +146,20 @@ export default class DialogMenuRoles extends Component { let copyStateMenu = [...this.state.stateMenu]; copyStateMenu[index] = checked; console.log("cek uncek", copyStateMenu); - this.setState({ stateMenu:copyStateMenu }) + this.setState({ stateMenu: copyStateMenu }) } renderForm = () => { const { menu, stateMenu } = this.state - return( - menu.map((val, index)=>{ - return( - - - - - ) - }) + return ( + menu.map((val, index) => { + return ( + + + + + ) + }) ) } @@ -167,32 +168,32 @@ export default class DialogMenuRoles extends Component { } handleAllChecked = (checked) => { - this.setState({ allChecked:!this.state.allChecked }); - if(checked===true){ + this.setState({ allChecked: !this.state.allChecked }); + if (checked === true) { console.log("test 1") let check = this.state.stateMenu.some(this.checkArray); - if(check){ + if (check) { const stateMenu = []; - this.state.menu.map((val)=>{ - stateMenu.push(true); + this.state.menu.map((val) => { + stateMenu.push(true); }) - this.setState({ stateMenu:[] },()=> { - this.setState({stateMenu:stateMenu}); + this.setState({ stateMenu: [] }, () => { + this.setState({ stateMenu: stateMenu }); }) } - }else{ + } else { console.log("test 1 2 3 ") const stateMenu = []; - this.state.menu.map((val)=>{ - stateMenu.push(false); + this.state.menu.map((val) => { + stateMenu.push(false); }) - this.setState({ stateMenu:[] },()=> { - this.setState({stateMenu:stateMenu}); + this.setState({ stateMenu: [] }, () => { + this.setState({ stateMenu: stateMenu }); }) } } @@ -200,33 +201,34 @@ export default class DialogMenuRoles extends Component { render() { return ( - Roles Menu + {this.props.t('menuRoles')} -
-
{val.name} this.handleChangeCheckbox(e.target.checked, index)} defaultChecked={stateMenu[index]} />
{val.name} this.handleChangeCheckbox(e.target.checked, index)} defaultChecked={stateMenu[index]} />
- - - - - - - - - - - + +
Menu - T/F -
All this.handleAllChecked(e.target.checked)} checked={this.state.allChecked} />
+ + + + + + + + + + + {this.renderForm()} - -
Menu + T/F +
All this.handleAllChecked(e.target.checked)} checked={this.state.allChecked} />
- + + + - {' '} - + {' '} + ) } } +export default withTranslation()(DialogMenuRoles); \ No newline at end of file diff --git a/src/views/Master/MasterRoles/index.js b/src/views/Master/MasterRoles/index.js index 215b551..a32ba37 100644 --- a/src/views/Master/MasterRoles/index.js +++ b/src/views/Master/MasterRoles/index.js @@ -9,6 +9,7 @@ import { Card, CardBody, CardHeader, Col, Row, Input } from 'reactstrap'; import { NotificationContainer, NotificationManager } from 'react-notifications'; import { Pagination, Tooltip, Table } from 'antd'; import { ROLE_ADD, ROLE_SEARCH, ROLE_EDIT, ROLE_DELETE, ROLEMENU_ADD, ROLEMENU_SEARCH, ROLEMENU_DELETE_ROLE } from '../../../const/ApiConst.js'; +import { withTranslation } from 'react-i18next'; const token = window.localStorage.getItem('token'); @@ -26,7 +27,7 @@ const momentFormat = 'HH:mm'; const LENGTH_DATA = 10 -export default class index extends Component { +class index extends Component { constructor(props) { super(props) this.state = { @@ -58,26 +59,26 @@ export default class index extends Component { this.columns = [ { - title: 'Action', + title: this.props.t('action'), dataIndex: '', key: 'x', className: 'nowrap', render: (text, record) => <> - + this.handleMenuRoles(text.id)}> - + this.handleDelete(text.id)}> - + this.handleEdit(text)}> , }, - { title: 'Nama Role', dataIndex: 'name', key: 'name', className: "nowrap" }, - { title: 'Description', dataIndex: 'description', key: 'description' }, + { title: this.props.t('nameRole'), dataIndex: 'name', key: 'name', className: "nowrap" }, + { title: this.props.t('description'), dataIndex: 'description', key: 'description' }, ] } @@ -249,7 +250,7 @@ export default class index extends Component { if (this.state.dataTable.length === 0) { return ( - Not Data Available + {this.props.t('noData')} ) } @@ -361,6 +362,7 @@ export default class index extends Component { } render() { + const { t } = this.props; const { tooltipTambah, tooltipExport, dialogMenuForm, dataTable, openDialog, currentPage, rowsPerPage, totalPage, search, tooltipEdit, tooltipDelete, tooltipMenu } = this.state let noSeq = 0; return ( @@ -372,12 +374,12 @@ export default class index extends Component { showCancel confirmBtnText="Delete" confirmBtnBsStyle="danger" - title="Are you sure?" + title={this.props.t('deleteConfirm')} onConfirm={this.onConfirmDelete} onCancel={() => this.setState({ alertDelete: false, idDelete: 0 })} focusCancelBtn > - Data tipe roles akan terhapus!! + {this.props.t('deleteMsg')} {this.props.params.name} - + - + - + @@ -447,3 +449,4 @@ export default class index extends Component { ) } } +export default withTranslation()(index); \ No newline at end of file diff --git a/src/views/Master/ProjectPhase/DialogForm.js b/src/views/Master/ProjectPhase/DialogForm.js index 7115144..6010f09 100644 --- a/src/views/Master/ProjectPhase/DialogForm.js +++ b/src/views/Master/ProjectPhase/DialogForm.js @@ -7,12 +7,12 @@ import 'antd/dist/antd.css'; import InputColor from "./InputColor"; import "./styles.css"; import "rc-color-picker/assets/index.css"; - +import { useTranslation } from 'react-i18next'; const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdit }) => { const [id, setId] = useState(0) const [projectType, setProjectType] = useState('') const [color, setColor] = useState('') - + const { t } = useTranslation(); useEffect(() => { if (typeDialog === "Edit") { console.log("cel data Edit", dataEdit) @@ -56,13 +56,13 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - + setProjectType(e.target.value)} /> - + setColor(e.color)} /> @@ -80,7 +80,7 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi {' '} - + diff --git a/src/views/Master/ProjectPhase/index.js b/src/views/Master/ProjectPhase/index.js index 0f0ad32..5df51ef 100644 --- a/src/views/Master/ProjectPhase/index.js +++ b/src/views/Master/ProjectPhase/index.js @@ -8,7 +8,7 @@ import { Card, CardBody, CardHeader, Col, Row, Input } from 'reactstrap'; import { NotificationContainer, NotificationManager } from 'react-notifications'; import { PROJECT_PHASE_ADD, PROJECT_PHASE_EDIT, PROJECT_PHASE_DELETE, PROJECT_PHASE_SEARCH, PROJECT_PHASE_LIST, BASE_OSPRO } from '../../../const/ApiConst'; import { Pagination, Button, Tooltip, Table } from 'antd'; - +import { useTranslation } from 'react-i18next'; const token = window.localStorage.getItem('token'); const config = { headers: @@ -50,7 +50,7 @@ const ProjectPhase = ({ params }) => { const [search, setSearch] = useState('') const [totalPage, setTotalPage] = useState(0) const [typeDialog, setTypeDialog] = useState('Save') - + const { t } = useTranslation() useEffect(() => { getDataProjectPhase() }, [currentPage, rowsPerPage, search]) @@ -279,7 +279,7 @@ const ProjectPhase = ({ params }) => { if (dataTable.length === 0) { return ( - Tidak ada data project phase + {t('noData')} ) } @@ -288,22 +288,22 @@ const ProjectPhase = ({ params }) => { const renderTable = useMemo(() => { const columns = [ { - title: 'Action', + title: t('action'), dataIndex: '', key: 'x', className: 'nowrap', render: (text, record) => <> - + handleDelete(text.id)}> - + handleEdit(text)}> {" "} , }, - { title: 'Fase', dataIndex: 'name', key: 'name', className: "nowrap" }, + { title: t('phase'), dataIndex: 'name', key: 'name', className: "nowrap" }, { - title: 'Warna', + title: t('color'), dataIndex: 'color', key: 'color', render: (text) => <> @@ -333,12 +333,12 @@ const ProjectPhase = ({ params }) => { showCancel confirmBtnText="Delete" confirmBtnBsStyle="danger" - title={`Are you sure?`} + title={t('deleteConfirm')} onConfirm={onConfirmDelete} - onCancel={() => cancelDelete()} + onCancel={cancelDelete} focusCancelBtn > - Delete this data + {t('deleteMsg')} {

{pageName}

- + - + - + diff --git a/src/views/Master/RoleProject/DialogForm.js b/src/views/Master/RoleProject/DialogForm.js index 04529a6..307ed1b 100644 --- a/src/views/Master/RoleProject/DialogForm.js +++ b/src/views/Master/RoleProject/DialogForm.js @@ -2,75 +2,76 @@ import React, { Component } from 'react' import { Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap'; import { Button, Form, FormGroup, Label, Input } from 'reactstrap'; import 'antd/dist/antd.css'; +import { withTranslation } from 'react-i18next'; -export default class DialogForm extends Component { +class DialogForm extends Component { constructor(props) { super(props) this.state = { id: 0, - name:"", - description:"", + name: "", + description: "", openDialog: false, isParentClick: false, } } - async componentDidMount(){ + async componentDidMount() { this.props.showDialog(this.showDialog); } - 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 - }) - }else{ - this.setState({ - id:0, - name:"", - description:"" - }) - } - this.setState({isParentClick:false}); + 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 + }) + } else { + this.setState({ + id: 0, + name: "", + description: "" + }) + } + this.setState({ isParentClick: false }); } } showDialog = () => { - this.setState({ isParentClick : true }); + this.setState({ isParentClick: true }); } handleSave = () => { - const { - id, + const { + id, + name, + description + } = this.state + + let data = ''; + if (this.props.typeDialog === "Save") { + data = { + id, + name, + description + } + this.props.closeDialog('save', data); + } else { + data = { + id, name, description - } = this.state - - let data = ''; - if(this.props.typeDialog==="Save"){ - data = { - id, - name, - description - } - this.props.closeDialog('save', data); - }else{ - data = { - id, - name, - description - } - this.props.closeDialog('edit', data); } - - this.setState({ id:0 }); - + this.props.closeDialog('edit', data); + } + + this.setState({ id: 0 }); + } handleCancel = () => { @@ -78,15 +79,16 @@ export default class DialogForm extends Component { } renderForm = () => { - return( + const { t } = this.props; + return (
- - this.setState({ name:e.target.value })} placeholder="name roles.." /> + + this.setState({ name: e.target.value })} placeholder={this.props.t('inputName')} /> - - this.setState({ description:e.target.value })} placeholder="deskripsi.." /> + + this.setState({ description: e.target.value })} placeholder={this.props.t('inputDescription')} />
) @@ -95,15 +97,16 @@ export default class DialogForm extends Component { render() { return ( - {this.props.typeDialog=="Save" ? "Tambah" : "Edit"} Project Role + {this.props.typeDialog == "Save" ? "Tambah" : "Edit"} {this.props.t('nameProjectRole')} - {this.renderForm()} + {this.renderForm()} {' '} - + ) } } +export default withTranslation()(DialogForm); diff --git a/src/views/Master/RoleProject/index.js b/src/views/Master/RoleProject/index.js index 0394a28..01b6663 100644 --- a/src/views/Master/RoleProject/index.js +++ b/src/views/Master/RoleProject/index.js @@ -8,7 +8,7 @@ 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, ROLEMENU_ADD, ROLEMENU_SEARCH, ROLEMENU_DELETE_ROLE } from '../../../const/ApiConst.js'; import { Pagination, Tooltip, Table } from 'antd'; - +import { withTranslation } from 'react-i18next'; const token = window.localStorage.getItem('token'); const BASE_URL = "http://siopas.co.id/custom-php/api/geohr/"; @@ -32,7 +32,7 @@ const column = [ const LENGTH_DATA = 10 -export default class index extends Component { +class index extends Component { constructor(props) { super(props) this.state = { @@ -63,23 +63,23 @@ export default class index extends Component { } this.columns = [ { - title: 'Action', + title: this.props.t('action'), dataIndex: '', key: 'x', className: 'nowrap', render: (text, record) => <> - + this.handleDelete(text.id)}> - + this.handleEdit(text)}> , }, - { title: 'Nama Role', dataIndex: 'name', key: 'name', className: "nowrap" }, - { title: 'Description', dataIndex: 'description', key: 'description' }, + { title: this.props.t('name'), dataIndex: 'name', key: 'name', className: "nowrap" }, + { title: this.props.t('description'), dataIndex: 'description', key: 'description' }, ]; } @@ -255,7 +255,7 @@ export default class index extends Component { if (this.state.dataTable.length === 0) { return ( - Tidak ada data project role + {this.props.t('noData')} ) } @@ -303,6 +303,7 @@ export default class index extends Component { } render() { + const { t } = this.props; const { tooltipTambah, tooltipExport, dialogMenuForm, dataTable, openDialog, currentPage, rowsPerPage, totalPage, search, tooltipEdit, tooltipDelete, tooltipMenu } = this.state let noSeq = 0; return ( @@ -314,12 +315,12 @@ export default class index extends Component { showCancel confirmBtnText="Delete" confirmBtnBsStyle="danger" - title="Are you sure?" + title={this.props.t('deleteConfirm')} onConfirm={this.onConfirmDelete} onCancel={() => this.setState({ alertDelete: false, idDelete: 0 })} focusCancelBtn > - Data project role akan terhapus!! + {this.props.t('deleteMsg')} {this.props.params.name} - + - + - + @@ -382,3 +383,4 @@ export default class index extends Component { ) } } +export default withTranslation()(index); \ No newline at end of file diff --git a/src/views/Report/k3/index.js b/src/views/Report/k3/index.js index 497a300..d4fc3f5 100644 --- a/src/views/Report/k3/index.js +++ b/src/views/Report/k3/index.js @@ -10,14 +10,15 @@ import { Pagination, Tooltip } from 'antd'; import { DatePicker, Select } from 'antd'; import * as XLSX from 'xlsx'; import { PRESENSI_SEARCH, PROYEK_SEARCH, USERPROYEK_SEARCH, K3_SEARCH, SIMPRO_BASE_IMAGE } from '../../../const/ApiConst.js'; +import { withTranslation } from 'react-i18next'; const { RangePicker } = DatePicker; const { Option } = Select const token = localStorage.getItem('token'); const config = { - headers: - { - Authorization : `Bearer ${token}`, - "Content-type" : `application/json` + headers: + { + Authorization: `Bearer ${token}`, + "Content-type": `application/json` } }; @@ -25,18 +26,11 @@ const BASE_URL = "" const momentFormat = 'DD-MM-YY'; -const column = [ - { name: "Nama Human Resource" }, - { name: "Tanggal Lapor"}, - { name: "Perlengkapan Dikenakan"}, - { name: "Perlengkapan Tidak Dikenakan"}, - { name: "Deskripsi" }, - { name: "Action" }, -] + const LENGTH_DATA = 10 -export default class index extends Component { +class index extends Component { constructor(props) { super(props) this.state = { @@ -58,16 +52,16 @@ export default class index extends Component { tooltipEdit: false, tooltipDelete: false, typeClock: "All", - startDate:moment(moment().format("YYYY-M-D")), - endDate:moment(moment().format("YYYY-M-D")), + startDate: moment(moment().format("YYYY-M-D")), + endDate: moment(moment().format("YYYY-M-D")), currentDay: 'today', - tooltipExport:false, - disableProyek:false, - currentProyek:parseInt(localStorage.getItem('role_id'))===2 ? parseInt(localStorage.getItem('proyek_id')) : null, - allUserToProyek:[], - proyekIds:[], - allDataProyek:[], - finishSetupOption:false + tooltipExport: false, + disableProyek: false, + currentProyek: parseInt(localStorage.getItem('role_id')) === 2 ? parseInt(localStorage.getItem('proyek_id')) : null, + allUserToProyek: [], + proyekIds: [], + allDataProyek: [], + finishSetupOption: false } } @@ -77,29 +71,29 @@ export default class index extends Component { } async componentDidUpdate(prevProps, prevState) { - const { search,startDate,dataExport,proyekIds, currentProyek } = this.state + const { search, startDate, dataExport, proyekIds, currentProyek } = this.state if (search !== prevState.search) this.getDataLaporanK3() if (startDate !== prevState.startDate) this.getDataLaporanK3() - if (dataExport !== prevState.dataExport){ - if(dataExport.length > 0){ + if (dataExport !== prevState.dataExport) { + if (dataExport.length > 0) { this.exportExcel() } } - if(proyekIds!== prevState.proyekIds){ + if (proyekIds !== prevState.proyekIds) { this.getDataLaporanK3(); } - if(currentProyek!== prevState.currentProyek){ + if (currentProyek !== prevState.currentProyek) { this.getDataLaporanK3(); } } setUpFirstProyek = () => { console.log("cek role id", localStorage.getItem('role_id')); - if(parseInt(localStorage.getItem('role_id'))===2){ - this.setState({disableProyek:true}); - }else{ - this.setState({currentProyek:null}) + if (parseInt(localStorage.getItem('role_id')) === 2) { + this.setState({ disableProyek: true }); + } else { + this.setState({ currentProyek: null }) } } handleSearch = e => { @@ -109,12 +103,12 @@ export default class index extends Component { getAllProyek = async () => { const payload = { - "paging": {"start": 0, "length": -1}, + "paging": { "start": 0, "length": -1 }, "columns": [ - {"name": "nama", "logic_operator": "ilike", "value": "", "operator": "AND"} + { "name": "nama", "logic_operator": "ilike", "value": "", "operator": "AND" } ], "joins": [], - "orders": {"columns": ["id"], "ascending": false} + "orders": { "columns": ["id"], "ascending": false } } const result = await axios @@ -123,15 +117,15 @@ export default class index extends Component { .catch((error) => error.response); - if(result && result.data && result.data.code == 200){ + if (result && result.data && result.data.code == 200) { let resData = result.data.data - + let proyekIds = [] resData.map((val, index) => { proyekIds.push(val.id); }); - this.setState({allDataProyek:resData,proyekIds:proyekIds}) - }else{ + this.setState({ allDataProyek: resData, proyekIds: proyekIds }) + } else { } } @@ -152,63 +146,63 @@ export default class index extends Component { let dateStart = moment(this.state.startDate).format("YYYY-MM-DD 00:00:00"); let dateEnd = moment(this.state.endDate).format("YYYY-MM-DD 23:59:59"); let currentProyek = this.state.currentProyek - const payload = { - "paging":{ - "start":start, - "length":this.state.rowsPerPage + const payload = { + "paging": { + "start": start, + "length": this.state.rowsPerPage }, - "filter_columns":[ - { - "name":"name", - "value":"", - "table_name":"m_users" - } + "filter_columns": [ + { + "name": "name", + "value": "", + "table_name": "m_users" + } ], - "columns":[ - {"name": "report_date", "logic_operator": "range", "value": dateStart, "value1": dateEnd, "operator": "AND"}, - {"name": "name", "logic_operator": "ilike", "value": this.state.search, "operator": "AND", "table_name":"m_users"} + "columns": [ + { "name": "report_date", "logic_operator": "range", "value": dateStart, "value1": dateEnd, "operator": "AND" }, + { "name": "name", "logic_operator": "ilike", "value": this.state.search, "operator": "AND", "table_name": "m_users" } ], - "joins":[ - { - "name":"m_users", - "column_join":"user_id", - "column_results":[ - "name", - ] - } + "joins": [ + { + "name": "m_users", + "column_join": "user_id", + "column_results": [ + "name", + ] + } ], - "orders":{ - "columns":[ - "id" - ], - "ascending":false + "orders": { + "columns": [ + "id" + ], + "ascending": false }, - "child_data":{ - "table_name":"t_report_k3_detail", - "column_table":"report_k3_id", - "column_name":"id" + "child_data": { + "table_name": "t_report_k3_detail", + "column_table": "report_k3_id", + "column_name": "id" } } - if(currentProyek){ - let proyekPayload = {"name": "proyek_id", "logic_operator": "=", "value": this.state.currentProyek}; + if (currentProyek) { + let proyekPayload = { "name": "proyek_id", "logic_operator": "=", "value": this.state.currentProyek }; payload.columns.push(proyekPayload) - }else{ - let proyekPayload = {"name": "proyek_id", "logic_operator": "in", "value": this.state.proyekIds}; + } else { + let proyekPayload = { "name": "proyek_id", "logic_operator": "in", "value": this.state.proyekIds }; payload.columns.push(proyekPayload) } - + const result = await axios .post(K3_SEARCH, payload, config) .then(res => res) .catch((error) => error.response); - if(result && result.data && result.data.code == 200){ + if (result && result.data && result.data.code == 200) { let resData = result.data.data || [] console.log("cek resdata", resData) this.setState({ dataTable: resData, totalPage: result.data.totalRecord }); - }else{ + } else { NotificationManager.error('Gagal Mengambil Data!!', 'Failed'); } } @@ -239,7 +233,7 @@ export default class index extends Component { .then(res => res) .catch((error) => error.response); - if(result.message!==undefined){ + if (result.message !== undefined) { if (result.message === "Data Has Been Deleted") { this.getDataLaporanK3() this.setState({ idDelete: 0, alertDelete: false }) @@ -248,7 +242,7 @@ export default class index extends Component { this.setState({ idDelete: 0, alertDelete: false }) NotificationManager.error('Data division gagal dihapus!!', 'Failed!!'); } - }else{ + } else { if (result.data.message === "Data Has Been Deleted") { this.getDataLaporanK3() this.setState({ idDelete: 0, alertDelete: false }) @@ -262,7 +256,7 @@ export default class index extends Component { saveDivision = async (data) => { let url = BASE_URL + "employee_devision.php?act=input"; - + const formData = new FormData() formData.append('name', data.name); formData.append('description', data.description); @@ -270,14 +264,14 @@ export default class index extends Component { .then(res => res) .catch((error) => error.response); - if(result.message!==undefined){ + if (result.message !== undefined) { if (result.message === "Data Has Been Saved") { this.getDataLaporanK3(); NotificationManager.success('Data division berhasil ditambahkan!!', 'Success!!'); } else { NotificationManager.error(`${result.data.message}`, 'Failed!!'); } - }else{ + } else { if (result.data.message === "Data Has Been Saved") { this.getDataLaporanK3(); NotificationManager.success('Data division berhasil ditambahkan!!', 'Success!!'); @@ -285,12 +279,12 @@ export default class index extends Component { NotificationManager.error(`${result.data.message}`, 'Failed!!'); } } - + } editDataDivision = async (data) => { let url = ""; - + const formData = new FormData(); formData.append('name', data.name); formData.append('description', data.description); @@ -299,14 +293,14 @@ export default class index extends Component { .then(res => res) .catch((error) => error.response); - if(result.data!==undefined){ + if (result.data !== undefined) { if (result.data.message === "Data Has Been Edited") { this.getDataLaporanK3(); NotificationManager.success('Data division berhasil diedit!!', 'Success!!'); } else { NotificationManager.error('Data division gagal diedit!!', 'Failed!!'); } - } + } } @@ -342,13 +336,13 @@ export default class index extends Component { } handleDatePicker = (date, dateString) => { - this.setState({ startDate:date[0],endDate:date[1] },()=>{ + this.setState({ startDate: date[0], endDate: date[1] }, () => { this.getDataLaporanK3(); }) } handleTipe = (e) => { - this.setState({ typeClock:e.target.value }, () => { + this.setState({ typeClock: e.target.value }, () => { this.getDataLaporanK3(); }); } @@ -358,139 +352,140 @@ export default class index extends Component { let dateEnd = moment(this.state.endDate).format("YYYY-MM-DD 23:59:59"); let currentProyek = this.state.currentProyek const payload = { - "paging":{ - "start":0, - "length":-1 - }, - "columns":[ - {"name": "report_date", "logic_operator": "range", "value": dateStart, "value1": dateEnd, "operator": "AND"}, - {"name": "name", "logic_operator": "ilike", "value": this.state.search, "operator": "AND", "table_name":"m_users"} - ], - "joins":[ + "paging": { + "start": 0, + "length": -1 + }, + "columns": [ + { "name": "report_date", "logic_operator": "range", "value": dateStart, "value1": dateEnd, "operator": "AND" }, + { "name": "name", "logic_operator": "ilike", "value": this.state.search, "operator": "AND", "table_name": "m_users" } + ], + "joins": [ { - "name":"m_users", - "column_join":"user_id", - "column_results":[ - "name", - ] + "name": "m_users", + "column_join": "user_id", + "column_results": [ + "name", + ] } - ], - "orders":{ - "columns":[ - "id" + ], + "orders": { + "columns": [ + "id" ], - "ascending":false - }, - "child_data":{ - "table_name":"t_report_k3_detail", - "column_table":"report_k3_id", - "column_name":"id" - } - } - - if(currentProyek){ - let proyekPayload = {"name": "proyek_id", "logic_operator": "=", "value": this.state.currentProyek}; + "ascending": false + }, + "child_data": { + "table_name": "t_report_k3_detail", + "column_table": "report_k3_id", + "column_name": "id" + } + } + + if (currentProyek) { + let proyekPayload = { "name": "proyek_id", "logic_operator": "=", "value": this.state.currentProyek }; payload.columns.push(proyekPayload) - }else{ - let proyekPayload = {"name": "proyek_id", "logic_operator": "in", "value": this.state.proyekIds}; + } else { + let proyekPayload = { "name": "proyek_id", "logic_operator": "in", "value": this.state.proyekIds }; payload.columns.push(proyekPayload) } - - + + const result = await axios .post(K3_SEARCH, payload, config) .then(res => res) .catch((error) => error.response); - if(result && result.data && result.data.code == 200){ + if (result && result.data && result.data.code == 200) { let resData = result.data.data || [] console.log("cek res data", resData) const excelData = []; resData.map((n, index) => { let dataRow = { - "Nama Human Resource":n.join_first_name ? n.join_first_name : "-", - "Tanggal Lapor" :n.report_date ? moment(n.report_date).format("DD-MM-YYYY HH:mm:ss") : "-", - "Perlengkapan Dikenakan": n.k3_checked.length ? n.k3_checked.join() : "-", - "Perlengkapan Tidak Dikenakan": n.k3_not_checked.length ? n.k3_not_checked.join() : "-", - "Description" : n.description ? n.description : "-" + "Nama Human Resource": n.join_first_name ? n.join_first_name : "-", + "Tanggal Lapor": n.report_date ? moment(n.report_date).format("DD-MM-YYYY HH:mm:ss") : "-", + "Perlengkapan Dikenakan": n.k3_checked.length ? n.k3_checked.join() : "-", + "Perlengkapan Tidak Dikenakan": n.k3_not_checked.length ? n.k3_not_checked.join() : "-", + "Description": n.description ? n.description : "-" } excelData.push(dataRow) }) - this.setState({dataExport:excelData}) - }else{ + this.setState({ dataExport: excelData }) + } else { NotificationManager.error('Gagal Export Data!!', 'Failed'); - } + } } exportExcel = () => { const dataExcel = this.state.dataExport || []; const fileName = `Data Laporan K3.xlsx`; const ws = XLSX.utils.json_to_sheet(dataExcel); - const wb = XLSX.utils.book_new(); - XLSX.utils.book_append_sheet(wb, ws, `Data Laporan K3`); + const wb = XLSX.utils.book_new(); + XLSX.utils.book_append_sheet(wb, ws, `Data Laporan K3`); - XLSX.writeFile(wb, fileName); - this.setState({dataExport:[] }) + XLSX.writeFile(wb, fileName); + this.setState({ dataExport: [] }) } lihatFoto = (data) => { this.showChildDialog(); - this.setState({dataImage: data}, () => { - this.setState({openDialog:true}); + this.setState({ dataImage: data }, () => { + this.setState({ openDialog: true }); }); } renderTable = () => { + const { t } = this.props; const dataTable2 = this.state.dataTable || []; return ( - {dataTable2.length!==0 ? dataTable2.map((n) => { - return ( - - { n.join_first_name ? n.join_first_name : "-" } - { n.report_date ? moment(n.report_date).format("DD-MM-YYYY HH:mm:ss") : "-" } - { n.k3_checked.length ? n.k3_checked.join() : "-"} - { n.k3_not_checked.length ? n.k3_not_checked.join() : "-"} - { n.description ? n.description : "-"} - {n.image ? this.lihatFoto(n.image)} className='fa fa-image'>: ""} - - ) - }) : - No Data Available - - } - + {dataTable2.length !== 0 ? dataTable2.map((n) => { + return ( + + {n.join_first_name ? n.join_first_name : "-"} + {n.report_date ? moment(n.report_date).format("DD-MM-YYYY HH:mm:ss") : "-"} + {n.k3_checked.length ? n.k3_checked.join() : "-"} + {n.k3_not_checked.length ? n.k3_not_checked.join() : "-"} + {n.description ? n.description : "-"} + {n.image ? this.lihatFoto(n.image)} className='fa fa-image'> : ""} + + ) + }) : + {this.props.t('noData')} + + } + ) } handleChangeDay = (e) => { const val = e.target.value; - this.setState({ currentDay:val }); - if(val==="today"){ + this.setState({ currentDay: val }); + if (val === "today") { this.setState({ - startDate:moment(moment().format("YYYY-M-D")), - endDate:moment(moment().format("YYYY-M-D")), + startDate: moment(moment().format("YYYY-M-D")), + endDate: moment(moment().format("YYYY-M-D")), currentPage: 1 }) - }else if(val==="3 day"){ + } else if (val === "3 day") { this.setState({ - startDate:moment(moment().subtract(3, "days").format("YYYY-M-D")), - endDate:moment(moment().format("YYYY-M-D")), + startDate: moment(moment().subtract(3, "days").format("YYYY-M-D")), + endDate: moment(moment().format("YYYY-M-D")), currentPage: 1 }) - }else if(val==="7 day"){ + } else if (val === "7 day") { this.setState({ - startDate:moment(moment().subtract(7, "days").format("YYYY-M-D")), - endDate:moment(moment().format("YYYY-M-D")), + startDate: moment(moment().subtract(7, "days").format("YYYY-M-D")), + endDate: moment(moment().format("YYYY-M-D")), currentPage: 1 }) - }else{ + } else { this.setState({ - startDate:moment(moment().format("YYYY-M-D")), - endDate:moment(moment().format("YYYY-M-D")), + startDate: moment(moment().format("YYYY-M-D")), + endDate: moment(moment().format("YYYY-M-D")), currentPage: 1 }) } @@ -498,26 +493,35 @@ export default class index extends Component { setupSelectProyek = () => { let allDataProyek = this.state.allDataProyek - return( + return ( <> - {allDataProyek.map((val, index)=> { - return( - - ) - }) - } + {allDataProyek.map((val, index) => { + return ( + + ) + }) + } ) } onChangeProyek = (val) => { - this.setState({currentProyek:val}); + this.setState({ currentProyek: val }); } delay = (ms) => new Promise(res => setTimeout(res, ms)); render() { - const { tooltipExport,dataTable, openDialog, currentPage, rowsPerPage, totalPage, search, tooltipEdit, tooltipDelete } = this.state + const column = [ + { name: this.props.t('nameHR') }, + { name: this.props.t('dateReport') }, + { name: this.props.t('gearUse') }, + { name: this.props.t('gearNotUse') }, + { name: this.props.t('description') }, + { name: this.props.t('action') }, + ] + const t = this.props; + const { tooltipExport, dataTable, openDialog, currentPage, rowsPerPage, totalPage, search, tooltipEdit, tooltipDelete } = this.state return (
@@ -527,12 +531,12 @@ export default class index extends Component { showCancel confirmBtnText="Delete" confirmBtnBsStyle="danger" - title="Are you sure?" + title={this.props.t('deleteConfirm')} onConfirm={this.onConfirmDelete} onCancel={() => this.setState({ alertDelete: false, idDelete: 0 })} focusCancelBtn > - Data report k3 akan terhapus!! + {this.props.t('deleteMsg')}

{this.props.params.name}

- - - - {/* */} + + +
-
-
-
- -
-
- this.handleChangeDay(e)} defaultValue={this.state.currentDay}> - - - - -
-
- {' '} - -
+
+
+
+ +
+
+ this.handleChangeDay(e)} defaultValue={this.state.currentDay}> + + + + +
+
+ {' '} +
-
+ +
@@ -584,7 +587,7 @@ export default class index extends Component { })} - { this.renderTable() } + {this.renderTable()}
{ const [id, setId] = useState(0) const [name, setName] = useState('') const [description, setDescription] = useState('') - + const { t } = useTranslation() useEffect(() => { @@ -62,14 +63,14 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - - setName(e.target.value)} placeholder={`Input name...`} /> + + setName(e.target.value)} placeholder={t('inputName')} /> - - setDescription(e.target.value)} placeholder={`Description ...`} /> + + setDescription(e.target.value)} placeholder={t('inputDescription')} /> @@ -81,13 +82,13 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi return ( <> - {typeDialog == "Save" ? `Add` : "Edit"} Resource + {typeDialog == "Save" ? `Add` : "Edit"} Checlist K3 {renderForm()} {' '} - + diff --git a/src/views/SimproV2/ChecklistK3/index.js b/src/views/SimproV2/ChecklistK3/index.js index 4cd4cb5..4c13d00 100644 --- a/src/views/SimproV2/ChecklistK3/index.js +++ b/src/views/SimproV2/ChecklistK3/index.js @@ -9,6 +9,7 @@ import { Pagination, Button, Tooltip } from 'antd'; import { CHECKLIST_K3_ADD, CHECKLIST_K3_EDIT, CHECKLIST_K3_DELETE, CHECKLIST_K3_SEARCH } from '../../../const/ApiConst'; +import { useTranslation } from 'react-i18next'; const token = window.localStorage.getItem('token'); const config = { @@ -18,10 +19,7 @@ const config = { "Content-type": `application/json` } }; -const column = [ - { name: "Nama" }, - { name: "Deskripsi" }, -] + const ChecklistK3 = ({ params }) => { const token = localStorage.getItem("token") const HEADER = { @@ -45,7 +43,11 @@ const ChecklistK3 = ({ params }) => { const [search, setSearch] = useState('') const [totalPage, setTotalPage] = useState(0) const [typeDialog, setTypeDialog] = useState('Save') - + const { t } = useTranslation() + const column = [ + { name: t('name') }, + { name: t('description') }, + ] useEffect(() => { getDataChecklistK3() }, [currentPage, rowsPerPage, search]) @@ -240,7 +242,7 @@ const ChecklistK3 = ({ params }) => { if (dataTable.length === 0) { return ( - Tidak ada data project type + {t('noData')} ) } @@ -255,12 +257,12 @@ const ChecklistK3 = ({ params }) => { showCancel confirmBtnText="Delete" confirmBtnBsStyle="danger" - title={`Are you sure?`} + title={t('deleteConfirm')} onConfirm={onConfirmDelete} onCancel={() => cancelDelete()} focusCancelBtn > - Delete this data + {t('deleteMsg')} {

{pageName}

- + - + - + @@ -292,7 +294,7 @@ const ChecklistK3 = ({ params }) => { - + {column.map((i, index) => { return ( @@ -306,10 +308,10 @@ const ChecklistK3 = ({ params }) => { return ( diff --git a/src/views/SimproV2/Divisi/DialogForm.js b/src/views/SimproV2/Divisi/DialogForm.js index 732ed83..249e58b 100644 --- a/src/views/SimproV2/Divisi/DialogForm.js +++ b/src/views/SimproV2/Divisi/DialogForm.js @@ -3,17 +3,16 @@ import { Modal, ModalHeader, ModalBody, ModalFooter, Button, Form, FormGroup, Label, Input, Col, Row } from 'reactstrap'; -import { DatePicker, Tooltip, Select } from 'antd'; -import { formatRupiah, formatNumber } from '../../../const/CustomFunc' -import moment from 'moment'; +import { Select } from 'antd'; import 'antd/dist/antd.css'; +import { useTranslation } from 'react-i18next'; const { Option } = Select - const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdit, dataDivisions }) => { const [id, setId] = useState(0) const [name, setName] = useState('') const [parent, setParent] = useState(null) const [description, setDescription] = useState('') + const { t } = useTranslation() const onChangeParent = (val) => { setParent(val) @@ -63,21 +62,21 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - - setName(e.target.value)}/> + + setName(e.target.value)} placeholder={t('inputName')} /> - - option.children.toLowerCase().includes(input.toLowerCase())} + > {dataDivisions.map((res, idx) => ( ))} @@ -88,8 +87,8 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - - setDescription(e.target.value)}/> + + setDescription(e.target.value)} placeholder={t('inputDescription')} /> @@ -101,13 +100,13 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi return ( <> - {typeDialog == "Save" ? `Add` : "Edit"} Resource + {typeDialog == "Save" ? `Add` : "Edit"} {t('division')} {renderForm()} {' '} - + diff --git a/src/views/SimproV2/Divisi/index.js b/src/views/SimproV2/Divisi/index.js index 269e8f2..703f8f2 100644 --- a/src/views/SimproV2/Divisi/index.js +++ b/src/views/SimproV2/Divisi/index.js @@ -1,15 +1,13 @@ import * as XLSX from 'xlsx'; import DialogForm from './DialogForm'; -import React, { useState, useEffect, useMemo } from 'react'; +import React, { useState, useEffect } from 'react'; import SweetAlert from 'react-bootstrap-sweetalert'; import axios from "../../../const/interceptorApi" -import moment from 'moment' import { Card, CardBody, CardHeader, Col, Row, Input, Table } from 'reactstrap'; import { DIVISI_LIST, DIVISI_ADD, DIVISI_EDIT, DIVISI_DELETE, DIVISI_SEARCH } from '../../../const/ApiConst'; -import { DownloadOutlined } from '@ant-design/icons'; import { NotificationContainer, NotificationManager } from 'react-notifications'; import { Pagination, Button, Tooltip } from 'antd'; -import { formatRupiah, formatNumber } from '../../../const/CustomFunc' +import { useTranslation } from 'react-i18next'; const url = ""; const proyek_id = localStorage.getItem('proyek_id'); @@ -53,7 +51,7 @@ const ProjectType = ({ params }) => { const [totalPage, setTotalPage] = useState(0) const [typeDialog, setTypeDialog] = useState('Save') const [dataDivisions, setDataDivisions] = useState([]) - + const { t } = useTranslation() useEffect(() => { getListDivision() @@ -281,7 +279,7 @@ const ProjectType = ({ params }) => { if (dataTable.length === 0) { return ( - + ) } @@ -296,12 +294,12 @@ const ProjectType = ({ params }) => { showCancel confirmBtnText="Delete" confirmBtnBsStyle="danger" - title={`Are you sure?`} + title={t('deleteConfirm')} onConfirm={onConfirmDelete} - onCancel={() => cancelDelete()} + onCancel={cancelDelete} focusCancelBtn > - Delete this data + {t('deleteMsg')} {

{pageName}

- + - + - + @@ -348,10 +346,10 @@ const ProjectType = ({ params }) => { return ( diff --git a/src/views/SimproV2/Presence/DialogFoto.js b/src/views/SimproV2/Presence/DialogFoto.js index 917cb42..680a0cf 100644 --- a/src/views/SimproV2/Presence/DialogFoto.js +++ b/src/views/SimproV2/Presence/DialogFoto.js @@ -4,6 +4,7 @@ import { Button } from 'reactstrap'; import { Image } from 'antd' import { BASE_SIMPRO_LUMEN_IMAGE } from '../../../const/ApiConst'; import 'antd/dist/antd.css'; +import { useTranslation } from 'react-i18next'; const DialogFoto = ({ openDialog, closeDialog, toggleDialog, dataImage }) => { @@ -11,9 +12,9 @@ const DialogFoto = ({ openDialog, closeDialog, toggleDialog, dataImage }) => { const [urlImage, setUrlImage] = useState("") const [dataReady, setDataReady] = useState(false) const [hrName, setHrName] = useState(false) - + const { t } = useTranslation() useEffect(() => { - if(dataImage && dataImage!=null){ + if (dataImage && dataImage != null) { setUrlImage(dataImage.url); setHrName(dataImage.name); setDataReady(true) @@ -21,7 +22,7 @@ const DialogFoto = ({ openDialog, closeDialog, toggleDialog, dataImage }) => { }, [dataImage]) useEffect(() => { - if(!openDialog){ + if (!openDialog) { setUrlImage("") setHrName("") setDataReady(false) @@ -29,27 +30,26 @@ const DialogFoto = ({ openDialog, closeDialog, toggleDialog, dataImage }) => { }, [openDialog]) const renderModalBody = () => { - return( -
-
Foto Selfie :
-
- + return ( +
+
+ +
-
) } return ( - Lihat Selfie Presensi | Nama Human Resource {hrName} + {t('imageCheck')} | {t('nameHR')} {hrName} {dataReady ? renderModalBody() : null} - + ) diff --git a/src/views/SimproV2/Presence/index.js b/src/views/SimproV2/Presence/index.js index e368342..c6833bf 100644 --- a/src/views/SimproV2/Presence/index.js +++ b/src/views/SimproV2/Presence/index.js @@ -8,6 +8,7 @@ import { Pagination, Tooltip, Table, DatePicker } from 'antd'; import moment from 'moment'; import { PRESENCE_SEARCH, IMAGE_GET_BY_ID } from '../../../const/ApiConst.js'; import DialogFoto from './DialogFoto'; +import { useTranslation } from 'react-i18next'; const { RangePicker } = DatePicker; const token = window.localStorage.getItem('token'); @@ -24,6 +25,7 @@ const Index = ({ params }) => { const [currentDay, setCurrentDay] = useState("today") const [dataImage, setDataImage] = useState(null) const [openImage, setOpenImage] = useState(false) + const { t } = useTranslation() const pageName = params.name; const config = { @@ -230,26 +232,20 @@ const Index = ({ params }) => { dataIndex: '', key: 'x', render: (text, record) => <> - {/* - handleDelete(text.id)}> - - - handleEdit(text)}> - */} - + handleImage(text.id, text.join_first_name)}> , }, - { title: 'NIK/ID Card', dataIndex: 'join_first_ktp_number', key: 'join_first_ktp_number' }, - { title: 'Nama HR', dataIndex: 'join_first_name', key: 'join_first_name' }, - { title: 'Waktu Masuk', dataIndex: 'clock_in', key: 'clock_in', render: (text, record) => (
{text ? moment(text).format("D-M-YYYY HH:mm:ss") : "-"}
) }, - { title: 'Waktu Keluar', dataIndex: 'clock_out', key: 'clock_out', render: (text, record) => (
{text ? moment(text).format("D-M-YYYY HH:mm:ss") : "-"}
) }, - { title: 'Durasi Kerja', render: (text, record) => (
{renderDurasiKerja(record.clock_in, record.clock_out)}
) }, - { title: 'Lokasi Masuk', dataIndex: 'clock_in_loc', key: 'clock_in_loc', render: (text, record) => <>{text && text !== '' ? text : '-'} }, - { title: 'Lokasi Pulang', dataIndex: 'clock_out_loc', key: 'clock_out_loc', render: (text, record) => <>{text && text !== '' ? text : '-'} }, - { title: 'Area Kerja In', dataIndex: 'clock_out_loc', key: 'clock_out_loc', render: (text, record) => (
{record.clock_in_boundary ? : }
) }, - { title: 'Area Kerja Out', dataIndex: 'clock_out_loc', key: 'clock_out_loc', render: (text, record) => (
{record.clock_out_boundary == null ? : record.clock_out_boundary ? : }
) }, + { title: t('nik'), dataIndex: 'join_first_ktp_number', key: 'join_first_ktp_number' }, + { title: t('nameHR'), dataIndex: 'join_first_name', key: 'join_first_name' }, + { title: t('presenceIn'), dataIndex: 'clock_in', key: 'clock_in', render: (text, record) => (
{text ? moment(text).format("D-M-YYYY HH:mm:ss") : "-"}
) }, + { title: t('presenceOut'), dataIndex: 'clock_out', key: 'clock_out', render: (text, record) => (
{text ? moment(text).format("D-M-YYYY HH:mm:ss") : "-"}
) }, + { title: t('workDuration'), render: (text, record) => (
{renderDurasiKerja(record.clock_in, record.clock_out)}
) }, + { title: t('locIn'), dataIndex: 'clock_in_loc', key: 'clock_in_loc', render: (text, record) => <>{text && text !== '' ? text : '-'} }, + { title: t('locOut'), dataIndex: 'clock_out_loc', key: 'clock_out_loc', render: (text, record) => <>{text && text !== '' ? text : '-'} }, + { title: t('workAreaIn'), dataIndex: 'clock_out_loc', key: 'clock_out_loc', render: (text, record) => (
{record.clock_in_boundary ? : }
) }, + { title: t('workAreaOut'), dataIndex: 'clock_out_loc', key: 'clock_out_loc', render: (text, record) => (
{record.clock_out_boundary == null ? : record.clock_out_boundary ? : }
) }, ]; return (
Aksi{t('action')}{i.name}
- + handleDelete(n.id)}> - + handleEdit(n)}>
Belum ada data.{t('noData')}
- + handleDelete(n.id)}> - + handleEdit(n)}>
{

{pageName}

- + @@ -314,17 +310,17 @@ const Index = ({ params }) => {
handleChangeDay(e)} defaultValue={currentDay}> - - - + + +
{' '} - +
- + {renderTable} { - const [id, setId] = useState(0) +const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdit }) => { + const [id, setId] = useState(0) const [projectType, setProjectType] = useState('') const [uom, setUom] = useState('') const [description, setDescription] = useState('') const [unitPrice, setUnitPrice] = useState() + const { t } = useTranslation(); - - useEffect(()=> { - if(typeDialog==="Edit"){ + useEffect(() => { + if (typeDialog === "Edit") { console.log("cel data Edit", dataEdit) setId(dataEdit.id) setDescription(dataEdit.description) setUnitPrice(dataEdit.unit_price) setUom(dataEdit.uom) setProjectType(dataEdit.name) - - }else{ + + } else { setId(0) } - },[dataEdit,openDialog]) + }, [dataEdit, openDialog]) const handleSave = () => { - let data = ''; - if(typeDialog==="Save"){ - data = { - name: projectType, - description - } - - closeDialog('save', data); - }else{ - data = { - id, - name: projectType, - description - } - closeDialog('edit', data); + let data = ''; + if (typeDialog === "Save") { + data = { + name: projectType, + description } - setId(0) - setDescription('') - + + closeDialog('save', data); + } else { + data = { + id, + name: projectType, + description + } + closeDialog('edit', data); + } + setId(0) + setDescription('') + } const handleCancel = () => { closeDialog('cancel', 'none') setId(0) - + setDescription('') - + } @@ -69,41 +70,41 @@ const DialogForm = ({openDialog, closeDialog, toggleDialog, typeDialog, dataEdit const renderForm = () => { - return( + return (
- - - - setProjectType(e.target.value)} placeholder={`Input material name...`}/> - - - - - - setDescription(e.target.value)} placeholder={`Description ...`} /> - - - + + + + setProjectType(e.target.value)} placeholder={t('inputName')} /> + + + + + + setDescription(e.target.value)} placeholder={t('inputDescription')} /> + + + ) } - + return ( <> - - {typeDialog=="Save" ? `Add` : "Edit"} Resource - + + {typeDialog == "Save" ? `Add` : "Edit"} Resource + {renderForm()} - - - {' '} - - - - - {/* + + {' '} + + + + + {/* toggleMapDialog} @@ -115,7 +116,7 @@ const DialogForm = ({openDialog, closeDialog, toggleDialog, typeDialog, dataEdit /> */} ) - + } export default DialogForm; \ No newline at end of file diff --git a/src/views/SimproV2/ProjectType/DialogInitialGantt.js b/src/views/SimproV2/ProjectType/DialogInitialGantt.js index c429e23..38a4df4 100644 --- a/src/views/SimproV2/ProjectType/DialogInitialGantt.js +++ b/src/views/SimproV2/ProjectType/DialogInitialGantt.js @@ -8,6 +8,7 @@ import SweetAlert from 'react-bootstrap-sweetalert'; import { TEMPLATE_GANTT_ADD, TEMPLATE_GANTT_DELETE, TEMPLATE_GANTT_EDIT, TEMPLATE_GANTT_TREE } from '../../../const/ApiConst'; import axios from "../../../const/interceptorApi" import DialogForm from './DialogFormInitial'; +import { useTranslation } from 'react-i18next'; const DialogInitialGantt = ({ openDialog, closeDialog, toggleDialog, idTypeProject }) => { const token = window.localStorage.getItem('token'); @@ -26,7 +27,7 @@ const DialogInitialGantt = ({ openDialog, closeDialog, toggleDialog, idTypeProje const [openDialogForm, setOpenDialogForm] = useState(false) const [typeDialog, setTypeDialog] = useState("add") const [dataEdit, setDataEdit] = useState([]) - + const { t } = useTranslation(); useEffect(() => { if (idTypeProject && idTypeProject > 0) { getDataInitial(); @@ -149,12 +150,12 @@ const DialogInitialGantt = ({ openDialog, closeDialog, toggleDialog, idTypeProje className: "nowrap", render: (text, record) => <> - - - {" "} - - {" "} - + + + {" "} + + {" "} + , @@ -181,12 +182,12 @@ const DialogInitialGantt = ({ openDialog, closeDialog, toggleDialog, idTypeProje showCancel confirmBtnText="Delete" confirmBtnBsStyle="danger" - title={`Are you sure?`} + title={t('deleteConfirm')} onConfirm={onConfirmDelete} onCancel={cancelDelete} focusCancelBtn > - Delete this data + {t('deleteMsg')} {/* Initial Gantt */} -
Template Gantt
+
Template Gantt
+ + + {renderTable} - + diff --git a/src/views/SimproV2/ProjectType/index.js b/src/views/SimproV2/ProjectType/index.js index b703b17..563c5da 100644 --- a/src/views/SimproV2/ProjectType/index.js +++ b/src/views/SimproV2/ProjectType/index.js @@ -10,7 +10,8 @@ import { DownloadOutlined } from '@ant-design/icons'; import { NotificationContainer, NotificationManager } from 'react-notifications'; import { PROJECT_TYPE_ADD, PROJECT_TYPE_EDIT, PROJECT_TYPE_DELETE, PROJECT_TYPE_SEARCH } from '../../../const/ApiConst'; import { Pagination, Button, Tooltip, Table } from 'antd'; - +import { useTranslation } from 'react-i18next'; +import { handleChangeLng } from '../../../utils/LangUtils'; const url = ""; const proyek_id = localStorage.getItem('proyek_id'); const role_id = localStorage.getItem('role_id'); @@ -54,7 +55,7 @@ const ProjectType = ({ params }) => { const [search, setSearch] = useState('') const [totalPage, setTotalPage] = useState(0) const [typeDialog, setTypeDialog] = useState('Save') - + const { t } = useTranslation(); useEffect(() => { getDataProjectType() }, [currentPage, rowsPerPage, search]) @@ -286,7 +287,7 @@ const ProjectType = ({ params }) => { if (dataTable.length === 0) { return ( - + ) } @@ -295,15 +296,15 @@ const ProjectType = ({ params }) => { const renderTable = useMemo(() => { const columns = [ { - title: 'Action', + title: t('action'), dataIndex: '', key: 'x', className: 'nowrap', render: (text, record) => <> - + handleDelete(text.id)}> - + handleEdit(text)}> {" "} @@ -311,8 +312,8 @@ const ProjectType = ({ params }) => { , }, - { title: 'Nama Role', dataIndex: 'name', key: 'name', className: "nowrap" }, - { title: 'Description', dataIndex: 'description', key: 'description' }, + { title: t('nameProjectType'), dataIndex: 'name', key: 'name', className: "nowrap" }, + { title: t('description'), dataIndex: 'description', key: 'description' }, ]; return (
Tidak ada data project type{t('noData')}
{ showCancel confirmBtnText="Delete" confirmBtnBsStyle="danger" - title={`Are you sure?`} + title={t('deleteConfirm')} onConfirm={onConfirmDelete} onCancel={() => cancelDelete()} focusCancelBtn > - Delete this data + {t('deleteMsg')} {

{pageName}

- + + + + + - + - + @@ -387,7 +392,7 @@ const ProjectType = ({ params }) => { /> - + ) } diff --git a/src/views/SimproV2/Satuan/DialogForm.js b/src/views/SimproV2/Satuan/DialogForm.js index 7acb313..4ab7a35 100644 --- a/src/views/SimproV2/Satuan/DialogForm.js +++ b/src/views/SimproV2/Satuan/DialogForm.js @@ -4,13 +4,14 @@ import { Button, Form, FormGroup, Label, Input, Col, Row } from 'reactstrap'; import 'antd/dist/antd.css'; +import { useTranslation } from 'react-i18next'; const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdit }) => { const [id, setId] = useState(0) const [name, setName] = useState('') const [description, setDescription] = useState('') - + const { t } = useTranslation() useEffect(() => { @@ -60,14 +61,14 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - - setName(e.target.value)} placeholder={`Input name...`} /> + + setName(e.target.value)} placeholder={t('inputName')} /> - setDescription(e.target.value)} placeholder={`Description ...`} /> + setDescription(e.target.value)} placeholder={t('inputDescription')} /> @@ -79,13 +80,13 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi return ( <> - {typeDialog == "Save" ? `Add` : "Edit"} Resource + {typeDialog == "Save" ? `Add` : "Edit"} {'uom'} {renderForm()} {' '} - + diff --git a/src/views/SimproV2/Satuan/index.js b/src/views/SimproV2/Satuan/index.js index b9cdff6..5210c75 100644 --- a/src/views/SimproV2/Satuan/index.js +++ b/src/views/SimproV2/Satuan/index.js @@ -7,6 +7,7 @@ import { Card, CardBody, CardHeader, Col, Row, Input, Table } from 'reactstrap'; import { NotificationContainer, NotificationManager } from 'react-notifications'; import { Pagination, Button, Tooltip } from 'antd'; import { SATUAN_ADD, SATUAN_EDIT, SATUAN_DELETE, SATUAN_SEARCH } from '../../../const/ApiConst'; +import { useTranslation } from 'react-i18next'; const token = window.localStorage.getItem('token'); const config = { @@ -17,11 +18,6 @@ const config = { } }; -const column = [ - { name: "Nama" }, - { name: "Deskripsi" }, -] - const Satuan = ({ params }) => { const token = localStorage.getItem("token") const HEADER = { @@ -45,7 +41,7 @@ const Satuan = ({ params }) => { const [search, setSearch] = useState('') const [totalPage, setTotalPage] = useState(0) const [typeDialog, setTypeDialog] = useState('Save') - + const { t } = useTranslation() useEffect(() => { getDataSatuan() }, [currentPage, rowsPerPage, search]) @@ -57,6 +53,10 @@ const Satuan = ({ params }) => { } }, [dataExport]) + const column = [ + { name: t('name') }, + { name: t('description') }, + ] const getDataSatuan = async () => { let start = 0; @@ -243,7 +243,7 @@ const Satuan = ({ params }) => { if (dataTable.length === 0) { return ( - + ) } @@ -258,12 +258,12 @@ const Satuan = ({ params }) => { showCancel confirmBtnText="Delete" confirmBtnBsStyle="danger" - title={`Are you sure?`} + title={t('deleteConfirm')} onConfirm={onConfirmDelete} onCancel={() => cancelDelete()} focusCancelBtn > - Delete this data + {t('deleteMsg')} {

{pageName}

- + - + - + @@ -295,7 +295,7 @@ const Satuan = ({ params }) => {
Tidak ada data project type{t('noData')}
- + {column.map((i, index) => { return ( @@ -310,11 +310,11 @@ const Satuan = ({ params }) => {
Aksi{t('action')}{i.name}
- + handleDelete(n.id)}> - + handleEdit(n)}>