App.vue 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213
  1. <template>
  2. <div id="app">
  3. <!-- IOS机器会跳转两次到其他路由,当from路由被缓存时,原因未知 -->
  4. <keep-alive >
  5. <!-- <transition name="fade"> -->
  6. <router-view v-if="$route.meta.keepAlive"></router-view>
  7. <!-- </transition> -->
  8. </keep-alive>
  9. <router-view v-if="!$route.meta.keepAlive"></router-view>
  10. <div class="loadingShadow" v-show="loading">
  11. <div class="loadData">
  12. <img src="https://skyforest.static.elaber.cn/detail/loading.gif" alt="" />
  13. <div class="loadingMsg">{{loadingMsg}}</div>
  14. </div>
  15. </div>
  16. </div>
  17. </template>
  18. <script>
  19. import {
  20. getStorage,
  21. removeItem
  22. } from '@/utils/localStorage';
  23. export default {
  24. name: "App",
  25. // provide() {
  26. // return {
  27. // reload: this.reload,
  28. // };
  29. // },
  30. data() {
  31. return {
  32. themeColor: "rgba(0,97,232,1)",
  33. themeColor2: "rgba(0,97,232,0.2)",
  34. isRouterAlive: true,
  35. showAccountView: false, //是否显示用户账号列表
  36. acountList: [], //弹出层账号列表数据
  37. selectAccount: null, //选中的账号
  38. isIOS: false,
  39. include: []
  40. };
  41. },
  42. created() {
  43. let userId = this.$route.query.leavePhoneCustomerId ? this.$route.query.leavePhoneCustomerId : '129130';
  44. // let xcxHouseId = this.$route.query.xcxHouseId ? this.$route.query.xcxHouseId : $config.xcxHouseId;
  45. let xcxHouseId = '100296';
  46. if (userId) { //如果存在用户id
  47. this.$store.dispatch('setUserId', userId);
  48. }
  49. if (xcxHouseId) { //如果存在houseid
  50. this.$store.dispatch('setHouseId', xcxHouseId);
  51. }
  52. let isIOS = !!navigator.userAgent.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
  53. this.isIOS = isIOS;
  54. window.addEventListener('error', (error) => {
  55. // 区分是否是js错误
  56. if (error.message) {
  57. alert("error" + message)
  58. } else {
  59. alert('监测到E1004错误' + error);
  60. }
  61. }, true)
  62. window.addEventListener('beforeunload', function(event) {
  63. // 检查内存使用情况
  64. if (performance.memory.usedJSHeapSize >= performance.memory.jsHeapSizeLimit) {
  65. // 内存不足,执行重新加载页面的逻辑
  66. event.preventDefault();
  67. // window.location.reload();
  68. alert("**内存不足,页面重新载入**")
  69. }
  70. });
  71. // 监听页面隐藏事件
  72. window.addEventListener('pagehide', function(event) {
  73. // 判断页面是否因为内存不足而被卸载或隐藏
  74. if (event.persisted) {
  75. // 页面被卸载或隐藏,可以执行一些重载操作
  76. alert("**内存不足,页面重新载入ios**")
  77. }
  78. });
  79. // window.onerror = function(message,source,line,column,error) {
  80. // };
  81. },
  82. watch: {
  83. loading: {
  84. handler(newVal) {
  85. if (!newVal) {
  86. this.$store.state.loadingMsg = ''
  87. }
  88. }
  89. },
  90. },
  91. computed: {
  92. loading() {
  93. return this.$store.state.loading;
  94. },
  95. loadingMsg() {
  96. if (this.$store.state.loadingMsg) {
  97. return this.$store.state.loadingMsg;
  98. } else {
  99. return "正在查询,请耐心等待";
  100. }
  101. }
  102. },
  103. mounted() {
  104. // 禁止图片单机事件,防止出现图片点击浏览器自动预览功能
  105. document.body.addEventListener("click", function(e) {
  106. if (e.target.nodeName.toLowerCase() == "img") {
  107. e.preventDefault();
  108. }
  109. });
  110. },
  111. methods: {
  112. },
  113. };
  114. </script>
  115. <style>
  116. #app {
  117. font-family: Avenir, Helvetica, Arial, sans-serif;
  118. -webkit-font-smoothing: antialiased;
  119. -moz-osx-font-smoothing: grayscale;
  120. /* text-align: center;
  121. color: #2c3e50;
  122. margin-top: 60px; */
  123. }
  124. body {
  125. background: #181C28;
  126. }
  127. .el-tooltip__popper.is-light {
  128. backdrop-filter: blur(10.36rem) !important;
  129. background-color: rgba(255, 255, 255, 0.4) !important;
  130. border: none !important;
  131. color: #ffffff !important;
  132. }
  133. .el-tooltip__popper .popper__arrow,
  134. .el-tooltip__popper .popper__arrow::after {
  135. border-style: none !important;
  136. }
  137. .el-picker-panel__body .el-date-picker__header .el-picker-panel__icon-btn {
  138. color: #FFFFFF;
  139. }
  140. .el-picker-panel__body .el-date-picker__header .el-date-picker__header-label {
  141. color: #FFFFFF;
  142. }
  143. .el-picker-panel__body .el-picker-panel__content .el-date-table th {
  144. color: #FFFFFF;
  145. }
  146. .dropdown-view-menu {
  147. font-size: 14px;
  148. color: var(--themeColor9);
  149. /* width: 336rem; */
  150. box-sizing: border-box;
  151. padding: 15rem !important;
  152. margin-top: 3rem;
  153. backdrop-filter: blur(60px);
  154. border: none !important;
  155. background-color: rgba(255, 255, 255, 0.15) !important;
  156. white-space: nowrap;
  157. overflow: hidden;
  158. text-overflow: ellipsis;
  159. }
  160. .dropdown-view-menu .active {
  161. color: #CEF7D1;
  162. }
  163. .dropdown-view-text {
  164. font-family: "Verdana Bold";
  165. font-weight: 700;
  166. text-decoration: underline;
  167. font-size: 14px;
  168. color: #fff;
  169. }
  170. .select-julangview {
  171. display: none;
  172. }
  173. .popper-class-qr {
  174. padding: 0px !important;
  175. }
  176. .BMap_cpyCtrl {
  177. display: none;
  178. }
  179. .anchorBL {
  180. display: none;
  181. }
  182. .amap-logo img {
  183. display: none;
  184. }
  185. .amap-copyright {
  186. opacity: 0;
  187. }
  188. </style>
  189. <style lang="scss" scoped>
  190. @import "./assets/common.scss";
  191. </style>