2024-01-22 09:18:38 +08:00
|
|
|
|
import React, { useState, useEffect, useRef, Component } from "react";
|
|
|
|
|
|
import { connect } from "dva";
|
|
|
|
|
|
import storage from "../utils/storage";
|
|
|
|
|
|
import IconFont from "../utils/iconFont";
|
|
|
|
|
|
import {
|
|
|
|
|
|
initFilter,
|
|
|
|
|
|
addRuleAndGroups,
|
|
|
|
|
|
guid,
|
|
|
|
|
|
extendInclude,
|
|
|
|
|
|
extendRule,
|
|
|
|
|
|
extend,
|
|
|
|
|
|
extendOrder,
|
|
|
|
|
|
} from "../utils/common";
|
|
|
|
|
|
import "./home.less";
|
|
|
|
|
|
// 组件库
|
|
|
|
|
|
import {
|
|
|
|
|
|
Row,
|
|
|
|
|
|
Col,
|
|
|
|
|
|
Icon,
|
2024-03-13 11:19:42 +08:00
|
|
|
|
Progress,
|
|
|
|
|
|
Tabs,
|
2024-01-22 09:18:38 +08:00
|
|
|
|
message,
|
2024-03-19 17:36:53 +08:00
|
|
|
|
Dropdown,
|
|
|
|
|
|
Menu,
|
|
|
|
|
|
Empty,
|
2024-01-22 09:18:38 +08:00
|
|
|
|
} from "antd";
|
|
|
|
|
|
import styles from "./dashboard.css";
|
|
|
|
|
|
import "slick-carousel/slick/slick.css";
|
|
|
|
|
|
import "slick-carousel/slick/slick-theme.css";
|
|
|
|
|
|
import echarts from "echarts";
|
|
|
|
|
|
import config from "../config";
|
2024-03-19 17:36:53 +08:00
|
|
|
|
import ModifyPassword from "../components/MainPage/ModifyPassword";
|
|
|
|
|
|
import FoUserInfoShow from "../components/MainPage/FoUserInfoShow";
|
2024-03-13 11:19:42 +08:00
|
|
|
|
const { TabPane } = Tabs;
|
2024-03-19 17:36:53 +08:00
|
|
|
|
const WorkBench = (props) => {
|
|
|
|
|
|
return (
|
|
|
|
|
|
<div>
|
|
|
|
|
|
{props.data.map((item, index) => {
|
|
|
|
|
|
const result =
|
|
|
|
|
|
(Date.parse(item.TASK_ENDDT) - Date.parse(Date())) / 3600 / 1000;
|
|
|
|
|
|
const prepare = result > 0 ? "正常" : "超期";
|
|
|
|
|
|
const warning =
|
|
|
|
|
|
item.NOTICE_STATUS == 0
|
|
|
|
|
|
? "未读"
|
|
|
|
|
|
: item.NOTICE_STATUS == 3
|
|
|
|
|
|
? "已读"
|
|
|
|
|
|
: "已办";
|
|
|
|
|
|
const type = props.index == 1 || props.index == 2 ? prepare : warning;
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
|
<div
|
|
|
|
|
|
style={{
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "row",
|
|
|
|
|
|
padding: "10px",
|
|
|
|
|
|
alignItems: "center",
|
|
|
|
|
|
justifyContent: "space-between",
|
|
|
|
|
|
borderBottom:
|
|
|
|
|
|
index !== props.data.length - 1 ? "1px solid #e7e6e4" : "",
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
|
|
|
|
|
<div
|
|
|
|
|
|
className={
|
|
|
|
|
|
type == "超期"
|
|
|
|
|
|
? "home-work-type-red"
|
|
|
|
|
|
: type == "未办" || type == "未读"
|
|
|
|
|
|
? "home-work-type-yellow"
|
|
|
|
|
|
: type == "已办"
|
|
|
|
|
|
? "home-work-type-green"
|
|
|
|
|
|
: "home-work-type-black"
|
|
|
|
|
|
}
|
|
|
|
|
|
style={{
|
|
|
|
|
|
marginLeft: "20px",
|
|
|
|
|
|
marginRight: "20px",
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
|
|
|
|
|
{type}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div
|
|
|
|
|
|
className="home-work-title"
|
|
|
|
|
|
style={{ flex: 1, alignItems: "flex-start" }}
|
|
|
|
|
|
>
|
|
|
|
|
|
{item.NOTICE_TITLE}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div
|
|
|
|
|
|
className="home-work-date"
|
|
|
|
|
|
style={{
|
|
|
|
|
|
width: "200px",
|
|
|
|
|
|
marginRight: "100px",
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
|
|
|
|
|
开始时间：{item.TASK_STARTDT}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div
|
|
|
|
|
|
className="home-work-date"
|
|
|
|
|
|
style={{
|
|
|
|
|
|
width: "200px",
|
|
|
|
|
|
marginRight: "50px",
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
|
|
|
|
|
结束时间：{item.TASK_ENDDT}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
{/* <div className="home-work-person" style={{ width: "140px" }}>
|
|
|
|
|
|
发起人：{item.person}
|
|
|
|
|
|
</div> */}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
);
|
|
|
|
|
|
})}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
);
|
|
|
|
|
|
};
|
|
|
|
|
|
const UserInfo = (props) => {
|
|
|
|
|
|
return (
|
|
|
|
|
|
<div className="home-userInfo">
|
|
|
|
|
|
<div className="home-userInfo-pad">
|
|
|
|
|
|
<Icon
|
|
|
|
|
|
type="schedule"
|
|
|
|
|
|
className="home-userInfo-Icon"
|
|
|
|
|
|
style={{ color: props.color }}
|
|
|
|
|
|
></Icon>
|
|
|
|
|
|
<div className="home-userInfo-title">{props.title}</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div className="home-userInfo-content" style={{ color: props.color }}>
|
|
|
|
|
|
{props.data}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
);
|
|
|
|
|
|
};
|
2024-01-22 09:18:38 +08:00
|
|
|
|
|
|
|
|
|
|
class Home extends React.Component {
|
|
|
|
|
|
constructor(props) {
|
|
|
|
|
|
super(props);
|
|
|
|
|
|
this.state = {
|
2024-03-19 17:36:53 +08:00
|
|
|
|
visible: false,
|
|
|
|
|
|
userInfo: "",
|
|
|
|
|
|
timeNow: "上午好",
|
|
|
|
|
|
workData: [],
|
|
|
|
|
|
workTotal:'',
|
2024-03-13 11:19:42 +08:00
|
|
|
|
completeName: [
|
|
|
|
|
|
{
|
|
|
|
|
|
name: "张森友",
|
|
|
|
|
|
value: 100,
|
|
|
|
|
|
},
|
2024-01-22 09:18:38 +08:00
|
|
|
|
{
|
2024-03-13 11:19:42 +08:00
|
|
|
|
name: "李友军",
|
|
|
|
|
|
value: 99,
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
|
|
|
|
|
{
|
2024-03-13 11:19:42 +08:00
|
|
|
|
name: "洪虎林",
|
|
|
|
|
|
value: 97,
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
|
|
|
|
|
{
|
2024-03-13 11:19:42 +08:00
|
|
|
|
name: "李彦斌",
|
|
|
|
|
|
value: 95,
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
|
|
|
|
|
{
|
2024-03-13 11:19:42 +08:00
|
|
|
|
name: "王志文",
|
|
|
|
|
|
value: 93,
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: "黄海林",
|
|
|
|
|
|
value: 90,
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: "赵无极",
|
|
|
|
|
|
value: 67,
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: "林佑君",
|
|
|
|
|
|
value: 43,
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
2024-01-22 09:18:38 +08:00
|
|
|
|
};
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
componentDidMount() {
|
|
|
|
|
|
if (window.navigator.userAgent.indexOf("Windows") < 1) {
|
|
|
|
|
|
window.location.replace(config.guideH5Host);
|
|
|
|
|
|
//alert('手机');
|
|
|
|
|
|
}
|
2024-03-19 17:36:53 +08:00
|
|
|
|
this.getBaseData(1, "1", 5);
|
|
|
|
|
|
this.timeJudg();
|
2024-03-13 11:19:42 +08:00
|
|
|
|
this.riskLevel();
|
|
|
|
|
|
// this.homeRound();
|
|
|
|
|
|
this.completeRate();
|
|
|
|
|
|
this.timelyRate();
|
|
|
|
|
|
this.safeCheck();
|
|
|
|
|
|
this.dangerChange();
|
|
|
|
|
|
this.getUser();
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}
|
2024-03-19 17:36:53 +08:00
|
|
|
|
tabsCallback = (key) => {
|
|
|
|
|
|
if (key == 1) {
|
|
|
|
|
|
this.getBaseData(1, "1", 5);
|
|
|
|
|
|
} else if (key == 2) {
|
|
|
|
|
|
this.getBaseData(1, "4", 5);
|
|
|
|
|
|
} else if (key == 3) {
|
|
|
|
|
|
this.getBaseData(1, "2", 5);
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.getBaseData(1, "3", 5);
|
|
|
|
|
|
}
|
|
|
|
|
|
};
|
|
|
|
|
|
getBaseData = (pagination, key, limit) => {
|
|
|
|
|
|
const current = pagination ? pagination.current : 1;
|
|
|
|
|
|
const json = initFilter(this.props.login.OrgId, "", "CODE", 1, current);
|
|
|
|
|
|
//extendRule(json, "NOTICE_STATUS", 1, 0);
|
|
|
|
|
|
json.Limit = limit;
|
|
|
|
|
|
//json.Limit = 10;
|
|
|
|
|
|
json.Parameter1 = key; //1待办事项2已办事项3今日新增4待办超时
|
|
|
|
|
|
|
|
|
|
|
|
this.props.dispatch({
|
|
|
|
|
|
type: "app/getDataByPost",
|
|
|
|
|
|
url: "FM/FMNotificationTask/HomeOrderPaged",
|
|
|
|
|
|
payload: json,
|
|
|
|
|
|
onlyData: false,
|
|
|
|
|
|
onComplete: (ret) => {
|
|
|
|
|
|
if (ret && ret.IsSuccessful && ret.Data.newData) {
|
|
|
|
|
|
this.setState({
|
|
|
|
|
|
workData: ret.Data.newData,
|
|
|
|
|
|
workTotal: ret.Data,
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
});
|
|
|
|
|
|
};
|
|
|
|
|
|
timeJudg = () => {
|
|
|
|
|
|
let time = new Date();
|
|
|
|
|
|
let hour = time.getHours();
|
|
|
|
|
|
if (hour >= 6 && hour <= 11) {
|
|
|
|
|
|
this.setState({
|
|
|
|
|
|
timeNow: "上午好",
|
|
|
|
|
|
});
|
|
|
|
|
|
} else if (hour > 11 && hour <= 13) {
|
|
|
|
|
|
this.setState({
|
|
|
|
|
|
timeNow: "中午好",
|
|
|
|
|
|
});
|
|
|
|
|
|
} else if (hour > 13 && hour <= 18) {
|
|
|
|
|
|
this.setState({
|
|
|
|
|
|
timeNow: "下午好",
|
|
|
|
|
|
});
|
|
|
|
|
|
} else {
|
|
|
|
|
|
this.setState({
|
|
|
|
|
|
timeNow: "晚上好",
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
};
|
2024-03-13 11:19:42 +08:00
|
|
|
|
getUser = () => {
|
2024-01-22 09:18:38 +08:00
|
|
|
|
var userId = storage("lacal").getItem("userid")?.val; //登录后有存储登录信息
|
|
|
|
|
|
var orgId = storage("lacal").getItem("webOrgId")?.val; //登录后有存储登录信息
|
|
|
|
|
|
let json = initFilter(orgId);
|
|
|
|
|
|
extendRule(json, "ID", 1, userId);
|
|
|
|
|
|
extendInclude(json, "Nav_Department");
|
|
|
|
|
|
this.props.dispatch({
|
|
|
|
|
|
type: "app/getDataByPost",
|
|
|
|
|
|
payload: json,
|
|
|
|
|
|
url: "FM/User/Get",
|
|
|
|
|
|
onComplete: (ret) => {
|
2024-03-19 17:36:53 +08:00
|
|
|
|
if (ret) {
|
|
|
|
|
|
this.setState({
|
|
|
|
|
|
userInfo: ret,
|
|
|
|
|
|
});
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
});
|
2024-03-19 17:36:53 +08:00
|
|
|
|
};
|
2024-03-13 11:19:42 +08:00
|
|
|
|
safeCheck = () => {
|
|
|
|
|
|
let series = [];
|
|
|
|
|
|
let seriesName = ["巡回检查", "例行检查", "专业检查", "综合检查"];
|
|
|
|
|
|
let data3 = [
|
|
|
|
|
|
[17, 20, 16, 20, 16, 16, 20, 16, 16, 20, 16, 4],
|
|
|
|
|
|
[43, 41, 43, 32, 47, 33, 57, 38, 46, 42, 49, 39],
|
|
|
|
|
|
[23, 21, 43, 12, 15, 13, 15, 16, 17, 14, 19, 24],
|
|
|
|
|
|
[17, 20, 23, 42, 12, 17, 13, 15, 12, 17, 19, 34],
|
|
|
|
|
|
];
|
|
|
|
|
|
let xData = [
|
|
|
|
|
|
"2023年4月",
|
|
|
|
|
|
"2023年5月",
|
|
|
|
|
|
"2023年6月",
|
|
|
|
|
|
"2023年7月",
|
|
|
|
|
|
"2023年8月",
|
|
|
|
|
|
"2023年9月",
|
|
|
|
|
|
"2023年10月",
|
|
|
|
|
|
"2023年11月",
|
|
|
|
|
|
"2023年12月",
|
|
|
|
|
|
"2024年1月",
|
|
|
|
|
|
"2024年2月",
|
|
|
|
|
|
"2024年3月",
|
|
|
|
|
|
];
|
|
|
|
|
|
for (let i = 0; i < data3.length; i++) {
|
|
|
|
|
|
series.push({
|
|
|
|
|
|
name: seriesName[i],
|
|
|
|
|
|
type: "bar",
|
|
|
|
|
|
stack: "总量",
|
|
|
|
|
|
data: data3[i],
|
|
|
|
|
|
barWidth: "20%",
|
|
|
|
|
|
// itemStyle:{
|
|
|
|
|
|
// borderWidth:2,
|
|
|
|
|
|
// borderColor:'#fff',
|
|
|
|
|
|
// barBorderRadius:5,
|
|
|
|
|
|
// }
|
|
|
|
|
|
});
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}
|
2024-03-13 11:19:42 +08:00
|
|
|
|
let safeChecks = document.getElementById("safeCheck");
|
|
|
|
|
|
if (safeChecks) {
|
|
|
|
|
|
let myChart = echarts.init(safeChecks);
|
|
|
|
|
|
myChart.setOption({
|
|
|
|
|
|
color: ["#4285F4", "#72b85b", "#c92a2a", "#ffa94d"],
|
2024-01-22 09:18:38 +08:00
|
|
|
|
|
2024-03-13 11:19:42 +08:00
|
|
|
|
tooltip: {
|
|
|
|
|
|
trigger: "axis",
|
|
|
|
|
|
axisPointer: {
|
|
|
|
|
|
// 坐标轴指示器，坐标轴触发有效
|
|
|
|
|
|
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
|
|
|
|
|
},
|
|
|
|
|
|
transitionDuration: 0,
|
|
|
|
|
|
},
|
|
|
|
|
|
grid: {
|
|
|
|
|
|
left: "5%",
|
|
|
|
|
|
right: "5%",
|
|
|
|
|
|
bottom: "15%",
|
|
|
|
|
|
top: "5%",
|
|
|
|
|
|
containLabel: true,
|
|
|
|
|
|
z: 22,
|
|
|
|
|
|
},
|
|
|
|
|
|
xAxis: {
|
|
|
|
|
|
type: "category",
|
|
|
|
|
|
data: xData,
|
|
|
|
|
|
axisLine: {
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: "#0c3b71",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
2024-03-13 11:19:42 +08:00
|
|
|
|
},
|
|
|
|
|
|
axisLabel: {
|
|
|
|
|
|
show: true,
|
|
|
|
|
|
color: "rgb(170,170,170)",
|
|
|
|
|
|
interval: 0,
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
lineHeight: 14,
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
2024-03-13 11:19:42 +08:00
|
|
|
|
formatter: function (param) {
|
|
|
|
|
|
return param.split("年")[1];
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
2024-03-13 11:19:42 +08:00
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
legend: {
|
|
|
|
|
|
data: ["巡回检查", "例行检查", "专业检查", "综合检查"],
|
|
|
|
|
|
left: "center",
|
|
|
|
|
|
align: "left",
|
|
|
|
|
|
bottom: "2%",
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: "#000",
|
|
|
|
|
|
},
|
|
|
|
|
|
itemWidth: 10,
|
|
|
|
|
|
itemHeight: 10,
|
|
|
|
|
|
// itemGap: 15,
|
|
|
|
|
|
},
|
|
|
|
|
|
yAxis: {
|
|
|
|
|
|
type: "value",
|
|
|
|
|
|
splitLine: {
|
|
|
|
|
|
show: true,
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: ["#f2f2f2"],
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
2024-03-13 11:19:42 +08:00
|
|
|
|
},
|
|
|
|
|
|
axisLine: {
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: "#0c3b71",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
2024-03-13 11:19:42 +08:00
|
|
|
|
},
|
|
|
|
|
|
axisLabel: {
|
|
|
|
|
|
color: "rgb(170,170,170)",
|
|
|
|
|
|
formatter: "{value} ",
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
series: series,
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
2024-01-22 09:18:38 +08:00
|
|
|
|
};
|
2024-03-13 11:19:42 +08:00
|
|
|
|
dangerChange = () => {
|
|
|
|
|
|
let sourceName = [
|
|
|
|
|
|
"按时整改隐患",
|
|
|
|
|
|
"超期整改隐患",
|
|
|
|
|
|
"未整改隐患",
|
|
|
|
|
|
"隐患整改率",
|
|
|
|
|
|
];
|
|
|
|
|
|
let ydata = [
|
|
|
|
|
|
["2", "5", "6", "8", "10", "9"],
|
|
|
|
|
|
["1", "7", "1", "2", "5", "4"],
|
|
|
|
|
|
["0", "1", "0", "3", "0", "1"],
|
|
|
|
|
|
["100.00", "92.31", "100.00", "76.92", "100.00", "92.86"],
|
|
|
|
|
|
];
|
|
|
|
|
|
let xData = [
|
|
|
|
|
|
["2023-10", "2023-11", "2023-12", "2024-01", "2024-02", "2024-03"],
|
|
|
|
|
|
["2023-10", "2023-11", "2023-12", "2024-01", "2024-02", "2024-03"],
|
|
|
|
|
|
["2023-10", "2023-11", "2023-12", "2024-01", "2024-02", "2024-03"],
|
|
|
|
|
|
["2023-10", "2023-11", "2023-12", "2024-01", "2024-02", "2024-03"],
|
|
|
|
|
|
];
|
|
|
|
|
|
let dangerChanges = document.getElementById("dangerChange");
|
|
|
|
|
|
if (dangerChanges) {
|
|
|
|
|
|
let myChart = echarts.init(dangerChanges);
|
|
|
|
|
|
myChart.setOption({
|
|
|
|
|
|
color: ["#72b85b", "#f6841a", "#cc0404", "#4285F4"],
|
|
|
|
|
|
tooltip: {
|
|
|
|
|
|
trigger: "axis",
|
|
|
|
|
|
axisPointer: {
|
|
|
|
|
|
// 坐标轴指示器，坐标轴触发有效
|
|
|
|
|
|
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
|
|
|
|
|
},
|
|
|
|
|
|
transitionDuration: 0,
|
|
|
|
|
|
formatter: function (params) {
|
|
|
|
|
|
return (
|
|
|
|
|
|
params[0].name +
|
|
|
|
|
|
"</br>" +
|
|
|
|
|
|
params[0].marker +
|
|
|
|
|
|
params[0].seriesName +
|
|
|
|
|
|
" : " +
|
|
|
|
|
|
params[0].value +
|
|
|
|
|
|
"</br>" +
|
|
|
|
|
|
params[1].marker +
|
|
|
|
|
|
params[1].seriesName +
|
|
|
|
|
|
" : " +
|
|
|
|
|
|
params[1].value +
|
|
|
|
|
|
"</br>" +
|
|
|
|
|
|
params[2].marker +
|
|
|
|
|
|
params[2].seriesName +
|
|
|
|
|
|
" : " +
|
|
|
|
|
|
params[2].value +
|
|
|
|
|
|
"</br>" +
|
|
|
|
|
|
params[3].marker +
|
|
|
|
|
|
params[3].seriesName +
|
|
|
|
|
|
" : " +
|
|
|
|
|
|
params[3].value +
|
|
|
|
|
|
"%"
|
|
|
|
|
|
);
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
grid: {
|
|
|
|
|
|
left: "10%",
|
|
|
|
|
|
// right: "10%",
|
|
|
|
|
|
bottom: "15%",
|
|
|
|
|
|
top: "5%",
|
|
|
|
|
|
containLabel: true,
|
|
|
|
|
|
z: 22,
|
|
|
|
|
|
},
|
|
|
|
|
|
xAxis: {
|
|
|
|
|
|
type: "category",
|
|
|
|
|
|
data: xData[0],
|
|
|
|
|
|
axisLine: {
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: "#0c3b71",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
2024-03-13 11:19:42 +08:00
|
|
|
|
},
|
|
|
|
|
|
axisLabel: {
|
|
|
|
|
|
show: true,
|
|
|
|
|
|
color: "rgb(170,170,170)",
|
|
|
|
|
|
interval: 0,
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
lineHeight: 14,
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
2024-03-13 11:19:42 +08:00
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
legend: {
|
|
|
|
|
|
data: sourceName,
|
|
|
|
|
|
left: "center",
|
|
|
|
|
|
align: "left",
|
|
|
|
|
|
bottom: "2%",
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: "#000",
|
|
|
|
|
|
},
|
|
|
|
|
|
itemWidth: 10,
|
|
|
|
|
|
itemHeight: 10,
|
|
|
|
|
|
// itemGap: 35,
|
|
|
|
|
|
},
|
|
|
|
|
|
yAxis: [
|
|
|
|
|
|
{
|
|
|
|
|
|
type: "value",
|
|
|
|
|
|
position: "left",
|
|
|
|
|
|
splitLine: {
|
|
|
|
|
|
show: true,
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: ["#f2f2f2"],
|
|
|
|
|
|
// opacity:0.2
|
|
|
|
|
|
// zlevel: -1,
|
|
|
|
|
|
},
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
2024-03-13 11:19:42 +08:00
|
|
|
|
axisLine: {
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: "#0c3b71",
|
|
|
|
|
|
},
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
2024-03-13 11:19:42 +08:00
|
|
|
|
axisLabel: {
|
|
|
|
|
|
color: "rgb(170,170,170)",
|
|
|
|
|
|
formatter: "{value} ",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
2024-03-13 11:19:42 +08:00
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
type: "value",
|
|
|
|
|
|
position: "right",
|
|
|
|
|
|
splitLine: {
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: ["#f2f2f2"],
|
|
|
|
|
|
},
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
2024-03-13 11:19:42 +08:00
|
|
|
|
axisLine: {
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: "#f2f2f2",
|
|
|
|
|
|
},
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
2024-03-13 11:19:42 +08:00
|
|
|
|
axisLabel: {
|
|
|
|
|
|
color: "rgb(170,170,170)",
|
|
|
|
|
|
formatter: "{value} %",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
},
|
2024-03-13 11:19:42 +08:00
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
series: [
|
|
|
|
|
|
{
|
|
|
|
|
|
name: sourceName[0],
|
|
|
|
|
|
type: "bar",
|
|
|
|
|
|
data: ydata[0],
|
|
|
|
|
|
barWidth: "10%",
|
|
|
|
|
|
barGap: "10%",
|
|
|
|
|
|
stack: null,
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: sourceName[1],
|
|
|
|
|
|
type: "bar",
|
|
|
|
|
|
data: ydata[1],
|
|
|
|
|
|
barWidth: "10%",
|
|
|
|
|
|
barGap: "10%",
|
|
|
|
|
|
stack: null,
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: sourceName[2],
|
|
|
|
|
|
type: "bar",
|
|
|
|
|
|
data: ydata[2],
|
|
|
|
|
|
barWidth: "10%",
|
|
|
|
|
|
barGap: "10%",
|
|
|
|
|
|
stack: null,
|
|
|
|
|
|
// zlevel: 99,
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: sourceName[3],
|
|
|
|
|
|
type: "line",
|
|
|
|
|
|
smooth: false,
|
|
|
|
|
|
data: ydata[3],
|
|
|
|
|
|
yAxisIndex: 1,
|
|
|
|
|
|
itemStyle: {
|
|
|
|
|
|
normal: {
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
type: "dotted",
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
// zlevel:100,
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
2024-01-22 09:18:38 +08:00
|
|
|
|
});
|
|
|
|
|
|
}
|
|
|
|
|
|
};
|
2024-03-13 11:19:42 +08:00
|
|
|
|
timelyRate = () => {
|
|
|
|
|
|
let timelyRates = document.getElementById("timelyRate");
|
|
|
|
|
|
if (timelyRates) {
|
|
|
|
|
|
let myChart = echarts.init(timelyRates);
|
|
|
|
|
|
myChart.setOption(
|
|
|
|
|
|
{
|
|
|
|
|
|
title: {
|
2024-03-19 17:36:53 +08:00
|
|
|
|
text: "83%",
|
|
|
|
|
|
x: "center",
|
|
|
|
|
|
y: "center",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
textStyle: {
|
2024-03-19 17:36:53 +08:00
|
|
|
|
fontWeight: "normal",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
color: "#ffa94d",
|
2024-03-19 17:36:53 +08:00
|
|
|
|
fontSize: "20",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
},
|
|
|
|
|
|
},
|
2024-03-19 17:36:53 +08:00
|
|
|
|
color: '#ffd6b5',
|
|
|
|
|
|
legend: {
|
2024-03-13 11:19:42 +08:00
|
|
|
|
show: false,
|
2024-03-19 17:36:53 +08:00
|
|
|
|
itemGap: 12,
|
|
|
|
|
|
data: ["01", "02"],
|
2024-03-13 11:19:42 +08:00
|
|
|
|
},
|
2024-03-19 17:36:53 +08:00
|
|
|
|
|
2024-03-13 11:19:42 +08:00
|
|
|
|
series: [
|
|
|
|
|
|
{
|
2024-03-19 17:36:53 +08:00
|
|
|
|
name: "Line 1",
|
|
|
|
|
|
type: "pie",
|
|
|
|
|
|
clockWise: true,
|
|
|
|
|
|
radius: ["60%", "76%"],
|
2024-03-13 11:19:42 +08:00
|
|
|
|
itemStyle: {
|
|
|
|
|
|
normal: {
|
2024-03-19 17:36:53 +08:00
|
|
|
|
label: {
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
},
|
|
|
|
|
|
labelLine: {
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
},
|
2024-03-13 11:19:42 +08:00
|
|
|
|
},
|
|
|
|
|
|
},
|
2024-03-19 17:36:53 +08:00
|
|
|
|
hoverAnimation: false,
|
|
|
|
|
|
data: [
|
|
|
|
|
|
{
|
|
|
|
|
|
value: 83,
|
|
|
|
|
|
name: "01",
|
|
|
|
|
|
itemStyle: {
|
|
|
|
|
|
normal: {
|
|
|
|
|
|
color: {
|
|
|
|
|
|
// 完成的圆环的颜色
|
|
|
|
|
|
colorStops: [
|
|
|
|
|
|
{
|
|
|
|
|
|
offset: 0,
|
|
|
|
|
|
color: "#ffa94d", // 0% 处的颜色
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
offset: 1,
|
|
|
|
|
|
color: "#f76707", // 100% 处的颜色
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
},
|
|
|
|
|
|
label: {
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
},
|
|
|
|
|
|
labelLine: {
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: "02",
|
|
|
|
|
|
value: 17,
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
2024-03-13 11:19:42 +08:00
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
},
|
|
|
|
|
|
true
|
|
|
|
|
|
);
|
|
|
|
|
|
}
|
2024-01-22 09:18:38 +08:00
|
|
|
|
};
|
|
|
|
|
|
|
2024-03-13 11:19:42 +08:00
|
|
|
|
completeRate = () => {
|
|
|
|
|
|
let completeRates = document.getElementById("completeRate");
|
|
|
|
|
|
if (completeRates) {
|
|
|
|
|
|
let myChart = echarts.init(completeRates);
|
|
|
|
|
|
myChart.setOption({
|
|
|
|
|
|
title: {
|
|
|
|
|
|
text: "93%",
|
|
|
|
|
|
x: "center",
|
|
|
|
|
|
y: "center",
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
fontWeight: "normal",
|
|
|
|
|
|
color: "#0580f2",
|
|
|
|
|
|
fontSize: "20",
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
color: ["rgba(176, 212, 251, 1)"],
|
|
|
|
|
|
legend: {
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
itemGap: 12,
|
|
|
|
|
|
data: ["01", "02"],
|
|
|
|
|
|
},
|
2024-01-22 09:18:38 +08:00
|
|
|
|
|
2024-03-13 11:19:42 +08:00
|
|
|
|
series: [
|
|
|
|
|
|
{
|
|
|
|
|
|
name: "Line 1",
|
|
|
|
|
|
type: "pie",
|
|
|
|
|
|
clockWise: true,
|
|
|
|
|
|
radius: ["60%", "76%"],
|
|
|
|
|
|
itemStyle: {
|
|
|
|
|
|
normal: {
|
|
|
|
|
|
label: {
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
},
|
|
|
|
|
|
labelLine: {
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
hoverAnimation: false,
|
|
|
|
|
|
data: [
|
|
|
|
|
|
{
|
|
|
|
|
|
value: 93,
|
|
|
|
|
|
name: "01",
|
|
|
|
|
|
itemStyle: {
|
|
|
|
|
|
normal: {
|
|
|
|
|
|
color: {
|
|
|
|
|
|
// 完成的圆环的颜色
|
|
|
|
|
|
colorStops: [
|
|
|
|
|
|
{
|
|
|
|
|
|
offset: 0,
|
|
|
|
|
|
color: "#00cefc", // 0% 处的颜色
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
offset: 1,
|
|
|
|
|
|
color: "#367bec", // 100% 处的颜色
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
},
|
|
|
|
|
|
label: {
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
},
|
|
|
|
|
|
labelLine: {
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: "02",
|
|
|
|
|
|
value: 7,
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
2024-01-22 09:18:38 +08:00
|
|
|
|
});
|
2024-03-13 11:19:42 +08:00
|
|
|
|
}
|
2024-01-22 09:18:38 +08:00
|
|
|
|
};
|
|
|
|
|
|
|
2024-03-13 11:19:42 +08:00
|
|
|
|
riskLevel = () => {
|
|
|
|
|
|
let riskLevel = [];
|
|
|
|
|
|
let showData = [
|
|
|
|
|
|
{ value: 20, name: "一级" },
|
|
|
|
|
|
{ value: 10, name: "二级" },
|
|
|
|
|
|
{ value: 15, name: "三级" },
|
|
|
|
|
|
{ value: 30, name: "四级" },
|
|
|
|
|
|
];
|
|
|
|
|
|
|
|
|
|
|
|
let riskLevels = document.getElementById("riskLevel");
|
|
|
|
|
|
if (riskLevels) {
|
|
|
|
|
|
let myChart = echarts.init(riskLevels);
|
|
|
|
|
|
myChart.setOption({
|
|
|
|
|
|
color: ["#c92a2a", "#ffa94d", "#ffe066", "#4285F4", "#fa8a89"],
|
|
|
|
|
|
title: {
|
|
|
|
|
|
text: "60",
|
|
|
|
|
|
x: "26%",
|
|
|
|
|
|
y: "center",
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
fontSize: 16,
|
|
|
|
|
|
fontWeight: "normal",
|
|
|
|
|
|
color: ["#333"],
|
|
|
|
|
|
},
|
|
|
|
|
|
subtextStyle: {
|
|
|
|
|
|
color: "#666",
|
|
|
|
|
|
fontSize: 12,
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
tooltip: {
|
|
|
|
|
|
trigger: "item",
|
|
|
|
|
|
formatter: "{b}:({d}%)",
|
|
|
|
|
|
},
|
|
|
|
|
|
legend: {
|
|
|
|
|
|
icon: "pin",
|
|
|
|
|
|
orient: "vartical",
|
|
|
|
|
|
// x: "right",
|
|
|
|
|
|
top: "18%",
|
|
|
|
|
|
right: "15%",
|
|
|
|
|
|
bottom: "20%",
|
|
|
|
|
|
data: showData,
|
|
|
|
|
|
// itemWidth: 20,
|
|
|
|
|
|
// itemHeight: 14,
|
|
|
|
|
|
itemGap: 25,
|
|
|
|
|
|
formatter: function (name) {
|
|
|
|
|
|
//通过name获取到数组对象中的单个对象
|
|
|
|
|
|
let singleData = showData.filter(function (item) {
|
|
|
|
|
|
return item.name == name;
|
|
|
|
|
|
});
|
|
|
|
|
|
let countAll = 0;
|
|
|
|
|
|
showData.map((item) => {
|
|
|
|
|
|
countAll = countAll + item.value;
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
|
name +
|
|
|
|
|
|
" | " +
|
|
|
|
|
|
// singleData[0].value +
|
|
|
|
|
|
// " | " +
|
|
|
|
|
|
Number((singleData[0].value / countAll) * 100).toFixed(2) +
|
|
|
|
|
|
"%"
|
|
|
|
|
|
);
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
grid: {
|
|
|
|
|
|
left: 30,
|
|
|
|
|
|
containLabel: true,
|
|
|
|
|
|
bottom: 10,
|
|
|
|
|
|
top: 10,
|
|
|
|
|
|
right: 30,
|
|
|
|
|
|
},
|
|
|
|
|
|
series: [
|
|
|
|
|
|
{
|
|
|
|
|
|
name: "访问来源",
|
|
|
|
|
|
type: "pie",
|
|
|
|
|
|
clockwise: false,
|
|
|
|
|
|
// minAngle: 20,
|
|
|
|
|
|
avoidLabelOverlap: false,
|
|
|
|
|
|
radius: ["50%", "65%"],
|
|
|
|
|
|
center: ["30%", "50%"],
|
|
|
|
|
|
itemStyle: {
|
|
|
|
|
|
//图形样式
|
|
|
|
|
|
normal: {
|
|
|
|
|
|
borderColor: "#ffffff",
|
|
|
|
|
|
borderWidth: 4,
|
|
|
|
|
|
padding: "0 20px",
|
|
|
|
|
|
borderRadius: 50,
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
label: {
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
},
|
|
|
|
|
|
// color: color,
|
|
|
|
|
|
data: showData,
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
});
|
|
|
|
|
|
}
|
2024-01-22 09:18:38 +08:00
|
|
|
|
};
|
2024-03-19 17:36:53 +08:00
|
|
|
|
navToMenu = (ID) => {
|
|
|
|
|
|
this.props.history.push({ pathname: `/main/${ID}` });
|
|
|
|
|
|
};
|
|
|
|
|
|
/**
|
|
|
|
|
|
* 注销登录
|
|
|
|
|
|
*/
|
|
|
|
|
|
handleLogout = () => {
|
|
|
|
|
|
const { OrgId, userId } = this.props.login;
|
|
|
|
|
|
const logJson = initFilter(OrgId, userId, "", 0, 1, 0);
|
|
|
|
|
|
this.props.dispatch({
|
|
|
|
|
|
type: "app/addLoginOut",
|
|
|
|
|
|
payload: logJson,
|
|
|
|
|
|
});
|
|
|
|
|
|
localStorage.removeItem("accessToken");
|
|
|
|
|
|
this.props.history.push({ pathname: "/login" });
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
handleUserMenuClick = (evt) => {
|
|
|
|
|
|
switch (evt.key) {
|
|
|
|
|
|
case "user-menu-logout":
|
|
|
|
|
|
handleLogout();
|
|
|
|
|
|
break;
|
|
|
|
|
|
case "user-menu-cacheclean":
|
|
|
|
|
|
window.localStorage.clear();
|
|
|
|
|
|
message.success("清除成功，即将重新加载页面", 2, () => {
|
|
|
|
|
|
setTimeout(() => window.location.reload(true), 500);
|
|
|
|
|
|
});
|
|
|
|
|
|
break;
|
|
|
|
|
|
default:
|
|
|
|
|
|
break;
|
|
|
|
|
|
}
|
|
|
|
|
|
this.setState({
|
|
|
|
|
|
visible: false,
|
|
|
|
|
|
});
|
|
|
|
|
|
};
|
2024-01-22 09:18:38 +08:00
|
|
|
|
|
|
|
|
|
|
render() {
|
|
|
|
|
|
return (
|
|
|
|
|
|
<div
|
|
|
|
|
|
className="route-home"
|
|
|
|
|
|
style={{
|
|
|
|
|
|
padding: "0 10px",
|
|
|
|
|
|
minHeight: "735px",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
height: "100%",
|
|
|
|
|
|
width: "100%",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}}
|
|
|
|
|
|
ref={this.resizeRef}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<Col span={24} style={{ width: "100%", height: "100%" }}>
|
|
|
|
|
|
<Row
|
|
|
|
|
|
gutter={12}
|
|
|
|
|
|
style={{
|
|
|
|
|
|
width: "100%",
|
|
|
|
|
|
height: "25%",
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
padding: "0px 20px",
|
|
|
|
|
|
margin: "0px",
|
|
|
|
|
|
minHeight: "242px",
|
2024-03-19 17:36:53 +08:00
|
|
|
|
minWidth: "1904px",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
// justifyContent: "space-between",
|
|
|
|
|
|
// backgroundColor: "#fff",
|
|
|
|
|
|
}}
|
2024-01-22 09:18:38 +08:00
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<Col
|
|
|
|
|
|
span={8}
|
|
|
|
|
|
style={{
|
|
|
|
|
|
backgroundColor: "#fff",
|
|
|
|
|
|
height: "100%",
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "column",
|
|
|
|
|
|
padding: "0px 20px",
|
|
|
|
|
|
borderRadius: "5px",
|
|
|
|
|
|
minWidth: "578px",
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
<div
|
|
|
|
|
|
style={{
|
2024-03-13 11:19:42 +08:00
|
|
|
|
height: "50%",
|
|
|
|
|
|
width: "100%",
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "row",
|
|
|
|
|
|
alignItems: "center",
|
|
|
|
|
|
borderBottom: "2px solid #f6f6f6",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div
|
2024-01-22 09:18:38 +08:00
|
|
|
|
style={{
|
2024-03-13 11:19:42 +08:00
|
|
|
|
width: "80px",
|
|
|
|
|
|
height: "80px",
|
|
|
|
|
|
borderRadius: "40px",
|
|
|
|
|
|
backgroundColor: "#fafafa",
|
|
|
|
|
|
fontSize: "18px",
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
alignItems: "center",
|
|
|
|
|
|
justifyContent: "center",
|
|
|
|
|
|
marginRight: "10px",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}}
|
2024-03-13 11:19:42 +08:00
|
|
|
|
>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
{this.state.userInfo.SEX == 1 ? (
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<img
|
|
|
|
|
|
src={require("../assets/home/avaB.png")}
|
|
|
|
|
|
style={{
|
|
|
|
|
|
height: "60px",
|
|
|
|
|
|
width: "60px",
|
2024-03-19 17:36:53 +08:00
|
|
|
|
alignItems: "center",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
objectFit: "contain",
|
|
|
|
|
|
}}
|
|
|
|
|
|
alt="homeuser"
|
|
|
|
|
|
/>
|
|
|
|
|
|
) : (
|
|
|
|
|
|
<img
|
|
|
|
|
|
src={require("../assets/home/avaG.png")}
|
|
|
|
|
|
style={{
|
|
|
|
|
|
height: "60px",
|
|
|
|
|
|
width: "auto",
|
2024-03-19 17:36:53 +08:00
|
|
|
|
alignItems: "center",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
objectFit: "contain",
|
|
|
|
|
|
}}
|
|
|
|
|
|
alt="homeuser"
|
|
|
|
|
|
/>
|
|
|
|
|
|
)}
|
|
|
|
|
|
</div>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
<div
|
|
|
|
|
|
style={{
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "column",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
height: "60px",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
justifyContent: "space-between",
|
2024-03-19 17:36:53 +08:00
|
|
|
|
flex: 1,
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}}
|
|
|
|
|
|
>
|
|
|
|
|
|
<div
|
|
|
|
|
|
style={{
|
2024-03-19 17:36:53 +08:00
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "row",
|
|
|
|
|
|
justifyContent: "space-between",
|
|
|
|
|
|
alignItems: "center",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<div
|
|
|
|
|
|
style={{
|
|
|
|
|
|
color: "#303133",
|
|
|
|
|
|
fontSize: "16px",
|
|
|
|
|
|
marginLeft: "5px",
|
|
|
|
|
|
fontWeight: "bold",
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
|
|
|
|
|
{this.state.userInfo.NAME}，{this.state.timeNow}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div>
|
|
|
|
|
|
<Dropdown
|
|
|
|
|
|
visible={this.state.visible}
|
|
|
|
|
|
onVisibleChange={() => {
|
|
|
|
|
|
this.setState({ visible: !this.state.visible });
|
|
|
|
|
|
}}
|
|
|
|
|
|
overlay={
|
|
|
|
|
|
<Menu onClick={this.handleUserMenuClick}>
|
|
|
|
|
|
<Menu.Item
|
|
|
|
|
|
key="user-menu-UserInfoShow"
|
|
|
|
|
|
className="home-setting"
|
|
|
|
|
|
>
|
|
|
|
|
|
<Icon
|
|
|
|
|
|
type="pushpin"
|
|
|
|
|
|
style={{ fontSize: "14px", color: "" }}
|
|
|
|
|
|
></Icon>
|
|
|
|
|
|
<FoUserInfoShow>我的资料</FoUserInfoShow>
|
|
|
|
|
|
</Menu.Item>
|
|
|
|
|
|
<Menu.Item
|
|
|
|
|
|
key="user-menu-updatepwd"
|
|
|
|
|
|
className="home-setting"
|
|
|
|
|
|
>
|
|
|
|
|
|
<Icon
|
|
|
|
|
|
type="edit"
|
|
|
|
|
|
style={{ fontSize: "14px" }}
|
|
|
|
|
|
></Icon>
|
|
|
|
|
|
<ModifyPassword>修改密码</ModifyPassword>
|
|
|
|
|
|
</Menu.Item>
|
|
|
|
|
|
<Menu.Item
|
|
|
|
|
|
key="user-menu-cacheclean"
|
|
|
|
|
|
className="home-setting"
|
|
|
|
|
|
>
|
|
|
|
|
|
<Icon
|
|
|
|
|
|
type="tool"
|
|
|
|
|
|
style={{ fontSize: "14px" }}
|
|
|
|
|
|
></Icon>
|
|
|
|
|
|
清除缓存
|
|
|
|
|
|
</Menu.Item>
|
|
|
|
|
|
{/* <Menu.Item>版本号:{config.version}</Menu.Item> */}
|
|
|
|
|
|
<Menu.Item
|
|
|
|
|
|
key="user-menu-logout"
|
|
|
|
|
|
className="home-setting"
|
|
|
|
|
|
>
|
|
|
|
|
|
<Icon
|
|
|
|
|
|
type="poweroff"
|
|
|
|
|
|
style={{ fontSize: "14px" }}
|
|
|
|
|
|
></Icon>
|
|
|
|
|
|
退出登录
|
|
|
|
|
|
</Menu.Item>
|
|
|
|
|
|
</Menu>
|
|
|
|
|
|
}
|
|
|
|
|
|
placement="topLeft"
|
|
|
|
|
|
trigger={["click"]}
|
|
|
|
|
|
>
|
|
|
|
|
|
<Icon
|
|
|
|
|
|
type="setting"
|
|
|
|
|
|
className="home-setting-icon"
|
|
|
|
|
|
></Icon>
|
|
|
|
|
|
</Dropdown>
|
|
|
|
|
|
</div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</div>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div style={{ display: "flex", flexDirection: "row" }}>
|
|
|
|
|
|
<div
|
|
|
|
|
|
className="home-userInfo-tabs"
|
|
|
|
|
|
style={{
|
|
|
|
|
|
marginRight: "10px",
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
工号：{this.state.userInfo.CODE}
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
<div
|
|
|
|
|
|
className="home-userInfo-tabs"
|
|
|
|
|
|
style={{
|
|
|
|
|
|
marginRight: "10px",
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
手机号：{this.state.userInfo.PHONE}
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</div>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
{this.state.userInfo.Nav_Department ? (
|
|
|
|
|
|
<div className="home-userInfo-tabs">
|
|
|
|
|
|
部门：{this.state.userInfo.Nav_Department.NAME}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
) : (
|
|
|
|
|
|
""
|
|
|
|
|
|
)}
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div className="home-userInfo-card">
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<UserInfo data={this.state.workTotal.todoCount} title="待办事项" color="#2177d5" />
|
|
|
|
|
|
<UserInfo data={this.state.workTotal.timeOverCount} title="待办超时" color="#f76707" />
|
|
|
|
|
|
<UserInfo data={this.state.workTotal.doneCount} title="已办事项" color="#48a447" />
|
|
|
|
|
|
<UserInfo data={this.state.workTotal.todayNewCount} title="今日提醒" color="#fcc419" />
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</div>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</Col>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div style={{ width: "30px" }}></div>
|
|
|
|
|
|
<Col
|
|
|
|
|
|
span={9}
|
2024-01-22 09:18:38 +08:00
|
|
|
|
style={{
|
2024-03-13 11:19:42 +08:00
|
|
|
|
backgroundColor: "#fff",
|
|
|
|
|
|
height: "100%",
|
|
|
|
|
|
borderRadius: "5px",
|
|
|
|
|
|
padding: "0px",
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "row",
|
|
|
|
|
|
flex: 1,
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div className="home-rate">
|
|
|
|
|
|
<div className="home-always-title">
|
|
|
|
|
|
<div className="home-always-left">
|
|
|
|
|
|
<div className="home-always-badge"></div>
|
|
|
|
|
|
<div className="home-always-name">完成率</div>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div style={{ flex: 1, height: "100%", padding: "0px" }}>
|
|
|
|
|
|
<div
|
|
|
|
|
|
id="completeRate"
|
|
|
|
|
|
style={{
|
|
|
|
|
|
width: "100%",
|
|
|
|
|
|
height: "100%",
|
|
|
|
|
|
// minHeight: "180px",
|
|
|
|
|
|
}}
|
|
|
|
|
|
></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div
|
|
|
|
|
|
style={{
|
|
|
|
|
|
width: "20px",
|
|
|
|
|
|
height: "100%",
|
|
|
|
|
|
backgroundColor: "#f4f7ff",
|
2024-03-19 17:36:53 +08:00
|
|
|
|
minWidth: "20px",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
}}
|
|
|
|
|
|
></div>
|
|
|
|
|
|
<div className="home-rate">
|
|
|
|
|
|
<div className="home-always-title">
|
|
|
|
|
|
<div className="home-always-left">
|
|
|
|
|
|
<div className="home-always-badge"></div>
|
|
|
|
|
|
<div className="home-always-name">及时完成率</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div style={{ flex: 1, height: "100%", padding: "0px" }}>
|
|
|
|
|
|
<div
|
|
|
|
|
|
id="timelyRate"
|
|
|
|
|
|
style={{
|
|
|
|
|
|
width: "100%",
|
|
|
|
|
|
height: "100%",
|
|
|
|
|
|
// minHeight: "180px",
|
|
|
|
|
|
}}
|
|
|
|
|
|
></div>
|
|
|
|
|
|
</div>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</Col>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<div style={{ width: "30px", minWidth: "30px" }}></div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<Col
|
|
|
|
|
|
span={6}
|
2024-01-22 09:18:38 +08:00
|
|
|
|
style={{
|
2024-03-13 11:19:42 +08:00
|
|
|
|
backgroundColor: "#fff",
|
|
|
|
|
|
height: "100%",
|
|
|
|
|
|
padding: "0px",
|
|
|
|
|
|
borderRadius: "5px",
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "column",
|
|
|
|
|
|
minWidth: "466px",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div className="home-always-title">
|
|
|
|
|
|
<div className="home-always-left">
|
|
|
|
|
|
<div className="home-always-badge"></div>
|
|
|
|
|
|
<div className="home-always-name">我的常用功能</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
2024-03-19 17:36:53 +08:00
|
|
|
|
{/* <Icon type="edit" className="home-always-icon"></Icon> */}
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
<div style={{ flex: 1, height: "100%", padding: "10px 20px" }}>
|
|
|
|
|
|
<Row style={{ height: "50%" }}>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<Col
|
|
|
|
|
|
span={6}
|
|
|
|
|
|
className="home-tech-col"
|
|
|
|
|
|
onClick={() => {
|
|
|
|
|
|
this.navToMenu("dd1e5b37-f8b2-45fe-8904-08c587b5cc79");
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div className="home-tech-back">
|
|
|
|
|
|
<IconFont
|
|
|
|
|
|
type="icon-a-zu57"
|
|
|
|
|
|
className="home-tech-icon"
|
|
|
|
|
|
></IconFont>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<span className="home-tech-name">用户列表</span>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</Col>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<Col
|
|
|
|
|
|
span={6}
|
|
|
|
|
|
className="home-tech-col"
|
|
|
|
|
|
onClick={() => {
|
|
|
|
|
|
this.navToMenu("a8236679-bb7d-4432-b539-28c270338db1");
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div className="home-tech-back">
|
|
|
|
|
|
<IconFont
|
|
|
|
|
|
type="icon-a-zu198"
|
|
|
|
|
|
className="home-tech-icon"
|
|
|
|
|
|
></IconFont>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<span className="home-tech-name">菜单配置</span>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</Col>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<Col
|
|
|
|
|
|
span={6}
|
|
|
|
|
|
className="home-tech-col"
|
|
|
|
|
|
onClick={() => {
|
|
|
|
|
|
this.navToMenu("12388502-4ee9-02c2-8c80-68e07ba3d087");
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div className="home-tech-back">
|
|
|
|
|
|
<IconFont
|
|
|
|
|
|
type="icon-a-zu83"
|
|
|
|
|
|
className="home-tech-icon"
|
|
|
|
|
|
></IconFont>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<span className="home-tech-name">排班日历</span>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</Col>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<Col
|
|
|
|
|
|
span={6}
|
|
|
|
|
|
className="home-tech-col"
|
|
|
|
|
|
onClick={() => {
|
|
|
|
|
|
this.navToMenu("a81dfac3-af1e-4a5a-aadc-eb8e525ddd16");
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div className="home-tech-back">
|
|
|
|
|
|
<IconFont
|
|
|
|
|
|
type="icon-a-zu291"
|
|
|
|
|
|
className="home-tech-icon"
|
|
|
|
|
|
></IconFont>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<span className="home-tech-name">角色列表</span>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</Col>
|
|
|
|
|
|
</Row>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<Row style={{ height: "50%" }}>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<Col
|
|
|
|
|
|
span={6}
|
|
|
|
|
|
className="home-tech-col"
|
|
|
|
|
|
onClick={() => {
|
|
|
|
|
|
this.navToMenu("b0972124-6aa1-479b-9725-5f726754ce58");
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div className="home-tech-back">
|
|
|
|
|
|
<IconFont
|
|
|
|
|
|
type="icon-a-zu73"
|
|
|
|
|
|
className="home-tech-icon"
|
|
|
|
|
|
></IconFont>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<span className="home-tech-name">模版表单</span>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</Col>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<Col
|
|
|
|
|
|
span={6}
|
|
|
|
|
|
className="home-tech-col"
|
|
|
|
|
|
onClick={() => {
|
|
|
|
|
|
this.navToMenu("6dc35aee-dd5e-4b31-b7ca-5f62d337d0c1");
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div className="home-tech-back">
|
|
|
|
|
|
<IconFont
|
|
|
|
|
|
type="icon-a-zu164"
|
|
|
|
|
|
className="home-tech-icon"
|
|
|
|
|
|
></IconFont>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<span className="home-tech-name">排班明细</span>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</Col>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<Col
|
|
|
|
|
|
span={6}
|
|
|
|
|
|
className="home-tech-col"
|
|
|
|
|
|
onClick={() => {
|
|
|
|
|
|
this.navToMenu("269f79ae-5f41-40f1-8d77-f532750208d1");
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div className="home-tech-back">
|
|
|
|
|
|
<IconFont
|
|
|
|
|
|
type="icon-a-zu203"
|
|
|
|
|
|
className="home-tech-icon"
|
|
|
|
|
|
></IconFont>
|
|
|
|
|
|
</div>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<span className="home-tech-name">班前会议</span>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</Col>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<Col
|
|
|
|
|
|
span={6}
|
|
|
|
|
|
className="home-tech-col"
|
|
|
|
|
|
onClick={() => {
|
|
|
|
|
|
this.navToMenu("ea164ba5-b78a-4545-96fa-46e6ab635fb7");
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div className="home-tech-back">
|
|
|
|
|
|
<IconFont
|
|
|
|
|
|
type="icon-a-zu196"
|
|
|
|
|
|
className="home-tech-icon"
|
|
|
|
|
|
></IconFont>
|
|
|
|
|
|
</div>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<span className="home-tech-name">岗位当班</span>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</Col>
|
|
|
|
|
|
</Row>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
<Row
|
|
|
|
|
|
gutter={12}
|
|
|
|
|
|
style={{
|
|
|
|
|
|
width: "100%",
|
|
|
|
|
|
height: "40%",
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
padding: "0px 20px",
|
|
|
|
|
|
margin: "30px 0px",
|
|
|
|
|
|
justifyContent: "space-between",
|
|
|
|
|
|
alignItems: "center",
|
|
|
|
|
|
minHeight: "388px",
|
2024-03-19 17:36:53 +08:00
|
|
|
|
minWidth: "1904px",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
// backgroundColor: "#fff",
|
|
|
|
|
|
}}
|
2024-01-22 09:18:38 +08:00
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<Col
|
|
|
|
|
|
span={17}
|
2024-01-22 09:18:38 +08:00
|
|
|
|
style={{
|
2024-03-13 11:19:42 +08:00
|
|
|
|
backgroundColor: "#fff",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
height: "100%",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "column",
|
|
|
|
|
|
padding: "0px",
|
|
|
|
|
|
borderRadius: "5px",
|
|
|
|
|
|
flex: 1,
|
2024-03-19 17:36:53 +08:00
|
|
|
|
minWidth: "1368px",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div className="home-always-title">
|
|
|
|
|
|
<div className="home-always-left">
|
|
|
|
|
|
<div className="home-always-badge"></div>
|
|
|
|
|
|
<div className="home-always-name">我的工作</div>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
|
|
|
|
|
|
{/* <Icon type="edit" className="home-always-icon"></Icon> */}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div style={{ flex: 1, height: "100%", padding: "5px 0px" }}>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<Tabs defaultActiveKey="1" onChange={this.tabsCallback}>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<TabPane
|
|
|
|
|
|
tab={
|
|
|
|
|
|
<span className="home-job-title">
|
|
|
|
|
|
<Icon
|
|
|
|
|
|
type="schedule"
|
|
|
|
|
|
className="home-userInfo-Icon"
|
|
|
|
|
|
style={{ color: "#2177d5" }}
|
|
|
|
|
|
></Icon>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
待办事项{" "}
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</span>
|
|
|
|
|
|
}
|
|
|
|
|
|
key="1"
|
2024-01-22 09:18:38 +08:00
|
|
|
|
>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<div
|
|
|
|
|
|
style={{
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "column",
|
|
|
|
|
|
justifyContent: "space-between",
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
|
|
|
|
|
{this.state.workData.length > 0 ? (
|
|
|
|
|
|
<WorkBench data={this.state.workData} index={1} />
|
|
|
|
|
|
) : (
|
|
|
|
|
|
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
|
|
|
|
|
|
)}
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</TabPane>
|
|
|
|
|
|
<TabPane
|
|
|
|
|
|
tab={
|
|
|
|
|
|
<span className="home-job-title">
|
|
|
|
|
|
<Icon
|
|
|
|
|
|
type="hourglass"
|
|
|
|
|
|
className="home-userInfo-Icon"
|
|
|
|
|
|
style={{ color: "#f76707" }}
|
|
|
|
|
|
></Icon>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
待办超时
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</span>
|
|
|
|
|
|
}
|
|
|
|
|
|
key="2"
|
|
|
|
|
|
>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<div
|
|
|
|
|
|
style={{
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "column",
|
|
|
|
|
|
justifyContent: "space-between",
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
|
|
|
|
|
{this.state.workData.length > 0 ? (
|
|
|
|
|
|
<WorkBench data={this.state.workData} index={2} />
|
|
|
|
|
|
) : (
|
|
|
|
|
|
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
|
|
|
|
|
|
)}
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</TabPane>
|
|
|
|
|
|
<TabPane
|
|
|
|
|
|
tab={
|
|
|
|
|
|
<span className="home-job-title">
|
|
|
|
|
|
<Icon
|
|
|
|
|
|
type="check-circle"
|
|
|
|
|
|
className="home-userInfo-Icon"
|
|
|
|
|
|
style={{ color: "#48a447" }}
|
|
|
|
|
|
></Icon>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
已办事项
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</span>
|
|
|
|
|
|
}
|
|
|
|
|
|
key="3"
|
|
|
|
|
|
>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<div
|
|
|
|
|
|
style={{
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "column",
|
|
|
|
|
|
justifyContent: "space-between",
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
|
|
|
|
|
{this.state.workData.length > 0 ? (
|
|
|
|
|
|
<WorkBench data={this.state.workData} index={3} />
|
|
|
|
|
|
) : (
|
|
|
|
|
|
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
|
|
|
|
|
|
)}
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</TabPane>
|
|
|
|
|
|
<TabPane
|
|
|
|
|
|
tab={
|
|
|
|
|
|
<span className="home-job-title">
|
|
|
|
|
|
<Icon
|
|
|
|
|
|
type="bulb"
|
|
|
|
|
|
className="home-userInfo-Icon"
|
|
|
|
|
|
style={{ color: "#fcc419" }}
|
|
|
|
|
|
></Icon>
|
|
|
|
|
|
今日提醒
|
|
|
|
|
|
</span>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}
|
2024-03-13 11:19:42 +08:00
|
|
|
|
key="4"
|
|
|
|
|
|
>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<div
|
|
|
|
|
|
style={{
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "column",
|
|
|
|
|
|
justifyContent: "space-between",
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
|
|
|
|
|
{this.state.workData.length > 0 ? (
|
|
|
|
|
|
<WorkBench data={this.state.workData} index={4} />
|
|
|
|
|
|
) : (
|
|
|
|
|
|
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
|
|
|
|
|
|
)}
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
</TabPane>
|
|
|
|
|
|
</Tabs>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</Col>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<div style={{ width: "30px", minWidth: "30px" }}></div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
|
|
|
|
|
|
<Col
|
|
|
|
|
|
span={6}
|
2024-01-22 09:18:38 +08:00
|
|
|
|
style={{
|
2024-03-13 11:19:42 +08:00
|
|
|
|
backgroundColor: "#fff",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
height: "100%",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
padding: "0px",
|
|
|
|
|
|
borderRadius: "5px",
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "column",
|
2024-03-19 17:36:53 +08:00
|
|
|
|
minWidth: "466px",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div className="home-always-title">
|
|
|
|
|
|
<div className="home-always-left">
|
|
|
|
|
|
<div className="home-always-badge"></div>
|
|
|
|
|
|
<div className="home-always-name">完成率排名</div>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
|
|
|
|
|
|
{/* <Icon type="edit" className="home-always-icon"></Icon> */}
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div
|
|
|
|
|
|
style={{
|
|
|
|
|
|
flex: 1,
|
|
|
|
|
|
height: "100%",
|
|
|
|
|
|
padding: "15px 20px 15px 50px",
|
|
|
|
|
|
}}
|
|
|
|
|
|
>
|
|
|
|
|
|
{this.state.completeName.map((item, index) => {
|
|
|
|
|
|
return (
|
|
|
|
|
|
<div className="home-rank">
|
|
|
|
|
|
{index == 0 ? (
|
|
|
|
|
|
<img
|
|
|
|
|
|
src={require("./../assets/home/4-1.png")}
|
|
|
|
|
|
className="home-img"
|
|
|
|
|
|
alt="4-1"
|
|
|
|
|
|
/>
|
|
|
|
|
|
) : index == 1 ? (
|
|
|
|
|
|
<img
|
|
|
|
|
|
src={require("./../assets/home/4-2.png")}
|
|
|
|
|
|
className="home-img"
|
|
|
|
|
|
alt="4-2"
|
|
|
|
|
|
/>
|
|
|
|
|
|
) : index == 2 ? (
|
|
|
|
|
|
<img
|
|
|
|
|
|
src={require("./../assets/home/4-3.png")}
|
|
|
|
|
|
className="home-img"
|
|
|
|
|
|
alt="4-3"
|
|
|
|
|
|
/>
|
|
|
|
|
|
) : (
|
|
|
|
|
|
<div className="home-rank-index">{index + 1}</div>
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
|
|
|
|
<div className="home-rank-name">{item.name}</div>
|
|
|
|
|
|
<Progress
|
|
|
|
|
|
percent={item.value}
|
|
|
|
|
|
status="active"
|
|
|
|
|
|
style={{ width: "50%" }}
|
|
|
|
|
|
></Progress>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
);
|
|
|
|
|
|
})}
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</Col>
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
<Row
|
|
|
|
|
|
gutter={12}
|
|
|
|
|
|
className="home-row"
|
|
|
|
|
|
style={{
|
|
|
|
|
|
margin: "0px 0px 10px 0px",
|
|
|
|
|
|
minHeight: "275px",
|
2024-03-19 17:36:53 +08:00
|
|
|
|
minWidth: "1904px",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
}}
|
2024-01-22 09:18:38 +08:00
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<Col
|
|
|
|
|
|
span={17}
|
2024-01-22 09:18:38 +08:00
|
|
|
|
style={{
|
|
|
|
|
|
height: "100%",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "row",
|
|
|
|
|
|
padding: "0px",
|
|
|
|
|
|
borderRadius: "5px",
|
|
|
|
|
|
flex: 1,
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}}
|
|
|
|
|
|
>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div className="home-chart">
|
|
|
|
|
|
<div className="home-always-title">
|
|
|
|
|
|
<div className="home-always-left">
|
|
|
|
|
|
<div className="home-always-badge"></div>
|
|
|
|
|
|
<div className="home-always-name">安全检查次数统计</div>
|
|
|
|
|
|
</div>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div style={{ flex: 1, height: "100%", padding: "0px" }}>
|
|
|
|
|
|
<div
|
|
|
|
|
|
id="safeCheck"
|
2024-01-22 09:18:38 +08:00
|
|
|
|
style={{
|
2024-03-13 11:19:42 +08:00
|
|
|
|
width: "100%",
|
|
|
|
|
|
height: "100%",
|
|
|
|
|
|
// minHeight: "180px",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}}
|
2024-03-13 11:19:42 +08:00
|
|
|
|
></div>
|
|
|
|
|
|
</div>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</div>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<div style={{ width: "20px", minWidth: "20px" }}></div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div className="home-chart">
|
|
|
|
|
|
<div className="home-always-title">
|
|
|
|
|
|
<div className="home-always-left">
|
|
|
|
|
|
<div className="home-always-badge"></div>
|
|
|
|
|
|
<div className="home-always-name">月度隐患整改情况</div>
|
|
|
|
|
|
</div>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
<div style={{ flex: 1, height: "100%", padding: "0px" }}>
|
|
|
|
|
|
<div
|
|
|
|
|
|
id="dangerChange"
|
2024-01-22 09:18:38 +08:00
|
|
|
|
style={{
|
2024-03-13 11:19:42 +08:00
|
|
|
|
width: "100%",
|
|
|
|
|
|
height: "100%",
|
|
|
|
|
|
// minHeight: "180px",
|
2024-01-22 09:18:38 +08:00
|
|
|
|
}}
|
2024-03-13 11:19:42 +08:00
|
|
|
|
></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</Col>
|
2024-03-19 17:36:53 +08:00
|
|
|
|
<div style={{ width: "30px", minWidth: "30px" }}></div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
|
|
|
|
|
|
<Col
|
|
|
|
|
|
span={6}
|
|
|
|
|
|
style={{
|
|
|
|
|
|
backgroundColor: "#fff",
|
|
|
|
|
|
height: "100%",
|
|
|
|
|
|
padding: "0px",
|
|
|
|
|
|
borderRadius: "5px",
|
|
|
|
|
|
display: "flex",
|
|
|
|
|
|
flexDirection: "column",
|
2024-03-19 17:36:53 +08:00
|
|
|
|
minWidth: "466px",
|
2024-03-13 11:19:42 +08:00
|
|
|
|
}}
|
|
|
|
|
|
>
|
|
|
|
|
|
<div className="home-always-title">
|
|
|
|
|
|
<div className="home-always-left">
|
|
|
|
|
|
<div className="home-always-badge"></div>
|
|
|
|
|
|
<div className="home-always-name">风险等级占比</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div style={{ flex: 1, height: "100%", padding: "0px" }}>
|
|
|
|
|
|
<div
|
|
|
|
|
|
id="riskLevel"
|
|
|
|
|
|
style={{
|
|
|
|
|
|
width: "100%",
|
|
|
|
|
|
height: "100%",
|
|
|
|
|
|
// minHeight: "180px",
|
|
|
|
|
|
}}
|
|
|
|
|
|
></div>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</div>
|
2024-03-13 11:19:42 +08:00
|
|
|
|
</Col>
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
</Col>
|
2024-01-22 09:18:38 +08:00
|
|
|
|
</div>
|
|
|
|
|
|
);
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
export default connect(({ login, app }) => ({ login, app }))(Home);
|
