topic.js 6.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205
  1. $(function () {
  2. $("#jqGrid").jqGrid({
  3. url: '../topic/list',
  4. datatype: "json",
  5. colModel: [
  6. {label: 'id', name: 'id', index: 'id', key: true, hidden: true},
  7. {label: '活动主题', name: 'title', index: 'title', width: 80},
  8. {label: '活动内容', name: 'content', index: 'content', width: 80, hidden: true},
  9. {
  10. label: '图像', name: 'avatar', index: 'avatar', width: 80, formatter: function (value) {
  11. return transImg(value);
  12. }
  13. },
  14. {
  15. label: '活动条例图片', name: 'itemPicUrl', index: 'item_pic_url', width: 80, formatter: function (value) {
  16. return transImg(value);
  17. }
  18. },
  19. {label: '子标题', name: 'subtitle', index: 'subtitle', width: 80},
  20. {label: '活动价格', name: 'priceInfo', index: 'price_info', width: 80},
  21. {
  22. label: '场景图片', name: 'scenePicUrl', index: 'scene_pic_url', width: 80, formatter: function (value) {
  23. return transImg(value);
  24. }
  25. }],
  26. viewrecords: true,
  27. height: 550,
  28. rowNum: 10,
  29. rowList: [10, 30, 50],
  30. rownumbers: true,
  31. rownumWidth: 25,
  32. autowidth: true,
  33. multiselect: true,
  34. pager: "#jqGridPager",
  35. jsonReader: {
  36. root: "page.list",
  37. page: "page.currPage",
  38. total: "page.totalPage",
  39. records: "page.totalCount"
  40. },
  41. prmNames: {
  42. page: "page",
  43. rows: "limit",
  44. order: "order"
  45. },
  46. gridComplete: function () {
  47. $("#jqGrid").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"});
  48. }
  49. });
  50. $('#content').editable({
  51. inlineMode: false,
  52. alwaysBlank: true,
  53. height: 'auto', //高度
  54. language: "zh_cn",
  55. minHeight: '200px',
  56. spellcheck: false,
  57. plainPaste: true,
  58. enableScript: false,
  59. imageButtons: ["floatImageLeft", "floatImageNone", "floatImageRight", "linkImage", "replaceImage", "removeImage"],
  60. allowedImageTypes: ["jpeg", "jpg", "png", "gif"],
  61. imageUploadURL: '../sys/oss/upload',//上传到本地服务器
  62. imageUploadParams: {id: "edit"},
  63. // imageManagerDeleteURL: '../sys/oss/delete',//删除图片(有问题)
  64. imagesLoadURL: '../sys/oss/queryAll'//管理图片
  65. });
  66. });
  67. var vm = new Vue({
  68. el: '#rrapp',
  69. data: {
  70. showList: true,
  71. title: null,
  72. topic: {avatar: '', itemPicUrl: '', scenePicUrl: ''},
  73. ruleValidate: {
  74. title: [
  75. {required: true, message: '活动主题不能为空', trigger: 'blur'}
  76. ]
  77. },
  78. q: {
  79. title: ''
  80. }
  81. },
  82. methods: {
  83. query: function () {
  84. vm.reload();
  85. },
  86. add: function () {
  87. vm.showList = false;
  88. vm.title = "新增";
  89. vm.topic = {avatar: '', itemPicUrl: '', scenePicUrl: ''};
  90. $('#content').editable('setHTML', '');
  91. },
  92. update: function (event) {
  93. var id = getSelectedRow();
  94. if (id == null) {
  95. return;
  96. }
  97. vm.showList = false;
  98. vm.title = "修改";
  99. vm.getInfo(id)
  100. },
  101. saveOrUpdate: function (event) {
  102. var url = vm.topic.id == null ? "../topic/save" : "../topic/update";
  103. //编辑器内容
  104. vm.topic.content = $('#content').editable('getHTML');
  105. $.ajax({
  106. type: "POST",
  107. url: url,
  108. contentType: "application/json",
  109. data: JSON.stringify(vm.topic),
  110. success: function (r) {
  111. if (r.code === 0) {
  112. alert('操作成功', function (index) {
  113. vm.reload();
  114. });
  115. } else {
  116. alert(r.msg);
  117. }
  118. }
  119. });
  120. },
  121. del: function (event) {
  122. var ids = getSelectedRows();
  123. if (ids == null) {
  124. return;
  125. }
  126. confirm('确定要删除选中的记录?', function () {
  127. $.ajax({
  128. type: "POST",
  129. url: "../topic/delete",
  130. contentType: "application/json",
  131. data: JSON.stringify(ids),
  132. success: function (r) {
  133. if (r.code == 0) {
  134. alert('操作成功', function (index) {
  135. $("#jqGrid").trigger("reloadGrid");
  136. });
  137. } else {
  138. alert(r.msg);
  139. }
  140. }
  141. });
  142. });
  143. },
  144. getInfo: function (id) {
  145. $.get("../topic/info/" + id, function (r) {
  146. vm.topic = r.topic;
  147. $('#content').editable('setHTML', vm.topic.content);
  148. });
  149. },
  150. reload: function (event) {
  151. vm.showList = true;
  152. var page = $("#jqGrid").jqGrid('getGridParam', 'page');
  153. $("#jqGrid").jqGrid('setGridParam', {
  154. postData: {'title': vm.q.title},
  155. page: page
  156. }).trigger("reloadGrid");
  157. vm.handleReset('formValidate');
  158. },
  159. handleSuccessAvatar: function (res, file) {
  160. vm.topic.avatar = file.response.url;
  161. },
  162. handleSuccessItemPicUrl: function (res, file) {
  163. vm.topic.itemPicUrl = file.response.url;
  164. },
  165. handleSuccessScenePicUrl: function (res, file) {
  166. vm.topic.scenePicUrl = file.response.url;
  167. },
  168. handleFormatError: function (file) {
  169. this.$Notice.warning({
  170. title: '文件格式不正确',
  171. desc: '文件 ' + file.name + ' 格式不正确,请上传 jpg 或 png 格式的图片。'
  172. });
  173. },
  174. handleMaxSize: function (file) {
  175. this.$Notice.warning({
  176. title: '超出文件大小限制',
  177. desc: '文件 ' + file.name + ' 太大,不能超过 100K。'
  178. });
  179. },
  180. eyeImageAvatar: function () {
  181. var url = vm.topic.avatar;
  182. eyeImage(url);
  183. },
  184. eyeImageItemPicUrl: function () {
  185. var url = vm.topic.itemPicUrl;
  186. eyeImage(url);
  187. },
  188. eyeImageScenePicUrl: function () {
  189. var url = vm.topic.scenePicUrl;
  190. eyeImage(url);
  191. },
  192. handleSubmit: function (name) {
  193. handleSubmitValidate(this, name, function () {
  194. vm.saveOrUpdate()
  195. });
  196. },
  197. handleReset: function (name) {
  198. handleResetForm(this, name);
  199. }
  200. }
  201. });