app.html 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225
  1. <!DOCTYPE html>
  2. <html lang="zh">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <title>ROMA</title>
  6. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  7. <link rel="icon" type="image/x-ico" href=""/>
  8. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
  9. <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
  10. <link rel="stylesheet" href="./public/static/amis-sdk/helper.css">
  11. <link rel="stylesheet" href="./public/static/amis-sdk/sdk.css">
  12. <link rel="stylesheet" href="./public/static/amis-sdk/iconfont.css">
  13. <link rel="stylesheet" href="./public/static/fonts/remixicon.css">
  14. <style>
  15. html,
  16. body,
  17. .app-wrapper {
  18. position: relative;
  19. width: 100%;
  20. height: 100%;
  21. margin: 0;
  22. padding: 0;
  23. touch-action: pan-y;
  24. }
  25. :root {
  26. --Form-item-gap: 1.3rem;
  27. --InputGroup-height: 2.5rem;
  28. --Button-height: 2.5rem;
  29. --InputGroup-paddingX: .6rem;
  30. --InputGroup-addOn-bg: var(--Form-input-bg);
  31. /* --fontSizeBase: .9rem; */
  32. }
  33. .app-wrapper {
  34. position: relative;
  35. width: 100%;
  36. height: 100%;
  37. margin: 0;
  38. padding: 0;
  39. }
  40. </style>
  41. </head>
  42. <body>
  43. <div id="root" class="app-wrapper"></div>
  44. <script type='text/javascript' src='./public/static/amis-sdk/sdk.js'></script>
  45. <script type='text/javascript' src='./public/static/amis-static/history.js'></script>
  46. <script src="./lang/en-US.js"></script>
  47. <script src="./lang/zh-CN.js"></script>
  48. <script>
  49. (function () {
  50. let amis = amisRequire('amis/embed');
  51. const match = amisRequire('path-to-regexp').match;
  52. let enUSLocale = enUs()
  53. let zhCNLocale = zhCn()
  54. //多语言映射
  55. const languageMap = {
  56. "en-US": {
  57. register: enUSLocale.register,
  58. replaceText: enUSLocale.replaceText,
  59. langReplaceTextIgnoreKeys: enUSLocale.langReplaceTextIgnoreKeys
  60. },
  61. "zh-CN": {
  62. register: zhCNLocale.register,
  63. replaceText: zhCNLocale.replaceText,
  64. langReplaceTextIgnoreKeys: zhCNLocale.langReplaceTextIgnoreKeys
  65. }
  66. }
  67. // 如果想用 browserHistory 请切换下这处代码, 其他不用变
  68. // const history = History.createBrowserHistory();
  69. const history = History.createHashHistory();
  70. const app = {
  71. type: 'app',
  72. // brandName: 'ROMA',
  73. logo: './public/static/images/logo.jpg',
  74. // footer: '<div class="p-2 text-center bg-light">底部区域</div>',
  75. // asideBefore: '<div class="p-2 text-center">菜单前面区域</div>',
  76. // asideAfter: '<div class="p-2 text-center">菜单后面区域</div>',
  77. // // api: '/pages/site.json'
  78. api: 'http://192.168.115.39:8051/demomenu'
  79. };
  80. function normalizeLink(to, location = history.location) {
  81. to = to || '';
  82. if (to && to[0] === '#') {
  83. to = location.pathname + location.search + to;
  84. } else if (to && to[0] === '?') {
  85. to = location.pathname + to;
  86. }
  87. const idx = to.indexOf('?');
  88. const idx2 = to.indexOf('#');
  89. let pathname = ~idx
  90. ? to.substring(0, idx)
  91. : ~idx2
  92. ? to.substring(0, idx2)
  93. : to;
  94. let search = ~idx ? to.substring(idx, ~idx2 ? idx2 : undefined) : '';
  95. let hash = ~idx2 ? to.substring(idx2) : location.hash;
  96. if (!pathname) {
  97. pathname = location.pathname;
  98. } else if (pathname[0] != '/' && !/^https?\:\/\//.test(pathname)) {
  99. let relativeBase = location.pathname;
  100. const paths = relativeBase.split('/');
  101. paths.pop();
  102. let m;
  103. while ((m = /^\.\.?\//.exec(pathname))) {
  104. if (m[0] === '../') {
  105. paths.pop();
  106. }
  107. pathname = pathname.substring(m[0].length);
  108. }
  109. pathname = paths.concat(pathname).join('/');
  110. }
  111. return pathname + search + hash;
  112. }
  113. function isCurrentUrl(to, ctx) {
  114. if (!to) {
  115. return false;
  116. }
  117. const pathname = history.location.pathname;
  118. const link = normalizeLink(to, {
  119. ...location,
  120. pathname,
  121. hash: ''
  122. });
  123. if (!~link.indexOf('http') && ~link.indexOf(':')) {
  124. let strict = ctx && ctx.strict;
  125. return match(link, {
  126. decode: decodeURIComponent,
  127. strict: typeof strict !== 'undefined' ? strict : true
  128. })(pathname);
  129. }
  130. return decodeURI(pathname) === link;
  131. }
  132. let amisInstance = amis.embed(
  133. '#root',
  134. app,
  135. {
  136. location: history.location
  137. },
  138. {
  139. // watchRouteChange: fn => {
  140. // return history.listen(fn);
  141. // },
  142. updateLocation: (location, replace) => {
  143. location = normalizeLink(location);
  144. if (location === 'goBack') {
  145. return history.goBack();
  146. } else if (
  147. (!/^https?\:\/\//.test(location) &&
  148. location ===
  149. history.location.pathname + history.location.search) ||
  150. location === history.location.href
  151. ) {
  152. // 目标地址和当前地址一样,不处理,免得重复刷新
  153. return;
  154. } else if (/^https?\:\/\//.test(location) || !history) {
  155. return (window.location.href = location);
  156. }
  157. history[replace ? 'replace' : 'push'](location);
  158. },
  159. jumpTo: (to, action) => {
  160. if (to === 'goBack') {
  161. return history.goBack();
  162. }
  163. to = normalizeLink(to);
  164. if (isCurrentUrl(to)) {
  165. return;
  166. }
  167. if (action && action.actionType === 'url') {
  168. action.blank === false
  169. ? (window.location.href = to)
  170. : window.open(to, '_blank');
  171. return;
  172. } else if (action && action.blank) {
  173. window.open(to, '_blank');
  174. return;
  175. }
  176. if (/^https?:\/\//.test(to)) {
  177. window.location.href = to;
  178. } else if (
  179. (!/^https?\:\/\//.test(to) &&
  180. to === history.pathname + history.location.search) ||
  181. to === history.location.href
  182. ) {
  183. // do nothing
  184. } else {
  185. history.push(to);
  186. }
  187. },
  188. isCurrentUrl: isCurrentUrl,
  189. theme: 'cxd'
  190. }
  191. );
  192. history.listen(state => {
  193. amisInstance.updateProps({
  194. location: state.location || state
  195. });
  196. });
  197. })();
  198. </script>
  199. </body>
  200. </html>