iosEnter.html 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
  1. <!DOCTYPE html>
  2. <html lang="en" xmlns:th="http://www.thymeleaf.org">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title></title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1">
  7. <link rel="icon" href="../static/img/favicon2.ico" type="img/x-ico">
  8. <link rel="stylesheet" href="../static/js/vender/bootstrap/css/bootstrap.min.css">
  9. <link rel="stylesheet" href="../static/css/experience2.css">
  10. <link rel="stylesheet" href="../static/js/vender/toastr/toastr.min.css">
  11. <script src="../static/js/vender/jquery-3.4.1.min.js"></script>
  12. <script src="../static/js/vender/bootstrap/js/bootstrap.min.js"></script>
  13. <script src="../static/js/vender/toastr/toastr.min.js"></script>
  14. <script src="../static/js/vender/config.js"></script>
  15. <script>
  16. toastr.options.positionClass = 'toast-center-center';
  17. </script>
  18. </head>
  19. <div class="container">
  20. <div class="index-icon" id="index-what">
  21. <img class="img" src="../static/img/iosEnter/index-what.png" />
  22. </div>
  23. <div class="index-icon" id="index-phone">
  24. <img class="img" src="../static/img/iosEnter/index-phone.png" />
  25. </div>
  26. </div>
  27. <script type="text/javascript" th:inline="javascript">
  28. let node = document.getElementById('index-what');
  29. let phone = document.getElementById('index-phone');
  30. let currIosVersionNumber = navigator.userAgent.split('iosVersionNumber/')[1];
  31. let serveIosVersionNumber = '';
  32. //获取版本号
  33. function switchControl(){
  34. $.ajax({
  35. url: baseUrl + '/api/public/v4/access/user/switchControl',
  36. type: 'get',
  37. contentType:"application/json",
  38. dataType: 'json',
  39. cache: false,
  40. success: function (res) {
  41. serveIosVersionNumber = res.data.iosVersionNumber;
  42. let result = versionStringCompare(currIosVersionNumber, serveIosVersionNumber);
  43. if(result === 1) {
  44. phone.style.display = 'none';
  45. } else {
  46. phone.style.display = 'block';
  47. }
  48. }
  49. })
  50. }
  51. switchControl();
  52. node.addEventListener('click', () => {
  53. window.location.href = 'https://www.baidu.com/'
  54. })
  55. phone.addEventListener('click', () => {
  56. window.location.href = baseUrl + '/cloud/phone/web/#/pages/index/index'
  57. })
  58. function versionStringCompare(preVersion='', lastVersion='') {
  59. var sources = preVersion.split('.');
  60. var dests = lastVersion.split('.');
  61. var maxL = Math.max(sources.length, dests.length);
  62. var result = 0;
  63. for (let i = 0; i < maxL; i++) {
  64. let preValue = sources.length>i ? sources[i]:0;
  65. let preNum = isNaN(Number(preValue)) ? preValue.charCodeAt() : Number(preValue);
  66. let lastValue = dests.length>i ? dests[i]:0;
  67. let lastNum = isNaN(Number(lastValue)) ? lastValue.charCodeAt() : Number(lastValue);
  68. if (preNum < lastNum) {
  69. result = -1;
  70. break;
  71. } else if (preNum > lastNum) {
  72. result = 1;
  73. break;
  74. }
  75. }
  76. return result;
  77. }
  78. </script>
  79. </body>
  80. <style>
  81. .container{
  82. width: 100%;
  83. height: 100vh;
  84. padding-top: 0.2rem;
  85. display: flex;
  86. flex-direction: column;
  87. align-items: center;
  88. background-color: rgba(16, 16, 16, 1);
  89. }
  90. .index-icon{
  91. width: 6.5rem;
  92. height: 2.28rem;
  93. padding-top: 0.36rem;
  94. }
  95. .img{
  96. width: 100%;
  97. height: 100%;
  98. }
  99. #index-phone{
  100. display: none;
  101. }
  102. #toast-container>.toast-error {
  103. background-image: none !important;
  104. }
  105. .toast-error {
  106. background-color: rgba(0, 0, 0, 0.8);
  107. }
  108. #toast-container>div {
  109. font-size: 14px;
  110. min-width: 80px !important;
  111. padding: 12px !important;
  112. box-shadow: none;
  113. }
  114. @media (max-width: 480px) and (min-width: 241px) {
  115. #toast-container>div {
  116. min-width: 80px !important;
  117. width: auto;
  118. }
  119. }
  120. @media only screen and (min-width: 640px) {
  121. .toast-center-center {
  122. top: 50%;
  123. left: 50%;
  124. transform: translate(-50%, -50%);
  125. }
  126. }
  127. @media only screen and (max-width: 640px) {
  128. .toast-center-center {
  129. top: 50%;
  130. left: 50%;
  131. transform: translate(-50%, -50%);
  132. }
  133. }
  134. input::-webkit-input-placeholder {
  135. color: #BBBBBB;
  136. }
  137. input::-moz-placeholder {
  138. /* Mozilla Firefox 19+ */
  139. color: #BBBBBB;
  140. }
  141. input:-moz-placeholder {
  142. /* Mozilla Firefox 4 to 18 */
  143. color: #BBBBBB;
  144. }
  145. input:-ms-input-placeholder {
  146. /* Internet Explorer 10-11 */
  147. color: #BBBBBB;
  148. }
  149. </style>
  150. </html>