From f7344c40083c87961e14f1455c7664dee940318f Mon Sep 17 00:00:00 2001
From: zhf <1204297681@qq.com>
Date: Fri, 30 Aug 2024 16:27:45 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=A1=A5=E5=85=85ER=E8=AE=BE=E8=AE=A1?=
=?UTF-8?q?=E5=B7=A5=E5=85=B7=E8=8A=82=E7=82=B9=E5=9B=BE=E6=A0=87=E3=80=81?=
=?UTF-8?q?=E4=BF=AE=E6=94=B9ER=E8=AE=BE=E8=AE=A1=E5=B7=A5=E5=85=B7?=
=?UTF-8?q?=E7=9A=84=E5=91=88=E7=8E=B0=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../er-design-node/er-design-node.scss | 13 ++++-
.../er-design-node/er-design-node.tsx | 13 ++++-
.../er-design-content.controller.ts | 3 ++
.../er_design_content/er_design_content.scss | 15 ++----
.../controller/x6-controller/x6-controller.ts | 48 ++++++++++++-------
.../x6-node-controller/x6-node-controller.ts | 4 +-
.../src/x6/service/x6-node-service.ts | 3 +-
7 files changed, 63 insertions(+), 36 deletions(-)
diff --git a/packages/er-design/src/custom-cell/er-design-node/er-design-node.scss b/packages/er-design/src/custom-cell/er-design-node/er-design-node.scss
index 3632c87b..2ec6592b 100644
--- a/packages/er-design/src/custom-cell/er-design-node/er-design-node.scss
+++ b/packages/er-design/src/custom-cell/er-design-node/er-design-node.scss
@@ -20,6 +20,17 @@
height: 16px;
transform: translate(0, -2px);
}
+
+ @include b(icon) {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ > svg {
+ width: 16px;
+ height: 16px;
+ }
+ }
}
.caption {
@@ -109,6 +120,6 @@
.x6-node-selected {
@include b(er-design-node) {
- border: 2px solid #{getCssVar(color, primary, hover)};
+ border: 2px solid #1890ff;
}
}
diff --git a/packages/er-design/src/custom-cell/er-design-node/er-design-node.tsx b/packages/er-design/src/custom-cell/er-design-node/er-design-node.tsx
index 8c30de0d..2f5d1ce1 100644
--- a/packages/er-design/src/custom-cell/er-design-node/er-design-node.tsx
+++ b/packages/er-design/src/custom-cell/er-design-node/er-design-node.tsx
@@ -4,7 +4,7 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
/* eslint-disable no-shadow */
import { computed, defineComponent, onMounted, Ref, ref } from 'vue';
-import { useNamespace } from '@ibiz-template/vue3-util';
+import { useNamespace, IBizIcon } from '@ibiz-template/vue3-util';
import { Graph, Node } from '@antv/x6';
import './er-design-node.scss';
import { nodeSize } from '../config';
@@ -12,6 +12,9 @@ import { getFieldList, getNodeHeight } from '../../utils/er-util';
export default defineComponent({
name: 'IBizERDesignNode',
+ components: {
+ IBizIcon,
+ },
props: {
node: Node,
graph: Graph,
@@ -128,6 +131,9 @@ export default defineComponent({
showFilter.value = filter;
});
+ // 图标
+ const icon = props.node?.attrs?.icon;
+
return {
ns,
caption,
@@ -136,6 +142,7 @@ export default defineComponent({
itemStyle,
fieldsList,
isSingle,
+ icon,
isShowFilter,
isShow,
};
@@ -148,7 +155,9 @@ export default defineComponent({
title={this.caption}
style={this.captionStyle}
>
- {/* 
*/}
+
+
+
{this.caption}
diff --git a/packages/er-design/src/panel-items/er_design_content/er-design-content.controller.ts b/packages/er-design/src/panel-items/er_design_content/er-design-content.controller.ts
index 1980e39d..c94d5185 100644
--- a/packages/er-design/src/panel-items/er_design_content/er-design-content.controller.ts
+++ b/packages/er-design/src/panel-items/er_design_content/er-design-content.controller.ts
@@ -200,6 +200,9 @@ export class ERDesignContentController extends PanelItemController {
this.state.loading = false;
});
+ if (this.erDesignLeftSide) {
+ this.x6.setCodeListMap(this.erDesignLeftSide.codeListMap);
+ }
}
/**
diff --git a/packages/er-design/src/panel-items/er_design_content/er_design_content.scss b/packages/er-design/src/panel-items/er_design_content/er_design_content.scss
index 7665bbda..00722f85 100644
--- a/packages/er-design/src/panel-items/er_design_content/er_design_content.scss
+++ b/packages/er-design/src/panel-items/er_design_content/er_design_content.scss
@@ -5,14 +5,6 @@
height: 100%;
overflow: hidden;
background-color: rgba(var(#{getCssVarName(white)}), 1);
-
- .x6-widget-minimap-viewport {
- border: 2px solid #8f8f8f;
- }
-
- .x6-widget-minimap-viewport-zoom {
- border: 2px solid #8f8f8f;
- }
}
@include b(er_design_content-container) {
@@ -22,10 +14,9 @@
@include b(er_design_content-minimap) {
position: absolute;
- right: 10px;
- bottom: 10px;
- width: 300px;
- height: 200px;
+ right: 0;
+ bottom: 0;
+ border: 1px solid #e9e9e9;
}
@include b(er_design_content-holder) {
diff --git a/packages/er-design/src/x6/controller/x6-controller/x6-controller.ts b/packages/er-design/src/x6/controller/x6-controller/x6-controller.ts
index d27c0129..60d858b8 100644
--- a/packages/er-design/src/x6/controller/x6-controller/x6-controller.ts
+++ b/packages/er-design/src/x6/controller/x6-controller/x6-controller.ts
@@ -9,6 +9,7 @@ import { Keyboard } from '@antv/x6-plugin-keyboard';
import { Selection } from '@antv/x6-plugin-selection';
import { Export } from '@antv/x6-plugin-export';
import {
+ CodeListItem,
ControllerEvent,
EventBase,
IPanelController,
@@ -163,6 +164,27 @@ export class X6Controller {
this.isDefaultOpenAnchorEdit = value;
}
+ /**
+ * 代码表项映射
+ *
+ * @author zhanghengfeng
+ * @date 2024-08-30 14:08:40
+ * @private
+ * @type {(Map)}
+ */
+ private codeListMap: Map = new Map();
+
+ /**
+ * 设置代码表项映射
+ *
+ * @author zhanghengfeng
+ * @date 2024-08-30 14:08:13
+ * @param {(Map)} map
+ */
+ setCodeListMap(map: Map): void {
+ this.codeListMap = map;
+ }
+
/**
* x6图形配置
*
@@ -206,23 +228,7 @@ export class X6Controller {
maxScale: 2,
},
// 网格系统
- grid: {
- size: 10, // 网格大小 10px
- visible: true, // 是否显示渲染网格背景
- type: 'mesh', // 网格类型 'dot' | 'fixedDot' | 'mesh'
- // 网格样式配置
- args: [
- {
- color: '#f0f0f0', // 主网格线颜色
- thickness: 1, // 主网格线宽度
- },
- {
- color: '#ddd', // 次网格线颜色
- thickness: 1, // 次网格线宽度
- factor: 4, // 主次网格线间隔
- },
- ],
- },
+ grid: true,
// 高亮
highlighting: {
nodeAvailable: {
@@ -315,6 +321,10 @@ export class X6Controller {
this.g.use(
new MiniMap({
container: mapContainer.item(0) as HTMLElement,
+ width: 360,
+ height: 270,
+ minScale: 0.2,
+ maxScale: 2,
}),
);
} else {
@@ -387,7 +397,9 @@ export class X6Controller {
this.linkList = linkMetaData.linkList;
this.g.addNodes(
this.nodeList.map(data => {
- return this.node.createCell(data);
+ return this.node.createCell(data, {
+ icon: this.codeListMap.get(data.nodeTag)?.sysImage,
+ });
}),
);
this.g.addEdges(
diff --git a/packages/er-design/src/x6/controller/x6-node-controller/x6-node-controller.ts b/packages/er-design/src/x6/controller/x6-node-controller/x6-node-controller.ts
index 20402f15..e5ed3a9b 100644
--- a/packages/er-design/src/x6/controller/x6-node-controller/x6-node-controller.ts
+++ b/packages/er-design/src/x6/controller/x6-node-controller/x6-node-controller.ts
@@ -312,8 +312,8 @@ export class X6NodeController extends X6CellController {
* @param {X6NodeData} data
* @return {*} {Cell.Metadata}
*/
- createCell(data: X6NodeData): Cell.Metadata {
- return this.service.createCell(data);
+ createCell(data: X6NodeData, params?: IParams): Cell.Metadata {
+ return this.service.createCell(data, params);
}
/**
diff --git a/packages/er-design/src/x6/service/x6-node-service.ts b/packages/er-design/src/x6/service/x6-node-service.ts
index 3a373e9f..1fc947b7 100644
--- a/packages/er-design/src/x6/service/x6-node-service.ts
+++ b/packages/er-design/src/x6/service/x6-node-service.ts
@@ -63,7 +63,7 @@ export class X6NodeService extends X6CellService {
return res.ok;
}
- createCell(data: X6NodeData): Cell.Metadata {
+ createCell(data: X6NodeData, params?: IParams): Cell.Metadata {
const height = getNodeHeight(
Object.is(data.nodeTag, 'DS_DBTABLE'),
getFieldList(data.fields),
@@ -76,6 +76,7 @@ export class X6NodeService extends X6CellService {
y: data.topPos,
data,
ports: getNodePorts(data, height),
+ attrs: params,
};
}
}
--
Gitee