fix(layout): fix style compatibility issues

vben

2021-05-26 905e5b714b582548f32feca723012124343686a6

fix(layout): fix style compatibility issues

 package.json

@@ -37,7 +37,7 @@
    "@logicflow/extension": "^0.4.8",
    "@vueuse/core": "^4.11.1",
    "@zxcvbn-ts/core": "^0.3.0",
    "ant-design-vue": "2.1.2",
    "ant-design-vue": "2.1.6",
    "axios": "^0.21.1",
    "codemirror": "^5.61.1",
    "cropperjs": "^1.5.11",
@@ -53,7 +53,7 @@
    "sortablejs": "^1.13.0",
    "tinymce": "^5.8.1",
    "vditor": "^3.8.5",
    "vue": "3.0.11",
    "vue": "3.1.0-beta.4",
    "vue-i18n": "9.1.6",
    "vue-json-pretty": "^2.0.2",
    "vue-router": "^4.0.8",
@@ -80,7 +80,7 @@
    "@vitejs/plugin-legacy": "^1.4.0",
    "@vitejs/plugin-vue": "^1.2.2",
    "@vitejs/plugin-vue-jsx": "^1.1.4",
    "@vue/compiler-sfc": "3.0.11",
    "@vue/compiler-sfc": "3.1.0-beta.4",
    "autoprefixer": "^10.2.5",
    "commitizen": "^4.2.4",
    "conventional-changelog-cli": "^2.1.1",

 src/layouts/default/index.vue

@@ -2,7 +2,7 @@
  <Layout :class="prefixCls" v-bind="lockEvents">
    <LayoutFeatures />
    <LayoutHeader fixed v-if="getShowFullHeaderRef" />
    <Layout :class="layoutClass">
    <Layout :class="[layoutClass]">
      <LayoutSideBar v-if="getShowSidebar || getIsMobile" />
      <Layout :class="`${prefixCls}-main`">
        <LayoutMultipleHeader />
@@ -45,12 +45,18 @@
      const { prefixCls } = useDesign('default-layout');
      const { getIsMobile } = useAppInject();
      const { getShowFullHeaderRef } = useHeaderSetting();
      const { getShowSidebar, getIsMixSidebar } = useMenuSetting();
      const { getShowSidebar, getIsMixSidebar, getIsSidebarType } = useMenuSetting();

      // Create a lock screen monitor
      const lockEvents = useLockPage();

      const layoutClass = computed(() => ({ 'ant-layout-has-sider': unref(getIsMixSidebar) }));
      const layoutClass = computed(() => {
        let cls: string[] = ['ant-layout'];
        if (unref(getIsMixSidebar) || unref(getIsSidebarType)) {
          cls.push('ant-layout-has-sider');
        }
        return cls;
      });

      return {
        getShowFullHeaderRef,
@@ -79,6 +85,7 @@
    }

    &-main {
      width: 100%;
      margin-left: 1px;
    }
  }

 yarn.lock

@@ -1946,6 +1946,17 @@
    estree-walker "^2.0.1"
    source-map "^0.6.1"

"@vue/compiler-core@3.1.0-beta.4":
  version "3.1.0-beta.4"
  resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.1.0-beta.4.tgz#ed8b7dd3d2a42688283875de13c500099fe5d612"
  integrity sha512-ukGe7aVKkzD3lDAGeiCPJutY0+FH0JEVglVRY9pm3oAYkX3gdOfrfUCZKx2Vm0IGHci7oyfnIigT3yVTEvcBRg==
  dependencies:
    "@babel/parser" "^7.12.0"
    "@babel/types" "^7.12.0"
    "@vue/shared" "3.1.0-beta.4"
    estree-walker "^2.0.1"
    source-map "^0.6.1"

"@vue/compiler-dom@3.0.11", "@vue/compiler-dom@^3.0.11":
  version "3.0.11"
  resolved "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.0.11.tgz#b15fc1c909371fd671746020ba55b5dab4a730ee"
@@ -1954,7 +1965,37 @@
    "@vue/compiler-core" "3.0.11"
    "@vue/shared" "3.0.11"

"@vue/compiler-sfc@3.0.11", "@vue/compiler-sfc@^3.0.11":
"@vue/compiler-dom@3.1.0-beta.4":
  version "3.1.0-beta.4"
  resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.1.0-beta.4.tgz#2d56d21bf39bc8e57278ecc3abb4c36f971c94d1"
  integrity sha512-D6s1WkunFOANb8gu3F9MhTsF0R0PwxrQAgswY9v0yTKur44vyv0mwaEgQCw0FIwnPNmL15wh5ahtItDvmfkbzQ==
  dependencies:
    "@vue/compiler-core" "3.1.0-beta.4"
    "@vue/shared" "3.1.0-beta.4"

