feat:add mobile views

frontend/src/main.ts

@@ -3,7 +3,12 @@ import { createPinia } from "pinia";
 import ElementPlus from "element-plus";
 import "element-plus/dist/index.css";
 import * as ElementPlusIconsVue from "@element-plus/icons-vue";
+import { isMobileDevice } from "@/utils/index";
 import App from "./App.vue";
+import { Lazyload } from "vant";
+import "vant/es/notify/style";
+import "vant/es/dialog/style";
+
 import router from "./router/index";
 
 const app = createApp(App);
@@ -13,7 +18,24 @@ for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
 }
 
 app.use(createPinia());
+app.use(Lazyload);
 app.use(router);
 app.use(ElementPlus);
 
 app.mount("#app");
+
+const setRootFontSize = () => {
+  const isMobile = isMobileDevice();
+  console.log(isMobile);
+  if (!isMobile) {
+    return;
+  } // PC端不干预
+  const clientWidth = document.documentElement.clientWidth;
+  const baseSize = clientWidth / 7.5; // 按750px设计稿
+  document.documentElement.style.fontSize = baseSize + "px";
+};
+
+// 初始化执行
+setRootFontSize();
+// 监听窗口变化
+window.addEventListener("resize", setRootFontSize);