Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
W
wisdom-components
Project
Project
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
ReactWeb5
wisdom-components
Commits
822dcaf2
Commit
822dcaf2
authored
Dec 31, 2024
by
李纪文
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat: 组态增加控制日志查看
parent
30bab3ad
Hide whitespace changes
Inline
Side-by-side
Showing
7 changed files
with
591 additions
and
51 deletions
+591
-51
RealModel.js
...s/extend-components/EC_ConfigurationView/src/RealModel.js
+104
-24
index.js
.../extend-components/EC_ConfigurationView/src/apis/index.js
+11
-1
index.js
..._ConfigurationView/src/components/ControlRecords/index.js
+259
-0
index.less
...onfigurationView/src/components/ControlRecords/index.less
+61
-0
configuration_custom.js
...mponents/EC_ConfigurationView/src/configuration_custom.js
+104
-24
日志.svg
...tend-components/EC_ConfigurationView/src/images/组态/日志.svg
+2
-0
index.less
...ges/extend-components/EC_ConfigurationView/src/index.less
+50
-2
No files found.
packages/extend-components/EC_ConfigurationView/src/RealModel.js
View file @
822dcaf2
...
...
@@ -3,7 +3,6 @@ import React, { useState, useEffect, useRef, useContext, useMemo, useCallback }
import
classNames
from
'classnames'
;
import
moment
from
'moment'
;
import
axios
from
'axios'
;
import
sha1
from
'sha1'
;
import
Empty
from
'@wisdom-components/empty'
;
import
LoadBox
from
'@wisdom-components/loadbox'
;
import
VideoSliderModal
from
'@wisdom-components/videoslidermodal'
;
...
...
@@ -27,6 +26,7 @@ import TopRotatingTool from './js/RotatingTool';
import
BarLink
from
'./js/BarLink'
;
import
WaterFlowControlView
from
'./js/WaterFlowControlView'
;
import
ConfigurationDetail
from
'./js/ConfigurationDetail'
;
import
ControlRecords
from
'./components/ControlRecords'
;
import
DragModal
from
'./js/DragModal'
;
import
{
authorizationToken
,
...
...
@@ -67,6 +67,7 @@ let modalWidth = 520;
let
historyInfoParams
=
[];
let
statisticalInfoParams
=
{};
let
nodeData
=
null
;
// 选中节点的数据
let
bindData
=
[];
let
twoID
=
''
;
const
waterFlow
=
new
WaterFlowControlView
();
...
...
@@ -78,7 +79,6 @@ const ConfigurationView = (props) => {
// 入场动画
let
entryAnim
=
''
;
const
guidAggre
=
{};
const
bindData
=
[];
const
stationList
=
[];
const
{
getPrefixCls
}
=
useContext
(
ConfigProvider
.
ConfigContext
);
const
prefixCls
=
getPrefixCls
(
'ec-configuration-view'
);
...
...
@@ -89,6 +89,7 @@ const ConfigurationView = (props) => {
const
[
isHIModalVisible
,
setIsHIModalVisible
]
=
useState
(
false
);
// 历史曲线模态框
const
[
isSTHIModalVisible
,
setIsSTHIModalVisible
]
=
useState
(
false
);
// 统计历史曲线模态框
const
[
isJumpModalVisible
,
setIsJumpModalVisible
]
=
useState
(
false
);
// 画板跳转模态框
const
[
isControlLogVisible
,
setIsControlLogVisible
]
=
useState
(
false
);
// 控制日志模态框
const
[
spinning
,
setSpinning
]
=
useState
(
true
);
// 画板loading
const
[
isEmpty
,
setIsEmpty
]
=
useState
(
false
);
// 画板无数据状态
const
[
description
,
setDescription
]
=
useState
(
''
);
// 画板无数据描述
...
...
@@ -1553,23 +1554,25 @@ const ConfigurationView = (props) => {
});
return (
<div className={classNames('
moreControlContent
')}>
{ctRule.length > 0 &&
ctRule.map((rule, index) => {
if (rule.val !== '' && rule.text !== '') {
return (
<div key={index} className={classNames('
moreControlList
')}>
<span>状态设置</span>
<div
onClick={(e) =>
moreControlMethod(list.code, nodeData.ctName, nodeData, rule.val)
}
>
{rule.text}
<div className={classNames('
moreControlContainer
')}>
{ctRule.length > 0 &&
ctRule.map((rule, index) => {
if (rule.val !== '' && rule.text !== '') {
return (
<div key={index} className={classNames('
moreControlList
')}>
<span>状态设置</span>
<div
onClick={(e) =>
moreControlMethod(list.code, nodeData.ctName, nodeData, rule.val)
}
>
{rule.text}
</div>
</div>
</div>
);
}
})}
);
}
}
)}
</div>
</div>
);
};
...
...
@@ -1577,6 +1580,7 @@ const ConfigurationView = (props) => {
/** **************************************控制模态渲染****************************************** */
const controlModalRender = (data, list) => {
const ctRule = data && data.ctRule ? JSON.parse(data.ctRule) : '';
const ctLog = data && data.ctLog ? data.ctLog : false;
switch (data.ctType) {
case '
按钮控制
':
if (data.switch === '
是
') message.warning(`当前设备已是${data.text}状态,请勿重复操作!`);
...
...
@@ -1585,27 +1589,28 @@ const ConfigurationView = (props) => {
data.switch === '
是
' ||
!data.ctName ||
!data.ctName.length ||
ctRule[0].val === ''
ctRule[0].val === '' ||
!list?.code
)
return false;
modalComponent = renderSwitchControlModal;
modalConfirmFn = () => defineSwitch(list.code, data.ctName, data);
modalProps = { title: '
状态控制
' };
modalProps = { title: '
状态控制
'
, footer: renderControlModalFooter(ctLog)
};
modalWidth = 520;
setIsModalVisible(true);
break;
case '
输入控制
':
if (data.realVal === '
--
' || !data.ctName) return false;
if (data.realVal === '
--
' || !data.ctName
|| !list?.code
) return false;
modalComponent = renderAdjustControlModal;
modalConfirmFn = () => controlMethod(list.code, data.ctName, data);
modalProps = { title: `${data.ctName}设置` };
modalProps = { title: `${data.ctName}设置`
, footer: renderControlModalFooter(ctLog)
};
modalWidth = 520;
setIsModalVisible(true);
break;
case '
多选控制
':
if (!data.ctName) return false;
if (!data.ctName
|| !list?.code
) return false;
modalComponent = renderMoreControlModal;
modalProps = { footer:
null
, title: `${data.ctName}设置` };
modalProps = { footer:
renderMoreControlFooter(ctLog)
, title: `${data.ctName}设置` };
modalWidth = '
auto
';
setIsModalVisible(true);
break;
...
...
@@ -1614,6 +1619,52 @@ const ConfigurationView = (props) => {
}
};
// 自定义多选控制footer
const renderMoreControlFooter = (ctLog) => {
return ctLog ? (
<div className={classNames('
controlModallLog
')} onClick={handleLog}>
<img src={require('
.
/
images
/
组态
/
日志
.
svg
')} />
控制日志
</div>
) : null;
};
// 自定义控制footer
const renderControlModalFooter = (ctLog) => {
return (
<div className={classNames('
controlModalFooter
')}>
{ctLog ? (
<div className={classNames('
controlModallLog
')} onClick={handleLog}>
<img src={require('
.
/
images
/
组态
/
日志
.
svg
')} />
控制日志
</div>
) : (
<div></div>
)}
<div className={classNames('
controlModalOperate
')}>
<Button onClick={handleCancel}>关闭</Button>
<Button type="primary" onClick={handleOk}>
确认
</Button>
</div>
</div>
);
};
// 控制日志内容渲染
const renderControlLogContent = () => {
const list = bindData.find((item) => {
return item.name === nodeData.stationName;
});
return list ? (
<ControlRecords nodeData={nodeData} bindList={list} />
) : (
<div className={classNames('
controlNotLog
')}>
<Empty description={'
控制日志信息不全,请先配置相关指标信息!
'} />
</div>
);
};
/** **************************************视频查看****************************************** */
const videoScanMethod = async (data) => {
try {
...
...
@@ -1729,6 +1780,11 @@ const ConfigurationView = (props) => {
setIsJumpModalVisible(true);
};
const handleLog = (e) => {
e.stopPropagation();
setIsControlLogVisible(true);
};
const handleOk = (e) => {
e.stopPropagation();
modalConfirmFn && modalConfirmFn();
...
...
@@ -2082,6 +2138,9 @@ const ConfigurationView = (props) => {
case
'功能跳转'
:
// 功能模型
menuJumpMethod
(
data
);
break
;
case
'控制日志'
:
// 控制日志
if
(
list
.
code
&&
nodeData
.
ctName
)
setIsControlLogVisible
(
true
);
break
;
case
'视频查看'
:
// 视频查看
videoScanMethod
(
data
);
break
;
...
...
@@ -2165,6 +2224,9 @@ const ConfigurationView = (props) => {
case
'功能跳转'
:
// 功能模型
menuJumpMethod
(
data
);
break
;
case
'控制日志'
:
// 控制日志
if
(
list
.
code
&&
nodeData
.
ctName
)
setIsControlLogVisible
(
true
);
break
;
case
'视频查看'
:
// 视频查看
videoScanMethod
(
data
);
break
;
...
...
@@ -2501,6 +2563,9 @@ const ConfigurationView = (props) => {
case
'功能跳转'
:
// 功能模型
menuJumpMethod
(
data
);
break
;
case
'控制日志'
:
// 控制日志
if
(
list
.
code
&&
nodeData
.
ctName
)
setIsControlLogVisible
(
true
);
break
;
case
'视频查看'
:
// 视频查看
videoScanMethod
(
data
);
break
;
...
...
@@ -3503,6 +3568,21 @@ const ConfigurationView = (props) => {
JessibucaObj={_JessibucaObj}
/>
)}
{isControlLogVisible && (
<Modal
centered
width={'80vw'}
footer={null}
open={isControlLogVisible}
onOk={() => setIsControlLogVisible(false)}
onCancel={() => setIsControlLogVisible(false)}
getContainer={ConfigurationRef.current}
title={`
$
{
nodeData
.
ctName
||
''
}
控制日志
`}
wrapClassName={classNames(`
$
{
prefixCls
}
-
controlLogInfoModal
`)}
>
{renderControlLogContent()}
</Modal>
)}
</div>
);
};
...
...
packages/extend-components/EC_ConfigurationView/src/apis/index.js
View file @
822dcaf2
...
...
@@ -87,11 +87,20 @@ export function getDictionaryInfo(params) {
});
}
// 获取
// 获取
token
export
function
authorizationToken
(
params
)
{
return
request
({
url
:
`
${
baseURI
}
/PandaCore/Identity/AuthorizationToken`
,
method
:
REQUEST_METHOD_GET
,
params
,
});
}
//控制日志数据
export
function
getRemoteOperationLog
(
data
)
{
return
request
({
url
:
`
${
baseURI
}
/PandaMonitor/Monitor/Device/GetRemoteOperationLog`
,
method
:
REQUEST_METHOD_POST
,
data
,
});
}
\ No newline at end of file
packages/extend-components/EC_ConfigurationView/src/components/ControlRecords/index.js
0 → 100644
View file @
822dcaf2
/*
* @Author: ljiwen
* @Date: 2024-12-30 13:50:03
* @Description:
* @FilePath: \wisdom-components\packages\extend-components\EC_ConfigurationView\src\components\ControlRecords\index.js
*/
import
{
getRemoteOperationLog
}
from
'../../apis'
;
import
BasicTable
from
'@wisdom-components/basictable'
;
import
LoadBox
from
'@wisdom-components/loadbox'
;
import
{
Button
,
DatePicker
,
Input
,
Tag
,
Tooltip
,
ConfigProvider
}
from
'antd'
;
import
classNames
from
'classnames'
;
import
moment
from
'moment'
;
import
React
,
{
useEffect
,
useState
,
useContext
}
from
'react'
;
import
'./index.less'
;
const
{
RangePicker
}
=
DatePicker
;
const
ControlRecords
=
({
nodeData
,
bindList
})
=>
{
const
{
getPrefixCls
}
=
useContext
(
ConfigProvider
.
ConfigContext
);
const
prefixCls
=
getPrefixCls
(
'ec-configuration-control-records'
);
const
dateFormat
=
'YYYY-MM-DD HH:mm:ss'
;
const
[
time
,
setTime
]
=
useState
([
moment
().
subtract
(
7
,
'day'
).
format
(
'YYYY-MM-DD 00:00:00'
),
moment
().
format
(
'YYYY-MM-DD HH:mm:ss'
),
]);
const
[
userName
,
setUserName
]
=
useState
(
''
);
const
[
deviceCode
,
setDeviceCode
]
=
useState
(
bindList
?.
code
);
const
[
tableData
,
setTableData
]
=
useState
([]);
const
[
tableLoading
,
setTableLoading
]
=
useState
(
true
);
const
[
totalNum
,
setTotalNum
]
=
useState
(
0
);
const
[
params
,
setParams
]
=
useState
({
pageIndex
:
1
,
pageSize
:
20
,
controlPoint
:
nodeData
?.
ctName
,
deviceType
:
bindList
?.
type
,
deviceCode
:
bindList
?.
code
,
dateFrom
:
time
[
0
],
dateTo
:
time
[
1
],
userName
:
''
,
userTName
:
''
,
});
const
column
=
[
{
title
:
'序号'
,
dataIndex
:
'rowOrder'
,
align
:
'center'
,
width
:
60
,
render
:
(
text
,
row
,
index
)
=>
(
params
.
pageIndex
-
1
)
*
params
.
pageSize
+
index
+
1
,
},
{
title
:
'操作人'
,
width
:
100
,
dataIndex
:
'opreationName'
,
align
:
'center'
,
},
{
title
:
'操作时间'
,
dataIndex
:
'opreationTime'
,
align
:
'center'
,
width
:
100
,
ellipsis
:
true
,
},
{
title
:
'控制点位'
,
dataIndex
:
'controlPoint'
,
align
:
'center'
,
width
:
140
,
ellipsis
:
true
,
onCell
:
()
=>
({
style
:
{
maxWidth
:
140
,
overflow
:
'hidden'
,
whiteSpace
:
'nowrap'
,
textOverflow
:
'ellipsis'
,
},
}),
render
:
(
record
)
=>
(
<
Tooltip
placement
=
"topLeft"
title
=
{
record
}
>
{
record
}
<
/Tooltip
>
),
},
{
title
:
'初始状态'
,
dataIndex
:
'initStatus'
,
align
:
'center'
,
width
:
80
,
ellipsis
:
true
,
},
{
title
:
'目标状态'
,
dataIndex
:
'targetStatus'
,
align
:
'center'
,
width
:
80
,
ellipsis
:
true
,
},
{
title
:
'实际状态'
,
dataIndex
:
'realStatus'
,
align
:
'center'
,
width
:
80
,
ellipsis
:
true
,
},
{
title
:
'服务返回信息'
,
dataIndex
:
'backContent'
,
align
:
'center'
,
width
:
200
,
ellipsis
:
true
,
onCell
:
()
=>
({
style
:
{
maxWidth
:
200
,
overflow
:
'hidden'
,
whiteSpace
:
'nowrap'
,
textOverflow
:
'ellipsis'
,
},
}),
render
:
(
record
)
=>
(
<
Tooltip
placement
=
"topLeft"
title
=
{
record
}
>
{
record
}
<
/Tooltip
>
),
},
{
title
:
'等待时间'
,
dataIndex
:
'controlWatiTime'
,
width
:
80
,
align
:
'center'
,
},
{
title
:
'控制结果'
,
dataIndex
:
'controlResult'
,
align
:
'center'
,
width
:
80
,
ellipsis
:
true
,
render
:
(
record
)
=>
{
if
(
record
===
'成功'
)
{
return
<
Tag
color
=
"green"
>
{
record
}
<
/Tag>
;
}
return
<
Tag
color
=
"orange"
>
{
record
}
<
/Tag>
;
},
},
];
const
getControlRecords
=
()
=>
{
setTableLoading
(
true
);
getRemoteOperationLog
(
params
)
.
then
((
res
)
=>
{
setTableLoading
(
false
);
const
data
=
res
?.
data
?.
list
||
[];
const
total
=
res
?.
data
?.
totalCount
||
0
;
setTableData
(
data
);
setTotalNum
(
total
);
})
.
catch
((
err
)
=>
{
setTableLoading
(
false
);
setTableData
([]);
setTotalNum
(
0
);
});
};
const
timeChange
=
(
dates
,
dateStrings
)
=>
{
setTime
(
dateStrings
);
};
const
userChange
=
(
e
)
=>
{
setUserName
(
e
.
target
.
value
);
};
const
pageChange
=
(
pageIndex
,
pageSize
)
=>
{
// 分页改变
params
.
pageIndex
=
pageIndex
;
params
.
pageSize
=
pageSize
;
setParams
({
...
params
});
};
const
operateBtn
=
()
=>
{
const
_params
=
{
pageIndex
:
1
,
deviceCode
:
deviceCode
,
dateFrom
:
time
[
0
],
dateTo
:
time
[
1
],
userName
:
userName
,
};
setParams
({
...
params
,
...
_params
,
});
};
useEffect
(()
=>
{
getControlRecords
();
},
[
params
]);
return
(
<
div
className
=
{
classNames
(
prefixCls
)}
>
<
div
className
=
{
classNames
(
'recordsHeaderWrap'
)}
>
<
div
className
=
{
classNames
(
'recordsHeader'
)}
>
<
span
className
=
{
classNames
(
'operateName'
,
'operateTime'
)}
>
设备类型:
<
/span
>
<
Input
placeholder
=
"请输入设备类型"
readOnly
value
=
{
bindList
?.
type
||
''
}
style
=
{{
width
:
150
}}
/
>
<
span
className
=
{
classNames
(
'operateName'
)}
>
设备编码:
<
/span
>
<
Input
placeholder
=
"请输入设备编码"
readOnly
value
=
{
bindList
?.
code
||
''
}
style
=
{{
width
:
150
}}
/
>
<
span
className
=
{
classNames
(
'operateName'
)}
>
操作时间:
<
/span
>
<
RangePicker
showTime
allowClear
=
{
false
}
value
=
{[
moment
(
time
[
0
],
dateFormat
),
moment
(
time
[
1
],
dateFormat
)]}
onChange
=
{
timeChange
}
/
>
<
span
className
=
{
classNames
(
'operateName'
)}
>
操作人:
<
/span
>
<
Input
placeholder
=
"请输入操作人"
allowClear
onChange
=
{
userChange
}
style
=
{{
width
:
150
}}
/
>
<
Button
type
=
"primary"
className
=
{
classNames
(
'operateName'
)}
onClick
=
{
operateBtn
}
>
确定
<
/Button
>
<
/div
>
<
/div
>
<
div
className
=
{
classNames
(
'recordscontent'
)}
>
<
BasicTable
columns
=
{
column
}
bordered
scroll
=
{{
y
:
'calc(100% - 40px)'
}}
pagination
=
{{
total
:
totalNum
,
onChange
:
pageChange
,
current
:
params
.
pageIndex
,
pageSize
:
params
.
pageSize
,
showSizeChanger
:
true
,
showQuickJumper
:
true
,
}}
dataSource
=
{
tableData
}
/
>
<
/div
>
{
tableLoading
&&
(
<
div
className
=
{
classNames
(
'loadBox'
)}
>
<
LoadBox
spinning
=
{
tableLoading
}
/
>
<
/div
>
)}
<
/div
>
);
};
export
default
ControlRecords
;
packages/extend-components/EC_ConfigurationView/src/components/ControlRecords/index.less
0 → 100644
View file @
822dcaf2
@root-entry-name: 'default';
@import '~antd/es/style/themes/index.less';
@ec-configuration--control-records-prefix-cls: ~'@{ant-prefix}-ec-configuration-control-records';
.@{ec-configuration--control-records-prefix-cls} {
display: flex;
flex-direction: column;
height: 600px;
width: 100%;
overflow: hidden;
position: relative;
.recordsHeaderWrap {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 5px;
background: #ffffff;
padding-bottom: 10px;
}
.recordsHeader {
display: flex;
align-items: center;
flex: none;
.operateName {
flex: none;
margin-left: 20px;
&.operateTime {
margin: 0;
}
}
:global {
.@{ant-prefix}-input-clear-icon {
display: flex;
align-items: center;
}
}
}
.recordscontent {
flex: 1;
background: #ffffff;
overflow: hidden;
}
.loadBox {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
width: 100%;
position: absolute;
left: 0;
top: 0;
}
}
\ No newline at end of file
packages/extend-components/EC_ConfigurationView/src/configuration_custom.js
View file @
822dcaf2
...
...
@@ -3,7 +3,6 @@ import React, { useState, useEffect, useRef, useContext, useMemo, useCallback }
import
classNames
from
'classnames'
;
import
moment
from
'moment'
;
import
axios
from
'axios'
;
import
sha1
from
'sha1'
;
import
Empty
from
'@wisdom-components/empty'
;
import
LoadBox
from
'@wisdom-components/loadbox'
;
import
VideoSliderModal
from
'@wisdom-components/videoslidermodal'
;
...
...
@@ -27,6 +26,7 @@ import TopRotatingTool from './js/RotatingTool';
import
BarLink
from
'./js/BarLink'
;
import
WaterFlowControlView
from
'./js/WaterFlowControlView'
;
import
ConfigurationDetail
from
'./js/ConfigurationDetailCustom'
;
import
ControlRecords
from
'./components/ControlRecords'
;
import
DragModal
from
'./js/DragModal'
;
import
{
getSketchPadList
,
...
...
@@ -66,6 +66,7 @@ let modalWidth = 520;
let
historyInfoParams
=
[];
let
statisticalInfoParams
=
{};
let
nodeData
=
null
;
// 选中节点的数据
let
bindData
=
[];
let
twoID
=
''
;
const
waterFlow
=
new
WaterFlowControlView
();
...
...
@@ -75,7 +76,6 @@ const ConfigurationView = (props) => {
let
editionArr
=
[];
let
globalControl
=
false
;
const
guidAggre
=
{};
const
bindData
=
[];
const
stationList
=
[];
const
{
getPrefixCls
}
=
useContext
(
ConfigProvider
.
ConfigContext
);
const
prefixCls
=
getPrefixCls
(
'ec-configuration-view'
);
...
...
@@ -86,6 +86,7 @@ const ConfigurationView = (props) => {
const
[
isHIModalVisible
,
setIsHIModalVisible
]
=
useState
(
false
);
// 历史曲线模态框
const
[
isSTHIModalVisible
,
setIsSTHIModalVisible
]
=
useState
(
false
);
// 统计历史曲线模态框
const
[
isJumpModalVisible
,
setIsJumpModalVisible
]
=
useState
(
false
);
// 画板跳转模态框
const
[
isControlLogVisible
,
setIsControlLogVisible
]
=
useState
(
false
);
// 控制日志模态框
const
[
spinning
,
setSpinning
]
=
useState
(
true
);
// 画板loading
const
[
isEmpty
,
setIsEmpty
]
=
useState
(
false
);
// 画板无数据状态
const
[
description
,
setDescription
]
=
useState
(
''
);
// 画板无数据描述
...
...
@@ -1490,23 +1491,25 @@ const ConfigurationView = (props) => {
});
return (
<div className={classNames('
moreControlContent
')}>
{ctRule.length > 0 &&
ctRule.map((rule, index) => {
if (rule.val !== '' && rule.text !== '') {
return (
<div key={index} className={classNames('
moreControlList
')}>
<span>状态设置</span>
<div
onClick={(e) =>
moreControlMethod(list.code, nodeData.ctName, nodeData, rule.val)
}
>
{rule.text}
<div className={classNames('
moreControlContainer
')}>
{ctRule.length > 0 &&
ctRule.map((rule, index) => {
if (rule.val !== '' && rule.text !== '') {
return (
<div key={index} className={classNames('
moreControlList
')}>
<span>状态设置</span>
<div
onClick={(e) =>
moreControlMethod(list.code, nodeData.ctName, nodeData, rule.val)
}
>
{rule.text}
</div>
</div>
</div>
);
}
})}
);
}
}
)}
</div>
</div>
);
};
...
...
@@ -1514,6 +1517,7 @@ const ConfigurationView = (props) => {
/** **************************************控制模态渲染****************************************** */
const controlModalRender = (data, list) => {
const ctRule = data && data.ctRule ? JSON.parse(data.ctRule) : '';
const ctLog = data && data.ctLog ? data.ctLog : false;
switch (data.ctType) {
case '
按钮控制
':
if (data.switch === '
是
') message.warning(`当前设备已是${data.text}状态,请勿重复操作!`);
...
...
@@ -1522,27 +1526,28 @@ const ConfigurationView = (props) => {
data.switch === '
是
' ||
!data.ctName ||
!data.ctName.length ||
ctRule[0].val === ''
ctRule[0].val === '' ||
!list?.code
)
return false;
modalComponent = renderSwitchControlModal;
modalConfirmFn = () => defineSwitch(list.code, data.ctName, data);
modalProps = { title: '
状态控制
' };
modalProps = { title: '
状态控制
'
, footer: renderControlModalFooter(ctLog)
};
modalWidth = 520;
setIsModalVisible(true);
break;
case '
输入控制
':
if (data.realVal === '
--
' || !data.ctName) return false;
if (data.realVal === '
--
' || !data.ctName
|| !list?.code
) return false;
modalComponent = renderAdjustControlModal;
modalConfirmFn = () => controlMethod(list.code, data.ctName, data);
modalProps = { title: `${data.ctName}设置` };
modalProps = { title: `${data.ctName}设置`
, footer: renderControlModalFooter(ctLog)
};
modalWidth = 520;
setIsModalVisible(true);
break;
case '
多选控制
':
if (!data.ctName) return false;
if (!data.ctName
|| !list?.code
) return false;
modalComponent = renderMoreControlModal;
modalProps = { footer:
null
, title: `${data.ctName}设置` };
modalProps = { footer:
renderMoreControlFooter(ctLog)
, title: `${data.ctName}设置` };
modalWidth = '
auto
';
setIsModalVisible(true);
break;
...
...
@@ -1551,6 +1556,52 @@ const ConfigurationView = (props) => {
}
};
// 自定义多选控制footer
const renderMoreControlFooter = (ctLog) => {
return ctLog ? (
<div className={classNames('
controlModallLog
')} onClick={handleLog}>
<img src={require('
.
/
images
/
组态
/
日志
.
svg
')} />
控制日志
</div>
) : null;
};
// 自定义控制footer
const renderControlModalFooter = (ctLog) => {
return (
<div className={classNames('
controlModalFooter
')}>
{ctLog ? (
<div className={classNames('
controlModallLog
')} onClick={handleLog}>
<img src={require('
.
/
images
/
组态
/
日志
.
svg
')} />
控制日志
</div>
) : (
<div></div>
)}
<div className={classNames('
controlModalOperate
')}>
<Button onClick={handleCancel}>关闭</Button>
<Button type="primary" onClick={handleOk}>
确认
</Button>
</div>
</div>
);
};
// 控制日志内容渲染
const renderControlLogContent = () => {
const list = bindData.find((item) => {
return item.name === nodeData.stationName;
});
return list ? (
<ControlRecords nodeData={nodeData} bindList={list} />
) : (
<div className={classNames('
controlNotLog
')}>
<Empty description={'
控制日志信息不全,请先配置相关指标信息!
'} />
</div>
);
};
/** **************************************视频查看****************************************** */
const videoScanMethod = async (data) => {
try {
...
...
@@ -1664,6 +1715,11 @@ const ConfigurationView = (props) => {
setIsJumpModalVisible(true);
};
const handleLog = (e) => {
e.stopPropagation();
setIsControlLogVisible(true);
};
const handleOk = (e) => {
e.stopPropagation();
modalConfirmFn && modalConfirmFn();
...
...
@@ -2011,6 +2067,9 @@ const ConfigurationView = (props) => {
case
'功能跳转'
:
// 功能模型
menuJumpMethod
(
data
);
break
;
case
'控制日志'
:
// 控制日志
if
(
list
.
code
&&
nodeData
.
ctName
)
setIsControlLogVisible
(
true
);
break
;
case
'视频查看'
:
// 视频查看
videoScanMethod
(
data
);
break
;
...
...
@@ -2094,6 +2153,9 @@ const ConfigurationView = (props) => {
case
'功能跳转'
:
// 功能模型
menuJumpMethod
(
data
);
break
;
case
'控制日志'
:
// 控制日志
if
(
list
.
code
&&
nodeData
.
ctName
)
setIsControlLogVisible
(
true
);
break
;
case
'视频查看'
:
// 视频查看
videoScanMethod
(
data
);
break
;
...
...
@@ -2430,6 +2492,9 @@ const ConfigurationView = (props) => {
case
'功能跳转'
:
// 功能模型
menuJumpMethod
(
data
);
break
;
case
'控制日志'
:
// 控制日志
if
(
list
.
code
&&
nodeData
.
ctName
)
setIsControlLogVisible
(
true
);
break
;
case
'视频查看'
:
// 视频查看
videoScanMethod
(
data
);
break
;
...
...
@@ -3410,6 +3475,21 @@ const ConfigurationView = (props) => {
JessibucaObj={_JessibucaObj}
/>
)}
{isControlLogVisible && (
<Modal
centered
width={'80vw'}
footer={null}
open={isControlLogVisible}
onOk={() => setIsControlLogVisible(false)}
onCancel={() => setIsControlLogVisible(false)}
getContainer={ConfigurationRef.current}
title={`
$
{
nodeData
.
ctName
||
''
}
控制日志
`}
wrapClassName={classNames(`
$
{
prefixCls
}
-
controlLogInfoModal
`)}
>
{renderControlLogContent()}
</Modal>
)}
</div>
);
};
...
...
packages/extend-components/EC_ConfigurationView/src/images/组态/日志.svg
0 → 100644
View file @
822dcaf2
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg
t=
"1735545860982"
class=
"icon"
viewBox=
"0 0 1024 1024"
version=
"1.1"
xmlns=
"http://www.w3.org/2000/svg"
p-id=
"2875"
id=
"mx_n_1735545860983"
width=
"16"
height=
"16"
xmlns:xlink=
"http://www.w3.org/1999/xlink"
><path
d=
"M819.9 472.9L675 723.9l1.7 99.4 86.9-48.3 144.9-251-88.6-51.1z m51.2-88.6L837 443.4l88.6 51.1 34.1-59.1-88.6-51.1zM544.3 703h-288c-17.7 0-32 14.3-32 32s14.3 32 32 32h288c17.7 0 32-14.3 32-32s-14.3-32-32-32z m-288-192c-17.7 0-32 14.3-32 32s14.3 32 32 32h384c17.7 0 32-14.3 32-32s-14.3-32-32-32h-384z m0-192c-17.7 0-32 14.3-32 32s14.3 32 32 32h384c17.7 0 32-14.3 32-32s-14.3-32-32-32h-384zM288 64h64v160h-64z m96 64h128v64H384z m160-64h64v160h-64z"
p-id=
"2876"
fill=
"#949bb0"
></path><path
d=
"M768 864c0 17.7-14.3 32-32 32H160c-17.7 0-32-14.3-32-32V224c0-17.7 14.3-32 32-32h96v-64h-96c-53 0-96 43-96 96v640c0 53 43 96 96 96h576c53 0 96-43 96-96V686.7L768 798v66z m64-640c0-53-43-96-96-96h-96v64h96c17.7 0 32 14.3 32 32v311l64-111.3V224z"
p-id=
"2877"
fill=
"#949bb0"
></path></svg>
\ No newline at end of file
packages/extend-components/EC_ConfigurationView/src/index.less
View file @
822dcaf2
...
...
@@ -11,6 +11,22 @@
&-baseModal {
color: white;
.controlModalFooter {
display: flex;
align-items: center;
justify-content: space-between;
.controlModallLog {
justify-content: flex-start;
width: auto;
}
.controlModalOperate {
display: flex;
align-items: center;
}
}
.switchControlContent {
display: flex;
align-items: center;
...
...
@@ -25,7 +41,14 @@
.moreControlContent {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.moreControlContainer {
width: max-content;
display: flex;
flex-direction: column;
}
.moreControlList {
display: flex;
...
...
@@ -38,7 +61,7 @@
}
div {
padding:
2
px 10px;
padding:
1
px 10px;
border: 1px solid #6d7da2;
border-radius: 6px;
}
...
...
@@ -49,6 +72,24 @@
}
}
.controlModallLog {
display: flex;
width: 100%;
color: rgb(148, 155, 176);
align-items: center;
justify-content: center;
opacity: 0.8;
cursor: pointer;
&:hover {
opacity: 1;
}
img {
margin-right: 5px;
}
}
.adjustControlContent {
display: flex;
align-items: center;
...
...
@@ -315,4 +356,10 @@
height: 100%;
z-index: 10;
}
.controlNotLog {
display: flex;
align-items: center;
justify-content: center;
}
}
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment