aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修复撤回bug

Browse Source
This commit is contained in:
X1627315083
2025-03-10 10:33:54 +08:00
parent ae9c3efd27
commit 1c3ad7ca62
2 changed files with 15 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src/component/modules/generalMiniCanvas.vue
View File

@@ -36,8 +36,8 @@
<!-- <div @click="setOperation('')" class="generalMiniCanvas_btn_item">
<div>新增</div>
</div> -->
<i class="icon iconfont icon-chehui" @click="historyState('')"></i>
<i class="icon iconfont icon-fanchehui" @click="historyState('reverse')"></i>
<i class="icon iconfont icon-chehui" @click="canvasGeneral.historyState('')"></i>
<i class="icon iconfont icon-fanchehui" @click="canvasGeneral.historyState('reverse')"></i>
<i class="icon iconfont icon-move" @click="setOperation('movePosition')" :class="{active:canvasState == 'movePosition'}"></i>
<!-- <i class="icon iconfont icon-move" @click="setOperation('move')" :class="{active:canvasState == 'move'}"></i> -->
<i class="icon iconfont icon-bianji" @click="setOperation('pencil')" :class="{active:canvasState == 'pencil'}"></i>
@@ -167,7 +167,7 @@ export default defineComponent({
document.removeEventListener('touchmove', touchmove);
let img = new Image();
img.onload = function(){
img.onload = async function(){
loadingShow.value = true
let height = canvasBox.offsetHeight;
canvasWH.value = height
@@ -195,7 +195,7 @@ export default defineComponent({
fabric.Object.prototype.cornerSize = 10
fabric.Object.prototype.transparentCorners = false
fabric.Image.fromURL(props.imgUrl, function(img) {
await fabric.Image.fromURL(props.imgUrl, async function(img) {
// 设置背景图对象的宽度和高度与 canvas 相同
img.scaleToWidth(canvas.width);
img.scaleToHeight(canvas.height);
@@ -204,19 +204,19 @@ export default defineComponent({
scaleY: canvas.height / img.height
});
// 将背景图添加到 canvas 的底层
canvas.setBackgroundImage(img, canvas.renderAll.bind(canvas));
await canvas.setBackgroundImage(img, canvas.renderAll.bind(canvas));
if(!fabric.Object.prototype.controls.deleteControl){
JSSetRemoveImage(deleteObj)
}else{
fabric.Object.prototype.controls.deleteControl.mouseUpHandler = deleteObj
}
setPencilWidth()
updateCanvasState()
canvasGeneral.updateCanvasState()
},{ crossOrigin: "Anonymous" });
// 鼠标抬起事件
canvas.on('mouse:up', function(event) {
if(isMovePostion)isMovePostion = false
if(canvasBtn.canvasState != 'move')updateCanvasState('mouseUp')
// if(canvasBtn.canvasState != 'move')canvasGeneral.updateCanvasState('mouseUp')
});
canvas.on("mouse:down", event=>setCanvasDown(event));
canvas.on('mouse:wheel', opt => {
@@ -248,28 +248,10 @@ export default defineComponent({
})
}
let canvasKeyDown = (event) => {
if(keyDown.indexOf(event.key)>-1){
}else{
keyDown.push(event.code)
if(keyDown.indexOf('ControlLeft') > -1 && keyDown.indexOf('KeyZ') > -1 && keyDown.indexOf('ShiftLeft') > -1){
historyState('reverse')
}else if(keyDown.indexOf('ControlLeft') > -1 && keyDown.indexOf('KeyZ') > -1){
historyState('')
}
}
}
let canvasKeyUp = (event) =>{
keyDown = keyDown.filter(function(item) {
return event.code !== item;
})
}
let clearCanvas = ()=>{
canvasBtn.canvasState = 'move'
canvasBtn.spreadState = false
document.removeEventListener("keydown", canvasKeyDown);
document.removeEventListener("keyup", canvasKeyUp);
canvasGeneral.canvasClear()
}
let mouseMove = (event)=>{
let e = getMousePosition(event,false)
@@ -526,28 +508,6 @@ export default defineComponent({
canvasBtn.canvasPencilWidth[str] = 100; // 设置为最大值
}
}
let updateCanvasState = (str) =>{
if(str != 'mouseUp'){
}
const canvasAsJson = JSON.stringify(canvas.toJSON());
normalCanvasState.value.push(canvasAsJson);
}
//撤回
let historyState = (str)=> {
if(str == 'reverse' && reverseCanvasState.value.length > 0){//反撤回
let obj = reverseCanvasState.value.pop()
// canvasState.value = reverseCanvasState.value[reverseCanvasState.value.length-1]
canvasState.value = obj
normalCanvasState.value.push(obj);
}else if(str == '' && normalCanvasState.value.length > 1){
let obj = normalCanvasState.value.pop()
canvasState.value = normalCanvasState.value[normalCanvasState.value.length-1]
reverseCanvasState.value.push(obj);
}else{
return
}
canvas.loadFromJSON(canvasState.value, () => {});
}
let setSubmit = (liquefation)=>{
return new Promise((resolve,reject)=>{
var allObjects = canvas.getObjects();
@@ -625,8 +585,6 @@ export default defineComponent({
}
let cancelDsign = ()=>{
document.removeEventListener('keydown',canvasKeyDown);
document.removeEventListener('keyup', canvasKeyUp);
showPayOrder.value = false
}
let liquefactionData = ref(null)
@@ -651,7 +609,7 @@ export default defineComponent({
fabric.Object.prototype.controls.deleteControl.mouseUpHandler = deleteObj
}
setPencilWidth()
updateCanvasState()
canvasGeneral.updateCanvasState()
},{ crossOrigin: "Anonymous" });
}
let setLiquefaction =async ()=>{
@@ -681,7 +639,6 @@ export default defineComponent({
setOperation,
setPencilWidth,
setPencilColor,
historyState,
setSubmit,
cancelDsign,
submitLiquefaction,
@@ -690,6 +647,7 @@ export default defineComponent({
brushList,
brushworkValue,
brushworkChange,
canvasGeneral,
};
},
data() {