script.js 8.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285
  1. var getNode = function(id){
  2. return document.getElementById(id)
  3. }
  4. var yuyue = getNode("yuyue") // 预约按钮
  5. var share = getNode("share") // 分享按钮
  6. var modal = getNode("zy-h5-modal") // 预约弹框
  7. var modalZz = getNode("zy-h5-fix-z") // 弹框遮罩层
  8. var submitModal = getNode("submitModal") // 提交预约
  9. var canselModal = getNode("canselModal") // 取消预约
  10. var userPhone = getNode("userPhone") // 预约手机号
  11. var joinerNum = getNode("joinerNum") // 参与人数
  12. var storeHead = getNode("store-head") // 头部门店名称
  13. var store = getNode("store") // 门店
  14. var address = getNode("address") // 地址
  15. var tel = getNode("tel") // 电话
  16. var storeId = getQueryString('orgId') || 0 // 门店id
  17. var companyId = ''
  18. // test, 测试 local、dev:本地开发环境 pre :预发布 pro:生产
  19. if(baseType == 'test'){
  20. var reqUrl = 'http://192.168.16.100:9110/saas/clz/'
  21. }else if(baseType == 'local'){
  22. var reqUrl = 'http://192.168.16.104:9110/saas/clz/'
  23. }else if(baseType == 'dev'){
  24. var reqUrl = 'http://192.168.16.104:9110/saas/clz/'
  25. }else if(baseType == 'pre'){
  26. var reqUrl = 'http://md.test.zyucgj.com/saas/clz/'
  27. }else if(baseType == 'pro'){
  28. var reqUrl = 'http://md.chelingzhu.com/saas/clz/'
  29. }
  30. // 隐藏预约弹框
  31. var closeYy = function (){
  32. userPhone.value = ''
  33. modal.style.display = 'none'
  34. modalZz.style.display = 'none'
  35. }
  36. // 倒计时
  37. function function_name(time,obj) {
  38. $.leftTime(time,function(d){
  39. if(d.status){
  40. var $dateShow1=$(obj);
  41. $dateShow1.find(".d").html(d.d);
  42. $dateShow1.find(".h").html(d.h);
  43. $dateShow1.find(".m").html(d.m);
  44. $dateShow1.find(".s").html(d.s);
  45. // 倒计时结束
  46. if(parseInt(d.d)==0 && parseInt(d.h)==0 && parseInt(d.m)==0 && parseInt(d.s)==0){
  47. document.getElementById('zy-h5-bf-bar').innerHTML = '活动已结束'
  48. document.getElementById('zy-h5-bf-bar').style.display = 'block'
  49. document.getElementById('zy-h5-bf-bar').style.fontSize = '13px'
  50. document.getElementById('zy-h5-bf-bar').style.color = '#666'
  51. document.getElementById('zy-h5-bf-bar').style.padding = '11px 0'
  52. document.getElementById('zy-h5-bf-bar').style.textAlign = 'center'
  53. }
  54. }
  55. });
  56. }
  57. // 校验活动是否还在进行
  58. function checkActiveValid(){
  59. $.ajax({
  60. url: reqUrl + 'zycar-mgr/active/checkActiveValid/' + activeId,
  61. type: 'get',
  62. header: { contentType: 'application/json;charset=UTF-8' },
  63. // 设置的是请求参数
  64. data: {},
  65. dataType: 'json',
  66. success: function (res) {
  67. if(res.status == 200){
  68. if(res.data){
  69. getActivityData() // 获取活动信息
  70. }else{
  71. closeLoading() // 关闭加载状态
  72. alert('该活动已经结束!')
  73. }
  74. }
  75. }
  76. })
  77. }
  78. // 获取活动信息
  79. function getActivityData(){
  80. // 获取活动信息 (海报和门店二维码)
  81. $.ajax({
  82. url: reqUrl + 'active/findActiveAttach/' + activeId,
  83. type: 'get',
  84. header: { contentType: 'application/json;charset=UTF-8' },
  85. // 设置的是请求参数
  86. data: {},
  87. dataType: 'json',
  88. success: function (res) {
  89. if(res.status == 200){
  90. const data = res.data
  91. if(staticHtmlPath){ // 发布
  92. const joinerNumVal = parseInt(data.initBuyNum) + parseInt(data.joinerNum)
  93. joinerNum.innerHTML = joinerNumVal
  94. $('.zy-h5-store-info').show()
  95. }
  96. // 根据门店id处理对应页面展示
  97. if(storeId){ // 门店端发布活动会传有门店id参数
  98. // 获取门店信息
  99. $.ajax({
  100. url: reqUrl + 'cross/store/' + storeId,
  101. type: 'get',
  102. header: { contentType: 'application/json;charset=UTF-8' },
  103. // 设置的是请求参数
  104. data: {},
  105. dataType: 'json',
  106. success: function (result) {
  107. if(result.status == 200){
  108. const data = result.data
  109. storeHead.innerHTML = data.name || ''
  110. store.innerHTML = data.name || ''
  111. let addrCityName = data.addrCityName || ''
  112. let addrDistrictName = data.addrDistrictName || ''
  113. let addrDetail = data.addrDetail || ''
  114. address.innerHTML = addrCityName + addrDistrictName + addrDetail
  115. tel.innerHTML = data.managerMobile
  116. document.getElementById("tel-link").href = 'tel:' + data.managerMobile
  117. companyId = data.companyId
  118. joinerList(companyId) // 参与人列表数据
  119. }
  120. },
  121. })
  122. }else{ // 运营端发布活动无门店id参数
  123. joinerList() // 参与人列表数据
  124. }
  125. closeLoading() // 关闭加载状态
  126. }
  127. },
  128. })
  129. }
  130. // 关闭加载状态
  131. function closeLoading(){
  132. if(staticHtmlPath){ // 发布
  133. // 关闭加载状态
  134. document.getElementById('foo').style.display = 'none'
  135. modalZz.style.display = 'none'
  136. // 不是微信端打开的页面
  137. if(!browser.versions.weixin){
  138. document.querySelector('.zy-h5-bf-bar').style.display = 'none'
  139. document.querySelector('.zy-h5-fx-bar').style.display = 'none'
  140. }else{
  141. document.querySelector('.zy-h5-bf-bar').style.display = 'flex'
  142. document.querySelector('.zy-h5-fx-bar').style.display = 'block'
  143. }
  144. }
  145. }
  146. // 加载中
  147. function onLoading(){
  148. // 隐藏参与和分享按钮
  149. document.querySelector('.zy-h5-bf-bar').style.display = 'none'
  150. document.querySelector('.zy-h5-fx-bar').style.display = 'none'
  151. modalZz.style.display = 'block' // 遮罩层
  152. var opts = {
  153. lines: 9, // The number of lines to draw
  154. length: 0, // The length of each line
  155. width: 10, // The line thickness
  156. radius: 15, // The radius of the inner circle
  157. corners: 1, // Corner roundness (0..1)
  158. rotate: 0, // The rotation offset
  159. color: '#2979ff', // #rgb or #rrggbb
  160. speed: 1, // Rounds per second
  161. trail: 60, // Afterglow percentage
  162. shadow: false, // Whether to render a shadow
  163. hwaccel: false, // Whether to use hardware acceleration
  164. className: 'spinner', // The CSS class to assign to the spinner
  165. zIndex: 2e9, // The z-index (defaults to 2000000000)
  166. top: 'auto', // Top position relative to parent in px
  167. left: 'auto' // Left position relative to parent in px
  168. };
  169. var target = document.getElementById('foo');
  170. var spinner = new Spinner(opts).spin(target);
  171. }
  172. // 正则获取地址栏参数
  173. function getQueryString(name) {
  174. let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i")
  175. let r = window.location.search.substr(1).match(reg)
  176. if (r != null) {
  177. return unescape(r[2])
  178. }
  179. return null
  180. }
  181. // 门店活动统计(参与者轮播)
  182. function joinerList(companyId){
  183. let obj = JSON.stringify({
  184. activeId: activeId, // 活动id
  185. tenantId: storeId, // 门店id
  186. companyId: companyId, // 公司id
  187. status: 9 // 9是假数据的标识
  188. })
  189. // 获取门店信息
  190. $.ajax({
  191. url: reqUrl + 'cross/active/joinerByActive/1/1000',
  192. type: 'post',
  193. contentType: 'application/json;charset=UTF-8',
  194. // 设置的是请求参数
  195. data: obj,
  196. dataType: 'json',
  197. success: function (res) {
  198. if(res.status == 200){
  199. const data = res.data.list
  200. let html = `<div class="kh-list-tr kh-list-tr-head">
  201. <div class="kh-list-td">手机号</div>
  202. <div class="kh-list-td">报名状态</div>
  203. </div>`
  204. for(let i = 0; i < data.length; i++){
  205. html += `<div class="kh-list-tr kh-list-tr-head">
  206. <div class="kh-list-td">${data[i].joinerMobile}</div>
  207. <div class="kh-list-td">已报名</div>
  208. </div>`
  209. }
  210. document.getElementById("kh-list").innerHTML = html
  211. }
  212. },
  213. })
  214. }
  215. // 右上角分享转发
  216. window.onload = function(){
  217. // 分享初始化
  218. shareCls.getWxCofing(reqUrl)
  219. if(staticHtmlPath){ // 发布
  220. onLoading() // 加载中
  221. checkActiveValid()
  222. }else{ // 预览
  223. getActivityData() // 获取活动信息
  224. }
  225. // 倒计时
  226. function_name($('#dateShow1').data("date"), '#dateShow1')
  227. // 打开预约弹框
  228. yuyue.onclick = function(){
  229. modal.style.display = 'block'
  230. modalZz.style.display = 'block'
  231. }
  232. // 关闭预约弹框
  233. canselModal.onclick = function(){
  234. closeYy()
  235. }
  236. // 提交预约
  237. submitModal.onclick = function(){
  238. // 提交代码到后台
  239. var mobile = userPhone.value
  240. if(mobile==''){
  241. alert("请输入手机号码");
  242. return false;
  243. }
  244. if(!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(mobile))){
  245. alert("手机号码错误,请重填");
  246. return false;
  247. }
  248. const obj = JSON.stringify({
  249. "joinerMobile": mobile, // 参与手机号
  250. "activeId": activeId, // 活动id
  251. "tenantId": storeId, // 门店id
  252. "companyId": companyId // 公司id
  253. })
  254. // 立即参与
  255. $.ajax({
  256. url: reqUrl + 'active/signUp',
  257. type: 'post',
  258. contentType: 'application/json;charset=UTF-8',
  259. // 设置的是请求参数
  260. data: obj,
  261. dataType: 'json',
  262. success: function (res) {
  263. if(res.status == 200){
  264. closeYy()
  265. }
  266. alert(res.message)
  267. }
  268. })
  269. }
  270. // 分享海报
  271. share.onclick = function(){
  272. if(storeId){
  273. window.location.href = 'http://static.chelingzhu.com/active/poster.html?id=' + activeId + '&reqUrl=' + reqUrl + '&orgId=' + storeId
  274. }else{
  275. window.location.href = 'http://static.chelingzhu.com/active/poster.html?id=' + activeId + '&reqUrl=' + reqUrl
  276. }
  277. }
  278. }