marketing.js 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450
  1. var editMarketingObj = {};
  2. // 打开编辑窗口
  3. function initMarketingEdit(obj) {
  4. obj = editMarketingObj = obj || getMarketingCache();// 如果没有,则从缓存中取得
  5. bindMarketingEvent();//初始化事件
  6. // 活动类型名称
  7. $("#marketingTypeName").text(obj.onsaleType);
  8. // 基本信息显示
  9. var picInputDom = $("#marketingPic");
  10. if (obj.img) {
  11. picInputDom.siblings('.iconfont').addClass('mui-hidden');
  12. picInputDom.siblings('img').attr('src', obj.img).removeClass('mui-hidden');
  13. picInputDom.siblings('.delpic').removeClass('mui-hidden');
  14. } else {
  15. picInputDom.siblings('.iconfont').removeClass('mui-hidden');
  16. picInputDom.siblings('img').attr('src', '').addClass('mui-hidden');
  17. picInputDom.siblings('.delpic').addClass('mui-hidden');
  18. }
  19. //名称
  20. $("#marketingName").val(obj.name || "");
  21. //说明
  22. $("#marketingDesc").val(obj.desc || "");
  23. //初始化时间选择
  24. initTimeSelect();
  25. //选中设备初始化
  26. initDeviceList();
  27. //初始化自定义参数
  28. initMarketingParam();
  29. }
  30. //初始化时间选择
  31. function initTimeSelect() {
  32. var objIn = editMarketingObj;
  33. function setTimeTitle() {
  34. $('#startTime .selected-text').text(objIn.startTime);
  35. $('#endTime .selected-text').text(objIn.endTime);
  36. }
  37. $('.datepicker .mui-button-row button').tap(function () {
  38. var range = $(this).attr('range');
  39. setTimeRange(range);//快速日期选择
  40. startTimePicker.setSelectedValue(objIn.startTime);
  41. endTimePicker.setSelectedValue(objIn.endTime);
  42. });
  43. function setTimeRange(range) {
  44. objIn.startTime = moment().format("YYYY-MM-DD");
  45. if (range && range > 0) {
  46. objIn.endTime = moment().add(range, "day").format("YYYY-MM-DD");
  47. }
  48. setTimeTitle();
  49. $('.datepicker .mui-button-row button').removeClass('active');
  50. $('.datepicker .mui-button-row button[range=' + range + ']').addClass('active');
  51. }
  52. // 如果日期为空,则默认为7天;如果是编辑,则按编辑的日期显示
  53. if (!objIn.startTime && !objIn.endTime) {
  54. setTimeRange(7)
  55. } else {
  56. setTimeTitle();
  57. }
  58. //可选日期范围
  59. var pickerBegin = moment().add(-2, "year").toDate();//控件可选最小时间
  60. var pickerEnd = moment().add(10, "year").toDate();//控件可选最大时间
  61. var options = {
  62. type: "date",
  63. beginDate: pickerBegin,
  64. endDate: pickerEnd
  65. };
  66. var startTimeBtn = $('#startTime');
  67. var startTimePicker = new mui.DtPicker(options);
  68. startTimePicker.setSelectedValue(objIn.startTime);
  69. startTimeBtn[0].addEventListener('tap', function () {
  70. startTimePicker.show(function (time) {
  71. objIn.startTime = time.y.text + '-' + time.m.text + '-' + time.d.text + '';
  72. $('#startTime .selected-text').text(objIn.startTime);
  73. });
  74. }, false);
  75. var endTimeBtn = $('#endTime');
  76. var endTimePicker = new mui.DtPicker(options);
  77. endTimePicker.setSelectedValue(objIn.endTime);
  78. endTimeBtn[0].addEventListener('tap', function () {
  79. endTimePicker.show(function (time) {
  80. objIn.endTime = time.y.text + '-' + time.m.text + '-' + time.d.text + '';
  81. $('#endTime .selected-text').text(objIn.endTime);
  82. });
  83. }, false);
  84. }
  85. // 初始化选中设备列表
  86. function initDeviceList() {
  87. var data = {
  88. "pageIndex": 1,
  89. "pageSize": 1000,// 暂定默认获取1000台
  90. "sort": "devType",//默认按分组排序,然后会按设备类型排序
  91. };
  92. var logicalCodeList = editMarketingObj.logicalCodeList || [];
  93. $(".deviceTotal").text("已选" + logicalCodeList.length + "台");
  94. sendRequest("/dealer/equipmentList?random=" + Math.random() * 1000, "GET", data, function (res) {
  95. var panelDom = $(".deviceList");
  96. var list = res.para.dataList;
  97. var groupId = null;
  98. var groupDom = null;
  99. for (var index in list) {
  100. var obj = list[index];
  101. // 如果遍历到新的分组,则新建分组dom
  102. if (obj.groupId != groupId) {
  103. // 如果不是该设备的管理员,则直接忽略该分组的数据
  104. if (!obj.isManager) {
  105. continue
  106. }
  107. groupId = obj.groupId;
  108. groupDom = $('<div class="group-container"><div class="mui-table-view-cell dev-select-row"><div class="mui-checkbox">' +
  109. '<label for="dev-group-' + groupId + '" class="mui-text-left font-16 "><i class="c-green iconfont icon-shop"></i> <span class="font-bold font-b-6">' + obj.name + '</span></label>' +
  110. '<input id="dev-group-' + groupId + '" class="checkbox-btn dev-group-all" type="checkbox"></div></div>' +
  111. '<div class="group-list-container"></div>' +
  112. '</div>');
  113. panelDom.append(groupDom);
  114. }
  115. var deviceStatusObj = getDeviceStatus(obj);
  116. var onlineStatus = deviceStatusObj.onlineStatus;
  117. var onlineClass = deviceStatusObj.onlineClass;
  118. var workStatus = deviceStatusObj.workStatus;
  119. var workClass = deviceStatusObj.workClass;
  120. var thisDom = $('<div class="mui-table-view-cell dev-select-row"><div class="mui-checkbox padding-l-10">' +
  121. '<label for="dev-id-' + index + '" class="mui-text-left font-14"><i class="c-blue iconfont ' + getDevIconName(obj.type) + '"></i> ' + obj.type + '-' + obj.logicalCode +
  122. '<em class="' + onlineClass + '">' + onlineStatus + '</em>' +
  123. (workStatus ? ('<span class="mui-pull-right ' + workClass + '">' + workStatus + '</span>') : "") +
  124. '</label>' +
  125. '<input id="dev-id-' + index + '" class="checkbox-btn checkbox-btn-sub" value="' + obj.logicalCode + '" type="checkbox"/>' +
  126. '</div></div>');
  127. groupDom.find(".group-list-container").append(thisDom);
  128. for (var codeIndex in logicalCodeList) {
  129. var code = logicalCodeList[codeIndex];
  130. if (code == obj.logicalCode) {
  131. thisDom.find(".checkbox-btn-sub").prop("checked", true);
  132. break;
  133. }
  134. }
  135. }
  136. })
  137. }
  138. function getDeviceStatus(obj) {
  139. var onlineStatus = "";//离线状态文字
  140. var onlineClass = "";//在线状态样式
  141. var workStatus = null;//工作状态文字
  142. var workClass = null;//工作状态样式
  143. //如果是纯蓝牙设备,则不展示离线、在线
  144. if (obj.channelType && obj.channelType.indexOf('BlueTooth') > -1 && obj.channelType.indexOf('GPRS') == -1) {
  145. onlineStatus = "蓝牙";
  146. onlineClass = "mark-blue iconfont icon-lanya";
  147. } else {
  148. if (obj.online == 1) {
  149. onlineStatus = "在线";
  150. onlineClass = "online";
  151. } else if (obj.online == 0) {
  152. onlineStatus = "离线";
  153. onlineClass = "offline";
  154. //需要显示离线文字,离线和离线繁忙都是获取不到设备状态的,所有不展示信号
  155. if (obj.offlineTimeLong == 0 || obj.offlineTimeLong == null) {
  156. } else {
  157. onlineStatus = moment().set('second', -obj.offlineTimeLong).fromNow() + "离线";
  158. }
  159. }
  160. }
  161. // 设备工作信息,1正常,2异常
  162. if (obj.status == 0) {
  163. workClass = "c-success";
  164. workStatus = "空闲";
  165. }
  166. if (obj.status == 1) {
  167. workClass = "c-lgreen";
  168. workStatus = obj.statusInfo || "繁忙";
  169. }
  170. if (obj.status == 2) {
  171. workClass = "c-red";
  172. workStatus = obj.statusInfo || "故障";
  173. }
  174. //设备管理状态【人为设置的故障优先展示】
  175. if (obj.isFault == true) {
  176. workStatus = "设备故障";
  177. workClass = "c-red";
  178. }
  179. return {
  180. onlineStatus: onlineStatus,
  181. onlineClass: onlineClass,
  182. workStatus: workStatus,
  183. workClass: workClass
  184. }
  185. }
  186. // 初始化自定义参数
  187. function initMarketingParam() {
  188. var obj = editMarketingObj;
  189. var detailDict = editMarketingObj.detailDict || {};
  190. $("#custom-modal [key]").each(function () {
  191. var key = $(this).attr("key");
  192. $(this).find("input").val(detailDict[key]);
  193. });
  194. if (obj.onsaleType == "首次使用送金币" || obj.onsaleType == "京东新人1分购") {
  195. $("[key='coins']").removeClass("mui-hidden").siblings().remove();
  196. }
  197. else if (obj.onsaleType == "首次免费按摩" || obj.onsaleType == "手机实名免费用") {
  198. $("[key='duration']").removeClass("mui-hidden").siblings().remove();
  199. }
  200. else {
  201. $("#custom-modal").remove()
  202. }
  203. }
  204. function setMarketingCache(data) {
  205. localStorage.marketingCache = JSON.stringify(data);
  206. }
  207. function getMarketingCache() {
  208. return localStorage.marketingCache ? JSON.parse(localStorage.marketingCache) : null;
  209. }
  210. function getMarketingParam() {
  211. // 暂时只有input,如果以后其他的输入方式,得进一步优化
  212. var detailDict = {};
  213. $("#custom-modal [key]").each(function () {
  214. var key = $(this).attr("key");
  215. detailDict[key] = $(this).find("input").val();
  216. });
  217. return detailDict;
  218. }
  219. // 编辑窗口事件绑定
  220. function bindMarketingEvent() {
  221. // 编辑窗口保存事件
  222. $("#editMarketingPanel").on("submit", function (evt) {
  223. //阻止submit默认表单提交行为
  224. evt.preventDefault();
  225. if (editMarketingObj.startTime > editMarketingObj.endTime) {
  226. mui.alert('开始日期不能大于结束日期', '温馨提示', '确定');
  227. return false;
  228. }
  229. //获取自定义参数
  230. var detailDict = getMarketingParam();
  231. // 获取选中的逻辑码
  232. var logicalCodeList = [];
  233. $(".checkbox-btn-sub:checked").each(function () {
  234. logicalCodeList.push($(this).val());
  235. });
  236. var data = {
  237. "name": $("#marketingName").val(),
  238. "img": $("#showPic").attr("src"),
  239. "desc": $("#marketingDesc").val(),
  240. "logicalCodeList": logicalCodeList,
  241. "startTime": editMarketingObj.startTime,
  242. "endTime": editMarketingObj.endTime,
  243. "detailDict": detailDict
  244. };
  245. var url = "/dealer/editOnsale";
  246. if (editMarketingObj.id) {
  247. data.id = editMarketingObj.id;
  248. url = "/dealer/editOnsale";
  249. } else {
  250. // 如果没有id,则为新增营销活动
  251. url = "/dealer/createOnsale";
  252. // 创建需要指定活动类型
  253. data.onsaleType = $("#marketingTypeName").text();
  254. }
  255. var saveBtn = $("#saveBtn")[0];
  256. saveBtn.disabled = true;
  257. sendRequest({
  258. url: url,
  259. type: "POST",
  260. mask: "正在保存...",
  261. data: data,
  262. contentType: "json",
  263. success: function (res) {
  264. if (res.result == 1) {
  265. if (editMarketingObj.id) {
  266. mui.toast("修改成功");
  267. setTimeout(function () {
  268. history.back();
  269. }, 800)
  270. } else {
  271. mui.toast("新增成功");
  272. setTimeout(function () {
  273. history.go(-2);
  274. }, 800)
  275. }
  276. } else {
  277. mui.toast(res.description);
  278. }
  279. saveBtn.disabled = false;
  280. }
  281. });
  282. evt.stopPropagation();
  283. });
  284. function myImageCompressor(file, callback) {
  285. if (window.ImageCompressor) {
  286. const imageCompressor = new ImageCompressor();
  287. if (file) {
  288. imageCompressor.compress(file, {
  289. quality: .7,
  290. // 图片尺寸
  291. maxWidth: 1920,
  292. maxHeight: 1920,
  293. success: function (result) {
  294. var formData = new FormData();
  295. formData.append('file', result, result.name);
  296. if (callback) {
  297. callback(formData);
  298. }
  299. }
  300. })
  301. }
  302. } else {
  303. //图片插件未加载完成提示
  304. mui.toast("图片上传工具未加载,刷新页面重试...");
  305. }
  306. }
  307. // 删除图片
  308. $('.delpic').tap(function (e) {
  309. var self = $(this);
  310. self.siblings('img').attr('src', '').addClass('mui-hidden');
  311. self.addClass('mui-hidden');
  312. self.siblings('.iconfont').removeClass('mui-hidden');
  313. self.siblings('input').show();
  314. return false;
  315. });
  316. // 图片选择事件
  317. var picUpload = $("#marketingPic");
  318. if (typeof FileReader === 'undefined') {
  319. picUpload.attr('disabled', true);
  320. picUpload.tap(function () {
  321. mui.alert('当前微信浏览器版本过低,请升级微信后再试!', '温馨提示', '我知道了');
  322. });
  323. } else {
  324. picUpload.change(function (e) {
  325. var self = $(this);
  326. var file = picUpload[0].files[0];
  327. // 大小限制 10M
  328. if (file && file.size > 10000 * 1024) {
  329. msgPopup('温馨提示', '图片大小超出规定范围!', '知道了');
  330. return;
  331. }
  332. if (!(/^image\/.*$/i.test(file.type))) {
  333. mui.toast('该文件不是图片,请重新选择!');
  334. return;
  335. } else {
  336. myImageCompressor(file, function (formData) {
  337. var url = '/dealer/uploadCreative';
  338. myAjax({
  339. url: url,
  340. type: 'POST',
  341. data: formData,
  342. processData: false,
  343. contentType: false,
  344. beforeSend: function () {
  345. showLoading('上传中...');
  346. },
  347. success: function (res) {
  348. if (res.result == 1) {
  349. self.hide();
  350. self.siblings('.iconfont').addClass('mui-hidden');
  351. self.siblings('img').attr('src', res.para).removeClass('mui-hidden');
  352. self.siblings('.delpic').removeClass('mui-hidden');
  353. } else {
  354. mui.toast('上传失败,请重试');
  355. }
  356. },
  357. complete: function () {
  358. hideLoading();
  359. //重置文件路径,避免选中重复不触发onchange
  360. var imgUpload = $("#marketingPic");
  361. imgUpload[0].value = "";
  362. }
  363. });
  364. });
  365. }
  366. });
  367. }
  368. // 全选事件
  369. $(".deviceList ").on("change", "input[type=checkbox]", function () {
  370. var inputDom = $(this);
  371. if (inputDom.hasClass("dev-all")) {
  372. if (inputDom[0].checked) {
  373. $(".checkbox-btn-sub,.dev-group-all").prop("checked", true);
  374. } else {
  375. $(".checkbox-btn-sub,.dev-group-all").prop("checked", false);
  376. }
  377. } else if (inputDom.hasClass("dev-group-all")) {
  378. if (inputDom[0].checked) {
  379. inputDom.closest(".group-container").find(".group-list-container .checkbox-btn-sub").prop("checked", true);
  380. } else {
  381. inputDom.closest(".group-container").find(".group-list-container .checkbox-btn-sub").prop("checked", false);
  382. }
  383. }
  384. var checkedLength = $(".checkbox-btn-sub:checked").length;
  385. $(".deviceTotal").text("已选" + checkedLength + "台");
  386. });
  387. }