분류, 탭 css추가, 탭 전환시 대분류 변경되도록 수정

cks
유민형 2023-12-13 17:58:32 +09:00
parent a4039c9380
commit 7a711025a4
5 changed files with 80 additions and 41 deletions

View File

@ -67,6 +67,7 @@ button {cursor: pointer;}
.w_200 {width: 200px;}
.w_250 {width: 250px;}
.w_300 {width: 300px;}
.w_306 {width: 306px;}
.w_350 {width: 350px;}
.w_400 {width: 400px;}
.w_500 {width: 500px;}

View File

@ -221,13 +221,11 @@ select::-ms-expand {display:none;}
.f_select select {width: 100%; height: 100%; padding: 0 40px 0 20px; border: 0; color: #222; font-size: 16px; background: transparent;}
/* 건설기준코드list 설계기준 표준시방서 전문시방서 통합 다운로드 탭 */
/*.mini_board {position: relative;}
.mini_board .tab::after {content: ""; display: block; clear: both;}
.mini_board .tab li {float: left;}
.mini_board .tab li + li {margin-left: 40px;}
.mini_board .tab li a {display: block; position: relative; padding-bottom: 12px; color: #ccc; font-size: 30px; font-weight: 700;}
.mini_board .tab li a.on {color: #222;}
.mini_board .tab li a.on::after {content: ""; display: block; position: absolute; left: 0; bottom: 0; width: 100%; height: 4px; background: #0465be;}*/
.right_col {display: flex; justify-content: space-between; align-items: center;}
.mini_board ul {display: flex; list-style: none; padding: 0; margin: 0;}
.tab {padding: 10px; margin-right: 10px; cursor: pointer; border: 1px solid #ccc; border-radius: 5px; transition: background-color 0.3s;}
.tab:hover {background-color: #f0f0f0;}
.active {background-color: #007bff; color: #fff;}
.f_input {height: 46px; padding: 0 20px; border: 0; border-radius: 5px; color: #222; font-size: 16px; background: #f7f7f7;}
.f_input2 {height: 46px; padding: 0 20px; border: 1px solid #dde2e5; border-radius: 5px !important; color: #222; font-size: 16px; background: #fff;}

View File

@ -71,6 +71,7 @@ function StandardCodeList(props) {
const category1Ref = useRef();
const category2Ref = useRef();
const category3Ref = useRef();
const wrdRef = useRef();
// eslint-disable-next-line no-unused-vars
@ -86,7 +87,8 @@ function StandardCodeList(props) {
/* 검색기능 추가 변수*/
const [listdata, setlistdata] = useState([]);
const [filterData, setfilterData] = useState('');
const [categoryList, setCategoryList] = useState([]);
const [category2List, setCategory2List] = useState([]);
const [category3List, setCategory3List] = useState([]);
const [resultCnt, setResultCnt] = useState(0);
/* 탭 */
@ -95,13 +97,17 @@ function StandardCodeList(props) {
const handleTabClick = (tabName) => {
setActiveTab(tabName);
retrieveList({
const updatedCondition = {
...searchCondition,
tab: tabName,
category1: category1Ref.current.value,
category2: category2Ref.current.value,
searchWrd: wrdRef.current.value
});
category1: '',
category2: '',
category3: '',
searchWrd: '',
};
setSearchCondition(updatedCondition);
retrieveList(updatedCondition);
};
const retrieveList = useCallback((searchCondition) => {
@ -122,7 +128,8 @@ function StandardCodeList(props) {
setMasterBoard(resp.result.tnDocumentInfo);
/*검색을 위한 리스트 state에 저장*/
setlistdata(resp.result.resultList);
setCategoryList(resp.result.categoryList);
setCategory2List(resp.result.category2List);
setCategory3List(resp.result.category3List);
setResultCnt(resp.result.resultCnt);
//
},
@ -171,7 +178,7 @@ function StandardCodeList(props) {
<div className="condition">
<ul>
<li className="third_2 R">
<span className="f_search w_500">
<span className="f_search w_200">
<input type="text" name="" defaultValue={searchCondition.searchWrd} placeholder="코드명" ref={wrdRef}
onChange={e => {
setfilterData(e.target.value);
@ -185,10 +192,20 @@ function StandardCodeList(props) {
</li>
<li className="third_1 L">
<label className="f_select" htmlFor="sel1">
<select id="sel1" title="조건" defaultValue={listCode.substring(2, 4)} ref={category1Ref}
<span>{searchCondition.category1}</span>
<select id="sel1" title="조건" value={searchCondition.category1} ref={category1Ref}
onChange={e => {
category1Ref.current.value = e.target.value;
retrieveList({...searchCondition, pageIndex: 1, category1: category1Ref.current.value, category2: '', searchWrd: wrdRef.current.value, tab: activeTab});
const updatedCondition = {
...searchCondition,
category1: e.target.value,
category2: '',
category3: '',
searchWrd: wrdRef.current.value,
tab: activeTab
};
setSearchCondition(updatedCondition);
retrieveList(updatedCondition);
}}
>
<option value="">전체</option>
@ -198,41 +215,53 @@ function StandardCodeList(props) {
</label>
</li>
<li className="third_1 L">
<label className="f_select" htmlFor="sel1">
<label className="f_select w_306" htmlFor="sel1">
<select id="sel2" title="조건" value={searchCondition.category2} ref={category2Ref}
onChange={e => {
category2Ref.current.value = e.target.value;
retrieveList({
const updatedCondition = {
...searchCondition,
pageIndex: 1,
category1: category1Ref.current.value,
category2: category2Ref.current.value,
category3: '',
searchWrd: wrdRef.current.value,
tab: activeTab
});
};
setSearchCondition(updatedCondition);
retrieveList(updatedCondition);
}}
>
<option value="">전체</option>
{categoryList.map(category => (
{category2List.map(category => (
<option key={category.groupSeq} value={category.groupFullCd.substring(4, 6)}>{category.groupNm}</option>
))}
</select>
</label>
</li>
{/*<li className="third_1 L">
<label className="f_select" htmlFor="sel1">
<select id="sel3" title="조건" defaultValue={searchCondition.category1} ref={category1Ref}
<li className="third_1 L">
<label className="f_select w_306" htmlFor="sel1">
<select id="sel3" title="조건" value={searchCondition.category3} ref={category3Ref}
onChange={e => {
category1Ref.current.value = e.target.value;
retrieveList({...searchCondition, pageIndex: 1, category1: category1Ref.current.value, searchWrd: wrdRef.current.value});
const updatedCondition = {
...searchCondition,
category1: category1Ref.current.value,
category2: category2Ref.current.value,
category3: category3Ref.current.value,
searchWrd: wrdRef.current.value,
tab: activeTab
};
setSearchCondition(updatedCondition);
retrieveList(updatedCondition);
}}
>
<option value="10">전체</option>
<option value="1010">공통편</option>
<option value="1020">시설물편</option>
<option value="">전체</option>
{category3List.map(category => (
<option key={category.groupSeq} value={category.groupFullCd.substring(6, 8)}>{category.groupNm}</option>
))}
</select>
</label>
</li>*/}
</li>
</ul>
</div>
{/* <!--// 검색조건 --> */}

View File

@ -157,19 +157,28 @@ public class StandardCodeController extends BaseController {
paginationInfo.setPageSize(propertyService.getInt("Globals.pageSize"));
resultMap.put("paginationInfo", paginationInfo);
System.out.println("@@@ tab : " + tnDocumentInfo.getTab());
System.out.println("@@@ category1 : " + tnDocumentInfo.getCategory1());
System.out.println("@@@ category2 : " + tnDocumentInfo.getCategory2());
String tab = tnDocumentInfo.getTab() != null ? tnDocumentInfo.getTab() : "";
String category1 = tnDocumentInfo.getCategory1() != null ? tnDocumentInfo.getCategory1() : "";
String category2 = tnDocumentInfo.getCategory2() != null ? tnDocumentInfo.getCategory2() : "";
String category3 = tnDocumentInfo.getCategory3() != null ? tnDocumentInfo.getCategory3() : "";
System.out.println("@@@ tab : " + tab);
System.out.println("@@@ category1 : " + category1);
System.out.println("@@@ category2 : " + category2);
System.out.println("@@@ category3 : " + category3);
System.out.println("@@@ searchWrd : " + tnDocumentInfo.getSearchWrd());
tnDocumentInfo.setListCode(tnDocumentInfo.getTab() + tnDocumentInfo.getCategory1() + tnDocumentInfo.getCategory2());
Integer groupFullCd = standardCodeService.selectStandardCodeGroupSeq(tnDocumentInfo.getTab() + tnDocumentInfo.getCategory1());
System.out.println("@@@ groupFullCd : " + groupFullCd);
/* 대분류 category1(하드코딩) 중분류 category2 소분류 category3 */
Integer categorySeq2 = standardCodeService.selectStandardCodeGroupSeq(tab + category1);
Integer categorySeq3 = standardCodeService.selectStandardCodeGroupSeq(tab + category1 + category2);
System.out.println("@@@ categorySeq2 : " + categorySeq2);
System.out.println("@@@ categorySeq3 : " + categorySeq3);
resultMap.put("category2List", standardCodeService.selectStandardCodeCategoryList(categorySeq2));
resultMap.put("category3List", standardCodeService.selectStandardCodeCategoryList(categorySeq3));
tnDocumentInfo.setListCode(tab + category1 + category2 + category3);
List<TnDocumentCodeList> tnDocumentCodeList = standardCodeService.selectStandardCodeList(tnDocumentInfo);
resultMap.put("resultList", tnDocumentCodeList);
resultMap.put("categoryList", standardCodeService.selectStandardCodeCategoryList(groupFullCd));
Integer totCnt = tnDocumentCodeList.get(0).getContentcount();
System.out.println("@@@ resultCnt : " + totCnt);
resultMap.put("resultCnt", totCnt);

View File

@ -113,4 +113,6 @@ public class TnDocumentInfo {
private String category1;
@Transient
private String category2;
@Transient
private String category3;
}