22 changed files with 718 additions and 100 deletions
File diff suppressed because one or more lines are too long
@ -0,0 +1,180 @@
|
||||
import React, { useEffect, useRef, useState } from "react" |
||||
import { MultiSelect } from "react-multi-select-component" |
||||
import { Col, Label, Row } from "reactstrap" |
||||
import Select from "react-select" |
||||
import { Button as ButtonP } from "primereact/button" |
||||
import { isObjEmpty } from "../util" |
||||
import $ from "jquery" |
||||
import collect from "collect.js" |
||||
const NipPengampu = ({ dataSend, setDataSend, activeTab, toast, setHiddenGraphMatoa }) => { |
||||
const [kanwil, setKanwil] = useState({}) |
||||
const [kpp, setKpp] = useState({}) |
||||
const [seksi, setSeksi] = useState([]) |
||||
const [ar, setAr] = useState([]) |
||||
|
||||
const [kanwilSelected, setKanwilSelected] = useState(null) |
||||
const [kppSelected, setKppSelected] = useState({}) |
||||
const [seksiSelected, setSeksiSelected] = useState([]) |
||||
const [arSelected, setArSelected] = useState([]) |
||||
const base_url = "<?=base_url()?>" |
||||
useEffect(() => { |
||||
$.ajax({ |
||||
url: base_url + "kewilayahan/ref/kanwil", |
||||
method: "GET", |
||||
dataType: "json", |
||||
success: (data) => { |
||||
setKanwil(data) |
||||
} |
||||
}) |
||||
}, []) |
||||
|
||||
useEffect(() => { |
||||
setKpp(null) |
||||
setSeksi([]) |
||||
setAr([]) |
||||
setKppSelected(null) |
||||
setSeksiSelected([]) |
||||
setArSelected([]) |
||||
if (kanwilSelected && !isObjEmpty(kanwilSelected)) { |
||||
const kanwil = kanwilSelected.value |
||||
$.ajax({ |
||||
url: base_url + "kewilayahan/ref/kpp", |
||||
method: "GET", |
||||
dataType: "json", |
||||
data: { kanwil }, |
||||
success: (data) => { |
||||
setKpp(data) |
||||
} |
||||
}) |
||||
} |
||||
}, [kanwilSelected]) |
||||
|
||||
useEffect(() => { |
||||
setSeksi([]) |
||||
setAr([]) |
||||
setSeksiSelected([]) |
||||
setArSelected([]) |
||||
if (kppSelected && !isObjEmpty(kppSelected)) { |
||||
// const kpp = collect(kppSelected).pluck("value").all()
|
||||
const kpp = kppSelected.value |
||||
$.ajax({ |
||||
url: base_url + "kewilayahan/ref/seksi", |
||||
method: "GET", |
||||
dataType: "json", |
||||
data: { kpp }, |
||||
success: (data) => { |
||||
setSeksi(data) |
||||
} |
||||
}) |
||||
} |
||||
}, [kppSelected]) |
||||
|
||||
useEffect(() => { |
||||
setAr([]) |
||||
setArSelected([]) |
||||
const seksi = collect(seksiSelected).pluck("value").all() |
||||
if (seksi.length && !isObjEmpty(seksiSelected)) { |
||||
const kpp = kppSelected.value |
||||
|
||||
$.ajax({ |
||||
url: base_url + "kewilayahan/ref/ar", |
||||
method: "POST", |
||||
dataType: "json", |
||||
data: { kpp, seksi }, |
||||
success: (data) => { |
||||
setAr(data) |
||||
} |
||||
}) |
||||
} |
||||
}, [seksiSelected]) |
||||
const buttonProsesOnClick = () => { |
||||
const nip_ar_pengampu = collect(arSelected).pluck("value").all() |
||||
if (nip_ar_pengampu.length) { |
||||
setDataSend({ opsiWilZona: activeTab, nip_ar_pengampu }) |
||||
setHiddenGraphMatoa(true) |
||||
} else { |
||||
toast.current.show({ severity: "info", summary: "Info", detail: "AR Pengampu harus dipilih" }) |
||||
} |
||||
} |
||||
return ( |
||||
<> |
||||
<Row> |
||||
<Col md="3"> |
||||
<Label className="form-label" for="basicInput"> |
||||
Kanwil |
||||
</Label> |
||||
<Select |
||||
placeholder="Pilih Kanwil" |
||||
className="basic-single w-100" |
||||
onChange={(e) => { |
||||
setKanwilSelected(e) |
||||
}} |
||||
classNamePrefix="select" |
||||
// defaultValue={kanwilSelected}
|
||||
value={kanwilSelected} |
||||
isClearable={false} |
||||
options={kanwil} |
||||
/> |
||||
</Col> |
||||
<Col md="3"> |
||||
<Label className="form-label" for="Pilih KPP"> |
||||
KPP |
||||
</Label> |
||||
<Select |
||||
placeholder="Pilih KPP" |
||||
className="basic-single w-100" |
||||
onChange={(e) => { |
||||
setKppSelected(e) |
||||
}} |
||||
classNamePrefix="select" |
||||
// defaultValue={kanwilSelected}
|
||||
value={kppSelected} |
||||
isClearable={false} |
||||
options={kpp} |
||||
/> |
||||
</Col> |
||||
<Col md="3"> |
||||
<Label className="form-label" for="Pilih Seksi"> |
||||
Seksi |
||||
</Label> |
||||
<MultiSelect |
||||
className="me-1 w-full" |
||||
hasSelectAll={true} |
||||
debounceDuration={300} |
||||
options={seksi} |
||||
value={seksiSelected} |
||||
onChange={(e) => { |
||||
setSeksiSelected(e) |
||||
}} |
||||
labelledBy="Pilih Seksi" |
||||
overrideStrings={{ allItemsAreSelected: "Semua dipilih", selectSomeItems: "Pilih Seksi" }} |
||||
/> |
||||
</Col> |
||||
<Col md="3"> |
||||
<Label className="form-label" for="Pilih AR"> |
||||
AR |
||||
</Label> |
||||
<MultiSelect |
||||
className="me-1 w-full" |
||||
hasSelectAll={true} |
||||
debounceDuration={300} |
||||
options={ar} |
||||
value={arSelected} |
||||
onChange={(e) => { |
||||
setArSelected(e) |
||||
}} |
||||
labelledBy="Pilih AR" |
||||
overrideStrings={{ allItemsAreSelected: "Semua dipilih", selectSomeItems: "Pilih AR" }} |
||||
/> |
||||
</Col> |
||||
</Row> |
||||
<Row className="mt-2"> |
||||
<Col sm="12"> |
||||
<ButtonP onClick={() => buttonProsesOnClick()} label="Proses" severity="" rounded className="w-10rem text-white text-base" /> |
||||
</Col> |
||||
</Row> |
||||
</> |
||||
) |
||||
} |
||||
|
||||
export default NipPengampu |
@ -0,0 +1,185 @@
|
||||
import React, { useEffect, useRef, useState } from "react" |
||||
import { MultiSelect } from "react-multi-select-component" |
||||
import { Col, Label, Row } from "reactstrap" |
||||
import Select from "react-select" |
||||
import { Button as ButtonP } from "primereact/button" |
||||
import { isObjEmpty } from "../util" |
||||
import $ from "jquery" |
||||
import collect from "collect.js" |
||||
|
||||
const NipPerekam = ({ dataSend, setDataSend, activeTab, toast, setHiddenGraphMatoa }) => { |
||||
const base_url = "<?=base_url()?>" |
||||
|
||||
const [kanwil, setKanwil] = useState({}) |
||||
const [kpp, setKpp] = useState(null) |
||||
const [seksi, setSeksi] = useState([]) |
||||
const [ar, setAr] = useState([]) |
||||
|
||||
const [kanwilSelected, setKanwilSelected] = useState(null) |
||||
const [kppSelected, setKppSelected] = useState() |
||||
const [seksiSelected, setSeksiSelected] = useState([]) |
||||
const [arSelected, setArSelected] = useState([]) |
||||
|
||||
useEffect(() => { |
||||
$.ajax({ |
||||
url: base_url + "kewilayahan/ref/kanwilPratama", |
||||
method: "GET", |
||||
dataType: "json", |
||||
success: (data) => { |
||||
setKanwil(data) |
||||
} |
||||
}) |
||||
}, []) |
||||
|
||||
useEffect(() => { |
||||
setKpp(null) |
||||
setSeksi([]) |
||||
setAr([]) |
||||
setKppSelected(null) |
||||
setSeksiSelected([]) |
||||
setArSelected([]) |
||||
if (kanwilSelected && !isObjEmpty(kanwilSelected)) { |
||||
const kanwil = kanwilSelected.value |
||||
$.ajax({ |
||||
url: base_url + "kewilayahan/ref/kppPratama", |
||||
method: "GET", |
||||
dataType: "json", |
||||
data: { kanwil }, |
||||
success: (data) => { |
||||
setKpp(data) |
||||
} |
||||
}) |
||||
} |
||||
}, [kanwilSelected]) |
||||
|
||||
useEffect(() => { |
||||
setSeksi([]) |
||||
setAr([]) |
||||
setSeksiSelected([]) |
||||
setArSelected([]) |
||||
if (kppSelected && !isObjEmpty(kppSelected)) { |
||||
// const kpp = collect(kppSelected).pluck("value").all()
|
||||
const kpp = kppSelected.value |
||||
$.ajax({ |
||||
url: base_url + "kewilayahan/ref/seksi", |
||||
method: "GET", |
||||
dataType: "json", |
||||
data: { kpp }, |
||||
success: (data) => { |
||||
setSeksi(data) |
||||
} |
||||
}) |
||||
} |
||||
}, [kppSelected]) |
||||
|
||||
useEffect(() => { |
||||
setAr([]) |
||||
setArSelected([]) |
||||
const seksi = collect(seksiSelected).pluck("value").all() |
||||
if (seksi.length && !isObjEmpty(seksiSelected)) { |
||||
const kpp = kppSelected.value |
||||
// const seksi = collect(seksiSelected).pluck("value").all()
|
||||
|
||||
$.ajax({ |
||||
url: base_url + "kewilayahan/ref/ar", |
||||
method: "POST", |
||||
dataType: "json", |
||||
data: { kpp, seksi }, |
||||
success: (data) => { |
||||
setAr(data) |
||||
} |
||||
}) |
||||
} |
||||
}, [seksiSelected]) |
||||
|
||||
const buttonProsesOnClick = () => { |
||||
const nip_ar_perekam = collect(arSelected).pluck("value").all() |
||||
if (nip_ar_perekam.length) { |
||||
setDataSend({ opsiWilZona: activeTab, nip_ar_perekam }) |
||||
setHiddenGraphMatoa(true) |
||||
} else { |
||||
toast.current.show({ severity: "info", summary: "Info", detail: "AR Perekam harus dipilih" }) |
||||
} |
||||
} |
||||
return ( |
||||
<> |
||||
<Row> |
||||
<Col md="3"> |
||||
<Label className="form-label" for="basicInput"> |
||||
Kanwil |
||||
</Label> |
||||
<Select |
||||
placeholder="Pilih Kanwil" |
||||
className="basic-single w-100" |
||||
onChange={(e) => { |
||||
setKanwilSelected(e) |
||||
}} |
||||
classNamePrefix="select" |
||||
// defaultValue={kanwilSelected}
|
||||
value={kanwilSelected} |
||||
isClearable={false} |
||||
options={kanwil} |
||||
/> |
||||
</Col> |
||||
<Col md="3"> |
||||
<Label className="form-label" for="Pilih KPP"> |
||||
KPP |
||||
</Label> |
||||
<Select |
||||
placeholder="Pilih KPP" |
||||
className="basic-single w-100" |
||||
onChange={(e) => { |
||||
setKppSelected(e) |
||||
}} |
||||
classNamePrefix="select" |
||||
// defaultValue={kanwilSelected}
|
||||
value={kppSelected} |
||||
isClearable={false} |
||||
options={kpp} |
||||
/> |
||||
</Col> |
||||
<Col md="3"> |
||||
<Label className="form-label" for="Pilih Seksi"> |
||||
Seksi |
||||
</Label> |
||||
<MultiSelect |
||||
className="me-1 w-full" |
||||
hasSelectAll={true} |
||||
debounceDuration={300} |
||||
options={seksi} |
||||
value={seksiSelected} |
||||
onChange={(e) => { |
||||
setSeksiSelected(e) |
||||
}} |
||||
labelledBy="Pilih Seksi" |
||||
overrideStrings={{ allItemsAreSelected: "Semua dipilih", selectSomeItems: "Pilih Seksi" }} |
||||
/> |
||||
</Col> |
||||
<Col md="3"> |
||||
<Label className="form-label" for="Pilih AR"> |
||||
AR Perekam |
||||
</Label> |
||||
<MultiSelect |
||||
className="me-1 w-full" |
||||
hasSelectAll={true} |
||||
debounceDuration={300} |
||||
options={ar} |
||||
value={arSelected} |
||||
onChange={(e) => { |
||||
setArSelected(e) |
||||
}} |
||||
labelledBy="Pilih AR" |
||||
overrideStrings={{ allItemsAreSelected: "Semua dipilih", selectSomeItems: "Pilih AR" }} |
||||
/> |
||||
</Col> |
||||
</Row> |
||||
<Row className="mt-2"> |
||||
<Col sm="12"> |
||||
<ButtonP onClick={() => buttonProsesOnClick()} label="Proses" severity="" rounded className="w-10rem text-white text-base" /> |
||||
</Col> |
||||
</Row> |
||||
</> |
||||
) |
||||
} |
||||
|
||||
export default NipPerekam |
Loading…
Reference in new issue