DBNT
/
kcscDev
9
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

style: 관리자 - 위원회 일정관리 디자인 변경 건

thkim
thkim 2024-03-04 13:28:34 +09:00
parent bc9f30c502
commit c3582ed28c
1 changed files with 113 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

185
egovframe-template-simple-react-contribution/src/pages/admin/committee/Schedules.jsx
View File

@ -1,12 +1,50 @@
/* eslint-disable jsx-a11y/heading-has-content */
import React, { useState, useEffect, useCallback } from 'react'; import React, { useState, useEffect, useCallback } from 'react';
import { Link, useLocation } from 'react-router-dom'; import { Link, useLocation } from 'react-router-dom';
import styled from "styled-components";
import * as EgovNet from 'api/egovFetch'; import * as EgovNet from 'api/egovFetch';
import URL from 'constants/url'; import URL from 'constants/url';
import CODE from 'constants/code'; import CODE from 'constants/code';
import { default as EgovLeftNav } from 'components/leftmenu/EgovLeftNavAdmin'; import { default as EgovLeftNav } from 'components/leftmenu/EgovLeftNavAdmin';
const StyledDiv = styled.div`
.calendar_list table {
thead tr th {
height: auto;
line-height: 35px;
text-align: left;
}
tbody td {
padding: 0px 5px;
text-align: left;
font-size: 12px;
.day {
display: inline-block;
font-size: 14px;
padding-bottom: 7px;
}
.title {
&:link {
color: #647ea3;
}
&:visited {
color: #647ea3;
}
&::hover {
color: #345ef3;
}
&::active {
color: #345ef3;
}
}
}
}
`;
function Schedules(props) { function Schedules(props) {
@ -154,7 +192,7 @@ function Schedules(props) {
if (scheduleList.length > 0) {//일정 있는 경우 if (scheduleList.length > 0) {//일정 있는 경우
return ( return (
<td key={keyIdx++}> <td key={keyIdx++}>
<Link to={{pathname: URL.ADMIN__COMMITTEE__SCHEDULES__CREATE}} sss="test" state={{ iUseDate: mutsUseYearMonth + sDate + "000000"}} className="day" <Link to={{pathname: URL.ADMIN__COMMITTEE__SCHEDULES__CREATE}} state={{ iUseDate: mutsUseYearMonth + sDate + "000000"}} className="day"
key={keyIdx++}>{day}</Link><br/> key={keyIdx++}>{day}</Link><br/>
{ {
scheduleList.map((schedule, scheduleIdx) => { scheduleList.map((schedule, scheduleIdx) => {
@ -168,8 +206,9 @@ function Schedules(props) {
return ( return (
<> <>
<Link to={{pathname: URL.ADMIN__COMMITTEE__SCHEDULES__DETAIL}} <Link to={{pathname: URL.ADMIN__COMMITTEE__SCHEDULES__DETAIL}}
state={{schdulId: schedule.schdulId}} className="title"
key={keyIdx++}>{schedule.schdulNm} state={{schdulId: schedule.schdulId}}
key={keyIdx++}>{schedule.schdulNm}
</Link> </Link>
<br/> <br/>
</> </>
@ -241,77 +280,79 @@ function Schedules(props) {
<h1 className="tit_1">위원회 일정 관리</h1> <h1 className="tit_1">위원회 일정 관리</h1>
</div> </div>
<h2 className="tit_2"></h2> <StyledDiv>
{/* <!-- 검색조건 --> */} <h2 className="tit_2"></h2>
<div className="condition"> {/* <!-- 검색조건 --> */}
<ul> <div className="condition">
{false && <ul>
<li> {false &&
<label className="f_select" htmlFor="sel1"> <li>
<select name="schdulSe" id="sel1" title="조건" <label className="f_select" htmlFor="sel1">
onChange={e => { <select name="schdulSe" id="sel1" title="조건"
setSearchCondition({ ...searchCondition, schdulSe: e.target.value }); onChange={e => {
setSearchCondition({ ...searchCondition, schdulSe: e.target.value });
}}
>
<option value="">전체</option>
<option value="1">회의</option>
<option value="2">세미나</option>
<option value="3">강의</option>
<option value="4">교육</option>
<option value="5">기타</option>
</select>
</label>
</li>
}
<li className="half L">
<button className="prev"
onClick={() => {
changeDate(CODE.DATE_YEAR, -1);
}} }}
> ></button>
<option value="">전체</option> <span>{searchCondition.year}</span>
<option value="1">회의</option> <button className="next"
<option value="2">세미나</option> onClick={() => {
<option value="3">강의</option> changeDate(CODE.DATE_YEAR, 1);
<option value="4">교육</option> }}
<option value="5">기타</option> ></button>
</select> </li>
</label> <li className="half R">
</li> <button className="prev"
} onClick={() => {
changeDate(CODE.DATE_MONTH, -1);
<li className="half L"> }}
<button className="prev" ></button>
onClick={() => { <span>{(searchCondition.month + 1)}</span>
changeDate(CODE.DATE_YEAR, -1); <button className="next"
}} onClick={() => {
></button> changeDate(CODE.DATE_MONTH, 1);
<span>{searchCondition.year}</span> }}
<button className="next" ></button>
onClick={() => { </li>
changeDate(CODE.DATE_YEAR, 1); </ul>
}} </div>
></button> {/* <!--// 검색조건 --> */}
</li>
<li className="half R">
<button className="prev"
onClick={() => {
changeDate(CODE.DATE_MONTH, -1);
}}
></button>
<span>{(searchCondition.month + 1)}</span>
<button className="next"
onClick={() => {
changeDate(CODE.DATE_MONTH, 1);
}}
></button>
</li>
</ul>
</div>
{/* <!--// 검색조건 --> */}
<div className="calendar_list"> <div className="calendar_list">
<table> <table>
<thead> <thead>
<tr> <tr>
<th>일</th> <th>일</th>
<th>월</th> <th>월</th>
<th>화</th> <th>화</th>
<th>수</th> <th>수</th>
<th>목</th> <th>목</th>
<th>금</th> <th>금</th>
<th>토</th> <th>토</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{true && calendarTag} {true && calendarTag}
</tbody> </tbody>
</table> </table>
</div> </div>
</StyledDiv>
{/* <!--// 본문 --> */} {/* <!--// 본문 --> */}
</div> </div>
</div> </div>