Skip to content

W
wisdom-components
Commit 8826c4e8 authored by 李纪文's avatar 李纪文
Browse files
Options

fix: 组态增加背景解析

parent 2d90cba6
Hide whitespace changes
Inline Side-by-side
Showing with 243 additions and 123 deletions
packages/extend-components/EC_ConfigurationView/src/HistoryModel.js
View file @ 8826c4e8
...@@ -841,7 +841,72 @@ const ConfigurationView = (props) => { ...@@ -841,7 +841,72 @@ const ConfigurationView = (props) => {
}, },
); );
// 自定义矩形
go.Shape.defineFigureGenerator('RoundedRectanglePlus', (shape, w, h) => {
// this figure takes one parameter, the size of the corner
let p1 = Infinity; // default corner size
if (shape !== null) {
const param1 = shape.parameter1;
if (!isNaN(param1) && param1 >= 0) p1 = param1; // can't be negative or NaN
}
p1 = Math.min(p1, w / 2);
p1 = Math.min(p1, h / 2); // limit by whole height or by half height?
const geo = new go.Geometry();
// a single figure consisting of straight lines and quarter-circle arcs
geo.add(
new go.PathFigure(0, p1)
.add(new go.PathSegment(go.PathSegment.Arc, 180, 90, p1, p1, p1, p1))
.add(new go.PathSegment(go.PathSegment.Line, w - p1, 0))
.add(new go.PathSegment(go.PathSegment.Arc, 270, 90, w - p1, p1, p1, p1))
.add(new go.PathSegment(go.PathSegment.Arc, 0, 90, w - p1, h - p1, p1, p1))
.add(new go.PathSegment(go.PathSegment.Arc, 90, 90, p1, h - p1, p1, p1).close()),
);
// don't intersect with two top corners when used in an "Auto" Panel
geo.spot1 = new go.Spot(0, 0, 0.3 * p1, 0.3 * p1);
geo.spot2 = new go.Spot(1, 1, -0.3 * p1, 0);
return geo;
});
/** *********************************节点模板************************************* */ /** *********************************节点模板************************************* */
// 背景模板定义
myDiagram.nodeTemplateMap.add(
'bgCase',
goJS(
go.Node,
'Spot',
{ locationSpot: go.Spot.Center, zOrder: 0 },
// new go.Binding('zOrder', 'zOrder').makeTwoWay(),
new go.Binding('location', 'loc', go.Point.parse).makeTwoWay(go.Point.stringify),
new go.Binding('visible', 'visible').makeTwoWay(),
new go.Binding('angle').makeTwoWay(),
{
// 设置其可选择
selectable: false,
layerName: 'Background',
},
// the main object is a Panel that surrounds a TextBlock with a Shape ~图形：Panel包围着TextBlock
goJS(
go.Panel,
'Auto',
{
name: 'PANEL',
},
new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify),
goJS(
go.Picture,
{ width: 56, height: 56, scale: 1, source: '', background: '#2e3343' },
new go.Binding('source', 'imgSrc', function (v) {
return `/PandaCore/GCK/SketchPad/PreviewResource?name=${v}&_site=${globalConfig?.userInfo?.LocalSite || ''}`;
}).makeTwoWay(),
new go.Binding('scale', 'scale').makeTwoWay(),
new go.Binding('width', 'width').makeTwoWay(),
new go.Binding('height', 'height').makeTwoWay(),
new go.Binding('background', 'background').makeTwoWay(),
),
),
),
);
// svg节点定义 // svg节点定义
myDiagram.nodeTemplateMap.add( myDiagram.nodeTemplateMap.add(
'svgCase', 'svgCase',
...@@ -956,7 +1021,7 @@ const ConfigurationView = (props) => { ...@@ -956,7 +1021,7 @@ const ConfigurationView = (props) => {
), ),
); );
// 设备简称 // 设备名称定义
myDiagram.nodeTemplateMap.add( myDiagram.nodeTemplateMap.add(
'deviceCase', 'deviceCase',
goJS( goJS(
...@@ -971,11 +1036,12 @@ const ConfigurationView = (props) => { ...@@ -971,11 +1036,12 @@ const ConfigurationView = (props) => {
roleVisibleBinding(), // 绑定角色可见 roleVisibleBinding(), // 绑定角色可见
goJS( goJS(
go.Shape, go.Shape,
'Rectangle', 'RoundedRectanglePlus',
{ name: 'SHAPE', strokeWidth: 10, stroke: '#000000' }, { name: 'SHAPE', strokeWidth: 10, stroke: '#000000', parameter1: 0 },
new go.Binding('fill', 'fillColor').makeTwoWay(), new go.Binding('fill', 'fillColor').makeTwoWay(),
new go.Binding('stroke').makeTwoWay(), new go.Binding('stroke').makeTwoWay(),
new go.Binding('strokeWidth').makeTwoWay(), new go.Binding('strokeWidth').makeTwoWay(),
new go.Binding('parameter1', 'radius').makeTwoWay(),
new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify), new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify),
), ),
goJS( goJS(
...@@ -1032,11 +1098,12 @@ const ConfigurationView = (props) => { ...@@ -1032,11 +1098,12 @@ const ConfigurationView = (props) => {
roleVisibleBinding(), // 绑定角色可见 roleVisibleBinding(), // 绑定角色可见
goJS( goJS(
go.Shape, go.Shape,
'Rectangle', 'RoundedRectanglePlus',
{ name: 'SHAPE', strokeWidth: 10, stroke: '#000000' }, { name: 'SHAPE', strokeWidth: 10, stroke: '#000000', parameter1: 0 },
new go.Binding('fill', 'fillColor').makeTwoWay(), new go.Binding('fill', 'fillColor').makeTwoWay(),
new go.Binding('stroke').makeTwoWay(), new go.Binding('stroke').makeTwoWay(),
new go.Binding('strokeWidth').makeTwoWay(), new go.Binding('strokeWidth').makeTwoWay(),
new go.Binding('parameter1', 'radius').makeTwoWay(),
new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify), new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify),
), ),
goJS( goJS(
...@@ -1086,6 +1153,11 @@ const ConfigurationView = (props) => { ...@@ -1086,6 +1153,11 @@ const ConfigurationView = (props) => {
new go.Binding('zOrder', 'zOrder').makeTwoWay(), new go.Binding('zOrder', 'zOrder').makeTwoWay(),
new go.Binding('location', 'loc', go.Point.parse).makeTwoWay(go.Point.stringify), new go.Binding('location', 'loc', go.Point.parse).makeTwoWay(go.Point.stringify),
new go.Binding('angle').makeTwoWay(), new go.Binding('angle').makeTwoWay(),
{
// 设置其可选择
selectable: false,
layerName: 'Background',
},
roleVisibleBinding(), // 绑定角色可见 roleVisibleBinding(), // 绑定角色可见
goJS( goJS(
go.Shape, go.Shape,
...@@ -1145,11 +1217,12 @@ const ConfigurationView = (props) => { ...@@ -1145,11 +1217,12 @@ const ConfigurationView = (props) => {
roleVisibleBinding(), // 绑定角色可见 roleVisibleBinding(), // 绑定角色可见
goJS( goJS(
go.Shape, go.Shape,
'Rectangle', 'RoundedRectanglePlus',
{ name: 'SHAPE', strokeWidth: 10, stroke: '#000000' }, { name: 'SHAPE', strokeWidth: 10, stroke: '#000000', parameter1: 0 },
new go.Binding('fill', 'fillColor'), new go.Binding('fill', 'fillColor'),
new go.Binding('stroke'), new go.Binding('stroke'),
new go.Binding('strokeWidth'), new go.Binding('strokeWidth'),
new go.Binding('parameter1', 'radius').makeTwoWay(),
new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify), new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify),
), ),
goJS( goJS(
...@@ -1293,32 +1366,6 @@ const ConfigurationView = (props) => { ...@@ -1293,32 +1366,6 @@ const ConfigurationView = (props) => {
), ),
); );
// 进度条设置
go.Shape.defineFigureGenerator('RoundedRectanglePlus', (shape, w, h) => {
// this figure takes one parameter, the size of the corner
let p1 = Infinity; // default corner size
if (shape !== null) {
const param1 = shape.parameter1;
if (!isNaN(param1) && param1 >= 0) p1 = param1; // can't be negative or NaN
}
p1 = Math.min(p1, w / 2);
p1 = Math.min(p1, h / 2); // limit by whole height or by half height?
const geo = new go.Geometry();
// a single figure consisting of straight lines and quarter-circle arcs
geo.add(
new go.PathFigure(0, p1)
.add(new go.PathSegment(go.PathSegment.Arc, 180, 90, p1, p1, p1, p1))
.add(new go.PathSegment(go.PathSegment.Line, w - p1, 0))
.add(new go.PathSegment(go.PathSegment.Arc, 270, 90, w - p1, p1, p1, p1))
.add(new go.PathSegment(go.PathSegment.Arc, 0, 90, w - p1, h - p1, p1, p1))
.add(new go.PathSegment(go.PathSegment.Arc, 90, 90, p1, h - p1, p1, p1).close()),
);
// don't intersect with two top corners when used in an "Auto" Panel
geo.spot1 = new go.Spot(0, 0, 0.3 * p1, 0.3 * p1);
geo.spot2 = new go.Spot(1, 1, -0.3 * p1, 0);
return geo;
});
// 定义进度条 // 定义进度条
myDiagram.nodeTemplateMap.add( myDiagram.nodeTemplateMap.add(
'speedCase', 'speedCase',
...@@ -1343,10 +1390,12 @@ const ConfigurationView = (props) => { ...@@ -1343,10 +1390,12 @@ const ConfigurationView = (props) => {
stroke: '#FFFFFF', stroke: '#FFFFFF',
desiredSize: new go.Size(NaN, 26), desiredSize: new go.Size(NaN, 26),
fill: 'transparent', fill: 'transparent',
parameter1: 5,
}, },
new go.Binding('width').makeTwoWay(), new go.Binding('width').makeTwoWay(),
new go.Binding('height').makeTwoWay(), new go.Binding('height').makeTwoWay(),
new go.Binding('strokeWidth', 'strokeWidth').makeTwoWay(), new go.Binding('strokeWidth', 'strokeWidth').makeTwoWay(),
new go.Binding('parameter1', 'radius').makeTwoWay(),
new go.Binding('stroke', 'stroke').makeTwoWay(), new go.Binding('stroke', 'stroke').makeTwoWay(),
), ),
goJS( goJS(
...@@ -1360,10 +1409,12 @@ const ConfigurationView = (props) => { ...@@ -1360,10 +1409,12 @@ const ConfigurationView = (props) => {
strokeWidth: 2, strokeWidth: 2,
stroke: 'transparent', stroke: 'transparent',
desiredSize: new go.Size(NaN, 26), desiredSize: new go.Size(NaN, 26),
parameter1: 5,
}, },
new go.Binding('width').makeTwoWay(), new go.Binding('width').makeTwoWay(),
new go.Binding('height').makeTwoWay(), new go.Binding('height').makeTwoWay(),
new go.Binding('fill', 'waterColor').makeTwoWay(), new go.Binding('fill', 'waterColor').makeTwoWay(),
new go.Binding('parameter1', 'radius').makeTwoWay(),
new go.Binding('strokeWidth', 'strokeWidth').makeTwoWay(), new go.Binding('strokeWidth', 'strokeWidth').makeTwoWay(),
), ),
goJS( goJS(
...@@ -1378,9 +1429,11 @@ const ConfigurationView = (props) => { ...@@ -1378,9 +1429,11 @@ const ConfigurationView = (props) => {
strokeWidth: 2, strokeWidth: 2,
minSize: new go.Size(NaN, 5), minSize: new go.Size(NaN, 5),
desiredSize: new go.Size(NaN, 20), desiredSize: new go.Size(NaN, 20),
parameter1: 5,
}, },
new go.Binding('width', 'lineWidth').makeTwoWay(), new go.Binding('width', 'lineWidth').makeTwoWay(),
new go.Binding('height', 'height').makeTwoWay(), new go.Binding('height', 'height').makeTwoWay(),
new go.Binding('parameter1', 'radius').makeTwoWay(),
new go.Binding('fill', 'fillColor').makeTwoWay(), new go.Binding('fill', 'fillColor').makeTwoWay(),
new go.Binding('strokeWidth', 'strokeWidth'), new go.Binding('strokeWidth', 'strokeWidth'),
), ),
...@@ -1489,11 +1542,12 @@ const ConfigurationView = (props) => { ...@@ -1489,11 +1542,12 @@ const ConfigurationView = (props) => {
roleVisibleBinding(), // 绑定角色可见 roleVisibleBinding(), // 绑定角色可见
goJS( goJS(
go.Shape, go.Shape,
'RoundedRectangle', 'RoundedRectanglePlus',
{ name: 'SHAPE', strokeWidth: 10, stroke: '#000000' }, { name: 'SHAPE', strokeWidth: 10, stroke: '#000000', parameter1: 5 },
new go.Binding('fill', 'fillColor'), new go.Binding('fill', 'fillColor'),
new go.Binding('stroke'), new go.Binding('stroke'),
new go.Binding('strokeWidth'), new go.Binding('strokeWidth'),
new go.Binding('parameter1', 'radius').makeTwoWay(),
new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify), new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify),
), ),
goJS( goJS(
...@@ -1596,6 +1650,7 @@ const ConfigurationView = (props) => { ...@@ -1596,6 +1650,7 @@ const ConfigurationView = (props) => {
resegmentable: true, resegmentable: true,
relinkableFrom: true, relinkableFrom: true,
relinkableTo: true, relinkableTo: true,
zOrder: 1,
}, },
new go.Binding('fromSpot', 'fromPort', (d) => { new go.Binding('fromSpot', 'fromPort', (d) => {
return spotConverter(d); return spotConverter(d);
...@@ -1644,6 +1699,7 @@ const ConfigurationView = (props) => { ...@@ -1644,6 +1699,7 @@ const ConfigurationView = (props) => {
relinkableTo: true, relinkableTo: true,
relinkableFrom: true, relinkableFrom: true,
relinkableTo: true, relinkableTo: true,
zOrder: 1,
}, },
new go.Binding('fromSpot', 'fromPort', function (d) { new go.Binding('fromSpot', 'fromPort', function (d) {
return spotConverter(d); return spotConverter(d);
......
packages/extend-components/EC_ConfigurationView/src/RealModel.js
View file @ 8826c4e8
...@@ -153,13 +153,15 @@ const ConfigurationView = (props) => { ...@@ -153,13 +153,15 @@ const ConfigurationView = (props) => {
} }
// 获取点表信息 // 获取点表信息
const pointInfo = await getPointAddress({ const pointInfo = devices.length
code: devices.join(','), ? await getPointAddress({
_site: code: devices.join(','),
globalConfig.userInfo && globalConfig.userInfo.LocalSite _site:
? globalConfig.userInfo.LocalSite globalConfig.userInfo && globalConfig.userInfo.LocalSite
: '', ? globalConfig.userInfo.LocalSite
}); : '',
})
: null;
editionArr = deepCopy(pointInfo && pointInfo.data ? pointInfo.data : [], []); editionArr = deepCopy(pointInfo && pointInfo.data ? pointInfo.data : [], []);
}; };
...@@ -733,18 +735,20 @@ const ConfigurationView = (props) => { ...@@ -733,18 +735,20 @@ const ConfigurationView = (props) => {
type: siteInfo && siteInfo[name] ? siteInfo[name].Type : '', type: siteInfo && siteInfo[name] ? siteInfo[name].Type : '',
}); });
}); });
mqttView = new MqttView({ mqttView = devices.length
mqttIP: globalConfig.mqtt_iotIP, ? new MqttView({
mqttPath: globalConfig.mqtt_path, mqttIP: globalConfig.mqtt_iotIP,
mqttSsl: globalConfig.mqtt_IsSSL, mqttPath: globalConfig.mqtt_path,
siteCode: globalConfig.mqtt_mess.site_code, mqttSsl: globalConfig.mqtt_IsSSL,
devices, siteCode: globalConfig.mqtt_mess.site_code,
callback: refreshData, devices,
controlback: controlData, callback: refreshData,
}); controlback: controlData,
})
: null;
diagramRender(typeof fromJson === 'string' ? fromJson : JSON.stringify(fromJson)); diagramRender(typeof fromJson === 'string' ? fromJson : JSON.stringify(fromJson));
try { try {
mqttView.saveWaterMqtt(); mqttView && mqttView.saveWaterMqtt();
} catch (e) { } catch (e) {
// 获取实时数据 // 获取实时数据
getRealData(siteInfo); getRealData(siteInfo);
...@@ -978,15 +982,16 @@ const ConfigurationView = (props) => { ...@@ -978,15 +982,16 @@ const ConfigurationView = (props) => {
code, code,
}; };
const flag = isNumber(value); const flag = isNumber(value);
mqttView.onSendWaMessageArrived( mqttView &&
userName, mqttView.onSendWaMessageArrived(
sha1(password).toUpperCase(), userName,
guid, sha1(password).toUpperCase(),
code, guid,
tag, code,
value, tag,
flag ? value * 1 : '', value,
); flag ? value * 1 : '',
);
}; };
/** **************************************权限控制方法****************************************** */ /** **************************************权限控制方法****************************************** */
...@@ -1007,15 +1012,16 @@ const ConfigurationView = (props) => { ...@@ -1007,15 +1012,16 @@ const ConfigurationView = (props) => {
guidAggre[guid] = { tag, code }; guidAggre[guid] = { tag, code };
const { val } = ctRule[0]; const { val } = ctRule[0];
const flag = isNumber(val); const flag = isNumber(val);
mqttView.onSendWaMessageArrived( mqttView &&
globalConfig.token || '', mqttView.onSendWaMessageArrived(
'', globalConfig.token || '',
guid, '',
code, guid,
tag, code,
val, tag,
flag ? val * 1 : '', val,
); flag ? val * 1 : '',
);
}; };
/** **************************************控制方法****************************************** */ /** **************************************控制方法****************************************** */
...@@ -1056,15 +1062,16 @@ const ConfigurationView = (props) => { ...@@ -1056,15 +1062,16 @@ const ConfigurationView = (props) => {
return false; return false;
} }
guidAggre[guid] = { tag, code }; guidAggre[guid] = { tag, code };
mqttView.onSendWaMessageArrived( mqttView &&
globalConfig.token || '', mqttView.onSendWaMessageArrived(
'', globalConfig.token || '',
guid, '',
code, guid,
tag, code,
node.switchType, tag,
value * 1, node.switchType,
); value * 1,
);
}; };
const moreControlMethod = (code, tag, node, value) => { const moreControlMethod = (code, tag, node, value) => {
...@@ -1076,15 +1083,16 @@ const ConfigurationView = (props) => { ...@@ -1076,15 +1083,16 @@ const ConfigurationView = (props) => {
} }
guidAggre[guid] = { tag, code }; guidAggre[guid] = { tag, code };
const flag = isNumber(value); const flag = isNumber(value);
mqttView.onSendWaMessageArrived( mqttView &&
globalConfig.token || '', mqttView.onSendWaMessageArrived(
'', globalConfig.token || '',
guid, '',
code, guid,
tag, code,
value, tag,
flag ? value * 1 : '', value,
); flag ? value * 1 : '',
);
}; };
/** **************************************渲染多选控制****************************************** */ /** **************************************渲染多选控制****************************************** */
...@@ -1242,7 +1250,72 @@ const ConfigurationView = (props) => { ...@@ -1242,7 +1250,72 @@ const ConfigurationView = (props) => {
}, },
); );
// 自定义矩形
go.Shape.defineFigureGenerator('RoundedRectanglePlus', (shape, w, h) => {
// this figure takes one parameter, the size of the corner
let p1 = Infinity; // default corner size
if (shape !== null) {
const param1 = shape.parameter1;
if (!isNaN(param1) && param1 >= 0) p1 = param1; // can't be negative or NaN
}
p1 = Math.min(p1, w / 2);
p1 = Math.min(p1, h / 2); // limit by whole height or by half height?
const geo = new go.Geometry();
// a single figure consisting of straight lines and quarter-circle arcs
geo.add(
new go.PathFigure(0, p1)
.add(new go.PathSegment(go.PathSegment.Arc, 180, 90, p1, p1, p1, p1))
.add(new go.PathSegment(go.PathSegment.Line, w - p1, 0))
.add(new go.PathSegment(go.PathSegment.Arc, 270, 90, w - p1, p1, p1, p1))
.add(new go.PathSegment(go.PathSegment.Arc, 0, 90, w - p1, h - p1, p1, p1))
.add(new go.PathSegment(go.PathSegment.Arc, 90, 90, p1, h - p1, p1, p1).close()),
);
// don't intersect with two top corners when used in an "Auto" Panel
geo.spot1 = new go.Spot(0, 0, 0.3 * p1, 0.3 * p1);
geo.spot2 = new go.Spot(1, 1, -0.3 * p1, 0);
return geo;
});
/** *********************************节点模板************************************* */ /** *********************************节点模板************************************* */
// 背景模板定义
myDiagram.nodeTemplateMap.add(
'bgCase',
goJS(
go.Node,
'Spot',
{ locationSpot: go.Spot.Center, zOrder: 0 },
// new go.Binding('zOrder', 'zOrder').makeTwoWay(),
new go.Binding('location', 'loc', go.Point.parse).makeTwoWay(go.Point.stringify),
new go.Binding('visible', 'visible').makeTwoWay(),
new go.Binding('angle').makeTwoWay(),
{
// 设置其可选择
selectable: false,
layerName: 'Background',
},
// the main object is a Panel that surrounds a TextBlock with a Shape ~图形：Panel包围着TextBlock
goJS(
go.Panel,
'Auto',
{
name: 'PANEL',
},
new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify),
goJS(
go.Picture,
{ width: 56, height: 56, scale: 1, source: '', background: '#2e3343' },
new go.Binding('source', 'imgSrc', function (v) {
return `/PandaCore/GCK/SketchPad/PreviewResource?name=${v}&_site=${globalConfig?.userInfo?.LocalSite || ''}`;
}).makeTwoWay(),
new go.Binding('scale', 'scale').makeTwoWay(),
new go.Binding('width', 'width').makeTwoWay(),
new go.Binding('height', 'height').makeTwoWay(),
new go.Binding('background', 'background').makeTwoWay(),
),
),
),
);
// svg节点定义 // svg节点定义
myDiagram.nodeTemplateMap.add( myDiagram.nodeTemplateMap.add(
'svgCase', 'svgCase',
...@@ -1368,7 +1441,7 @@ const ConfigurationView = (props) => { ...@@ -1368,7 +1441,7 @@ const ConfigurationView = (props) => {
), ),
); );
// 设备简称 // 设备名称定义
myDiagram.nodeTemplateMap.add( myDiagram.nodeTemplateMap.add(
'deviceCase', 'deviceCase',
goJS( goJS(
...@@ -1383,11 +1456,12 @@ const ConfigurationView = (props) => { ...@@ -1383,11 +1456,12 @@ const ConfigurationView = (props) => {
roleVisibleBinding(), // 绑定角色可见 roleVisibleBinding(), // 绑定角色可见
goJS( goJS(
go.Shape, go.Shape,
'Rectangle', 'RoundedRectanglePlus',
{ name: 'SHAPE', strokeWidth: 10, stroke: '#000000' }, { name: 'SHAPE', strokeWidth: 10, stroke: '#000000', parameter1: 0 },
new go.Binding('fill', 'fillColor').makeTwoWay(), new go.Binding('fill', 'fillColor').makeTwoWay(),
new go.Binding('stroke').makeTwoWay(), new go.Binding('stroke').makeTwoWay(),
new go.Binding('strokeWidth').makeTwoWay(), new go.Binding('strokeWidth').makeTwoWay(),
new go.Binding('parameter1', 'radius').makeTwoWay(),
new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify), new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify),
), ),
goJS( goJS(
...@@ -1446,11 +1520,12 @@ const ConfigurationView = (props) => { ...@@ -1446,11 +1520,12 @@ const ConfigurationView = (props) => {
roleVisibleBinding(), // 绑定角色可见 roleVisibleBinding(), // 绑定角色可见
goJS( goJS(
go.Shape, go.Shape,
'Rectangle', 'RoundedRectanglePlus',
{ name: 'SHAPE', strokeWidth: 10, stroke: '#000000' }, { name: 'SHAPE', strokeWidth: 10, stroke: '#000000', parameter1: 0 },
new go.Binding('fill', 'fillColor').makeTwoWay(), new go.Binding('fill', 'fillColor').makeTwoWay(),
new go.Binding('stroke').makeTwoWay(), new go.Binding('stroke').makeTwoWay(),
new go.Binding('strokeWidth').makeTwoWay(), new go.Binding('strokeWidth').makeTwoWay(),
new go.Binding('parameter1', 'radius').makeTwoWay(),
new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify), new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify),
), ),
goJS( goJS(
...@@ -1511,6 +1586,11 @@ const ConfigurationView = (props) => { ...@@ -1511,6 +1586,11 @@ const ConfigurationView = (props) => {
new go.Binding('zOrder', 'zOrder').makeTwoWay(), new go.Binding('zOrder', 'zOrder').makeTwoWay(),
new go.Binding('location', 'loc', go.Point.parse).makeTwoWay(go.Point.stringify), new go.Binding('location', 'loc', go.Point.parse).makeTwoWay(go.Point.stringify),
new go.Binding('angle').makeTwoWay(), new go.Binding('angle').makeTwoWay(),
{
// 设置其可改变大小
resizable: false,
layerName: 'Background',
},
roleVisibleBinding(), // 绑定角色可见 roleVisibleBinding(), // 绑定角色可见
goJS( goJS(
go.Shape, go.Shape,
...@@ -1570,11 +1650,12 @@ const ConfigurationView = (props) => { ...@@ -1570,11 +1650,12 @@ const ConfigurationView = (props) => {
roleVisibleBinding(), // 绑定角色可见 roleVisibleBinding(), // 绑定角色可见
goJS( goJS(
go.Shape, go.Shape,
'Rectangle', 'RoundedRectanglePlus',
{ name: 'SHAPE', strokeWidth: 10, stroke: '#000000' }, { name: 'SHAPE', strokeWidth: 10, stroke: '#000000', parameter1: 0 },
new go.Binding('fill', 'fillColor'), new go.Binding('fill', 'fillColor'),
new go.Binding('stroke'), new go.Binding('stroke'),
new go.Binding('strokeWidth'), new go.Binding('strokeWidth'),
new go.Binding('parameter1', 'radius').makeTwoWay(),
new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify), new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify),
), ),
goJS( goJS(
...@@ -1724,32 +1805,6 @@ const ConfigurationView = (props) => { ...@@ -1724,32 +1805,6 @@ const ConfigurationView = (props) => {
), ),
); );
// 进度条设置
go.Shape.defineFigureGenerator('RoundedRectanglePlus', (shape, w, h) => {
// this figure takes one parameter, the size of the corner
let p1 = Infinity; // default corner size
if (shape !== null) {
const param1 = shape.parameter1;
if (!isNaN(param1) && param1 >= 0) p1 = param1; // can't be negative or NaN
}
p1 = Math.min(p1, w / 2);
p1 = Math.min(p1, h / 2); // limit by whole height or by half height?
const geo = new go.Geometry();
// a single figure consisting of straight lines and quarter-circle arcs
geo.add(
new go.PathFigure(0, p1)
.add(new go.PathSegment(go.PathSegment.Arc, 180, 90, p1, p1, p1, p1))
.add(new go.PathSegment(go.PathSegment.Line, w - p1, 0))
.add(new go.PathSegment(go.PathSegment.Arc, 270, 90, w - p1, p1, p1, p1))
.add(new go.PathSegment(go.PathSegment.Arc, 0, 90, w - p1, h - p1, p1, p1))
.add(new go.PathSegment(go.PathSegment.Arc, 90, 90, p1, h - p1, p1, p1).close()),
);
// don't intersect with two top corners when used in an "Auto" Panel
geo.spot1 = new go.Spot(0, 0, 0.3 * p1, 0.3 * p1);
geo.spot2 = new go.Spot(1, 1, -0.3 * p1, 0);
return geo;
});
// 定义进度条 // 定义进度条
myDiagram.nodeTemplateMap.add( myDiagram.nodeTemplateMap.add(
'speedCase', 'speedCase',
...@@ -1774,10 +1829,12 @@ const ConfigurationView = (props) => { ...@@ -1774,10 +1829,12 @@ const ConfigurationView = (props) => {
stroke: '#FFFFFF', stroke: '#FFFFFF',
desiredSize: new go.Size(NaN, 26), desiredSize: new go.Size(NaN, 26),
fill: 'transparent', fill: 'transparent',
parameter1: 5,
}, },
new go.Binding('width').makeTwoWay(), new go.Binding('width').makeTwoWay(),
new go.Binding('height').makeTwoWay(), new go.Binding('height').makeTwoWay(),
new go.Binding('strokeWidth', 'strokeWidth').makeTwoWay(), new go.Binding('strokeWidth', 'strokeWidth').makeTwoWay(),
new go.Binding('parameter1', 'radius').makeTwoWay(),
new go.Binding('stroke', 'stroke').makeTwoWay(), new go.Binding('stroke', 'stroke').makeTwoWay(),
), ),
goJS( goJS(
...@@ -1791,10 +1848,12 @@ const ConfigurationView = (props) => { ...@@ -1791,10 +1848,12 @@ const ConfigurationView = (props) => {
strokeWidth: 2, strokeWidth: 2,
stroke: 'transparent', stroke: 'transparent',
desiredSize: new go.Size(NaN, 26), desiredSize: new go.Size(NaN, 26),
parameter1: 5,
}, },
new go.Binding('width').makeTwoWay(), new go.Binding('width').makeTwoWay(),
new go.Binding('height').makeTwoWay(), new go.Binding('height').makeTwoWay(),
new go.Binding('fill', 'waterColor').makeTwoWay(), new go.Binding('fill', 'waterColor').makeTwoWay(),
new go.Binding('parameter1', 'radius').makeTwoWay(),
new go.Binding('strokeWidth', 'strokeWidth').makeTwoWay(), new go.Binding('strokeWidth', 'strokeWidth').makeTwoWay(),
), ),
goJS( goJS(
...@@ -1809,9 +1868,11 @@ const ConfigurationView = (props) => { ...@@ -1809,9 +1868,11 @@ const ConfigurationView = (props) => {
strokeWidth: 2, strokeWidth: 2,
minSize: new go.Size(NaN, 5), minSize: new go.Size(NaN, 5),
desiredSize: new go.Size(NaN, 20), desiredSize: new go.Size(NaN, 20),
parameter1: 5,
}, },
new go.Binding('width', 'lineWidth').makeTwoWay(), new go.Binding('width', 'lineWidth').makeTwoWay(),
new go.Binding('height', 'height').makeTwoWay(), new go.Binding('height', 'height').makeTwoWay(),
new go.Binding('parameter1', 'radius').makeTwoWay(),
new go.Binding('fill', 'fillColor').makeTwoWay(), new go.Binding('fill', 'fillColor').makeTwoWay(),
new go.Binding('strokeWidth', 'strokeWidth'), new go.Binding('strokeWidth', 'strokeWidth'),
), ),
...@@ -1920,11 +1981,12 @@ const ConfigurationView = (props) => { ...@@ -1920,11 +1981,12 @@ const ConfigurationView = (props) => {
roleVisibleBinding(), // 绑定角色可见 roleVisibleBinding(), // 绑定角色可见
goJS( goJS(
go.Shape, go.Shape,
'RoundedRectangle', 'RoundedRectanglePlus',
{ name: 'SHAPE', strokeWidth: 10, stroke: '#000000' }, { name: 'SHAPE', strokeWidth: 10, stroke: '#000000', parameter1: 5 },
new go.Binding('fill', 'fillColor'), new go.Binding('fill', 'fillColor'),
new go.Binding('stroke'), new go.Binding('stroke'),
new go.Binding('strokeWidth'), new go.Binding('strokeWidth'),
new go.Binding('parameter1', 'radius').makeTwoWay(),
new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify), new go.Binding('desiredSize', 'size', go.Size.parse).makeTwoWay(go.Size.stringify),
), ),
goJS( goJS(
...@@ -2034,6 +2096,7 @@ const ConfigurationView = (props) => { ...@@ -2034,6 +2096,7 @@ const ConfigurationView = (props) => {
resegmentable: true, resegmentable: true,
relinkableFrom: true, relinkableFrom: true,
relinkableTo: true, relinkableTo: true,
zOrder: 1,
}, },
new go.Binding('fromSpot', 'fromPort', (d) => { new go.Binding('fromSpot', 'fromPort', (d) => {
return spotConverter(d); return spotConverter(d);
...@@ -2082,6 +2145,7 @@ const ConfigurationView = (props) => { ...@@ -2082,6 +2145,7 @@ const ConfigurationView = (props) => {
relinkableTo: true, relinkableTo: true,
relinkableFrom: true, relinkableFrom: true,
relinkableTo: true, relinkableTo: true,
zOrder: 1,
}, },
new go.Binding('fromSpot', 'fromPort', function (d) { new go.Binding('fromSpot', 'fromPort', function (d) {
return spotConverter(d); return spotConverter(d);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment