admin.ui.js 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737
  1. //로그인 유효성체크 ALERT
  2. function uifnAlertClose(id){
  3. $("#"+id).css({display:'none'});
  4. return true;
  5. };
  6. //차트 리사이징
  7. function chartResize(){
  8. if ( $(document).find(".chartUnit").length > 0 ) {
  9. let elLen = $(".chartUnit").length;
  10. for (let i=0; i<elLen; i++){
  11. let thisId = eval($(".chartUnit").eq(i).attr("id"));
  12. let liW = Math.floor( $(".chartUnit").eq(i).parent("li").width());
  13. thisId.resize({width:liW});
  14. $(".c3-regions rect").attr("width",liW);
  15. }
  16. }
  17. };
  18. //MODAL & MODELESS POPUP 열기
  19. function uifnPopupOpen(id){
  20. var $thisId = $(document).find("#"+id);
  21. var popW = parseInt( $thisId.children().attr("data-width"));
  22. var popH = parseInt( $thisId.children().attr("data-height"));
  23. //팝업사이즈
  24. if (!popW && !popH) { //가로&세로 미지정(풀사이즈 출력)
  25. popW = $(window).width()-100;
  26. popH = $(window).height()-100;
  27. if (popW % 2 != 0 ) {popW = popW+1}; //짝수 변환(border 두께 영향)
  28. if (popW < 1180) {popW = 1180 }; //최소넓이
  29. if (popH % 2 != 0 ) {popH = popH+1}; //짝수 변환(border 두께 영향)
  30. if (popH < 488) { popH = 488 }; //최소높이
  31. $thisId.children().find(" > .panelStyle").css({width:popW, height:popH});
  32. } else if (popW && popH) { //가로,세로 둘다 지정(지정된 사이즈로 출력)
  33. $thisId.children().find(".panelStyle").css({width:popW, height:popH});
  34. } else { //가로만 지정(세로는 auto)
  35. $thisId.children().find("> .panelStyle").css({width:popW});
  36. };
  37. if ($thisId.children().hasClass("modelessPopup")){ //모덜리스 팝업의 경우
  38. if (isNaN(popW)){popW = $thisId.children().width(); }
  39. if (isNaN(popH)){popH = $thisId.children().height(); }
  40. let popL = $(window).width()/2 - popW/2;
  41. let popT = $(window).height()/2 - popH/2;
  42. $thisId.children().css({left:popL, top:popT});
  43. };
  44. $thisId.children("div").css({display:"block"});
  45. $("body").addClass("scrollOff");
  46. //이미지카드가 있는 팝업일때 내부 컨텐츠 높이 지정
  47. if ($thisId.children().find(".cardArea").length > 0) {
  48. var popH=0, noticeH=0, btnAreaH=0;
  49. if ($thisId.children().find(".notice").length > 0){
  50. var noticeLen = $thisId.children().find(".notice li").length;
  51. noticeH = (noticeLen*24) + 30;
  52. };
  53. if ($thisId.children().hasClass("modelessPopup")){ //모덜리스 팝업의 경우
  54. popH = $thisId.children().height();
  55. } else {
  56. popH = $thisId.children().find(".panelStyle").height();
  57. };
  58. if ($thisId.children().find(".panelBar").length > 0 ){ btnAreaH = 52 };
  59. var cardAreaH = popH-42-noticeH-37-btnAreaH; //높이계산 : 팝업-타이틀-안내문-컬러명TR-기타버튼영역
  60. $(".cardArea").css({height:cardAreaH});
  61. };
  62. //tab이 있는 팝업일때 내부 컨텐츠 높이 지정
  63. if ($thisId.children().find(".tabsCont").length > 0) {
  64. var mdConH=0, topTbl=0, popH=0, btnAreaH=0;
  65. if ($thisId.children().hasClass("modelessPopup")){ //모덜리스 팝업의 경우
  66. popH = $thisId.children().height();
  67. } else {
  68. popH = $thisId.children().find(".panelStyle").height();
  69. };
  70. if ($thisId.children().find(".panelContent > .frmStyle:eq(0)").length > 0 ){
  71. topTbl = $thisId.children().find(".panelContent > .frmStyle:eq(0)").outerHeight() + 15;
  72. };
  73. if ($thisId.children().find(".panelBar").length > 0 ){ btnAreaH = 52 };
  74. //console.log(topTbl);
  75. var tabContH = popH-42-topTbl-35-btnAreaH; //높이계산 : 팝업높이-타이틀-상단테이블-탭스높이-버튼
  76. $(".tab > .panelStyle").css({height:tabContH});
  77. };
  78. };
  79. //MODAL POPUP CLOSE
  80. function uifnPopupClose(id) {
  81. var $thisId = $("#"+id);
  82. if ( $thisId.hasClass("popupWrap") ) { //모달,모덜리스 팝업
  83. $thisId.children("div").css({display:"none"});
  84. $thisId.children("div").remove();
  85. var modalLen = $(".modalPopup[style='display:block;']").length;
  86. var modalessLen = $(".modalPopup[style='display:block;']").length;
  87. if ( modalLen == 0 && modalessLen ==0 ){
  88. $("body").removeClass("scrollOff");
  89. };
  90. } else if ( $thisId.hasClass("videoPopup") ) { //비디오팝업
  91. $thisId.css({display:"none"});
  92. $("#iframe_video").attr("src","");
  93. };
  94. $thisId.remove();
  95. };
  96. //비디오 팝업 열기
  97. function viewVideoPopup(id){
  98. var $thisId = $("#"+id + ">.videoPopup");
  99. var popW = parseInt( $thisId.children().attr("data-width") );
  100. var popH = parseInt( $thisId.children().attr("data-height") );
  101. var iframeSrc = 'https://www.youtube.com/embed/' + $("#video_url").val() + '?showinfo=0&rel=0&vp=hd1080&fs=0&wmode=opaque&enablejsapi=1';
  102. $("#iframe_video").css({width:popW, height:popH});
  103. $("#iframe_video").attr("src", iframeSrc+"?enablejsapi=1&version=3&playerapiid=ytplayer");
  104. $("#"+id).css({display:"block"});
  105. };
  106. //SORTABLE LIST
  107. function unfnModeless(){
  108. if ( $("#sortable").length > 0 ) {
  109. var mainW = $("#main").width();
  110. if ( $("#sortable").hasClass("sortable1") ) {
  111. mainW = ((mainW / 1) / mainW) * 100 ;
  112. };
  113. if ( $("#sortable").hasClass("sortable2") ) {
  114. mainW = ((mainW / 2) / mainW) * 100 ;
  115. };
  116. if ( $("#sortable").hasClass("sortable3") ) {
  117. mainW = ((mainW / 3) / mainW) * 100 ;
  118. };
  119. if ( $("#sortable").hasClass("sortable4") ) {
  120. mainW = ((mainW / 4) / mainW) * 100 ;
  121. };
  122. $(".secCell").css({"width":mainW +'%'});
  123. };
  124. $("#sortable").sortable();
  125. $("#sortable").disableSelection();
  126. };
  127. //LNB 활성화&비활성화
  128. function lnbToggle(){
  129. if ( $("#lnb-wrapper").hasClass("on") ){
  130. $("#lnb-wrapper").removeClass("on");
  131. $("#main-wrapper").removeClass("on");
  132. } else {
  133. $("#lnb-wrapper").addClass("on");
  134. $("#main-wrapper").addClass("on");
  135. };
  136. setTimeout( chartResize, 300); //차트 리사이징
  137. };
  138. $(document).ready(function(){
  139. //MODELESS POPUP : draggable
  140. $(document).find(".draggable").draggable({containment:"#wrapper", scroll:false});
  141. //chart resizing
  142. $(window).resize(function(){
  143. setTimeout( chartResize, 300); //차트 리사이징
  144. });
  145. //체크박스(단일), 라디오버튼 : readOnly 처리
  146. $(document).on("click", "[type=checkbox][readonly],[type=radio][readonly]", function(){
  147. return false;
  148. });
  149. $(document).on("click", ".chkBox", function(e){
  150. let cntId = $(this).parent().parent("ul").attr("data-count-id");
  151. let cntLen;
  152. if ( $(this).find("input").is('[id]') ){ // ---------------전체선택ID
  153. let $id = $(this).find("input").attr("id");
  154. if ( $(this).hasClass("checked") ) { //체크된 경우
  155. $("input[id="+$id+"]").parent("label").removeClass("checked");
  156. $("input[id="+$id+"]").prop("checked", false);
  157. $("input[name="+$id+"]").parent("label").removeClass("checked");
  158. $("input[name="+$id+"]").prop("checked", false);
  159. } else {
  160. $("input[id="+$id+"]").parent("label").addClass("checked");
  161. $("input[id="+$id+"]").prop("checked", true);
  162. $("input[name="+$id+"]").parent("label").addClass("checked");
  163. $("input[name="+$id+"]").prop("checked", true);
  164. };
  165. //선택된 개수 출력 (checkBoxList)
  166. if (cntId != undefined ) {
  167. cntLen = $("input[name="+$id+"]:checked").length; //체크된 개수
  168. $("#"+cntId).text(cntLen);
  169. };
  170. return false;
  171. } else { // ---------------개별선택
  172. let $name = $(this).find("input").attr("name");
  173. let totLen = $("input[name="+$name+"]").length; //전체 개수
  174. if ( $(this).hasClass("checked")) {
  175. $(this).removeClass("checked");
  176. $(this).find("input").prop("checked", false);
  177. $("input[id="+$name+"]").prop("checked", false);
  178. $("input[id="+$name+"]").parent("label").removeClass("checked");
  179. } else {
  180. $(this).addClass("checked");
  181. $(this).find("input").prop("checked", true);
  182. cntLen = $("input[name="+$name+"]:checked").length; //체크된 개수
  183. if (totLen == cntLen ){
  184. $("input[id="+$name+"]").prop("checked", true);
  185. $("input[id="+$name+"]").parent("label").addClass("checked");
  186. }
  187. };
  188. //선택된 개수 출력 (checkBoxList)
  189. if (cntId != undefined ) {
  190. cntLen = $("input[name="+$name+"]:checked").length; //체크된 개수
  191. if (totLen > cntLen ) {
  192. $("#"+cntId).text(cntLen);
  193. } else if (totLen == cntLen ) {
  194. $("#"+cntId).text(totLen);
  195. };
  196. };
  197. return false;
  198. };
  199. });
  200. /* CheckBox List : More(+) 버튼 */
  201. $(document).on("click", ".checkBoxList .more", function(){
  202. var thisI = $(this).find("i");
  203. if( $(thisI).hasClass("fa-plus") ){
  204. $(this).parent().addClass("on");
  205. $(thisI).removeClass("fa-plus").addClass("fa-minus");
  206. } else {
  207. $(this).parent().removeClass("on");
  208. $(thisI).removeClass("fa-minus").addClass("fa-plus");
  209. }
  210. });
  211. /* Multi CheckBox - 다중선택 체크박스 */
  212. $(document).on("click", ".multiCheckBox .sltBtn", function(){
  213. if($(this).hasClass("on")){
  214. $(this).removeClass("on");
  215. $(this).parent().find("ul").css({display:"none"});
  216. }else{
  217. $(".multiCheckBox .sltBtn").removeClass("on");
  218. $(".multiCheckBox ul").css({display:"none"});
  219. $(this).addClass("on");
  220. $(this).parent().find("ul").css({display:"block"});
  221. }
  222. });
  223. //햄버거버튼 : LNB 숨김(전체화면 보기)
  224. $(document).on("click",".lnbClose",function(){
  225. lnbToggle();
  226. });
  227. //GNB Memu
  228. $(document).on("click",".header-menu .menu a",function(){
  229. $(".header-menu .menu a").removeClass("on");
  230. $(this).addClass("on");
  231. var menuIdx = $(this).parent("span").index()+1;
  232. $("#lnb"+menuIdx).addClass("on");
  233. if( !$("#lnb-wrapper").hasClass("on") ){
  234. lnbToggle(); // LNB Open
  235. };
  236. });
  237. //LNB 서브메뉴 보기 : dep2
  238. $(document).on("click",".dep2",function(){
  239. if ($(this).hasClass("on")){ //활성화된 상태
  240. $(this).removeClass("on");
  241. $(this).next(".dep3").slideUp(200).removeClass("on");
  242. } else { //비활성화된 상태
  243. $(this).addClass("on");
  244. $(this).next(".dep3").slideDown(200).addClass("on");
  245. };
  246. });
  247. //LNB 서브메뉴 보기 : dep3
  248. $(document).on("click", ".dep3 > li > a", function(){
  249. if ($(this).hasClass("on")==false){
  250. $(".dep3 > li > a").removeClass("on");
  251. $(this).addClass("on");
  252. };
  253. });
  254. //다중셀렉박스 리스트 보이기,감추기
  255. $(document).on("click", ".mSelected", function(){
  256. $(this).find(".srchFld input").focus();
  257. });
  258. $(document).on("focusin", ".srchFld input", function(){
  259. $(this).parents(".mSelected").next(".mSelecting").css({display:'block'});
  260. });
  261. $(document).on("focusout", ".mSelectBox", function(){
  262. $(this).find(".mSelecting").slideUp(50);
  263. });
  264. //다중셀렉박스 리스트
  265. $(document).on("mousedown", ".mSelectWrap .mSelecting ul li", function(){
  266. if ( $(this).hasClass("deselect")==false ){
  267. var dataIdx = $(this).attr("data-index");
  268. var movePos = $(this).parents(".mSelecting").prev(".mSelected").find(".srchFld");
  269. $(this).parents(".mSelecting").prev(".mSelected").find("li[data-index="+dataIdx+"]").removeClass("off").insertBefore(movePos);
  270. $(this).parents(".mSelectWrap").find("select option[data-index="+dataIdx+"]").prop("selected", true);
  271. $(".mSelecting").slideUp(50);
  272. $(this).addClass("off");
  273. return false;
  274. };
  275. });
  276. //다중셀렉박스 닫기
  277. $(document).on("click", ".mSelectWrap .mSelected li a", function(){
  278. var dataIdx = $(this).parent("li").attr("data-index");
  279. $(this).parents(".mSelected").next(".mSelecting").find("ul li[data-index="+dataIdx+"]").removeClass("off")
  280. $(this).parents(".mSelectWrap").find("select option[data-index="+dataIdx+"]").prop("selected", false);
  281. $(this).parent("li").addClass("off")
  282. return false;
  283. });
  284. //TABS
  285. $(document).on("click", ".tabs .tabsNav li", function(e){
  286. e.preventDefault();
  287. if ( !$(this).hasClass("on") ) {
  288. let contIdx = $(this).index();
  289. let pTab = $(this).parents(".tabs");
  290. let thisTop = $(window).scrollTop();
  291. pTab.find(".tabsNav li").removeClass("on");
  292. pTab.find(".tabsCont > li").removeClass("on");
  293. $(this).addClass("on");
  294. pTab.find(".tabsCont > li").eq(contIdx).addClass("on");
  295. $('html, body').animate({scrollTop:thisTop}, 'fast');
  296. }
  297. });
  298. //TABSJR : 탭 하위 탭스
  299. $(document).on("click", ".tabsJr .tabsJrNav li", function(e){
  300. e.preventDefault();
  301. if ( !$(this).hasClass("on") ) {
  302. let contIdx = $(this).index();
  303. let pTab = $(this).parents(".tabsJr");
  304. let thisTop = $(window).scrollTop();
  305. pTab.find(".tabsJrNav li").removeClass("on");
  306. pTab.find(".tabsJrCont > li").removeClass("on");
  307. $(this).addClass("on");
  308. pTab.find(".tabsJrCont > li").eq(contIdx).addClass("on");
  309. $('html, body').animate({scrollTop:thisTop}, 'fast');
  310. }
  311. });
  312. //SORTABLE LIST
  313. if ( $("#sortable").length > 0 ) {
  314. var mainW = $("#main").width();
  315. if ( $("#sortable").hasClass("sortable1") ) {
  316. mainW = ((mainW / 1) / mainW) * 100 ;
  317. };
  318. if ( $("#sortable").hasClass("sortable2") ) {
  319. mainW = ((mainW / 2) / mainW) * 100 ;
  320. };
  321. if ( $("#sortable").hasClass("sortable3") ) {
  322. mainW = ((mainW / 3) / mainW) * 100 ;
  323. };
  324. if ( $("#sortable").hasClass("sortable4") ) {
  325. mainW = ((mainW / 4) / mainW) * 100 ;
  326. };
  327. $(".secCell").css({"width":mainW +'%'});
  328. };
  329. $("#sortable").sortable();
  330. $("#sortable").disableSelection();
  331. //파일선택
  332. $(document).on("change",".uFileInput", function() {
  333. let fileName = $(this).val().split('\\').pop();
  334. $(this).next('.uFileLabel').addClass("selected").html(fileName);
  335. });
  336. //베너 그룹 Up & Down
  337. $(document).on("click",".groupBtn", function() {
  338. var $gId = $(this).attr("id");
  339. var $gIcn = $(this).find("i");
  340. if ( $("table[data-child="+$gId+"]").hasClass("off") ){
  341. $("table[data-child="+$gId+"]").removeClass("off");
  342. $gIcn.attr("class","fa fa-chevron-down");
  343. } else {
  344. $("table[data-child="+$gId+"]").addClass("off");
  345. $gIcn.attr("class","fa fa-chevron-up");
  346. };
  347. });
  348. //비디오팝업 배경 클릭시 닫기
  349. $(document).on("click",".videoClose", function() {
  350. var vId = $(this).attr("id");
  351. $("#"+vId).css({display:"none"});
  352. $("#"+vId).find("iframe").attr("src","");
  353. });
  354. //상단이동 버튼
  355. $(document).on("click","#btnTop", function() {
  356. $('html, body').animate({scrollTop:'0'}, 200);
  357. });
  358. //다중셀렉트박스 포커스인(접근성)
  359. $(document).on("focusin",".srchFld", function() {
  360. $(this).parents(".mSelectBox").addClass("outline");
  361. });
  362. //다중셀렉트박스 포커스아웃(접근성)
  363. $(document).on("focusout",".srchFld", function() {
  364. $(this).parents(".mSelectBox").removeClass("outline");
  365. });
  366. //패널영역 줄이기
  367. $(document).on("click",".panelControl .fa-chevron-up", function() {
  368. $(this).parents(".panelStyle").find(".panelContent").slideUp(100);
  369. $(this).attr("class","fa fa-chevron-down");
  370. });
  371. //패널영역 펼치기
  372. $(document).on("click",".panelControl .fa-chevron-down", function() {
  373. $(this).parents(".panelStyle").find(".panelContent").slideDown(100);
  374. $(this).attr("class","fa fa-chevron-up");
  375. });
  376. //패널영역 감추기
  377. $(document).on("click",".panelControl .fa-times", function() {
  378. $(this).parents(".panelStyle").fadeOut(100);
  379. });
  380. //Date Picker Start -----------------------------------------------------------
  381. function initDatePickers() {
  382. // datepicker Korean option
  383. $.datepicker.regional['ko'] = {
  384. monthNames: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
  385. monthNamesShort: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
  386. dayNames: ['일', '월', '화', '수', '목', '금', '토'],
  387. dayNamesShort: ['일', '월', '화', '수', '목', '금', '토'],
  388. dayNamesMin: ['일', '월', '화', '수', '목', '금', '토'],
  389. dateFormat: 'yy-mm-dd',
  390. firstDay: 1,
  391. //isRTL: false,
  392. //duration: 200,
  393. //showAnim: 'show',
  394. showMonthAfterYear: true,
  395. yearSuffix: '년 ',
  396. prevText: '이전달',
  397. nextText: '다음달',
  398. //showButtonPanel: true,
  399. //currentText: '오늘',
  400. //closeText: '닫기',
  401. showOn: 'both',
  402. buttonImage:'image/btn_calendar.png'
  403. //,buttonImageOnly: true
  404. };
  405. $.datepicker.setDefaults($.datepicker.regional['ko']);
  406. $('.schDate').datepicker({
  407. changeMonth: true,
  408. changeYear: true,
  409. defaultDate: $('.schDate').val()
  410. });
  411. // monthpicker and year selector start/end year (10 year ago)
  412. var currentYear = (new Date()).getFullYear();
  413. var startYear = currentYear - 10;
  414. var finalYear = currentYear + 10;
  415. var options = {
  416. startYear: startYear,
  417. finalYear: finalYear,
  418. pattern: 'yyyy-mm',
  419. monthNames: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월']
  420. };
  421. $('.schMonth').monthpicker(options);
  422. // make year selector
  423. for (var i = finalYear; i >= startYear; i--) {
  424. if (currentYear == i ) {
  425. $(".schYear").append("<option value='" + i + "' selected class='ui-state-highlight'>" + i + "</option>");
  426. } else {
  427. $('.schYear').append("<option value='" + i + "'>" + i + "</option>");
  428. }
  429. }
  430. };
  431. $(function() {
  432. (function($) {
  433. var methods = {
  434. init: function(options) {
  435. return this.each(function() {
  436. var $this = $(this),
  437. data = $this.data('monthpicker'),
  438. year = (options && options.year) ? options.year : (new Date()).getFullYear(),
  439. settings = $.extend({
  440. pattern: 'yyyy-mm',
  441. selectedMonth: null,
  442. selectedMonthName: '',
  443. selectedYear: year,
  444. startYear: year - 10,
  445. finalYear: year + 10,
  446. monthNames: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
  447. id: "monthpicker_" + (Math.random() * Math.random()).toString().replace('.', ''),
  448. openOnFocus: true,
  449. disabledMonths: []
  450. }, options);
  451. settings.dateSeparator = settings.pattern.replace(/(mmm|mm|m|yyyy|yy|y)/ig, '');
  452. // If the plugin hasn't been initialized yet for this element
  453. if (!data) {
  454. $(this).data('monthpicker', {
  455. 'target': $this,
  456. 'settings': settings
  457. });
  458. if (settings.openOnFocus === true) {
  459. $this.on('focus', function() {
  460. $this.monthpicker('show');
  461. });
  462. }
  463. $this.monthpicker('parseInputValue', settings);
  464. $this.monthpicker('mountWidget', settings);
  465. $this.on('monthpicker-click-month', function(e, month, year) {
  466. $this.monthpicker('setValue', settings);
  467. $this.monthpicker('hide');
  468. });
  469. // hide widget when user clicks elsewhere on page
  470. $this.addClass("mtz-monthpicker-widgetcontainer");
  471. $(document).unbind("mousedown.mtzmonthpicker").on("mousedown.mtzmonthpicker", function(e) {
  472. if (!e.target.className || e.target.className.toString().indexOf('mtz-monthpicker') < 0) {
  473. $(this).monthpicker('hideAll');
  474. }
  475. });
  476. }
  477. });
  478. },
  479. show: function() {
  480. $(this).monthpicker('hideAll');
  481. var widget = $('#' + this.data('monthpicker').settings.id);
  482. widget.css("top", this.offset().top + this.outerHeight());
  483. if ($(window).width() > (widget.width() + this.offset().left)) {
  484. widget.css("left", this.offset().left);
  485. } else {
  486. widget.css("left", this.offset().left - widget.width());
  487. }
  488. widget.show();
  489. //widget.find('select').focus();
  490. this.trigger('monthpicker-show');
  491. },
  492. hide: function() {
  493. var widget = $('#' + this.data('monthpicker').settings.id);
  494. if (widget.is(':visible')) {
  495. widget.hide();
  496. this.trigger('monthpicker-hide');
  497. }
  498. },
  499. hideAll: function() {
  500. $(".mtz-monthpicker-widgetcontainer").each(function() {
  501. if (typeof($(this).data("monthpicker")) != "undefined") {
  502. $(this).monthpicker('hide');
  503. }
  504. });
  505. },
  506. setValue: function(settings) {
  507. var month = settings.selectedMonth,
  508. year = settings.selectedYear;
  509. if (settings.pattern.indexOf('mmm') >= 0) {
  510. month = settings.selectedMonthName;
  511. } else if (settings.pattern.indexOf('mm') >= 0 && settings.selectedMonth < 10) {
  512. month = '0' + settings.selectedMonth;
  513. };
  514. if (settings.pattern.indexOf('yyyy') < 0) {
  515. year = year.toString().substr(2, 2);
  516. };
  517. if (settings.pattern.indexOf('y') > settings.pattern.indexOf(settings.dateSeparator)) {
  518. this.val(month + settings.dateSeparator + year);
  519. } else {
  520. this.val(year + settings.dateSeparator + month);
  521. };
  522. this.change();
  523. },
  524. disableMonths: function(months) {
  525. var settings = this.data('monthpicker').settings,
  526. container = $('#' + settings.id);
  527. settings.disabledMonths = months;
  528. container.find('.mtz-monthpicker-month').each(function() {
  529. var m = parseInt($(this).data('month'));
  530. if ($.inArray(m, months) >= 0) {
  531. $(this).addClass('ui-state-disabled');
  532. } else {
  533. $(this).removeClass('ui-state-disabled');
  534. }
  535. });
  536. },
  537. mountWidget: function(settings) {
  538. var monthpicker = this,
  539. container = $('<div id="' + settings.id + '" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all" />'),
  540. header = $('<div class="ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all mtz-monthpicker" />'),
  541. combo = $('<select class="mtz-monthpicker mtz-monthpicker-year" />'),
  542. table = $('<table class="mtz-monthpicker" />'),
  543. tbody = $('<tbody class="mtz-monthpicker" />'),
  544. tr = $('<tr class="mtz-monthpicker" />'),
  545. td = '',
  546. selectedYear = settings.selectedYear,
  547. option = null,
  548. attrSelectedYear = $(this).data('selected-year'),
  549. attrStartYear = $(this).data('start-year'),
  550. attrFinalYear = $(this).data('final-year'),
  551. currYear = date.getFullYear();
  552. currMonth = date.getMonth()+1;
  553. if (attrSelectedYear) {
  554. settings.selectedYear = attrSelectedYear;
  555. }
  556. if (attrStartYear) {
  557. settings.startYear = attrStartYear;
  558. }
  559. if (attrFinalYear) {
  560. settings.finalYear = attrFinalYear;
  561. }
  562. container.css({
  563. position: 'absolute',
  564. //zIndex: 999999,
  565. whiteSpace: 'nowrap',
  566. //width: '250px',
  567. overflow: 'hidden',
  568. textAlign: 'center',
  569. display: 'none',
  570. top: monthpicker.offset().top + monthpicker.outerHeight(),
  571. left: monthpicker.offset().left
  572. });
  573. combo.on('change', function() {
  574. var months = $(this).parent().parent().find('td[data-month]');
  575. months.removeClass('ui-state-highlight');
  576. months.removeClass('ui-state-active');
  577. if ($(this).val() == settings.selectedYear) {
  578. months.filter('td[data-month=' + settings.selectedMonth + ']').addClass('ui-state-active');
  579. }
  580. //alert($(this).val() +','+ currYear);
  581. if ($(this).val() == currYear) {
  582. months.filter('td[data-month=' + currMonth + ']').addClass('ui-state-highlight');
  583. }
  584. monthpicker.trigger('monthpicker-change-year', $(this).val());
  585. });
  586. // mount years combo
  587. for (var i = settings.startYear; i <= settings.finalYear; i++) {
  588. var option = $('<option class="mtz-monthpicker" />').attr('value', i).append(i);
  589. if (settings.selectedYear == i) {
  590. option.attr('selected', 'selected');
  591. }
  592. combo.append(option);
  593. }
  594. header.append(combo).appendTo(container);
  595. header.append('년').appendTo(container);
  596. // mount months table
  597. for (var i = 1; i <= 12; i++) {
  598. td = $('<td class="ui-state-default mtz-monthpicker mtz-monthpicker-month"/>').attr('data-month', i);
  599. if (settings.selectedMonth == i) {
  600. td.addClass('ui-state-active');
  601. }
  602. if (settings.selectedYear == currYear && settings.selectedMonth == i) {
  603. td.addClass('ui-state-highlight');
  604. }
  605. td.append(settings.monthNames[i - 1]);
  606. tr.append(td).appendTo(tbody);
  607. if (i % 3 === 0) {
  608. tr = $('<tr class="mtz-monthpicker" />');
  609. }
  610. }
  611. tbody.find('.mtz-monthpicker-month').on('click', function() {
  612. var m = parseInt($(this).data('month'));
  613. if ($.inArray(m, settings.disabledMonths) < 0) {
  614. settings.selectedYear = $(this).closest('.ui-datepicker').find('.mtz-monthpicker-year').first().val();
  615. settings.selectedMonth = $(this).data('month');
  616. settings.selectedMonthName = $(this).text();
  617. monthpicker.trigger('monthpicker-click-month', $(this).data('month'));
  618. $(this).closest('table').find('.ui-state-active').removeClass('ui-state-active');
  619. $(this).addClass('ui-state-active');
  620. }
  621. });
  622. table.append(tbody).appendTo(container);
  623. container.appendTo('body');
  624. },
  625. destroy: function() {
  626. return this.each(function() {
  627. $(this).removeClass('mtz-monthpicker-widgetcontainer').unbind('focus').removeData('monthpicker');
  628. });
  629. },
  630. getDate: function() {
  631. var settings = this.data('monthpicker').settings;
  632. if (settings.selectedMonth && settings.selectedYear) {
  633. return new Date(settings.selectedYear, settings.selectedMonth - 1);
  634. } else {
  635. return null;
  636. }
  637. },
  638. parseInputValue: function(settings) {
  639. if (this.val()) {
  640. if (settings.dateSeparator) {
  641. var val = this.val().toString().split(settings.dateSeparator);
  642. if (settings.pattern.indexOf('m') === 0) {
  643. settings.selectedMonth = val[0];
  644. settings.selectedYear = val[1];
  645. } else {
  646. settings.selectedMonth = val[1];
  647. settings.selectedYear = val[0];
  648. }
  649. }
  650. }
  651. }
  652. };
  653. $.fn.monthpicker = function(method) {
  654. if (methods[method]) {
  655. return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
  656. } else if (typeof method === 'object' || !method) {
  657. return methods.init.apply(this, arguments);
  658. } else {
  659. $.error('Method ' + method + ' does not exist on jQuery.mtz.monthpicker');
  660. }
  661. };
  662. })(jQuery);
  663. Date.prototype.yyyymmdd = function() {
  664. var mm = this.getMonth() + 1; // getMonth() is zero-based
  665. var dd = this.getDate();
  666. return [this.getFullYear(),
  667. (mm>9 ? '' : '0') + mm,
  668. (dd>9 ? '' : '0') + dd
  669. ].join('-');
  670. };
  671. var date = new Date();
  672. var schDate = date.yyyymmdd();
  673. $('.schDate').val(schDate);
  674. $('.schMonth').val(schDate.substr(0,7));
  675. initDatePickers();
  676. });
  677. //년-월
  678. $(".schBtn").on('click', function () {
  679. var thisId= $(this).attr("data-id");
  680. $('#'+thisId).monthpicker('show');
  681. });
  682. //Date Picker End-----------------------------------------------------------
  683. });