"@vue/compiler-sfc@3.1.0-beta.4":
  version "3.1.0-beta.4"
  resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.1.0-beta.4.tgz#fb4e1b3cee19a34428c9e52c64df3b81ffda6687"
  integrity sha512-G89oMfxPN33d2g1LXxpLIWi7e3wLCh0/w3dV1HWswq3+5YWCW4ITVc/nArPKKT+B9h0CTJ8WSRkBDsbe4AHDTQ==
  dependencies:
    "@babel/parser" "^7.13.9"
    "@babel/types" "^7.13.0"
    "@vue/compiler-core" "3.1.0-beta.4"
    "@vue/compiler-dom" "3.1.0-beta.4"
    "@vue/compiler-ssr" "3.1.0-beta.4"
    "@vue/shared" "3.1.0-beta.4"
    consolidate "^0.16.0"
    estree-walker "^2.0.1"
    hash-sum "^2.0.0"
    lru-cache "^5.1.1"
    magic-string "^0.25.7"
    merge-source-map "^1.1.0"
    postcss "^8.1.10"
    postcss-modules "^4.0.0"
    postcss-selector-parser "^6.0.4"
    source-map "^0.6.1"

"@vue/compiler-sfc@^3.0.11":
  version "3.0.11"
  resolved "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.0.11.tgz#cd8ca2154b88967b521f5ad3b10f5f8b6b665679"
  integrity sha512-7fNiZuCecRleiyVGUWNa6pn8fB2fnuJU+3AGjbjl7r1P5wBivfl02H4pG+2aJP5gh2u+0wXov1W38tfWOphsXw==
@@ -1984,6 +2025,14 @@
    "@vue/compiler-dom" "3.0.11"
    "@vue/shared" "3.0.11"

"@vue/compiler-ssr@3.1.0-beta.4":
  version "3.1.0-beta.4"
  resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.1.0-beta.4.tgz#9d49a8c7bd047ac446db899b80b3345c5f1e154d"
  integrity sha512-yvE0tee9AjElRKOLS2U4wmYHoxYRfsI+XK/QPEv1gg56M7+CGCK2+Bjwt4nNsCy4Wd0QuD75frCVLIaeOzzn9w==
  dependencies:
    "@vue/compiler-dom" "3.1.0-beta.4"
    "@vue/shared" "3.1.0-beta.4"

"@vue/devtools-api@^6.0.0-beta.10":
  version "6.0.0-beta.10"
  resolved "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.0.0-beta.10.tgz#f39da7618cee292e39c7274227c34163e30eb3ca"
@@ -2001,6 +2050,13 @@
  dependencies:
    "@vue/shared" "3.0.11"

"@vue/reactivity@3.1.0-beta.4":
  version "3.1.0-beta.4"
  resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.1.0-beta.4.tgz#7ef9eb60a05da9662fbdb004ed47c8aaf657e8d3"
  integrity sha512-TfvJ897j4KfTX4g0nKntYTPTijD2eJqVbWIQIQCV6xqTAhqTl+4tsu6RRzPA7Ynh8mv9td7OJoaQYZ3zxM4siA==
  dependencies:
    "@vue/shared" "3.1.0-beta.4"

"@vue/runtime-core@3.0.11":
  version "3.0.11"
  resolved "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.0.11.tgz#c52dfc6acf3215493623552c1c2919080c562e44"
@@ -2008,6 +2064,14 @@
  dependencies:
    "@vue/reactivity" "3.0.11"
    "@vue/shared" "3.0.11"

"@vue/runtime-core@3.1.0-beta.4":
  version "3.1.0-beta.4"
  resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.1.0-beta.4.tgz#3c41b38d8518a6778d93541c3760d4264c971fca"
  integrity sha512-hsB+s5/JyFxYB56MHHq/XowB8jj8n5cYB9wqon2cMylC/HSxgvSMdehNbky6X5s8vAQ8HYCSjqzn94MlOP5USA==
  dependencies:
    "@vue/reactivity" "3.1.0-beta.4"
    "@vue/shared" "3.1.0-beta.4"

"@vue/runtime-dom@3.0.11":
  version "3.0.11"
@@ -2018,10 +2082,24 @@
    "@vue/shared" "3.0.11"
    csstype "^2.6.8"

"@vue/runtime-dom@3.1.0-beta.4":
  version "3.1.0-beta.4"
  resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.1.0-beta.4.tgz#72f63309defa7b7b19af5c2118c8e9fdf4b44adb"
  integrity sha512-jg7Bn6aLoUZ5ACobEQYZovexgXKKhh95vudsyTSIZoq5m/tKRTCQg/UbzkWlE1P9UrRigQsF2sbhoxa0COktSg==
  dependencies:
    "@vue/runtime-core" "3.1.0-beta.4"
    "@vue/shared" "3.1.0-beta.4"
    csstype "^2.6.8"

