+
+
+ );
+ }
+
+ if (
+ !isLoadingProjectFlock &&
+ (!projectFlock || isResponseError(projectFlock))
+ ) {
+ router.replace('/404');
+ return;
+ }
+
+ // Handle Function
+ const handleChickinClick = (kandang: Kandang) => {
+ setSelectedKandang(kandang);
+ refreshProjectFlockKandang();
+ chickinModal.openModal();
+ };
+ const handleAfterSubmit = () => {
+ refreshProjectFlockKandang();
+ chickinModal.closeModal();
+ router.push('/production/chickin');
+ };
+
+ return (
+ <>
+ {isResponseSuccess(projectFlock) && (
+ <>
+
+
+
+
+ router.push(
+ `/production/chickin/add?projectFlockId=${
+ (val as OptionType | null)?.value
+ }`
+ )
+ }
+ onInputChange={(val) => {
+ setSearchProjectFlock(val);
+ }}
+ />
+
+
+
+ {isResponseSuccess(projectFlockKandang) &&
+ !isLoadingProjectFlockKandang && (
+ + Chickin Kandang - {selectedKandang?.name} +
+ +
+
+ );
+};
+
+export default AddRecording;
diff --git a/src/app/production/recording/detail/edit/page.tsx b/src/app/production/recording/detail/edit/page.tsx
new file mode 100644
index 00000000..de53a354
--- /dev/null
+++ b/src/app/production/recording/detail/edit/page.tsx
@@ -0,0 +1,47 @@
+'use client';
+
+import { useRouter, useSearchParams } from 'next/navigation';
+import useSWR from 'swr';
+import RecordingForm from '@/components/pages/production/recording/form/RecordingForm';
+import { RecordingApi } from '@/services/api/production';
+import { isResponseError, isResponseSuccess } from '@/lib/api-helper';
+
+const RecordingEdit = () => {
+ const router = useRouter();
+ const searchParams = useSearchParams();
+
+ const recordingId = searchParams.get('recordingId');
+
+ const { data: recording, isLoading: isLoadingRecording } = useSWR(
+ recordingId,
+ (id: number) => RecordingApi.getSingle(id) // Gunakan RecordingApi
+ );
+
+ if (!recordingId) {
+ router.back();
+
+ return (
+
+
+
+ );
+ }
+
+ if (!isLoadingRecording && (!recording || isResponseError(recording))) {
+ router.replace('/404');
+ return;
+ }
+
+ return (
+
+ {isLoadingRecording && (
+
+ )}
+ {!isLoadingRecording && isResponseSuccess(recording) && (
+
+ );
+};
+
+export default RecordingEdit;
diff --git a/src/app/production/recording/detail/layout.tsx b/src/app/production/recording/detail/layout.tsx
new file mode 100644
index 00000000..7220dfa1
--- /dev/null
+++ b/src/app/production/recording/detail/layout.tsx
@@ -0,0 +1,11 @@
+import SuspenseHelper from '@/components/helper/SuspenseHelper';
+
+const Layout = ({
+ children,
+}: Readonly<{
+ children: React.ReactNode;
+}>) => {
+ return
+
+
+ );
+ }
+
+ if (!isLoadingRecording && (!recording || isResponseError(recording))) {
+ router.replace('/404');
+ return;
+ }
+
+ return (
+
+ {isLoadingRecording && (
+
+ )}
+ {!isLoadingRecording && isResponseSuccess(recording) && (
+
+ );
+};
+
+export default RecordingDetail;
diff --git a/src/app/production/recording/page.tsx b/src/app/production/recording/page.tsx
new file mode 100644
index 00000000..f31ac19a
--- /dev/null
+++ b/src/app/production/recording/page.tsx
@@ -0,0 +1,11 @@
+import RecordingTable from '@/components/pages/production/recording/RecordingTable';
+
+const Recording = () => {
+ return (
+
+
+ 
+
+
+ );
+ }
+
+ return (
+
+ {title &&
+ {footer && {title}
} + {subtitle &&{subtitle}
} + {children} + {actions &&{actions}
}
+ {footer}
}
+
+ {image && (
+
+
+
+ )}
+
+ );
+};
+
+export default Card;
\ No newline at end of file
diff --git a/src/components/Collapse.tsx b/src/components/Collapse.tsx
index cb05d5b0..8506f65c 100644
--- a/src/components/Collapse.tsx
+++ b/src/components/Collapse.tsx
@@ -68,7 +68,7 @@ export const Collapse = ({
'collapse',
variant === 'arrow' && 'collapse-arrow',
variant === 'plus' && 'collapse-plus',
- bordered && 'border base-content/20 border-opacity-20 rounded-box',
+ bordered && 'border base-content/20 border-opacity-20 rounded',
disabled && 'opacity-60 pointer-events-none',
!open && 'w-fit',
className
diff --git a/src/components/input/DateInput.tsx b/src/components/input/DateInput.tsx
new file mode 100644
index 00000000..0ef80fee
--- /dev/null
+++ b/src/components/input/DateInput.tsx
@@ -0,0 +1,137 @@
+'use client';
+
+import {
+ ChangeEventHandler,
+ FocusEventHandler,
+ ReactNode,
+} from 'react';
+
+import { cn } from '@/lib/helper';
+
+export interface DateInputProps {
+ label?: string;
+ bottomLabel?: string;
+ name: string;
+ value?: string;
+ placeholder?: string;
+ min?: string;
+ max?: string;
+ className?: {
+ wrapper?: string;
+ label?: string;
+ inputWrapper?: string;
+ input?: string;
+ };
+ isError?: boolean;
+ isValid?: boolean;
+ disabled?: boolean;
+ readOnly?: boolean;
+ required?: boolean;
+ isLoading?: boolean;
+ errorMessage?: string;
+ startAdornment?: ReactNode;
+ endAdornment?: ReactNode;
+ onChange?: ChangeEventHandler
+ {title &&
+ {footer && {title}
} + {subtitle &&{subtitle}
} + {children} + {actions &&{actions}
}
+ {footer}
}
+
+ {label && (
+
+ )}
+
+
+ );
+};
+
+export default DateInput;
diff --git a/src/components/input/NumberInput.tsx b/src/components/input/NumberInput.tsx
new file mode 100644
index 00000000..5b2188ee
--- /dev/null
+++ b/src/components/input/NumberInput.tsx
@@ -0,0 +1,415 @@
+'use client';
+
+import {
+ ChangeEvent,
+ ChangeEventHandler,
+ FocusEventHandler,
+ ReactNode,
+ useEffect,
+ useRef,
+ useState,
+} from 'react';
+
+import { cn } from '@/lib/helper';
+import Inputmask from 'inputmask';
+
+const createInputMask = (
+ maskType: MaskType,
+ decimals: number,
+ thousandSeparator: string,
+ decimalSeparator: string,
+ allowNegative: boolean,
+ oncomplete?: () => void,
+ onincomplete?: () => void,
+ oncleared?: () => void
+): Inputmask.Instance => {
+ const options: Inputmask.Options = {
+ alias: 'numeric',
+ groupSeparator: thousandSeparator,
+ radixPoint: decimalSeparator,
+ digits: decimals,
+ allowMinus: allowNegative,
+ rightAlign: false,
+ insertMode: true,
+ autoUnmask: false,
+ clearMaskOnLostFocus: false,
+ digitsOptional: decimals > 0,
+ placeholder: '0',
+ numericInput: false,
+ positionCaretOnClick: 'radixFocus',
+ greedy: true,
+ oncomplete,
+ onincomplete,
+ oncleared
+ };
+
+ return new Inputmask(options);
+};
+
+export type MaskType = 'currency' | 'weight' | 'decimal' | 'number' | 'text';
+
+export interface NumberInputProps {
+ label?: string;
+ bottomLabel?: string;
+ name: string;
+ value?: number | string;
+ placeholder?: string;
+
+ className?: {
+ wrapper?: string;
+ label?: string;
+ inputWrapper?: string;
+ input?: string;
+ };
+
+ isError?: boolean;
+ isValid?: boolean;
+ errorMessage?: string;
+ disabled?: boolean;
+ readOnly?: boolean;
+ required?: boolean;
+ isLoading?: boolean;
+
+ startAdornment?: ReactNode;
+ endAdornment?: ReactNode;
+
+ onChange?: ChangeEventHandler
+ {startAdornment && startAdornment}
+
+
+
+ {(isLoading || endAdornment) && (
+
+
+ {!isError && bottomLabel && (
+
+ {isLoading && }
+ {endAdornment && endAdornment}
+
+ )}
+ {bottomLabel}
+ )} + {isError && errorMessage && ( +{errorMessage}
+ )} +
+ {label && (
+
+ )}
+
+
+ );
+};
+
+export default NumberInput;
+
diff --git a/src/components/input/SelectInput.tsx b/src/components/input/SelectInput.tsx
index 6aaedc17..ed2e51f9 100644
--- a/src/components/input/SelectInput.tsx
+++ b/src/components/input/SelectInput.tsx
@@ -109,7 +109,7 @@ const SelectInput =
+ {inputPrefix && (
+
+
+ {(maskType === 'text' || (oncomplete || onincomplete || oncleared)) && (
+
+
+ {inputPrefix}
+
+
+ )}
+
+
+ {startAdornment && startAdornment}
+
+
+
+ {(isLoading || endAdornment) && (
+
+
+ {inputSuffix && (
+
+ {isLoading && }
+ {endAdornment && endAdornment}
+
+ )}
+
+
+ {inputSuffix}
+
+
+ )}
+
+
+ Complete
+
+
+ Incomplete
+
+
+ Cleared
+
+
+ )}
+
+ {!isError && bottomLabel && (
+ {bottomLabel}
+ )} + {isError && errorMessage && ( +{errorMessage}
+ )} +