QueryView.js 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212
  1. MWF.xApplication.cms.FormDesigner.Module = MWF.xApplication.cms.FormDesigner.Module || {};
  2. MWF.xDesktop.requireApp("cms.FormDesigner", "Module.$Element", null, false);
  3. MWF.xApplication.cms.FormDesigner.Module.QueryView = MWF.CMSFCQueryView = new Class({
  4. Extends: MWF.CMSFC$Element,
  5. Implements: [Options, Events],
  6. options: {
  7. "style": "default",
  8. "propertyPath": "/x_component_cms_FormDesigner/Module/QueryView/queryview.html"
  9. },
  10. initialize: function(form, options){
  11. this.setOptions(options);
  12. this.path = "/x_component_cms_FormDesigner/Module/QueryView/";
  13. this.cssPath = "/x_component_cms_FormDesigner/Module/QueryView/"+this.options.style+"/css.wcss";
  14. this._loadCss();
  15. this.moduleType = "element";
  16. this.moduleName = "queryview";
  17. this.form = form;
  18. this.container = null;
  19. this.containerNode = null;
  20. },
  21. load : function(json, node, parent){
  22. this.json = json;
  23. this.node= node;
  24. this.node.store("module", this);
  25. //this.node.empty();
  26. this.node.setStyles(this.css.moduleNode);
  27. this._loadNodeStyles();
  28. this._initModule();
  29. this._loadTreeNode(parent);
  30. //this.setCustomStyles();
  31. this.parentContainer = this.treeNode.parentNode.module;
  32. this._setEditStyle_custom("id");
  33. this.json.moduleName = this.moduleName;
  34. // this.parseModules();
  35. },
  36. _createMoveNode: function(){
  37. this.moveNode = new Element("div", {
  38. "MWFType": "queryview",
  39. "id": this.json.id,
  40. "styles": this.css.moduleNodeMove,
  41. "events": {
  42. "selectstart": function(){
  43. return false;
  44. }
  45. }
  46. }).inject(this.form.container);
  47. },
  48. _initModule: function(){
  49. this.setPropertiesOrStyles("styles");
  50. this.setPropertiesOrStyles("properties");
  51. this._checkView(function(){
  52. this._setTitleStyles();
  53. }.bind(this));
  54. this._setNodeProperty();
  55. this._createIconAction();
  56. this._setNodeEvent();
  57. },
  58. _createNode: function(){
  59. this.node = this.moveNode.clone(true, true);
  60. this.node.setStyles(this.css.moduleNode);
  61. this.node.set("id", this.json.id);
  62. this.node.addEvent("selectstart", function(){
  63. return false;
  64. });
  65. this.iconNode = new Element("div", {
  66. "styles": this.css.iconNode
  67. }).inject(this.node);
  68. new Element("div", {
  69. "styles": this.css.iconNodeIcon
  70. }).inject(this.iconNode);
  71. new Element("div", {
  72. "styles": this.css.iconNodeText,
  73. "text": "QueryView"
  74. }).inject(this.iconNode);
  75. },
  76. _loadNodeStyles: function(){
  77. this.iconNode = this.node.getElement("div").setStyles(this.css.iconNode);
  78. this.iconNode.getFirst("div").setStyles(this.css.iconNodeIcon);
  79. this.iconNode.getLast("div").setStyles(this.css.iconNodeText);
  80. this.viewNode = this.node.getChildren("div")[1];
  81. if (this.viewNode){
  82. this.node.setStyle("background", "transparent");
  83. this.viewTable = this.viewNode.getElement("table").setStyles(this.css.viewTitleTableNode);
  84. this.viewLine = this.viewTable.getElement("tr").setStyles(this.css.viewTitleLineNode);
  85. this.viewSelectCell = this.viewLine.getElement("td").setStyles(this.css.viewTitleCellNode);
  86. this._setViewNodeTitle();
  87. }
  88. },
  89. _createViewNode: function(callback){
  90. if (!this.viewNode) this.viewNode = new Element("div", {"styles": this.css.viewNode}).inject(this.node);
  91. this.node.setStyle("background", "transparent");
  92. this.viewTable = new Element("table", {
  93. "styles": this.css.viewTitleTableNode,
  94. "border": "0px",
  95. "cellPadding": "0",
  96. "cellSpacing": "0"
  97. }).inject(this.viewNode);
  98. this.viewLine = new Element("tr", {"styles": this.css.viewTitleLineNode}).inject(this.viewTable);
  99. if (this.json.select!="no"){
  100. this.viewSelectCell = new Element("td", {
  101. "styles": this.css.viewTitleCellNode
  102. }).inject(this.viewLine);
  103. this.viewSelectCell.setStyle("width", "10px");
  104. }
  105. this.form.designer.actions.getQueryView(this.json["queryview"], function(json){
  106. var viewData = JSON.decode(json.data.data);
  107. viewData.selectEntryList.each(function(column){
  108. // if (column.export){
  109. var viewCell = new Element("td", {
  110. "styles": this.css.viewTitleCellNode,
  111. "text": column.displayName
  112. }).inject(this.viewLine);
  113. // }
  114. }.bind(this));
  115. if (callback) callback();
  116. }.bind(this));
  117. this._setViewNodeTitle();
  118. },
  119. _setViewNodeTitle: function(){
  120. if (this.viewTable){
  121. if (this.json["isTitle"] == "no"){
  122. this.viewTable.setStyle("opacity", 0.5);
  123. }else{
  124. this.viewTable.setStyle("opacity", 1);
  125. }
  126. }
  127. },
  128. _setEditStyle: function(name, input, oldValue){
  129. if (name=="queryview"){
  130. if (this.json[name]!=oldValue) this._checkView();
  131. }
  132. if (name=="select") this._checkSelect();
  133. if (name=="isTitle") this._checkTitle();
  134. if (name=="titleStyles") this._setTitleStyles();
  135. },
  136. _setTitleStyles: function(){
  137. if (this.viewLine){
  138. this.viewLine.getElements("td").each(function(td){
  139. td.clearStyles();
  140. td.setStyles(this.css.viewTitleCellNode);
  141. if (this.json.titleStyles) td.setStyles(this.json.titleStyles);
  142. }.bind(this));
  143. if (this.viewSelectCell) this.viewSelectCell.setStyle("width", "10px");
  144. this._checkSelect();
  145. this._checkTitle();
  146. }
  147. },
  148. _checkView: function(callback){
  149. if (this.json["queryview"] && this.json["queryview"]!="none"){
  150. this.iconNode.setStyle("display", "none");
  151. if (this.viewNode) this.viewNode.destroy();
  152. this.viewNode = null;
  153. this._createViewNode(function(){
  154. if (callback) callback();
  155. }.bind(this));
  156. }else{
  157. this.iconNode.setStyle("display", "block");
  158. if (this.viewNode) this.viewNode.destroy();
  159. this.node.setStyles(this.css.moduleNode);
  160. if (callback) callback();
  161. }
  162. },
  163. _checkSelect: function(){
  164. if (this.json["select"]!="no"){
  165. if (!this.viewSelectCell){
  166. this.viewSelectCell = new Element("td", {
  167. "styles": this.css.viewTitleCellNode
  168. }).inject(this.viewLine, "top");
  169. this.viewSelectCell.setStyle("width", "10px");
  170. }
  171. if (this.json["select"]=="single"){
  172. this.viewSelectCell.setStyle("background", "url(/x_component_cms_FormDesigner/Module/QueryView/default/icon/single.png) center center no-repeat");
  173. }else{
  174. this.viewSelectCell.setStyle("background", "url(/x_component_cms_FormDesigner/Module/QueryView/default/icon/multi.png) center center no-repeat");
  175. }
  176. }else{
  177. if (this.viewSelectCell){
  178. this.viewSelectCell.destroy();
  179. this.viewSelectCell = null;
  180. }
  181. }
  182. },
  183. _checkTitle: function(){
  184. if (!this.json["isTitle"]) this.json["isTitle"] = "yes";
  185. if (this.viewNode) this._setViewNodeTitle();
  186. }
  187. });