From 031291b1f0ecd0f5c98fe41eba7f52fbb196aff2 Mon Sep 17 00:00:00 2001 From: ivan-sim Date: Wed, 18 Oct 2023 08:25:47 +0700 Subject: [PATCH] Update Devisions pada Prime Center --- .../Controllers/Api/DivisionController.php | 6 +- .../Corporates/CorporateTabNavigations.tsx | 8 +- .../src/pages/Corporates/Division/List.tsx | 346 +++++++++++++----- 3 files changed, 260 insertions(+), 100 deletions(-) diff --git a/Modules/Internal/Http/Controllers/Api/DivisionController.php b/Modules/Internal/Http/Controllers/Api/DivisionController.php index 10ba58f0..5be75800 100644 --- a/Modules/Internal/Http/Controllers/Api/DivisionController.php +++ b/Modules/Internal/Http/Controllers/Api/DivisionController.php @@ -19,6 +19,7 @@ class DivisionController extends Controller $benefits = CorporateDivision::query() ->filter($request->all()) ->where('corporate_id', $corporate_id) + ->orderBy('id', 'DESC') ->paginate(0) ->appends($request->all()); @@ -52,6 +53,7 @@ class DivisionController extends Controller 'corporate_id' => $corporate_id, 'code' => $request->code, 'name' => $request->name, + 'description' => $request->description ? $request->description : null, ]); return $newCorporatePlan; @@ -91,8 +93,6 @@ class DivisionController extends Controller $request->validate([ 'code' => [ 'required', - // Rule::unique('corporate_plans')->where('corporate_id', $corporate_id)->ignore($corporatePlan->id) - // Rule::unique('corporate_divisions')->where('corporate_id', $corporate_id) ], 'name' => 'required' ]); @@ -100,7 +100,7 @@ class DivisionController extends Controller $corporatePlan->fill([ 'code' => $request->code, 'name' => $request->name, - 'active' => $request->active, + 'description' => $request->description, ])->save(); return $corporatePlan; diff --git a/frontend/dashboard/src/pages/Corporates/CorporateTabNavigations.tsx b/frontend/dashboard/src/pages/Corporates/CorporateTabNavigations.tsx index 4cfffe6d..6e3835c1 100644 --- a/frontend/dashboard/src/pages/Corporates/CorporateTabNavigations.tsx +++ b/frontend/dashboard/src/pages/Corporates/CorporateTabNavigations.tsx @@ -44,10 +44,10 @@ export default function CorporateTabNavigations({ position }: Props) { path: 'benefits', label: 'Benefit', }, - { - path: 'divisions', - label: 'Division', - }, + // { + // path: 'divisions', + // label: 'Division', + // }, { path: 'members', label: 'Member List', diff --git a/frontend/dashboard/src/pages/Corporates/Division/List.tsx b/frontend/dashboard/src/pages/Corporates/Division/List.tsx index 123a603f..46e183ae 100644 --- a/frontend/dashboard/src/pages/Corporates/Division/List.tsx +++ b/frontend/dashboard/src/pages/Corporates/Division/List.tsx @@ -41,6 +41,14 @@ import axios from '../../../utils/axios'; import { CorporatePlan } from '../../../@types/corporates'; import { LaravelPaginatedData } from '../../../@types/paginated-data'; import BasePagination from '../../../components/BasePagination'; +import TableMoreMenu from '@/components/table/TableMoreMenu'; +import EditOutlinedIcon from '@mui/icons-material/EditOutlined'; +import HistoryIcon from '@mui/icons-material/History'; +import FindInPageOutlinedIcon from '@mui/icons-material/FindInPageOutlined'; +import CachedOutlinedIcon from '@mui/icons-material/CachedOutlined'; +import { Dialog, DialogTitle, DialogContent, DialogActions } from '@mui/material'; +import CloseIcon from '@mui/icons-material/Close'; +import { enqueueSnackbar } from 'notistack'; export default function PlanList() { const { themeStretch } = useSettings(); @@ -97,74 +105,33 @@ export default function PlanList() { return ( - *': { borderBottom: 'unset' } }}> - - setOpen(!open)}> - {open ? : } - - - {row.id} - {row.code} - {row.name} - {row.description} - - - - - - - - - - {/* COLLAPSIBLE ROW */} - - - - - No Extra Data - - - {false && ( - - - Rules - - - - - Date - Customer - Amount - Total price ($) - - - - {/* {row.history ? row.history.map((historyRow) => ( */} - - - {row.start} - {row.end} - - {row.start} - {row.start} - {row.start} - - {/* )) - : ( - - No Data - - ) - } */} - -
- - )} - + {row.id ? row.id : '-'} + {row.code ? row.code : '-'} + {row.name ? row.name : '-'} + {row.description ? row.description : '-'} + + + navigate ('')}> + + Details + + handleEditData(row)}> + + Edit + + handleEditDataStatus(row)}> + + Update Status + + navigate ('')}> + + History + + + } + /> @@ -194,7 +161,6 @@ export default function PlanList() { const response = await axios.get('/corporates/' + corporate_id + '/divisions', { params: filter, }); - // console.log(response.data); setDataTableLoading(false); setDataTableData(response.data); @@ -219,48 +185,147 @@ export default function PlanList() { loadDataTableData(); }, []); + // Dialog for devisions + const [openDialog, setOpenDialog] = useState(false); + //validation dialog + const [nameField, setNameField] = useState(''); + const [nameFieldError, setNameFieldError] = useState(''); + const [codeField, setCodeField] = useState(''); + const [codeFieldError, setCodeFieldError] = useState(''); + const [descriptionField, setDescriptionField] = useState(''); + // ID for edit data + const [idField, setIdField] = useState(''); + + const isRequiredFieldsFilled = () => { + return nameField.trim() !== '' && codeField.trim() !== ''; + }; + + const handleAddData = () => { + setOpenDialog(true); + } + + const handleCloseDialog = () => { + setOpenDialog(false); + setNameField(''); + setCodeField(''); + setDescriptionField(''); + setIdField(''); + } + + const handleSaveData = () => { + const addData = { + code: codeField, + name: nameField, + description: descriptionField, + }; + // Check conditions add or update data + if(idField) + { + // Update data + axios + .put('/corporates/'+corporate_id+'/divisions/'+idField+'', addData) + .then((response) => { + enqueueSnackbar('Data saved successfully', { variant: 'success' }); + loadDataTableData(); + handleCloseDialog(); + }) + .catch((error) => { + enqueueSnackbar('Failed to add data', { variant: 'error' }); + }); + } + else{ + // Save data + axios + .post('/corporates/'+corporate_id+'/divisions', addData) + .then((response) => { + enqueueSnackbar('Data saved successfully', { variant: 'success' }); + loadDataTableData(); + handleCloseDialog(); + }) + .catch((error) => { + enqueueSnackbar('Failed to add data', { variant: 'error' }); + }); + } + } + //Edit data + const handleEditData = (data) => { + setIdField(data.id) + setNameField(data.name); + setCodeField(data.code); + setDescriptionField(data.description); + setOpenDialog(true); + } + // End dialog for devisions + + // Dialog for update status devisions + const [openDialogStatus, setOpenDialogStatus] = useState(false); + // Active for update status + const [activeField, setActiveField] = useState(''); + const handleCloseDialogStatus = () => { + setOpenDialogStatus(false); + setNameField(''); + setCodeField(''); + setDescriptionField(''); + setIdField(''); + setActiveField(''); + } + + const handleSaveDataStatus = () => { + + } + + const handleEditDataStatus = (data) => { + setIdField(data.id) + setNameField(data.name); + setCodeField(data.code); + setDescriptionField(data.description); + setActiveField(data.active); + setOpenDialogStatus(true); + } + // End dialog for update status devisions + + + return ( - - - + - {/* The Main Table */} - + - - - ID + + ID - - Code + + Code - - Name + + Name - - Description + + Description + + - + {dataTableIsLoading ? ( - + Loading @@ -268,7 +333,7 @@ export default function PlanList() { ) : dataTableData.data.length == 0 ? ( - + No Data @@ -284,6 +349,101 @@ export default function PlanList() { + {/* Dialog */} + + + + + {idField ? ( + <> + Edit Data + + ): ( + <> + Create Data + + )} + + + + + + + + + + { + setCodeField(e.target.value); + setCodeFieldError(e.target.value.trim() === '' ? 'This field is required' : ''); + }} + fullWidth + inputProps={{ maxLength: 50 }} + error={!!codeFieldError} + helperText={codeFieldError} + /> + { + setNameField(e.target.value); + setNameFieldError(e.target.value.trim() === '' ? 'This field is required' : ''); + }} + fullWidth + inputProps={{ maxLength: 50 }} + error={!!nameFieldError} + helperText={nameFieldError} + /> + { + setDescriptionField(e.target.value); + }} + fullWidth + inputProps={{ maxLength: 255 }} + /> + + + + + + + + + {/* Dialog Update Status */} + + + + + Update Status + + + + + + + + + Are you sure to inactive this division ? + + + Code + {codeField} + + + + + + + + + + ); }