修改自适应

backend/src/stores/index.js

@@ -5,6 +5,8 @@ import { ref, computed, reactive } from 'vue';
 function initState() {
   return {
     isCollapse: false,
+    // 手机端抽屉式侧栏是否展开（仅 ≤768px 生效）
+    mobileAsideOpen: false,
   };
 }
 
@@ -15,11 +17,30 @@ export const useAllDataStore = defineStore('allData', () => {
   function increment() {
     count.value++;
   }
+
+  // 是否为手机端（≤768px），通过 matchMedia 响应式监听
+  const mobileQuery = window.matchMedia('(max-width: 768px)');
+  const isMobile = ref(mobileQuery.matches);
+  const handleMobileQueryChange = (e) => {
+    isMobile.value = e.matches;
+    // 从手机端切回桌面端时，自动收起抽屉侧栏
+    if (!e.matches) {
+      state.mobileAsideOpen = false;
+    }
+  };
+  if (typeof mobileQuery.addEventListener === 'function') {
+    mobileQuery.addEventListener('change', handleMobileQueryChange);
+  } else {
+    // 兼容旧版 Safari
+    mobileQuery.addListener(handleMobileQueryChange);
+  }
+
   return {
     state,
     count,
     doubleCount,
     increment,
+    isMobile,
   };
 });