|
|
|
@ -1,22 +1,128 @@ |
|
|
|
|
|
|
|
import React, { useState, useEffect, useRef } from "react"; |
|
|
|
import { connect } from "react-redux"; |
|
|
|
import { DatePicker } from "@douyinfe/semi-ui"; |
|
|
|
import { Button, Form, Modal, Skeleton, Pagination, Table } from "@douyinfe/semi-ui"; |
|
|
|
|
|
|
|
|
|
|
|
const Inspection = ({ dispatch, actions, route, statistic }) => { |
|
|
|
const { problem } = actions |
|
|
|
const [selectProject, setSelectProject] = useState([]) |
|
|
|
const [applyFilter, setApplyFilter] = useState([]) |
|
|
|
|
|
|
|
const api = useRef(); |
|
|
|
|
|
|
|
// console.log(actions); |
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
dispatch(problem.getProjectPoms()).then((res) => { |
|
|
|
// console.log(res.payload.data); |
|
|
|
if (res.success) { |
|
|
|
let project = [] |
|
|
|
let apply = [] |
|
|
|
res.payload.data?.rows?.map(v => { |
|
|
|
project.push({ name: v.pepProjectName || v.name || v.id, value: v.id }) |
|
|
|
v.projectApps.map(app => apply.push({ name: app.name, value: app.id })) |
|
|
|
}) |
|
|
|
setSelectProject(project) |
|
|
|
setApplyFilter(apply) |
|
|
|
} |
|
|
|
}) |
|
|
|
dispatch(problem.getAlarmLnspection({})).then((res) => { |
|
|
|
console.log(res.payload.data); |
|
|
|
}) |
|
|
|
}, []) |
|
|
|
|
|
|
|
const Inspection = ({ dispatch, actions, route }) => { |
|
|
|
|
|
|
|
console.log(route); |
|
|
|
return ( |
|
|
|
|
|
|
|
<div style={{ width: '100%', height: 180, backgroundColor: 'white', marginBottom: 20 }}> |
|
|
|
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}> |
|
|
|
<div style={{ width: 190, fontSize: 24, fontFamily: 'YouSheBiaoTiHei', color: '#101531', }}><span style={{ width: 3, height: 20, background: '#005ABD', display: 'inline-block', margin: "0 10px 0 10px" }}></span>数据异常统计</div> |
|
|
|
<div style={{ fontSize: 24, fontFamily: 'YouSheBiaoTiHei', color: '#BDDBFC' }}><img src="/assets/images/problem/keyboard.png" style={{ width: 30, height: 17, marginRight: 10 }} />开发中，敬请期待！</div> |
|
|
|
<div style={{ width: 400, }}> |
|
|
|
<span style={{ width: 3, height: 20, background: '#005ABD', display: 'inline-block', margin: "0 10px 0 20px" }}></span> |
|
|
|
<span style={{ fontSize: 24, fontFamily: 'YouSheBiaoTiHei', color: '#101531', marginRight: 10 }}>{statistic[route]}</span> |
|
|
|
<span style={{ fontSize: 12 }}>APPLY SEMI-AUTOMATIC INSPECTION</span> |
|
|
|
<div style={{ fontSize: 12 }}>仅保留48小时内的图片数据,每小时覆盖执行一次 <span style={{ fontWeight: 500, color: '#005ABD', fontSize: 12 }}>03专项2期：已阅共123个</span></div> |
|
|
|
</div> |
|
|
|
<div style={{}}> |
|
|
|
<Form |
|
|
|
onSubmit={(values) => console.log(values)} |
|
|
|
// onValueChange={values=>console.log(values)} |
|
|
|
getFormApi={(formApi) => (api.current = formApi)} |
|
|
|
layout="horizontal" |
|
|
|
style={{ position: "relative", width: "100%", flex: 1 }} |
|
|
|
> |
|
|
|
<Form.DatePicker |
|
|
|
type="dateTimeRange" |
|
|
|
labelPosition="left" |
|
|
|
style={{ width: 352 }} |
|
|
|
label='时间筛选:' |
|
|
|
field='time' |
|
|
|
key='time' |
|
|
|
// defaultPickerValue={[new Date('2022-08-08 00:00'), new Date('2022-08-09 12:00')]} |
|
|
|
// initValue={[new Date('2022-08-08 00:00'), new Date()]} |
|
|
|
onChange={(v) => console.log(v)} |
|
|
|
/> |
|
|
|
<Form.Select |
|
|
|
label='所选项目:' |
|
|
|
labelPosition="left" |
|
|
|
field='projectId' |
|
|
|
key='projectId' |
|
|
|
style={{ width: 116, marginRight: 10, color: "#F9F9F9", }} |
|
|
|
placeholder="全部" |
|
|
|
showClear |
|
|
|
> |
|
|
|
{selectProject?.map((item) => { |
|
|
|
return ( |
|
|
|
<Form.Select.Option key={item.value} value={item.value}> |
|
|
|
{item.name} |
|
|
|
</Form.Select.Option> |
|
|
|
); |
|
|
|
})} |
|
|
|
</Form.Select> |
|
|
|
<Form.Select |
|
|
|
label='应用筛选:' |
|
|
|
labelPosition="left" |
|
|
|
field='appId' |
|
|
|
key='appId' |
|
|
|
style={{ width: 116, marginRight: 10, color: "#F9F9F9", }} |
|
|
|
placeholder="全部" |
|
|
|
showClear |
|
|
|
> |
|
|
|
{applyFilter?.map((item) => { |
|
|
|
return ( |
|
|
|
<Form.Select.Option key={item.value} value={item.value}> |
|
|
|
{item.name} |
|
|
|
</Form.Select.Option> |
|
|
|
); |
|
|
|
})} |
|
|
|
</Form.Select> |
|
|
|
<Form.Select |
|
|
|
label='显示范围:' |
|
|
|
labelPosition="left" |
|
|
|
field='noted' |
|
|
|
key='noted' |
|
|
|
style={{ width: 116, marginRight: 10, color: "#F9F9F9", }} |
|
|
|
placeholder="全部" |
|
|
|
showClear |
|
|
|
> |
|
|
|
{[{ name: '已阅', value: 'noted' }, { name: '未阅', value: 'unnote' }].map((item) => { |
|
|
|
return ( |
|
|
|
<Form.Select.Option key={item.value} value={item.value}> |
|
|
|
{item.name} |
|
|
|
</Form.Select.Option> |
|
|
|
); |
|
|
|
})} |
|
|
|
</Form.Select> |
|
|
|
|
|
|
|
</Form> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div style={{}}> |
|
|
|
<img src="/_file-server/project/da09f988-4c62-46fc-a532-b4cf053a4b6d/accurate_invest.png" style={{ width: 400, height: 128 }} /> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<img src="project/da09f988-4c62-46fc-a532-b4cf053a4b6d/accurate_invest.png" alt="" /> |
|
|
|
</div > |
|
|
|
) |
|
|
|
} |
|
|
|
@ -26,7 +132,7 @@ function mapStateToProps (state) { |
|
|
|
const { auth, global, members } = state; |
|
|
|
return { |
|
|
|
// user: auth.user, |
|
|
|
// actions: global.actions, |
|
|
|
actions: global.actions, |
|
|
|
// global: global, |
|
|
|
// members: members.data, |
|
|
|
}; |
|
|
|
|
