category.js 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232
  1. $(function () {
  2. initialPage();
  3. getGrid();
  4. });
  5. let cacheData = {
  6. }
  7. function initialPage() {
  8. $(window).resize(function () {
  9. TreeGrid.table.resetHeight({height: $(window).height() - 100});
  10. });
  11. }
  12. function getGrid() {
  13. var colunms = TreeGrid.initColumn();
  14. var table = new TreeTable(TreeGrid.id, '../category/queryAll', colunms);
  15. table.setExpandColumn(2);
  16. table.setIdField("id");
  17. table.setCodeField("id");
  18. table.setParentCodeField("parentId");
  19. table.setExpandAll(false);
  20. table.setHeight($(window).height() - 100);
  21. table.init();
  22. TreeGrid.table = table;
  23. }
  24. var TreeGrid = {
  25. id: "jqGrid",
  26. table: null,
  27. layerIndex: -1
  28. };
  29. /**
  30. * 初始化表格的列
  31. */
  32. TreeGrid.initColumn = function () {
  33. var columns = [
  34. {field: 'selectItem', radio: true,width: '10px'},
  35. // {title: 'id', field: 'id', align: 'id', width: '50px'},
  36. {title: '级别', field: 'level', align: 'center', valign: 'middle', width: '300px'},
  37. {title: '分类名称', field: 'name', align: 'center', valign: 'middle', width: '600px'},
  38. // {title: '描述', field: 'frontDesc', align: 'center', valign: 'middle', width: '150px'},
  39. // {title: '首页展示', field: 'showIndex', align: 'center', valign: 'middle', width: '50px'},
  40. {
  41. title: '显示',
  42. field: 'isShow',
  43. align: 'center',
  44. valign: 'middle',
  45. width: '50px',
  46. formatter: function (item, index,row) {
  47. cacheData[item.id] = item
  48. return transIsNot(item.show)
  49. }
  50. },
  51. // {title: '类型', field: 'type', align: 'center', valign: 'middle', width: '50px'},
  52. ]
  53. return columns;
  54. };
  55. var vm = new Vue({
  56. el: '#rrapp',
  57. data: {
  58. showList: true,
  59. title: null,
  60. category: {isShow: 1, type: 0, level: 'L1', bannerUrl: '', iconUrl: '', imgUrl: '', wapBannerUrl: ''},
  61. ruleValidate: {
  62. name: [
  63. {required: true, message: '分类名称不能为空', trigger: 'blur'}
  64. ]
  65. },
  66. q: {
  67. name: ''
  68. },
  69. categoryList: []
  70. },
  71. watch:{
  72. 'category.level':function (newVal) {
  73. let temp = []
  74. vm.categoryList.forEach(function(item){
  75. if (vm.category.name!==item.name) {
  76. temp.push(item)
  77. }
  78. })
  79. vm.categoryList = temp
  80. }
  81. },
  82. methods: {
  83. query: function () {
  84. vm.reload();
  85. },
  86. add: function () {
  87. vm.showList = false;
  88. vm.title = "新增";
  89. vm.category = {isShow: 1, type: 0, level: 'L1', bannerUrl: '', iconUrl: '', imgUrl: '', wapBannerUrl: ''};
  90. this.getParentCategory();
  91. },
  92. update: function (event) {
  93. var id = TreeGrid.table.getSelectedRow();
  94. if (id.length == 0) {
  95. alert("请选择一条记录");
  96. return;
  97. }
  98. vm.showList = false;
  99. vm.title = "修改";
  100. vm.getInfo(id[0].id);
  101. this.getParentCategory();
  102. },
  103. getParentCategory: function () {
  104. Ajax.request({
  105. url: "../category/getCategorySelect",
  106. async: true,
  107. successCallback: function (r) {
  108. vm.categoryList = r.list;
  109. }
  110. });
  111. },
  112. saveOrUpdate: function (event) {
  113. var url = vm.category.id == null ? "../category/save" : "../category/update";
  114. Ajax.request({
  115. type: "POST",
  116. url: url,
  117. contentType: "application/json",
  118. params: JSON.stringify(vm.category),
  119. successCallback: function (r) {
  120. alert('操作成功', function (index) {
  121. vm.reload();
  122. });
  123. }
  124. });
  125. },
  126. del: function (event) {
  127. var id = TreeGrid.table.getSelectedRow(), ids = [];
  128. var msg = '确定要删除选中的记录?'
  129. if (id.length == 0) {
  130. alert("请选择一条记录");
  131. return;
  132. }
  133. $.each(id, function (idx, item) {
  134. ids[idx] = item.id;
  135. console.log(cacheData[item.id])
  136. if (cacheData[item.id].level === 'L1') {
  137. msg = '确定要删除选中的记录及其以下的子分类?'
  138. }
  139. });
  140. confirm(msg, function () {
  141. Ajax.request({
  142. type: "POST",
  143. url: "../category/delete",
  144. contentType: "application/json",
  145. params: JSON.stringify(ids),
  146. successCallback: function (r) {
  147. alert('操作成功', function (index) {
  148. vm.reload();
  149. });
  150. }
  151. });
  152. });
  153. },
  154. getInfo: function (id) {
  155. Ajax.request({
  156. url: "../category/info/" + id,
  157. async: true,
  158. successCallback: function (r) {
  159. vm.category = r.category;
  160. }
  161. });
  162. },
  163. reload: function (event) {
  164. vm.showList = true;
  165. TreeGrid.table.refresh();
  166. },
  167. handleSubmit: function (name) {
  168. handleSubmitValidate(this, name, function () {
  169. if (vm.category.level === 'L2' && !vm.category.parentId) {
  170. alert('请先选择父节点')
  171. return
  172. }
  173. vm.saveOrUpdate()
  174. });
  175. },
  176. handleReset: function (name) {
  177. handleResetForm(this, name);
  178. },
  179. handleFormatError: function (file) {
  180. this.$Notice.warning({
  181. title: '文件格式不正确',
  182. desc: '文件 ' + file.name + ' 格式不正确,请上传 jpg 或 png 格式的图片。'
  183. });
  184. },
  185. handleMaxSize: function (file) {
  186. this.$Notice.warning({
  187. title: '超出文件大小限制',
  188. desc: '文件 ' + file.name + ' 太大,不能超过 2M。'
  189. });
  190. },
  191. handleSuccessBannerUrl: function (res, file) {
  192. vm.category.bannerUrl = file.response.url;
  193. },
  194. eyeImageBannerUrl: function () {
  195. var url = vm.category.bannerUrl;
  196. eyeImage(url);
  197. },
  198. handleSuccessIconUrl: function (res, file) {
  199. vm.category.iconUrl = file.response.url;
  200. },
  201. eyeImageIconUrl: function () {
  202. var url = vm.category.iconUrl;
  203. eyeImage(url);
  204. },
  205. handleSuccessImgUrl: function (res, file) {
  206. vm.category.imgUrl = file.response.url;
  207. },
  208. eyeImageImgUrl: function () {
  209. var url = vm.category.imgUrl;
  210. eyeImage(url);
  211. },
  212. handleSuccessWapBannerUrl: function (res, file) {
  213. vm.category.wapBannerUrl = file.response.url;
  214. },
  215. eyeImageWapBannerUrl: function () {
  216. var url = vm.category.wapBannerUrl;
  217. eyeImage(url);
  218. }
  219. }
  220. });