64 lines
1.7 KiB
Vue
64 lines
1.7 KiB
Vue
<template>
|
||
<div class="app-container">
|
||
<router-view />
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { onMounted, onUnmounted } from "vue"
|
||
const disableZoom = () => {
|
||
// 强制重置浏览器缩放为 100%
|
||
const resetZoom = () => {
|
||
document.body.style.zoom = "100%"
|
||
if (window.devicePixelRatio !== 1) {
|
||
const viewportMeta = document.querySelector('meta[name="viewport"]')
|
||
if (viewportMeta) {
|
||
viewportMeta.content =
|
||
"width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
|
||
}
|
||
}
|
||
}
|
||
// 禁用快捷键(Ctrl/Cmd + +/-/0 和 滚轮)
|
||
const keysToBlock = new Set(["+", "-", "=", "0"])
|
||
const codesToBlock = new Set(["Equal", "Minus", "NumpadAdd", "NumpadSubtract", "Digit0"])
|
||
const handleKeyDown = (e) => {
|
||
if ((e.ctrlKey || e.metaKey) && (keysToBlock.has(e.key) || codesToBlock.has(e.code))) {
|
||
e.preventDefault()
|
||
}
|
||
}
|
||
const handleWheel = (e) => {
|
||
if (e.ctrlKey) {
|
||
e.preventDefault()
|
||
}
|
||
}
|
||
|
||
// 初始化
|
||
resetZoom()
|
||
document.addEventListener("keydown", handleKeyDown)
|
||
document.addEventListener("wheel", handleWheel, { passive: false })
|
||
|
||
// 可选,用于组件卸载时移除监听
|
||
return () => {
|
||
document.removeEventListener("keydown", handleKeyDown)
|
||
document.removeEventListener("wheel", handleWheel)
|
||
}
|
||
}
|
||
|
||
onMounted(() => {
|
||
// const cleanup = disableZoom()
|
||
// onUnmounted(() => cleanup())
|
||
})
|
||
</script>
|
||
|
||
<style scoped lang="less">
|
||
.app-container {
|
||
width: 100vw;
|
||
height: 111vh;
|
||
background-image: url("@/assets/images/bci.png");
|
||
background-size: cover;
|
||
background-repeat: no-repeat;
|
||
background-position: center;
|
||
background-color: #02131f;
|
||
}
|
||
</style>
|