From 298ffd4b0fc7fe32bd71a72dcb62b219c37bf90f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=BC=A0=E7=9B=8A=E9=93=AD?= Date: Tue, 30 Mar 2021 11:55:31 +0800 Subject: [PATCH] fix: mobile bug --- package-lock.json | 43 ++++++++++++++++++++-------- package.json | 5 ++-- src/components/map/amap.vue | 4 ++- src/main.ts | 3 ++ src/utils/deviceDetection/index.ts | 25 ++++++++++++++++ src/views/components/video/index.vue | 27 +---------------- vite.config.ts | 2 +- 7 files changed, 67 insertions(+), 42 deletions(-) create mode 100644 src/utils/deviceDetection/index.ts diff --git a/package-lock.json b/package-lock.json index 0a5b2867e..e9960983e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -580,9 +580,9 @@ "dev": true }, "element-plus": { - "version": "1.0.2-beta.35", - "resolved": "http://192.168.250.101:4873/element-plus/-/element-plus-1.0.2-beta.35.tgz", - "integrity": "sha1-FYiQvd8o+ElfJh0CeJvzlMXJcSM=", + "version": "1.0.2-beta.36", + "resolved": "http://192.168.250.101:4873/element-plus/-/element-plus-1.0.2-beta.36.tgz", + "integrity": "sha1-eKfhvhC5YixPw0L9zggBZQ8wuwE=", "requires": { "@popperjs/core": "^2.4.4", "async-validator": "^3.4.0", @@ -635,9 +635,9 @@ } }, "esbuild": { - "version": "0.9.6", - "resolved": "http://192.168.250.101:4873/esbuild/-/esbuild-0.9.6.tgz", - "integrity": "sha1-LK5RnnziMo7PV65zgJDQfOckWFA=", + "version": "0.9.7", + "resolved": "http://192.168.250.101:4873/esbuild/-/esbuild-0.9.7.tgz", + "integrity": "sha1-6g1jnL5LiOwl++1Nb/AMjXiO9ws=", "dev": true }, "escalade": { @@ -1001,6 +1001,11 @@ "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=", "dev": true }, + "mutation-observer": { + "version": "1.0.3", + "resolved": "http://192.168.250.101:4873/mutation-observer/-/mutation-observer-1.0.3.tgz", + "integrity": "sha1-QukiKxAbyoLlup1aes9KFMDyY9A=" + }, "nanoid": { "version": "3.1.20", "resolved": "http://192.168.250.101:4873/nanoid/-/nanoid-3.1.20.tgz", @@ -1235,9 +1240,9 @@ "dev": true }, "rollup": { - "version": "2.42.3", - "resolved": "http://192.168.250.101:4873/rollup/-/rollup-2.42.3.tgz", - "integrity": "sha1-eTXXvIaH+qV0NDLiB9dhqjH+b+4=", + "version": "2.44.0", + "resolved": "http://192.168.250.101:4873/rollup/-/rollup-2.44.0.tgz", + "integrity": "sha1-jaMk0cT9Er7vmubhL0BoJlttles=", "dev": true, "requires": { "fsevents": "~2.3.1" @@ -1354,6 +1359,11 @@ "is-number": "^7.0.0" } }, + "transitionEnd": { + "version": "1.0.2", + "resolved": "http://192.168.250.101:4873/transitionEnd/-/transitionEnd-1.0.2.tgz", + "integrity": "sha1-GRTbW0Wn79w0oBr2koWjppOHFjM=" + }, "troisjs": { "version": "0.1.19", "resolved": "http://192.168.250.101:4873/troisjs/-/troisjs-0.1.19.tgz", @@ -1423,10 +1433,19 @@ "resolved": "http://192.168.250.101:4873/v-contextmenu/-/v-contextmenu-3.0.0-alpha.4.tgz", "integrity": "sha1-9GWYrJivrF1duMZUDfwSMEztEUA=" }, + "vconsole": { + "version": "3.4.0", + "resolved": "http://192.168.250.101:4873/vconsole/-/vconsole-3.4.0.tgz", + "integrity": "sha1-LPL/qobNerc2mXoitj0FYnxqtWc=", + "requires": { + "mutation-observer": "^1.0.3", + "transitionEnd": "^1.0.2" + } + }, "vite": { - "version": "2.1.2", - "resolved": "http://192.168.250.101:4873/vite/-/vite-2.1.2.tgz", - "integrity": "sha1-CuyvbTQRKyRTbfGhTNjXT9yrbiA=", + "version": "2.1.4", + "resolved": "http://192.168.250.101:4873/vite/-/vite-2.1.4.tgz", + "integrity": "sha1-ZjloI3AeVM87+59z29OGybQynIY=", "dev": true, "requires": { "esbuild": "^0.9.3", diff --git a/package.json b/package.json index c8f06d063..5409f4828 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,7 @@ "await-to-js": "^2.1.1", "axios": "^0.21.1", "dotenv": "^8.2.0", - "element-plus": "^1.0.2-beta.35", + "element-plus": "^1.0.2-beta.36", "mitt": "^2.1.0", "mockjs": "^1.1.0", "nprogress": "^0.2.0", @@ -22,6 +22,7 @@ "three": "^0.126.1", "troisjs": "^0.1.19", "v-contextmenu": "^3.0.0-alpha.4", + "vconsole": "^3.4.0", "vue": "^3.0.7", "vue-i18n": "^9.0.0", "vue-router": "^4.0.4", @@ -44,7 +45,7 @@ "sass": "^1.32.8", "sass-loader": "^11.0.1", "typescript": "^4.2.2", - "vite": "^2.1.2", + "vite": "^2.1.4", "vite-plugin-mock": "^2.4.0" } } diff --git a/src/components/map/amap.vue b/src/components/map/amap.vue index e60a7d417..6062b024a 100644 --- a/src/components/map/amap.vue +++ b/src/components/map/amap.vue @@ -21,6 +21,7 @@ import { import { mapJson } from "../../api/map"; import greenCar from "/@/assets/green.png"; +import { deviceDetection } from "../../utils/deviceDetection" let MarkerCluster = null; @@ -44,7 +45,7 @@ export default defineComponent({ let map: MapConfigureInter; const mapSet: mapInter = reactive({ - loading: true, + loading: deviceDetection() ? false : true, }); // 地图创建完成(动画关闭) @@ -134,6 +135,7 @@ export default defineComponent({ complete(); }) .catch((err) => { + mapSet.loading = false; throw "地图加载失败，请重新加载"; }); }); diff --git a/src/main.ts b/src/main.ts index a69b2bf53..b5541ef80 100644 --- a/src/main.ts +++ b/src/main.ts @@ -37,6 +37,9 @@ import axios from 'axios' const app = createApp(App) app.config.globalProperties.$config = getConfig() +// import vConsole from 'vconsole' +// app.config.globalProperties.$vConsole = new vConsole() + // 获取项目动态全局配置 export const getServerConfig = async (): Promise => { return axios({ diff --git a/src/utils/deviceDetection/index.ts b/src/utils/deviceDetection/index.ts new file mode 100644 index 000000000..637bffd68 --- /dev/null +++ b/src/utils/deviceDetection/index.ts @@ -0,0 +1,25 @@ +interface deviceInter { + match: any +} + +// 检测设备类型(手机返回true,反之) +export const deviceDetection = () => { + let sUserAgent: deviceInter = navigator.userAgent.toLowerCase() + let bIsIpad = sUserAgent.match(/ipad/i) == "ipad" + let bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os" + let bIsMidp = sUserAgent.match(/midp/i) == "midp" + let bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4" + let bIsUc = sUserAgent.match(/ucweb/i) == "ucweb" + let bIsAndroid = sUserAgent.match(/android/i) == "android" + let bIsCE = sUserAgent.match(/windows ce/i) == "windows ce" + let bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile" + return bIsIphoneOs || + bIsMidp || + bIsUc7 || + bIsUc || + bIsAndroid || + bIsCE || + bIsWM + ? true + : false +}; \ No newline at end of file diff --git a/src/views/components/video/index.vue b/src/views/components/video/index.vue index 3fb8d2ae9..aa119d3ed 100644 --- a/src/views/components/video/index.vue +++ b/src/views/components/video/index.vue @@ -6,36 +6,11 @@ import { onMounted } from "vue"; import Player from "xgplayer/dist/simple_player"; import { volume, playbackRate, screenShot } from "xgplayer/dist/controls"; +import { deviceDetection } from "../../../utils/deviceDetection" -export interface deviceInter { - match: any; -} export default { setup() { - // 检测设备类型(手机返回true,反之) - const deviceDetection = () => { - let sUserAgent: deviceInter = navigator.userAgent.toLowerCase(); - let bIsIpad = sUserAgent.match(/ipad/i) == "ipad"; - let bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os"; - let bIsMidp = sUserAgent.match(/midp/i) == "midp"; - let bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4"; - let bIsUc = sUserAgent.match(/ucweb/i) == "ucweb"; - let bIsAndroid = sUserAgent.match(/android/i) == "android"; - let bIsCE = sUserAgent.match(/windows ce/i) == "windows ce"; - let bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile"; - return bIsIphoneOs || - bIsMidp || - bIsUc7 || - bIsUc || - bIsAndroid || - bIsCE || - bIsWM - ? true - : false; - }; - onMounted(() => { - console.log("---", deviceDetection()); let player = new Player({ id: "mse", autoplay: false, diff --git a/vite.config.ts b/vite.config.ts index a3e453270..d1bf459e3 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -59,7 +59,7 @@ export default ({ command }: ConfigEnv): UserConfigExport => { build: { brotliSize: false, // 消除打包大小超过500kb警告 - chunkSizeWarningLimit: 800 + chunkSizeWarningLimit: 2000 } } } \ No newline at end of file