diff --git a/package-lock.json b/package-lock.json index 0bf597f2..38844543 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,7 +9,6 @@ "version": "0.1.0", "dependencies": { "@react-pdf/renderer": "^4.3.1", - "@supabase/supabase-js": "^2.89.0", "@tanstack/match-sorter-utils": "^8.19.4", "@tanstack/react-table": "^8.21.3", "axios": "^1.12.2", @@ -3951,86 +3950,6 @@ "integrity": "sha512-e7Mew686owMaPJVNNLs55PUvgz371nKgwsc4vxE49zsODpJEnxgxRo2y/OKrqueavXgZNMDVj3DdHFlaSAeU8g==", "license": "MIT" }, - "node_modules/@supabase/auth-js": { - "version": "2.89.0", - "resolved": "https://registry.npmjs.org/@supabase/auth-js/-/auth-js-2.89.0.tgz", - "integrity": "sha512-wiWZdz8WMad8LQdJMWYDZ2SJtZP5MwMqzQq3ehtW2ngiI3UTgbKiFrvMUUS3KADiVlk4LiGfODB2mrYx7w2f8w==", - "license": "MIT", - "dependencies": { - "tslib": "2.8.1" - }, - "engines": { - "node": ">=20.0.0" - } - }, - "node_modules/@supabase/functions-js": { - "version": "2.89.0", - "resolved": "https://registry.npmjs.org/@supabase/functions-js/-/functions-js-2.89.0.tgz", - "integrity": "sha512-XEueaC5gMe5NufNYfBh9kPwJlP5M2f+Ogr8rvhmRDAZNHgY6mI35RCkYDijd92pMcNM7g8pUUJov93UGUnqfyw==", - "license": "MIT", - "dependencies": { - "tslib": "2.8.1" - }, - "engines": { - "node": ">=20.0.0" - } - }, - "node_modules/@supabase/postgrest-js": { - "version": "2.89.0", - "resolved": "https://registry.npmjs.org/@supabase/postgrest-js/-/postgrest-js-2.89.0.tgz", - "integrity": "sha512-/b0fKrxV9i7RNOEXMno/I1862RsYhuUo+Q6m6z3ar1f4ulTMXnDfv0y4YYxK2POcgrOXQOgKYQx1eArybyNvtg==", - "license": "MIT", - "dependencies": { - "tslib": "2.8.1" - }, - "engines": { - "node": ">=20.0.0" - } - }, - "node_modules/@supabase/realtime-js": { - "version": "2.89.0", - "resolved": "https://registry.npmjs.org/@supabase/realtime-js/-/realtime-js-2.89.0.tgz", - "integrity": "sha512-aMOvfDb2a52u6PX6jrrjvACHXGV3zsOlWRzZsTIOAJa0hOVvRp01AwC1+nLTGUzxzezejrYeCX+KnnM1xHdl+w==", - "license": "MIT", - "dependencies": { - "@types/phoenix": "^1.6.6", - "@types/ws": "^8.18.1", - "tslib": "2.8.1", - "ws": "^8.18.2" - }, - "engines": { - "node": ">=20.0.0" - } - }, - "node_modules/@supabase/storage-js": { - "version": "2.89.0", - "resolved": "https://registry.npmjs.org/@supabase/storage-js/-/storage-js-2.89.0.tgz", - "integrity": "sha512-6zKcXofk/M/4Eato7iqpRh+B+vnxeiTumCIP+Tz26xEqIiywzD9JxHq+udRrDuv6hXE+pmetvJd8n5wcf4MFRQ==", - "license": "MIT", - "dependencies": { - "iceberg-js": "^0.8.1", - "tslib": "2.8.1" - }, - "engines": { - "node": ">=20.0.0" - } - }, - "node_modules/@supabase/supabase-js": { - "version": "2.89.0", - "resolved": "https://registry.npmjs.org/@supabase/supabase-js/-/supabase-js-2.89.0.tgz", - "integrity": "sha512-KlaRwSfFA0fD73PYVMHj5/iXFtQGCcX7PSx0FdQwYEEw9b2wqM7GxadY+5YwcmuEhalmjFB/YvqaoNVF+sWUlg==", - "license": "MIT", - "dependencies": { - "@supabase/auth-js": "2.89.0", - "@supabase/functions-js": "2.89.0", - "@supabase/postgrest-js": "2.89.0", - "@supabase/realtime-js": "2.89.0", - "@supabase/storage-js": "2.89.0" - }, - "engines": { - "node": ">=20.0.0" - } - }, "node_modules/@swc/helpers": { "version": "0.5.15", "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.15.tgz", @@ -4471,6 +4390,7 @@ "version": "20.19.23", "resolved": "https://registry.npmjs.org/@types/node/-/node-20.19.23.tgz", "integrity": "sha512-yIdlVVVHXpmqRhtyovZAcSy0MiPcYWGkoO4CGe/+jpP0hmNuihm4XhHbADpK++MsiLHP5MVlv+bcgdF99kSiFQ==", + "dev": true, "license": "MIT", "dependencies": { "undici-types": "~6.21.0" @@ -4488,12 +4408,6 @@ "integrity": "sha512-dISoDXWWQwUquiKsyZ4Ng+HX2KsPL7LyHKHQwgGFEA3IaKac4Obd+h2a/a6waisAoepJlBcx9paWqjA8/HVjCw==", "license": "MIT" }, - "node_modules/@types/phoenix": { - "version": "1.6.7", - "resolved": "https://registry.npmjs.org/@types/phoenix/-/phoenix-1.6.7.tgz", - "integrity": "sha512-oN9ive//QSBkf19rfDv45M7eZPi0eEXylht2OLEXicu5b4KoQ1OzXIw+xDSGWxSxe1JmepRR/ZH283vsu518/Q==", - "license": "MIT" - }, "node_modules/@types/raf": { "version": "3.4.3", "resolved": "https://registry.npmjs.org/@types/raf/-/raf-3.4.3.tgz", @@ -4542,15 +4456,6 @@ "integrity": "sha512-zFDAD+tlpf2r4asuHEj0XH6pY6i0g5NeAHPn+15wk3BV6JA69eERFXC1gyGThDkVa1zCyKr5jox1+2LbV/AMLg==", "license": "MIT" }, - "node_modules/@types/ws": { - "version": "8.18.1", - "resolved": "https://registry.npmjs.org/@types/ws/-/ws-8.18.1.tgz", - "integrity": "sha512-ThVF6DCVhA8kUGy+aazFQ4kXQ7E1Ty7A3ypFOe0IcJV8O/M511G99AW24irKrW56Wt44yG9+ij8FaqoBGkuBXg==", - "license": "MIT", - "dependencies": { - "@types/node": "*" - } - }, "node_modules/@typescript-eslint/eslint-plugin": { "version": "8.46.2", "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.46.2.tgz", @@ -7511,15 +7416,6 @@ "integrity": "sha512-fXHXcGFTXOvZTSkPJuGOQf5Lv5T/R2itiiCVPg9LxAje5D00O0pP83yJShFq5V89Ly//Gt6acj7z8pbBr34stw==", "license": "ISC" }, - "node_modules/iceberg-js": { - "version": "0.8.1", - "resolved": "https://registry.npmjs.org/iceberg-js/-/iceberg-js-0.8.1.tgz", - "integrity": "sha512-1dhVQZXhcHje7798IVM+xoo/1ZdVfzOMIc8/rgVSijRK38EDqOJoGula9N/8ZI5RD8QTxNQtK/Gozpr+qUqRRA==", - "license": "MIT", - "engines": { - "node": ">=20.0.0" - } - }, "node_modules/ignore": { "version": "5.3.2", "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz", @@ -10717,6 +10613,7 @@ "version": "6.21.0", "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz", "integrity": "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==", + "dev": true, "license": "MIT" }, "node_modules/unicode-properties": { @@ -11048,27 +10945,6 @@ "node": ">=0.10.0" } }, - "node_modules/ws": { - "version": "8.18.3", - "resolved": "https://registry.npmjs.org/ws/-/ws-8.18.3.tgz", - "integrity": "sha512-PEIGCY5tSlUt50cqyMXfCzX+oOPqN0vuGqWzbcJ2xvnkzkq46oOpz7dQaTDBdfICb4N14+GARUDw2XV2N4tvzg==", - "license": "MIT", - "engines": { - "node": ">=10.0.0" - }, - "peerDependencies": { - "bufferutil": "^4.0.1", - "utf-8-validate": ">=5.0.2" - }, - "peerDependenciesMeta": { - "bufferutil": { - "optional": true - }, - "utf-8-validate": { - "optional": true - } - } - }, "node_modules/xlsx": { "version": "0.20.3", "resolved": "https://cdn.sheetjs.com/xlsx-0.20.3/xlsx-0.20.3.tgz", diff --git a/package.json b/package.json index aa90e44a..3a775db2 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,6 @@ }, "dependencies": { "@react-pdf/renderer": "^4.3.1", - "@supabase/supabase-js": "^2.89.0", "@tanstack/match-sorter-utils": "^8.19.4", "@tanstack/react-table": "^8.21.3", "axios": "^1.12.2", diff --git a/src/app/daily-checklist/master-data/configuration/page.tsx b/src/app/daily-checklist/master-data/configuration/page.tsx new file mode 100644 index 00000000..7b55c2ea --- /dev/null +++ b/src/app/daily-checklist/master-data/configuration/page.tsx @@ -0,0 +1,11 @@ +import { MasterConfigurationContent } from '@/figma-make/components/pages/master-data/configuration/MasterConfigurationContent'; + +const MasterConfigurationPage = () => { + return ( +
+ +
+ ); +}; + +export default MasterConfigurationPage; diff --git a/src/components/helper/form/FormErrors.tsx b/src/components/helper/form/FormErrors.tsx index a351227f..4b97d033 100644 --- a/src/components/helper/form/FormErrors.tsx +++ b/src/components/helper/form/FormErrors.tsx @@ -1,6 +1,7 @@ import Alert from '@/components/Alert'; import Button from '@/components/Button'; import { Icon } from '@iconify/react'; +import { useState } from 'react'; /** * Alert Unique Error List @@ -14,8 +15,10 @@ const AlertErrorList = ({ formErrorList: string[]; onClose: () => void; }) => { + if (formErrorList.length === 0) return null; + return ( - +
diff --git a/src/components/pages/closing/ClosingDetail.tsx b/src/components/pages/closing/ClosingDetail.tsx index 441c84dd..07745878 100644 --- a/src/components/pages/closing/ClosingDetail.tsx +++ b/src/components/pages/closing/ClosingDetail.tsx @@ -22,7 +22,6 @@ import HppExpeditionReportTable from './hpp-ekspedisi/HppExpeditionReportTable'; import ClosingKandangList from '@/components/pages/closing/ClosingKandangList'; import { ProjectFlock } from '@/types/api/production/project-flock'; import { ProjectFlockKandang } from '@/types/api/production/project-flock-kandang'; - interface ClosingDetailProps { id: number; initialValue?: ClosingGeneralInformation; @@ -56,7 +55,6 @@ const ClosingDetail: React.FC = ({ ), }, diff --git a/src/components/pages/closing/ClosingSapronakCalculationTabContent.tsx b/src/components/pages/closing/ClosingSapronakCalculationTabContent.tsx index cae2d406..b8add15b 100644 --- a/src/components/pages/closing/ClosingSapronakCalculationTabContent.tsx +++ b/src/components/pages/closing/ClosingSapronakCalculationTabContent.tsx @@ -5,13 +5,11 @@ import { ClosingGeneralInformation } from '@/types/api/closing'; interface ClosingSapronakCalculationTabContentProps { projectFlockId?: number; - projectKandangId?: number; closingGeneralInformation?: ClosingGeneralInformation; } const ClosingSapronakCalculationTabContent = ({ projectFlockId, - projectKandangId, closingGeneralInformation, }: ClosingSapronakCalculationTabContentProps) => { return ( @@ -21,7 +19,6 @@ const ClosingSapronakCalculationTabContent = ({ )} diff --git a/src/components/pages/closing/ClosingSapronakCalculationTable.tsx b/src/components/pages/closing/ClosingSapronakCalculationTable.tsx index 17527959..77cef803 100644 --- a/src/components/pages/closing/ClosingSapronakCalculationTable.tsx +++ b/src/components/pages/closing/ClosingSapronakCalculationTable.tsx @@ -14,21 +14,23 @@ import useSWR from 'swr'; import { ClosingApi } from '@/services/api/closing'; import { isResponseSuccess } from '@/lib/api-helper'; import { ClosingGeneralInformation } from '@/types/api/closing'; +import { useSearchParams } from 'next/navigation'; interface ClosingSapronakCalculationTableProps { projectFlockId: number; - projectKandangId?: number; closingGeneralInformation?: ClosingGeneralInformation; } const ClosingSapronakCalculationTable = ({ projectFlockId, closingGeneralInformation, - projectKandangId, }: ClosingSapronakCalculationTableProps) => { + const searchParams = useSearchParams(); + const kandangId = searchParams.get('kandangId'); + const { data: sapronakCalculation, isLoading } = useSWR( - `/closing/sapronak-calculation/${projectFlockId}${projectKandangId ? `/${projectKandangId}` : ''}`, - () => ClosingApi.getPerhitunganSapronak(projectFlockId, projectKandangId), + `/closing/sapronak-calculation/${projectFlockId}${kandangId ? `/${kandangId}` : ''}`, + () => ClosingApi.getPerhitunganSapronak(projectFlockId, Number(kandangId)), { keepPreviousData: true, } @@ -180,7 +182,7 @@ const ClosingSapronakCalculationTable = ({ {/* Table DOC jika kategori Project Flock Growing */} { ); const [endpointUrl, setEndpointUrl] = useState('/dashboards'); const [selectedLocationIds, setSelectedLocationIds] = useState([]); - const [formErrorList, setFormErrorList] = useState([]); // ===== FETCH DATA ===== const { @@ -149,22 +146,8 @@ const DashboardProduction = () => { formik.resetForm(); }; - const handleValidateForm = async () => { - const errors = await formik.validateForm(); - - if (Object.keys(errors).length > 0) { - // Parse and display errors - const errorMessages = getUniqueFormikErrors(errors); - setFormErrorList(errorMessages); - return; // Stop submission - } - }; - - const handleFormSubmit = (e: React.FormEvent) => { - e.preventDefault(); - handleValidateForm(); - formik.handleSubmit(); - }; + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); if (isLoadingDashboardProductionData) { return ( @@ -482,13 +465,7 @@ const DashboardProduction = () => {
)} - {/* Error List Alert */} - {formErrorList.length > 0 && ( - setFormErrorList([])} - /> - )} + {/* Action Buttons */}
diff --git a/src/components/pages/finance/add/FormFinanceAdd.tsx b/src/components/pages/finance/add/FormFinanceAdd.tsx index c835740e..a94fabd9 100644 --- a/src/components/pages/finance/add/FormFinanceAdd.tsx +++ b/src/components/pages/finance/add/FormFinanceAdd.tsx @@ -1,7 +1,7 @@ 'use client'; import Button from '@/components/Button'; -import Card from '@/components/Card'; +import AlertErrorList from '@/components/helper/form/FormErrors'; import { FormHeader } from '@/components/helper/form/FormHeader'; import DateInput from '@/components/input/DateInput'; import NumberInput from '@/components/input/NumberInput'; @@ -21,6 +21,7 @@ import { } from '@/config/constant'; import { isResponseError, isResponseSuccess } from '@/lib/api-helper'; import { formatDate, formatTitleCase } from '@/lib/helper'; +import { useFormikErrorList } from '@/services/hooks/useFormikErrorList'; import { FinanceApi } from '@/services/api/finance'; import { BankApi, CustomerApi, SupplierApi } from '@/services/api/master-data'; import { @@ -104,6 +105,9 @@ const FormFinanceAdd = ({ }, }); + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); + // ===== Options ===== const { options: partyOptions, @@ -180,7 +184,7 @@ const FormFinanceAdd = ({ title={`${type === 'add' ? 'Tambah' : 'Ubah'} Data Keuangan`} backUrl='/finance' /> -
+ +
+
{type !== 'detail' && (
@@ -405,11 +411,7 @@ const InventoryAdjustmentForm = ({ type='submit' color='primary' isLoading={formik.isSubmitting} - disabled={ - !formik.isValid || - formik.isSubmitting || - formik.values.product == undefined - } + disabled={formik.isSubmitting} className='px-4' > Submit diff --git a/src/components/pages/marketing/form/MarketingForm.tsx b/src/components/pages/marketing/form/MarketingForm.tsx index 51c20d8e..2fbca835 100644 --- a/src/components/pages/marketing/form/MarketingForm.tsx +++ b/src/components/pages/marketing/form/MarketingForm.tsx @@ -48,8 +48,8 @@ import DeliveryOrderProductForm from '@/components/pages/marketing/form/repeater import { SalesOrderProductFormValues } from '@/components/pages/marketing/form/repeater/sales-order/SalesOrderProduct.schema'; import { DeliveryOrderProductFormValues } from '@/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.schema'; import RequirePermission from '@/components/helper/RequirePermission'; -import { getUniqueFormikErrors } from '@/lib/formik-helper'; import AlertErrorList from '@/components/helper/form/FormErrors'; +import { useFormikErrorList } from '@/services/hooks/useFormikErrorList'; const MemoizedSalesOrderProductTable = memo(SalesOrderProductTable); const MemoizedSalesOrderProductForm = memo(SalesOrderProductForm); @@ -219,7 +219,6 @@ const MarketingForm = ({ const [deliveryFormState, setDeliveryFormState] = useState<'add' | 'edit'>( 'add' ); - const [formErrorList, setFormErrorList] = useState([]); const [deliveryOrderValues, setDeliveryOrderValues] = useState< DeliveryOrderProductFormValues[] >( @@ -561,22 +560,8 @@ const MarketingForm = ({ ); }, [memoSalesOrder]); - const handleValidateForm = async () => { - const errors = await formik.validateForm(); - - if (Object.keys(errors).length > 0) { - // Parse and display errors - const errorMessages = getUniqueFormikErrors(errors); - setFormErrorList(errorMessages); - return; // Stop submission - } - }; - - const handleFormSubmit = (e: React.FormEvent) => { - e.preventDefault(); - handleValidateForm(); - formik.handleSubmit(); - }; + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); return ( <> @@ -686,13 +671,7 @@ const MarketingForm = ({
- {/* Error List Alert */} - {formErrorList.length > 0 && ( - setFormErrorList([])} - /> - )} + {/* Form Actions */}
diff --git a/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx b/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx index 84f9e443..25a20982 100644 --- a/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx +++ b/src/components/pages/marketing/form/repeater/delivery-order/DeliverOrderProduct.tsx @@ -16,8 +16,8 @@ import Badge from '@/components/Badge'; import { SalesProductToFieldValues } from '@/components/pages/marketing/form/MarketingForm'; import * as Yup from 'yup'; import { isResponseSuccess } from '@/lib/api-helper'; -import { getUniqueFormikErrors } from '@/lib/formik-helper'; import AlertErrorList from '@/components/helper/form/FormErrors'; +import { useFormikErrorList } from '@/services/hooks/useFormikErrorList'; const DeliveryOrderProductForm = ({ formState, @@ -42,7 +42,6 @@ const DeliveryOrderProductForm = ({ null ); const [currentInput, setCurrentInput] = useState(''); - const [formErrorList, setFormErrorList] = useState([]); const salesOrder = salesOrders.find( (item) => item.id === initialValues?.marketing_product_id @@ -168,21 +167,8 @@ const DeliveryOrderProductForm = ({ } }, [initialValues]); - const handleValidateForm = () => { - formik.validateForm(); - const formErrorList = getUniqueFormikErrors(formik.errors); - setFormErrorList(formErrorList); - if (formErrorList.length > 0) { - return; - } - }; - - const handleFormSubmit = (e: React.FormEvent) => { - e.preventDefault(); - handleBlurField(currentInput); - handleValidateForm(); - formik.handleSubmit(e); - }; + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); return ( <> @@ -388,12 +374,7 @@ const DeliveryOrderProductForm = ({ />
- {formErrorList.length > 0 && ( - setFormErrorList([])} - /> - )} +
- {/* Error List Alert */} - {formErrorList.length > 0 && ( - setFormErrorList([])} - /> - )} +
)} + + {type !== 'detail' && (
{ type='submit' color='primary' isLoading={formik.isSubmitting} - disabled={!formik.isValid || formik.isSubmitting} + disabled={formik.isSubmitting} className='px-4' > Submit diff --git a/src/components/pages/master-data/bank/form/BankForm.tsx b/src/components/pages/master-data/bank/form/BankForm.tsx index ac5cc531..13c85422 100644 --- a/src/components/pages/master-data/bank/form/BankForm.tsx +++ b/src/components/pages/master-data/bank/form/BankForm.tsx @@ -25,6 +25,8 @@ import { } from '@/types/api/master-data/bank'; import { BankApi } from '@/services/api/master-data'; import { cn } from '@/lib/helper'; +import AlertErrorList from '@/components/helper/form/FormErrors'; +import { useFormikErrorList } from '@/services/hooks/useFormikErrorList'; interface BankFormProps { type?: 'add' | 'edit' | 'detail'; @@ -124,6 +126,9 @@ const BankForm = ({ type = 'add', initialValues }: BankFormProps) => { formikSetValues(formikInitialValues); }, [formikSetValues, formikInitialValues]); + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); + return ( <>
@@ -145,7 +150,7 @@ const BankForm = ({ type = 'add', initialValues }: BankFormProps) => { @@ -247,6 +252,8 @@ const BankForm = ({ type = 'add', initialValues }: BankFormProps) => {
)} + + {type !== 'detail' && (
{ type='submit' color='primary' isLoading={formik.isSubmitting} - disabled={!formik.isValid || formik.isSubmitting} + disabled={formik.isSubmitting} className='px-4' > Submit diff --git a/src/components/pages/master-data/customer/form/CustomerForm.tsx b/src/components/pages/master-data/customer/form/CustomerForm.tsx index fd3cea6f..0a629b36 100644 --- a/src/components/pages/master-data/customer/form/CustomerForm.tsx +++ b/src/components/pages/master-data/customer/form/CustomerForm.tsx @@ -28,6 +28,8 @@ import useSWR from 'swr'; import { UserApi } from '@/services/api/user'; import { TYPE_OPTIONS } from '@/config/constant'; import RequirePermission from '@/components/helper/RequirePermission'; +import { useFormikErrorList } from '@/services/hooks/useFormikErrorList'; +import AlertErrorList from '@/components/helper/form/FormErrors'; interface CustomerFormProps { formType?: 'add' | 'edit' | 'detail'; @@ -191,6 +193,9 @@ const CustomerForm = ({ formikSetValues(formikInitialValues); }, [formikSetValues, formikInitialValues]); + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); + // Render return ( <> @@ -213,7 +218,7 @@ const CustomerForm = ({ @@ -358,6 +363,8 @@ const CustomerForm = ({
)} + + {formType !== 'detail' && (
Submit diff --git a/src/components/pages/master-data/fcr/form/FcrForm.tsx b/src/components/pages/master-data/fcr/form/FcrForm.tsx index f30ec7e9..807e7e45 100644 --- a/src/components/pages/master-data/fcr/form/FcrForm.tsx +++ b/src/components/pages/master-data/fcr/form/FcrForm.tsx @@ -26,6 +26,8 @@ import { } from '@/types/api/master-data/fcr'; import { FcrApi } from '@/services/api/master-data'; import { cn } from '@/lib/helper'; +import AlertErrorList from '@/components/helper/form/FormErrors'; +import { useFormikErrorList } from '@/services/hooks/useFormikErrorList'; interface FcrFormProps { type?: 'add' | 'edit' | 'detail'; @@ -158,6 +160,9 @@ const FcrForm = ({ type = 'add', initialValues }: FcrFormProps) => { formikSetValues(formikInitialValues); }, [formikSetValues, formikInitialValues]); + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); + return ( <>
@@ -179,7 +184,7 @@ const FcrForm = ({ type = 'add', initialValues }: FcrFormProps) => { @@ -294,6 +299,8 @@ const FcrForm = ({ type = 'add', initialValues }: FcrFormProps) => { )}
+ +
{type !== 'add' && (
@@ -349,7 +356,7 @@ const FcrForm = ({ type = 'add', initialValues }: FcrFormProps) => { type='submit' color='primary' isLoading={formik.isSubmitting} - disabled={!formik.isValid || formik.isSubmitting} + disabled={formik.isSubmitting} className='px-4' > Submit diff --git a/src/components/pages/master-data/flock/form/FlockForm.tsx b/src/components/pages/master-data/flock/form/FlockForm.tsx index 5db61656..51ed4325 100644 --- a/src/components/pages/master-data/flock/form/FlockForm.tsx +++ b/src/components/pages/master-data/flock/form/FlockForm.tsx @@ -17,6 +17,8 @@ import TextInput from '@/components/input/TextInput'; import { cn } from '@/lib/helper'; import ConfirmationModal from '@/components/modal/ConfirmationModal'; import RequirePermission from '@/components/helper/RequirePermission'; +import AlertErrorList from '@/components/helper/form/FormErrors'; +import { useFormikErrorList } from '@/services/hooks/useFormikErrorList'; interface FlockCustomProps { formType?: 'add' | 'edit' | 'detail'; @@ -86,6 +88,9 @@ const FlockForm = ({ formType = 'add', initialValues }: FlockCustomProps) => { formikSetValues(formikInitialValue); }, [formikSetValues, formikInitialValue]); + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); + // Render return ( <> @@ -107,7 +112,7 @@ const FlockForm = ({ formType = 'add', initialValues }: FlockCustomProps) => { @@ -168,6 +173,8 @@ const FlockForm = ({ formType = 'add', initialValues }: FlockCustomProps) => {
)} + + {formType !== 'detail' && (
{ type='submit' color='primary' isLoading={formik.isSubmitting} - disabled={!formik.isValid || formik.isSubmitting} + disabled={formik.isSubmitting} className='px-4' > Submit diff --git a/src/components/pages/master-data/kandang/form/KandangForm.tsx b/src/components/pages/master-data/kandang/form/KandangForm.tsx index 81911ab0..ffea5718 100644 --- a/src/components/pages/master-data/kandang/form/KandangForm.tsx +++ b/src/components/pages/master-data/kandang/form/KandangForm.tsx @@ -29,6 +29,8 @@ import { LocationApi, KandangApi } from '@/services/api/master-data'; import { cn } from '@/lib/helper'; import { UserApi } from '@/services/api/user'; import NumberInput from '@/components/input/NumberInput'; +import { useFormikErrorList } from '@/services/hooks/useFormikErrorList'; +import AlertErrorList from '@/components/helper/form/FormErrors'; interface KandangFormProps { type?: 'add' | 'edit' | 'detail'; @@ -198,6 +200,9 @@ const KandangForm = ({ type = 'add', initialValues }: KandangFormProps) => { formikSetValues(formikInitialValues); }, [formikSetValues, formikInitialValues]); + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); + return ( <>
@@ -219,7 +224,7 @@ const KandangForm = ({ type = 'add', initialValues }: KandangFormProps) => { @@ -324,6 +329,8 @@ const KandangForm = ({ type = 'add', initialValues }: KandangFormProps) => {
)} + + {type !== 'detail' && (
{ type='submit' color='primary' isLoading={formik.isSubmitting} - disabled={!formik.isValid || formik.isSubmitting} + disabled={formik.isSubmitting} className='px-4' > Submit diff --git a/src/components/pages/master-data/location/form/LocationForm.tsx b/src/components/pages/master-data/location/form/LocationForm.tsx index 68a10527..9f77cf86 100644 --- a/src/components/pages/master-data/location/form/LocationForm.tsx +++ b/src/components/pages/master-data/location/form/LocationForm.tsx @@ -27,6 +27,8 @@ import { } from '@/types/api/master-data/location'; import { AreaApi, LocationApi } from '@/services/api/master-data'; import { cn } from '@/lib/helper'; +import { useFormikErrorList } from '@/services/hooks/useFormikErrorList'; +import AlertErrorList from '@/components/helper/form/FormErrors'; interface LocationFormProps { type?: 'add' | 'edit' | 'detail'; @@ -160,6 +162,9 @@ const LocationForm = ({ type = 'add', initialValues }: LocationFormProps) => { formikSetValues(formikInitialValues); }, [formikSetValues, formikInitialValues]); + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); + return ( <>
@@ -181,7 +186,7 @@ const LocationForm = ({ type = 'add', initialValues }: LocationFormProps) => { @@ -268,6 +273,8 @@ const LocationForm = ({ type = 'add', initialValues }: LocationFormProps) => {
)} + + {type !== 'detail' && (
{ type='submit' color='primary' isLoading={formik.isSubmitting} - disabled={!formik.isValid || formik.isSubmitting} + disabled={formik.isSubmitting} className='px-4' > Submit diff --git a/src/components/pages/master-data/nonstock/form/NonstockForm.tsx b/src/components/pages/master-data/nonstock/form/NonstockForm.tsx index af72f22f..7d8b8784 100644 --- a/src/components/pages/master-data/nonstock/form/NonstockForm.tsx +++ b/src/components/pages/master-data/nonstock/form/NonstockForm.tsx @@ -29,6 +29,8 @@ import { NonstockApi, SupplierApi, UomApi } from '@/services/api/master-data'; import { cn } from '@/lib/helper'; import { flags } from '@/types/api/api-general'; import { SUPPLIER_FLAG_OPTIONS } from '@/config/constant'; +import { useFormikErrorList } from '@/services/hooks/useFormikErrorList'; +import AlertErrorList from '@/components/helper/form/FormErrors'; interface NonstockFormProps { type?: 'add' | 'edit' | 'detail'; @@ -213,6 +215,9 @@ const NonstockForm = ({ type = 'add', initialValues }: NonstockFormProps) => { formikSetValues(formikInitialValues); }, [formikSetValues, formikInitialValues]); + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); + return ( <>
@@ -234,7 +239,7 @@ const NonstockForm = ({ type = 'add', initialValues }: NonstockFormProps) => { @@ -337,6 +342,8 @@ const NonstockForm = ({ type = 'add', initialValues }: NonstockFormProps) => {
)} + + {type !== 'detail' && (
{ type='submit' color='primary' isLoading={formik.isSubmitting} - disabled={!formik.isValid || formik.isSubmitting} + disabled={formik.isSubmitting} className='px-4' > Submit diff --git a/src/components/pages/master-data/product-category/form/ProductCategoryForm.tsx b/src/components/pages/master-data/product-category/form/ProductCategoryForm.tsx index d241a3dd..1e61879c 100644 --- a/src/components/pages/master-data/product-category/form/ProductCategoryForm.tsx +++ b/src/components/pages/master-data/product-category/form/ProductCategoryForm.tsx @@ -11,7 +11,6 @@ import TextInput from '@/components/input/TextInput'; import { useModal } from '@/components/Modal'; import ConfirmationModal from '@/components/modal/ConfirmationModal'; import RequirePermission from '@/components/helper/RequirePermission'; -import { getUniqueFormikErrors } from '@/lib/formik-helper'; import AlertErrorList from '@/components/helper/form/FormErrors'; import { @@ -27,6 +26,7 @@ import { } from '@/types/api/master-data/product-category'; import { ProductCategoryApi } from '@/services/api/master-data'; import { cn } from '@/lib/helper'; +import { useFormikErrorList } from '@/services/hooks/useFormikErrorList'; interface ProductCategoryFormProps { type?: 'add' | 'edit' | 'detail'; @@ -41,7 +41,6 @@ const ProductCategoryForm = ({ const deleteModal = useModal(); const [formErrorMessage, setFormErrorMessage] = useState(''); - const [formErrorList, setFormErrorList] = useState([]); const [isDeleteLoading, setIsDeleteLoading] = useState(false); const createProductCategoryHandler = useCallback( @@ -132,21 +131,8 @@ const ProductCategoryForm = ({ formikSetValues(formikInitialValues); }, [formikSetValues, formikInitialValues]); - const handleValidateForm = async () => { - const errors = await formik.validateForm(); - - if (Object.keys(errors).length > 0) { - const errorMessages = getUniqueFormikErrors(errors); - setFormErrorList(errorMessages); - return; - } - }; - - const handleFormSubmit = (e: React.FormEvent) => { - e.preventDefault(); - handleValidateForm(); - formik.handleSubmit(e); - }; + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); return ( <> @@ -184,13 +170,7 @@ const ProductCategoryForm = ({
)} - {/* Error List Alert */} - {formErrorList.length > 0 && ( - setFormErrorList([])} - /> - )} +
{ const deleteModal = useModal(); const [productFormErrorMessage, setProductFormErrorMessage] = useState(''); - const [formErrorList, setFormErrorList] = useState([]); const [isDeleteLoading, setIsDeleteLoading] = useState(false); const createProductHandler = useCallback( @@ -204,21 +204,8 @@ const ProductForm = ({ type = 'add', initialValues }: ProductFormProps) => { formikSetValues(formikInitialValues); }, [formikSetValues, formikInitialValues]); - const handleValidateForm = async () => { - const errors = await formik.validateForm(); - - if (Object.keys(errors).length > 0) { - const errorMessages = getUniqueFormikErrors(errors); - setFormErrorList(errorMessages); - return; - } - }; - - const handleFormSubmit = (e: React.FormEvent) => { - e.preventDefault(); - handleValidateForm(); - formik.handleSubmit(e); - }; + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); return ( <> @@ -254,13 +241,7 @@ const ProductForm = ({ type = 'add', initialValues }: ProductFormProps) => {
)} - {/* Error List Alert */} - {formErrorList.length > 0 && ( - setFormErrorList([])} - /> - )} +
{ switch (formType) { case 'add': @@ -723,7 +727,8 @@ const ProductionStandardForm = ({ router.push('/master-data/production-standard'); }; - // ===== Function ===== + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); return ( <> @@ -1210,9 +1215,26 @@ const ProductionStandardForm = ({ return null; }} /> + + + + {productionStandardFormErrorMessage && ( + +
+ + {productionStandardFormErrorMessage} +
+ setProductionStandardFormErrorMessage('')} + className='ms-auto' + /> + + )} + {formType === 'detail' && (
@@ -1293,19 +1315,6 @@ const ProductionStandardForm = ({
)} - {productionStandardFormErrorMessage && ( - -
- - {productionStandardFormErrorMessage} -
- setProductionStandardFormErrorMessage('')} - className='ms-auto' - /> - - )}
@@ -221,7 +226,7 @@ const SupplierForm = ({
@@ -444,6 +449,8 @@ const SupplierForm = ({
)} + + {formType !== 'detail' && (
Submit diff --git a/src/components/pages/master-data/uom/form/UomForm.tsx b/src/components/pages/master-data/uom/form/UomForm.tsx index 50576eef..366f9682 100644 --- a/src/components/pages/master-data/uom/form/UomForm.tsx +++ b/src/components/pages/master-data/uom/form/UomForm.tsx @@ -25,6 +25,8 @@ import { } from '@/types/api/master-data/uom'; import { UomApi } from '@/services/api/master-data'; import { cn } from '@/lib/helper'; +import { useFormikErrorList } from '@/services/hooks/useFormikErrorList'; +import AlertErrorList from '@/components/helper/form/FormErrors'; interface UomFormProps { type?: 'add' | 'edit' | 'detail'; @@ -118,6 +120,9 @@ const UomForm = ({ type = 'add', initialValues }: UomFormProps) => { formikSetValues(formikInitialValues); }, [formikSetValues, formikInitialValues]); + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); + return ( <>
@@ -139,7 +144,7 @@ const UomForm = ({ type = 'add', initialValues }: UomFormProps) => { @@ -199,6 +204,8 @@ const UomForm = ({ type = 'add', initialValues }: UomFormProps) => {
)} + + {type !== 'detail' && (
{ type='submit' color='primary' isLoading={formik.isSubmitting} - disabled={!formik.isValid || formik.isSubmitting} + disabled={formik.isSubmitting} className='px-4' > Submit diff --git a/src/components/pages/master-data/warehouse/form/WarehouseForm.tsx b/src/components/pages/master-data/warehouse/form/WarehouseForm.tsx index 227af3c6..0fb55a2a 100644 --- a/src/components/pages/master-data/warehouse/form/WarehouseForm.tsx +++ b/src/components/pages/master-data/warehouse/form/WarehouseForm.tsx @@ -33,6 +33,8 @@ import { } from '@/services/api/master-data'; import { cn } from '@/lib/helper'; import { WAREHOUSE_TYPE_OPTIONS } from '@/config/constant'; +import { useFormikErrorList } from '@/services/hooks/useFormikErrorList'; +import AlertErrorList from '@/components/helper/form/FormErrors'; interface WarehouseFormProps { type?: 'add' | 'edit' | 'detail'; @@ -323,6 +325,9 @@ const WarehouseForm = ({ type = 'add', initialValues }: WarehouseFormProps) => { formikSetValues(formikInitialValues); }, [formikSetValues, formikInitialValues]); + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); + return ( <>
@@ -344,7 +349,7 @@ const WarehouseForm = ({ type = 'add', initialValues }: WarehouseFormProps) => { @@ -474,6 +479,8 @@ const WarehouseForm = ({ type = 'add', initialValues }: WarehouseFormProps) => {
)} + + {type !== 'detail' && (
{ type='submit' color='primary' isLoading={formik.isSubmitting} - disabled={!formik.isValid || formik.isSubmitting} + disabled={formik.isSubmitting} className='px-4' > Submit diff --git a/src/components/pages/production/project-flock/detail/ProjectFlockDetail.tsx b/src/components/pages/production/project-flock/detail/ProjectFlockDetail.tsx index 9835c244..4a998c83 100644 --- a/src/components/pages/production/project-flock/detail/ProjectFlockDetail.tsx +++ b/src/components/pages/production/project-flock/detail/ProjectFlockDetail.tsx @@ -209,20 +209,6 @@ const ProjectFlockDetail = ({
- {/*
- History -
-
- -
*/} - {/* BARIS 1 */}
{projectFlock?.fcr?.name}
+
+ {' '} + Standard +
+
+ {projectFlock?.production_standard?.name ?? '-'} +
+ {/* BARIS 3 (Terakhir - TIDAK PERLU garis di bawahnya) */}
{' '} diff --git a/src/components/pages/production/project-flock/form/ProjectFlockForm.tsx b/src/components/pages/production/project-flock/form/ProjectFlockForm.tsx index 7e90c94b..745a6b1e 100644 --- a/src/components/pages/production/project-flock/form/ProjectFlockForm.tsx +++ b/src/components/pages/production/project-flock/form/ProjectFlockForm.tsx @@ -6,7 +6,6 @@ import SelectInput, { useSelect, } from '@/components/input/SelectInput'; import { isResponseError, isResponseSuccess } from '@/lib/api-helper'; -import { getUniqueFormikErrors } from '@/lib/formik-helper'; import AlertErrorList from '@/components/helper/form/FormErrors'; import { AreaApi, @@ -47,6 +46,7 @@ import { Nonstock } from '@/types/api/master-data/nonstock'; import { useUiStore } from '@/stores/ui/ui.store'; import RequirePermission from '@/components/helper/RequirePermission'; import DrawerHeader from '@/components/helper/drawer/DrawerHeader'; +import { useFormikErrorList } from '@/services/hooks/useFormikErrorList'; interface ProjectFlockFormProps { formType?: 'add' | 'edit' | 'detail'; @@ -66,7 +66,6 @@ const ProjectFlockForm = ({ const [projectFlockFormErrorMessage, setProjectFlockFormErrorMessage] = useState(''); - const [formErrorList, setFormErrorList] = useState([]); const [selectedArea, setSelectedArea] = useState(''); const [selectedLocation, setSelectedLocation] = useState(''); const [selectedCategory, setSelectedCategory] = useState(''); @@ -642,16 +641,8 @@ const ProjectFlockForm = ({ return !isNonstockAlreadyInBudgets; }); - const handleValidateForm = async () => { - const errors = await formik.validateForm(); - - if (Object.keys(errors).length > 0) { - // Parse and display errors - const errorMessages = getUniqueFormikErrors(errors); - setFormErrorList(errorMessages); - return; // Stop submission - } - }; + // ===== Formik Error List ===== + const { formErrorList, close, handleFormSubmit } = useFormikErrorList(formik); return ( <> @@ -712,11 +703,7 @@ const ProjectFlockForm = ({ { - e.preventDefault(); - handleValidateForm(); - formik.handleSubmit(e); - }} + onSubmit={handleFormSubmit} onReset={formik.handleReset} > {/* Form Informasi Umum */} @@ -1082,13 +1069,7 @@ const ProjectFlockForm = ({
- {/* Error List Alert */} - {formErrorList.length > 0 && ( - setFormErrorList([])} - /> - )} +
{formType !== 'detail' && ( diff --git a/src/config/constant.ts b/src/config/constant.ts index 77e210a2..364f1824 100644 --- a/src/config/constant.ts +++ b/src/config/constant.ts @@ -60,6 +60,12 @@ export const MAIN_DRAWER_LINKS: SidebarMenuItem[] = [ // TODO: add permission // permission: ['lti.daily_checklist.list'], }, + { + text: 'Konfigurasi', + link: '/daily-checklist/master-data/configuration', + // TODO: add permission + // permission: ['lti.daily_checklist.list'], + }, ], }, ], diff --git a/src/config/route-permission.ts b/src/config/route-permission.ts index 5b230a43..9a0c9d2e 100644 --- a/src/config/route-permission.ts +++ b/src/config/route-permission.ts @@ -20,6 +20,7 @@ export const ROUTE_PERMISSIONS: Record = { '/daily-checklist/reports/': ['lti.dashboard.list'], '/daily-checklist/master-data/employee/': ['lti.dashboard.list'], '/daily-checklist/master-data/activity/': ['lti.dashboard.list'], + '/daily-checklist/master-data/configuration/': ['lti.dashboard.list'], // Production // Production - Project Flock diff --git a/src/figma-make/components/pages/daily-checklist/DailyChecklistContent.tsx b/src/figma-make/components/pages/daily-checklist/DailyChecklistContent.tsx index ae704e92..7bd0be83 100644 --- a/src/figma-make/components/pages/daily-checklist/DailyChecklistContent.tsx +++ b/src/figma-make/components/pages/daily-checklist/DailyChecklistContent.tsx @@ -30,7 +30,7 @@ import { KandangApi } from '@/services/api/master-data'; import { DailyChecklistApi } from '@/services/api/daily-checklist/daily-checklist'; import { isResponseError, isResponseSuccess } from '@/lib/api-helper'; import useSWR from 'swr'; -import { BaseApiResponse } from '@/types/api/api-general'; +import { BaseApiResponse, Document } from '@/types/api/api-general'; import { AxiosError } from 'axios'; import { httpClientFetcher, SWRHttpKey } from '@/services/http/client'; import { PhaseApi } from '@/services/api/daily-checklist/phase'; @@ -39,6 +39,9 @@ import { Employee } from '@/types/api/daily-checklist/employee'; import { PhaseActivityApi } from '@/services/api/daily-checklist/phase-activity'; import { PhaseActivity } from '@/types/api/daily-checklist/phase-activity'; import DebouncedTextArea from '@/components/input/DebouncedTextArea'; +import DropFileInput from '@/components/input/DropFileInput'; +import Link from 'next/link'; +import { Icon } from '@iconify/react'; // Static categories const CATEGORIES = [ @@ -148,6 +151,10 @@ export function DailyChecklistContent() { const [loading, setLoading] = useState(false); const [initialLoading, setInitialLoading] = useState(true); + const [existingDocuments, setExistingDocuments] = useState([]); + const [documents, setDocuments] = useState([]); + const [deletedDocumentIds, setDeletedDocumentIds] = useState([]); + // Format date for display const formatDateForDisplay = (dateStr: string) => { if (!dateStr) return 'Pilih tanggal'; @@ -340,6 +347,9 @@ export function DailyChecklistContent() { return; } + // set existing document + setExistingDocuments(existingDailyChecklist?.data.document_urls || []); + // Build assignments map const assignmentMap: { [taskId: string]: { @@ -729,7 +739,11 @@ export function DailyChecklistContent() { setLoading(true); try { - const submitRes = await DailyChecklistApi.submit(dailyChecklistId); + const submitRes = await DailyChecklistApi.submit( + dailyChecklistId, + documents, + deletedDocumentIds + ); if (isResponseError(submitRes)) { console.error('Error submitting:', submitRes.message); @@ -750,6 +764,19 @@ export function DailyChecklistContent() { const handleSaveDraft = async () => { if (!dailyChecklistId) return; + const uploadImageRes = await DailyChecklistApi.uploadImage( + Number(dailyChecklistId), + 'DRAFT', + documents, + deletedDocumentIds + ); + + if (isResponseError(uploadImageRes)) { + console.error('Error saving draft:', uploadImageRes.message); + toast.error('Gagal menyimpan draft'); + return; + } + toast.success('Draft tersimpan otomatis'); }; @@ -1263,6 +1290,94 @@ export function DailyChecklistContent() {
)} + {dailyChecklistId && + selectedPhaseIds.length > 0 && + selectedEmployees.length > 0 && ( + <> + {existingDocuments.length > 0 && ( +
+

+ Dokumen yang telah diupload +

+ {existingDocuments.map( + (existingDocument, existingDocumentIdx) => ( +
+ + {existingDocument.name}{' '} + + + + +
+ ) + )} +
+ )} + + { + setDocuments(files); + }} + onDelete={(deletedFileIdx: number) => { + const newRequestDocuments = [...documents]; + + newRequestDocuments?.splice(deletedFileIdx, 1); + + setDocuments(newRequestDocuments); + }} + className={{ + wrapper: 'mt-6', + inputWrapper: 'flex items-center', + label: 'font-semibold text-gray-900', + }} + /> + + )} + {/* Action Buttons */} {dailyChecklistId && selectedPhaseIds.length > 0 && diff --git a/src/figma-make/components/pages/dashboard/Dashboard.tsx b/src/figma-make/components/pages/dashboard/Dashboard.tsx index 5d866ffc..f6d12d79 100644 --- a/src/figma-make/components/pages/dashboard/Dashboard.tsx +++ b/src/figma-make/components/pages/dashboard/Dashboard.tsx @@ -1,6 +1,6 @@ 'use client'; -import { useState, useEffect } from 'react'; +import { useState } from 'react'; import { Card, CardContent, @@ -15,7 +15,6 @@ import { SelectTrigger, SelectValue, } from '@/figma-make/components/base/select'; -import { Input } from '@/figma-make/components/base/input'; import { Badge } from '@/figma-make/components/base/badge'; import { Calendar as CalendarIcon, @@ -35,53 +34,17 @@ import { ResponsiveContainer, Cell, } from 'recharts'; -import { supabase, isSupabaseConfigured } from '@/figma-make/lib/supabase'; import { toast } from 'sonner'; - -interface EmployeePerformance { - employee_id: string; - employee_name: string; - kandang_id: string; - kandang_name: string; - total_activities_in_category: number; // Total aktivitas di kategori - completed_activities: number; // Aktivitas yang sudah di-check - completion_rate: number; - last_activity_date: string | null; - color: string; // Color based on kandang -} - -interface Kandang { - id: string; - name: string; -} - -interface Category { - id: string; - name: string; -} - -interface ChecklistKandang { - id: string; - date: string; - kandang_id: string; - category: string; - kandang: { - id: string; - name: string; - } | null; -} - -interface AssignmentEmployee { - id: string; - task_id: string; - employee_id: string; - checked: boolean; - updated_at: string; - employee: { - id: string; - name: string; - } | null; -} +import useSWR from 'swr'; +import { BaseApiResponse } from '@/types/api/api-general'; +import { DailyChecklistSummary } from '@/types/api/daily-checklist/daily-checklist'; +import { AxiosError } from 'axios'; +import { httpClientFetcher, SWRHttpKey } from '@/services/http/client'; +import { DailyChecklistApi } from '@/services/api/daily-checklist/daily-checklist'; +import { KandangApi } from '@/services/api/master-data'; +import { useSelect } from '@/components/input/SelectInput'; +import { isResponseError, isResponseSuccess } from '@/lib/api-helper'; +import { formatDate } from '@/lib/helper'; const KANDANG_COLORS = [ '#0069e0', // Blue (primary) @@ -102,312 +65,65 @@ const CATEGORY_LABELS: { [key: string]: string } = { }; export function Dashboard() { - const [loading, setLoading] = useState(false); - const [employeePerformance, setEmployeePerformance] = useState< - EmployeePerformance[] - >([]); - - // Master data - const [kandangList, setKandangList] = useState([]); - const [categoryList, setCategoryList] = useState([]); - // Filters const [dateFrom, setDateFrom] = useState(''); const [dateTo, setDateTo] = useState(''); const [kandangFilter, setKandangFilter] = useState('ALL'); const [categoryFilter, setCategoryFilter] = useState('ALL'); - // Color mapping for kandang - const [kandangColorMap, setKandangColorMap] = useState<{ - [key: string]: string; - }>({}); - - useEffect(() => { - fetchMasterData(); - }, []); - - useEffect(() => { - // Only fetch when date filters are set - if (dateFrom && dateTo) { - fetchEmployeePerformance(); - } else { - setEmployeePerformance([]); + const { + data: summaryResponse, + isLoading: isLoadingSummary, + mutate: refreshSummary, + } = useSWR< + BaseApiResponse, + AxiosError, + SWRHttpKey + >( + dateFrom && dateTo + ? `${DailyChecklistApi.basePath}/summary?date_from=${dateFrom}&date_to=${dateTo}&kandang_id=${kandangFilter === 'ALL' ? '' : kandangFilter}&category=${categoryFilter === 'ALL' ? '' : categoryFilter}` + : '', + httpClientFetcher, + { + keepPreviousData: true, } - }, [dateFrom, dateTo, kandangFilter, categoryFilter]); + ); - const fetchMasterData = async () => { - if (!isSupabaseConfigured()) return; - - try { - // Fetch kandang - const { data: kandangData, error: kandangError } = await supabase - .from('kandang') - .select('id, name') - .order('name', { ascending: true }); - - if (kandangError) { - console.error('Error fetching kandang:', kandangError); - } else { - setKandangList(kandangData || []); - - // Create color mapping - const colorMap: { [key: string]: string } = {}; - (kandangData || []).forEach((k, index) => { - colorMap[k.id] = KANDANG_COLORS[index % KANDANG_COLORS.length]; - }); - setKandangColorMap(colorMap); - } - - // Set categories from CATEGORY_LABELS (hardcoded list) - const categories: Category[] = Object.keys(CATEGORY_LABELS).map((id) => ({ - id, - name: CATEGORY_LABELS[id], - })); - setCategoryList(categories); - } catch (error) { - console.error('Error fetching master data:', error); - } - }; - - const fetchEmployeePerformance = async () => { - if (!isSupabaseConfigured() || !dateFrom || !dateTo) { - return; - } - - try { - setLoading(true); - - // Step 1: Get all checklists in date range + filters - let checklistQuery = supabase - .from('daily_checklists') - .select( - ` - id, - date, - kandang_id, - category, - kandang:kandang_id ( - id, - name - ) - ` - ) - .gte('date', dateFrom) - .lte('date', dateTo); - - if (kandangFilter !== 'ALL') { - checklistQuery = checklistQuery.eq('kandang_id', kandangFilter); - } - - if (categoryFilter !== 'ALL') { - checklistQuery = checklistQuery.eq('category', categoryFilter); - } - - const { data: checklists, error: checklistError } = await checklistQuery; - - if (checklistError) { - console.error('Error fetching checklists:', checklistError); - toast.error('Gagal memuat data checklist'); - return; - } - - if (!checklists || checklists.length === 0) { - setEmployeePerformance([]); - return; - } - - const checklistsData = checklists as unknown as ChecklistKandang[]; - - // Step 2: Get all tasks from these checklists - const checklistIds = checklistsData.map((c) => c.id); - const { data: tasks, error: tasksError } = await supabase - .from('daily_checklist_activity_tasks') - .select('id, checklist_id') - .in('checklist_id', checklistIds); - - if (tasksError) { - console.error('Error fetching tasks:', tasksError); - return; - } - - if (!tasks || tasks.length === 0) { - setEmployeePerformance([]); - return; - } - - const taskIds = tasks.map((t) => t.id); - - // Step 3: Get all assignments for these tasks - const { data: assignments, error: assignmentsError } = await supabase - .from('daily_checklist_activity_task_assignments') - .select( - ` - id, - task_id, - employee_id, - checked, - updated_at, - employee:employee_id ( - id, - name - ) - ` - ) - .in('task_id', taskIds); - - if (assignmentsError) { - console.error('Error fetching assignments:', assignmentsError); - return; - } - - if (!assignments || assignments.length === 0) { - setEmployeePerformance([]); - return; - } - - const assignmentsData = assignments as unknown as AssignmentEmployee[]; - - // Step 4: Calculate total activities in selected category (if filtered) - let totalActivitiesInCategory = 0; - - if (categoryFilter !== 'ALL') { - // Get total activities from master data for this category - const { data: phases } = await supabase - .from('phases') - .select('id') - .eq('category_id', categoryFilter); - - if (phases && phases.length > 0) { - const phaseIds = phases.map((p) => p.id); - const { count } = await supabase - .from('activities') - .select('*', { count: 'exact', head: true }) - .in('phase_id', phaseIds); - - totalActivitiesInCategory = count || 0; - } - } - - // Step 5: Group by employee and calculate performance - const employeeMap = new Map< - string, - { - employee_id: string; - employee_name: string; - kandang_id: string; - kandang_name: string; - completed_count: number; - total_count: number; - last_activity_date: string | null; - } - >(); - - assignmentsData.forEach((assignment) => { - const task = tasks.find((t) => t.id === assignment.task_id); - if (!task) return; - - const checklist = checklistsData.find( - (c) => c.id === task.checklist_id - ); - if (!checklist) return; - - const employeeId = assignment.employee_id; - const employeeName = assignment.employee?.name || 'Unknown'; - const kandangId = checklist.kandang_id; - const kandangName = checklist.kandang?.name || 'Unknown'; - - if (!employeeMap.has(employeeId)) { - employeeMap.set(employeeId, { - employee_id: employeeId, - employee_name: employeeName, - kandang_id: kandangId, - kandang_name: kandangName, - completed_count: 0, - total_count: 0, - last_activity_date: null, - }); - } - - const empData = employeeMap.get(employeeId)!; - empData.total_count += 1; - - if (assignment.checked) { - empData.completed_count += 1; - } - - // Update last activity date - if (assignment.updated_at) { - if ( - !empData.last_activity_date || - assignment.updated_at > empData.last_activity_date - ) { - empData.last_activity_date = assignment.updated_at; - } - } - }); - - // Step 6: Convert to array and add calculated fields - const performanceData: EmployeePerformance[] = Array.from( - employeeMap.values() - ).map((emp) => { - // Use total activities in category if category is selected, otherwise use employee's assigned count - const totalActivities = - categoryFilter !== 'ALL' && totalActivitiesInCategory > 0 - ? totalActivitiesInCategory - : emp.total_count; - - return { - employee_id: emp.employee_id, - employee_name: emp.employee_name, - kandang_id: emp.kandang_id, - kandang_name: emp.kandang_name, - total_activities_in_category: totalActivities, - completed_activities: emp.completed_count, - completion_rate: - totalActivities > 0 - ? Math.round((emp.completed_count / totalActivities) * 100) - : 0, - last_activity_date: emp.last_activity_date, - color: kandangColorMap[emp.kandang_id] || '#0069e0', - }; - }); - - // Sort by employee name - performanceData.sort((a, b) => - a.employee_name.localeCompare(b.employee_name) - ); - - setEmployeePerformance(performanceData); - } catch (error) { - console.error('Error fetching employee performance:', error); - toast.error('Terjadi kesalahan saat memuat data'); - } finally { - setLoading(false); - } - }; - - const formatDate = (dateString: string | null) => { - if (!dateString) return '-'; - const date = new Date(dateString); - return date.toLocaleDateString('id-ID', { - day: '2-digit', - month: 'short', - year: 'numeric', + const { options: kandangOptions, isLoadingOptions: isLoadingKandangs } = + useSelect(KandangApi.basePath, 'id', 'name', 'search', { + page: '1', + limit: '100', }); - }; - const hasFilters = dateFrom && dateTo; + const kandangColorMap: { [key: string]: string } = {}; + (kandangOptions || []).forEach((k, index) => { + kandangColorMap[k.value] = KANDANG_COLORS[index % KANDANG_COLORS.length]; + }); - // Prepare chart data - const chartData = employeePerformance.map((emp) => ({ + const employeePerformance = isResponseSuccess(summaryResponse) + ? summaryResponse.data?.tracking_abk.map((abk) => { + return { + ...abk, + color: kandangColorMap[abk.kandang_id] || '#0069e0', + }; + }) + : []; + + const chartData = employeePerformance?.map((emp) => ({ name: emp.employee_name, - completed: emp.completed_activities, - remaining: emp.total_activities_in_category - emp.completed_activities, - total: emp.total_activities_in_category, + completed: emp.activity_done, + remaining: emp.activity_left, + total: emp.total_activity, color: emp.color, kandang: emp.kandang_name, })); + const hasFilters = dateFrom && dateTo; + + if (summaryResponse && isResponseError(summaryResponse)) { + toast.error('Gagal memuat data: ' + summaryResponse.message); + } + return (
@@ -457,9 +173,12 @@ export function Dashboard() { Semua Kandang - {kandangList.map((kandang) => ( - - {kandang.name} + {kandangOptions.map((kandang) => ( + + {kandang.label} ))} @@ -482,9 +201,9 @@ export function Dashboard() { Semua Kategori - {categoryList.map((category) => ( - - {category.name} + {Object.keys(CATEGORY_LABELS).map((category) => ( + + {CATEGORY_LABELS[category]} ))} @@ -523,11 +242,11 @@ export function Dashboard() { melihat performance ABK.

- ) : loading ? ( + ) : isLoadingSummary ? (
Memuat data...
- ) : employeePerformance.length === 0 ? ( + ) : employeePerformance && employeePerformance.length === 0 ? (

@@ -582,7 +301,7 @@ export function Dashboard() { fill='#10B981' radius={[0, 0, 0, 0]} > - {chartData.map((entry, index) => ( + {chartData?.map((entry, index) => ( - {chartData.map((entry, index) => ( + {chartData?.map((entry, index) => ( {/* Employee Tracking Table */} - {hasFilters && employeePerformance.length > 0 && ( - - - Tracking ABK -

- Detail performance masing-masing ABK -

- - -
- - - - - - - - - - - - - - {employeePerformance.map((emp, index) => ( - - - - - - - - + {hasFilters && + employeePerformance && + employeePerformance.length > 0 && ( + + + Tracking ABK +

+ Detail performance masing-masing ABK +

+ + +
+
- Nama ABK - - Kandang - - Total Aktivitas - - Aktivitas Selesai - - Aktivitas Tersisa - - Completion Rate - - Last Activity -
- {emp.employee_name} - - - {emp.kandang_name} - - - {emp.total_activities_in_category} - - {emp.completed_activities} - - {emp.total_activities_in_category - - emp.completed_activities} - -
-
-
-
- - {emp.completion_rate}% - -
-
- {formatDate(emp.last_activity_date)} -
+ + + + + + + + + - ))} - -
+ Nama ABK + + Kandang + + Total Aktivitas + + Aktivitas Selesai + + Aktivitas Tersisa + + Completion Rate + + Last Activity +
-
- - - )} + + + {employeePerformance?.map((emp, index) => ( + + + {emp.employee_name} + + + + {emp.kandang_name} + + + + {emp.total_activity} + + + {emp.activity_done} + + + {emp.activity_left} + + +
+
+
+
+ + {emp.completion_rate}% + +
+ + + {formatDate(emp.last_activity, 'DD MMM YYYY')} + + + ))} + + +
+ + + )}

); diff --git a/src/figma-make/components/pages/list-daily-checklist/detail/DetailDailyChecklistContent.tsx b/src/figma-make/components/pages/list-daily-checklist/detail/DetailDailyChecklistContent.tsx index 54e4c93f..a867c29d 100644 --- a/src/figma-make/components/pages/list-daily-checklist/detail/DetailDailyChecklistContent.tsx +++ b/src/figma-make/components/pages/list-daily-checklist/detail/DetailDailyChecklistContent.tsx @@ -20,6 +20,9 @@ import { toast } from 'sonner'; import { useRouter, useSearchParams } from 'next/navigation'; import { DailyChecklistApi } from '@/services/api/daily-checklist/daily-checklist'; import { isResponseError } from '@/lib/api-helper'; +import Link from 'next/link'; +import { Icon } from '@iconify/react'; +import { Document } from '@/types/api/api-general'; interface ChecklistDetailRow { checklist_id: string; @@ -125,6 +128,7 @@ export function DetailDailyChecklistContent() { const [employees, setEmployees] = useState<{ id: string; name: string }[]>( [] ); + const [documents, setDocuments] = useState([]); // Modals const [showApproveModal, setShowApproveModal] = useState(false); @@ -160,6 +164,8 @@ export function DetailDailyChecklistContent() { const rawDetailChecklist = checklistDataRes?.data; + setDocuments(rawDetailChecklist?.document_urls || []); + const checklistData = { id: rawDetailChecklist?.id, date: rawDetailChecklist?.date, @@ -842,6 +848,37 @@ export function DetailDailyChecklistContent() { Tidak ada data aktivitas
)} + + {documents.length > 0 && ( +
+

+ Dokumen yang telah diupload +

+ +
    + {documents.map((existingDocument, existingDocumentIdx) => ( +
  • +
    + + {existingDocument.name}{' '} + + +
    +
    • + ))} +
+
+ )} diff --git a/src/figma-make/components/pages/master-data/activity/MasterAktivitasContent.tsx b/src/figma-make/components/pages/master-data/activity/MasterAktivitasContent.tsx index a5b8ac3d..36774ce2 100644 --- a/src/figma-make/components/pages/master-data/activity/MasterAktivitasContent.tsx +++ b/src/figma-make/components/pages/master-data/activity/MasterAktivitasContent.tsx @@ -328,6 +328,7 @@ export function MasterAktivitasContent() { return; } + refreshPhases(); refreshPhaseActivities(); toast.success('Aktivitas berhasil ditambahkan'); } else { @@ -349,6 +350,7 @@ export function MasterAktivitasContent() { return; } + refreshPhases(); refreshPhaseActivities(); toast.success('Aktivitas berhasil diubah'); } @@ -387,6 +389,7 @@ export function MasterAktivitasContent() { return; } + refreshPhases(); refreshPhaseActivities(); toast.success('Aktivitas berhasil dihapus'); setShowActivityDeleteConfirm(false); diff --git a/src/figma-make/components/pages/master-data/configuration/MasterConfigurationContent.tsx b/src/figma-make/components/pages/master-data/configuration/MasterConfigurationContent.tsx new file mode 100644 index 00000000..1358d6ba --- /dev/null +++ b/src/figma-make/components/pages/master-data/configuration/MasterConfigurationContent.tsx @@ -0,0 +1,564 @@ +'use client'; + +import { useState } from 'react'; +import { Plus, MoreVertical, Pencil, Trash2 } from 'lucide-react'; +import { Card, CardContent } from '@/figma-make/components/base/card'; +import { Button } from '@/figma-make/components/base/button'; +import { Label } from '@/figma-make/components/base/label'; +import { Input } from '@/figma-make/components/base/input'; +import { + Dialog, + DialogContent, + DialogHeader, + DialogTitle, + DialogDescription, + DialogFooter, +} from '@/figma-make/components/base/dialog'; +import { + AlertDialog, + AlertDialogAction, + AlertDialogCancel, + AlertDialogContent, + AlertDialogDescription, + AlertDialogFooter, + AlertDialogHeader, + AlertDialogTitle, +} from '@/figma-make/components/base/alert-dialog'; +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuTrigger, +} from '@/figma-make/components/base/dropdown-menu'; +import { toast } from 'sonner'; +import useSWR from 'swr'; +import Table from '@/components/Table'; +import { isResponseError, isResponseSuccess } from '@/lib/api-helper'; +import { cn, formatDate } from '@/lib/helper'; +import { useTableFilter } from '@/services/hooks/useTableFilter'; +import { ColumnDef } from '@tanstack/react-table'; +import { DailyChecklistConfiguration } from '@/types/api/daily-checklist/configuration'; +import { DailyChecklistConfigurationApi } from '@/services/api/daily-checklist/configuration'; +import { DatePicker } from '@/figma-make/components/base/date-picker'; + +export function MasterConfigurationContent() { + const { + state: tableFilterState, + setPage, + setPageSize, + toQueryString: getTableFilterQueryString, + } = useTableFilter({ + initial: { + search: '', + }, + paramMap: { + page: 'page', + pageSize: 'limit', + }, + }); + + const { + data: dailyChecklistConfigurations, + isLoading: isLoadingDailyChecklistConfigurations, + mutate: refreshDailyChecklistConfigurations, + } = useSWR( + `${DailyChecklistConfigurationApi.basePath}${getTableFilterQueryString()}`, + DailyChecklistConfigurationApi.getAllFetcher, + { + keepPreviousData: true, + } + ); + + const [showModal, setShowModal] = useState(false); + const [showDeleteConfirm, setShowDeleteConfirm] = useState(false); + const [configurationToDelete, setConfigurationToDelete] = useState< + number | null + >(null); + const [loading, setLoading] = useState(false); + const [modalMode, setModalMode] = useState<'create' | 'edit'>('create'); + const [configurationForm, setConfigurationForm] = useState({ + id: 0, + date: '', + percentage_threshold_bad: '', + percentage_threshold_enough: '', + }); + + const configurationColumns: ColumnDef[] = [ + { + id: 'date', + header: 'Tanggal', + accessorKey: 'date', + enableSorting: false, + cell: ({ row }) => formatDate(row.original.date, 'DD MMM YYYY'), + }, + { + id: 'percentage_threshold_bad', + header: 'Threshold Bad', + accessorKey: 'percentage_threshold_bad', + enableSorting: false, + cell: ({ row }) => `${row.original.percentage_threshold_bad}%`, + }, + { + id: 'percentage_threshold_enough', + header: 'Threshold Enough', + accessorKey: 'percentage_threshold_enough', + enableSorting: false, + cell: ({ row }) => `${row.original.percentage_threshold_enough}%`, + }, + { + id: 'action', + header: 'Aksi', + accessorKey: 'action', + enableSorting: false, + cell: ({ row }) => ( + + + + + + handleEdit(row.original)}> + + Edit + + handleDeleteClick(row.original.id)} + className='text-red-600' + > + + Hapus + + + + ), + }, + ]; + + const handleAdd = () => { + setModalMode('create'); + setConfigurationForm({ + id: 0, + date: '', + percentage_threshold_bad: '', + percentage_threshold_enough: '', + }); + setShowModal(true); + }; + + const handleEdit = (configuration: DailyChecklistConfiguration) => { + setModalMode('edit'); + setConfigurationForm({ + id: configuration.id, + date: configuration.date, + percentage_threshold_bad: String(configuration.percentage_threshold_bad), + percentage_threshold_enough: String( + configuration.percentage_threshold_enough + ), + }); + setShowModal(true); + }; + + const handleSave = async () => { + if ( + !configurationForm.date.trim() || + Number(configurationForm.percentage_threshold_bad) === 0 || + Number(configurationForm.percentage_threshold_enough) === 0 + ) { + toast.error('Tanggal dan persentase harus diisi'); + return; + } + + setLoading(true); + + try { + if (modalMode === 'create') { + const createConfigurationResponse = + await DailyChecklistConfigurationApi.create({ + date: formatDate(configurationForm.date, 'YYYY-MM-DD'), + percentage_threshold_bad: Number( + configurationForm.percentage_threshold_bad + ), + percentage_threshold_enough: Number( + configurationForm.percentage_threshold_enough + ), + }); + + if (isResponseError(createConfigurationResponse)) { + console.error( + 'Error creating configuration:', + createConfigurationResponse.message + ); + toast.error('Gagal menambahkan konfigurasi'); + return; + } + + refreshDailyChecklistConfigurations(); + toast.success('Konfigurasi berhasil ditambahkan'); + } else { + const updateConfigurationResponse = + await DailyChecklistConfigurationApi.update(configurationForm.id, { + date: formatDate(configurationForm.date, 'YYYY-MM-DD'), + percentage_threshold_bad: Number( + configurationForm.percentage_threshold_bad + ), + percentage_threshold_enough: Number( + configurationForm.percentage_threshold_enough + ), + }); + + if (isResponseError(updateConfigurationResponse)) { + console.error( + 'Error updating configuration:', + updateConfigurationResponse.message + ); + toast.error('Gagal mengubah konfigurasi'); + return; + } + + refreshDailyChecklistConfigurations(); + toast.success('Konfigurasi berhasil diubah'); + } + + setShowModal(false); + setConfigurationForm({ + id: 0, + date: '', + percentage_threshold_bad: '', + percentage_threshold_enough: '', + }); + } catch (error) { + console.error('Error saving configuration:', error); + toast.error('Terjadi kesalahan saat menyimpan konfigurasi'); + } finally { + setLoading(false); + } + }; + + const handleDeleteClick = (configurationId: number) => { + setConfigurationToDelete(configurationId); + setShowDeleteConfirm(true); + }; + + const handleConfirmDelete = async () => { + if (!configurationToDelete) return; + + setLoading(true); + + try { + const deleteConfigurationResponse = + await DailyChecklistConfigurationApi.delete(configurationToDelete); + + if (isResponseError(deleteConfigurationResponse)) { + console.error( + 'Error deleting configuration:', + deleteConfigurationResponse.message + ); + toast.error('Gagal menghapus konfigurasi'); + return; + } + + refreshDailyChecklistConfigurations(); + toast.success('Konfigurasi berhasil dihapus'); + setShowDeleteConfirm(false); + setConfigurationToDelete(null); + } catch (error) { + console.error('Error deleting employee:', error); + toast.error('Terjadi kesalahan saat menghapus konfigurasi'); + } finally { + setLoading(false); + } + }; + + const handleExport = (format: string) => { + toast.success(`Data berhasil diekspor ke ${format}`); + }; + + if (isLoadingDailyChecklistConfigurations && !dailyChecklistConfigurations) { + return ( +
+
+
+

+ Master Konfigurasi +

+

+ Master Data • Konfigurasi +

+
+ + + Memuat data... + + +
+
+ ); + } + + const formatDateForDisplay = (dateStr: string) => { + if (!dateStr) return 'Pilih tanggal'; + const [year, month, day] = dateStr.split('-'); + const date = new Date(parseInt(year), parseInt(month) - 1, parseInt(day)); + return date.toLocaleDateString('id-ID', { + weekday: 'long', + year: 'numeric', + month: 'long', + day: 'numeric', + }); + }; + + return ( +
+
+ {/* Page Title */} +
+

+ Master Konfigurasi +

+

+ Master Data • Konfigurasi +

+
+ + {/* Main Card */} + + + {/* Single Toolbar Row */} +
+
+ +
+
+ + {/* Table */} + + data={ + isResponseSuccess(dailyChecklistConfigurations) + ? dailyChecklistConfigurations?.data + : [] + } + columns={configurationColumns} + pageSize={tableFilterState.pageSize} + onPageSizeChange={setPageSize} + rowOptions={[10, 20, 50, 100]} + page={ + isResponseSuccess(dailyChecklistConfigurations) + ? dailyChecklistConfigurations?.meta?.page + : 0 + } + totalItems={ + isResponseSuccess(dailyChecklistConfigurations) + ? dailyChecklistConfigurations?.meta?.total_results + : 0 + } + onPageChange={setPage} + isLoading={isLoadingDailyChecklistConfigurations} + className={{ + containerClassName: cn({ + 'w-full mb-20': + isResponseSuccess(dailyChecklistConfigurations) && + dailyChecklistConfigurations?.data?.length === 0, + }), + tableWrapperClassName: + 'overflow-x-auto border border-solid border-base-content/10 rounded-none', + headerRowClassName: 'bg-gray-50/50', + headerColumnClassName: + 'text-left py-3.5 px-6 text-sm font-semibold text-gray-700', + paginationClassName: 'px-4', + }} + /> + + +
+ + {/* Add/Edit Modal */} + + + + + {modalMode === 'create' + ? 'Tambah Konfigurasi' + : 'Edit Konfigurasi'} + + + {modalMode === 'create' + ? 'Masukkan detail konfigurasi baru' + : 'Ubah detail konfigurasi'} + + +
+
+ +
+ + setConfigurationForm({ + ...configurationForm, + date: e, + }) + } + disabled={loading} + placeholder='Pilih tanggal' + formatDisplay={formatDateForDisplay} + /> +
+
+ +
+ +
+ +
+ + +
+ + + {'<='} + + + setConfigurationForm({ + ...configurationForm, + percentage_threshold_bad: e.target.value, + }) + } + placeholder='Kurang' + className='w-20' + disabled={loading} + max={100} + /> +
+
+ +
+ + +
+ + + {'<='} + + + setConfigurationForm({ + ...configurationForm, + percentage_threshold_enough: e.target.value, + }) + } + placeholder='Cukup' + className='w-20' + disabled={loading} + min={Number(configurationForm.percentage_threshold_bad) + 1} + max={100} + /> +
+
+ +
+ + +
+ + + {'<='} + + +
+
+
+ + + + + + + + {/* Delete Confirmation */} + + + + Hapus konfigurasi? + + Data konfigurasi akan dihapus secara permanen. + + + + Batal + + {loading ? 'Menghapus...' : 'Hapus'} + + + + +
+ ); +} diff --git a/src/figma-make/components/pages/master-data/employee/MasterEmployeeContent.tsx b/src/figma-make/components/pages/master-data/employee/MasterEmployeeContent.tsx index c9562971..f8b67e7a 100644 --- a/src/figma-make/components/pages/master-data/employee/MasterEmployeeContent.tsx +++ b/src/figma-make/components/pages/master-data/employee/MasterEmployeeContent.tsx @@ -283,10 +283,6 @@ export function MasterEmployeeContent() { } }; - const handleExport = (format: string) => { - toast.success(`Data berhasil diekspor ke ${format}`); - }; - if (isLoadingEmployees && !employees) { return (
@@ -390,27 +386,6 @@ export function MasterEmployeeContent() { {/* RIGHT: Export + Add */}
- - - - - - handleExport('CSV')}> - Export CSV - - handleExport('Excel')}> - Export Excel - - - -
diff --git a/src/figma-make/lib/info.tsx b/src/figma-make/lib/info.tsx deleted file mode 100644 index 3127f912..00000000 --- a/src/figma-make/lib/info.tsx +++ /dev/null @@ -1,6 +0,0 @@ -// TODO: delete this file later - -/* AUTOGENERATED FILE - DO NOT EDIT CONTENTS */ - -export const projectId = 'xxx'; -export const publicAnonKey = 'xxx'; diff --git a/src/figma-make/lib/supabase.ts b/src/figma-make/lib/supabase.ts deleted file mode 100644 index 0b693389..00000000 --- a/src/figma-make/lib/supabase.ts +++ /dev/null @@ -1,339 +0,0 @@ -import { createClient, SupabaseClient } from '@supabase/supabase-js'; -import { projectId, publicAnonKey } from '@/figma-make/lib/info'; - -// ============================================ -// 🔍 SUPABASE ENVIRONMENT DEBUG CHECK -// ============================================ - -/** - * Get environment variable from multiple sources - * Checks in order: __ENV__, window.__ENV__, process.env, import.meta.env - */ -function getEnv(key: string): string | undefined { - let value: string | undefined; - let source: string | undefined; - - // Check globalThis.__ENV__ - // eslint-disable-next-line @typescript-eslint/no-explicit-any - if ((globalThis as any).__ENV__?.[key]) { - // eslint-disable-next-line @typescript-eslint/no-explicit-any - value = (globalThis as any).__ENV__[key]; - source = 'globalThis.__ENV__'; - } - // Check window.__ENV__ - // eslint-disable-next-line @typescript-eslint/no-explicit-any - else if (typeof window !== 'undefined' && (window as any).__ENV__?.[key]) { - // eslint-disable-next-line @typescript-eslint/no-explicit-any - value = (window as any).__ENV__[key]; - source = 'window.__ENV__'; - } - // Check process.env - // eslint-disable-next-line @typescript-eslint/no-explicit-any - else if ((globalThis as any).process?.env?.[key]) { - // eslint-disable-next-line @typescript-eslint/no-explicit-any - value = (globalThis as any).process.env[key]; - source = 'process.env'; - } - // Check import.meta.env (if available) - else if ( - typeof import.meta !== 'undefined' && - // eslint-disable-next-line @typescript-eslint/no-explicit-any - (import.meta as any)?.env?.[key] - ) { - // eslint-disable-next-line @typescript-eslint/no-explicit-any - value = (import.meta as any).env[key]; - source = 'import.meta.env'; - } - - if (value && source) { - console.log(`✅ ${key} loaded from: ${source}`); - } - - return value; -} - -// Try to read from environment variables first -let supabaseUrl = getEnv('VITE_SUPABASE_URL'); -let supabaseAnonKey = getEnv('VITE_SUPABASE_ANON_KEY'); - -// Fallback to Figma Make autogenerated credentials -if (!supabaseUrl || !supabaseAnonKey) { - console.log( - '📋 Using Figma Make autogenerated Supabase credentials from /utils/supabase/info.tsx' - ); - supabaseUrl = `https://${projectId}.supabase.co`; - supabaseAnonKey = publicAnonKey; -} - -// Helper function to mask sensitive data -const maskString = (str: string | undefined): string => { - if (!str) return 'undefined'; - if (str.length <= 20) return str.substring(0, 10) + '...'; - return str.substring(0, 20) + '...' + `(${str.length - 20} chars masked)`; -}; - -// Debug logging -console.group('🔍 Supabase Environment Check'); -console.log('projectId (from info.tsx):', projectId); -console.log('SUPABASE_URL present?', !!supabaseUrl); -console.log('SUPABASE_KEY present?', !!supabaseAnonKey); -console.log('SUPABASE_URL value:', maskString(supabaseUrl)); -console.log('SUPABASE_KEY value:', maskString(supabaseAnonKey)); -console.groupEnd(); - -// Check if Supabase is configured -export const isSupabaseConfigured = () => { - return !!(supabaseUrl && supabaseAnonKey); -}; - -// Create Supabase client or throw error -// eslint-disable-next-line @typescript-eslint/no-explicit-any -let supabase: SupabaseClient; - -if (isSupabaseConfigured()) { - console.log('✅ Creating real Supabase client...'); - supabase = createClient(supabaseUrl!, supabaseAnonKey!); - console.log('✅ Supabase client created successfully!'); -} else { - const errorMessage = ` -❌ SUPABASE CONFIGURATION ERROR ❌ - -Missing required environment variables: -- VITE_SUPABASE_URL: ${!!supabaseUrl ? '✅ Present' : '❌ Missing'} -- VITE_SUPABASE_ANON_KEY: ${!!supabaseAnonKey ? '✅ Present' : '❌ Missing'} - -Please set Supabase environment variables in: -→ Figma Make Supabase integration settings -→ Deployment settings/environment configuration - -The app checked the following sources: -- globalThis.__ENV__ -- window.__ENV__ -- process.env -- import.meta.env - -None of these sources contained the required variables. - `.trim(); - - console.error(errorMessage); - throw new Error(errorMessage); -} - -export { supabase }; - -// Database types -export interface Database { - public: { - Tables: { - kandang: { - Row: { - id: string; - name: string; - created_at?: string; - }; - Insert: { - id?: string; - name: string; - created_at?: string; - }; - Update: { - id?: string; - name?: string; - created_at?: string; - }; - }; - employees: { - Row: { - id: string; - name: string; - kandang_id: string; - is_active: boolean; - created_at?: string; - }; - Insert: { - id?: string; - name: string; - kandang_id: string; - is_active?: boolean; - created_at?: string; - }; - Update: { - id?: string; - name?: string; - kandang_id?: string; - is_active?: boolean; - created_at?: string; - }; - }; - phases: { - Row: { - id: string; - name: string; - created_at?: string; - updated_at?: string; - }; - Insert: { - id?: string; - name: string; - created_at?: string; - updated_at?: string; - }; - Update: { - id?: string; - name?: string; - created_at?: string; - updated_at?: string; - }; - }; - phase_activities: { - Row: { - id: string; - phase_id: string; - name: string; - description?: string; - created_at?: string; - updated_at?: string; - }; - Insert: { - id?: string; - phase_id: string; - name: string; - description?: string; - created_at?: string; - updated_at?: string; - }; - Update: { - id?: string; - phase_id?: string; - name?: string; - description?: string; - created_at?: string; - updated_at?: string; - }; - }; - checklists: { - Row: { - id: string; - name: string; - description?: string; - phase_id: string; - created_at?: string; - updated_at?: string; - }; - Insert: { - id?: string; - name: string; - description?: string; - phase_id: string; - created_at?: string; - updated_at?: string; - }; - Update: { - id?: string; - name?: string; - description?: string; - phase_id?: string; - created_at?: string; - updated_at?: string; - }; - }; - daily_checklists: { - Row: { - id: string; - date: string; - kandang_id: string; - checklist_id: string; - category: string; - status: string; - name?: string; - total_score?: number; - document_path?: string; - reject_reason?: string; - created_by: string; - created_at?: string; - updated_at?: string; - }; - Insert: { - id?: string; - date: string; - kandang_id: string; - checklist_id: string; - category: string; - status?: string; - name?: string; - total_score?: number; - document_path?: string; - reject_reason?: string; - created_at?: string; - updated_at?: string; - }; - Update: { - id?: string; - date?: string; - kandang_id?: string; - checklist_id?: string; - category?: string; - status?: string; - name?: string; - total_score?: number; - document_path?: string; - reject_reason?: string; - created_at?: string; - updated_at?: string; - }; - }; - daily_checklist_tasks: { - Row: { - id: string; - checklist_id: string; - activity_id: string; - notes?: string; - created_at?: string; - updated_at?: string; - }; - Insert: { - id?: string; - checklist_id: string; - activity_id: string; - notes?: string; - created_at?: string; - updated_at?: string; - }; - Update: { - id?: string; - checklist_id?: string; - activity_id?: string; - notes?: string; - created_at?: string; - updated_at?: string; - }; - }; - task_assignees: { - Row: { - id: string; - task_id: string; - employee_id: string; - is_completed: boolean; - created_at?: string; - updated_at?: string; - }; - Insert: { - id?: string; - task_id: string; - employee_id: string; - is_completed?: boolean; - created_at?: string; - updated_at?: string; - }; - Update: { - id?: string; - task_id?: string; - employee_id?: string; - is_completed?: boolean; - created_at?: string; - updated_at?: string; - }; - }; - }; - }; -} diff --git a/src/services/api/daily-checklist/configuration.ts b/src/services/api/daily-checklist/configuration.ts new file mode 100644 index 00000000..27331aee --- /dev/null +++ b/src/services/api/daily-checklist/configuration.ts @@ -0,0 +1,19 @@ +import { BaseApiService } from '@/services/api/base'; +import { + CreateDailyChecklistConfigurationPayload, + DailyChecklistConfiguration, + UpdateDailyChecklistConfigurationPayload, +} from '@/types/api/daily-checklist/configuration'; + +export class DailyChecklistConfigurationApiService extends BaseApiService< + DailyChecklistConfiguration, + CreateDailyChecklistConfigurationPayload, + UpdateDailyChecklistConfigurationPayload +> { + constructor(basePath: string = '/master-data/config-checklists') { + super(basePath); + } +} + +export const DailyChecklistConfigurationApi = + new DailyChecklistConfigurationApiService('/master-data/config-checklists'); diff --git a/src/services/api/daily-checklist/daily-checklist.ts b/src/services/api/daily-checklist/daily-checklist.ts index 48b789a8..b8f72201 100644 --- a/src/services/api/daily-checklist/daily-checklist.ts +++ b/src/services/api/daily-checklist/daily-checklist.ts @@ -1,13 +1,18 @@ import axios from 'axios'; +import * as XLSX from 'xlsx'; import { BaseApiService } from '@/services/api/base'; -import { httpClient } from '@/services/http/client'; +import { httpClient, httpClientFetcher } from '@/services/http/client'; import { BaseApiResponse } from '@/types/api/api-general'; import { CreateDailyChecklistPayload, DailyChecklist, + DailyChecklistReport, DetailDailyChecklist, } from '@/types/api/daily-checklist/daily-checklist'; +import { isResponseError } from '@/lib/api-helper'; +import { toast } from 'sonner'; +import { formatDate } from '@/lib/helper'; export class DailyChecklistApiService extends BaseApiService< DailyChecklist, @@ -134,15 +139,26 @@ export class DailyChecklistApiService extends BaseApiService< } } - async submit(id: string) { + async submit( + id: string, + files: File[] = [], + deletedDocumentIds: number[] = [] + ) { try { + const formData = new FormData(); + + formData.append('status', 'SUBMITTED'); + + formData.append('reject_reason', ''); + + files.forEach((file) => formData.append(`documents`, file)); + + formData.append('deleted_document_ids', deletedDocumentIds.join(',')); + const submitPath = `${this.basePath}/${id}`; const submitRes = await httpClient(submitPath, { method: 'PATCH', - body: { - status: 'SUBMITTED', - reject_reason: '', - }, + body: formData, }); return submitRes; @@ -156,13 +172,16 @@ export class DailyChecklistApiService extends BaseApiService< async approve(id: string) { try { + const formData = new FormData(); + + formData.append('status', 'APPROVED'); + + formData.append('reject_reason', ''); + const approvePath = `${this.basePath}/${id}`; const approveRes = await httpClient(approvePath, { method: 'PATCH', - body: { - status: 'APPROVED', - reject_reason: '', - }, + body: formData, }); return approveRes; @@ -176,13 +195,16 @@ export class DailyChecklistApiService extends BaseApiService< async reject(id: string, rejectReason: string) { try { + const formData = new FormData(); + + formData.append('status', 'REJECTED'); + + formData.append('reject_reason', rejectReason); + const rejectPath = `${this.basePath}/${id}`; const rejectRes = await httpClient(rejectPath, { method: 'PATCH', - body: { - status: 'REJECTED', - reject_reason: rejectReason, - }, + body: formData, }); return rejectRes; @@ -193,6 +215,111 @@ export class DailyChecklistApiService extends BaseApiService< return undefined; } } + + async uploadImage( + id: number, + status: string, + files: File[], + deletedDocumentIds: number[] = [] + ) { + try { + const formData = new FormData(); + + formData.append('status', status); + + files.forEach((file) => formData.append(`documents`, file)); + + formData.append('deleted_document_ids', deletedDocumentIds.join(',')); + + const uploadImagePath = `${this.basePath}/${id}`; + const uploadImageRes = await httpClient( + uploadImagePath, + { + method: 'PATCH', + body: formData, + } + ); + + return uploadImageRes; + } catch (error) { + if (axios.isAxiosError(error)) { + return error.response?.data; + } + return undefined; + } + } + + async exportDailyChecklistReportToExcel(initialQueryString: string) { + const params = new URLSearchParams(initialQueryString); + + params.set('limit', '2000'); + + const queryString = `?${params.toString()}`; + + try { + const dailyMarketingsReport = await httpClientFetcher< + BaseApiResponse + >(`${this.basePath}/report${queryString}`); + + if (isResponseError(dailyMarketingsReport)) { + toast.error('Gagal melakukan export daily checklist! Coba lagi.'); + return; + } + + const currentMonthMaxDay = new Date( + Number(params.get('tahun')), + Number(params.get('bulan')), + 0 + ).getDate(); + + const rows = dailyMarketingsReport.data; + + const formattedRows = []; + + for (let i = 0; i < rows.length; i++) { + const formattedData: Record = { + Area: rows[i].area.name, + Farm: rows[i].farm.name, + Kandang: rows[i].kandang.name, + ABK: rows[i].abk.name, + Phase: rows[i].phase, + }; + + // Add day + for (let j = 1; j <= currentMonthMaxDay; j++) { + formattedData[`Day ${j}`] = rows[i].daily_activities[`${j}`]; + } + + // add summary + formattedData['Total Checklist'] = rows[i].summary.total_checklist; + formattedData['Jumlah Hari Efektif'] = + rows[i].summary.jumlah_hari_efektif; + formattedData['ABK %'] = rows[i].summary.abk_percentage; + formattedData['Kandang %'] = rows[i].summary.kandang_percentage; + formattedData['Kategori Kurang'] = rows[i].summary.kategori.kurang; + formattedData['Kategori Cukup'] = rows[i].summary.kategori.cukup; + formattedData['Kategori Baik'] = rows[i].summary.kategori.baik; + + formattedRows.push(formattedData); + } + + const ws = XLSX.utils.json_to_sheet(formattedRows); + const wb = XLSX.utils.book_new(); + XLSX.utils.book_append_sheet( + wb, + ws, + `Daily Checklist ${params.get('tahun')}-${params.get('bulan')?.slice(0, 3)}` + ); + + // triggers download in browser + XLSX.writeFile( + wb, + `laporan-daily-checklist-${params.get('tahun')}-${params.get('bulan')}.xlsx` + ); + } catch (error) { + toast.error('Gagal melakukan export daily checklist! Coba lagi.'); + } + } } export const DailyChecklistApi = new DailyChecklistApiService( diff --git a/src/services/hooks/useFormikErrorList.ts b/src/services/hooks/useFormikErrorList.ts new file mode 100644 index 00000000..9d299322 --- /dev/null +++ b/src/services/hooks/useFormikErrorList.ts @@ -0,0 +1,62 @@ +import { getUniqueFormikErrors } from '@/lib/formik-helper'; +import { FormikProps } from 'formik'; +import { useState } from 'react'; + +interface UseFormikErrorListOptions { + onBeforeSubmit?: (e: React.FormEvent) => boolean | void; + onAfterValidation?: () => void | Promise; +} + +export const useFormikErrorList = ( + formik: FormikProps, + options?: UseFormikErrorListOptions +) => { + const [formErrorList, setFormErrorList] = useState([]); + + const handleValidateForm = async () => { + const errors = await formik.validateForm(); + + if (Object.keys(errors).length > 0) { + const errorMessages = getUniqueFormikErrors(errors); + setFormErrorList(errorMessages); + return false; + } + + return true; + }; + + const handleFormSubmit = async (e: React.FormEvent) => { + e.preventDefault(); + + // Call onBeforeSubmit callback + if (options?.onBeforeSubmit) { + const shouldContinue = options.onBeforeSubmit(e); + if (shouldContinue === false) { + return; // Cancel submit + } + } + + // Validate form + const isValid = await handleValidateForm(); + + // Call onAfterValidation callback if validation passed + if (options?.onAfterValidation) { + await options.onAfterValidation(); + } + + // Submit form + formik.handleSubmit(); + }; + + const close = () => { + setFormErrorList([]); + }; + + return { + formErrorList, + setFormErrorList, + close, + handleValidateForm, + handleFormSubmit, + }; +}; diff --git a/src/types/api/api-general.d.ts b/src/types/api/api-general.d.ts index 5b9f04e3..d3deb616 100644 --- a/src/types/api/api-general.d.ts +++ b/src/types/api/api-general.d.ts @@ -116,3 +116,10 @@ export type BaseGroupedApproval = { export type Approvals = BaseApiResponse; export type GroupedApprovals = BaseApiResponse; + +export type Document = { + id: number; + name: string; + size: number; + url: string; +}; diff --git a/src/types/api/closing.d.ts b/src/types/api/closing.d.ts index b5fd2f67..56406ada 100644 --- a/src/types/api/closing.d.ts +++ b/src/types/api/closing.d.ts @@ -63,6 +63,7 @@ export type BaseClosing = { location_id: number; location_name: string; project_category: 'GROWING' | 'LAYING'; + project_type?: 'GROWING' | 'LAYING'; // berubah dari BE? period: number; closing_date?: string; shed_label: string; diff --git a/src/types/api/daily-checklist/configuration.d.ts b/src/types/api/daily-checklist/configuration.d.ts new file mode 100644 index 00000000..7e94c69b --- /dev/null +++ b/src/types/api/daily-checklist/configuration.d.ts @@ -0,0 +1,22 @@ +import { BaseMetadata } from '@/types/api/api-general'; + +export type BaseConfiguration = { + id: number; + date: string; + percentage_threshold_bad: number; + percentage_threshold_enough: number; +}; + +export type DailyChecklistConfiguration = BaseMetadata & BaseConfiguration; + +export type CreateDailyChecklistConfigurationPayload = { + date: string; + percentage_threshold_bad: number; + percentage_threshold_enough: number; +}; + +export type UpdateDailyChecklistConfigurationPayload = { + date: string; + percentage_threshold_bad: number; + percentage_threshold_enough: number; +}; diff --git a/src/types/api/daily-checklist/daily-checklist.d.ts b/src/types/api/daily-checklist/daily-checklist.d.ts index 9f01ae1f..5e5a3fe8 100644 --- a/src/types/api/daily-checklist/daily-checklist.d.ts +++ b/src/types/api/daily-checklist/daily-checklist.d.ts @@ -1,7 +1,10 @@ -import { BaseMetadata } from '@/types/api/api-general'; +import { BaseMetadata, Document } from '@/types/api/api-general'; import { BaseKandang } from '@/types/api/master-data/kandang'; import { Phase } from '@/types/api/daily-checklist/phase'; import { PhaseActivity } from '@/types/api/daily-checklist/phase-activity'; +import { BaseArea } from '@/types/api/master-data/area'; +import { BaseLocation } from '@/types/api/master-data/location'; +import { BaseEmployee } from '@/types/api/master-data/employee'; export type BaseDailyChecklist = { id: number; @@ -46,6 +49,7 @@ export type DetailDailyChecklist = BaseDailyChecklist & { id: number; name: string; }[]; + document_urls: Document[]; }; export type CreateDailyChecklistPayload = { @@ -54,3 +58,49 @@ export type CreateDailyChecklistPayload = { category: string; status: string; }; + +export type PerformanceOverviewItem = { + employee_id: number; + employee_name: string; + total_activity: number; + activity_done: number; + activity_left: number; + kandang: Pick; +}; + +export type TrackingAbkItem = { + employee_id: number; + employee_name: string; + kandang_id: number; + kandang_name: string; + total_activity: number; + activity_done: number; + activity_left: number; + completion_rate: number; + last_activity: string; +}; + +export type DailyChecklistSummary = { + performance_overview: PerformanceOverviewItem[]; + tracking_abk: TrackingAbkItem[]; +}; + +export type DailyChecklistReport = { + area: Pick; + farm: Pick; + kandang: Pick; + abk: Pick; + phase: string; + daily_activities: Record; + summary: { + total_checklist: number; + jumlah_hari_efektif: number; + abk_percentage: number; + kandang_percentage: number; + kategori: { + kurang: number; + cukup: number; + baik: number; + }; + }; +}; diff --git a/src/types/api/production/project-flock.d.ts b/src/types/api/production/project-flock.d.ts index 1aeb2005..66cc39ed 100644 --- a/src/types/api/production/project-flock.d.ts +++ b/src/types/api/production/project-flock.d.ts @@ -5,6 +5,7 @@ import { Kandang } from '@/types/api/master-data/kandang'; import { Location } from '@/types/api/master-data/location'; import { BaseApproval, BaseMetadata } from '@/types/api/api-general'; import { Nonstock } from '@/types/api/master-data/nonstock'; +import { ProductionStandard } from '@/types/api/master-data/production-standard'; export type BaseProjectFlock = { id: number;