From 7efc9c9d74890a5e25d69c6e27ec11accc212e01 Mon Sep 17 00:00:00 2001 From: wenlele Date: Tue, 8 Nov 2022 17:17:42 +0800 Subject: [PATCH] =?UTF-8?q?=E8=B7=AF=E7=94=B1=E8=B7=B3=E8=BD=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../sections/control/containers/control.jsx | 16 +- .../sections/problem/components/tableData.jsx | 212 ++++++++++-------- .../sections/problem/containers/dataAlarm.jsx | 21 +- web/package.json | 3 +- 4 files changed, 141 insertions(+), 111 deletions(-) diff --git a/web/client/src/sections/control/containers/control.jsx b/web/client/src/sections/control/containers/control.jsx index 4659cd2..2d301ac 100644 --- a/web/client/src/sections/control/containers/control.jsx +++ b/web/client/src/sections/control/containers/control.jsx @@ -23,8 +23,8 @@ let member let web -const Control = (props) => { - const { dispatch, actions, user, loading, socket, pepProjectId } = props +const Control = ({ dispatch, actions, user, history, loading, socket, pepProjectId }) => { + const { control, install } = actions const [timelineList, setTimelineList] = useState(['', '', '', '', '', '', '', '', '', '', '', '', '', '', '', '', ''])//最新动态列表 @@ -171,7 +171,7 @@ const Control = (props) => { await dispatch(control.getAppAlarmsAggDay({ pepProjectId: pepProjectId })).then(res => { if (res.success) setAppBI(res.payload.data) }) - await dispatch(control.getAlarmsHandleStatistics({ pepProjectId: pepProjectId })).then(res => { + await dispatch(control.getAlarmsHandleStatistics({ projectCorrelationId: pepProjectId })).then(res => { if (res.success) setEfficiencyBI(res.payload.data[0]) }) } @@ -681,7 +681,7 @@ const Control = (props) => {
{exhibition.current['workbench']?.map((item, index) => { return ( -
+ pepProjectId && item.name == '关注的项目' ? '' :
{item.name} @@ -915,7 +915,13 @@ const Control = (props) => { problemsList?.map((v, index) => { return (
{ - dispatch(push(v.url)) + history.push({ + pathname: v.url, + query: { + keywordTarget: v.groupName == '应用异常' ? "" : 'source', + keyword:v.SourceName, + } + }) }}>
【{v.SourceName}】{v.groupName}{v.groupName == '视频异常' ? "" : '，诊断为 '} {v.typeName}，请前往确认 diff --git a/web/client/src/sections/problem/components/tableData.jsx b/web/client/src/sections/problem/components/tableData.jsx index a3780db..936512c 100644 --- a/web/client/src/sections/problem/components/tableData.jsx +++ b/web/client/src/sections/problem/components/tableData.jsx @@ -5,23 +5,31 @@ import { SkeletonScreen, } from "$components"; import moment from "moment"; import { validate } from "schema-utils"; import { emit } from "superagent"; +import qs from "qs"; const TableData = ({ route, dispatch, actions, collectData, setSetup, exhibition, pepProjectId, - selected, setSelected, setIfBulk, setConfirm, setGenre, query, setQuery, tableData, setTableData }) => { + selected, setSelected, setIfBulk, setConfirm, genre, setGenre, query, setQuery, tableData, setTableData, location }) => { const { problem } = actions const [count, setCount] = useState(0) // - const [search, setSearch] = useState({}) //查询 + // const [search, setSearch] = useState({}) const [checkAll, setCheckAll] = useState(true) //查询 + const api = useRef(); + const search = useRef({ + state: '', keywordTarget: '', keyword: '', kindId: '', groupUnitId: '', + errType: '', confirmState: '', onlineState: '', sustainTimeStart: '', sustainTimeEnd: '' + }) + const kindName = useRef() + const groupId = useRef() let title = { dataLnterrupt: "数据中断详情", dataAbnormal: "数据异常详情", strategyHit: "策略命中详情", videoAbnormal: "视频异常详情", useAbnormal: "应用异常详情", deviceAbnormal: "设备异常详情" } useEffect(() => { switch (route) { case 'useAbnormal': - dispatch(problem.getAlarmLnspectionApi({ ...search, pepProjectId: pepProjectId })).then((res) => { + dispatch(problem.getAlarmLnspectionApi({ ...search.current, pepProjectId: pepProjectId })).then((res) => { if (res.success) { let typeData = { element: "元素异常", apiError: "接口报错 ", timeout: "加载超时" } let tableDatas = res.payload.data?.rows.map(v => ({ @@ -46,15 +54,7 @@ const TableData = ({ route, dispatch, actions, collectData, setSetup, exhibition }) break; case 'videoAbnormal': - let cameraKind = [] - dispatch(problem.getAlarmVideoDeviceKind()).then((res) => { - if (res.success) { - cameraKind = res.payload.data.map(v => ({ name: v.kind, value: v.id })) - setGenre(res.payload.data.map(v => ({ name: v.kind, value: v.id }))) - } - }) - - dispatch(problem.getAlarmVideoList({ ...search, pepProjectId: pepProjectId })).then((res) => { + dispatch(problem.getAlarmVideoList({ ...search.current, pepProjectId: pepProjectId })).then((res) => { if (res.success) { let tableDatas = res.payload.data?.map(v => ({ key: v.alarmId, @@ -72,7 +72,7 @@ const TableData = ({ route, dispatch, actions, collectData, setSetup, exhibition resolve: v.resolve || [], cameraChannelNo: v.cameraChannelNo, cameraSerialNo: v.cameraSerialNo, - cameraKindId: v.cameraKindId ? cameraKind?.find(u => u.value == v.cameraKindId)?.name : "", + cameraKindId: v.cameraKindId ? kindName.current?.find(u => u.value == v.cameraKindId)?.name : "", venderName: v.venderName, platform: v.platform, confirm: v.confirmContent, @@ -85,61 +85,79 @@ const TableData = ({ route, dispatch, actions, collectData, setSetup, exhibition }) break; default: - dispatch(problem.getAlarmDataGroup()).then((res) => { - if (res.success) { - let data - if (route == 'dataLnterrupt') data = res.payload.data?.filter(v => v.desc == '数据中断') - 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 == '不活跃') - let genreData = [] - data?.map(v => { - v?.unit?.map(vv => { - genreData.push({ name: vv.name, value: vv.id }) - }) - }) - setGenre(genreData) - if (data && data[0]?.id) { - dispatch(problem.getAlarmDataList({ ...query, ...search, groupId: data.map(v => v.id).join(), pepProjectId: pepProjectId })).then((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.pomsProject?.map(r => (r.name ? { id: r.id, name: r.name, state: 'PMOS' } : { - id: r.id, name: r.pepProject?.projectName, state: r.pepProject?.constructionStatus - }))?.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.value == v.AlarmGroupUnit)?.name : "无", - Strategy: v.AlarmGroupUnit ? genreData.find(r => r.value == v.AlarmGroupUnit)?.name : "", - type: route == 'deviceAbnormal' ? v.DeviceStatus == 0 ? "离线" : '' : v.AlarmGroupUnit ? genreData.find(r => r.value == v.AlarmGroupUnit)?.name : "", - cameraKindId: v.AlarmGroupUnit ? genreData.find(r => r.value == v.AlarmGroupUnit)?.name : "", - AlarmCodeName: v.AlarmCodeName, - CurrentLevel: v.CurrentLevel, - detailCount: v.detailCount, - AlarmContent: v.AlarmContent, - State: v.State, - alarmType: v.alarmType, - confirm: v.confirmedContent, - station: v.StructureLongitude && v.StructureLatitude ? v.StructureLongitude + '. ' + v.StructureLatitude : "", - })) - setTableData(tableDatas) - } - }) + if (genre?.length > 0) { + dispatch(problem.getAlarmDataList({ ...query, ...search.current, groupId: groupId.current.map(v => v.id).join(), pepProjectId: pepProjectId })).then((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.pomsProject?.map(r => (r.name ? { id: r.id, name: r.name, state: 'PMOS' } : { + id: r.id, name: r.pepProject?.projectName, state: r.pepProject?.constructionStatus + }))?.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 ? genre?.find(r => r.value == v.AlarmGroupUnit)?.name : "无", + Strategy: v.AlarmGroupUnit ? genre?.find(r => r.value == v.AlarmGroupUnit)?.name : "", + type: route == 'deviceAbnormal' ? v.DeviceStatus == 0 ? "离线" : '' : v.AlarmGroupUnit ? genre?.find(r => r.value == v.AlarmGroupUnit)?.name : "", + cameraKindId: v.AlarmGroupUnit ? genre?.find(r => r.value == v.AlarmGroupUnit)?.name : "", + AlarmCodeName: v.AlarmCodeName, + CurrentLevel: v.CurrentLevel, + detailCount: v.detailCount, + AlarmContent: v.AlarmContent, + State: v.State, + alarmType: v.alarmType, + confirm: v.confirmedContent, + station: v.StructureLongitude && v.StructureLatitude ? v.StructureLongitude + '. ' + v.StructureLatitude : "", + })) + setTableData(tableDatas) } - - } - }) + }) + } break; } + }, [query, genre, pepProjectId]) - }, [query, search, pepProjectId]) - // console.log(exhibition); - // console.log(tableData); + useEffect(() => { + if (location) { + search.current = { ...search.current, ...location } + } + if (route !== 'videoAbnormal' && route !== 'useAbnormal') { + dispatch(problem.getAlarmDataGroup()).then((res) => { + if (res.success) { + let data + if (route == 'dataLnterrupt') data = res.payload.data?.filter(v => v.desc == '数据中断') + 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 == '不活跃') + groupId.current = data + let genreData = [] + data?.map(v => { + v?.unit?.map(vv => { + genreData.push({ name: vv.name, value: vv.id }) + }) + }) + setGenre(genreData) + } + }) + } + if (route == 'useAbnormal') { + setGenre({ element: "元素异常", apiError: "接口报错 ", timeout: "加载超时" }) + } + if (route == 'videoAbnormal') { + dispatch(problem.getAlarmVideoDeviceKind()).then((res) => { + if (res.success) { + kindName.current = res.payload.data.map(v => ({ name: v.kind, value: v.id })) + setGenre(res.payload.data.map(v => ({ name: v.kind, value: v.id }))) + } + }) + } + }, []) + + console.log(location); return ( <> @@ -234,7 +252,7 @@ const TableData = ({ route, dispatch, actions, collectData, setSetup, exhibition style={{ width: 80, height: 32, borderRadius: 3, }} onClick={() => { api.current.validate().then((v) => { - setSearch({ + search.current = { state: v.state, keywordTarget: v.keywordTarget, keyword: v.keyword, @@ -245,7 +263,7 @@ const TableData = ({ route, dispatch, actions, collectData, setSetup, exhibition onlineState: v.onlineState, sustainTimeStart: v.time && v.time.length > 0 ? moment(v.time[0]).format("YYYY-MM-DD HH:mm:ss") : "", sustainTimeEnd: v.time && v.time.length > 0 ? moment(v.time[1]).format("YYYY-MM-DD HH:mm:ss") : "", - }); + } setSelected([]) setQuery({ limit: 10, page: 0 }) }); @@ -261,36 +279,40 @@ const TableData = ({ route, dispatch, actions, collectData, setSetup, exhibition active={true} placeholder={SkeletonScreen()} > - 暂无告警数据} - style={{}} - pagination={false} - onRow={(record, index) => { - if (index % 1 === 0) { - return { style: { background: '#FAFCFF' } } - } - }} - rowSelection={{ - 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(tableData); + return
暂无告警数据} + style={{}} + pagination={false} + onRow={(record, index) => { + if (index % 1 === 0) { + return { style: { background: '#FAFCFF' } } + } + }} + rowSelection={{ + 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)) + }, + }} + /> + })()} +
{ +const DataAlarm = (props) => { + const { match, dispatch, actions, user, loading, socket, iotVcmpWeb } = props let route = match.url.substring(match.url.lastIndexOf("/") + 1, match.url.length) const { problem } = actions @@ -304,14 +305,14 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket, iotVcmpWeb name: '操作', sort: 25, value: 'text', render: (_, r, index) => { return
{r.State < 3 || route && ['videoAbnormal', 'useAbnormal'].includes(route) && !r.confirmTime ? - - : r.State == 3 || r.autoRestore || r.confirmAuto ? + + : r.State == 3 || r.autoRestore || r.confirmAuto ? : - - } + + } {route && ['dataLnterrupt', 'dataAbnormal', 'strategyHit', 'deviceAbnormal'].includes(route) ? <> {route == 'deviceAbnormal' ? "" :