script.js 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230
  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 store = getNode("store") // 门店
  13. var address = getNode("address") // 地址
  14. var tel = getNode("tel") // 电话
  15. var upScroll = getNode("upScroll") // 参与人信息 外层盒子
  16. var upScrollO = getNode("upScroll-o") // 参与人信息 盒子1
  17. var upScrollT = getNode("upScroll-t") // 参与人信息 盒子2
  18. var storeId = getQueryString('orgId') || 0 // 门店id
  19. var companyId = ''
  20. // test, 测试 local:本地 pre :预发布 pro:生产
  21. if(baseType == 'test'){
  22. var reqUrl = 'http://192.168.16.100:9110/saas/clz/'
  23. }else if(baseType == 'local'){
  24. var reqUrl = 'http://192.168.16.102: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. window.onload = function(){
  37. if(staticHtmlPath){ // 发布
  38. checkActiveValid()
  39. }else{ // 预览
  40. getActivityData() // 获取活动信息
  41. }
  42. // 校验活动是否还在进行
  43. function checkActiveValid(){
  44. $.ajax({
  45. url: reqUrl + 'zycar-mgr/active/checkActiveValid/' + activeId,
  46. type: 'get',
  47. header: { contentType: 'application/json;charset=UTF-8' },
  48. // 设置的是请求参数
  49. data: {},
  50. dataType: 'json',
  51. success: function (res) {
  52. if(res.status == 200){
  53. if(res.data){
  54. getActivityData() // 获取活动信息
  55. }else{
  56. alert('该活动已经结束!')
  57. }
  58. }
  59. }
  60. })
  61. }
  62. // 获取活动信息
  63. function getActivityData(){
  64. // 获取活动信息 (海报和门店二维码)
  65. $.ajax({
  66. url: reqUrl + 'active/findActiveAttach/' + activeId,
  67. type: 'get',
  68. header: { contentType: 'application/json;charset=UTF-8' },
  69. // 设置的是请求参数
  70. data: {},
  71. dataType: 'json',
  72. success: function (res) {
  73. if(res.status == 200){
  74. const data = res.data
  75. if(staticHtmlPath){ // 发布
  76. const joinerNumVal = parseInt(data.initBuyNum) + parseInt(data.joinerNum)
  77. joinerNum.innerHTML = joinerNumVal
  78. $('.zy-h5-store-info').show()
  79. }
  80. // 根据门店id处理对应页面展示
  81. if(storeId){ // 门店端发布活动会传有门店id参数
  82. // 获取门店信息
  83. $.ajax({
  84. url: reqUrl + 'cross/store/' + storeId,
  85. type: 'get',
  86. header: { contentType: 'application/json;charset=UTF-8' },
  87. // 设置的是请求参数
  88. data: {},
  89. dataType: 'json',
  90. success: function (result) {
  91. if(result.status == 200){
  92. const data = result.data
  93. store.innerHTML = data.name || ''
  94. let addrCityName = data.addrCityName || ''
  95. let addrDistrictName = data.addrDistrictName || ''
  96. let addrDetail = data.addrDetail || ''
  97. address.innerHTML = addrCityName + addrDistrictName + addrDetail
  98. tel.innerHTML = data.managerMobile
  99. document.getElementById("tel-link").href = 'tel:' + data.managerMobile
  100. companyId = data.companyId
  101. joinerList(companyId) // 参与人列表数据
  102. }
  103. },
  104. })
  105. }else{ // 运营端发布活动无门店id参数
  106. joinerList() // 参与人列表数据
  107. }
  108. }
  109. },
  110. })
  111. }
  112. // 打开预约弹框
  113. yuyue.onclick = function(){
  114. modal.style.display = 'block'
  115. modalZz.style.display = 'block'
  116. }
  117. // 关闭预约弹框
  118. canselModal.onclick = function(){
  119. closeYy()
  120. }
  121. // 提交预约
  122. submitModal.onclick = function(){
  123. // 提交代码到后台
  124. var mobile = userPhone.value
  125. if(mobile==''){
  126. alert("请输入手机号码");
  127. return false;
  128. }
  129. if(!(/^1(3|4|5|6|7|8|9)\d{9}$/.test(mobile))){
  130. alert("手机号码错误,请重填");
  131. return false;
  132. }
  133. const obj = JSON.stringify({
  134. "joinerMobile": mobile, // 参与手机号
  135. "activeId": activeId, // 活动id
  136. "tenantId": storeId, // 门店id
  137. "companyId": companyId // 公司id
  138. })
  139. // 立即参与
  140. $.ajax({
  141. url: reqUrl + 'active/signUp',
  142. type: 'post',
  143. contentType: 'application/json;charset=UTF-8',
  144. // 设置的是请求参数
  145. data: obj,
  146. dataType: 'json',
  147. success: function (res) {
  148. if(res.status == 200){
  149. closeYy()
  150. }
  151. alert(res.message)
  152. }
  153. })
  154. }
  155. // 分享
  156. share.onclick = function(){
  157. if(storeId){
  158. window.location.href = 'http://static.chelingzhu.com/active/poster.html?id=' + activeId + '&reqUrl=' + reqUrl + '&orgId=' + storeId
  159. }else{
  160. window.location.href = 'http://static.chelingzhu.com/active/poster.html?id=' + activeId + '&reqUrl=' + reqUrl
  161. }
  162. }
  163. // 门店活动统计(参与者轮播)
  164. function joinerList(companyId){
  165. let obj = JSON.stringify({
  166. activeId: activeId, // 活动id
  167. tenantId: storeId, // 门店id
  168. companyId: companyId, // 公司id
  169. status: 9 // 9是假数据的标识
  170. })
  171. // 获取门店信息
  172. $.ajax({
  173. url: reqUrl + 'cross/active/joinerByActive/1/1000',
  174. type: 'post',
  175. contentType: 'application/json;charset=UTF-8',
  176. // 设置的是请求参数
  177. data: obj,
  178. dataType: 'json',
  179. success: function (res) {
  180. if(res.status == 200){
  181. const data = res.data.list
  182. let html = ''
  183. for(let i = 0; i < data.length; i++){
  184. html += `<li class="info-con">
  185. <p class="qg-people">${data[i].joinerMobile}</p>
  186. <p class="qg-state">抢购成功</p>
  187. </li>`
  188. }
  189. document.getElementById("scroll-con").innerHTML = html
  190. // 参与人信息 向上滚动
  191. data.length > 0 ? upDownScroll() : ''
  192. }
  193. },
  194. })
  195. }
  196. // 上下滚动
  197. function upDownScroll(){
  198. var scrollTimer
  199. $("#scroll").hover(function(){
  200. clearInterval(scrollTimer)
  201. }, function() {
  202. scrollTimer = setInterval(function() {
  203. scrollContent($("#scroll"))
  204. }, 2000)
  205. }).trigger("mouseout")
  206. }
  207. function scrollContent(obj) {
  208. var $self = obj.find("ul:first")
  209. var lineHeight = $self.find("li:first").height() //获取行高
  210. $self.animate({
  211. "margin-top": -lineHeight + "px"
  212. }, 1000, function() {
  213. $self.css({
  214. "margin-top": "0px"
  215. }).find("li:first").appendTo($self) //appendTo能直接移动元素而不是复制,被appendto的元素位置发生变化
  216. })
  217. }
  218. }
  219. // 正则获取地址栏参数
  220. function getQueryString(name) {
  221. let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i")
  222. let r = window.location.search.substr(1).match(reg)
  223. if (r != null) {
  224. return unescape(r[2])
  225. }
  226. return null
  227. }