diff --git a/src/App.js b/src/App.js index 357336a..5125e75 100644 --- a/src/App.js +++ b/src/App.js @@ -5,7 +5,7 @@ import 'react-notifications/lib/notifications.css'; import { Provider } from 'react-redux'; import { PersistGate } from 'redux-persist/integration/react'; import { persistor, store } from './appredux/store'; - +import { handleChangeLng } from "../src/utils/LangUtils"; const loading = () =>
Loading...
; const DefaultLayout = React.lazy(() => import('./containers/DefaultLayout')); @@ -22,22 +22,22 @@ class App extends Component { render() { return ( - - - - } /> - {/* } /> */} - } /> - } /> - } /> - } /> - } /> - {/* } />*/} - {/* } />*/} - } /> - - - + + + + } /> + {/* } /> */} + } /> + } /> + } /> + } /> + } /> + {/* } />*/} + {/* } />*/} + } /> + + + ); } diff --git a/src/assets/img/profile.png b/src/assets/img/profile.png new file mode 100644 index 0000000..b398aa2 Binary files /dev/null and b/src/assets/img/profile.png differ diff --git a/src/const/en.json b/src/const/en.json index e3285d2..bbaf507 100644 --- a/src/const/en.json +++ b/src/const/en.json @@ -3,26 +3,46 @@ "7days": "7 Days Ago", "action": "Action", "add": "Add", + "address": "Address", + "all": "All", + "assetType": "Asset Type", + "broadcastAdd": "Add Broadcast", + "broadcastDetail": "Detail Broadcast", + "broadcastDescription": "Description Broadcast", + "birthPlace": "Birth Place", + "birthDate": "Birth Date", "ChecklistK3Add": "Add Checklist K3", "cancel": "Cancel", "close": "Close", "color": "Color", "date": "Date", + "dateSend": "Send Date", "dateAbsent": "Absent Date", "dateReport": "Report Date", + "dateRequired": "Required Date", + "dateFOM": "FOM Date", + "datePR": "PR Date", + "datePO": "PO Date", + "dateDelivery": "Delivery Date", + "dateReceived": "Received Date", + "dateDeliverySite": "Delivery to Site Date", + "dateReceivedWerehouse": "Received to Warehouse Date", "delete": "Delete", "deleteMsg": "Delete this data ?", "deleteConfirm": "Are you sure ?", "description": "Description", "division": "Division", "divisionAdd": "Add Division", + "employeeType": "Employee Type", "edit": "Edit", "export": "Export", "exportExcel": "Export Excel", "exportPdf": "Export Pdf", "gearUse": "Gear Used", "gearNotUse": "Gear Not used", + "gender": "Gender", "hr": "Human Resource", + "hradd": "Add Human Resource", "icon": "Icon", "inputIcon": "Input Code Icon", "inputName": "Input Name", @@ -31,31 +51,64 @@ "inputAliasMenu": "Input Menu Alias", "inputOrder": "Input Order", "inputUrl": "Input URL", + "inputMsg": "Input Message", + "inputTitle": "Input Title", + "inputUOM": "Input UOM", + "inputAsset": "Input Asset", + "inputQTY": "Input QTY", + "inputQtyReceived": "Input QTY Received", + "inputUnitPrice": "Input Unit Price", + "inputPrice": "Input Price", + "inputEmail": "Input Email", + "inputNoPhone": "Input Phone Number", + "inputNik": "Input NIK (KTP)", "image": "Image", "imageCheck": "Selfie Presence", "locIn": "Location In", "locOut": "Location Out", + "map": "Map", + "materialResource": "Materials Resource", + "materialRequest": "Materials Request", + "materialDelivery": "Materials Delivery to site", "menuRoles": "Roles Menu", "menuAdd": "Add Menu", - "nik": "ID Card", + "message": "Message", + "messageBroadcast": "Broadcast Message", + "messageNotification": "Notification Message", + "nik": "NIK (KTP/ID Card)", "name": "Name", "nameHR": "Name Human Resource", "nameRole": "Name Role", "nameDivision": "Name Division", "nameProjectType": "Project Type", "nameProjectRole": "Project Role", + "nameAsset": "Name Asset", "noData": "Data not yet available", "order": "Order", + "Own": "Owner", + "ownershipStatus": "Ownership Status", + "ownershipName": "Ownership Name", "parentMenu": "Parent Menu", "phase": "Project Phase", "projectType": "Add Project Type", "projectPhase": "Add Project Phase", "presenceIn": "Presence In", "presenceOut": "Presence Out", + "panicButton": "Panic Button", + "price": "Price", + "qty": "QTY", + "qtyReceived": "QTY Received", + "retryPassword": "Rety Password", + "required": "Required", + "rent": "Rent", "rolesAdd": "Add Roles", "roles": "Roles", + "receiver": "Receiver", + "resourceToolsAdd": "Add Tools Resource", + "restrictions": "Work area restrictions", "search": "Search", "save": "Save", + "saveSend": "Save & Send", "searchType": "Search Project Type", "searchPhase": "Search Project Phase", "searchDivision": "Search Division", @@ -66,9 +119,26 @@ "searchProject": "All / Select Projects", "searchMenu": "Search Menu", "searchHR": "Search Human Resource", + "searchToolsRequest": "Search Tools Request", + "searchToolsDelivery": "Search Tools Delivery", + "searchTools": "Search Tools", + "searchMaterial": "Search Material", + "statusResponse": "Status Response", + "statusSend": "Status Send", + "selectOwnershipStatus": "Select Ownership Status", + "selectRole": "Select Role", + "selectDivision": "Select Division", + "selectGender": "Select Gender", "today": "Today", + "title": "Title", + "titleNotification": "Notification Title", + "toolsRequest": "Tools Request", + "toolsResource": "Tools Resource", + "toolsDelivery": "Tools Delivery", + "user": "User", "uom": "UOM", "uomAdd": "Add UOM", + "unitPrice": "Unit Price", "workDuration": "Work Duration", "workAreaIn": "Work Area In", "workAreaOut": "Work Area Out" diff --git a/src/const/i18n.js b/src/const/i18n.js index 30f2fe2..aedcbb4 100644 --- a/src/const/i18n.js +++ b/src/const/i18n.js @@ -2,23 +2,27 @@ import i18n from "i18next"; import { initReactI18next } from "react-i18next"; import en from "./en.json"; import id from "./id.json"; + +const fallbackLng = "en"; + i18n .use(initReactI18next) .init({ + resources: { + en: { translation: en }, + id: { translation: id }, + }, + fallbackLng, 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", + lng: localStorage.getItem("language") || fallbackLng, }); -export default i18n; \ No newline at end of file + +// Set up an event listener to update the language in localStorage whenever the language is changed +i18n.on("languageChanged", (lng) => { + localStorage.setItem("language", lng); +}); + +export default i18n; diff --git a/src/const/id.json b/src/const/id.json index 35863af..3d63238 100644 --- a/src/const/id.json +++ b/src/const/id.json @@ -3,13 +3,30 @@ "7days": "7 Hari Yang lalu", "action": "Aksi", "add": "Tambah", + "address": "Alamat", + "all": "Semua", + "assetType": "Tipe Aset", + "broadcastAdd": "Tambah Pesan Siaran", + "broadcastDetail": "Detail Pesan Siaran", + "broadcastDescription": "Deskripsi Pesan Siaran", + "birthPlace": "Tempat Lahir", + "birthDate": "Tanggal Lahir", "ChecklistK3Add": "Tambah Ceklis K3", "cancel": "Batal", "close": "Tutup", "color": "Warna", "date": "Tanggal", + "dateSend": "Tanggal Kirim", "dateAbsent": "Tanggal Absen", "dateReport": "Tanggal Lapor", + "dateRequired": "Tanggal Permintaan", + "dateFOM": "Tanggal FOM", + "datePR": "Tanggal PR", + "datePO": "Tanggal PO", + "dateDelivery": "Tanggal Pengiriman", + "dateReceived": "Tanggal Penerimaan", + "dateDeliverySite": "Tanggal Pengiriman ke Lokasi", + "dateReceivedWerehouse": "Tanggal Penerimaan ke Gudang", "delete": "Hapus", "deleteMsg": "Hapus Data Ini ?", "deleteConfirm": "Apakah Anda Yakin ?", @@ -20,41 +37,80 @@ "export": "Ekspor", "exportExcel": "Ekspor Excel", "exportPdf": "Ekspor Pdf", + "employeeType": "Tipe Pegawai", "gearUse": "Perlengkapan Dikenakan", "gearNotUse": "Perlengkapan Tidak Dikenakan", + "gender": "Jenis Kelamin", "hr": "Pegawai", + "hradd": "Tambah Pegawai", "icon": "Ikon", "inputIcon": "Masukan Kode Ikon", "inputName": "Masukan Nama", + "inputaddress": "Masukan Alamat", + "inputBrithPlace": "Masukan Tempat Lahir", + "inputBrithDate": "Pilih Tanggal Lahir", "inputDescription": "Masukan Deskripsi", "inputParentMenu": "Pilih Induk Menu", "inputAliasMenu": "Masukan Alias Menu", "inputOrder": "Masukan Urutan", "inputUrl": "Masukan URL", + "inputMsg": "Masukan Pesan", + "inputTitle": "Masukan Judul", + "inputUOM": "Masukan Satuan", + "inputAsset": "Masukan Aset", + "inputQTY": "Masukan Satuan", + "inputQtyReceived": "Masukan Kuantitas Yang Diterima", + "inputUnitPrice": "Masukan Harga Satuan", + "inputPrice": "Masukan Harga", + "inputEmail": "Masukan Email", + "inputNoPhone": "Masukan No Telp", + "inputNik": "Masukan NIK (KTP)", "image": "Gambar", "imageCheck": "Lihat Selfie Presensi", "locIn": "Lokasi Masuk", "locOut": "Lokasi Pulang", "menuRoles": "Menu Peran", "menuAdd": "Tambah Menu", - "nik": "NIK", + "map": "Peta", + "materialResource": "Manajemen Material", + "materialRequest": "Permintaan Material", + "materialDelivery": "Pengiriman Material Ke Lokasi", + "message": "Pesan", + "messageBroadcast": "Pesan Siaran", + "messageNotification": "Pesan Notifikasi", + "nik": "NIK (KTP/ID Card)", "nameDivision": "Nama Divisi", "name": "Nama", "nameHR": "Nama Pegawai", "nameRole": "Nama Peran", "nameProjectType": "Tipe Proyek", "nameProjectRole": "Peran Proyek", + "nameAsset": "Nama Aset", "noData": "Data Belum tersedia", "order": "Urutan", + "own": "Milik Sendiri", + "ownershipStatus": "Status Kepemilikan", + "ownershipName": "Nama Pemilik", "parentMenu": "Menu Induk", "phase": "Fase Proyek", "projectType": "Tambah Tipe Proyek", "projectPhase": "Tambah Fase Proyek", "presenceIn": "Waktu Masuk", "presenceOut": "Waktu Pulang", + "panicButton": "Tombol Panik", + "price": "Harga", + "qty": "Kuantitas", + "qtyReceived": "Kuantitas Diterima", + "retryPassword": "Konfirmasi Password", + "required": "Wajib Diisi", + "rent": "Sewa", "rolesAdd": "Tambah Roles", "roles": "Peran", + "receiver": "Penerima", + "resourceToolsAdd": "Tambah Data Alat", + "restrictions": "Pembatasan Area Kerja", "save": "Simpan", + "saveSend": "Simpan & Kirim", "search": "Cari", "searchType": "Cari Tipe Proyek", "searchPhase": "Cari Fase Proyek", @@ -66,9 +122,26 @@ "searchProject": "Semua / Pilih Proyek", "searchMenu": "Cari Menu", "searchHR": "Cari Nama Pegawai", + "searchToolsRequest": "Cari Permintaan Alat", + "searchToolsDelivery": "Cari Pengiriman Alat", + "searchTools": "Cari Alat", + "searchMaterial": "Cari Material", + "statusResponse": "Status Respon", + "statusSend": "Status Kirim", + "selectOwnershipStatus": "Pilih Status Kepemilikan", + "selectRole": "Pilih Peran", + "selectDivision": "Pilih Divisi", + "selectGender": "Pilih Jenis Kelamin", "today": "Hari Ini", + "title": "Judul", + "titleNotification": "Judul Notifikasi", + "toolsRequest": "Permintaan Alat", + "toolsResource": "Manajemen Alat", + "toolsDelivery": "Pengiriman Alat", + "user": "Pengguna", "uom": "Satuan", "uomAdd": "Tambah Satuan", + "unitPrice": "Harga Satuan", "workDuration": "Durasi Kerja", "workAreaIn": "Area Kerja In", "workAreaOut": "Area Kerja Out" diff --git a/src/containers/DefaultLayout/DefaultLayout.js b/src/containers/DefaultLayout/DefaultLayout.js index 17045f1..21b86e7 100644 --- a/src/containers/DefaultLayout/DefaultLayout.js +++ b/src/containers/DefaultLayout/DefaultLayout.js @@ -1,10 +1,10 @@ import React, { Component, Suspense, Divider } from 'react'; import { Redirect, Route, Switch } from 'react-router-dom'; import * as router from 'react-router-dom'; -import { Container } from 'reactstrap'; +import { Button, Container, UncontrolledDropdown, DropdownItem, DropdownMenu, DropdownToggle, Nav, NavItem } from 'reactstrap'; import axios from 'axios'; import { ALERTUSER_SEARCH, ALERT_SEARCH, MENU_SEARCH, ROLEMENU_SEARCH, ALERTUSER_STATUSVIEW, ALERT_STATUSVIEW, MENU_MANAGEMENT, CONTROL_MONITORING_SEARCH } from '../../const/ApiConst'; - +import { handleChangeLng } from "../../utils/LangUtils"; import { AppAside, AppFooter, @@ -51,7 +51,7 @@ class DefaultLayout extends Component { const menu = localStorage.getItem("menu_login") if (menu) this.setMenu(JSON.parse(menu)) this.getAppBreadcrumb(); - if(!localStorage.getItem("token")){ + if (!localStorage.getItem("token")) { this.signOut(); } } @@ -92,14 +92,14 @@ class DefaultLayout extends Component { loading = () =>
Loading...
- async signOut(e) { - if (e) { - e.preventDefault() - } - await localStorage.removeItem("role_id"); - await window.localStorage.clear(); - this.props.history.replace('/login') + async signOut(e) { + if (e) { + e.preventDefault() } + await localStorage.removeItem("role_id"); + await window.localStorage.clear(); + this.props.history.replace('/login') + } getDataMenu = async () => { errorCount++; @@ -212,7 +212,7 @@ class DefaultLayout extends Component { }); } else { - if (!window.location.href.includes("dashboard")){ + if (!window.location.href.includes("dashboard")) { return } } @@ -238,18 +238,26 @@ class DefaultLayout extends Component { {/* this.signOut(e)} /> */} {/* */} {/* */} -
+
{this.getMenu()} -
  • - this.signOut(e)}> - Logout - -
  • + + + {localStorage.getItem('user_name')} + + + + + + + Profile + this.signOut(e)}> Logout + +
    @@ -269,7 +277,7 @@ class DefaultLayout extends Component { )} /> ) : (null); })} - + @@ -281,13 +289,13 @@ class DefaultLayout extends Component { {!this.isKominfo ? - ( - - - - - - ) : null + ( + + + + + + ) : null } ); diff --git a/src/routes.js b/src/routes.js index cd38e1e..bd565bb 100644 --- a/src/routes.js +++ b/src/routes.js @@ -47,12 +47,12 @@ const DashboardBOD = React.lazy(() => import('./views/Dashboard/DashboardBOD')); const DashboardCustomer = React.lazy(() => import('./views/Dashboard/DashboardCustomer')); const DashboardProject = React.lazy(() => import('./views/Dashboard/DashboardProject')); const MapMonitoring = React.lazy(() => import('./views/MapMonitoring')); - +const Settings = React.lazy(() => import('./views/SimproV2/Settings')); const routes = [ { path: '/', exact: true, name: 'Home' }, // { path: '/dashboard', name: 'Dashboard', component: Dashboard}, - { path: '/dashboard', name: 'DashboardBOD', component: DashboardBOD}, - { path: '/dashboard-customer/:PROJECT_ID/:GANTT_ID', name: 'DashboardCustomer', component: DashboardCustomer}, + { path: '/dashboard', name: 'DashboardBOD', component: DashboardBOD }, + { path: '/dashboard-customer/:PROJECT_ID/:GANTT_ID', name: 'DashboardCustomer', component: DashboardCustomer }, { path: '/dashboard-project/:PROJECT_ID/:GANTT_ID', exact: true, name: 'Dashboard Project', component: DashboardProject }, { path: '/projects', exact: true, name: 'Projects', component: CreatedProyek }, { path: '/projects/:id/:project/gantt', exact: true, name: 'Gantt', component: Gantt }, @@ -102,6 +102,7 @@ const routes = [ { path: '/working-hour', exact: true, name: 'Working Hour', component: Shift }, { path: '/map-monitoring', exact: true, name: 'Map Monitoring', component: MapMonitoring }, // { path: '/dashboard-project/:ID/:GANTTID', exact: true, name: 'Dashboard Project', component: DashboardProject }, + { path: '/settings', exact: true, name: 'Settings', component: Settings }, ]; export default routes; diff --git a/src/services/api/base.js b/src/services/api/base.js index 73d4460..76b9e5d 100644 --- a/src/services/api/base.js +++ b/src/services/api/base.js @@ -1,4 +1,5 @@ import axios from 'axios'; +import { toast } from "react-toastify"; export default class RequestApi { // static Request() { // // axios.interceptors.request.use(function (config) { @@ -47,7 +48,8 @@ export default class RequestApi { if (err.response) { if (err.response.status === 307 || err.response.status === 403 || err.response.status === 401) { // console.log(err.response); - alert('Token expired, please re-login'); + // alert('Token expired, please re-login'); + toast.error("Token expired, please re-login"); // clearAllState(); window.localStorage.clear(); window.location.reload(); @@ -56,7 +58,8 @@ export default class RequestApi { } } if (err && err.message && err.message.includes('401')) { - alert('Token expired, please re-login'); + // alert('Token expired, please re-login'); + toast.error("Token expired, please re-login"); // clearAllState(); window.localStorage.clear(); window.location.reload(); diff --git a/src/utils/LangUtils.js b/src/utils/LangUtils.js index ef1f15f..b518490 100644 --- a/src/utils/LangUtils.js +++ b/src/utils/LangUtils.js @@ -1,6 +1,7 @@ import i18n from "../const/i18n"; export const handleChangeLng = (lng) => { + console.log("Changing language to:", lng); i18n.changeLanguage(lng); localStorage.setItem("lng", lng); -}; \ No newline at end of file +}; diff --git a/src/views/Dashboard/DashboardBOD.js b/src/views/Dashboard/DashboardBOD.js index bbb1397..95cc579 100644 --- a/src/views/Dashboard/DashboardBOD.js +++ b/src/views/Dashboard/DashboardBOD.js @@ -318,7 +318,7 @@ const DashboardBOD = () => { tableData.push({ "id": item.id, "last_gantt_id": item.lastGanttId?.last_gantt_id, - "kode_sortname": item.kode_sortname?.kode_sortname ? item.kode_sortname : "-", + "kode_sortname": item.kode_sortname ? item.kode_sortname : "-", "project_name": item.nama, "project_manager": item.pm?.name, "planned_interval": `${item.mulai_proyek ? moment(item.mulai_proyek).format('DD/MM/YYYY') : '-'} - ${item.akhir_proyek ? moment(item.akhir_proyek).format('DD/MM/YYYY') : '-'}`, @@ -779,7 +779,7 @@ const DashboardBOD = () => { data={{ // labels: ["Gedung Tenaga Panel Surya", "Pembangunan Gedung Tower ABC", "Tower Jaringan Jawa Barat", "Tower Jaringan Jawa Timur", "Tower Jaringan Jawa Tengah", "Tower Jaringan Bali", "Project Tower ABC", "Tower Jaringan DKI Jakarta", "Tower Jaringan NTT"], // labels: [["Gedung Tenaga", "Panel Surya"], ["Pembangunan Gedung", "Tower ABC"], ["Tower Jaringan", "Jawa Barat"], ["Tower Jaringan", "Jawa Timur"], ["Tower Jaringan", "Jawa Tengah"], "Tower Jaringan Bali", "Project Tower ABC", ["Tower Jaringan", "DKI Jakarta"], "Tower Jaringan NTT"], - labels: PROJECT_INVOICE_VS_CASH_IN ? PROJECT_INVOICE_VS_CASH_IN.map((item, idx) => item.project) : [], + labels: PROJECT_INVOICE_VS_CASH_IN ? PROJECT_INVOICE_VS_CASH_IN.map((item, idx) => item.project_code) : [], datasets: [ { label: "Invoiced", diff --git a/src/views/Master/MasterBroadcast/DialogDetail.js b/src/views/Master/MasterBroadcast/DialogDetail.js index f1da7f7..80d73be 100644 --- a/src/views/Master/MasterBroadcast/DialogDetail.js +++ b/src/views/Master/MasterBroadcast/DialogDetail.js @@ -6,19 +6,20 @@ import Select from 'react-select'; import axios from 'axios'; import { BASE_URL_GEOHR_API } from '../../../const/ApiConst'; import { Transfer } from 'antd'; +import { withTranslation } from 'react-i18next'; const ERROR_TITLE = "judul is required!" const ERROR_MESSAGE = "message is required!" const BASE_URL = "https://oslog.id/geohr-api/"; let countError = 0; -export default class DialogDetail extends Component { +class DialogDetail extends Component { constructor(props) { super(props) - this.state = { + this.state = { openDialog: false, isParentClick: false, - dataListDetail:[], - id:0, + dataListDetail: [], + id: 0, } } @@ -31,8 +32,8 @@ export default class DialogDetail extends Component { const { dataDetail } = this.props console.log("cek data detail", dataDetail) this.setState({ - id:dataDetail.id - },() => { + id: dataDetail.id + }, () => { this.getDataDetail(); this.setState({ isParentClick: false }); }); @@ -41,38 +42,38 @@ export default class DialogDetail extends Component { getDataDetail = async () => { countError++; - let url = BASE_URL_GEOHR_API+`/broadcast-detail/search?broadcastId=${this.state.id}`; + let url = BASE_URL_GEOHR_API + `/broadcast-detail/search?broadcastId=${this.state.id}`; const payload = { - "paging": {"start": 0, "length": 25}, - "orders": {"columns": ["id"], "ascending": true}, - "columns": [ - {"name": "status_send", "logic_operator": "ilike", "value":"", "operator": "AND"} - ], - "joins": [ - {"name": "m_broadcast", "column_results": ["title_notif","message_notif","description","status_send"], "column_join":"broadcast_id"} - ] + "paging": { "start": 0, "length": 25 }, + "orders": { "columns": ["id"], "ascending": true }, + "columns": [ + { "name": "status_send", "logic_operator": "ilike", "value": "", "operator": "AND" } + ], + "joins": [ + { "name": "m_broadcast", "column_results": ["title_notif", "message_notif", "description", "status_send"], "column_join": "broadcast_id" } + ] } const result = await axios - .post(url,payload) + .post(url, payload) .then(res => res) - .catch((error) => error.response ); - console.log('cek data detail', result.data) + .catch((error) => error.response); + console.log('cek data detail', result.data) - if(result && result.data && result.data.code === 200){ - if (result.data.data && result.data.data.broadcast_details) { - this.setState({ dataListDetail:result.data.data.broadcast_details }) - } - }else{ - if(countError<6){ - this.getDataDetail(); - } + if (result && result.data && result.data.code === 200) { + if (result.data.data && result.data.data.broadcast_details) { + this.setState({ dataListDetail: result.data.data.broadcast_details }) } + } else { + if (countError < 6) { + this.getDataDetail(); + } + } } showDialog = () => { this.setState({ isParentClick: true }); } - + handleCloseDialog = () => { this.props.closeDialog() } @@ -80,38 +81,39 @@ export default class DialogDetail extends Component { render() { return ( - Detail Broadcast + {this.props.t('broadcastDetail')} - - +
    + - - - - - + + + + + - - - {this.state.dataListDetail.map((val, index) => { - return( - - - - - - - + + + {this.state.dataListDetail.map((val, index) => { + return ( + + + + + + + ) - })} - -
    Status SendTanggal KirimDeskripsiJudul NotifikasiPesan Notifikasi{this.props.t('statusSend')}{this.props.t('dateSend')}{this.props.t('description')}{this.props.t('titleNotification')}{this.props.t('messageNotification')}
    {val.join.status_send==="" ? "-" :val.status_send}{val.join.created_date==="" ? "-" : moment(val.created_date).format("YYYY-MM-DD HH:mm:ss")}{val.join.broadcast_description==="" ? "-" : val.join.broadcast_description}{val.join.broadcast_title_notif==="" ? "-" : val.join.broadcast_title_notif}{val.join.broadcast_message_notif==="" ? "-" : val.join.broadcast_message_notif}
    {val.join.status_send === "" ? "-" : val.status_send}{val.join.created_date === "" ? "-" : moment(val.created_date).format("YYYY-MM-DD HH:mm:ss")}{val.join.broadcast_description === "" ? "-" : val.join.broadcast_description}{val.join.broadcast_title_notif === "" ? "-" : val.join.broadcast_title_notif}{val.join.broadcast_message_notif === "" ? "-" : val.join.broadcast_message_notif}
    - + })} + + +
    - +
    ) } } +export default withTranslation()(DialogDetail); \ No newline at end of file diff --git a/src/views/Master/MasterBroadcast/DialogForm.js b/src/views/Master/MasterBroadcast/DialogForm.js index bee164d..c114a4d 100644 --- a/src/views/Master/MasterBroadcast/DialogForm.js +++ b/src/views/Master/MasterBroadcast/DialogForm.js @@ -5,15 +5,16 @@ import Select from 'react-select'; import axios from 'axios'; import { BASE_URL_GEOHR_API2, ROLE_SEARCH, USER_WASPANG } from '../../../const/ApiConst'; import { Transfer } from 'antd'; +import { withTranslation } from 'react-i18next'; const token = window.localStorage.getItem('token'); const config = { - headers: - { - Authorization : `Bearer ${token}`, - "Content-type" : `application/json` + headers: + { + Authorization: `Bearer ${token}`, + "Content-type": `application/json` } }; @@ -23,7 +24,7 @@ const ERROR_MESSAGE = "message is required!" const BASE_URL = "https://oslog.id/geohr-api/"; const roleName = window.localStorage.getItem('role_name'); let countError = 0; -export default class DialogForm extends Component { +class DialogForm extends Component { constructor(props) { super(props) this.state = { @@ -37,7 +38,7 @@ export default class DialogForm extends Component { errorMessage: "", errorDivision: "", errorEmployee: "", - penerima:"all", + penerima: "all", displayKaryawan: "none", displayDivisi: "none", listOrganizationSelect: [], @@ -45,12 +46,12 @@ export default class DialogForm extends Component { dataEmployee: [], dataSourceEmployee: [], idOrganization: 0, - targetKeys:[], + targetKeys: [], selectedKeys: [], - allEmployeeId:[], + allEmployeeId: [], idEmployeeDivision: [], - idOrganization:[], - disableTransfer:true + idOrganization: [], + disableTransfer: true } } @@ -86,7 +87,7 @@ export default class DialogForm extends Component { showDialog = () => { this.setState({ isParentClick: true }); } - + validate = () => { @@ -109,12 +110,12 @@ export default class DialogForm extends Component { this.setState({ errorMessage: "message minimum 3-200 karakter!" }) } - if(penerima=== "division"){ - if(this.state.idOrganization===0){ + if (penerima === "division") { + if (this.state.idOrganization === 0) { this.setState({ errorDivision: "Silahkan pilih divisi penerima!" }) } - }else if(penerima==="karyawan"){ - if(this.state.selectedKeys.length===0){ + } else if (penerima === "karyawan") { + if (this.state.selectedKeys.length === 0) { this.setState({ errorEmployee: "Silahkan pilih karyawan penerima!" }) } } @@ -133,18 +134,18 @@ export default class DialogForm extends Component { let idSend = []; let send_to_type = "all"; - if(penerima==="all"){ + if (penerima === "all") { idSend = this.state.allEmployeeId; send_to_type = "all"; - }else if(penerima==="division"){ + } else if (penerima === "division") { idSend = this.state.idOrganization; send_to_type = "roles"; - }else if(penerima==="karyawan"){ + } else if (penerima === "karyawan") { idSend = this.state.targetKeys; send_to_type = "users"; } - idSend = idSend.map(function(e){ + idSend = idSend.map(function (e) { return e.toString() }); @@ -153,13 +154,13 @@ export default class DialogForm extends Component { description, message, send_to_type, - id:idSend + id: idSend } if (param === 'registered' || param === 'send') { this.props.handleSaveBroadcast(param, data) } - this.setState({ id: 0,idOrganization:0,currentSelectDiv:null,targetKeys:[],penerima:"all",displayKaryawan:"none",displayDivisi:"none",disableTransfer:true }); + this.setState({ id: 0, idOrganization: 0, currentSelectDiv: null, targetKeys: [], penerima: "all", displayKaryawan: "none", displayDivisi: "none", disableTransfer: true }); } } @@ -168,18 +169,18 @@ export default class DialogForm extends Component { } handleChangePenerima = type => { - if(type==="organization"){ - this.setState({ displayDivisi:"block",displayKaryawan:"none",disableTransfer:true,errorDivision:"",targetKeys:[] }) - }else if(type==="karyawan"){ - this.setState({ displayKaryawan:"block",displayDivisi:"none",disableTransfer:false,errorEmployee:"",idEmployeeDivision:[],currentSelectDiv:null }) - }else{ - this.setState({ displayKaryawan:"none",displayDivisi:"none",disableTransfer:true,errorDivision:"",errorEmployee:"",targetKeys:[],idEmployeeDivision:[],currentSelectDiv:null }) + if (type === "organization") { + this.setState({ displayDivisi: "block", displayKaryawan: "none", disableTransfer: true, errorDivision: "", targetKeys: [] }) + } else if (type === "karyawan") { + this.setState({ displayKaryawan: "block", displayDivisi: "none", disableTransfer: false, errorEmployee: "", idEmployeeDivision: [], currentSelectDiv: null }) + } else { + this.setState({ displayKaryawan: "none", displayDivisi: "none", disableTransfer: true, errorDivision: "", errorEmployee: "", targetKeys: [], idEmployeeDivision: [], currentSelectDiv: null }) } - this.setState({ penerima:type }); + this.setState({ penerima: type }); } handleSelectOrganization = (inputValue, actionMeta) => { - this.setState({ idOrganization:inputValue.value,currentSelectDiv:{ value:inputValue.value,label:inputValue.label },errorDivision:"" }, () => { + this.setState({ idOrganization: inputValue.value, currentSelectDiv: { value: inputValue.value, label: inputValue.label }, errorDivision: "" }, () => { this.setEmployeeOrganization(); }); } @@ -188,17 +189,17 @@ export default class DialogForm extends Component { let arrEd = this.state.dataEmployee; let cek = arrEd.filter(this.filterId) - this.setState({ idEmployeeDivision:cek }) + this.setState({ idEmployeeDivision: cek }) } - filterId= (val) => { + filterId = (val) => { return val.organization_id == this.state.idOrganization } getDataRole = async () => { const payload = { - - "orders": {"columns": ["id"], "ascending": false} + + "orders": { "columns": ["id"], "ascending": false } } const result = await axios @@ -207,106 +208,106 @@ export default class DialogForm extends Component { .catch((error) => error.response); console.log('test role', result) - if(result && result.data && result.data.code === 200){ - this.setState({ dataDivision:result.data.data },()=>{ - this.setDataOrganization(); - }) - }else{ - } + if (result && result.data && result.data.code === 200) { + this.setState({ dataDivision: result.data.data }, () => { + this.setDataOrganization(); + }) + } else { + } } setDataOrganization = () => { const { dataDivision } = this.state const listOrganization = [] - dataDivision.map((val, index)=> { + dataDivision.map((val, index) => { listOrganization.push({ - value:val.id, - label:val.name + value: val.id, + label: val.name }) }) - this.setState({ listOrganizationSelect:listOrganization }) + this.setState({ listOrganizationSelect: listOrganization }) } getDataUsers = async () => { const payload = { - "paging":{ - "start":0, - "length":10 + "paging": { + "start": 0, + "length": 10 }, - "filter_columns":[ - { - "name":"name", - "value":"", - "table_name":"m_users" - } + "filter_columns": [ + { + "name": "name", + "value": "", + "table_name": "m_users" + } ], - "columns":[ - { - "name":"name", - "logic_operator":"like", - "value":"", - "operator":"AND", - "table_name":"m_users" - }, - { - "name":"id", - "logic_operator":"=", - "value":"3", - "operator":"AND", - "table_name":"m_roles" - } + "columns": [ + { + "name": "name", + "logic_operator": "like", + "value": "", + "operator": "AND", + "table_name": "m_users" + }, + { + "name": "id", + "logic_operator": "=", + "value": "3", + "operator": "AND", + "table_name": "m_roles" + } ], - "joins":[ - { - "name":"m_users", - "column_join":"user_id", - "column_results":[ - "username", - "name", - "email", - "gender", - "phone_number", - "address", - "birth_place", - "birth_date" - ] - }, - { - "name":"m_roles", - "column_join":"role_id", - "column_results":[ - "name" - ] - } + "joins": [ + { + "name": "m_users", + "column_join": "user_id", + "column_results": [ + "username", + "name", + "email", + "gender", + "phone_number", + "address", + "birth_place", + "birth_date" + ] + }, + { + "name": "m_roles", + "column_join": "role_id", + "column_results": [ + "name" + ] + } ], - "orders":{ - "columns":[ - "id" - ], - "ascending":false + "orders": { + "columns": [ + "id" + ], + "ascending": false } - } + } - const result = await axios + const result = await axios .post(USER_WASPANG, payload, config) .then(res => res) .catch((error) => error.response); console.log('test role', result) - - if (result && result.data && result.code == "200") { - this.setState({ dataEmployee: result.data }, ()=> { - this.setDataEmployee(); - }); - } else { - } + + if (result && result.data && result.code == "200") { + this.setState({ dataEmployee: result.data }, () => { + this.setDataEmployee(); + }); + } else { + } } setDataEmployee = () => { const listEmployee = []; const allIdEmployee = []; - this.state.dataEmployee.map((val, index)=> { + this.state.dataEmployee.map((val, index) => { allIdEmployee.push(val.id); listEmployee.push({ key: val.id, @@ -315,55 +316,56 @@ export default class DialogForm extends Component { }); }) - this.setState({ dataSourceEmployee: listEmployee, allEmployeeId:allIdEmployee }) + this.setState({ dataSourceEmployee: listEmployee, allEmployeeId: allIdEmployee }) } handleChangeTransfer = (nextTargetKeys, direction, moveKeys) => { - this.setState({ targetKeys: nextTargetKeys,errorEmployee:"" }); + this.setState({ targetKeys: nextTargetKeys, errorEmployee: "" }); }; handleSelectChangeTransfer = (sourceSelectedKeys, targetSelectedKeys) => { - this.setState({ selectedKeys: [...sourceSelectedKeys, ...targetSelectedKeys],errorEmployee:"" }); + this.setState({ selectedKeys: [...sourceSelectedKeys, ...targetSelectedKeys], errorEmployee: "" }); }; renderForm = () => { + const t = this.props const { errorTitle, errorMessage } = this.state return (
    - - this.handleChangePenerima(e.target.value )}> - - - + + this.handleChangePenerima(e.target.value)}> + + + - - + + this.setState( @@ -371,26 +373,26 @@ export default class DialogForm extends Component { errorTitle: e.target.value !== "" ? "" : ERROR_TITLE, title: e.target.value })} - placeholder="judul.." /> + placeholder={this.props.t('inputTitle')} /> {errorTitle && ( {errorTitle} )} - + this.setState({ errorMessage: e.target.value !== "" ? "" : ERROR_MESSAGE, message: e.target.value })} placeholder="pesan.." /> + onChange={(e) => this.setState({ errorMessage: e.target.value !== "" ? "" : ERROR_MESSAGE, message: e.target.value })} placeholder={this.props.t('inputMsg')} /> {errorMessage && ( {errorMessage} )} - - this.setState({ description: e.target.value })} placeholder="deskripsi.." /> + + this.setState({ description: e.target.value })} placeholder={this.props.t('inputDescription')} /> ) @@ -408,16 +410,17 @@ export default class DialogForm extends Component { render() { return ( - Broadcast + {this.props.t('broadcastDetail')} {this.renderForm()} - {' '} - {' '} - + {' '} + {' '} + ) } } +export default withTranslation()(DialogForm); \ No newline at end of file diff --git a/src/views/Master/MasterBroadcast/index.js b/src/views/Master/MasterBroadcast/index.js index 90ec78e..e99e2af 100644 --- a/src/views/Master/MasterBroadcast/index.js +++ b/src/views/Master/MasterBroadcast/index.js @@ -10,32 +10,25 @@ import { Button, Card, CardBody, CardHeader, DropdownItem, DropdownMenu, Dropdow import { DatePicker, Pagination } from 'antd'; import { NotificationContainer, NotificationManager } from 'react-notifications'; import { Tooltip } from 'reactstrap'; +import { withTranslation } from 'react-i18next'; const { RangePicker } = DatePicker; const token = window.localStorage.getItem('token'); const config = { headers: { - Authorization : `Bearer ${token}`, - "Content-type" : `application/json` + Authorization: `Bearer ${token}`, + "Content-type": `application/json` } }; const id_org = window.localStorage.getItem('id_org'); const roleName = window.localStorage.getItem('role_name'); -const column = [ - { name: "Aksi" }, - { name: "Judul" }, - { name: "Pesan" }, - { name: "Deskripsi" }, - { name: "Status" }, - { name: "Tanggal" }, -] const LENGTH_DATA = 10 -export default class index extends Component { +class index extends Component { constructor(props) { super(props) this.state = { @@ -43,10 +36,10 @@ export default class index extends Component { alertDelete: false, currentDay: 'today', currentPage: 1, - dataDetail:[], + dataDetail: [], dataEdit: null, dataExport: [], - dataExport:[], + dataExport: [], dataGs: [], dataIdHo: [], dataTable: [], @@ -63,13 +56,13 @@ export default class index extends Component { splitButtonOpen: false, startDate: moment(moment().format("YYYY-M-D")), statusSend: '', - toltipDetail:false, + toltipDetail: false, tooltipDelete: false, tooltipEdit: false, - tooltipExport:false, - tooltipTambah:false, - tooltipresend:false, - tooltipsend:false, + tooltipExport: false, + tooltipTambah: false, + tooltipresend: false, + tooltipsend: false, totalPage: 0, typeClock: "All", typeDialog: 'Save', @@ -129,19 +122,19 @@ export default class index extends Component { "length": this.state.rowsPerPage, "start": start } - } + } - if(this.state.search!=="" && this.state.search!==null){ + if (this.state.search !== "" && this.state.search !== null) { } const result = await axios - .post(url, payload, config) - .then(res => res) - .catch((error) => error.response); + .post(url, payload, config) + .then(res => res) + .catch((error) => error.response); if (result && result.data) { - if(result.data.code===200){ + if (result.data.code === 200) { this.setState({ dataTable: result.data.data, totalPage: result.data.totalRecord }); - }else{ + } else { NotificationManager.error('Failed retreiving data!!', 'Failed'); } } else { @@ -195,15 +188,15 @@ export default class index extends Component { "send_to_type": "all", "message_notif": data.message, "description": data.description, - } + } const paramRoles = { - "title_notif": data.title, - "status_send": type, - "send_to_type": "roles", - "message_notif": data.message, - "description": data.description, - "send_to_id": data.id + "title_notif": data.title, + "status_send": type, + "send_to_type": "roles", + "message_notif": data.message, + "description": data.description, + "send_to_id": data.id } const paramUsers = { @@ -213,63 +206,63 @@ export default class index extends Component { "message_notif": data.message, "description": data.description, "send_to_id": data.id.map((id, index) => id) - } - - if(data.send_to_type === "all") { - const result = await axios.post(url, param, config) - .then(res => res) - .catch((error) => error.response); - if (result) { - if(result.data){ - if(result.data.code===200){ - this.getDataBroadcast(); - NotificationManager.success('Broadcast berhasil terkirimkan', 'Success!!'); - }else{ - NotificationManager.error(`${result.data.message}`, 'Failed!!'); - } - }else{ - NotificationManager.error(`${result.data.message}`, 'Failed!!'); - } - }else{ - NotificationManager.error(`${result.data.message}`, 'Failed!!'); - } - } else if(data.send_to_type === "roles") { - const result = await axios.post(url, paramRoles, config) - .then(res => res) - .catch((error) => error.response); - if (result) { - if(result.data){ - if(result.data.code===200){ - this.getDataBroadcast(); - NotificationManager.success('Broadcast berhasil terkirimkan', 'Success!!'); - }else{ - NotificationManager.error(`${result.data.message}`, 'Failed!!'); - } - }else{ - NotificationManager.error(`${result.data.message}`, 'Failed!!'); - } - }else{ - NotificationManager.error(`${result.data.message}`, 'Failed!!'); - } - } else if(data.send_to_type === "users") { - const result = await axios.post(url, paramUsers, config) - .then(res => res) - .catch((error) => error.response); - if (result) { - if(result.data){ - if(result.data.code === 200){ - this.getDataBroadcast(); - NotificationManager.success('Broadcast berhasil terkirimkan', 'Success!!'); - }else{ - NotificationManager.error(`${result.data.message}`, 'Failed!!'); - } - }else{ - NotificationManager.error(`${result.data.message}`, 'Failed!!'); - } - }else{ - NotificationManager.error(`${result.data.message}`, 'Failed!!'); - } - } + } + + if (data.send_to_type === "all") { + const result = await axios.post(url, param, config) + .then(res => res) + .catch((error) => error.response); + if (result) { + if (result.data) { + if (result.data.code === 200) { + this.getDataBroadcast(); + NotificationManager.success('Broadcast berhasil terkirimkan', 'Success!!'); + } else { + NotificationManager.error(`${result.data.message}`, 'Failed!!'); + } + } else { + NotificationManager.error(`${result.data.message}`, 'Failed!!'); + } + } else { + NotificationManager.error(`${result.data.message}`, 'Failed!!'); + } + } else if (data.send_to_type === "roles") { + const result = await axios.post(url, paramRoles, config) + .then(res => res) + .catch((error) => error.response); + if (result) { + if (result.data) { + if (result.data.code === 200) { + this.getDataBroadcast(); + NotificationManager.success('Broadcast berhasil terkirimkan', 'Success!!'); + } else { + NotificationManager.error(`${result.data.message}`, 'Failed!!'); + } + } else { + NotificationManager.error(`${result.data.message}`, 'Failed!!'); + } + } else { + NotificationManager.error(`${result.data.message}`, 'Failed!!'); + } + } else if (data.send_to_type === "users") { + const result = await axios.post(url, paramUsers, config) + .then(res => res) + .catch((error) => error.response); + if (result) { + if (result.data) { + if (result.data.code === 200) { + this.getDataBroadcast(); + NotificationManager.success('Broadcast berhasil terkirimkan', 'Success!!'); + } else { + NotificationManager.error(`${result.data.message}`, 'Failed!!'); + } + } else { + NotificationManager.error(`${result.data.message}`, 'Failed!!'); + } + } else { + NotificationManager.error(`${result.data.message}`, 'Failed!!'); + } + } } @@ -300,7 +293,7 @@ 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 })) } } @@ -330,25 +323,25 @@ export default class index extends Component { let dateEnd = this.state.endDate; const formData = new FormData(); - formData.append("startDate", dateStart.format("YYYY-M-D")+" 00:00:00"); - formData.append("endDate", dateEnd.format("YYYY-M-D")+" 23:59:59"); + formData.append("startDate", dateStart.format("YYYY-M-D") + " 00:00:00"); + formData.append("endDate", dateEnd.format("YYYY-M-D") + " 23:59:59"); formData.append('field', this.state.searchDetailField); formData.append("start", start); formData.append("length", "all"); - if(this.state.search!=="" && this.state.search!==null){ + if (this.state.search !== "" && this.state.search !== null) { formData.append('value', this.state.search); } const result = await axios - .post(url, formData) - .then(res => res) - .catch((error) => error.response); + .post(url, formData) + .then(res => res) + .catch((error) => error.response); if (result && result.data) { - if(result.data.code_status===200){ + if (result.data.code_status === 200) { this.setState({ dataExport: result.data.data }, () => { this.exportExcel(); }); - }else{ + } else { } } else { } @@ -378,19 +371,19 @@ export default class index extends Component { handleDetail = (data) => { console.log("ceh handle detail", data) - this.setState({ dataDetail:data },()=> { + this.setState({ dataDetail: data }, () => { this.showDetailDialog(); - this.setState({ openDialogDetail:true }); + this.setState({ openDialogDetail: true }); }); } toggleTooltip = (type) => { - if(type==="detail"){ - this.setState({ toltipDetail:!this.state.toltipDetail }) - }else if(type==="resend"){ - this.setState({ tooltipresend:!this.state.tooltipresend }) - }else if(type==="send"){ - this.setState({ tooltipsend:!this.state.tooltipsend }) + if (type === "detail") { + this.setState({ toltipDetail: !this.state.toltipDetail }) + } else if (type === "resend") { + this.setState({ tooltipresend: !this.state.tooltipresend }) + } else if (type === "send") { + this.setState({ tooltipsend: !this.state.tooltipsend }) } } @@ -417,6 +410,15 @@ export default class index extends Component { } renderTable = () => { + const column = [ + { name: this.props.t('action') }, + { name: this.props.t('title') }, + { name: this.props.t('message') }, + { name: this.props.t('description') }, + { name: "Status" }, + { name: this.props.t('date') }, + ] + const t = this.props const dataTable2 = this.state.dataTable || []; return ( @@ -425,10 +427,10 @@ export default class index extends Component { - {n.status_send === 'completed' || n.status_send === 'failed' || n.status_send === 'send' ? - this.renderBtnResend(n.id) : - this.renderBtnSend(n.id) - } + {n.status_send === 'completed' || n.status_send === 'failed' || n.status_send === 'send' ? + this.renderBtnResend(n.id) : + this.renderBtnSend(n.id) + } this.handleDetail(n)}> this.toggleTooltip("detail")}> @@ -446,7 +448,7 @@ export default class index extends Component { ) }) : - Data Tidak Tersedia + {this.props.t('noData')} } @@ -458,46 +460,55 @@ export default class index extends Component { } handleCloseDetail = () => { - this.setState({ openDialogDetail:false }) + this.setState({ openDialogDetail: false }) } toggleDialogDetail = () => { - this.setState({ openDialogDetail:!this.state.openDialogDetail }) + this.setState({ openDialogDetail: !this.state.openDialogDetail }) } 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{ - 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, splitButtonOpen, openDialog, currentPage, rowsPerPage, totalPage, search, tooltipEdit, tooltipDelete, statusSend } = this.state + const column = [ + { name: this.props.t('action') }, + { name: this.props.t('title') }, + { name: this.props.t('message') }, + { name: this.props.t('description') }, + { name: "Status" }, + { name: this.props.t('date') }, + ] + const t = this.props; + const { tooltipTambah, tooltipExport, dataTable, splitButtonOpen, openDialog, currentPage, rowsPerPage, totalPage, search, tooltipEdit, tooltipDelete, statusSend } = this.state return (
    @@ -507,7 +518,7 @@ export default class index extends Component { showCancel confirmBtnText="Yes!" confirmBtnBsStyle="danger" - title="Are your sure?" + title={this.props.t('deleteConfirm')} onConfirm={this.onConfirmBroadcast} onCancel={() => this.setState({ alertBroadcast: false })} focusCancelBtn @@ -537,63 +548,63 @@ export default class index extends Component { - - this.toggle("tambah")}> - Tambah Broadcast - - this.toggle("export")}> - Export Excel - + + this.toggle("tambah")}> + {this.props.t('broadcastAdd')} + + this.toggle("export")}> + {this.props.t('exprotExcel')} + -
    -
    -
    - this.handleChangeDay(e)} defaultValue={this.state.currentDay}> - - - - -
    -
    - {' '} - -
    +
    +
    +
    + this.handleChangeDay(e)} defaultValue={this.state.currentDay}> + + + + +
    +
    + {' '} +
    - - - - - - this.setState({ - searchDetail: "Judul", - searchDetailField: "title_notif" - })}>Judul - this.setState({ - searchDetail: "Deskripsi", - searchDetailField: "description" - })}>Deskripsi - this.setState({ - searchDetail: "Pesan", - searchDetailField: "message_notif" - })}>Pesan - this.setState({ - searchDetail: "Status", - searchDetailField: "status_send" - })}>Status - - -
    + + + + + + this.setState({ + searchDetail: this.props.t('title'), + searchDetailField: "title_notif" + })}>Judul + this.setState({ + searchDetail: this.props.t('description'), + searchDetailField: "description" + })}>Deskripsi + this.setState({ + searchDetail: this.props.t('message'), + searchDetailField: "message_notif" + })}>Pesan + this.setState({ + searchDetail: "Status", + searchDetailField: "status_send" + })}>Status + + + +
    @@ -621,3 +632,4 @@ export default class index extends Component { ) } } +export default withTranslation()(index); \ No newline at end of file diff --git a/src/views/Master/MasterRoles/index.js b/src/views/Master/MasterRoles/index.js index a32ba37..36828aa 100644 --- a/src/views/Master/MasterRoles/index.js +++ b/src/views/Master/MasterRoles/index.js @@ -89,6 +89,9 @@ class index extends Component { async componentDidUpdate(prevProps, prevState) { const { search } = this.state if (search !== prevState.search) this.getDataRoles() + if (prevProps.dataExport !== this.props.dataExport && this.props.dataExport.length > 0) { + this.handleExportExcel(); + } } handleSearch = e => { @@ -324,16 +327,20 @@ class index extends Component { handleExportExcel = async () => { let start = 0; let end = "ALL"; - let url = BASE_URL + "roles.php?act=get_data"; - const formData = new FormData(); - formData.append('field', 'name'); - if (this.state.search !== "") { - formData.append('value', this.state.search); + const formData = { + "paging": { "start": start, "length": this.state.rowsPerPage }, + "columns": [ + { "name": "name", "logic_operator": "ilike", "value": this.state.search, "operator": "AND" } + ], + "joins": [], + "orders": { "columns": ["id"], "ascending": false } } + const result = await axios - .post(url, formData) + .post(ROLE_SEARCH, formData, config) .then(res => res) .catch((error) => error.response); + if (result && result.data && result.statusText == "OK") { const dataRes = result.data.data || []; const dataExport = []; diff --git a/src/views/Report/k3/index.js b/src/views/Report/k3/index.js index 7b89480..ec0f2ab 100644 --- a/src/views/Report/k3/index.js +++ b/src/views/Report/k3/index.js @@ -129,13 +129,6 @@ class index extends Component { } } - - - - - - - getDataLaporanK3 = async () => { let start = 0; @@ -450,11 +443,11 @@ class index extends Component { - + ) }) : - + } diff --git a/src/views/SimproV2/PanicButton/index.js b/src/views/SimproV2/PanicButton/index.js index 51b23e0..91c7582 100644 --- a/src/views/SimproV2/PanicButton/index.js +++ b/src/views/SimproV2/PanicButton/index.js @@ -11,6 +11,7 @@ import { DatePicker } from 'antd'; import { NotificationContainer, NotificationManager } from 'react-notifications'; import { PANIC_BUTTON_UPDATE, PANIC_BUTTON_SEARCH } from '../../../const/ApiConst'; import { Pagination, Tooltip } from 'antd'; +import { withTranslation } from 'react-i18next'; const id_org = window.localStorage.getItem('id_org'); const roleName = window.localStorage.getItem('role_name'); @@ -19,8 +20,8 @@ const token = window.localStorage.getItem('token'); const config = { headers: { - Authorization : `Bearer ${token}`, - "Content-type" : `application/json` + Authorization: `Bearer ${token}`, + "Content-type": `application/json` } }; @@ -28,16 +29,11 @@ const { RangePicker } = DatePicker; const momentFormat = 'HH:mm'; -const column = [ - { name: "Action" }, - { name: "Date" }, - { name: "Employee Name " }, - { name: "Status Response" }, -] + const LENGTH_DATA = 10 -export default class index extends Component { +class index extends Component { constructor(props) { super(props) this.state = { @@ -48,18 +44,18 @@ export default class index extends Component { dataExport: [], dataGs: [], dataIdHo: [], - dataMap:"", + dataMap: "", dataTable: [], - endDate:moment(moment().format("YYYY-M-D")), + endDate: moment(moment().format("YYYY-M-D")), idDelete: 0, openDialog: false, - openDialogEdit:false, + openDialogEdit: false, page: 0, rowsPerPage: LENGTH_DATA, search: "", - startDate:moment(moment().format("YYYY-M-D")), + startDate: moment(moment().format("YYYY-M-D")), tooltipDelete: false, - tooltipExport:false, + tooltipExport: false, tooltipMap: false, totalPage: 0, typeClock: "All", @@ -72,7 +68,7 @@ export default class index extends Component { } async componentDidUpdate(prevProps, prevState) { - const { search,startDate } = this.state + const { search, startDate } = this.state if (search !== prevState.search) this.getDataPanicButton() if (startDate !== prevState.startDate) this.getDataPanicButton() } @@ -88,39 +84,39 @@ export default class index extends Component { start = (this.state.currentPage * this.state.rowsPerPage) - this.state.rowsPerPage } - 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 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":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 } } @@ -128,9 +124,9 @@ export default class index extends Component { .post(PANIC_BUTTON_SEARCH, payload, config) .then(res => res) .catch((error) => error.response); - if(result && result.data){ + if (result && result.data) { if (result && result.data && result.data.code == 200) { - this.setState({ dataTable: result.data.data, totalPage: result.data.totalRecord,dataExport:result.data.data_export }); + this.setState({ dataTable: result.data.data, totalPage: result.data.totalRecord, dataExport: result.data.data_export }); } else { NotificationManager.error('Gagal Menerima Data!!', 'Failed'); } @@ -138,10 +134,10 @@ export default class index extends Component { } handleOpenDialog = (type) => { - if(type==="Map"){ + if (type === "Map") { this.setState({ openDialog: true }) this.showChildDialog(); - }else{ + } else { this.setState({ openDialogEdit: true }) this.showDialogEdit(); } @@ -153,7 +149,7 @@ export default class index extends Component { } handleCloseDialogEdit = (type, data) => { - if(type==="save"){ + if (type === "save") { this.updateStatusResponse(data); } this.setState({ openDialogEdit: false }) @@ -164,7 +160,7 @@ export default class index extends Component { } toggleEditDialog = () => { - this.setState({ openDialogEdit:!this.state.openDialogEdit }); + this.setState({ openDialogEdit: !this.state.openDialogEdit }); } handleMap = data => { @@ -173,7 +169,7 @@ export default class index extends Component { } handleEdit = data => { - this.setState({ dataEdit:data }); + this.setState({ dataEdit: data }); this.handleOpenDialog('Edit'); } @@ -196,7 +192,7 @@ export default class index extends Component { toggle = (param) => { if (param === "map") { this.setState(prevState => ({ tooltipMap: !prevState.tooltipMap })) - }else if(param==="edit"){ + } else if (param === "edit") { this.setState(prevState => ({ tooltipEdit: !prevState.tooltipEdit })) } else if (param === "delete") { this.setState(prevState => ({ tooltipDelete: !prevState.tooltipDelete })) @@ -206,13 +202,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.getDataPanicButton(); }) } handleTipe = (e) => { - this.setState({ typeClock:e.target.value }, () => { + this.setState({ typeClock: e.target.value }, () => { this.getDataPanicButton(); }); } @@ -221,27 +217,27 @@ export default class index extends Component { const dataExcel = this.state.dataTable || []; const fileName = "Panic Button.xlsx"; let dataExport = []; - dataExcel.map((val)=>{ + dataExcel.map((val) => { let row = { "Tanggal": moment(val.created_date).format("DD-MM-YYYY HH:MM:SS"), - "Nama Karyawan" : val.employee_name, - "Latitude" : val.lan, - "Longitude" : val.lon, - "Status" : val.status_response + "Nama Karyawan": val.join_first_name, + "Latitude": val.lat, + "Longitude": val.lon, + "Status": val.status_response } dataExport.push(row); }) const ws = XLSX.utils.json_to_sheet(dataExport); - const wb = XLSX.utils.book_new(); - XLSX.utils.book_append_sheet(wb, ws, 'Panic Button'); + const wb = XLSX.utils.book_new(); + XLSX.utils.book_append_sheet(wb, ws, 'Panic Button'); - XLSX.writeFile(wb, fileName); + XLSX.writeFile(wb, fileName); } updateStatusResponse = async (data) => { let url = PANIC_BUTTON_UPDATE(data.id); let payload = { - "user_id" : data.user_id, + "user_id": data.user_id, "lat": data.lat, "lon": data.lon, "status_response": data.status_response, @@ -253,7 +249,7 @@ export default class index extends Component { .put(url, payload, config) .then(res => res) .catch((error) => error.response); - if(result && result.data){ + if (result && result.data) { if (result.data.code == 200) { this.getDataPanicButton() NotificationManager.success('Berhasil update status response!!', 'Success!'); @@ -264,65 +260,73 @@ export default class index extends Component { } 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 ( + + + + + + + ) + }) : + + + } + ) } 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 }) } } render() { - const { tooltipExport,dataTable, openDialogEdit, openDialog, currentPage, rowsPerPage, totalPage, search, tooltipMap, tooltipDelete } = this.state + const column = [ + { name: this.props.t('action') }, + { name: this.props.t('date') }, + { name: this.props.t('nameHR') }, + { name: this.props.t('statusResponse') }, + ] + const t = this.props; + const { tooltipExport, dataTable, openDialogEdit, openDialog, currentPage, rowsPerPage, totalPage, search, tooltipMap, tooltipDelete } = this.state return (
    @@ -342,29 +346,29 @@ export default class index extends Component { /> -

    Panic Button

    +

    {this.props.t('panicButton')}

    - - - + + +
    -
    -
    -
    - this.handleChangeDay(e)} defaultValue={this.state.currentDay}> - - - - -
    -
    - {' '} - -
    +
    +
    +
    + this.handleChangeDay(e)} defaultValue={this.state.currentDay}> + + + + +
    +
    + {' '} +
    +
    {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'> : ""} {n.image ? this.lihatFoto(n.image)} className='fa fa-image'> : ""}
    No Data Available{this.props.t('noData')}
    - - this.handleEdit(n)}> - - - this.handleMap(n)}> - - { n.created_date!==null ? moment(n.created_at).format("DD-MM-YYYY HH:mm:ss") : "-" }{ n.join_first_name !==null ? n.join_first_name : "-" }{ n.status_response!==null ? n.status_response : "-" }
    No Data Available
    + + this.handleEdit(n)}> + + + this.handleMap(n)}> + + {n.created_date !== null ? moment(n.created_at).format("DD-MM-YYYY HH:mm:ss") : "-"}{n.join_first_name !== null ? n.join_first_name : "-"}{n.status_response !== null ? n.status_response : "-"}
    No Data Available
    @@ -375,7 +379,7 @@ export default class index extends Component { })} - { this.renderTable() } + {this.renderTable()}
    { } ], "orders": { - "ascending": true, + "ascending": false, "columns": [ 'id' ] @@ -361,10 +360,6 @@ const ProjectType = ({ params }) => {

    {pageName}

    - - - - diff --git a/src/views/SimproV2/ResourceMaterial/DialogForm.js b/src/views/SimproV2/ResourceMaterial/DialogForm.js index 2957798..4c9c5e9 100644 --- a/src/views/SimproV2/ResourceMaterial/DialogForm.js +++ b/src/views/SimproV2/ResourceMaterial/DialogForm.js @@ -7,6 +7,7 @@ import { DatePicker, Tooltip, Select } from 'antd'; import { formatRupiah, formatNumber } from '../../../const/CustomFunc' import moment from 'moment'; import 'antd/dist/antd.css'; +import { useTranslation } from 'react-i18next'; const { Option } = Select const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdit, dataUom }) => { @@ -26,7 +27,7 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi const [poDate, setPoDate] = useState(null) const [receivedDate, setReceivedDate] = useState(null) const [deliveryDate, setDeliveryDate] = useState(null) - + const { t } = useTranslation() @@ -173,22 +174,21 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - - setMaterialName(e.target.value)} placeholder={`Input material name...`} /> + + setMaterialName(e.target.value)} placeholder={t('inputName')} /> - - setQty(e.target.value)} placeholder={`Input qty...`} /> + + setQty(e.target.value)} placeholder={t('inputQty')} /> - - + @@ -201,8 +201,8 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - - setUnitPrice(formatNumber(e.target.value))} placeholder={`Unit Price...`} /> + + setUnitPrice(formatNumber(e.target.value))} placeholder={t('inputUnitPrice')} /> @@ -215,8 +215,8 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - - setDescription(e.target.value)} placeholder={`Description ...`} /> + + setDescription(e.target.value)} placeholder={t('inputDescription')} /> @@ -243,21 +243,21 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - - setPriceReq(formatNumber(e.target.value))} placeholder={`Input Price ...`} /> + + setPriceReq(formatNumber(e.target.value))} placeholder={t('inputPrice')} /> - - setDescription(e.target.value)} placeholder={`Description ...`} /> + + setDescription(e.target.value)} placeholder={t('inputDescription')} /> - + setRequiredDate(date)} /> @@ -265,13 +265,13 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - + setQty(e.target.value)} placeholder={`Input QTY...`} disabled /> - + setUom(e.target.value)} placeholder={`Input UOM...`} disabled /> @@ -279,13 +279,13 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - - setQtyReceived(e.target.value)} placeholder={`Input QTY Received...`} /> + + setQtyReceived(e.target.value)} placeholder={t('inputQtyReceived')} /> - + setFomDate(date)} /> @@ -293,13 +293,13 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - + setPrDate(date)} /> - + setPoDate(date)} /> @@ -307,13 +307,13 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - + setReceivedDate(date)} /> - + setDeliveryDate(date)} /> @@ -339,8 +339,8 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - - setDescription(e.target.value)} placeholder={`Description ...`} /> + + setDescription(e.target.value)} placeholder={t('inputDescription')} /> @@ -353,13 +353,13 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - + setQty(e.target.value)} placeholder={`Input QTY...`} disabled /> - + setUom(e.target.value)} placeholder={`Input UOM...`} disabled /> @@ -367,13 +367,13 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - + setQtyReceived(e.target.value)} placeholder={`Input QTY Received...`} /> - + setFomDate(date)} /> @@ -381,13 +381,13 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - + setPrDate(date)} /> - + setPoDate(date)} /> @@ -395,13 +395,13 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - + setReceivedDate(date)} /> - + setDeliveryDate(date)} /> @@ -421,7 +421,7 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi {' '} - + diff --git a/src/views/SimproV2/ResourceMaterial/index.js b/src/views/SimproV2/ResourceMaterial/index.js index e566aa5..a00bf8a 100644 --- a/src/views/SimproV2/ResourceMaterial/index.js +++ b/src/views/SimproV2/ResourceMaterial/index.js @@ -16,6 +16,7 @@ import { REQUEST_MATERIAL_SEARCH, REQUEST_MATERIAL_EDIT, REQUEST_MATERIAL_UPDATE_WAREHOUSE_SITE, SATUAN_SEARCH } from '../../../const/ApiConst'; +import { useTranslation } from 'react-i18next'; const { TabPane } = Tabs; const { Panel } = Collapse; @@ -60,7 +61,7 @@ const Resource = ({ params }) => { const [totalPage, setTotalPage] = useState(0) const [typeDialog, setTypeDialog] = useState('Save') const pageName = params.name; - + const { t } = useTranslation() useEffect(() => { getDataReqMaterial() getDataSatuan() @@ -514,23 +515,23 @@ const Resource = ({ params }) => { const RenderTable = useMemo(() => { const columns = [ { - title: 'Action', + title: t('action'), dataIndex: '', key: 'x', className: 'nowrap', render: (text, record) => <> - - + + - + , }, - { title: 'Material Name', dataIndex: 'name', key: 'name' }, - { title: 'QTY', dataIndex: 'qty', key: 'qty' }, - { title: 'UOM', dataIndex: 'uom', key: 'uom' }, - { title: 'Description', dataIndex: 'description', key: 'description' }, + { title: t('name'), dataIndex: 'name', key: 'name' }, + { title: t('qty'), dataIndex: 'qty', key: 'qty' }, + { title: t('uom'), dataIndex: 'uom', key: 'uom' }, + { title: t('description'), dataIndex: 'description', key: 'description' }, { title: 'Status', dataIndex: 'status', key: 'status' } ]; @@ -547,31 +548,31 @@ const Resource = ({ params }) => { const RenderRequestMaterialTable = useMemo(() => { const columns = [ { - title: 'Action', + title: t('action'), dataIndex: '', key: 'id', className: "nowrap", render: (text, record) => <> - - + + {" "} - + , }, { title: 'Status', dataIndex: 'status', key: 'status', render: (text, record) => renderLabelStatus(text) }, - { title: 'Description', dataIndex: 'description', key: 'description' }, - { title: 'Required Date', dataIndex: 'required_date', key: 'required_date', className: "nowrap", render: (text, record) => (
    {moment(text).format("D-M-YYYY")}
    ) }, - { title: 'QTY', dataIndex: 'qty', key: 'qty', render: (text, record) => (
    {text ? text : "-"}
    ) }, - { title: 'UOM', dataIndex: 'uom', key: 'uom', render: (text, record) => (
    {text ? text : "-"}
    ) }, - { title: 'QTY Received', dataIndex: 'qty_received', key: 'qty_received', className: "nowrap", render: (text, record) => (
    {text ? text : "-"}
    ) }, - { title: 'Unit Price', dataIndex: 'price', key: 'price', render: (text, record) => { return renderFormatNumber(text, "Rp") } }, - { title: 'FOM Date', dataIndex: 'fom_date', key: 'fom_date', render: (text, record) => (
    {moment(text).format("D-M-YYYY")}
    ) }, - { title: 'PR Date', dataIndex: 'pr_date', key: 'pr_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, - { title: 'PO Date', dataIndex: 'po_date', key: 'po_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, - { title: 'Received Date', dataIndex: 'received_date', key: 'received_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, - { title: 'Delivery Date', dataIndex: 'delivery_date', key: 'delivery_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, + { title: t('description'), dataIndex: 'description', key: 'description' }, + { title: t('dateRequired'), dataIndex: 'required_date', key: 'required_date', className: "nowrap", render: (text, record) => (
    {moment(text).format("D-M-YYYY")}
    ) }, + { title: t('qty'), dataIndex: 'qty', key: 'qty', render: (text, record) => (
    {text ? text : "-"}
    ) }, + { title: t('uom'), dataIndex: 'uom', key: 'uom', render: (text, record) => (
    {text ? text : "-"}
    ) }, + { title: t('qtyReceived'), dataIndex: 'qty_received', key: 'qty_received', className: "nowrap", render: (text, record) => (
    {text ? text : "-"}
    ) }, + { title: t('unitPrice'), dataIndex: 'price', key: 'price', render: (text, record) => { return renderFormatNumber(text, "Rp") } }, + { title: t('dateFOM'), dataIndex: 'fom_date', key: 'fom_date', render: (text, record) => (
    {moment(text).format("D-M-YYYY")}
    ) }, + { title: t('datePR'), dataIndex: 'pr_date', key: 'pr_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, + { title: t('datePO'), dataIndex: 'po_date', key: 'po_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, + { title: t('dateReceived'), dataIndex: 'received_date', key: 'received_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, + { title: t('dateDelivery'), dataIndex: 'delivery_date', key: 'delivery_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, ]; let componentGroup = []; @@ -599,32 +600,32 @@ const Resource = ({ params }) => { const RenderMaterialDeliveryTable = useMemo(() => { const columns = [ { - title: 'Action', + title: t('action'), dataIndex: '', key: 'id', className: "nowrap", render: (text, record) => <> {text.status == "receipt to warehouse" ? <> - - - {" "} + + + {" "} : "-"} , }, { title: 'Status', dataIndex: 'status', key: 'status' }, - { title: 'Description', dataIndex: 'description', key: 'description' }, - { title: 'Required Date', dataIndex: 'required_date', key: 'required_date', className: "nowrap", render: (text, record) => (
    {moment(text).format("D-M-YYYY")}
    ) }, - { title: 'QTY', dataIndex: 'qty', key: 'qty', render: (text, record) => (
    {text ? text : "-"}
    ) }, - { title: 'UOM', dataIndex: 'uom', key: 'uom', render: (text, record) => (
    {text ? text : "-"}
    ) }, - { title: 'QTY Received', dataIndex: 'qty_received', key: 'qty_received', className: "nowrap", render: (text, record) => (
    {text ? text : "-"}
    ) }, - { title: 'FOM Date', dataIndex: 'fom_date', key: 'fom_date', render: (text, record) => (
    {moment(text).format("D-M-YYYY")}
    ) }, - { title: 'PR Date', dataIndex: 'pr_date', key: 'pr_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, - { title: 'PO Date', dataIndex: 'po_date', key: 'po_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, - { title: 'Received Date', dataIndex: 'received_date', key: 'received_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, - { title: 'Delivery Date', dataIndex: 'delivery_date', key: 'delivery_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, + { title: t('description'), dataIndex: 'description', key: 'description' }, + { title: t('dateRequired'), dataIndex: 'required_date', key: 'required_date', className: "nowrap", render: (text, record) => (
    {moment(text).format("D-M-YYYY")}
    ) }, + { title: t('qty'), dataIndex: 'qty', key: 'qty', render: (text, record) => (
    {text ? text : "-"}
    ) }, + { title: t('uom'), dataIndex: 'uom', key: 'uom', render: (text, record) => (
    {text ? text : "-"}
    ) }, + { title: t('qtyReceived'), dataIndex: 'qty_received', key: 'qty_received', className: "nowrap", render: (text, record) => (
    {text ? text : "-"}
    ) }, + { title: t('dateFOM'), dataIndex: 'fom_date', key: 'fom_date', render: (text, record) => (
    {moment(text).format("D-M-YYYY")}
    ) }, + { title: t('datePR'), dataIndex: 'pr_date', key: 'pr_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, + { title: t('datePO'), dataIndex: 'po_date', key: 'po_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, + { title: t('dateReceived'), dataIndex: 'received_date', key: 'received_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, + { title: t('dateDelivery'), dataIndex: 'delivery_date', key: 'delivery_date', className: "nowrap", render: (text, record) => (
    {text ? moment(text).format("D-M-YYYY") : "-"}
    ) }, ]; let componentGroup = []; @@ -655,13 +656,13 @@ const Resource = ({ params }) => {

    {pageName}

    - + - + - + @@ -688,13 +689,13 @@ const Resource = ({ params }) => { return ( -

    Material Request

    +

    {t('materialRequest')}

    - + - + @@ -713,7 +714,7 @@ const Resource = ({ params }) => { return ( -

    Material Delivery to Site

    +

    {t('materialDelivery')}

    @@ -743,12 +744,12 @@ const Resource = ({ params }) => { showCancel confirmBtnText="Delete" confirmBtnBsStyle="danger" - title={`Are you sure?`} + title={t('deleteConfirm')} onConfirm={onConfirmDelete} onCancel={() => cancelDelete()} focusCancelBtn > - Delete this data + {t('deleteMsg')} { dataUom={dataSatuan} /> - + {CardMasterMaterial} - + {CardMaterialRequest} - + {CardMaterialDelivery} diff --git a/src/views/SimproV2/ResourceTools/DialogEditReqTools.js b/src/views/SimproV2/ResourceTools/DialogEditReqTools.js index e77fb14..8284935 100644 --- a/src/views/SimproV2/ResourceTools/DialogEditReqTools.js +++ b/src/views/SimproV2/ResourceTools/DialogEditReqTools.js @@ -8,6 +8,7 @@ import { AXIOS, REQUEST_TOOLS_EDIT, BASE_SIMPRO, TYPE_PROYEK, USER_LIST, USERPRO import axios from "../../../const/interceptorApi" import { NotificationContainer, NotificationManager } from 'react-notifications'; import _, { initial } from 'underscore' +import { useTranslation } from 'react-i18next'; const { Option } = Select @@ -40,7 +41,7 @@ const DialogTools = ({ openDialog, closeDialog, toggleDialog, idTask, handleClos const [description, setDescription] = useState(""); const [ownershipStatus, setOwnershipStatus] = useState("") const [ownershipName, setOwnershipName] = useState("") - + const { t } = useTranslation() const handleClearData = () => { setStatus("") @@ -131,13 +132,13 @@ const DialogTools = ({ openDialog, closeDialog, toggleDialog, idTask, handleClos - + setAssetType(e.target.value)} placeholder={`Input Asset Type...`} /> - + setAssetName(e.target.value)} placeholder={`Input Asset Name...`} /> @@ -145,19 +146,19 @@ const DialogTools = ({ openDialog, closeDialog, toggleDialog, idTask, handleClos - - setQty(e.target.value)} placeholder={`Input QTY...`} /> + + setQty(e.target.value)} placeholder={t('inputQty')} /> - - setQtyReceived(e.target.value)} placeholder={`Input QTY Received...`} /> + + setQtyReceived(e.target.value)} placeholder={t('inputQtyReceived')} /> - + setUom(e.target.value)} placeholder={`Input UOM...`} /> @@ -165,24 +166,24 @@ const DialogTools = ({ openDialog, closeDialog, toggleDialog, idTask, handleClos - + - - setDescription(e.target.value)} placeholder={`Input Description...`} /> + + setDescription(e.target.value)} placeholder={t('inputDescription')} /> - - setOwnershipStatus(val)} placeholder={t('selectOwnershipStatus')} style={{ width: '100%' }}> + + @@ -190,7 +191,7 @@ const DialogTools = ({ openDialog, closeDialog, toggleDialog, idTask, handleClos ownershipStatus === 'rent' ? - + setOwnershipName(e.target.value)} placeholder={`Input Ownership Name...`} /> @@ -206,13 +207,13 @@ const DialogTools = ({ openDialog, closeDialog, toggleDialog, idTask, handleClos return ( <> - Add Tools + {`${t('edit')} ${t('toolsRequest')}`} {renderForm()} - {' '} - + {' '} + diff --git a/src/views/SimproV2/ResourceTools/DialogForm.js b/src/views/SimproV2/ResourceTools/DialogForm.js index 6425f77..225d0ed 100644 --- a/src/views/SimproV2/ResourceTools/DialogForm.js +++ b/src/views/SimproV2/ResourceTools/DialogForm.js @@ -3,12 +3,8 @@ import { Modal, ModalHeader, ModalBody, ModalFooter, Button, Form, FormGroup, Label, Input, Col, Row } from 'reactstrap'; -import { DatePicker, Tooltip, Select, Input as InputAntd } from 'antd'; -import moment from 'moment'; import 'antd/dist/antd.css'; -import { formatRupiah, formatNumber } from '../../../const/CustomFunc' -import { ROLE_SEARCH } from '../../../const/ApiConst' -const { Option } = Select +import { useTranslation } from 'react-i18next'; const token = window.localStorage.getItem('token'); const config = { @@ -26,7 +22,7 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi const [qty, setQty] = useState('') const [assetType, setAssetType] = useState('') const [description, setDescription] = useState('') - + const { t } = useTranslation() useEffect(() => { if (typeDialog === "Edit") { setId(dataEdit.id) @@ -88,36 +84,36 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi - - setName(e.target.value)} placeholder={`Name...`} /> + + setName(e.target.value)} placeholder={t('inputName')} /> - - setAssetType(e.target.value)} placeholder={`Asset Type...`} /> + + setAssetType(e.target.value)} placeholder={t('inputAsset')} /> - - setUom(e.target.value)} placeholder={`UOM...`} /> + + setUom(e.target.value)} placeholder={t('inputUOM')} /> - - setQty(e.target.value)} placeholder={`QTY...`} /> + + setQty(e.target.value)} placeholder={t('inputQTY')} /> - - setDescription(e.target.value)} placeholder={`Description...`} /> + + setDescription(e.target.value)} placeholder={t('inputDescription')} /> @@ -129,13 +125,13 @@ const DialogForm = ({ openDialog, closeDialog, toggleDialog, typeDialog, dataEdi return ( <> - {typeDialog == "Save" ? `Add` : "Edit"} Tools Resource + {typeDialog == "Save" ? `Add` : "Edit"} {t('toolsResource')} {renderForm()} {' '} - + diff --git a/src/views/SimproV2/ResourceTools/index.js b/src/views/SimproV2/ResourceTools/index.js index d38cf68..6003a5c 100644 --- a/src/views/SimproV2/ResourceTools/index.js +++ b/src/views/SimproV2/ResourceTools/index.js @@ -5,15 +5,14 @@ import React, { useState, useEffect, useMemo } from 'react'; import SweetAlert from 'react-bootstrap-sweetalert'; import _, { initial } from 'underscore' import axios from "../../../const/interceptorApi" -import moment from 'moment' import { Card, CardBody, CardHeader, Col, Row, Input } from 'reactstrap'; -import { DownloadOutlined } from '@ant-design/icons'; import { NotificationContainer, NotificationManager } from 'react-notifications'; import { Pagination, Table, Button, Tooltip, Tabs, Collapse } from 'antd'; import { renderLabelStatus } from '../../../const/CustomFunc'; import { TOOLS_RESOURCE_ADD, TOOLS_RESOURCE_SEARCH, REQUEST_TOOLS_SEARCH, TOOLS_RESOURCE_EDIT, TOOLS_RESOURCE_DELETE } from '../../../const/ApiConst'; +import { useTranslation } from 'react-i18next'; const { TabPane } = Tabs; const { Panel } = Collapse; @@ -61,6 +60,7 @@ const ResourceWorker = ({ params }) => { const [totalPage, setTotalPage] = useState(0) const [typeDialog, setTypeDialog] = useState('Save') const pageName = params.name; + const { t } = useTranslation(); useEffect(() => { getDataReqTools() @@ -508,24 +508,24 @@ const ResourceWorker = ({ params }) => { const RenderTable = useMemo(() => { const columns = [ { - title: 'Action', + title: t('action'), dataIndex: '', key: 'x', className: 'nowrap', render: (text, record) => <> - - + + - + , }, - { title: 'Name', dataIndex: 'name', key: 'name' }, - { title: 'Asset Type', dataIndex: 'asset_type', key: 'asset_type' }, - { title: 'UOM', dataIndex: 'uom', key: 'uom' }, - { title: 'QTY', dataIndex: 'qty', key: 'qty' }, - { title: 'Description', dataIndex: 'description', key: 'description' }, + { title: t('name'), dataIndex: 'name', key: 'name' }, + { title: t('assetType'), dataIndex: 'asset_type', key: 'asset_type' }, + { title: t('uom'), dataIndex: 'uom', key: 'uom' }, + { title: t('qty'), dataIndex: 'qty', key: 'qty' }, + { title: t('description'), dataIndex: 'description', key: 'description' }, ]; return ( {

    {pageName}

    - + - + - + @@ -588,32 +588,32 @@ const ResourceWorker = ({ params }) => { let columns = [ { - title: 'Action', + title: t('action'), dataIndex: '', key: 'x', render: (text, record) => <> {type == "delivery" ? "-" : ( - <> - + <> + - + )} , }, { title: 'Status', dataIndex: 'status', key: 'status', render: (text, record) => renderLabelStatus(text) }, - { title: 'Name', dataIndex: 'asset_name', key: 'asset_name' }, - { title: 'Asset Type', dataIndex: 'asset_type', key: 'asset_type' }, - { title: 'UOM', dataIndex: 'uom', key: 'uom' }, - { title: 'QTY', dataIndex: 'qty', key: 'qty' }, + { title: t('name'), dataIndex: 'asset_name', key: 'asset_name' }, + { title: t('assetType'), dataIndex: 'asset_type', key: 'asset_type' }, + { title: t('uom'), dataIndex: 'uom', key: 'uom' }, + { title: t('qty'), dataIndex: 'qty', key: 'qty' }, ]; if (type === 'request') { - columns.push({ title: 'QTY Received', dataIndex: 'qty_received', key: 'qty_received' }); + columns.push({ title: t('qtyReceived'), dataIndex: 'qty_received', key: 'qty_received' }); } - columns.push({ title: 'Ownership Status', dataIndex: 'ownership_status', key: 'ownership_status' }); - columns.push({ title: 'Ownership Name', dataIndex: 'ownership_name', key: 'ownership_name' }); + columns.push({ title: t('ownershipStatus'), dataIndex: 'ownership_status', key: 'ownership_status' }); + columns.push({ title: t('ownershipName'), dataIndex: 'ownership_name', key: 'ownership_name' }); return (
    { const RenderToolsRequest = () => -

    Tools Request

    +

    {t('toolsRequest')}

    - + - + @@ -651,20 +651,20 @@ const ResourceWorker = ({ params }) => { })} : -
    No data available
    +
    {t('noData')}
    } const RenderToolsDeliver = () => -

    Tools Delivery

    +

    {t('toolsDelivery')}

    - + - + @@ -682,7 +682,7 @@ const ResourceWorker = ({ params }) => { })} : -
    No data available
    +
    {t('noData')}
    } @@ -707,12 +707,12 @@ const ResourceWorker = ({ params }) => { showCancel confirmBtnText="Delete" confirmBtnBsStyle="danger" - title={`Are you sure?`} + title={t('deleteConfirm')} onConfirm={onConfirmDelete} onCancel={() => cancelDelete()} focusCancelBtn > - Delete this data + {t('deleteMsg')} { {RenderDialogFormTools} - + {RenderToolsResource()} - + {RenderToolsRequest()} - + {RenderToolsDeliver()} diff --git a/src/views/SimproV2/ResourceWorker/index.js b/src/views/SimproV2/ResourceWorker/index.js index b311491..b7a4e35 100644 --- a/src/views/SimproV2/ResourceWorker/index.js +++ b/src/views/SimproV2/ResourceWorker/index.js @@ -12,7 +12,7 @@ import { Pagination, Table, Button, Tooltip } from 'antd'; import { PROYEK_SEARCH, USER_ADD, USER_SEARCH, USER_EDIT, USER_DELETE, ROLE_SEARCH, DIVISI_SEARCH, USER_SHIFT_ADD } from '../../../const/ApiConst'; - +import { useTranslation } from 'react-i18next'; const url = ""; const proyek_id = localStorage.getItem('proyek_id'); const role_id = localStorage.getItem('role_id'); @@ -52,7 +52,7 @@ const ResourceWorker = ({ params }) => { const [typeDialog, setTypeDialog] = useState('Save') const [typeDialogShift, setTypeDialogShift] = useState('Save') const pageName = params.name; - + const { t } = useTranslation(); useEffect(() => { getRoleList() getDivisiList() @@ -468,15 +468,15 @@ const ResourceWorker = ({ params }) => { const RenderTable = useMemo(() => { const columns = [ { - title: 'Action', + title: t('action'), dataIndex: '', key: 'x', render: (text, record) => <> - + - + @@ -485,12 +485,12 @@ const ResourceWorker = ({ params }) => { , }, - { title: 'NIK (KTP/ ID Card)', dataIndex: 'ktp_number', key: 'ktp_number' }, - { title: 'Employee Name', dataIndex: 'name', key: 'name' }, - { title: 'Divisi', dataIndex: 'join_second_name', key: 'join_second_name' }, - { title: 'Employee Type', dataIndex: 'employee_type', key: 'employee_type' }, + { title: t('nik'), dataIndex: 'ktp_number', key: 'ktp_number' }, + { title: t('nameHR'), dataIndex: 'name', key: 'name' }, + { title: t('division'), dataIndex: 'join_second_name', key: 'join_second_name' }, + { title: t('employeeType'), dataIndex: 'employee_type', key: 'employee_type' }, { - title: 'Role', + title: t('roles'), dataIndex: 'join_first_name', key: 'join_first_name', render: (text, record) => <>{record.join_first_name} @@ -519,12 +519,12 @@ const ResourceWorker = ({ params }) => { showCancel confirmBtnText="Delete" confirmBtnBsStyle="danger" - title={`Are you sure?`} + title={t('deleteConfirm')} onConfirm={onConfirmDelete} onCancel={() => cancelDelete()} focusCancelBtn > - Delete this data + {t('deleteMsg')} {

    {pageName}

    - + - + - + diff --git a/src/views/SimproV2/Settings/DialogForm.js b/src/views/SimproV2/Settings/DialogForm.js new file mode 100644 index 0000000..33c57cc --- /dev/null +++ b/src/views/SimproV2/Settings/DialogForm.js @@ -0,0 +1,265 @@ +import React, { useEffect, useState } from 'react' +import { + Modal, ModalHeader, ModalBody, ModalFooter, + Button, Form, FormGroup, Label, Input, Col, Row, + Nav, NavItem, NavLink, TabContent, TabPane +} from 'reactstrap'; + +import { Select, DatePicker } from 'antd'; + +const { Option } = Select + + + +const DialogForm = ({ + openDialog, + closeDialog, + toggleDialog, + typeDialogProp, + roleList, + nameProp, + noHpProp, + idNumberProp, + genderProp, + birthdayPlaceProp, + birthdayDateProp, + addressProp, + emailProp, + userNameProp, +}) => { + const token = window.localStorage.getItem('token'); + const [typeDialog, setTypeDialog] = useState(typeDialogProp) + const [userName, setUserName] = useState(userNameProp) + const [name, setName] = useState(nameProp) + const [noHp, setNohp] = useState(noHpProp) + const [gender, setGender] = useState(genderProp) + const [address, setAddres] = useState(addressProp) + const [birthdayPlace, setBirthdayplace] = useState(birthdayPlaceProp) + const [birthdayDate, setBirthdaydate] = useState(birthdayDateProp) + const [idNumber, setIdnumber] = useState(idNumberProp) + const [email, setEmail] = useState(emailProp) + const [password, setPassword] = useState('') + const [oldPassword, setOldPassword] = useState('') + const [newPassword, setNewPassword] = useState('') + const [newPasswordConfirm, setNewPasswordConfirm] = useState('') + const [activeTab, setActiveTab] = useState('tab1') + + const handleSave = () => { + let data = ''; + if (typeDialog === "Personal") { + data = { + name: name, + phone_number: noHp, + gender: gender, + ktp_number: idNumber, + birth_place: birthdayPlace, + address: address, + }; + if (birthdayDate) { + data.birth_date = birthdayDate; + } + closeDialog('profile', data) + } else if (typeDialog === "Account") { + data = { + username: userName, + email: email, + password: newPassword, + } + closeDialog('profile', data) + } + } + + const handleCancel = () => { + closeDialog('cancel', 'none') + } + + const setupSelectRole = () => { + return ( + <> + {roleList.map((val, index) => { + return ( + + ) + })} + + ) + } + + + const renderForm = () => { + return ( +
    + +
    + + + setName(e.target.value)} /> + + + + + setIdnumber(e.target.value)} /> + + + + + setAddres(e.target.value)} /> + + + + + + + setNohp(e.target.value)} /> + + + + + setGender(e.target.value)}> + + + + + + + + + setBirthdayplace(e.target.value)} /> + + + + + setBirthdaydate(date)} /> + + + + + + ) + } + + const renderFormAccount = () => { + return ( + + + + + + setUserName(e.target.value)} /> + + + + + + setEmail(e.target.value)} /> + + + + + + setOldPassword(e.target.value)} /> + + + + + setNewPassword(e.target.value)} /> + + + + + setNewPasswordConfirm(e.target.value)} /> + + + + + ) + } + + const renderFormSetting = () => { + return ( + + + + + + setUserName(e.target.value)} /> + + + + + + setEmail(e.target.value)} /> + + + + + ) + } + + return ( + <> + + + Update {typeDialog == "Personal" ? `Personal` : "Account"} Data + + + + + + {renderForm()} + + + {renderFormAccount()} + + + {renderFormSetting()} + + + + + {' '} + + + + + ) + + + +} + +export default DialogForm; diff --git a/src/views/SimproV2/Settings/index.js b/src/views/SimproV2/Settings/index.js new file mode 100644 index 0000000..c18e4bb --- /dev/null +++ b/src/views/SimproV2/Settings/index.js @@ -0,0 +1,257 @@ +import * as XLSX from 'xlsx'; +import React, { useState, useEffect, useMemo } from 'react'; +import SweetAlert from 'react-bootstrap-sweetalert'; +import axios from "../../../const/interceptorApi" +import { Card, CardBody, CardHeader, Col, Row, Input, Table, Button } from 'reactstrap'; +import { NotificationContainer, NotificationManager } from 'react-notifications'; +import { Pagination, Tooltip } from 'antd'; +import { USER_EDIT, SATUAN_ADD, SATUAN_EDIT, SATUAN_DELETE, SATUAN_SEARCH } from '../../../const/ApiConst'; +import profile from '../../../assets/img/profile.png' +import DialogForm from './DialogForm' +import { ROLE_SEARCH, BASE_OSPRO } from '../../../const/ApiConst' + + + + +const Setting = ({ params }) => { + const token = localStorage.getItem("token") + const config = { + headers: { + "Content-Type": "application/json", + "Authorization": `Bearer ${token}` + } + } + + const pageName = params.name; + + + + + const [openDialog, setOpenDialog] = useState(false) + const [typeDialog, setTypeDialog] = useState('Personal') + const [id, setId] = useState(0) + const [roleList, setRoleList] = useState([]) + const [userProfile, setUserprofile] = useState(null) + const [userName, setUserName] = useState("") + const [name, setName] = useState('') + const [noHp, setNohp] = useState("") + const [gender, setGender] = useState("") + const [address, setAddres] = useState("") + const [birthdayPlace, setBirthdayplace] = useState("") + const [birthdayDate, setBirthdaydate] = useState("") + const [idNumber, setIdnumber] = useState("") + const [divisi, setDivisi] = useState("") + const [role, setRole] = useState("") + const [email, setEmail] = useState("") + const [employeeType, setEmployeeType] = useState("") + + + console.log('divisi', divisi) + console.log('divisi', role) + console.log('divisi', email) + + + + + + + + // console.log('userProfile', userProfile) + + useEffect(() => { + getDataProfileUser(); + getRoleList() + }, []) + + useEffect(() => { + if (userProfile && userProfile != {}) { + setId(userProfile?.id) + setUserName(userProfile?.username); + setName(userProfile?.name); + setEmail(userProfile?.email); + setNohp(userProfile?.phone_number); + setAddres(userProfile?.address); + setIdnumber(userProfile?.ktp_number); + setGender(userProfile?.gender); + // setDivisi(userProfile?.divisi.name); + // setRole(userProfile?.role.name); + setBirthdayplace(userProfile?.birth_place); + setBirthdaydate(userProfile?.birth_date); + setEmployeeType(userProfile?.employee_type); + + } + }, [userProfile]) + + const handleOpenDialog = (type) => { + setOpenDialog(true) + setTypeDialog(type) + } + + const handleCloseDialog = (type, data) => { + if (type === "profile") { + saveProfile(data); + } + setOpenDialog(false) + } + + const saveProfile = async (data) => { + + let urlEdit = USER_EDIT(id) + const formData = data + + const result = await axios.put(urlEdit, formData, config) + .then(res => res) + .catch((error) => error.response); + + if (result && result.data && result.data.code === 200) { + getDataProfileUser(); + NotificationManager.success(`Data resource berhasil diedit`, 'Success!!'); + } else { + NotificationManager.error(`Data resource gagal di edit`, `Failed!!`); + } + } + + const toggleAddDialog = () => { + setOpenDialog(!openDialog) + } + + const getRoleList = async () => { + const formData = { + "paging": { "start": 0, "length": -1 }, + "orders": { "columns": ["id"], "ascending": false } + } + + const result = await axios + .post(ROLE_SEARCH, formData, config) + .then(res => res) + .catch((error) => error.response); + + if (result && result.data && result.data.code == 200) { + setRoleList(result.data.data); + } + } + + const getDataProfileUser = async () => { + const id = localStorage.getItem("user_id") + + const url = `${BASE_OSPRO}/api/human-resource/edit/${id}` + + + const result = await axios + .get(url, config) + .then((res) => res) + .catch((error) => error.response); + console.log("data User :", result); + if (result && result.data && result.data.code == 200) { + let dataRes = result.data.data; + setUserprofile(dataRes); + } else { + NotificationManager.error("Gagal Mengambil Data!!", "Failed"); + } + }; + + + + return ( +
    + + toggleAddDialog} + typeDialogProp={typeDialog} + roleList={roleList} + nameProp={name} + noHpProp={noHp} + idNumberProp={idNumber} + genderProp={gender} + divisiProp={divisi} + birthdayPlaceProp={birthdayPlace} + birthdayDateProp={birthdayDate} + addressProp={address} + emailProp={email} + userNameProp={userName} + /> + + + +
    + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    + + + + ) +} + +export default Setting;
    Profile Setting
    Nama   :  {name}
    Username   :  {userName}
    Email   :  {email}
    Password     :  **********
    Nomor Handphone   :   {noHp}
    Alamat   :   {address}
    ID Number   :   {idNumber}
    Gender   :   {gender}
    Divisi   :   {divisi}
    employee   :   {divisi}
    Role   :   {role}
    Tempat Lahir  :   {birthdayPlace}
    Tanggal Lahir   :   {birthdayDate}