diff --git a/src/assets/css/common.css b/src/assets/css/common.css new file mode 100644 index 0000000..4baf2f8 --- /dev/null +++ b/src/assets/css/common.css @@ -0,0 +1,55 @@ +* { + padding: 0; + margin: 0; + list-style: none; + outline: none; + border: none; + text-decoration: none; + /* color: #8FFDFF; */ +} + +span, +p, +a { + font-size: 14px; +} +em { + font-family: dsFont; + font-size: 32px; + font-size: normal; + font-weight: bold; + color: #8FFDFF; +} + +html::-webkit-scrollbar { + width: 0px; + height: 0px; + overflow: hidden; +} +body { + background: none; + overflow: hidden; + /* width: 1920px; + height: 1080px; */ + display: flex; + position: relative; + flex-direction: column; + box-sizing: border-box; +} +#app { + flex: 1; + /* height: 1080px; */ + box-sizing: border-box; +} + +.content { + flex: 1; +} + +#m { + width: 1920px !important; + height: 1080px !important; + overflow: hidden; + position: absolute; + z-index: 101; +} diff --git a/src/main.js b/src/main.js index 5f255c6..c17ee14 100644 --- a/src/main.js +++ b/src/main.js @@ -5,6 +5,6 @@ import App from './App.vue' import router from "./router"; import ElementPlus from 'element-plus' import 'element-plus/dist/index.css' - +import './assets/css/common.css' createApp(App).use(router).use(ElementPlus).mount('#app') diff --git a/src/view/education.vue b/src/view/education.vue index 6d4ff39..76217bc 100644 --- a/src/view/education.vue +++ b/src/view/education.vue @@ -414,7 +414,6 @@ onBeforeMount(() => { .module { display: flex; width: 100%; - height: calc(100vh - 112px); } .left_bg { diff --git a/src/view/home.vue b/src/view/home.vue index f2bfe7e..130bc6d 100644 --- a/src/view/home.vue +++ b/src/view/home.vue @@ -1,13 +1,11 @@ @@ -18,66 +16,119 @@ import Header from "../components/header.vue"; import { ref, onMounted, onBeforeMount } from "vue"; // 监听缩放 -window.addEventListener("resize", () => - setTimeout(function () { - //监测分辨率发生改变就对页面进行刷新,可以改变zoom的值 - location.reload(); - // bodyScale(); - }, 10) -); +// window.addEventListener("resize", () => +// setTimeout(function () { +// //监测分辨率发生改变就对页面进行刷新,可以改变zoom的值 +// location.reload(); +// // bodyScale(); +// }, 10) +// ); -const insertCss = (select, styles) => { - console.log(styles); - if (document.styleSheets.length === 0) { - //如果没有style标签,则创建一个style标签 - var style = document.createElement("style"); - document.head.appendChild(style); - } - var styleSheet = document.styleSheets[document.styleSheets.length - 1]; //如果有style 标签.则插入到最后一个style标签中 - var str = select + " {"; //插入的内容必须是字符串,所以得把obj转化为字符串 - for (var prop in styles) { - str += - prop.replace(/([A-Z])/g, function (item) { - //使用正则把大写字母替换成 '-小写字母' - return "-" + item.toLowerCase(); - }) + - ":" + - styles[prop] + - ";"; - } - str += "}"; - styleSheet.insertRule(str, styleSheet.cssRules.length); //插入样式到最后一个style标签中的最后面 +// const insertCss = (select, styles) => { +// console.log(styles); +// if (document.styleSheets.length === 0) { +// //如果没有style标签,则创建一个style标签 +// var style = document.createElement("style"); +// document.head.appendChild(style); +// } +// var styleSheet = document.styleSheets[document.styleSheets.length - 1]; //如果有style 标签.则插入到最后一个style标签中 +// var str = select + " {"; //插入的内容必须是字符串,所以得把obj转化为字符串 +// for (var prop in styles) { +// str += +// prop.replace(/([A-Z])/g, function (item) { +// //使用正则把大写字母替换成 '-小写字母' +// return "-" + item.toLowerCase(); +// }) + +// ":" + +// styles[prop] + +// ";"; +// } +// str += "}"; +// styleSheet.insertRule(str, styleSheet.cssRules.length); //插入样式到最后一个style标签中的最后面 +// }; + +// onBeforeMount(() => { +// let zoom = document.body.clientWidth / 1920; +// document.getElementsByTagName("body")[0].style.setProperty("--zoom", zoom); +// //解决zoom放大缩小导致echarts位置偏移问题 +// let strScale = `scale(${zoom})`; +// var obj = { +// zoom: 1 / zoom, +// transform: strScale, +// transformOrigin: "0 0", +// }; +// insertCss("canvas", obj); +// }); + +const reset_font = () => { + let width = document.documentElement.clientWidth || document.body.clientWidth; + let height = + document.documentElement.clientHeight || document.body.clientHeight; + document.querySelector("#m").style.transformOrigin = "top left"; + document.querySelector("#m").style.transform = + "scale(" + width / 1920 + "," + height / 1080 + ")"; }; - -onBeforeMount(() => { - let zoom = document.body.clientWidth / 1920; - document.getElementsByTagName("body")[0].style.setProperty("--zoom", zoom); - //解决zoom放大缩小导致echarts位置偏移问题 - let strScale = `scale(${zoom})`; - var obj = { - zoom: 1 / zoom, - transform: strScale, - transformOrigin: "0 0", - }; - insertCss("canvas", obj); +onMounted(() => { + reset_font(); + reset_font(); +}); +window.addEventListener("resize", function () { + reset_font(); + reset_font(); }); diff --git a/src/view/hygiene.vue b/src/view/hygiene.vue index 65971b5..01970eb 100644 --- a/src/view/hygiene.vue +++ b/src/view/hygiene.vue @@ -139,7 +139,6 @@ const change = (name, index) => { .module { display: flex; width: 100%; - height: calc(100vh - 112px); } .yd_title { diff --git a/src/view/yl.vue b/src/view/yl.vue index 4ef30ce..42248dd 100644 --- a/src/view/yl.vue +++ b/src/view/yl.vue @@ -216,7 +216,6 @@ const change = (name, index) => { .module { display: flex; width: 100%; - height: calc(100vh - 112px); } .yd_title {