fix(测试跟踪): MD控件图片预览显示异常

--bug=1017054 --user=宋昌昌 【测试跟踪】预览备注中图片显示异常 https://www.tapd.cn/55049933/s/1248773
This commit is contained in:
song-cc-rock 2022-09-21 15:20:55 +08:00 committed by f2c-ci-robot[bot]
parent 31368b494e
commit 7e6b310729
3 changed files with 51 additions and 3 deletions

View File

@ -1,7 +1,7 @@
<template>
<mavon-editor :id="id" :editable="!disabled" @imgAdd="imgAdd" :default-open="defaultOpenValue"
:xss-options="xssOptions" :style="{'min-height': customMinHeight + 'px', 'min-width': '100px'}"
@change="change"
@change="change" :image-click="imageClick"
:subfield="false" :toolbars="toolbars" :language="language" :toolbarsFlag="!disabled"
@imgDel="imgDel" v-model="data[prop]" ref="md"/>
</template>
@ -207,6 +207,46 @@ export default {
this.$nextTick(() => {
this.$emit('change');
});
},
imageClick(e) {
// 使el-image, action, mavon-editor
// img
let url = e.src;
let imgTag = document.createElement("img");
imgTag.src = url;
imgTag.classList.add("el-image-viewer__img");
imgTag.style.transformStyle = "scale(1) rotate(0deg)";
imgTag.style.marginLeft = "0px";
imgTag.style.marginTop = "0px";
imgTag.style.maxHeight = "100%";
imgTag.style.maxWidth = "100%";
// el-image-viewer__canvasdiv
let canvas = document.createElement("div");
canvas.classList.add("el-image-viewer__canvas");
canvas.appendChild(imgTag);
//
// canvas.addEventListener("click", function () {
// wrap.remove();
// });
//el-image-viewer__maskdiv
let mask = document.createElement("div");
mask.classList.add("el-image-viewer__mask");
//el-image-viewer__wrapperdiv
let wrap = document.createElement("div");
wrap.classList.add("el-image-viewer__wrapper");
wrap.style.zIndex = '99999';
//
wrap.addEventListener("click", function () {
wrap.remove();
});
wrap.appendChild(canvas);
wrap.appendChild(mask);
// body
let first = document.body.firstChild;
// div
document.body.insertBefore(wrap, first);
}
}
}

View File

@ -625,7 +625,11 @@ p {
}
/deep/ .el-form-item__content {
z-index: 1;
z-index: 2;
}
/deep/ .el-scrollbar__bar.is-vertical {
z-index: 3;
}
.head-bar {

View File

@ -570,6 +570,10 @@ export default {
}
/deep/ .el-form-item__content {
z-index: 1;
z-index: 2;
}
/deep/ .el-scrollbar__bar.is-vertical {
z-index: 3;
}
</style>