新增quickstyle的扩展点，修复线段导出时的坐标问题

2025-12-06 17:18:36 +08:00 · 2024-01-07 23:01:04 +08:00 · 2024-01-07 23:01:04 +08:00 · 6b9a15e573
commit 6b9a15e573
parent a98e9420ae
7 changed files with 114 additions and 31 deletions
--- a/index.html
+++ b/index.html
@ -10,7 +10,7 @@
    <meta name="description" content="DDei在线设计器——简单、好用、免费的在线绘图和流程编排工具。流程设计、UML、思维导图、数据库设计、泳道图、时序图、类图、在线绘图、二次开发、API接口、协作!">
    <meta name="Keywords" content="流程设计,UML,思维导图,数据库设计,泳道图,时序图,类图,在线绘图,免费,二次开发,API接口,协作">
    <meta name="replace">
-    <title>DDei-在线设计器V1.2.44</title>
+    <title>DDei-在线设计器V1.2.45</title>
  </head>
  <body>
    <div id="app"></div>
--- a/package-lock.json
+++ b/package-lock.json
@ -1,19 +1,21 @@
 {
  "name": "ddei-editor",
-  "version": "1.2.45-14",
+  "version": "1.2.45-alpha",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "ddei-editor",
-      "version": "1.2.45-14",
+      "version": "1.2.45-alpha",
      "license": "Apache License 2.0",
+      "dependencies": {
+        "ddei-framework": "^1.2.45-alpha"
+      },
      "devDependencies": {
        "@tsconfig/node18": "^18.2.0",
        "@types/node": "^18.17.6",
        "@vitejs/plugin-vue": "^4.2.3",
        "@vue/tsconfig": "^0.4.0",
-        "ddei-framework": "file:///Users/hoslay/work/ddei/ddei-framework/ddei-framework-1.2.45-14.tgz",
        "less": "^4.2.0",
        "npm-run-all": "^4.1.5",
        "typescript": "~5.1.6",
@ -496,11 +498,9 @@
      }
    },
    "node_modules/ddei-framework": {
-      "version": "1.2.45-14",
-      "resolved": "file:../ddei-framework/ddei-framework-1.2.45-14.tgz",
-      "integrity": "sha512-sumYFhlaVt/3NunO0i1h5aLzfCgMgF/YaUsNh/P2b5hg0dYIEY69O2O2LDD+IXRfFfPND0belKrwcfm1vzs3UA==",
-      "dev": true,
-      "license": "Apache License 2.0",
+      "version": "1.2.45-alpha",
+      "resolved": "https://registry.npmjs.org/ddei-framework/-/ddei-framework-1.2.45-alpha.tgz",
+      "integrity": "sha512-/HVK3syV4jZXciW5UcOGVNEj+5Q8pXMeLtn+M05HRMoNGdYF5waJiI5cZTIc9cQ4rJyU0qfCbwo5LPdJuvw2wQ==",
      "engines": {
        "node": ">=16.0.0"
      }
--- a/package.json
+++ b/package.json
@ -1,6 +1,6 @@
 {
  "name": "ddei-editor",
-  "version": "1.2.45-14",
+  "version": "1.2.45-alpha",
  "private": false,
  "type": "module",
  "author": "hoslay <3697355039@qq.com>",
@ -48,9 +48,6 @@
    "preview": "vite preview",
    "build-only": "vite build",
    "type-check": "vue-tsc --noEmit -p tsconfig.app.json --composite false"
-  },
-  "dependencies": {
-    
  },
  "devDependencies": {
    "@tsconfig/node18": "^18.2.0",
@ -63,6 +60,6 @@
    "vite": "^4.4.6",
    "vite-plugin-compression": "^0.5.1",
    "vue-tsc": "^1.8.6",
-    "ddei-framework": "file:///Users/hoslay/work/ddei/ddei-framework/ddei-framework-1.2.45-14.tgz"
+    "ddei-framework": "^1.2.45-alpha"
  }
 }
