userManual.html 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  6. <meta
  7. name="viewport"
  8. content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
  9. />
  10. <link rel="icon" href="../static/img/favicon2.ico" type="img/x-ico" />
  11. <title>双子星</title>
  12. <link rel="stylesheet" href="../static/css/normalize-8.0.1.css" />
  13. <script src="https://unpkg.com/vconsole@3.14.6/dist/vconsole.min.js"></script>
  14. <script src="../static/js/vender/vue/vue.min.js"></script>
  15. <!-- <script src="https://cdn.staticfile.org/vue/2.2.2/vue.js"></script> -->
  16. <!-- <script src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/vue/2.6.14/vue.js"></script> -->
  17. <script src="../static/js/vender/config.js"></script>
  18. <script src="../static/js/tailwindcss/v3.0.24/index.js"></script>
  19. <script>
  20. tailwind.config = {
  21. theme: {},
  22. corePlugins: {
  23. preflight: false,
  24. },
  25. };
  26. </script>
  27. <script src="../static/js/vender/jquery-3.4.1.min.js"></script>
  28. <link rel="stylesheet" href="../static/js/vender/toastr/toastr.min.css" />
  29. <script src="../static/js/vender/toastr/toastr.min.js"></script>
  30. <script>
  31. toastr.options.positionClass = 'toast-center-center';
  32. </script>
  33. <style>
  34. [v-cloak] {
  35. display: none;
  36. }
  37. @media screen and (max-width: 750px) {
  38. html {
  39. font-size: calc(100vw / 7.5);
  40. }
  41. }
  42. @media screen and (min-width: 750px) {
  43. html {
  44. font-size: calc(750px / 7.5);
  45. }
  46. }
  47. .phone-container {
  48. color: #333333;
  49. line-height: 1.5;
  50. }
  51. .user-Agreement-content {
  52. font-size: 0.28rem;
  53. line-height: 1.5;
  54. text-align: justify;
  55. }
  56. h1 {
  57. font-size: 0.32rem;
  58. }
  59. h2 {
  60. font-size: 0.31rem;
  61. }
  62. h3 {
  63. font-size: 0.3rem;
  64. }
  65. h4 {
  66. font-size: 0.29rem;
  67. }
  68. h5 {
  69. font-size: 0.28rem;
  70. }
  71. h6 {
  72. font-size: 0.27rem;
  73. }
  74. .phone-container p {
  75. font-size: 0.28rem;
  76. color: #333;
  77. }
  78. </style>
  79. </head>
  80. <body>
  81. <div v-cloak id="app">
  82. <h1 class="text-center mt-2">{{title}}</h1>
  83. <div class="p-2 phone-container" v-html="content"></div>
  84. </div>
  85. <script src="../static/js/vender/vue/axios.min.js"></script>
  86. <script src="../static/js/vender/vue/config.js"></script>
  87. <script src="../static/js/vender/vue/api.js"></script>
  88. <script type="text/javascript">
  89. Vue.config.errorHandler = function (err, vm, info) {
  90. toastr.error(err.message);
  91. return false;
  92. };
  93. new Vue({
  94. el: '#app',
  95. data: {
  96. title: '',
  97. content: '',
  98. },
  99. computed: {},
  100. methods: {},
  101. mounted() {
  102. service
  103. .get('/api/public/v5/agreementApi/content/getContentByType', {
  104. params: {
  105. agreementCoding: 'XYPZYHXY2004',
  106. type: 1,
  107. },
  108. })
  109. .then(
  110. (response) => {
  111. this.title = response.data.agreementName;
  112. const html = document.createElement('html');
  113. html.innerHTML = response.data.content;
  114. const phoneContainers =
  115. html.querySelectorAll('.phone-container');
  116. if (phoneContainers.length > 0) {
  117. this.content = phoneContainers.item(
  118. phoneContainers.length - 1,
  119. ).innerHTML;
  120. } else {
  121. this.content = response.data.content;
  122. }
  123. },
  124. (error) => {
  125. toastr.error(err.message);
  126. },
  127. );
  128. },
  129. errorCaptured(err, vm, info) {
  130. toastr.error(err.message);
  131. return false;
  132. },
  133. });
  134. </script>
  135. </body>
  136. </html>