Tab$Page.js 9.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306
  1. MWF.xApplication.process.FormDesigner.Module = MWF.xApplication.process.FormDesigner.Module || {};
  2. MWF.xDesktop.requireApp("process.FormDesigner", "Module.$Element", null, false);
  3. MWF.xApplication.process.FormDesigner.Module.Tab$Page = MWF.FCTab$Page = new Class({
  4. Extends: MWF.FC$Element,
  5. Implements: [Options, Events],
  6. options: {
  7. "style": "default",
  8. "propertyPath": "../x_component_process_FormDesigner/Module/Tab$Page/tab$Page.html",
  9. "actions": [
  10. {
  11. "name": "move",
  12. "icon": "move1.png",
  13. "event": "mousedown",
  14. "action": "move",
  15. "title": MWF.APPFD.LP.formAction.move
  16. },
  17. //{
  18. // "name": "copy",
  19. // "icon": "copy1.png",
  20. // "event": "click",
  21. // "action": "copy",
  22. // "title": MWF.APPFD.LP.formAction.copy
  23. //},
  24. {
  25. "name": "add",
  26. "icon": "add.png",
  27. "event": "click",
  28. "action": "addPage",
  29. "title": MWF.APPFD.LP.formAction.add
  30. },
  31. {
  32. "name": "delete",
  33. "icon": "delete1.png",
  34. "event": "click",
  35. "action": "delete",
  36. "title": MWF.APPFD.LP.formAction["delete"]
  37. }
  38. ],
  39. "injectActions" : null
  40. },
  41. initialize: function(tab, page, options){
  42. this.setOptions(options);
  43. this.path = "../x_component_process_FormDesigner/Module/Tab$Page/";
  44. this.cssPath = "../x_component_process_FormDesigner/Module/Tab$Page/"+this.options.style+"/css.wcss";
  45. this._loadCss();
  46. this.moduleType = "element";
  47. this.moduleName = "tab$Page";
  48. this.form = tab.form;
  49. this.tab = tab;
  50. this.page = page;
  51. },
  52. setAllStyles: function(){},
  53. _initModule: function(){
  54. this._setNodeProperty();
  55. if (!this.form.isSubform) this._createIconAction();
  56. this._setNodeEvent();
  57. if (this.form.moduleElementNodeList.indexOf(this.node)!=-1) this.form.moduleElementNodeList.erase(this.node);
  58. },
  59. load : function(json, node, parent){
  60. this.json = json;
  61. this.node= node;
  62. this.node.store("module", this);
  63. this.node.setStyles(this.css.moduleNode);
  64. if (!this.json.id){
  65. var id = this._getNewId(parent.json.id);
  66. this.json.id = id;
  67. }
  68. if (this.json.name) this.page.textNode.set("text", this.json.name);
  69. node.set({
  70. "MWFType": "tab$Page",
  71. "id": this.json.id
  72. });
  73. if (!this.form.json.moduleList[this.json.id]){
  74. this.form.json.moduleList[this.json.id] = this.json;
  75. }
  76. this._initModule();
  77. this._loadTreeNode(parent);
  78. this.parentContainer = this.treeNode.parentNode.module;
  79. this.page.setOptions({
  80. "onPostShow": function(){
  81. this.initialStyles = this.page.tab.css.tabNodeCurrent;
  82. this.node.store("normalBorder", this.page.tab.css.tabNodeCurrent);
  83. }.bind(this),
  84. "onPostHide": function(){
  85. this.initialStyles = this.page.tab.css.tabNode;
  86. this.node.store("normalBorder", this.page.tab.css.tabNode);
  87. }.bind(this)
  88. });
  89. this._setEditStyle_custom("id");
  90. this.json.moduleName = this.moduleName;
  91. },
  92. //_dragIn: function(module){
  93. //this.treeNode.parentNode.module._dragIn(module);
  94. //},
  95. _setEditStyle_custom: function(name){
  96. if (name=="width"){
  97. if (this.json.width){
  98. if (this.json.width.toInt()>60) this.node.setStyle("width", ""+this.json.width+"px");
  99. }
  100. }
  101. if (name=="name"){
  102. this.page.textNode.set("text", this.json.name);
  103. }
  104. },
  105. "addPage": function(){
  106. var page = this.tab.addPage();
  107. page.tabNode.inject(this.page.tabNode, "before");
  108. page.contentNodeArea.inject(this.page.contentNodeArea, "before");
  109. page.showTabIm();
  110. },
  111. "delete": function(e){
  112. var module = this;
  113. this.form.designer.confirm("warn", e, MWF.APPFD.LP.notice.deleteElementTitle, MWF.APPFD.LP.notice.deleteElement, 300, 120, function(){
  114. if (module.tab.containers.length<=1){
  115. module.tab.destroy();
  116. }else{
  117. var contentModule = module.page.contentNode.retrieve("module");
  118. module.destroy();
  119. module.tab.elements.erase(module);
  120. contentModule.destroy();
  121. module.tab.containers.erase(contentModule);
  122. module.page.closeTab();
  123. }
  124. this.close();
  125. }, function(){
  126. this.close();
  127. }, null);
  128. },
  129. destroy: function(){
  130. this.form.moduleList.erase(this);
  131. this.form.moduleNodeList.erase(this.node);
  132. this.form.moduleElementNodeList.erase(this.node);
  133. //this.tab.elements.erase(this);
  134. this.node.destroy();
  135. this.actionArea.destroy();
  136. delete this.form.json.moduleList[this.json.id];
  137. this.json = null;
  138. delete this.json;
  139. this.treeNode.destroy();
  140. },
  141. move: function(e){
  142. var pageNodes = [];
  143. this.tab.tabWidget.pages.each(function(page){
  144. if (page!=this.page){
  145. pageNodes.push(page.tabNode);
  146. }
  147. }.bind(this));
  148. this._createMoveNode();
  149. this._setNodeMove(pageNodes, e);
  150. },
  151. _createMoveNode: function(){
  152. this.moveNode = this.node.clone();
  153. this.moveNode.inject(this.form.node);
  154. this.moveNode.setStyles({
  155. "border": "2px dashed #ffa200",
  156. "opacity": 0.7,
  157. "position": "absolute"
  158. });
  159. },
  160. _onEnterOther: function(){
  161. // this.copyNode.setStyles(this.tab.tabWidget.css.tabNode);
  162. // this.copyNode.setStyles(this.css.moduleNodeShow);
  163. },
  164. _createCopyNode: function(){
  165. this.copyNode = new Element("div");
  166. this.copyNode.setStyles(this.css.moduleNodeShow);
  167. this.copyNode.addEvent("selectstart", function(){
  168. return false;
  169. });
  170. },
  171. _setNodeMove: function(droppables, e){
  172. this._setMoveNodePosition(e);
  173. var movePosition = this.moveNode.getPosition();
  174. var moveSize = this.moveNode.getSize();
  175. var tabPosition = this.tab.node.getPosition();
  176. var tabSize = this.tab.node.getSize();
  177. var nodeDrag = new Drag.Move(this.moveNode, {
  178. "droppables": droppables,
  179. "limit": {
  180. "x": [tabPosition.x, tabPosition.x+tabSize.x],
  181. "y": [movePosition.y, movePosition.y+moveSize.y]
  182. },
  183. "onEnter": function(dragging, inObj){
  184. var module = inObj.retrieve("module");
  185. if (module) module._dragIn(this);
  186. this._onEnterOther(dragging, inObj);
  187. }.bind(this),
  188. "onLeave": function(dragging, inObj){
  189. var module = inObj.retrieve("module");
  190. if (module) module._dragOut(this);
  191. this._onLeaveOther(dragging, inObj);
  192. }.bind(this),
  193. "onDrop": function(dragging, inObj){
  194. if (inObj){
  195. var module = inObj.retrieve("module");
  196. if (module) module._dragDrop(this);
  197. this._nodeDrop( module );
  198. if (module){
  199. this.page.contentNodeArea.inject(module.page.contentNodeArea, "before");
  200. }
  201. }else{
  202. this._dragCancel(dragging);
  203. }
  204. }.bind(this),
  205. "onCancel": function(dragging){
  206. this._dragCancel(dragging);
  207. }.bind(this)
  208. });
  209. nodeDrag.start(e);
  210. this.form.moveModule = this;
  211. this.form.recordCurrentSelectedModule = this.form.currentSelectedModule;
  212. this.form.selected();
  213. },
  214. _preprocessingModuleData: function(){
  215. this.recoveryWidgetstyle = this.node.get("style");
  216. this.node.clearStyles();
  217. //if (this.initialStyles) this.node.setStyles(this.initialStyles);
  218. this.json.recoveryStyles = Object.clone(this.json.styles);
  219. if (this.json.recoveryStyles) Object.each(this.json.recoveryStyles, function(value, key){
  220. if ((value.indexOf("x_processplatform_assemble_surface")!=-1 || value.indexOf("x_portal_assemble_surface")!=-1)){
  221. //需要运行时处理
  222. }else{
  223. this.node.setStyle(key, value);
  224. delete this.json.styles[key];
  225. }
  226. }.bind(this));
  227. },
  228. _recoveryModuleData: function(){
  229. if (this.recoveryWidgetstyle) this.node.set("style", this.recoveryWidgetstyle);
  230. this.recoveryWidgetstyle = null;
  231. if (this.json.recoveryStyles) this.json.styles = this.json.recoveryStyles;
  232. this.json.recoveryStyles = null;
  233. },
  234. setCustomStyles: function(){
  235. this._recoveryModuleData();
  236. //debugger;
  237. // var border = this.node.getStyle("border");
  238. // this.node.clearStyles();
  239. // this.node.setStyles(this.css.moduleNode);
  240. //
  241. // if (this.initialStyles) this.node.setStyles(this.initialStyles);
  242. // this.node.setStyle("border", border);
  243. //
  244. // if (this.json.styles) Object.each(this.json.styles, function(value, key){
  245. // if ((value.indexOf("x_processplatform_assemble_surface")!=-1 || value.indexOf("x_portal_assemble_surface")!=-1)){
  246. // var host1 = MWF.Actions.getHost("x_processplatform_assemble_surface");
  247. // var host2 = MWF.Actions.getHost("x_portal_assemble_surface");
  248. // if (value.indexOf("/x_processplatform_assemble_surface")!==-1){
  249. // value = value.replace("/x_processplatform_assemble_surface", host1+"/x_processplatform_assemble_surface");
  250. // }else if (value.indexOf("x_processplatform_assemble_surface")!==-1){
  251. // value = value.replace("x_processplatform_assemble_surface", host1+"/x_processplatform_assemble_surface");
  252. // }
  253. // if (value.indexOf("/x_portal_assemble_surface")!==-1){
  254. // value = value.replace("/x_portal_assemble_surface", host2+"/x_portal_assemble_surface");
  255. // }else if (value.indexOf("x_portal_assemble_surface")!==-1){
  256. // value = value.replace("x_portal_assemble_surface", host2+"/x_portal_assemble_surface");
  257. // }
  258. // }
  259. //
  260. // var reg = /^border\w*/ig;
  261. // if (!key.test(reg)){
  262. // if (key){
  263. // if (key.toString().toLowerCase()==="display"){
  264. // if (value.toString().toLowerCase()==="none"){
  265. // this.node.setStyle("opacity", 0.3);
  266. // }else{
  267. // this.node.setStyle("opacity", 1);
  268. // this.node.setStyle(key, value);
  269. // }
  270. // }else{
  271. // this.node.setStyle(key, value);
  272. // }
  273. // }
  274. // }
  275. // }.bind(this));
  276. }
  277. });