--- a/plugins/quickstyle/CanvasQuickDialog.vue
+++ b/plugins/quickstyle/CanvasQuickDialog.vue
@ -2,7 +2,7 @@
  <div :id="editor?.id + '_' + dialogId" v-show="selectedModels?.size > 0" v-if="forceRefresh"
    @mousedown="closeAllDialog()" class='ddei-core-dialog-quickpop'>
    <div v-if="operateState == 50" class="content">
-      <div class="panel12">
+      <div class="panel12" v-if="validItemCondition(options?.setStyle) && (!options || !options.setStyle || !options.setStyle.viewer)">
        <div class="panel12-content-1">
          <component :editor="editor" :controlDefine="editor.currentControlDefine"
            :is="editor?.panels['ddei-core-btn-fontfamily']"></component>
@ -60,8 +60,12 @@
          </component>
        </div>
      </div>
-
-      <div class="panel2" :title="editor.i18n('ddei.brush')" style="border-right:none" @click="execBrushAction($event)">
+      <component v-if="validItemCondition(options?.setStyle) && options?.setStyle?.viewer" :is="options.setStyle.viewer"
+        :editor="editor" :options="options" v-bind="options.setStyle">
+      </component>
+      <div class="panel2"
+        v-if="validItemCondition(options?.brush) && (!options || !options.brush || !options.brush.viewer)"
+        :title="editor.i18n('ddei.brush')" style="border-right:none" @click="execBrushAction($event)">
        <div :class="{ 'panel2-content': true, 'brush-selected': editor?.ddInstance?.stage?.brushDataText }">
          <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-brush"></use>
@ -69,9 +73,13 @@
          <div class="text">{{ editor.i18n('ddei.brush') }}</div>
        </div>
      </div>
+      <component v-if="validItemCondition(options?.brush) && options?.brush?.viewer" :is="options.brush.viewer"
+        :editor="editor" :options="options" v-bind="options.brush">
+      </component>
    </div>
    <div v-if="operateState != 50 && allLine" class="content">
-      <div class="panel6">
+      <div class="panel6"
+        v-if="validItemCondition(options?.linePoint) && (!options || !options.linePoint || !options.linePoint.viewer)">
        <div class="panel6-content1 pointtype">
          <component :editor="editor" :controlDefine="editor.currentControlDefine"
            :is="editor?.panels['ddei-core-btn-linepointtype']" attrCode="sp.type">
@ -90,7 +98,12 @@
          <div class="text">{{ editor.i18n('ddei.endPoint') }}</div>
        </div>
      </div>
-      <div class="panel6" style="border-left:1px solid #E2E2EB;">
+      <component v-if="validItemCondition(options?.linePoint) && options?.linePoint?.viewer"
+        :is="options.linePoint.viewer" :editor="editor" :options="options" v-bind="options.linePoint">
+      </component>
+      <div class="panel6"
+        v-if="validItemCondition(options?.setStyle) && (!options || !options.setStyle || !options.setStyle.viewer)"
+        style="border-left:1px solid #E2E2EB;">
        <div class="panel6-content type">
          <component :editor="editor" :controlDefine="editor.currentControlDefine"
            :is="editor?.panels['ddei-core-btn-linetype']" attrCode="type" img="icon-link-line">
@ -117,7 +130,12 @@
          <div class="text">{{ editor.i18n('ddei.lineDash') }}</div>
        </div>
      </div>
-      <div class="panel6" style="border-left:1px solid #E2E2EB;">
+      <component v-if="validItemCondition(options?.setStyle) && options?.setStyle?.viewer" :is="options.setStyle.viewer"
+        :editor="editor" :options="options" v-bind="options.setStyle">
+      </component>
+      <div class="panel6"
+        v-if="validItemCondition(options?.brush) && (!options || !options.brush || !options.brush.viewer)"
+        style="border-left:1px solid #E2E2EB;">
        <div :class="{ 'panel6-content brush': true, 'brush-selected': editor?.ddInstance?.stage?.brushData }"
          @click="execBrushAction($event)">
          <svg class="icon" aria-hidden="true">
@ -126,10 +144,14 @@
          <div class="text">{{ editor.i18n('ddei.brush') }}</div>
        </div>
      </div>
