From 3b121a4e25bc57693d231a805133fe14defd18f5 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期五, 30 六月 2023 00:23:05 +0800
Subject: [PATCH] 2023-06-30
---
src/tabviews/custom/components/chart/antv-X6/index.scss | 16 ++
src/tabviews/custom/components/chart/antv-X6/index.jsx | 221 +++++++++++++++++++++++-------------
src/menu/components/chart/antv-G6/chartcompile/formconfig.jsx | 4
src/menu/components/chart/antv-G6/index.jsx | 1
src/menu/components/chart/antv-X6/chartcompile/formconfig.jsx | 13 --
src/menu/components/chart/antv-X6/chartcompile/index.jsx | 2
src/tabviews/custom/components/chart/antv-G6/index.jsx | 6
src/menu/components/chart/antv-X6/index.jsx | 83 -------------
8 files changed, 169 insertions(+), 177 deletions(-)
diff --git a/src/menu/components/chart/antv-G6/chartcompile/formconfig.jsx b/src/menu/components/chart/antv-G6/chartcompile/formconfig.jsx
index 4c4f683..19807bf 100644
--- a/src/menu/components/chart/antv-G6/chartcompile/formconfig.jsx
+++ b/src/menu/components/chart/antv-G6/chartcompile/formconfig.jsx
@@ -102,11 +102,11 @@
type: 'radio',
field: 'click',
label: '鐐瑰嚮浜嬩欢',
- initval: card.click || '',
+ initval: card.click || 'switch',
tooltip: '鐐瑰嚮鑺傜偣鏃惰Е鍙戠殑浜嬩欢銆�',
required: false,
options: [
- {value: '', label: '鏁版嵁鍒囨崲'},
+ {value: 'switch', label: '鏁版嵁鍒囨崲'},
{value: 'menu', label: '鑿滃崟'},
{value: 'menus', label: '鑿滃崟缁�'}
],
diff --git a/src/menu/components/chart/antv-G6/index.jsx b/src/menu/components/chart/antv-G6/index.jsx
index 652fbe6..2e9dbf7 100644
--- a/src/menu/components/chart/antv-G6/index.jsx
+++ b/src/menu/components/chart/antv-G6/index.jsx
@@ -961,6 +961,7 @@
width: card.width || 24,
height: 400,
subtype: card.subtype,
+ click: 'switch',
name: card.name
}
diff --git a/src/menu/components/chart/antv-X6/chartcompile/formconfig.jsx b/src/menu/components/chart/antv-X6/chartcompile/formconfig.jsx
index 2be6ca1..f3ef986 100644
--- a/src/menu/components/chart/antv-X6/chartcompile/formconfig.jsx
+++ b/src/menu/components/chart/antv-X6/chartcompile/formconfig.jsx
@@ -110,6 +110,7 @@
required: false,
options: [
{value: '', label: '鏃�'},
+ {value: 'switch', label: '鏁版嵁鍒囨崲'},
{value: 'menu', label: '鑿滃崟'},
{value: 'menus', label: '鑿滃崟缁�'}
],
@@ -118,7 +119,6 @@
{field: 'menus', values: ['menus']},
{field: 'menuType', values: ['menus']},
{field: 'open', values: ['menu', 'menus']},
- {field: 'joint', values: ['menu', 'menus']},
]
},
{
@@ -149,17 +149,6 @@
{value: 'self', label: '褰撳墠绐楀彛'},
],
forbid: appType !== 'pc'
- },
- {
- type: 'radio',
- field: 'joint',
- label: '鍙傛暟鎷兼帴',
- initval: card.joint || 'true',
- required: false,
- options: [
- {value: 'true', label: '鏄�'},
- {value: 'false', label: '鍚�'},
- ],
},
{
type: 'table',
diff --git a/src/menu/components/chart/antv-X6/chartcompile/index.jsx b/src/menu/components/chart/antv-X6/chartcompile/index.jsx
index 8d72d4c..6942006 100644
--- a/src/menu/components/chart/antv-X6/chartcompile/index.jsx
+++ b/src/menu/components/chart/antv-X6/chartcompile/index.jsx
@@ -144,7 +144,7 @@
<Modal
wrapClassName="mk-pop-modal"
visible={visible}
- width={850}
+ width={900}
maskClosable={false}
onOk={this.onSubmit}
onCancel={() => { this.setState({ visible: false }) }}
diff --git a/src/menu/components/chart/antv-X6/index.jsx b/src/menu/components/chart/antv-X6/index.jsx
index c161470..4c5cc7c 100644
--- a/src/menu/components/chart/antv-X6/index.jsx
+++ b/src/menu/components/chart/antv-X6/index.jsx
@@ -3,7 +3,7 @@
import { is, fromJS } from 'immutable'
import { Popover } from 'antd'
import { ToolOutlined, DeleteOutlined, FontColorsOutlined } from '@ant-design/icons'
-import { Graph, Shape } from '@antv/x6'
+import { Graph } from '@antv/x6'
import MKEmitter from '@/utils/events.js'
import asyncComponent from '@/utils/asyncComponent'
@@ -314,6 +314,7 @@
max: 2
},
autoResize: true,
+ interacting: false,
background: {
color: card.plot.backgroundColor || 'transparent'
},
@@ -335,36 +336,6 @@
allowBlank: false,
snap: {
radius: 20
- },
- createEdge() {
- return new Shape.Edge({
- attrs: {
- line: {
- stroke: '#000000',
- strokeWidth: 1,
- targetMarker: {
- name: 'block',
- width: 12,
- height: 8
- }
- }
- },
- zIndex: 0
- })
- },
- validateConnection({ targetMagnet }) {
- return !!targetMagnet
- }
- },
- highlighting: {
- magnetAdsorbed: {
- name: 'stroke',
- args: {
- attrs: {
- fill: '#5F95FF',
- stroke: '#5F95FF'
- }
- }
}
}
})
@@ -391,6 +362,7 @@
max: 2
},
autoResize: true,
+ interacting: false,
background: { color: '#ffffff' },
mousewheel: {
enabled: true,
@@ -410,55 +382,6 @@
allowBlank: false,
snap: {
radius: 20
- },
- createEdge() {
- return new Shape.Edge({
- attrs: {
- line: {
- stroke: '#000000',
- strokeWidth: 1,
- targetMarker: {
- name: 'block',
- width: 12,
- height: 8
- }
- }
- },
- zIndex: 2
- })
- },
- validateConnection({ targetMagnet }) {
- return !!targetMagnet
- }
- },
- highlighting: {
- magnetAdsorbed: {
- name: 'stroke',
- args: {
- attrs: {
- fill: '#5F95FF',
- stroke: '#5F95FF'
- }
- }
- }
- },
- translating: {
- restrict(cellView) {
- const cell = cellView.cell
- const parentId = cell.prop('parent')
-
- if (parentId) {
- const parentNode = graph.getCellById(parentId)
- if (parentNode) {
- return parentNode.getBBox().moveAndExpand({
- x: 0,
- y: 36,
- width: 0,
- height: -36,
- })
- }
- }
- return cell.getBBox()
}
}
})
diff --git a/src/tabviews/custom/components/chart/antv-G6/index.jsx b/src/tabviews/custom/components/chart/antv-G6/index.jsx
index d66d9c9..8d7f359 100644
--- a/src/tabviews/custom/components/chart/antv-G6/index.jsx
+++ b/src/tabviews/custom/components/chart/antv-G6/index.jsx
@@ -1571,9 +1571,9 @@
handleClick = (data = null) => {
const { plot, config } = this.state
- if (plot.click && !data) return
-
if (plot.click === 'menus') {
+ if (!data) return
+
let menu = null
if (plot.menus && plot.menus.length > 0) {
@@ -1604,6 +1604,8 @@
MKEmitter.emit('modifyTabs', newtab, true)
} else if (plot.click === 'menu') {
+ if (!data) return
+
let menuId = plot.menu.slice(-1)[0]
let newtab = window.GLOB.mkThdMenus.filter(m => m.MenuID === menuId)[0]
diff --git a/src/tabviews/custom/components/chart/antv-X6/index.jsx b/src/tabviews/custom/components/chart/antv-X6/index.jsx
index 4bb634b..6a8f37a 100644
--- a/src/tabviews/custom/components/chart/antv-X6/index.jsx
+++ b/src/tabviews/custom/components/chart/antv-X6/index.jsx
@@ -333,6 +333,47 @@
true
)
+const styles = {
+ blue: '#1890ff',
+ red: '#f5222d',
+ orange_red: '#fa541c',
+ orange: '#fa8c16',
+ orange_yellow: '#faad14',
+ yellow: '#fadb14',
+ yellow_green: '#a0d911',
+ green: '#52c41a',
+ cyan: '#13c2c2',
+ blue_purple: '#2f54eb',
+ purple: '#722ed1',
+ magenta: '#eb2f96',
+ grass_green: '#aeb303',
+ deep_red: '#c32539',
+ deep_blue: '#1d3661',
+ blue1: '#e6f7ff',
+ red1: '#fff1f0',
+ orange_red1: '#fff2e8',
+ orange1: '#fff7e6',
+ orange_yellow1: '#fffbe6',
+ yellow1: '#feffe6',
+ yellow_green1: '#fcffe6',
+ green1: '#f6ffed',
+ cyan1: '#e6fffb',
+ blue_purple1: '#f0f5ff',
+ purple1: '#f9f0ff',
+ magenta1: '#fff0f6',
+ grass_green1: '#f2efda',
+ deep_red1: '#fff0f0',
+ deep_blue1: '#eff1f4'
+}
+
+let sysColor = '#1890ff'
+let lightColor = '#e6f7ff'
+if (window.GLOB.style) {
+ let type = window.GLOB.style.replace(/bg_black_style_|bg_white_style_/, '')
+ sysColor = styles[type] || '#1890ff'
+ lightColor = styles[type + '1'] || '#e6f7ff'
+}
+
class antvX6Chart extends Component {
static propTpyes = {
config: PropTypes.object
@@ -563,6 +604,7 @@
max: 2
},
autoResize: true,
+ interacting: false,
panning: true,
background: {
color: config.plot.backgroundColor || 'transparent'
@@ -585,36 +627,6 @@
allowBlank: false,
snap: {
radius: 20
- },
- createEdge() {
- return new Shape.Edge({
- attrs: {
- line: {
- stroke: '#000000',
- strokeWidth: 1,
- targetMarker: {
- name: 'block',
- width: 12,
- height: 8
- }
- }
- },
- zIndex: 0
- })
- },
- validateConnection({ targetMagnet }) {
- return !!targetMagnet
- }
- },
- highlighting: {
- magnetAdsorbed: {
- name: 'stroke',
- args: {
- attrs: {
- fill: '#5F95FF',
- stroke: '#5F95FF'
- }
- }
}
}
})
@@ -631,6 +643,16 @@
graph.resetCells(cells)
graph.positionContent('center')
}
+
+ if (config.plot.click) {
+ graph.on('cell:click', ({ node }) => {
+ this.checkNode(graph, node)
+ })
+
+ graph.on('blank:click', () => {
+ this.checkNode(graph)
+ })
+ }
}
laneSrender = () => {
@@ -642,6 +664,7 @@
min: 0.5,
max: 2
},
+ interacting: false,
autoResize: true,
panning: true,
background: { color: '#ffffff' },
@@ -663,55 +686,6 @@
allowBlank: false,
snap: {
radius: 20
- },
- createEdge() {
- return new Shape.Edge({
- attrs: {
- line: {
- stroke: '#000000',
- strokeWidth: 1,
- targetMarker: {
- name: 'block',
- width: 12,
- height: 8
- }
- }
- },
- zIndex: 2
- })
- },
- validateConnection({ targetMagnet }) {
- return !!targetMagnet
- }
- },
- highlighting: {
- magnetAdsorbed: {
- name: 'stroke',
- args: {
- attrs: {
- fill: '#5F95FF',
- stroke: '#5F95FF'
- }
- }
- }
- },
- translating: {
- restrict(cellView) {
- const cell = cellView.cell
- const parentId = cell.prop('parent')
-
- if (parentId) {
- const parentNode = graph.getCellById(parentId)
- if (parentNode) {
- return parentNode.getBBox().moveAndExpand({
- x: 0,
- y: 36,
- width: 0,
- height: -36,
- })
- }
- }
- return cell.getBBox()
}
}
})
@@ -727,6 +701,16 @@
})
graph.resetCells(cells)
graph.positionContent('top')
+ }
+
+ if (config.plot.click) {
+ graph.on('cell:click', ({ node }) => {
+ this.checkNode(graph, node)
+ })
+
+ graph.on('blank:click', () => {
+ this.checkNode(graph)
+ })
}
}
@@ -1594,6 +1578,83 @@
}
}
+ checkNode = (graph, node) => {
+ const { plot, config } = this.state
+
+ let nodes = graph.getNodes()
+
+ nodes.forEach(item => {
+ if (item.prop('shape') === 'lane') return
+
+ if (item.prop('oristyle')) {
+ let style = item.prop('oristyle')
+
+ item.prop('attrs/body/fill', style.fill)
+ item.prop('attrs/body/stroke', style.stroke)
+ item.prop('attrs/text/fill', style.text)
+ }
+ })
+
+ if (!node || ['lane', 'mk-text', 'edge'].includes(node.prop('shape'))) {
+ MKEmitter.emit('resetSelectLine', config.uuid, '', '')
+ return
+ }
+
+ if (!node.prop('oristyle')) {
+ node.prop('oristyle', {
+ fill: node.prop('attrs/body/fill'),
+ stroke: node.prop('attrs/body/stroke'),
+ text: node.prop('attrs/text/fill')
+ })
+ }
+
+ node.prop('attrs/body/fill', lightColor)
+ node.prop('attrs/body/stroke', sysColor)
+ node.prop('attrs/text/fill', sysColor)
+
+ let sign = node.prop('mksign') || ''
+
+ if (plot.click === 'menus') {
+ let menu = null
+
+ if (plot.menus && plot.menus.length > 0) {
+ plot.menus.forEach(m => {
+ if (sign !== m.sign) return
+ menu = m
+ })
+ }
+ if (!menu || !menu.MenuID) return
+
+ let newtab = {
+ MenuID: menu.MenuID,
+ MenuName: menu.MenuName,
+ MenuNo: menu.MenuNo || '',
+ type: menu.tabType,
+ param: {$BID: sign}
+ }
+
+ MKEmitter.emit('modifyTabs', newtab, true)
+ } else if (plot.click === 'menu') {
+ let menuId = plot.menu.slice(-1)[0]
+ let newtab = window.GLOB.mkThdMenus.filter(m => m.MenuID === menuId)[0]
+
+ if (!newtab && plot.MenuID) {
+ newtab = {
+ MenuID: plot.MenuID,
+ MenuName: plot.MenuName,
+ MenuNo: plot.MenuNo,
+ type: plot.tabType
+ }
+ } else if (!newtab) {
+ return
+ }
+
+ MKEmitter.emit('modifyTabs', {...newtab, param: {$BID: sign}}, true)
+ } else {
+ MKEmitter.emit('resetSelectLine', config.uuid, sign, {})
+ }
+ }
+
resetlane = (id, x, offset) => {
let nodes = this.mkGraph.getNodes()
@@ -1627,7 +1688,7 @@
</div> : null
}
<NormalHeader config={config} />
- <div className="canvas" style={{width: '100%', minHeight: config.plot.height, height: config.plot.height}} id={config.uuid + 'canvas'}>
+ <div className={'canvas only-show' + (config.plot.click ? ' switchable' : '')} style={{width: '100%', minHeight: config.plot.height, height: config.plot.height}} id={config.uuid + 'canvas'}>
<div id={config.uuid + 'container'} className="mk-container"></div>
</div>
</div>
diff --git a/src/tabviews/custom/components/chart/antv-X6/index.scss b/src/tabviews/custom/components/chart/antv-X6/index.scss
index 7bf3861..58cd11f 100644
--- a/src/tabviews/custom/components/chart/antv-X6/index.scss
+++ b/src/tabviews/custom/components/chart/antv-X6/index.scss
@@ -165,6 +165,22 @@
opacity: 0;
}
}
+ .only-show {
+ .x6-port {
+ display: none;
+ }
+ .x6-cell.x6-edge {
+ cursor: default;
+ path {
+ cursor: default;
+ }
+ }
+ }
+ .only-show.switchable {
+ .x6-cell.x6-node:not([data-shape="lane"]):not([data-shape="mk-text"]) {
+ cursor: pointer;
+ }
+ }
.chart-header {
position: relative;
--
Gitblit v1.8.0