98 lines
3.6 KiB
TypeScript
98 lines
3.6 KiB
TypeScript
import {
|
|
Dialog,
|
|
DialogBody,
|
|
DialogContent,
|
|
DialogHeader,
|
|
DialogTitle
|
|
} from '@/components/ui/dialog';
|
|
import { Input } from '@/components/ui/input';
|
|
import { Button } from '@/components/ui/button';
|
|
import { useManageKycDeletionContext } from '../hooks';
|
|
import { apiConfig } from '@/config/api.config';
|
|
import axios from 'axios';
|
|
|
|
const API_URL = apiConfig.service_customer;
|
|
const DetailDialog = () => {
|
|
const { showDetailDialog, setShowDetailDialog, detailKyc } = useManageKycDeletionContext();
|
|
|
|
return (
|
|
<Dialog open={showDetailDialog} onOpenChange={setShowDetailDialog}>
|
|
<DialogContent className="container-fixed max-w-[1024px] flex flex-col p-5 overflow-hidden">
|
|
<DialogHeader>
|
|
<DialogTitle>Customer Deletion Details </DialogTitle>
|
|
</DialogHeader>
|
|
<DialogBody>
|
|
{/* Tab Content */}
|
|
{detailKyc && detailKyc != null ? (
|
|
<div className="flex flex-col">
|
|
{generateInput(detailKyc, null, 'Group', 'group_name', 'text', false, true)}
|
|
{generateInput(detailKyc, null, 'Username', 'username', 'text', false, true)}
|
|
{generateInput(detailKyc, null, 'Full Name', 'fullname', 'text', false, true)}
|
|
{generateInput(detailKyc, null, 'Gender', 'customers_gender', 'text', false, true)}
|
|
{generateInput(detailKyc, null, 'Date of Birth', 'birthdate', 'date', false, true)}
|
|
{generateInput(detailKyc, null, 'Mother Name', 'registered_mother_fullname', 'text', false, true)}
|
|
{generateInput(detailKyc, null, 'MSISDN', 'registered_msisdn', 'text', false, true)}
|
|
{generateInput(detailKyc, null, 'Reason Deletion', 'reason_deletion', 'text', false, true)}
|
|
{generateInput(detailKyc, null, 'Reason Note', 'reason_note', 'text', false, true)}
|
|
{generateInput(detailKyc, null, 'Status Approval', 'status_approve', 'text', false, true)}
|
|
|
|
<div className="flex justify-end gap-2 mt-3">
|
|
<Button type="button" variant="outline" onClick={() => setShowDetailDialog(false)}>Cancel</Button>
|
|
<Button onClick={()=>{}} variant="destructive" color="warning">Reject</Button>
|
|
<Button onClick={()=>{}} variant="default" color="primary">Approve</Button>
|
|
</div>
|
|
</div>
|
|
) : (<div></div>)}
|
|
</DialogBody>
|
|
</DialogContent>
|
|
</Dialog>
|
|
);
|
|
};
|
|
|
|
export default DetailDialog;
|
|
|
|
function generateInput(formData:any, handleChange:any, label:string, name:string, type: string, required: boolean, disabled: boolean) {
|
|
function generateDate(isoString: string) {
|
|
return isoString.slice(0, 10); // "2000-01-18"
|
|
}
|
|
|
|
type Code = 'W' | 'Y' | 'N' | 'T' | 'P' | 'D' | 'L';
|
|
interface Reason {
|
|
label: string;
|
|
}
|
|
|
|
const statusMap: Record<Code, Reason> = {
|
|
W: {label: 'Waiting Approval'},
|
|
Y: {label: 'Approve'},
|
|
N: {label: 'Reject'},
|
|
T: {label: 'Tidak lagi menggunakan layanan'},
|
|
P: {label: 'Privasi dan keamanan'},
|
|
D: {label: 'Akun ganda'},
|
|
L: {label: 'Lainnya'}
|
|
};
|
|
if (name == 'reason_deletion' || name == 'status_approve') {
|
|
const status = formData[name] as Code
|
|
const fixStatus = statusMap[status] ?? {label: formData[name]}
|
|
formData[name] = fixStatus.label
|
|
}
|
|
return (
|
|
<>
|
|
<div className="w-full mt-5">
|
|
<div className="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
|
<label className="form-label flex items-center gap-1 max-w-56">
|
|
{label}<span className="text-red-500">{required?"*":""}</span>
|
|
</label>
|
|
<Input
|
|
className="input"
|
|
readOnly={disabled}
|
|
required={required}
|
|
type={type}
|
|
name={name}
|
|
value={formData[name]?(type === 'date' ? generateDate(formData[name]) : formData[name]):""}
|
|
onChange={handleChange}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</>
|
|
)
|
|
} |