This commit is contained in:
X1627315083
2025-04-09 14:09:19 +08:00
parent b6e5f05f06
commit 37f1b36e54
76 changed files with 1969 additions and 970 deletions

View File

@@ -1,34 +1,32 @@
<template>
<div class="addDetailsModal generalModel" ref="addDetailsModal"></div>
<a-modal
class="addDetails_modal generalModel"
class="addDetails_modal generalModel fullScreen"
v-model:visible="addDetails"
:footer="null"
:get-container="() => $refs.addDetailsModal"
width="78%"
width="100%"
height="100%"
:maskClosable="false"
:centered="true"
:closable="false"
:destroyOnClose="true"
wrapClassName="#app"
:keyboard="false"
:mask="false"
>
<div class="generalModel_btn">
<div class="generalModel_closeIcon" @click.stop="cancelDsign()">
<svg width="46" height="46" viewBox="0 0 46 46" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="23" cy="23" r="23" fill="white" fill-opacity="0.3"/>
<rect x="32.5063" y="12" width="3" height="29" rx="1.5" transform="rotate(45 32.5063 12)" fill="white"/>
<rect x="34.6274" y="32.5059" width="3" height="29" rx="1.5" transform="rotate(135 34.6274 32.5059)" fill="white"/>
<rect x="32.5063" y="12" width="3" height="29" rx="1.5" transform="rotate(45 32.5063 12)" fill="#000"/>
<rect x="34.6274" y="32.5059" width="3" height="29" rx="1.5" transform="rotate(135 34.6274 32.5059)" fill="#000"/>
</svg>
</div>
</div>
<div class="addDetails_center">
<div class="modal_title_text">
<div>{{ $t('addDetails.AddDetails') }}</div>
<div class="modal_title_text_intro"></div>
</div>
<generalMiniCanvas :imgUrl="imgUrl" @submitBase64Data="submitBase64Data"></generalMiniCanvas>
</div>
<div></div>

View File

@@ -90,6 +90,7 @@ export default defineComponent({
ratio = [1,1]
imgData.value = data
nextTick(()=>{
let contentBox = document.querySelector(".editFrontBack_center");
let canvasBox = document.querySelector(".editFrontBack_center .exportCanvasBox_center");
let editFrontBack_bgImg = document.querySelector(".editFrontBack_center .editFrontBack_bgImg");
document.removeEventListener('mousemove', mouseMove);
@@ -97,33 +98,36 @@ export default defineComponent({
let img = new Image();
img.onload = async function(){
loadingShow.value = true
let scale = img.width/img.height
let height = canvasBox.offsetHeight;
canvasWH.value = height
canvasBox.style.width = height * scale+'px'
let scale
let wScale = 1
let hScale = 1
let styleWidth = Number(data.style.width.split('px')[0])
let styleHeight = Number(data.style.height.split('px')[0])
let width = contentBox.offsetWidth;
let height = contentBox.offsetHeight;
if(styleWidth>styleHeight){
hScale = styleHeight/styleWidth
exportWH = img.width
canvasWH.value = width
scale = img.height/img.width
console.log(width,scale)
canvasBox.style.height = width * scale+'px'
}else{
wScale = styleWidth/styleHeight
exportWH = img.height
canvasWH.value = height
scale = img.width/img.height
canvasBox.style.width = height * scale+'px'
}
editFrontBack_bgImg.style.width = canvasWH.value * wScale+'px'
editFrontBack_bgImg.style.height = canvasWH.value * hScale+'px'
ratio = [wScale,hScale]
// canvas = frontBackCanvasObj.canvasInit(canvasBox,{
// width:canvasWH.value * wScale,
// height:canvasWH.value * hScale,
// })
await frontBackCanvasObj.canvasInit(canvasBox,{
width:canvasWH.value * wScale,
height:canvasWH.value * hScale,
},data.maskUrl,'',{})
},data.maskUrl,'',{noWheel:true})
// undividedLayer
canvas = frontBackCanvasObj.canvas
@@ -383,6 +387,8 @@ export default defineComponent({
width: 100%;
background: #e6e6e6;
cursor: auto;
display: flex;
align-items: center;
&:hover{
cursor: none;
}

View File

@@ -272,10 +272,10 @@ methods: {
left: 50%;
border-radius: 2rem;
transform: translate(-50%, -50%);
background: radial-gradient(50px circle at var(--x) var(--y),#39215b 0,transparent 100%);;
background: radial-gradient(50px circle at var(--x) var(--y),#000 0,transparent 100%);;
}
.content_bottom_item .active{
background: #39215b;
background: #000;
color: #fff;
}
}