detail.js에 넣어야하는 요구사항 전체 리스트 출력관련 소스

2023년 9월 20일

출처:

Requirement 등록 관리

Untitled

<aside> 💡 요구사항 상세 정보 javascript - detail.js, html - detail.html에 추가되어야할 내용 by reqAdd.js, reqAdd.html

</aside>

등록관리에서 가져온 트리형태를 만들기 위해 필요한 화면단

<div    id="req_tree"
        style="padding-top: 5px; overflow: hidden"
        class="darkBack">
</div>

이곳에 출력되는 tree 형태의 데이터 출력 호출부, 정의부

// 탭 클릭 시 호출
build_ReqData_By_PdService();

// 함수 정의
function build_ReqData_By_PdService() {
	  // div id값
		var jQueryElementID = "#req_tree";
	  // api 호출
		var serviceNameForURL = "/auth-user/api/arms/reqAdd/T_ARMS_REQADD_" + $("#selected_pdService").val();
	
	  // common.js에 정의되어있는 함수
		jsTreeBuild(jQueryElementID, serviceNameForURL);
}

tree에 클릭 이벤트가 발생 시 실행되어 우측 디테일 페이지가 보이는 부분

function jsTreeClick(selectedNode) {
	console.log("[ reqAdd :: jsTreeClick ] :: selectedNode ");
	console.log(selectedNode);

	selectedJsTreeId = selectedNode.attr("id").replace("node_", "").replace("copy_", "");
	selectedJsTreeName = $("#req_tree").jstree("get_selected").text();
	if (selectedJsTreeId == 2) {
		$("#select_Req").text("루트 요구사항이 선택되었습니다.");
	} else {
		$("#select_Req").text($("#req_tree").jstree("get_selected").text());
	}
	var selectRel = selectedNode.attr("rel");

	//요구사항 타입에 따라서 탭의 설정을 변경 (삭제예정)
	if (selectRel == "folder" || selectRel == "drive") {
		$("#folder_tab").get(0).click();
		$(".newReqDiv").show();
		$(".widget-tabs").children("header").children("ul").children("li:nth-child(1)").show(); //상세보기
		$(".widget-tabs").children("header").children("ul").children("li:nth-child(3)").show(); //리스트보기
		$(".widget-tabs").children("header").children("ul").children("li:nth-child(4)").show(); //문서로보기

		// 리스트로 보기(DataTable) 설정 ( 폴더나 루트니까 )
		// 상세보기 탭 셋팅이 데이터테이블 렌더링 이후 시퀀스 호출 함.
    // 박현민 - 폴더 일 때 이부분 어떻게 바뀌는지 확인하고 어떻게 바꿀지 고민해야함
		dataTableLoad(selectedJsTreeId, selectRel);
	} else {
		$("#default_tab").get(0).click();
		$(".newReqDiv").hide();
		$(".widget-tabs").children("header").children("ul").children("li:nth-child(1)").show(); //상세보기
		$(".widget-tabs").children("header").children("ul").children("li:nth-child(2)").show(); //편집하기
		$(".widget-tabs").children("header").children("ul").children("li:nth-child(3)").hide(); //리스트보기
		$(".widget-tabs").children("header").children("ul").children("li:nth-child(4)").hide(); //문서로보기
		$(".widget-tabs").children("header").children("ul").children("li:nth-child(5)").show(); //JIRA연결설정

		//이전에 화면에 렌더링된 데이터 초기화
		// ------------------ 편집하기 ------------------ //
		// bindDataEditlTab(data);
		// // ------------------ 상세보기 ------------------ //
		// bindDataDetailTab(data);
		//상세보기 탭 셋팅
		setDetailAndEditViewTab();
		// defaultType_dataTableLoad(selectedJsTreeId);
	}

	//파일 데이터셋팅
	//get_FileList_By_Req();
}

