1179 lines
41 KiB
JavaScript
1179 lines
41 KiB
JavaScript
|
import React, { useState, useEffect, useRef, Component,useMemo } from 'react'
|
|||
|
|
import { connect } from 'dva'
|
|||
|
|
import storage from '../utils/storage'
|
|||
|
|
import { initFilter, addRuleAndGroups, guid, extendInclude, extendRule, extend } from "../utils/common"
|
|||
|
|
import './home.less'
|
|||
|
|
// 组件库
|
|||
|
|
import { Table, Card,Modal,List,Avatar, Row,Collapse, Col, Icon, Button, Input, DatePicker, Form, Select, notification, Divider,Tabs,Tag, message } from 'antd';
|
|||
|
|
|
|||
|
|
import { Chart, Geom, Axis, Tooltip, Legend } from "bizcharts";
|
|||
|
|
|
|||
|
|
import FormPage from '../components/FormPage'
|
|||
|
|
import backlog from '../assets/home/backlog.png';
|
|||
|
|
import userPicture from '../assets/home/it.jpg';
|
|||
|
|
import backlog_i from '../assets/home/backlog_icon.png';
|
|||
|
|
import styles from './dashboard.css';
|
|||
|
|
// import Slider from "react-slick";
|
|||
|
|
import 'slick-carousel/slick/slick.css';
|
|||
|
|
import 'slick-carousel/slick/slick-theme.css';
|
|||
|
|
import moment from 'moment';
|
|||
|
|
import flow from '../assets/home/flow.png';
|
|||
|
|
import flow_i from '../assets/home/flow_icon.png';
|
|||
|
|
import finished from '../assets/home/finished.png';
|
|||
|
|
import finished_i from '../assets/home/finished_icon.png';
|
|||
|
|
import remind from '../assets/home/remind.png';
|
|||
|
|
import remind_i from '../assets/home/remind_icon.png';
|
|||
|
|
import noticeImg from '../assets/home/noticeImg.jpg';
|
|||
|
|
import scoreImg from '../assets/home/score.jpg';
|
|||
|
|
import echarts from 'echarts';
|
|||
|
|
import config from '../config'
|
|||
|
|
import { routerRedux } from 'dva/router'
|
|||
|
|
const { TabPane } = Tabs;
|
|||
|
|
const { Panel } = Collapse;
|
|||
|
|
const Option = Select.Option;
|
|||
|
|
const RangePicker = DatePicker.RangePicker
|
|||
|
|
const FormItem = Form.Item
|
|||
|
|
const formItemLayout = {
|
|||
|
|
labelCol: { span: 6 },
|
|||
|
|
wrapperCol: { span: 14 },
|
|||
|
|
};
|
|||
|
|
// window.location.href="http://47.122.43.22:9100"
|
|||
|
|
const openNotification = placement => {
|
|||
|
|
notification.info({
|
|||
|
|
duration: null,
|
|||
|
|
top: 43,
|
|||
|
|
message: `签名照上传提示：`,
|
|||
|
|
description:
|
|||
|
|
'您还没上传自己的签名照片，请在我的资料中尽快上传您的签名照！',
|
|||
|
|
placement,
|
|||
|
|
});
|
|||
|
|
};
|
|||
|
|
const openNotificationMobile = placement => {
|
|||
|
|
notification.info({
|
|||
|
|
duration: 20,
|
|||
|
|
message: `友情提示：`,
|
|||
|
|
description:
|
|||
|
|
'您当前用的是手机在访问，为有更好体验，建议使用电脑访问！',
|
|||
|
|
placement,
|
|||
|
|
});
|
|||
|
|
};
|
|||
|
|
class HomeMobileNew extends React.Component {
|
|||
|
|
constructor(props) {
|
|||
|
|
super(props);
|
|||
|
|
// props.matchLogin=true;
|
|||
|
|
this.state = {
|
|||
|
|
visible: false,
|
|||
|
|
btnDisplay:'block',
|
|||
|
|
btnViewDisplay:'none',
|
|||
|
|
btnTodayDisplay:'none',
|
|||
|
|
noticeTitle: '',
|
|||
|
|
tmpData: {},
|
|||
|
|
tableKey: "1",
|
|||
|
|
pagination: {},
|
|||
|
|
retData: [],
|
|||
|
|
chartData: [],
|
|||
|
|
favorMenus:[],
|
|||
|
|
tableData: [{//工作台四个展示模块
|
|||
|
|
key: '1',
|
|||
|
|
bgImg: backlog,
|
|||
|
|
title: '待办事项',
|
|||
|
|
total: '0',
|
|||
|
|
iconImg: backlog_i,
|
|||
|
|
iconDisplay: 'block',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
key: '2',
|
|||
|
|
bgImg: flow,
|
|||
|
|
title: '已办事项',
|
|||
|
|
total: '0',
|
|||
|
|
iconImg: flow_i,
|
|||
|
|
iconDisplay: 'none',
|
|||
|
|
},
|
|||
|
|
// {
|
|||
|
|
// key: '4',
|
|||
|
|
// bgImg: remind,
|
|||
|
|
// title: '待办超时',
|
|||
|
|
// total: '0',
|
|||
|
|
// iconImg: remind_i,
|
|||
|
|
// iconDisplay: 'none',
|
|||
|
|
// },
|
|||
|
|
{
|
|||
|
|
key: '3',
|
|||
|
|
bgImg: finished,
|
|||
|
|
title: '今日提醒',
|
|||
|
|
total: '0',
|
|||
|
|
iconImg: finished_i,
|
|||
|
|
iconDisplay: 'none',
|
|||
|
|
}
|
|||
|
|
,
|
|||
|
|
],
|
|||
|
|
querySearch: {},//搜索集合
|
|||
|
|
isModalVisible: false,
|
|||
|
|
isModalVisible6: false,
|
|||
|
|
qty:5,
|
|||
|
|
departmentName: "",
|
|||
|
|
searchVisible: false, //弹窗显示
|
|||
|
|
searchTodayVisible: false, //弹窗显示
|
|||
|
|
};
|
|||
|
|
this.activeMenu = null;
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
componentDidMount() {
|
|||
|
|
// if (window.navigator.userAgent.indexOf("Windows") < 1) {
|
|||
|
|
// openNotificationMobile('bottomRight');
|
|||
|
|
// }
|
|||
|
|
this.getBaseInfoData(1, "1", 5);
|
|||
|
|
this.getMenuData();
|
|||
|
|
this.getTeam();
|
|||
|
|
//this.setMessageData();
|
|||
|
|
// this.targetCheck();//个人指标考核(统计图)
|
|||
|
|
//this.defectTreatment();//隐患整改(统计图)
|
|||
|
|
//this.jobType();//岗位风险类别(统计图)
|
|||
|
|
//this.mainJobPie();//主要工作分布(饼图)
|
|||
|
|
//this.delayJobBar();// 超期事务(柱状图图)
|
|||
|
|
//定时器功能，暂时不开启
|
|||
|
|
//this.timerID = setInterval(() => this.reloadData(), 50000);
|
|||
|
|
//this.showModalSign(); //验证是否有上传签名
|
|||
|
|
this.riskLevel();//岗位风险等级(饼图)
|
|||
|
|
};
|
|||
|
|
getTeam = () => {
|
|||
|
|
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) => {
|
|||
|
|
if (ret && ret.Nav_Department) {
|
|||
|
|
this.setState({
|
|||
|
|
departmentName: ret.Nav_Department.NAME
|
|||
|
|
});
|
|||
|
|
this.targetCheck();//班组作业情况(统计图)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
};
|
|||
|
|
getMenuData = () => {
|
|||
|
|
let favorMenus = storage('lacal').getItem('favorMenus')?.val;
|
|||
|
|
let storageDatas = favorMenus ?? [];
|
|||
|
|
if(storageDatas.length > 0)
|
|||
|
|
{
|
|||
|
|
this.setState({
|
|||
|
|
favorMenus: storageDatas,//data.Data,
|
|||
|
|
})
|
|||
|
|
storage('lacal').setItem('favorMenus', storageDatas)
|
|||
|
|
}
|
|||
|
|
else
|
|||
|
|
{
|
|||
|
|
let roles = this.props.login.roles;
|
|||
|
|
let menus =[];
|
|||
|
|
roles?.map(t=>{
|
|||
|
|
t.Nav_MenuPermissions?.map(t1=>{
|
|||
|
|
menus.push(t1.MENU_ID);
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
let userName=this.props.login.user?.NAME;
|
|||
|
|
let json = initFilter(this.props.login.OrgId,"", "NUM", "asc");
|
|||
|
|
extendRule(json, 'IS_MOBILE_MENU', 1, true)
|
|||
|
|
this.props.dispatch({
|
|||
|
|
type: 'app/getDataByPost',
|
|||
|
|
url: "PF/Menu/OrderPaged",
|
|||
|
|
payload: json,
|
|||
|
|
onlyData: false,
|
|||
|
|
onComplete: (data) => {
|
|||
|
|
let datas=[];
|
|||
|
|
// if(userName && userName.indexOf("管理员") !== -1)
|
|||
|
|
// {
|
|||
|
|
// datas=data.Data;
|
|||
|
|
// }
|
|||
|
|
// else
|
|||
|
|
// {
|
|||
|
|
// data.Data.map(t=>{
|
|||
|
|
// if(menus.includes(t.ID))
|
|||
|
|
// {
|
|||
|
|
// datas.push(t)
|
|||
|
|
// }
|
|||
|
|
// })
|
|||
|
|
// }
|
|||
|
|
datas=data.Data;
|
|||
|
|
this.setState({
|
|||
|
|
favorMenus: datas,//data.Data,
|
|||
|
|
})
|
|||
|
|
storage('lacal').setItem('favorMenus', datas)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
handleActiveMenu = (menu) => {
|
|||
|
|
this.activeMenu=menu
|
|||
|
|
this.props.history.push({ pathname: `/main/${menu.ID}` })
|
|||
|
|
}
|
|||
|
|
handleMore = () => {
|
|||
|
|
let qtyTemp =this.state.qty + 5 ;
|
|||
|
|
this.getBaseInfoData(1, this.state.tableKey, qtyTemp);
|
|||
|
|
this.setState({
|
|||
|
|
qty:qtyTemp
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
handleViewMore = () => {
|
|||
|
|
this.getBaseInfoData(1,"2", 10000000);
|
|||
|
|
this.setState({
|
|||
|
|
searchVisible: true,
|
|||
|
|
searchTodayVisible: false, //弹窗显示
|
|||
|
|
querySearch: {}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
handleTodayMore = () => {
|
|||
|
|
this.getBaseInfoData(1,"3", 10000000);
|
|||
|
|
this.setState({
|
|||
|
|
searchVisible: false,
|
|||
|
|
searchTodayVisible: true, //弹窗显示
|
|||
|
|
querySearch: {}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
//班组作业完成情况统计图
|
|||
|
|
targetCheck = () => {
|
|||
|
|
const { departmentName } = this.state;
|
|||
|
|
const userInfo = storage('lacal').getItem('webUserInfo').val;
|
|||
|
|
let json = initFilter(this.props.login.OrgId, "", "WAITTING_COUNT", "desc");
|
|||
|
|
this.props.dispatch({
|
|||
|
|
type: 'app/getDataByPost',
|
|||
|
|
url: "FM/DepartmentCompletion/OrderEntities",
|
|||
|
|
payload: json,
|
|||
|
|
onlyData: false,
|
|||
|
|
onComplete: (data) => {
|
|||
|
|
if (data && data.IsSuccessful) {
|
|||
|
|
// let enumsTemp = this.enums;
|
|||
|
|
// let formTypeEnums = enumsTemp ?enumsTemp.find(item => item.EnumName === "BIFormType"):[];
|
|||
|
|
let formName = [];
|
|||
|
|
let wattingQty = [];
|
|||
|
|
let finishQty = [];
|
|||
|
|
let totalQty = [];
|
|||
|
|
let WattingRate = [];
|
|||
|
|
let finishRate = [];
|
|||
|
|
let result = data.Data.filter(t => t.TEAM_NAME == departmentName);
|
|||
|
|
if(result)
|
|||
|
|
{
|
|||
|
|
result.forEach(item => {
|
|||
|
|
// let enums = formTypeEnums && formTypeEnums.options?formTypeEnums.options.find(t => t.value === item.FORM_TYPE):[];
|
|||
|
|
// formName.push(enums?enums.label:item.FORM_TYPE);
|
|||
|
|
formName.push(item.FORM_NAME);
|
|||
|
|
wattingQty.push(item.WAITTING_COUNT);
|
|||
|
|
finishQty.push(item.FINISH_COUNT);
|
|||
|
|
totalQty.push(item.TOTAL_COUNT);
|
|||
|
|
let finishRateTemp = (item.FINISH_COUNT / item.TOTAL_COUNT * 100).toFixed(2);
|
|||
|
|
let WattingRateTemp = (item.WAITTING_COUNT / item.TOTAL_COUNT * 100).toFixed(2);
|
|||
|
|
finishRate.push(finishRateTemp);
|
|||
|
|
WattingRate.push(WattingRateTemp);
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
var teamPre=result.filter(t => t.FORM_NAME == "班前会议");
|
|||
|
|
if(teamPre.length === 0)
|
|||
|
|
{
|
|||
|
|
formName.push("班前会议");
|
|||
|
|
finishRate.push(0);
|
|||
|
|
WattingRate.push(100);
|
|||
|
|
}
|
|||
|
|
var teamCur=result.filter(t => t.FORM_NAME == "岗位当班");
|
|||
|
|
if(teamCur.length === 0)
|
|||
|
|
{
|
|||
|
|
formName.push("岗位当班");
|
|||
|
|
finishRate.push(0);
|
|||
|
|
WattingRate.push(100);
|
|||
|
|
}
|
|||
|
|
var teamAft=result.filter(t => t.FORM_NAME == "岗位交接班");
|
|||
|
|
if(teamAft.length === 0)
|
|||
|
|
{
|
|||
|
|
formName.push("岗位交接班");
|
|||
|
|
finishRate.push(0);
|
|||
|
|
WattingRate.push(100);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
let myChart = echarts.init(document.getElementById('targetCheck'));
|
|||
|
|
myChart.setOption({
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'axis',
|
|||
|
|
axisPointer: { // 坐标轴指示器，坐标轴触发有效
|
|||
|
|
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
|
|||
|
|
},
|
|||
|
|
// formatter:function (params) {
|
|||
|
|
|
|||
|
|
// console.log(params); // 当我们想要自定义提示框内容时，可以先将鼠标悬浮的数据打印出来，然后根据需求提取出来即可
|
|||
|
|
|
|||
|
|
// let firstParams = params[0];
|
|||
|
|
// let sndParams = params[1];
|
|||
|
|
// let endParams = params[2];
|
|||
|
|
// return firstParams.seriesName +' ' + firstParams.value +'<br>' +sndParams.seriesName +' ' + sndParams.value +'<br>' + endParams.seriesName +' ' + endParams.value;
|
|||
|
|
// }
|
|||
|
|
},
|
|||
|
|
grid: {
|
|||
|
|
left: '3%',
|
|||
|
|
right: '4%',
|
|||
|
|
top: '3%',
|
|||
|
|
containLabel: true
|
|||
|
|
},
|
|||
|
|
xAxis: {
|
|||
|
|
type: 'value',
|
|||
|
|
splitLine: {
|
|||
|
|
show: false,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#172749'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
axisLine: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
axisTick: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
axisLabel: {
|
|||
|
|
|
|||
|
|
show: true,
|
|||
|
|
|
|||
|
|
interval: 0,
|
|||
|
|
|
|||
|
|
formatter: '{value} %', // 给每个数值添加%
|
|||
|
|
// fontSize: '22'
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
legend: {
|
|||
|
|
data: ['完成率', '未完成'],
|
|||
|
|
bottom: '35px'
|
|||
|
|
},
|
|||
|
|
yAxis: {
|
|||
|
|
type: 'category',
|
|||
|
|
axisTick: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
axisLine: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
splitLine: {
|
|||
|
|
show: false,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#172749'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
data: formName,
|
|||
|
|
},
|
|||
|
|
series: [
|
|||
|
|
// {
|
|||
|
|
// name: '总数',
|
|||
|
|
// type: 'bar',
|
|||
|
|
// stack: '',
|
|||
|
|
// label: {
|
|||
|
|
// show: true,
|
|||
|
|
// position: 'right',
|
|||
|
|
// color: '#000',
|
|||
|
|
// },
|
|||
|
|
// data: totalQty,
|
|||
|
|
// barGap: '-100%',
|
|||
|
|
// z:-1,
|
|||
|
|
// itemStyle: {
|
|||
|
|
// normal: {
|
|||
|
|
// color: 'rgba(128, 128, 128, 0.3)'
|
|||
|
|
// }
|
|||
|
|
// },
|
|||
|
|
// },
|
|||
|
|
// {
|
|||
|
|
// name: '已办',
|
|||
|
|
// type: 'bar',
|
|||
|
|
// stack: '',
|
|||
|
|
// label: {
|
|||
|
|
// show: true,
|
|||
|
|
// position: 'right',
|
|||
|
|
// color: '#000',
|
|||
|
|
// },
|
|||
|
|
// data: finishQty,
|
|||
|
|
// barGap: '-100%',
|
|||
|
|
// z:-1,
|
|||
|
|
// itemStyle: {
|
|||
|
|
// normal: {
|
|||
|
|
// color: '#5B9BD5',
|
|||
|
|
// }
|
|||
|
|
// },
|
|||
|
|
// },
|
|||
|
|
// {
|
|||
|
|
// name: '待办',
|
|||
|
|
// type: 'bar',
|
|||
|
|
// stack: '',
|
|||
|
|
// label: {
|
|||
|
|
// show: true,
|
|||
|
|
// position: 'right',
|
|||
|
|
// color: '#000',
|
|||
|
|
// },
|
|||
|
|
// data: wattingQty,
|
|||
|
|
// barGap: '-100%',
|
|||
|
|
// z:-1,
|
|||
|
|
// itemStyle: {
|
|||
|
|
// normal: {
|
|||
|
|
// color: 'rgba(192, 192, 192)',
|
|||
|
|
// }
|
|||
|
|
// },
|
|||
|
|
// },
|
|||
|
|
{
|
|||
|
|
name: '完成率',
|
|||
|
|
type: 'bar',
|
|||
|
|
stack: '总量',
|
|||
|
|
// color: '#ED7D31',//#ED7D31、008000、ED7D31
|
|||
|
|
data: finishRate.map(item=>{
|
|||
|
|
return {
|
|||
|
|
value:item,
|
|||
|
|
label: {
|
|||
|
|
show: item> 0 ? true:false,
|
|||
|
|
position: 'inside',
|
|||
|
|
color: '#fff',
|
|||
|
|
formatter: '{c}%',
|
|||
|
|
fontSize: '16'
|
|||
|
|
},
|
|||
|
|
// 每一个条目的样式配置
|
|||
|
|
itemStyle: {
|
|||
|
|
// barBorderRadius: [0, 34, 34, 0], // 圆角
|
|||
|
|
// 渐变色 1、指明颜色渐变的方向 2、指明不同百分比之下颜色的值
|
|||
|
|
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
|||
|
|
{ offset: 0, color: "rgba(187,162,227,0.6)" },
|
|||
|
|
{ offset: 1, color: "rgba(102,140,218,0.6)" },
|
|||
|
|
]),
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
}),//finishRate
|
|||
|
|
show: false,
|
|||
|
|
// 每一个条目的样式配置
|
|||
|
|
itemStyle: {
|
|||
|
|
// barBorderRadius: [0, 34, 34, 0], // 圆角
|
|||
|
|
// 渐变色 1、指明颜色渐变的方向 2、指明不同百分比之下颜色的值
|
|||
|
|
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
|
|||
|
|
{ offset: 0, color: "rgba(187,162,227,0.6)" },
|
|||
|
|
{ offset: 1, color: "rgba(102,140,218,0.6)" },
|
|||
|
|
]),
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '未完成',
|
|||
|
|
type: 'bar',
|
|||
|
|
stack: '总量',
|
|||
|
|
// label: {
|
|||
|
|
// show: true,
|
|||
|
|
// position: 'inside',
|
|||
|
|
// color: '#000',
|
|||
|
|
// formatter:'{c}%',
|
|||
|
|
// fontSize: '16'
|
|||
|
|
// },
|
|||
|
|
color: 'rgba(192, 192, 192)',//#5B9BD5、808080
|
|||
|
|
data: WattingRate
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
],
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
// let data = { "IsSuccessful": true, "Data":
|
|||
|
|
// [{ "FORM_NAME": "班前会议作业情况", "WATTING_COUNT": 0, "FINISH_COUNT": 20, "TOTAL_COUNT": 20},
|
|||
|
|
// { "FORM_NAME": "岗位当班作业情况", "WATTING_COUNT": 3, "FINISH_COUNT": 10, "TOTAL_COUNT": 0},
|
|||
|
|
// {"FORM_NAME": "岗位交接班作业情况", "WATTING_COUNT": 5, "FINISH_COUNT": 8, "TOTAL_COUNT": 0},
|
|||
|
|
// {"FORM_NAME": "岗位交接2班作业情况", "WATTING_COUNT": 5, "FINISH_COUNT": 10, "TOTAL_COUNT": 0}
|
|||
|
|
// ], "TotalCount": 0, "ErrorMessage": null }
|
|||
|
|
}
|
|||
|
|
//风险等级占比
|
|||
|
|
riskLevel = () => {
|
|||
|
|
const userInfo = storage('lacal').getItem('webUserInfo').val;
|
|||
|
|
let json = initFilter(this.props.login.OrgId);
|
|||
|
|
this.props.dispatch({
|
|||
|
|
type: 'app/getDataByPost',
|
|||
|
|
url: "FM/RiskLevelProportion/OrderPaged",
|
|||
|
|
payload: json,
|
|||
|
|
onlyData: false,
|
|||
|
|
onComplete: (data) => {
|
|||
|
|
if (data && data.IsSuccessful) {
|
|||
|
|
let riskLevel = []
|
|||
|
|
let showData = []
|
|||
|
|
let color = []
|
|||
|
|
data.Data.forEach(item => {
|
|||
|
|
riskLevel.push(item.RISK_LEVEL)
|
|||
|
|
color.push(item.COLOR)
|
|||
|
|
showData.push({ value: item.COUNT, name: item.RISK_LEVEL })
|
|||
|
|
})
|
|||
|
|
let myChart = echarts.init(document.getElementById('riskLevel'));
|
|||
|
|
myChart.setOption({
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'item',
|
|||
|
|
//formatter: '{a} <br/>{b} : {c} ({d}%)'
|
|||
|
|
formatter: '{b} : {c} ({d}%)'
|
|||
|
|
},
|
|||
|
|
legend: {
|
|||
|
|
bottom: '30px',
|
|||
|
|
data: riskLevel
|
|||
|
|
},
|
|||
|
|
series: [
|
|||
|
|
{
|
|||
|
|
name: '主要工作分布',
|
|||
|
|
type: 'pie',
|
|||
|
|
radius: '55%',
|
|||
|
|
center: ['50%', '42%'],
|
|||
|
|
label: {
|
|||
|
|
formatter: '{b}:({d}%)',
|
|||
|
|
},
|
|||
|
|
data: showData,
|
|||
|
|
color: color,
|
|||
|
|
emphasis: {
|
|||
|
|
itemStyle: {
|
|||
|
|
shadowBlur: 10,
|
|||
|
|
shadowOffsetX: 0,
|
|||
|
|
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
//获取数据
|
|||
|
|
getBaseInfoData = (pagination, key, limit) => {
|
|||
|
|
const current = pagination ? pagination.current : 1
|
|||
|
|
const json = initFilter(this.props.login.OrgId, "", "CODE", 1, current)
|
|||
|
|
// extendRule(json, 'SOURCE_FORMCODE', 9, "FO003")
|
|||
|
|
const querySearch = this.state.querySearch;
|
|||
|
|
for (var item in querySearch) {
|
|||
|
|
if (item == 'searchName') {
|
|||
|
|
extendRule(json, 'NOTICE_TITLE', 9, querySearch[item])
|
|||
|
|
}
|
|||
|
|
// if (item == 'searchCode') {
|
|||
|
|
// extendRule(json, 'CODE', 9, querySearch[item])
|
|||
|
|
// }
|
|||
|
|
if (item == 'startTime1') {
|
|||
|
|
extendRule(json, 'TASK_STARTDT', 6, querySearch[item])
|
|||
|
|
}
|
|||
|
|
if (item == 'startTime2') {
|
|||
|
|
extendRule(json, 'TASK_STARTDT', 4, querySearch[item])
|
|||
|
|
}
|
|||
|
|
if (item == 'searchStatus') {
|
|||
|
|
extendRule(json, 'NOTICE_STATUS', 1, querySearch[item])
|
|||
|
|
}
|
|||
|
|
// if (item == 'endTime1') {
|
|||
|
|
// extendRule(json, 'TASK_ENDDT', 6, querySearch[item])
|
|||
|
|
// }
|
|||
|
|
// if (item == 'endTime2') {
|
|||
|
|
// extendRule(json, 'TASK_ENDDT', 4, querySearch[item])
|
|||
|
|
// }
|
|||
|
|
}
|
|||
|
|
json.Limit = limit;
|
|||
|
|
json.Parameter1 = key;//1待办事项2已办事项3今日新增4待办超时
|
|||
|
|
this.props.dispatch({
|
|||
|
|
type: 'app/getDataByPost',
|
|||
|
|
url: 'FM/FMNotificationTask/HomeOrderPaged',
|
|||
|
|
payload: json,
|
|||
|
|
onlyData: false,
|
|||
|
|
onComplete: (re) => {
|
|||
|
|
if (re && re.IsSuccessful && re.Data.newData) {
|
|||
|
|
this.state.tableData[0].total = re.Data.todoCount;
|
|||
|
|
this.state.tableData[1].total = re.Data.doneCount;
|
|||
|
|
// this.state.tableData[2].total = re.Data.timeOverCount;
|
|||
|
|
this.state.tableData[2].total = re.Data.todayNewCount;
|
|||
|
|
// if (limit != null || limit != undefined)
|
|||
|
|
// {
|
|||
|
|
this.setState({
|
|||
|
|
retData: re.Data.newData,
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
clearData = () => {
|
|||
|
|
let newtmpData = { ...this.state.tmpData }
|
|||
|
|
newtmpData["data"].id = '';
|
|||
|
|
newtmpData["data"].homeReload = true;
|
|||
|
|
this.setState({
|
|||
|
|
visible: false,
|
|||
|
|
tmpData: [],
|
|||
|
|
qty:5,
|
|||
|
|
searchVisible: false,
|
|||
|
|
searchTodayVisible: false, //弹窗显示
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
handleCancel = () => { // 退出弹窗
|
|||
|
|
this.getBaseInfoData(1, this.state.tableKey, 5);
|
|||
|
|
this.clearData();
|
|||
|
|
}
|
|||
|
|
closeModal = () => { // 退出弹窗
|
|||
|
|
this.clearData();
|
|||
|
|
}
|
|||
|
|
closeqModal = () => { // 退出弹窗
|
|||
|
|
this.getBaseInfoData(1, "2", 5);
|
|||
|
|
this.setState({
|
|||
|
|
searchVisible: false,
|
|||
|
|
searchTodayVisible: false, //弹窗显示
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
showEditModal = (dataId, formCode, TaskID, title, taskCode,tableKey,taskStartdt,taskStatus) => {
|
|||
|
|
this.props.dispatch({
|
|||
|
|
type: 'app/getDataByPost',
|
|||
|
|
url: 'BI/BIController/getVersion',
|
|||
|
|
onComplete: (ret) => {
|
|||
|
|
if (ret > config.version) {
|
|||
|
|
window.localStorage.clear()
|
|||
|
|
message.success('清除成功，即将重新加载页面', 2, () => {
|
|||
|
|
setTimeout(() => window.location.reload(true), 500)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
const newtmpData = {
|
|||
|
|
data: { id: dataId, TaskID: TaskID, onCancel: this.handleCancel, taskCode: taskCode, tableKey: tableKey,noticeTitle:title,taskStartdt:taskStartdt,taskStatus:taskStatus,homeReload: true },
|
|||
|
|
formCode: tableKey==="3"?"PF135":formCode,
|
|||
|
|
}
|
|||
|
|
this.setState({
|
|||
|
|
noticeTitle: tableKey==="3"?"今日提醒":title,
|
|||
|
|
taskCode: taskCode,
|
|||
|
|
tmpData: newtmpData
|
|||
|
|
}, () => this.setState({
|
|||
|
|
visible: true
|
|||
|
|
}));
|
|||
|
|
}
|
|||
|
|
setMessageData = (dataSource) => {
|
|||
|
|
const data = dataSource ? dataSource : this.props.taskData;
|
|||
|
|
}
|
|||
|
|
//点击切换四个统计模块更改列表数据
|
|||
|
|
totalModuleClick = (item) => {
|
|||
|
|
const { tableData } = this.state;
|
|||
|
|
tableData.map((_item, i) => {
|
|||
|
|
if (_item.key == item.key) {
|
|||
|
|
_item.iconDisplay = 'block';
|
|||
|
|
this.setState({
|
|||
|
|
tableKey: item.key,
|
|||
|
|
qty:5,
|
|||
|
|
})
|
|||
|
|
if(item.key==="2")
|
|||
|
|
{
|
|||
|
|
this.setState({
|
|||
|
|
btnDisplay: 'none',
|
|||
|
|
btnViewDisplay:'block',
|
|||
|
|
btnTodayDisplay:'none',
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
else if(item.key==="3")
|
|||
|
|
{
|
|||
|
|
this.setState({
|
|||
|
|
btnDisplay: 'none',
|
|||
|
|
btnViewDisplay:'none',
|
|||
|
|
btnTodayDisplay:'block',
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
else
|
|||
|
|
{
|
|||
|
|
this.setState({
|
|||
|
|
btnDisplay: 'block',
|
|||
|
|
btnViewDisplay:'none',
|
|||
|
|
btnTodayDisplay:'none',
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
this.getBaseInfoData(1, item.key, 5);
|
|||
|
|
} else {
|
|||
|
|
_item.iconDisplay = 'none';
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
ShowState(obj) {
|
|||
|
|
if(this.state.tableKey!=="2")
|
|||
|
|
{
|
|||
|
|
if(this.state.tableKey==="3")
|
|||
|
|
{
|
|||
|
|
if (obj.NOTICE_STATUS !==0) {
|
|||
|
|
return (<Tag color="#2db7f5" style={{float:"center",padding:'0 10px' }}>已办</Tag >);
|
|||
|
|
} else {
|
|||
|
|
return (<Tag color="#f50" style={{float:"center",padding:'0 10px' }}>未读</Tag >);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
else
|
|||
|
|
{
|
|||
|
|
// let timeNow=Date.parse(new Date());
|
|||
|
|
// let timeEnd= Date.parse(obj.TASK_ENDDT)
|
|||
|
|
// let thisResult = ( timeEnd-timeNow );
|
|||
|
|
// if (thisResult > 0) {
|
|||
|
|
// return (<Tag color="#2db7f5" style={{float:"center",padding:'0 10px' }}>正常</Tag >);
|
|||
|
|
// } else {
|
|||
|
|
// return (<Tag color="#f50" style={{float:"center",padding:'0 10px' }}>超期</Tag >);
|
|||
|
|
// }
|
|||
|
|
if (obj.OVER_TIME === "超期") {
|
|||
|
|
return (<Tag color="#f50" style={{float:"center",padding:'0 10px' }}>超期</Tag >);
|
|||
|
|
} else{
|
|||
|
|
return (<Tag color="#2db7f5" style={{float:"center",padding:'0 10px' }}>正常</Tag >);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
showDescriptionModal = (value) => {
|
|||
|
|
if(value === "1")
|
|||
|
|
{
|
|||
|
|
this.setState({
|
|||
|
|
isModalVisible: true
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
else if(value === "6")
|
|||
|
|
{
|
|||
|
|
this.setState({
|
|||
|
|
isModalVisible6: true,
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
closeDescriptionModal = () => {
|
|||
|
|
this.setState({
|
|||
|
|
isModalVisible6: false,
|
|||
|
|
isModalVisible: false
|
|||
|
|
});
|
|||
|
|
};
|
|||
|
|
// input输入
|
|||
|
|
vauleChange = (e) => {
|
|||
|
|
const { querySearch } = this.state
|
|||
|
|
if (e.target.value) {
|
|||
|
|
switch (e.target.name) {
|
|||
|
|
case 'searchName':
|
|||
|
|
querySearch[e.target.name] = e.target.value
|
|||
|
|
this.setState({ querySearch })
|
|||
|
|
break
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
this.setState({ querySearch: {} })
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
selectChange = (value) => {
|
|||
|
|
const { querySearch } = this.state
|
|||
|
|
querySearch.searchStatus=value;
|
|||
|
|
this.setState({
|
|||
|
|
querySearch
|
|||
|
|
}, () => {
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
startChange = (dates, dateStr) => {
|
|||
|
|
const { querySearch } = this.state
|
|||
|
|
if (dates === null) {
|
|||
|
|
// querySearch['startTime1'] = ''
|
|||
|
|
// querySearch['startTime2'] = ''
|
|||
|
|
this.setState({
|
|||
|
|
querySearch: {}
|
|||
|
|
})
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
querySearch.startTime1 = dates.format("YYYY-MM-DD 00:00:00")
|
|||
|
|
// querySearch.startTime2 = this.state.visibleStartTime[1].format("YYYY-MM-DD HH:mm:ss")
|
|||
|
|
this.setState({
|
|||
|
|
querySearch
|
|||
|
|
// visibleStartTime: dates
|
|||
|
|
}, () => {
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
endChange = (dates, dateStr) => {
|
|||
|
|
const { querySearch } = this.state
|
|||
|
|
querySearch.startTime2 = dates.format("YYYY-MM-DD 23:59:59")
|
|||
|
|
// querySearch.startTime2 = this.state.visibleStartTime[1].format("YYYY-MM-DD HH:mm:ss")
|
|||
|
|
this.setState({
|
|||
|
|
querySearch
|
|||
|
|
// visibleStartTime: dates
|
|||
|
|
}, () => {
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
// 搜索
|
|||
|
|
handleSearch = () => {
|
|||
|
|
this.getBaseInfoData(1, "2", 10000000);
|
|||
|
|
}
|
|||
|
|
handleTodaySearch = () => {
|
|||
|
|
this.getBaseInfoData(1, "3", 10000000);
|
|||
|
|
}
|
|||
|
|
render() {
|
|||
|
|
const { tableData,favorMenus } = this.state;
|
|||
|
|
const onChange = (key) => {
|
|||
|
|
console.log(key);
|
|||
|
|
};
|
|||
|
|
return (
|
|||
|
|
<>
|
|||
|
|
{/* className='route-home' */}
|
|||
|
|
<div style={{ backgroundColor: '#fff', padding: '0 10px', position: 'relative', overflow: 'hidden'}}>
|
|||
|
|
<div style={{ display: 'inline-block' }}>
|
|||
|
|
<Modal
|
|||
|
|
visible={this.state.visible}
|
|||
|
|
title={this.state.noticeTitle + "(" + this.state.taskCode + ")"}
|
|||
|
|
maskClosable={false}
|
|||
|
|
onCancel={this.handleCancel}
|
|||
|
|
footer={null}
|
|||
|
|
style={{
|
|||
|
|
maxWidth: "100vw",
|
|||
|
|
top: -10,
|
|||
|
|
paddingBottom: 0,
|
|||
|
|
position: 'fixed'
|
|||
|
|
}}
|
|||
|
|
bodyStyle={{
|
|||
|
|
maxHeight:"100vh",
|
|||
|
|
height: "calc(100vh - 55px )", //-53
|
|||
|
|
overflowY: "auto",
|
|||
|
|
padding:"10px 12px 10px 10px"
|
|||
|
|
}}
|
|||
|
|
width="100vw"
|
|||
|
|
closeModal={this.closeModal}
|
|||
|
|
// forceRender={true}
|
|||
|
|
>
|
|||
|
|
<FormPage {...this.state.tmpData} />
|
|||
|
|
</Modal>
|
|||
|
|
<Modal
|
|||
|
|
visible={this.state.searchVisible}
|
|||
|
|
title={"已办事项"}
|
|||
|
|
maskClosable={false}
|
|||
|
|
onCancel={this.closeqModal}
|
|||
|
|
footer={false}
|
|||
|
|
style={{
|
|||
|
|
maxWidth: "100vw",
|
|||
|
|
top: -10,
|
|||
|
|
paddingBottom: 0
|
|||
|
|
}}
|
|||
|
|
bodyStyle={{
|
|||
|
|
maxHeight:"100vh",
|
|||
|
|
height: "calc(100vh - 55px )", //-53
|
|||
|
|
overflowY: "auto"
|
|||
|
|
}}
|
|||
|
|
width="100vw"
|
|||
|
|
closeModal={this.closeqModal}
|
|||
|
|
// className='antd-modal-fullscreen'
|
|||
|
|
>
|
|||
|
|
<Collapse onChange={onChange}>
|
|||
|
|
<Panel header="按条件搜索" key="1">
|
|||
|
|
<Form>
|
|||
|
|
<Row>
|
|||
|
|
<Col>
|
|||
|
|
<Form.Item
|
|||
|
|
label={'名称'}
|
|||
|
|
{...formItemLayout}
|
|||
|
|
>
|
|||
|
|
<Input
|
|||
|
|
value={this.state.querySearch.searchName}
|
|||
|
|
placeholder={'请输入任务名称'}
|
|||
|
|
name="searchName"
|
|||
|
|
onChange={this.vauleChange} />
|
|||
|
|
</Form.Item>
|
|||
|
|
</Col>
|
|||
|
|
<Col>
|
|||
|
|
<Form.Item
|
|||
|
|
label={'开始时间'}
|
|||
|
|
{...formItemLayout}
|
|||
|
|
>
|
|||
|
|
<DatePicker
|
|||
|
|
// value={this.state.visibleStartTime}
|
|||
|
|
// defaultValue={[moment(moment(this.state.querySearch.startTime1), "YYYY-MM-DD")]}
|
|||
|
|
onChange={this.startChange}
|
|||
|
|
/>
|
|||
|
|
</Form.Item>
|
|||
|
|
</Col>
|
|||
|
|
<Col>
|
|||
|
|
<Form.Item
|
|||
|
|
label={'结束时间'}
|
|||
|
|
{...formItemLayout}
|
|||
|
|
>
|
|||
|
|
<DatePicker
|
|||
|
|
// value={this.state.visibleStartTime}
|
|||
|
|
// defaultValue={[moment(moment(this.state.querySearch.startTime1), "YYYY-MM-DD")]}
|
|||
|
|
onChange={this.endChange}
|
|||
|
|
/>
|
|||
|
|
</Form.Item>
|
|||
|
|
</Col>
|
|||
|
|
<Col>
|
|||
|
|
<Button type={'primary'} icon={'search'} onClick={() => this.handleSearch()}>搜索</Button>
|
|||
|
|
</Col>
|
|||
|
|
</Row>
|
|||
|
|
</Form>
|
|||
|
|
</Panel>
|
|||
|
|
</Collapse>
|
|||
|
|
<br></br>
|
|||
|
|
<Row justify='center' style={{marginTop: "14px", minHeight: '120px',height: 'calc((100% - 250px) / 2)' }}>
|
|||
|
|
|
|||
|
|
{/* <Tabs defaultActiveKey={this.state.type} style={{backgroundColor:'#fff'}} onChange={this.onTabChange}>
|
|||
|
|
<TabPane tab="待办事项" key="1"> */}
|
|||
|
|
<List
|
|||
|
|
pagination={{
|
|||
|
|
onChange: page => {
|
|||
|
|
console.log(page);
|
|||
|
|
},
|
|||
|
|
pageSize: 10,
|
|||
|
|
}}
|
|||
|
|
itemLayout="horizontal"
|
|||
|
|
dataSource={this.state.retData}
|
|||
|
|
renderItem={record => (
|
|||
|
|
<List.Item
|
|||
|
|
extra={
|
|||
|
|
this.ShowState(record,"2")
|
|||
|
|
}
|
|||
|
|
>
|
|||
|
|
<List.Item.Meta
|
|||
|
|
avatar={<Avatar style={{backgroundColor:'RGB(24, 149, 255)'}}><Icon type ={ (record.ICON == '' || record.ICON == undefined) ? 'file-text' : record.ICON} className='backlog-icon-style2'></Icon></Avatar>}
|
|||
|
|
title={<span> <a onClick={() => this.showEditModal(record.SOURCE_DATA_ID, record.SOURCE_FORMCODE, record.ID, record.NOTICE_TITLE, record.CODE,this.state.tableKey)}>{record.NOTICE_TITLE}</a></span>}
|
|||
|
|
description={<span> {"开始时间:"+record.TASK_STARTDT.substring(0,16)}<br/>{"结束时间:"+record.TASK_ENDDT.substring(0,16)}</span>}
|
|||
|
|
/>
|
|||
|
|
</List.Item>
|
|||
|
|
)}
|
|||
|
|
/>
|
|||
|
|
{/* </TabPane> */}
|
|||
|
|
{/* </Tabs> */}
|
|||
|
|
</Row>
|
|||
|
|
{/* <Table
|
|||
|
|
dataSource={this.state.retDataAll}
|
|||
|
|
columns={this.state.searchColumns}
|
|||
|
|
pagination={this.state.pagination}
|
|||
|
|
onChange={(num) => this.getBaseInfoData(num, this.state.currentpageIndex, null)}
|
|||
|
|
loading={this.state.showLoading}
|
|||
|
|
size="small"
|
|||
|
|
/> */}
|
|||
|
|
</Modal>
|
|||
|
|
<Modal
|
|||
|
|
visible={this.state.searchTodayVisible}
|
|||
|
|
title={"今日提醒"}
|
|||
|
|
maskClosable={false}
|
|||
|
|
onCancel={this.closeqModal}
|
|||
|
|
footer={false}
|
|||
|
|
style={{
|
|||
|
|
maxWidth: "100vw",
|
|||
|
|
top: -10,
|
|||
|
|
paddingBottom: 0
|
|||
|
|
}}
|
|||
|
|
bodyStyle={{
|
|||
|
|
maxHeight:"100vh",
|
|||
|
|
height: "calc(100vh - 55px )", //-53
|
|||
|
|
overflowY: "auto"
|
|||
|
|
}}
|
|||
|
|
width="100vw"
|
|||
|
|
closeModal={this.closeqModal}
|
|||
|
|
// className='antd-modal-fullscreen'
|
|||
|
|
>
|
|||
|
|
<Collapse onChange={onChange}>
|
|||
|
|
<Panel header="按条件搜索" key="1">
|
|||
|
|
<Form>
|
|||
|
|
<Row>
|
|||
|
|
<Col>
|
|||
|
|
<Form.Item
|
|||
|
|
label={'提醒内容'}
|
|||
|
|
{...formItemLayout}
|
|||
|
|
>
|
|||
|
|
<Input
|
|||
|
|
value={this.state.querySearch.searchName}
|
|||
|
|
placeholder={'请输入提醒内容'}
|
|||
|
|
name="searchName"
|
|||
|
|
onChange={this.vauleChange} />
|
|||
|
|
</Form.Item>
|
|||
|
|
</Col>
|
|||
|
|
<Col>
|
|||
|
|
<Form.Item
|
|||
|
|
label={'开始时间'}
|
|||
|
|
{...formItemLayout}
|
|||
|
|
>
|
|||
|
|
<DatePicker
|
|||
|
|
// value={this.state.visibleStartTime}
|
|||
|
|
// defaultValue={[moment(moment(this.state.querySearch.startTime1), "YYYY-MM-DD")]}
|
|||
|
|
onChange={this.startChange}
|
|||
|
|
/>
|
|||
|
|
</Form.Item>
|
|||
|
|
</Col>
|
|||
|
|
<Col>
|
|||
|
|
<Form.Item
|
|||
|
|
label={'结束时间'}
|
|||
|
|
{...formItemLayout}
|
|||
|
|
>
|
|||
|
|
<DatePicker
|
|||
|
|
// value={this.state.visibleStartTime}
|
|||
|
|
// defaultValue={[moment(moment(this.state.querySearch.startTime1), "YYYY-MM-DD")]}
|
|||
|
|
onChange={this.endChange}
|
|||
|
|
/>
|
|||
|
|
</Form.Item>
|
|||
|
|
</Col>
|
|||
|
|
<Col>
|
|||
|
|
<Form.Item
|
|||
|
|
label={'状态'}
|
|||
|
|
{...formItemLayout}
|
|||
|
|
>
|
|||
|
|
<Select width={100}
|
|||
|
|
value={this.state.querySearch.searchStatus}
|
|||
|
|
// defaultValue={[moment(moment(this.state.querySearch.startTime1), "YYYY-MM-DD"), moment(moment(this.state.querySearch.startTime2), "YYYY-MM-DD")]}
|
|||
|
|
onChange={this.selectChange} >
|
|||
|
|
<Option value="0">未读</Option>
|
|||
|
|
<Option value="1">已办</Option>
|
|||
|
|
</Select>
|
|||
|
|
</Form.Item>
|
|||
|
|
</Col>
|
|||
|
|
<Col>
|
|||
|
|
<Button type={'primary'} icon={'search'} onClick={() => this.handleTodaySearch()}>搜索</Button>
|
|||
|
|
</Col>
|
|||
|
|
</Row>
|
|||
|
|
</Form>
|
|||
|
|
</Panel>
|
|||
|
|
</Collapse>
|
|||
|
|
<br></br>
|
|||
|
|
<Row justify='center' style={{marginTop: "14px", minHeight: '120px',height: 'calc((100% - 250px) / 2)' }}>
|
|||
|
|
|
|||
|
|
{/* <Tabs defaultActiveKey={this.state.type} style={{backgroundColor:'#fff'}} onChange={this.onTabChange}>
|
|||
|
|
<TabPane tab="待办事项" key="1"> */}
|
|||
|
|
<List
|
|||
|
|
pagination={{
|
|||
|
|
onChange: page => {
|
|||
|
|
console.log(page);
|
|||
|
|
},
|
|||
|
|
pageSize: 10,
|
|||
|
|
}}
|
|||
|
|
itemLayout="horizontal"
|
|||
|
|
dataSource={this.state.retData}
|
|||
|
|
renderItem={record => (
|
|||
|
|
<List.Item
|
|||
|
|
extra={
|
|||
|
|
this.ShowState(record,"2")
|
|||
|
|
}
|
|||
|
|
>
|
|||
|
|
<List.Item.Meta
|
|||
|
|
avatar={<Avatar style={{backgroundColor:'RGB(24, 149, 255)'}}><Icon type ={ (record.ICON == '' || record.ICON == undefined) ? 'file-text' : record.ICON} className='backlog-icon-style2'></Icon></Avatar>}
|
|||
|
|
title={<span> <a onClick={() => this.showEditModal(record.SOURCE_DATA_ID, record.SOURCE_FORMCODE, record.ID, record.NOTICE_TITLE, record.CODE,this.state.tableKey,record.TASK_STARTDT,record.NOTICE_STATUS)}>{record.NOTICE_TITLE}</a></span>}
|
|||
|
|
description={<span> {"开始时间:"+record.TASK_STARTDT.substring(0,16)}<br/>{"结束时间:"+record.TASK_ENDDT.substring(0,16)}</span>}
|
|||
|
|
/>
|
|||
|
|
</List.Item>
|
|||
|
|
)}
|
|||
|
|
/>
|
|||
|
|
{/* </TabPane> */}
|
|||
|
|
{/* </Tabs> */}
|
|||
|
|
</Row>
|
|||
|
|
{/* <Table
|
|||
|
|
dataSource={this.state.retDataAll}
|
|||
|
|
columns={this.state.searchColumns}
|
|||
|
|
pagination={this.state.pagination}
|
|||
|
|
onChange={(num) => this.getBaseInfoData(num, this.state.currentpageIndex, null)}
|
|||
|
|
loading={this.state.showLoading}
|
|||
|
|
size="small"
|
|||
|
|
/> */}
|
|||
|
|
</Modal>
|
|||
|
|
<Modal title="详细说明" visible={this.state.isModalVisible}
|
|||
|
|
closeModal={this.closeDescriptionModal}
|
|||
|
|
onCancel={this.closeDescriptionModal}
|
|||
|
|
onOk={this.closeDescriptionModal}
|
|||
|
|
footer={null}
|
|||
|
|
style={{ width: '100%', height: '100%', top: "300px" }}
|
|||
|
|
>
|
|||
|
|
<p>计算规则：完成率 = 已办数 / 总数 * 100%</p>
|
|||
|
|
</Modal>
|
|||
|
|
<Modal title="详细说明" visible={this.state.isModalVisible6}
|
|||
|
|
closeModal={this.closeDescriptionModal}
|
|||
|
|
onCancel={this.closeDescriptionModal}
|
|||
|
|
onOk={this.closeDescriptionModal}
|
|||
|
|
footer={null}
|
|||
|
|
style={{ width: '100%', height: '100%', top: "300px" }}
|
|||
|
|
>
|
|||
|
|
<p>计算规则：占比率 = 当前风险等级数量 / 风险等级总数 * 100%</p>
|
|||
|
|
</Modal>
|
|||
|
|
</div>
|
|||
|
|
{/* 五个图标模块 */}
|
|||
|
|
<Row type="flex" justify="space-between" style={{ marginTop:'80px',marginRight:"12px"}}>
|
|||
|
|
|
|||
|
|
{
|
|||
|
|
tableData.map((item) => {
|
|||
|
|
return (
|
|||
|
|
<Col span={7}>
|
|||
|
|
<div onClick={() => this.totalModuleClick(item)}
|
|||
|
|
style={{ background: `url(${item.bgImg}) 0 0 no-repeat`, width:'110px',height: '56px', backgroundSize: '100% 100%', borderRadius: '6px', cursor: 'pointer' }}
|
|||
|
|
>
|
|||
|
|
<div className='backlog-title-style2'>{item.title}</div>
|
|||
|
|
<div className={item.total>9999?'backlog-style3':'backlog-style2'} >{item.total}</div>
|
|||
|
|
<img src={item.iconImg} className='backlog-icon-style' style={{ display: item.iconDisplay }}/>
|
|||
|
|
</div>
|
|||
|
|
</Col>
|
|||
|
|
)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
</Row>
|
|||
|
|
{/* 通知 */}
|
|||
|
|
|
|||
|
|
<Row style={{ marginTop: "14px", height: 'calc((100% - 250px) / 2)', minHeight: '120px' }}>
|
|||
|
|
{/* 列表 */}
|
|||
|
|
{/* <Col style={{ height: '100%', whiteSpace: 'pre-wrap' }}> */}
|
|||
|
|
<div >
|
|||
|
|
<List
|
|||
|
|
// pagination={{
|
|||
|
|
// onChange: page => {
|
|||
|
|
// console.log(page);
|
|||
|
|
// },
|
|||
|
|
// pageSize: 10,
|
|||
|
|
// }}
|
|||
|
|
itemLayout="horizontal"
|
|||
|
|
dataSource={this.state.retData}
|
|||
|
|
renderItem={record => (
|
|||
|
|
<List.Item
|
|||
|
|
extra={
|
|||
|
|
this.ShowState(record)
|
|||
|
|
}
|
|||
|
|
>
|
|||
|
|
<List.Item.Meta
|
|||
|
|
avatar={<Avatar style={{backgroundColor:'RGB(24, 149, 255)',marginTop:'5px',marginLeft:'5px'}}><Icon type ={ (record.ICON == '' || record.ICON == undefined) ? 'file-text' : record.ICON} className='backlog-icon-style2'></Icon></Avatar>}
|
|||
|
|
title={
|
|||
|
|
<span>
|
|||
|
|
{/* <Icon type ={ (record.ICON == '' || record.ICON == undefined) ? 'file-text' : record.ICON}></Icon> */}
|
|||
|
|
<a onClick={() => this.showEditModal(record.SOURCE_DATA_ID, record.SOURCE_FORMCODE, record.ID, record.NOTICE_TITLE, record.CODE,this.state.tableKey,record.TASK_STARTDT,record.NOTICE_STATUS)}>{record.NOTICE_TITLE}</a></span>}
|
|||
|
|
description={<span> {"开始时间:"+record.TASK_STARTDT.substring(0,16)}<br/>{"结束时间:"+record.TASK_ENDDT.substring(0,16)}</span>}
|
|||
|
|
// {"开始时间:"+record.TASK_STARTDT.substring(0,16)+"结束时间:"+record.TASK_ENDDT.substring(0,16)}
|
|||
|
|
/>
|
|||
|
|
</List.Item>
|
|||
|
|
)}
|
|||
|
|
/>
|
|||
|
|
</div>
|
|||
|
|
{/* </Col> */}
|
|||
|
|
</Row>
|
|||
|
|
<Button type="primary" block onClick={()=>this.handleMore()} style={{ display: this.state.btnDisplay }}>
|
|||
|
|
加载更多...
|
|||
|
|
</Button>
|
|||
|
|
<Button type="primary" block onClick={()=>this.handleViewMore()} style={{ display: this.state.btnViewDisplay }}>
|
|||
|
|
查看更多...
|
|||
|
|
</Button>
|
|||
|
|
<Button type="primary" block onClick={()=>this.handleTodayMore()} style={{ display: this.state.btnTodayDisplay }}>
|
|||
|
|
查看更多...
|
|||
|
|
</Button>
|
|||
|
|
<Row style={{ marginTop: "10px"}}>
|
|||
|
|
<Card title="快捷菜单" style={{ borderRadius: '10px'}}>
|
|||
|
|
{
|
|||
|
|
favorMenus?favorMenus.map((menu, index) => {
|
|||
|
|
const active = menu.ID === this.activeMenu?.ID
|
|||
|
|
const iconClass = `sider__menu-icon2 ${active ? 'active' : ''}`
|
|||
|
|
var icon = (menu.ICON == '' || menu.ICON == undefined) ? 'file-text' : menu.ICON
|
|||
|
|
return (
|
|||
|
|
<Card.Grid onClick={()=>this.handleActiveMenu(menu)} style={{width:'33.33%',textAlign:'center',color:'RGB(24, 149, 255)'}}>
|
|||
|
|
<Icon type={icon} className={iconClass} onClick={()=>this.handleActiveMenu(menu)}/>
|
|||
|
|
{/* <img style={{ boxShadow: '0px 0px 10px rgba(0,0,0,.15)',width:'60px',height:'60px'}} src={userPicture} onClick={()=>this.handleActiveMenu(menu)}></img> */}
|
|||
|
|
<br></br><a onClick={()=>this.handleActiveMenu(menu)}>{menu.NAME}</a></Card.Grid>
|
|||
|
|
// <Card.Grid style={{width:'50%',textAlign:'center'}}><Button type="link" onClick={()=>this.showEditModal(menu.MENU_FORM_ID,menu.Nav_MenuForm.CODE)}>{menu.NAME}</Button></Card.Grid>
|
|||
|
|
)
|
|||
|
|
}):null
|
|||
|
|
}
|
|||
|
|
</Card>
|
|||
|
|
</Row>
|
|||
|
|
<Row style={{ marginTop: "10px"}}>
|
|||
|
|
<div className="dashboard-div-style" style={{ boxShadow: '0px 0px 10px rgba(0,0,0,.15)' }}>
|
|||
|
|
<div className="statistical-title-style2"><div className="badge-style"></div>{this.state.departmentName}作业完成情况
|
|||
|
|
<span style={{ fontSize: '12px', float: 'right', marginRight: "16px", marginTop: "4px" }}>
|
|||
|
|
<a onClick={()=>this.showDescriptionModal("1")}>详细说明</a>
|
|||
|
|
</span>
|
|||
|
|
</div>
|
|||
|
|
<div id="targetCheck" style={{ width: '100%', height: '180px' }}></div>
|
|||
|
|
</div>
|
|||
|
|
</Row>
|
|||
|
|
<Row style={{ marginTop: "10px"}}>
|
|||
|
|
<div className="dashboard-div-style" style={{ boxShadow: '0px 0px 10px rgba(0,0,0,.15)' }}>
|
|||
|
|
<div className="statistical-title-style2"><div className="badge-style"></div>风险等级占比
|
|||
|
|
<span style={{ fontSize: '12px', float: 'right', marginRight: "16px", marginTop: "4px" }}>
|
|||
|
|
<a onClick={()=>this.showDescriptionModal("6")}>详细说明</a>
|
|||
|
|
</span>
|
|||
|
|
</div>
|
|||
|
|
<div id="riskLevel" style={{ width: '100%', height: '260px' }}></div>
|
|||
|
|
</div>
|
|||
|
|
</Row>
|
|||
|
|
</div>
|
|||
|
|
</>
|
|||
|
|
)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
export default connect(({ login }) => ({ login }))(HomeMobileNew)
|