Просмотр исходного кода

[Pref 0000] 优化自适应容器配置规则

houzekong 1 месяц назад
Родитель
Сommit
79b13c5cfa
2 измененных файлов с 15 добавлено и 15 удалено
  1. 4 15
      src/components/Container/src/AdaptiveContainer.vue
  2. 11 0
      src/settings/designSetting.ts

+ 4 - 15
src/components/Container/src/AdaptiveContainer.vue

@@ -10,6 +10,7 @@
   import { debounce } from 'lodash-es';
   import { useAppStore } from '/@/store/modules/app';
   import { computed } from 'vue';
+  import { ADAPTIVE_CONTIANER_CONFIG } from '/@/settings/designSetting';
 
   // 类型定义
   interface AdaptiveOptions {
@@ -42,22 +43,10 @@
       const containerRef = ref<HTMLElement | null>(null);
       // const isReady = ref(false);
 
-      // 默认配置
-      const defaultOptions = ref<Required<AdaptiveOptions>>({
-        width: 1920,
-        height: 948,
-        baseWidth: 1920,
-        minScale: 0.5,
-        maxScale: 2,
-        debounceTime: 100,
-        ratio: 16 / 9,
-        tolerance: 0.1,
-      });
-
       // 合并配置
       const config = computed(() => {
         return {
-          ...defaultOptions.value,
+          ...ADAPTIVE_CONTIANER_CONFIG,
           ...props.options,
         };
       });
@@ -159,8 +148,8 @@
           const normalRatio = Math.abs(ratio - container.clientWidth / container.clientHeight) < ratio * tolerance;
           // const container = document.getElementById('app')!;
           if (normalRatio) {
-            defaultOptions.value.width = container.clientWidth;
-            defaultOptions.value.height = container.clientHeight;
+            ADAPTIVE_CONTIANER_CONFIG.width = container.clientWidth;
+            ADAPTIVE_CONTIANER_CONFIG.height = container.clientHeight;
           }
 
           const { width, height } = designSize.value;

+ 11 - 0
src/settings/designSetting.ts

@@ -70,3 +70,14 @@ export const SIDER_LOGO_BG_COLOR_LIST: string[] = [
   'linear-gradient(180deg, #e83723, #e52611)',
   'linear-gradient(180deg, #383f45, #3b434b)',
 ];
+
+export const ADAPTIVE_CONTIANER_CONFIG = {
+  width: 1920,
+  height: 948,
+  baseWidth: 1920,
+  minScale: 0.5,
+  maxScale: 2,
+  debounceTime: 100,
+  ratio: 16 / 9,
+  tolerance: 0.1,
+};