调整画布previwe后颜色板块变为空了
This commit is contained in:
@@ -189,7 +189,7 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
watch(()=>detailData.selectDetail,async (newValue,oldValue)=>{
|
watch(()=>detailData.selectDetail,async (newValue,oldValue)=>{
|
||||||
detailData.imgDomIndex = detailData.frontBack.front.findIndex((item:any)=>item.id == newValue.id)
|
detailData.imgDomIndex = detailData.frontBack.front.findIndex((item:any)=>item.id == newValue.id)
|
||||||
if(newValue)await getSketchSize()
|
if(newValue?.path)await getSketchSize()
|
||||||
detailData.canvasKey += 1
|
detailData.canvasKey += 1
|
||||||
// privewDetail(oldValue)
|
// privewDetail(oldValue)
|
||||||
},{immediate: true})
|
},{immediate: true})
|
||||||
@@ -395,9 +395,9 @@ export default defineComponent({
|
|||||||
trims:(newData && detailData.currentDetailType == 'element' && isCurrent && !detailData.isEditPattern.value)?{prints:newData}:list[i].trims?.prints?list[i].trims:{prints:[]},
|
trims:(newData && detailData.currentDetailType == 'element' && isCurrent && !detailData.isEditPattern.value)?{prints:newData}:list[i].trims?.prints?list[i].trims:{prints:[]},
|
||||||
accessory:(newData && detailData.currentDetailType == 'accessory' && isCurrent && !detailData.isEditPattern.value)?{prints:newData}:list[i].trims?.prints?list[i].trims:{prints:[]},
|
accessory:(newData && detailData.currentDetailType == 'accessory' && isCurrent && !detailData.isEditPattern.value)?{prints:newData}:list[i].trims?.prints?list[i].trims:{prints:[]},
|
||||||
}
|
}
|
||||||
if(!data.partialDesign.partialDesignMinioPath){
|
// if(!data.partialDesign.partialDesignMinioPath){
|
||||||
data.partialDesign.partialDesignMinioPath = data.path
|
// data.partialDesign.partialDesignMinioPath = data.path
|
||||||
}
|
// }
|
||||||
printObjectToJSON(data.printObject.prints)
|
printObjectToJSON(data.printObject.prints)
|
||||||
printObjectToJSON(data.trims.prints)
|
printObjectToJSON(data.trims.prints)
|
||||||
if((detailData.isEditPattern.value && list[i].color?.gradient) || (!detailData.isEditPattern.value && (list[i].newDetail?.color?.gradient || list[i].color?.gradient))){
|
if((detailData.isEditPattern.value && list[i].color?.gradient) || (!detailData.isEditPattern.value && (list[i].newDetail?.color?.gradient || list[i].color?.gradient))){
|
||||||
@@ -613,7 +613,7 @@ export default defineComponent({
|
|||||||
if(color.r){
|
if(color.r){
|
||||||
color.rgba = {r:color.r,g:color.g,b:color.b,a:color.a}
|
color.rgba = {r:color.r,g:color.g,b:color.b,a:color.a}
|
||||||
}else{
|
}else{
|
||||||
color.rbga = {}
|
color.rgba = {}
|
||||||
}
|
}
|
||||||
otherData.color = color
|
otherData.color = color
|
||||||
}
|
}
|
||||||
@@ -622,7 +622,7 @@ export default defineComponent({
|
|||||||
otherData.printObject = detailData.selectDetail.newDetail?.print?.length>0?{prints:detailData.selectDetail.newDetail?.print}:detailData.selectDetail.printObject || null
|
otherData.printObject = detailData.selectDetail.newDetail?.print?.length>0?{prints:detailData.selectDetail.newDetail?.print}:detailData.selectDetail.printObject || null
|
||||||
}
|
}
|
||||||
if(detailData.currentDetailType == 'element'){
|
if(detailData.currentDetailType == 'element'){
|
||||||
otherData.trims = detailData.selectDetail.newDetail?.element
|
otherData.trims = detailData.selectDetail.newDetail?.element?.length>0?{prints:detailData.selectDetail.newDetail?.element}:detailData.selectDetail.trims || null
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
console.log(JSON.parse(JSON.stringify(otherData)),'=======',JSON.parse(JSON.stringify(detailData.selectDetail)))
|
console.log(JSON.parse(JSON.stringify(otherData)),'=======',JSON.parse(JSON.stringify(detailData.selectDetail)))
|
||||||
@@ -632,7 +632,6 @@ 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()
|
||||||
console.log(allInfo,'allInfo')
|
|
||||||
if(allInfo.trims?.length > 0){
|
if(allInfo.trims?.length > 0){
|
||||||
// detailData.selectDetail.trims.prints = allInfo.trims
|
// detailData.selectDetail.trims.prints = allInfo.trims
|
||||||
let value = {
|
let value = {
|
||||||
@@ -650,7 +649,7 @@ export default defineComponent({
|
|||||||
store.commit('DesignDetail/setNewDetail',value)
|
store.commit('DesignDetail/setNewDetail',value)
|
||||||
}
|
}
|
||||||
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)
|
||||||
let value:any = {
|
let value:any = {
|
||||||
data:{
|
data:{
|
||||||
@@ -669,6 +668,7 @@ export default defineComponent({
|
|||||||
if(canvasColor.gradient){
|
if(canvasColor.gradient){
|
||||||
value.data.gradient = canvasColor.gradient
|
value.data.gradient = canvasColor.gradient
|
||||||
}
|
}
|
||||||
|
console.log(value,'=======')
|
||||||
store.commit('DesignDetail/setNewDetail',value)
|
store.commit('DesignDetail/setNewDetail',value)
|
||||||
if(allInfo.color.color.gradient)detailData.selectDetail.color.gradient = allInfo.color.color.gradient
|
if(allInfo.color.color.gradient)detailData.selectDetail.color.gradient = allInfo.color.color.gradient
|
||||||
if(detailData.currentDetailType == 'color'){
|
if(detailData.currentDetailType == 'color'){
|
||||||
|
|||||||
@@ -116,7 +116,7 @@ export default defineComponent({
|
|||||||
getCanvasIfEdit:inject('getCanvasIfEdit')as any,
|
getCanvasIfEdit:inject('getCanvasIfEdit')as any,
|
||||||
canvasInstance:null as any,
|
canvasInstance:null as any,
|
||||||
canvasJSON:'',
|
canvasJSON:'',
|
||||||
hideCanvas: computed(()=>store.state.Workspace.projectPath !== route.fullPath),
|
hideCanvas: computed(()=>(store.state.Workspace.projectPath !== route.fullPath && props.isEditPattern)),
|
||||||
otherData:computed(()=>({
|
otherData:computed(()=>({
|
||||||
canvasId: store.state.DesignDetail.selectDetail.canvasId,
|
canvasId: store.state.DesignDetail.selectDetail.canvasId,
|
||||||
color: store.state.DesignDetail.selectDetail.color,
|
color: store.state.DesignDetail.selectDetail.color,
|
||||||
@@ -213,7 +213,6 @@ export default defineComponent({
|
|||||||
wH = [1,domHeight/imgHeight]
|
wH = [1,domHeight/imgHeight]
|
||||||
// detailData.canvasConfig.width = img.width * wH[1]
|
// detailData.canvasConfig.width = img.width * wH[1]
|
||||||
// detailData.canvasConfig.height = domHeight
|
// detailData.canvasConfig.height = domHeight
|
||||||
console.log(detailData.canvasConfig,'===============')
|
|
||||||
detailData.canvasConfig.width = img.width
|
detailData.canvasConfig.width = img.width
|
||||||
detailData.canvasConfig.height = img.height
|
detailData.canvasConfig.height = img.height
|
||||||
|
|
||||||
@@ -343,7 +342,6 @@ export default defineComponent({
|
|||||||
// }
|
// }
|
||||||
const canvasLoadJsonSuccess = async ()=>{
|
const canvasLoadJsonSuccess = async ()=>{
|
||||||
let otherData = await props.updateOtherLayers()
|
let otherData = await props.updateOtherLayers()
|
||||||
|
|
||||||
await updateOtherLayers(otherData)
|
await updateOtherLayers(otherData)
|
||||||
await setUndivideLayer()
|
await setUndivideLayer()
|
||||||
}
|
}
|
||||||
@@ -369,7 +367,6 @@ export default defineComponent({
|
|||||||
width:props.sketchSize.width,
|
width:props.sketchSize.width,
|
||||||
height:props.sketchSize.height,
|
height:props.sketchSize.height,
|
||||||
}).then((rv)=>{
|
}).then((rv)=>{
|
||||||
console.log(rv,'======')
|
|
||||||
detailData.selectDetail.undividedLayer = rv
|
detailData.selectDetail.undividedLayer = rv
|
||||||
})
|
})
|
||||||
// }
|
// }
|
||||||
@@ -402,9 +399,9 @@ export default defineComponent({
|
|||||||
const sessionCanvasList = sessionStorage.getItem('canvasList');
|
const sessionCanvasList = sessionStorage.getItem('canvasList');
|
||||||
const canvasList = sessionCanvasList ? JSON.parse(sessionCanvasList) : []
|
const canvasList = sessionCanvasList ? JSON.parse(sessionCanvasList) : []
|
||||||
let canvasIndex = canvasList.findIndex(item => item.id === detailData.selectDetail.id);
|
let canvasIndex = canvasList.findIndex(item => item.id === detailData.selectDetail.id);
|
||||||
if(canvasIndex>1){
|
if(canvasIndex>-1){
|
||||||
detailData.canvasJSON = canvasList[canvasIndex].canvasJSON
|
detailData.canvasJSON = canvasList[canvasIndex].canvasJSON
|
||||||
}
|
}else{
|
||||||
if(detailData.selectDetail.canvasId){
|
if(detailData.selectDetail.canvasId){
|
||||||
detailData.isShowMark = true
|
detailData.isShowMark = true
|
||||||
await new Promise((resolve, reject) => {
|
await new Promise((resolve, reject) => {
|
||||||
@@ -422,6 +419,8 @@ export default defineComponent({
|
|||||||
});
|
});
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
setCanvas(detailData.selectDetail.path).then(()=>{
|
setCanvas(detailData.selectDetail.path).then(()=>{
|
||||||
detailData.canvasLoad = true
|
detailData.canvasLoad = true
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -124,11 +124,13 @@ export default defineComponent({
|
|||||||
})
|
})
|
||||||
watch(()=>colorData.selectDetail.id,(newVal,oldVal)=>{
|
watch(()=>colorData.selectDetail.id,(newVal,oldVal)=>{
|
||||||
if(!newVal)return
|
if(!newVal)return
|
||||||
|
console.log(12312)
|
||||||
if(!colorData.colorList?.list?.[newVal]){
|
if(!colorData.colorList?.list?.[newVal]){
|
||||||
colorData.colorList.list[newVal] = []
|
colorData.colorList.list[newVal] = []
|
||||||
}else{
|
}else{
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
console.log(12312)
|
||||||
let isNoSelect = false
|
let isNoSelect = false
|
||||||
let pushIndex = 0
|
let pushIndex = 0
|
||||||
for (let index = 0; index < 9; index++) {
|
for (let index = 0; index < 9; index++) {
|
||||||
@@ -142,9 +144,10 @@ export default defineComponent({
|
|||||||
colorData.selectDetail.color.rgba?.r == color?.rgba?.r &&
|
colorData.selectDetail.color.rgba?.r == color?.rgba?.r &&
|
||||||
colorData.selectDetail.color.rgba?.g == color?.rgba?.g &&
|
colorData.selectDetail.color.rgba?.g == color?.rgba?.g &&
|
||||||
colorData.selectDetail.color.rgba?.b == color?.rgba?.b ||
|
colorData.selectDetail.color.rgba?.b == color?.rgba?.b ||
|
||||||
(JSON.stringify(colorData.selectDetail.color.gradient) == JSON.stringify(color?.gradient) && JSON.stringify(colorData.selectDetail.color.gradient))
|
(JSON.stringify(colorData.selectDetail.color.gradient) == JSON.stringify(color?.gradient) && colorData.selectDetail.color.gradient)
|
||||||
&& colorData.selectDetail.color.rgba?.r
|
&& colorData.selectDetail.color.rgba?.r
|
||||||
){
|
){
|
||||||
|
console.log(123)
|
||||||
isNoSelect = true
|
isNoSelect = true
|
||||||
colorData.selectColor = item
|
colorData.selectColor = item
|
||||||
colorData.colorList.index = index
|
colorData.colorList.index = index
|
||||||
@@ -170,20 +173,21 @@ export default defineComponent({
|
|||||||
colorData.colorList.list[newVal].push(item)
|
colorData.colorList.list[newVal].push(item)
|
||||||
}
|
}
|
||||||
if(!isNoSelect){
|
if(!isNoSelect){
|
||||||
if(!colorData.selectDetail.color?.rgba?.r)return
|
let color = colorData.selectDetail.newDetail?.color?.rgba?.r?colorData.selectDetail.newDetail?.color:colorData.selectDetail.color
|
||||||
|
if(!color?.rgba?.r)return
|
||||||
let item = {
|
let item = {
|
||||||
hex:rgbaToHex([colorData.selectDetail.color.rgba.r,colorData.selectDetail.color.rgba.g,colorData.selectDetail.color.rgba.b]),
|
hex:rgbaToHex([color.rgba.r,color.rgba.g,color.rgba.b]),
|
||||||
id:colorData.selectDetail.color.id,
|
id:color.id,
|
||||||
rgba:{
|
rgba:{
|
||||||
r:colorData.selectDetail.color.rgba.r,
|
r:color.rgba.r,
|
||||||
g:colorData.selectDetail.color.rgba.g,
|
g:color.rgba.g,
|
||||||
b:colorData.selectDetail.color.rgba.b,
|
b:color.rgba.b,
|
||||||
},
|
},
|
||||||
tcx:colorData.selectDetail.color.tcx,
|
tcx:color.tcx,
|
||||||
name:colorData.selectDetail.color.name,
|
name:color.name,
|
||||||
} as any
|
} as any
|
||||||
if(colorData.selectDetail.color.gradient){
|
if(color.gradient){
|
||||||
item.gradient = colorData.selectDetail.color.gradient
|
item.gradient = color.gradient
|
||||||
}
|
}
|
||||||
colorData.selectColor = item
|
colorData.selectColor = item
|
||||||
let num = pushIndex
|
let num = pushIndex
|
||||||
|
|||||||
@@ -79,7 +79,7 @@ export default defineComponent({
|
|||||||
detailData.selectDetail?.id &&
|
detailData.selectDetail?.id &&
|
||||||
detailData?.getCanvasIfEdit?.fun&&detailData?.getCanvasIfEdit?.fun() > 0
|
detailData?.getCanvasIfEdit?.fun&&detailData?.getCanvasIfEdit?.fun() > 0
|
||||||
){
|
){
|
||||||
resolve()
|
resolve(true)
|
||||||
// Modal.confirm({
|
// Modal.confirm({
|
||||||
// title: t('collectionModal.jsContent6'),
|
// title: t('collectionModal.jsContent6'),
|
||||||
// icon: createVNode(ExclamationCircleOutlined),
|
// icon: createVNode(ExclamationCircleOutlined),
|
||||||
|
|||||||
@@ -111,7 +111,7 @@ export default defineComponent({
|
|||||||
type: 'personal',
|
type: 'personal',
|
||||||
info: '您的AI时尚设计助手',
|
info: '您的AI时尚设计助手',
|
||||||
price: 'HK$0',
|
price: 'HK$0',
|
||||||
detail: '自注册之日起 7 天内 · 50 个积分',
|
detail: '自注册之日起 5 天内 · 50 个积分',
|
||||||
highlight: '',
|
highlight: '',
|
||||||
discounts: '9折优惠',
|
discounts: '9折优惠',
|
||||||
detailList: [
|
detailList: [
|
||||||
@@ -190,7 +190,7 @@ export default defineComponent({
|
|||||||
type: 'personal',
|
type: 'personal',
|
||||||
info: '您的AI时尚设计助手',
|
info: '您的AI时尚设计助手',
|
||||||
price: 'HK$0',
|
price: 'HK$0',
|
||||||
detail: '自注册之日起 7 天内 · 50 个积分',
|
detail: '自注册之日起 5 天内 · 50 个积分',
|
||||||
highlight: '',
|
highlight: '',
|
||||||
discounts: '9折优惠',
|
discounts: '9折优惠',
|
||||||
detailList: [
|
detailList: [
|
||||||
@@ -255,7 +255,7 @@ export default defineComponent({
|
|||||||
type: 'personal',
|
type: 'personal',
|
||||||
info: 'Your AI Fashion Design Assistant',
|
info: 'Your AI Fashion Design Assistant',
|
||||||
price: 'HK$0',
|
price: 'HK$0',
|
||||||
detail: '7 days from sign-up · 50 credits',
|
detail: '5 days from sign-up · 50 credits',
|
||||||
highlight: '',
|
highlight: '',
|
||||||
discounts: '10% off',
|
discounts: '10% off',
|
||||||
detailList: [
|
detailList: [
|
||||||
@@ -334,7 +334,7 @@ export default defineComponent({
|
|||||||
type: 'personal',
|
type: 'personal',
|
||||||
info: 'Your AI Fashion Design Assistant',
|
info: 'Your AI Fashion Design Assistant',
|
||||||
price: 'HK$0',
|
price: 'HK$0',
|
||||||
detail: '7 days from sign-up · 50 credits',
|
detail: '5 days from sign-up · 50 credits',
|
||||||
highlight: '',
|
highlight: '',
|
||||||
discounts: '10% off',
|
discounts: '10% off',
|
||||||
detailList: [
|
detailList: [
|
||||||
|
|||||||
Reference in New Issue
Block a user