+      <component v-if="validItemCondition(options?.brush) && options?.brush?.viewer" :is="options.brush.viewer"
+        :editor="editor" :options="options" v-bind="options.brush">
+      </component>

    </div>
    <div v-if="operateState != 50 && !allLine" class="content">
-      <div class="panel1">
+      <div class="panel1"
+        v-if="validItemCondition(options?.fontAndText) && (!options || !options.fontAndText || !options.fontAndText.viewer)">
        <div class="panel1-content-1">
          <component :editor="editor" :controlDefine="editor.currentControlDefine"
            :is="editor?.panels['ddei-core-btn-fontfamily']"></component>
@ -165,7 +187,12 @@
          </component>
        </div>
      </div>
-      <div class="panel2" :title="editor.i18n('ddei.brush') " @click="execBrushAction($event)">
+      <component v-if="validItemCondition(options?.fontAndText) && options?.fontAndText?.viewer"
+        :is="options.fontAndText.viewer" :editor="editor" :options="options" v-bind="options.fontAndText">
+      </component>
+      <div class="panel2"
+        v-if="validItemCondition(options?.brush) && (!options || !options.brush || !options.brush.viewer)"
+        :title="editor.i18n('ddei.brush') " @click="execBrushAction($event)">
        <div :class="{ 'panel2-content': true, 'brush-selected': editor?.ddInstance?.stage?.brushData }">
          <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-brush"></use>
@ -173,7 +200,11 @@
          <div class="text">{{ editor.i18n('ddei.brush') }}</div>
        </div>
      </div>
-      <div class="panel3">
+      <component v-if="validItemCondition(options?.brush) && options?.brush?.viewer" :is="options.brush.viewer"
+        :editor="editor" :options="options" v-bind="options.brush">
+      </component>
+      <div class="panel3"
+        v-if="validItemCondition(options?.setStyle) && (!options || !options.setStyle || !options.setStyle.viewer)">
        <div class="panel3-content i1" @click="showSetStyleDialog($event)">
          <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-shapes"></use>
@ -193,7 +224,11 @@
          <div class="text">{{ editor.i18n('ddei.border') }}</div>
        </div>
      </div>
-      <div class="panel4">
+      <component v-if="validItemCondition(options?.setStyle) && options?.setStyle?.viewer" :is="options.setStyle.viewer"
+        :editor="editor" :options="options" v-bind="options.setStyle">
+      </component>
+      <div class="panel4"
+        v-if="validItemCondition(options?.changeLevel) && (!options || !options.changeLevel || !options.changeLevel.viewer)">
        <div class="panel4-content" @click="doPush('top')">
          <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-move-top"></use>
@ -206,9 +241,12 @@
          </svg>
          <div class="text">{{ editor.i18n('ddei.pushBottom') }}</div>
        </div>
-
      </div>
-      <div class="panel5" :style="{ 'display': canMerge() || canCancelMerge() ? '' : 'none' }">
+      <component v-if="validItemCondition(options?.changeLevel) && options?.changeLevel?.viewer"
+        :is="options.changeLevel.viewer" :editor="editor" :options="options" v-bind="options.changeLevel">
+      </component>
+      <div v-if="validItemCondition(options?.merge) && (!options || !options.merge || !options.merge.viewer)"
+        class="panel5" :style="{ 'display': canMerge() || canCancelMerge() ? '' : 'none' }">
        <div class="panel5-content" v-show="canMerge()" @click="canMerge() && doMerge()">
          <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-merge"></use>
@ -228,6 +266,9 @@
          <div class="text">{{ editor.i18n('ddei.align') }}</div>
        </div>
      </div>
+      <component v-if="validItemCondition(options?.merge) && options?.merge?.viewer" :is="options.merge.viewer"
+        :editor="editor" :options="options" v-bind="options.merge">
+      </component>
    </div>
  </div>
 </template>
