feat: 심사자 심사 반영
parent
3022c5e0ae
commit
f1e8cfdf96
@ -0,0 +1,238 @@
|
||||
import { useCallback, useEffect, useState } from 'react';
|
||||
|
||||
import _ from 'lodash';
|
||||
|
||||
// material-ui
|
||||
import { GridActionsCellItem } from '@mui/x-data-grid';
|
||||
import { Divider, Grid, Typography } from '@mui/material';
|
||||
import CreditScoreIcon from '@mui/icons-material/CreditScore';
|
||||
|
||||
// berry ui
|
||||
import MainCard from 'ui-component/cards/MainCard';
|
||||
|
||||
// project imports
|
||||
import MuiDataGrid from 'views/cmm/mui-grid/MuiDataGrid';
|
||||
import { findByUserJudges } from 'apis/parking';
|
||||
import CmmModal from 'views/cmm/CmmModal';
|
||||
import ProcessParkingJudge from './ProcessParkingJudge';
|
||||
import useAuth from 'hooks/useAuth';
|
||||
import Button from '@mui/material/Button';
|
||||
import { useAlert } from 'react-alert';
|
||||
|
||||
const ParkingJudgeByUserReview = () => {
|
||||
const { user } = useAuth();
|
||||
const showAlert = useAlert();
|
||||
const [totalCount, setTotalCount] = useState(0);
|
||||
const [rowsState, setRowsState] = useState({
|
||||
page: 0,
|
||||
pageSize: 100,
|
||||
rows: []
|
||||
// loading: false
|
||||
});
|
||||
const [open, setOpen] = useState(false);
|
||||
const [title, setTitle] = useState('');
|
||||
const [rowDatas, setRowDatas] = useState([]);
|
||||
const [minSdate, setMinSdate] = useState('');
|
||||
const [maxEdate, setMaxEdate] = useState('');
|
||||
const [minSeq, setMinSeq] = useState(0);
|
||||
const [maxSeq, setMaxSeq] = useState(0);
|
||||
|
||||
const search = useCallback(() => {
|
||||
findByUserJudges().then((res) => {
|
||||
if (res && res.data) {
|
||||
setTotalCount(res.count);
|
||||
setRowsState((prevState) => ({ ...prevState, rows: res.data }));
|
||||
|
||||
if (res?.data?.length > 0) {
|
||||
const arrMsSeq = res?.data?.map((r) => r.msSeq);
|
||||
setMinSdate(_.min(res?.data?.map((r) => r.msSdate)));
|
||||
setMaxEdate(_.max(res?.data?.map((r) => r.msEdate)));
|
||||
setMinSeq(_.min(arrMsSeq));
|
||||
setMaxSeq(_.max(arrMsSeq));
|
||||
}
|
||||
}
|
||||
});
|
||||
}, []);
|
||||
|
||||
const onJudge = () => {
|
||||
// setRowDatas(rowsState?.rows);
|
||||
// setTitle(`주정차 의견진술 심의 결정`);
|
||||
// setOpen(true);
|
||||
alert('적용예정');
|
||||
};
|
||||
|
||||
const processJudge = useCallback(
|
||||
(row) => () => {
|
||||
// setRowDatas([row]);
|
||||
// setTitle(`주정차 의견진술 심의 결정`);
|
||||
// setOpen(true);
|
||||
alert('적용예정');
|
||||
},
|
||||
[]
|
||||
);
|
||||
|
||||
const columns = [
|
||||
// { headerName: 'rowId', field: 'rowId' },
|
||||
{
|
||||
headerName: '접수번호',
|
||||
headerAlign: 'center',
|
||||
field: 'msSeq',
|
||||
align: 'center',
|
||||
width: 100
|
||||
},
|
||||
{ headerName: '심의차수', headerAlign: 'center', field: 'msChasu', align: 'center', width: 100 },
|
||||
{ headerName: '차량번호', headerAlign: 'center', field: 'msCarnum', align: 'center', width: 100 },
|
||||
{
|
||||
headerName: '민원결과',
|
||||
headerAlign: 'center',
|
||||
field: 'msResult',
|
||||
align: 'center',
|
||||
renderCell: (params) => {
|
||||
switch (params.row.msResult) {
|
||||
case '0':
|
||||
return '심의전';
|
||||
// break;
|
||||
case '1':
|
||||
return '부과';
|
||||
// break;
|
||||
case '2':
|
||||
return '미부과';
|
||||
// break;
|
||||
default:
|
||||
return params.row.msResult;
|
||||
}
|
||||
},
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
headerName: '심사자심사',
|
||||
headerAlign: 'center',
|
||||
field: 'msuResult',
|
||||
align: 'center',
|
||||
renderCell: (params) => {
|
||||
switch (params.row.msuResult) {
|
||||
case '0':
|
||||
return '심의전';
|
||||
// break;
|
||||
case '1':
|
||||
return '부과';
|
||||
// break;
|
||||
case '2':
|
||||
return '미부과';
|
||||
// break;
|
||||
default:
|
||||
return params.row.msuResult;
|
||||
}
|
||||
},
|
||||
width: 100
|
||||
},
|
||||
{
|
||||
headerName: '심의 기간',
|
||||
headerAlign: 'center',
|
||||
field: 'msDate',
|
||||
minWidth: 200,
|
||||
width: 250,
|
||||
description: '심사 기간',
|
||||
valueGetter: (params) => `${params.row.msSdate} ~ ${params.row.msEdate}`,
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
headerName: '심의 마감 일시',
|
||||
headerAlign: 'center',
|
||||
field: 'msCdate',
|
||||
type: 'dateTime',
|
||||
minWidth: 150,
|
||||
width: 200,
|
||||
valueGetter: (params) => `${params.row.msCdate} ${params.row.msClosesi}`,
|
||||
align: 'center'
|
||||
},
|
||||
{
|
||||
headerName: '개별심사',
|
||||
headerAlign: 'center',
|
||||
field: 'actions',
|
||||
type: 'actions',
|
||||
width: 80,
|
||||
getActions: (params) => [
|
||||
<GridActionsCellItem color="error" icon={<CreditScoreIcon />} label="개별심사" onClick={processJudge(params.row)} />
|
||||
],
|
||||
align: 'center'
|
||||
}
|
||||
];
|
||||
|
||||
const handleSearch = async (event) => {
|
||||
if (event.type === 'keydown' && event.key === 'Enter') {
|
||||
search();
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
search();
|
||||
// }, [rowsState.page, rowsState.pageSize, selectedYear, searchTxt]);
|
||||
}, [search]);
|
||||
|
||||
return (
|
||||
<MainCard>
|
||||
{totalCount > 0 && (
|
||||
<>
|
||||
<Grid container spacing={2} alignItems="center">
|
||||
<Grid container item spacing={2} xs={7} justifyContent="start">
|
||||
<Grid item>
|
||||
<Typography variant="subtitle1">
|
||||
[ <span style={{ color: 'red' }}>심의기간 : </span>{' '}
|
||||
<span style={{ color: 'blue' }}>
|
||||
{minSdate} ~ {maxEdate}
|
||||
</span>{' '}
|
||||
]
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<Typography variant="subtitle1">
|
||||
[ <span style={{ color: 'red' }}>접수번호 : </span>
|
||||
<span style={{ color: 'blue' }}>
|
||||
{' '}
|
||||
{minSeq} ~ {maxSeq}
|
||||
</span>{' '}
|
||||
]
|
||||
</Typography>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Grid container item spacing={2} xs={5} justifyContent="end" alignItems="center">
|
||||
<Grid item>
|
||||
<Typography variant="subtitle1">
|
||||
[ <span style={{ color: 'blue' }}>{user?.name} 위원 / </span>
|
||||
<span style={{ color: 'red' }}>{user?.team?.substring(2)}팀</span> ]
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<Button variant="contained" size="small" startIcon={<CreditScoreIcon />} onClick={onJudge}>
|
||||
심사
|
||||
</Button>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Grid container spacing={1} item xs={12} mt={1}>
|
||||
<Grid item xs={12}>
|
||||
<Divider />
|
||||
</Grid>
|
||||
</Grid>
|
||||
</>
|
||||
)}
|
||||
<MuiDataGrid
|
||||
// isCheckbox
|
||||
isHideFooter
|
||||
columns={columns}
|
||||
rowsState={rowsState}
|
||||
totalCount={totalCount}
|
||||
setRowsState={setRowsState}
|
||||
// handleCellClick={handleOnCellClick}
|
||||
// handleSelection={handleSelection}
|
||||
// selectionModel={selectionModel}
|
||||
/>
|
||||
<CmmModal isBackdrop title={title} open={open} setOpen={setOpen}>
|
||||
<ProcessParkingJudge setTitle={setTitle} rowDatas={rowDatas} showAlert={showAlert} setOpen={setOpen} />
|
||||
</CmmModal>
|
||||
</MainCard>
|
||||
);
|
||||
};
|
||||
|
||||
export default ParkingJudgeByUserReview;
|
||||
@ -0,0 +1,206 @@
|
||||
import { useEffect, useRef, useState } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
import { Button, CardMedia, Divider, FormControl, Grid, InputLabel, MenuItem, Select, TextField } from '@mui/material';
|
||||
import { findImages, saveJudgeResult } from 'apis/judge';
|
||||
import { SkipNext, SkipPrevious, Save } from '@mui/icons-material';
|
||||
|
||||
const ProcessParkingJudge = (props) => {
|
||||
const { rowDatas, setOpen, showAlert } = props;
|
||||
const pageRef = useRef(0);
|
||||
const totalPageRef = useRef(0);
|
||||
const curDataRef = useRef({});
|
||||
const [picadImgs, setPicadImgs] = useState([]);
|
||||
const [frecadImgs, setFrecadImgs] = useState([]);
|
||||
const [contadImgs, setContadImgs] = useState([]);
|
||||
const [reason, setReason] = useState();
|
||||
const [selectedResult, setSelectedResult] = useState();
|
||||
|
||||
const getImgList = (row) => {
|
||||
findImages(row, showAlert).then((res) => {
|
||||
const { arrPicadImg, arrFrecadImg, arrContadImg } = res;
|
||||
setPicadImgs(arrPicadImg);
|
||||
setFrecadImgs(arrFrecadImg);
|
||||
setContadImgs(arrContadImg);
|
||||
});
|
||||
};
|
||||
|
||||
const onPrev = () => {
|
||||
pageRef.current -= 1;
|
||||
curDataRef.current = rowDatas[pageRef.current];
|
||||
setReason(curDataRef.current.msuReason ?? '');
|
||||
setSelectedResult(curDataRef.current.msuResult);
|
||||
getImgList(curDataRef.current);
|
||||
};
|
||||
const onNext = () => {
|
||||
pageRef.current += 1;
|
||||
curDataRef.current = rowDatas[pageRef.current];
|
||||
setReason(curDataRef.current.msuReason ?? '');
|
||||
setSelectedResult(curDataRef.current.msuResult);
|
||||
getImgList(rowDatas[pageRef.current]);
|
||||
};
|
||||
|
||||
const handleSave = () => {
|
||||
saveJudgeResult({ msuCode: curDataRef.current.msuCode, msuResult: selectedResult, msuReason: reason }).then((res) => {
|
||||
if (res?.success) {
|
||||
curDataRef.current.msuResult = selectedResult;
|
||||
curDataRef.current.msuReason = reason;
|
||||
showAlert.show('심의처리 되었습니다');
|
||||
} else {
|
||||
showAlert.show(`${res?.data.message}`);
|
||||
}
|
||||
});
|
||||
};
|
||||
const handleClose = () => {
|
||||
setOpen(false);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
pageRef.current = 0;
|
||||
totalPageRef.current = rowDatas.length - 1;
|
||||
curDataRef.current = rowDatas[pageRef.current];
|
||||
setReason(curDataRef.current.msuReason ?? '');
|
||||
setSelectedResult(curDataRef.current.msuResult);
|
||||
getImgList(curDataRef.current);
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Grid container spacing={1}>
|
||||
{picadImgs?.map((img, idx) => (
|
||||
<Grid item xs={3} key={idx}>
|
||||
<CardMedia
|
||||
component="img"
|
||||
sx={{
|
||||
height: 150
|
||||
}}
|
||||
src={img}
|
||||
/>
|
||||
</Grid>
|
||||
))}
|
||||
</Grid>
|
||||
<Grid container m={1} />
|
||||
<Grid container spacing={1}>
|
||||
{frecadImgs?.map((img, idx) => (
|
||||
<Grid item xs={3} key={idx}>
|
||||
<CardMedia
|
||||
component="img"
|
||||
sx={{
|
||||
height: 150
|
||||
}}
|
||||
src={img}
|
||||
/>
|
||||
</Grid>
|
||||
))}
|
||||
</Grid>
|
||||
<Grid container m={1} />
|
||||
<Grid container spacing={1}>
|
||||
{contadImgs?.map((img, idx) => (
|
||||
<Grid item xs={3} key={idx}>
|
||||
<CardMedia
|
||||
component="img"
|
||||
sx={{
|
||||
height: 150
|
||||
}}
|
||||
src={img}
|
||||
/>
|
||||
</Grid>
|
||||
))}
|
||||
</Grid>
|
||||
<Grid container m={1}>
|
||||
<Grid item xs={12}>
|
||||
<Divider />
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Grid container spacing={1} mt={1}>
|
||||
<Grid item xs={2}>
|
||||
<TextField size="small" required disabled label="접수번호" fullWidth value={rowDatas[pageRef.current].msSeq} />
|
||||
</Grid>
|
||||
<Grid item xs={2}>
|
||||
<TextField size="small" required disabled label="위반일자" fullWidth value={rowDatas[pageRef.current].scWdate} />
|
||||
</Grid>
|
||||
<Grid item xs={6}>
|
||||
<TextField size="small" required disabled label="위반장소" fullWidth value={rowDatas[pageRef.current].scPos} />
|
||||
</Grid>
|
||||
<Grid item xs={2}>
|
||||
<FormControl fullWidth>
|
||||
<InputLabel disabled required>
|
||||
심의결정
|
||||
</InputLabel>
|
||||
<Select
|
||||
size="small"
|
||||
defaultValue={selectedResult || '1'}
|
||||
value={selectedResult || '1'}
|
||||
onChange={(e) => setSelectedResult(e?.target?.value)}
|
||||
>
|
||||
<MenuItem key="0" value="0">
|
||||
심의전
|
||||
</MenuItem>
|
||||
<MenuItem key="1" value="1">
|
||||
수용
|
||||
</MenuItem>
|
||||
<MenuItem key="2" value="2">
|
||||
미수용
|
||||
</MenuItem>
|
||||
</Select>
|
||||
</FormControl>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Grid container spacing={1} mt={1}>
|
||||
<Grid item xs={12}>
|
||||
<TextField
|
||||
size="small"
|
||||
multiline
|
||||
rows={2}
|
||||
required
|
||||
label="결정사유"
|
||||
fullWidth
|
||||
value={reason}
|
||||
onChange={(e) => setReason(e.target.value)}
|
||||
/>
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Grid container spacing={1} m={0.5}>
|
||||
<Grid item xs={12}>
|
||||
<Divider />
|
||||
</Grid>
|
||||
</Grid>
|
||||
<Grid item container spacing={0.5} mt={1}>
|
||||
<Grid item>
|
||||
<Button disabled={pageRef.current === 0} variant="contained" size="small" startIcon={<SkipPrevious />} onClick={onPrev}>
|
||||
이전
|
||||
</Button>
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<Button
|
||||
disabled={pageRef.current === totalPageRef.current}
|
||||
variant="contained"
|
||||
size="small"
|
||||
endIcon={<SkipNext />}
|
||||
onClick={onNext}
|
||||
>
|
||||
다음
|
||||
</Button>
|
||||
</Grid>
|
||||
<Grid item style={{ marginLeft: 'auto' }}>
|
||||
<Button variant="contained" size="small" startIcon={<Save />} onClick={handleSave}>
|
||||
심의처리
|
||||
</Button>
|
||||
</Grid>
|
||||
<Grid item>
|
||||
<Button variant="contained" color="primary" size="small" onClick={handleClose}>
|
||||
닫기
|
||||
</Button>
|
||||
</Grid>
|
||||
</Grid>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
ProcessParkingJudge.propTypes = {
|
||||
rowDatas: PropTypes.array.isRequired,
|
||||
showAlert: PropTypes.object,
|
||||
setOpen: PropTypes.func.isRequired
|
||||
};
|
||||
|
||||
export default ProcessParkingJudge;
|
||||
Loading…
Reference in New Issue