From 45ed9e42a8802345c300ca9531287defc632c456 Mon Sep 17 00:00:00 2001
From: Kurt92 <chcch1234@gmail.com>
Date: Fri, 18 Nov 2022 17:04:10 +0900
Subject: [PATCH] feat : bottom sheet

---
 .../fims/biz/rt/mapper/IRt100MgtMapper.java   |  20 ++
 .../fims/biz/rt/service/IRt100MgtService.java |  34 ++++
 .../fims/biz/rt/service/Rt100MgtService.java  |  46 +++++
 .../fims/biz/rt/web/Rt100MgtController.java   |  78 ++++++++
 .../sqlmapper/biz/rt/rt-100-mysql-mapper.xml  | 109 +++++++++++
 .../biz/sample/sample2-mysql-mapper.xml       |   2 +-
 .../WEB-INF/jsp/fims/biz/rt/rt100MgtForm.jsp  | 171 ++++++++++++++++++
 .../WEB-INF/jsp/fims/biz/rt/rt100MgtPopup.jsp | 140 ++++++++++++++
 .../jsp/fims/biz/sample/sampleForm2.jsp       | 115 +++++++++++-
 .../framework/js/cmm/cmmBottomSheet.js        |  25 +++
 10 files changed, 731 insertions(+), 9 deletions(-)
 create mode 100644 src/main/java/kr/xit/fims/biz/rt/mapper/IRt100MgtMapper.java
 create mode 100644 src/main/java/kr/xit/fims/biz/rt/service/IRt100MgtService.java
 create mode 100644 src/main/java/kr/xit/fims/biz/rt/service/Rt100MgtService.java
 create mode 100644 src/main/java/kr/xit/fims/biz/rt/web/Rt100MgtController.java
 create mode 100644 src/main/resources/sqlmapper/biz/rt/rt-100-mysql-mapper.xml
 create mode 100644 src/main/webapp/WEB-INF/jsp/fims/biz/rt/rt100MgtForm.jsp
 create mode 100644 src/main/webapp/WEB-INF/jsp/fims/biz/rt/rt100MgtPopup.jsp
 create mode 100644 src/main/webapp/resources/framework/js/cmm/cmmBottomSheet.js

