free-sun
/
OperationalService
15
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

确认

dev
wenlele 2 years ago
parent
4f78ff5843
commit
de1945d5d6
7 changed files with 254 additions and 128 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      web/client/src/components/outHidden.jsx
  2. 12
      web/client/src/sections/problem/actions/problem.jsx
  3. 6
      web/client/src/sections/problem/components/inspection.jsx
  4. 37
      web/client/src/sections/problem/components/sideSheet.jsx
  5. 159
      web/client/src/sections/problem/components/tableData.jsx
  6. 164
      web/client/src/sections/problem/containers/dataAlarm.jsx
  7. 2
      web/client/src/utils/webapi.js

2
web/client/src/components/outHidden.jsx
View File

@ -37,4 +37,4 @@ function OutHidden ({ name, width, height, color, background, numberHidden, numb
</>
}
export default OutHidden;
export default OutHidden;

12
web/client/src/sections/problem/actions/problem.jsx
View File

@ -109,4 +109,16 @@ export function getAlarmDataDetailAgg (query) { //查询数据告警详情聚
msg: { error: '查询数据告警详情聚集数据失败' },
reducer: { name: '' }
});
}
export function putAlarmdataConfirm (data) { //确认数据告警
return dispatch => basicAction({
type: 'put',
dispatch: dispatch,
data,
actionType: 'PUT-AIARM-DATA-CONFIRM',
url: `${ApiTable.putAlarmdataConfirm}`,
msg: { error: '确认数据告警' },
reducer: { name: '' }
});
}

6
web/client/src/sections/problem/components/inspection.jsx
View File

@ -212,7 +212,7 @@ const Inspection = ({ dispatch, actions, user, route, statistic }) => {
>
<img src={`/_file-server/${v.screenshot}`} style={{ width: 400, height: 182 }} />
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-end', margin: '10px 6px 0', color: '#005ABD' }}>
<span style={{ fontSize: 12 }}>获取时间：{moment(v.createTime).format("YYYY-MM-DD HH:MM:SS")}</span>
<span style={{ fontSize: 12 }}>获取时间：{moment(v.createTime).format("YYYY-MM-DD HH:mm:ss")}</span>
<span >{v.app?.name}</span>
</div>
</div>)}
@ -280,8 +280,8 @@ const Inspection = ({ dispatch, actions, user, route, statistic }) => {
}}
>
<div style={{ marginBottom: 12 }}>
{pictureData.notedTime ? <span style={{ marginRight: 14 }}>核验信息：{pictureData.notedPepUser}&nbsp;{moment(pictureData.notedTime).format("YYYY-MM-DD HH:MM:SS")}</span> : ""}
<span>截取时间:{moment(pictureData.createTime).format("YYYY-MM-DD HH:MM:SS")}</span>
{pictureData.notedTime ? <span style={{ marginRight: 14 }}>核验信息：{pictureData.notedPepUser}&nbsp;{moment(pictureData.notedTime).format("YYYY-MM-DD HH:mm:ss")}</span> : ""}
<span>截取时间:{moment(pictureData.createTime).format("YYYY-MM-DD HH:mm:ss")}</span>
<img src={`/assets/images/problem/link.png`}
style={{ width: 16, height: 16, marginLeft: 6 }}
/>

37
web/client/src/sections/problem/components/sideSheet.jsx
View File

