|
|
|
import React, { useRef, useState } from 'react'
|
|
|
|
import { Card, CardBody, CardHeader, CardTitle } from 'reactstrap'
|
|
|
|
import { Stepper } from 'primereact/stepper'
|
|
|
|
import { StepperPanel } from 'primereact/stepperpanel'
|
|
|
|
import PenugasanKpdl from './componentPenugasanAktifitas/PenugasanKpdljs'
|
|
|
|
const TabPenugasan = ({ dataSend }) => {
|
|
|
|
const stepperRef = useRef(null)
|
|
|
|
return (
|
|
|
|
<>
|
|
|
|
<Card>
|
|
|
|
<CardHeader className="d-flex justify-content-center p-2">
|
|
|
|
<CardTitle tag={'h1'} className="font-weight-bold">
|
|
|
|
Statistik Penugasan Matoa Tahun Berjalan
|
|
|
|
</CardTitle>
|
|
|
|
</CardHeader>
|
|
|
|
|
|
|
|
<CardBody className="mb-0">
|
|
|
|
<div className="card flex justify-content-center">
|
|
|
|
<Stepper ref={stepperRef} style={{ flexBasis: '30rem' }}>
|
|
|
|
<StepperPanel header="Identifikasi Lapangan (KPDL/MATOA)">
|
|
|
|
<div className="flex flex-column h-12rem">
|
|
|
|
<div className="font-medium">
|
|
|
|
<PenugasanKpdl dataSend={dataSend} />
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</StepperPanel>
|
|
|
|
{/* <StepperPanel header="Aktifitas pasca identifikasi">
|
|
|
|
<div className="flex flex-column h-12rem">
|
|
|
|
<div className="border-2 border-dashed surface-border border-round surface-ground flex-auto flex justify-content-center align-items-center font-medium">
|
|
|
|
OTW
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</StepperPanel>
|
|
|
|
<StepperPanel header="Hasil pasca aktifitas">
|
|
|
|
<div className="flex flex-column h-12rem">
|
|
|
|
<div className="border-2 border-dashed surface-border border-round surface-ground flex-auto flex justify-content-center align-items-center font-medium">
|
|
|
|
OTW
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</StepperPanel> */}
|
|
|
|
</Stepper>
|
|
|
|
</div>
|
|
|
|
</CardBody>
|
|
|
|
</Card>
|
|
|
|
</>
|
|
|
|
)
|
|
|
|
}
|
|
|
|
|
|
|
|
export default TabPenugasan
|