diff --git a/src/main/java/kr/xit/fims/biz/rt/mapper/IRt100MgtMapper.java b/src/main/java/kr/xit/fims/biz/rt/mapper/IRt100MgtMapper.java
new file mode 100644
index 00000000..19373cfa
--- /dev/null
+++ b/src/main/java/kr/xit/fims/biz/rt/mapper/IRt100MgtMapper.java
@@ -0,0 +1,20 @@
+package kr.xit.fims.biz.rt.mapper;
+
+import egovframework.rte.psl.dataaccess.mapper.Mapper;
+import kr.xit.framework.biz.mng.code.model.XitClCodeMngVO;
+import org.apache.ibatis.session.RowBounds;
+
+import java.util.List;
+import java.util.Map;
+
+
+@Mapper
+public interface IRt100MgtMapper {
+
+	List<XitClCodeMngVO> selectCmmnClCodes(final Map<String, Object> paraMap, final RowBounds rowBounds);
+	XitClCodeMngVO selectCmmnClCode(final String clCode);
+
+	int insertCmmnClCode(final XitClCodeMngVO vo);
+	int updateCmmnClCode(final XitClCodeMngVO vo);
+	int deleteCmmnClCode(final String clCode);
+}
diff --git a/src/main/java/kr/xit/fims/biz/rt/service/IRt100MgtService.java b/src/main/java/kr/xit/fims/biz/rt/service/IRt100MgtService.java
new file mode 100644
index 00000000..68c09558
--- /dev/null
+++ b/src/main/java/kr/xit/fims/biz/rt/service/IRt100MgtService.java
@@ -0,0 +1,34 @@
+package kr.xit.fims.biz.rt.service;
+
+import kr.xit.framework.biz.mng.code.model.XitClCodeMngVO;
+import kr.xit.framework.core.utils.XitCmmnUtil;
+import org.apache.ibatis.session.RowBounds;
+
+import java.util.List;
+import java.util.Map;
+
+/**
+ * 
+ * @업무그룹명: 분류코드관리 Service 
+ * @설명: 
+ * @최초작성일: 2020. 4. 16. 오전 9:38:56
+ * @최초작성자: 박민규
+ * @author (주)엑스아이티 개발팀
+ * @since 2002. 2. 2.
+ * @version 1.0 Copyright(c) XIT All rights reserved.
+ */
+public interface IRt100MgtService {
+
+
+	List<XitClCodeMngVO> findCodeCfns(final Map<String, Object> paraMap, final RowBounds rowBounds);
+
+	void addCodeCfn(final XitClCodeMngVO vo);
+
+	void modifyCodeCfn(final XitClCodeMngVO vo);
+
+	void removeCodeCfn(final String clCode);
+
+	default String getUserUniqId(){
+		return XitCmmnUtil.getUserUniqId();
+	}
+}
diff --git a/src/main/java/kr/xit/fims/biz/rt/service/Rt100MgtService.java b/src/main/java/kr/xit/fims/biz/rt/service/Rt100MgtService.java
new file mode 100644
index 00000000..4e6d0aff
--- /dev/null
+++ b/src/main/java/kr/xit/fims/biz/rt/service/Rt100MgtService.java
@@ -0,0 +1,46 @@
+package kr.xit.fims.biz.rt.service;
+
+import kr.xit.fims.biz.rt.mapper.IRt100MgtMapper;
+import kr.xit.framework.biz.cache.service.ICacheService;
+import kr.xit.framework.biz.mng.code.mapper.ICodeCfnMgtMapper;
+import kr.xit.framework.biz.mng.code.mapper.ICodeGrpMgtMapper;
+import kr.xit.framework.biz.mng.code.model.XitClCodeMngVO;
+import kr.xit.framework.biz.mng.code.service.ICodeCfnMgtService;
+import kr.xit.framework.support.exception.BizRuntimeException;
+import kr.xit.framework.support.util.constants.MessageKey;
+import lombok.RequiredArgsConstructor;
+import org.apache.ibatis.session.RowBounds;
+import org.springframework.stereotype.Service;
+
+import java.util.List;
+import java.util.Map;
+
+//TODO : 캐쉬 반영
+@RequiredArgsConstructor
+@Service
+public class Rt100MgtService implements IRt100MgtService {
+
+	private final IRt100MgtMapper mapper;
+
+	@Override
+	public List<XitClCodeMngVO> findCodeCfns(final Map<String, Object> paraMap, final RowBounds rowBounds) {
+		return mapper.selectCmmnClCodes(paraMap, rowBounds);
+	}
+
+	@Override
+	public void addCodeCfn(final XitClCodeMngVO vo) {
+		vo.setFrstRegisterId(getUserUniqId());
+		mapper.insertCmmnClCode(vo);
+	}
+
+	@Override
+	public void modifyCodeCfn(final XitClCodeMngVO vo) {
+		vo.setLastUpdusrId(getUserUniqId());
+		mapper.updateCmmnClCode(vo);
+	}
+
+	@Override
+	public void removeCodeCfn(final String clCode) {
+		mapper.deleteCmmnClCode(clCode);
+	}
+}
diff --git a/src/main/java/kr/xit/fims/biz/rt/web/Rt100MgtController.java b/src/main/java/kr/xit/fims/biz/rt/web/Rt100MgtController.java
new file mode 100644
index 00000000..cb718641
--- /dev/null
+++ b/src/main/java/kr/xit/fims/biz/rt/web/Rt100MgtController.java
@@ -0,0 +1,78 @@
+package kr.xit.fims.biz.rt.web;
+
+import kr.xit.fims.biz.cmm.FimsConst;
+import kr.xit.fims.biz.rt.service.IRt100MgtService;
+import kr.xit.framework.biz.mng.code.model.XitClCodeMngVO;
+import kr.xit.framework.biz.mng.code.service.ICodeCfnMgtService;
+import kr.xit.framework.core.constants.FrameworkConstants;
+import kr.xit.framework.core.model.ResultResponse;
+import kr.xit.framework.support.mybatis.MybatisUtils;
+import kr.xit.framework.support.util.AjaxMessageMapRenderer;
+import kr.xit.framework.support.util.ValidationError;
+import kr.xit.framework.support.util.constants.MessageKey;
+import lombok.RequiredArgsConstructor;
+import org.springframework.stereotype.Controller;
+import org.springframework.validation.BindingResult;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestParam;
+import org.springframework.web.servlet.ModelAndView;
+
+import java.util.Map;
+
+@RequiredArgsConstructor
+@Controller
+@RequestMapping("/fims/biz/rt")
+public class Rt100MgtController {
+	
+	private final IRt100MgtService service;
+
+	@RequestMapping(value = "/rt100MgtForm")
+	public void mngCodeCfnMgtForm() {
+	}
+
+	@RequestMapping(value = "/rt100MgtPopup")
+	public ModelAndView mngCodeCfnMgtPopup(final XitClCodeMngVO vo) {
+		ModelAndView mav = new ModelAndView();
+
+		mav.addObject("cmmnClCode", vo);
+		mav.addObject("pageTitle", "RT100 등록 / 변경");
+		mav.setViewName(FimsConst.FIMS_JSP_BASE_PATH + "rt/rt100MgtPopup.popup");
+		return mav;
+	}
+
+	@GetMapping(value = "/findRt100s")
+	public ModelAndView findRt100s(@RequestParam final Map<String, Object> paraMap){
+		return ResultResponse.of(service.findCodeCfns(paraMap, MybatisUtils.getPagingInfo(paraMap)));
+	}
+
+	@PostMapping(value = "/addRt100")
+	public ModelAndView addRt100(final XitClCodeMngVO vo, final BindingResult bindingResult){
+		ModelAndView mav = new ModelAndView(FrameworkConstants.JSON_VIEW);
+
+		ValidationError.of("cmmnClCode", vo, bindingResult);
+		service.addCodeCfn(vo);
+		AjaxMessageMapRenderer.success(mav, MessageKey.CMM_INSERT_SUCCESS);
+		return mav;
+	}
+
+	@PostMapping(value = "/modifyRt100")
+	public ModelAndView modifyRt1000(final XitClCodeMngVO vo, final BindingResult bindingResult){
+		ModelAndView mav = new ModelAndView(FrameworkConstants.JSON_VIEW);
+
+		ValidationError.of("cmmnClCode", vo, bindingResult);
+		service.modifyCodeCfn(vo);
+		AjaxMessageMapRenderer.success(mav, MessageKey.CMM_UPDATE_SUCCESS);
+		return mav;
+	}
+
+	@PostMapping(value = "/removeRt100")
+	public ModelAndView removeRt100(final String clCode){
+		ModelAndView mav = new ModelAndView(FrameworkConstants.JSON_VIEW);
+
+		service.removeCodeCfn(clCode);
+		AjaxMessageMapRenderer.success(mav, MessageKey.CMM_DELETE_SUCCESS);
+		return mav;
+	}
+}
diff --git a/src/main/resources/sqlmapper/biz/rt/rt-100-mysql-mapper.xml b/src/main/resources/sqlmapper/biz/rt/rt-100-mysql-mapper.xml
new file mode 100644
index 00000000..54ceeb71
--- /dev/null
+++ b/src/main/resources/sqlmapper/biz/rt/rt-100-mysql-mapper.xml
@@ -0,0 +1,109 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
+
+<mapper namespace="kr.xit.fims.biz.rt.mapper.IRt100MgtMapper">
+
+	<!-- *************************************************************************************************************
+	* xit_cmmn_cl_code : 분류 코드
+	************************************************************************************************************** -->
+	<sql id="sqlCmmnClCode">
+		SELECT cl_code
+		     , cl_code_nm
+		     , cl_code_dc
+		     , use_at
+		     , frst_regist_pnttm
+		     , frst_register_id
+		     , last_updt_pnttm
+		     , last_updusr_id
+		  FROM xit_cmmn_cl_code
+		<where>
+			<if test="@kr.xit.framework.core.utils.XitCmmnUtil@notEmpty(clCode)">
+		   AND INSTR(cl_code, #{clCode}) > 0
+			</if>
+			<if test="@kr.xit.framework.core.utils.XitCmmnUtil@notEmpty(clCodeNm)">
+		   AND INSTR(cl_code_nm, #{clCodeNm}) > 0
+			</if>
+		</where>
+	</sql>
+
+	<select id="selectCmmnClCodes" resultType="kr.xit.framework.biz.mng.code.model.XitClCodeMngVO">
+		/* code-cfn-mysql-mapper|selectCmmnClCodes-분류코드 목록 조회|julim */
+		SELECT xui.esntl_id AS uniqId
+		, 'USR03' AS userTy
+		, xui.user_id
+		, xui.user_nm
+		, xui.email_adres
+		, xui.area_no
+		, xui.house_middle_telno
+		, xui.house_end_telno
+		, xui.mbtlnum
+		, xui.group_id
+		, xui.user_sttus_code
+		, xui.sbscrb_de
+		, cdc.code_nm AS userSttusCodeNm
+		FROM xit_user_info xui
+		LEFT OUTER JOIN xit_cmmn_detail_code cdc
+		ON cdc.code_id = 'XIT013'
+		AND xui.user_sttus_code = cdc.code
+		<where>
+			<if test="@kr.xit.framework.core.utils.XitCmmnUtil@notEmpty(sbscrbSttus)">
+				AND xui.user_sttus_code = #{sbscrbSttus}
+			</if>
+			<if test="@kr.xit.framework.core.utils.XitCmmnUtil@notEmpty(searchKeyword)">
+				<choose>
+					<when test="searchCondition eq 'userId'">
+						AND INSTR(xui.user_id, #{searchKeyword}) > 0
+					</when>
+					<when test="searchCondition eq 'userNm'">
+						AND INSTR(xui.user_nm, #{searchKeyword}) > 0
+					</when>
+				</choose>
+			</if>
+		</where>
+		ORDER BY sbscrb_de DESC
+	</select>
+
+	<select id="selectCmmnClCode" resultType="kr.xit.framework.biz.mng.code.model.XitClCodeMngVO">
+		/* code-cfn-mysql-mapper|selectCmmnClCode-분류코드 정보 조회|julim */
+		<include refid="sqlCmmnClCode"/>
+	</select>
+
+	<insert id="insertCmmnClCode">
+		/* code-cfn-mysql-mapper|insertCmmnClCode-분류코드 정보 등록|julim */
+		INSERT
+		  INTO xit_cmmn_cl_code (
+		  	cl_code
+		  	, cl_code_nm
+		  	, cl_code_dc
+		  	, use_at
+		  	, frst_regist_pnttm
+		  	, frst_register_id
+		) VALUE (
+		  	#{clCode}
+		    , #{clCodeNm}
+		    , #{clCodeDc}
+		    , #{useAt}
+		    , NOW()
+		    , #{frstRegisterId}
+		)
+	</insert>
+
+	<update id="updateCmmnClCode">
+		/* code-cfn-mysql-mapper|updateCmmnClCode-분류코드 정보 변경|julim */
+		UPDATE xit_cmmn_cl_code
+           SET cl_code_nm = IF(cl_code_nm = #{clCodeNm}, cl_code_nm, #{clCodeNm})
+             , cl_code_dc = IF(cl_code_dc = #{clCodeDc}, cl_code_dc, #{clCodeDc})
+             , use_at = #{useAt}
+             , last_updt_pnttm = NOW()
+             , last_updusr_id = #{lastUpdusrId}
+         WHERE cl_code = #{clCode}
+	</update>
+
+	<delete id="deleteCmmnClCode">
+		/* code-cfn-mysql-mapper|deleteCmmnClCode-분류코드 정보 삭제|julim */
+		DELETE
+          FROM xit_cmmn_cl_code
+         WHERE cl_code = #{clCode}
+	</delete>
+
+</mapper>
diff --git a/src/main/resources/sqlmapper/biz/sample/sample2-mysql-mapper.xml b/src/main/resources/sqlmapper/biz/sample/sample2-mysql-mapper.xml
index 2fe2320a..dac31da2 100644
--- a/src/main/resources/sqlmapper/biz/sample/sample2-mysql-mapper.xml
+++ b/src/main/resources/sqlmapper/biz/sample/sample2-mysql-mapper.xml
@@ -14,7 +14,7 @@
 			, col_no4
 		from tb_sample
 		where 1=1
-		<if test = "sch_word != null || sch_word != ''">
+		<if test = "sch_word != null and sch_word != ''">
 			and col_nm = #{sch_word}
 		</if>
 	</select>
diff --git a/src/main/webapp/WEB-INF/jsp/fims/biz/rt/rt100MgtForm.jsp b/src/main/webapp/WEB-INF/jsp/fims/biz/rt/rt100MgtForm.jsp
new file mode 100644
index 00000000..82e8b269
--- /dev/null
+++ b/src/main/webapp/WEB-INF/jsp/fims/biz/rt/rt100MgtForm.jsp
@@ -0,0 +1,171 @@
+<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
+<%@ include file="/WEB-INF/jsp/framework/taglibs.jsp" %>
+
+<div class="search r2">
+	<form name="frmSearch" id="frmSearch">
+		<table>
+			<caption>검색조건</caption>
+			<colgroup>
+				<col style="width: 250px;"/>
+				<col style="width: 250px;"/>
+				<col/>
+				<col/>
+				<col/>
+				<col/>
+				<col/>
+			</colgroup>
+			<tbody>
+				<tr>
+					<td style="">
+						<label for="clCode">분류코드</label>
+						<input name="clCode" title="분류코드" type="text" size="15" maxlength="15" id="clCode">
+					</td>
+					<td>
+						<label for="clCodeNm">분류코드명</label>
+						<input name="clCodeNm" title="분류코드명" type="text" size="35" maxlength="35" id="clCodeNm">
+					</td>
+					<td colspan="5">
+						<input type="button" id="btnSearch" class="btn_search" title="검색" value="검색" />
+					</td>
+				</tr>
+			</tbody>
+		</table>
+	</form>
+</div>
+	<!-- //검색 -->
+	
+<div class="page_btn">
+	<span class="fll">
+		<div class="list clearfix" id="totCnt">전체 ㅣ <span>0</span></div>
+	</span>
+	<span class="flr">
+		<a href="#" class="btn darkgray" id="btnRegist" title="등록">등록</a>
+	</span>
+</div>
+<!-- //버튼 및 페이지정보 -->
+
+<!-- 데이터 출력  -->
+<div id="grid" style="margin-top: 10px;"></div>
+
+
+<script type="text/javaScript">
+	/**************************************************************************
+	 * Global Variable
+	 **************************************************************************/
+	var callbackSearch = () => fnBiz.search();	// 데이터 조회 : popup에서 사용
+	let GRID = null;
+
+	/* *******************************
+	 * Biz function
+	 ******************************* */
+	const fnBiz = {
+		search: () => {
+			GRID.reloadData();
+		}
+		,pagePopup: function(flag, params){
+			let url = '<c:url value="/fims/biz/rt/rt100MgtPopup.do"/>';
+			let popTitle;
+			let popOption = {width: 700, height:500}
+			switch (flag) {
+				case "add":	//등록
+					popTitle = "분류 코드 등록";
+					break;
+				case "detail":	//상세
+					popTitle = "분류 코드 상세";
+					break;
+				default:
+					break;
+			}
+			CmmPopup.open(url, params, popOption, popTitle);
+		}
+		,onClickGrid: function(props){
+			const rowData = props.grid.getRow(props.rowKey);
+			fnBiz.pagePopup('detail', rowData);
+		}
+	}
+
+	/**************************************************************************
+	 * event
+	 **************************************************************************/
+	$(() => {
+		$('#btnSearch').on('click', () => {
+			fnBiz.search();
+		});
+
+		$('#btnRegist').on('click', () => {
+			fnBiz.pagePopup('add', null);
+		});
+	});
+
+	/* *******************************
+	 * Grid
+	 ******************************* */
+	const initGrid = () => {
+
+		/* ******************************
+		 * Grid start
+		 ****************************** */
+		const gridColumns = [	//Grid 컬럼 정보(명칭,매핑 field, 기타옵션 등)
+			{
+				header: '분류코드',
+				name: 'clCode',
+				width: 100,
+				sortable: true,
+				sortingType: 'desc',
+				align: 'center',
+				renderer: {
+					type: CustomButtonRenderer,
+					options: {
+						formatter : (props) => {
+							const rowData = props.grid.getRow(props.rowKey);
+							return {
+								formatter: rowData.clCode
+								,element: "text"
+							}
+						}
+						,eventFunction: fnBiz.onClickGrid
+						,eventType : "click"
+					}
+				}
+			},
+			{
+				header: '분류코드명',
+				name: 'clCodeNm',
+				minWidth: 400,
+				sortable: false,
+				align: 'center'
+			},
+			{
+				header: '사용여부',
+				name: 'useAt',
+				width: 80,
+				sortable: false,
+				align: 'center'
+			}
+		];
+		const gridDatasource = {
+			initialRequest: true,
+			api: {
+				readData: {
+					url: '<c:url value="/fims/biz/rt/rt100MgtForm.do"/>'
+					,serializer: (params) => fnAddPageInfo(document.frmSearch, params)
+				}
+			}
+		}
+
+		const gridOptions = {
+			el: 'grid',
+			rowHeaders: ['rowNum'],
+			columns: gridColumns,
+		};
+		GRID = TuiGrid.of(gridOptions, gridDatasource, (res) => {
+		});
+	};
+
+	/**************************************************************************
+	 * initialize
+	 **************************************************************************/
+	$(document).ready(function(){
+		initGrid();
+	});
+</script>
diff --git a/src/main/webapp/WEB-INF/jsp/fims/biz/rt/rt100MgtPopup.jsp b/src/main/webapp/WEB-INF/jsp/fims/biz/rt/rt100MgtPopup.jsp
new file mode 100644
index 00000000..c9d7c9c2
--- /dev/null
+++ b/src/main/webapp/WEB-INF/jsp/fims/biz/rt/rt100MgtPopup.jsp
@@ -0,0 +1,140 @@
+<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
+<%@ include file="/WEB-INF/jsp/framework/taglibs.jsp" %>
+<%@ taglib prefix="validator" uri="http://www.springmodules.org/tags/commons-validator" %>
+
+<c:set var="isUpdate" value="${!empty cmmnClCode.clCode}"/>
+<c:set var="bizName" value="공통 분류 코드"/>
+
+<script type="text/javascript" src="<c:url value="/framework/util/validator.do"/>"></script>
+<validator:javascript formName="cmmnClCode" staticJavascript="false" xhtml="true" cdata="false"/>
+<%--@elvariable id="cmmnClCode" type="validator"--%>
+<div class="popup" style="min-width: 100%;">
+    <div class="popup_inner" style="max-width: 700px;">
+		<%@include file="/WEB-INF/jsp/framework/biz-popup-title.jsp" %>
+        <form:form commandName="cmmnClCode" name="cmmnClCode">
+            <table class="tbl03">
+                <caption><c:out value="${bizName}"/> 등록 / 변경</caption>
+                <colgroup>
+                    <col style="width: 20%;"/>
+                    <col style="width: 30%;"/>
+                    <col style="width: 20%;"/>
+                    <col style="width: 30%;"/>
+                </colgroup>
+                <tbody>
+                <tr>
+                    <th class="required" scope="row" nowrap>
+                        <label for="clCode">분류코드</label>
+                    </th>
+                    <td nowrap colspan="3">
+                        <form:input path="clCode" size="3" maxlength="3" id="clCode" readonly="${isUpdate}"/>
+                        <form:errors path="clCode"/>
+                    </td>
+                </tr>
+                <tr>
+                    <th class="required" scope="row" nowrap>
+                        <label for="clCodeNm">분류코드명</label>
+                    </th>
+                    <td nowrap="nowrap" colspan="3">
+                        <form:input path="clCodeNm" size="60" maxlength="60" id="clCodeNm"/>
+                        <form:errors path="clCodeNm"/>
+                    </td>
+                </tr>
+				<tr>
+					<th class="required" scope="row" nowrap>
+						<label for="useAt">사용여부</label>
+					</th>
+					<td nowrap class="title_left" colspan="3">
+						<form:select path="useAt">
+							<form:option value="Y" label="사용"/>
+							<form:option value="N" label="미사용"/>
+						</form:select>
+					</td>
+				</tr>
+                <tr>
+                    <th class="required" scope="row">
+                        <label for="clCodeDc">분류코드설명</label>
+                    </th>
+                    <td colspan="3">
+                        <form:textarea path="clCodeDc" cols="100" rows="3" id="clCodeDc"/>
+                        <form:errors path="clCodeDc"/>
+                    </td>
+                </tr>
+                </tbody>
+            </table>
+        </form:form>
+		<%@include file="/WEB-INF/jsp/framework/biz-popup-use-btn.jsp" %>
+        <!-- //등록버튼 -->
+    </div>
+</div>
+<!-- //popup -->
+
+<script type="text/javaScript">
+	/**************************************************************************
+	 * Global Variable
+	 **************************************************************************/
+    let orgData;
+
+	/* *******************************
+     * Biz function
+     ******************************* */
+	const fnBiz = {
+		add: () => {
+			if (!fnBiz.validate()) return;
+
+			cmmBizAjax('add', {
+				url: '<c:url value="/fims/biz/rt/addRt100.do"/>'
+				, data: $("#cmmnClCode").serialize()
+			})
+		}
+		,modify: () => {
+			if (!fnBiz.validate()) return;
+
+			cmmBizAjax('modify', {
+				url: '<c:url value="/fims/biz/rt/modifyRt100.do"/>'
+				,data: $("#cmmnClCode").serialize()
+			});
+		}
+		,remove: () => {
+			$("#useAt").val('N');
+			cmmBizAjax('remove', {
+				url: '<c:url value="/fims/biz/rt/removeRt100.do"/>'
+				,data: $("#cmmnClCode").serialize()
+			});
+		}
+		,validate: () => {
+            if(orgData === $('form').serialize()){
+                alert('변경된 내용이 없습니다.');
+                return false;
+            }
+			if(!validateCmmnClCode(document.getElementById("cmmnClCode"))) return false;
+
+			return true;
+		}
+	};
+
+	/**************************************************************************
+	 * event
+	 **************************************************************************/
+	$(() => {
+		$('#btnRegist').on('click', () => {
+			fnBiz.add();
+		});
+
+		$('#btnModify').on('click', () => {
+			fnBiz.modify();
+		});
+
+		$('#btnRemove').on('click', () => {
+			fnBiz.remove();
+		});
+	});
+
+	/**************************************************************************
+	 * initialize
+	 **************************************************************************/
+	$(document).ready(function () {
+        orgData = $('form').serialize();
+	});
+
+
+</script>
diff --git a/src/main/webapp/WEB-INF/jsp/fims/biz/sample/sampleForm2.jsp b/src/main/webapp/WEB-INF/jsp/fims/biz/sample/sampleForm2.jsp
index b5adb965..00f43048 100644
--- a/src/main/webapp/WEB-INF/jsp/fims/biz/sample/sampleForm2.jsp
+++ b/src/main/webapp/WEB-INF/jsp/fims/biz/sample/sampleForm2.jsp
@@ -66,7 +66,22 @@
 <div id="grid"></div>
 
 
-
+<div id="bs" style="border:1px solid red; bottom: 0; width:1330px; position: fixed; bottom: 0; z-index: 999; background-color: #cccccc; display: none" >
+    <div id="bsHeader" style="height: 50px">bottom sheet<button id="bsClose" style="float: right;">close</button></div>
+    <div style="display: flex; ">
+        <div style=" border:1px solid red; height: 300px; width: 80%">
+            <div id="grid_bs"></div>
+        </div>
+        <div style=" border:1px solid red; height: 300px; width: 20%">
+            <button>일괄삭제</button>
+            <button>자료묶음</button>
+            <button>제거</button>
+        </div>
+    </div>
+</div>
+<div id="bsOpen" style="border:1px solid red; bottom: 0; width:80px; height: 15px; position: fixed; bottom: 0; z-index: 999; background-color: #cccccc; display: none" >
+    open
+</div>
 
 <script type="text/javaScript">
 
@@ -87,9 +102,9 @@
         }
 
         ,pagePopup: function(flag, params){
-            let url = '<c:url value="/framework/biz/mng/menu/mngProgramMgtPopup.do"/>';
+            let url = '<c:url value="/cmm/fimsPopup/fimsTotalPopup.do"/>';
             let popTitle;
-            let popOption = {width: 700, height:660}
+            let popOption = {width: 1300, height:900}
             switch (flag) {
                 case "add":	//등록
                     popTitle = "프로그램 등록";
@@ -103,11 +118,23 @@
             CmmPopup.open(url, params, popOption, popTitle);
         }
 
-        ,onClickGrid: function(props){
-            const rowData = props.grid.getRow(props.rowKey);
-            fnBiz.pagePopup('detail', rowData);
+        ,clickRegBtn: function(props){
+            const rowData = props.grid.getRow(props);
+            fnBiz.pagePopup('detail', {selectedId: rowData.reglt_id});
         }
-    }
+
+        ,bsAdd: function(props){
+            const rowData = GRID.getRow(props.rowKey);
+            GRID_BS.appendRow(rowData);
+            GRID_BS.refreshLayout();
+        }
+
+        ,bsDel: function(props){
+            const rowData = GRID.getRow(props.rowKey);
+            GRID_BS.removeRow(rowData);
+            GRID_BS.refreshLayout();
+        }
+    };
 
 
 
@@ -122,6 +149,14 @@
         $('#btnRegist').on('click', () => {
             fnBiz.pagePopup('add', null);
         });
+        $('#bsClose').on('click', ()=> {
+            $('#bs').hide(500);
+            $('#bsOpen').show(500);
+        });
+        $('#bsOpen').on('click', ()=> {
+            $('#bs').show(500);
+            $('#bsOpen').hide(500);
+        });
     });
 
 
@@ -181,6 +216,13 @@
                 minWidth: 200,
                 sortable: false,
                 align: 'left'
+            },
+            {
+                header: 'reglt_id',
+                name: 'reglt_id',
+                minWidth: 200,
+                sortable: false,
+                align: 'left'
             }
         ];
         const gridDatasource = {					//DataSource
@@ -195,13 +237,69 @@
                 }
             }
         }
