가맹점관리 스크립트 수정

src/main/webapp/js/app/oper/ITP_OPER03010.js

@@ -25,140 +25,107 @@ let COMPANY_CHECK_DUPLICATE = '/api/affl/check-duplicate';
 let USER_INTI_USERPW = '/api/user/inti-userpw';
 
 let kakaoMap = {
-	view: function(locate) {
-		kakao.maps.load(function() {
-
-			var mapContainer = document.getElementById('ITP_FORM_OPER03010_VIEW_MAP'), // 지도를 표시할 div
-				mapOption = {
-					center: new kakao.maps.LatLng(37.56684, 126.97865), // 지도의 중심좌표
-					level: 3, // 지도의 확대 레벨
-					mapTypeId : kakao.maps.MapTypeId.ROADMAP // 지도종류
-				};
-
-			// 지도를 생성한다
-			var map = new kakao.maps.Map(mapContainer, mapOption);
-
-			// 마우스 휠과 모바일 터치를 이용한 지도 확대, 축소를 막는다
-			map.setZoomable(false);
-
-			// 지도에 확대 축소 컨트롤을 생성한다
-			//var zoomControl = new kakao.maps.ZoomControl();
-
-			// 지도의 우측에 확대 축소 컨트롤을 추가한다
-			//map.addControl(zoomControl, kakao.maps.ControlPosition.RIGHT);
-
-			// 주소-좌표 변환 객체를 생성합니다
-			var geocoder = new kakao.maps.services.Geocoder();
-			var map;
-
-			if( !locate || locate.length == 0 ) {
-				// 지도에 마커를 생성하고 표시한다
-				marker = new kakao.maps.Marker({
-					position: new kakao.maps.LatLng(37.56684, 126.97865), // 마커의 좌표
-					map: map // 마커를 표시할 지도 객체
-				});
-			} else {
-				// 주소로 좌표를 검색합니다
-				geocoder.addressSearch(locate, function(result, status) {
-					// 정상적으로 검색이 완료됐으면
-					if (status === kakao.maps.services.Status.OK) {
-
-						var coords = new kakao.maps.LatLng(result[0].y, result[0].x);
-
-						// 결과값으로 받은 위치를 마커로 표시합니다
-						marker = new kakao.maps.Marker({
-							map: map,
-							position: coords
-						});
-
-						// 지도의 중심을 결과값으로 받은 위치로 이동시킵니다
-						map.setCenter(coords);
-					}
-				});
-			}
-		});
-	},
-	detail: function(locate) {
-		kakao.maps.load(function() {
-
-			var mapContainer = document.getElementById('ITP_FORM_OPER03010_DETAIL_MAP'), // 지도를 표시할 div
-				mapOption = {
-					center: new kakao.maps.LatLng(37.56684, 126.97865), // 지도의 중심좌표
-					level: 3, // 지도의 확대 레벨
-					mapTypeId : kakao.maps.MapTypeId.ROADMAP // 지도종류
-				};
-
-			// 지도를 생성한다
-			var map = new kakao.maps.Map(mapContainer, mapOption);
-
-			// 마우스 휠과 모바일 터치를 이용한 지도 확대, 축소를 막는다
-			map.setZoomable(false);
-
-			// 지도에 확대 축소 컨트롤을 생성한다
-			//var zoomControl = new kakao.maps.ZoomControl();
-
-			// 지도의 우측에 확대 축소 컨트롤을 추가한다
-			//map.addControl(zoomControl, kakao.maps.ControlPosition.RIGHT);
-
-			function searchDetailAddrFromCoords(coords, callback) {
-				// 좌표로 법정동 상세 주소 정보를 요청합니다
-				geocoder.coord2Address(coords.getLng(), coords.getLat(), callback);
-			}
-
-			// 주소-좌표 변환 객체를 생성합니다
-			var geocoder = new kakao.maps.services.Geocoder();
-			var map;
-
-			if( !locate || locate.length == 0 ) {
-				// 지도에 마커를 생성하고 표시한다
-				marker = new kakao.maps.Marker({
-					position: new kakao.maps.LatLng(37.56684, 126.97865), // 마커의 좌표
-					map: map // 마커를 표시할 지도 객체
-				});
-			} else {
-				// 주소로 좌표를 검색합니다
-				geocoder.addressSearch(locate, function(result, status) {
-					// 정상적으로 검색이 완료됐으면
-					if (status === kakao.maps.services.Status.OK) {
-
-						var coords = new kakao.maps.LatLng(result[0].y, result[0].x);
-						document.getElementById('ITP_FORM_OPER03010_DETAIL_LAT').value = result[0].y;
-						document.getElementById('ITP_FORM_OPER03010_DETAIL_LNG').value = result[0].x;
-
-						// 결과값으로 받은 위치를 마커로 표시합니다
-						marker = new kakao.maps.Marker({
-							map: map,
-							position: coords
-						});
-
-						// 지도의 중심을 결과값으로 받은 위치로 이동시킵니다
-						map.setCenter(coords);
-					}
-				});
-			}
-
-			// 지도 드래깅 이벤트를 등록한다 (드래그 시작 : dragstart, 드래그 종료 : dragend)
-			kakao.maps.event.addListener(map, 'drag', function () {
-				searchDetailAddrFromCoords(map.getCenter(), function(result, status) {
-					if (status === kakao.maps.services.Status.OK) {
-
-						document.getElementById('ITP_FORM_OPER03010_DETAIL_LOTS_ADDRESS').value = result[0].address.address_name ;
-						document.getElementById('ITP_FORM_OPER03010_DETAIL_CMPY_ADRES').value = !!result[0].road_address ? result[0].road_address.address_name : result[0].address.address_name ;
-						document.getElementById('ITP_FORM_OPER03010_DETAIL_STREET_ADDRESS').value = !!result[0].road_address ? result[0].road_address.address_name : $('#ITP_FORM_OPER03010_DETAIL_STREET_ADDRESS').val();
-						document.getElementById('ITP_FORM_OPER03010_DETAIL_CMPY_ZIPNO').value = !!result[0].road_address ? result[0].road_address.zone_no : $('#ITP_FORM_OPER03010_DETAIL_CMPY_ZIPNO').val() ;
-						document.getElementById('ITP_FORM_OPER03010_DETAIL_LAT').value = map.getCenter().getLat();
-						document.getElementById('ITP_FORM_OPER03010_DETAIL_LNG').value = map.getCenter().getLng();
-
-						// 마커를 클릭한 위치에 표시합니다
-						marker.setPosition(map.getCenter());
-						marker.setMap(map);
-					}
-				});
-				/* 	var message = '지도를 드래그 하고 있습니다. 지도의 중심 좌표는 ' + map.getCenter().toString() +' 입니다.';
+    init: function(id, locate) {
+        this.load(id, locate);
+    },
+    geocoder: null,
+    schDetailAddrFromCoords: function(coords, callback) {
+        // 좌표로 법정동 상세 주소 정보를 요청합니다
+        if(this.geocoder) {
+            this.geocoder.coord2Address(coords.getLng(), coords.getLat(), callback);
+        }
+    },
+    getMap: function(id) {
+        var mapContainer = document.getElementById(id), // 지도를 표시할 div
+            mapOption = {
+                center: new kakao.maps.LatLng(37.56684, 126.97865), // 지도의 중심좌표
+                level: 3, // 지도의 확대 레벨
+                mapTypeId : kakao.maps.MapTypeId.ROADMAP // 지도종류
+            };
+
+        // 지도를 생성한다
+        var map = new kakao.maps.Map(mapContainer, mapOption);
+
+        // 마우스 휠과 모바일 터치를 이용한 지도 확대, 축소를 막는다
+        map.setZoomable(false);
+
+        // 지도에 확대 축소 컨트롤을 생성한다
+        //var zoomControl = new kakao.maps.ZoomControl();
+
+        // 지도의 우측에 확대 축소 컨트롤을 추가한다
+        //map.addControl(zoomControl, kakao.maps.ControlPosition.RIGHT);
+
+        return map;
+    },
+    marker: function(map, coords) {
+        // 지도에 마커를 생성하고 표시한다
+        marker = new kakao.maps.Marker({
+            position: coords, // 마커의 좌표
+            map: map // 마커를 표시할 지도 객체
+        });
+    },
+    load: function(id, locate) {
+        var _this = this;
+        kakao.maps.load(function() {
+            var map = _this.getMap(id);
+            // 주소-좌표 변환 객체를 생성합니다
+            _this.geocoder = new kakao.maps.services.Geocoder();
+            if( !locate || locate.length == 0 ) {
+                // 지도에 마커를 생성하고 표시한다
+                _this.marker(map, new kakao.maps.LatLng(37.56684, 126.97865));
+            } else {
+                // 주소로 좌표를 검색합니다
+                _this.geocoder.addressSearch(locate, function(result, status) {
+                    // 정상적으로 검색이 완료됐으면
+                    if (status === kakao.maps.services.Status.OK) {
+
+                        var coords = new kakao.maps.LatLng(result[0].y, result[0].x);
+                        if(id === 'ITP_FORM_OPER04010_DETAIL_MAP') {
+                            document.getElementById('ITP_FORM_OPER04010_DETAIL_LAT').value = result[0].y;
+                            document.getElementById('ITP_FORM_OPER04010_DETAIL_LNG').value = result[0].x;
+                        }
+
+                        // 결과값으로 받은 위치를 마커로 표시합니다
+                        _this.marker(map, coords);
+
+                        // 지도의 중심을 결과값으로 받은 위치로 이동시킵니다
+                        map.setCenter(coords);
+                    } else {
+                        _this.marker(map, new kakao.maps.LatLng(37.56684, 126.97865));
+                    }
+                });
+            }
+
+            if(id === 'ITP_FORM_OPER04010_DETAIL_MAP') {
+                _this.listener.drag(map);
+            }
+        });
+    },
+    listener: {
+        drag: function(map) {
+            var _this = this;
+            // 지도 드래깅 이벤트를 등록한다 (드래그 시작 : dragstart, 드래그 종료 : dragend)
+            kakao.maps.event.addListener(map, 'drag', function () {
+                kakaoMap.schDetailAddrFromCoords(map.getCenter(), function(result, status) {
+                    if (status === kakao.maps.services.Status.OK) {
+
+                        document.getElementById('ITP_FORM_OPER04010_DETAIL_LOTS_ADDRESS').value = result[0].address.address_name ;
+                        document.getElementById('ITP_FORM_OPER04010_DETAIL_ADRES').value = !!result[0].road_address ? result[0].road_address.address_name : result[0].address.address_name ;
+                        document.getElementById('ITP_FORM_OPER04010_DETAIL_STREET_ADDRESS').value = !!result[0].road_address ? result[0].road_address.address_name : $('#ITP_FORM_OPER04010_DETAIL_STREET_ADDRESS').val();
+                        document.getElementById('ITP_FORM_OPER04010_DETAIL_ZIPNO').value = !!result[0].road_address ? result[0].road_address.zone_no : $('#ITP_FORM_OPER04010_DETAIL_CMPY_ZIPNO').val() ;
+                        document.getElementById('ITP_FORM_OPER04010_DETAIL_LAT').value = map.getCenter().getLat();
+                        document.getElementById('ITP_FORM_OPER04010_DETAIL_LNG').value = map.getCenter().getLng();
+
+                        // 마커를 클릭한 위치에 표시합니다
+                        marker.setPosition(map.getCenter());
+                        marker.setMap(map);
+                    }
+                });
+                /* 	var message = '지도를 드래그 하고 있습니다. 지도의 중심 좌표는 ' + map.getCenter().toString() +' 입니다.';
                 console.log(message); */
-			});
-		});
-	}
+            });
+        }
+    }
 };
 
 const gridColModel = {
@@ -526,7 +493,7 @@ let viewObj = {
 		$('#ITP_FORM_OPER03010_VIEW .fnAddDt').text(result.regDt);
 		$('#ITP_FORM_OPER03010_VIEW .fnChgDt').text(result.chgDt);
 
-		kakaoMap.view(result.cmpyAdres);
+		kakaoMap.init('ITP_FORM_OPER03010_VIEW_MAP', result.cmpyAdres);
 
 		// 영업담당자정보  리스트 조회
 		viewObj.grid.load(result.saleList);
@@ -603,7 +570,7 @@ let modifyObj = {
 		$('#ITP_FORM_OPER03010_DETAIL .fnAddDt').text(result.regDt);
 		$('#ITP_FORM_OPER03010_DETAIL .fnChgDt').text(result.chgDt);
 
-		kakaoMap.detail($('#ITP_FORM_OPER03010_DETAIL_CMPY_ADRES').val());
+		kakaoMap.init('ITP_FORM_OPER03010_DETAIL_MAP', $('#ITP_FORM_OPER03010_DETAIL_CMPY_ADRES').val());
 
 		// 영업담당자 리스트 조회
 		modifyObj.grid.load();
@@ -675,7 +642,7 @@ let createObj = {
 		this.load();
 	},
 	load: function() {
-		kakaoMap.detail($('#ITP_FORM_OPER03010_DETAIL_STREET_ADDRESS').val());
+		kakaoMap.init('ITP_FORM_OPER03010_DETAIL_MAP', $('#ITP_FORM_OPER03010_DETAIL_STREET_ADDRESS').val());
 
 		// 영업담당자 리스트 조회
 		createObj.grid.load();
@@ -725,7 +692,7 @@ let createObj = {
 					document.getElementById('ITP_FORM_OPER03010_DETAIL_HJ_DONG').value = !!data.hname ? data.hname : data.bname;
 					document.getElementById('ITP_FORM_OPER03010_DETAIL_BJ_DONG').value = data.bname;
 
-					kakaoMap.detail(data.roadAddress);
+					kakaoMap.init('ITP_FORM_OPER03010_DETAIL_MAP', data.roadAddress);
 					document.getElementById('ITP_FORM_OPER03010_DETAIL_CMPY_ADRES_DTL').focus();
 				}
 			}).open();