取消拖拽上下文

src/components/setting/cross-dot-style.js

@@ -1,8 +1,8 @@
 import { pinkLog } from '@/hook/utils';
 import { reactive } from 'vue';
 
-export const connectionStyles = reactive({
+
-    currentStyle: 'connect',
+export const crossDotStyle = reactive({
     options: [
         {
             value: 'slice',

src/components/setting/index.vue

@@ -89,11 +89,11 @@
                         <el-select
                             name="language-setting"
                             class="language-setting"
-                            v-model="connectionStyles.currentStyle"
+                            v-model="globalSetting.crossDotStyle"
                             @change="onConnectStyleChange"
                         >
                             <el-option
-                                v-for="option in connectionStyles.options"
+                                v-for="option in crossDotStyle.options"
                                 :value="option.value"
                                 :label="option.text"
                                 :key="option.value">
@@ -143,7 +143,7 @@ import { globalSetting } from '@/hook/global';
 import { reactive, defineComponent, watch, ref, onMounted } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { languageSetting } from './language';
-import { connectionStyles, onConnectStyleChange } from './connect-style';
+import { crossDotStyle, onConnectStyleChange } from './cross-dot-style';
 import { colorManager, onGeneralColorChange, predefinedColors } from './color';
 
 defineComponent({ name: "dide-setting" });

src/hook/global.js

@@ -7,13 +7,35 @@ import { NetlistRender } from './render';
 export const emitter = mitt();
 
 export const globalSetting = reactive({
+    /**
+     * @description 当前的系统语言
+     * @type { 'zh' | 'en' | 'zhTw' | 'ja' | 'de' | 'ko' | 'ru' | 'fr' | 'ar' }
+     */
     language: 'zh',
-    // 开启渲染动画
+
+    /**
+     * @description 开启渲染动画
+     * @type {boolean}
+     */
     renderAnimation: true,
-    // 绘制箭头
+
+    /**
+     * @description 绘制箭头
+     * @type {boolean}
+     */
     renderArrow: false,
-    // 加粗多位宽的线
+
-    boldMultiWidthWire: true
+    /**
+     * @description 加粗多位宽的线
+     * @type {boolean}
+     */
+    boldMultiWidthWire: true,
+    
+    /**
+     * @description 当前交叉点的样式
+     * @type {'connect' | 'slice' | 'concat'} currentStyle
+     */
+    crossDotStyle: 'connect'
 });
 
 export const globalLookup = reactive({

src/hook/render/cell.js

@@ -62,7 +62,7 @@ export class CellRender {
             })
             .each(function (data) {
                 const cellSelection = d3.select(this);
-                const manager = _this.createDataManager(cellSelection, data);
+                // const manager = _this.createDataManager(cellSelection, data);
 
                 // TODO: 实现拖拽
                 // registerDragEvent(manager, rootRender);

src/hook/render/connection.js

@@ -66,7 +66,7 @@ export class ConnectionRender {
             .attr('r', d => d.r)
             .each(function (data) {
                 const selection = d3.select(this);
-                const manager = _this.createDataManager(selection, data);
+                // const manager = _this.createDataManager(selection, data);
             });
 
         this.selections = connectionSelections;

src/hook/render/cross-dot.js

@@ -26,19 +26,13 @@ export class CrossDotRender {
     }
 
     /**
-     * @description 将 elknode 关于 module connection 的数据添加为 d3 数据项目
+     * @description 将 cross dot 的数据添加为 d3 数据项目
-     * @param {ElkPort} cellPort 连接点对象
-     * @param {ElkNode} node 当前的实体（port/例化模块/器件）
      */
-    addAsD3DataItem(cellPort, node) {
+    addAsD3DataItem(x, y) {        
         this.data.push({
             id: this.crossId,
-            x: cellPort.x + node.x,
+            x,
-            y: cellPort.y + node.y + 0.5,       // 0.5 是为了线宽
+            y,
-            width: cellPort.width,
-            height: cellPort.height,
-            text: '',
-            r: 3.5
         });
 
         this.crossId ++;
@@ -69,33 +63,10 @@ export class CrossDotRender {
             .attr('r', d => d.r)
             .each(function (data) {
                 const selection = d3.select(this);
-                const manager = _this.createDataManager(selection, data);
+                // const manager = _this.createDataManager(selection, data);
             });
 
         this.selections = connectionSelections;
         return connectionSelections;
     }
-
-    /**
-     * 
-     * @param {d3.Selection} selection 
-     * @param {BasicD3DataItem} data 
-     * @returns {BasicD3ManagmentItem}
-     */
-    createDataManager(selection, data) {
-        const id2manager = this.id2manager;
-        // connection 不需要拖拽上下文
-        const managerItem = {
-            data,
-            selection,
-            type: 'connection'
-        };
-
-        if (!id2manager.has(data.id)) {
-            id2manager.set(data.id, []);
-        }
-
-        id2manager.get(data.id).push(managerItem);
-        return managerItem;
-    }
 }

src/hook/render/instantiation.js

@@ -220,7 +220,7 @@ export class InstantiationRender {
             .attr('class', 'grab')
             .each(function (data) {                    
                 const portSelection = d3.select(this);
-                const manager = _this.createDataManager(portSelection, data);
+                // const manager = _this.createDataManager(portSelection, data);
 
                 // TODO: 实现拖拽
                 // registerDragEvent(manager, rootRender);       

src/hook/render/port.js

@@ -92,7 +92,7 @@ export class PortRender {
             .attr('class', 'grab')
             .each(function (data) {                    
                 const portSelection = d3.select(this);
-                const manager = _this.createDataManager(portSelection, data);
+                // const manager = _this.createDataManager(portSelection, data);
 
                 // TODO: 实现拖拽
                 // registerDragEvent(manager, rootRender);       

src/hook/render/wire.js

@@ -67,7 +67,7 @@ export class WireRender {
             .attr('stroke-width', data => data.strokeWidth)
             .each(function (data) {
                 const selection = d3.select(this);
-                const manager = _this.createDataManager(selection, data);
+                // const manager = _this.createDataManager(selection, data);
             });
     }