index.html 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <link href="static/favicon.ico" rel="SHORTCUT ICON">
  6. <title>实验室安全智能监测与控制系统</title>
  7. </head>
  8. <body>
  9. <div class="main">
  10. <img class="logo_img" />
  11. <p class="title">实验室安全检测控制系统</p>
  12. <div class="skip" onclick="weixinFun()">
  13. <p>前往微信打开</p>
  14. </div>
  15. </div>
  16. </body>
  17. <script type="text/javascript" src="./static/jquery-3.2.0.min.js"></script>
  18. <script type="text/javascript" src="./static/clipboard.js"></script>
  19. </html>
  20. <script type="text/javascript">
  21. // 后台服务请求地址
  22. let baseURL = 'https://labcontrol.nwafu.edu.cn/api/'
  23. var urlScheme = "";
  24. //获取后台配置项(获取logo)
  25. $.ajax({
  26. type: "get",
  27. url: baseURL + 'auth/configInfo?type=1,2,4',
  28. headers: {
  29. 'Content-Type': 'application/json;charset=utf8'
  30. },
  31. dataType: "json",
  32. success: function(res) {
  33. let list = JSON.parse(res.data)
  34. let newData = {};
  35. list.forEach((item) => {
  36. let obj = JSON.parse(item.configValue)
  37. newData = {
  38. ...newData,
  39. ...obj
  40. }
  41. })
  42. $(".logo_img").attr("src", baseURL + newData.circularLogo)
  43. }
  44. });
  45. //3. 实例化clipboard
  46. var clipboard = new ClipboardJS('.btn', {
  47. text: function() {
  48. return urlScheme;
  49. },
  50. });
  51. //url内容读取(短信内容会携带跳转相关参数)
  52. function getQueryString(name) {
  53. const url_string = window.location.href; // window.location.href
  54. const url = new URL(url_string);
  55. return url.searchParams.get(name);
  56. }
  57. //跳转按钮
  58. function weixinFun() {
  59. location.href = getQueryString('urlScheme')
  60. }
  61. //获取地址栏urlScheme
  62. urlScheme = getQueryString('urlScheme')
  63. </script>
  64. <style>
  65. * {
  66. padding: 0;
  67. margin: 0;
  68. box-sizing: border-box;
  69. }
  70. body {
  71. background: #fff;
  72. }
  73. .main {
  74. width: 750px;
  75. margin: auto;
  76. text-align: center;
  77. }
  78. .logo_img {
  79. width: 150px;
  80. height: 150px;
  81. margin-top: 276px;
  82. }
  83. .title {
  84. font-size: 24px;
  85. font-family: Microsoft YaHei-Bold, Microsoft YaHei;
  86. font-weight: 700;
  87. color: #333333;
  88. line-height: 24px;
  89. margin-top: 46px;
  90. }
  91. .skip {
  92. width: 100%;
  93. display: flex;
  94. justify-content: center;
  95. margin-top: 180px;
  96. }
  97. .skip>p {
  98. width: 400px;
  99. height: 80px;
  100. background: #0183FA;
  101. border-radius: 10px 10px 10px 10px;
  102. font-size: 28px;
  103. font-family: PingFang SC-Medium, PingFang SC;
  104. font-weight: 400;
  105. color: #FFFFFF;
  106. line-height: 80px;
  107. text-align: center;
  108. }
  109. .copy {
  110. font-size: 28px;
  111. font-family: PingFang SC-Medium, PingFang SC;
  112. font-weight: 400;
  113. color: #333333;
  114. line-height: 30px;
  115. margin-top: 66px;
  116. }
  117. .copy .btn {
  118. font-size: 28px;
  119. font-family: PingFang SC-Medium, PingFang SC;
  120. font-weight: 400;
  121. color: #0183FA;
  122. line-height: 30px;
  123. margin-left: 20px;
  124. border: none;
  125. background: none;
  126. }
  127. </style>