function dataTableLoad(selectId, selectRel) {
	console.log("dataTableLoad - selectRel:::" + selectRel);
	console.log("dataTableLoad - selectId:::" + selectId);
	// 데이터 테이블 컬럼 및 열그룹 구성
	var tableName = "T_ARMS_REQADD_" + $("#selected_pdService").val();

	var c_type = $("#req_tree").jstree("get_selected").attr("rel");
	console.log("dataTableLoad - c_type:::" + c_type);

	var dataTableRef;
	if (selectId == 2) {
		// 데이터 테이블 컬럼 및 열그룹 구성
		var columnList = [
			{ data: "c_id", defaultContent: "-" },
			{ data: "c_left", defaultContent: "-" },
			{ data: "c_title", defaultContent: "-" }
		];
		var rowsGroupList = [];
		var columnDefList = [];
		var selectList = {};
		var orderList = [[1, "asc"]];
		var buttonList = [];

		var jquerySelector = "#req_table";
		var ajaxUrl = "/auth-user/api/arms/reqAdd/" + tableName + "/getMonitor.do";
		var jsonRoot = "";
		var isServerSide = false;

    // common.js 호출
		dataTableRef = dataTable_build(
			jquerySelector,
			ajaxUrl,
			jsonRoot,
			columnList,
			rowsGroupList,
			columnDefList,
			selectList,
			orderList,
			buttonList,
			isServerSide
		);
	} else if(selectRel !== "folder") {
		//select node 정보를 가져온다.
		console.log("tableName:: " + tableName);
		$.ajax({
			url: "/auth-user/api/arms/reqAdd/" + tableName + "/getNode.do?c_id=" + selectId,
			type: "GET",
			contentType: "application/json;charset=UTF-8",
			dataType: "json",
			progress: true,
			success: function (data) {
				// 데이터 테이블 컬럼 및 열그룹 구성
				var columnList = [
					{ data: "c_id", defaultContent: "-" },
					{ data: "c_left", defaultContent: "-" },
					{ data: "c_title", defaultContent: "-" }
				];
				var rowsGroupList = [];
				var columnDefList = [];
				var selectList = {};
				var orderList = [[1, "asc"]];
				var buttonList = [];

				var jquerySelector = "#req_table";
				var ajaxUrl = "/auth-user/api/arms/reqAdd/" + tableName + "/getChildNodeWithParent.do";
				var jsonRoot = "";
				var paramUrl = "?c_id=313&c_left=" + data.c_left + "&c_right=" + data.c_right;
				ajaxUrl = ajaxUrl + paramUrl;
				var isServerSide = false;

        // common.js 호출
				dataTableRef = dataTable_build(
					jquerySelector,
					ajaxUrl,
					jsonRoot,
					columnList,
					rowsGroupList,
					columnDefList,
					selectList,
					orderList,
					buttonList,
					isServerSide
				);
			}
		})
			.done(function (data) {})
			.fail(function (e) {})
			.always(function () {});
	} else {
		console.log("folder clicked");
		var columnList = [
			{ data: "c_id", defaultContent: "-" },
			{ data: "c_left", defaultContent: "-" },
			{ data: "c_title", defaultContent: "-" }
		];
		var rowsGroupList = [];
		var columnDefList = [];
		var selectList = {};
		var orderList = [];
		var buttonList = [];

		var jquerySelector = "#req_table";
		var ajaxUrl = "/auth-user/api/arms/reqAdd/" + tableName + "/getChildNodeWithParent.do?c_id="+selectId;
		var jsonRoot = "";
		var isServerSide = false;

    // common.js 호출
		dataTableRef = dataTable_build(
			jquerySelector,
			ajaxUrl,
			jsonRoot,
			columnList,
			rowsGroupList,
			columnDefList,
			selectList,
			orderList,
			buttonList,
			isServerSide
		);

	}
}


function setDetailAndEditViewTab() {
	console.log("Detail Tab ::::")
	var tableName = "T_ARMS_REQADD_" + $("#selected_pdService").val();
	$.ajax({
		url: "/auth-user/api/arms/reqAdd/" + tableName + "/getNode.do?c_id=" + selectedJsTreeId,
		type: "GET",
		contentType: "application/json;charset=UTF-8",
		dataType: "json",
		progress: true
	})
		.done(function (data) {
      // 박현민 - 여기를 수정해야
			// ------------------ 상세보기 ------------------ //
			bindDataDetailTab(data);
		})
		.fail(function (e) {})
		.always(function () {});
}