-
         const gridOptions = {
             el: 'grid',
             rowHeaders: ['rowNum'],
             columns: gridColumns,
+            contextMenu: ({ rowKey, columnName }) => (
+                [
+                    [
+                        {
+                            name: 'bsAdd',
+                            label: '바텀시트에 추가',
+                            action: function() {
+                                $('#bs').show(500);
+                                var props = {};
+                                props['rowKey'] = rowKey;
+                                props['grid'] = columnName;
+                                fnBiz.bsAdd(props);
+                            },
+                            classNames: ['']
+                        },
+                    ],
+                ]
+            ),
+        };
+        const BSgridOptions = {
+            el: 'grid_bs',
+            rowHeaders: ['rowNum'],
+            columns: gridColumns,
+            bodyHeight: 250,              //[선택]Grid 높이 (number(단위: px)|'auto'|'fitToParent')
+            minBodyHeight: 200,           //[선택]Grid 최소 높이 (단위: px)
+            pageOptions: {
+                type: 'scroll',
+                perPage: 50
+            },
+            contextMenu: ({ rowKey, columnName }) => (
+                [
+                    [
+                        {
+                            name: 'bsDel',
+                            label: '바텀시트에서 제거',
+                            action: function() {
+                                var props = {};
+                                props['rowKey'] = rowKey;
+                                props['grid'] = columnName;
+                                fnBiz.bsDel(props);
+                            },
+                            classNames: ['']
+                        },
+                    ],
+                ]
+            ),
+        };
+        const onDblClickEventSet = function () {
+            GRID.on('dblclick', function (ev){
+                var props = {};
+                props['rowKey'] = ev.rowKey;
+                props['grid'] = ev.instance;
+                fnBiz.clickRegBtn(props);
+            })
         };
         GRID = TuiGrid.of(gridOptions, gridDatasource, (res) => {
+            onDblClickEventSet();
+        });
+        GRID_BS = TuiGrid.of(BSgridOptions, (res) => {
         });
     };
 
@@ -210,6 +308,7 @@
      **************************************************************************/
     $(document).ready(function(){
         initGrid();
+        console(cmmbs);
     });
 
 
diff --git a/src/main/webapp/resources/framework/js/cmm/cmmBottomSheet.js b/src/main/webapp/resources/framework/js/cmm/cmmBottomSheet.js
new file mode 100644
index 00000000..6ffa9ce0
--- /dev/null
+++ b/src/main/webapp/resources/framework/js/cmm/cmmBottomSheet.js
@@ -0,0 +1,25 @@
+function aaa(){
+    console.log(aaa);
+}
+
+const cmmBS = {
+    contextMenu: ({ rowKey, columnName }) => (
+        [
+            [
+                {
+                    name: 'bsAdd',
+                    label: '바텀시트에 추가',
+                    action: function() {
+                        $('#bs').show(500);
+                        var props = {};
+                        props['rowKey'] = rowKey;
+                        props['grid'] = columnName;
+                        fnBiz.bsAdd(props);
+                    },
+                    classNames: ['']
+                },
+            ],
+        ]
+    ),
+
+}
\ No newline at end of file