PingAnYeXianSZCG_Web 前端代码

feedback.js 8.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266
  1. /*!
  2. * ======================================================
  3. * FeedBack Template For MUI (http://dev.dcloud.net.cn/mui)
  4. * =======================================================
  5. * @version:1.0.0
  6. * @author:cuihongbao@dcloud.io
  7. */
  8. var openid = helper.cookies.get("openid");
  9. console.log(openid);
  10. mui('.mui-scroll-wrapper').scroll();
  11. // $("#submit").on('tap', function() {
  12. // if(!$("#question").val()) {
  13. // mui.toast("工单内容不能为空");
  14. // } else {
  15. // $.ajax({
  16. // type: "post",
  17. // url: huayi.config.callcenter_url + 'WxLogin/AddWorkOrder',
  18. // async: true,
  19. // dataType: 'json',
  20. // data: {
  21. // cusname: $("#Username").val(), //联系人
  22. // cusphone: $("#Phone").val(), //联系电话
  23. // content: $("#question").val(), //信息内容
  24. // openid: openid //微信openid
  25. // },
  26. // success: function(data) {
  27. // if(data.state == "success") {
  28. // mui.toast(data.message);
  29. // location.href = "WorkList.html";
  30. // } else {
  31. // mui.alert(data.message);
  32. // }
  33. // }
  34. // });
  35. // }
  36. //
  37. // })
  38. (function() {
  39. var index = 1;
  40. var size = null;
  41. var imageIndexIdNum = 0;
  42. var starIndex = 0;
  43. var feedback = {
  44. question: document.getElementById('question'),
  45. contact: document.getElementById('contact'),
  46. imageList: document.getElementById('image-list'),
  47. submitBtn: document.getElementById('submit')
  48. };
  49. var url = 'https://service.dcloud.net.cn/feedback';
  50. feedback.files = [];
  51. feedback.uploader = null;
  52. feedback.deviceInfo = null;
  53. mui.plusReady(function() {
  54. //设备信息,无需修改
  55. feedback.deviceInfo = {
  56. appid: plus.runtime.appid,
  57. imei: plus.device.imei, //设备标识
  58. images: feedback.files, //图片文件
  59. p: mui.os.android ? 'a' : 'i', //平台类型,i表示iOS平台,a表示Android平台。
  60. md: plus.device.model, //设备型号
  61. app_version: plus.runtime.version,
  62. plus_version: plus.runtime.innerVersion, //基座版本号
  63. os: mui.os.version,
  64. net: ''+plus.networkinfo.getCurrentType()
  65. }
  66. });
  67. /**
  68. *提交成功之后,恢复表单项
  69. */
  70. feedback.clearForm = function() {
  71. feedback.question.value = '';
  72. feedback.contact.value = '';
  73. feedback.imageList.innerHTML = '';
  74. feedback.newPlaceholder();
  75. feedback.files = [];
  76. index = 0;
  77. size = 0;
  78. imageIndexIdNum = 0;
  79. starIndex = 0;
  80. //清除所有星标
  81. mui('.icons i').each(function (index,element) {
  82. if (element.classList.contains('mui-icon-star-filled')) {
  83. element.classList.add('mui-icon-star')
  84. element.classList.remove('mui-icon-star-filled')
  85. }
  86. })
  87. };
  88. feedback.getFileInputArray = function() {
  89. return [].slice.call(feedback.imageList.querySelectorAll('.file'));
  90. };
  91. feedback.addFile = function(path) {
  92. feedback.files.push({name:"images"+index,path:path,id:"img-"+index});
  93. index++;
  94. };
  95. /**
  96. * 初始化图片域占位
  97. */
  98. feedback.newPlaceholder = function() {
  99. var fileInputArray = feedback.getFileInputArray();
  100. if (fileInputArray &&
  101. fileInputArray.length > 0 &&
  102. fileInputArray[fileInputArray.length - 1].parentNode.classList.contains('space')) {
  103. return;
  104. };
  105. imageIndexIdNum++;
  106. var placeholder = document.createElement('div');
  107. placeholder.setAttribute('class', 'image-item space');
  108. var up = document.createElement("div");
  109. up.setAttribute('class','image-up')
  110. //删除图片
  111. var closeButton = document.createElement('div');
  112. closeButton.setAttribute('class', 'image-close');
  113. closeButton.innerHTML = 'X';
  114. closeButton.id = "img-"+index;
  115. //小X的点击事件
  116. closeButton.addEventListener('tap', function(event) {
  117. setTimeout(function() {
  118. for(var temp=0;temp<feedback.files.length;temp++){
  119. if(feedback.files[temp].id==closeButton.id){
  120. feedback.files.splice(temp,1);
  121. }
  122. }
  123. feedback.imageList.removeChild(placeholder);
  124. }, 0);
  125. return false;
  126. }, false);
  127. //
  128. var fileInput = document.createElement('div');
  129. fileInput.setAttribute('class', 'file');
  130. fileInput.setAttribute('id', 'image-' + imageIndexIdNum);
  131. fileInput.addEventListener('tap', function(event) {
  132. var self = this;
  133. var index = (this.id).substr(-1);
  134. plus.gallery.pick(function(e) {
  135. // console.log("event:"+e);
  136. var name = e.substr(e.lastIndexOf('/') + 1);
  137. console.log("name:"+name);
  138. plus.zip.compressImage({
  139. src: e,
  140. dst: '_doc/' + name,
  141. overwrite: true,
  142. quality: 50
  143. }, function(zip) {
  144. size += zip.size
  145. console.log("filesize:"+zip.size+",totalsize:"+size);
  146. if (size > (10*1024*1024)) {
  147. return mui.toast('文件超大,请重新选择~');
  148. }
  149. if (!self.parentNode.classList.contains('space')) { //已有图片
  150. feedback.files.splice(index-1,1,{name:"images"+index,path:e});
  151. } else { //加号
  152. placeholder.classList.remove('space');
  153. feedback.addFile(zip.target);
  154. feedback.newPlaceholder();
  155. }
  156. up.classList.remove('image-up');
  157. placeholder.style.backgroundImage = 'url(' + zip.target + ')';
  158. }, function(zipe) {
  159. mui.toast('压缩失败!')
  160. });
  161. }, function(e) {
  162. mui.toast(e.message);
  163. },{});
  164. }, false);
  165. placeholder.appendChild(closeButton);
  166. placeholder.appendChild(up);
  167. placeholder.appendChild(fileInput);
  168. feedback.imageList.appendChild(placeholder);
  169. };
  170. feedback.newPlaceholder();
  171. feedback.submitBtn.addEventListener('tap', function(event) {
  172. if (feedback.question.value == '' ||
  173. (feedback.contact.value != '' &&
  174. feedback.contact.value.search(/^(\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+)|([1-9]\d{4,9})$/) != 0)) {
  175. return mui.toast('信息填写不符合规范');
  176. }
  177. if (feedback.question.value.length > 200 || feedback.contact.value.length > 200) {
  178. return mui.toast('信息超长,请重新填写~')
  179. }
  180. //判断网络连接
  181. if(plus.networkinfo.getCurrentType()==plus.networkinfo.CONNECTION_NONE){
  182. return mui.toast("连接网络失败,请稍后再试");
  183. }
  184. feedback.send(mui.extend({}, feedback.deviceInfo, {
  185. content: feedback.question.value,
  186. contact: feedback.contact.value,
  187. images: feedback.files,
  188. score:''+starIndex
  189. }))
  190. }, false)
  191. feedback.send = function(content) {
  192. feedback.uploader = plus.uploader.createUpload(url, {
  193. method: 'POST'
  194. }, function(upload, status) {
  195. // plus.nativeUI.closeWaiting()
  196. console.log("upload cb:"+upload.responseText);
  197. if(status==200){
  198. var data = JSON.parse(upload.responseText);
  199. //上传成功,重置表单
  200. if (data.ret === 0 && data.desc === 'Success') {
  201. // mui.toast('反馈成功~')
  202. console.log("upload success");
  203. // feedback.clearForm();
  204. }
  205. }else{
  206. console.log("upload fail");
  207. }
  208. });
  209. //添加上传数据
  210. mui.each(content, function(index, element) {
  211. if (index !== 'images') {
  212. console.log("addData:"+index+","+element);
  213. // console.log(index);
  214. feedback.uploader.addData(index, element)
  215. }
  216. });
  217. //添加上传文件
  218. mui.each(feedback.files, function(index, element) {
  219. var f = feedback.files[index];
  220. console.log("addFile:"+JSON.stringify(f));
  221. feedback.uploader.addFile(f.path, {
  222. key: f.name
  223. });
  224. });
  225. //开始上传任务
  226. feedback.uploader.start();
  227. mui.alert("感谢反馈,点击确定关闭","问题反馈","确定",function () {
  228. feedback.clearForm();
  229. mui.back();
  230. });
  231. // plus.nativeUI.showWaiting();
  232. };
  233. //应用评分
  234. mui('.icons').on('tap','i',function(){
  235. var index = parseInt(this.getAttribute("data-index"));
  236. var parent = this.parentNode;
  237. var children = parent.children;
  238. if(this.classList.contains("mui-icon-star")){
  239. for(var i=0;i<index;i++){
  240. children[i].classList.remove('mui-icon-star');
  241. children[i].classList.add('mui-icon-star-filled');
  242. }
  243. }else{
  244. for (var i = index; i < 5; i++) {
  245. children[i].classList.add('mui-icon-star')
  246. children[i].classList.remove('mui-icon-star-filled')
  247. }
  248. }
  249. starIndex = index;
  250. });
  251. //选择快捷输入
  252. mui('.mui-popover').on('tap','li',function(e){
  253. document.getElementById("question").value = document.getElementById("question").value + this.children[0].innerHTML;
  254. mui('.mui-popover').popover('toggle')
  255. })
  256. })();