관리자페이지 게시판관리, 메인관리 수정
@ -156,163 +156,162 @@ function bbsMasterExcelDownload(){
|
||||
<input type="hidden" name="pageIndex" value="<c:out value='${searchVO.pageIndex}'/>" />
|
||||
<input type="hidden" name="searchSortCnd" value="<c:out value="${searchVO.searchSortCnd}" />" />
|
||||
<input type="hidden" name="searchSortOrd" value="<c:out value="${searchVO.searchSortOrd}" />" />
|
||||
|
||||
<!-- cont -->
|
||||
<div class="cont_wrap">
|
||||
<div class="box">
|
||||
<div class="cont_tit">
|
||||
<h2>게시판관리</h2>
|
||||
<ul class="cont_nav">
|
||||
<li class="home"><a href="/"><i></i></a></li>
|
||||
<li>
|
||||
<p>게시판관리</p>
|
||||
</li>
|
||||
<li><span class="cur_nav">게시판관리</span></li>
|
||||
</ul>
|
||||
|
||||
<div class="content_title">
|
||||
<h3>게시판관리</h3>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#" class="home" title="메인으로 이동"><i></i></a></li>
|
||||
<li><a href="#">게시판관리</a></li>
|
||||
<li><strong class="current_location">게시판관리</strong></li>
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
<div class="search_area">
|
||||
<div class="search_left">
|
||||
<p class="total_number">총 게시물 <b><c:out value="${paginationInfo.totalRecordCount}" /></b>건</p>
|
||||
</div>
|
||||
<div class="search_right">
|
||||
<select name="" id="" title="검색조건" id="searchCnd" name="searchCnd" class="search_select">
|
||||
<option value="0" <c:if test="${searchVO.searchCnd == '0'}">selected="selected"</c:if>>게시판명/연결매뉴</option>
|
||||
<option value="1" <c:if test="${searchVO.searchCnd == '1'}">selected="selected"</c:if>>게시판유형</option>
|
||||
</select>
|
||||
<div class="search_type input_type">
|
||||
<input type="text" id="searchWrd" name="searchWrd" value="<c:out value='${searchVO.searchWrd}'/>" class="input search_input" placeholder="검색어를 입력하세요" onkeyDown="press(event);" style="width:220px;">
|
||||
</div>
|
||||
<button type="button" class="btn btn_search" onclick="javascript:linkPage('1'); return false;">검색</button>
|
||||
<select class="search_select" name="pageUnit" id="pageUnit" onchange="linkPage(1);" title="줄 선택" style="width: 140px">
|
||||
<option value='10' <c:if test="${searchVO.pageUnit == '10' or searchVO.pageUnit == ''}">selected</c:if>>10줄</option>
|
||||
<option value='20' <c:if test="${searchVO.pageUnit == '20'}">selected</c:if>>20줄</option>
|
||||
<option value='30' <c:if test="${searchVO.pageUnit == '30'}">selected</c:if>>30줄</option>
|
||||
</select>
|
||||
<div class="checkbox_wrap" style="display:inline-flex;align-items:center;">
|
||||
<c:if test="${bbsAttrMngAuth}">
|
||||
<label for="useAt">
|
||||
<input type="checkbox" name="useAt" id="useAt" value="N" onclick="javascript:linkPage('1'); return false;"
|
||||
<c:if test="${'N' eq searchVO.useAt}"> checked='checked' </c:if> >
|
||||
<span>미사용</span>
|
||||
</label>
|
||||
</c:if>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- cont -->
|
||||
<div class="cont">
|
||||
|
||||
<!-- list_top -->
|
||||
<div class="list_top table_top">
|
||||
<p class="table_total_text">총 건수 : <span class="color_blue fw_bold"><c:out value="${paginationInfo.totalRecordCount}" /></span>건</p>
|
||||
<div class="list_util search_wrap">
|
||||
<select class="sel2 searchSel" id="searchCnd" name="searchCnd" title="조회조건" style="min-width: 180px">
|
||||
<option value="0" <c:if test="${searchVO.searchCnd == '0'}">selected="selected"</c:if>>게시판명/연결매뉴</option>
|
||||
<option value="1" <c:if test="${searchVO.searchCnd == '1'}">selected="selected"</c:if>>게시판유형</option>
|
||||
</select>
|
||||
|
||||
<input type="text" id="searchWrd" name="searchWrd" value="<c:out value='${searchVO.searchWrd}'/>" class="search_input" placeholder="검색어를 입력하세요" onkeyDown="press(event);" style="width:220px;">
|
||||
<button class="btn_search btn btn_text btn_36 blue_border" onclick="javascript:linkPage('1'); return false;">검색</button>
|
||||
<select class="sel2" name="pageUnit" id="pageUnit" onchange="linkPage(1);" title="줄 선택" style="width: 140px">
|
||||
<option value='10' <c:if test="${searchVO.pageUnit == '10' or searchVO.pageUnit == ''}">selected</c:if>>10줄</option>
|
||||
<option value='20' <c:if test="${searchVO.pageUnit == '20'}">selected</c:if>>20줄</option>
|
||||
<option value='30' <c:if test="${searchVO.pageUnit == '30'}">selected</c:if>>30줄</option>
|
||||
</select>
|
||||
<div class="check_wrap" style="display:inline-flex;align-items:center;">
|
||||
<c:if test="${bbsAttrMngAuth}">
|
||||
<input type="checkbox" name="useAt" id="useAt" value="N" onclick="javascript:linkPage('1'); return false;" style="margin:0 4px 0 0;"
|
||||
<c:if test="${'N' eq searchVO.useAt}"> checked='checked' </c:if> >
|
||||
<label for="useAt">미사용</label>
|
||||
</c:if>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- //list_top -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- list -->
|
||||
<div class="list tbType01 table-layout mt15">
|
||||
<table>
|
||||
<colgroup>
|
||||
<!-- list -->
|
||||
<div class="table table_type_cols">
|
||||
<table>
|
||||
<colgroup>
|
||||
<c:if test="${bbsAttrMngAuth}">
|
||||
<col style="width: 40px;">
|
||||
</c:if>
|
||||
<col style="width: 6%">
|
||||
<col style="width: 18%">
|
||||
<col style="width: 18%">
|
||||
<col style="width: 10%">
|
||||
<col style="width: 10%">
|
||||
<col style="width: 10%">
|
||||
<col style="width: 6%">
|
||||
<%-- <col style="width: 8%"> --%>
|
||||
<col style="width: 20%">
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<c:if test="${bbsAttrMngAuth}">
|
||||
<th>
|
||||
<input type="checkbox" name="checkAll" id="checkAll" onclick="fn_egov_checkAll();" /><label for="checkAll"></label>
|
||||
</th>
|
||||
</c:if>
|
||||
<th scope="col">번호<button class="sort sortBtn" id="sort_BBS_NM">▲</button></th>
|
||||
<th scope="col">게시판명<button class="sort sortBtn" id="sort_BBS_NM">▲</button></th>
|
||||
<th scope="col">연결된메뉴<button class="sort sortBtn" id="sort_MENU_NM">▲</button></th>
|
||||
<th scope="col">새글/글수<button class="sort sortBtn" id="sort_TOTCNT">▲</button></th>
|
||||
<th scope="col">게시판유형<button class="sort sortBtn" id="sort_BBS_TY_CODE_NM">▲</button></th>
|
||||
<th scope="col">생성일<button class="sort sortBtn" id="sort_FRST_REGIST_PNTTM">▲</button></th>
|
||||
<th scope="col">사용여부<button class="sort sortBtn" id="sort_USE_AT_TXT">▲</button></th>
|
||||
<!-- <th scope="col">관리자</th> -->
|
||||
<th scope="col">게시판 관리</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<c:forEach var="result" items="${resultList}" varStatus="status">
|
||||
<tr>
|
||||
<c:if test="${bbsAttrMngAuth}">
|
||||
<col style="width: 3%">
|
||||
</c:if>
|
||||
<col style="width: 6%">
|
||||
<col style="width: auto">
|
||||
<col style="width: 10%">
|
||||
<col style="width: 10%">
|
||||
<col style="width: 10%">
|
||||
<col style="width: 10%">
|
||||
<col style="width: 9%">
|
||||
<%-- <col style="width: 8%"> --%>
|
||||
<col style="width: 25%">
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<c:if test="${bbsAttrMngAuth}">
|
||||
<th><input type="checkbox" name="checkAll" id="checkAll" onclick="fn_egov_checkAll();" /><label for="checkAll"></label></th>
|
||||
</c:if>
|
||||
<th scope="col">번호<button class="sort sortBtn" id="sort_BBS_NM">▲</button></th>
|
||||
<th scope="col">게시판명<button class="sort sortBtn" id="sort_BBS_NM">▲</button></th>
|
||||
<th scope="col">연결된메뉴<button class="sort sortBtn" id="sort_MENU_NM">▲</button></th>
|
||||
<th scope="col">새글/글수<button class="sort sortBtn" id="sort_TOTCNT">▲</button></th>
|
||||
<th scope="col">게시판유형<button class="sort sortBtn" id="sort_BBS_TY_CODE_NM">▲</button></th>
|
||||
<th scope="col">생성일<button class="sort sortBtn" id="sort_FRST_REGIST_PNTTM">▲</button></th>
|
||||
<th scope="col">사용여부<button class="sort sortBtn" id="sort_USE_AT_TXT">▲</button></th>
|
||||
<!-- <th scope="col">관리자</th> -->
|
||||
<th scope="col">게시판 관리</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<c:forEach var="result" items="${resultList}" varStatus="status">
|
||||
<tr>
|
||||
<c:if test="${bbsAttrMngAuth}">
|
||||
<td>
|
||||
<input type="checkbox" name="checkList" id="${result.bbsId}" value="${result.bbsId}">
|
||||
<label for="${result.bbsId}"></label>
|
||||
</td>
|
||||
</c:if>
|
||||
<td>
|
||||
<c:if test="${searchVO.searchSortOrd eq 'desc' }">
|
||||
<c:out value="${ ( paginationInfo.totalRecordCount - ((paginationInfo.currentPageNo -1)*paginationInfo.recordCountPerPage) ) - status.index }"/>
|
||||
</c:if>
|
||||
<c:if test="${searchVO.searchSortOrd eq 'asc' }">
|
||||
<c:out value="${(paginationInfo.currentPageNo - 1) * paginationInfo.recordCountPerPage + status.count}"/>
|
||||
</c:if>
|
||||
</td>
|
||||
<td>
|
||||
<c:out value="${result.bbsNm}" />
|
||||
</td>
|
||||
<td>
|
||||
<c:out value="${result.menuNm}" />
|
||||
</td>
|
||||
<td>
|
||||
<c:out value="${result.newCnt}/${result.totCnt}" />
|
||||
</td>
|
||||
<td>
|
||||
<c:out value="${result.bbsTyCodeNm}" />
|
||||
</td>
|
||||
<td>
|
||||
<c:out value="${result.frstRegisterPnttm}" />
|
||||
</td>
|
||||
<td>
|
||||
<c:if test="${result.useAt == 'N'}">
|
||||
미사용
|
||||
</c:if>
|
||||
<c:if test="${result.useAt == 'Y'}">
|
||||
<spring:message code="button.use" />
|
||||
</c:if>
|
||||
</td>
|
||||
<%-- <td>
|
||||
<c:forEach var="item" items="${result.mngIdList}" varStatus="status">
|
||||
<a href="/uss/umt/user/EgovUserSelectUpdtView.do?selectedId=${item.esntlId}" target="_blank">${item.emplyrId}</a>
|
||||
<br/>
|
||||
</c:forEach>
|
||||
</td> --%>
|
||||
<td>
|
||||
<c:if test="${bbsAttrMngAuth}">
|
||||
<%-- <input type="button" value="수정" class="btnType1" onclick="javascript:fn_egov_inqire_brdMstr('<c:out value="${result.bbsId}"/>');"> --%>
|
||||
<button type="button" class="btn btn_text btn_30 orange_border btnType01 btn_edit" onclick="javascript:fn_egov_inqire_brdMstr('<c:out value="${result.bbsId}"/>');">수정</button>
|
||||
</c:if>
|
||||
<%-- <input type="button" value="게시판보기" class="btnType2" onclick="location.href='<c:url value='/cop/bbs/selectBoardList.do'/>?bbsId=<c:out value='${result.bbsId}'/>'"> --%>
|
||||
<button type="button" class="btn btn_text btn_30 subgray_border btnType01 btn_look_notice" onclick="location.href='<c:url value='/cop/bbs/selectBoardList.do'/>?bbsId=<c:out value='${result.bbsId}'/>'">게시판보기</button>
|
||||
<%-- <input type="button" value="홈페이지" class="btnType2" onclick="window.open('about:blank').location.href='${result.bbsHomeUrl}'"> --%>
|
||||
<button type="button" class="btn btn_text btn_30 subgray_border btnType01 btn_homepage" onclick="window.open('about:blank').location.href='${result.bbsHomeUrl}'">홈페이지</button>
|
||||
</td>
|
||||
</tr>
|
||||
</c:forEach>
|
||||
<c:if test="${fn:length(resultList) == 0}">
|
||||
<tr>
|
||||
<td nowrap colspan="9">
|
||||
<spring:message code="common.nodata.msg" />
|
||||
</td>
|
||||
</tr>
|
||||
<td>
|
||||
<input type="checkbox" name="checkList" id="${result.bbsId}" value="${result.bbsId}">
|
||||
<label for="${result.bbsId}"></label>
|
||||
</td>
|
||||
</c:if>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<!-- //list -->
|
||||
<td>
|
||||
<c:if test="${searchVO.searchSortOrd eq 'desc' }">
|
||||
<c:out value="${ ( paginationInfo.totalRecordCount - ((paginationInfo.currentPageNo -1)*paginationInfo.recordCountPerPage) ) - status.index }"/>
|
||||
</c:if>
|
||||
<c:if test="${searchVO.searchSortOrd eq 'asc' }">
|
||||
<c:out value="${(paginationInfo.currentPageNo - 1) * paginationInfo.recordCountPerPage + status.count}"/>
|
||||
</c:if>
|
||||
</td>
|
||||
<td>
|
||||
<c:out value="${result.bbsNm}" />
|
||||
</td>
|
||||
<td>
|
||||
<c:out value="${result.menuNm}" />
|
||||
</td>
|
||||
<td>
|
||||
<c:out value="${result.newCnt}/${result.totCnt}" />
|
||||
</td>
|
||||
<td>
|
||||
<c:out value="${result.bbsTyCodeNm}" />
|
||||
</td>
|
||||
<td>
|
||||
<c:out value="${result.frstRegisterPnttm}" />
|
||||
</td>
|
||||
<td>
|
||||
<c:if test="${result.useAt == 'N'}">
|
||||
<span class="status text gray">미사용</span>
|
||||
</c:if>
|
||||
<c:if test="${result.useAt == 'Y'}">
|
||||
<span class="status text blue"><spring:message code="button.use" /></span>
|
||||
</c:if>
|
||||
</td>
|
||||
<%-- <td>
|
||||
<c:forEach var="item" items="${result.mngIdList}" varStatus="status">
|
||||
<a href="/uss/umt/user/EgovUserSelectUpdtView.do?selectedId=${item.esntlId}" target="_blank">${item.emplyrId}</a>
|
||||
<br/>
|
||||
</c:forEach>
|
||||
</td> --%>
|
||||
<td>
|
||||
<div class="btn_wrap center">
|
||||
<c:if test="${bbsAttrMngAuth}">
|
||||
<%-- <input type="button" value="수정" class="btnType1" onclick="javascript:fn_egov_inqire_brdMstr('<c:out value="${result.bbsId}"/>');"> --%>
|
||||
<button type="button" class="btn fill primary_light small" onclick="javascript:fn_egov_inqire_brdMstr('<c:out value="${result.bbsId}"/>');">수정</button>
|
||||
</c:if>
|
||||
<%-- <input type="button" value="게시판보기" class="btnType2" onclick="location.href='<c:url value='/cop/bbs/selectBoardList.do'/>?bbsId=<c:out value='${result.bbsId}'/>'"> --%>
|
||||
<button type="button" class="btn line lightgray small" onclick="location.href='<c:url value='/cop/bbs/selectBoardList.do'/>?bbsId=<c:out value='${result.bbsId}'/>'">게시판보기</button>
|
||||
<%-- <input type="button" value="홈페이지" class="btnType2" onclick="window.open('about:blank').location.href='${result.bbsHomeUrl}'"> --%>
|
||||
<button type="button" class="btn line lightgray small" onclick="window.open('about:blank').location.href='${result.bbsHomeUrl}'">홈페이지</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</c:forEach>
|
||||
<c:if test="${fn:length(resultList) == 0}">
|
||||
<tr>
|
||||
<td nowrap colspan="9">
|
||||
<spring:message code="common.nodata.msg" />
|
||||
</td>
|
||||
</tr>
|
||||
</c:if>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<!-- //list -->
|
||||
|
||||
<!-- btn_wrap -->
|
||||
<div class="btn_wrap">
|
||||
<c:if test="${bbsAttrMngAuth}">
|
||||
<div class="area_left">
|
||||
<button type="button" class="btn btn_text btn_46 subgray_border btnType03" onclick="fn_egov_delete_brdMstrs(); return false;">미사용</button>
|
||||
<div class="left">
|
||||
<button type="button" class="btn xlarge line red" onclick="fn_egov_delete_brdMstrs(); return false;">미사용</button>
|
||||
</div>
|
||||
<div class="area_right">
|
||||
<button type="button" class="btn btn_text btn_46 blue_fill btnType02" onclick="javascript:fn_egov_insert_addBrdMstr(); return false;">등록</button>
|
||||
<div class="center"></div>
|
||||
<div class="right">
|
||||
<button type="button" class="btn xlarge fill primary" onclick="javascript:fn_egov_insert_addBrdMstr(); return false;">등록</button>
|
||||
</div>
|
||||
</c:if>
|
||||
</div>
|
||||
@ -327,10 +326,6 @@ function bbsMasterExcelDownload(){
|
||||
</div>
|
||||
</c:if>
|
||||
<!-- //페이지 네비게이션 끝 -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- //cont -->
|
||||
</div>
|
||||
</form>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -155,206 +155,204 @@ function fn_egov_inqire_BBSMngInqire() {
|
||||
<title>게시판 생성</title>
|
||||
</head>
|
||||
<body>
|
||||
<!-- cont -->
|
||||
<div class="cont_wrap">
|
||||
<div class="box">
|
||||
|
||||
<!-- cont_tit -->
|
||||
<div class="cont_tit">
|
||||
<h2>게시판1생성</h2>
|
||||
</div>
|
||||
<!-- //cont_tit -->
|
||||
|
||||
<form:form commandName="searchForm" name="searchForm" method="get">
|
||||
<input name="pageIndex" type="hidden" value="<c:out value='${searchVO.pageIndex}'/>" />
|
||||
<input name="searchCnd" type="hidden" value="<c:out value='${searchVO.searchCnd}'/>" />
|
||||
<input name="searchWrd" type="hidden" value="<c:out value='${searchVO.searchWrd}'/>" />
|
||||
</form:form>
|
||||
<form:form commandName="boardMaster" name="boardMaster" method="post" action="/cop/bbs/SelectBBSMasterInfs.do">
|
||||
<input name="pageIndex" type="hidden" value="<c:out value='${searchVO.pageIndex}'/>" />
|
||||
<input name="searchCnd" type="hidden" value="<c:out value='${searchVO.searchCnd}'/>" />
|
||||
<input name="searchWrd" type="hidden" value="<c:out value='${searchVO.searchWrd}'/>" />
|
||||
<form:hidden path="bbsMngIds" />
|
||||
|
||||
<div class="cont">
|
||||
<!-- list_상세 -->
|
||||
<div class="tbType02 col-table data-table">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style="width:20%;">
|
||||
<col style="width:80%;">
|
||||
</colgroup>
|
||||
|
||||
<tbody>
|
||||
<c:if test="${siteId eq 'super'}">
|
||||
<tr>
|
||||
<th><span class="reqArea">사이트</span></th>
|
||||
<td>
|
||||
<select name="siteId" id="siteId" title="권한">
|
||||
<c:forEach var="resultList" items="${siteManageList}" varStatus="status">
|
||||
<option value="<c:out value="${resultList.siteId}"/>"
|
||||
<c:if test="${boardMaster.siteId eq resultList.siteId}"> selected='selected' </c:if>>
|
||||
<c:out value="${resultList.siteNm}"/>
|
||||
</option>
|
||||
</c:forEach>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
</c:if>
|
||||
<tr>
|
||||
<th><span class="reqArea">게시판명</span></th>
|
||||
<td colspan="3">
|
||||
<form:input path="bbsNm" title="게시판명" style="width:99%" maxlength="60" />
|
||||
<form:errors path="bbsNm" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><span class="reqArea">게시판유형</span></th>
|
||||
<td colspan="3">
|
||||
<div class="inline radio_wrap">
|
||||
<form:radiobuttons path="bbsTyCode" title="게시판유형"
|
||||
cssStyle="margin-right:5px;" items="${typeList}" itemValue="code" itemLabel="codeNm" />
|
||||
<form:errors path="bbsTyCode" />
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr id="seCmmnCdIdTr" style="display:none;">
|
||||
<th><span class="reqArea">구분</span></th>
|
||||
<td>
|
||||
<select id="seCmmnCdId" name="seCmmnCdId">
|
||||
<option value="01">기관운영관련정보</option>
|
||||
<option value="02">주요사업정보</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<th><span class="reqArea">공지기능</span></th>
|
||||
<td>
|
||||
<form:select path="noticeYn">
|
||||
<form:option value="Y">사용</form:option>
|
||||
<form:option value='N' selected='selected'>미사용</form:option>
|
||||
</form:select>
|
||||
<form:errors path="noticeYn" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="display:none;">
|
||||
<th><span class="reqArea">답글기능</span></th>
|
||||
<td>
|
||||
<form:select path="replyPosblAt" title="답글기능">
|
||||
<form:option value="Y">사용</form:option>
|
||||
<form:option value='N' selected='selected'>미사용</form:option>
|
||||
</form:select>
|
||||
<form:errors path="replyPosblAt" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><span class="reqArea">답변댓글기능</span></th>
|
||||
<td>
|
||||
<form:select path="addYn" title="댓글기능 선택" class="sel2">
|
||||
<form:option value="Y" >사용</form:option>
|
||||
<form:option value='N' >미사용</form:option>
|
||||
</form:select>
|
||||
<form:errors path="addYn" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><span class="reqArea">파일첨부기능</span></th>
|
||||
<td>
|
||||
<form:select path="fileAtchPosblAt">
|
||||
<form:option value="Y">사용</form:option>
|
||||
<form:option value='N'>미사용</form:option>
|
||||
</form:select>
|
||||
<form:errors path="fileAtchPosblAt" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<th><span class="reqArea">파일첨부갯수</span></th>
|
||||
<td>
|
||||
<form:select path="posblAtchFileNumber" title="파일첨부 갯수">
|
||||
<form:option value="0">없음</form:option>
|
||||
<form:option value='1'>1</form:option>
|
||||
<form:option value='2'>2</form:option>
|
||||
<form:option value='3'>3</form:option>
|
||||
<form:option value='4'>4</form:option>
|
||||
<form:option value='5'>5</form:option>
|
||||
<form:option value='6'>6</form:option>
|
||||
<form:option value='7'>7</form:option>
|
||||
<form:option value='8'>8</form:option>
|
||||
<form:option value='9' selected='selected'>9</form:option>
|
||||
|
||||
</form:select>
|
||||
<form:errors path="posblAtchFileNumber" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<th><span class="reqArea">파일첨부사이즈</span></th>
|
||||
<td>
|
||||
<form:input path="posblAtchFileSize" title="파일첨부 사이즈" /> mb
|
||||
<form:errors path="posblAtchFileSize" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="display:none;">
|
||||
<th><span class="reqArea">방문자 글쓰기 사용여부</span></th>
|
||||
<td>
|
||||
<select id="useAt" name="writeYn" title="방문자 글쓰기 사용여부">
|
||||
<option value="Y" >사용</option>
|
||||
<option value="N" selected='selected' >미사용</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><span class="reqArea">조회수 노출여부</span></th>
|
||||
<td>
|
||||
<form:select path="viewsYn" title="조회수 노출여부">
|
||||
<form:option value="Y">사용</form:option>
|
||||
<form:option value='N'>미사용</form:option>
|
||||
</form:select>
|
||||
<form:errors path="viewsYn" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><span class="reqArea">게시판 사용여부</span></th>
|
||||
<td>
|
||||
<form:select path="useAt" title="게시판 사용여부">
|
||||
<form:option value="Y">사용</form:option>
|
||||
<form:option value='N'>미사용</form:option>
|
||||
</form:select>
|
||||
<form:errors path="useAt" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr style="display:none;">
|
||||
<th>관리자 지정</th>
|
||||
<td colspan="3">
|
||||
<span id="mngIdList"></div>
|
||||
|
||||
<a id="menuAdd" value="menuAdd_0" style="cursor:pointer;" target="_blank" title="새창으로" onclick="javascript:fn_egov_inqire_BBSMngInqire(); return false;">
|
||||
<img src="/img/post/serch_img.png" alt="게시판ID 검색" width="15" height="15">
|
||||
<span style="vertical-align: middle;">관리자 검색</span>
|
||||
</a>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<!-- //list_상세 -->
|
||||
|
||||
<!-- btn_wrap -->
|
||||
<div class="btn_wrap btn_layout01 right">
|
||||
<button type="button" class="btn btn_text btn_46 blue_fill btnType06" onclick="fn_egov_regist_brdMstr(); return false;">저 장</button>
|
||||
<button type="button" class="btn btn_text btn_46 gray_fill btnType04" onclick="fn_egov_select_brdMstrList()">목 록</button>
|
||||
</div>
|
||||
<!-- //btn_wrap -->
|
||||
</div>
|
||||
</form:form>
|
||||
<div class="content_title">
|
||||
<h3>게시판 생성</h3>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#" class="home" title="메인으로 이동"><i></i></a></li>
|
||||
<li><a href="#">게시판관리</a></li>
|
||||
<li><strong class="current_location">게시판 생성</strong></li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
<!-- //cont -->
|
||||
|
||||
<form:form commandName="searchForm" name="searchForm" method="get">
|
||||
<input name="pageIndex" type="hidden" value="<c:out value='${searchVO.pageIndex}'/>" />
|
||||
<input name="searchCnd" type="hidden" value="<c:out value='${searchVO.searchCnd}'/>" />
|
||||
<input name="searchWrd" type="hidden" value="<c:out value='${searchVO.searchWrd}'/>" />
|
||||
</form:form>
|
||||
<form:form commandName="boardMaster" name="boardMaster" method="post" action="/cop/bbs/SelectBBSMasterInfs.do">
|
||||
<input name="pageIndex" type="hidden" value="<c:out value='${searchVO.pageIndex}'/>" />
|
||||
<input name="searchCnd" type="hidden" value="<c:out value='${searchVO.searchCnd}'/>" />
|
||||
<input name="searchWrd" type="hidden" value="<c:out value='${searchVO.searchWrd}'/>" />
|
||||
<form:hidden path="bbsMngIds" />
|
||||
|
||||
<!-- list_상세 -->
|
||||
<div class="table table_type_rows">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style="width:200px;">
|
||||
<col style="width:auto;">
|
||||
</colgroup>
|
||||
|
||||
<tbody>
|
||||
<c:if test="${siteId eq 'super'}">
|
||||
<tr>
|
||||
<th><span class="required">*</span>사이트</th>
|
||||
<td>
|
||||
<select name="siteId" id="siteId" title="권한">
|
||||
<c:forEach var="resultList" items="${siteManageList}" varStatus="status">
|
||||
<option value="<c:out value="${resultList.siteId}"/>"
|
||||
<c:if test="${boardMaster.siteId eq resultList.siteId}"> selected='selected' </c:if>>
|
||||
<c:out value="${resultList.siteNm}"/>
|
||||
</option>
|
||||
</c:forEach>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
</c:if>
|
||||
<tr>
|
||||
<th><span class="required">*</span>게시판명</th>
|
||||
<td>
|
||||
<form:input path="bbsNm" title="게시판명" class="input" style="width:50%" maxlength="60" />
|
||||
<form:errors path="bbsNm" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><span class="required">*</span>게시판유형</th>
|
||||
<td>
|
||||
<div class="form_wrap radio_wrap">
|
||||
<form:radiobuttons path="bbsTyCode" title="게시판유형"
|
||||
cssStyle="margin-right:5px;" items="${typeList}" itemValue="code" itemLabel="codeNm" />
|
||||
<form:errors path="bbsTyCode" />
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr id="seCmmnCdIdTr" style="display:none;">
|
||||
<th><span class="required">*</span>구분</th>
|
||||
<td>
|
||||
<select id="seCmmnCdId" name="seCmmnCdId">
|
||||
<option value="01">기관운영관련정보</option>
|
||||
<option value="02">주요사업정보</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<th><span class="required">*</span>공지기능</th>
|
||||
<td>
|
||||
<form:select path="noticeYn">
|
||||
<form:option value="Y">사용</form:option>
|
||||
<form:option value='N' selected='selected'>미사용</form:option>
|
||||
</form:select>
|
||||
<form:errors path="noticeYn" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="display:none;">
|
||||
<th><span class="required">*</span>답글기능</th>
|
||||
<td>
|
||||
<form:select path="replyPosblAt" title="답글기능">
|
||||
<form:option value="Y">사용</form:option>
|
||||
<form:option value='N' selected='selected'>미사용</form:option>
|
||||
</form:select>
|
||||
<form:errors path="replyPosblAt" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><span class="required">*</span>답변댓글기능</th>
|
||||
<td>
|
||||
<form:select path="addYn" title="댓글기능 선택" class="sel2">
|
||||
<form:option value="Y" >사용</form:option>
|
||||
<form:option value='N' >미사용</form:option>
|
||||
</form:select>
|
||||
<form:errors path="addYn" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><span class="required">*</span>파일첨부기능</th>
|
||||
<td>
|
||||
<form:select path="fileAtchPosblAt">
|
||||
<form:option value="Y">사용</form:option>
|
||||
<form:option value='N'>미사용</form:option>
|
||||
</form:select>
|
||||
<form:errors path="fileAtchPosblAt" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<th><span class="required">*</span>파일첨부갯수</th>
|
||||
<td>
|
||||
<form:select path="posblAtchFileNumber" title="파일첨부 갯수">
|
||||
<form:option value="0">없음</form:option>
|
||||
<form:option value='1'>1</form:option>
|
||||
<form:option value='2'>2</form:option>
|
||||
<form:option value='3'>3</form:option>
|
||||
<form:option value='4'>4</form:option>
|
||||
<form:option value='5'>5</form:option>
|
||||
<form:option value='6'>6</form:option>
|
||||
<form:option value='7'>7</form:option>
|
||||
<form:option value='8'>8</form:option>
|
||||
<form:option value='9' selected='selected'>9</form:option>
|
||||
|
||||
</form:select>
|
||||
<form:errors path="posblAtchFileNumber" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<th><span class="required">*</span>파일첨부사이즈</th>
|
||||
<td>
|
||||
<div class="form_wrap input_mix_wrap">
|
||||
<form:input path="posblAtchFileSize" class="input" title="파일첨부 사이즈" /><span class="text_split">mb</span>
|
||||
<form:errors path="posblAtchFileSize" cssClass="error" />
|
||||
</div>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="display:none;">
|
||||
<th><span class="required">*</span>방문자 글쓰기 사용여부</th>
|
||||
<td>
|
||||
<select id="useAt" name="writeYn" title="방문자 글쓰기 사용여부">
|
||||
<option value="Y" >사용</option>
|
||||
<option value="N" selected='selected' >미사용</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><span class="required">*</span>조회수 노출여부</th>
|
||||
<td>
|
||||
<form:select path="viewsYn" title="조회수 노출여부">
|
||||
<form:option value="Y">사용</form:option>
|
||||
<form:option value='N'>미사용</form:option>
|
||||
</form:select>
|
||||
<form:errors path="viewsYn" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><span class="required">*</span>게시판 사용여부</th>
|
||||
<td>
|
||||
<form:select path="useAt" title="게시판 사용여부">
|
||||
<form:option value="Y">사용</form:option>
|
||||
<form:option value='N'>미사용</form:option>
|
||||
</form:select>
|
||||
<form:errors path="useAt" cssClass="error" />
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr style="display:none;">
|
||||
<th>관리자 지정</th>
|
||||
<td>
|
||||
<span id="mngIdList"></div>
|
||||
|
||||
<a id="menuAdd" value="menuAdd_0" style="cursor:pointer;" target="_blank" title="새창으로" onclick="javascript:fn_egov_inqire_BBSMngInqire(); return false;">
|
||||
<img src="/img/post/serch_img.png" alt="게시판ID 검색" width="15" height="15">
|
||||
<span style="vertical-align: middle;">관리자 검색</span>
|
||||
</a>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<!-- //list_상세 -->
|
||||
|
||||
<!-- btn_wrap -->
|
||||
<div class="btn_wrap right">
|
||||
<button type="button" class="btn xlarge fill primary" onclick="fn_egov_regist_brdMstr(); return false;">저 장</button>
|
||||
<button type="button" class="btn xlarge fill gray" onclick="fn_egov_select_brdMstrList()">목 록</button>
|
||||
</div>
|
||||
<!-- //btn_wrap -->
|
||||
</form:form>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
@ -8,11 +8,7 @@
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title>배너 목록조회</title>
|
||||
<style type="text/css">
|
||||
h1 {font-size:12px;}
|
||||
caption {visibility:hidden; font-size:0; height:0; margin:0; padding:0; line-height:0;}
|
||||
</style>
|
||||
<title>배너 관리</title>
|
||||
<script type="text/javaScript" language="javascript" defer="defer">
|
||||
$(document).ready(function(){
|
||||
|
||||
@ -129,98 +125,85 @@ function press() {
|
||||
<input type="hidden" name="searchSortOrd" value="<c:out value="${bannerVO.searchSortOrd}" />" />
|
||||
<input type="hidden" name="seCd" value="<c:out value="${bannerVO.seCd}" />" />
|
||||
|
||||
<!-- cont -->
|
||||
<div class="cont_wrap">
|
||||
<div class="box">
|
||||
|
||||
<!-- cont_tit -->
|
||||
<div class="cont_tit">
|
||||
<h2>
|
||||
배너관리
|
||||
</h2>
|
||||
<ul class="cont_nav">
|
||||
<li class="home"><a href="/"><i></i></a></li>
|
||||
<li><p>메인관리</p></li>
|
||||
<li><span class="cur_nav">배너관리</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- //cont_tit -->
|
||||
|
||||
<div class="cont">
|
||||
<!-- list_top -->
|
||||
<div class="list_top table_top">
|
||||
<p class="table_total_text">조회건수 : <span class="color_blue fw_bold"><c:out value="${paginationInfo.totalRecordCount}"/></span>건</p>
|
||||
<div class="list_util search_wrap">
|
||||
<c:if test="${siteId eq 'super'}">
|
||||
<select name="searchConditionSite" id="searchConditionSite">
|
||||
<option value="" <c:if test="${empty userSearchVO.searchConditionSite }">selected="selected"</c:if> >전체 사이트</option>
|
||||
<c:forEach var="result" items="${siteManageList}" varStatus="status">
|
||||
<option value="${result.siteId}" <c:if test="${result.siteId eq bannerVO.searchConditionSite }">selected="selected"</c:if> >${result.siteNm}</option>
|
||||
</c:forEach>
|
||||
</select>
|
||||
</c:if>
|
||||
<select name="searchCondition" id="searchCondition">
|
||||
<option value=''>전체</option>
|
||||
<option value='1' <c:if test="${bannerVO.searchCondition == '1'}">selected</c:if>>배너명</option>
|
||||
<option value='2' <c:if test="${bannerVO.searchCondition == '2'}">selected</c:if>>링크</option>
|
||||
</select>
|
||||
<input type="text" id="searchKeyword" name="searchKeyword" class="search_input" value="<c:out value='${bannerVO.searchKeyword}'/>" maxlength="255" placeholder="검색어를 입력하세요">
|
||||
<button class="btn btn_text blue_border btn_search" onclick="linkPage(1); return false;">검색</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- //list_top -->
|
||||
|
||||
<!-- list -->
|
||||
<div class="list list_gallery">
|
||||
<c:forEach var="result" items="${bannerList}" varStatus="status">
|
||||
<article onclick="javascript:fncSelectBanner('${result.bannerId}'); return false;">
|
||||
<c:if test="${result.reflctAt eq 'Y'}">
|
||||
<p class="gallery_util use_gallery">
|
||||
사용
|
||||
</p>
|
||||
</c:if>
|
||||
<c:if test="${result.reflctAt ne 'Y'}">
|
||||
<p class="gallery_util">
|
||||
미사용
|
||||
</p>
|
||||
</c:if>
|
||||
<a href="" class="img_area">
|
||||
<img onerror="this.src='/img/noImg.png'" src="<c:url value='/uss/ion/pwm/getImage.do'/>?atchFileId=<c:out value="${result.bannerImageFile}"/>" alt="">
|
||||
</a>
|
||||
<a href="/" class="text_area">
|
||||
<p class="list_tit">${result.bannerNm}</p>
|
||||
<div class="list_info">
|
||||
<span class="list_writer">작성자 : ${result.registerId}</span>
|
||||
<span>노출순서 : ${result.sortOrdr}</span>
|
||||
<span class="list_date">${result.regDate}</span>
|
||||
</div>
|
||||
</a>
|
||||
</article>
|
||||
<div class="content_title">
|
||||
<h3>배너관리</h3>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#" class="home" title="메인으로 이동"><i></i></a></li>
|
||||
<li><a href="#">메인관리</a></li>
|
||||
<li><strong class="current_location">배너관리</strong></li>
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
<div class="search_area">
|
||||
<div class="search_left">
|
||||
<p class="total_number">조회건수 <b><c:out value="${paginationInfo.totalRecordCount}"/></b>건</p>
|
||||
</div>
|
||||
<div class="search_right">
|
||||
<c:if test="${siteId eq 'super'}">
|
||||
<select name="searchConditionSite" id="searchConditionSite" class="search_select">
|
||||
<option value="" <c:if test="${empty userSearchVO.searchConditionSite }">selected="selected"</c:if> >전체 사이트</option>
|
||||
<c:forEach var="result" items="${siteManageList}" varStatus="status">
|
||||
<option value="${result.siteId}" <c:if test="${result.siteId eq bannerVO.searchConditionSite }">selected="selected"</c:if> >${result.siteNm}</option>
|
||||
</c:forEach>
|
||||
<c:if test="${empty bannerList}">
|
||||
<div class="board1_btn">
|
||||
<ul style="text-align: center;"><spring:message code="common.nodata.msg" /></ul>
|
||||
</div>
|
||||
</c:if>
|
||||
</div>
|
||||
<!-- //list -->
|
||||
<div class="btn_wrap right">
|
||||
<!-- <button type="button" class="btnType01" onclick="fncBannerListDelete(); return false;">삭제</button> -->
|
||||
<button type="button" class="btn btn_text btn_46 blue_fill btnType02" onclick="fncAddBannerInsert(); return false;">등록</button>
|
||||
</div>
|
||||
<!-- 페이지 네비게이션 시작 -->
|
||||
<c:if test="${!empty bannerList}">
|
||||
<div class="page">
|
||||
<ul class="inline">
|
||||
<ui:pagination paginationInfo = "${paginationInfo}" type="image" jsFunction="linkPage" />
|
||||
</ul>
|
||||
</div>
|
||||
</c:if>
|
||||
<!-- //페이지 네비게이션 끝 -->
|
||||
|
||||
</div>
|
||||
</select>
|
||||
</c:if>
|
||||
<select name="searchCondition" id="searchCondition" class="search_select">
|
||||
<option value=''>전체</option>
|
||||
<option value='1' <c:if test="${bannerVO.searchCondition == '1'}">selected</c:if>>배너명</option>
|
||||
<option value='2' <c:if test="${bannerVO.searchCondition == '2'}">selected</c:if>>링크</option>
|
||||
</select>
|
||||
<input type="text" id="searchKeyword" name="searchKeyword" class="input search_input" value="<c:out value='${bannerVO.searchKeyword}'/>" maxlength="255" placeholder="검색어를 입력하세요">
|
||||
<button class="btn btn_search" onclick="linkPage(1); return false;">검색</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- list -->
|
||||
<ul class="gallery_list">
|
||||
<c:forEach var="result" items="${bannerList}" varStatus="status">
|
||||
<li>
|
||||
<a href="#" onclick="javascript:fncSelectBanner('${result.bannerId}'); return false;">
|
||||
<c:if test="${result.reflctAt eq 'Y'}">
|
||||
<span class="status primary">사용</span>
|
||||
</c:if>
|
||||
<c:if test="${result.reflctAt ne 'Y'}">
|
||||
<span class="status gray">미사용</span>
|
||||
</c:if>
|
||||
<div class="images_area">
|
||||
<img onerror="this.src='/img/noImg.png'" src="<c:url value='/uss/ion/pwm/getImage.do'/>?atchFileId=<c:out value="${result.bannerImageFile}"/>" alt="">
|
||||
</div>
|
||||
<div class="list_content">
|
||||
<b class="list_title">${result.bannerNm}</b>
|
||||
<ul class="list_info">
|
||||
<li>작성자 ${result.registerId}</li>
|
||||
<li>노출순서 ${result.sortOrdr}</li>
|
||||
<li>${result.regDate}</li>
|
||||
</ul>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</c:forEach>
|
||||
<c:if test="${empty bannerList}">
|
||||
<div class="board1_btn w100per" style="text-align:center;">
|
||||
<spring:message code="common.nodata.msg" />
|
||||
</div>
|
||||
</c:if>
|
||||
</ul>
|
||||
|
||||
|
||||
<div class="btn_wrap right">
|
||||
<!-- <button type="button" class="btnType01" onclick="fncBannerListDelete(); return false;">삭제</button> -->
|
||||
<button type="button" class="btn xlarge fill primary" onclick="fncAddBannerInsert(); return false;">등록</button>
|
||||
</div>
|
||||
<!-- 페이지 네비게이션 시작 -->
|
||||
<c:if test="${!empty bannerList}">
|
||||
<div class="page">
|
||||
<ul class="inline">
|
||||
<ui:pagination paginationInfo = "${paginationInfo}" type="image" jsFunction="linkPage" />
|
||||
</ul>
|
||||
</div>
|
||||
</c:if>
|
||||
<!-- //페이지 네비게이션 끝 -->
|
||||
|
||||
</form>
|
||||
<form name="item" method="post" action="<c:url value='/uss/ion/bnr/getBanner.do'/>">
|
||||
<input type="hidden" name="bannerId" value="">
|
||||
|
||||
@ -1,6 +1,9 @@
|
||||
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
|
||||
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<%@ taglib prefix="decorator" uri="http://www.opensymphony.com/sitemesh/decorator" %>
|
||||
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
|
||||
<c:set var="URL" value="${pageContext.request.requestURL}" />
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
|
||||
@ -9,31 +12,39 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>관리자페이지</title>
|
||||
|
||||
|
||||
<!-- 분쟁조정 -->
|
||||
<!-- css -->
|
||||
<link rel="stylesheet" href="/kofair_case_seed/css/reset.css">
|
||||
<link rel="stylesheet" href="/kofair_case_seed/css/font.css">
|
||||
<link rel="stylesheet" href="/kofair_case_seed/adm/style/layout.css">
|
||||
<link rel="stylesheet" href="/kofair_case_seed/adm/style/common.css">
|
||||
<link rel="stylesheet" href="/kofair_case_seed/adm/style/style.css">
|
||||
<link rel="stylesheet" href="/css/reset.css">
|
||||
<link rel="stylesheet" href="/css/font.css">
|
||||
|
||||
<link rel="stylesheet" href="/publish/adm/layout/layout.css">
|
||||
<link rel="stylesheet" href="/publish/adm/css/common.css">
|
||||
<link rel="stylesheet" href="/publish/adm/css/style.css">
|
||||
<link rel="stylesheet" href="/publish/adm/css/button.css">
|
||||
<link rel="stylesheet" href="/publish/adm/css/tab.css">
|
||||
<link rel="stylesheet" href="/publish/adm/css/table.css">
|
||||
<link rel="stylesheet" href="/publish/adm/css/calendar.css">
|
||||
<link rel="stylesheet" href="/publish/adm/css/popup.css">
|
||||
|
||||
|
||||
<!-- script -->
|
||||
<script src="/kofair_case_seed/script/lib/jquery-3.5.0.js"></script>
|
||||
<script src="/kofair_case_seed/adm/scripts/common.js"></script>
|
||||
<script src="/kofair_case_seed/adm/scripts/layout.js"></script>
|
||||
<!-- 분쟁조정 끝 -->
|
||||
|
||||
<script src="/kccadrPb/adm/script/content.js"></script>
|
||||
|
||||
<script src="<c:url value='/js/ncms_common.js' />"></script><%-- 전자조정 --%>
|
||||
|
||||
<script src="/js/jquery-3.5.0.js"></script>
|
||||
<script src="/publish/adm/layout/layout.js"></script>
|
||||
<script src="/publish/adm/script/tab.js"></script>
|
||||
<script src="/publish/adm/script/content.js"></script>
|
||||
|
||||
<!-- 캘린더 -->
|
||||
<script type="module" src="/js/plugin/datapicker/duet.esm.js"></script>
|
||||
<script nomodule src="/js/plugin/datapicker/duet.js"></script>
|
||||
<link rel="stylesheet" href="/js/plugin/datapicker/default.css">
|
||||
|
||||
<!-- 전에 썼던것 -->
|
||||
<%-- <script src="/kccadrPb/adm/script/content.js"></script>
|
||||
<script src="<c:url value='/js/ncms_common.js' />"></script> <!-- 전자조정 -->
|
||||
<script src="/kccadrPb/adm/script/postcode.js"></script>
|
||||
|
||||
<script src="<c:url value='/js/kccadr/kccadrCom.js' />"></script>
|
||||
<script src="<c:url value='/js/antdatepicker/moment.min.js'/>"></script>
|
||||
<script src="/js/lib/jquery.blockUI.js"></script> --%>
|
||||
|
||||
<script src="/js/lib/jquery.blockUI.js"></script>
|
||||
<script>
|
||||
</script>
|
||||
</head>
|
||||
@ -43,11 +54,29 @@
|
||||
<body>
|
||||
<div class="wrap">
|
||||
<c:import url="/sym/mms/EgovMainMenuLeft.do" />
|
||||
<div class="contents">
|
||||
<%-- <div class="container" id="container">
|
||||
<c:import url="/sym/mms/EgovMainMenuHead.do" />
|
||||
<decorator:body />
|
||||
</div>
|
||||
</div> --%>
|
||||
<c:choose>
|
||||
<c:when test="${!fn:contains(URL , 'main/mainPage.do')}">
|
||||
<div class="container sub">
|
||||
<c:import url="/sym/mms/EgovMainMenuHead.do" />
|
||||
<div class="content_wrap">
|
||||
<decorator:body />
|
||||
</div>
|
||||
<c:import url="/sym/mms/EgovMainFooter.do" />
|
||||
</div>
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
<div class="container dashboard">
|
||||
<c:import url="/sym/mms/EgovMainMenuHead.do" />
|
||||
<decorator:body />
|
||||
<c:import url="/sym/mms/EgovMainFooter.do" />
|
||||
</div>
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
</div>
|
||||
<c:import url="/sym/mms/EgovMainFooter.do" />
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -25,19 +25,18 @@
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<title>관리자 대시보드</title>
|
||||
<!-- css -->
|
||||
<link rel="stylesheet" href="/kofair_case_seed/css/reset.css">
|
||||
<link rel="stylesheet" href="/kofair_case_seed/css/font.css">
|
||||
<link rel="stylesheet" href="/kofair_case_seed/adm/style/layout.css">
|
||||
<link rel="stylesheet" href="/kofair_case_seed/adm/style/common.css">
|
||||
<link rel="stylesheet" href="/kofair_case_seed/adm/style/index.css">
|
||||
|
||||
<!-- css -->
|
||||
<link rel="stylesheet" href="/css/reset.css">
|
||||
<link rel="stylesheet" href="/css/font.css">
|
||||
<link rel="stylesheet" href="/publish/adm/layout/layout.css">
|
||||
<link rel="stylesheet" href="/publish/adm/css/common.css">
|
||||
<link rel="stylesheet" href="/publish/adm/css/dashboard.css">
|
||||
|
||||
<!-- script -->
|
||||
<script src="/kofair_case_seed/script/lib/jquery-3.5.0.js"></script>
|
||||
<script src="/kofair_case_seed/adm/scripts/common.js"></script>
|
||||
<script src="/kofair_case_seed/adm/scripts/layout.js"></script>
|
||||
<script src="<c:url value='/js/jquery.js' />"></script>
|
||||
<script src="/js/jquery-3.5.0.js"></script>
|
||||
|
||||
<script type="text/javaScript" language="javascript">
|
||||
|
||||
$(document).ready(function(){
|
||||
@ -104,6 +103,218 @@
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<!-- cont -->
|
||||
<div class="box_wrap">
|
||||
<div class="box">
|
||||
<div class="box_tit">
|
||||
<p>오늘의 교육 진행 현황</p>
|
||||
</div>
|
||||
<div class="box_cont today_box">
|
||||
<div class="today_status status01">
|
||||
<p>교육접수</p>
|
||||
<i></i>
|
||||
<span>18</span>
|
||||
</div>
|
||||
<i class="status_pcs"></i>
|
||||
<div class="today_status status02">
|
||||
<p>교육진행</p>
|
||||
<i></i>
|
||||
<span>18</span>
|
||||
</div>
|
||||
<i class="status_pcs"></i>
|
||||
<div class="today_status status03">
|
||||
<p>교육완료</p>
|
||||
<i></i>
|
||||
<span>18</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<div class="box_tit">
|
||||
<p>교육관리</p>
|
||||
</div>
|
||||
<div class="box_cont system_box">
|
||||
<a href="#" class="btn_system system01">
|
||||
<p>교육 일정관리</p>
|
||||
<span>바로가기 ></span>
|
||||
</a>
|
||||
<a href="#" class="btn_system system02">
|
||||
<p>고육 종료관리</p>
|
||||
<span>바로가기 ></span>
|
||||
</a>
|
||||
<a href="#" class="btn_system system03">
|
||||
<p>교육 신청관리</p>
|
||||
<span>바로가기 ></span>
|
||||
</a>
|
||||
<a href="#" class="btn_system system04">
|
||||
<p>교육 강사관리</p>
|
||||
<span>바로가기 ></span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<div class="box_tit">
|
||||
<p>교육건수</p>
|
||||
</div>
|
||||
<div class="box_cont ds_box">
|
||||
<ul class="chartType01">
|
||||
<li>
|
||||
<p>접수</p>
|
||||
<div class="chart_wrap">
|
||||
<div></div>
|
||||
</div>
|
||||
<p class="case_number"><span>30</span>건</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>승인</p>
|
||||
<div class="chart_wrap">
|
||||
<div></div>
|
||||
</div>
|
||||
<p class="case_number"><span>30</span>건</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>진행</p>
|
||||
<div class="chart_wrap">
|
||||
<div></div>
|
||||
</div>
|
||||
<p class="case_number"><span>30</span>건</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>대기</p>
|
||||
<div class="chart_wrap">
|
||||
<div></div>
|
||||
</div>
|
||||
<p class="case_number"><span>30</span>건</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>완료</p>
|
||||
<div class="chart_wrap">
|
||||
<div></div>
|
||||
</div>
|
||||
<p class="case_number"><span>30</span>건</p>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul class="chart_num">
|
||||
<li>0</li>
|
||||
<li>10</li>
|
||||
<li>20</li>
|
||||
<li>30</li>
|
||||
<li>40</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<div class="box_tit">
|
||||
<p>교육신청현황</p>
|
||||
<button type="button" class="btn_plus">더보기 <i class="icon plus"></i></button>
|
||||
</div>
|
||||
<div class="box_cont">
|
||||
<ul class="dashboard_list">
|
||||
<li>
|
||||
<a href="#" class="list_tit">· 상표권 교육조건부 기소유예</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="list_date">2025-08-08</p>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="list_tit">· 상표권 교육조건부 기소유예</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="list_date">2025-08-08</p>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="list_tit">· 상표권 교육조건부 기소유예</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="list_date">2025-08-08</p>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="list_tit">· 상표권 교육조건부 기소유예</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="list_date">2025-08-08</p>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="list_tit">· 상표권 교육조건부 기소유예</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="list_date">2025-08-08</p>
|
||||
</li>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<div class="box_tit">
|
||||
<p>교육진행현황</p>
|
||||
<button type="button" class="btn_plus">더보기 <i class="icon plus"></i></button>
|
||||
</div>
|
||||
<div class="box_cont">
|
||||
<ul class="dashboard_list status">
|
||||
<li>
|
||||
<a href="#" class="list_tit">· <img src="/publish/adm/images/component/icon_new.png" class="icon_new"> 상표권 교육조건부 기소유예</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="status line gray">배정완료</p>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="list_tit">· 상표권 교육조건부 기소유예</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="status line blue">승인요청</p>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="list_tit">· 상표권 교육조건부 기소유예</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="status line orange">대기중</p>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="list_tit">· 상표권 교육조건부 기소유예</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="status line gray">배정완료</p>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="list_tit">· 상표권 교육조건부 기소유예</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="status line gray">배정완료</p>
|
||||
</li>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<div class="box_tit">
|
||||
<p>교육종료현황</p>
|
||||
<button type="button" class="btn_plus">더보기 <i class="icon plus"></i></button>
|
||||
</div>
|
||||
<div class="box_cont">
|
||||
<ul class="dashboard_list status">
|
||||
<li>
|
||||
<a href="#" class="list_tit">· 인사교육 프로그램 교재의 저작물</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="status fill gray">보고완료</p>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="list_tit">· 음악저작물 제작 및 이용에 따른</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="status fill green">설문진행</p>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="list_tit">· 부주의에 의한 성명표시권 침해</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="status fill purple">비용지급</p>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="list_tit">· 학위논문에서의 정당한 인용의 문제</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="status fill gray">보고완료</p>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="list_tit">· 저작물 이용허락 요청 후 무단이용</a>
|
||||
<p class="list_writer">admin</p>
|
||||
<p class="status fill gray">보고완료</p>
|
||||
</li>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- //cont -->
|
||||
|
||||
|
||||
|
||||
<!-- 적용 후 삭제 -->
|
||||
<div class="main">
|
||||
<div class="contents">
|
||||
<div class="box_wrap">
|
||||
|
||||
@ -17,16 +17,16 @@
|
||||
|
||||
$( document).ready(function() {
|
||||
|
||||
leftMenu();
|
||||
//leftMenu();
|
||||
|
||||
if('${requestURI}' != '/cmm/main/mainPage.do'){
|
||||
var subMenuNo = $("#baseMenuNo").val();
|
||||
// alert("subMenuNo :: " + subMenuNo);
|
||||
// $("#top_"+subMenuNo).parents("ul").addClass("active");
|
||||
// $("#top_"+subMenuNo).parents("ul").parents("li").addClass("active");
|
||||
$("#top_"+subMenuNo).addClass("active");
|
||||
$("#top_"+subMenuNo).parent("ul").addClass("active");
|
||||
$("#top_"+subMenuNo).parents("ul").parents("li").addClass("active");
|
||||
$("#top_"+subMenuNo).addClass("on");
|
||||
$("#top_"+subMenuNo).parent("ul").addClass("on");
|
||||
$("#top_"+subMenuNo).parents("ul").parents("li").addClass("on");
|
||||
}
|
||||
|
||||
});
|
||||
@ -47,23 +47,23 @@ $( document).ready(function() {
|
||||
</script>
|
||||
|
||||
<!-- leftmenu -->
|
||||
<div class="leftmenu">
|
||||
<div class="menu_wrap">
|
||||
<h1 class="logo"><a href="/cmm/main/mainPage.do"><!-- <img src="/kofair_case_seed/adm/images/layout/logo.png" alt="FAIR 한국공정거래조정원 분쟁조정사건처리시스템"> -->test</a></h1>
|
||||
<nav class="menu">
|
||||
<ul class="menu_ul">
|
||||
<c:forEach var="result" items="${list_headmenu}" varStatus="status">
|
||||
<li class="depth01_li">
|
||||
<li class="depth01">
|
||||
<!-- depth01 -->
|
||||
<button type="button" class="menu_title">
|
||||
<i class="icon menu_icon site"></i>
|
||||
<!-- <i class="icon menu_icon site"></i> -->
|
||||
<c:out value="${result.menuNm}" />
|
||||
</button>
|
||||
<!-- //depth01 -->
|
||||
<!-- depth02 -->
|
||||
<ul class="depth02_ul">
|
||||
<ul class="depth02">
|
||||
<c:forEach var="resultSub" items="${list_menulist}" varStatus="statusSub">
|
||||
<c:if test="${result.menuNo eq resultSub.upperMenuId}">
|
||||
<li class="depth02_li" id="top_${resultSub.menuNo}" value='${resultSub.menuNm}' onclick="javascript:goMenuPage('<c:out value="${resultSub.menuNo}"/>', '${resultSub.chkURL}')">
|
||||
<li id="top_${resultSub.menuNo}" value='${resultSub.menuNm}' onclick="javascript:goMenuPage('<c:out value="${resultSub.menuNo}"/>', '${resultSub.chkURL}')">
|
||||
<a href="#none"><c:out value="${resultSub.menuNm}" /></a>
|
||||
</li>
|
||||
</c:if>
|
||||
|
||||
@ -130,59 +130,44 @@ function TopnavXHR(url, data, callbackFunc, exceptionFunc , localStartFunc , loc
|
||||
|
||||
|
||||
|
||||
<!-- top_utill -->
|
||||
<div class="top_util">
|
||||
|
||||
<ul class="user_util">
|
||||
<li class="final_date">
|
||||
<i></i>
|
||||
<p>최종접속일시 : </p><span><c:out value="${beforeLoginDate}"/></span>
|
||||
</li>
|
||||
<li class="ip">
|
||||
<i></i>
|
||||
<p>IP : <c:out value="${IP}"/></p>
|
||||
</li>
|
||||
<li class="time_out">
|
||||
<i></i>
|
||||
<p>로그인 타임아웃 : <span class="view_timer" id="ViewTimer">55분 20초</span></p>
|
||||
<button type="button" class="btn_extend" onclick="sessionExpend(); return false;">연장</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="user_info">
|
||||
<div class="area_right">
|
||||
<ul class="user_info_ul">
|
||||
<li>
|
||||
<select name="" id="">
|
||||
<option value="">관리팀</option>
|
||||
<option value="">관리팀2</option>
|
||||
</select>
|
||||
</li>
|
||||
<li>
|
||||
<c:out value="${LoginVO.name}" />(<c:out value="${LoginVO.id}" />)
|
||||
</li>
|
||||
</ul>
|
||||
<button type="button" class="btn btn_logout" onclick="location.href='/uat/uia/actionLogout.do'">로그아웃</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!-- user_info -->
|
||||
<div class="user_info">
|
||||
<ul class="user_util_ul">
|
||||
<li>
|
||||
<i class="icon time"></i>
|
||||
<!-- 최종접속일시 : 2024-07-08 14:51 -->
|
||||
최종접속일시 : <c:out value="${beforeLoginDate}"/>
|
||||
</li>
|
||||
<li>
|
||||
<i class="icon ip"></i>
|
||||
IP : <c:out value="${IP}"/>
|
||||
</li>
|
||||
<li>
|
||||
<i class="icon timeout"></i>
|
||||
로그인 타임아웃 : <span class="color_orange fw_bold" id="ViewTimer"></span>
|
||||
<button type="button" class="btn btn_text orange_border light_orange_fill btn_extension" onclick="sessionExpend(); return false;">
|
||||
연장
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="area_right">
|
||||
<ul class="user_info_ul">
|
||||
<li>
|
||||
<%-- <select onchange="fn_change_dept(this.value)" style="box-shadow:none">
|
||||
<c:forEach var="ed" items="${enaDept}" varStatus="stss">
|
||||
<option value="${ed.CODE_IDXS}" <c:if test="${ed.CODE_IDXS eq memDept}">selected="selected"</c:if>>${ed.CODE_NAME}</option>
|
||||
</c:forEach>
|
||||
</select> --%>
|
||||
</li>
|
||||
<li>
|
||||
<i class="icon user"></i>
|
||||
<c:out value="${LoginVO.name}" />
|
||||
(<c:out value="${LoginVO.id}" />)
|
||||
</li>
|
||||
</ul>
|
||||
<button type="button" class="btn btn_text gray_fill btn_logout" onclick="location.href='/uat/uia/actionLogout.do'">로그아웃</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- //user_info -->
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- //top_utill -->
|
||||
|
||||
|
||||
|
||||
|
||||
@ -139,9 +139,9 @@ function fn_egov_downFile(atchFileId, fileSn){
|
||||
|
||||
</script>
|
||||
<style>
|
||||
.del_file_btn{border: none;background-color: transparent;background-image: url(/direct/img/upload_delect_img.png);background-repeat: no-repeat;background-position: center center;vertical-align: middle;margin-top: -4px;margin-right: 15px;}
|
||||
/* .del_file_btn{border: none;background-color: transparent;background-image: url(/direct/img/upload_delect_img.png);background-repeat: no-repeat;background-position: center center;vertical-align: middle;margin-top: -4px;margin-right: 15px;}
|
||||
.file_size{color: #0388d2;font-weight: bold;}
|
||||
.uploaded_obj{width: 100%;}
|
||||
.uploaded_obj{width: 100%;} */
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@ -158,184 +158,184 @@ function fn_egov_downFile(atchFileId, fileSn){
|
||||
<input type="hidden" name="menuName" value="mainzone" />
|
||||
<input type="hidden" name="fmsId" value="${mainzoneVO.mazId}" />
|
||||
<input type="hidden" name="limitcount" value="1" /><!-- 최대 업로드 파일갯수 -->
|
||||
|
||||
<!-- cont -->
|
||||
<div class="cont_wrap">
|
||||
<div class="box">
|
||||
|
||||
<!-- cont_tit -->
|
||||
<div class="cont_tit">
|
||||
<h2>메인비주얼 등록/수정</h2>
|
||||
<ul class="cont_nav">
|
||||
<li class="home"><a href="/"><i></i></a></li>
|
||||
<li><p>메인관리</p></li>
|
||||
<li><p>메인비주얼관리</p></li>
|
||||
<li><span class="cur_nav">메인비주얼 등록/수정</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- //cont_tit -->
|
||||
|
||||
<div class="cont">
|
||||
<!-- list_상세 -->
|
||||
<div class="col-table data-table">
|
||||
<table class="w100per">
|
||||
<colgroup>
|
||||
<col style="width: 20%">
|
||||
<col style="width: 80%">
|
||||
</colgroup>
|
||||
|
||||
<tbody>
|
||||
<tr>
|
||||
<th style="vertical-align:middle;"><span class="reqArea">원본이미지</span></th>
|
||||
<td>
|
||||
<c:if test="${mainzoneVO.mazId == ''}">
|
||||
<div class="imgBox"></div>
|
||||
</c:if>
|
||||
<c:if test="${mainzoneVO.mazId != ''}">
|
||||
<img alt="${mainzoneVO.content}" onerror="this.src='/img/no_img.jpg'" src='<c:url value='/uss/ion/pwm/getImage.do'/>?atchFileId=<c:out value="${mainzoneVO.mainzoneImageFile}"/>' style="max-width:300px;padding: 10px;" />
|
||||
</c:if>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>비주얼명</th>
|
||||
<td>
|
||||
<form:input path="mazNm" class="w80per" maxlength="30" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>대체텍스트</th>
|
||||
<td>
|
||||
<form:input path="content" class="w80per" maxlength="300" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>사용여부</th>
|
||||
<td>
|
||||
<div class="radio_wrap">
|
||||
<span><input type="radio" name="useYn" id="useY" value="Y" ${mainzoneVO.useYn eq 'Y' or mainzoneVO.useYn eq '' ? 'checked="checked"' : ''}><label for="useY">예</label></span>
|
||||
<span><input type="radio" name="useYn" id="useN" value="N" ${mainzoneVO.useYn eq 'N' ? 'checked="checked"' : ''}><label for="useN">아니오</label></span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>노출순서</th>
|
||||
<td>
|
||||
<form:input path="sort" maxlength="10" onkeyup="this.value=this.value.replace(/[^-\.0-9]/g,'')"/>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
|
||||
<tr>
|
||||
<th style="vertical-align:middle;"><span class="reqArea">파일 첨부</span></th>
|
||||
<td class="upload_area">
|
||||
<input type="file" id="file_temp" name="file_temp" class="uploadFile" style="display:none"/>
|
||||
<button type="button" id="filebutton" class="btn btn_text btn_36 blue_border">파일 첨부하기</button>
|
||||
<span class="cf_text ml10">*이미지 사이즈 : 1920 X 677px</span>
|
||||
<div class="file_wrap file_upload_box no_img_box">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style="width: 60%;">
|
||||
<col style="width: auto;">
|
||||
<col style="width: 20%;">
|
||||
<col style="width: 10%;">
|
||||
</colgroup>
|
||||
<thead>
|
||||
<th>파일 명</th>
|
||||
<th>종류</th>
|
||||
<th>크기</th>
|
||||
<th>삭제</th>
|
||||
</thead>
|
||||
<tbody class="tb_file_before">
|
||||
<tr>
|
||||
<td colspan="4">
|
||||
<p>첨부하실 파일을 <span>마우스로 끌어서</span> 넣어주세요.</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="file_wrap fileAfter file_list_div">
|
||||
<table class="tbType02">
|
||||
<colgroup>
|
||||
<col style="width: 60%">
|
||||
<col style="width: 10%">
|
||||
<col style="width: 20%">
|
||||
<col style="width: 10%">
|
||||
</colgroup>
|
||||
<thead>
|
||||
<th>파일 명</th>
|
||||
<th>종류</th>
|
||||
<th>크기</th>
|
||||
<th>삭제</th>
|
||||
</thead>
|
||||
<tbody id="tbody_fiielist" class="tb_file_after">
|
||||
<c:forEach var="fileList" items="${fileList}" varStatus="status">
|
||||
<tr class="item_${fileList.atchFileId}_${fileList.fileSn} uploaded_obj">
|
||||
<input type="hidden" name="fileSize" class="item_file_size" value="${fileList.fileSize}">
|
||||
<td class="td_filename">
|
||||
<!-- <img src="/direct/img/upload_hwp_img.png" alt="" /> -->
|
||||
<a href="javascript:fn_egov_downFile('${fileList.atchFileId}','${fileList.fileSn}')">
|
||||
<span class="file_name_text">${fileList.orignlFileNm}</span>
|
||||
</a>
|
||||
</td>
|
||||
<td class="td_filesort">
|
||||
<span class="file_filesort_text" value="<c:out value="${fileList.fileExtsn}"/>"><c:out value="${fileList.fileExtsn}"/></span>
|
||||
</td>
|
||||
<td class="td_filesize">
|
||||
<span class="file_size_text" value="<c:out value="${fileList.fileMg}"/>"><c:out value="${fileList.fileMg}"/></span>
|
||||
</td>
|
||||
<td>
|
||||
<button type="button" class="btn btn_text red_border btn_del" onclick="delAtchFile('${fileList.atchFileId}', '${fileList.fileSn}'); return false;">삭제</button>
|
||||
</td>
|
||||
</tr>
|
||||
</c:forEach>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
|
||||
<c:if test="${!empty mainzoneVO.mazId}">
|
||||
<tr>
|
||||
<th><span class="reqArea">최종수정일</span></th>
|
||||
<td>
|
||||
${mainzoneVO.moddt}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><span class="reqArea">작성자</span></th>
|
||||
<td>
|
||||
${mainzoneVO.registerId}
|
||||
</td>
|
||||
</tr>
|
||||
</c:if>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<!-- //list_상세 -->
|
||||
|
||||
<!-- btn_wrap -->
|
||||
<div class="btn_wrap">
|
||||
<div class="area_left">
|
||||
<c:if test="${!empty mainzoneVO.mazId }">
|
||||
<button type="button" class="btn btn_text btn_46 red_border" onclick="fn_mainzone_delete(); return false;" >삭제</button>
|
||||
</c:if>
|
||||
</div>
|
||||
<div class="area_right">
|
||||
<c:if test="${!empty mainzoneVO.mazId }">
|
||||
<button type="button" class="btn btn_text btn_46 blue_fill" onclick="validate('mainzone_U'); return false;">수정</button>
|
||||
</c:if>
|
||||
<c:if test="${empty mainzoneVO.mazId }">
|
||||
<button type="button" class="btn btn_text btn_46 blue_fill" onclick="validate('mainzone_I'); return false;">저장</button>
|
||||
</c:if>
|
||||
<button type="button" class="btn btn_text btn_46 gray_fill" onclick="goList(); return false;">목록</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- //btn_wrap -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="content_title">
|
||||
<h3>메인관리</h3>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#" class="home" title="메인으로 이동"><i></i></a></li>
|
||||
<li><a href="#">메인관리</a></li>
|
||||
<li><strong class="current_location">메인비주얼 등록/수정</strong></li>
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
<!-- list_상세 -->
|
||||
<div class="table table_type_rows">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style="width: 200px;">
|
||||
<col style="width: auto;">
|
||||
</colgroup>
|
||||
|
||||
<tbody>
|
||||
<tr>
|
||||
<th><span class="required">*</span>원본이미지</th>
|
||||
<td>
|
||||
<c:if test="${mainzoneVO.mazId == ''}">
|
||||
<div class="imgBox"></div>
|
||||
</c:if>
|
||||
<c:if test="${mainzoneVO.mazId != ''}">
|
||||
<img alt="${mainzoneVO.content}" onerror="this.src='/img/no_img.jpg'" src='<c:url value='/uss/ion/pwm/getImage.do'/>?atchFileId=<c:out value="${mainzoneVO.mainzoneImageFile}"/>' style="max-width:300px;padding: 10px;" />
|
||||
</c:if>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>비주얼명</th>
|
||||
<td>
|
||||
<form:input path="mazNm" class="input w80per" maxlength="30" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>대체텍스트</th>
|
||||
<td>
|
||||
<form:input path="content" class="input w80per" maxlength="300" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>사용여부</th>
|
||||
<td>
|
||||
<div class="form_wrap radio_wrap">
|
||||
<label for="useY" class="radio_item">
|
||||
<input type="radio" id="useY" name="useYn" ${mainzoneVO.useYn eq 'Y' or mainzoneVO.useYn eq '' ? 'checked="checked"' : ''}>
|
||||
<span>예</span>
|
||||
</label>
|
||||
<label for="useN" class="radio_item">
|
||||
<input type="radio" id="useN" name="useYn" ${mainzoneVO.useYn eq 'N' ? 'checked="checked"' : ''}>
|
||||
<span>아니요</span>
|
||||
</label>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>노출순서</th>
|
||||
<td>
|
||||
<form:input path="sort" class="input" maxlength="10" onkeyup="this.value=this.value.replace(/[^-\.0-9]/g,'')"/>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
|
||||
<tr>
|
||||
<th><span class="required">*</span>파일 첨부</th>
|
||||
<td class="file_upload_wrap">
|
||||
<input type="file" id="file_temp" name="file_temp" class="uploadFile" style="display:none"/>
|
||||
<div class="file_top">
|
||||
<button type="button" id="filebutton" class="btn medium line primary">파일 첨부하기</button>
|
||||
<span class="input_desc">*이미지 사이즈 : 1920 X 677px</span>
|
||||
</div>
|
||||
<div class="file_table before_file_table">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style="width:auto;">
|
||||
<col style="width:13%;">
|
||||
<col style="width:13%;">
|
||||
<col style="width:80px;">
|
||||
</colgroup>
|
||||
<thead>
|
||||
<th>파일 명</th>
|
||||
<th>종류</th>
|
||||
<th>크기</th>
|
||||
<th>삭제</th>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td colspan="4">
|
||||
<i class="icon file_bg"></i>
|
||||
<p>첨부하실 파일을 <b>마우스로 끌어서</b> 넣어주세요.</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="file_table">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style="width:auto;">
|
||||
<col style="width:13%;">
|
||||
<col style="width:13%;">
|
||||
<col style="width:80px;">
|
||||
</colgroup>
|
||||
<thead>
|
||||
<th>파일 명</th>
|
||||
<th>종류</th>
|
||||
<th>크기</th>
|
||||
<th>삭제</th>
|
||||
</thead>
|
||||
<tbody id="tbody_fiielist" class="tb_file_after">
|
||||
<c:forEach var="fileList" items="${fileList}" varStatus="status">
|
||||
<tr class="item_${fileList.atchFileId}_${fileList.fileSn} uploaded_obj">
|
||||
<input type="hidden" name="fileSize" class="item_file_size" value="${fileList.fileSize}">
|
||||
<td class="td_filename">
|
||||
<!-- <img src="/direct/img/upload_hwp_img.png" alt="" /> -->
|
||||
<a href="javascript:fn_egov_downFile('${fileList.atchFileId}','${fileList.fileSn}')">
|
||||
<span class="file_name_text">${fileList.orignlFileNm}</span>
|
||||
</a>
|
||||
</td>
|
||||
<td class="td_filesort">
|
||||
<span class="file_filesort_text" value="<c:out value="${fileList.fileExtsn}"/>"><c:out value="${fileList.fileExtsn}"/></span>
|
||||
</td>
|
||||
<td class="td_filesize">
|
||||
<span class="file_size_text" value="<c:out value="${fileList.fileMg}"/>"><c:out value="${fileList.fileMg}"/></span>
|
||||
</td>
|
||||
<td>
|
||||
<button type="button" class="btn line lightgray xssmall only_icon btn_delete" onclick="delAtchFile('${fileList.atchFileId}', '${fileList.fileSn}'); return false;"><i class="icon delete red"></i></button>
|
||||
</td>
|
||||
</tr>
|
||||
</c:forEach>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
|
||||
<c:if test="${!empty mainzoneVO.mazId}">
|
||||
<tr>
|
||||
<th><span class="required">*</span>최종수정일</th>
|
||||
<td>
|
||||
${mainzoneVO.moddt}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><span class="required">*</span>작성자</th>
|
||||
<td>
|
||||
${mainzoneVO.registerId}
|
||||
</td>
|
||||
</tr>
|
||||
</c:if>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<!-- //list_상세 -->
|
||||
|
||||
<!-- btn_wrap -->
|
||||
<div class="btn_wrap">
|
||||
<div class="left">
|
||||
<c:if test="${!empty mainzoneVO.mazId }">
|
||||
<button type="button" class="btn line red xlarge" onclick="fn_mainzone_delete(); return false;" >삭제</button>
|
||||
</c:if>
|
||||
</div>
|
||||
<div class="right">
|
||||
<c:if test="${!empty mainzoneVO.mazId }">
|
||||
<button type="button" class="btn fill primary xlarge" onclick="validate('mainzone_U'); return false;">수정</button>
|
||||
</c:if>
|
||||
<c:if test="${empty mainzoneVO.mazId }">
|
||||
<button type="button" class="btn fill primary xlarge" onclick="validate('mainzone_I'); return false;">저장</button>
|
||||
</c:if>
|
||||
<button type="button" class="btn fill gray xlarge" onclick="goList(); return false;">목록</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- //btn_wrap -->
|
||||
|
||||
|
||||
</form:form>
|
||||
<form name="searchForm" id="searchForm" method="get" action="<c:url value='/uss/ion/pwm/mainzoneList.do'/>" ></form>
|
||||
</body>
|
||||
|
||||
@ -118,108 +118,85 @@ function fn_mainzone_contest_delete(){
|
||||
frm.submit();
|
||||
}
|
||||
}
|
||||
|
||||
/* 테마별 색상맞추기 */
|
||||
$(window).load(function() {
|
||||
$('table.bbs01_list td.subject a').hover(
|
||||
function () {
|
||||
$(this).css("color","#d10000");
|
||||
},
|
||||
function () {
|
||||
$(this).css("color","#333333");
|
||||
}
|
||||
);
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<form name="listForm" action="<c:url value='/uss/ion/pwm/mainzoneList.do'/>" method="post">
|
||||
<input name="pageIndex" type="hidden" value="<c:out value='${mainzoneVO.pageIndex}'/>"/>
|
||||
<input type="hidden" name="selectedId" />
|
||||
<input type="hidden" name="pageType" />
|
||||
<!-- cont -->
|
||||
<div class="cont_wrap">
|
||||
<div class="box">
|
||||
|
||||
<!-- cont_tit -->
|
||||
<div class="cont_tit">
|
||||
<h2>메인비주얼관리</h2>
|
||||
<ul class="cont_nav">
|
||||
<li class="home"><a href="/"><i></i></a></li>
|
||||
<li><p>메인관리</p></li>
|
||||
<li><span class="cur_nav">메인비주얼관리</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- //cont_tit -->
|
||||
|
||||
<div class="cont">
|
||||
<!-- list_top -->
|
||||
<div class="list_top table_top">
|
||||
<p class="table_total_text">조회건수 : <span class="color_blue fw_bold"><c:out value="${paginationInfo.totalRecordCount}"/></span>건</p>
|
||||
<div class="list_util search_wrap">
|
||||
<select name="searchCondition" id="searchCondition">
|
||||
<option value="">전체</option>
|
||||
<option value="1" <c:if test="${mainzoneVO.searchCondition == '1'}">selected</c:if>>제목</option>
|
||||
<option value="2" <c:if test="${mainzoneVO.searchCondition == '2'}">selected</c:if>>대체텍스트</option>
|
||||
</select>
|
||||
<input type="text" id="searchKeyword" name="searchKeyword" class="search_input" value="<c:out value='${mainzoneVO.searchKeyword}'/>" maxlength="200" placeholder="검색어를 입력하세요">
|
||||
<button class="btn btn_text blue_border" onclick="linkPage(1); return false;">검색</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- //list_top -->
|
||||
|
||||
<!-- list -->
|
||||
<div class="list list_gallery">
|
||||
<c:forEach var="result" items="${mainzoneList}" varStatus="status">
|
||||
<article onclick="javascript:fn_mainzone_view('${result.mazId}'); return false;">
|
||||
<c:if test="${result.useYn eq 'Y'}">
|
||||
<p class="gallery_util use_gallery">
|
||||
사용
|
||||
</p>
|
||||
</c:if>
|
||||
<c:if test="${result.useYn ne 'Y'}">
|
||||
<p class="gallery_util">
|
||||
미사용
|
||||
</p>
|
||||
</c:if>
|
||||
</p>
|
||||
<a href="" class="img_area">
|
||||
<%-- <img onerror="this.src='/img/noImg.png'" src="<c:url value='/uss/ion/pwm/getImage.do'/>?atchFileId=<c:out value="${result.mainzoneImageFile}"/>" alt=""> --%>
|
||||
<img onerror="this.src='/img/noImg.png'" src="<c:url value='/uss/ion/pwm/getImage.do'/>?atchFileId=<c:out value="${result.mainzoneImageFile}"/>" alt="">
|
||||
</a>
|
||||
<a href="/" class="text_area">
|
||||
<p class="list_tit">${result.mazNm}</p>
|
||||
<div class="list_info">
|
||||
<span class="list_writer">작성자 : ${result.registerId}</span>
|
||||
<span>노출순서 : ${result.sort}</span>
|
||||
<span class="list_date">${result.regdt}</span>
|
||||
</div>
|
||||
</a>
|
||||
</article>
|
||||
</c:forEach>
|
||||
<c:if test="${empty mainzoneList}">
|
||||
<div class="board1_btn">
|
||||
<ul style="text-align: center;"><spring:message code="common.nodata.msg" /></ul>
|
||||
</div>
|
||||
</c:if>
|
||||
</div>
|
||||
<!-- //list -->
|
||||
<div class="btn_wrap right">
|
||||
<button type="button" class="btn btn_text btn_46 blue_fill" onclick="fn_mainzone_insert_view('1'); return false;">등록</button>
|
||||
</div>
|
||||
<!-- 페이지 네비게이션 시작 -->
|
||||
<c:if test="${!empty mainzoneList}">
|
||||
<div class="page">
|
||||
<ul class="inline">
|
||||
<ui:pagination paginationInfo = "${paginationInfo}" type="image" jsFunction="linkPage" />
|
||||
</ul>
|
||||
</div>
|
||||
</c:if>
|
||||
<!-- //페이지 네비게이션 끝 -->
|
||||
|
||||
</div>
|
||||
<input type="hidden" name="pageType" />
|
||||
|
||||
<div class="content_title">
|
||||
<h3>메인관리</h3>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#" class="home" title="메인으로 이동"><i></i></a></li>
|
||||
<li><a href="#">메인관리</a></li>
|
||||
<li><strong class="current_location">메인비주얼관리</strong></li>
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
<div class="search_area">
|
||||
<div class="search_left">
|
||||
<p class="total_number">조회건수 <b><c:out value="${paginationInfo.totalRecordCount}"/></b>건</p>
|
||||
</div>
|
||||
<div class="search_right">
|
||||
<select name="searchCondition" id="searchCondition" class="search_select">
|
||||
<option value="">전체</option>
|
||||
<option value="1" <c:if test="${mainzoneVO.searchCondition == '1'}">selected</c:if>>제목</option>
|
||||
<option value="2" <c:if test="${mainzoneVO.searchCondition == '2'}">selected</c:if>>대체텍스트</option>
|
||||
</select>
|
||||
<div class="search_type input_type">
|
||||
<input type="text" id="searchKeyword" name="searchKeyword" class="input search_input" value="<c:out value='${mainzoneVO.searchKeyword}'/>" maxlength="200" placeholder="검색어를 입력하세요">
|
||||
</div>
|
||||
<button class="btn btn_search" onclick="linkPage(1); return false;">검색</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul class="gallery_list">
|
||||
<c:forEach var="result" items="${mainzoneList}" varStatus="status">
|
||||
<li>
|
||||
<a href="#" onclick="javascript:fn_mainzone_view('${result.mazId}'); return false;">
|
||||
<c:if test="${result.useYn eq 'Y'}">
|
||||
<span class="status primary">사용</span>
|
||||
</c:if>
|
||||
<c:if test="${result.useYn ne 'Y'}">
|
||||
<span class="status gray">미사용</span>
|
||||
</c:if>
|
||||
<div class="images_area">
|
||||
<img onerror="this.src='/img/noImg.png'" src="<c:url value='/uss/ion/pwm/getImage.do'/>?atchFileId=<c:out value="${result.mainzoneImageFile}"/>" alt="">
|
||||
</div>
|
||||
<div class="list_content">
|
||||
<b class="list_title">${result.mazNm}</b>
|
||||
<ul class="list_info">
|
||||
<li>작성자 ${result.registerId}</li>
|
||||
<li>노출순서 ${result.sort}</li>
|
||||
<li>${result.regdt}</li>
|
||||
</ul>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</c:forEach>
|
||||
<c:if test="${empty mainzoneList}">
|
||||
<div class="board1_btn w100per" style="text-align:center;">
|
||||
<spring:message code="common.nodata.msg" />
|
||||
</div>
|
||||
</c:if>
|
||||
</ul>
|
||||
|
||||
<div class="btn_wrap right">
|
||||
<button type="button" class="btn xlarge fill primary" onclick="fn_mainzone_insert_view('1'); return false;">등록</button>
|
||||
</div>
|
||||
|
||||
<!-- 페이지 네비게이션 시작 -->
|
||||
<c:if test="${!empty mainzoneList}">
|
||||
<div class="page">
|
||||
<ul class="inline">
|
||||
<ui:pagination paginationInfo = "${paginationInfo}" type="image" jsFunction="linkPage" />
|
||||
</ul>
|
||||
</div>
|
||||
</c:if>
|
||||
<!-- //페이지 네비게이션 끝 -->
|
||||
|
||||
</form>
|
||||
<form name="subForm" method="get" action="<c:url value='/uss/ion/pwm/detailPopup.do'/>">
|
||||
<input name="popupId" type="hidden" value="" />
|
||||
|
||||
@ -16,7 +16,7 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<title>알림판관리 관리</title>
|
||||
<title>알림창 관리</title>
|
||||
<meta http-equiv="content-type" content="text/html; charset=utf-8">
|
||||
<script type="text/javaScript" language="javascript">
|
||||
$(document).ready(function(){
|
||||
@ -28,6 +28,7 @@ $(document).ready(function(){
|
||||
$(".check").click(function(e){
|
||||
e.stopPropagation();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
|
||||
@ -79,17 +80,6 @@ function fncBannerListDelete(){
|
||||
}
|
||||
}
|
||||
|
||||
/* 테마별 색상맞추기 */
|
||||
$(window).load(function() {
|
||||
$('table.bbs01_list td.subject a').hover(
|
||||
function () {
|
||||
$(this).css("color","#d10000");
|
||||
},
|
||||
function () {
|
||||
$(this).css("color","#333333");
|
||||
}
|
||||
);
|
||||
});
|
||||
|
||||
function linkPage(pageNo){
|
||||
<%--<c:if test="${!empty loginId}">
|
||||
@ -115,91 +105,82 @@ function linkPage(pageNo){
|
||||
<input type="hidden" name="seCd" value="${searchVO.seCd}"/>
|
||||
<input type="hidden" name="searchSortCnd" value="<c:out value="${searchVO.searchSortCnd}" />" />
|
||||
<input type="hidden" name="searchSortOrd" value="<c:out value="${searchVO.searchSortOrd}" />" />
|
||||
|
||||
<!-- cont -->
|
||||
<div class="cont_wrap">
|
||||
<div class="box">
|
||||
|
||||
<!-- cont_tit -->
|
||||
<div class="cont_tit">
|
||||
<h2>알림창관리</h2>
|
||||
<ul class="cont_nav">
|
||||
<li class="home"><a href="/"><i></i></a></li>
|
||||
<li><p>메인관리</p></li>
|
||||
<li><span class="cur_nav">알림창관리</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
<!-- //cont_tit -->
|
||||
|
||||
<div class="cont">
|
||||
<!-- list_top -->
|
||||
<div class="list_top table_top">
|
||||
<p class="table_total_text">조회건수 : <span class="color_blue fw_bold"><c:out value="${paginationInfo.totalRecordCount}"/></span>건</p>
|
||||
<div class="list_util search_wrap">
|
||||
<select name="searchCondition" id="searchCondition">
|
||||
<option value="">전체</option>
|
||||
<option value="1" <c:if test="${searchVO.searchCondition == '1'}">selected</c:if>>제목</option>
|
||||
<option value="2" <c:if test="${searchVO.searchCondition == '2'}">selected</c:if>>링크</option>
|
||||
</select>
|
||||
<input type="text" id="searchKeyword" name="searchKeyword" class="search_input" value="<c:out value='${searchVO.searchKeyword}'/>" maxlength="200" placeholder="검색어를 입력하세요">
|
||||
<button class="btn btn_text blue_border" onclick="linkPage(1); return false;">검색</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- //list_top -->
|
||||
|
||||
<!-- list -->
|
||||
<div class="list list_gallery">
|
||||
<c:forEach var="result" items="${popupzoneList}" varStatus="status">
|
||||
<article onclick="javascript:fn_popupzone_view('${result.pozId}'); return false;">
|
||||
<c:if test="${result.useYn eq 'Y'}">
|
||||
<p class="gallery_util use_gallery">
|
||||
사용
|
||||
</p>
|
||||
</c:if>
|
||||
<c:if test="${result.useYn ne 'Y'}">
|
||||
<p class="gallery_util">
|
||||
미사용
|
||||
</p>
|
||||
</c:if>
|
||||
</p>
|
||||
<a href="" class="img_area">
|
||||
<img onerror="this.src='/img/noImg.png'" src="<c:url value='/uss/ion/pwm/getImage.do'/>?atchFileId=<c:out value="${result.popupzoneImageFile}"/>" alt="">
|
||||
</a>
|
||||
<a href="/" class="text_area">
|
||||
<p class="list_tit">${result.pozNm}</p>
|
||||
<div class="list_info">
|
||||
<span class="list_writer">작성자 : ${result.registerId}</span>
|
||||
<span>노출순서 : ${result.sort}</span>
|
||||
<span class="list_date">${result.regdt}</span>
|
||||
</div>
|
||||
</a>
|
||||
</article>
|
||||
</c:forEach>
|
||||
<c:if test="${empty popupzoneList}">
|
||||
<div class="board1_btn">
|
||||
<ul style="text-align: center;"><spring:message code="common.nodata.msg" /></ul>
|
||||
</div>
|
||||
</c:if>
|
||||
</div>
|
||||
<!-- //list -->
|
||||
<div class="btn_wrap right">
|
||||
<!-- <button type="button" class="btnType01" onclick="fncBannerListDelete(); return false;">삭제</button> -->
|
||||
<button type="button" class="btn btn_text btn_46 blue_fill" onclick="fn_popupzone_regi('1'); return false;">등록</button>
|
||||
|
||||
</div>
|
||||
<!-- 페이지 네비게이션 시작 -->
|
||||
<c:if test="${!empty popupzoneList}">
|
||||
<div class="page">
|
||||
<ul class="inline">
|
||||
<ui:pagination paginationInfo = "${paginationInfo}" type="image" jsFunction="linkPage" />
|
||||
</ul>
|
||||
</div>
|
||||
</c:if>
|
||||
<!-- //페이지 네비게이션 끝 -->
|
||||
|
||||
</div>
|
||||
|
||||
<div class="content_title">
|
||||
<h3>메인관리</h3>
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="#" class="home" title="메인으로 이동"><i></i></a></li>
|
||||
<li><a href="#">메인관리</a></li>
|
||||
<li><strong class="current_location">알림창 관리</strong></li>
|
||||
</ol>
|
||||
</div>
|
||||
|
||||
<div class="search_area">
|
||||
<div class="search_left">
|
||||
<p class="total_number">조회건수 <b><c:out value="${paginationInfo.totalRecordCount}"/></b>건</p>
|
||||
</div>
|
||||
|
||||
<div class="search_right">
|
||||
<select name="searchCondition" id="searchCondition" class="search_select">
|
||||
<option value="">전체</option>
|
||||
<option value="1" <c:if test="${searchVO.searchCondition == '1'}">selected</c:if>>제목</option>
|
||||
<option value="2" <c:if test="${searchVO.searchCondition == '2'}">selected</c:if>>링크</option>
|
||||
</select>
|
||||
<div class="search_type input_type">
|
||||
<input type="text" id="searchKeyword" name="searchKeyword" class="input search_input" value="<c:out value='${searchVO.searchKeyword}'/>" maxlength="200" placeholder="검색어를 입력하세요">
|
||||
</div>
|
||||
<button class="btn btn_search" onclick="linkPage(1); return false;">검색</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- list -->
|
||||
<ul class="gallery_list">
|
||||
<c:forEach var="result" items="${popupzoneList}" varStatus="status">
|
||||
<li>
|
||||
<a href="#" onclick="javascript:fn_popupzone_view('${result.pozId}'); return false;">
|
||||
<c:if test="${result.useYn eq 'Y'}">
|
||||
<span class="status primary">사용</span>
|
||||
</c:if>
|
||||
<c:if test="${result.useYn ne 'Y'}">
|
||||
<span class="status gray">미사용</span>
|
||||
</c:if>
|
||||
<div class="images_area">
|
||||
<img onerror="this.src='/img/noImg.png'" src="<c:url value='/uss/ion/pwm/getImage.do'/>?atchFileId=<c:out value="${result.popupzoneImageFile}"/>" alt="">
|
||||
</div>
|
||||
<div class="list_content">
|
||||
<b class="list_title">${result.pozNm}</b>
|
||||
<ul class="list_info">
|
||||
<li>작성자 ${result.registerId}</li>
|
||||
<li>노출순서 ${result.sort}</li>
|
||||
<li>${result.regdt}</li>
|
||||
</ul>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</c:forEach>
|
||||
<c:if test="${empty popupzoneList}">
|
||||
<div class="board1_btn w100per" style="text-align:center;">
|
||||
<spring:message code="common.nodata.msg" />
|
||||
</div>
|
||||
</c:if>
|
||||
</ul>
|
||||
<!-- //list -->
|
||||
<div class="btn_wrap right">
|
||||
<!-- <button type="button" class="btnType01" onclick="fncBannerListDelete(); return false;">삭제</button> -->
|
||||
<button type="button" class="btn xlarge fill primary" onclick="fn_popupzone_regi('1'); return false;">등록</button>
|
||||
|
||||
</div>
|
||||
<!-- 페이지 네비게이션 시작 -->
|
||||
<c:if test="${!empty popupzoneList}">
|
||||
<div class="page">
|
||||
<ul class="inline">
|
||||
<ui:pagination paginationInfo = "${paginationInfo}" type="image" jsFunction="linkPage" />
|
||||
</ul>
|
||||
</div>
|
||||
</c:if>
|
||||
<!-- //페이지 네비게이션 끝 -->
|
||||
|
||||
</form>
|
||||
<form name="modiForm" method="get" action="<c:url value='/uss/ion/pwm/popupzoneModify.do'/>" >
|
||||
<input name="selectedId" type="hidden" />
|
||||
|
||||
@ -59,217 +59,121 @@
|
||||
<input type="hidden" id="totalSearchKeyword" name="totalSearchKeyword" value=""/>
|
||||
</form>
|
||||
|
||||
<!-- 전자조정 헤더HTML 시작 -->
|
||||
<!-- skip메뉴 -->
|
||||
<div class="skip_menu">
|
||||
<a href="#sub" class="contGo" title="본문 바로가기">본문 바로가기</a>
|
||||
</div>
|
||||
|
||||
<!-- ============== header ============== -->
|
||||
<header class="header">
|
||||
<div class="inner pc_header">
|
||||
<h1 class="logo">
|
||||
<a href="/" title="메인으로 이동">
|
||||
<img src="/kofair_case_seed/usr/images/layout/header_logo.png" alt="한국공정거래조정원 KOREA FAIR TRADE MEDIATION AGENCY">
|
||||
</a>
|
||||
</h1>
|
||||
<div class="util_bar">
|
||||
<div class="search_area">
|
||||
<input type="text" id="searchTextHeader" name="searchTextHeader" class="input_text input_search" title="검색어 입력">
|
||||
<button type="button" class="btn btn_icon btn_search" title="검색버튼" onclick="searchTotalHeader(); return false;">
|
||||
<i class="icon search"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="util_btn_area">
|
||||
<%-- <c:when test="${certVO.name != '' && certVO.phone != ''}">
|
||||
<p class="user_name"><c:out value="${certVO.name}"/> 님</p>
|
||||
<button type="button" class="btn btn_text btn_40 blue_fill" onclick="location.href='/web/user/mypage/case/01/168/myCheckRemove.do'"><i class="icon sertification_out"></i>인증해제</button>
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
<button type="button" class="btn btn_text btn_40 blue_fill" onclick="location.href='/web/user/mypage/case/01/168/myCheck.do'"><i class="icon sertification"></i>본인인증</button>
|
||||
</c:otherwise> --%>
|
||||
<button type="button" class="btn btn_text btn_40 blue_fill" onclick="location.href='/web/user/mypage/case/01/168/myCheck.do'"><i class="icon sertification"></i>본인인증</button>
|
||||
<button type="button" class="btn btn_text btn_40 blue_fill hide"><i class="icon sertification_out"></i>인증해제</button>
|
||||
<button type="button" class="btn btn_text btn_40 gray_border only_icon" title="페이지 확대" onClick="zoomIn();"><i class="icon plus"></i></button>
|
||||
<button type="button" class="btn btn_text btn_40 gray_border only_icon" title="페이지 축소" onClick="zoomOut();"><i class="icon minus"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<nav class="nav pc_header">
|
||||
<div class="inner">
|
||||
<ul class="menu_ul">
|
||||
<c:forEach var="resultListOne" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListOne.depths eq '1' }">
|
||||
<li class="menu_depth01">
|
||||
<a href="#" id="${resultListOne.menuNo}">
|
||||
<c:out value="${resultListOne.menuNm}" />
|
||||
</a>
|
||||
<div class="sub_menu_wrap">
|
||||
<div class="sub_menu">
|
||||
<div class="sub_menu_title_wrap">
|
||||
<h2>
|
||||
<c:out value="${resultListOne.menuNm}" />
|
||||
<span>korea fair trade mediation agency</span>
|
||||
</h2>
|
||||
</div>
|
||||
<ul class="sub_menu_ul">
|
||||
<c:forEach var="resultListTwo" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListTwo.depths eq '2' && resultListOne.menuNo eq resultListTwo.upperMenuId }">
|
||||
<li class="menu_depth02">
|
||||
<a href="${resultListTwo.menuType ne 'M' ? resultListTwo.url : '#'}" class="sub_menu_title" <c:if test ="${resultListTwo.menuType eq 'M'}"> onclick="depthTwoClick(this); return false;"</c:if>>
|
||||
<c:out value="${resultListTwo.menuNm}" />
|
||||
</a>
|
||||
<c:if test="${resultListTwo.childMenuCnt gt 0}">
|
||||
<ul class="menu_depth03">
|
||||
<c:forEach var="resultListThree" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListThree.depths eq '3' && resultListTwo.menuNo eq resultListThree.upperMenuId }">
|
||||
<li>
|
||||
<a href="${empty resultListThree.url ? '#' : resultListThree.url }" ${resultListThree.menuType eq 'O' ? 'target="_blank"' : ""} >
|
||||
<c:out value="${resultListThree.menuNm}" />
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</c:if>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
<button type="button" class="btn btn_40 only_icon btn_all_menu">
|
||||
<i class="icon menu"></i>
|
||||
</button>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="full_all_menu">
|
||||
<div class="top_area">
|
||||
<div class="inner">
|
||||
<h1 class="logo"><a href="/" title="메인으로 이동"><img src="/kofair_case_seed/usr/images/layout/header_logo.png" alt="한국공정거래조정원 KOREA FAIR TRADE MEDIATION AGENCY"></a></h1>
|
||||
<button type="button" class="btn only_icon btn_menu_close"><i class="icon menu close"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<nav class="nav">
|
||||
<div class="inner">
|
||||
<ul class="menu_ul">
|
||||
<c:forEach var="resultListOne" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListOne.depths eq '1' }">
|
||||
<li>
|
||||
<a href="#" class="menu_title" id="${resultListOne.menuNo}">
|
||||
<c:out value="${resultListOne.menuNm}" />
|
||||
</a>
|
||||
<ul class="depth02_ul">
|
||||
<c:forEach var="resultListTwo" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListTwo.depths eq '2' && resultListOne.menuNo eq resultListTwo.upperMenuId }">
|
||||
<li>
|
||||
<a href="${resultListTwo.menuType ne 'M' ? resultListTwo.url : '#'}" class="depth02"
|
||||
<c:if test="${resultListTwo.menuType eq 'M'}">onclick="depthTwoClick(this); return false;"</c:if>>
|
||||
<c:out value="${resultListTwo.menuNm}" />
|
||||
</a>
|
||||
<c:if test="${resultListTwo.childMenuCnt gt 0}">
|
||||
<ul class="depth03_ul">
|
||||
<c:forEach var="resultListThree" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListThree.depths eq '3' && resultListTwo.menuNo eq resultListThree.upperMenuId }">
|
||||
<li>
|
||||
<a href="${empty resultListThree.url ? '#' : resultListThree.url}"
|
||||
${resultListThree.menuType eq 'O' ? 'target="_blank"' : ''}>
|
||||
<c:out value="${resultListThree.menuNm}" />
|
||||
<c:if test="${resultListThree.menuType eq 'O'}">
|
||||
<i class="icon outlink"></i>
|
||||
</c:if>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</c:if>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
<!-- //전체메뉴 -->
|
||||
<div class="mobile_header">
|
||||
<div class="header_wrap">
|
||||
<h1 class="logo">
|
||||
<a href="/" title="메인으로 이동">
|
||||
<img src="/kofair_case_seed/usr/images/layout/header_logo_m.png" alt="한국공정거래조정원 KOREA FAIR TRADE MEDIATION AGENCY">
|
||||
</a>
|
||||
</h1>
|
||||
<div class="header_util">
|
||||
|
||||
<%-- <c:when test="${certVO.name != '' && certVO.phone != ''}">
|
||||
<button type="button" class="btn only_icon btn_sertification_out" onclick="location.href='/web/user/mypage/case/01/168/myCheckRemove.do'"><i class="icon sertification_out"></i></button>
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
<button type="button" class="btn only_icon btn_sertification" onclick="location.href='/web/user/mypage/case/01/168/myCheck.do'"><i class="icon sertification"></i></button>
|
||||
</c:otherwise> --%>
|
||||
<button type="button" class="btn only_icon btn_sertification" onclick="location.href='/web/user/mypage/case/01/168/myCheck.do'"><i class="icon sertification"></i></button>
|
||||
|
||||
<!-- <button type="button" class="btn only_icon btn_sertification"><i></i></button>
|
||||
<button type="button" class="btn only_icon btn_sertification_out hide"><i></i></button> -->
|
||||
<button type="button" class="btn only_icon btn_search"><i></i></button>
|
||||
<button type="button" class="btn only_icon btn_menu"><i></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="search_area">
|
||||
<input type="text" class="input_text input_search">
|
||||
<button type="button" class="btn_search"><i></i></button>
|
||||
</div>
|
||||
<div class="all_menu_wrap">
|
||||
<div class="top_area">
|
||||
<h1 class="logo">
|
||||
<a href="/" title="메인으로 이동">
|
||||
<img src="/kofair_case_seed/usr/images/layout/header_logo_m.png" alt="한국공정거래조정원 KOREA FAIR TRADE MEDIATION AGENCY">
|
||||
</a>
|
||||
</h1>
|
||||
<button type="button" class="btn btn_menu_close"><i></i></button>
|
||||
</div>
|
||||
<nav class="mobile_menu">
|
||||
<ul class="mobile_ul">
|
||||
<c:forEach var="resultListOne" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListOne.depths eq '1' }">
|
||||
<li class="m_menu_depth01_li">
|
||||
<button type="button" class="m_menu_depth01" id="${resultListOne.menuNo}">
|
||||
<c:out value="${resultListOne.menuNm}" />
|
||||
<i></i>
|
||||
</button>
|
||||
<ul class="m_sub_menu">
|
||||
<c:forEach var="resultListTwo" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListTwo.depths eq '2' && resultListOne.menuNo eq resultListTwo.upperMenuId }">
|
||||
<li>
|
||||
<a href="${resultListTwo.menuType ne 'M' ? resultListTwo.url : '#'}" class="title" <c:if test ="${resultListTwo.menuType eq 'M'}"> onclick="depthTwoClick(this); return false;"</c:if>>
|
||||
<c:out value="${resultListTwo.menuNm}" />
|
||||
</a>
|
||||
<ul class="m_sub_depth02">
|
||||
<c:forEach var="resultListThree" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListThree.depths eq '3' && resultListTwo.menuNo eq resultListThree.upperMenuId }">
|
||||
<li>
|
||||
<a href="${empty resultListThree.url ? '#' : resultListThree.url }" ${resultListThree.menuType eq 'O' ? 'target="_blank"' : ""} >
|
||||
<c:out value="${resultListThree.menuNm}" />
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="header_top">
|
||||
<div class="inner">
|
||||
<div class="area_left"></div>
|
||||
<ul class="user_menu">
|
||||
<li><a href="#">본인인증</a></li>
|
||||
<li><a href="#">마이페이지</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="header_container">
|
||||
<div class="inner">
|
||||
<h1 class="logo"><a href="#"><img src="/publish/usr/images/common/logo.png" alt=""></a></h1>
|
||||
<nav>
|
||||
<ul class="gnb">
|
||||
<li>
|
||||
<a href="#" class="depth01">menu1</a>
|
||||
<div class="depth02_container">
|
||||
<!-- <div class="title_wrap">
|
||||
<h2>menu1</h2>
|
||||
</div> -->
|
||||
<ul class="depth02_ul">
|
||||
<li>
|
||||
<a href="#" class="depth02">메뉴1이름</a>
|
||||
<ul class="depth03_ul">
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#" class="depth02">메뉴1이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴1이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴1이름</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="depth01">menu1</a>
|
||||
<div class="depth02_container">
|
||||
<ul class="depth02_ul">
|
||||
<li>
|
||||
<a href="#" class="depth02">메뉴2이름</a>
|
||||
<ul class="depth03_ul">
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#" class="depth02">메뉴2이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴2이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴2이름</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="depth01">menu1</a>
|
||||
<div class="depth02_container">
|
||||
<!-- <div class="title_wrap">
|
||||
<h2>menu1</h2>
|
||||
</div> -->
|
||||
<ul class="depth02_ul">
|
||||
<li>
|
||||
<a href="#" class="depth02">메뉴3이름</a>
|
||||
<ul class="depth03_ul">
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#" class="depth02">메뉴3이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴3이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴3이름</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="depth01">menu1</a>
|
||||
<div class="depth02_container">
|
||||
<!-- <div class="title_wrap">
|
||||
<h2>menu1</h2>
|
||||
</div> -->
|
||||
<ul class="depth02_ul">
|
||||
<li>
|
||||
<a href="#" class="depth02">메뉴4이름</a>
|
||||
<ul class="depth03_ul">
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#" class="depth02">메뉴4이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴4이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴4이름</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<ul class="header_util">
|
||||
<!-- <li><button type="button" class=""><i></i></button></li> -->
|
||||
<li><button type="button" class="btn_search" title="전체메뉴 보기"><i></i></button></li>
|
||||
<li><button type="button" class="btn_sitemap" title="전체메뉴 보기"><i></i></button></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</header>
|
||||
<!-- ============== header 끝 ============== -->
|
||||
275
src/main/webapp/WEB-INF/jsp/web/com/webCommonHeader_bak.jsp
Normal file
@ -0,0 +1,275 @@
|
||||
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
|
||||
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
|
||||
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<%@ taglib prefix="kc" uri="/WEB-INF/tlds/kcc_tld.tld"%>
|
||||
<%@ page import="egovframework.rte.fdl.security.userdetails.util.EgovUserDetailsHelper" %>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function (){
|
||||
// 탑메뉴
|
||||
$("nav#menu ul.depth01").find('li').each(function (index, item){
|
||||
$($(this).find('a')[0]).attr('href' , $($(this).find('.depth02').find('a')[0]).attr('href'));
|
||||
});
|
||||
|
||||
//사이트맵
|
||||
$('.full_menu ul.depth01').find('li').each(function (index, item){
|
||||
$($(this).find('a')[0]).attr('href' , $($(this).find('.depth02').find('a')[0]).attr('href'));
|
||||
});
|
||||
});
|
||||
|
||||
/* 화면 확대 축소 */
|
||||
var nowZoom = 100;
|
||||
|
||||
function zoomOut() { // 화면크기축소
|
||||
nowZoom = nowZoom - 10;
|
||||
if(nowZoom <= 70) nowZoom = 70; // 화면크기 최대 축소율 70%
|
||||
zooms();
|
||||
}
|
||||
|
||||
function zoomIn() { // 화면크기확대
|
||||
nowZoom = nowZoom + 10;
|
||||
if(nowZoom >= 200) nowZoom = 200; // 화면크기 최대 확대율 200%
|
||||
zooms();
|
||||
}
|
||||
|
||||
function zooms() {
|
||||
document.body.style.zoom = nowZoom + "%";
|
||||
}
|
||||
|
||||
function depthTwoClick(obj){
|
||||
var url = $($(obj).parent().find('ul.menu_depth03 li:first-child a')).attr('href');
|
||||
if($(obj).parents('[class]').first().attr('class') == 'm_sub_menu'){
|
||||
url = $($(obj).parent().find('ul.m_sub_depth02 li:first-child a')).attr('href');
|
||||
}
|
||||
if(typeof url != 'undefined'){
|
||||
location.href = url;
|
||||
}
|
||||
}
|
||||
|
||||
function searchTotalHeader(){
|
||||
$('#searchFormHeader #totalSearchKeyword').val($('#searchTextHeader').val());
|
||||
$('#searchFormHeader').attr("action","/web/usr/search/totalSearch.do")
|
||||
$('#searchFormHeader').submit();
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<form id="searchFormHeader" name="searchFormHeader" action="/web/usr/search/totalSearch.do" method="post">
|
||||
<input type="hidden" id="totalSearchKeyword" name="totalSearchKeyword" value=""/>
|
||||
</form>
|
||||
|
||||
<!-- 전자조정 헤더HTML 시작 -->
|
||||
<div class="skip_menu">
|
||||
<a href="#sub" class="contGo" title="본문 바로가기">본문 바로가기</a>
|
||||
</div>
|
||||
<header class="header">
|
||||
<div class="inner pc_header">
|
||||
<h1 class="logo">
|
||||
<a href="/" title="메인으로 이동">
|
||||
<img src="/kofair_case_seed/usr/images/layout/header_logo.png" alt="한국공정거래조정원 KOREA FAIR TRADE MEDIATION AGENCY">
|
||||
</a>
|
||||
</h1>
|
||||
<div class="util_bar">
|
||||
<div class="search_area">
|
||||
<input type="text" id="searchTextHeader" name="searchTextHeader" class="input_text input_search" title="검색어 입력">
|
||||
<button type="button" class="btn btn_icon btn_search" title="검색버튼" onclick="searchTotalHeader(); return false;">
|
||||
<i class="icon search"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="util_btn_area">
|
||||
<%-- <c:when test="${certVO.name != '' && certVO.phone != ''}">
|
||||
<p class="user_name"><c:out value="${certVO.name}"/> 님</p>
|
||||
<button type="button" class="btn btn_text btn_40 blue_fill" onclick="location.href='/web/user/mypage/case/01/168/myCheckRemove.do'"><i class="icon sertification_out"></i>인증해제</button>
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
<button type="button" class="btn btn_text btn_40 blue_fill" onclick="location.href='/web/user/mypage/case/01/168/myCheck.do'"><i class="icon sertification"></i>본인인증</button>
|
||||
</c:otherwise> --%>
|
||||
<button type="button" class="btn btn_text btn_40 blue_fill" onclick="location.href='/web/user/mypage/case/01/168/myCheck.do'"><i class="icon sertification"></i>본인인증</button>
|
||||
<button type="button" class="btn btn_text btn_40 blue_fill hide"><i class="icon sertification_out"></i>인증해제</button>
|
||||
<button type="button" class="btn btn_text btn_40 gray_border only_icon" title="페이지 확대" onClick="zoomIn();"><i class="icon plus"></i></button>
|
||||
<button type="button" class="btn btn_text btn_40 gray_border only_icon" title="페이지 축소" onClick="zoomOut();"><i class="icon minus"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<nav class="nav pc_header">
|
||||
<div class="inner">
|
||||
<ul class="menu_ul">
|
||||
<c:forEach var="resultListOne" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListOne.depths eq '1' }">
|
||||
<li class="menu_depth01">
|
||||
<a href="#" id="${resultListOne.menuNo}">
|
||||
<c:out value="${resultListOne.menuNm}" />
|
||||
</a>
|
||||
<div class="sub_menu_wrap">
|
||||
<div class="sub_menu">
|
||||
<div class="sub_menu_title_wrap">
|
||||
<h2>
|
||||
<c:out value="${resultListOne.menuNm}" />
|
||||
<span>korea fair trade mediation agency</span>
|
||||
</h2>
|
||||
</div>
|
||||
<ul class="sub_menu_ul">
|
||||
<c:forEach var="resultListTwo" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListTwo.depths eq '2' && resultListOne.menuNo eq resultListTwo.upperMenuId }">
|
||||
<li class="menu_depth02">
|
||||
<a href="${resultListTwo.menuType ne 'M' ? resultListTwo.url : '#'}" class="sub_menu_title" <c:if test ="${resultListTwo.menuType eq 'M'}"> onclick="depthTwoClick(this); return false;"</c:if>>
|
||||
<c:out value="${resultListTwo.menuNm}" />
|
||||
</a>
|
||||
<c:if test="${resultListTwo.childMenuCnt gt 0}">
|
||||
<ul class="menu_depth03">
|
||||
<c:forEach var="resultListThree" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListThree.depths eq '3' && resultListTwo.menuNo eq resultListThree.upperMenuId }">
|
||||
<li>
|
||||
<a href="${empty resultListThree.url ? '#' : resultListThree.url }" ${resultListThree.menuType eq 'O' ? 'target="_blank"' : ""} >
|
||||
<c:out value="${resultListThree.menuNm}" />
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</c:if>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
<button type="button" class="btn btn_40 only_icon btn_all_menu">
|
||||
<i class="icon menu"></i>
|
||||
</button>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="full_all_menu">
|
||||
<div class="top_area">
|
||||
<div class="inner">
|
||||
<h1 class="logo"><a href="/" title="메인으로 이동"><img src="/kofair_case_seed/usr/images/layout/header_logo.png" alt="한국공정거래조정원 KOREA FAIR TRADE MEDIATION AGENCY"></a></h1>
|
||||
<button type="button" class="btn only_icon btn_menu_close"><i class="icon menu close"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<nav class="nav">
|
||||
<div class="inner">
|
||||
<ul class="menu_ul">
|
||||
<c:forEach var="resultListOne" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListOne.depths eq '1' }">
|
||||
<li>
|
||||
<a href="#" class="menu_title" id="${resultListOne.menuNo}">
|
||||
<c:out value="${resultListOne.menuNm}" />
|
||||
</a>
|
||||
<ul class="depth02_ul">
|
||||
<c:forEach var="resultListTwo" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListTwo.depths eq '2' && resultListOne.menuNo eq resultListTwo.upperMenuId }">
|
||||
<li>
|
||||
<a href="${resultListTwo.menuType ne 'M' ? resultListTwo.url : '#'}" class="depth02"
|
||||
<c:if test="${resultListTwo.menuType eq 'M'}">onclick="depthTwoClick(this); return false;"</c:if>>
|
||||
<c:out value="${resultListTwo.menuNm}" />
|
||||
</a>
|
||||
<c:if test="${resultListTwo.childMenuCnt gt 0}">
|
||||
<ul class="depth03_ul">
|
||||
<c:forEach var="resultListThree" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListThree.depths eq '3' && resultListTwo.menuNo eq resultListThree.upperMenuId }">
|
||||
<li>
|
||||
<a href="${empty resultListThree.url ? '#' : resultListThree.url}"
|
||||
${resultListThree.menuType eq 'O' ? 'target="_blank"' : ''}>
|
||||
<c:out value="${resultListThree.menuNm}" />
|
||||
<c:if test="${resultListThree.menuType eq 'O'}">
|
||||
<i class="icon outlink"></i>
|
||||
</c:if>
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</c:if>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
<!-- //전체메뉴 -->
|
||||
<div class="mobile_header">
|
||||
<div class="header_wrap">
|
||||
<h1 class="logo">
|
||||
<a href="/" title="메인으로 이동">
|
||||
<img src="/kofair_case_seed/usr/images/layout/header_logo_m.png" alt="한국공정거래조정원 KOREA FAIR TRADE MEDIATION AGENCY">
|
||||
</a>
|
||||
</h1>
|
||||
<div class="header_util">
|
||||
|
||||
<%-- <c:when test="${certVO.name != '' && certVO.phone != ''}">
|
||||
<button type="button" class="btn only_icon btn_sertification_out" onclick="location.href='/web/user/mypage/case/01/168/myCheckRemove.do'"><i class="icon sertification_out"></i></button>
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
<button type="button" class="btn only_icon btn_sertification" onclick="location.href='/web/user/mypage/case/01/168/myCheck.do'"><i class="icon sertification"></i></button>
|
||||
</c:otherwise> --%>
|
||||
<button type="button" class="btn only_icon btn_sertification" onclick="location.href='/web/user/mypage/case/01/168/myCheck.do'"><i class="icon sertification"></i></button>
|
||||
|
||||
<!-- <button type="button" class="btn only_icon btn_sertification"><i></i></button>
|
||||
<button type="button" class="btn only_icon btn_sertification_out hide"><i></i></button> -->
|
||||
<button type="button" class="btn only_icon btn_search"><i></i></button>
|
||||
<button type="button" class="btn only_icon btn_menu"><i></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="search_area">
|
||||
<input type="text" class="input_text input_search">
|
||||
<button type="button" class="btn_search"><i></i></button>
|
||||
</div>
|
||||
<div class="all_menu_wrap">
|
||||
<div class="top_area">
|
||||
<h1 class="logo">
|
||||
<a href="/" title="메인으로 이동">
|
||||
<img src="/kofair_case_seed/usr/images/layout/header_logo_m.png" alt="한국공정거래조정원 KOREA FAIR TRADE MEDIATION AGENCY">
|
||||
</a>
|
||||
</h1>
|
||||
<button type="button" class="btn btn_menu_close"><i></i></button>
|
||||
</div>
|
||||
<nav class="mobile_menu">
|
||||
<ul class="mobile_ul">
|
||||
<c:forEach var="resultListOne" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListOne.depths eq '1' }">
|
||||
<li class="m_menu_depth01_li">
|
||||
<button type="button" class="m_menu_depth01" id="${resultListOne.menuNo}">
|
||||
<c:out value="${resultListOne.menuNm}" />
|
||||
<i></i>
|
||||
</button>
|
||||
<ul class="m_sub_menu">
|
||||
<c:forEach var="resultListTwo" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListTwo.depths eq '2' && resultListOne.menuNo eq resultListTwo.upperMenuId }">
|
||||
<li>
|
||||
<a href="${resultListTwo.menuType ne 'M' ? resultListTwo.url : '#'}" class="title" <c:if test ="${resultListTwo.menuType eq 'M'}"> onclick="depthTwoClick(this); return false;"</c:if>>
|
||||
<c:out value="${resultListTwo.menuNm}" />
|
||||
</a>
|
||||
<ul class="m_sub_depth02">
|
||||
<c:forEach var="resultListThree" items="${menuResultList}" varStatus="status">
|
||||
<c:if test="${resultListThree.depths eq '3' && resultListTwo.menuNo eq resultListThree.upperMenuId }">
|
||||
<li>
|
||||
<a href="${empty resultListThree.url ? '#' : resultListThree.url }" ${resultListThree.menuType eq 'O' ? 'target="_blank"' : ""} >
|
||||
<c:out value="${resultListThree.menuNm}" />
|
||||
</a>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</li>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
@ -22,16 +22,35 @@
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,user-scalable=yes">
|
||||
<meta http-equiv="Content-Security-Policy"
|
||||
content="default-src * self blob: data: gap:; style-src * self 'unsafe-inline' blob: data: gap:; script-src * 'self' 'unsafe-eval' 'unsafe-inline' blob: data: gap:; object-src * 'self' blob: data: gap:; img-src * self 'unsafe-inline' blob: data: gap:; connect-src self * 'unsafe-inline' blob: data: gap:; frame-src * self blob: data: gap:;">
|
||||
<meta http-equiv="Content-Security-Policy" content="default-src * self blob: data: gap:; style-src * self 'unsafe-inline' blob: data: gap:; script-src * 'self' 'unsafe-eval' 'unsafe-inline' blob: data: gap:; object-src * 'self' blob: data: gap:; img-src * self 'unsafe-inline' blob: data: gap:; connect-src self * 'unsafe-inline' blob: data: gap:; frame-src * self blob: data: gap:;">
|
||||
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<meta http-equiv="Content-Security-Policy"
|
||||
content="default-src * self blob: data: gap:; style-src * self 'unsafe-inline' blob: data: gap:; script-src * 'self' 'unsafe-eval' 'unsafe-inline' blob: data: gap:; object-src * 'self' blob: data: gap:; img-src * self 'unsafe-inline' blob: data: gap:; connect-src self * 'unsafe-inline' blob: data: gap:; frame-src * self blob: data: gap:;">
|
||||
<!-- css -->
|
||||
<link rel="stylesheet" href="/css/reset.css">
|
||||
<link rel="stylesheet" href="/css/font.css">
|
||||
<link rel="stylesheet" href="/publish/usr/layout/layout.css">
|
||||
<link rel="stylesheet" href="/publish/usr/css/common.css">
|
||||
<link rel="stylesheet" href="/publish/usr/css/button.css">
|
||||
<link rel="stylesheet" href="/publish/usr/css/tab.css">
|
||||
<link rel="stylesheet" href="/publish/usr/css/table.css">
|
||||
<link rel="stylesheet" href="/publish/usr/css/calendar.css">
|
||||
<link rel="stylesheet" href="/publish/usr/css/popup.css">
|
||||
<!-- //css -->
|
||||
|
||||
<!-- script -->
|
||||
<script src="/js/jquery-3.5.0.js"></script>
|
||||
<script src="/publish/usr/layout/layout.js"></script>
|
||||
<script src="/publish/usr/script/tab.js"></script>
|
||||
<script src="/publish/usr/script/popup.js"></script>
|
||||
<script src="/publish/usr/script/content.js"></script>
|
||||
<script src="/publish/usr/script/toggleCalendar.js"></script>
|
||||
<!-- //script -->
|
||||
|
||||
<!-- 캘린더 -->
|
||||
<script type="module" src="/js/plugin/datapicker/duet.esm.js"></script>
|
||||
<script nomodule src="/js/plugin/datapicker/duet.js"></script>
|
||||
<link rel="stylesheet" href="/js/plugin/datapicker/default.css">
|
||||
|
||||
<link rel="stylesheet" href="/kofair_case_seed/css/reset.css">
|
||||
<!-- <link rel="stylesheet" href="/kofair_case_seed/css/reset.css">
|
||||
<link rel="stylesheet" href="/kofair_case_seed/css/font.css">
|
||||
<link rel="stylesheet" href="/kofair_case_seed/usr/style/common.css">
|
||||
<link rel="stylesheet" href="/kofair_case_seed/usr/style/style.css">
|
||||
@ -47,7 +66,22 @@ content="default-src * self blob: data: gap:; style-src * self 'unsafe-inline' b
|
||||
<script src="/js/jquery.selectboxes.js"></script>
|
||||
<script src="/kofair_case_seed/usr/scripts/common.js"></script>
|
||||
<script src="/kofair_case_seed/usr/scripts/layout.js"></script>
|
||||
<script src="/kofair_case_seed/usr/scripts/case.js"></script>
|
||||
<script src="/kofair_case_seed/usr/scripts/case.js"></script> -->
|
||||
|
||||
<!-- 메인 -->
|
||||
<c:if test="${fn:contains(URL , 'main/mainPage.do')}">
|
||||
<!-- plugin -->
|
||||
<link rel="stylesheet" href="/js/plugin/swiper-11.1.9/package/swiper-bundle.min.css">
|
||||
<script src="/js/plugin/swiper-11.1.9/package/swiper-bundle.min.js"></script>
|
||||
<!-- //plugin -->
|
||||
|
||||
<link rel="stylesheet" href="/publish/usr/css/main.css">
|
||||
<script src="/publish/usr/script/main.js"></script>
|
||||
</c:if>
|
||||
<!-- 메인 아닐경우-->
|
||||
<c:if test="${!fn:contains(URL , 'main/mainPage.do')}">
|
||||
<link rel="stylesheet" href="/publish/usr/css/style.css">
|
||||
</c:if>
|
||||
|
||||
|
||||
<!-- 컨텐츠 -->
|
||||
@ -55,9 +89,9 @@ content="default-src * self blob: data: gap:; style-src * self 'unsafe-inline' b
|
||||
fn:contains(URL , '/web/content.do')
|
||||
|| fn:contains(URL , '/web/ckeditorPriview.do')
|
||||
}">
|
||||
<link rel="stylesheet" href="/kofair_case_seed/usr/style/info.css">
|
||||
<!-- <link rel="stylesheet" href="/kofair_case_seed/usr/style/info.css">
|
||||
<script src="/kofair_case_seed/usr/scripts/ui.js"></script>
|
||||
<script src="/kofair_case_seed/usr/scripts/info.js"></script>
|
||||
<script src="/kofair_case_seed/usr/scripts/info.js"></script> -->
|
||||
</c:if>
|
||||
|
||||
<!-- 본인인증 -->
|
||||
@ -109,7 +143,6 @@ content="default-src * self blob: data: gap:; style-src * self 'unsafe-inline' b
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<div class="mask"></div>
|
||||
<c:choose>
|
||||
<c:when test="${!fn:contains(URL , 'main/mainPage.do')}">
|
||||
@ -127,7 +160,7 @@ content="default-src * self blob: data: gap:; style-src * self 'unsafe-inline' b
|
||||
<c:choose>
|
||||
<c:when test="${!fn:contains(URL , 'main/mainPage.do')}">
|
||||
<%-- 서브제목 --%>
|
||||
<div class="contents sub">
|
||||
<div class="container sub" id="container">
|
||||
<c:import url="/web/com/subVisual.do"></c:import>
|
||||
<div class="inner">
|
||||
<%-- 좌측메뉴 --%>
|
||||
@ -142,7 +175,9 @@ content="default-src * self blob: data: gap:; style-src * self 'unsafe-inline' b
|
||||
</div>
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
<decorator:body />
|
||||
<div class="container main" id="container">
|
||||
<decorator:body />
|
||||
</div>
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
<%-- 푸터메뉴 영역 --%>
|
||||
|
||||
@ -8,14 +8,7 @@
|
||||
if (request.getProtocol().equals("HTTP/1.1")) response.setHeader("Cache-Control", "no-cache");
|
||||
%>
|
||||
|
||||
|
||||
<link rel="stylesheet" href="/kofair_case_seed/usr/style/index.css">
|
||||
<link rel="stylesheet" href="/kofair_case_seed/script/plugin/swiper-11.1.9/package/swiper-bundle.css">
|
||||
|
||||
<script src="/kofair_case_seed/usr/scripts/index.js"></script>
|
||||
<script src="/kofair_case_seed/script/plugin/swiper-11.1.9/package/swiper-bundle.js"></script>
|
||||
|
||||
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.min.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function (){
|
||||
|
||||
@ -162,213 +155,334 @@ function commonPopWindowopenForm(surl, popupwidth, popupheight, name, frm) {
|
||||
</script>
|
||||
|
||||
<!-- 비주얼 -->
|
||||
<c:choose>
|
||||
<c:when test="${not empty mainzoneImg}">
|
||||
<c:set var="backgroundUrl" value="/uss/ion/pwm/getImage.do?atchFileId=${mainzoneImg.mainzoneImageFile}" />
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
<c:set var="backgroundUrl" value="/kofair_case_seed/usr/images/main/main_visual.jpg" />
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
<c:choose>
|
||||
<c:when test="${not empty mainzoneImg}">
|
||||
<c:set var="backgroundUrl" value="/uss/ion/pwm/getImage.do?atchFileId=${mainzoneImg.mainzoneImageFile}" />
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
<c:set var="backgroundUrl" value="/kofair_case_seed/usr/images/main/main_visual.jpg" />
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
|
||||
<div class="visual" style="
|
||||
<%-- <div class="visual" style="
|
||||
width: 100%;
|
||||
padding: 70px 0;
|
||||
background: url('${backgroundUrl}') no-repeat center center;
|
||||
text-align: center;
|
||||
background-size: cover;
|
||||
">
|
||||
<div class="inner">
|
||||
<p class="visual_title">한국공정거래조정원 <span>분쟁조정사건처리시스템</span> 입니다.</p>
|
||||
</div> --%>
|
||||
|
||||
<div class="baro_content">
|
||||
<a href="/web/user/mediation/case/01/154/mediationApp.do" class="baro_link darkblue_box">
|
||||
<b class="baro_title">분쟁조정 신청</b>
|
||||
<p class="baro_text">언제 어디서든 온라인으로 분쟁조정<br>을 신청할 수 있습니다.</p>
|
||||
<i class="icon baro_apl"></i>
|
||||
</a>
|
||||
<a href="/web/user/mypage/case/01/169/myMediationList.do" class="baro_link blue_box">
|
||||
<b class="baro_title">조정신청 현황조회</b>
|
||||
<p class="baro_text">신청 완료된 사건의 목록을 확인,<br>접수증을 출력할 수 있습니다.</p>
|
||||
<i class="icon baro_inquiry"></i>
|
||||
</a>
|
||||
<a href="/web/user/mediation/case/01/155/checkMediationStep01.do" class="baro_link skyblue_box">
|
||||
<b class="baro_title">진행사건 조회</b>
|
||||
<p class="baro_text">진행중인 사건의 정보를 확인,<br>자료를 제출할 수 있습니다.</p>
|
||||
<i class="icon baro_data"></i>
|
||||
</a>
|
||||
<a href="/web/user/lawCounsel/case/02/159/step01.do" class="baro_link">
|
||||
<b class="baro_title">무료법률 상담</b>
|
||||
<p class="baro_text">법률전문가의 상담서비스를 이용할<br>수 있습니다.</p>
|
||||
<i class="icon baro_free_counsel"></i>
|
||||
</a>
|
||||
<a href="/web/user/onlineCounsel/case/01/158/step01.do" class="baro_link">
|
||||
<b class="baro_title">온라인 상담</b>
|
||||
<p class="baro_text">분쟁조정 신청 전 간단한 상담을<br>신청할 수 있습니다.</p>
|
||||
<i class="icon baro_online_counsel"></i>
|
||||
</a>
|
||||
<a href="/web/user/board/case/form/145/formList.do" class="baro_link">
|
||||
<b class="baro_title">분쟁조정 관련 서식</b>
|
||||
<p class="baro_text">신청서 작성예시, 위임장, 합의취하서<br>등 서식을 제공하고 있습니다.</p>
|
||||
<i class="icon baro_form"></i>
|
||||
</a>
|
||||
<!-- ============== 메인비주얼 ============== -->
|
||||
<div class="main_visual">
|
||||
<div class="inner">
|
||||
<div class="visual_slide swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<a href="#" class="swiper-slide">1</a>
|
||||
<a href="#" class="swiper-slide">2</a>
|
||||
<a href="#" class="swiper-slide">3</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- //비주얼 -->
|
||||
<!-- ============== 메인비주얼 끝 ============== -->
|
||||
|
||||
<!-- 분쟁조정 사례 -->
|
||||
<div class="case_content">
|
||||
<!-- ============== section01 ============== -->
|
||||
|
||||
<section class="section section01">
|
||||
<div class="inner">
|
||||
|
||||
<!-- ======= 이번달 교육일정 ======= -->
|
||||
<div class="sch_cont">
|
||||
<div class="title_wrap">
|
||||
<h2 class="main_title">이번달 교육 일정</h2>
|
||||
</div>
|
||||
<div class="cont_wrap">
|
||||
<ul class="tabs">
|
||||
<li>
|
||||
<button type="button" class="tab active" title="활성화됨">전체</button>
|
||||
<div class="tab_content">
|
||||
<div class="sch_title">
|
||||
<strong class="current_date">2025년 08월</strong>
|
||||
</div>
|
||||
<ul class="list">
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="list_left">
|
||||
<p class="title">
|
||||
<em class="status green">접수중</em>
|
||||
상표권 위조상품 기소유예
|
||||
</p>
|
||||
<ul class="list_info">
|
||||
<li><p><em>· 접수기간</em>2025-08-18 ~ 2025-08-20</p></li>
|
||||
<li><p><em>· 교육기간</em>2025-08-18 ~ 2025-08-20</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<span class="text_move">교육신청하기<i></i></span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="list_left">
|
||||
<p class="title">
|
||||
<em class="status gray">마감</em>
|
||||
상표권 위조상품 기소유예
|
||||
</p>
|
||||
<ul class="list_info">
|
||||
<li><p><em>· 접수기간</em>2025-08-18 ~ 2025-08-20</p></li>
|
||||
<li><p><em>· 교육기간</em>2025-08-18 ~ 2025-08-20</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<span class="text_move">교육신청하기<i></i></span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="list_left">
|
||||
<p class="title">
|
||||
<em class="status gray">마감</em>
|
||||
상표권 위조상품 기소유예
|
||||
</p>
|
||||
<ul class="list_info">
|
||||
<li><p><em>· 접수기간</em>2025-08-18 ~ 2025-08-20</p></li>
|
||||
<li><p><em>· 교육기간</em>2025-08-18 ~ 2025-08-20</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<span class="text_move">교육신청하기<i></i></span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="#" class="btn_more" title="더보기">자세히보기<i></i></a>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" class="tab" title="비활성화됨">기소유예 교육</button>
|
||||
<div class="tab_content">
|
||||
<div class="sch_title">
|
||||
<strong class="current_date">2025년 08월</strong>
|
||||
</div>
|
||||
<ul class="list">
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="list_left">
|
||||
<p class="title">
|
||||
<em class="status green">접수중</em>
|
||||
상표권 위조상품 기소유예
|
||||
</p>
|
||||
<ul class="list_info">
|
||||
<li><p><em>· 접수기간</em>2025-08-18 ~ 2025-08-20</p></li>
|
||||
<li><p><em>· 교육기간</em>2025-08-18 ~ 2025-08-20</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<span class="text_move">교육신청하기<i></i></span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="list_left">
|
||||
<p class="title">
|
||||
<em class="status gray">마감</em>
|
||||
상표권 위조상품 기소유예
|
||||
</p>
|
||||
<ul class="list_info">
|
||||
<li><p><em>· 접수기간</em>2025-08-18 ~ 2025-08-20</p></li>
|
||||
<li><p><em>· 교육기간</em>2025-08-18 ~ 2025-08-20</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<span class="text_move">교육신청하기<i></i></span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<div class="list_left">
|
||||
<p class="title">
|
||||
<em class="status gray">마감</em>
|
||||
상표권 위조상품 기소유예
|
||||
</p>
|
||||
<ul class="list_info">
|
||||
<li><p><em>· 접수기간</em>2025-08-18 ~ 2025-08-20</p></li>
|
||||
<li><p><em>· 교육기간</em>2025-08-18 ~ 2025-08-20</p></li>
|
||||
</ul>
|
||||
</div>
|
||||
<span class="text_move">교육신청하기<i></i></span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="#" class="btn_more" title="더보기">자세히보기<i></i></a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<!-- ======= 이번달 교육일정 끝 ======= -->
|
||||
|
||||
<!-- ======= 알림판 ======= -->
|
||||
<div class="allim_cont">
|
||||
<div class="allim_slide swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<a href="#" class="swiper-slide">1</a>
|
||||
<a href="#" class="swiper-slide">2</a>
|
||||
<a href="#" class="swiper-slide">3</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="allim_bottom">
|
||||
<p class="title">알림판</p>
|
||||
<div class="allim_util">
|
||||
<p><em class="current_num">4</em>/5</p>
|
||||
<div class="btn_wrap">
|
||||
<button type="button" class="btn_prev"><i></i></button>
|
||||
<button type="button" class="btn_pause"><i></i></button>
|
||||
<button type="button" class="btn_play hide"><i></i></button>
|
||||
<button type="button" class="btn_next"><i></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- ======= 알림판 끝 ======= -->
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- ============== section01 끝============== -->
|
||||
|
||||
<!-- ============== section02 ============== -->
|
||||
<section class="section section02">
|
||||
<div class="inner">
|
||||
<div class="title_wrap">
|
||||
<p class="title">분쟁조정 사례 <button type="button" class="btn only_icon gray_border round btn_plus" onclick="location.href='/web/user/exam/case/402/162/exam402List.do'"><i class="icon plus"></i></button></p>
|
||||
<div class="case_slide_util">
|
||||
<button type="button" class="btn only_icon round gray_border btn_prev" title="이전 사례로 이동"><i class="icon arrow left"></i></button>
|
||||
<button type="button" class="btn only_icon round gray_border btn_pause" title="일시정지"><i class="icon pause"></i></button>
|
||||
<button type="button" class="btn only_icon round gray_border hide btn_play" title="재생"><i class="icon play"></i></button>
|
||||
<button type="button" class="btn only_icon round gray_border btn_next" title="다음 사례로 이동"><i class="icon arrow right"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<h2 class="main_title">NOTICE</h2>
|
||||
|
||||
<div class="case_list swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<c:forEach var="caseList" items="${examList}" varStatus="status">
|
||||
<div class="swiper-slide">
|
||||
<a href="${caseList.url}" class="case">
|
||||
<p class="case_type_box ${caseList.titleColor}">
|
||||
<c:out value="${caseList.menuNm}"/>
|
||||
</p>
|
||||
<p class="case_type"><c:out value="${caseList.EXAM_TYPE}"/></p>
|
||||
<p class="case_title"><c:out value="${caseList.EXAM_SUBJ}"/></p>
|
||||
</a>
|
||||
</div>
|
||||
<div class="cont_wrap">
|
||||
<ul class="tabs">
|
||||
<li>
|
||||
<button type="button" class="tab active" title="활성화됨">전체</button>
|
||||
<div class="tab_content">
|
||||
<ul class="card_list">
|
||||
<li class="part_notice">
|
||||
<a href="#">
|
||||
<span class="part"><i></i>공지사항</span>
|
||||
<span class="title">2025년 하반기 의약품 허가 특허 연계제도 교육 모집 공고</span>
|
||||
<span class="summary">2025년 하반기 의약품 허가특허연계제도 교육을 실시하오니 관심 있는 분들의 많은 참여 바랍니다. 가. 교육명: 2025년도 하반기 의약품 허가특허연계제도 교육</span>
|
||||
<ul class="list_util">
|
||||
<li><i class="icon calendar"></i>2025-08-19</li>
|
||||
<li><i class="icon writer"></i>관리자</li>
|
||||
<li><i class="icon view"></i>434</li>
|
||||
</ul>
|
||||
</a>
|
||||
</li>
|
||||
<li class="part_data">
|
||||
<a href="#">
|
||||
<span class="part"><i></i>교육자료실</span>
|
||||
<span class="title">2025년 하반기 의약품 허가 특허 연계제도 교육 모집 공고</span>
|
||||
<span class="summary">2025년 하반기 의약품 허가특허연계제도 교육을 실시하오니 관심 있는 분들의 많은 참여 바랍니다. 가. 교육명: 2025년도 하반기 의약품 허가특허연계제도 교육</span>
|
||||
<ul class="list_util">
|
||||
<li><i class="icon calendar"></i>2025-08-19</li>
|
||||
<li><i class="icon writer"></i>관리자</li>
|
||||
<li><i class="icon view"></i>434</li>
|
||||
</ul>
|
||||
</a>
|
||||
</li>
|
||||
<li class="part_data">
|
||||
<a href="#">
|
||||
<span class="part"><i></i>교육자료실</span>
|
||||
<span class="title">2025년 하반기 의약품 허가 특허 연계제도 교육 모집 공고</span>
|
||||
<span class="summary">2025년 하반기 의약품 허가특허연계제도 교육을 실시하오니 관심 있는 분들의 많은 참여 바랍니다. 가. 교육명: 2025년도 하반기 의약품 허가특허연계제도 교육</span>
|
||||
<ul class="list_util">
|
||||
<li><i class="icon calendar"></i>2025-08-19</li>
|
||||
<li><i class="icon writer"></i>관리자</li>
|
||||
<li><i class="icon view"></i>434</li>
|
||||
</ul>
|
||||
</a>
|
||||
</li>
|
||||
<li class="part_data">
|
||||
<a href="#">
|
||||
<span class="part"><i></i>교육자료실</span>
|
||||
<span class="title">2025년 하반기 의약품 허가 특허 연계제도 교육 모집 공고</span>
|
||||
<span class="summary">2025년 하반기 의약품 허가특허연계제도 교육을 실시하오니 관심 있는 분들의 많은 참여 바랍니다. 가. 교육명: 2025년도 하반기 의약품 허가특허연계제도 교육</span>
|
||||
<ul class="list_util">
|
||||
<li><i class="icon calendar"></i>2025-08-19</li>
|
||||
<li><i class="icon writer"></i>관리자</li>
|
||||
<li><i class="icon view"></i>434</li>
|
||||
</ul>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<a href="#" class="btn_more" title="더보기">자세히보기<i></i></a>
|
||||
</div>
|
||||
</c:forEach>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- //분쟁조정 사례 -->
|
||||
|
||||
<!-- 하단 -->
|
||||
<div class="main_bottom">
|
||||
<div class="inner">
|
||||
<!-- 자주하는질문 + 공지사항 -->
|
||||
<div class="notice_content">
|
||||
<button type="button" class="tab active">자주하는 질문</button>
|
||||
<div class="tab_content faq active">
|
||||
<ul class="list">
|
||||
<c:forEach var="faqList" items="${faqList}" varStatus="status">
|
||||
<li>
|
||||
<a href="<c:out value='${faqList.bbsTypeUrl }'/>">
|
||||
<span class="color_blue">
|
||||
[<c:out value="${faqList.bbsTypeNm }"/>]
|
||||
</span>
|
||||
<c:out value="${faqList.FAQ_SUBJ}"/>
|
||||
</a>
|
||||
</li>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
<button type="button" class="btn only_icon gray_border btn_40 round btn_plus" title="자주하는 질문 더보기" onclick="location.href='/web/user/faqBbs/case/101/147/faq101List.do'"><i class="icon plus"></i></button>
|
||||
</div>
|
||||
<button type="button" class="tab">공지사항</button>
|
||||
<div class="tab_content notice">
|
||||
<ul class="list">
|
||||
<c:forEach var="noticeList" items="${noticeList}" varStatus="status">
|
||||
<li>
|
||||
<a href="/web/user/board/case/notice/152/noticeDetail.do?bbsNo=${noticeList.BBS_NO}&page=1&fileFuncType=form_notice&searchType=title&searchTilte=">
|
||||
<span class="list_title">
|
||||
<c:out value="${noticeList.BBS_TITLE}"/>
|
||||
</span>
|
||||
<span class="date">
|
||||
<c:out value="${noticeList.BBS_REG_DATE}"/>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</c:forEach>
|
||||
</ul>
|
||||
<button type="button" class="btn only_icon gray_border btn_40 round btn_plus" title="공지사항 더보기" onclick="location.href='/web/user/board/case/notice/152/noticeList.do'"><i class="icon plus"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- //자주하는질문 + 공지사항 -->
|
||||
|
||||
<!-- 뉴스레터 -->
|
||||
<div class="news_content">
|
||||
<p class="title">뉴스레터<span>다양한 정책 정보를 매월 정기 발행</span></p>
|
||||
|
||||
<ul class="news_list">
|
||||
<c:forEach var="newsLetterList" items="${newsLetterList}" varStatus="status">
|
||||
<li>
|
||||
<a href="/web/user/board/case/news/340/newsDetail.do?bbsNo=${newsLetterList.BBS_NO}&page=1&fileFuncType=form_notice&searchType=title&searchTilte=" class="new">${newsLetterList.BBS_TITLE}</a>
|
||||
</li>
|
||||
</c:forEach>
|
||||
</li>
|
||||
<li>
|
||||
<button type="button" class="tab" title="비활성화됨">기소유예 교육</button>
|
||||
<div class="tab_content">
|
||||
<a href="#" class="btn_more" title="더보기">자세히보기<i></i></a>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="btn_wrap">
|
||||
<button type="button" class="btn btn_text btn_40 skyblue_fill" onclick="location.href='/web/user/board/case/news/340/newsList.do'">전체보기</button>
|
||||
<button type="button" class="btn btn_text btn_40 skyblue_fill" onclick="location.href='/web/user/news/case/01/341/newsList.do'">신청하기</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- //뉴스레터 -->
|
||||
|
||||
<!-- 콜센터 -->
|
||||
<c:choose>
|
||||
<c:when test="${not empty popupzoneImg}">
|
||||
<c:set var="popupzonedUrl" value="/uss/ion/pwm/getImage.do?atchFileId=${popupzoneImg.popupzoneImageFile}" />
|
||||
</c:when>
|
||||
<c:otherwise>
|
||||
<c:set var="popupzonedUrl" value="/kofair_case_seed/usr/images/main/callcenter_img.png" />
|
||||
</c:otherwise>
|
||||
</c:choose>
|
||||
|
||||
<div class="callcenter_content" style="
|
||||
width: 342px;
|
||||
background: #d4c9fe url('${popupzonedUrl}') no-repeat center bottom;
|
||||
border-radius: 10px;
|
||||
">
|
||||
<a href="/web/user/onlineCounsel/case/01/158/step01.do">
|
||||
<p class="title">분쟁조정 콜센터</p>
|
||||
<p><span class="gMarket_bold">1588-1490</span>(유료)<br>운영시간 : 평일 09:00~18:00</p>
|
||||
</a>
|
||||
</div>
|
||||
<!-- //콜센터 -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- //하단 -->
|
||||
</section>
|
||||
<!-- ============== section02 끝============== -->
|
||||
|
||||
<!-- 배너 -->
|
||||
<div class="banner_contents">
|
||||
<!-- ============== section03 ============== -->
|
||||
<section class="section section03">
|
||||
<div class="inner">
|
||||
<div class="case_slide_util">
|
||||
<button type="button" class="btn only_icon btn_40 round gray_border btn_prev" title="이전 배너로 이동"><i class="icon arrow left"></i></button>
|
||||
<button type="button" class="btn only_icon btn_40 round gray_border btn_pause" title="일시정지"><i class="icon pause"></i></button>
|
||||
<button type="button" class="btn only_icon btn_40 round gray_border hide btn_play" title="재생"><i class="icon play"></i></button>
|
||||
<button type="button" class="btn only_icon btn_40 round gray_border btn_next" title="다음 배너로 이동"><i class="icon arrow right"></i></button>
|
||||
</div>
|
||||
<div class="banner_slide swiper">
|
||||
<div class="swiper-wrapper">
|
||||
<c:forEach var="bannerList" items="${bannerList}" varStatus="status">
|
||||
<c:if test="${not empty bannerList.bannerImageFile}">
|
||||
<div class="swiper-slide">
|
||||
<a href="${bannerList.linkUrl}" target="_blank" title="새창열림">
|
||||
<img src="<c:url value='/uss/ion/pwm/getImage.do'/>?atchFileId=<c:out value="${bannerList.bannerImageFile}"/>" alt="<c:out value="${bannerList.alt}"/>">
|
||||
</a>
|
||||
</div>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
<c:forEach var="bannerList" items="${bannerList}" varStatus="status">
|
||||
<c:if test="${not empty bannerList.bannerImageFile}">
|
||||
<div class="swiper-slide">
|
||||
<a href="${bannerList.linkUrl}" target="_blank" title="새창열림">
|
||||
<img src="<c:url value='/uss/ion/pwm/getImage.do'/>?atchFileId=<c:out value="${bannerList.bannerImageFile}"/>" alt="<c:out value="${bannerList.alt}"/>">
|
||||
</a>
|
||||
</div>
|
||||
</c:if>
|
||||
</c:forEach>
|
||||
<div class="faq_cont">
|
||||
<div class="title_wrap">
|
||||
<h2 class="main_title">자주묻는 질문</h2>
|
||||
<a href="#" class="btn_more" title="더보기">자세히보기<i></i></a>
|
||||
</div>
|
||||
<ul class="box_list">
|
||||
<li>
|
||||
<a href="#">
|
||||
<span class="question">
|
||||
<em>Q.</em>조정제도가 무엇이며, 어떤 장점이 있나요?
|
||||
</span>
|
||||
<span class="answer">
|
||||
<em>A.</em><span>조정이란 전문가로 구성된 조정위원들의 의견을 바탕으로 양당사자간에 충분한 대화 및 의견조율을 통해 분쟁을 자율적으로 해결하는 제도입니다. 통상 산업재산권 분쟁은 대부분 조정을 통해 해결이 가능함에도 불구하고 심판이나 소송으로 진행될 경우 많은 비용과 시간이 투입되게 되어 불필요한 사회적 비용이 발생하게 됩니다. 또한 우리 위원회를 통해 조정절차를 거쳐 조정이 성립되게 되면 양당사자에게 조정조서가 발급되고
|
||||
조정조서는 재판상 화해와 같은 효력을 갖게 됩니다. 조정은 3개월이내에 분쟁을 종결 지을 수 있고, 절차 진행에 비용이 전혀 들지 않습니다. 또한 모든 절차는 비공개로
|
||||
진행되어 보안을 유지할 수 있는 장점이 있습니다.</span>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<span class="question">
|
||||
<em>Q.</em>조정신청은 어떻게 하나요?
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<span class="question">
|
||||
<em>Q.</em>조정비용은 얼마인가요?
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">
|
||||
<span class="question">
|
||||
<em>Q.</em>조정대상은 무엇입니까?
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="qna_cont">
|
||||
<div class="title_wrap">
|
||||
<h2 class="main_title">Q&A</h2>
|
||||
</div>
|
||||
<div class="cont_wrap">
|
||||
<p class="title">교육문의</p>
|
||||
<span class="summary">
|
||||
교육과정의 신청 방법, 이수 기준 등에 대해 궁금한 사항을 안내해드립니다.
|
||||
</span>
|
||||
<strong>02-2183-5880</strong>
|
||||
<span class="info">평일 <em>09:00 ~ 18:00</em> / 토,일 공휴일 휴무</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- //배너 -->
|
||||
</section>
|
||||
<!-- ============== section03 끝============== -->
|
||||
|
||||
|
||||
<c:if test="${fn:length(popupList) > 0}" >
|
||||
<style>
|
||||
|
||||
@ -538,6 +538,8 @@ duet-date-picker *:focus{outline: auto !important;box-shadow:none !important;}
|
||||
.duet-date__dialog{min-width:360px;}
|
||||
.duet-date__dialog-content{max-width:360px;background:#fff;padding:50px 16px 20px;}
|
||||
.duet-date__input{width:100%;height:100%;padding:0;font-size:16px;border:0;}
|
||||
.duet-date__input::placeholder{font-family:'Pretendard';font-size:14px;color:#777;font-weight:400;}
|
||||
|
||||
|
||||
.duet-date__table{table-layout:fixed;}
|
||||
.duet-date__day,.duet-date__prev, .duet-date__next{min-width:0 !important;}
|
||||
|
||||
@ -3,33 +3,36 @@
|
||||
/* -> disabled는 스타일만 만들고 사용X(웹접근성 인증 시 안됨. 클래스로 대체) */
|
||||
|
||||
/* 버튼 레이아웃 */
|
||||
.btn_wrap{display:flex;justify-content:space-between;}
|
||||
.btn_wrap{display:flex;justify-content:space-between;gap:8px;}
|
||||
.btn_wrap.column{flex-direction:column;gap:4px;}
|
||||
|
||||
.btn_wrap>div{display:flex;width:calc(100%/3);gap:8px}
|
||||
.btn_wrap .left{justify-content:flex-start;}
|
||||
.btn_wrap .center{justify-content:center;}
|
||||
.btn_wrap .right{justify-content:flex-end;}
|
||||
.btn_wrap.left, .btn_wrap .left{justify-content:flex-start;}
|
||||
.btn_wrap.center,.btn_wrap .center{justify-content:center;}
|
||||
.btn_wrap.right,.btn_wrap .right{justify-content:flex-end;}
|
||||
|
||||
|
||||
/* 버튼 스타일 */
|
||||
.btn{border-radius: 5px;box-sizing:border-box;}
|
||||
.btn{border-radius:5px;box-sizing:border-box;}
|
||||
.btn:hover{box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.08);transition: all 0.3s ease;}
|
||||
|
||||
.btn.only_text{padding:0 !important;}
|
||||
.btn.only_icon{padding:0 !important;}
|
||||
.btn.mix{display:flex;align-items:center;}
|
||||
.btn.mix .icon{height:100%;background-size:contain;}
|
||||
|
||||
.btn.xssmall{height:28px;font-size:14px;padding:0 4px;}
|
||||
.btn.ssmall{height:30px;font-size:14px;padding:0 6px;}
|
||||
.btn.small{height:32px;font-size:16px;padding:0 6px;}
|
||||
.btn.medium{height:34px;font-size:16px;padding:0 8px;}
|
||||
.btn.large{height:38px;font-size:18px;padding:0 12px;}
|
||||
.btn.xlarge{height:50px;font-size:18px;padding:0 24px;}
|
||||
.btn.large{height:38px;font-size:18px;padding:0 12px;font-weight:600;}
|
||||
.btn.xlarge{height:50px;font-size:18px;padding:0 24px;font-weight:600;}
|
||||
|
||||
.btn.fill.primary{background-color: var(--primary-color);color: #fff;}
|
||||
.btn.fill.primary:hover{background-color: var(--primary-color-hover);color: #fff;}
|
||||
.btn.fill.primary_light{background-color: var(--primary-light-color);border: 1px solid var(--primary-light-border);color:#222;}
|
||||
.btn.fill.primary_light{background-color: var(--primary-light-color);border: 1px solid var(--primary-light-border);color:var(--primary-color);}
|
||||
.btn.fill.primary_light:hover{background-color: var(--primary-light-color-hover);}
|
||||
.btn.fill.secondary{background-color: var(--secondary-color);color: #1A1B1D;}
|
||||
.btn.fill.secondary{background-color: var(--secondary-color);color: #fff;}
|
||||
.btn.fill.secondary:hover{background-color: var(--secondary-color-hover);}
|
||||
.btn.fill.accent{background-color: var(--accent-color);color: #fff;}
|
||||
.btn.fill.accent:hover{background-color: var(--accent-color-hover);}
|
||||
@ -46,8 +49,8 @@
|
||||
|
||||
.btn.line.primary{border: 1px solid var(--primary-color);color: var(--primary-color);}
|
||||
.btn.line.primary:hover{border: 1px solid var(--primary-color-hover);color: var(--primary-color-hover);}
|
||||
.btn.line.secondary{border: 1px solid var(--secondary-color);color: #222;}
|
||||
.btn.line.secondary:hover{border: 1px solid var(--secondary-color-hover);}
|
||||
.btn.line.secondary{border: 1px solid var(--secondary-color);color:var(--secondary-color);}
|
||||
.btn.line.secondary:hover{background:var(--secondary-light-color);border: 1px solid var(--secondary-color-hover);}
|
||||
.btn.line.accent{border: 1px solid var(--accent-color);color: var(--accent-color);}
|
||||
.btn.line.accent:hover{border: 1px solid var(--accent-color-hover);}
|
||||
.btn.line.red{border: 1px solid var(--red-color);color: var(--red-color);}
|
||||
@ -63,7 +66,12 @@
|
||||
.btn.fill.disabled,.btn.fill.readonly,.btn.fill:disabled{background:var(--disable-fill-bg-color) !important; color:var(--disable-fill-text-color) !important; pointer-events:none;}
|
||||
.btn.line.disabled,.btn.line.readonly,.btn.line:disabled{background:var(--disable-line-bg-color) !important;border:1px solid var(--disable-line-border-color);color:var(--disable-line-text-color) !important;pointer-events:none;}
|
||||
|
||||
.btn_delete i.icon.delete{background-size:80%;margin:-1px 0 0 0;}
|
||||
.btn_delete i.icon.delete{background-size:auto;margin:0;}
|
||||
.btn.excel{background:#fff;border:1px solid #0e8945;color:#0e8945;}
|
||||
.btn.excel i{width:32px;}
|
||||
.btn.excel i.download,.btn.excel i.upload{margin:2px 0 0 0;}
|
||||
|
||||
.sortBtn{font-size:11px;margin:0 0 0 4px;}
|
||||
|
||||
|
||||
/* 페이지 */
|
||||
@ -74,7 +82,9 @@
|
||||
.page .btn_page{border:1px solid #d2d7df;border-radius:5px;overflow:hidden;}
|
||||
.page .btn_page:hover{background-color:#F5F6F7;}
|
||||
.page .btn_page i{display:inline-block;width:100%;height:100%;transition:all .3s;}
|
||||
.btn_first i{background:url(../images/component/icon_double_arrow_left_page.png) no-repeat center;}
|
||||
.btn_prev i{background:url(../images/component/icon_arrow_left_page.png) no-repeat center;}
|
||||
.btn_next i{background:url(../images/component/icon_arrow_right_page.png) no-repeat center;}
|
||||
.btn_last i{background:url(../images/component/icon_double_arrow_right_page.png) no-repeat center;}
|
||||
.btn_first i{background:url(/publish/adm/images/component/icon_double_arrow_left_page.png) no-repeat center;}
|
||||
.btn_prev i{background:url(/publish/adm/images/component/icon_arrow_left_page.png) no-repeat center;}
|
||||
.btn_next i{background:url(/publish/adm/images/component/icon_arrow_right_page.png) no-repeat center;}
|
||||
.btn_last i{background:url(/publish/adm/images/component/icon_double_arrow_right_page.png) no-repeat center;}
|
||||
|
||||
|
||||
|
||||
@ -0,0 +1,20 @@
|
||||
button.duet-date__toggle{height:100%;top:0;}
|
||||
*[class*="endDate"] .duet-date__dialog{left:auto;right:0;}
|
||||
|
||||
.wrap .duet-date__dialog-content{padding:30px 20px;border-radius:16px;;}
|
||||
.wrap .duet-date__dialog-content *{font-family:'pretendard';}
|
||||
.wrap .duet-date__mobile{display:none;}
|
||||
.wrap .duet-date__header{gap:12px;}
|
||||
.wrap .duet-date__header>div.duet-date__nav{display:none;}
|
||||
.wrap .duet-date__header>div:first-child .duet-date__select{width:100%;}
|
||||
.wrap .duet-date__select{width:45%;}
|
||||
.wrap .duet-date__select-label{width:100%;border:0;background-color:#EDF0F5;}
|
||||
|
||||
.wrap .duet-date__table tr{background:#fff;border-bottom:0;}
|
||||
.wrap .duet-date__table-header,.wrap .duet-date__cell,.wrap .duet-date__day,.wrap .list_top .search_area .duet-date__day{width:36px !important;height:36px !important;border-bottom:3px solid transparent;line-height:1;}
|
||||
.wrap .duet-date__day:hover::before,.wrap .duet-date__day.is-today::before,.wrap .duet-date__day[aria-pressed=true],.wrap .duet-date__day:focus{background:var(--secondary-color) !important;font-weight:bold !important;color:#fff !important;border-radius:100% !important;border-bottom:0 !important;}
|
||||
.wrap .duet-date__day.is-today{font-weight:500;color:var(--secondary-color);background:#fff;border:0;border-bottom:3px solid var(--secondary-color);border-radius:0;box-shadow:none;}
|
||||
.wrap .duet-date__day.is-today::before{display:none;}
|
||||
|
||||
.duet-date__row td:first-child button{color:var(--red-color);}
|
||||
.duet-date__row td:last-child button{color:var(--primary-color);}
|
||||
@ -5,7 +5,7 @@
|
||||
.dashboard .box_tit{display:flex;height:60px;align-items:center;justify-content:space-between;padding:0 25px;border-bottom:1px solid #E6E8EB;box-sizing: border-box;}
|
||||
.dashboard .box_tit p{font-size:20px;font-weight:bold;letter-spacing:-0.5px;color:#333;}
|
||||
.dashboard .box_tit .btn_plus{display:flex;font-size:16px;font-weight:300;color:#aaa;letter-spacing:-0.5px;align-items:center;gap:8px;}
|
||||
.dashboard .box_tit .btn_plus i{display:inline-block;width:14px;height:14px;background:url(../images/component/icon_plus.png) no-repeat center center;margin:-2px 0 0 0;transition:all .5s;}
|
||||
.dashboard .box_tit .btn_plus i{display:inline-block;width:14px;height:14px;background:url(/publish/adm/images/component/icon_plus.png) no-repeat center center;margin:-2px 0 0 0;transition:all .5s;}
|
||||
.dashboard .box_tit .btn_plus:hover{color:#666;font-weight:400;}
|
||||
.dashboard .box_tit .btn_plus:hover i{transform:rotate(90deg);}
|
||||
.dashboard .box_cont{position:relative;height:calc(100% - 60px);padding:20px 25px;box-sizing:border-box;}
|
||||
@ -16,24 +16,24 @@
|
||||
.today_box .today_status{text-align: center; width: calc((100% - 80px)/3);}
|
||||
.today_box p{font-size: 16px; font-weight: 300; margin-top: 12px;}
|
||||
.today_box .today_status i{display: block; width: 84px; height: 84px; background-color: #E8ECF4; border-radius: 100%; margin: 23px auto; background-repeat: no-repeat; background-position: center;}
|
||||
.today_box .status01 i{background-image: url(../image/dashboard/icon_today01.png);}
|
||||
.today_box .status02 i{background-image: url(../image/dashboard/icon_today02.png);}
|
||||
.today_box .status03 i{background-image: url(../image/dashboard/icon_today03.png);}
|
||||
/* .today_box .status01 i{background-image: url(/publish/adm/images/dashboard/icon_today01.png);}
|
||||
.today_box .status02 i{background-image: url(/publish/adm/images/dashboard/icon_today02.png);}
|
||||
.today_box .status03 i{background-image: url(/publish/adm/images/dashboard/icon_today03.png);} */
|
||||
.today_box span{font-size: 24px; font-weight: bold;}
|
||||
.today_box .status_pcs{width: 24px; height: 9px; background-image: url(../image/dashboard/icon_today_pcs.png);}
|
||||
/* .today_box .status_pcs{width: 24px; height: 9px; background-image: url(/publish/adm/images/dashboard/icon_today_pcs.png);} */
|
||||
/* //오늘 사용자 현황 */
|
||||
|
||||
/* 시스템관리 */
|
||||
.system_box{display: flex; flex-wrap: wrap; justify-content: space-between;}
|
||||
.system_box a{position: relative; display: flex; flex-flow: column; width: calc((100% - 10px)/2); height: 90px; justify-content: center; align-items: flex-start; border-radius: 10px; background-color: #666; margin: 5px 0; padding: 0 20px; box-sizing: border-box; background-repeat: no-repeat; background-position: calc(100% - 20px) center; box-shadow: 0 0 5px rgba(0,0,0,0.3); transition: background-color 0.2s ease-in-out;}
|
||||
.system_box a:hover{transition: background-color 0.2s ease-in-out;}
|
||||
.system_box .system01{background-color: #7991C3; background-image: url(../image/dashboard/icon_system01.png);}
|
||||
.system_box .system01{background-color: #7991C3;/* background-image: url(/publish/adm/images/dashboard/icon_system01.png); */}
|
||||
.system_box .system01:hover{background-color: #6281c4;}
|
||||
.system_box .system02{background-color: #2C3B5B; background-image: url(../image/dashboard/icon_system02.png);}
|
||||
.system_box .system02{background-color: #2C3B5B;/* background-image: url(/publish/adm/images/dashboard/icon_system02.png); */}
|
||||
.system_box .system02:hover{background-color: #1F2D4A;}
|
||||
.system_box .system03{background-color: #2557B4; background-image: url(../image/dashboard/icon_system03.png);}
|
||||
.system_box .system03{background-color: #2557B4;/* background-image: url(/publish/adm/images/dashboard/icon_system03.png); */}
|
||||
.system_box .system03:hover{background-color: #18418D;}
|
||||
.system_box .system04{background-color: #F86A3C; background-image: url(../image/dashboard/icon_system04.png);}
|
||||
.system_box .system04{background-color: #F86A3C;/* background-image: url(/publish/adm/images/dashboard/icon_system04.png); */}
|
||||
.system_box .system04:hover{background-color: rgb(241, 85, 33);}
|
||||
.system_box a::before{position: absolute; content: ""; width: 58px; height: 58px; background-color: rgba(255,255,255,0.3); border-radius: 100%; right: -5px; bottom: -5px;}
|
||||
.system_box p{font-size: 18px; font-weight: 400; color: #fff; letter-spacing: -0.5px; width: calc(100% - 40px); line-height: 1.3;}
|
||||
@ -73,7 +73,7 @@
|
||||
.dashboard_list.status{display:flex;flex-wrap:wrap;}
|
||||
.dashboard_list.status li{width:100%;align-items:center;gap:8px;}
|
||||
|
||||
.dashboard_list .status{display:flex;min-width:75px;height: 27px;font-size: 14px;font-weight:500;padding:0 12px;border-radius:28px;justify-content:center;align-items:center;transition: all 0.3s;}
|
||||
.dashboard_list .status{display:flex;min-width:75px;min-height:27px;height: 27px;font-size: 14px;font-weight:500;padding:0 12px;border-radius:28px;justify-content:center;align-items:center;transition: all 0.3s;}
|
||||
.dashboard_list .line.gray{border:1px solid #c1c5ce;color:#616576;}
|
||||
.dashboard_list .line.blue{border:1px solid #2557B4;color:#2557B4;}
|
||||
.dashboard_list .line.orange{border:1px solid #F86A3C;color:#F86A3C;}
|
||||
|
||||
@ -1,3 +1,18 @@
|
||||
@charset "utf-8";
|
||||
|
||||
.icon{display:inline-block;width:100%;height:100%;vertical-align:middle;;}
|
||||
.icon{display:inline-block;width:100%;height:100%;vertical-align:middle;;}
|
||||
|
||||
.icon.excel{width:40px;height:40px;background:url(/publish/adm/images/component/icon_excel.png) no-repeat center center;}
|
||||
.icon.excel.download{background:url(/publish/adm/images/component/icon_excel_download.png) no-repeat center center;}
|
||||
.icon.excel.upload{background:url(/publish/adm/images/component/icon_excel_upload.png) no-repeat center center;background-size:contain;}
|
||||
|
||||
.icon.file{width:20px;height:20px;background:url(/publish/adm/images/component/icon_file.png) no-repeat center center;}
|
||||
.icon.file.blue{background:url(/publish/adm/images/component/icon_file_blue.png) no-repeat center center;}
|
||||
.icon.file_bg{width:60px;height:60px;background:url(/publish/adm/images/component/icon_file_table.png) no-repeat center center;}
|
||||
|
||||
.icon.delete{width:30px;height:30px;background:url(/publish/adm/images/component/icon_x.png) no-repeat center;}
|
||||
.icon.delete.red{background:url(/publish/adm/images/component/icon_x_red.png) no-repeat center;}
|
||||
|
||||
.icon.x{width:30px;height:30px;background:url(/publish/adm/images/component/icon_x.png) no-repeat center;}
|
||||
.icon.x.white{background:url(/publish/adm/images/component/icon_x_white.png) no-repeat center;}
|
||||
.icon.x.red{background:url(/publish/adm/images/component/icon_x_red.png) no-repeat center;}
|
||||
@ -0,0 +1,23 @@
|
||||
@charset "utf-8";
|
||||
|
||||
.popup_title_area{display:flex;width:100%;height:50px;padding:0 20px;background:#000;align-items:center;justify-content:space-between;}
|
||||
h1.popup_title{font-size:18px;font-weight:600;color:#fff;}
|
||||
.popup_title_wrap{display:flex;align-items:center;justify-content:space-between;}
|
||||
.popup_title_wrap h2{font-size:16px;font-weight:600;color:var(--primary-title-color);}
|
||||
|
||||
.popup_content{padding:30px 20px;}
|
||||
|
||||
.popup .search_area.box{padding:0 10px;font-size:14px;}
|
||||
.popup .search_item{padding:4px 0;}
|
||||
|
||||
.popup .input{height:30px;}
|
||||
.popup select,.popup .select{height:30px;border:1px solid var(--default-line-color);border-radius:5px;padding:0 32px 0 12px;background:#fff url(/publish/adm/images/component/icon_arrow_down.png) no-repeat calc(100% - 4px) center;}
|
||||
|
||||
.popup .radio_wrap,.popup .checkbox_wrap{gap:8px;}
|
||||
.popup .radio_item,.popup .checkbox_item{font-size:14px;}
|
||||
|
||||
.popup_title_wrap+.table{margin:12px 0 40px 0;}
|
||||
.popup.table_type_cols thead>tr>th,.popup.table_type_cols tbody>tr>td{height:40px;font-size:15px;}
|
||||
.popup.table_type_rows tbody>tr>th, .popup.table_type_rows tbody>tr>td{height:40px;font-size:15px;padding:8px 12px;}
|
||||
|
||||
.popup .page a{width:32px;height:32px;}
|
||||
123
src/main/webapp/publish/adm/css/style.css
Normal file
@ -0,0 +1,123 @@
|
||||
@charset "utf-8";
|
||||
@import url(/publish/adm/css/style.css); /* 간격 css */
|
||||
@import url(/publish/adm/css/icon.css);
|
||||
|
||||
/* 폰트 */
|
||||
.fwLg{font-weight: 300 !important}
|
||||
.fwRg{font-weight: 400 !important}
|
||||
.fwMd{font-weight: 500 !important}
|
||||
.fwBold{font-weight: 700 !important}
|
||||
|
||||
.sub_font{font-family:var(--secondary-title-font);}
|
||||
|
||||
.show{display:block !important;}
|
||||
.hide{display:none !important;}
|
||||
|
||||
.text_left{text-align:left;}
|
||||
.text_right{text-align:right;}
|
||||
.text_center{text-align:center;}
|
||||
|
||||
.input{height:34px;background:#fff;border:1px solid var(--default-line-color);border-radius:5px;padding:0 12px;}
|
||||
input[type="checkbox"].checkbox{width:20px;height:20px;border:1px solid var(--default-line-color);}
|
||||
textarea, .testarea{background:#fff;border:1px solid var(--default-line-color);border-radius:5px;padding:0 12px;}
|
||||
select, .select{height:34px;border:1px solid var(--default-line-color);border-radius:5px;padding:0 32px 0 12px;background:#fff url(/publish/adm/images/component/icon_arrow_down.png) no-repeat calc(100% - 4px) center;}
|
||||
|
||||
.email_wrap{display:flex;gap:8px;align-items:center;}
|
||||
.email_wrap .input{width:160px;}
|
||||
.email_wrap .select{width:160px;}
|
||||
|
||||
.radio_wrap,.checkbox_wrap{display:flex;align-items:center;gap:16px;}
|
||||
.radio_item,.checkbox_item{display:flex;align-items:center;gap:4px;font-size:16px;}
|
||||
|
||||
.input_mix_wrap{display:flex;gap:8px;align-items:center;}
|
||||
|
||||
.address_wrap{display:flex;flex-direction:column;gap:8px;}
|
||||
.address_row{display:flex;gap:8px;}
|
||||
.input_post{width:calc(50% - 105px);}
|
||||
.adr_default{width:60%;}
|
||||
.adr_detail{width:40%;}
|
||||
|
||||
.input_desc_wrap{display:flex;width:100%;gap:12px;}
|
||||
.input_desc_wrap.column{flex-direction:column;gap:0;margin:8px 0 0 0;}
|
||||
.input_desc_wrap .input_desc{margin:0;}
|
||||
|
||||
.input_desc{font-size:14px;font-weight:400;color:#666;margin:0 0 0 8px;}
|
||||
.input_desc.red{color:var(--red-color);}
|
||||
.input_desc.blue{color:var(--primary-color);}
|
||||
|
||||
.calendar_wrap{display:flex;align-items:center;gap:8px;}
|
||||
.calendar{width:140px;background:#fff url(/publish/adm/images/component/icon_calendar.png) no-repeat calc(100% - 8px) center;}
|
||||
|
||||
.time_layer_wrap{position:relative;}
|
||||
.time_input{width:110px;background:#fff url(/publish/adm/images/component/icon_clock.png) no-repeat calc(100% - 8px) center;}
|
||||
.time_layer{position:absolute;width:230px;padding:20px;border-radius:16px;background:#fff;box-shadow:0 0 10px rgba(0,0,0,0.1);top:calc(100% + 4px);left:0;transform:scale(0.96) translateZ(0) translateY(-20px);opacity:0;transition: transform 300ms ease, opacity 300ms ease, visibility 300ms ease;}
|
||||
.time_layer.active{transform:scale(1.0001) translateZ(0) translateY(0);opacity:1;}
|
||||
.time_layer .title{display:block;font-size:16px;font-weight:bold;color:var(--primary-title-color);text-align:left;padding:0 0 8px 0;}
|
||||
.time_wrap{display:flex;gap:8px;align-items:center;}
|
||||
.time_select{width:73px;background-color:#edf0f5;border:0;}
|
||||
.time_layer button{width:100%;margin:12px 0 0 0;}
|
||||
|
||||
/* 검색영역 */
|
||||
.search_area{display:flex;align-items:flex-end;justify-content:space-between;}
|
||||
.search_area.box{padding:0 20px;margin:0 0 40px 0;border:1px solid #cdd5e6;border-radius:10px;background:#eff2f9;flex-direction:column;}
|
||||
|
||||
.search_item{display:flex;width:100%;padding:8px 0;align-items:center;border-bottom:1px solid #cdd5e6;}
|
||||
.search_item:last-child{border-bottom:0;}
|
||||
.search_title{position:relative;min-width:120px;padding:0 0 0 12px;}
|
||||
.search_title::after{position:absolute;content:"";width:4px;height:4px;background:var(--primary-color);border-radius:100%;left:0;top:9px;}
|
||||
.search_title+.form_wrap{width:calc(100% - 120px);}
|
||||
|
||||
.search_select{min-width:120px;}
|
||||
.search_input{min-width:300px;}
|
||||
|
||||
.search_left .total_number{font-size:14px;color:var(--body-text-color);}
|
||||
.search_left .total_number b{font-size:16px;font-weight:bold;color:var(--primary-color);}
|
||||
.search_right{display:flex;gap:10px;align-items:center;}
|
||||
.search_select{min-width:120px;height:34px;}
|
||||
.search_input{min-width:150px;}
|
||||
.search_right button{height:34px;padding:0 12px;font-size:16px;font-weight:400;}
|
||||
.search_right .btn_search{background:var(--primary-color);color:#fff;}
|
||||
.search_right .btn_reset{background:var(--gray-color);color:#fff;}
|
||||
|
||||
/* 상태 */
|
||||
.status{min-height:34px;font-size:16px;font-weight:500;border-radius:100px;padding:3px 12px;}
|
||||
|
||||
.status.line.blue{border:1px solid #135add;color:#135add;background:#fff;}
|
||||
.status.line.gray{border:1px solid #d1d6df;color:#858B97;background:#eff0f2;}
|
||||
.status.line.orange{border:1px solid #df5f36;color:#df5f36;background:#fff;}
|
||||
|
||||
.status.fill.blue{background:#E9EEF8;color:#2557B4;}
|
||||
.status.fill.gray{background:#E4E7EE;color:#616576;}
|
||||
.status.fill.orange{background:#FEF0EC;color:#F86A3C;}
|
||||
|
||||
.status.text{position:relative;padding:0;}
|
||||
.status.text::after{position:absolute;content:"";width:100%;height:5px;opacity:0.2;left:0;bottom:2px;}
|
||||
.status.text.blue{color:#135add;}
|
||||
.status.text.blue::after{background:#135add;}
|
||||
.status.text.gray{color:#858B97;}
|
||||
.status.text.gray::after{background:#858B97;}
|
||||
|
||||
.file_list{display:flex;flex-direction:column;gap:4px;}
|
||||
.file_list a{display:flex;gap:4px;align-items:center;}
|
||||
|
||||
.file_list.box{padding:15px 35px;margin:40px 0 0 0;background:#f5f7f9;border-radius:15px;gap:10px;}
|
||||
.file_list.box a{gap:8px;font-size:18px;color:var(--body-text-color);text-decoration:none;}
|
||||
|
||||
|
||||
/* 갤러리 리스트 */
|
||||
.gallery_list{display:flex;border-top:2px solid var(--primary-color);border-bottom:1px solid var(--lightgray-color);margin:12px 0 40px 0;padding:40px 0;gap:20px;flex-wrap:wrap;}
|
||||
.gallery_list>li{width:calc((100%/4) - 15px);}
|
||||
.gallery_list a{position:relative;width:100%;border:1px solid #E2E7EF;}
|
||||
.gallery_list .status{position:absolute;display:flex;min-height:30px;font-size:16px;letter-spacing:0.3px;padding:2px 8px;right:12px;top:12px;border-radius:8px;justify-content:center;align-items:center;}
|
||||
.gallery_list .primary{background:var(--primary-color);color:#fff;}
|
||||
.gallery_list .gray{background:var(--gray-color);color:#fff;}
|
||||
.gallery_list .images_area{display:flex;width:100%;height:180px;background:#f2f4f7;overflow:hidden;justify-content:center;align-items:center;}
|
||||
.gallery_list .images_area img{max-width:100%;max-height:100%;object-fit:contain;}
|
||||
.gallery_list .list_content{padding:20px;}
|
||||
.gallery_list .list_title{ text-overflow: ellipsis;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;font-size:18px;font-weight:600;color:var(--primary-title-color);}
|
||||
.gallery_list .list_info{display:flex;font-size:14px;font-weight:400;color:#636469;margin:20px 0 0 0;}
|
||||
.gallery_list .list_info li{position:relative;padding:0 10px;}
|
||||
.gallery_list .list_info li:first-child{padding:0 10px 0 0;}
|
||||
.gallery_list .list_info li::after{position:absolute;content:"";width:1px;height:10px;background:#636469;right:0;top:6px;}
|
||||
.gallery_list .list_info li:last-child::after{display:none;}
|
||||
|
||||
@ -12,5 +12,13 @@
|
||||
.tabs.fill .tab{width:100%;min-width:180px;height:60px;font-size:20px;font-weight:500;color:#8F96A6;}
|
||||
.tabs.fill .tab.active{border-bottom:3px solid var(--primary-color);font-weight:600;color:var(--primary-color);}
|
||||
|
||||
/* .tabs.line{border-bottom:2px solid var(--primary-color);border-top:1px solid #CED3DE;border-radius:10px 10px 0 0;overflow:hidden;} */
|
||||
.tabs.line{border:1px solid #ced3de;border-bottom:2px solid var(--primary-color);border-radius:10px 10px 0 0;}
|
||||
.tabs.line .tab{position:relative;width:100%;height:50px;font-size:18px;border-right:1px solid #ced3de;}
|
||||
.tabs.line .tab.active{background:#E9EEF8;color:var(--primary-color);font-weight:600;border-radius:10px 10px 0 0;}
|
||||
.tabs.line .tab.active::after{position:absolute;content:"";width:calc(100% + 2px);height:calc(100% + 2px);left:-1px;top:-1px;border:2px solid var(--primary-color);border-bottom:0;border-radius:10px 10px 0 0;}
|
||||
.tabs.line :last-child .tab{border-right:0;}
|
||||
|
||||
|
||||
.tab_content{display:none;}
|
||||
.tab_content.active{display:block;}
|
||||
@ -0,0 +1,43 @@
|
||||
@charset "utf-8";
|
||||
|
||||
.table{border-top:2px solid var(--primary-color);margin:0 0 40px 0;}
|
||||
.content_title.h4+.table{margin:0 0 20px 0;}
|
||||
.content_title.h5+.table{margin:12px 0 40px 0;}
|
||||
|
||||
.table table{table-layout:fixed;width:100%;}
|
||||
.table .mobile_show,.table .mobile_hide{display:none;}
|
||||
.table .required{color:var(--red-color);margin:0 4px 0 0;}
|
||||
|
||||
.table td.visible{overflow:visible !important;}
|
||||
|
||||
.table_type_cols{margin:12px 0 40px 0;}
|
||||
.table_type_cols tr{border-bottom:1px solid #DEE6F4;}
|
||||
.table_type_cols th,.table_type_cols td{padding:4px 8px;font-size:16px;text-align:center;box-sizing:border-box;}
|
||||
.table_type_cols thead>tr>th{height:50px;font-weight:500;color:#25272A;background:#eff2f9;}
|
||||
.table_type_cols tbody>tr>td{height:50px;font-weight:400;color:#444;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
|
||||
.table_type_cols .text_left a{width:100%;text-align:left;}
|
||||
|
||||
|
||||
.table_type_rows{margin:30px 0;}
|
||||
.table_type_rows tr{border-bottom:1px solid #e2e7ef;}
|
||||
.table_type_rows tbody>tr>th,.table_type_rows tbody>tr>td{height:50px;padding:12px 20px;font-size:16px;color:#25272A;text-align:left;box-sizing:border-box;}
|
||||
.table_type_rows tbody>tr>th{font-weight:500;background:#F2F3F5;}
|
||||
.table_type_rows tbody>tr>td{font-weight:400;}
|
||||
|
||||
.file_top{display:flex;justify-content:space-between;align-items:flex-end;}
|
||||
.file_table{height:150px;margin:12px 0 0 0;border:1px solid var(--lightgray-color);border-radius:8px;}
|
||||
.file_table table{table-layout:fixed;width:100%;border-collapse: collapse;}
|
||||
.file_table tbody{width:100%;max-height:150px;overflow-y:auto;}
|
||||
.file_table th{height:36px;font-size:14px;color:#222;padding:0 8px;text-align:center;}
|
||||
.file_table tbody>tr>td{height:36px;font-size:14px;color:#444;padding:0 8px;text-align:center;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
|
||||
.file_table .btn_delete{width:28px;}
|
||||
.file_table .btn_delete i{width:100%;height:100%;}
|
||||
|
||||
.file_table.before_file_table table{height:100%;}
|
||||
.file_table.before_file_table thead{opacity:0.3;}
|
||||
.file_table.before_file_table tbody{background:#EFF0F4;}
|
||||
.file_table.before_file_table tbody tr{height:100%;border:0;text-align:center;}
|
||||
.file_table.before_file_table p{font-size:14px;}
|
||||
.file_table.before_file_table b{color:var(--primary-color);}
|
||||
|
||||
|
||||
@ -1,110 +1,86 @@
|
||||
body {
|
||||
font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
|
||||
background: #f5f6fa;
|
||||
color: #333;
|
||||
}
|
||||
/* ===============================
|
||||
IMPORTS
|
||||
=============================== */
|
||||
@import url(../../../css/reset.css);
|
||||
@import url(../css/common.css);
|
||||
@import url(../css/button.css);
|
||||
@import url(../css/style.css);
|
||||
|
||||
.guide_wrap {
|
||||
max-width: 1200px;
|
||||
margin: 60px auto;
|
||||
background: #fff;
|
||||
border-radius: 16px;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.08);
|
||||
padding: 40px 50px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 26px;
|
||||
margin-bottom: 25px;
|
||||
font-weight: 700;
|
||||
color: #222;
|
||||
}
|
||||
body{font-family:'Pretendard','Noto Sans KR',sans-serif;background:#f5f6fa;color:#333;}
|
||||
|
||||
.guide_info {
|
||||
background: #fafafa;
|
||||
border: 1px solid #eee;
|
||||
padding: 15px 20px;
|
||||
border-radius: 10px;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
/* ===============================
|
||||
GUIDE WRAP & SECTIONS
|
||||
=============================== */
|
||||
.guide_wrap{max-width:1200px;margin:60px auto;background:#fff;border-radius:16px;box-shadow:0 4px 10px rgba(0,0,0,0.08);padding:40px 50px;}
|
||||
.guide_wrap h1{font-size:26px;margin-bottom:25px;font-weight:700;color:#222;}
|
||||
|
||||
.guide_info ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 15px 30px;
|
||||
}
|
||||
.guide_section{margin:60px 0;}
|
||||
.guide_section h2{font-size:22px;font-weight:600;}
|
||||
.guide_section h3{font-size:20px;font-weight:500;color:#0072ff;margin:40px 0 12px 0;}
|
||||
|
||||
/* ✅ 필터 버튼 */
|
||||
.filter_wrap {
|
||||
margin-bottom: 15px;
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
/* ===============================
|
||||
GUIDE INFO
|
||||
=============================== */
|
||||
.guide_info{background:#fafafa;border:1px solid #eee;padding:15px 20px;border-radius:10px;margin-bottom:25px;}
|
||||
.guide_info ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:15px 30px;}
|
||||
|
||||
.filter_btn {
|
||||
padding: 8px 16px;
|
||||
border: 1px solid #ccc;
|
||||
background: #fff;
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
transition: 0.2s;
|
||||
}
|
||||
.filter_btn:hover {
|
||||
background: #f0f0f0;
|
||||
}
|
||||
.filter_btn.active {
|
||||
background: #0072ff;
|
||||
border-color: #0072ff;
|
||||
color: #fff;
|
||||
}
|
||||
/* ===============================
|
||||
FILTER BUTTONS
|
||||
=============================== */
|
||||
.filter_wrap{margin-bottom:15px;display:flex;gap:8px;}
|
||||
.filter_btn{padding:8px 16px;border:1px solid #ccc;background:#fff;border-radius:6px;font-size:14px;cursor:pointer;transition:.2s;}
|
||||
.filter_btn:hover{background:#f0f0f0;}
|
||||
.filter_btn.active{background:#0072ff;border-color:#0072ff;color:#fff;}
|
||||
|
||||
.tb_guide {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
font-size: 14px;
|
||||
}
|
||||
/* ===============================
|
||||
TABLE GUIDE
|
||||
=============================== */
|
||||
.tb_guide{width:100%;border-collapse:collapse;font-size:14px;}
|
||||
.tb_guide th,.tb_guide td{border:1px solid #ddd;padding:10px 12px;text-align:center;}
|
||||
.tb_guide th{background:#f9f9f9;font-weight:600;}
|
||||
.tb_guide a{color:#0072ff;text-decoration:none;}
|
||||
.tb_guide a:hover{text-decoration:underline;}
|
||||
|
||||
.tb_guide th,
|
||||
.tb_guide td {
|
||||
border: 1px solid #ddd;
|
||||
padding: 10px 12px;
|
||||
text-align: center;
|
||||
}
|
||||
/* STATUS COLORS */
|
||||
.done{color:#198754;font-weight:600;}
|
||||
.ing{color:#e67e22;font-weight:600;}
|
||||
.wait{color:#aaa;font-weight:600;}
|
||||
|
||||
.tb_guide th {
|
||||
background: #f9f9f9;
|
||||
font-weight: 600;
|
||||
}
|
||||
/* ===============================
|
||||
BUTTON GUIDE
|
||||
=============================== */
|
||||
.btn_wrap{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:25px;justify-content:flex-start;}
|
||||
.btn{border-radius:6px;font-size:14px;cursor:pointer;font-weight:500;border:none;transition:.2s;}
|
||||
.btn_default{background:#fff;border:1px solid #ccc;color:#333;}.btn_default:hover{background:#f8f8f8;}
|
||||
.btn_primary{background:#0072ff;color:#fff;}.btn_primary:hover{background:#005edc;}
|
||||
.btn_danger{background:#e74c3c;color:#fff;}.btn_danger:hover{background:#c0392b;}
|
||||
.btn_warning{background:#f39c12;color:#fff;}.btn_warning:hover{background:#e67e22;}
|
||||
.btn_sub{background:#6c757d;color:#fff;}.btn_sub:hover{background:#5a6268;}
|
||||
.btn_sm{padding:5px 10px;font-size:13px;}.btn_md{padding:8px 16px;font-size:14px;}.btn_lg{padding:12px 24px;font-size:16px;}
|
||||
|
||||
.tb_guide a {
|
||||
color: #0072ff;
|
||||
text-decoration: none;
|
||||
}
|
||||
/* ===============================
|
||||
FORM ELEMENTS
|
||||
=============================== */
|
||||
.form_wrap{display:flex;flex-direction:column;gap:10px;margin-bottom:25px;}
|
||||
input[type="text"],input[type="email"],input[type="password"],textarea,select{border:1px solid #ccc;border-radius:6px;padding:8px 12px;font-size:14px;width:100%;transition:.2s;}
|
||||
input:focus,textarea:focus,select:focus{border-color:#0072ff;box-shadow:0 0 0 2px rgba(0,114,255,0.1);outline:none;}
|
||||
textarea{min-height:100px;resize:vertical;}
|
||||
|
||||
.tb_guide a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.form_wrap.email_wrap{gap:8px;justify-content:flex-start;flex-direction:row;}
|
||||
.form_wrap.radio_wrap, .form_wrap.checkbox_wrap{flex-direction:row;}
|
||||
.form_wrap .input_post{width:calc(48% - 105px);}
|
||||
|
||||
.done {
|
||||
color: #198754;
|
||||
font-weight: 600;
|
||||
}
|
||||
.ing {
|
||||
color: #e67e22;
|
||||
font-weight: 600;
|
||||
}
|
||||
.wait {
|
||||
color: #aaa;
|
||||
font-weight: 600;
|
||||
}
|
||||
/* ===============================
|
||||
COLOR GUIDE
|
||||
=============================== */
|
||||
.color_guide{display:flex;flex-wrap:wrap;gap:12px;}
|
||||
.color_box{width:120px;border-radius:6px;overflow:hidden;text-align:center;font-size:12px;border:1px solid #ddd;}
|
||||
.color_box .sample{height:50px;}.color_box .code{padding:6px;background:#fafafa;}
|
||||
.status_wrap{margin:60px 0 0 0;}
|
||||
.status_wrap span{margin:0 16px 0 0;}
|
||||
|
||||
/* 반응형 */
|
||||
@media (max-width: 768px) {
|
||||
.guide_wrap { padding: 20px; }
|
||||
.guide_info ul { flex-direction: column; }
|
||||
.tb_guide th, .tb_guide td { font-size: 12px; padding: 8px; }
|
||||
}
|
||||
/* ===============================
|
||||
RESPONSIVE
|
||||
=============================== */
|
||||
@media (max-width:768px){.guide_wrap{padding:20px;}.guide_info ul{flex-direction:column;}.tb_guide th,.tb_guide td{font-size:12px;padding:8px;}}
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>퍼블리싱 가이드 | 베이스 프로젝트 제작</title>
|
||||
@ -17,11 +18,11 @@
|
||||
<li><strong>프로젝트명 :</strong> 베이스 프로젝트 제작</li>
|
||||
<li><strong>담당자 :</strong> 정수빈</li>
|
||||
<li><strong>작성일 :</strong> 2025-11-07</li>
|
||||
<li><strong>파일경로 :</strong> /publish_side/</li>
|
||||
<li><strong>파일경로 :</strong> /publish/</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="filter_wrap">
|
||||
<div class="filter_wrap">
|
||||
<button class="filter_btn active" data-filter="all">전체보기</button>
|
||||
<button class="filter_btn" data-filter="done">완료</button>
|
||||
<button class="filter_btn" data-filter="ing">작업중</button>
|
||||
@ -42,17 +43,27 @@
|
||||
</thead>
|
||||
<tbody>
|
||||
|
||||
<tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td>공통</td>
|
||||
<td>-</td>
|
||||
<td><a href="../layout/_header.html" target="_blank" title="새창 열림">헤더</a></td>
|
||||
<td>/layout/_header.html</td>
|
||||
<td><a href="../layout/_leftmenu.html" target="_blank" title="새창 열림">메뉴</a></td>
|
||||
<td>/layout/_leftmenu.html</td>
|
||||
<td class="ing">작업중</td>
|
||||
<td>-</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td>공통</td>
|
||||
<td>-</td>
|
||||
<td><a href="../layout/_userinfo.html" target="_blank" title="새창 열림">상단 사용자 정보</a></td>
|
||||
<td>/layout/_sidemenu.html</td>
|
||||
<td class="done">완료</td>
|
||||
<td>-</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td></td>
|
||||
<td>공통</td>
|
||||
<td>-</td>
|
||||
@ -62,17 +73,7 @@
|
||||
<td>-</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td></td>
|
||||
<td>공통</td>
|
||||
<td>-</td>
|
||||
<td><a href="../layout/_sidemenu.html" target="_blank" title="새창 열림">사이드메뉴</a></td>
|
||||
<td>/layout/_sidemenu.html</td>
|
||||
<td class="done">완료</td>
|
||||
<td>-</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td>공통</td>
|
||||
<td>-</td>
|
||||
@ -92,7 +93,7 @@
|
||||
<td>-</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td>리스트</td>
|
||||
<td>-</td>
|
||||
@ -102,7 +103,7 @@
|
||||
<td>-</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td>리스트 상세</td>
|
||||
<td>-</td>
|
||||
@ -112,7 +113,7 @@
|
||||
<td>-</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td>리스트 등록</td>
|
||||
<td>-</td>
|
||||
@ -122,170 +123,150 @@
|
||||
<td>-</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td></td>
|
||||
<td>게시판 상세</td>
|
||||
<td>-</td>
|
||||
<td><a href="../menu1/board_view.html" target="_blank" title="새창 열림">게시판 상세</a></td>
|
||||
<td>/menu1/board_view.html</td>
|
||||
<td class="done">완료</td>
|
||||
<td>-</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td></td>
|
||||
<td>갤러리형 게시판</td>
|
||||
<td>-</td>
|
||||
<td><a href="../menu1/list_gallery.html" target="_blank" title="새창 열림">갤러리형 게시판</a></td>
|
||||
<td>/menu1/list_gallery.html</td>
|
||||
<td class="done">완료</td>
|
||||
<td>-</td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td></td>
|
||||
<td>자주하는 질문</td>
|
||||
<td>-</td>
|
||||
<td><a href="../menu1/faq.html" target="_blank" title="새창 열림">자주하는 질문</a></td>
|
||||
<td>/menu1/faq.html</td>
|
||||
<td class="done">완료</td>
|
||||
<td>-</td>
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<!-- ▼ 클래스 / 컴포넌트 가이드 섹션 -->
|
||||
<section class="guide_source">
|
||||
<h2>소스 / 클래스 네이밍 가이드</h2>
|
||||
<!-- BUTTON -->
|
||||
<section class="guide_section">
|
||||
<h2>Button (버튼)</h2>
|
||||
|
||||
<h3>1. 버튼(Button)</h3>
|
||||
<table class="tb_guide_sub">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>클래스명</th>
|
||||
<th>설명</th>
|
||||
<th>예시</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>.btnType01</code></td>
|
||||
<td>기본 버튼 (회색)</td>
|
||||
<td><button class="btnType01">기본</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>.btnType02</code></td>
|
||||
<td>보조 버튼 (하늘색)</td>
|
||||
<td><button class="btnType02">보조</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>.btnType05</code></td>
|
||||
<td>강조 버튼 (파란색, 확인/등록 등 주요 액션)</td>
|
||||
<td><button class="btnType05">확인</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>.btnType06</code></td>
|
||||
<td>소형 버튼 (ex. 인증하기 등)</td>
|
||||
<td><button class="btnType06">인증하기</button></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h3>Filled Button</h3>
|
||||
<div class="btn_wrap">
|
||||
<button class="btn fill primary small">Primary</button>
|
||||
<button class="btn fill secondary small">Secondary</button>
|
||||
<button class="btn fill red small">Red</button>
|
||||
<button class="btn fill green small">Green</button>
|
||||
<button class="btn fill gray small">Gray</button>
|
||||
</div>
|
||||
|
||||
<h3>2. 입력(Form)</h3>
|
||||
<table class="tb_guide_sub">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>클래스명</th>
|
||||
<th>설명</th>
|
||||
<th>예시</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>.input_text</code></td>
|
||||
<td>기본 텍스트 입력 필드</td>
|
||||
<td><input type="text" class="input_text" placeholder="입력하세요" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>.input_error</code></td>
|
||||
<td>에러 상태 표시</td>
|
||||
<td><input type="text" class="input_text input_error" value="에러 상태" /></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>.select_box</code></td>
|
||||
<td>셀렉트 박스 기본 스타일</td>
|
||||
<td>
|
||||
<select class="select_box">
|
||||
<option>선택</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h3>Line Button</h3>
|
||||
<div class="btn_wrap">
|
||||
<button class="btn line primary small">Primary</button>
|
||||
<button class="btn line secondary small">Secondary</button>
|
||||
<button class="btn line red small">Red</button>
|
||||
<button class="btn line gray small">Gray</button>
|
||||
</div>
|
||||
|
||||
<h3>3. 테이블(Table)</h3>
|
||||
<table class="tb_guide_sub">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>클래스명</th>
|
||||
<th>설명</th>
|
||||
<th>예시</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>.tb_type01</code></td>
|
||||
<td>기본 리스트형 테이블</td>
|
||||
<td><span class="badge gray">공지사항 목록</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>.tb_input</code></td>
|
||||
<td>입력형 테이블 (폼 요소 포함)</td>
|
||||
<td><span class="badge blue">신청서 / 정보입력 팝업</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>.table_type_rows</code></td>
|
||||
<td>행 기반 데이터 테이블</td>
|
||||
<td><span class="badge gray">데이터 리스트형</span></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h3>4. 팝업(Popup)</h3>
|
||||
<table class="tb_guide_sub">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>클래스명</th>
|
||||
<th>설명</th>
|
||||
<th>예시</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><code>.popup_wrap</code></td>
|
||||
<td>팝업 전체 영역</td>
|
||||
<td><span class="badge gray">position: fixed 사용</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>.popup_tit</code></td>
|
||||
<td>팝업 타이틀 영역</td>
|
||||
<td><span class="badge gray">제목 + 닫기버튼 포함</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>.popup_cont</code></td>
|
||||
<td>팝업 본문 영역</td>
|
||||
<td><span class="badge blue">내용 스크롤 가능</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><code>.tooltip-close</code></td>
|
||||
<td>팝업 닫기 버튼 클래스</td>
|
||||
<td><button class="tooltip-close">닫기</button></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<h3>Size Variation</h3>
|
||||
<div class="btn_wrap">
|
||||
<button class="btn fill gray xssmall">xssmall</button>
|
||||
<button class="btn fill gray ssmall">ssmall</button>
|
||||
<button class="btn fill gray small">small</button>
|
||||
<button class="btn fill gray medium">medium</button>
|
||||
<button class="btn fill gray large">large</button>
|
||||
<button class="btn fill gray xlarge">xlarge</button>
|
||||
</div>
|
||||
</section>
|
||||
<!-- ▲ 클래스 가이드 끝 -->
|
||||
|
||||
<!-- INPUT -->
|
||||
<section class="guide_section">
|
||||
<h2>Input / Textarea / Select</h2>
|
||||
|
||||
<h3>Input</h3>
|
||||
<div class="form_wrap">
|
||||
<input type="text" class="input w50per" placeholder="제목을 입력해주세요.">
|
||||
<span class="input_desc">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
|
||||
<h3>Textarea</h3>
|
||||
<div class="form_wrap">
|
||||
<textarea name="" id="" class="textarea w100per" rows="5"></textarea>
|
||||
<div class="input_desc_wrap column">
|
||||
<span class="input_desc red">* 필수입력 항목입니다.</span>
|
||||
<span class="input_desc blue">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3>Email</h3>
|
||||
<div class="form_wrap email_wrap">
|
||||
<input type="text" class="input email emain_id"><span class="text_split">@</span><input type="text" class="input email email_domain">
|
||||
<select name="" id="" class="select">
|
||||
<option value="">gmail.com</option>
|
||||
<option value="">naver.com</option>
|
||||
<option value="">kakao.com</option>
|
||||
<option value="">직접입력</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<h3>Address</h3>
|
||||
<div class="form_wrap address_wrap">
|
||||
<div class="address_row">
|
||||
<input type="text" class="input input_post readonly" readonly><button type="button" class="btn medium line primary">우편번호 찾기</button>
|
||||
</div>
|
||||
<div class="address_row">
|
||||
<input type="text" class="input adr_default readonly" readonly>
|
||||
<input type="text" class="input adr_detail">
|
||||
</div>
|
||||
<span class="input_desc red">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- RADIO / CHECKBOX -->
|
||||
<section class="guide_section">
|
||||
<h2>Checkbox / Radio</h2>
|
||||
|
||||
<h3>Checkbox</h3>
|
||||
<div class="form_wrap radio_wrap">
|
||||
<label for="man" class="radio_item">
|
||||
<input type="radio" name="jender" id="man">
|
||||
<span>남성</span>
|
||||
</label>
|
||||
<label for="woman" class="radio_item">
|
||||
<input type="radio" name="jender" id="woman">
|
||||
<span>여성</span>
|
||||
</label>
|
||||
<span class="input_desc red">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
|
||||
<h3>Radio</h3>
|
||||
<div class="form_wrap checkbox_wrap">
|
||||
<label for="check_all" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_all">
|
||||
<span>전체</span>
|
||||
</label>
|
||||
<label for="check_1" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_1">
|
||||
<span>항목1</span>
|
||||
</label>
|
||||
<label for="check_2" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_2">
|
||||
<span>항목2</span>
|
||||
</label>
|
||||
<label for="check_3" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_3">
|
||||
<span>항목3</span>
|
||||
</label>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- STATUS -->
|
||||
<section class="guide_section">
|
||||
<h2>Status</h2>
|
||||
<div class="status_wrap">
|
||||
<span class="status line blue">진행중</span>
|
||||
<span class="status line gray">완료</span>
|
||||
<span class="status text blue">접수</span>
|
||||
<span class="status text gray">마감</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- PAGINATION -->
|
||||
<section class="guide_section">
|
||||
<h2>Pagination (페이지)</h2>
|
||||
<div class="page">
|
||||
<a href="#" class="btn_page btn_first"><i></i></a>
|
||||
<a href="#" class="btn_page btn_prev"><i></i></a>
|
||||
<a href="#" class="active">1</a>
|
||||
<a href="#">2</a>
|
||||
<a href="#">3</a>
|
||||
<a href="#" class="btn_page btn_next"><i></i></a>
|
||||
<a href="#" class="btn_page btn_last"><i></i></a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
</html>
|
||||
|
After Width: | Height: | Size: 317 B |
|
After Width: | Height: | Size: 321 B |
|
After Width: | Height: | Size: 348 B |
|
After Width: | Height: | Size: 353 B |
BIN
src/main/webapp/publish/adm/images/component/icon_file.png
Normal file
|
After Width: | Height: | Size: 618 B |
BIN
src/main/webapp/publish/adm/images/component/icon_file_blue.png
Normal file
|
After Width: | Height: | Size: 611 B |
BIN
src/main/webapp/publish/adm/images/component/icon_file_table.png
Normal file
|
After Width: | Height: | Size: 920 B |
@ -1,10 +1,14 @@
|
||||
.wrap{width:100%;height:100%;position:relative;display:flex;font-family:var(--primary-title-font);align-items:stretch;min-width:1240px;}
|
||||
.container{width:calc(100% - 280px);}
|
||||
.content_wrap{position:relative;padding:0 48px;}
|
||||
.content_wrap{position:relative;padding:0 48px;margin:0 0 60px 0;}
|
||||
|
||||
.content_title{display:flex;align-items:center;justify-content:space-between;}
|
||||
.content_title h3{position:relative;padding:0 0 0 20px;font-size:26px;font-weight:bold;color:var(--primary-title-color);}
|
||||
.content_title h3{position:relative;padding:0 0 0 20px;margin:0 0 40px 0;;font-size:26px;font-weight:bold;color:var(--primary-title-color);}
|
||||
.content_title h3::before{position:absolute;content:"";width:6px;height:27px;background:var(--primary-color);left:0;top:8px;}
|
||||
.content_title h4{position:relative;padding:0 0 0 20px;margin:0 0 12px 0;;font-size:20px;font-weight:bold;color:var(--primary-title-color);}
|
||||
.content_title h4::before{position:absolute;content:"";width:10px;height:10px;border:3px solid var(--primary-color);border-radius:100%;left:0;top:10px;}
|
||||
.content_title h5{position:relative;padding:0;margin:0;font-size:18px;font-weight:bold;color:var(--primary-color);}
|
||||
|
||||
.breadcrumb{display:flex;font-size:14px;color:#636469;gap:8px;align-items:center;}
|
||||
.breadcrumb a{position:relative;display:flex;height:24px;padding:0 8px;align-items:center;}
|
||||
.breadcrumb a::after{position:absolute;width:24px;height:24px;content:"";background:url(../images/component/icon_arrow_right_gray_24.png) no-repeat right center;right:-16px;top:1px;}
|
||||
@ -18,6 +22,7 @@
|
||||
.menu_wrap .logo img{margin-left: -15px;}
|
||||
.depth01{position: relative; border-bottom: 1px solid #688DD0;}
|
||||
.menu_title{width: 100%; height: 50px; padding: 0 20px; text-align: left; font-size: 18px; font-weight: 500; color: #fff; background-image: url(../images/common/icon_leftmenu_open.png); background-repeat: no-repeat; background-position: calc(100% - 20px) center;}
|
||||
.menu_title:not(:has(+ .depth02 li)) {background-image: none !important;padding-right: 0 !important;}
|
||||
.depth01.on .menu_title{background:#fff; color: #2557b4; font-weight:600; background-image: url(../images/common/icon_leftmenu_on.png); background-repeat: no-repeat; background-position: calc(100% - 20px) center;}
|
||||
.depth02{height: 100%; padding: 8px 0; background-color: #16459A;}
|
||||
.depth02 li a{display: flex; align-items: center; width: 100%; height: 40px; padding: 0 5px 0 32px; font-size: 16px; font-weight: 300; color: #8BA2CD; box-sizing: border-box; position: relative;}
|
||||
|
||||
@ -1,22 +1,54 @@
|
||||
$(function () {
|
||||
$(".depth02").slideUp(0); // 메뉴 다 닫힘.
|
||||
$(".depth02.on").slideDown(0); //
|
||||
|
||||
/* 메뉴 클릭 시 하위메뉴 열림 */
|
||||
$(".menu_title").click(function () {
|
||||
var dep01 = $(this).parent(".depth01");
|
||||
var dep02 = $(this).next(".depth02");
|
||||
if (dep01.is(".on") == true) {
|
||||
dep02.slideUp(500);
|
||||
dep01.removeClass("on");
|
||||
// depth02 없는 메뉴에 no-depth 추가
|
||||
$(".depth01").each(function () {
|
||||
var $submenu = $(this).find(".depth02");
|
||||
if ($submenu.length == 0 || $submenu.find("li").length == 0) {
|
||||
$(this).addClass("no-depth");
|
||||
}
|
||||
});
|
||||
|
||||
$(".depth02").slideUp(0);
|
||||
$(".depth01.on").each(function () {
|
||||
var $submenu = $(this).find(".depth02");
|
||||
if ($submenu.find("li").length > 0) {
|
||||
$submenu.slideDown(0);
|
||||
$(this).find(".menu_title").attr("title", "하위메뉴 닫기");
|
||||
}
|
||||
});
|
||||
|
||||
$(".menu_title").on("click", function () {
|
||||
|
||||
var $parent = $(this).closest(".depth01");
|
||||
var $submenu = $parent.find(".depth02");
|
||||
var hasDepth02 = $submenu.find("li").length > 0;
|
||||
var url = "/cmm/main/mainPage.do";
|
||||
var titleText = $(this).text().trim().toLowerCase();
|
||||
|
||||
// dashboard는 무조건 바로 이동
|
||||
if (titleText === "dashboard") {
|
||||
if (url) location.href = url;
|
||||
return;
|
||||
}
|
||||
|
||||
// depth02 없는 메뉴는 바로 이동
|
||||
if (!hasDepth02) {
|
||||
// if (url) location.href = url;
|
||||
return;
|
||||
}
|
||||
|
||||
// depth02 있는 경우 슬라이드
|
||||
if ($parent.hasClass("on")) {
|
||||
$submenu.slideUp(300);
|
||||
$parent.removeClass("on");
|
||||
$(this).attr("title", "하위메뉴 열기");
|
||||
} else {
|
||||
dep02.slideDown(500);
|
||||
dep01.siblings(".depth01").removeClass("on");
|
||||
dep01.addClass("on");
|
||||
$(this).parent(".depth01").siblings().find(".depth02").slideUp(500);
|
||||
$(".depth01").removeClass("on").find(".depth02").slideUp(300);
|
||||
$(".menu_title").attr("title", "하위메뉴 열기");
|
||||
$parent.addClass("on");
|
||||
$submenu.slideDown(300);
|
||||
$(this).attr("title", "하위메뉴 닫기");
|
||||
}
|
||||
});
|
||||
/* //메뉴 클릭 시 하위메뉴 열림 */
|
||||
})
|
||||
|
||||
});
|
||||
|
||||
@ -12,14 +12,22 @@
|
||||
<link rel="stylesheet" href="../../../css/font.css">
|
||||
<link rel="stylesheet" href="../layout/layout.css">
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<link rel="stylesheet" href="../css/button.css">
|
||||
<link rel="stylesheet" href="../css/tab.css">
|
||||
<link rel="stylesheet" href="../css/table.css">
|
||||
<link rel="stylesheet" href="../css/calendar.css">
|
||||
<link rel="stylesheet" href="../css/popup.css">
|
||||
|
||||
<!-- script -->
|
||||
<script src="../../../js/jquery-3.5.0.js"></script>
|
||||
<script src="../layout/layout.js"></script>
|
||||
<script src="../script/common.js"></script>
|
||||
<script src="../layout/layout.js"></script>
|
||||
|
||||
|
||||
<!-- 캘린더 -->
|
||||
<script type="module" src="../../../js/plugin/datapicker/duet.esm.js"></script>
|
||||
<script nomodule src="../../../js/plugin/datapicker/duet.js"></script>
|
||||
<link rel="stylesheet" href="../../../js/plugin/datapicker/default.css">
|
||||
|
||||
</head>
|
||||
|
||||
@ -46,19 +54,190 @@
|
||||
<li class="search_item">
|
||||
<strong class="search_title">구분</strong>
|
||||
<div class="form_wrap">
|
||||
<select name="" id="" class="select">
|
||||
<select name="" id="" class="select search_select">
|
||||
<option value="">선택</option>
|
||||
</select>
|
||||
<input type="text" class="input">
|
||||
<button type="button" class="btn fill primary">검색</button>
|
||||
<button type="button" class="btn fill gray">초기화</button>
|
||||
<input type="text" class="input w40per">
|
||||
<button type="button" class="btn fill medium primary">검색</button>
|
||||
<button type="button" class="btn fill medium gray">초기화</button>
|
||||
</div>
|
||||
</li>
|
||||
<li class="search_item">
|
||||
<strong class="search_title">구분</strong>
|
||||
<div class="form_wrap">
|
||||
<input type="text" class="input w40per">
|
||||
</div>
|
||||
</li>
|
||||
<li class="search_item">
|
||||
<strong class="search_title">구분</strong>
|
||||
<div class="search_type calendar_type calendar_wrap">
|
||||
<span class="text_split">· 의뢰일</span>
|
||||
<duet-date-picker identifier="date" id="" name="" class="input calendar startDate" value=""></duet-date-picker>
|
||||
~
|
||||
<duet-date-picker identifier="date" id="" name="" class="input calendar endDate" value=""></duet-date-picker>
|
||||
</div>
|
||||
</li>
|
||||
<li class="search_item">
|
||||
<strong class="search_title">구분</strong>
|
||||
<div class="form_wrap radio_wrap">
|
||||
<select name="" id="" class="select search_select">
|
||||
<option value="">1</option>
|
||||
</select>
|
||||
<select name="" id="" class="select search_select">
|
||||
<option value="">1</option>
|
||||
</select>
|
||||
|
||||
<span class="text_split">· 성별</span>
|
||||
<label for="man" class="radio_item">
|
||||
<input type="radio" name="jender" id="man">
|
||||
<span>남성</span>
|
||||
</label>
|
||||
<label for="woman" class="radio_item">
|
||||
<input type="radio" name="jender" id="woman">
|
||||
<span>여성</span>
|
||||
</label>
|
||||
</div>
|
||||
</li>
|
||||
<li class="search_item">
|
||||
<strong class="search_title">구분</strong>
|
||||
<div class="form_wrap">
|
||||
|
||||
<span class="text_split">· 관할청</span>
|
||||
<select name="" id="" class="select search_select">
|
||||
<option value="">1</option>
|
||||
</select>
|
||||
<input type="text" class="input search_input">
|
||||
</div>
|
||||
</li>
|
||||
<li class="search_item">
|
||||
<strong class="search_title">엑셀다운로드</strong>
|
||||
<div class="form_wrap btn_wrap">
|
||||
<button type="button" class="btn medium mix line excel"><i class="icon excel download"></i>엑셀다운로드</button>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
|
||||
<div class="search_area">
|
||||
<div class="search_left">
|
||||
<p class="total_number">총 게시물 <b>111</b>건</p>
|
||||
</div>
|
||||
<div class="search_right">
|
||||
<select name="" id="" title="검색조건" class="search_select">
|
||||
<option value="">전체</option>
|
||||
<option value="">기간별</option>
|
||||
<option value="">제목</option>
|
||||
<option value="">내용</option>
|
||||
</select>
|
||||
<div class="search_type input_type hide">
|
||||
<input type="text" title="검색어 입력" class="input search_input">
|
||||
</div>
|
||||
<div class="search_type calendar_type calendar_wrap">
|
||||
<duet-date-picker identifier="date" id="" name="" class="input calendar startDate" value=""></duet-date-picker>
|
||||
~
|
||||
<duet-date-picker identifier="date" id="" name="" class="input calendar endDate" value=""></duet-date-picker>
|
||||
</div>
|
||||
<script src="../script/toggleCalendar.js"></script>
|
||||
<button type="button" class="btn btn_search">검색</button>
|
||||
<button type="button" class="btn btn_reset">초기화</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="table table_type_cols">
|
||||
<table>
|
||||
<!-- *caption은 스크립트 -->
|
||||
<colgroup>
|
||||
<col style="width:32px;">
|
||||
<col style="width:10%;">
|
||||
<col style="width:10%;">
|
||||
<col style="width:6%;">
|
||||
<col style="width:7%;">
|
||||
<col style="width:6%;">
|
||||
<col style="width:7%;">
|
||||
<col style="width:10%;">
|
||||
<col style="width:10%;">
|
||||
<col style="width:10%;">
|
||||
<col style="width:auto;">
|
||||
<col style="width:8%;">
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<label for="check_all" class="checkbox_item">
|
||||
<input type="checkbox" class="input checkbox" name="check" id="check_all">
|
||||
</label>
|
||||
</th>
|
||||
<th>의뢰일</th>
|
||||
<th>사건번호</th>
|
||||
<th>관할청</th>
|
||||
<th>생년월일</th>
|
||||
<th>성명</th>
|
||||
<th>성별</th>
|
||||
<th>교육의뢰번호</th>
|
||||
<th>의뢰상태</th>
|
||||
<th>교육상태</th>
|
||||
<th>주소</th>
|
||||
<th>검사명</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<label for="check_1" class="checkbox_item">
|
||||
<input type="checkbox" class="input checkbox" name="check" id="check_1">
|
||||
</label>
|
||||
</td>
|
||||
<td>2025-05-05</td>
|
||||
<td class="text_left"><a href="#">2025형제4915</a></td>
|
||||
<td>광주지검</td>
|
||||
<td>19990101</td>
|
||||
<td>홍길동</td>
|
||||
<td>남자</td>
|
||||
<td>A-광주-600-24-9</td>
|
||||
<td><strong class="status fill blue">교육대기</strong></td>
|
||||
<td><strong class="status line orange">교육대기</strong></td>
|
||||
<td>광주광역시 길동 홍길로14-11</td>
|
||||
<td>홍검사</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="btn_wrap">
|
||||
<div class="left">
|
||||
<button type="button" class="btn xlarge mix excel"><i class="icon excel upload"></i>엑셀 업로드</button>
|
||||
</div>
|
||||
<div class="center"></div>
|
||||
<div class="right">
|
||||
<button type="button" class="btn xlarge fill primary_light">의뢰취소복구</button>
|
||||
<button type="button" class="btn xlarge line red">의뢰취소</button>
|
||||
<button type="button" class="btn xlarge fill primary">등록</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul class="page">
|
||||
<li><a href="#" class="btn_page btn_first" title="첫 페이지로 이동"><i></i></a></li>
|
||||
<li><a href="#" class="btn_page btn_prev" title="이전 페이지로 이동"><i></i></a></li>
|
||||
<li><a href="#" title="1페이지로 이동" class="active">1</a></li>
|
||||
<li><a href="#" title="2페이지로 이동">2</a></li>
|
||||
<li><a href="#" title="3페이지로 이동">3</a></li>
|
||||
<li><a href="#" title="4페이지로 이동">4</a></li>
|
||||
<li><a href="#" title="5페이지로 이동">5</a></li>
|
||||
<li><a href="#" title="6페이지로 이동">6</a></li>
|
||||
<li><a href="#" title="7페이지로 이동">7</a></li>
|
||||
<li><a href="#" title="8페이지로 이동">8</a></li>
|
||||
<li><a href="#" title="9페이지로 이동">9</a></li>
|
||||
<li><a href="#" title="10페이지로 이동">10</a></li>
|
||||
<li><a href="#" class="btn_page btn_next" title="다음 페이지로 이동"><i></i></a></li>
|
||||
<li><a href="#" class="btn_page btn_last" title="마지막 페이지로 이동"><i></i></a></li>
|
||||
</ul>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
335
src/main/webapp/publish/adm/menu1/list_reg.html
Normal file
@ -0,0 +1,335 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>리스트</title>
|
||||
|
||||
<!-- css -->
|
||||
<link rel="stylesheet" href="../../../css/reset.css">
|
||||
<link rel="stylesheet" href="../../../css/font.css">
|
||||
<link rel="stylesheet" href="../layout/layout.css">
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<link rel="stylesheet" href="../css/button.css">
|
||||
<link rel="stylesheet" href="../css/tab.css">
|
||||
<link rel="stylesheet" href="../css/table.css">
|
||||
<link rel="stylesheet" href="../css/calendar.css">
|
||||
<link rel="stylesheet" href="../css/popup.css">
|
||||
|
||||
<!-- script -->
|
||||
<script src="../../../js/jquery-3.5.0.js"></script>
|
||||
<script src="../script/common.js"></script>
|
||||
<script src="../layout/layout.js"></script>
|
||||
<script src="../script/tab.js"></script>
|
||||
<script src="../script/content.js"></script>
|
||||
|
||||
<!-- 캘린더 -->
|
||||
<script type="module" src="../../../js/plugin/datapicker/duet.esm.js"></script>
|
||||
<script nomodule src="../../../js/plugin/datapicker/duet.js"></script>
|
||||
<link rel="stylesheet" href="../../../js/plugin/datapicker/default.css">
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="wrap">
|
||||
|
||||
<div data-include-path="../layout/_leftmenu.html"></div>
|
||||
|
||||
<!-- top_utill+cont -->
|
||||
<div class="container sub" id="container">
|
||||
|
||||
<div data-include-path="../layout/_userinfo.html"></div>
|
||||
|
||||
<div class="content_wrap">
|
||||
|
||||
|
||||
<div data-include-path="../layout/_sub_title.html"></div>
|
||||
|
||||
<ul class="tabs line tab03">
|
||||
<li><button type="button" class="tab active">탭1</button></li>
|
||||
<li><button type="button" class="tab">탭1</button></li>
|
||||
<li><button type="button" class="tab">탭1</button></li>
|
||||
</ul>
|
||||
|
||||
<div class="tab_content active">
|
||||
<div class="content_title h4">
|
||||
<h4>교육과정 등록</h4>
|
||||
</div>
|
||||
<div class="table table_type_rows">
|
||||
<table>
|
||||
<!-- *caption은 스크립트 -->
|
||||
<colgroup>
|
||||
<col style="width:200px;">
|
||||
<col style="width:auto;">
|
||||
</colgroup>
|
||||
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>작성자</th>
|
||||
<td><b>홍길동</b></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><span class="required">*</span>제목</th>
|
||||
<td>
|
||||
<div class="form_wrap">
|
||||
<input type="text" class="input w100per" placeholder="제목을 입력해주세요.">
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>제목</th>
|
||||
<td>
|
||||
<div class="form_wrap">
|
||||
<input type="text" class="input w50per" placeholder="제목을 입력해주세요.">
|
||||
<span class="input_desc">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>기간</th>
|
||||
<td>
|
||||
<div class="calendar_type calendar_wrap">
|
||||
<duet-date-picker identifier="date" id="" name="" class="input calendar startDate" value=""></duet-date-picker>
|
||||
~
|
||||
<duet-date-picker identifier="date" id="" name="" class="input calendar endDate" value=""></duet-date-picker>
|
||||
<div class="time_layer_wrap">
|
||||
<input type="text" class="input time_input" placeholder="00:00">
|
||||
<div class="time_layer">
|
||||
<strong class="title">시간선택</strong>
|
||||
<div class="time_wrap">
|
||||
<select name="" id="" class="select time_select hour">
|
||||
</select>
|
||||
<span class="text_split">시</span>
|
||||
<select name="" id="" class="select time_select minute">
|
||||
</select>
|
||||
<span class="text_split">분</span>
|
||||
</div>
|
||||
<button type="button" class="btn medium fill secondary">확인</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<script src="../script/toggleCalendar.js"></script>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>이메일</th>
|
||||
<td>
|
||||
<div class="form_wrap email_wrap">
|
||||
<input type="text" class="input email emain_id"><span class="text_split">@</span><input type="text" class="input email email_domain">
|
||||
<select name="" id="" class="select">
|
||||
<option value="">gmail.com</option>
|
||||
<option value="">naver.com</option>
|
||||
<option value="">kakao.com</option>
|
||||
<option value="">직접입력</option>
|
||||
</select>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>위치</th>
|
||||
<td>
|
||||
<div class="form_wrap input_mix_wrap">
|
||||
<span class="text_split">왼쪽</span><input type="text" class="input"><span class="text_split">px</span>
|
||||
<span class="text_split">  상단</span><input type="text" class="input"><span class="text_split">px</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>성별</th>
|
||||
<td>
|
||||
<div class="form_wrap radio_wrap">
|
||||
<label for="man" class="radio_item">
|
||||
<input type="radio" name="jender" id="man">
|
||||
<span>남성</span>
|
||||
</label>
|
||||
<label for="woman" class="radio_item">
|
||||
<input type="radio" name="jender" id="woman">
|
||||
<span>여성</span>
|
||||
</label>
|
||||
<span class="input_desc red">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>항목</th>
|
||||
<td>
|
||||
<div class="form_wrap checkbox_wrap">
|
||||
<label for="check_all" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_all">
|
||||
<span>전체</span>
|
||||
</label>
|
||||
<label for="check_1" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_1">
|
||||
<span>항목1</span>
|
||||
</label>
|
||||
<label for="check_2" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_2">
|
||||
<span>항목2</span>
|
||||
</label>
|
||||
<label for="check_3" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_3">
|
||||
<span>항목3</span>
|
||||
</label>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>주소</th>
|
||||
<td>
|
||||
<div class="form_wrap address_wrap">
|
||||
<div class="address_row">
|
||||
<input type="text" class="input input_post readonly" readonly><button type="button" class="btn medium line primary">우편번호 찾기</button>
|
||||
</div>
|
||||
<div class="address_row">
|
||||
<input type="text" class="input adr_default readonly" readonly>
|
||||
<input type="text" class="input adr_detail">
|
||||
</div>
|
||||
<span class="input_desc red">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>내용</th>
|
||||
<td>
|
||||
<div class="form_wrap">
|
||||
<textarea name="" id="" class="textarea w100per" rows="5"></textarea>
|
||||
<div class="input_desc_wrap column">
|
||||
<span class="input_desc red">* 필수입력 항목입니다.</span>
|
||||
<span class="input_desc blue">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>파일첨부</th>
|
||||
<td>
|
||||
<div class="file_upload_wrap">
|
||||
<button type="button" class="btn medium line primary">파일 첨부하기</button>
|
||||
<div class="file_table before_file_table">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style="width:auto;">
|
||||
<col style="width:13%;">
|
||||
<col style="width:13%;">
|
||||
<col style="width:80px;">
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>파일명</th>
|
||||
<th>종류</th>
|
||||
<th>크기</th>
|
||||
<th>삭제</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td colspan="4">
|
||||
<i class="icon file_bg"></i>
|
||||
<p>첨부하실 파일을 <b>마우스로 끌어서</b> 넣어주세요.</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>파일첨부</th>
|
||||
<td>
|
||||
<div class="file_upload_wrap">
|
||||
<div class="file_top">
|
||||
<button type="button" class="btn medium line primary">파일 첨부하기</button>
|
||||
<span class="input_desc red">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
<div class="file_table">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style="width:auto;">
|
||||
<col style="width:13%;">
|
||||
<col style="width:13%;">
|
||||
<col style="width:80px;">
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>파일명</th>
|
||||
<th>종류</th>
|
||||
<th>크기</th>
|
||||
<th>삭제</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>파일이름</td>
|
||||
<td>hwp</td>
|
||||
<td>1.4mb</td>
|
||||
<td><button type="button" class="btn line lightgray ssmall only_icon btn_delete"><i class="icon delete red"></i></button></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="input_desc_wrap column">
|
||||
<span class="input_desc">* 필수입력 항목입니다.</span>
|
||||
<span class="input_desc">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="btn_wrap">
|
||||
<div class="left">
|
||||
<button type="button" class="btn line xlarge red">삭제</button>
|
||||
</div>
|
||||
<div class="center"></div>
|
||||
<div class="right">
|
||||
<button class="btn fill xlarge primary">등록</button>
|
||||
<button class="btn fill xlarge gray">목록</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<ul class="page">
|
||||
<li><a href="#" class="btn_page btn_first" title="첫 페이지로 이동"><i></i></a></li>
|
||||
<li><a href="#" class="btn_page btn_prev" title="이전 페이지로 이동"><i></i></a></li>
|
||||
<li><a href="#" title="1페이지로 이동" class="active">1</a></li>
|
||||
<li><a href="#" title="2페이지로 이동">2</a></li>
|
||||
<li><a href="#" title="3페이지로 이동">3</a></li>
|
||||
<li><a href="#" title="4페이지로 이동">4</a></li>
|
||||
<li><a href="#" title="5페이지로 이동">5</a></li>
|
||||
<li><a href="#" title="6페이지로 이동">6</a></li>
|
||||
<li><a href="#" title="7페이지로 이동">7</a></li>
|
||||
<li><a href="#" title="8페이지로 이동">8</a></li>
|
||||
<li><a href="#" title="9페이지로 이동">9</a></li>
|
||||
<li><a href="#" title="10페이지로 이동">10</a></li>
|
||||
<li><a href="#" class="btn_page btn_next" title="다음 페이지로 이동"><i></i></a></li>
|
||||
<li><a href="#" class="btn_page btn_last" title="마지막 페이지로 이동"><i></i></a></li>
|
||||
</ul>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div data-include-path="../layout/_footer.html"></div>
|
||||
|
||||
</div>
|
||||
<!-- //top_utill+cont -->
|
||||
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
246
src/main/webapp/publish/adm/menu1/list_view.html
Normal file
@ -0,0 +1,246 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>리스트</title>
|
||||
|
||||
<!-- css -->
|
||||
<link rel="stylesheet" href="../../../css/reset.css">
|
||||
<link rel="stylesheet" href="../../../css/font.css">
|
||||
<link rel="stylesheet" href="../layout/layout.css">
|
||||
<link rel="stylesheet" href="../css/common.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<link rel="stylesheet" href="../css/button.css">
|
||||
<link rel="stylesheet" href="../css/tab.css">
|
||||
<link rel="stylesheet" href="../css/table.css">
|
||||
<link rel="stylesheet" href="../css/calendar.css">
|
||||
<link rel="stylesheet" href="../css/popup.css">
|
||||
|
||||
<!-- script -->
|
||||
<script src="../../../js/jquery-3.5.0.js"></script>
|
||||
<script src="../script/common.js"></script>
|
||||
<script src="../layout/layout.js"></script>
|
||||
<script src="../script/tab.js"></script>
|
||||
<script src="../script/content.js"></script>
|
||||
<script src="../script/popup.js"></script>
|
||||
|
||||
<!-- 캘린더 -->
|
||||
<script type="module" src="../../../js/plugin/datapicker/duet.esm.js"></script>
|
||||
<script nomodule src="../../../js/plugin/datapicker/duet.js"></script>
|
||||
<link rel="stylesheet" href="../../../js/plugin/datapicker/default.css">
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="wrap">
|
||||
|
||||
<div data-include-path="../layout/_leftmenu.html"></div>
|
||||
|
||||
<!-- top_utill+cont -->
|
||||
<div class="container sub" id="container">
|
||||
|
||||
<div data-include-path="../layout/_userinfo.html"></div>
|
||||
|
||||
<div class="content_wrap">
|
||||
|
||||
|
||||
<div data-include-path="../layout/_sub_title.html"></div>
|
||||
|
||||
<ul class="tabs line tab03">
|
||||
<li><button type="button" class="tab active">탭1</button></li>
|
||||
<li><button type="button" class="tab">탭1</button></li>
|
||||
<li><button type="button" class="tab">탭1</button></li>
|
||||
</ul>
|
||||
|
||||
<div class="tab_content active">
|
||||
<div class="content_title h4">
|
||||
<h4>교육과정 등록</h4>
|
||||
</div>
|
||||
<div class="content_title h5">
|
||||
<h5>교육과정</h5>
|
||||
<div class="btn_wrap">
|
||||
<button type="button" class="btn medium line secondary" onclick="windowOpenPopup('./popup/popup_list.html','팝업리스트','700','800');">팝업열기</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="table table_type_rows">
|
||||
<table>
|
||||
<!-- *caption은 스크립트 -->
|
||||
<colgroup>
|
||||
<col style="width:200px;">
|
||||
<col style="width:calc((100% - 400px)/2);">
|
||||
<col style="width:200px;">
|
||||
<col style="width:calc((100% - 400px)/2);">
|
||||
</colgroup>
|
||||
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>교육부문</th>
|
||||
<td colspan="3">상표권 교육조건부 기소유예 1회차 교육</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>교육기간</th>
|
||||
<td>2025-06-13(수) ~ 2025-06-15(금)</td>
|
||||
<th>접수일</th>
|
||||
<td>2025-06-13(수)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>상세교육과정</th>
|
||||
<td colspan="3">상표권 교육조건부 기소유예 1회차 교육상표권 교육조건부 기소유예 1회차 교육상표권 교육조건부 기소유예 1회차 교육상표권 교육조건부 기소유예 1회차 교육상표권 교육조건부 기소유예 1회차 교육상표권 교육조건부 기소유예 1회차 교육상표권 교육조건부 기소유예 1회차 교육상표권 교육조건부 기소유예 1회차 교육</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>정원</th>
|
||||
<td colspan="3">30명</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>신청자수</th>
|
||||
<td colspan="3">20명</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>상태</th>
|
||||
<td colspan="3"><strong class="status text blue">접수중</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>첨부파일</th>
|
||||
<td colspan="3">
|
||||
<ul class="file_list">
|
||||
<li><a href="#" download="파일이름" title="다운로드"><i class="icon file"></i>파일이름.hwp</a></li>
|
||||
<li><a href="#" download="파일이름" title="다운로드"><i class="icon file"></i>파일이름.hwp</a></li>
|
||||
</ul>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="content_title h5">
|
||||
<h5>교육과정</h5>
|
||||
<div class="btn_wrap">
|
||||
<button type="button" class="btn medium line secondary" onclick="windowOpenPopup('./popup/popup_reg.html','팝업리스트','700','800');">팝업열기</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="table table_type_cols">
|
||||
<table>
|
||||
<!-- *caption은 스크립트 -->
|
||||
<colgroup>
|
||||
<col style="width:32px;">
|
||||
<col style="width:10%;">
|
||||
<col style="width:calc((100% - 32px) / 4);">
|
||||
<col style="width:calc((100% - 32px) / 4);">
|
||||
<col style="width:200px;">
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<label for="check_all" class="checkbox_item">
|
||||
<input type="checkbox" class="input checkbox" name="check" id="check_all">
|
||||
</label>
|
||||
</th>
|
||||
<th>아이디</th>
|
||||
<th>교육문의제목</th>
|
||||
<th>교육기간</th>
|
||||
<th>승인처리</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<label for="check_1" class="checkbox_item">
|
||||
<input type="checkbox" class="input checkbox" name="check" id="check_1">
|
||||
</label>
|
||||
</td>
|
||||
<td>honggildong</td>
|
||||
<td class="text_left"><a href="#">교육문의 입니다.</a></td>
|
||||
<td>2025-05-05 10:00:00 ~ 2025-05-05 10:00:00</td>
|
||||
<td>
|
||||
<div class="btn_wrap center">
|
||||
<button type="button" class="btn fill small primary">승인</button>
|
||||
<button type="button" class="btn fill small gray">메모</button>
|
||||
<button type="button" class="btn line small red">반려</button>
|
||||
<button type="button" class="btn line small lightgray only_icon btn_delete"><i class="icon delete red"></i></button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<label for="check_1" class="checkbox_item">
|
||||
<input type="checkbox" class="input checkbox" name="check" id="check_1">
|
||||
</label>
|
||||
</td>
|
||||
<td>
|
||||
<div class="form_wrap">
|
||||
<select name="" id="" class="select">
|
||||
<option value=""></option>
|
||||
</select>
|
||||
</div>
|
||||
</td>
|
||||
<td class="text_left">
|
||||
<div class="form_wrap">
|
||||
<input type="text" class="input w100per">
|
||||
</div>
|
||||
</td>
|
||||
<td class="visible">
|
||||
<div class="calendar_type calendar_wrap">
|
||||
<duet-date-picker identifier="date" id="" name="" class="input calendar startDate" value=""></duet-date-picker>
|
||||
~
|
||||
<duet-date-picker identifier="date" id="" name="" class="input calendar endDate" value=""></duet-date-picker>
|
||||
<div class="time_layer_wrap">
|
||||
<input type="text" class="input time_input" placeholder="00:00">
|
||||
<div class="time_layer">
|
||||
<strong class="title">시간선택</strong>
|
||||
<div class="time_wrap">
|
||||
<select name="" id="" class="select time_select hour">
|
||||
</select>
|
||||
<span class="text_split">시</span>
|
||||
<select name="" id="" class="select time_select minute">
|
||||
</select>
|
||||
<span class="text_split">분</span>
|
||||
</div>
|
||||
<button type="button" class="btn medium fill secondary">확인</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<script src="../script/toggleCalendar.js"></script>
|
||||
</td>
|
||||
<td>
|
||||
<div class="btn_wrap center">
|
||||
<button type="button" class="btn fill small primary">승인</button>
|
||||
<button type="button" class="btn fill small gray">메모</button>
|
||||
<button type="button" class="btn line small red">반려</button>
|
||||
<button type="button" class="btn line small lightgray only_icon btn_delete"><i class="icon delete red"></i></button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="btn_wrap">
|
||||
<div class="left">
|
||||
<button type="button" class="btn line xlarge red">삭제</button>
|
||||
</div>
|
||||
<div class="center"></div>
|
||||
<div class="right">
|
||||
<button class="btn fill xlarge primary">등록</button>
|
||||
<button class="btn fill xlarge gray">목록</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div data-include-path="../layout/_footer.html"></div>
|
||||
|
||||
</div>
|
||||
<!-- //top_utill+cont -->
|
||||
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
206
src/main/webapp/publish/adm/menu1/popup/popup_list.html
Normal file
@ -0,0 +1,206 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
|
||||
<!-- css -->
|
||||
<link rel="stylesheet" href="../../../../css/reset.css">
|
||||
<link rel="stylesheet" href="../../../../css/font.css">
|
||||
<link rel="stylesheet" href="../../css/common.css">
|
||||
<link rel="stylesheet" href="../../css/style.css">
|
||||
<link rel="stylesheet" href="../../css/button.css">
|
||||
<link rel="stylesheet" href="../../css/tab.css">
|
||||
<link rel="stylesheet" href="../../css/table.css">
|
||||
<link rel="stylesheet" href="../../css/calendar.css">
|
||||
<link rel="stylesheet" href="../../css/popup.css">
|
||||
|
||||
<!-- script -->
|
||||
<script src="../../../js/jquery-3.5.0.js"></script>
|
||||
<script src="../script/common.js"></script>
|
||||
<script src="../layout/layout.js"></script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="popup_wrap popup">
|
||||
<div class="popup_title_area">
|
||||
<h1 class="popup_title">팝업 타이틀</h1>
|
||||
<button type="button" class="btn_popup_close"><i class="icon x white"></i></button>
|
||||
</div>
|
||||
|
||||
<div class="popup_content">
|
||||
|
||||
<ul class="search_area box">
|
||||
<li class="search_item">
|
||||
<strong class="search_title">구분</strong>
|
||||
<div class="form_wrap">
|
||||
<select name="" id="" class="select search_select">
|
||||
<option value="">선택</option>
|
||||
</select>
|
||||
<input type="text" class="input w40per">
|
||||
<button type="button" class="btn fill ssmall primary">검색</button>
|
||||
<button type="button" class="btn fill ssmall gray">초기화</button>
|
||||
</div>
|
||||
</li>
|
||||
<li class="search_item">
|
||||
<strong class="search_title">구분</strong>
|
||||
<div class="form_wrap">
|
||||
<input type="text" class="input w40per">
|
||||
</div>
|
||||
</li>
|
||||
<li class="search_item">
|
||||
<strong class="search_title">구분</strong>
|
||||
<div class="search_type calendar_type calendar_wrap">
|
||||
<span class="text_split">· 의뢰일</span>
|
||||
<duet-date-picker identifier="date" id="" name="" class="input calendar startDate" value=""></duet-date-picker>
|
||||
~
|
||||
<duet-date-picker identifier="date" id="" name="" class="input calendar endDate" value=""></duet-date-picker>
|
||||
</div>
|
||||
</li>
|
||||
<li class="search_item">
|
||||
<strong class="search_title">구분</strong>
|
||||
<div class="form_wrap radio_wrap">
|
||||
<select name="" id="" class="select search_select">
|
||||
<option value="">1</option>
|
||||
</select>
|
||||
<select name="" id="" class="select search_select">
|
||||
<option value="">1</option>
|
||||
</select>
|
||||
|
||||
<span class="text_split">· 성별</span>
|
||||
<label for="man" class="radio_item">
|
||||
<input type="radio" name="jender" id="man">
|
||||
<span>남성</span>
|
||||
</label>
|
||||
<label for="woman" class="radio_item">
|
||||
<input type="radio" name="jender" id="woman">
|
||||
<span>여성</span>
|
||||
</label>
|
||||
</div>
|
||||
</li>
|
||||
<li class="search_item">
|
||||
<strong class="search_title">구분</strong>
|
||||
<div class="form_wrap">
|
||||
|
||||
<span class="text_split">· 관할청</span>
|
||||
<select name="" id="" class="select search_select">
|
||||
<option value="">1</option>
|
||||
</select>
|
||||
<input type="text" class="input search_input">
|
||||
</div>
|
||||
</li>
|
||||
<li class="search_item">
|
||||
<strong class="search_title">엑셀다운로드</strong>
|
||||
<div class="form_wrap btn_wrap">
|
||||
<button type="button" class="btn ssmall mix line excel"><i class="icon excel download"></i>엑셀다운로드</button>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="table table_type_cols popup">
|
||||
<table>
|
||||
<!-- *caption은 스크립트 -->
|
||||
<colgroup>
|
||||
<col style="width:32px;">
|
||||
<col style="width:calc((100% - 112px)/3);">
|
||||
<col style="width:calc((100% - 112px)/3);">
|
||||
<col style="width:calc((100% - 112px)/3);">
|
||||
<col style="width:80px;">
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>
|
||||
<label for="check_all" class="checkbox_item">
|
||||
<input type="checkbox" class="input checkbox" name="check" id="check_all">
|
||||
</label>
|
||||
</th>
|
||||
<th>의뢰일</th>
|
||||
<th>사건번호</th>
|
||||
<th>관할청</th>
|
||||
<th>선택</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<label for="check_1" class="checkbox_item">
|
||||
<input type="checkbox" class="input checkbox" name="check" id="check_1">
|
||||
</label>
|
||||
</td>
|
||||
<td>2025-05-05</td>
|
||||
<td><a href="#">2025형제4915</a></td>
|
||||
<td>광주지검</td>
|
||||
<td>
|
||||
<div class="btn_wrap center">
|
||||
<button type="button" class="btn line gray xssmall">선택</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<label for="check_2" class="checkbox_item">
|
||||
<input type="checkbox" class="input checkbox" name="check" id="check_2">
|
||||
</label>
|
||||
</td>
|
||||
<td>2025-05-05</td>
|
||||
<td><a href="#">2025형제4915</a></td>
|
||||
<td>광주지검</td>
|
||||
<td>
|
||||
<div class="btn_wrap center">
|
||||
<button type="button" class="btn line gray xssmall">선택</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<label for="check_3" class="checkbox_item">
|
||||
<input type="checkbox" class="input checkbox" name="check" id="check_3">
|
||||
</label>
|
||||
</td>
|
||||
<td>2025-05-05</td>
|
||||
<td><a href="#">2025형제4915</a></td>
|
||||
<td>광주지검</td>
|
||||
<td>
|
||||
<div class="btn_wrap center">
|
||||
<button type="button" class="btn line gray xssmall">선택</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<label for="check_4" class="checkbox_item">
|
||||
<input type="checkbox" class="input checkbox" name="check" id="check_4">
|
||||
</label>
|
||||
</td>
|
||||
<td>2025-05-05</td>
|
||||
<td><a href="#">2025형제4915</a></td>
|
||||
<td>광주지검</td>
|
||||
<td>
|
||||
<div class="btn_wrap center">
|
||||
<button type="button" class="btn line gray xssmall">선택</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<ul class="page">
|
||||
<li><a href="#" class="btn_page btn_first" title="첫 페이지로 이동"><i></i></a></li>
|
||||
<li><a href="#" class="btn_page btn_prev" title="이전 페이지로 이동"><i></i></a></li>
|
||||
<li><a href="#" title="1페이지로 이동" class="active">1</a></li>
|
||||
<li><a href="#" title="2페이지로 이동">2</a></li>
|
||||
<li><a href="#" title="3페이지로 이동">3</a></li>
|
||||
<li><a href="#" title="4페이지로 이동">4</a></li>
|
||||
<li><a href="#" title="5페이지로 이동">5</a></li>
|
||||
<li><a href="#" class="btn_page btn_next" title="다음 페이지로 이동"><i></i></a></li>
|
||||
<li><a href="#" class="btn_page btn_last" title="마지막 페이지로 이동"><i></i></a></li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
289
src/main/webapp/publish/adm/menu1/popup/popup_reg.html
Normal file
@ -0,0 +1,289 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
|
||||
<!-- css -->
|
||||
<link rel="stylesheet" href="../../../../css/reset.css">
|
||||
<link rel="stylesheet" href="../../../../css/font.css">
|
||||
<link rel="stylesheet" href="../../css/common.css">
|
||||
<link rel="stylesheet" href="../../css/style.css">
|
||||
<link rel="stylesheet" href="../../css/button.css">
|
||||
<link rel="stylesheet" href="../../css/tab.css">
|
||||
<link rel="stylesheet" href="../../css/table.css">
|
||||
<link rel="stylesheet" href="../../css/calendar.css">
|
||||
<link rel="stylesheet" href="../../css/popup.css">
|
||||
|
||||
<!-- script -->
|
||||
<script src="../../../../js/jquery-3.5.0.js"></script>
|
||||
<script src="../../script/common.js"></script>
|
||||
<script src="../../layout/layout.js"></script>
|
||||
<script src="../../script/content.js"></script>
|
||||
|
||||
<!-- 캘린더 -->
|
||||
<script type="module" src="../../../../js/plugin/datapicker/duet.esm.js"></script>
|
||||
<script nomodule src="../../../../js/plugin/datapicker/duet.js"></script>
|
||||
<link rel="stylesheet" href="../../../../js/plugin/datapicker/default.css">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="popup_wrap popup">
|
||||
<div class="popup_title_area">
|
||||
<h1 class="popup_title">팝업 타이틀</h1>
|
||||
<button type="button" class="btn_popup_close"><i class="icon x white"></i></button>
|
||||
</div>
|
||||
|
||||
<div class="popup_content">
|
||||
|
||||
|
||||
<div class="popup_title_wrap h2">
|
||||
<h2>타이틀</h2>
|
||||
</div>
|
||||
<div class="table table_type_rows popup">
|
||||
<table>
|
||||
<!-- *caption은 스크립트 -->
|
||||
<colgroup>
|
||||
<col style="width:16%;">
|
||||
<col style="width:auto;">
|
||||
</colgroup>
|
||||
|
||||
<tbody>
|
||||
<tr>
|
||||
<th>작성자</th>
|
||||
<td><b>홍길동</b></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th><span class="required">*</span>제목</th>
|
||||
<td>
|
||||
<div class="form_wrap">
|
||||
<input type="text" class="input w100per" placeholder="제목을 입력해주세요.">
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>제목</th>
|
||||
<td>
|
||||
<div class="form_wrap">
|
||||
<input type="text" class="input w50per" placeholder="제목을 입력해주세요.">
|
||||
<span class="input_desc">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>기간</th>
|
||||
<td>
|
||||
<div class="calendar_type calendar_wrap">
|
||||
<duet-date-picker identifier="date" id="" name="" class="input calendar startDate" value=""></duet-date-picker>
|
||||
~
|
||||
<duet-date-picker identifier="date" id="" name="" class="input calendar endDate" value=""></duet-date-picker>
|
||||
<div class="time_layer_wrap">
|
||||
<input type="text" class="input time_input" placeholder="00:00">
|
||||
<div class="time_layer">
|
||||
<strong class="title">시간선택</strong>
|
||||
<div class="time_wrap">
|
||||
<select name="" id="" class="select time_select hour">
|
||||
</select>
|
||||
<span class="text_split">시</span>
|
||||
<select name="" id="" class="select time_select minute">
|
||||
</select>
|
||||
<span class="text_split">분</span>
|
||||
</div>
|
||||
<button type="button" class="btn medium fill secondary">확인</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<script src="../../script/toggleCalendar.js"></script>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>이메일</th>
|
||||
<td>
|
||||
<div class="form_wrap email_wrap">
|
||||
<input type="text" class="input email emain_id"><span class="text_split">@</span><input type="text" class="input email email_domain">
|
||||
<select name="" id="" class="select">
|
||||
<option value="">gmail.com</option>
|
||||
<option value="">naver.com</option>
|
||||
<option value="">kakao.com</option>
|
||||
<option value="">직접입력</option>
|
||||
</select>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>위치</th>
|
||||
<td>
|
||||
<div class="form_wrap input_mix_wrap">
|
||||
<span class="text_split">왼쪽</span><input type="text" class="input"><span class="text_split">px</span>
|
||||
<span class="text_split">  상단</span><input type="text" class="input"><span class="text_split">px</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>성별</th>
|
||||
<td>
|
||||
<div class="form_wrap radio_wrap">
|
||||
<label for="man" class="radio_item">
|
||||
<input type="radio" name="jender" id="man">
|
||||
<span>남성</span>
|
||||
</label>
|
||||
<label for="woman" class="radio_item">
|
||||
<input type="radio" name="jender" id="woman">
|
||||
<span>여성</span>
|
||||
</label>
|
||||
<span class="input_desc red">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>항목</th>
|
||||
<td>
|
||||
<div class="form_wrap checkbox_wrap">
|
||||
<label for="check_all" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_all">
|
||||
<span>전체</span>
|
||||
</label>
|
||||
<label for="check_1" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_1">
|
||||
<span>항목1</span>
|
||||
</label>
|
||||
<label for="check_2" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_2">
|
||||
<span>항목2</span>
|
||||
</label>
|
||||
<label for="check_3" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_3">
|
||||
<span>항목3</span>
|
||||
</label>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>주소</th>
|
||||
<td>
|
||||
<div class="form_wrap address_wrap">
|
||||
<div class="address_row">
|
||||
<input type="text" class="input input_post readonly" readonly><button type="button" class="btn ssmall line primary">우편번호 찾기</button>
|
||||
</div>
|
||||
<div class="address_row">
|
||||
<input type="text" class="input adr_default readonly" readonly>
|
||||
<input type="text" class="input adr_detail">
|
||||
</div>
|
||||
<span class="input_desc red">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>내용</th>
|
||||
<td>
|
||||
<div class="form_wrap">
|
||||
<textarea name="" id="" class="textarea w100per" rows="5"></textarea>
|
||||
<div class="input_desc_wrap column">
|
||||
<span class="input_desc red">* 필수입력 항목입니다.</span>
|
||||
<span class="input_desc blue">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>파일첨부</th>
|
||||
<td>
|
||||
<div class="file_upload_wrap">
|
||||
<button type="button" class="btn ssmall line primary">파일 첨부하기</button>
|
||||
<div class="file_table before_file_table">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style="width:auto;">
|
||||
<col style="width:13%;">
|
||||
<col style="width:13%;">
|
||||
<col style="width:80px;">
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>파일명</th>
|
||||
<th>종류</th>
|
||||
<th>크기</th>
|
||||
<th>삭제</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td colspan="4">
|
||||
<i class="icon file_bg"></i>
|
||||
<p>첨부하실 파일을 <b>마우스로 끌어서</b> 넣어주세요.</p>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>파일첨부</th>
|
||||
<td>
|
||||
<div class="file_upload_wrap">
|
||||
<div class="file_top">
|
||||
<button type="button" class="btn ssmall line primary">파일 첨부하기</button>
|
||||
<span class="input_desc red">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
<div class="file_table">
|
||||
<table>
|
||||
<colgroup>
|
||||
<col style="width:auto;">
|
||||
<col style="width:13%;">
|
||||
<col style="width:13%;">
|
||||
<col style="width:80px;">
|
||||
</colgroup>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>파일명</th>
|
||||
<th>종류</th>
|
||||
<th>크기</th>
|
||||
<th>삭제</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>파일이름</td>
|
||||
<td>hwp</td>
|
||||
<td>1.4mb</td>
|
||||
<td><button type="button" class="btn line lightgray ssmall only_icon btn_delete"><i class="icon delete red"></i></button></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="input_desc_wrap column">
|
||||
<span class="input_desc">* 필수입력 항목입니다.</span>
|
||||
<span class="input_desc">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="btn_wrap">
|
||||
<div class="left">
|
||||
<button type="button" class="btn line red medium">삭제</button>
|
||||
</div>
|
||||
<div class="center">
|
||||
<button type="button" class="btn fill primary medium">등록</button>
|
||||
<button type="button" class="btn fill gray medium">닫기</button>
|
||||
</div>
|
||||
<div class="right">
|
||||
<button type="button" class="btn fill lightgray medium">목록</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
56
src/main/webapp/publish/adm/script/content.js
Normal file
@ -0,0 +1,56 @@
|
||||
$(function () {
|
||||
toggleTimeLayer();
|
||||
});
|
||||
|
||||
function toggleTimeLayer() {
|
||||
|
||||
// 시/분 select 옵션 생성
|
||||
$(".time_layer_wrap").each(function () {
|
||||
const $wrap = $(this);
|
||||
createOptions($wrap.find(".hour"), 24, "");
|
||||
createOptions($wrap.find(".minute"), 60, "");
|
||||
});
|
||||
|
||||
/** 공통 옵션 생성 함수 */
|
||||
function createOptions($select, max, unit) {
|
||||
$select.empty();
|
||||
$select.append(`<option value="">${unit}</option>`);
|
||||
|
||||
for (let i = 0; i < max; i++) {
|
||||
const num = i < 10 ? "0" + i : i;
|
||||
$select.append(`<option value="${num}">${num}${unit}</option>`);
|
||||
}
|
||||
}
|
||||
|
||||
// input 클릭 → 레이어 열기/닫기
|
||||
$(".time_input").on("click", function () {
|
||||
const $wrap = $(this).closest(".time_layer_wrap");
|
||||
const $layer = $wrap.find(".time_layer");
|
||||
|
||||
$(".time_layer").not($layer).removeClass("active"); // 다른 레이어 닫기
|
||||
$layer.toggleClass("active");
|
||||
});
|
||||
|
||||
// "확인" 버튼 클릭 → 값 적용
|
||||
$(".time_layer .btn").on("click", function () {
|
||||
const $wrap = $(this).closest(".time_layer_wrap");
|
||||
const hour = $wrap.find(".hour").val();
|
||||
const minute = $wrap.find(".minute").val();
|
||||
|
||||
if (hour === "" || minute === "") {
|
||||
alert("시간과 분을 모두 선택해주세요.");
|
||||
return;
|
||||
}
|
||||
|
||||
$wrap.find(".time_input").val(`${hour}:${minute}`);
|
||||
$wrap.find(".time_layer").removeClass("active");
|
||||
});
|
||||
|
||||
// 외부 클릭 시 레이어 닫기
|
||||
$(document).on("click", function (e) {
|
||||
if (!$(e.target).closest(".time_layer_wrap").length) {
|
||||
$(".time_layer").removeClass("active");
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
16
src/main/webapp/publish/adm/script/popup.js
Normal file
@ -0,0 +1,16 @@
|
||||
function windowOpenPopup(url, title, w, h) {
|
||||
// 현재 모니터에서 팝업 위치 계산
|
||||
var left = window.screenLeft + (window.innerWidth - w) / 2;
|
||||
var top = window.screenTop + (window.innerHeight - h) / 2;
|
||||
|
||||
var popup = window.open(
|
||||
url,
|
||||
title,
|
||||
"width=" + w +
|
||||
",height=" + h +
|
||||
",left=" + left +
|
||||
",top=" + top +
|
||||
",scrollbars=yes,resizable=yes"
|
||||
);
|
||||
|
||||
}
|
||||
10
src/main/webapp/publish/adm/script/tab.js
Normal file
@ -0,0 +1,10 @@
|
||||
$(function () {
|
||||
|
||||
$(".tab").on("click", function () {
|
||||
const $this = $(this);
|
||||
const tabIndex = $this.closest("li").index(); // 현재 탭의 순서 (0부터 시작)
|
||||
$this.addClass("active").closest("li").siblings().find(".tab").removeClass("active");
|
||||
$(".tab_content").eq(tabIndex).addClass("active").siblings(".tab_content").removeClass("active");
|
||||
});
|
||||
|
||||
});
|
||||
220
src/main/webapp/publish/adm/script/toggleCalendar.js
Normal file
@ -0,0 +1,220 @@
|
||||
$(window).on('load', function () {
|
||||
// DOM 로드 후 initDatePickers 를 실행합니다.
|
||||
// setTimeout을 짧게 둔 이유: duet-date-picker 같은 웹컴포넌트가
|
||||
// 브라우저에서 hydrate(초기화) 되는 시점과 맞추기 위함입니다.
|
||||
setTimeout(initDatePickers, 10);
|
||||
});
|
||||
|
||||
// ===================================================================
|
||||
// initDatePickers
|
||||
// - 페이지 내 모든 .startDate / .endDate 요소를 찾아 순번 붙이고
|
||||
// duet-date-picker 관련 기능(포맷, 로컬, 키보드 입력, validation 등)을 바인딩합니다.
|
||||
// - 동적으로 요소가 추가된 경우(예: AJAX) initDatePickers()를
|
||||
// 다시 호출하면 새로 추가된 요소에도 자동 적용됩니다.
|
||||
// ===================================================================
|
||||
function initDatePickers() {
|
||||
// start / end picker들을 쿼리합니다.
|
||||
const startPickers = $(".startDate");
|
||||
const endPickers = $(".endDate");
|
||||
|
||||
// ---------------------------------------------------------------
|
||||
// 1) 각 start/end에 1부터 순번 부여
|
||||
// .startDate -> .startDate1, .startDate2 ...
|
||||
// 내부 duet-date__input에도 id(startDate1, ...)를 부여 (필요시)
|
||||
// ---------------------------------------------------------------
|
||||
startPickers.each(function (idx, itm) {
|
||||
$(itm).removeClass("startDate").addClass("startDate" + (idx + 1));
|
||||
// 내부 input id 셋팅: 스크린리더 또는 라벨 연결에 유용
|
||||
$(itm).find(".duet-date__input").attr("id", "startDate" + (idx + 1));
|
||||
$(itm).find("input[type=hidden]").attr("name","startDate"+(idx+1)+"_submit");
|
||||
});
|
||||
endPickers.each(function (idx, itm) {
|
||||
$(itm).removeClass("endDate").addClass("endDate" + (idx + 1));
|
||||
$(itm).find(".duet-date__input").attr("id", "endDate" + (idx + 1));
|
||||
$(itm).find("input[type=hidden]").attr("name","startDate"+(idx+1)+"_submit");
|
||||
});
|
||||
|
||||
// 총 페어 개수는 start / end 중 큰 쪽 기준으로 반복합니다.
|
||||
const total = Math.max(startPickers.length, endPickers.length);
|
||||
|
||||
// 각 인덱스별로 duet-date-picker 쌍에 기능을 적용합니다.
|
||||
for (let i = 1; i <= total; i++) {
|
||||
const startEl = document.querySelector(".startDate" + i);
|
||||
const endEl = document.querySelector(".endDate" + i);
|
||||
|
||||
// ----------------------------------------------------------------
|
||||
// 날짜 포맷 설정 (duet 라이브러리의 dateAdapter에 연결)
|
||||
// - parse: 문자열 -> Date
|
||||
// - format: Date -> "YYYY.MM.DD"
|
||||
// ----------------------------------------------------------------
|
||||
function setDateAdapter(target) {
|
||||
if (!target) return;
|
||||
target.dateAdapter = {
|
||||
parse(value = "", createDate) {
|
||||
const parts = value.split(".");
|
||||
if (parts.length !== 3) return null; // 포맷이 아니면 null
|
||||
const [y, m, d] = parts.map(Number);
|
||||
return createDate(y, m - 1, d); // month는 0-base
|
||||
},
|
||||
format(date) {
|
||||
return `${date.getFullYear()}.${String(date.getMonth() + 1).padStart(2, "0")}.${String(date.getDate()).padStart(2, "0")}`;
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
// ----------------------------------------------------------------
|
||||
// 한글 로컬라이제이션 설정
|
||||
// ----------------------------------------------------------------
|
||||
function setLocalization(target, type) {
|
||||
if (!target) return;
|
||||
target.localization = {
|
||||
placeholder: type === "start" ? "시작일 선택" : "종료일 선택",
|
||||
buttonLabel: "달력 열기",
|
||||
selectedDateMessage: "선택된 날짜:",
|
||||
prevMonthLabel: "이전 달",
|
||||
nextMonthLabel: "다음 달",
|
||||
monthSelectLabel: "월 선택",
|
||||
yearSelectLabel: "연도 선택",
|
||||
closeLabel: "닫기",
|
||||
calendarHeading: "날짜 선택",
|
||||
dayNames: ["일", "월", "화", "수", "목", "금", "토"],
|
||||
monthNames: ["1월","2월","3월","4월","5월","6월","7월","8월","9월","10월","11월","12월"],
|
||||
monthNamesShort: ["1월","2월","3월","4월","5월","6월","7월","8월","9월","10월","11월","12월"],
|
||||
};
|
||||
}
|
||||
|
||||
// ----------------------------------------------------------------
|
||||
// 키보드 입력 지원 (숫자만 받아서 자동으로 yyyy.mm.dd 포맷으로 만듦)
|
||||
// - duet-date-picker.value, .duet-date__input.value, hidden.value 를 모두 동기화
|
||||
// - 입력 중에는 포맷을 점진적으로 적용(input 이벤트)
|
||||
// - blur 시 유효성 검사를 통해 값 확정
|
||||
// ----------------------------------------------------------------
|
||||
function enableKeyboardInput(target) {
|
||||
if (!target) return;
|
||||
const input = target.querySelector(".duet-date__input");
|
||||
const hidden = target.querySelector('input[type="hidden"]');
|
||||
|
||||
if (!input) return;
|
||||
|
||||
// 입력 도중 포맷 해주는 로직
|
||||
input.addEventListener("input", function (e) {
|
||||
let val = e.target.value.replace(/[^0-9]/g, ""); // 숫자만
|
||||
// 자동으로 20251107 -> 2025.11.07 형태로 변환
|
||||
if (val.length > 4 && val.length <= 6) {
|
||||
val = val.replace(/(\d{4})(\d+)/, "$1.$2");
|
||||
} else if (val.length > 6) {
|
||||
val = val.replace(/(\d{4})(\d{2})(\d+)/, "$1.$2.$3");
|
||||
}
|
||||
e.target.value = val;
|
||||
|
||||
// 형식이 완성되면 duet 컴포넌트 value + hidden 동기화
|
||||
if (/^\d{4}\.\d{2}\.\d{2}$/.test(val)) {
|
||||
if (hidden) hidden.value = val;
|
||||
// duet-date-picker 자체 value에 반영 (컴포넌트에 따라 내부 업데이트 트리거)
|
||||
try { target.value = val; } catch (err) { /* 안정성: 일부 환경에서 읽기전용일 수 있음 */ }
|
||||
}
|
||||
});
|
||||
|
||||
// blur 시 최종 확인(잘못된 형식이면 초기화)
|
||||
input.addEventListener("blur", function (e) {
|
||||
const val = e.target.value;
|
||||
if (/^\d{4}\.\d{2}\.\d{2}$/.test(val)) {
|
||||
if (hidden) hidden.value = val;
|
||||
try { target.value = val; } catch (err) {}
|
||||
} else if (val.trim() !== "") {
|
||||
// 비어있지 않은데 형식이 맞지 않으면 사용자에게 알리고 초기화
|
||||
alert("날짜 형식은 YYYY.MM.DD 입니다.");
|
||||
e.target.value = "";
|
||||
if (hidden) hidden.value = "";
|
||||
try { target.value = ""; } catch (err) {}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// ----------------------------------------------------------------
|
||||
// duetClose 이벤트 바인딩
|
||||
// - 달력에서 선택 후 닫힐 때 실행됨
|
||||
// - 이때도 input + hidden 동기화
|
||||
// ----------------------------------------------------------------
|
||||
function bindCloseEvent(target) {
|
||||
if (!target) return;
|
||||
const input = target.querySelector(".duet-date__input");
|
||||
const hidden = target.querySelector('input[type="hidden"]');
|
||||
|
||||
// duet 컴포넌트이므로 커스텀 이벤트 duetClose를 사용
|
||||
target.addEventListener("duetClose", function (e) {
|
||||
const val = e.target.value;
|
||||
if (val) {
|
||||
if (input) input.value = val;
|
||||
if (hidden) hidden.value = val;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// ----------------------------------------------------------------
|
||||
// 시작/종료 유효성 검사
|
||||
// - endEl 이 없으면 검사 스킵
|
||||
// - duetChange 시 (값이 확정될 때) 검사
|
||||
// ----------------------------------------------------------------
|
||||
function bindDateValidation(startEl, endEl) {
|
||||
if (!startEl || !endEl) return;
|
||||
const startInput = startEl.querySelector(".duet-date__input");
|
||||
const endInput = endEl.querySelector(".duet-date__input");
|
||||
|
||||
if (startEl) {
|
||||
startEl.addEventListener("duetChange", function () {
|
||||
const sVal = (startInput?.value || "").replace(/\./g, "");
|
||||
const eVal = (endInput?.value || "").replace(/\./g, "");
|
||||
if (sVal && eVal && sVal > eVal) {
|
||||
alert("시작일은 종료일보다 클 수 없습니다.");
|
||||
if (startInput) startInput.value = "";
|
||||
try { startEl.value = ""; } catch (err) {}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (endEl) {
|
||||
endEl.addEventListener("duetChange", function () {
|
||||
const sVal = (startInput?.value || "").replace(/\./g, "");
|
||||
const eVal = (endInput?.value || "").replace(/\./g, "");
|
||||
if (sVal && eVal && eVal < sVal) {
|
||||
alert("종료일은 시작일보다 작을 수 없습니다.");
|
||||
if (endInput) endInput.value = "";
|
||||
try { endEl.value = ""; } catch (err) {}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// ----------------------------------------------------------------
|
||||
// 모든 기능 적용
|
||||
// - setDateAdapter / setLocalization 은 duet 컴포넌트 내부 동작을 위해 필수
|
||||
// - enableKeyboardInput / bindCloseEvent 은 우리가 추가한 동기화 로직
|
||||
// - bindDateValidation 은 쌍이 있을 때만 적용
|
||||
// ----------------------------------------------------------------
|
||||
setDateAdapter(startEl);
|
||||
setDateAdapter(endEl);
|
||||
|
||||
setLocalization(startEl, "start");
|
||||
setLocalization(endEl, "end");
|
||||
|
||||
enableKeyboardInput(startEl);
|
||||
enableKeyboardInput(endEl);
|
||||
|
||||
bindCloseEvent(startEl);
|
||||
bindCloseEvent(endEl);
|
||||
|
||||
bindDateValidation(startEl, endEl);
|
||||
}
|
||||
}
|
||||
|
||||
// ===================================================================
|
||||
// 사용/주의사항
|
||||
// 1) 동적 추가: AJAX나 JS로 duet-date-picker 를 추가한 경우,
|
||||
// 추가 후 initDatePickers() 를 다시 호출하면 자동으로 바인딩됩니다.
|
||||
// 2) duet-date-picker 내부 구조가 달라지면 (예: .duet-date__input 클래스 변경)
|
||||
// 선택자(input / hidden)들을 그에 맞게 수정해야 합니다.
|
||||
// 3) monthNames 배열은 12개로 반드시 채워야 합니다 (렌더링 에러 방지).
|
||||
// 4) 일부 duet-date-picker 구현은 target.value 가 읽기전용일 수 있습니다.
|
||||
// 그 경우 try/catch로 보호해두었습니다(오류 무시).
|
||||
// ===================================================================
|
||||
@ -32,6 +32,7 @@ select, .select{height:34px;border:1px solid var(--default-line-color);border-ra
|
||||
|
||||
.address_wrap{display:flex;flex-direction:column;gap:8px;}
|
||||
.address_row{display:flex;gap:8px;}
|
||||
.input_post{width:calc(50% - 105px);}
|
||||
.adr_default{width:60%;}
|
||||
.adr_detail{width:40%;}
|
||||
|
||||
|
||||
@ -1,110 +1,86 @@
|
||||
body {
|
||||
font-family: 'Pretendard', 'Noto Sans KR', sans-serif;
|
||||
background: #f5f6fa;
|
||||
color: #333;
|
||||
}
|
||||
/* ===============================
|
||||
IMPORTS
|
||||
=============================== */
|
||||
@import url(../../../css/reset.css);
|
||||
@import url(../css/common.css);
|
||||
@import url(../css/button.css);
|
||||
@import url(../css/style.css);
|
||||
|
||||
.guide_wrap {
|
||||
max-width: 1200px;
|
||||
margin: 60px auto;
|
||||
background: #fff;
|
||||
border-radius: 16px;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.08);
|
||||
padding: 40px 50px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 26px;
|
||||
margin-bottom: 25px;
|
||||
font-weight: 700;
|
||||
color: #222;
|
||||
}
|
||||
body{font-family:'Pretendard','Noto Sans KR',sans-serif;background:#f5f6fa;color:#333;}
|
||||
|
||||
.guide_info {
|
||||
background: #fafafa;
|
||||
border: 1px solid #eee;
|
||||
padding: 15px 20px;
|
||||
border-radius: 10px;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
/* ===============================
|
||||
GUIDE WRAP & SECTIONS
|
||||
=============================== */
|
||||
.guide_wrap{max-width:1200px;margin:60px auto;background:#fff;border-radius:16px;box-shadow:0 4px 10px rgba(0,0,0,0.08);padding:40px 50px;}
|
||||
.guide_wrap h1{font-size:26px;margin-bottom:25px;font-weight:700;color:#222;}
|
||||
|
||||
.guide_info ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 15px 30px;
|
||||
}
|
||||
.guide_section{margin:60px 0;}
|
||||
.guide_section h2{font-size:22px;font-weight:600;}
|
||||
.guide_section h3{font-size:20px;font-weight:500;color:#0072ff;margin:40px 0 12px 0;}
|
||||
|
||||
/* ✅ 필터 버튼 */
|
||||
.filter_wrap {
|
||||
margin-bottom: 15px;
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
/* ===============================
|
||||
GUIDE INFO
|
||||
=============================== */
|
||||
.guide_info{background:#fafafa;border:1px solid #eee;padding:15px 20px;border-radius:10px;margin-bottom:25px;}
|
||||
.guide_info ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:15px 30px;}
|
||||
|
||||
.filter_btn {
|
||||
padding: 8px 16px;
|
||||
border: 1px solid #ccc;
|
||||
background: #fff;
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
transition: 0.2s;
|
||||
}
|
||||
.filter_btn:hover {
|
||||
background: #f0f0f0;
|
||||
}
|
||||
.filter_btn.active {
|
||||
background: #0072ff;
|
||||
border-color: #0072ff;
|
||||
color: #fff;
|
||||
}
|
||||
/* ===============================
|
||||
FILTER BUTTONS
|
||||
=============================== */
|
||||
.filter_wrap{margin-bottom:15px;display:flex;gap:8px;}
|
||||
.filter_btn{padding:8px 16px;border:1px solid #ccc;background:#fff;border-radius:6px;font-size:14px;cursor:pointer;transition:.2s;}
|
||||
.filter_btn:hover{background:#f0f0f0;}
|
||||
.filter_btn.active{background:#0072ff;border-color:#0072ff;color:#fff;}
|
||||
|
||||
.tb_guide {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
font-size: 14px;
|
||||
}
|
||||
/* ===============================
|
||||
TABLE GUIDE
|
||||
=============================== */
|
||||
.tb_guide{width:100%;border-collapse:collapse;font-size:14px;}
|
||||
.tb_guide th,.tb_guide td{border:1px solid #ddd;padding:10px 12px;text-align:center;}
|
||||
.tb_guide th{background:#f9f9f9;font-weight:600;}
|
||||
.tb_guide a{color:#0072ff;text-decoration:none;}
|
||||
.tb_guide a:hover{text-decoration:underline;}
|
||||
|
||||
.tb_guide th,
|
||||
.tb_guide td {
|
||||
border: 1px solid #ddd;
|
||||
padding: 10px 12px;
|
||||
text-align: center;
|
||||
}
|
||||
/* STATUS COLORS */
|
||||
.done{color:#198754;font-weight:600;}
|
||||
.ing{color:#e67e22;font-weight:600;}
|
||||
.wait{color:#aaa;font-weight:600;}
|
||||
|
||||
.tb_guide th {
|
||||
background: #f9f9f9;
|
||||
font-weight: 600;
|
||||
}
|
||||
/* ===============================
|
||||
BUTTON GUIDE
|
||||
=============================== */
|
||||
.btn_wrap{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:25px;justify-content:flex-start;}
|
||||
.btn{border-radius:6px;font-size:14px;cursor:pointer;font-weight:500;border:none;transition:.2s;}
|
||||
.btn_default{background:#fff;border:1px solid #ccc;color:#333;}.btn_default:hover{background:#f8f8f8;}
|
||||
.btn_primary{background:#0072ff;color:#fff;}.btn_primary:hover{background:#005edc;}
|
||||
.btn_danger{background:#e74c3c;color:#fff;}.btn_danger:hover{background:#c0392b;}
|
||||
.btn_warning{background:#f39c12;color:#fff;}.btn_warning:hover{background:#e67e22;}
|
||||
.btn_sub{background:#6c757d;color:#fff;}.btn_sub:hover{background:#5a6268;}
|
||||
.btn_sm{padding:5px 10px;font-size:13px;}.btn_md{padding:8px 16px;font-size:14px;}.btn_lg{padding:12px 24px;font-size:16px;}
|
||||
|
||||
.tb_guide a {
|
||||
color: #0072ff;
|
||||
text-decoration: none;
|
||||
}
|
||||
/* ===============================
|
||||
FORM ELEMENTS
|
||||
=============================== */
|
||||
.form_wrap{display:flex;flex-direction:column;gap:10px;margin-bottom:25px;}
|
||||
input[type="text"],input[type="email"],input[type="password"],textarea,select{border:1px solid #ccc;border-radius:6px;padding:8px 12px;font-size:14px;width:100%;transition:.2s;}
|
||||
input:focus,textarea:focus,select:focus{border-color:#0072ff;box-shadow:0 0 0 2px rgba(0,114,255,0.1);outline:none;}
|
||||
textarea{min-height:100px;resize:vertical;}
|
||||
|
||||
.tb_guide a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.form_wrap.email_wrap{gap:8px;justify-content:flex-start;flex-direction:row;}
|
||||
.form_wrap.radio_wrap, .form_wrap.checkbox_wrap{flex-direction:row;}
|
||||
.form_wrap .input_post{width:calc(48% - 105px);}
|
||||
|
||||
.done {
|
||||
color: #198754;
|
||||
font-weight: 600;
|
||||
}
|
||||
.ing {
|
||||
color: #e67e22;
|
||||
font-weight: 600;
|
||||
}
|
||||
.wait {
|
||||
color: #aaa;
|
||||
font-weight: 600;
|
||||
}
|
||||
/* ===============================
|
||||
COLOR GUIDE
|
||||
=============================== */
|
||||
.color_guide{display:flex;flex-wrap:wrap;gap:12px;}
|
||||
.color_box{width:120px;border-radius:6px;overflow:hidden;text-align:center;font-size:12px;border:1px solid #ddd;}
|
||||
.color_box .sample{height:50px;}.color_box .code{padding:6px;background:#fafafa;}
|
||||
.status_wrap{margin:60px 0 0 0;}
|
||||
.status_wrap span{margin:0 16px 0 0;}
|
||||
|
||||
/* 반응형 */
|
||||
@media (max-width: 768px) {
|
||||
.guide_wrap { padding: 20px; }
|
||||
.guide_info ul { flex-direction: column; }
|
||||
.tb_guide th, .tb_guide td { font-size: 12px; padding: 8px; }
|
||||
}
|
||||
/* ===============================
|
||||
RESPONSIVE
|
||||
=============================== */
|
||||
@media (max-width:768px){.guide_wrap{padding:20px;}.guide_info ul{flex-direction:column;}.tb_guide th,.tb_guide td{font-size:12px;padding:8px;}}
|
||||
|
||||
@ -99,7 +99,7 @@
|
||||
<td>-</td>
|
||||
<td><a href="../menu1/list.html" target="_blank" title="새창 열림">리스트</a></td>
|
||||
<td>/menu1/list.html</td>
|
||||
<td class="ing">작업중</td>
|
||||
<td class="done">완료</td>
|
||||
<td>-</td>
|
||||
</tr>
|
||||
|
||||
@ -109,7 +109,7 @@
|
||||
<td>-</td>
|
||||
<td><a href="../menu1/list_view.html" target="_blank" title="새창 열림">리스트 상세</a></td>
|
||||
<td>/menu1/list_view.html</td>
|
||||
<td class="wait">대기</td>
|
||||
<td class="done">완료</td>
|
||||
<td>-</td>
|
||||
</tr>
|
||||
|
||||
@ -118,7 +118,7 @@
|
||||
<td>리스트 등록</td>
|
||||
<td>-</td>
|
||||
<td><a href="../menu1/list_reg.html" target="_blank" title="새창 열림">리스트 등록</a></td>
|
||||
<td>/menu1/list.html</td>
|
||||
<td>/menu1/list_reg.html</td>
|
||||
<td class="done">완료</td>
|
||||
<td>-</td>
|
||||
</tr>
|
||||
@ -156,7 +156,145 @@
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<!-- BUTTON -->
|
||||
<section class="guide_section">
|
||||
<h2>Button (버튼)</h2>
|
||||
|
||||
<h3>Filled Button</h3>
|
||||
<div class="btn_wrap">
|
||||
<button class="btn fill primary small">Primary</button>
|
||||
<button class="btn fill secondary small">Secondary</button>
|
||||
<button class="btn fill accent small">Accent</button>
|
||||
<button class="btn fill red small">Red</button>
|
||||
<button class="btn fill green small">Green</button>
|
||||
<button class="btn fill gray small">Gray</button>
|
||||
</div>
|
||||
|
||||
<h3>Line Button</h3>
|
||||
<div class="btn_wrap">
|
||||
<button class="btn line primary small">Primary</button>
|
||||
<button class="btn line secondary small">Secondary</button>
|
||||
<button class="btn line accent small">Accent</button>
|
||||
<button class="btn line red small">Red</button>
|
||||
<button class="btn line gray small">Gray</button>
|
||||
</div>
|
||||
|
||||
<h3>Size Variation</h3>
|
||||
<div class="btn_wrap">
|
||||
<button class="btn fill gray xssmall">xssmall</button>
|
||||
<button class="btn fill gray ssmall">ssmall</button>
|
||||
<button class="btn fill gray small">small</button>
|
||||
<button class="btn fill gray medium">medium</button>
|
||||
<button class="btn fill gray large">large</button>
|
||||
<button class="btn fill gray xlarge">xlarge</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- INPUT -->
|
||||
<section class="guide_section">
|
||||
<h2>Input / Textarea / Select</h2>
|
||||
|
||||
<h3>Input</h3>
|
||||
<div class="form_wrap">
|
||||
<input type="text" class="input w50per" placeholder="제목을 입력해주세요.">
|
||||
<span class="input_desc">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
|
||||
<h3>Textarea</h3>
|
||||
<div class="form_wrap">
|
||||
<textarea name="" id="" class="textarea w100per" rows="5"></textarea>
|
||||
<div class="input_desc_wrap column">
|
||||
<span class="input_desc red">* 필수입력 항목입니다.</span>
|
||||
<span class="input_desc blue">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h3>Email</h3>
|
||||
<div class="form_wrap email_wrap">
|
||||
<input type="text" class="input email emain_id"><span class="text_split">@</span><input type="text" class="input email email_domain">
|
||||
<select name="" id="" class="select">
|
||||
<option value="">gmail.com</option>
|
||||
<option value="">naver.com</option>
|
||||
<option value="">kakao.com</option>
|
||||
<option value="">직접입력</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<h3>Address</h3>
|
||||
<div class="form_wrap address_wrap">
|
||||
<div class="address_row">
|
||||
<input type="text" class="input input_post readonly" readonly><button type="button" class="btn medium line primary">우편번호 찾기</button>
|
||||
</div>
|
||||
<div class="address_row">
|
||||
<input type="text" class="input adr_default readonly" readonly>
|
||||
<input type="text" class="input adr_detail">
|
||||
</div>
|
||||
<span class="input_desc red">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- RADIO / CHECKBOX -->
|
||||
<section class="guide_section">
|
||||
<h2>Checkbox / Radio</h2>
|
||||
|
||||
<h3>Checkbox</h3>
|
||||
<div class="form_wrap radio_wrap">
|
||||
<label for="man" class="radio_item">
|
||||
<input type="radio" name="jender" id="man">
|
||||
<span>남성</span>
|
||||
</label>
|
||||
<label for="woman" class="radio_item">
|
||||
<input type="radio" name="jender" id="woman">
|
||||
<span>여성</span>
|
||||
</label>
|
||||
<span class="input_desc red">* 필수입력 항목입니다.</span>
|
||||
</div>
|
||||
|
||||
<h3>Radio</h3>
|
||||
<div class="form_wrap checkbox_wrap">
|
||||
<label for="check_all" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_all">
|
||||
<span>전체</span>
|
||||
</label>
|
||||
<label for="check_1" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_1">
|
||||
<span>항목1</span>
|
||||
</label>
|
||||
<label for="check_2" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_2">
|
||||
<span>항목2</span>
|
||||
</label>
|
||||
<label for="check_3" class="checkbox_item">
|
||||
<input type="checkbox" name="check" id="check_3">
|
||||
<span>항목3</span>
|
||||
</label>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- STATUS -->
|
||||
<section class="guide_section">
|
||||
<h2>Status</h2>
|
||||
<div class="status_wrap">
|
||||
<span class="status line blue">진행중</span>
|
||||
<span class="status line gray">완료</span>
|
||||
<span class="status text blue">접수</span>
|
||||
<span class="status text gray">마감</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- PAGINATION -->
|
||||
<section class="guide_section">
|
||||
<h2>Pagination (페이지)</h2>
|
||||
<div class="page">
|
||||
<a href="#" class="btn_page btn_first"><i></i></a>
|
||||
<a href="#" class="btn_page btn_prev"><i></i></a>
|
||||
<a href="#" class="active">1</a>
|
||||
<a href="#">2</a>
|
||||
<a href="#">3</a>
|
||||
<a href="#" class="btn_page btn_next"><i></i></a>
|
||||
<a href="#" class="btn_page btn_last"><i></i></a>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</body>
|
||||
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<footer class="footer">
|
||||
<div class="inner">
|
||||
<div class="footer_left">
|
||||
<h1 class="footer_logo"><a href="#"><img src="/webapp/publish_side/usr/images/common/footer_logo.png" alt=""></a></h1>
|
||||
<h1 class="footer_logo"><a href="#"><img src="../../usr/images/common/footer_logo.png" alt=""></a></h1>
|
||||
<ul class="link">
|
||||
<li><a href="#">개인정보처리방침</a></li>
|
||||
<li><a href="#">개인정보 침해신고센터</a></li>
|
||||
|
||||
@ -11,20 +11,93 @@
|
||||
</div>
|
||||
<div class="header_container">
|
||||
<div class="inner">
|
||||
<h1 class="logo"><a href="#"><img src="/webapp/publish_side/usr/images/common/logo.png" alt=""></a></h1>
|
||||
<h1 class="logo"><a href="#"><img src="/publish/usr/images/common/logo.png" alt=""></a></h1>
|
||||
<nav>
|
||||
<ul class="gnb">
|
||||
<li>
|
||||
<a href="#" class="depth01">menu1</a>
|
||||
<div class="depth02_container">
|
||||
<!-- <div class="title_wrap">
|
||||
<h2>menu1</h2>
|
||||
</div> -->
|
||||
<ul class="depth02_ul">
|
||||
<li>
|
||||
<a href="#" class="depth02">메뉴1이름</a>
|
||||
<ul class="depth03_ul">
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#" class="depth02">메뉴1이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴1이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴1이름</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="depth01">menu1</a>
|
||||
<div class="depth02_container">
|
||||
<ul class="depth02_ul">
|
||||
<li>
|
||||
<a href="#" class="depth02">메뉴2이름</a>
|
||||
<ul class="depth03_ul">
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#" class="depth02">메뉴2이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴2이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴2이름</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="depth01">menu1</a>
|
||||
<div class="depth02_container">
|
||||
<!-- <div class="title_wrap">
|
||||
<h2>menu1</h2>
|
||||
</div> -->
|
||||
<ul class="depth02_ul">
|
||||
<li>
|
||||
<a href="#" class="depth02">메뉴3이름</a>
|
||||
<ul class="depth03_ul">
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#" class="depth02">메뉴3이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴3이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴3이름</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#" class="depth01">menu1</a>
|
||||
<div class="depth02_container">
|
||||
<!-- <div class="title_wrap">
|
||||
<h2>menu1</h2>
|
||||
</div> -->
|
||||
<ul class="depth02_ul">
|
||||
<li>
|
||||
<a href="#" class="depth02">메뉴4이름</a>
|
||||
<ul class="depth03_ul">
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
<li><a href="#" class="depth03">deptn03메뉴</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#" class="depth02">메뉴4이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴4이름</a></li>
|
||||
<li><a href="#" class="depth02">메뉴4이름</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
@ -21,11 +21,19 @@
|
||||
.header_top .user_menu a::after{position:absolute;content:"";width:1px;height:16px;background:#c5c6cc;right:0;top:3px;}
|
||||
.header_top .user_menu :last-child a::after{display:none;}
|
||||
|
||||
.header_container{width:100%;height:100px;background:#fff;}
|
||||
.header_container{position:relative;width:100%;height:100px;background:#fff;}
|
||||
.header_container .inner{display:flex;height:100%;justify-content:space-between;align-items:center;}
|
||||
.header_container nav,.header_container .gnb{display:flex;}
|
||||
.header_container nav,.header_container .gnb{display:flex;height:100%;}
|
||||
.header_container .gnb{width:calc(100% - 100px);gap:100px;}
|
||||
.header_container .gnb a{padding:0 10px;font-size:20px;font-weight:bold;color:#222;}
|
||||
.header_container .gnb a{display:flex;height:100%;padding:0 10px;font-size:20px;font-weight:bold;color:#222;align-items:center;justify-content:center;}
|
||||
.header_container .depth02_container{position:absolute;width:100%;border-top:1px solid #eeeff4;top:100%;left:0;background:#fff;box-shadow:0 8px 10px rgba(0,0,0,0.05);max-height:0;overflow:hidden;opacity:0;visibility:hidden;transition:max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1),opacity 0.3s ease,transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),visibility 0.4s;}
|
||||
.header_container .active .depth02_container{max-height:100vh;opacity:1;visibility:visible;}
|
||||
.header_container .depth02_ul{display:flex;max-width:1440px;margin:0 auto;padding:40px 0;gap:20px;justify-content:space-between;}
|
||||
.header_container .depth02_ul>li{width:calc(100% / 4);}
|
||||
.header_container a.depth02{display:flex;width:100%;height:50px;font-size:18px;font-weight:400;text-align:center;padding:0 18px;border:2px solid #eeeff4;border-radius:8px;justify-content:center;align-items:center;}
|
||||
.header_container .depth03_ul{display:flex;margin:8px 0 0 0;flex-direction:column;gap:8px;text-align:center;}
|
||||
.header_container .depth03_ul a.depth03{font-size:16px;font-weight:300;}
|
||||
|
||||
|
||||
.header_util{display:flex;gap:12px;align-items:center;}
|
||||
.header_util button{width:40px;height:40px;}
|
||||
|
||||
@ -1,13 +1,28 @@
|
||||
$(function(){
|
||||
$(function () {
|
||||
let hoverTimer;
|
||||
|
||||
$('.gnb > li').on('mouseenter focusin', function () {
|
||||
const $target = $(this);
|
||||
|
||||
// sidemenu
|
||||
$(".depth02_list").slideUp(0);
|
||||
clearTimeout(hoverTimer);
|
||||
|
||||
$(".depth01").click(function(){
|
||||
$(this).toggleClass("active");
|
||||
$(".depth02_list").slideToggle(400);
|
||||
})
|
||||
hoverTimer = setTimeout(() => {
|
||||
$('.gnb > li').removeClass('active');
|
||||
$target.addClass('active');
|
||||
}, 120);
|
||||
});
|
||||
|
||||
$('.gnb > li').on('mouseleave', function () {
|
||||
clearTimeout(hoverTimer);
|
||||
|
||||
})
|
||||
hoverTimer = setTimeout(() => {
|
||||
$(this).removeClass('active');
|
||||
}, 80);
|
||||
});
|
||||
|
||||
// 헤더 전체 영역 밖으로 나가면 닫힘
|
||||
$('.header').on('mouseleave', function () {
|
||||
$('.gnb > li').removeClass('active');
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>리스트 등록</title>
|
||||
<title>게시판 상세</title>
|
||||
|
||||
<!-- css -->
|
||||
<link rel="stylesheet" href="../../../css/reset.css">
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>리스트</title>
|
||||
<title>자주하는 질문</title>
|
||||
|
||||
<!-- css -->
|
||||
<link rel="stylesheet" href="../../../css/reset.css">
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>리스트</title>
|
||||
<title>갤러리형 게시판</title>
|
||||
|
||||
<!-- css -->
|
||||
<link rel="stylesheet" href="../../../css/reset.css">
|
||||
|
||||