| | |
|---|
| | | <script setup> |
|---|
| | | import { ref, onMounted, onBeforeUnmount, nextTick } from 'vue' |
|---|
| | | import autofit from 'autofit.js' |
|---|
| | | import LeftBottom from './components/left-bottom.vue' |
|---|
| | | import CenterCenter from './components/center-center.vue' |
|---|
| | | import RightTop from './components/right-top.vue' |
|---|
| | | import RightBottom from './components/right-bottom.vue' |
|---|
| | |
|---|
| | | |
|---|
| | | // 缩放比例 |
|---|
| | | const scaleRatio = ref(1) |
|---|
| | | // 设计尺寸（基准尺寸）- 根据实际设计稿调整 |
|---|
| | | // 设计规格型号（基准规格型号）- 根据实际设计稿调整 |
|---|
| | | const designWidth = 1920 |
|---|
| | | const designHeight = 1080 |
|---|
| | | |
|---|
| | |
|---|
| | | const container = document.querySelector('.scale-container') |
|---|
| | | if (!container) return |
|---|
| | | |
|---|
| | | // 获取容器的实际尺寸 |
|---|
| | | // 获取容器的实际规格型号 |
|---|
| | | const rect = container.getBoundingClientRect?.() |
|---|
| | | const containerWidth = container.clientWidth || rect?.width || window.innerWidth |
|---|
| | | const containerHeight = container.clientHeight || rect?.height || window.innerHeight |
|---|
| | |
|---|
| | | overflow: hidden; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /* 内部内容区域 - 固定设计尺寸 */ |
|---|
| | | /* 内部内容区域 - 固定设计规格型号 */ |
|---|
| | | .data-dashboard { |
|---|
| | | position: relative; |
|---|
| | | width: 1920px; |
|---|
