开发保存1

package-lock.json

@@ -1,15 +1,15 @@
 {
   "name": "ddei-editor",
-  "version": "1.2.40",
+  "version": "1.2.41-22",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "ddei-editor",
-      "version": "1.2.40",
+      "version": "1.2.41-22",
       "license": "Apache License 2.0",
       "dependencies": {
-        "ddei-framework": "^1.2.40"
+        "ddei-framework": "file:///Users/hoslay/work/ddei/ddei-framework/ddei-framework-1.2.41-22.tgz"
       },
       "devDependencies": {
         "@tsconfig/node18": "^18.2.0",
@@ -518,9 +518,10 @@
       "integrity": "sha512-tdMuLdcJyreope1BWfnYqTQaIkSIrU/KtY9yX5mNGd+tYeJ0Y99ARHDuYnEABPX/8yh/r0Kl169v5ODg2vr98g=="
     },
     "node_modules/ddei-framework": {
-      "version": "1.2.40",
+      "version": "1.2.41-22",
-      "resolved": "https://registry.npmjs.org/ddei-framework/-/ddei-framework-1.2.40.tgz",
+      "resolved": "file:../ddei-framework/ddei-framework-1.2.41-22.tgz",
-      "integrity": "sha512-wZ4i1jkoTNBsJ0IdhT4EFiOlgV/PfeGqkLWYy8yCi69s6/x6osKqThR7D92TtNsRgZ+asC/EXPsYXq0I016h5w==",
+      "integrity": "sha512-9MiMZcTwN/rpaqj+wBETFEYB6awbKdSvDtXznVRlwMVzucRL/mLc47TV3IpWDhTBTaxGd3LvO8b+e0D6HiOBlQ==",
+      "license": "Apache License 2.0",
       "dependencies": {
         "ddei-autolink": "^1.1.1",
         "lodash": "^4.17.21",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ddei-editor",
-  "version": "1.2.40",
+  "version": "1.2.41-22",
   "private": false,
   "type": "module",
   "author": "hoslay <3697355039@qq.com>",
@@ -49,7 +49,7 @@
     "type-check": "vue-tsc --noEmit -p tsconfig.app.json --composite false"
   },
   "dependencies": {
-    "ddei-framework": "^1.2.40"
+     "ddei-framework": "file:///Users/hoslay/work/ddei/ddei-framework/ddei-framework-1.2.41-22.tgz"
   },
   "devDependencies": {
     "@tsconfig/node18": "^18.2.0",

plugins/core/hotkeys/actions/key-action-cancel-quick-edit.ts

@@ -59,7 +59,12 @@ class DDeiKeyActionCancelQuickEdit extends DDeiKeyAction {
       let editor = DDeiEditor.ACTIVE_INSTANCE;
       let inputEle = editor.quickEditorInput;
       inputEle.value = "";
+      if (ddInstance.stage.render.editorShadowControl?.isShadowControl){
+        ddInstance.stage.render.editorShadowControl.destroyed()
+      }
       ddInstance.stage.render.editorShadowControl = null;
+      
+      ddInstance.stage.render.editorShadowControl.destr
       editor.quickEditorModel = null
       delete ddInstance.stage.brushDataText
       editor.changeState(DDeiEditorState.DESIGNING);

plugins/core/hotkeys/actions/key-action-start-quick-edit.ts

@@ -64,6 +64,8 @@ class DDeiKeyActionStartQuickEdit extends DDeiKeyAction {
     //获取当前编辑控件
     if (ddInstance.stage?.selectedModels?.size == 1) {
       let model = Array.from(ddInstance.stage?.selectedModels.values())[0]
+      let rsState1 = DDeiUtil.invokeCallbackFunc("EVENT_CONTROL_VIEW", DDeiEnumOperateType.VIEW, { models: [model] }, ddInstance, null)
+      if (rsState1 == 0 || rsState1 == 1) {
         let editor = DDeiEditor.ACTIVE_INSTANCE;
 
         let editState = DDeiUtil.invokeCallbackFunc("EVENT_CONTROL_EDIT_BEFORE", DDeiEnumOperateType.EDIT, { models: [model] }, ddInstance, null)
@@ -259,6 +261,7 @@ class DDeiKeyActionStartQuickEdit extends DDeiKeyAction {
         }
       }
     }
+  }
 
 }
 

plugins/core/lifecycle/render-lifecycle.ts

@@ -9,7 +9,7 @@ class DDeiCoreRenderLifeCycle extends DDeiLifeCycle {
    */
   static defaultIns: DDeiCoreRenderLifeCycle = new DDeiCoreRenderLifeCycle();
 
-  EVENT_CONTROL_VIEW_BEFORE: DDeiFuncData | null = new DDeiFuncData("render-drawshape", 1, (operateType, data, ddInstance, evt) => {
+  EVENT_CONTROL_VIEW: DDeiFuncData | null = new DDeiFuncData("render-drawshape", 1, (operateType, data, ddInstance, evt) => {
     return this.htmlDrawShape(operateType, data, ddInstance, evt)
   });
 
@@ -60,6 +60,7 @@ class DDeiCoreRenderLifeCycle extends DDeiLifeCycle {
       for (let i = 0; i < models?.length; i++) {
         if (models[i].modelType != 'DDeiStage' && models[i].modelType != 'DDeiLayer' && models[i] && models[i].id) {
           editor.renderViewerIns[models[i].id] = null
+          editor.renderViewerElements[models[i].id] = null
           for (let n = 0; n < editor.renderViewers.length; n++) {
             if (editor.renderViewers[n]?.model?.id == models[i].id) {
               editor.renderViewers.splice(n,1)
@@ -77,9 +78,9 @@ class DDeiCoreRenderLifeCycle extends DDeiLifeCycle {
 
   hiddenAllHtmlShape(operate, data, ddInstance, evt) {
     let editor = DDeiEditorUtil.getEditorInsByDDei(ddInstance);
-    for (let i in editor.renderViewerIns){
+    for (let i in editor.renderViewerElements){
-      if (editor.renderViewerIns[i]){
+      if (editor.renderViewerElements[i]){
-        editor.renderViewerIns[i].style.display = "none"
+        editor.renderViewerElements[i].style.display = "none"
       }
     }
   }
@@ -94,26 +95,13 @@ class DDeiCoreRenderLifeCycle extends DDeiLifeCycle {
       let canvasDomPos = DDeiUtil.getDomAbsPosition(canvasEle);
       for (let i = 0; i < models?.length; i++) {
         if (models[i].modelType != 'DDeiStage' && models[i].modelType != 'DDeiLayer' && models[i] && models[i].id) {
-          let displayDiv = editor.renderViewerIns[models[i].id]
+          let displayViewer = editor.renderViewerIns[models[i].id]
           
-          if (displayDiv) {
+         
+          if (displayViewer) {
+            let displayDiv = editor.renderViewerElements[models[i].id]
             if(operate == 'VIEW'){
-              let ruleWeight = 0
+              this.refreshView(models[i], displayDiv,data.tempShape, data.composeRender)
-              
-              if (ddInstance.stage.render.tempRuleDisplay == 1 || ddInstance.stage.render.tempRuleDisplay == '1'){
-                ruleWeight = 15
-              }
-              
-              let modelPos = DDeiUtil.getModelsDomAbsPosition([models[i]])
-              let rat1 = window.remRatio
-              displayDiv.style.position = 'absolute'
-              displayDiv.style.left = (modelPos.left * rat1 - canvasDomPos.left - ruleWeight) + "px"
-              displayDiv.style.top = (modelPos.top * rat1 - canvasDomPos.top - ruleWeight) + "px"
-              displayDiv.style.display = "block"
-              displayDiv.style.zIndex = 300;
-              displayDiv.style.width = (modelPos.width * rat1) + "px";
-              displayDiv.style.height = (modelPos.height * rat1) + "px";
-              displayDiv.style.pointerEvents = "none"
               rs.state = -1;
               return rs
             }else if(operate == 'VIEW-HIDDEN'){
@@ -151,6 +139,99 @@ class DDeiCoreRenderLifeCycle extends DDeiLifeCycle {
 
     return rs;
   }
+
+  //刷新数据
+  refreshView(model, shapeElement ,tempShape, composeRender) {
+    let stage = model.stage
+    let ddInstance = stage.ddInstance
+    let editor = DDeiEditorUtil.getEditorInsByDDei(ddInstance)
+
+    let render = model.render
+    let ruleWeight = 0
+    if (stage.render.tempRuleDisplay == 1 || stage.render.tempRuleDisplay == '1') {
+      ruleWeight = 15
+    }
+    //位置
+    let canvasEle = document.getElementById(editor.id + "_canvas");
+    let canvasDomPos = DDeiUtil.getDomAbsPosition(canvasEle);
+
+    let stageRatio = model.getStageRatio()
+    //创建图形，修改图形大小、旋转、边框等属性，以及移动图形位置
+
+    //获取model的绝对位置
+    let modelPos = DDeiUtil.getModelsDomAbsPosition([model])
+
+    let rat1 = window.remRatio
+
+    //大小
+    shapeElement.style.width = (model.width * rat1) + "px"
+    shapeElement.style.height = (model.height * rat1) + "px"
+
+    //旋转,缩放
+    let transform = ""
+    if (stageRatio > 0 && stageRatio != 1) {
+      transform += " scale(" + stageRatio + ")"
+    }
+
+    if (model.rotate) {
+      transform += " rotate(" + model.rotate + "deg)"
+    }
+    if (transform) {
+      shapeElement.style.transform = transform
+    }
+
+    //边框
+    let type = tempShape?.border?.type || tempShape?.border?.type == 0 ? tempShape?.border?.type : render.getCachedValue("border.type")
+    let opacity = tempShape?.border?.opacity || tempShape?.border?.opacity == 0 ? tempShape?.border?.opacity : render.getCachedValue("border.opacity");
+    let width = tempShape?.border?.width || tempShape?.border?.width == 0 ? tempShape?.border?.width : render.getCachedValue("border.width");
+    let dash = tempShape?.border?.dash || tempShape?.border?.dash == 0 ? tempShape?.border?.dash : render.getCachedValue("border.dash");
+    let color = tempShape?.border?.color || tempShape?.border?.color == 0 ? tempShape?.border?.color : render.getCachedValue("border.color");
+    let drawLine = ((type == 1 || type == '1') && width > 0)
+    if (drawLine) {
+      let type = !dash || dash.length == 0 ? "solid" : "dashed"
+      if (!color) {
+        color = "var(--border)"
+      }
+      if (opacity >= 0 && opacity < 1) {
+        let value16 = parseInt(opacity * 255)
+        color += value16.toString(16);
+      }
+      shapeElement.style.setProperty("--borderColor", color)
+      shapeElement.style.setProperty("--borderType", type)
+      shapeElement.style.setProperty("--borderWidth", width + "px")
+    }
+
+    shapeElement.style.left = ((modelPos.left + (model.width * stageRatio - model.width) / 2 - 2 - width / 2) * rat1 - canvasDomPos.left - ruleWeight) + "px"
+    shapeElement.style.top = ((modelPos.top + (model.height * stageRatio - model.height) / 2 - 2 - width / 2) * rat1 - canvasDomPos.top - ruleWeight) + "px"
+
+
+    //背景
+    //如果被选中，使用选中的颜色填充,没被选中，则使用默认颜色填充
+    let fillColor = tempShape?.fill?.color ? tempShape.fill.color : render.getCachedValue("fill.color");
+    if (!fillColor) {
+      fillColor = DDeiUtil.getStyleValue("canvas-control-background", ddInstance);
+    }
+    let fillOpacity = tempShape?.fill?.opacity ? tempShape.fill.opacity : render.getCachedValue("fill.opacity");
+
+    let fillType = tempShape?.fill?.type ? tempShape.fill.type : render.getCachedValue("fill.type");
+    if (fillType == 1) {
+
+      if (fillOpacity >= 0 && fillOpacity < 1) {
+        let value16 = parseInt(fillOpacity * 255)
+        fillColor += value16.toString(16);
+      }
+      shapeElement.style.setProperty("--fillColor", fillColor)
+    }
+    //圆角
+    let round = tempShape?.border?.round ? tempShape?.border?.round : render.getCachedValue("border.round");
+    if (round){
+      shapeElement.style.setProperty("--borderRound", round+"px")
+    }
+    //zIndex
+    shapeElement.style.zIndex = model.render.tempZIndex
+
+    shapeElement.style.display = "block"
+  }
 }
 
 export default DDeiCoreRenderLifeCycle

plugins/htmlviewer/htmlviewer-lifecycle.ts

@@ -11,7 +11,7 @@ class DDeiExtHtmlViewerLifeCycle extends DDeiLifeCycle {
     matchField:"code"
   });
 
-  EVENT_CONTROL_VIEW_BEFORE: DDeiFuncData | null = new DDeiFuncData("htmlviewer-drawshape", 1, (operateType, data, ddInstance, evt) => {
+  EVENT_CONTROL_VIEW: DDeiFuncData | null = new DDeiFuncData("htmlviewer-drawshape", 1, (operateType, data, ddInstance, evt) => {
     return this.htmlDrawShape(operateType, data, ddInstance, evt)
   });
 
@@ -66,9 +66,9 @@ class DDeiExtHtmlViewerLifeCycle extends DDeiLifeCycle {
 
   hiddenAllHtmlShape(operate, data, ddInstance, evt) {
     let editor = DDeiEditorUtil.getEditorInsByDDei(ddInstance);
-    for (let i in editor.renderViewerIns){
+    for (let i in editor.renderViewerElements){
-      if (editor.renderViewerIns[i]){
+      if (editor.renderViewerElements[i]){
-        editor.renderViewerIns[i].style.display = "none"
+        editor.renderViewerElements[i].style.display = "none"
       }
     }
   }

src/HtmlViewerDemo.vue

@@ -13,7 +13,8 @@ export default {
     }
   },
   mounted() {
-    this.editor.renderViewerIns[this.model.id] = this.$refs['divElement']
+    this.editor.renderViewerIns[this.model.id] = this
+    this.editor.renderViewerElements[this.model.id] = this.$refs['divElement']
     this.editor.bus.push(DDeiEnumBusCommandType.RefreshShape);
     this.editor.bus.executeAll();
   }

src/ReplaceDivDemo.vue

@@ -37,7 +37,8 @@ export default {
   },
   mounted() {
     let field = this.matchField;
-    this.editor.renderViewerIns[this[field]] = this.$refs['divElement']
+    this.editor.renderViewerIns[this[field]] = this
+    this.editor.renderViewerElements[this[field]] = this.$refs['divElement']
   },
   methods: {
     

src/editor/index.ts

@@ -9,5 +9,6 @@ export * from "@ddei/search";
 export * from "@ddei/tooltip";
 export * from "@ddei/quickcontrol";
 export * from "@ddei/htmlviewer";
+export * from "./grouputil";
 export { DDeiEditorView};
 export default DDeiEditorView;

vite.config.ts

@@ -13,7 +13,7 @@ export default defineConfig({
     alias: {
       '@': fileURLToPath(new URL('./src', import.meta.url)),
       '@ddei': fileURLToPath(new URL('./plugins', import.meta.url)),
-      // 'ddei-framework': fileURLToPath(new URL('/Users/hoslay/work/ddei/ddei-framework/dist/ddei-framework.js', import.meta.url)),
+      'ddei-framework': fileURLToPath(new URL('/Users/hoslay/work/ddei/ddei-framework/dist/ddei-framework.js', import.meta.url)),
     }
   },