12 changed files with 439 additions and 396 deletions
@ -1,4 +0,0 @@ |
|||||
alter table report |
|
||||
add handle_opinions varchar(1024); |
|
||||
|
|
||||
comment on column report.handle_opinions is '处理意见'; |
|
||||
@ -1,6 +1,13 @@ |
|||||
ALTER TABLE "public"."report" |
ALTER TABLE "public"."report" |
||||
ADD COLUMN "handle_advice" varchar(1024); |
ADD COLUMN "handle_advice" varchar(1024) |
||||
|
add handle_opinions varchar(1024); |
||||
|
|
||||
COMMENT ON COLUMN "public"."report"."handle_state" IS '待处理 / 已指派 / 已处理 / 不处理'; |
COMMENT ON COLUMN "public"."report"."handle_state" IS '待处理 / 已指派 / 已处理 / 不处理'; |
||||
|
|
||||
COMMENT ON COLUMN "public"."report"."handle_advice" IS '管理员处理意见'; |
COMMENT ON COLUMN "public"."report"."handle_advice" IS '管理员处理意见'; |
||||
|
|
||||
|
comment on column report.handle_opinions is '处理意见'; |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|||||
@ -1,108 +1,139 @@ |
|||||
import React, { useState, useEffect } from 'react' |
import React, { useState, useEffect } from 'react' |
||||
import Module from '../../../public/module' |
import Module from '../../../public/module' |
||||
import { Spin } from 'antd' |
import { Carousel, Tooltip, } from 'antd' |
||||
import Lun from "./lunbo" |
import Lun from "./lunbo" |
||||
|
import moment from 'moment' |
||||
import "./left.less" |
import "./left.less" |
||||
import { getZhichaolist } from "../../../../actions/example" |
import { getZhichaolist } from "../../../../actions/example" |
||||
|
import { getRoadadministration } from '../../../../../fillion/actions/luzheng' |
||||
|
import NoData from '../../../public/noData'; |
||||
|
import AutoRollComponent from '../../build/AutoRollComponent' |
||||
|
|
||||
|
|
||||
|
|
||||
const Rightbottom = (props) => { |
const Rightbottom = (props) => { |
||||
const { dispatch } = props |
const { dispatch } = props |
||||
const style = { height: "28%", marginTop: "4%" } |
const style = { height: "28%", marginTop: "4%" } |
||||
const [beijing, setBeijing] = useState() |
const [beijing, setBeijing] = useState() |
||||
const [list, setList] = useState([]) |
const [list, setList] = useState([]) |
||||
const [rightDatas, setrightDatas] = useState([]) |
const [rightDatas, setrightDatas] = useState([]) |
||||
const [nums, setNums] = useState([]) |
const [nums, setNums] = useState([]) |
||||
const [num, setNum] = useState() |
const [num, setNum] = useState() |
||||
const requestRightDatas = async () => { |
const [rightitemlist, setrightitemlist] = useState([]) |
||||
const res = await dispatch(getZhichaolist()) |
|
||||
var pattern = /[\u4e00-\u9fa5]*/; |
const requestRightDatas = async () => { |
||||
let d = res.payload.data?.overSpeedList?.filter((item, index) => { |
const res = await dispatch(getZhichaolist()) |
||||
return /.*[\u4e00-\u9fa5_a-zA-Z]+.*$/.test(item.processingTime) == false |
var pattern = /[\u4e00-\u9fa5]*/; |
||||
}) |
let d = res.payload.data?.overSpeedList?.filter((item, index) => { |
||||
console.log(res); |
return /.*[\u4e00-\u9fa5_a-zA-Z]+.*$/.test(item.processingTime) == false |
||||
d.map((item, index) => { |
}) |
||||
if (parseInt(item.processingTime.match(/([^.]*)$/)[0]) < 10) { |
console.log(res); |
||||
return item.processingTime = `${(item.processingTime.match(/^([^.]*)(.[^.]*)/)[0])}.0${parseInt(item.processingTime.match(/([^.]*)$/)[0])}` |
d.map((item, index) => { |
||||
} |
if (parseInt(item.processingTime.match(/([^.]*)$/)[0]) < 10) { |
||||
}) |
return item.processingTime = `${(item.processingTime.match(/^([^.]*)(.[^.]*)/)[0])}.0${parseInt(item.processingTime.match(/([^.]*)$/)[0])}` |
||||
d.sort((a, b) => b.processingTime.localeCompare(a.processingTime)) |
} |
||||
// setrightDatas(res.payload.data)
|
}) |
||||
setList(d) |
d.sort((a, b) => b.processingTime.localeCompare(a.processingTime)) |
||||
} |
// setrightDatas(res.payload.data)
|
||||
useEffect(() => { |
setList(d) |
||||
const zhichaolist = dispatch(getZhichaolist()).then((res) => { |
} |
||||
setNums(res.payload?.data?.processed) |
useEffect(() => { |
||||
|
// const zhichaolist = dispatch(getZhichaolist()).then((res) => {
|
||||
}) |
// setNums(res.payload?.data?.processed)
|
||||
requestRightDatas() |
|
||||
}, []) |
// })
|
||||
console.log(list); |
// requestRightDatas()
|
||||
const renderBody = () => { |
roadManagement() |
||||
return ( |
}, []) |
||||
<div style={{ width: "100%", height: "50%" }}> |
|
||||
{/* <Spin spinning={!list} tip="Loading" size="large"> */} |
const roadManagement = async () => { |
||||
{list?.map((item, index) => { |
await dispatch(getRoadadministration({})).then(res => { |
||||
return <li style={{ width: "100%", height: "3vh", marginTop: "5px", position: "relative", }} onMouseEnter={() => { |
if (res.success) { |
||||
setBeijing(index) |
setrightitemlist(res.payload.data?.rows || []) |
||||
setNum(index) |
} |
||||
// console.log(beijing);
|
}) |
||||
}} onMouseLeave={() => { |
|
||||
setBeijing() |
|
||||
setNum() |
|
||||
}}> |
} |
||||
{beijing == index ? <img src='/assets/images/leadership/bei.png' style={{ width: "100%", height: "100%", position: "absolute" }} /> : ""} |
|
||||
<div style={{ width: "30%", height: "100%", textAlign: "center", lineHeight: "3vh", fontSize: "14px", color: beijing == index ? "#FFFFFF" : "rgba(216,240,255,0.8000)", position: "absolute" }}>{item.licensePlate}</div> |
const renderContent = () => { |
||||
<div style={{ width: "10%", height: "100%", textAlign: "center", lineHeight: "3vh", fontSize: "14px", color: beijing == index ? "#FFFFFF" : "rgba(216,240,255,0.8000)", position: "absolute", left: "30%" }}>{item.overrunRate ? item.overrunRate + "%" : "--"}</div> |
|
||||
<div style={{ width: "30%", height: "100%", textAlign: "center", lineHeight: "3vh", fontSize: "14px", color: beijing == index ? "#FFFFFF" : "rgba(216,240,255,0.8000)", position: "absolute", left: "40%" }}>{item.deductPoints ? "-" + item.deductPoints + "分" : ""}{item.deductPoints && item.fine ? "和" : ""}{item.fine ? "-" + item.fine + "元" : ""}{item.deductPoints || item.fine ? "" : "--"}</div> |
return <div style={{ height: "100%" }}> |
||||
<div style={{ width: "30%", height: "100%", textAlign: "center", lineHeight: "3vh", fontSize: "14px", color: beijing == index ? "#FFFFFF" : "rgba(216,240,255,0.8000)", position: "absolute", left: "70%" }}>{item.processingTime ? item.processingTime : "--"}</div> |
{rightitemlist && rightitemlist.length !== 0 ? rightitemlist?.map(({ enforcementdate, enforcementreslt, roadname, picfile }, index) => { |
||||
{ |
if (index < 120) { |
||||
num == index ? <div style={{ position: "fixed", width: "400px", height: "200px", zIndex: 100, left: "55%", marginTop: "0", top: "78%" }}> |
return <div key={index} className='guanli-right-item'> |
||||
<img src='/assets/images/leadership/beijinglan.png' style={{ width: "100%", height: "100%" }} /> |
<Tooltip title={<div className='popover-content'> |
||||
<div style={{ position: "absolute", top: "0", width: "50%", padding: "20px" }}> |
<div style={{ width: '100%', height: "100%", marginTop: "0", paddingBottom: 20, display: "flex" }}> |
||||
<img src='/assets/images/leadership/yuanxing.png' style={{ width: "100%", height: "100%" }} /> |
|
||||
<p style={{ color: "#09BAFF", position: "absolute", top: "42%", left: "27%", fontSize: "29px", fontFamily: "YouSheBiaoTiHei" }}>{item.overrunRate ? item.overrunRate + "%" : "--"}</p> |
{picfile?.length > 0 ? <Carousel autoplay style={{ width: 200, height: 200, margin: "20px 0px 0px 20px" }}> |
||||
<p style={{ color: "rgba(216,240,255,0.8)", position: "absolute", top: "60%", left: "43%", fontSize: "14px" }}>超限</p> |
{picfile?.map(v => <img className='picfileimg' |
||||
</div> |
style={{ width: 200, height: 200, display: 'inline-block', }} |
||||
<div style={{ position: "absolute", top: "0", width: "50%", left: "50%", paddingRight: "10px" }}> |
// src={`/_file-server/${v.storageUrl}`}
|
||||
<p style={{ color: "rgba(216,240,255,0.8)", marginTop: "30px", fontSize: "14px", fontFamily: "PingFangSC-Regular, PingFang SC" }}>车牌号<span style={{ color: "#EEF4FF", marginLeft: "33px", fontFamily: " PingFangSC-Medium, PingFang SC" }}>{item.licensePlate}</span></p> |
src={v.url} |
||||
<p style={{ color: "rgba(216,240,255,0.8)", fontSize: "14px", fontFamily: "PingFangSC-Regular, PingFang SC" }}>检测点<span style={{ color: "#EEF4FF", marginLeft: "30px", fontFamily: " PingFangSC-Medium, PingFang SC" }}>{item.nameOfInspectionPoint ? item.nameOfInspectionPoint : "--"}</span></p> |
width={`200px`} |
||||
<p style={{ color: "rgba(216,240,255,0.8)", fontSize: "14px", fontFamily: "PingFangSC-Regular, PingFang SC" }}>处罚<span style={{ color: "#FF0001", marginLeft: "50px", fontFamily: " PingFangSC-Medium, PingFang SC" }}>{item.deductPoints ? "-" + item.deductPoints + "分" : ""}{item.deductPoints && item.fine ? "和" : ""}{item.fine ? "-" + item.fine + "元" : ""}{item.deductPoints || item.fine ? "" : "--"}</span></p> |
/>)} |
||||
<p style={{ color: "rgba(216,240,255,0.8)", fontSize: "14px", fontFamily: "PingFangSC-Regular, PingFang SC" }}>日期<span style={{ color: "#EEF4FF", marginLeft: "50px", fontFamily: " PingFangSC-Medium, PingFang SC" }}>{item.processingTime ? item.processingTime : "--"}</span></p> |
</Carousel> |
||||
</div> |
: <img src="/" style={{ |
||||
</div> : "" |
width: 200, height: 200, margin: "20px 0px 0px 20px", display: 'inline-block', borderRight: "1px solid #FFF", |
||||
|
}} /> |
||||
} |
} |
||||
</li> |
|
||||
}) |
|
||||
|
|
||||
} |
|
||||
{/* </Spin> */} |
<div style={{ width: 240, marginLeft: 20, marginTop: 20, display: "flex", flexDirection: "column", justifyContent: "space-around" }}> |
||||
|
<p style={{ color: "rgba(216,240,255,0.8)", fontSize: "14px", fontFamily: "PingFangSC-Regular, PingFang SC", display: "flex" }}> |
||||
|
执法日期:<span style={{ |
||||
|
color: "#EEF4FF", marginLeft: "10px", fontFamily: " PingFangSC-Medium, PingFang SC", |
||||
|
overflow: 'hidden', whiteSpace: "nowrap", textOverflow: "ellipsis" |
||||
|
}}> |
||||
|
{enforcementdate && moment(enforcementdate).format("YYYY-MM-DD") || "--"} |
||||
|
</span></p> |
||||
|
<p style={{ color: "rgba(216,240,255,0.8)", fontSize: "14px", fontFamily: "PingFangSC-Regular, PingFang SC", display: "flex" }}> |
||||
|
执法道路:<span title={roadname} style={{ |
||||
|
color: "#EEF4FF", marginLeft: "10px", fontFamily: " PingFangSC-Medium, PingFang SC", |
||||
|
overflow: 'hidden', whiteSpace: "nowrap", textOverflow: "ellipsis", display: 'inline-block', width: 160 |
||||
|
}}> |
||||
|
{roadname} |
||||
|
</span></p> |
||||
|
<p style={{ color: "rgba(216,240,255,0.8)", fontSize: "14px", fontFamily: "PingFangSC-Regular, PingFang SC", display: "flex" }}> |
||||
|
执法成果:<span title={enforcementreslt} style={{ |
||||
|
color: "#EEF4FF", marginLeft: "10px", fontFamily: " PingFangSC-Medium, PingFang SC", |
||||
|
overflow: 'hidden', whiteSpace: "nowrap", textOverflow: "ellipsis", display: 'inline-block', width: 160 |
||||
|
}}> |
||||
|
{enforcementreslt}</span></p> |
||||
|
</div> |
||||
|
</div> |
||||
|
|
||||
|
</div>} |
||||
|
placement="leftTop" |
||||
|
overlayStyle={{ minWidth: 500, minHeight: 200, paddingTop: 10, margin: 0, backgroundImage: `url(../../../../../assets/images/leadership/beijinglan.png)` }} |
||||
|
overlayClassName='popover' |
||||
|
|
||||
|
> |
||||
|
<div style={{ width: '100%', height: '100%', display: 'flex', color: "#FFF" }}> |
||||
|
<div style={{ width: '50%', textAlign: "center", }}>{enforcementdate && moment(enforcementdate).format("YYYY-MM-DD") || "--"}</div> |
||||
|
<div title={enforcementreslt} style={{ width: '50%', textAlign: "center", overflow: 'hidden', whiteSpace: "nowrap", textOverflow: "ellipsis" }}>{enforcementreslt}</div> |
||||
|
</div> |
||||
|
</Tooltip> |
||||
|
</div> |
||||
|
} |
||||
|
}) : ""} |
||||
|
</div> |
||||
|
} |
||||
|
return ( |
||||
|
<> |
||||
|
<Module style={style} title={"道路隐患排查治理"}> |
||||
|
|
||||
|
<div style={{ width: "90%", margin: "auto", display: "flex", color: "#FFF" }}> |
||||
|
<div style={{ width: '50%', textAlign: "center" }}>执法日期</div> |
||||
|
<div style={{ width: '50%', textAlign: "center", }}>执法成果</div> |
||||
</div> |
</div> |
||||
) |
{rightitemlist && rightitemlist.length !== 0 ? <AutoRollComponent content={renderContent()} |
||||
} |
containerStyle={{ position: "relative", height: "90%", }} |
||||
return ( |
divHeight={"100%"} divId={"chart-overview-deviceList"} /> : <NoData style={{ height: "20%" }} />} |
||||
<> |
|
||||
<Module style={style} title={"治超详情"}> |
</Module> |
||||
|
</> |
||||
<div style={{ position: "relative", width: "90%", height: "5%", left: "5%", textAlign: "right", fontSize: "16px", top: "-3%", color: "rgba(216,240,255,0.8)" }}> |
) |
||||
<img src='/assets/images/leadership/jiejue.png' style={{ width: "4.5%", height: "2vh", marginTop: "-1%" }} /> |
|
||||
已处理<span style={{ color: "#FFFFFF", fontSize: "18px", paddingLeft: "2%", paddingRight: "2%" }}>{nums ? nums : 0}</span>件 |
|
||||
</div> |
|
||||
<div style={{ width: "90%", height: "3vh", backgroundColor: "rgba(21,77,160,0.2)", position: "relative", left: "5%", top: "5%" }}> |
|
||||
<p style={{ width: "30%", fontSize: "12px", color: "#FFFFFF", height: "100%", textAlign: "center", position: "absolute", lineHeight: "3vh" }}>车牌号</p> |
|
||||
<p style={{ width: "10%", fontSize: "12px", color: "#FFFFFF", height: "100%", textAlign: "center", position: "absolute", lineHeight: "3vh", left: "30%" }}>超限</p> |
|
||||
<p style={{ width: "30%", fontSize: "12px", color: "#FFFFFF", height: "100%", textAlign: "center", position: "absolute", lineHeight: "3vh", left: "40%" }}>处罚</p> |
|
||||
<p style={{ width: "30%", fontSize: "12px", color: "#FFFFFF", height: "100%", textAlign: "center", position: "absolute", lineHeight: "3vh", left: "70%" }}>处理日期</p> |
|
||||
</div> |
|
||||
{/* <Spin tip="Loading..." spinning={false} > */} |
|
||||
<Lun |
|
||||
content={renderBody()} |
|
||||
containerStyle={{ position: "relative", height: "70%", width: "90%", left: "5%", top: "8%" }} |
|
||||
divHeight={"100%"} |
|
||||
divId={"screen-slope-midde-top"} |
|
||||
/> |
|
||||
{/* </Spin> */} |
|
||||
</Module> |
|
||||
</> |
|
||||
) |
|
||||
} |
} |
||||
export default Rightbottom |
export default Rightbottom |
||||
Loading…
Reference in new issue