|
@@ -19,13 +19,13 @@
|
|
|
<el-button size="small" @click="undo">undo</el-button>
|
|
|
<el-button size="small" @click="redo">redo</el-button>
|
|
|
<!-- <el-tooltip class="item" effect="dark" content="双击 item 也可进入编辑状态" placement="top-start"> -->
|
|
|
- <!-- <el-button :class="[cmdStatus=='edit' ? 'heightLight' : '']" size="small" @click="edit">编辑</el-button> -->
|
|
|
+ <!-- <el-button :class="[cmdStatus=='edit' ? 'heightLight' : '']" size="small" @click="edit">编辑</el-button> -->
|
|
|
<!-- </el-tooltip> -->
|
|
|
- <!-- <el-button
|
|
|
+ <el-button
|
|
|
:class="[cmdStatus=='deleteItem' ? 'heightLight' : '']"
|
|
|
size="small"
|
|
|
@click="deleteItem"
|
|
|
- >删除</el-button> -->
|
|
|
+ >删除</el-button>
|
|
|
</div>
|
|
|
<div class="content">
|
|
|
<div class="left">
|
|
@@ -51,6 +51,7 @@ class SScene extends SGraphScene {
|
|
|
constructor() {
|
|
|
super();
|
|
|
this.editCmd = "";
|
|
|
+ this.selectContainer.connect("listChange", this, this.listChange);
|
|
|
}
|
|
|
onMouseDown(event) {
|
|
|
if (this.editCmd == "createLine") {
|
|
@@ -74,6 +75,7 @@ class SScene extends SGraphScene {
|
|
|
addLine(event) {
|
|
|
const lineItem = new EditLineItem(null, []);
|
|
|
lineItem.status = SItemStatus.Create;
|
|
|
+ lineItem.selectable = true;
|
|
|
lineItem.x = event.x;
|
|
|
lineItem.y = event.y;
|
|
|
lineItem.connect("finishCreated", this, this.finishCreated);
|
|
@@ -85,7 +87,7 @@ class SScene extends SGraphScene {
|
|
|
addText(event) {
|
|
|
const textItem = new EditText(null);
|
|
|
textItem.text = "测试文本";
|
|
|
-
|
|
|
+ textItem.selectable = true;
|
|
|
textItem.moveable = true;
|
|
|
textItem.x = event.x;
|
|
|
textItem.y = event.y;
|
|
@@ -101,6 +103,7 @@ class SScene extends SGraphScene {
|
|
|
"https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1591685374103&di=cd5a56b2e3f5e12d7145b967afbcfb7a&imgtype=0&src=http%3A%2F%2Fcdn.duitang.com%2Fuploads%2Fitem%2F201408%2F05%2F20140805191039_cuTPn.jpeg";
|
|
|
imageItem.width = 100;
|
|
|
imageItem.height = 100;
|
|
|
+ imageItem.selectable = true;
|
|
|
imageItem.moveable = true;
|
|
|
imageItem.x = event.x;
|
|
|
imageItem.y = event.y;
|
|
@@ -119,6 +122,19 @@ class SScene extends SGraphScene {
|
|
|
this.undoStack.redo();
|
|
|
this.view.update();
|
|
|
}
|
|
|
+ listChange(list) {
|
|
|
+ this.emitChoice(list);
|
|
|
+ }
|
|
|
+ delete() {
|
|
|
+ let itemList = this.selectContainer.itemList;
|
|
|
+ itemList.forEach((element) => {
|
|
|
+ this.removeItem(element);
|
|
|
+ });
|
|
|
+ if (this.view) {
|
|
|
+ this.view.update();
|
|
|
+ }
|
|
|
+ return itemList;
|
|
|
+ }
|
|
|
}
|
|
|
//注: 开发者引入 SWallItem 包为: import {SWallItem} from "@persagy-web/edit/";
|
|
|
export default {
|
|
@@ -147,6 +163,9 @@ export default {
|
|
|
redo() {
|
|
|
this.scene.redo();
|
|
|
},
|
|
|
+ deleteItem() {
|
|
|
+ this.scene.delete();
|
|
|
+ },
|
|
|
},
|
|
|
watch: {},
|
|
|
beforeCreate() {},
|