|
|
@@ -6,6 +6,9 @@ import { CompObject } from "../../controllers/SelectCtrl/compObj";
|
|
|
import { DesignComp } from "../../objects/DesignTemp/DesignComp";
|
|
|
import { ICompKeys, Layout } from "../../typings";
|
|
|
import CompSave from "../../components/CompSave";
|
|
|
+import { ObjsContainer } from "../../controllers/SelectCtrl/ObjsContainer";
|
|
|
+import { getKeyThenIncreaseKey } from "ant-design-vue/lib/message";
|
|
|
+import { Matrix } from "../../controllers/SelectCtrl/matrix";
|
|
|
|
|
|
export const editActions = EditorModule.action({
|
|
|
pickComp(compId: string, selected = true) {
|
|
|
@@ -53,6 +56,7 @@ export const editActions = EditorModule.action({
|
|
|
compKey != "Triangle" &&
|
|
|
compKey != "Ellipse" &&
|
|
|
compKey != "Polygon" &&
|
|
|
+ compKey != "PolygonNormal" &&
|
|
|
compKey != "Curve";
|
|
|
|
|
|
let yOffset = 0;
|
|
|
@@ -110,25 +114,12 @@ export const editActions = EditorModule.action({
|
|
|
},
|
|
|
|
|
|
// 通过点击添加组件到画布
|
|
|
- async clickCompUserToDesign(id: string) {
|
|
|
+ async clickCompUserToDesign(id: string, isSys) {
|
|
|
if (!this.store.currStreamCardId) {
|
|
|
queenApi.messageError("请先选中一个卡片");
|
|
|
return;
|
|
|
}
|
|
|
-
|
|
|
- const { result } = await this.https.getCompDetail(id);
|
|
|
-
|
|
|
-
|
|
|
- let yOffset = 0;
|
|
|
- if (
|
|
|
- this.store.currCompId != this.store.currStreamCardId &&
|
|
|
- this.store.currCompId != "root"
|
|
|
- ) {
|
|
|
- const bound = this.helper.getCardCompBound(this.store.currCompId);
|
|
|
- yOffset = bound.y + bound.h;
|
|
|
- }
|
|
|
-
|
|
|
- let currCard = this.store.currStreamCard;
|
|
|
+ const { result } = await this.https.getCompDetail(id, isSys);
|
|
|
|
|
|
//先创建卡片
|
|
|
const currCardIndex = this.store.streamCardIds.indexOf(this.store.currStreamCardId) + 1;
|
|
|
@@ -136,7 +127,7 @@ export const editActions = EditorModule.action({
|
|
|
"Container",
|
|
|
currCardIndex
|
|
|
);
|
|
|
- currCard = this.helper.findComp(cardId) as DesignComp;
|
|
|
+ const currCard = this.helper.findComp(cardId) as DesignComp;
|
|
|
|
|
|
const comp = this.store.addUserCard(result);
|
|
|
|
|
|
@@ -148,36 +139,72 @@ export const editActions = EditorModule.action({
|
|
|
const addedComp = this.store.compMap[compId];
|
|
|
addedComp.layout.position = "absolute";
|
|
|
|
|
|
- const currComp = this.helper.findComp(compId) as DesignComp;
|
|
|
+ this.actions.initAddedCompPos(this.store.currCompId, compId, cardId);
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ initAddedCompPos(currId: string, addedId:string, cardId:string) {
|
|
|
+ let yOffset = 0;
|
|
|
+ if (
|
|
|
+ currId != this.store.currStreamCardId &&
|
|
|
+ currId != "root"
|
|
|
+ ) {
|
|
|
+ const bound = this.helper.getCardCompBound(currId);
|
|
|
+ yOffset = bound.y + bound.h;
|
|
|
+ }
|
|
|
+
|
|
|
+ const currComp = this.helper.findComp(addedId) as DesignComp;
|
|
|
|
|
|
//添加组件到当前选中的组件下面
|
|
|
let xOffset = this.helper.designSizeToPx(
|
|
|
375 - (currComp.layout.size?.[0] || 750) / 2
|
|
|
);
|
|
|
const obj = new CompObject(currComp);
|
|
|
+
|
|
|
+ const currCard = this.helper.findComp(cardId) as DesignComp;
|
|
|
+
|
|
|
//没有选中组件添加到当前卡片最后
|
|
|
const children = currCard.children.default || [];
|
|
|
if (yOffset == 0 && children.length >= 2) {
|
|
|
- const prevCompIndex = children.indexOf(compId) - 1;
|
|
|
+ const prevCompIndex = children.indexOf(addedId) - 1;
|
|
|
const bound = this.helper.getCardCompBound(children[prevCompIndex]);
|
|
|
yOffset = bound.y + bound.h;
|
|
|
}
|
|
|
obj.worldTransform.translate(xOffset, yOffset);
|
|
|
currComp.layout.transformMatrix = obj.worldTransform.getMatrixStr();
|
|
|
-
|
|
|
- this.actions.pickComp(compId);
|
|
|
+ this.actions.pickComp(addedId);
|
|
|
this.helper.extendStreamCard(currCard.id);
|
|
|
this.controls.cropCtrl.close();
|
|
|
-},
|
|
|
+ },
|
|
|
|
|
|
|
|
|
// 通过拖拽添加组件到画布
|
|
|
- async dragCompToDesign(event: MouseEvent, compKey: ICompKeys) {
|
|
|
- await this.actions.addCompToDesign(compKey);
|
|
|
+ async dragCompToDesign(event: MouseEvent, compKey: string, data:any) {
|
|
|
+
|
|
|
+ const currCardDom = this.store.currStreamCard.$el;
|
|
|
+
|
|
|
+ if (compKey == "CompCard") {
|
|
|
+ const { result } = await this.https.getCompDetail(data.id, data.isSys);
|
|
|
+ const comp = this.store.addUserCard(result);
|
|
|
+
|
|
|
+ const currCard = this.store.currStreamCard;
|
|
|
+ const compId = comp.id;
|
|
|
+ const childIds = [...(currCard.children.default || [])];
|
|
|
+ childIds.push(compId);
|
|
|
+ currCard.children.default = childIds;
|
|
|
+
|
|
|
+ const addedComp = this.store.compMap[compId];
|
|
|
+ addedComp.layout.position = "absolute";
|
|
|
+
|
|
|
+ this.actions.pickComp(compId);
|
|
|
+
|
|
|
+ } else {
|
|
|
+ await this.actions.addCompToDesign(compKey as any);
|
|
|
+ }
|
|
|
|
|
|
const cardPoints = this.helper.getPointOffsetWith(
|
|
|
event,
|
|
|
- this.store.currStreamCard.$el
|
|
|
+ currCardDom
|
|
|
);
|
|
|
const { currComp } = this.store;
|
|
|
let selCtrl = this.controls.selectCtrl;
|
|
|
@@ -514,8 +541,60 @@ export const editActions = EditorModule.action({
|
|
|
},
|
|
|
// 取消打组
|
|
|
cancelGroupComps(groupComp: DesignComp) {
|
|
|
- this.controls.transferCtrl.groupCtrl.cancelGroup(groupComp);
|
|
|
- this.store.setCurrComp(groupComp.children.default?.[0] as string);
|
|
|
+ console.log("cancel group");
|
|
|
+
|
|
|
+ const childs = groupComp.children.default || [];
|
|
|
+ const objC = this.controls.selectCtrl.objContainer as ObjsContainer;
|
|
|
+ const parentMtrx = objC.parent.worldTransform.clone();
|
|
|
+ childs.forEach(o=>{
|
|
|
+ const obj = this.helper.findComp(o) as DesignComp;
|
|
|
+ const mxt = Matrix.createFromMatrixStr(obj.layout.transformMatrix as string);
|
|
|
+ mxt.prepend(parentMtrx);
|
|
|
+ obj.layout.transformMatrix = mxt.getMatrixStr();
|
|
|
+ })
|
|
|
+ const paths = this.helper.getCompTrees(groupComp.id)
|
|
|
+ const card = paths[1];
|
|
|
+ const parentChilds = (card.children.default || []).filter(item=>item != groupComp.id);
|
|
|
+ parentChilds.push(...childs);
|
|
|
+ card.children.default = childs;
|
|
|
+
|
|
|
+ this.actions.selectObjs([childs[0]]);
|
|
|
+ },
|
|
|
+
|
|
|
+ createGroupComps() {
|
|
|
+ const selectCtrl = this.controls.selectCtrl;
|
|
|
+ const Objc = this.controls.selectCtrl.objContainer as ObjsContainer;
|
|
|
+ const id = this.controls.compUICtrl.createCompId("Group");
|
|
|
+ const comp = this.helper.findComp(id) as DesignComp;
|
|
|
+ comp.layout.position = "absolute";
|
|
|
+
|
|
|
+ //先删除现有的节点
|
|
|
+ const sels = this.store.selected.slice(0);
|
|
|
+ const chils = this.store.currStreamCard.children.default || [];
|
|
|
+ const newChilds :any = [];
|
|
|
+ chils.forEach(c=>{
|
|
|
+ if (sels.indexOf(c) == -1) newChilds.push(c);
|
|
|
+ })
|
|
|
+
|
|
|
+ newChilds.push(id);
|
|
|
+ this.store.currStreamCard.children.default = newChilds;
|
|
|
+
|
|
|
+ //更新节点的新位置
|
|
|
+ Objc.parent.children.forEach(obj=>{
|
|
|
+ const cobj = obj as CompObject;
|
|
|
+ const comp = cobj.comp;
|
|
|
+ comp.layout.transformMatrix = cobj.localTransform.getMatrixStr();
|
|
|
+ })
|
|
|
+
|
|
|
+ //再添加新的节点
|
|
|
+ comp.layout.size = [this.helper.pxToDesignSize(Objc.width), this.helper.pxToDesignSize(Objc.height)];
|
|
|
+ comp.layout.transformMatrix = selectCtrl.transferStyle.matrix;
|
|
|
+ comp.children.default = sels;
|
|
|
+
|
|
|
+ this.actions.selectObjs([])
|
|
|
+ setTimeout(() => {
|
|
|
+ this.actions.pickComp(comp.id);
|
|
|
+ }, 0);
|
|
|
},
|
|
|
|
|
|
handleSelectMoving(key: string) {
|
