Explorer.js 31 KB

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