new-school-iot-admin/docs/PC端适配约定.md

PC 端适配约定

结论

本项目只做 PC 端，不兼容手机、平板等移动设备。

• 设计稿基准宽度：1920px（样式统一按 1920 写 px，由 postcss-px-to-viewport-8-plugin 转 vw 自适应）
• 最小可用宽度：1280px（再窄不做保证，也不做降级布局）
• 移动端浏览器、微信内置浏览器等不在支持范围内

已移除的移动端适配（2026-10-29）

位置	移除内容
src/layouts/index.vue	不再按设备切换布局（原 isLeft || isMobile），只按布局配置走 LeftMode / TopMode / LeftTopMode
src/layouts/modes/LeftMode.vue	删除 .mobile 抽屉样式（translate3d 侧滑）、drawer-bg 遮罩层及点击关闭逻辑，同时去掉 .open-sidebar 类名
src/layouts/components/NavigationBar	删除汉堡按钮的 isMobile 分支；面包屑固定 v-if="!isTop"
src/common/components/SearchMenu	删除移动端 80vw 弹窗宽度与键盘提示的 isMobile 判断（固定 40vw，提示常显）
src/common/composables/useDevice.ts	整个文件已删除（设备判断已无调用方）
src/layouts/composables/useResize.ts	整个文件已删除（原本只用于监听窗口宽度切换设备、自动收起侧栏），目录随之移除
src/layouts/components/Hamburger/index.vue	组件及 components/index.ts 中的导出已删除
src/pinia/stores/app.ts	移除 device / toggleDevice，store 只保留侧边栏相关状态
src/common/constants/app-key.ts	移除 DeviceEnum

2026-10-29 已按上述清单清理完成，如需恢复手机端适配只能从版本历史找回。

新增代码要求

1. 不要引入 useDevice() / isMobile / device 等设备判断逻辑。
2. 不要写移动端断点（@media (max-width: ...)）；需要适配不同桌面宽度时用 px→vw 自动缩放，或弹性布局（flex / min-width / overflow）。
3. 侧边栏、页签、表格等布局默认按「始终有鼠标、宽度 ≥1280」设计，不考虑触摸手势。
4. 弹窗宽度用固定值或 vw，不要按设备切换。

侧边栏收起/展开

• 按钮固定在侧边栏右边缘、垂直居中（position: absolute; top: 50%; right: -11px），不随菜单滚动。
• 图标：展开态 ArrowLeft（收起），收起态 ArrowRight（展开）。
• 侧边栏容器需 overflow: visible，否则按钮会被裁掉。