diff --git a/public/index.html b/public/index.html index d49e9f7..3afc9c0 100644 --- a/public/index.html +++ b/public/index.html @@ -14,4 +14,5 @@
+ diff --git a/src/components/datav/index.vue b/src/components/datav/index.vue index d49dccb..2468309 100644 --- a/src/components/datav/index.vue +++ b/src/components/datav/index.vue @@ -1,7 +1,9 @@ diff --git a/src/components/datav/scrollBoard.vue b/src/components/datav/scrollBoard.vue index 854b43e..6cbda16 100644 --- a/src/components/datav/scrollBoard.vue +++ b/src/components/datav/scrollBoard.vue @@ -26,6 +26,8 @@ export default { } }, created () { + this.config.headerHeight = this.$fontSize(0.50); + this.config.columnWidth = [this.$fontSize(1),this.$fontSize(1.5),this.$fontSize(1)]; this.config.data = JSON.parse(JSON.stringify(this.ScrollList)) } } @@ -35,7 +37,7 @@ export default { #scroll-board { width:25%; box-sizing: border-box; - margin-left: 20px; + margin-left: 0.2rem; height: 100%; overflow: hidden; } @@ -43,10 +45,10 @@ export default { diff --git a/src/main.js b/src/main.js index 9ceff69..c946b63 100644 --- a/src/main.js +++ b/src/main.js @@ -8,7 +8,17 @@ import api from './api' Vue.config.productionTip = false Vue.prototype.$api = api - + function resizeFont() { + const designWidth = 1920; // 设计稿宽度,例如iPhone 6的宽度 + const maxWidth = 1920; // 最大支持宽度 + const screenWidth = Math.min(window.innerWidth, maxWidth); + const scale = screenWidth / designWidth; + document.documentElement.style.fontSize = `${100 * scale}px`; + } + // 初始调用 + resizeFont(); + // 监听窗口大小变化 + window.addEventListener('resize', resizeFont); let fontSize = function(res) { let clientWidth = window.innerWidth ||