|
|
@ -25,7 +25,7 @@ const Bigscreen = (props) => { |
|
|
|
const [proportion, setProportion] = useState([]) |
|
|
|
const [formatter, setFormatter] = useState({}) |
|
|
|
const [groupDetail, setGroupDetail] = useState({}) |
|
|
|
|
|
|
|
const [allProjects,setAllProjects]=useState([]) |
|
|
|
const [alarmData, setAlarmData] = useState()//第三项之后的数据 |
|
|
|
const [biggest, setBiggest] = useState()//最大的刻度值 |
|
|
|
const [mockData, setMockData] = useState()//所有的告警数据 |
|
|
@ -36,6 +36,7 @@ const Bigscreen = (props) => { |
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
|
|
|
|
|
|
|
let groupIdLocal = JSON.parse(localStorage.getItem('project_group'))?.find(v => user?.id == v.userId)?.projectGroupId |
|
|
|
|
|
|
|
let search = restProps?.location?.search || ''; |
|
|
@ -67,7 +68,11 @@ const Bigscreen = (props) => { |
|
|
|
setGroupDetail(res.payload.data) |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
dispatch(actions.workOrder.getPomsProjectBasicAll()).then(res => { |
|
|
|
if (res.success) { |
|
|
|
setAllProjects(res.payload.data) |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -135,27 +140,27 @@ const Bigscreen = (props) => { |
|
|
|
} |
|
|
|
}, [mockData]) |
|
|
|
|
|
|
|
console.log('xxx1',actions) |
|
|
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
if(groupDetail?.pomsProjectIds&&groupDetail?.pomsProjectIds.length){ |
|
|
|
if(groupDetail?.pomsProjectIds&&groupDetail?.pomsProjectIds.length&&allProjects&&allProjects.length){ |
|
|
|
const query=groupDetail?.pomsProjectIds+'' |
|
|
|
dispatch(actions.projectGroup.getProjectWorkOrders({projectIds:query})).then(res=>{ |
|
|
|
if(res.success){ |
|
|
|
setProportion([...res.payload.data?.slice(0, 3)?.map(v => ({ name: pomsProjectBasicAll.find(item=>item.valiue===v.projectId)?.label, value: v.count })), |
|
|
|
{ value: res.payload.data&&res.payload.data.length>3?res.payload.data?.slice(3)?.reduce((p,c)=>{ |
|
|
|
return p+c.count |
|
|
|
},0):0, name: '其它' }]) |
|
|
|
setProportion([...res.payload.data?.slice(0, 3)?.map(v => ({ name: allProjects?.find(item=>item.value===v.projectId)?.label, value: Number(v.count) })), |
|
|
|
{ name: '其它', value: res.payload.data&&res.payload.data.length>3?res.payload.data?.slice(3)?.reduce((p,c)=>{ |
|
|
|
return p+Number(c.count) |
|
|
|
},0):0 }]) |
|
|
|
} |
|
|
|
}) |
|
|
|
dispatch(actions.projectGroup.getProjectWorkOrders({projectIds:query})).then(res=>{ |
|
|
|
dispatch(actions.projectGroup.getWorkOrdersRepairRank({projectIds:query})).then(res=>{ |
|
|
|
if(res.success){ |
|
|
|
setGroupProject(res.payload.data?.slice(0, 10).map(v => ({name:v.formname,duration:v?.endTime.diff(v?.startTime,'hours') })) || []) |
|
|
|
setGroupProject(res.payload.data?.slice(0, 10).map(v => ({name:v.formname,startTime:moment(v?.startTime).format('YYYY-MM-DD'),duration:moment(v?.endTime).add(8, 'hours').diff(v?.startTime,'hours') })) || []) |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
} |
|
|
|
},[groupDetail]) |
|
|
|
},[groupDetail,allProjects]) |
|
|
|
|
|
|
|
let statisticOnline = (groupId) => { |
|
|
|
dispatch(actions.projectGroup.groupStatisticOnline({ groupId })).then(res => { |
|
|
@ -225,6 +230,7 @@ console.log('xxx1',actions) |
|
|
|
}, [proportion]); |
|
|
|
return ( |
|
|
|
<div className='project-group'> |
|
|
|
|
|
|
|
<Header match={match} history={history} {...props} groupDetail={groupDetail} /> |
|
|
|
<Body> |
|
|
|
<div style={{ width: "100%", height: '100%' }}> |
|
|
@ -321,8 +327,8 @@ console.log('xxx1',actions) |
|
|
|
return index < 10 ? <div style={{ display: "flex", background: index % 2 == 1 ? "#F6F9FF" : '', padding: 6, height: 50, alignItems: 'center' }}> |
|
|
|
<div style={{ textAlign: 'center', width: '25%', fontFamily: 'SourceHanSansCN-Regular', color: '#2C66F3', fontWeight: 400 }}> |
|
|
|
NO.{index + 1}</div> |
|
|
|
<div title={c.fromname} style={{ textAlign: 'center', padding: '0 6px', width: '49%', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}> |
|
|
|
{c.fromname}</div> |
|
|
|
<div title={`${c.name}(${c.startTime})`} style={{ textAlign: 'center', padding: '0 6px', width: '49%', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}> |
|
|
|
{c.name}({c.startTime})</div> |
|
|
|
<div style={{ textAlign: 'center', width: '25%', fontFamily: 'SourceHanSansCN-Regular', fontWeight: 400 }}> |
|
|
|
{c.duration}h</div> |
|
|
|
</div> : <></> |
|
|
@ -485,7 +491,7 @@ console.log('xxx1',actions) |
|
|
|
return <div style={{ display: "flex", background: index % 2 == 1 ? "#F6F9FF" : '', height: 40, alignItems: 'center' }}> |
|
|
|
<div style={{ textAlign: 'center', width: '33%', fontFamily: 'SourceHanSansCN-Regular', color: '#2C66F3', fontWeight: 400 }}>{c.name}</div> |
|
|
|
<div style={{ textAlign: 'center', width: '33%' }}>{title}</div> |
|
|
|
<div style={{ textAlign: 'center', width: '33%', fontFamily: 'SourceHanSansCN-Regular', color: '#F33B3B', fontWeight: 400 }}>{c.offnum + '/' + c.totnum+`(${(c.offnum/c.totnum).toFixed(4)*100}%)`}</div> |
|
|
|
<div style={{ textAlign: 'center', width: '33%', fontFamily: 'SourceHanSansCN-Regular', color: '#F33B3B', fontWeight: 400 }}>{c.offnum + '/' + c.totnum+`(${((c.offnum/c.totnum)*100).toFixed(2)}%)`}</div> |
|
|
|
</div> |
|
|
|
})}</> } containerStyle={{ position: "relative", height: "85%", }} |
|
|
|
divHeight={"100%"} divId={"interruptchart"}/> |
|
|
@ -500,14 +506,16 @@ console.log('xxx1',actions) |
|
|
|
</div > |
|
|
|
) |
|
|
|
} |
|
|
|
|
|
|
|
function mapStateToProps (state) { |
|
|
|
const { auth, global, groupStatisticOnline } = state; |
|
|
|
|
|
|
|
const { auth, global, groupStatisticOnline,pomsProjectBasicAll } = state; |
|
|
|
return { |
|
|
|
user: auth.user, |
|
|
|
actions: global.actions, |
|
|
|
clientHeight: global.clientHeight, |
|
|
|
groupStatisticOnline: groupStatisticOnline?.data |
|
|
|
groupStatisticOnline: groupStatisticOnline?.data, |
|
|
|
pomsProjectBasicAll: pomsProjectBasicAll.data || [], |
|
|
|
|
|
|
|
}; |
|
|
|
} |
|
|
|
|
|
|
|