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

@@ -2,11 +2,11 @@
<div class="canvasArgument">
<div class="label_item wH">
<div class="title">{{ $t('exportModel.Width') }}</div>
<input type="number" @input="canvasGeneral.setCanvasWH('width')" v-model="canvasGeneral.canvasWH.width">
<input type="number" @input="canvasGeneral.setCanvasWH('width')" v-model="canvasGeneral.canvasWH.layerWidth">
</div>
<div class="label_item wH">
<div class="title">{{ $t('exportModel.Height') }}</div>
<input type="number" @input="canvasGeneral.setCanvasWH('height')" v-model="canvasGeneral.canvasWH.height">
<input type="number" @input="canvasGeneral.setCanvasWH('height')" v-model="canvasGeneral.canvasWH.layerHeight">
</div>
<div class="label_item" v-show="
canvasGeneral.operation != 'movePosition' &&
@@ -93,7 +93,6 @@
:style="{'font-family':canvasGeneral.fontFamily}"
>
<a-select-option class="label_select_item" v-for="item in canvasGeneral.pencilList.textFontFamilyList" :style="{'font-family':item.value}" :value="item.value">
{{item.name}}
</a-select-option>
</a-select>
</div>
@@ -148,6 +147,7 @@
}
const addImage = (item:any)=>{
if(!item.minioUrl)item.minioUrl = item.imgUrl
item.imgUrl = item?.url || item?.designOutfitUrl || item?.imgUrl || item?.minioUrl
canvasGeneral.addImage(item)
}
return {

View File

@@ -1,12 +1,12 @@
<template>
<div class="canvasContent_box">
<div class="canvasContent" ref="canvasScaleDom">
<div v-if="isPresuppose" class="generalCanvas_center presuppose">
<!-- <div v-if="isPresuppose" class="generalCanvas_center presuppose">
<div class="presuppose16-9" @click="setPresuppose('16/9')">16 : 9</div>
<div class="presuppose1-1" @click="setPresuppose('1/1')">1 : 1</div>
<div class="presuppose9-16" @click="setPresuppose('9/16')">9 : 16</div>
</div>
<div v-else class="generalCanvas_center canvas" ref="canvasDom">
</div> -->
<div class="generalCanvas_center canvas" ref="canvasDom">
<div class="editFrontBack_pencilbtn" v-show="!isShowMark" :style="canvasGeneral.pencilbtnStyle"></div>
</div>
</div>
@@ -29,7 +29,6 @@
const data:any = reactive({
canvasScaleDom:null,
canvasDom:null,
isPresuppose:false,
isShowMark:false,
pencilbtnStyle:{},
@@ -41,7 +40,7 @@
await canvasGeneral.canvasInit(data.canvasDom,{
width:data.canvasDom.offsetWidth,
height:data.canvasDom.offsetHeight,
})
},'','','',2000)
resolve('')
})
})
@@ -105,17 +104,16 @@
const openSetData =async ()=>{
let oldCanvas = store.state.HomeStoreModule.canvasData?.canvas
if(oldCanvas){
await createCanvas({})
await canvasGeneral.createCanvas(data.canvasDom,{
width:data.canvasDom.offsetWidth,
height:data.canvasDom.offsetHeight,
},2000)
canvasGeneral.setLoadFromJSON(oldCanvas, () => {});
}else{
await createCanvas({})
}
}
onMounted(()=>{
if(canvasType == 'export'){
data.isPresuppose = true
}else{
createCanvas({})
}
})
return {
canvasGeneral,

View File

@@ -5,7 +5,7 @@
>
<div class="layer">
<div class="layer-item button" @click="canvasGeneral.createLayer">
新建图层
Add Layer
</div>
<div class="layer-item-box-scroll">
<div class="layer-item-box" :style="{'height':layerList.length * 6 + 'rem'}">
@@ -13,11 +13,11 @@
v-for="item,index in layerList"
:key="item"
:style="item?.style"
@click="canvasGeneral.selectLayer(item.id)"
@mousedown="mousedown($event,item,index)"
@touchstart="touchstart($event,item,index)"
@click.stop="canvasGeneral.selectLayer(item.id)"
@mousedown.stop="mousedown($event,item,index)"
@touchstart.stop="touchstart($event,item,index)"
@contextmenu="openMenu($event,item,index)"
@contextmenu.stop="openMenu($event,item,index)"
:class="{'active':item.id == canvasGeneral.layer.selectLayer.id}">
<!-- <div @click.stop="canvasGeneral.layerShowHide(item.id,item)">{{ item.isShow }}</div> -->
@@ -26,17 +26,19 @@
<div>
{{ item.name }}
</div>
<div @click.stop="canvasGeneral.layerDelete(index,item.id)" :class="{noDelete:canvasGeneral.layer.list.length == 1}">删除</div>
<div @click.stop="canvasGeneral.layerDelete(index,item.id)" :class="{noDelete:canvasGeneral.layer.list.length == 1}">
<i class="fi fi-rr-trash icon_delete"></i>
</div>
</div>
</div>
</div>
</div>
<div class="layer-menu" :style="styleMenu">
<div class="layer-menu-item" @click="canvasGeneral.copyLayer(itemMenu.id)">复制</div>
<div class="layer-menu-item" @click="canvasGeneral.layerDelete(itemMenu.index,itemMenu.id)">删除</div>
<div class="layer-menu-item" v-if="itemMenu.groupType == 'Object'" @click="canvasGeneral.setGridOrObject(itemMenu.id,'Grid')">设置栅格化</div>
<div class="layer-menu-item" v-if="itemMenu.groupType == 'Grid'" @click="canvasGeneral.setGridOrObject(itemMenu.id,'Object')">取消栅格化</div>
<div class="layer-menu-item" @click="canvasGeneral.copyLayer(itemMenu.id)">Copy</div>
<div class="layer-menu-item" @click="canvasGeneral.layerDelete(itemMenu.index,itemMenu.id)">Delete</div>
<div class="layer-menu-item" v-if="itemMenu.groupType == 'Object'" @click="canvasGeneral.setGridOrObject(itemMenu.id,'Grid')">Rasterize layer</div>
<div class="layer-menu-item" v-if="itemMenu.groupType == 'Grid'" @click="canvasGeneral.setGridOrObject(itemMenu.id,'Object')">Cancal rasterization</div>
</div>
</div>
</template>
@@ -90,7 +92,7 @@
const openMenu = (event:any,item:any,index:number)=>{
if(event.preventDefault)event.preventDefault();
data.itemMenu = item;
data.itemMenu.index = index
// data.itemMenu.index = index
let position = data.detailDom.getBoundingClientRect();
data.styleMenu = {
left:event.clientX - position.left+'px',
@@ -191,7 +193,6 @@
}
});
if(str == 'up')time = setTimeout(()=>canvasGeneral.upLayerIndex(list),500)
}
return {
canvasGeneral,

View File

@@ -20,7 +20,7 @@
<div class="gallery_btn" style="margin: 0 2rem;" @click="setExport">{{ $t('exportModel.Export') }}</div>
</div>
<liquefaction ref="liquefaction" @submitLiquefaction="submitLiquefaction"></liquefaction>
<!-- <publish ref="publish" @clearPublish="()=>{}"></publish> -->
<publish ref="publish" @clearPublish="()=>{}"></publish>
</div>
</template>
<script>
@@ -118,7 +118,6 @@ export default defineComponent({
const getCanvasData = ()=>{
if(!canvasObj.canvas)return
var json = canvasObj.canvas.toJSON(['src','minioUrl','custom','perPixelTargetFind','hasBorders','selectable','hasControls','erasable']);
// console.log(JSON.stringify(json));
json.objects.forEach(item=>{
if(item.type == 'image'){
delete item.src
@@ -131,6 +130,7 @@ export default defineComponent({
return canvasExport
}
const openSetData = async ()=>{
//获取所有所选元素
let arr = store.state.Workspace.projectList
let obj = {}
for (let index = 0; index < arr.length; index++) {
@@ -142,6 +142,13 @@ export default defineComponent({
resolve('')
return
}
if(keys == 'design'){
value[keys].forEach((designItem)=>{
let minioUrl = designItem.url
designItem.url = designItem.designOutfitUrl
designItem.minioUrl = designItem.minioUrl
})
}
let rv = {
list:value[keys],
name:item.name,
@@ -150,9 +157,10 @@ export default defineComponent({
resolve('')
})
})
}
data.elementList = obj
//获取所有所选元素 END
if(data.showCanvas)return
data.showCanvas = true
dataDom.canvasContent.openSetData()
@@ -179,7 +187,6 @@ export default defineComponent({
name: "collection.png",
});
let num = 0;
console.log(data.elementList)
for (let key in data.elementList) {
for (let index = 0; index < data.elementList[key].list.length; index++) {
const item = data.elementList[key].list[index];
@@ -188,7 +195,6 @@ export default defineComponent({
img.push({imgUrl:url,name:`element${index}.${name}`})
}
}
console.log(img)
downImg(img);
};
let getImgArrayBuffer = (url) => {
@@ -252,7 +258,7 @@ export default defineComponent({
onMounted(() => {
});
onBeforeUnmount(()=>{
// canvasGeneral.canvasClear()
canvasObj.canvasClear()
})
return {
isShowMark,

View File

@@ -117,6 +117,7 @@ import { Https } from "@/tool/https";
flex-direction: column;
position: relative;
align-items: center;
overflow-y: auto;
&.leftAlign{
justify-content: flex-start;
}