From 566280422de0537c4e31496eaaa95a9d51fe9458 Mon Sep 17 00:00:00 2001
From: vben <anncwb@126.com>
Date: 星期四, 27 五月 2021 23:06:41 +0800
Subject: [PATCH] fix(code-editor): fix CodeEditor style problem, fix #655
---
yarn.lock | 140 +++++++---------------------------
package.json | 10 +-
CHANGELOG.zh_CN.md | 6 +
src/components/CodeEditor/src/codemirror/CodeMirror.vue | 2
src/components/CodeEditor/src/codemirror/codemirror.css | 1
src/components/Page/src/PageWrapper.vue | 37 ++++----
src/main.ts | 4
7 files changed, 63 insertions(+), 137 deletions(-)
diff --git a/CHANGELOG.zh_CN.md b/CHANGELOG.zh_CN.md
index f56dc8c..44d373e 100644
--- a/CHANGELOG.zh_CN.md
+++ b/CHANGELOG.zh_CN.md
@@ -1,3 +1,9 @@
+## Wip
+
+### 馃悰 Bug Fixes
+
+- 淇`CodeEditor`鏍峰紡闂
+
## 2.4.0 (2021-05-25)
### 鉁� Features
diff --git a/package.json b/package.json
index a3040f3..6aa5ad9 100644
--- a/package.json
+++ b/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.6",
+ "ant-design-vue": "2.1.2",
"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.1.0-beta.5",
+ "vue": "3.0.11",
"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.1.0-beta.5",
+ "@vue/compiler-sfc": "3.0.11",
"autoprefixer": "^10.2.6",
"commitizen": "^4.2.4",
"conventional-changelog-cli": "^2.1.1",
@@ -120,14 +120,14 @@
"vite-plugin-style-import": "^0.10.1",
"vite-plugin-svg-icons": "^0.6.1",
"vite-plugin-theme": "^0.8.0",
- "vite-plugin-windicss": "0.16.0",
+ "vite-plugin-windicss": "^0.16.5",
"vue-eslint-parser": "^7.6.0",
"vue-tsc": "^0.1.6"
},
"resolutions": {
"//": "Used to install imagemin dependencies, because imagemin may not be installed in China. If it is abroad, you can delete it",
"bin-wrapper": "npm:bin-wrapper-china",
- "rollup": "^2.50.1"
+ "rollup": "^2.50.2"
},
"repository": {
"type": "git",
diff --git a/src/components/CodeEditor/src/codemirror/CodeMirror.vue b/src/components/CodeEditor/src/codemirror/CodeMirror.vue
index 5d50737..e29dd91 100644
--- a/src/components/CodeEditor/src/codemirror/CodeMirror.vue
+++ b/src/components/CodeEditor/src/codemirror/CodeMirror.vue
@@ -1,5 +1,5 @@
<template>
- <div class="relative h-100 !h-full w-full overflow-hidden" ref="el"> </div>
+ <div class="relative !h-full w-full overflow-hidden" ref="el"> </div>
</template>
<script lang="ts">
diff --git a/src/components/CodeEditor/src/codemirror/codemirror.css b/src/components/CodeEditor/src/codemirror/codemirror.css
index aef1483..d919384 100644
--- a/src/components/CodeEditor/src/codemirror/codemirror.css
+++ b/src/components/CodeEditor/src/codemirror/codemirror.css
@@ -338,6 +338,7 @@
.CodeMirror-sizer {
position: relative;
+ margin-bottom: 20px !important;
border-right: 30px solid transparent;
}
diff --git a/src/components/Page/src/PageWrapper.vue b/src/components/Page/src/PageWrapper.vue
index 5ce4f9c..19d3a4f 100644
--- a/src/components/Page/src/PageWrapper.vue
+++ b/src/components/Page/src/PageWrapper.vue
@@ -17,9 +17,11 @@
<slot :name="item" v-bind="data"></slot>
</template>
</PageHeader>
+
<div class="overflow-hidden" :class="getContentClass" :style="getContentStyle">
<slot></slot>
</div>
+
<PageFooter v-if="getShowFooter" ref="footerRef">
<template #left>
<slot name="leftFooter"></slot>
@@ -81,21 +83,19 @@
return Object.keys(omit(slots, 'default', 'leftFooter', 'rightFooter', 'headerContent'));
});
- const getContentStyle = computed(
- (): CSSProperties => {
- const { contentFullHeight, contentStyle, fixedHeight } = props;
- if (!contentFullHeight) {
- return { ...contentStyle };
- }
- const height = `${unref(pageHeight)}px`;
- return {
- ...contentStyle,
- minHeight: height,
- ...(fixedHeight ? { height } : {}),
- paddingBottom: `${unref(footerHeight)}px`,
- };
+ const getContentStyle = computed((): CSSProperties => {
+ const { contentFullHeight, contentStyle, fixedHeight } = props;
+ if (!contentFullHeight) {
+ return { ...contentStyle };
}
- );
+ const height = `${unref(pageHeight)}px`;
+ return {
+ ...contentStyle,
+ minHeight: height,
+ ...(fixedHeight ? { height } : {}),
+ paddingBottom: `${unref(footerHeight)}px`,
+ };
+ });
const getContentClass = computed(() => {
const { contentBackground, contentClass } = props;
@@ -145,14 +145,15 @@
}
// fix:subtract content's marginTop and marginBottom value
let subtractHeight = 0;
- let marginBottom = '0px';
- let marginTop = '0px';
+ const ZERO_PX = '0px';
+ let marginBottom = ZERO_PX;
+ let marginTop = ZERO_PX;
const classElments = document.querySelectorAll(`.${prefixVar}-page-wrapper-content`);
if (classElments && classElments.length > 0) {
const contentEl = classElments[0];
const cssStyle = getComputedStyle(contentEl);
- marginBottom = cssStyle?.marginBottom;
- marginTop = cssStyle?.marginTop;
+ marginBottom = cssStyle?.marginBottom ?? ZERO_PX;
+ marginTop = cssStyle?.marginTop ?? ZERO_PX;
}
if (marginBottom) {
const contentMarginBottom = Number(marginBottom.replace(/[^\d]/g, ''));
diff --git a/src/main.ts b/src/main.ts
index 4dbeb02..5dc38df 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -15,8 +15,8 @@
// Register icon Sprite
import 'virtual:svg-icons-register';
-// Do not introduce` on-demand in local development?
-// In the local development for on-demand introduction, the number of browser requests will increase by about 20%.
+// Do not introduce on-demand in local development?
+// In the local development for introduce on-demand, the number of browser requests will increase by about 20%.
// Which may slow down the browser refresh.
// Therefore, all are introduced in local development, and only introduced on demand in the production environment
if (import.meta.env.DEV) {
diff --git a/yarn.lock b/yarn.lock
index 20d29af..10ea848 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1951,17 +1951,6 @@
estree-walker "^2.0.1"
source-map "^0.6.1"
-"@vue/compiler-core@3.1.0-beta.5":
- version "3.1.0-beta.5"
- resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.1.0-beta.5.tgz#e99427a810d1f1603d58ba5e213f83e2c54688c6"
- integrity sha512-pL6XvPUvZLsGd6wHxZ+KXBEc8oOiKZKCuQ+DGBU2HWSvSP0YrIVA2y1fc/8NP7dFvBq3Eqr79oIPDIQHbmVDIw==
- dependencies:
- "@babel/parser" "^7.12.0"
- "@babel/types" "^7.12.0"
- "@vue/shared" "3.1.0-beta.5"
- 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"
@@ -1970,39 +1959,9 @@
"@vue/compiler-core" "3.0.11"
"@vue/shared" "3.0.11"
-"@vue/compiler-dom@3.1.0-beta.5":
- version "3.1.0-beta.5"
- resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.1.0-beta.5.tgz#c0cccdda578845351c9876f28cc4d68e2e021a61"
- integrity sha512-DZTx4UViFxALOEsCNNb44hClDJEV02JW46G3cdCJwakcLE0o6vppgrazF+7zIOV5qjrN00sAQeCf9EbaLrgY2Q==
- dependencies:
- "@vue/compiler-core" "3.1.0-beta.5"
- "@vue/shared" "3.1.0-beta.5"
-
-"@vue/compiler-sfc@3.1.0-beta.5":
- version "3.1.0-beta.5"
- resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.1.0-beta.5.tgz#2c3c8aa4148ca17d2b46eb6fa36363b84b99ce46"
- integrity sha512-mjozHyFFbMOPRFYD1YqpHGvcncnGkPidud9Q+93E0db4crfXJ8dK7jQhc8HYXcoXaQ7WCz9oeF7AaRrAv9CmBw==
- dependencies:
- "@babel/parser" "^7.13.9"
- "@babel/types" "^7.13.0"
- "@vue/compiler-core" "3.1.0-beta.5"
- "@vue/compiler-dom" "3.1.0-beta.5"
- "@vue/compiler-ssr" "3.1.0-beta.5"
- "@vue/shared" "3.1.0-beta.5"
- 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":
+"@vue/compiler-sfc@3.0.11", "@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"
+ resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.0.11.tgz#cd8ca2154b88967b521f5ad3b10f5f8b6b665679"
integrity sha512-7fNiZuCecRleiyVGUWNa6pn8fB2fnuJU+3AGjbjl7r1P5wBivfl02H4pG+2aJP5gh2u+0wXov1W38tfWOphsXw==
dependencies:
"@babel/parser" "^7.13.9"
@@ -2030,14 +1989,6 @@
"@vue/compiler-dom" "3.0.11"
"@vue/shared" "3.0.11"
-"@vue/compiler-ssr@3.1.0-beta.5":
- version "3.1.0-beta.5"
- resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.1.0-beta.5.tgz#2ec33b389c86329c5ebeb873e4228c28c26a1bf5"
- integrity sha512-MLuBIj1Sd8yfL44HK5Cm36PFFiQIOHj5I32e/DftbKLaxisrHrUulBniMeQa3aQufIqUUXBfFNC09ejIiojEfg==
- dependencies:
- "@vue/compiler-dom" "3.1.0-beta.5"
- "@vue/shared" "3.1.0-beta.5"
-
"@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"
@@ -2055,13 +2006,6 @@
dependencies:
"@vue/shared" "3.0.11"
-"@vue/reactivity@3.1.0-beta.5":
- version "3.1.0-beta.5"
- resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.1.0-beta.5.tgz#c5b279a3d95ab35fa92489f2abc94f613bc6734c"
- integrity sha512-lf+DVxUWZZMgOgt8QN4N91JmpxjkuDu/A3pk3jwwrb6yB4Q759IfmbD2PTKcTqgmQWaSw5CJPjRjyTe1wkWAeg==
- dependencies:
- "@vue/shared" "3.1.0-beta.5"
-
"@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"
@@ -2069,14 +2013,6 @@
dependencies:
"@vue/reactivity" "3.0.11"
"@vue/shared" "3.0.11"
-
-"@vue/runtime-core@3.1.0-beta.5":
- version "3.1.0-beta.5"
- resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.1.0-beta.5.tgz#9da74fb070e7152a4486fb7e477ba9fdfbc8f8c6"
- integrity sha512-YNKmKr0xI5KMplju7XfTPRsK1ePewaiEyKvvsLROQ3609HGkJWeKZlWAPdYb5j2i1ub8v4hM4iZXxQtZmrQGhg==
- dependencies:
- "@vue/reactivity" "3.1.0-beta.5"
- "@vue/shared" "3.1.0-beta.5"
"@vue/runtime-dom@3.0.11":
version "3.0.11"
@@ -2087,24 +2023,10 @@
"@vue/shared" "3.0.11"
csstype "^2.6.8"
-"@vue/runtime-dom@3.1.0-beta.5":
- version "3.1.0-beta.5"
- resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.1.0-beta.5.tgz#e5ebf4f13103198b0bb43b0d2eba699a5a022d1f"
- integrity sha512-eLML5RNn9q/QJo802GRBvNC9W1BABJ8xyvexrruZCZAlKocTq9J0j2vS2IwAl/WbG1X8cY6yPgdQEQ/8eUy0Og==
- dependencies:
- "@vue/runtime-core" "3.1.0-beta.5"
- "@vue/shared" "3.1.0-beta.5"
- 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.5":
- version "3.1.0-beta.5"
- resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.1.0-beta.5.tgz#ef971d6f1c64f89c5918529dcbee67de9de15cfa"
- integrity sha512-jtQGnIERLNZWbj4Uy6uddALlzemqH5YpCQtwIT1e0DbDpEQ+OUMP6j5TCuFWARblv63lT9t/e+nOZcC1iTr6zg==
"@vueuse/core@^4.11.1":
version "4.11.1"
@@ -2121,10 +2043,10 @@
dependencies:
vue-demi "*"
-"@windicss/plugin-utils@0.16.0":
- version "0.16.0"
- resolved "https://registry.yarnpkg.com/@windicss/plugin-utils/-/plugin-utils-0.16.0.tgz#660586b95ed3394b07f9970b2be77f681ea1ecd4"
- integrity sha512-Gu6iHqFnqfxE0J8Oa74+2W5L2052ptqEHBtPaOuXOFgIMTJAT2KoXb6v+/Z0ldHsxVC1q+MSsom877SJ0cL2iA==
+"@windicss/plugin-utils@0.16.5":
+ version "0.16.5"
+ resolved "https://registry.yarnpkg.com/@windicss/plugin-utils/-/plugin-utils-0.16.5.tgz#00e11dd5b5a51c96e494a8fe3aa705e5fb2eb3a0"
+ integrity sha512-APDpVtol2RJLiHaGdn+VaBksaFWFk27LWjc51X1e+mkiPbHcepV+aBXLylNoTrIKzMjtVpsrUHRC+afGMBVgpw==
dependencies:
"@antfu/utils" "^0.1.6"
debug "^4.3.2"
@@ -2132,7 +2054,7 @@
jiti "^1.9.2"
magic-string "^0.25.7"
micromatch "^4.0.4"
- windicss "^3.0.9"
+ windicss "^3.0.12"
"@zxcvbn-ts/core@^0.3.0":
version "0.3.0"
@@ -2261,10 +2183,10 @@
dependencies:
color-convert "^2.0.1"
-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==
+ant-design-vue@2.1.2:
+ version "2.1.2"
+ resolved "https://registry.yarnpkg.com/ant-design-vue/-/ant-design-vue-2.1.2.tgz#2065d7e63199c0c584919458af57b6a0b597f677"
+ integrity sha512-gDG0wauGVt4LE63behrJaIcq4BB+dgs+dpj9jz17IgKr2MPYSEeKetU/x9Kk8d58cGonz4Ulncg7fBZJ7EljsQ==
dependencies:
"@ant-design-vue/use" "^0.0.1-0"
"@ant-design/icons-vue" "^6.0.0"
@@ -2274,7 +2196,7 @@
async-validator "^3.3.0"
dom-align "^1.10.4"
dom-scroll-into-view "^2.0.0"
- lodash "^4.17.21"
+ is-mobile "^2.2.1"
lodash-es "^4.17.15"
moment "^2.27.0"
omit.js "^2.0.0"
@@ -6131,6 +6053,11 @@
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.yarnpkg.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"
resolved "https://registry.npmjs.org/is-module/-/is-module-1.0.0.tgz#3258fb69f78c14d5b815d664336b4cffb6441591"
@@ -8918,10 +8845,10 @@
source-map "^0.7.3"
yargs "^16.2.0"
-rollup@^2.38.5, rollup@^2.43.1, rollup@^2.45.2, rollup@^2.50.1:
- version "2.50.1"
- resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.50.1.tgz#5d52d5c65ade19164d56efec98f16a461c6df38e"
- integrity sha512-3MQhSdGpms4xjYrtR3WNHMT+VrWWM4oqUxUC770MmLo1FWFR2pr/OL81HSPC/ifmiu0uMFk0qPGLmjkSMRIESw==
+rollup@^2.38.5, rollup@^2.43.1, rollup@^2.45.2, rollup@^2.50.2:
+ version "2.50.2"
+ resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.50.2.tgz#640c500c68c698f62efb01857e0ff06fcd18181f"
+ integrity sha512-Ra5JkxSiZPZZFnvE68KWtlrLnZGg5LNaV1n1esq4ch69P7ReeoRVlrTuL/k+L/GJfcowA5An0BEhEq2Hfzwl6w==
optionalDependencies:
fsevents "~2.3.1"
@@ -10694,15 +10621,15 @@
esbuild-plugin-alias "^0.1.2"
tinycolor2 "^1.4.2"
-vite-plugin-windicss@0.16.0:
- version "0.16.0"
- resolved "https://registry.yarnpkg.com/vite-plugin-windicss/-/vite-plugin-windicss-0.16.0.tgz#d3ef9da930cc33aec162b9b760f4d42835eb353c"
- integrity sha512-XaYnPNKsq2yZ5Ph39ZmPvtsTheyVsGSXibTOq/kWCKcXyLxIinTL6xQvLsagjF8QzHpHPF4NbsFvvGtO81gxgA==
+vite-plugin-windicss@^0.16.5:
+ version "0.16.5"
+ resolved "https://registry.yarnpkg.com/vite-plugin-windicss/-/vite-plugin-windicss-0.16.5.tgz#cc94f3a3f3b9a967587db60bc742f6a79988898e"
+ integrity sha512-OevEU9W1mEemyY2kLgOu04MEBr0FZKiNCWe6FZwal5SqteZzr+5K99crQuRRxnB+hhtZ+d+QydKyUnqjuKx8Fw==
dependencies:
- "@windicss/plugin-utils" "0.16.0"
+ "@windicss/plugin-utils" "0.16.5"
chalk "^4.1.1"
debug "^4.3.2"
- windicss "^3.0.9"
+ windicss "^3.0.12"
vite@2.3.3:
version "2.3.3"
@@ -10920,16 +10847,7 @@
dependencies:
is-plain-object "3.0.1"
-vue@3.1.0-beta.5:
- version "3.1.0-beta.5"
- resolved "https://registry.yarnpkg.com/vue/-/vue-3.1.0-beta.5.tgz#6fe228f0b4e20203b4755cb18a958af79a8ac63f"
- integrity sha512-g2tHxOLkXq6OUk5hCEJDgwvmeG00v1301SBsyn9ATCyhvHm8NBl4IOWLoUAmucHXexTVwFokrIXZVDTZlLou0g==
- dependencies:
- "@vue/compiler-dom" "3.1.0-beta.5"
- "@vue/runtime-dom" "3.1.0-beta.5"
- "@vue/shared" "3.1.0-beta.5"
-
-vue@^3.0.0:
+vue@3.0.11, 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==
@@ -11003,7 +10921,7 @@
dependencies:
string-width "^2.1.1"
-windicss@^3.0.9:
+windicss@^3.0.12:
version "3.0.12"
resolved "https://registry.yarnpkg.com/windicss/-/windicss-3.0.12.tgz#4354aaa48faaac6fd02f3119a62587da2c46b018"
integrity sha512-pDxtFLN0xmL7bnGtnEfu9z7B5279UM2EP8wWlPH+FYb5gjHyONxRtyWtR5QIn1FRx6h1UXpm+I19GgTx5Y4TyA==
--
Gitblit v1.8.0