style: 裁剪框被遮挡
This commit is contained in:
@@ -96,24 +96,26 @@
|
||||
return label
|
||||
}
|
||||
|
||||
const centerLabelTop = "8px"
|
||||
|
||||
const cropLabelMap = {
|
||||
cover: [
|
||||
{ text: "crown", top: "2.67%", className: "label-h" },
|
||||
{ text: "hip line", top: "63.47%", className: "label-h" },
|
||||
{ text: "mid-thigh", top: "92.8%", className: "label-h" },
|
||||
{ text: "center", top: "0", className: "label-v" }
|
||||
{ text: "center", top: centerLabelTop, className: "label-v" }
|
||||
],
|
||||
mainProductImage: [
|
||||
{ text: "crown", top: "2.67%", className: "label-h" },
|
||||
{ text: "footbase", top: "97.6%", className: "label-h" },
|
||||
{ text: "center", top: "0", className: "label-v" }
|
||||
{ text: "center", top: centerLabelTop, className: "label-v" }
|
||||
],
|
||||
sketch: [
|
||||
{ text: "crown", top: "2.67%", className: "label-h" },
|
||||
{ text: "footbase", top: "97.6%", className: "label-h" },
|
||||
{ text: "center", top: "0", className: "label-v" }
|
||||
{ text: "center", top: centerLabelTop, className: "label-v" }
|
||||
],
|
||||
apparel: [{ text: "center", top: "0", className: "label-v" }]
|
||||
apparel: [{ text: "center", top: centerLabelTop, className: "label-v" }]
|
||||
}
|
||||
|
||||
const injectCropLabel = () => {
|
||||
@@ -288,11 +290,16 @@
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid rgba(75, 165, 255, 0.85);
|
||||
pointer-events: none;
|
||||
z-index: 9; /* 位于图片之上,但在控制点之下 */
|
||||
background-image: none;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
:deep(.vue-cropper .crop-point) {
|
||||
z-index: 10;
|
||||
}
|
||||
}
|
||||
|
||||
&[data-crop-type="cover"] {
|
||||
|
||||
Reference in New Issue
Block a user