@ -277,6 +318,16 @@ export default {
  },
  methods: {

+    validItemCondition(item) {
+      if (!item || !item.condition) {
+        return true;
+      } else {
+        let func = new Function("models", "item", "editor", "component", "return " + item.condition)
+        let rs = func(this.selectedModels, item, this.editor, this)
+        return rs
+      }
+    },
+
    forceRefreshView: function () {
      this.forceRefresh = false
      this.$nextTick(() => {
--- a/plugins/quickstyle/canvasquickdialog.ts
+++ b/plugins/quickstyle/canvasquickdialog.ts
@ -7,7 +7,7 @@ class DDeiCoreCanvasQuickDialog extends DDeiPluginBase {
  /**
   * 缺省实例
   */
-  static defaultIns: DDeiCoreCanvasQuickDialog = new DDeiCoreCanvasQuickDialog(null);
+  static defaultIns: DDeiCoreCanvasQuickDialog = new DDeiCoreCanvasQuickDialog();


  plugins: object[] = [CanvasQuickDialog]
@ -44,4 +44,5 @@ class DDeiCoreCanvasQuickDialog extends DDeiPluginBase {
  }
 }

+export { DDeiCoreCanvasQuickDialog }
 export default DDeiCoreCanvasQuickDialog
--- a/src/App.vue
+++ b/src/App.vue
@ -4,7 +4,7 @@ import { DDeiCoreToolboxSimplePanel, DDeiCoreTopMenuSimplePanel, DDeiCoreThemeBl
 import { DDeiExtUML } from "@ddei/uml"
 import { DDeiExtSearch } from "@ddei/search"
 import { DDeiFuncCallResult, DDeiUtil, DDeiEditorUtil } from "ddei-framework";
-import DDeiExtQuickStyle from "@ddei/quickstyle"
+import {DDeiExtQuickStyle,DDeiCoreCanvasQuickDialog} from "@ddei/quickstyle"
 import DDeiExtTooltip from "@ddei/tooltip"
 import { DDeiExtQuickControl, QuickChooseControlDialog } from "@ddei/quickcontrol"
 import { defineComponent, markRaw } from "vue";
@ -13,6 +13,7 @@ import ReplaceDivDemo  from "./ReplaceDivDemo.vue";
 import HtmlTooltipDemo from "./HtmlTooltipDemo.vue";
 import {controls as ControlDefinesDemo,groups as GroupDefinesDemo} from "./controldefinesdemo"
 import TopMenuViewerDemo from "./TopMenuViewerDemo.vue"
+import QuickStyleDemo from "./QuickStyleDemo.vue"
 // import i18nJP from "./langs/ja_JP"

 export default defineComponent({
@ -28,12 +29,18 @@ export default defineComponent({
      currentLayout = "ddei-core-layout-mobile"
    }else{
      exts = [DDeiExtTooltip,
-      DDeiExtQuickStyle]
+        DDeiExtQuickStyle,
+        DDeiCoreCanvasQuickDialog.configuration({
+          changeLevel:{
+            viewer:QuickStyleDemo
+          }
+        }),
+      ]
    }
    const options = markRaw({
      currentLayout: currentLayout,
      config: {
-        // ratio: 1.2, //默认缩放比例为120%
+        ratio: 0.6, //默认缩放比例为120%
        pixel:2, //调整渲染质量
        // readonly:true,
        // readonly:1,
@ -77,7 +84,13 @@ export default defineComponent({
              // }
            
          ]
-        }
+        },
+        
+      },
+      onMounted: (editor) => {
+        
+        let file = editor.files[editor.currentFileIndex]
+        file.sheets[file.currentSheetIndex].stage.mark = {type:1,data:'新值' }
      },
      // i18n: {  //国际化配置
      //   lang: "ja_JP", //强制设定语言，如果不设置则读取浏览器的语言设置
--- a/src/QuickStyleDemo.vue
+++ b/src/QuickStyleDemo.vue
@ -0,0 +1,21 @@
+<script lang="ts">
+export default {
+  name: "html-tooltip-div-demo",
+  props: {
+    options: {
+      type: Object,
+      default: null
+    },
+    editor:{
+      type:Object,
+      default:null
+    }
+  }
+};
+</script>
+<template>
+  <div class="panel4">
+    扩展内容
+  </div>
+       
+</template>