FormExplorer.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281
  1. MWF.xDesktop.requireApp("process.ProcessManager", "Explorer", null, false);
  2. MWF.xApplication.process.ProcessManager.FormExplorer = new Class({
  3. Extends: MWF.xApplication.process.ProcessManager.Explorer,
  4. Implements: [Options, Events],
  5. options: {
  6. "create": MWF.APPPM.LP.form.create,
  7. "search": MWF.APPPM.LP.form.search,
  8. "searchText": MWF.APPPM.LP.form.searchText,
  9. "noElement": MWF.APPPM.LP.form.noFormNoticeText
  10. },
  11. _createElement: function(e){
  12. this.formTemplateList = null;
  13. this.defalutFormTemplateList = null;
  14. var _self = this;
  15. var createDefaultForm = function(e, template){
  16. layout.desktop.getFormDesignerStyle(function(){
  17. var options = {
  18. "style": layout.desktop.formDesignerStyle,
  19. "template": template,
  20. "onQueryLoad": function(){
  21. this.actions = _self.app.restActions;
  22. this.application = _self.app.options.application;
  23. }
  24. };
  25. layout.desktop.openApplication(e, "process.FormDesigner", options);
  26. }.bind(this));
  27. };
  28. var createForm = function(e, template){
  29. layout.desktop.getFormDesignerStyle(function(){
  30. var options = {
  31. "style": layout.desktop.formDesignerStyle,
  32. "templateId": template,
  33. "onQueryLoad": function(){
  34. this.actions = _self.app.restActions;
  35. this.application = _self.app.options.application;
  36. }
  37. };
  38. layout.desktop.openApplication(e, "process.FormDesigner", options);
  39. }.bind(this));
  40. };
  41. var createTemplateMaskNode = new Element("div", {"styles": this.css.createTemplateMaskNode}).inject(this.app.content);
  42. var createTemplateAreaNode = new Element("div", {"styles": this.css.createFormTemplateAreaNode}).inject(this.app.content);
  43. createTemplateAreaNode.fade("in");
  44. var createTemplateTitleNode = new Element("div", {"styles": this.css.createTemplateFormTitleNode, "text": this.app.lp.createSelectTemplate}).inject(createTemplateAreaNode);
  45. var createTemplateCategoryNode = new Element("div", {"styles": this.css.createTemplateFormCategoryNode}).inject(createTemplateAreaNode);
  46. var createTemplateCategoryTitleNode = new Element("div", {"styles": this.css.createTemplateFormCategoryTitleNode, "text": this.app.lp.templateCategory}).inject(createTemplateCategoryNode);
  47. var createTemplateContentNode = new Element("div", {"styles": this.css.createTemplateFormContentNode}).inject(createTemplateAreaNode);
  48. var createTemplateCategoryAllNode = new Element("div", {"styles": this.css.createTemplateFormCategoryItemNode, "text": this.app.lp.all}).inject(createTemplateCategoryNode);
  49. createTemplateCategoryAllNode.addEvent("click", function(){
  50. loadAllTemplates();
  51. });
  52. this.app.restActions.listFormTemplateCategory(function(json){
  53. json.data.each(function(d){
  54. var createTemplateCategoryItemNode = new Element("div", {"styles": this.css.createTemplateFormCategoryItemNode, "text": d.name+"("+ d.count+")", "value": d.name}).inject(createTemplateCategoryNode);
  55. createTemplateCategoryItemNode.addEvent("click", function(){
  56. createTemplateContentNode.empty();
  57. createTemplateCategoryNode.getElements("div").each(function(node, i){
  58. if (i>0) node.setStyles(_self.css.createTemplateFormCategoryItemNode);
  59. });
  60. this.setStyles(_self.css.createTemplateFormCategoryItemNode_current);
  61. loadTemplates(this.get("value"));
  62. });
  63. }.bind(this));
  64. }.bind(this));
  65. var resize = function(){
  66. var size = this.app.content.getSize();
  67. var y = (size.y*0.1)/2;
  68. var x = (size.x*0.1)/2;
  69. if (y<0) y=0;
  70. if (x<0) x=0;
  71. createTemplateAreaNode.setStyles({
  72. "top": ""+y+"px",
  73. "left": ""+x+"px"
  74. });
  75. y = size.y*0.9-createTemplateCategoryNode.getSize().y-70;
  76. createTemplateContentNode.setStyle("height", ""+y+"px");
  77. }.bind(this);
  78. resize();
  79. this.app.addEvent("resize", resize);
  80. var getDefaultFormTemplateList = function(callback){
  81. if (this.defalutFormTemplateList){
  82. if (callback) callback();
  83. }else{
  84. var url = "/x_component_process_FormDesigner/Module/Form/template/templates.json";
  85. MWF.getJSON(url, function(json){
  86. this.defalutFormTemplateList = json;
  87. if (callback) callback();
  88. }.bind(this));
  89. }
  90. }.bind(this);
  91. var loadDefaultTemplate = function(){
  92. getDefaultFormTemplateList(function(){
  93. this.defalutFormTemplateList.each(function(template){
  94. var templateNode = new Element("div", {"styles": this.css.formTemplateNode}).inject(createTemplateContentNode);
  95. var templateIconNode = new Element("div", {"styles": this.css.formTemplateIconNode}).inject(templateNode);
  96. var templateTitleNode = new Element("div", {"styles": this.css.formTemplateTitleNode, "text": template.title}).inject(templateNode);
  97. templateNode.store("template", template.name);
  98. var templateIconImgNode = new Element("img", {"styles": this.css.formTemplateIconImgNode}).inject(templateIconNode);
  99. templateIconImgNode.set("src", "/x_component_process_FormDesigner/Module/Form/template/"+template.icon);
  100. templateNode.addEvents({
  101. "mouseover": function(){this.setStyles(_self.css.formTemplateNode_over)},
  102. "mouseout": function(){this.setStyles(_self.css.formTemplateNode)},
  103. "mousedown": function(){this.setStyles(_self.css.formTemplateNode_down)},
  104. "mouseup": function(){this.setStyles(_self.css.formTemplateNode_over)},
  105. "click": function(e){
  106. createDefaultForm(e, this.retrieve("template"));
  107. _self.app.removeEvent("resize", resize);
  108. createTemplateAreaNode.destroy();
  109. createTemplateMaskNode.destroy();
  110. }
  111. });
  112. }.bind(this))
  113. }.bind(this));
  114. }.bind(this);
  115. var getFormTemplateList = function(callback){
  116. if (this.formTemplateList){
  117. if (callback) callback();
  118. }else{
  119. this.app.restActions.listFormTemplate(function(json){
  120. this.formTemplateList = json.data;
  121. if (callback) callback();
  122. }.bind(this));
  123. }
  124. }.bind(this);
  125. var loadTemplates = function(category){
  126. getFormTemplateList(function(){
  127. Object.each(this.formTemplateList, function(v, k){
  128. var flag = (category) ? (k==category) : true;
  129. if (flag){
  130. v.each(function(template){
  131. var templateNode = new Element("div", {"styles": this.css.formTemplateNode}).inject(createTemplateContentNode);
  132. var templateIconNode = new Element("div", {"styles": this.css.formTemplatePreviewNode}).inject(templateNode);
  133. var templateTitleNode = new Element("div", {"styles": this.css.formTemplateTitleNode, "text": template.name}).inject(templateNode);
  134. templateNode.store("template", template.id);
  135. templateIconNode.set("html", template.outline);
  136. var templateActionNode = new Element("img", {"styles": this.css.formTemplateActionNode}).inject(templateIconNode);
  137. templateActionNode.addEvent("click", function(e){
  138. var thisNode = this.getParent().getParent();
  139. var id = thisNode.retrieve("template");
  140. _self.app.confirm("wram", e, _self.app.lp.form.deleteFormTemplateTitle, _self.app.lp.form.deleteFormTemplate, 300, 120, function(){
  141. _self.app.restActions.deleteFormTemplate(id, function(json){
  142. thisNode.destroy();
  143. }.bind(this));
  144. this.close();
  145. }, function(){
  146. this.close();
  147. });
  148. e.stopPropagation();
  149. });
  150. //templateIconImgNode.set("src", "/x_component_process_FormDesigner/Module/Form/template/"+template.icon);
  151. templateNode.addEvents({
  152. "mouseover": function(){
  153. this.setStyles(_self.css.formTemplateNode_over);
  154. if (templateActionNode) templateActionNode.setStyle("display", "block");
  155. },
  156. "mouseout": function(){
  157. this.setStyles(_self.css.formTemplateNode);
  158. if (templateActionNode) templateActionNode.setStyle("display", "none");
  159. },
  160. "mousedown": function(){this.setStyles(_self.css.formTemplateNode_down)},
  161. "mouseup": function(){this.setStyles(_self.css.formTemplateNode_over)},
  162. "click": function(e){
  163. createForm(e, this.retrieve("template"));
  164. _self.app.removeEvent("resize", resize);
  165. createTemplateAreaNode.destroy();
  166. createTemplateMaskNode.destroy();
  167. }
  168. });
  169. }.bind(this));
  170. }
  171. }.bind(this));
  172. }.bind(this));
  173. }.bind(this);
  174. var loadAllTemplates = function(){
  175. createTemplateContentNode.empty();
  176. createTemplateCategoryNode.getElements("div").each(function(node, i){
  177. if (i>0) node.setStyles(_self.css.createTemplateFormCategoryItemNode);
  178. });
  179. createTemplateCategoryAllNode.setStyles(_self.css.createTemplateFormCategoryItemNode_current);
  180. loadDefaultTemplate();
  181. loadTemplates();
  182. };
  183. loadAllTemplates();
  184. createTemplateMaskNode.addEvent("click", function(){
  185. this.app.removeEvent("resize", resize);
  186. createTemplateAreaNode.destroy();
  187. createTemplateMaskNode.destroy();
  188. }.bind(this));
  189. },
  190. _loadItemDataList: function(callback){
  191. this.app.restActions.listForm(this.app.options.application.id,callback);
  192. },
  193. _getItemObject: function(item){
  194. return new MWF.xApplication.process.ProcessManager.FormExplorer.Form(this, item)
  195. },
  196. setTooltip: function(){
  197. this.options.tooltip = {
  198. "create": MWF.APPPM.LP.form.create,
  199. "search": MWF.APPPM.LP.form.search,
  200. "searchText": MWF.APPPM.LP.form.searchText,
  201. "noElement": MWF.APPPM.LP.form.noFormNoticeText
  202. };
  203. },
  204. deleteItems: function(){
  205. this.hideDeleteAction();
  206. while (this.deleteMarkItems.length){
  207. var item = this.deleteMarkItems.shift();
  208. if (this.deleteMarkItems.length){
  209. item.deleteForm();
  210. }else{
  211. item.deleteForm(function(){
  212. // this.reloadItems();
  213. // this.hideDeleteAction();
  214. }.bind(this));
  215. }
  216. }
  217. }
  218. });
  219. MWF.xApplication.process.ProcessManager.FormExplorer.Form = new Class({
  220. Extends: MWF.xApplication.process.ProcessManager.Explorer.Item,
  221. _open: function(e){
  222. layout.desktop.getFormDesignerStyle(function(){
  223. var _self = this;
  224. var options = {
  225. "style": layout.desktop.formDesignerStyle,
  226. "onQueryLoad": function(){
  227. this.actions = _self.explorer.actions;
  228. this.category = _self;
  229. this.options.id = _self.data.id;
  230. this.application = _self.explorer.app.options.application;
  231. }
  232. };
  233. this.explorer.app.desktop.openApplication(e, "process.FormDesigner", options);
  234. }.bind(this));
  235. },
  236. _getIcon: function(){
  237. var x = (Math.random()*49).toInt();
  238. return "process_icon_"+x+".png";
  239. },
  240. _getLnkPar: function(){
  241. return {
  242. "icon": this.explorer.path+this.explorer.options.style+"/formIcon/lnk.png",
  243. "title": this.data.name,
  244. "par": "process.FormDesigner#{\"id\": \""+this.data.id+"\"}"
  245. };
  246. },
  247. // deleteItem: function(e){
  248. // var _self = this;
  249. // this.explorer.app.confirm("info", e, this.explorer.app.lp.form.deleteFormTitle, this.explorer.app.lp.form.deleteForm, 320, 110, function(){
  250. // _self.deleteForm();
  251. // this.close();
  252. // },function(){
  253. // this.close();
  254. // });
  255. // },
  256. deleteForm: function(callback){
  257. this.explorer.app.restActions.deleteForm(this.data.id, function(){
  258. this.node.destroy();
  259. if (callback) callback();
  260. }.bind(this));
  261. }
  262. });