HolidayExplorer.js 24 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563
  1. MWF.xDesktop.requireApp("Attendance", "Explorer", null, false);
  2. MWF.xDesktop.requireApp("Template", "MDomItem", null, false);
  3. MWF.xApplication.Attendance.HolidayExplorer = new Class({
  4. Extends: MWF.xApplication.Attendance.Explorer,
  5. Implements: [Options, Events],
  6. initialize: function(node, app, actions, options){
  7. this.setOptions(options);
  8. this.app = app;
  9. this.path = "/x_component_Attendance/$HolidayExplorer/";
  10. this.cssPath = "/x_component_Attendance/$HolidayExplorer/"+this.options.style+"/css.wcss";
  11. this._loadCss();
  12. this.actions = actions;
  13. this.node = $(node);
  14. this.initData();
  15. if (!this.personActions) this.personActions = new MWF.xAction.org.express.RestActions();
  16. },
  17. loadView : function(){
  18. this.view = new MWF.xApplication.Attendance.HolidayExplorer.View(this.elementContentNode, this.app,this, this.viewData, this.options.searchKey );
  19. this.view.load();
  20. this.setContentSize();
  21. },
  22. createDocument: function(){
  23. if(this.view)this.view._createDocument();
  24. }
  25. });
  26. MWF.xApplication.Attendance.HolidayExplorer.View = new Class({
  27. Extends: MWF.xApplication.Attendance.Explorer.View,
  28. _createItem: function(data){
  29. return new MWF.xApplication.Attendance.HolidayExplorer.Document(this.table, data, this.explorer, this);
  30. },
  31. _getCurrentPageData: function(callback, count){
  32. this.actions.listHolidayAll(function(json){
  33. if (callback) callback(json);
  34. });
  35. },
  36. _removeDocument: function(document, isNotice, callback){
  37. this.actions.listHolidayByYearAndName(document.configYear,document.configName, function( json ){
  38. json.data.each(function(d){
  39. this.actions.deleteHoliday(d.id, function(json){
  40. }.bind(this), null, false);
  41. }.bind(this));
  42. if(!isNotice)this.app.notice(this.app.lp.deleteDocumentOK, "success");
  43. if(callback)callback();
  44. this.explorer.reload();
  45. }.bind(this))
  46. },
  47. _createDocument: function(){
  48. var holiday = new MWF.xApplication.Attendance.HolidayExplorer.Holiday(this.explorer);
  49. holiday.create();
  50. },
  51. _openDocument: function( documentData ){
  52. this.actions.getHoliday( documentData.id, function( json ) {
  53. var data = json.data;
  54. var holidy = {
  55. "configYear" : data.configYear,
  56. "configName" : data.configName,
  57. "makeUpClassDay" : []
  58. };
  59. this.actions.listHolidayByYearAndName(data.configYear,data.configName, function( json ){
  60. var startDate, endDate;
  61. json.data.each(function( d ){
  62. if( d.configType == "Workday" ){
  63. holidy.makeUpClassDay.push( d.configDate )
  64. }else{
  65. if( !startDate ){
  66. startDate = d.configDate;
  67. }else if( new Date(startDate) > new Date(d.configDate) ){
  68. startDate = d.configDate;
  69. }
  70. if( !endDate ){
  71. endDate = d.configDate;
  72. }else if( new Date(endDate) < new Date(d.configDate) ){
  73. endDate = d.configDate;
  74. }
  75. }
  76. }.bind(this));
  77. holidy.makeUpClassDay = holidy.makeUpClassDay.join(",");
  78. holidy.startDate = startDate;
  79. holidy.endDate = endDate;
  80. var h = new MWF.xApplication.Attendance.HolidayExplorer.Holiday(this.explorer,holidy);
  81. h.edit();
  82. }.bind(this))
  83. }.bind(this))
  84. }
  85. });
  86. MWF.xApplication.Attendance.HolidayExplorer.Document = new Class({
  87. Extends: MWF.xApplication.Attendance.Explorer.Document
  88. });
  89. //
  90. //MWF.xApplication.Attendance.ScheduleExplorer.Schedule = new Class({
  91. // Extends: MWF.xApplication.Attendance.Explorer.PopupForm,
  92. // options : {
  93. // "width": 500,
  94. // "height": 400,
  95. // "hasTop" : true,
  96. // "hasBottom" : true,
  97. // "title" : "",
  98. // "draggable" : true,
  99. // "closeAction" : true
  100. // },
  101. // _createTableContent: function(){
  102. // var lp = this.app.lp.holiday;
  103. //
  104. // var html = "<table width='100%' bordr='0' cellpadding='5' cellspacing='0' styles='formTable'>"+
  105. // "<tr><td colspan='2' styles='formTableHead'>"+lp.setHoliday+"</td></tr>" +
  106. // "<tr><td styles='formTabelTitle' lable='unitName'></td>"+
  107. // " <td styles='formTableValue' item='unitName'></td></tr>" +
  108. // "<tr><td styles='formTabelTitle' lable='onDutyTime'></td>"+
  109. // " <td styles='formTableValue' item='onDutyTime'></td></tr>" +
  110. // "<tr><td styles='formTabelTitle' lable='offDutyTime'></td>"+
  111. // " <td styles='formTableValue' item='offDutyTime'></td></tr>" +
  112. // "<tr><td styles='formTabelTitle' lable='lateStartTime'></td>"+
  113. // " <td styles='formTableValue' item='lateStartTime'></td></tr>" +
  114. // "<tr><td styles='formTabelTitle' lable='leaveEarlyStartTime'></td>"+
  115. // " <td styles='formTableValue' item='leaveEarlyStartTime'></td></tr>" +
  116. // "<tr><td styles='formTabelTitle' lable='absenceStartTime'></td>"+
  117. // " <td styles='formTableValue' item='absenceStartTime'></td></tr>" +
  118. // "</table>"
  119. // this.formTableArea.set("html",html);
  120. //
  121. // MWF.xDesktop.requireApp("Template", "MForm", function(){
  122. // this.form = new MForm( this.formTableArea, this.data, {
  123. // isEdited : this.isEdited || this.isNew,
  124. // itemTemplate : {
  125. // configYear : {
  126. // "text" : lp.year, notEmpty : true,
  127. // "type" : "select",
  128. // "defaultValue" : new Date().getFullYear() ,
  129. // "selectValue" : function(){
  130. // var years = [];
  131. // var year = new Date().getFullYear()+5;
  132. // for(var i=0; i<11; i++ ){
  133. // years.push( year-- );
  134. // }
  135. // return years;
  136. // }
  137. // },
  138. // configName : { text: lp.name, notEmpty : true },
  139. // startDate : { text: lp.startDate, tType : "date", notEmpty : true },
  140. // endDate : { text: lp.endDate, tType : "date", notEmpty : true },
  141. // makeUpClassDay : { text:lp.makeUpClassDay, tType : "date" }
  142. // }
  143. // }, this.app);
  144. // this.form.load();
  145. // }.bind(this), true);
  146. // },
  147. // _ok: function( data, callback ){
  148. // var endDate = new Date( data.endDate );
  149. // var startDate = new Date( data.startDate );
  150. // if( startDate > endDate ){
  151. // this.app.notice("开始日期不能大于结束日期","error");
  152. // return;
  153. // }
  154. //
  155. // var save = function(){
  156. // var error = "";
  157. // this.getDateByRange(startDate,endDate).each(function( date ){
  158. // this.app.restActions.saveHoliday({
  159. // "configName" : data.configName,
  160. // "configYear" : data.configYear,
  161. // "configDate": date,
  162. // "configType": "Holiday"
  163. // }, function(json){
  164. // if( json.type == "ERROR" ){error=json.message}
  165. // }.bind(this),
  166. // function(json){
  167. // flag = false;
  168. // }.bind(this),false);
  169. // }.bind(this))
  170. //
  171. // if(data.makeUpClassDay!=""){
  172. // data.makeUpClassDay.split(",").each(function( date ){
  173. // this.app.restActions.saveHoliday({
  174. // "configName" : data.configName,
  175. // "configYear" : data.configYear,
  176. // "configDate": this.dateFormat( new Date(date),"yyyy-MM-dd"),
  177. // "configType": "Workday"
  178. // }, function(json){
  179. // if( json.type == "ERROR" ){error=json.message}
  180. // },function(json){
  181. // flag = false;
  182. // }.bind(this),false);
  183. // }.bind(this))
  184. // }
  185. // if(error==""){
  186. // this.createMarkNode.destroy();
  187. // this.createAreaNode.destroy();
  188. // if(this.explorer.view)this.explorer.view.reload();
  189. // this.app.notice( this.isNew ? this.app.lp.createSuccess : this.app.lp.updateSuccess , "success");
  190. // }else{
  191. // this.app.notice( error , "error");
  192. // }
  193. // }.bind(this);
  194. // if(!this.isNew){
  195. // this.explorer.view._removeDocument(data, false, save )
  196. // }else{
  197. // save();
  198. // }
  199. // }
  200. //});
  201. MWF.xApplication.Attendance.HolidayExplorer.Holiday = new Class({
  202. Extends: MWF.widget.Common,
  203. options: {
  204. "width": "500",
  205. "height": "400"
  206. },
  207. initialize: function( explorer, data ){
  208. this.explorer = explorer;
  209. this.app = explorer.app;
  210. this.data = data || {};
  211. this.css = this.explorer.css;
  212. this.load();
  213. },
  214. load : function(){
  215. },
  216. open: function(e){
  217. this.isNew = false;
  218. this.isEdited = false;
  219. this._open();
  220. },
  221. create: function(){
  222. this.isNew = true;
  223. this._open();
  224. },
  225. edit: function(){
  226. this.isEdited = true;
  227. this._open();
  228. },
  229. _open : function(){
  230. this.createMarkNode = new Element("div", {
  231. "styles": this.css.createMarkNode,
  232. "events": {
  233. "mouseover": function(e){e.stopPropagation();},
  234. "mouseout": function(e){e.stopPropagation();}
  235. }
  236. }).inject(this.app.content, "after");
  237. this.createAreaNode = new Element("div", {
  238. "styles": this.css.createAreaNode
  239. });
  240. this.createNode();
  241. this.createAreaNode.inject(this.createMarkNode, "after");
  242. this.createAreaNode.fade("in");
  243. this.setCreateNodeSize();
  244. this.setCreateNodeSizeFun = this.setCreateNodeSize.bind(this);
  245. this.addEvent("resize", this.setCreateNodeSizeFun);
  246. },
  247. createNode: function(){
  248. var _self = this;
  249. this.createNode = new Element("div", {
  250. "styles": this.css.createNode
  251. }).inject(this.createAreaNode);
  252. this.createIconNode = new Element("div", {
  253. "styles": this.isNew ? this.css.createNewNode : this.css.createIconNode
  254. }).inject(this.createNode);
  255. this.createFormNode = new Element("div", {
  256. "styles": this.css.createFormNode
  257. }).inject(this.createNode);
  258. var lp = this.app.lp.holiday;
  259. var inputStyle = "width: 99%; border:1px solid #999; background-color:#FFF; border-radius: 3px; box-shadow: 0px 0px 6px #CCC;height: 26px;";
  260. var inputTimeStyle = "width: 99%; border:1px solid #999; background-color:#FFF; border-radius: 3px; box-shadow: 0px 0px 6px #CCC;height: 26px;"+
  261. "background : url(/x_component_Attendance/$HolidayExplorer/default/icon/calendar.png) 98% center no-repeat";
  262. var html = "<table width='100%' height='200' border='0' cellPadding='0' cellSpacing='0'>" +
  263. "<tr>"+
  264. "<td colspan='2' style='height: 50px; line-height: 50px; text-align: center; min-width: 80px; font-size:18px;font-weight: bold;'>" + lp.setHoliday + "</td>" +
  265. "</tr>" +
  266. "<tr>"+
  267. "<td style='height: 30px; line-height: 30px; text-align: left; min-width: 80px; width:25%'>" + lp.year + ":</td>" +
  268. "<td style='; text-align: left;' id='yearArea'>"+
  269. //(!this.isNew && !this.isEdited ? "" :
  270. // ("<input type='text' id='configYear' " + "style='" + inputStyle +"'" + " value='" + ( this.data && this.data.configYear ? this.data.configYear : "") + "'/>")) +
  271. "</td>"+
  272. "</tr>" +
  273. "<tr>"+
  274. "<td style='height: 30px; line-height: 30px; text-align: left'>"+lp.name+":</td>" +
  275. "<td style='; text-align: right;'>"+
  276. (!this.isNew && !this.isEdited ? "" :
  277. ("<input type='text' id='configName' " + "style='" + inputStyle +"'" + " value='" + ( this.data && this.data.configName ? this.data.configName : "") + "'/>")) +
  278. "</td>" +
  279. "</tr>" +
  280. "<tr>" +
  281. "<td style='height: 30px; line-height: 30px; text-align: left'>"+lp.startDate+":</td>" +
  282. "<td style='; text-align: right;'>" +
  283. (!this.isNew && !this.isEdited ? "" :
  284. ("<input type='text' id='startDate' " + "style='" + inputTimeStyle +"'" + " value='" + ( this.data && this.data.startDate ? this.data.startDate : "") + "'/>")) +
  285. "</td>" +
  286. "</tr>" +
  287. "<tr>" +
  288. "<td style='height: 30px; line-height: 30px; text-align: left'>"+lp.endDate+":</td>" +
  289. "<td style='; text-align: right;'>" +
  290. (!this.isNew && !this.isEdited ? "" :
  291. ("<input type='text' id='endDate' " + "style='" + inputTimeStyle +"'" + " value='" + ( this.data && this.data.endDate ? this.data.endDate : "") + "'/>")) +
  292. "</td>" +
  293. "</tr>" +
  294. "<tr>" +
  295. "<td style='height: 30px; line-height: 30px; text-align: left'>"+lp.makeUpClassDay+":</td>" +
  296. "<td style='; text-align: right;'>" +
  297. (!this.isNew && !this.isEdited ? "" :
  298. ("<input type='text' id='makeUpClassDay' " + "style='" + inputTimeStyle +"'" + " value='" + ( this.data && this.data.makeUpClassDay ? this.data.makeUpClassDay : "") + "'/>")) +
  299. "</td>" +
  300. "</tr>" +
  301. "</table>";
  302. this.createFormNode.set("html", html);
  303. //this.configYear = this.createFormNode.getElement("#configYear");
  304. this.yearArea = this.createFormNode.getElement("#yearArea");
  305. this.configYear = new MDomItem( this.yearArea, {
  306. "name" : "configYear",
  307. "type" : "select",
  308. "value" : this.data.configYear || new Date().getFullYear(),
  309. "selectValue" : function(){
  310. var years = [];
  311. var year = new Date().getFullYear()+5;
  312. for(var i=0; i<11; i++ ){
  313. years.push( year-- );
  314. }
  315. return years;
  316. }
  317. }, true, this.app );
  318. this.configYear.load();
  319. this.configName = this.createFormNode.getElement("#configName");
  320. this.startDate = this.createFormNode.getElement("#startDate");
  321. this.endDate = this.createFormNode.getElement("#endDate");
  322. this.makeUpClassDay = this.createFormNode.getElement("#makeUpClassDay");
  323. this.startDate.addEvent("click",function(){
  324. _self.selectCalendar(this);
  325. });
  326. this.endDate.addEvent("click",function(){
  327. _self.selectCalendar(this);
  328. });
  329. this.makeUpClassDay.addEvent("click",function(){
  330. _self.selectCalendar(this);
  331. });
  332. this.cancelActionNode = new Element("div", {
  333. "styles": this.css.createCancelActionNode,
  334. "text": this.app.lp.cancel
  335. }).inject(this.createFormNode);
  336. this.createOkActionNode = new Element("div", {
  337. "styles": this.css.createOkActionNode,
  338. "text": this.app.lp.ok
  339. }).inject(this.createFormNode);
  340. this.cancelActionNode.addEvent("click", function(e){
  341. this.cancelCreate(e);
  342. }.bind(this));
  343. this.createOkActionNode.addEvent("click", function(e){
  344. this.okCreate(e);
  345. }.bind(this));
  346. },
  347. setCreateNodeSize: function (width, height, top, left) {
  348. if (!width)width = this.options && this.options.width ? this.options.width : "50%";
  349. if (!height)height = this.options && this.options.height ? this.options.height : "50%";
  350. if (!top) top = this.options && this.options.top ? this.options.top : 0;
  351. if (!left) left = this.options && this.options.left ? this.options.left : 0;
  352. var allSize = this.app.content.getSize();
  353. var limitWidth = allSize.x; //window.screen.width
  354. var limitHeight = allSize.y; //window.screen.height
  355. "string" == typeof width && (1 < width.length && "%" == width.substr(width.length - 1, 1)) && (width = parseInt(limitWidth * parseInt(width, 10) / 100, 10));
  356. "string" == typeof height && (1 < height.length && "%" == height.substr(height.length - 1, 1)) && (height = parseInt(limitHeight * parseInt(height, 10) / 100, 10));
  357. 300 > width && (width = 300);
  358. 220 > height && (height = 220);
  359. top = top || parseInt((limitHeight - height) / 2, 10);
  360. left = left || parseInt((limitWidth - width) / 2, 10);
  361. this.createAreaNode.setStyles({
  362. "width": "" + width + "px",
  363. "height": "" + height + "px",
  364. "top": "" + top + "px",
  365. "left": "" + left + "px"
  366. });
  367. this.createNode.setStyles({
  368. "width": "" + width + "px",
  369. "height": "" + height + "px"
  370. });
  371. var iconSize = this.createIconNode ? this.createIconNode.getSize() : {x: 0, y: 0};
  372. var topSize = this.formTopNode ? this.formTopNode.getSize() : {x: 0, y: 0};
  373. var bottomSize = this.formBottomNode ? this.formBottomNode.getSize() : {x: 0, y: 0};
  374. var contentHeight = height - iconSize.y - topSize.y - bottomSize.y;
  375. //var formMargin = formHeight -iconSize.y;
  376. this.createFormNode.setStyles({
  377. "height": "" + contentHeight + "px"
  378. });
  379. },
  380. //setCreateNodeSize: function(){
  381. // var size = this.app.node.getSize();
  382. // var allSize = this.app.content.getSize();
  383. //
  384. // this.createAreaNode.setStyles({
  385. // "width": ""+size.x+"px",
  386. // "height": ""+size.y+"px"
  387. // });
  388. // var hY = size.y*0.8;
  389. // var mY = size.y*0.2/2;
  390. // this.createNode.setStyles({
  391. // "height": ""+hY+"px",
  392. // "margin-top": ""+mY+"px"
  393. // });
  394. //
  395. // var iconSize = this.createIconNode.getSize();
  396. // var formHeight = hY*0.7;
  397. // if (formHeight>250) formHeight = 250;
  398. // var formMargin = hY*0.3/2-iconSize.y;
  399. // this.createFormNode.setStyles({
  400. // "height": ""+formHeight+"px",
  401. // "margin-top": ""+formMargin+"px"
  402. // });
  403. //},
  404. cancelCreate: function(e){
  405. var _self = this;
  406. if ( this.isNew && this.configName.get("value") ){
  407. this.app.confirm("warn", e,
  408. this.app.lp.create_cancel_title,
  409. this.app.lp.create_cancel, "320px", "100px",
  410. function(){
  411. _self.createMarkNode.destroy();
  412. _self.createAreaNode.destroy();
  413. this.close();
  414. },function(){
  415. this.close();
  416. }
  417. );
  418. }else{
  419. this.createMarkNode.destroy();
  420. this.createAreaNode.destroy();
  421. delete _self;
  422. }
  423. },
  424. okCreate: function(e){
  425. var data = {
  426. "id" : (this.data && this.data.id) ? this.data.id : this.app.restActions.getUUID(),
  427. "configYear": this.configYear.get("value"),
  428. "configName": this.configName.get("value"),
  429. "startDate": this.startDate.get("value"),
  430. "endDate": this.endDate.get("value"),
  431. "makeUpClassDay": this.makeUpClassDay.get("value")
  432. };
  433. if (data.configYear && data.configName && data.startDate && data.endDate ){
  434. var endDate = new Date( data.endDate );
  435. var startDate = new Date( data.startDate );
  436. if( startDate > endDate ){
  437. this.app.notice("开始日期不能大于结束日期","error");
  438. return;
  439. }
  440. var save = function(){
  441. var error = "";
  442. this.getDateByRange(startDate,endDate).each(function( date ){
  443. this.app.restActions.saveHoliday({
  444. "configName" : data.configName,
  445. "configYear" : data.configYear,
  446. "configDate": date,
  447. "configType": "Holiday"
  448. }, function(json){
  449. if( json.type == "ERROR" ){error=json.message}
  450. }.bind(this),
  451. function(json){
  452. flag = false;
  453. }.bind(this),false);
  454. }.bind(this));
  455. if(data.makeUpClassDay!=""){
  456. data.makeUpClassDay.split(",").each(function( date ){
  457. this.app.restActions.saveHoliday({
  458. "configName" : data.configName,
  459. "configYear" : data.configYear,
  460. "configDate": this.dateFormat( new Date(date),"yyyy-MM-dd"),
  461. "configType": "Workday"
  462. }, function(json){
  463. if( json.type == "ERROR" ){error=json.message}
  464. },function(json){
  465. flag = false;
  466. }.bind(this),false);
  467. }.bind(this))
  468. }
  469. if(error==""){
  470. this.createMarkNode.destroy();
  471. this.createAreaNode.destroy();
  472. if(this.explorer.view)this.explorer.view.reload();
  473. this.app.notice( this.isNew ? this.app.lp.createSuccess : this.app.lp.updateSuccess , "success");
  474. }else{
  475. this.app.notice( error , "error");
  476. }
  477. }.bind(this);
  478. if(!this.isNew){
  479. this.explorer.view._removeDocument(data, false, save )
  480. }else{
  481. save();
  482. }
  483. }else{
  484. this.configName.setStyle("border-color", "red");
  485. this.configName.focus();
  486. this.app.notice( this.app.lp.holiday.inputValid, "error");
  487. }
  488. },
  489. selectCalendar : function( calendarNode ){
  490. MWF.require("MWF.widget.Calendar", function(){
  491. var calendar = new MWF.widget.Calendar( calendarNode, {
  492. "style": "xform",
  493. "isTime": false,
  494. "target": this.app.content
  495. });
  496. calendar.show();
  497. }.bind(this));
  498. },
  499. getDateByRange : function(startDate, endDate){
  500. var days = [];
  501. while (startDate <= endDate) {
  502. days.push( this.dateFormat(startDate,"yyyy-MM-dd") );
  503. startDate.setDate(startDate.getDate() + 1);
  504. }
  505. return days;
  506. },
  507. dateFormat : function(date, fmt){
  508. var o = {
  509. "M+" : date.getMonth()+1, //月份
  510. "d+" : date.getDate(), //日
  511. "h+" : date.getHours(), //小时
  512. "m+" : date.getMinutes(), //分
  513. "s+" : date.getSeconds(), //秒
  514. "q+" : Math.floor((date.getMonth()+3)/3), //季度
  515. "S" : date.getMilliseconds() //毫秒
  516. };
  517. if(/(y+)/.test(fmt))
  518. fmt=fmt.replace(RegExp.$1, (date.getFullYear()+"").substr(4 - RegExp.$1.length));
  519. for(var k in o)
  520. if(new RegExp("("+ k +")").test(fmt))
  521. fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));
  522. return fmt;
  523. }
  524. });