@ -33,12 +33,37 @@ function SideSheets ({ dispatch, actions, close }) {
let dataSort = res.payload.data || []
console.log(dataSort);
// moment.duration(videoAfter?.diff(videoFront))._data.milliseconds;
dataSort.sort((a, b) => moment(a.hours).diff(b.hours))
dataSort.sort((a, b) => {
if (moment(a.hours).isBefore(b.hours)) {
return -1
} else {
return 1
}
})
console.log(dataSort);
let data = {
dataZoom: [
{
show: true,
type: 'inside',
filterMode: 'none',
xAxisIndex: [0],
},
{
show: true,
type: 'inside',
filterMode: 'none',
yAxisIndex: [0],
}
],
tooltip: {
trigger: 'axis'
},
xAxis: {
type: 'category',
name: "时间",
data: dataSort.map(v => v.hour)
data: dataSort.map(v => v.hours)
},
yAxis: {
type: 'value',
@ -47,7 +72,11 @@ function SideSheets ({ dispatch, actions, close }) {
series: [
{
data: dataSort.map(v => v.count),
type: 'line'
type: 'line',
name: '次数',
// markLine: {
// data: [{ type: 'average', name: 'Avg' }]
// }
}
]
}
@ -91,7 +120,7 @@ function SideSheets ({ dispatch, actions, close }) {
title: "产生时间",
dataIndex: "Time",
rowKey: 'Time',
render: (_, r, index) => moment(r.time).format("YYYY-MM-DD HH:MM:SS")
render: (_, r, index) => moment(r.time).format("YYYY-MM-DD HH:mm:ss")
},
]

159
web/client/src/sections/problem/components/tableData.jsx
View File

@ -3,14 +3,19 @@ import { connect } from "react-redux";
import { Button, Form, Modal, Skeleton, Pagination, Table } from "@douyinfe/semi-ui";
import { SkeletonScreen, } from "$components";
import moment from "moment";
import { validate } from "schema-utils";
import { emit } from "superagent";
const TableData = ({ dispatch, actions, route, collectData, setSetup, exhibition,
selected, setSelected, setIfBulk, setConfirm, setGenre }) => {
selected, setSelected, setIfBulk, setConfirm, setGenre, query, setQuery }) => {
const { problem } = actions
const [tableData, setTableData] = useState([]) //表格数据
const [count, setCount] = useState(0) //
const [search, setSearch] = useState({}) //查询
const [checkAll, setCheckAll] = useState(true) //查询
const api = useRef();
useEffect(() => {
@ -19,15 +24,16 @@ const TableData = ({ dispatch, actions, route, collectData, setSetup, exhibition
dispatch(problem.getAlarmLnspectionApi({})).then((res) => {
console.log(res.payload.data)
if (res.success) {
setCount(res.payload.data?.count || 0)
let tableDatas = res.payload.data?.rows.map(v => ({
key: v.id,
serialNumber: v.serialNumber,
// serialNumber: v.serialNumber,
projectName: v.app?.projectCorrelations?.map(r => r.name)?.filter(c => c),
appName: v.app?.name,
url: v.app?.url,
createTime: v.createTime ? moment(v.createTime).format("YYYY-MM-DD HH:MM:SS") : "",
updateTime: v.updateTime ? moment(v.updateTime).format("YYYY-MM-DD HH:MM:SS") : "",
confirmTime: v.confirmTime ? moment(v.confirmTime).format("YYYY-MM-DD HH:MM:SS") : "",
createTime: v.createTime ? moment(v.createTime).format("YYYY-MM-DD HH:mm:ss") : "",
updateTime: v.updateTime ? moment(v.updateTime).format("YYYY-MM-DD HH:mm:ss") : "",
confirmTime: v.confirmTime ? moment(v.confirmTime).format("YYYY-MM-DD HH:mm:ss") : "",
alarmContent: v.alarmContent,
screenshot: v.screenshot,
type: v.type,
@ -50,7 +56,7 @@ const TableData = ({ dispatch, actions, route, collectData, setSetup, exhibition
if (route == 'dataAbnormal') data = res.payload.data?.filter(v => v.desc == '数据异常')
if (route == 'strategyHit') data = res.payload.data?.filter(v => v.desc == '策略命中')
if (route == 'deviceAbnormal') data = res.payload.data?.filter(v => v.desc == '掉线' || v.desc == '不活跃')
// console.log(data);
console.log(data);
let genreData = []
data?.map(v => {
v?.unit?.map(vv => {
@ -59,41 +65,43 @@ const TableData = ({ dispatch, actions, route, collectData, setSetup, exhibition
})
// console.log(genreData);
setGenre(genreData)
if (data || data[0]?.id) {
dispatch(problem.getAlarmDataList({})).then((res) => {
// console.log(res);
if (data && data[0]?.id) {
dispatch(problem.getAlarmDataList({ ...query, ...search, groupId: '', pepProjectId: '' })).then((res) => {
console.log(res);
if (res.success) {
setCount(res.payload.data?.count || 0)
let tableDatas = res.payload.data?.rows?.map(v => ({
key: v.AlarmId,
StructureName: v.StructureName,
projectName: v.pepProject?.map(r => r.projectName)?.filter(c => c),
createTime: v.StartTime ? moment(v.StartTime).format("YYYY-MM-DD HH:mm:ss") : "",
updateTime: v.EndTime ? moment(v.EndTime).format("YYYY-MM-DD HH:mm:ss") : "",
confirmTime: v.confirmedTime ? moment(v.confirmedTime).format("YYYY-MM-DD HH:mm:ss") : "",
SourceName: v.SourceName,
AlarmGroupUnit: v.AlarmGroupUnit ? genreData.find(r => r.id == v.AlarmGroupUnit)?.name : "",
Strategy: v.AlarmGroupUnit ? genreData.find(r => r.id == v.AlarmGroupUnit)?.name : "",
type: v.AlarmGroupUnit ? genreData.find(r => r.id == v.AlarmGroupUnit)?.name : "",
AlarmCodeName: v.AlarmCodeName,
CurrentLevel: v.CurrentLevel,
detailCount: v.detailCount,
AlarmContent: v.AlarmContent,
State: v.State,
alarmType: v.alarmType,
confirm: v.confirmedContent,
}))
console.log(tableDatas);
setTableData(tableDatas)
}
})
}
}
})
// let tableDatas = res.payload.data?.rows.map(v => ({
// key: v.id,
// serialNumber: v.serialNumber,
// projectName: v.app?.projectCorrelations?.map(r => r.name)?.filter(c => c),
// appName: v.app?.name,
// url: v.app?.url,
// createTime: v.createTime ? moment(v.createTime).format("YYYY-MM-DD HH:MM:SS") : "",
// updateTime: v.updateTime ? moment(v.updateTime).format("YYYY-MM-DD HH:MM:SS") : "",
// confirmTime: v.confirmTime ? moment(v.confirmTime).format("YYYY-MM-DD HH:MM:SS") : "",
// alarmContent: v.alarmContent,
// screenshot: v.screenshot,
// type: v.type,
// confirm: v.confirm,
// }))
// console.log(tableDatas);
// setTableData(tableDatas)
break;
}
}, [route])
}, [route, query, search])
@ -113,15 +121,14 @@ const TableData = ({ dispatch, actions, route, collectData, setSetup, exhibition
let frame = []
collectData[route]?.map((v, index) => {
if (index == 0) {
frame.push(<Form.Input
label={v.name + ':'}
field={v.field}
key={v.field}
maxLength="16"
placeholder="搜索项目名称、结构物名称、或告警源名称"
labelPosition="left"
style={{ width: 292, marginRight: 10, marginBottom: 16 }}
/>)
frame.push(<Form.InputGroup key={v.field} label={v.name + ':'} labelPosition="left" style={{ width: 203, marginRight: 10, marginBottom: 16 }}>
<Form.Select style={{ width: 88 }} field='keywordTarget' initValue='source' rules={[{ required: true, message: '搜索条件必选' }]} showClear>
{[{ name: "告警源", value: "source" }, { name: "项企项目名", value: "pepProject" }, { name: "结构物名", value: "struc" },].map(vv => {
return <Form.Select.Option value={vv.value} key={vv.value}>{vv.name}</Form.Select.Option>
})}
</Form.Select>
<Form.Input field='keyword' maxLength="16" placeholder="关键字搜索" style={{ width: 115 }} />
</Form.InputGroup>)
} else {
frame.push(<Form.Select
label={v.name + ':'}
@ -175,8 +182,24 @@ const TableData = ({ dispatch, actions, route, collectData, setSetup, exhibition
onClick={() => {
api.current.validate().then((v) => {
console.log(v);
// setSearch(v);
// setQuery({ limit: 10, page: 0 })
console.log({
state: v.state,
keywordTarget: v.keywordTarget,
keyword: v.keyword,
groupUnitId: v.groupUnitId,
sustainTimeStart: v.time ? moment(v.time[0]).format("YYYY-MM-DD HH:mm:ss") : "",
sustainTimeEnd: v.time ? moment(v.time[1]).format("YYYY-MM-DD HH:mm:ss") : "",
});
setSearch({
state: v.state,
keywordTarget: v.keywordTarget,
keyword: v.keyword,
groupUnitId: v.groupUnitId,
sustainTimeStart: v.time ? moment(v.time[0]).format("YYYY-MM-DD HH:mm:ss") : "",
sustainTimeEnd: v.time ? moment(v.time[1]).format("YYYY-MM-DD HH:mm:ss") : "",
});
setQuery({ limit: 10, page: 0 })
});
}}
>
@ -192,8 +215,8 @@ const TableData = ({ dispatch, actions, route, collectData, setSetup, exhibition
>
<Table
columns={exhibition}
// dataSource={tableData}
dataSource={[{key:'1'}]}
dataSource={tableData}
// dataSource={[{ key: '1' }]}
bordered={false}
empty="暂无数据"
style={{ padding: "0px 20px", }}
@ -204,16 +227,20 @@ const TableData = ({ dispatch, actions, route, collectData, setSetup, exhibition
}
}}
rowSelection={{
selectedRowKeys: selected,
// onSelect: (record, selected) => {
// console.log(`select row: ${selected}`, record);
// },
selectedRowKeys: selected || [],
getCheckboxProps: record => ({
disabled: record.confirmTime ? true : false,
// name: record.name,
}),
onSelect: (record, selected) => {
console.log(`select row: ${selected}`, record);
},
// onSelectAll: (selected, selectedRows) => {
// console.log(`select all rows: ${selected}`, selectedRows);
// },
onChange: (selectedRowKeys, selectedRows) => {
// console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
setSelected(selectedRows.map(v => v.key))
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
setSelected(selectedRows?.map(v => v.key))
},
}}
/>
@ -227,25 +254,39 @@ const TableData = ({ dispatch, actions, route, collectData, setSetup, exhibition
>
<div>
<div style={{ display: 'inline-block', lineHeight: '30px', fontSize: 13 }}>勾选<span style={{ fontWeight: 400, color: '#0F7EFB', margin: '0 6px' }}>{selected.length}条</span>问题</div>
<Button onClick={() => setSelected(tableData?.map(v => v.key))} style={{ width: 93, height: 24, borderRadius: '1px', border: '1px solid #0F7EFB', color: '#0F7EFB', fontWeight: 400, margin: '0 10px' }}>全选</Button>
<Button onClick={() => {
if (checkAll) {
setSelected(tableData?.map(v => {
if (!v.confirmTime) {
return v.key
}
})?.filter(v => v))
} else {
setSelected([])
}
setCheckAll(!checkAll)
}}
style={{ width: 93, height: 24, borderRadius: '1px', border: '1px solid #0F7EFB', color: '#0F7EFB', fontWeight: 400, margin: '0 10px' }}>
{checkAll ? '全选' : "取消全选"}
</Button>
<Button type='primary' theme='solid' onClick={() => (setIfBulk(true), setConfirm(true))} style={{ width: 93, height: 24, borderRadius: '1px', border: '1px solid #0F7EFB', color: '#FFFFFF', fontWeight: 400, }}>批量确认</Button>
</div>
<div style={{ display: 'flex', }}>
{count > 0 ? <div style={{ display: 'flex', }}>
<span style={{ lineHeight: "30px", fontSize: 13 }}>
共{100}个问题
共{count}个问题
</span>
<Pagination
className="22"
total={100}
total={count}
showSizeChanger
currentPage={1}
currentPage={(query?.page || 0) + 1}
pageSizeOpts={[10, 20, 30, 40]}
onChange={(currentPage, pageSize) => {
// setQuery({ limit: pageSize, page: currentPage - 1 });
setQuery({ limit: pageSize, page: currentPage - 1 });
// page.current = currentPage - 1
}}
/>
</div>
</div> : ""}
</div>
</div>

164
web/client/src/sections/problem/containers/dataAlarm.jsx
View File

@ -1,7 +1,7 @@
import React, { useEffect, useState } from 'react'
import { connect } from 'react-redux'
import { IconAlertCircle } from '@douyinfe/semi-icons'
import { Button, Form, Modal, Skeleton, Pagination, TextArea } from "@douyinfe/semi-ui";
import { Button, Form, Modal, Skeleton, Pagination, TextArea, Tooltip } from "@douyinfe/semi-ui";
import Statistics from '../components/statistics'
import TableData from '../components/tableData'
import SideSheets from '../components/sideSheet'
@ -28,6 +28,7 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
const [genre, setGenre] = useState([]) //搜索类型
const [checkPop, setCheckPop] = useState(false) //查看弹框是否显现
const [alarmId, setAlarmId] = useState(false) //查看alarmId
const [query, setQuery] = useState({ limit: 10, page: 0 }) //分页
const tableType = { dataLnterrupt: 'dataLnterrupt', dataAbnormal: 'dataAbnormal', strategyHit: 'strategyHit', videoAbnormal: 'videoAbnormal', useAbnormal: 'useAbnormal', deviceAbnormal: 'deviceAbnormal' }
const statistic = { dataLnterrupt: '数据中断统计', dataAbnormal: '数据异常统计', strategyHit: '策略命中统计', videoAbnormal: '视频异常统计', useAbnormal: '应用异常统计', deviceAbnormal: '设备异常统计' }
@ -48,7 +49,6 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
//初始化表格显示设置
let data = columns[route]
data.splice(0, 1)
if (tableType[route] == 'dataAbnormal') data.splice(6, 0, '6')
localStorage.getItem(tableType[route]) == null
? localStorage.setItem(
tableType[route],
@ -65,38 +65,38 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
dataLnterrupt: [ //数据中断(dataLnterrupt)
{ name: '搜索', field: '1' },
{
name: '中断类型', field: '2',
name: '中断类型', field: 'groupUnitId',
data: genre
},
{
name: '中断状态', field: '3',
name: '中断状态', field: 'state',
data: [
{ name: '当前', value: '11' },
{ name: '历史', value: '22' }]
{ name: '当前', value: 'new' },
{ name: '历史', value: 'histroy' }]
}],
dataAbnormal: [ //数据异常(dataAbnormal)
{ name: '搜索', field: '1' },
{
name: '异常类型', field: '2',
name: '异常类型', field: 'groupUnitId',
data: genre
},
{
name: '异常状态', field: '3',
name: '异常状态', field: 'state',
data: [
{ name: '当前', value: '11' },
{ name: '历史', value: '22' }]
{ name: '当前', value: 'new' },
{ name: '历史', value: 'histroy' }]
}],
strategyHit: [ // 策略命中(strategyHit)
{ name: '搜索', field: '1' },
{
name: '策略类型', field: '2',
name: '策略类型', field: 'groupUnitId',
data: genre
},
{
name: '命中状态', field: '3',
name: '命中状态', field: 'state',
data: [
{ name: '当前', value: '11' },
{ name: '历史', value: '22' }]
{ name: '当前', value: 'new' },
{ name: '历史', value: 'histroy' }]
}],
videoAbnormal: [ // 视频异常(videoAbnormal)
{ name: '搜索', field: '1' },
@ -131,14 +131,14 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
deviceAbnormal: [ // 设备告警(deviceAbnormal)
{ name: '搜索', field: '1' },
{
name: '设备类型', field: '2',
name: '设备类型', field: 'groupUnitId',
data: genre
},
{
name: '异常状态', field: '3',
name: '异常状态', field: 'state',
data: [
{ name: '当前', value: '11' },
{ name: '历史', value: '22' }]
{ name: '当前', value: 'new' },
{ name: '历史', value: 'histroy' }]
},
{
name: '异常类型', field: '4',
@ -147,27 +147,27 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
}],
common: {
name: '持续时间',
field: '5'
field: 'time'
}
}
//表格设置信息
const tableList = {
dataLnterrupt: ['index', 'projectName', '2', '3', '4', '6', '9', 'createTime', '5', '10', 'updateTime', '11', 'confirm', 'confirmTime', '14'],
dataAbnormal: ['index', 'projectName', '2', '3', '4', 'alarmContent', '16', '9', 'createTime', '5', '10', 'updateTime', '11', 'confirm', 'confirmTime'],
strategyHit: ['index', 'projectName', '2', '3', '17', '18', 'createTime', '5', '10', 'updateTime', '11', 'confirm', 'confirmTime'],
videoAbnormal: ['index', 'projectName', '2', '3', '19', '20', '21', '22', '5', '6', 'createTime', 'updateTime', 'confirm', 'confirmTime'],
dataLnterrupt: ['index', 'projectName', 'StructureName', 'SourceName', 'AlarmGroupUnit', 'AlarmCodeName', 'createTime', 'AlarmContent', 'CurrentLevel', 'updateTime', 'detailCount', 'confirm', 'confirmTime',],
dataAbnormal: ['index', 'projectName', 'StructureName', 'SourceName', 'type', 'alarmType', 'createTime', 'AlarmContent', 'CurrentLevel', 'updateTime', 'detailCount', 'confirm', 'confirmTime'],
strategyHit: ['index', 'projectName', 'StructureName', 'SourceName', 'Strategy', 'State', 'createTime', 'AlarmContent', 'CurrentLevel', 'updateTime', 'detailCount', 'confirm', 'confirmTime'],
videoAbnormal: ['index', 'projectName', 'StructureName', 'SourceName', '19', '20', '21', '22', 'AlarmContent', 'AlarmCodeName', 'createTime', 'updateTime', 'confirm', 'confirmTime'],
useAbnormal: ['index', 'projectName', 'appName', 'url', 'type', 'alarmContent', 'createTime', 'updateTime', 'confirm', 'confirmTime'],
deviceAbnormal: ['index', 'projectName', '2', '3', '19', 'alarmContent', '21', '5', '6', 'createTime', 'updateTime', 'confirm', 'confirmTime'],
deviceAbnormal: ['index', 'projectName', 'StructureName', 'SourceName', '19', 'alarmContent', '21', 'AlarmContent', 'AlarmCodeName', 'createTime', 'updateTime', 'confirm', 'confirmTime'],
}
//表格默认配置信息
const columns = {
dataLnterrupt: ['projectName', '2', '3', '4', '5', '6', 'createTime', 'updateTime',],
dataAbnormal: ['projectName', '2', '3', 'alarmContent', '5', '6', 'createTime', 'updateTime'],
strategyHit: ['projectName', '2', '3', '17', '5', '10', '11', 'updateTime'],
videoAbnormal: ['projectName', '2', '3', '21', '20', '5', 'createTime', 'updateTime'],
dataLnterrupt: ['projectName', 'StructureName', 'SourceName', 'AlarmGroupUnit', 'AlarmContent', 'AlarmCodeName', 'createTime', 'updateTime',],
dataAbnormal: ['projectName', 'StructureName', 'SourceName', 'AlarmContent', 'AlarmCodeName', 'createTime', 'updateTime'],
strategyHit: ['projectName', 'StructureName', 'SourceName', 'Strategy', 'AlarmContent', 'CurrentLevel', 'detailCount', 'updateTime'],
videoAbnormal: ['projectName', 'StructureName', 'SourceName', '21', '20', 'AlarmContent', 'createTime', 'updateTime'],
useAbnormal: ['appName', 'projectName', 'url', 'type', 'alarmContent', 'createTime', 'updateTime'],
deviceAbnormal: ['projectName', '2', '3', 'alarmContent', '19', '5', 'createTime', 'updateTime'],
deviceAbnormal: ['projectName', 'StructureName', 'SourceName', 'alarmContent', '19', 'AlarmContent', 'createTime', 'updateTime'],
}
@ -183,7 +183,7 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
{
name: '项目名称', value: 'projectName', render: (_, r, index) => {
return <>
{r.projectName.map((v, index) => {
{r.projectName?.map((v, index) => {
let width
let name = v
switch (r.projectName?.length) {
@ -201,24 +201,43 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
{index > 0 ? <span style={{ width: 1, height: 12, border: '1px solid #DCDEE0', margin: '3px 8px', display: 'inline-block', }}></span> : ""}
{OutHidden({ width, name })}
</div>)
})}
{r.projectName?.length > 3 ?
<Tooltip
trigger="click"
// style={{ lineHeight: 2 }}
content={
<div style={{ display: 'flex', flexWrap: 'wrap' }}>
{r.projectName?.map(vv => {
return <div key={vv}>
{vv}<span style={{ color: '#FFFFFF' }}>、</span>
</div>
})}
</div>}>
<span style={{ fontSize: 14, color: '#005ABD', marginLeft: 8, cursor: "pointer", }}>
{'+' + (r.projectName?.length - 3)}
</span>
</Tooltip> : ""}
</>
}
},
{ name: '结构物名称', value: '2' },
{ name: '告警源', value: '3' },
{ name: '中断类型', value: '4' },
{ name: '告警信息', value: '5' },
{ name: '常见原因', value: '6' },
{ name: '结构物名称', value: 'StructureName' },
{ name: '告警源', value: 'SourceName' },
{ name: '中断类型', value: 'AlarmGroupUnit' },
{ name: '告警信息', value: 'AlarmContent' },
{ name: '常见原因', value: 'AlarmCodeName' },
{ name: '产生时间', value: 'createTime' },
{ name: '更新时间', value: 'updateTime' },
{ name: '服务器地址', value: '9' },
{ name: '告警等级', value: '10' },
{ name: '产生次数', value: '11' },
{
name: '告警等级', value: 'CurrentLevel', render: (_, r, index) => {
let data = { 1: '一级', 2: '二级', 3: '三级' }
return data[r.CurrentLevel]
}
},
{ name: '产生次数', value: 'detailCount' },
{ name: '确认信息', value: 'confirm', render: (_, r, index) => r.confirm },
{ name: '确认/恢复时间', value: 'confirmTime', },
{ name: '项目阶段', value: '14' },
{
name: '异常信息', value: 'alarmContent', render: (_, r, index) => {
return <>{r.alarmContent}
@ -226,9 +245,16 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
</>
}
},
{ name: '异常原因', value: '16' },
{ name: '策略类型', value: '17' },
{ name: '命中状态', value: '18' },
{ name: '异常原因', value: 'alarmType' },
{ name: '策略类型', value: 'Strategy' },
{
name: '命中状态', value: 'State', render: (_, r, index) => {
if (r.State == 3 || r.State == 4) {
return '历史'
}
return '当前'
}
},
{ name: '位置信息', value: '19' },
{ name: '设备类型', value: '20' },
{ name: '设备厂家', value: '21' },
@ -236,10 +262,7 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
{ name: '应用名称', value: 'appName' },
{ name: 'URL地址', value: 'url' },
{
name: '异常类型', value: 'type', render: (_, r, index) => {
let data = { element: '元素异常', apiError: '接口报错', timeout: '加载超时' }
return data[r.type]
}
name: '异常类型', value: 'type'
},
]
@ -254,38 +277,43 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
let setup = tableList[route].map(v => columnAll.find(vv => v == vv.value))
let data = []
if (tableType[route] == 'dataAbnormal') {
data = ['6']
data.splice(1, 0, ...arr)
} else {
data.splice(1, 0, ...arr)
}
// if (tableType[route] == 'dataAbnormal') {
// data = ['AlarmCodeName']
// data.splice(1, 0, ...arr)
// } else {
data.splice(1, 0, ...arr)
// }
// console.log(data)
console.log(data)
// let TableDisplay = []
let TableDisplay = data.map(v => {
let datas = columnAll.find(vv => v == vv.value)
let TableDisplay = data?.map(v => {
let datas = columnAll?.find(vv => v == vv.value)
if (datas) {
return { title: datas.name, dataIndex: datas.value, rowKey: datas.value, render: datas.render }
}
})
console.log(TableDisplay);
TableDisplay.push({
title: '操作',
dataIndex: 'text',
rowKey: 'text',
render: (_, r) => {
return <>
return <div style={{ width: 190 }}>
{r.confirmTime ? <Button theme='borderless' disabled>已确认</Button> :
<Button theme='borderless' onClick={() => (setConfirm(true), setSelected([r.id]))}>确认</Button>
}
{route ? ['dataLnterrupt', 'dataAbnormal', 'strategyHit'].includes(route) ?
{<Button theme='borderless' disabled>已派单</Button>}
{route ? ['dataLnterrupt', 'dataAbnormal', 'strategyHit'].includes(route) ? <>
<Button theme='borderless' disabled>已派单</Button>
<Button theme='borderless' onClick={() => (setCheckPop(true))}>查看</Button>
</>
: "" : ""
}
</>
</div>
}
})
// console.log(TableDisplay);
@ -371,8 +399,24 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
width={600}
onCancel={() => setConfirm(false)}
onOk={() => {
dispatch(problem.postApiConfirm({ appAlarmId: selected, confirm: content }))
setConfirm(false)
if (route == 'useAbnormal') {
dispatch(problem.postApiConfirm({ appAlarmId: selected, confirm: content })).then(res => {
if (res.success) {
setConfirm(false)
setQuery({ limit: query.limit, page: query.page })
}
})
} else if (route == 'videoAbnormal') {
setConfirm(false)
} else {
dispatch(problem.putAlarmdataConfirm({ alarmId: selected, content: content })).then(res => {
if (res.success) {
setConfirm(false)
setQuery({ limit: query.limit, page: query.page })
}
})
}
}}
>
<div style={{ display: 'flex', paddingLeft: 20 }}>

2
web/client/src/utils/webapi.js
View File

@ -42,7 +42,7 @@ export const ApiTable = {
getAlarmDataList: "alarm/data/list", //查询数据告警列表
getAlarmDataDetailAgg: 'alarm/data/detail_agg', //查询数据告警详情聚集数据
getAlarmDataDetail: 'alarm/data/detail', //查询数据告警详情
putAlarmdataConfirm: "alarm/data/confirm", //确认数据告警
};

Write Preview
Loading…
Cancel
Save