修复detail打开画布直接提交数据没有正确更新

This commit is contained in:
X1627315083
2026-01-22 10:29:58 +08:00
parent b114d352f6
commit bb5c319a7f
2 changed files with 51 additions and 18 deletions

View File

@@ -545,9 +545,7 @@ export default defineComponent({
await detailDom.canvasBox.privewDetail() await detailDom.canvasBox.privewDetail()
await upDateFrontBackSketch() await upDateFrontBackSketch()
saveCanvasJSONToSession() saveCanvasJSONToSession()
if(detailData.isEditPattern.value == 'canvasEditor'){ await uploadSelectDetail()
await uploadElement()
}
detailData.loadingShow = false detailData.loadingShow = false
} }
} }
@@ -675,22 +673,16 @@ export default defineComponent({
if(detailData.isEditPattern.value == 'canvasEditor'){ if(detailData.isEditPattern.value == 'canvasEditor'){
// await detailDom.canvasBox.saveCanvas() // await detailDom.canvasBox.saveCanvas()
const allInfo = await (detailDom.canvasBox as any).getCanvasElement() const allInfo = await (detailDom.canvasBox as any).getCanvasElement()
if(allInfo.trims?.length > 0){ let trimsValue = {
// detailData.selectDetail.trims.prints = allInfo.trims data:allInfo.trims || [],
let value = { str:'element'
data:allInfo.trims,
str:'element'
}
store.commit('DesignDetail/setNewDetail',value)
} }
if(allInfo.prints?.length > 0){ store.commit('DesignDetail/setNewDetail',trimsValue)
// detailData.selectDetail.printObject.prints = allInfo.prints let printValue = {
let value = { data:allInfo.prints || [],
data:allInfo.prints, str:'print'
str:'print'
}
store.commit('DesignDetail/setNewDetail',value)
} }
store.commit('DesignDetail/setNewDetail',printValue)
if(allInfo.color?.color?.rgba){ if(allInfo.color?.color?.rgba){
let canvasColor = allInfo.color.color; let canvasColor = allInfo.color.color;
let colorData:any = await getColorName(allInfo.color.color?.rgba) let colorData:any = await getColorName(allInfo.color.color?.rgba)
@@ -716,9 +708,45 @@ export default defineComponent({
if(detailData.currentDetailType == 'color'){ if(detailData.currentDetailType == 'color'){
detailData.detailLeftColorKey++ detailData.detailLeftColorKey++
} }
}else{
let value = {
data:{},
str:'color'
}
store.commit('DesignDetail/setNewDetail',value)
} }
} }
} }
const uploadSelectDetail = async ()=>{//更新选中的detail
// await detailDom.canvasBox.saveCanvas()
const allInfo = await (detailDom.canvasBox as any).getCanvasElement()
let color:any = {}
if(allInfo.color?.color?.rgba){
let canvasColor = allInfo.color.color;
let colorData:any = await getColorName(allInfo.color.color?.rgba)
color = {
hsv:{
h:colorData.h,
s:colorData.s,
v:colorData.v,
},
name:colorData.name,
tcx:colorData.tcx,
rgba:canvasColor.rgba,
hex:rgbaToHex([canvasColor.rgba.r,canvasColor.rgba.g,canvasColor.rgba.b]),
}
if(canvasColor.gradient){
color.gradient = canvasColor.gradient
}
if(detailData.currentDetailType == 'color'){
detailData.detailLeftColorKey++
}
}
detailData.selectDetail.trims.prints = allInfo.trims || []
detailData.selectDetail.printObject.prints = allInfo.prints || []
detailData.selectDetail.color = color
}
const canvasReload = async ()=>{ const canvasReload = async ()=>{
if(detailData.isEditPattern.value){ if(detailData.isEditPattern.value){
await detailDom.canvasBox.saveCanvas() await detailDom.canvasBox.saveCanvas()

View File

@@ -14,7 +14,12 @@
<div ref="moveableContainer" class="moveableContainer"></div> <div ref="moveableContainer" class="moveableContainer"></div>
</div> </div>
<div class="designOpenrtion_imgMask" v-if="!frontBack?.body?.path"> <div class="designOpenrtion_imgMask" v-if="!frontBack?.body?.path">
<img :src="selectDetail?.undividedLayerWithSinglePrint || selectDetail?.undividedLayer || selectDetail?.path" style="object-fit: cover;" alt=""> <div class="designOpenrtion_print">
<img v-if="frontBack.back?.[0].imageUrl" :src="frontBack.back?.[0].imageUrl" style="object-fit: cover;" alt="">
</div>
<div class="detail_modal_item_front" style="position: relative;">
<img :src="frontBack.front?.[0].imageUrl || selectDetail?.path" style="object-fit: cover;" alt="">
</div>
<!-- <img @load="setSelectSketch()" :src="designDetail?.currentFullBodyView || selectDetail?.undividedLayer" style="object-fit: cover;" alt=""> --> <!-- <img @load="setSelectSketch()" :src="designDetail?.currentFullBodyView || selectDetail?.undividedLayer" style="object-fit: cover;" alt=""> -->
</div> </div>
</div> </div>