Custom.js 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577
  1. MWF.xApplication.Selector = MWF.xApplication.Selector || {};
  2. MWF.xApplication.Template = MWF.xApplication.Template || {};
  3. MWF.xApplication.Template.Selector = MWF.xApplication.Template.Selector || {};
  4. MWF.xDesktop.requireApp("Selector", "Person", null, false);
  5. MWF.xDesktop.requireApp("Selector", "Unit", null, false);
  6. // this.options.selectableItems = [
  7. // {
  8. // "name": "项目1",
  9. // "id": "item1",
  10. // "isItem" : true //第一层的item需要isItem = true
  11. // },
  12. // {
  13. // "name": "项目2",
  14. // "id": "item2",
  15. // "isItem" : true //第一层的item需要isItem = true
  16. // },
  17. // {
  18. // "name": "分类1",
  19. // "id": "category1",
  20. // "subItemList": [
  21. // {
  22. // "id": "item1.1",
  23. // "name": "项目1.1"
  24. // },
  25. // {
  26. // "id": "item1.2",
  27. // "name": "项目1.2"
  28. // }
  29. // ],
  30. // "subCategoryList" : [
  31. // {
  32. // "name": "分类1.1",
  33. // "id": "category1.1",
  34. // "subItemList" : [
  35. // {
  36. // "id": "item1.1.1",
  37. // "name": "项目1.1.1"
  38. // }
  39. // ]
  40. // }
  41. // ]
  42. // }
  43. // ];
  44. MWF.xApplication.Template.Selector.Custom = new Class({
  45. Extends: MWF.xApplication.Selector.Person,
  46. options: {
  47. "style": "default",
  48. "count": 0,
  49. "title": "选择列表",
  50. "values": [],
  51. "selectableItems": [],
  52. "names": [],
  53. "category": false,
  54. "expand": true,
  55. "categorySelectable" : false,
  56. "expandSubEnable" : true,
  57. "uniqueFlag" : false,
  58. "defaultExpandLevel" : 1
  59. },
  60. initialize: function (container, options) {
  61. this.setOptions(options);
  62. this.path = "../x_component_Selector/$Selector/";
  63. this.cssPath = "../x_component_Selector/$Selector/" + this.options.style + "/css.wcss";
  64. this._loadCss(true);
  65. this.container = $(container);
  66. this.selectedItems = [];
  67. this.items = [];
  68. // this.categorys = [];
  69. this.subCategorys = []; //直接的分类
  70. this.subItems = []; //直接的选择项
  71. },
  72. loadSelectItems: function (addToNext) {
  73. if (!this.options.category) {
  74. this.options.selectableItems.each(function (it) {
  75. var name = typeOf(it) === "string" ? it : it.name;
  76. var id = typeOf(it) === "string" ? it : it.id;
  77. var item = this._newItem({name: name, id: id}, this, this.itemAreaNode);
  78. this.items.push(item);
  79. this.subItems.push( item );
  80. }.bind(this))
  81. } else {
  82. this.options.selectableItems.each(function (item, index) {
  83. if (item.isItem) {
  84. var item = this._newItem(item, this, this.itemAreaNode);
  85. this.items.push(item);
  86. this.subItems.push( item );
  87. }else{
  88. // if ( (item.subItemList && item.subItemList.length > 0) || item.subCategoryList && item.subCategoryList.length > 0 ) {
  89. if( this.options.categorySelectable ){
  90. var category = this._newItemCategorySelectable(item, this, this.itemAreaNode);
  91. this.items.push(category);
  92. this.subItems.push( category );
  93. this.subCategorys.push( category );
  94. }else{
  95. var category = this._newItemCategory(item, this, this.itemAreaNode);
  96. this.subCategorys.push( category );
  97. }
  98. // item.subItemList.each(function (subItem, index) {
  99. // var item = this._newItem(subItem, this, category.children, 2, category);
  100. // this.items.push(item);
  101. // category.subItems.push(item);
  102. // }.bind(this));
  103. // }
  104. }
  105. }.bind(this));
  106. }
  107. if(this.afterLoadSelectItem)this.afterLoadSelectItem();
  108. },
  109. _scrollEvent: function (y) {
  110. return true;
  111. },
  112. _getChildrenItemIds: function (data) {
  113. return data.subItemList || [];
  114. },
  115. _newItemCategory: function (data, selector, container, level, parentCategory, delay) {
  116. return new MWF.xApplication.Template.Selector.Custom.ItemCategory(data, selector, container, level, parentCategory, delay)
  117. },
  118. _newItemCategorySelectable: function (data, selector, container, level, category, delay) {
  119. return new MWF.xApplication.Template.Selector.Custom.ItemCategorySelectable(data, selector, container, level, category, delay)
  120. },
  121. _listItemByKey: function (callback, failure, key) {
  122. if (key) {
  123. this.initSearchArea(true);
  124. this.searchInItems(key);
  125. } else {
  126. this.initSearchArea(false);
  127. }
  128. },
  129. _newItemSelected: function (data, selector, container, level, category, delay) {
  130. return new MWF.xApplication.Template.Selector.Custom.ItemSelected(data, selector, container, level, category, delay)
  131. },
  132. _listItemByPinyin: function (callback, failure, key) {
  133. if (key) {
  134. this.initSearchArea(true);
  135. this.searchInItems(key);
  136. } else {
  137. this.initSearchArea(false);
  138. }
  139. },
  140. nestData : function( data, isItem ){
  141. if( !this.nestedData )this.nestedData = {};
  142. var setNest = function (d, isItem) {
  143. if( isItem ){
  144. this.nestedData[ d["id"] || d["name"] ] = d;
  145. }else if( this.options.categorySelectable ){
  146. this.nestedData[ d["id"] || d["name"] ] = { id : d.id , name : d.name };
  147. if( d.subItemList )this.nestData( d.subItemList, true );
  148. if( d.subCategoryList )this.nestData( d.subCategoryList );
  149. }else{
  150. if( d.subItemList )this.nestData( d.subItemList, true );
  151. if( d.subCategoryList )this.nestData( d.subCategoryList );
  152. }
  153. }.bind(this);
  154. if( data ){
  155. for( var i=0; i<data.length; i++ ){
  156. var d = data[i];
  157. setNest(d, isItem );
  158. }
  159. }else{
  160. for( var i=0; i<this.options.selectableItems.length; i++ ){
  161. var d = this.options.selectableItems[i];
  162. setNest(d, d.isItem);
  163. }
  164. }
  165. },
  166. _getItem: function (callback, failure, id, async, data) {
  167. if( !this.nestedData )this.nestData();
  168. if (callback) callback.apply(id, [{ "data": this.nestedData[id] || {"id": id} }]);
  169. },
  170. _newItem: function (data, selector, container, level, category, delay) {
  171. return new MWF.xApplication.Template.Selector.Custom.Item(data, selector, container, level, category, delay);
  172. },
  173. createItemsSearchData: function (callback) {
  174. if (!this.itemsSearchData) {
  175. this.itemsSearchData = [];
  176. MWF.require("MWF.widget.PinYin", function () {
  177. var initIds = [];
  178. this.items.each(function (item) {
  179. if (initIds.indexOf(item.data.name) == -1) {
  180. var text = item._getShowName().toLowerCase();
  181. var pinyin = text.toPY().toLowerCase();
  182. var firstPY = text.toPYFirst().toLowerCase();
  183. this.itemsSearchData.push({
  184. "text": text,
  185. "pinyin": pinyin,
  186. "firstPY": firstPY,
  187. "data": item.data
  188. });
  189. initIds.push(item.data.name);
  190. }
  191. }.bind(this));
  192. delete initIds;
  193. if (callback) callback();
  194. }.bind(this));
  195. } else {
  196. if (callback) callback();
  197. }
  198. }
  199. });
  200. MWF.xApplication.Template.Selector.Custom.Item = new Class({
  201. Extends: o2.xApplication.Selector.Person.Item,
  202. _getShowName: function () {
  203. return this.data.name;
  204. },
  205. _setIcon: function () {
  206. var style = this.selector.options.style;
  207. this.iconNode.setStyle("background-image", "url(" + "../x_component_Selector/$Selector/" + style + "/icon/processicon.png)");
  208. },
  209. _getTtiteText: function () {
  210. return this.data.name;
  211. },
  212. loadSubItem: function () {
  213. return false;
  214. },
  215. checkSelectedSingle: function () {
  216. var selectedItem = this.selector.options.values.filter(function (item, index) {
  217. if( this.selector.options.uniqueFlag ){
  218. var flag = this.selector.options.uniqueFlag;
  219. if (typeOf(item) === "object") return ( this.data[flag] && this.data[flag] === item[flag] );
  220. if (typeOf(item) === "string") return ( this.data[flag] && this.data[flag] === item );
  221. }else{
  222. if (typeOf(item) === "object") return ( this.data.id && this.data.id === item.id) || (this.data.name && this.data.name === item.name);
  223. if (typeOf(item) === "string") return ( this.data.id && this.data.id === item) || (this.data.name && this.data.name === item);
  224. }
  225. return false;
  226. }.bind(this));
  227. if (selectedItem.length) {
  228. this.selectedSingle();
  229. }
  230. },
  231. checkSelected: function () {
  232. var selectedItem = this.selector.selectedItems.filter(function (item, index) {
  233. if( this.selector.options.uniqueFlag ){
  234. var flag = this.selector.options.uniqueFlag;
  235. return ( item.data[flag] && item.data[flag] === this.data[flag]);
  236. }else{
  237. return ( item.data.id && item.data.id === this.data.id) || (item.data.name && item.data.name === this.data.name);
  238. }
  239. }.bind(this));
  240. if (selectedItem.length) {
  241. //selectedItem[0].item = this;
  242. selectedItem[0].addItem(this);
  243. this.selectedItem = selectedItem[0];
  244. this.setSelected();
  245. }
  246. },
  247. destroy: function(){
  248. if( this.isSelected )this.unSelected();
  249. this.selector.items.erase( this );
  250. if( this.category ){
  251. if( this.category.subCategorys && this.category.subCategorys.length ){
  252. this.category.subCategorys.erase( this );
  253. }
  254. if( this.category.subItems && this.category.subItems.length ){
  255. this.category.subItems.erase( this );
  256. }
  257. }
  258. if(this.node)this.node.destroy();
  259. delete this;
  260. }
  261. });
  262. MWF.xApplication.Template.Selector.Custom.ItemSelected = new Class({
  263. Extends: o2.xApplication.Selector.Person.ItemSelected,
  264. _getShowName: function () {
  265. return this.data.name;
  266. },
  267. _setIcon: function () {
  268. var style = this.selector.options.style;
  269. this.iconNode.setStyle("background-image", "url(" + "../x_component_Selector/$Selector/" + style + "/icon/processicon.png)");
  270. },
  271. _getTtiteText: function () {
  272. return this.data.name;
  273. },
  274. check: function () {
  275. if (this.selector.items.length) {
  276. var items = this.selector.items.filter(function (item, index) {
  277. if( this.selector.options.uniqueFlag ){
  278. var flag = this.selector.options.uniqueFlag;
  279. return ( item.data[flag] && item.data[flag] === this.data[flag]);
  280. }else{
  281. return ( item.data.id && item.data.id === this.data.id) || (item.data.name && item.data.name === this.data.name);
  282. }
  283. }.bind(this));
  284. this.items = items;
  285. if (items.length) {
  286. items.each(function (item) {
  287. item.selectedItem = this;
  288. item.setSelected();
  289. }.bind(this));
  290. }
  291. }
  292. }
  293. });
  294. MWF.xApplication.Template.Selector.Custom.ItemCategory = new Class({
  295. Extends: o2.xApplication.Selector.Person.ItemCategory,
  296. _getShowName: function () {
  297. return this.data.name;
  298. },
  299. createNode: function () {
  300. this.node = new Element("div", {
  301. "styles": this.selector.css.selectorItemCategory_department
  302. }).inject(this.container);
  303. },
  304. _setIcon: function () {
  305. var style = this.selector.options.style;
  306. this.iconNode.setStyle("background-image", "url(" + "../x_component_Selector/$Selector/" + style + "/icon/applicationicon.png)");
  307. },
  308. _getTtiteText: function () {
  309. return this.data.name;
  310. },
  311. clickItem: function (callback) {
  312. if (this._hasChild() || this.selector.options.expandEmptyCategory ) {
  313. var firstLoaded = !this.loaded;
  314. if( !firstLoaded || this.selector.options.expandEmptyCategory ){
  315. if(this.isExpand){
  316. this.selector.fireEvent("collapse", [this] );
  317. }else{
  318. this.selector.fireEvent("expand", [this] );
  319. }
  320. }
  321. this.loadSub(function () {
  322. if (firstLoaded && this._hasChild() ) {
  323. if (!this.selector.isFlatCategory) {
  324. this.children.setStyles({"display": "block", "height": "auto"});
  325. this.actionNode.setStyles(this.selector.css.selectorItemCategoryActionNode_expand);
  326. this.isExpand = true;
  327. }
  328. // this.checkSelectAll();
  329. } else {
  330. var display = this.children.getStyle("display");
  331. if (display === "none") {
  332. // this.selector.fireEvent("expand", [this] );
  333. this.children.setStyles({"display": "block", "height": "auto"});
  334. this.actionNode.setStyles(this.selector.css.selectorItemCategoryActionNode_expand);
  335. this.isExpand = true;
  336. } else {
  337. // this.selector.fireEvent("collapse", [this] );
  338. this.children.setStyles({"display": "none", "height": "0px"});
  339. this.actionNode.setStyles(this.selector.css.selectorItemCategoryActionNode_collapse);
  340. this.isExpand = false;
  341. }
  342. }
  343. if (callback) callback();
  344. }.bind(this));
  345. }
  346. },
  347. destroy : function(){
  348. while( this.subItems.length )this.subItems[0].destroy();
  349. while( this.subCategorys.length )this.subCategorys[0].destroy();
  350. if( this.category && this.category.subCategorys && this.category.subCategorys.length ){
  351. this.category.subCategorys.erase( this );
  352. }
  353. if(this.node)this.node.destroy();
  354. delete this;
  355. },
  356. reloadSub : function(callback){
  357. while( this.subItems.length )this.subItems[0].destroy();
  358. this.subItems = [];
  359. while( this.subCategorys.length )this.subCategorys[0].destroy();
  360. this.subCategorys = [];
  361. this.loaded = false;
  362. this.loadSub( callback )
  363. },
  364. loadSub: function (callback) {
  365. if (!this.loaded) {
  366. if( this._hasChildItem() ){
  367. this.data.subItemList.each(function (subItem, index) {
  368. var item = this.selector._newItem(subItem, this.selector, this.children, this.level + 1, this);
  369. this.selector.items.push(item);
  370. if(this.subItems)this.subItems.push( item );
  371. }.bind(this));
  372. }
  373. if ( this._hasChildCategory() ) {
  374. this.data.subCategoryList.each(function (subCategory, index) {
  375. var category = this.selector._newItemCategory(subCategory, this.selector, this.children, this.level + 1, this);
  376. this.subCategorys.push( category );
  377. }.bind(this));
  378. }
  379. this.loaded = true;
  380. if (callback) callback();
  381. } else {
  382. if (callback) callback();
  383. }
  384. },
  385. _hasChildCategory: function () {
  386. return (this.data.subCategoryList && this.data.subCategoryList.length);
  387. },
  388. _hasChildItem: function () {
  389. return (this.data.subItemList && this.data.subItemList.length);
  390. },
  391. _hasChild: function () {
  392. return this._hasChildCategory() || this._hasChildItem();
  393. },
  394. check: function () {
  395. },
  396. afterLoad: function(){
  397. if ( this.level <= this.selector.options.defaultExpandLevel && (this._hasChild()) ){
  398. this.clickItem();
  399. }else{
  400. this.children.hide();
  401. this.actionNode.setStyles(this.selector.css.selectorItemCategoryActionNode_collapse);
  402. this.isExpand = false;
  403. }
  404. }
  405. });
  406. MWF.xApplication.Template.Selector.Custom.ItemCategorySelectable = new Class({
  407. Extends: o2.xApplication.Selector.Unit.Item,
  408. _getShowName: function () {
  409. return this.data.name;
  410. },
  411. createNode: function () {
  412. // this.node = new Element("div", {
  413. // "styles": this.selector.css.selectorItemCategory_department //this.selector.css.selectorItemCategory_department
  414. // }).inject(this.container);
  415. },
  416. _setIcon: function () {
  417. var style = this.selector.options.style;
  418. this.iconNode.setStyle("background-image", "url(" + "../x_component_Selector/$Selector/" + style + "/icon/applicationicon.png)");
  419. },
  420. _getTtiteText: function () {
  421. return this.data.name;
  422. },
  423. destroy : function(){
  424. if( this.isSelected )this.unSelected();
  425. this.selector.items.erase( this );
  426. while( this.subItems.length )this.subItems[0].destroy();
  427. while( this.subCategorys.length )this.subCategorys[0].destroy();
  428. if( this.category ){
  429. if( this.category.subCategorys && this.category.subCategorys.length ){
  430. this.category.subCategorys.erase( this );
  431. }
  432. if( this.category.subItems && this.category.subItems.length ){
  433. this.category.subItems.erase( this );
  434. }
  435. }
  436. if(this.node)this.node.destroy();
  437. delete this;
  438. },
  439. reloadSub : function(callback){
  440. while( this.subItems.length )this.subItems[0].destroy();
  441. this.subItems = [];
  442. while( this.subCategorys.length )this.subCategorys[0].destroy();
  443. this.subCategorys = [];
  444. this.loaded = false;
  445. this.loadSubItems( callback );
  446. },
  447. loadSubItems: function( callback ){
  448. if (!this.loaded){
  449. if (!this.children){
  450. this.children = new Element("div", {
  451. "styles": this.selector.css.selectorItemCategoryChildrenNode
  452. }).inject(this.node, "after");
  453. }
  454. this.children.setStyle("display", "block");
  455. // if (!this.selector.options.expand) this.children.setStyle("display", "none");
  456. if( this._hasChildItem() ){
  457. this.data.subItemList.each(function (subItem, index) {
  458. var item = this.selector._newItem(subItem, this.selector, this.children, this.level + 1, this);
  459. this.selector.items.push(item);
  460. if(this.subItems)this.subItems.push( item );
  461. }.bind(this));
  462. }
  463. if ( this._hasChildCategory() ) {
  464. this.data.subCategoryList.each(function (subCategory, index) {
  465. var category = this.selector._newItemCategorySelectable(subCategory, this.selector, this.children, this.level + 1, this);
  466. this.selector.items.push(category);
  467. this.subCategorys.push( category );
  468. }.bind(this));
  469. }
  470. this.loaded = true;
  471. if(callback)callback();
  472. }else{
  473. this.children.setStyle("display", "block");
  474. }
  475. },
  476. loadCategoryChildren : function( callback ){
  477. if (!this.categoryLoaded){
  478. if ( this._hasChildCategory() ) {
  479. this.data.subCategoryList.each(function (subCategory, index) {
  480. var category = this.selector._newItemCategorySelectable(subCategory, this.selector, this.children, this.level + 1, this);
  481. this.selector.items.push(category);
  482. this.subCategorys.push( category );
  483. }.bind(this));
  484. }
  485. this.categoryLoaded = true;
  486. if(callback)callback();
  487. }else{
  488. if(callback)callback();
  489. }
  490. },
  491. loadItemChildren : function( callback ){
  492. if (!this.itemLoaded){
  493. if( this._hasChildItem() ){
  494. this.data.subItemList.each(function (subItem, index) {
  495. var item = this.selector._newItem(subItem, this.selector, this.children, this.level + 1, this);
  496. this.selector.items.push(item);
  497. if(this.subItems)this.subItems.push( item );
  498. }.bind(this));
  499. }
  500. this.itemLoaded = true;
  501. if(callback)callback();
  502. }else{
  503. if(callback)callback();
  504. }
  505. },
  506. _hasChildCategory: function () {
  507. return (this.data.subCategoryList && this.data.subCategoryList.length);
  508. },
  509. _hasChildItem: function () {
  510. return (this.data.subItemList && this.data.subItemList.length);
  511. },
  512. _hasChild: function () {
  513. return this._hasChildCategory() || this._hasChildItem();
  514. },
  515. checkSelectedSingle: function () {
  516. var selectedItem = this.selector.options.values.filter(function (item, index) {
  517. if( this.selector.options.uniqueFlag ){
  518. var flag = this.selector.options.uniqueFlag;
  519. if (typeOf(item) === "object") return ( this.data[flag] && this.data[flag] === item[flag] );
  520. if (typeOf(item) === "string") return ( this.data[flag] && this.data[flag] === item );
  521. }else{
  522. if (typeOf(item) === "object") return ( this.data.id && this.data.id === item.id) || (this.data.name && this.data.name === item.name);
  523. if (typeOf(item) === "string") return ( this.data.id && this.data.id === item) || (this.data.name && this.data.name === item);
  524. }
  525. return false;
  526. }.bind(this));
  527. if (selectedItem.length) {
  528. this.selectedSingle();
  529. }
  530. },
  531. checkSelected: function () {
  532. var selectedItem = this.selector.selectedItems.filter(function (item, index) {
  533. if( this.selector.options.uniqueFlag ){
  534. var flag = this.selector.options.uniqueFlag;
  535. return ( item.data[flag] && item.data[flag] === this.data[flag]);
  536. }else{
  537. return ( item.data.id && item.data.id === this.data.id) || (item.data.name && item.data.name === this.data.name);
  538. }
  539. }.bind(this));
  540. if (selectedItem.length) {
  541. //selectedItem[0].item = this;
  542. selectedItem[0].addItem(this);
  543. this.selectedItem = selectedItem[0];
  544. this.setSelected();
  545. }
  546. },
  547. check: function () {
  548. this.checkSelected();
  549. },
  550. afterLoad : function () {
  551. }
  552. });