//  박현민 - ------------------ 상세보기 ------------------ //
function bindDataDetailTab(ajaxData) {
	console.log(ajaxData);

	//제품(서비스) 데이터 바인딩
	var selectedPdServiceText = $("#selected_pdService").select2("data")[0].text;
	if (isEmpty(selectedPdServiceText)) {
		$("#detailview_req_pdservice_name").val("");
	} else {
		$("#detailview_req_pdservice_name").val(selectedPdServiceText);
	}

	//Version 데이터 바인딩
	var selectedVersionText = $("#edit_multi_version").multipleSelect("getSelects", "text");
	if (isEmpty(selectedVersionText)) {
		$("#detailview_req_pdservice_version").val("요구사항에 등록된 버전이 없습니다.");
	} else {
		$("#detailview_req_pdservice_version").val(selectedVersionText);
	}
	$("#detailview_req_id").val(ajaxData.c_id);
	$("#detailview_req_name").val(ajaxData.c_title);

	//우선순위 셋팅
	$("#detailview_req_priority").children(".btn.active").removeClass("active");
	var select_Req_Priority_ID = "detailView-req-priority-option" + ajaxData.c_priority;
	$("#" + select_Req_Priority_ID)
		.parent()
		.addClass("active");

	$("#detailview_req_status").val(ajaxData.c_req_status);
	$("#detailview_req_writer").val(ajaxData.c_req_writer);
	$("#detailview_req_write_date").val(new Date(ajaxData.c_req_create_date).toLocaleString());

	if (ajaxData.c_req_reviewer01 == null || ajaxData.c_req_reviewer01 == "none") {
		$("#detailview_req_reviewer01").val("리뷰어(연대책임자)가 존재하지 않습니다.");
	} else {
		$("#detailview_req_reviewer01").val(ajaxData.c_req_reviewer01);
	}
	if (ajaxData.c_req_reviewer02 == null || ajaxData.c_req_reviewer02 == "none") {
		$("#detailview_req_reviewer02").val("2번째 리뷰어(연대책임자) 없음");
	} else {
		$("#detailview_req_reviewer02").val(ajaxData.c_req_reviewer02);
	}
	if (ajaxData.c_req_reviewer03 == null || ajaxData.c_req_reviewer03 == "none") {
		$("#detailview_req_reviewer03").val("3번째 리뷰어(연대책임자) 없음");
	} else {
		$("#detailview_req_reviewer03").val(ajaxData.c_req_reviewer03);
	}
	if (ajaxData.c_req_reviewer04 == null || ajaxData.c_req_reviewer04 == "none") {
		$("#detailview_req_reviewer04").val("4번째 리뷰어(연대책임자) 없음");
	} else {
		$("#detailview_req_reviewer04").val(ajaxData.c_req_reviewer04);
	}
	if (ajaxData.c_req_reviewer05 == null || ajaxData.c_req_reviewer05 == "none") {
		$("#detailview_req_reviewer05").val("5번째 리뷰어(연대책임자) 없음");
	} else {
		$("#detailview_req_reviewer05").val(ajaxData.c_req_reviewer05);
	}
	//$("#detailview_req_contents").html(ajaxData.c_req_contents);

	CKEDITOR.instances.detailview_req_contents.setData(ajaxData.c_req_contents);
}

number	Method	URL
1	GET	http://www.a-rms.net/313devgrp/arms/template.html?page=reqAdd
2	GET	~~http://www.a-rms.net/313devgrp/arms/css/override.css
http://www.a-rms.net/dwr/engine.js
http://www.a-rms.net/dwr/util.js
http://www.a-rms.net/dwr/interface/Chat.js~~
3	GET	http://www.a-rms.net/auth-user/me
4	GET	~~http://www.a-rms.net/313devgrp/arms/js/reqAdd.js?_=1694933084528
http://www.a-rms.net/313devgrp/arms/img/313_logo.png~~
5	POST	~~http://www.a-rms.net/dwr/call/plainpoll/ReverseAjax.dwr
http://www.a-rms.net/dwr/call/plaincall/Chat.login.dwr~~
6	GET	http://www.a-rms.net/auth-user/api/arms/reqAdd/getFilesByNode.do
7	GET	http://www.a-rms.net/auth-user/api/arms/pdService/getPdServiceMonitor.do
8	GET	http://www.a-rms.net/auth-user/api/arms/pdService/getVersionList.do?c_id=13
9	GET	http://www.a-rms.net/auth-user/api/arms/reqAdd/T_ARMS_REQADD_13/getChildNode.do?c_id=1&_=1694934803361
http://www.a-rms.net/auth-user/api/arms/reqAdd/T_ARMS_REQADD_13/getChildNode.do?c_id=2&_=1694934803362

요구사항 등록 관리 페이지 접근
~~css, js 등 파일 로드~~
미들 프록시에 로그인되었는지 확인 api 호출
~~js, img 파일 로드~~
~~dwr 파일 로드~~
노드의 파일을 가져오는 API 호출