From e99583b0212ba073106979cca779396364934453 Mon Sep 17 00:00:00 2001
From: wangfei <3597712270@qq.com>
Date: 星期三, 16 四月 2025 10:31:07 +0800
Subject: [PATCH] 中空一线、二线、三线缺片详情,整体前端页面适配、消除滚动条
---
UI-Project/src/utils/evicePixelRatio.js | 92 ++++++++++++++++++++++------------------------
1 files changed, 44 insertions(+), 48 deletions(-)
diff --git a/UI-Project/src/utils/evicePixelRatio.js b/UI-Project/src/utils/evicePixelRatio.js
index 6c29f41..66c63de 100644
--- a/UI-Project/src/utils/evicePixelRatio.js
+++ b/UI-Project/src/utils/evicePixelRatio.js
@@ -1,57 +1,53 @@
-/**
- * @description 鏍℃windows椤甸潰鍦ㄧ郴缁熻繘琛岀缉鏀惧悗瀵艰嚧椤甸潰琚斁澶х殑闂锛岄�氬父鏀惧ぇ姣斾緥鏄�125%銆�150%
- * **/
-
class DevicePixelRatio {
constructor() {
+ this.bodyElement = document.getElementsByTagName('body')[0]; // 缂撳瓨 body 鍏冪礌
}
-
- //鑾峰彇绯荤粺绫诲瀷
- _getSystem() {
- let flag = false;
- var agent = navigator.userAgent.toLowerCase();
- if (agent.indexOf("windows") >= 0) {
- return true;
- }
+
+ // 鍒ゆ柇鏄惁涓� Windows 绯荤粺
+ isWindowsSystem() {
+ const agent = navigator.userAgent.toLowerCase();
+ return agent.indexOf("windows") >= 0;
}
-
- //鑾峰彇椤甸潰缂╂斁姣斾緥
- _addHandler(element, type, handler) {
- if (element.addEventListener) {
- element.addEventListener(type, handler, false);
- } else if (element.attachEvent) {
- element.attachEvent("on" + type, handler);
- } else {
- element["on" + type] = handler;
- }
+
+ // 閫氱敤浜嬩欢缁戝畾宸ュ叿
+ addHandler(element, type, handler) {
+ if (element.addEventListener) {
+ element.addEventListener(type, handler, false);
+ } else if (element.attachEvent) {
+ element.attachEvent("on" + type, handler);
+ } else {
+ element["on" + type] = handler;
+ }
}
-
- //鏍℃娴忚鍣ㄧ缉鏀炬瘮渚�
- _correct() {
- let t = this;
- //椤甸潰devicePixelRatio锛堣澶囧儚绱犳瘮渚嬶級鍙樺寲鍚庯紝璁$畻椤甸潰body鏍囩zoom淇敼鍏跺ぇ灏忥紝鏉ユ姷娑坉evicePixelRatio甯︽潵鐨勫彉鍖栥��
- document.getElementsByTagName('body')[0].style.zoom = 1 / window.devicePixelRatio;
+
+ // 鏍℃娴忚鍣ㄧ缉鏀炬瘮渚�
+ correctZoom() {
+ if (this.bodyElement) {
+ // 浣跨敤 1 / window.devicePixelRatio 鏉ヨ皟鏁� zoom
+ this.bodyElement.style.zoom = 1 / window.devicePixelRatio;
+ }
}
-
- //鐩戝惉椤甸潰缂╂斁
- _watch() {
- let t = this;
- t._addHandler(window, 'resize', function () { //娉ㄦ剰杩欎釜鏂规硶鏄В鍐冲叏灞�鏈変袱涓獁indow.resize
- //閲嶆柊鏍℃
- t._correct()
- })
+
+ // 鐩戝惉椤甸潰缂╂斁锛堜娇鐢ㄩ槻鎶栦紭鍖栵級
+ watchResize() {
+ let timer = null;
+ this.addHandler(window, 'resize', () => {
+ if (timer) clearTimeout(timer);
+ timer = setTimeout(() => {
+ this.correctZoom();
+ }, 200); // 寤惰繜 200ms 鎵ц锛岄伩鍏嶉绻佽Е鍙�
+ });
}
-
- //鍒濆鍖栭〉闈㈡瘮渚�
+
+ // 鍒濆鍖栭〉闈㈡瘮渚嬫牎姝�
init() {
- let t = this;
- if (t._getSystem()) { //鍒ゆ柇璁惧锛岀洰鍓嶅彧鍦╳indows绯荤粺涓嬫牎姝f祻瑙堝櫒缂╂斁姣斾緥
- //鍒濆鍖栭〉闈㈡牎姝f祻瑙堝櫒缂╂斁姣斾緥
- t._correct();
- //寮�鍚洃鍚〉闈㈢缉鏀�
- t._watch();
- }
+ if (this.isWindowsSystem()) {
+ // 鍒濆鍖栨牎姝�
+ this.correctZoom();
+ // 寮�鍚洃鍚�
+ this.watchResize();
+ }
}
-}
-
-export default DevicePixelRatio;
+ }
+
+ export default DevicePixelRatio;
\ No newline at end of file
--
Gitblit v1.8.0