ViewSelector.js 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464
  1. MWF.xDesktop.requireApp("process.Xform", "$Module", null, false);
  2. MWF.xDesktop.requireApp("process.Xform", "Button", null, false);
  3. /** @class ViewSelector 视图选择组件。
  4. * @o2cn 视图选择
  5. * @example
  6. * //可以在脚本中获取该组件
  7. * //方法1:
  8. * var sourceText = this.form.get("fieldId"); //获取组件
  9. * //方法2
  10. * var sourceText = this.target; //在组件本身的脚本中获取
  11. * @extends MWF.xApplication.process.Xform.Button
  12. * @o2category FormComponents
  13. * @o2range {Process|CMS}
  14. * @hideconstructor
  15. */
  16. MWF.xApplication.process.Xform.ViewSelector = MWF.APPViewSelector = new Class({
  17. Implements: [Events],
  18. Extends: MWF.xApplication.process.Xform.Button,
  19. options: {
  20. /**
  21. * 视图参数(options)已经准备好,还未加载视图时执行。可以通过this.event得到视图参数,并可修改this.event修改视图的加载。
  22. * @event MWF.xApplication.process.Xform.ViewSelector#beforeLoadView
  23. * @see {@link https://www.yuque.com/o2oa/ixsnyt/hm5uft#i0zTS|组件事件说明}
  24. */
  25. /**
  26. * 视图设计已经获取,容器也已经准备好。
  27. * @event MWF.xApplication.process.Xform.ViewSelector#loadViewLayout
  28. * @see {@link https://www.yuque.com/o2oa/ixsnyt/hm5uft#i0zTS|组件事件说明}
  29. */
  30. /**
  31. * 异步加载视图后执行。
  32. * @event MWF.xApplication.process.Xform.ViewSelector#loadView
  33. * @see {@link https://www.yuque.com/o2oa/ixsnyt/hm5uft#i0zTS|组件事件说明}
  34. */
  35. /**
  36. * 选中视图中的一条记录后执行。
  37. * @event MWF.xApplication.process.Xform.ViewSelector#select
  38. * @see {@link https://www.yuque.com/o2oa/ixsnyt/hm5uft#i0zTS|组件事件说明}
  39. */
  40. /**
  41. * 打开视图中的一条记录后执行。
  42. * @event MWF.xApplication.process.Xform.ViewSelector#openDocument
  43. * @see {@link https://www.yuque.com/o2oa/ixsnyt/hm5uft#i0zTS|组件事件说明}
  44. */
  45. "moduleEvents": ["load", "beforeLoadView", "loadView", "queryLoad", "postLoad", "select", "openDocument"]
  46. },
  47. _loadUserInterface: function(){
  48. var button = this.node.getElement("button");
  49. if (!button) button = new Element("button");
  50. button.inject(this.node, "after");
  51. this.node.destroy();
  52. this.node = button;
  53. this.node.set({
  54. "id": this.json.id,
  55. "text": this.json.name || this.json.id,
  56. "styles": this.form.json.buttonStyle || this.form.css.buttonStyles,
  57. "MWFType": this.json.type
  58. });
  59. if(this.json.recoveryStyles){
  60. this.node.setStyles(this.json.recoveryStyles);
  61. }
  62. if( this.json.properties ){
  63. this.node.set(this.json.properties );
  64. }
  65. this.node.addEvent("click", function(){
  66. this.selectedData = null;
  67. this.selectView(function(data){
  68. this.doResult(data);
  69. }.bind(this));
  70. }.bind(this));
  71. },
  72. doResult: function(data){
  73. if (this.json.result === "script"){
  74. this.selectedData = data;
  75. return (this.json.selectedScript.code) ? this.form.Macro.exec(this.json.selectedScript.code, this) : "";
  76. }else{
  77. Object.each(this.json.selectedSetValues, function(v, k){
  78. var value = "";
  79. data.each(function(d, idx){
  80. Object.each(d.data, function(dv, dk){
  81. if (dk===v) value = (value) ? (value+", "+dv) : dv;
  82. }.bind(this));
  83. }.bind(this));
  84. var field = this.form.all[k];
  85. if (field){
  86. field.setData(value);
  87. if (value){
  88. if (field.descriptionNode) field.descriptionNode.setStyle("display", "none");
  89. }else{
  90. if (field.descriptionNode) field.descriptionNode.setStyle("display", "block");
  91. }
  92. }
  93. }.bind(this));
  94. }
  95. },
  96. selectCMSView: function(callback){
  97. var viewData = this.json.cmsViewName;
  98. if (viewData){
  99. var filter = null;
  100. if (this.json.filterList && this.json.filterList.length){
  101. filter = [];
  102. this.json.filterList.each(function(entry){
  103. entry.value = this.form.Macro.exec(entry.code.code, this);
  104. //delete entry.code;
  105. filter.push(entry);
  106. }.bind(this));
  107. }
  108. var viewJson = {
  109. "application": viewData.appId,
  110. "viewName": viewData.name,
  111. "isTitle": this.json.isTitle || "yes",
  112. "select": this.json.select || "single",
  113. "titleStyles": this.json.titleStyles,
  114. "itemStyles": this.json.itemStyles,
  115. "isExpand": this.json.isExpand || "no",
  116. "showActionbar" : this.json.actionbar === "show",
  117. "filter": filter
  118. };
  119. var options = {};
  120. var width = options.width || "800";
  121. var height = options.height || "450";
  122. var size;
  123. if (layout.mobile){
  124. size = document.body.getSize();
  125. width = size.x;
  126. height = size.y;
  127. options.style = "viewmobile";
  128. }
  129. width = width.toInt();
  130. height = height.toInt();
  131. size = this.form.app.content.getSize();
  132. var x = (size.x-width)/2;
  133. var y = (size.y-height)/2;
  134. if (x<0) x = 0;
  135. if (y<0) y = 0;
  136. if (layout.mobile){
  137. x = 20;
  138. y = 0;
  139. }
  140. var _self = this;
  141. MWF.require("MWF.xDesktop.Dialog", function(){
  142. var dlg = new MWF.xDesktop.Dialog({
  143. "title": this.json.title || "select view",
  144. "style": options.style || "view",
  145. "top": y,
  146. "left": x-20,
  147. "fromTop":y,
  148. "fromLeft": x-20,
  149. "width": width,
  150. "height": height,
  151. "html": "<div></div>",
  152. "maskNode": this.form.app.content,
  153. "container": this.form.app.content,
  154. "buttonList": [
  155. {
  156. "text": MWF.LP.process.button.ok,
  157. "action": function(){
  158. //if (callback) callback(_self.view.selectedItems);
  159. if (callback) callback(_self.view.getData());
  160. this.close();
  161. }
  162. },
  163. {
  164. "text": MWF.LP.process.button.cancel,
  165. "action": function(){this.close();}
  166. }
  167. ]
  168. });
  169. dlg.show();
  170. if (layout.mobile){
  171. var backAction = dlg.node.getElement(".MWF_dialod_Action_back");
  172. var okAction = dlg.node.getElement(".MWF_dialod_Action_ok");
  173. if (backAction) backAction.addEvent("click", function(e){
  174. dlg.close();
  175. }.bind(this));
  176. if (okAction) okAction.addEvent("click", function(e){
  177. //if (callback) callback(this.view.selectedItems);
  178. if (callback) callback(this.view.getData());
  179. dlg.close();
  180. }.bind(this));
  181. }
  182. // MWF.xDesktop.requireApp("process.Xform", "widget.CMSView", function(){
  183. // this.view = new MWF.xApplication.process.Xform.widget.CMSView(dlg.content.getFirst(), viewJson, {"style": "select"});
  184. // }.bind(this));
  185. MWF.xDesktop.requireApp("process.Application", "Viewer", function(){
  186. this.view = new MWF.xApplication.process.Application.Viewer(dlg.content, viewJson, {
  187. "actions": {
  188. "lookup": {"uri": "/jaxrs/queryview/flag/{view}/application/flag/{application}/execute", "method":"PUT"},
  189. "getView": {"uri": "/jaxrs/queryview/flag/{view}/application/flag/{application}"}
  190. },
  191. "actionRoot": "x_cms_assemble_control"
  192. });
  193. }.bind(this));
  194. }.bind(this));
  195. }
  196. },
  197. selectProcessView: function(callback){
  198. var viewData = this.json.processViewName;
  199. if (viewData){
  200. var filter = null;
  201. if (this.json.filterList && this.json.filterList.length){
  202. filter = [];
  203. this.json.filterList.each(function(entry){
  204. entry.value = this.form.Macro.exec(entry.code.code, this);
  205. //delete entry.code;
  206. filter.push(entry);
  207. }.bind(this));
  208. }
  209. var viewJson = {
  210. "application": viewData.application,
  211. "viewName": viewData.name,
  212. "isTitle": this.json.isTitle || "yes",
  213. "select": this.json.select || "single",
  214. "titleStyles": this.json.titleStyles,
  215. "itemStyles": this.json.itemStyles,
  216. "isExpand": this.json.isExpand || "no",
  217. "showActionbar" : this.json.actionbar === "show",
  218. "filter": filter
  219. };
  220. var options = {};
  221. var width = options.width || "800";
  222. var height = options.height || "600";
  223. var size;
  224. if (layout.mobile){
  225. size = document.body.getSize();
  226. width = size.x;
  227. height = size.y;
  228. options.style = "viewmobile";
  229. }
  230. width = width.toInt();
  231. height = height.toInt();
  232. size = this.form.app.content.getSize();
  233. var x = (size.x-width)/2;
  234. var y = (size.y-height)/2;
  235. if (x<0) x = 0;
  236. if (y<0) y = 0;
  237. if (layout.mobile){
  238. x = 20;
  239. y = 0;
  240. }
  241. var _self = this;
  242. MWF.require("MWF.xDesktop.Dialog", function(){
  243. var dlg = new MWF.xDesktop.Dialog({
  244. "title": this.json.title || "select view",
  245. "style": options.style || "view",
  246. "top": y,
  247. "left": x-20,
  248. "fromTop":y,
  249. "fromLeft": x-20,
  250. "width": width,
  251. "height": height,
  252. "html": "",
  253. "maskNode": this.form.app.content,
  254. "container": this.form.app.content,
  255. "buttonList": [
  256. {
  257. "text": MWF.LP.process.button.ok,
  258. "action": function(){
  259. //if (callback) callback(_self.view.selectedItems);
  260. if (callback) callback(_self.view.getData());
  261. this.close();
  262. }
  263. },
  264. {
  265. "text": MWF.LP.process.button.cancel,
  266. "action": function(){this.close();}
  267. }
  268. ]
  269. });
  270. dlg.show();
  271. if (layout.mobile){
  272. var backAction = dlg.node.getElement(".MWF_dialod_Action_back");
  273. var okAction = dlg.node.getElement(".MWF_dialod_Action_ok");
  274. if (backAction) backAction.addEvent("click", function(e){
  275. dlg.close();
  276. }.bind(this));
  277. if (okAction) okAction.addEvent("click", function(e){
  278. //if (callback) callback(this.view.selectedItems);
  279. if (callback) callback(this.view.getData());
  280. dlg.close();
  281. }.bind(this));
  282. }
  283. // MWF.xDesktop.requireApp("process.Xform", "widget.View", function(){
  284. // this.view = new MWF.xApplication.process.Xform.widget.View(dlg.content.getFirst(), viewJson, {"style": "select"});
  285. // }.bind(this));
  286. MWF.xDesktop.requireApp("process.Application", "Viewer", function(){
  287. this.view = new MWF.xApplication.process.Application.Viewer(dlg.content, viewJson);
  288. }.bind(this));
  289. }.bind(this));
  290. }
  291. },
  292. selectQueryView: function(callback){
  293. var viewData = this.json.queryView;
  294. if (viewData){
  295. var filter = null;
  296. if (this.json.filterList && this.json.filterList.length){
  297. filter = [];
  298. this.json.filterList.each(function(entry){
  299. entry.value = this.form.Macro.exec(entry.code.code, this);
  300. //delete entry.code;
  301. filter.push(entry);
  302. }.bind(this));
  303. }
  304. var viewJson = {
  305. "application": viewData.appName,
  306. "viewName": viewData.name,
  307. "viewId": viewData.id,
  308. "isTitle": this.json.isTitle || "yes",
  309. "select": this.json.select || "single",
  310. "titleStyles": this.json.titleStyles,
  311. "itemStyles": this.json.itemStyles,
  312. "isExpand": this.json.isExpand || "no",
  313. "showActionbar" : this.json.actionbar === "show",
  314. "filter": filter,
  315. "defaultSelectedScript" : this.json.defaultSelectedScript ? this.json.defaultSelectedScript.code : null,
  316. "selectedAbleScript" : this.json.selectedAbleScript ? this.json.selectedAbleScript.code : null
  317. };
  318. this.fireEvent("beforeLoadView", [viewJson]);
  319. var options = {};
  320. // var width = options.width || "850";
  321. // var height = options.height || "700";
  322. var width = this.json.DialogWidth || "850";
  323. var height = this.json.DialogHeight || "700";
  324. if (layout.mobile){
  325. var size = document.body.getSize();
  326. width = size.x;
  327. height = size.y;
  328. options.style = "viewmobile";
  329. }
  330. width = width.toInt();
  331. height = height.toInt();
  332. var size = this.form.app.content.getSize();
  333. var x = (size.x-width)/2;
  334. var y = (size.y-height)/2;
  335. if (x<0) x = 0;
  336. if (y<0) y = 0;
  337. if (layout.mobile){
  338. x = 20;
  339. y = 0;
  340. }
  341. var _self = this;
  342. MWF.require("MWF.xDesktop.Dialog", function(){
  343. var dlg = new MWF.xDesktop.Dialog({
  344. "title": this.json.title || "select view",
  345. "style": options.style || "view",
  346. "top": y,
  347. "left": x-20,
  348. "fromTop":y,
  349. "fromLeft": x-20,
  350. "width": width,
  351. "height": height,
  352. "html": "",
  353. "maxHeightPercent": layout.mobile ? "100%" : "98%",
  354. "maskNode": layout.mobile?$(document.body) : this.form.app.content,
  355. "container": layout.mobile?$(document.body) : this.form.app.content,
  356. "buttonList": [
  357. {
  358. "text": MWF.LP.process.button.ok,
  359. "action": function(){
  360. //if (callback) callback(_self.view.selectedItems);
  361. if (callback) callback(_self.view.getData());
  362. this.close();
  363. }
  364. },
  365. {
  366. "text": MWF.LP.process.button.cancel,
  367. "action": function(){this.close();}
  368. }
  369. ],
  370. "onPostShow": function(){
  371. if(layout.mobile){
  372. dlg.node.setStyle("z-index",200);
  373. }
  374. MWF.xDesktop.requireApp("query.Query", "Viewer", function(){
  375. // this.view = new MWF.xApplication.query.Query.Viewer(dlg.content, viewJson, {
  376. // "style": "select"
  377. // }, this.form.app, this.form.Macro );
  378. this.view = new MWF.xApplication.query.Query.Viewer(dlg.content, viewJson, {
  379. "style": "select",
  380. "onLoadLayout": function () {
  381. this.fireEvent("loadViewLayout");
  382. }.bind(this),
  383. "onLoadView": function(){
  384. this.fireEvent("loadView");
  385. }.bind(this),
  386. "onSelect": function(item){
  387. this.fireEvent("select", [item]);
  388. }.bind(this),
  389. "onUnselect": function(item){
  390. this.fireEvent("unselect", [item]);
  391. }.bind(this),
  392. "onOpenDocument": function(options, item){
  393. this.openOptions = {
  394. "options": options,
  395. "item": item
  396. };
  397. this.fireEvent("openDocument", [this.openOptions]);
  398. this.openOptions = null;
  399. }.bind(this)
  400. }, this.form.app, this.form.Macro);
  401. }.bind(this));
  402. }.bind(this)
  403. });
  404. dlg.show();
  405. if (layout.mobile){
  406. var backAction = dlg.node.getElement(".MWF_dialod_Action_back");
  407. var okAction = dlg.node.getElement(".MWF_dialod_Action_ok");
  408. if (backAction) backAction.addEvent("click", function(e){
  409. dlg.close();
  410. }.bind(this));
  411. if (okAction) okAction.addEvent("click", function(e){
  412. //if (callback) callback(this.view.selectedItems);
  413. if (callback) callback(this.view.getData());
  414. dlg.close();
  415. }.bind(this));
  416. }
  417. // MWF.xDesktop.requireApp("process.Xform", "widget.View", function(){
  418. // this.view = new MWF.xApplication.process.Xform.widget.View(dlg.content.getFirst(), viewJson, {"style": "select"});
  419. // }.bind(this));
  420. // MWF.xDesktop.requireApp("query.Query", "Viewer", function(){
  421. // this.view = new MWF.xApplication.query.Query.Viewer(dlg.content, viewJson, {"style": "select"});
  422. // }.bind(this));
  423. }.bind(this));
  424. }
  425. },
  426. selectView: function(callback){
  427. if (this.json.queryView){
  428. this.selectQueryView(callback);
  429. }else{
  430. if (this.json.selectViewType==="cms"){
  431. this.selectCMSView(callback);
  432. }else{
  433. this.selectProcessView(callback);
  434. }
  435. }
  436. }
  437. });