1
lzhe
2024-09-26 7d59e8e2c727dd49d9552a8febc2af47c5b95a69
src/App.vue
@@ -1,3 +1,9 @@
<!--
 * @Date: 2024-03-23 09:49:06
 * @LastEditors: gaoshp
 * @LastEditTime: 2024-03-26 21:41:35
 * @FilePath: /cps-web/src/App.vue
-->
<template>
   <el-config-provider :locale="locale" :size="config.size" :zIndex="config.zIndex" :button="config.button">
      <router-view></router-view>
@@ -5,42 +11,63 @@
</template>
<script>
   import colorTool from '@/utils/color'
import colorTool from '@/utils/color'
   export default {
      name: 'App',
      data() {
         return {
            config: {
               size: "default",
               zIndex: 2000,
               button: {
                  autoInsertSpace: false
               }
            }
         }
      },
      computed: {
         locale(){
            return this.$i18n.messages[this.$i18n.locale].el
         },
      },
      created() {
         //设置主题颜色
         const app_color = this.$CONFIG.COLOR || this.$TOOL.data.get('APP_COLOR')
         if(app_color){
            document.documentElement.style.setProperty('--el-color-primary', app_color);
            for (let i = 1; i <= 9; i++) {
               document.documentElement.style.setProperty(`--el-color-primary-light-${i}`, colorTool.lighten(app_color,i/10));
            }
            for (let i = 1; i <= 9; i++) {
               document.documentElement.style.setProperty(`--el-color-primary-dark-${i}`, colorTool.darken(app_color,i/10));
export default {
   name: 'App',
   data() {
      return {
         config: {
            size: "default",
            zIndex: 2000,
            button: {
               autoInsertSpace: false
            }
         }
      }
   },
   computed: {
      locale() {
         return this.$i18n.messages[this.$i18n.locale].el
      },
   },
   created() {
      //设置主题颜色
      const app_color = this.$CONFIG.COLOR || this.$TOOL.data.get('APP_COLOR')
      if (app_color) {
         document.documentElement.style.setProperty('--el-color-primary', app_color);
         for (let i = 1; i <= 9; i++) {
            document.documentElement.style.setProperty(`--el-color-primary-light-${i}`, colorTool.lighten(app_color, i / 10));
         }
         for (let i = 1; i <= 9; i++) {
            document.documentElement.style.setProperty(`--el-color-primary-dark-${i}`, colorTool.darken(app_color, i / 10));
         }
      }
   },
   mounted() {
      const debounce = (fn, delay) => {
         let timer
         return (...args) => {
            if (timer) {
               clearTimeout(timer)
            }
            timer = setTimeout(() => {
               fn(...args)
            }, delay)
         }
      }
      const _ResizeObserver = window.ResizeObserver;
      window.ResizeObserver = class ResizeObserver extends _ResizeObserver {
         constructor(callback) {
            callback = debounce(callback, 200);
            super(callback);
         }
      }
   }
}
</script>
<style lang="scss">
   @import '@/style/style.scss';
@import '@/style/style.scss';
</style>