homemovement.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <link rel="icon" href="image/favicon.png">
  7. <title>工时管家</title>
  8. <link rel="stylesheet" href="./css/homemovement/normalize.css" />
  9. <!-- 先引入css文件 放到自己css文件的上面 -->
  10. <link rel="stylesheet" href="./css/homemovement/swiper.min.css" />
  11. <link rel="stylesheet" href="./css/homemovement/homemovement.css" />
  12. <script src="js/jquery1.42.min.js"></script>
  13. </head>
  14. <body>
  15. <section class="warp">
  16. <!-- 头部 -->
  17. <div class="header">
  18. <div class="header_logo"><img src="./image/logo.jpg" alt=""></div>
  19. <div class="header_qiyeweix"><a href="https://open.work.weixin.qq.com" target="_blank"><img src="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=isp&c=white&s=medium" srcset="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=isp&c=white&s=medium@2x 2x" referrerpolicy="unsafe-url" alt="企业微信"></a></div>
  20. <div class="header_qw"><a href="javascript:;" id="zhuce"><img src="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=register&c=white&s=large" srcset="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=register&c=white&s=large@2x 2x" referrerpolicy="unsafe-url" alt="企业微信"></a></div>
  21. <div class="header_qx"><a href="javascript:;" id="anqiye"><img src="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=install&c=white&s=large" srcset="https://open.work.weixin.qq.com/service/img?id=wwf11426cf618e1703&t=install&c=white&s=large@2x 2x" referrerpolicy="unsafe-url" alt="企业微信"></a></div>
  22. </div>
  23. <div class="homepage">
  24. <div class="homepage_img">
  25. <img src="./image/bannar9.gif" alt="">
  26. </div>
  27. <div class="homepage_gsLogo">
  28. <img src="./image/gsgj.png" alt="">
  29. </div>
  30. <div class="homepage_title">工时管家</div>
  31. </div>
  32. <div class="reduction">
  33. <div class="reduction_img">
  34. <img src="./image/huajian.png" alt="">
  35. </div>
  36. </div>
  37. <div class="examination">
  38. <div class="examination_title">填报、审批、统计分分钟搞定</div>
  39. <div class="examination_img"><img src="./image/fill.jpg" alt=""></div>
  40. <div class="get_job_focus">
  41. <!-- Swiper -->
  42. <div class="swiper-container get_job_fo">
  43. <div class="swiper-wrapper">
  44. <div class="swiper-slide">
  45. <img src="./image/yidong/xmcj.png" alt="" />
  46. </div>
  47. <div class="swiper-slide">
  48. <img src="./image/yidong/ygtb.png" alt="" />
  49. </div>
  50. <div class="swiper-slide">
  51. <img src="./image/yidong/xmjlsh.png" alt="" />
  52. </div>
  53. <div class="swiper-slide">
  54. <img src="./image/yidong/hzsj.png" alt="" />
  55. </div>
  56. <div class="swiper-slide">
  57. <img src="./image/yidong/sctjb.png" alt="" />
  58. </div>
  59. </div>
  60. </div>
  61. <!-- Add Arrows 根据需求这个代码放到 container外面 添加左右箭头-->
  62. <div class="swiper-button-next"></div>
  63. <div class="swiper-button-prev"></div>
  64. </div>
  65. </div>
  66. <div class="management">
  67. <div class="management_title">强大的功能,轻松的管理</div>
  68. <div class="management_tex">提供便捷且全面的工时填报、审核和统计功能,围绕企业成本管理提供一站式解决方案</div>
  69. <div class="swiper-container study_fo">
  70. <div class="swiper-wrapper">
  71. <div class="swiper-slide">
  72. <img src="./image/gs1.jpg" alt="" />
  73. <p>工时填报</p>
  74. </div>
  75. <div class="swiper-slide">
  76. <img src="./image/gs2.jpg" alt="" />
  77. <p>报告查看</p>
  78. </div>
  79. <div class="swiper-slide">
  80. <img src="./image/gs3.jpg" alt="" />
  81. <p>工时审批</p>
  82. </div>
  83. <div class="swiper-slide">
  84. <img src="./image/gs4.jpg" alt="" />
  85. <p>项目管理</p>
  86. </div>
  87. <div class="swiper-slide">
  88. <img src="./image/gs5.jpg" alt="" />
  89. <p>成本统计</p>
  90. </div>
  91. <div class="swiper-slide">
  92. <img src="./image/gs6.jpg" alt="" />
  93. <p>财务核算</p>
  94. </div>
  95. <div class="swiper-slide">
  96. <img src="./image/gs7.jpg" alt="" />
  97. <p>客户管理</p>
  98. </div>
  99. <div class="swiper-slide">
  100. <img src="./image/gs8.jpg" alt="" />
  101. <p>费用报销</p>
  102. </div>
  103. <div class="swiper-slide">
  104. <img src="./image/gs9.jpg" alt="" />
  105. <p>工程管理</p>
  106. </div>
  107. <div class="swiper-slide">
  108. <img src="./image/gs10.jpg" alt="" />
  109. <p>审批流</p>
  110. </div>
  111. </div>
  112. <!-- Add Pagination -->
  113. <div class="swiper-pagination"></div>
  114. </div>
  115. </div>
  116. <div class="customer">
  117. <div class="customer_title">来自客户的认可</div>
  118. <div class="swiper-container customer_fo">
  119. <div class="swiper-wrapper">
  120. <div class="swiper-slide">
  121. <img src="./image/yidong/ggg1.png" alt="" />
  122. </div>
  123. <div class="swiper-slide">
  124. <img src="./image/yidong/ggg2.png" alt="" />
  125. </div>
  126. <div class="swiper-slide">
  127. <img src="./image/yidong/ggg3.png" alt="" />
  128. </div>
  129. <div class="swiper-slide">
  130. <img src="./image/yidong/ggg4.png" alt="" />
  131. </div>
  132. <div class="swiper-slide">
  133. <img src="./image/yidong/ggg5.png" alt="" />
  134. </div>
  135. <div class="swiper-slide">
  136. <img src="./image/yidong/ggg6.png" alt="" />
  137. </div>
  138. <div class="swiper-slide">
  139. <img src="./image/yidong/ggg7.png" alt="" />
  140. </div>
  141. <div class="swiper-slide">
  142. <img src="./image/yidong/ggg8.png" alt="" />
  143. </div>
  144. </div>
  145. <!-- Add Pagination -->
  146. <div class="swiper-pagination"></div>
  147. </div>
  148. </div>
  149. <div class="foots">
  150. <div class="erweima">
  151. <img src="./image/gzh.jpg" alt="">
  152. </div>
  153. <div class="erweima_text">工时管家官方客服</div>
  154. <div class="erweima_haoma">Copyright©2016 南京火石闪信网络有限公司 苏ICP备18064522号-1</div>
  155. </div>
  156. </section>
  157. </body>
  158. <script src="./js/homemovement/flexible.js"></script>
  159. <!-- 比如引入js文件 -->
  160. <script src="./js/homemovement/swiper.min.js"></script>
  161. <script>
  162. // 第一个函数里面是 就业指导轮播图
  163. (function () {
  164. var swiper = new Swiper(".get_job_fo", {
  165. // 能够显示的 slider的个数
  166. slidesPerView: 2,
  167. // 每一个slide之间的距离
  168. spaceBetween: 30,
  169. centeredSlides: true,
  170. loop: true,
  171. // 添加左右箭头
  172. navigation: {
  173. nextEl: ".swiper-button-next",
  174. prevEl: ".swiper-button-prev",
  175. },
  176. });
  177. })();
  178. // 第二个函数的轮播图
  179. (function () {
  180. // 如果有多个轮播图最好修改下 swiper-container
  181. var swiper = new Swiper(".study_fo", {
  182. // 我们可以可以看看到的是 2个半
  183. slidesPerView: 1,
  184. spaceBetween: 20,
  185. });
  186. })();
  187. // 第三个函数的轮播图
  188. (function () {
  189. // 如果有多个轮播图最好修改下 swiper-container
  190. var swiper = new Swiper(".customer_fo", {
  191. // 我们可以可以看看到的是 2个半
  192. slidesPerView: 2.2,
  193. spaceBetween: 20,
  194. });
  195. })();
  196. </script>
  197. <script>
  198. $('#anqiye').click(function() {
  199. console.log('我被点击率')
  200. // $.ajax({
  201. // type : "GET",
  202. // // url : "http://192.168.2.97:10010/wxcorp/getPreAuthCode",
  203. // url : "http://worktime.ttkuaiban.com/api/wxcorp/getPreAuthCode",
  204. // dataType : "jsonp",
  205. // jsonp: "jsoncallback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(默认为:callback)
  206. // jsonpCallback:"jsoncallback",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名
  207. // success : function(data){
  208. // console.log(data);
  209. // },
  210. // error:function(){
  211. // alert('请求失败');
  212. // }
  213. // });
  214. // function jsoncallback(data) {
  215. // console.log(data)
  216. // }
  217. $.ajax({
  218. type : "GET",
  219. url : "https://worktime.ttkuaiban.com/api/wxcorp/getPreAuthCode",
  220. success : function(data){
  221. let suiteId = 'ww4e237fd6abb635af'
  222. let huidiao = 'https://worktime.ttkuaiban.com/api/wxcorp/installFromWebsite'
  223. let url = `https://open.work.weixin.qq.com/3rdapp/install?suite_id=${suiteId}&pre_auth_code=${data.data.code}&redirect_uri=${huidiao}&state=4`
  224. window.location.href = url
  225. },
  226. error:function(){
  227. alert('请求失败');
  228. }
  229. });
  230. })
  231. $('#zhuce').click(function() {
  232. $.ajax({
  233. type : "GET",
  234. url : "https://worktime.ttkuaiban.com/api/wxcorp/getRegisterCode",
  235. success : function(data){
  236. if(data.code == 'ok') {
  237. let url = `https://open.work.weixin.qq.com/3rdservice/wework/register?register_code=${data.data.code}`
  238. if(data.data.code != undefined && data.data.code != 'undefined') {
  239. window.location.href = url
  240. }
  241. } else {
  242. console.log(data)
  243. alert(data.msg)
  244. }
  245. },
  246. error:function(){
  247. alert('请求失败');
  248. }
  249. });
  250. })
  251. </script>
  252. </html>