Explorer.js 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811
  1. MWF.xApplication.Attendance = MWF.xApplication.Attendance || {};
  2. MWF.require("MWF.xAction.org.express.RestActions", null,false);
  3. MWF.require("MWF.widget.O2Identity", null,false);
  4. MWF.xDesktop.requireApp("Attendance", "lp."+MWF.language, null, false);
  5. MWF.xApplication.Attendance.Explorer = new Class({
  6. Extends: MWF.widget.Common,
  7. Implements: [Options, Events],
  8. options: {
  9. "style": "default",
  10. "isAdmin": false,
  11. "searchKey" : ""
  12. },
  13. initialize: function(node, app, actions, options){
  14. this.setOptions(options);
  15. this.app = app;
  16. this.path = "/x_component_Attendance/$Explorer/";
  17. this.cssPath = "/x_component_Attendance/$Explorer/"+this.options.style+"/css.wcss";
  18. this._loadCss();
  19. this.actions = actions;
  20. this.node = $(node);
  21. this.initData();
  22. if (!this.personActions) this.personActions = new MWF.xAction.org.express.RestActions();
  23. },
  24. initData: function(){
  25. this.toolItemNodes = [];
  26. },
  27. reload: function(){
  28. this.node.empty();
  29. this.load();
  30. },
  31. load: function(){
  32. this.loadToolbar();
  33. this.loadContentNode();
  34. this.loadView();
  35. this.setNodeScroll();
  36. },
  37. destroy : function(){
  38. this.node.empty();
  39. delete this;
  40. },
  41. loadToolbar: function(){
  42. this.toolbarNode = new Element("div", {"styles": this.css.toolbarNode});
  43. this.toolbarNode.inject(this.node);
  44. var toolbarUrl = this.path+"toolbar.json";
  45. MWF.getJSON(toolbarUrl, function(json){
  46. json.each(function(tool){
  47. this.createToolbarItemNode(tool);
  48. }.bind(this));
  49. }.bind(this));
  50. //this.createSearchElementNode();
  51. },
  52. createToolbarItemNode : function( tool ){
  53. var toolItemNode = new Element("div", {
  54. "styles": (tool.styles && this.css[tool.styles]) ? this.css[tool.styles] : this.css.toolbarItemNode
  55. });
  56. if( tool.id ){
  57. toolItemNode.set( 'name' , tool.id );
  58. }
  59. toolItemNode.store("toolData", tool );
  60. if( tool.icon ){
  61. var iconNode = new Element("div", {
  62. "styles": this.css.toolbarItemIconNode
  63. }).inject(toolItemNode);
  64. iconNode.setStyle("background-image", "url("+this.path+this.options.style+"/icon/"+tool.icon+")");
  65. }
  66. if( tool.title ){
  67. var textNode = new Element("div", {
  68. "styles": this.css.toolbarItemTextNode,
  69. "text": tool.title
  70. });
  71. if( tool.text )textNode.set("title", tool.text);
  72. textNode.inject(toolItemNode);
  73. }
  74. toolItemNode.inject(this.toolbarNode);
  75. this.toolItemNodes.push(toolItemNode);
  76. this.setToolbarItemEvent(toolItemNode);
  77. },
  78. setToolbarItemEvent:function(toolItemNode){
  79. var _self = this;
  80. toolItemNode.addEvents({
  81. "click": function () {
  82. var data = this.retrieve("toolData");
  83. if( _self[data.action] )_self[data.action].apply(_self,[this]);
  84. }
  85. })
  86. },
  87. loadContentNode: function(){
  88. this.elementContentNode = new Element("div.elementContentNode", {
  89. "styles": this.css.elementContentNode
  90. }).inject(this.node);
  91. this.app.addEvent("resize", function(){this.setContentSize();}.bind(this));
  92. },
  93. loadView : function(){
  94. this.view = new MWF.xApplication.Attendance.Explorer.View(this.elementContentNode, this.app,this, this.viewData, this.options.searchKey );
  95. this.view.load();
  96. this.setContentSize();
  97. },
  98. setContentSize: function(){
  99. var toolbarSize = this.toolbarNode ? this.toolbarNode.getSize() : {"x":0,"y":0};
  100. var titlebarSize = this.app.titleBar ? this.app.titleBar.getSize() : {"x":0,"y":0};
  101. var nodeSize = this.node.getSize();
  102. var pt = this.elementContentNode.getStyle("padding-top").toFloat();
  103. var pb = this.elementContentNode.getStyle("padding-bottom").toFloat();
  104. //var filterSize = this.filterNode.getSize();
  105. var filterConditionSize = this.filterConditionNode ? this.filterConditionNode.getSize() : {"x":0,"y":0};
  106. var height = nodeSize.y-toolbarSize.y-pt-pb-filterConditionSize.y-titlebarSize.y;
  107. this.elementContentNode.setStyle("height", ""+height+"px");
  108. this.pageCount = (height/30).toInt()+5;
  109. this._setContentSize();
  110. if (this.view && this.view.items.length<this.pageCount){
  111. this.view.loadElementList(this.pageCount-this.view.items.length);
  112. }
  113. },
  114. _setContentSize: function(){
  115. },
  116. setNodeScroll: function(){
  117. var _self = this;
  118. MWF.require("MWF.widget.ScrollBar", function(){
  119. new MWF.widget.ScrollBar(this.elementContentNode, {
  120. "indent": false,"style":"xApp_TaskList", "where": "before", "distance": 30, "friction": 4, "axis": {"x": false, "y": true},
  121. "onScroll": function(y){
  122. var scrollSize = _self.elementContentNode.getScrollSize();
  123. var clientSize = _self.elementContentNode.getSize();
  124. var scrollHeight = scrollSize.y-clientSize.y;
  125. if (y+200>scrollHeight) {
  126. if (!_self.view.isItemsLoaded) _self.view.loadElementList();
  127. }
  128. }
  129. });
  130. }.bind(this));
  131. }
  132. });
  133. MWF.xApplication.Attendance.Explorer.View = new Class({
  134. initialize: function( container, app,explorer, searchKey ){
  135. this.container = container;
  136. this.app = app;
  137. this.explorer = explorer;
  138. this.css = explorer.css;
  139. this.actions = explorer.actions;
  140. this.searchKey = searchKey;
  141. this.listItemUrl = this.explorer.path+"listItem.json";
  142. },
  143. initData: function(){
  144. this.items=[];
  145. this.documents = {};
  146. this.isItemsLoaded = false;
  147. this.isItemLoadding = false;
  148. this.loadItemQueue = 0;
  149. this.count = 0;
  150. //this.controllers =[];
  151. },
  152. load : function(){
  153. this.initData();
  154. this.node = new Element("div", {
  155. "styles": this.css.elementContentListNode
  156. }).inject(this.container);
  157. this.table = new Element("table",{ "width" : "100%", "border" : "0", "cellpadding" : "5", "cellspacing" : "0", "class" : "editTable"}).inject(this.node);
  158. this.initSortData();
  159. this.createListHead();
  160. this.loadElementList();
  161. },
  162. initSortData : function(){
  163. this.sortField = null;
  164. this.sortType = null;
  165. this.sortFieldDefault = null;
  166. this.sortTypeDefault = null;
  167. },
  168. clear: function(){
  169. this.documents = null;
  170. MWF.release(this.items);
  171. this.items=[];
  172. this.documents = {};
  173. this.container.empty();
  174. this.isItemsLoaded = false;
  175. this.isItemLoadding = false;
  176. this.loadItemQueue = 0;
  177. //this.count = 0;
  178. },
  179. reload: function(){
  180. this.clear();
  181. this.node = new Element("div", {
  182. "styles": this.css.elementContentListNode
  183. }).inject(this.container);
  184. this.table = new Element("table",{ "width" : "100%", "border" : "0", "cellpadding" : "5", "cellspacing" : "0", "class" : "editTable"}).inject(this.node);
  185. this.createListHead();
  186. this.loadElementList();
  187. },
  188. resort : function(th){
  189. this.sortField = th.retrieve("sortField");
  190. var sortType = th.retrieve("sortType");
  191. //th.eliminate(sortType);
  192. if( sortType == "" ){
  193. this.sortType = "asc";
  194. }else if( this.sortType == "asc" ){
  195. this.sortType = "desc";
  196. }else{
  197. this.sortField = null;
  198. this.sortType = null;
  199. }
  200. this.reload();
  201. },
  202. createListHead : function(){
  203. var _self = this;
  204. var headNode = new Element("tr", {"styles": this.css.listHeadNode}).inject(this.table);
  205. MWF.getJSON( this.listItemUrl, function(json){
  206. this.listItemTemplate = json;
  207. json.each(function(cell){
  208. var isShow = true;
  209. if( cell.access ){
  210. if( cell.access == "admin" && !this.explorer.options.isAdmin ){
  211. isShow = false;
  212. }
  213. }
  214. if(isShow) {
  215. var th = new Element("th", {
  216. "styles": this.css[cell.headStyles],
  217. "text": cell.title,
  218. "width": cell.width
  219. }).inject(headNode);
  220. if( cell.name == "checkbox" ){
  221. this.checkboxElement = new Element("input",{
  222. "type" : "checkbox"
  223. }).inject( th );
  224. this.checkboxElement.addEvent("click",function(){
  225. this.selectAllCheckbox()
  226. }.bind(this))
  227. }
  228. if( cell.defaultSort && cell.defaultSort != "" ){
  229. this.sortFieldDefault = cell.name;
  230. this.sortTypeDefault = cell.defaultSort;
  231. }
  232. if( cell.sort && cell.sort != "" ){
  233. th.store("sortField",cell.name);
  234. if( this.sortField == cell.name && this.sortType!="" ){
  235. th.store("sortType",this.sortType);
  236. this.sortIconNode = new Element("div",{
  237. "styles": this.sortType == "asc" ? this.css.sortIconNode_asc : this.css.sortIconNode_desc
  238. }).inject( th, "top" );
  239. }else{
  240. th.store("sortType","");
  241. this.sortIconNode = new Element("div",{"styles":this.css.sortIconNode}).inject( th, "top" );
  242. }
  243. th.setStyle("cursor","pointer");
  244. th.addEvent("click",function(){
  245. _self.resort( this );
  246. })
  247. }
  248. }
  249. }.bind(this));
  250. }.bind(this),false);
  251. },
  252. selectAllCheckbox : function(){
  253. var flag = this.checkboxElement.get("checked");
  254. this.items.each( function( it ){
  255. if( it.checkboxElement )it.checkboxElement.set("checked",flag );
  256. }.bind(this))
  257. },
  258. loadElementList: function(count){
  259. if (!this.isItemsLoaded){
  260. if (!this.isItemLoadding){
  261. this.isItemLoadding = true;
  262. this._getCurrentPageData(function(json){
  263. //if( !json.data )return;
  264. json.data = json.data || [];
  265. var length = json.count; //|| json.data.length;
  266. //if (!this.isCountShow){
  267. // this.filterAllProcessNode.getFirst("span").set("text", "("+this.count+")");
  268. // this.isCountShow = true;
  269. //}
  270. if ( length <=this.items.length){
  271. this.isItemsLoaded = true;
  272. }
  273. json.data.each(function(data){
  274. if (!this.documents[data.id]){
  275. var item = this._createItem(data);
  276. this.items.push(item);
  277. this.documents[data.id] = item;
  278. }
  279. }.bind(this));
  280. this.isItemLoadding = false;
  281. if (this.loadItemQueue>0){
  282. this.loadItemQueue--;
  283. this.loadElementList();
  284. }
  285. }.bind(this), count);
  286. }else{
  287. this.loadItemQueue++;
  288. }
  289. }
  290. },
  291. _createItem: function(data){
  292. return new MWF.xApplication.Attendance.Explorer.Document(this.table, data, this.explorer, this);
  293. },
  294. _getCurrentPageData: function(callback, count){
  295. /* if(!count)count=20;
  296. var id = (this.items.length) ? this.items[this.items.length-1].data.id : "(0)";
  297. var data = {
  298. "catagoryIdList": [
  299. {
  300. "name": "catagoryId",
  301. "value": this.explorer.categoryData.id
  302. }
  303. ],
  304. "statusList": [
  305. {
  306. "name": "docStatus",
  307. "value": this.explorer.options.status
  308. }
  309. ]
  310. }
  311. if( this.searchKey && this.searchKey!="" ){
  312. data.titleList = [{
  313. "name" :"title",
  314. "value" : this.searchKey
  315. }]
  316. }
  317. if (this.filter && this.filter.filter ){
  318. var filterResult = this.filter.getFilterResult();
  319. for(var f in filterResult ){
  320. data[f] = filterResult[f];
  321. }
  322. this.actions.listDocumentFilterNext(id, count || this.pageCount, data, function(json){
  323. if (callback) callback(json);
  324. });
  325. }else{
  326. this.actions.listDocumentFilterNext(id, count || this.pageCount, data, function(json){
  327. if (callback) callback(json);
  328. });
  329. }*/
  330. },
  331. _removeDocument: function(documentData, all){
  332. //var id = document.data.id;
  333. //this.actions.removeDocument(id, function(json){
  334. // //json.data.each(function(item){
  335. // this.items.erase(this.documents[id]);
  336. // this.documents[id].destroy();
  337. // MWF.release(this.documents[id]);
  338. // delete this.documents[id];
  339. // this.app.notice(this.app.lp.deleteDocumentOK, "success");
  340. // // }.bind(this));
  341. //}.bind(this));
  342. },
  343. _createDocument: function(){
  344. },
  345. _openDocument: function( documentData ){
  346. }
  347. });
  348. MWF.xApplication.Attendance.Explorer.Document = new Class({
  349. initialize: function(container, data, explorer, view){
  350. this.explorer = explorer;
  351. this.app = explorer.app;
  352. this.data = data;
  353. this.container = container;
  354. this.view = view;
  355. this.css = this.explorer.css;
  356. this.load();
  357. },
  358. load: function(){
  359. this.node = new Element("tr", {"styles": this.css.documentItemNode});
  360. this.node.inject(this.container);
  361. //this.documentAreaNode = new Element("td", {"styles": this.css.documentItemDocumentNode}).inject(this.node);
  362. this.view.listItemTemplate.each(function(cell){
  363. var isShow = true;
  364. if( cell.access ){
  365. if( cell.access == "admin" && !this.explorer.options.isAdmin ){
  366. isShow = false;
  367. }
  368. }
  369. if(isShow){
  370. var value;
  371. if( cell.item.substr( 0, "function".length ) == "function" ){
  372. eval( "var fun = " + cell.item );
  373. value = fun.call( this, this.data );
  374. }else if( typeOf(this.data[cell.item]) == "number" ){
  375. value = this.data[cell.item];
  376. }else{
  377. value = this.data[cell.item] ? this.data[cell.item] : "";
  378. }
  379. var td = this[cell.name] = new Element("td",{
  380. "styles":this.css[cell.contentStyles],
  381. "text" : value
  382. }).inject(this.node);
  383. if( cell.name == "actions" && typeOf( cell.sub )=="array"){
  384. this.setActions( this[cell.name], cell.sub );
  385. }
  386. if( cell.name == "checkbox" ){
  387. var showCheckBox = true;
  388. if( cell.condition && cell.condition.substr( 0, "function".length ) == "function" ) {
  389. eval("var fun = " + cell.condition);
  390. showCheckBox = fun.call(this, this.data);
  391. }
  392. if( showCheckBox ){
  393. this.checkboxElement = new Element("input",{
  394. "type" : "checkbox"
  395. }).inject( td );
  396. this.checkboxElement.addEvent("click",function(ev){
  397. ev.stopPropagation();
  398. }.bind(this));
  399. td.addEvent("click",function(ev){
  400. this.checkboxElement.set("checked", !this.checkboxElement.get("checked") );
  401. ev.stopPropagation();
  402. }.bind(this))
  403. }
  404. }
  405. }
  406. }.bind(this));
  407. this.node.addEvents({
  408. "mouseover": function(){if (!this.readyRemove) this.node.setStyles(this.css.documentItemDocumentNode_over);}.bind(this),
  409. "mouseout": function(){if (!this.readyRemove) this.node.setStyles(this.css.documentItemDocumentNode);}.bind(this),
  410. "click": function(e){
  411. this.openDocument(e);
  412. }.bind(this)
  413. });
  414. },
  415. //setEvents: function(){
  416. //
  417. // this.node.addEvents({
  418. // "mouseover": function(){if (!this.readyRemove) this.node.setStyles(this.css.documentItemDocumentNode_over);}.bind(this),
  419. // "mouseout": function(){if (!this.readyRemove) this.node.setStyles(this.css.documentItemDocumentNode);}.bind(this),
  420. // "click": function(e){
  421. // this.openDocument(e);
  422. // }.bind(this)
  423. // });
  424. //
  425. // if (this.deleteNode){
  426. // this.deleteNode.addEvents({
  427. // "mouseover": function(){this.deleteNode.setStyles(this.css.actionDeleteNode_over);}.bind(this),
  428. // "mouseout": function(){this.deleteNode.setStyles(this.css.actionDeleteNode);}.bind(this),
  429. // "mousedown": function(){this.deleteNode.setStyles(this.css.actionDeleteNode_down);}.bind(this),
  430. // "mouseup": function(){this.deleteNode.setStyles(this.css.actionDeleteNode_over);}.bind(this),
  431. // "click": function(e){
  432. // this.remove(e);
  433. // e.stopPropagation();
  434. // }.bind(this)
  435. // });
  436. // }
  437. //},
  438. setActions: function( actionsNode, data ){
  439. var _self = this;
  440. data.each(function( d ){
  441. if( !d.action || !this[d.action])return;
  442. if( d.condition ){
  443. if( d.condition.substr( 0, "function".length ) == "function" ) {
  444. eval("var fun = " + d.condition );
  445. if( ! fun.call(this, this.data) ){
  446. return;
  447. }
  448. }
  449. }
  450. var node = this[d.action+"Node"] = new Element("div", {"title": d.title}).inject(actionsNode);
  451. var styles, overStyles, downStyles;
  452. if( typeOf( d.styles) == "string" ) styles = this.css[d.styles];
  453. if( typeOf(d.styles) == "object" ) styles = d.styles;
  454. if( typeOf( d.overStyles) == "string" ) overStyles = this.css[d.overStyles];
  455. if( typeOf(d.overStyles) == "object" ) overStyles = d.overStyles;
  456. if( typeOf( d.downStyles) == "string" ) downStyles = this.css[d.downStyles];
  457. if( typeOf(d.downStyles) == "object" ) downStyles = d.downStyles;
  458. if( styles )node.setStyles( styles );
  459. if( overStyles && styles ){
  460. node.addEvent( "mouseover", function(ev){ ev.target.setStyles( this.styles ); }.bind({"styles" : overStyles }) );
  461. node.addEvent( "mouseout", function(ev){ ev.target.setStyles( this.styles ); }.bind({"styles" : styles}) );
  462. }
  463. if( downStyles && ( overStyles || styles)){
  464. node.addEvent( "mousedown", function(ev){ ev.target.setStyles( this.styles ); }.bind({"styles" : downStyles }) );
  465. node.addEvent( "mouseup", function(ev){ ev.target.setStyles( this.styles ); }.bind({"styles" : overStyles || styles }) )
  466. }
  467. if( this[d.action] ){
  468. node.addEvent("click", function(ev){
  469. this.fun.call( _self, ev );
  470. ev.stopPropagation();
  471. }.bind({fun : this[d.action]}))
  472. }
  473. }.bind(this));
  474. //if( this.actionAreaNode ){
  475. // if( this.explorer.options.isAdmin ){
  476. // this.deleteNode = new Element("div", {"styles": this.css.actionDeleteNode, "title": this.app.lp.delete}).inject(this.actionAreaNode);
  477. // }
  478. //}
  479. },
  480. openDocument: function(e){
  481. //var options = {"documentId": this.data.id }//this.explorer.app.options.application.allowControl};
  482. //this.explorer.app.desktop.openApplication(e, "cms.Document", options);
  483. this.view._openDocument( this.data );
  484. },
  485. remove: function(e){
  486. var lp = this.app.lp;
  487. var text = lp.deleteDocument.replace(/{title}/g, this.data.title);
  488. var _self = this;
  489. this.node.setStyles(this.css.documentItemDocumentNode_remove);
  490. this.readyRemove = true;
  491. this.explorer.app.confirm("warn", e, lp.deleteDocumentTitle, text, 350, 120, function(){
  492. //var inputs = this.content.getElements("input");
  493. //var flag = "";
  494. //for (var i=0; i<inputs.length; i++){
  495. // if (inputs[i].checked){
  496. // flag = inputs[i].get("value");
  497. // break;
  498. // }
  499. //}
  500. //if (flag){
  501. //if (flag=="all"){
  502. //_self.explorer.removeDocument(_self, true);
  503. //}else{
  504. _self.view._removeDocument(_self.data, false);
  505. //}
  506. this.close();
  507. //}else{
  508. // this.content.getElement("#deleteDocument_checkInfor").set("text", lp.deleteAllDocumentCheck).setStyle("color", "red");
  509. //}
  510. }, function(){
  511. _self.node.setStyles(_self.css.documentItemDocumentNode);
  512. _self.readyRemove = false;
  513. this.close();
  514. });
  515. },
  516. destroy: function(){
  517. this.node.destroy();
  518. }
  519. });
  520. MWF.xApplication.Attendance.Explorer.PopupForm = new Class({
  521. Extends: MWF.widget.Common,
  522. Implements: [Options, Events],
  523. options: {
  524. "width": "500",
  525. "height": "400"
  526. },
  527. initialize: function( explorer, data,options){
  528. this.setOptions(options);
  529. this.explorer = explorer;
  530. this.app = explorer.app;
  531. this.data = data || {};
  532. this.css = this.explorer.css;
  533. this.load();
  534. },
  535. load: function(){
  536. },
  537. open: function(e){
  538. this.isNew = false;
  539. this.isEdited = false;
  540. this._open();
  541. },
  542. create: function(){
  543. this.isNew = true;
  544. this._open();
  545. },
  546. edit: function(){
  547. this.isEdited = true;
  548. this._open();
  549. },
  550. _open : function(){
  551. this.formMaskNode = new Element("div", {
  552. "styles": this.css.formMaskNode,
  553. "events": {
  554. "mouseover": function(e){e.stopPropagation();},
  555. "mouseout": function(e){e.stopPropagation();}
  556. }
  557. }).inject(this.app.content, "after");
  558. this.formAreaNode = new Element("div", {
  559. "styles": this.css.formAreaNode
  560. });
  561. this.createFormNode();
  562. this.formAreaNode.inject(this.formMaskNode, "after");
  563. this.formAreaNode.fade("in");
  564. this.setFormNodeSize();
  565. this.setFormNodeSizeFun = this.setFormNodeSize.bind(this);
  566. this.addEvent("resize", this.setFormNodeSizeFun);
  567. },
  568. createFormNode: function(){
  569. var _self = this;
  570. this.formNode = new Element("div", {
  571. "styles": this.css.formNode
  572. }).inject(this.formAreaNode);
  573. this.formIconNode = new Element("div", {
  574. "styles": this.isNew ? this.css.formNewNode : this.css.formIconNode
  575. }).inject(this.formNode);
  576. this.formFormNode = new Element("div", {
  577. "styles": this.css.formFormNode
  578. }).inject(this.formNode);
  579. this.formTableContainer = new Element("div", {
  580. "styles": this.css.formTableContainer
  581. }).inject(this.formFormNode);
  582. this.formTableArea = new Element("div", {
  583. "styles": this.css.formTableArea
  584. }).inject(this.formTableContainer);
  585. this._createTableContent();
  586. //formFormNode.set("html", html);
  587. //this.setScrollBar(this.formTableContainer)
  588. this._createAction();
  589. },
  590. _createTableContent: function(){
  591. var html = "<table width='100%' bordr='0' cellpadding='5' cellspacing='0' styles='formTable'>"+
  592. "<tr><td colspan='2' styles='formTableHead'>申诉处理单</td></tr>" +
  593. "<tr><td styles='formTabelTitle' lable='empName'></td>"+
  594. " <td styles='formTableValue' item='empName'></td></tr>" +
  595. "<tr><td styles='formTabelTitle' lable='unitName'></td>"+
  596. " <td styles='formTableValue' item='unitName'></td></tr>" +
  597. "<tr><td styles='formTabelTitle' lable='recordDateString'></td>"+
  598. " <td styles='formTableValue' item='recordDateString'></td></tr>" +
  599. "<tr><td styles='formTabelTitle' lable='status'></td>"+
  600. " <td styles='formTableValue' item='status'></td></tr>" +
  601. "<tr><td styles='formTabelTitle' lable='appealReason'></td>"+
  602. " <td styles='formTableValue' item='appealReason'></td></tr>" +
  603. "<tr><td styles='formTabelTitle' lable='appealDescription'></td>"+
  604. " <td styles='formTableValue' item='appealDescription'></td></tr>" +
  605. "<tr><td styles='formTabelTitle' lable='opinion1'></td>"+
  606. " <td styles='formTableValue' item='opinion1'></td></tr>" +
  607. "</table>";
  608. this.formTableArea.set("html",html);
  609. MWF.xDesktop.requireApp("Template", "MForm", function(){
  610. this.form = new MForm( this.formTableArea, {empName:"xadmin"}, {
  611. isEdited : this.isEdited || this.isNew,
  612. itemTemplate : {
  613. empName : { text:"姓名", type : "innertext" },
  614. unitName : { text:"部门", tType : "unit", notEmpty:true },
  615. recordDateString : { text:"日期", tType : "date"},
  616. status : { text:"状态", tType : "number" },
  617. appealReason : {
  618. text:"下拉框",
  619. type : "select",
  620. selectValue : ["测试1","测试2"]
  621. },
  622. appealDescription : { text:"描述", type : "textarea" },
  623. opinion1 : { text:"测试", type : "button", "value" : "测试" }
  624. }
  625. }, this.app);
  626. this.form.load();
  627. }.bind(this), true);
  628. },
  629. setFormNodeSize: function (width, height, top, left) {
  630. if (!width)width = this.options && this.options.width ? this.options.width : "50%";
  631. if (!height)height = this.options && this.options.height ? this.options.height : "50%";
  632. if (!top) top = this.options && this.options.top ? this.options.top : 0;
  633. if (!left) left = this.options && this.options.left ? this.options.left : 0;
  634. var allSize = this.app.content.getSize();
  635. var limitWidth = allSize.x; //window.screen.width
  636. var limitHeight = allSize.y; //window.screen.height
  637. "string" == typeof width && (1 < width.length && "%" == width.substr(width.length - 1, 1)) && (width = parseInt(limitWidth * parseInt(width, 10) / 100, 10));
  638. "string" == typeof height && (1 < height.length && "%" == height.substr(height.length - 1, 1)) && (height = parseInt(limitHeight * parseInt(height, 10) / 100, 10));
  639. 300 > width && (width = 300);
  640. 220 > height && (height = 220);
  641. top = top || parseInt((limitHeight - height) / 2, 10);
  642. left = left || parseInt((limitWidth - width) / 2, 10);
  643. this.formAreaNode.setStyles({
  644. "width": "" + width + "px",
  645. "height": "" + height + "px",
  646. "top": "" + top + "px",
  647. "left": "" + left + "px"
  648. });
  649. this.formNode.setStyles({
  650. "width": "" + width + "px",
  651. "height": "" + height + "px"
  652. });
  653. var iconSize = this.formIconNode ? this.formIconNode.getSize() : {x: 0, y: 0};
  654. var topSize = this.formTopNode ? this.formTopNode.getSize() : {x: 0, y: 0};
  655. var bottomSize = this.formBottomNode ? this.formBottomNode.getSize() : {x: 0, y: 0};
  656. var contentHeight = height - iconSize.y - topSize.y - bottomSize.y;
  657. //var formMargin = formHeight -iconSize.y;
  658. this.formFormNode.setStyles({
  659. "height": "" + contentHeight + "px"
  660. });
  661. },
  662. //setFormNodeSize: function(){
  663. // var size = this.app.node.getSize();
  664. // var allSize = this.app.content.getSize();
  665. //
  666. // this.formAreaNode.setStyles({
  667. // "width": ""+size.x+"px",
  668. // "height": ""+size.y+"px"
  669. // });
  670. // var hY = size.y*0.8;
  671. // var mY = size.y*0.2/2;
  672. // this.formNode.setStyles({
  673. // "height": ""+hY+"px",
  674. // "margin-top": ""+mY+"px"
  675. // });
  676. //
  677. // var iconSize = this.formIconNode ? this.formIconNode.getSize() : {x:0,y:30};
  678. // var formHeight = hY*0.8;
  679. // if (formHeight>250) formHeight = 250;
  680. // var formMargin = hY*0.3/2-iconSize.y;
  681. // this.formFormNode.setStyles({
  682. // "height": ""+formHeight+"px",
  683. // "margin-top": ""+formMargin+"px"
  684. // });
  685. //},
  686. _createAction : function(){
  687. this.cancelActionNode = new Element("div", {
  688. "styles": this.css.formCancelActionNode,
  689. "text": this.app.lp.cancel
  690. }).inject(this.formFormNode);
  691. this.cancelActionNode.addEvent("click", function(e){
  692. this.cancel(e);
  693. }.bind(this));
  694. if( this.isNew || this.isEdited){
  695. this.okActionNode = new Element("div", {
  696. "styles": this.css.formOkActionNode,
  697. "text": this.app.lp.ok
  698. }).inject(this.formFormNode);
  699. this.okActionNode.addEvent("click", function(e){
  700. this.ok(e);
  701. }.bind(this));
  702. }
  703. },
  704. cancel: function(e){
  705. this.close();
  706. },
  707. close: function(e){
  708. this.formMaskNode.destroy();
  709. this.formAreaNode.destroy();
  710. delete this;
  711. },
  712. ok: function(e){
  713. var data = this.form.getResult(true,",",true,false,true);
  714. if( data ){
  715. this._ok( data, function( json ){
  716. if( json.type == "ERROR" ){
  717. this.app.notice( json.message , "error");
  718. }else{
  719. this.formMaskNode.destroy();
  720. this.formAreaNode.destroy();
  721. if(this.explorer.view)this.explorer.view.reload();
  722. this.app.notice( this.isNew ? this.app.lp.createSuccess : this.app.lp.updateSuccess , "success");
  723. }
  724. }.bind(this))
  725. }
  726. },
  727. _ok: function( data, callback ){
  728. //this.app.restActions.saveDocument( this.data.id, data, function(json){
  729. // if( callback )callback(json);
  730. //}.bind(this));
  731. }
  732. });