fix: 공지사항 관리 - 작성자에 따른 권한 반영

main
minuk926 3 years ago
parent 18b8c42b0a
commit fd48fc2c59

@ -21,7 +21,6 @@ import NewBoardForm from './NewBoardForm';
const Board = () => {
const { user } = useAuth();
console.log(user);
const [owner, setOwner] = useState(false);
const [category, setCategory] = useState('ciTitle');
const [searchTxt, setSearchTxt] = useState('');

@ -48,9 +48,12 @@ const ModifyBoardForm = (props) => {
() => ({
toolbar: {
container: [
[{ header: [1, 2, false] }],
['bold', 'italic', 'underline', 'strike', 'blockquote'],
[{ size: ['small', false, 'large', 'huge'] }, { color: [] }],
[{ list: 'ordered' }, { list: 'bullet' }, { indent: '-1' }, { indent: '+1' }, { align: [] }]
[{ list: 'ordered' }, { list: 'bullet' }, { indent: '-1' }, { indent: '+1' }],
['link'],
[{ align: [] }, { color: [] }, { background: [] }], // dropdown with defaults from theme
['clean']
// ['image', 'video']
]
}
@ -58,6 +61,26 @@ const ModifyBoardForm = (props) => {
[]
);
const formats = useMemo(
() => [
// 'font',
'header',
'bold',
'italic',
'underline',
'strike',
'blockquote',
'list',
'bullet',
'indent',
'link',
'align',
'color',
'background'
],
[]
);
return (
<>
<Grid mt={1}>
@ -100,6 +123,7 @@ const ModifyBoardForm = (props) => {
value={contents}
onChange={setContents}
modules={modules}
formats={formats}
theme="snow"
placeholder="내용을 입력해주세요."
/>

@ -16,7 +16,11 @@ import PublicBoardForm from './PublicBoardForm';
import { removePublicBoard, findPublicBoards, modifyPublicBoardHitCount, savePublicBoard } from 'apis/public';
import { useAlert } from 'react-alert';
import useAuth from 'hooks/useAuth';
const PublicBoard = () => {
const { user } = useAuth();
const [owner, setOwner] = useState();
const [totalCount, setTotalCount] = useState(0);
const [rowsState, setRowsState] = useState({
page: 0,
@ -89,6 +93,9 @@ const PublicBoard = () => {
setCreate(false);
setTitle('공지사항 변경');
setSelectedRow(e?.row);
console.log(user.name === e?.row.inName);
console.log(user.name, e?.row.inName);
setOwner(user.name === e?.row.inName);
modifyPublicBoardHitCount(e?.row?.inCode);
setOpen(true);
}
@ -144,7 +151,7 @@ const PublicBoard = () => {
handleCellClick={handleOnCellClick}
/>
<CmmModal isBackdrop title={title} open={open} setOpen={setOpen}>
<PublicBoardForm create={create} setOpen={setOpen} handleModalSave={submitPublicBoard} {...selectedRow} />
<PublicBoardForm create={create} setOpen={setOpen} owner={owner} rowData={selectedRow} handleModalSave={submitPublicBoard} />
</CmmModal>
</MainCard>
);

@ -4,9 +4,6 @@ import { useAlert } from 'react-alert';
// material-ui
import { Button, Divider, FormControl, Grid, MenuItem, Select, TextField } from '@mui/material';
// assets
// berry ui
import ReactQuill from 'react-quill';
import 'react-quill/dist/quill.snow.css';
@ -16,17 +13,18 @@ import InputLabel from 'ui-component/extended/Form/InputLabel';
import { Delete, List, Save } from '@mui/icons-material';
import { fileDownload } from 'apis/common';
import FileForm from 'views/cmm/file-ctl/FileForm';
import PropTypes from 'prop-types';
const PublicBoardForm = (props) => {
// eslint-disable-next-line react/prop-types
const { create, inCode, inDept, inTitle, inHit, inName, inNalja, inFilename, inContents, setOpen, handleModalSave } = props;
const { create, setOpen, handleModalSave, rowData = {}, owner = false } = props;
const alert = useAlert();
const quillRef = useRef();
const [dept, setDept] = useState(create ? '주정차위반' : inDept);
const [subject, setSubject] = useState(create ? '' : inTitle);
const [contents, setContents] = useState(create ? '' : inContents);
const [dept, setDept] = useState(create ? '주정차위반' : rowData.inDept);
const [subject, setSubject] = useState(create ? '' : rowData.inTitle);
const [contents, setContents] = useState(create ? '' : rowData.inContents);
const [filesInfo, setFilesInfo] = useState();
const [selectedFile, setSelectedFile] = useState(create ? '' : inFilename); //
const [selectedFile, setSelectedFile] = useState(create ? '' : rowData.inFilename); //
// const [fileData, setFileData] = useState();
const onList = () => {
@ -35,7 +33,7 @@ const PublicBoardForm = (props) => {
const onSave = () => {
// TODO : validation check
const formData = new FormData();
formData.append('inCode', inCode ?? '');
formData.append('inCode', rowData.inCode ?? '');
formData.append('inTitle', subject);
formData.append('inDept', dept);
formData.append('inContents', contents);
@ -49,70 +47,46 @@ const PublicBoardForm = (props) => {
};
const onRemove = () => {
handleModalSave('DELETE', inCode);
};
const imageHandler = () => {
const input = document.createElement('input');
input.setAttribute('type', 'file');
input.setAttribute('accept', 'image/*');
input.click();
input.onchange = async () => {
if (input.files) {
const file = input.files[0];
const formData = new FormData();
formData.append('image', file);
console.log(formData);
// input
input.onchange = async () => {
const file = input.files;
if (file !== null) {
formData.append('image', file[0]);
try {
//
// const res = await axios.get('/');
//
const url = '/Users/minuk/Pictures/test.png';
//
const range = quillRef.current?.getEditor().getSelection()?.index;
if (range !== null && range !== undefined) {
const quill = quillRef.current?.getEditor();
quill?.setSelection(range, 1);
quill?.clipboard.dangerouslyPasteHTML(range, `<img src=${url} alt="이미지 태그가 삽입됩니다." />`);
}
} catch (error) {
console.log(error);
}
}
};
}
};
handleModalSave('DELETE', rowData.inCode);
};
const modules = useMemo(
() => ({
toolbar: {
container: [
[{ header: [1, 2, false] }],
['bold', 'italic', 'underline', 'strike', 'blockquote'],
[{ size: ['small', false, 'large', 'huge'] }, { color: [] }],
[{ list: 'ordered' }, { list: 'bullet' }, { indent: '-1' }, { indent: '+1' }, { align: [] }]
[{ list: 'ordered' }, { list: 'bullet' }, { indent: '-1' }, { indent: '+1' }],
['link'],
[{ align: [] }, { color: [] }, { background: [] }], // dropdown with defaults from theme
['clean']
// ['image', 'video']
],
handlers: {
image: imageHandler
}
]
}
}),
[]
);
const formats = useMemo(
() => [
// 'font',
'header',
'bold',
'italic',
'underline',
'strike',
'blockquote',
'list',
'bullet',
'indent',
'link',
'align',
'color',
'background'
],
[]
);
const onChangeFile = (file) => {
setSelectedFile(file.name);
setFilesInfo([file]);
@ -124,11 +98,11 @@ const PublicBoardForm = (props) => {
// };
const handleFileDownload = () => {
if (!inFilename) {
if (!rowData.inFilename) {
alert.show('등록된 파일이 없습니다.');
return;
}
fileDownload(inCode, inFilename, alert).then(() => {});
fileDownload(rowData.inCode, rowData.inFilename, alert).then(() => {});
};
return (
@ -136,11 +110,19 @@ const PublicBoardForm = (props) => {
<Grid mt={2}>
<Grid container spacing={1} item xs={12} mb={1}>
<Grid item xs={12} sm={6}>
<TextField size="small" required label="제목" value={subject} onChange={(e) => setSubject(e.target.value)} fullWidth />
<TextField
size="small"
disabled={!owner}
required
label="제목"
value={subject}
onChange={(e) => setSubject(e.target.value)}
fullWidth
/>
</Grid>
<Grid item xs={12} sm={3}>
<FormControl fullWidth>
<InputLabel required>진술유형</InputLabel>
<InputLabel required>업무구분</InputLabel>
<Select
size="small"
disabled={!create}
@ -157,18 +139,18 @@ const PublicBoardForm = (props) => {
</FormControl>
</Grid>
<Grid item xs={12} sm={3}>
<TextField size="small" disabled label="작성자" value={inName} fullWidth />
<TextField size="small" disabled label="작성자" value={rowData.inName} fullWidth />
</Grid>
</Grid>
<Grid container spacing={1} item xs={12} mt={1}>
<Grid item xs={12} sm={3}>
<TextField size="small" disabled label="등록일" value={inNalja} fullWidth />
<TextField size="small" disabled label="등록일" value={rowData.inNalja} fullWidth />
</Grid>
<Grid item xs={12} sm={3}>
<TextField size="small" disabled label="번호" value={inCode} fullWidth />
<TextField size="small" disabled label="번호" value={rowData.inCode} fullWidth />
</Grid>
<Grid item xs={12} sm={3}>
<TextField size="small" disabled label="조회수" value={inHit} fullWidth />
<TextField size="small" disabled label="조회수" value={rowData.inHit} fullWidth />
</Grid>
</Grid>
<Grid container spacing={1} item xs={12} mt={1}>
@ -179,9 +161,11 @@ const PublicBoardForm = (props) => {
quillRef.current = element;
}
}}
readOnly={!owner}
value={contents}
onChange={setContents}
modules={modules}
formats={formats}
theme="snow"
placeholder="내용을 입력해주세요."
/>
@ -190,9 +174,10 @@ const PublicBoardForm = (props) => {
<Grid container spacing={1} item xs={12} mt={1}>
<Grid item sm={6}>
<FileForm
isDownload={inFilename}
isDownload={rowData.inFilename}
isDisabled={!owner}
labelName="첨부파일"
savedFilename={inFilename}
savedFilename={rowData.inFilename}
selectedFile={selectedFile}
handleChangeFile={onChangeFile}
handleFileDownload={handleFileDownload}
@ -213,13 +198,13 @@ const PublicBoardForm = (props) => {
</Button>
</Grid>
<Grid item style={{ marginLeft: 'auto' }}>
<Button variant="contained" size="small" startIcon={<Save />} onClick={onSave}>
<Button disabled={!owner} variant="contained" size="small" startIcon={<Save />} onClick={onSave}>
저장
</Button>
</Grid>
{!create && (
<Grid item>
<Button variant="contained" size="small" startIcon={<Delete />} onClick={onRemove}>
<Button disabled={!owner} variant="contained" size="small" startIcon={<Delete />} onClick={onRemove}>
삭제
</Button>
</Grid>
@ -228,4 +213,12 @@ const PublicBoardForm = (props) => {
</>
);
};
PublicBoardForm.propTypes = {
rowData: PropTypes.object.isRequired,
handleModalSave: PropTypes.func.isRequired,
setOpen: PropTypes.func.isRequired,
owner: PropTypes.bool.isRequired
};
export default PublicBoardForm;

@ -2,7 +2,7 @@ import { Button, Grid, InputAdornment, TextField } from '@mui/material';
import { FileDownload, FileUpload } from '@mui/icons-material';
import PropTypes from 'prop-types';
const FileForm = ({ isDownload = false, labelName, selectedFile, handleChangeFile, handleFileDownload, alert }) => {
const FileForm = ({ isDownload = false, isDisabled = false, labelName, selectedFile, handleChangeFile, handleFileDownload, alert }) => {
const onChangeFile = (e) => {
const file = e.target.files[0];
if (file.type.includes('image')) {
@ -34,7 +34,7 @@ const FileForm = ({ isDownload = false, labelName, selectedFile, handleChangeFil
)}
</Grid>
<Grid item sm={4.5}>
<Button variant="contained" component="label" color="primary" size="small" startIcon={<FileUpload />}>
<Button disabled={isDisabled} variant="contained" component="label" color="primary" size="small" startIcon={<FileUpload />}>
파일 업로드
<input type="file" hidden onChange={onChangeFile} />
</Button>
@ -47,6 +47,7 @@ FileForm.propTypes = {
isDownload: PropTypes.bool.isRequired,
labelName: PropTypes.number.isRequired,
selectedFile: PropTypes.string,
isDisabled: PropTypes.bool.isRequired,
handleChangeFile: PropTypes.func.isRequired,
handleFileDownload: PropTypes.func.isRequired,
alert: PropTypes.object.isRequired

Loading…
Cancel
Save