"@vue/shared@3.0.11", "@vue/shared@^3.0.11":
  version "3.0.11"
  resolved "https://registry.npmjs.org/@vue/shared/-/shared-3.0.11.tgz#20d22dd0da7d358bb21c17f9bde8628152642c77"
  integrity sha512-b+zB8A2so8eCE0JsxjL24J7vdGl8rzPQ09hZNhystm+KqSbKcAej1A+Hbva1rCMmTTqA+hFnUSDc5kouEo0JzA==

"@vue/shared@3.1.0-beta.4":
  version "3.1.0-beta.4"
  resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.1.0-beta.4.tgz#eb7038506cfc0a0a89fa2a46b40186df17adf58c"
  integrity sha512-W2vWLh8XEK1xOkzBQdqDNng324hbWe3LEebHaHBM2o3vIPp5zCO/P8LCfTGpLaFU2ISy2NhAUk44VZBswFAKEQ==

"@vueuse/core@^4.11.1":
  version "4.11.1"
@@ -2178,10 +2256,10 @@
  dependencies:
    color-convert "^2.0.1"

ant-design-vue@2.1.2:
  version "2.1.2"
  resolved "https://registry.npmjs.com/ant-design-vue/-/ant-design-vue-2.1.2.tgz#2065d7e63199c0c584919458af57b6a0b597f677"
  integrity sha512-gDG0wauGVt4LE63behrJaIcq4BB+dgs+dpj9jz17IgKr2MPYSEeKetU/x9Kk8d58cGonz4Ulncg7fBZJ7EljsQ==
ant-design-vue@2.1.6:
  version "2.1.6"
  resolved "https://registry.yarnpkg.com/ant-design-vue/-/ant-design-vue-2.1.6.tgz#c51cdc858e1b1b8b569f5435eb487f53a3f1745e"
  integrity sha512-qICxb6Y4f7QuSuh/jbLhZA9SkUBnP9xYfy/E6yD7+1fg04aAzmRK8oLv8ETuGTrROVdSVeic9v/NS2BXEuuARg==
  dependencies:
    "@ant-design-vue/use" "^0.0.1-0"
    "@ant-design/icons-vue" "^6.0.0"
@@ -2191,7 +2269,7 @@
    async-validator "^3.3.0"
    dom-align "^1.10.4"
    dom-scroll-into-view "^2.0.0"
    is-mobile "^2.2.1"
    lodash "^4.17.21"
    lodash-es "^4.17.15"
    moment "^2.27.0"
    omit.js "^2.0.0"
@@ -6026,11 +6104,6 @@
  version "2.0.0"
  resolved "https://registry.npmjs.org/is-jpg/-/is-jpg-2.0.0.tgz#2e1997fa6e9166eaac0242daae443403e4ef1d97"
  integrity sha1-LhmX+m6RZuqsAkLarkQ0A+TvHZc=

is-mobile@^2.2.1:
  version "2.2.2"
  resolved "https://registry.npmjs.com/is-mobile/-/is-mobile-2.2.2.tgz#f6c9c5d50ee01254ce05e739bdd835f1ed4e9954"
  integrity sha512-wW/SXnYJkTjs++tVK5b6kVITZpAZPtUrt9SF80vvxGiF/Oywal+COk1jlRkiVq15RFNEQKQY31TkV24/1T5cVg==

is-module@^1.0.0:
  version "1.0.0"
@@ -10816,7 +10889,16 @@
  dependencies:
    is-plain-object "3.0.1"

vue@3.0.11, vue@^3.0.0:
vue@3.1.0-beta.4:
  version "3.1.0-beta.4"
  resolved "https://registry.yarnpkg.com/vue/-/vue-3.1.0-beta.4.tgz#c17c14f60a9267c5f33d9fa4dbc9bc54605d5ae2"
  integrity sha512-HzJnk1iaWGcExAaAIO2yVMMhxHX6wSLcKF3/PwF2NZMlMpUf7ZQSFHVfzIyJqaQ96K1KJOlDPbpqKYLpRq947w==
  dependencies:
    "@vue/compiler-dom" "3.1.0-beta.4"
    "@vue/runtime-dom" "3.1.0-beta.4"
    "@vue/shared" "3.1.0-beta.4"

vue@^3.0.0:
  version "3.0.11"
  resolved "https://registry.npmjs.org/vue/-/vue-3.0.11.tgz#c82f9594cbf4dcc869241d4c8dd3e08d9a8f4b5f"
  integrity sha512-3/eUi4InQz8MPzruHYSTQPxtM3LdZ1/S/BvaU021zBnZi0laRUyH6pfuE4wtUeLvI8wmUNwj5wrZFvbHUXL9dw==