Green Day!
@@ -81,7 +80,6 @@ Green Day는 제로-웨이스트 시도 또는 습관을 기르려는 사람들
- {/* 사과 그림 버튼 추가 부분 */}
{apples.map(apple => (
{
- event.preventDefault(); // 링크의 기본 동작 방지
- setModalOpen(true); //setModalOpen(true)를 호출하여 isModalOpen 상태를 true로 설정해 모달 열기
- };
-
- //모달닫기함수
- const closeModal = () => {
- setModalOpen(false); // 모달 닫기
- };
-
// useEffect(() => {
// fetchData();
// }, []);
@@ -40,7 +21,15 @@ function History() {
// console.error('데이터를 가져오는 중 오류 발생:', error);
// }
// }
-
+ const applebox = [
+ { id: 1, src: 'applebox.png', style: { top: '25%', left: '30%' } },
+ { id: 2, src: 'applebox.png', style: { top: '25%', left: '50%' } },
+ { id: 3, src: 'applebox.png', style: { top: '25%', left: '70%' } },
+ { id: 4, src: 'applebox.png', style: { top: '55%', left: '30%' } },
+ { id: 5, src: 'applebox.png', style: { top: '55%', left: '50%' } },
+ { id: 6, src: 'applebox.png', style: { top: '55%', left: '70%' } },
+ ];
+
return (
<>
@@ -60,11 +49,28 @@ function History() {
}>
}>
+ }>
-
+
+ {applebox.map(applebox => (
+
+ 번호순
+
+
+
+ ))}
+
+
-
>
);
diff --git a/client/greenday_front/src/modiary.js b/client/greenday_front/src/modiary.js
index ac695c32..75fec320 100644
--- a/client/greenday_front/src/modiary.js
+++ b/client/greenday_front/src/modiary.js
@@ -27,16 +27,34 @@ import './modiary.css';
// .then((data) => console.log('Received response:', data))
// .catch((error) => console.error('Error sending data:', error)); // 에러 처리
// };
-
// }
const Modal = ({ isOpen, onClose, onSubmit }) => {
const [text, setText] = useState(''); //text가 값 추적하고 setText함수 통해 상태
const [message, setMessage] = useState('');
+ const [placeholder, setPlaceholder] = useState('');
+ const [title, setTitle] = useState('오늘의 그린일기');
+
+const proverbs = [
+ "일회용품", "재활용", "물", "전기", "배달", "걷기", "카페-텀블러", "분리수거", "제로웨이스트쇼핑", "친환경",
+ "멸종위기", "에코백", "설거지", "자전거", "대중교통", "미세먼지", "식물키우기", "손빨래",
+ "플로깅", "봉사활동", "포장", "헌옷수거"
+ ];
const handleInputChange = (event) => { //입력필드의 값이 변경될때 호출되는 함수
setText(event.target.value); //setText통해 text에 저장하는데 event를 인자로 받아event.target.value를 통해 입력 필드의 현재값을 받아 setText를 사용하여 업데이트
};
+ const getRandomIndex = (length) => {
+ return Math.floor(Math.random() * length)
+ };
+
+ useEffect(() => {
+ if (isOpen) {
+ setPlaceholder(proverbs[getRandomIndex(proverbs.length)]);
+ setTitle(proverbs[getRandomIndex(proverbs.length)]);
+ }
+ }, [isOpen]);
+
const handleSubmit = () => { //입력 필드에서 입력이 변경될 때마다 호출되며, 입력된 값을 setText를 통해 상태 text에 저장
if (text.trim() === '') { //입력필드가 비어있는지 검사, 공백이나 빈칸 제출 못하게함
setMessage('입력된 내용이 없습니다.');
@@ -46,25 +64,17 @@ const Modal = ({ isOpen, onClose, onSubmit }) => {
onSubmit(text); // 글 등록 버튼 클릭 시 동작
setText(''); // 텍스트 입력칸을 초기화=> 다음 입력위해 빈필드갖게함
setMessage('저장됐습니다.');
-
onClose(); //저장하면 하로 닫기게함 지체ㄴㄴ
};
if (!isOpen) {
return null; // 모달이 닫혀 있을 때는 렌더링하지 않음
}
-
- // const handleOverlayClick = (event) => { // 모달 외부를 클릭했을 때 닫기
- // if (event.target === event.currentTarget) {
- // onClose(); //이걸 호출해서 닫음
- // }
- // };
return (
- //
close /*모달닫는버튼*/
-
오늘의 그린일기
+
{title}
//isOpen이'block'이면 요소가 보이고, 'none'이면 요소가 보이지 않음
+ {/* onSubmit 이벤트는 form 요소에서 사용되어야 하므로, button 요소에서는 제거 */}
+ {/* */}
- {/* {message && {message}
} */}
- //
);
};
diff --git a/client/greenday_front/src/xlog.js b/client/greenday_front/src/xlog.js
index 371d1a08..51dadb17 100644
--- a/client/greenday_front/src/xlog.js
+++ b/client/greenday_front/src/xlog.js
@@ -32,16 +32,16 @@ Green Day는 제로-웨이스트 시도 또는 습관을 기르려는 사람들
- 방문자님,
- 환영합니다.
+ 그리너님,
+ 환영합니다.
- alert('사과나무를 눌러서 로그인을 해주세요')}> 홈
- alert('사과나무를 눌러서 로그인을 해주세요')}>게시판
- alert('사과나무를 눌러서 로그인을 해주세요')}>히스토리
- alert('사과나무를 눌러서 로그인을 해주세요')}>그린일기
+ alert('나무를 눌러서 로그인을 해주세요')}> 홈
+ alert('나무를 눌러서 로그인을 해주세요')}>게시판
+ alert('나무를 눌러서 로그인을 해주세요')}>히스토리
+ alert('나무를 눌러서 로그인을 해주세요')}>그린일기
로그인 후 화면