首页优化
This commit is contained in:
parent
e6da597053
commit
2cfe93d644
@ -105,6 +105,15 @@ body {
|
||||
padding: 36px 5px 10px 5px;
|
||||
min-width: 375px;
|
||||
}
|
||||
:global(.ant-modal.antd-modal-homescreen) {
|
||||
top : 0;
|
||||
width : 100% !important;
|
||||
height : 100%;
|
||||
z-index: 100;
|
||||
position: fixed;
|
||||
padding: 36px 40px 40px 40px;
|
||||
min-width: 375px;
|
||||
}
|
||||
|
||||
:global(.ant-modal.antd-modal-fullscreen > .ant-modal-content) {
|
||||
height: 100%;
|
||||
@ -115,6 +124,15 @@ body {
|
||||
padding : 0;
|
||||
max-height: unset;
|
||||
}
|
||||
:global(.ant-modal.antd-modal-homescreen > .ant-modal-content) {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
:global(.ant-modal.antd-modal-homescreen > .ant-modal-content > .ant-modal-body) {
|
||||
height : calc(100% - 55px);
|
||||
padding : 0;
|
||||
max-height: unset;
|
||||
}
|
||||
|
||||
/** 全屏弹窗样式 ===end=== **/
|
||||
|
||||
|
||||
@ -244,18 +244,18 @@
|
||||
display: grid;
|
||||
grid-template-rows: auto;
|
||||
grid-template-columns: auto;
|
||||
grid-template-columns: repeat(auto-fill, 170px);
|
||||
grid-template-columns: repeat(auto-fill, 180px);
|
||||
justify-content: space-between;
|
||||
// grid-gap: 5px;
|
||||
/* 声明了两行，行高分别为 50px 50px */
|
||||
// grid-template-rows: 50px;
|
||||
margin: 10px 20px 10px 70px;
|
||||
margin: 10px 20px 10px 55px;
|
||||
}
|
||||
&__shortMenuShowFlex {
|
||||
background-color: #fff;
|
||||
// border-top: 10px solid #f3f4f6;
|
||||
padding: 30px 0px 20px 0px;
|
||||
margin-bottom: 20px;
|
||||
padding: 20px 0px 5px 0px;
|
||||
margin-bottom: 10px;
|
||||
margin-right: 30px;
|
||||
box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.12);
|
||||
border-radius: 10px;
|
||||
@ -309,7 +309,7 @@
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.12);
|
||||
margin: 10px 0px;
|
||||
margin: 8px 0px;
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
// justify-content: center;
|
||||
|
||||
@ -23,7 +23,14 @@ import {
|
||||
Dropdown,
|
||||
Menu,
|
||||
Empty,
|
||||
Modal
|
||||
Modal,
|
||||
Divider,
|
||||
Form,
|
||||
Input,
|
||||
Table,
|
||||
Button,
|
||||
DatePicker,
|
||||
Select
|
||||
} from "antd";
|
||||
import styles from "./dashboard.css";
|
||||
import "slick-carousel/slick/slick.css";
|
||||
@ -34,6 +41,12 @@ import ModifyPassword from "../components/MainPage/ModifyPassword";
|
||||
import FoUserInfoShow from "../components/MainPage/FoUserInfoShow";
|
||||
import FormPage from "../components/FormPage";
|
||||
const { TabPane } = Tabs;
|
||||
const Option = Select.Option;
|
||||
const RangePicker = DatePicker.RangePicker;
|
||||
const formItemLayout = {
|
||||
labelCol: { span: 6 },
|
||||
wrapperCol: { span: 14 },
|
||||
};
|
||||
const WorkBench = (props) => {
|
||||
return (
|
||||
<div>
|
||||
@ -118,7 +131,12 @@ const WorkBench = (props) => {
|
||||
};
|
||||
const UserInfo = (props) => {
|
||||
return (
|
||||
<div className="home-userInfo">
|
||||
<div
|
||||
className="home-userInfo"
|
||||
onClick={() => {
|
||||
props.showAll();
|
||||
}}
|
||||
>
|
||||
<div className="home-userInfo-pad">
|
||||
<Icon
|
||||
type="schedule"
|
||||
@ -146,7 +164,15 @@ class Home extends React.Component {
|
||||
tableKey: "1",
|
||||
formVisible: false,
|
||||
noticeTitle: "",
|
||||
searchVisible: false,
|
||||
visibleTitle: "",
|
||||
searchTodayVisible: false,
|
||||
taskSelects: [],
|
||||
tmpData: {},
|
||||
querySearch:{},
|
||||
currentpageIndex:'1',
|
||||
visibleStartTime: [],
|
||||
visibleEndTime: [],
|
||||
completeName: [
|
||||
{
|
||||
name: "张森友",
|
||||
@ -199,6 +225,157 @@ class Home extends React.Component {
|
||||
this.dangerChange();
|
||||
this.getUser();
|
||||
}
|
||||
showAll = (key) => {
|
||||
const { tableData } = this.state;
|
||||
|
||||
if (key == "2") {
|
||||
this.state.searchColumns = [
|
||||
{
|
||||
width: "450px",
|
||||
title: "任务名称",
|
||||
dataIndex: "NOTICE_TITLE",
|
||||
key: "NOTICE_TITLE",
|
||||
render: (text, record) => (
|
||||
<span>
|
||||
<a
|
||||
onClick={() =>
|
||||
this.showEditModal(
|
||||
record.SOURCE_DATA_ID,
|
||||
record.SOURCE_FORMCODE,
|
||||
record.ID,
|
||||
record.NOTICE_TITLE,
|
||||
record.CODE
|
||||
)
|
||||
}
|
||||
>
|
||||
{record.NOTICE_TITLE}
|
||||
</a>
|
||||
</span>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: "开始时间",
|
||||
dataIndex: "TASK_STARTDT",
|
||||
key: "TASK_STARTDT",
|
||||
},
|
||||
{
|
||||
title: "结束时间",
|
||||
dataIndex: "TASK_ENDDT",
|
||||
key: "TASK_ENDDT",
|
||||
},
|
||||
{
|
||||
title: "办结时间",
|
||||
dataIndex: "TASK_DT",
|
||||
key: "TASK_DT",
|
||||
},
|
||||
];
|
||||
this.setState({
|
||||
searchVisible: true,
|
||||
searchTodayVisible: false,
|
||||
querySearch: {},
|
||||
});
|
||||
} else if (key === "3") {
|
||||
this.state.searchColumns = [
|
||||
{
|
||||
width: "450px",
|
||||
title: "提醒内容",
|
||||
dataIndex: "NOTICE_TITLE",
|
||||
key: "NOTICE_TITLE",
|
||||
render: (text, record) => (
|
||||
<span>
|
||||
<a
|
||||
onClick={() =>
|
||||
this.showTodayModal(
|
||||
record.SOURCE_DATA_ID,
|
||||
record.SOURCE_FORMCODE,
|
||||
record.ID,
|
||||
record.NOTICE_TITLE,
|
||||
record.CODE,
|
||||
record.TASK_STARTDT,
|
||||
record.NOTICE_STATUS
|
||||
)
|
||||
}
|
||||
>
|
||||
{record.NOTICE_TITLE}
|
||||
</a>
|
||||
</span>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: "提醒时间",
|
||||
dataIndex: "TASK_STARTDT",
|
||||
key: "TASK_STARTDT",
|
||||
},
|
||||
{
|
||||
title: "状态",
|
||||
dataIndex: "NOTICE_STATUS",
|
||||
key: "NOTICE_STATUS",
|
||||
render: (text, record) => this.ShowStatus(record),
|
||||
},
|
||||
];
|
||||
this.setState({
|
||||
searchVisible: false,
|
||||
searchTodayVisible: true,
|
||||
querySearch: {},
|
||||
});
|
||||
} else {
|
||||
this.state.searchColumns = [
|
||||
{
|
||||
width: "450px",
|
||||
title: "任务名称",
|
||||
dataIndex: "NOTICE_TITLE",
|
||||
key: "NOTICE_TITLE",
|
||||
render: (text, record) => (
|
||||
<span>
|
||||
<a
|
||||
onClick={() =>
|
||||
this.showEditModal(
|
||||
record.SOURCE_DATA_ID,
|
||||
record.SOURCE_FORMCODE,
|
||||
record.ID,
|
||||
record.NOTICE_TITLE,
|
||||
record.CODE
|
||||
)
|
||||
}
|
||||
>
|
||||
{record.NOTICE_TITLE}
|
||||
</a>
|
||||
</span>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: "开始时间",
|
||||
dataIndex: "TASK_STARTDT",
|
||||
key: "TASK_STARTDT",
|
||||
},
|
||||
{
|
||||
title: "结束时间",
|
||||
dataIndex: "TASK_ENDDT",
|
||||
key: "TASK_ENDDT",
|
||||
},
|
||||
{
|
||||
title: "预警状态",
|
||||
dataIndex: "NOTICE_TYPE",
|
||||
key: "NOTICE_TYPE",
|
||||
render: (text, record) => this.ShowState(record),
|
||||
},
|
||||
];
|
||||
this.setState({
|
||||
searchVisible: true,
|
||||
searchTodayVisible: false,
|
||||
querySearch: {},
|
||||
});
|
||||
}
|
||||
this.setState(
|
||||
{
|
||||
tableData,
|
||||
currentpageIndex: key,
|
||||
},
|
||||
() => {
|
||||
this.getBaseData(1, key);
|
||||
}
|
||||
);
|
||||
};
|
||||
tabsCallback = (key) => {
|
||||
if (key == 1) {
|
||||
this.getBaseData(1, "1", 5);
|
||||
@ -231,6 +408,24 @@ class Home extends React.Component {
|
||||
e.CODE
|
||||
);
|
||||
};
|
||||
ShowState(obj) {
|
||||
var thisResult =
|
||||
(Date.parse(obj.TASK_ENDDT) - Date.parse(Date())) / 3600 / 1000;
|
||||
if (thisResult > 0) {
|
||||
return "正常";
|
||||
} else {
|
||||
return <span style={{ color: "red" }}>超期</span>;
|
||||
}
|
||||
}
|
||||
ShowStatus(obj) {
|
||||
if (obj.NOTICE_STATUS === 0) {
|
||||
return <span style={{ color: "red" }}>未读</span>;
|
||||
} else if (obj.NOTICE_STATUS === 3) {
|
||||
return "已读";
|
||||
} else {
|
||||
return "已办";
|
||||
}
|
||||
}
|
||||
showEditModal = (dataId, formCode, TaskID, title, taskCode) => {
|
||||
this.props.dispatch({
|
||||
type: "app/getDataByPost",
|
||||
@ -262,14 +457,11 @@ class Home extends React.Component {
|
||||
tmpData: newtmpData,
|
||||
currActivatedMenu: "",
|
||||
},
|
||||
() =>{
|
||||
() => {
|
||||
this.setState({
|
||||
formVisible: true,
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
);
|
||||
};
|
||||
clearData = () => {
|
||||
@ -287,14 +479,38 @@ class Home extends React.Component {
|
||||
this.getBaseData(1, this.state.tableKey, 5);
|
||||
this.clearData();
|
||||
};
|
||||
closeModal=()=>{
|
||||
closeModal = () => {
|
||||
this.setState({
|
||||
formVisible: false,
|
||||
})
|
||||
}
|
||||
});
|
||||
};
|
||||
getBaseData = (pagination, key, limit) => {
|
||||
const current = pagination ? pagination.current : 1;
|
||||
const json = initFilter(this.props.login.OrgId, "", "CODE", 1, current);
|
||||
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 == "endTime1") {
|
||||
extendRule(json, "TASK_ENDDT", 6, querySearch[item]);
|
||||
}
|
||||
if (item == "endTime2") {
|
||||
extendRule(json, "TASK_ENDDT", 4, querySearch[item]);
|
||||
}
|
||||
if (item == "searchStatus") {
|
||||
extendRule(json, "NOTICE_STATUS", 1, querySearch[item]);
|
||||
}
|
||||
}
|
||||
//extendRule(json, "NOTICE_STATUS", 1, 0);
|
||||
json.Limit = limit;
|
||||
//json.Limit = 10;
|
||||
@ -410,7 +626,7 @@ class Home extends React.Component {
|
||||
left: "5%",
|
||||
right: "5%",
|
||||
bottom: "15%",
|
||||
top: "5%",
|
||||
top: "10%",
|
||||
containLabel: true,
|
||||
z: 22,
|
||||
},
|
||||
@ -527,10 +743,10 @@ class Home extends React.Component {
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
left: "10%",
|
||||
// right: "10%",
|
||||
left: "5%",
|
||||
right: "5%",
|
||||
bottom: "15%",
|
||||
top: "5%",
|
||||
top: "10%",
|
||||
containLabel: true,
|
||||
z: 22,
|
||||
},
|
||||
@ -656,16 +872,28 @@ class Home extends React.Component {
|
||||
let myChart = echarts.init(timelyRates);
|
||||
myChart.setOption(
|
||||
{
|
||||
title: {
|
||||
text: "83%",
|
||||
x: "center",
|
||||
y: "center",
|
||||
textStyle: {
|
||||
fontWeight: "normal",
|
||||
color: "#ffa94d",
|
||||
fontSize: "20",
|
||||
title: [
|
||||
{
|
||||
text: "83%",
|
||||
x: "center",
|
||||
top: "40%",
|
||||
textStyle: {
|
||||
fontWeight: "normal",
|
||||
color: "#ffa94d",
|
||||
fontSize: "26",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
text: "及时完成率",
|
||||
x: "center",
|
||||
top: "55%",
|
||||
textStyle: {
|
||||
fontWeight: "normal",
|
||||
|
||||
fontSize: "14",
|
||||
},
|
||||
},
|
||||
],
|
||||
color: "#ffd6b5",
|
||||
legend: {
|
||||
show: false,
|
||||
@ -736,16 +964,28 @@ class Home extends React.Component {
|
||||
if (completeRates) {
|
||||
let myChart = echarts.init(completeRates);
|
||||
myChart.setOption({
|
||||
title: {
|
||||
text: "93%",
|
||||
x: "center",
|
||||
y: "center",
|
||||
textStyle: {
|
||||
fontWeight: "normal",
|
||||
color: "#0580f2",
|
||||
fontSize: "20",
|
||||
title: [
|
||||
{
|
||||
text: "93%",
|
||||
x: "center",
|
||||
top: "40%",
|
||||
textStyle: {
|
||||
fontWeight: "normal",
|
||||
color: "#0580f2",
|
||||
fontSize: "26",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
text: "个人完成率",
|
||||
x: "center",
|
||||
top: "55%",
|
||||
textStyle: {
|
||||
fontWeight: "normal",
|
||||
|
||||
fontSize: "14",
|
||||
},
|
||||
},
|
||||
],
|
||||
color: ["rgba(176, 212, 251, 1)"],
|
||||
legend: {
|
||||
show: false,
|
||||
@ -812,8 +1052,8 @@ class Home extends React.Component {
|
||||
riskLevel = () => {
|
||||
let riskLevel = [];
|
||||
let showData = [
|
||||
{ value: 20, name: "一级" },
|
||||
{ value: 10, name: "二级" },
|
||||
{ value: 2, name: "一级" },
|
||||
{ value: 5, name: "二级" },
|
||||
{ value: 15, name: "三级" },
|
||||
{ value: 30, name: "四级" },
|
||||
];
|
||||
@ -823,20 +1063,24 @@ class Home extends React.Component {
|
||||
let myChart = echarts.init(riskLevels);
|
||||
myChart.setOption({
|
||||
color: ["#c92a2a", "#ffa94d", "#ffe066", "#4285F4", "#fa8a89"],
|
||||
title: {
|
||||
text: "60",
|
||||
title: [{
|
||||
text: "52",
|
||||
x: "26%",
|
||||
y: "center",
|
||||
y: "40%",
|
||||
textStyle: {
|
||||
fontSize: 16,
|
||||
fontSize: 26,
|
||||
fontWeight: "normal",
|
||||
color: ["#333"],
|
||||
},
|
||||
subtextStyle: {
|
||||
},{
|
||||
text: "风险总数",
|
||||
x: "24%",
|
||||
y: "55%",
|
||||
textStyle: {
|
||||
color: "#666",
|
||||
fontSize: 12,
|
||||
},
|
||||
},
|
||||
}],
|
||||
tooltip: {
|
||||
trigger: "item",
|
||||
formatter: "{b}:({d}%)",
|
||||
@ -942,8 +1186,103 @@ class Home extends React.Component {
|
||||
visible: false,
|
||||
});
|
||||
};
|
||||
doubleClear = () => {
|
||||
if (this.state.searchVisible === true) {
|
||||
this.setState({ searchVisible: false });
|
||||
} else if (this.state.searchTodayVisible === true) {
|
||||
this.setState({ searchTodayVisible: false });
|
||||
}
|
||||
|
||||
this.getBaseData(1, this.state.tableKey, 5);
|
||||
};
|
||||
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;
|
||||
case "searchCode":
|
||||
querySearch[e.target.name] = e.target.value;
|
||||
this.setState({ querySearch });
|
||||
break;
|
||||
case "searchType":
|
||||
querySearch[e.target.name] = e.target.value;
|
||||
this.setState({ querySearch });
|
||||
break;
|
||||
case "searchContent":
|
||||
querySearch[e.target.name] = e.target.value;
|
||||
this.setState({ querySearch });
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
this.setState({ querySearch: {} });
|
||||
}
|
||||
};
|
||||
handleSearch = (item) => {
|
||||
this.getBaseData(1, item, null);
|
||||
};
|
||||
selectChange = (value) => {
|
||||
const { querySearch } = this.state;
|
||||
querySearch.searchStatus = value;
|
||||
this.setState(
|
||||
{
|
||||
querySearch,
|
||||
},
|
||||
() => { }
|
||||
);
|
||||
};
|
||||
// 开始时间
|
||||
startChange = (dates, dateStr) => {
|
||||
const { querySearch } = this.state;
|
||||
if (dates.length != 2) {
|
||||
this.setState({
|
||||
visibleStartTime: [],
|
||||
querySearch: {},
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.state.visibleStartTime = dates;
|
||||
querySearch.startTime1 = this.state.visibleStartTime[0].format(
|
||||
"YYYY-MM-DD HH:mm:ss"
|
||||
);
|
||||
querySearch.startTime2 = this.state.visibleStartTime[1].format(
|
||||
"YYYY-MM-DD HH:mm:ss"
|
||||
);
|
||||
this.setState(
|
||||
{
|
||||
querySearch,
|
||||
},
|
||||
() => { }
|
||||
);
|
||||
};
|
||||
// 结束时间
|
||||
endChange = (dates, dateStr) => {
|
||||
const { querySearch } = this.state;
|
||||
if (dates.length != 2) {
|
||||
this.setState({
|
||||
visibleEndTime: [],
|
||||
querySearch: {},
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.state.visibleEndTime = dates;
|
||||
querySearch.endTime1 = this.state.visibleEndTime[0].format(
|
||||
"YYYY-MM-DD HH:mm:ss"
|
||||
);
|
||||
querySearch.endTime2 = this.state.visibleEndTime[1].format(
|
||||
"YYYY-MM-DD HH:mm:ss"
|
||||
);
|
||||
this.setState({ querySearch });
|
||||
};
|
||||
|
||||
render() {
|
||||
const rowSelection = {
|
||||
onChange: (selectedRowKeys, selectedRows) => {
|
||||
this.state.taskSelects = selectedRows;
|
||||
},
|
||||
};
|
||||
return (
|
||||
<div
|
||||
className="route-home"
|
||||
@ -967,6 +1306,148 @@ class Home extends React.Component {
|
||||
>
|
||||
<FormPage {...this.state.tmpData} />
|
||||
</Modal>
|
||||
<Modal
|
||||
visible={this.state.searchVisible}
|
||||
zIndex={999}
|
||||
title={this.state.visibleTitle}
|
||||
maskClosable={false}
|
||||
onCancel={this.doubleClear}
|
||||
footer={false}
|
||||
className="antd-modal-homescreen"
|
||||
>
|
||||
<div>
|
||||
<Form>
|
||||
<Row style={{ marginTop: "50px" }}>
|
||||
<Col span={5}>
|
||||
<Form.Item label={"名称"} {...formItemLayout}>
|
||||
<Input
|
||||
value={this.state.querySearch.searchName}
|
||||
placeholder={"请输入任务名称"}
|
||||
name="searchName"
|
||||
onChange={this.vauleChange}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<Form.Item label={"开始时间"} {...formItemLayout}>
|
||||
<RangePicker
|
||||
value={this.state.visibleStartTime}
|
||||
onChange={this.startChange}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<Form.Item label={"结束时间"} {...formItemLayout}>
|
||||
<RangePicker
|
||||
value={this.state.visibleEndTime}
|
||||
onChange={this.endChange}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={2}>
|
||||
<Button
|
||||
type={"primary"}
|
||||
icon={"search"}
|
||||
onClick={() =>
|
||||
this.handleSearch(this.state.currentpageIndex)
|
||||
}
|
||||
>
|
||||
搜索
|
||||
</Button>
|
||||
</Col>
|
||||
</Row>
|
||||
</Form>
|
||||
<Table
|
||||
// rowSelection={rowSelection}
|
||||
dataSource={this.state.workData}
|
||||
columns={this.state.searchColumns}
|
||||
onChange={(num) =>
|
||||
this.getBaseInfoData(num, this.state.currentpageIndex, null)
|
||||
}
|
||||
loading={this.state.showLoading}
|
||||
size="small"
|
||||
style={{padding: "0px 20px"}}
|
||||
/>
|
||||
</div>
|
||||
</Modal>
|
||||
<Modal
|
||||
visible={this.state.searchTodayVisible}
|
||||
title={this.state.visibleTitle}
|
||||
maskClosable={false}
|
||||
zIndex={999}
|
||||
onCancel={this.doubleClear}
|
||||
footer={false}
|
||||
className="antd-modal-homescreen"
|
||||
>
|
||||
<div>
|
||||
<Form>
|
||||
<Row style={{ marginTop: "50px" }}>
|
||||
<Col span={5}>
|
||||
<Form.Item label={"提醒内容"} {...formItemLayout}>
|
||||
<Input
|
||||
value={this.state.querySearch.searchName}
|
||||
placeholder={"请输入提醒内容"}
|
||||
name="searchName"
|
||||
onChange={this.vauleChange}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<Form.Item label={"开始时间"} {...formItemLayout}>
|
||||
<RangePicker
|
||||
value={this.state.visibleStartTime}
|
||||
// defaultValue={[moment(moment(this.state.querySearch.startTime1), "YYYY-MM-DD"), moment(moment(this.state.querySearch.startTime2), "YYYY-MM-DD")]}
|
||||
onChange={this.startChange}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={6}>
|
||||
<Form.Item label={"结束时间"} {...formItemLayout}>
|
||||
<RangePicker
|
||||
value={this.state.visibleEndTime}
|
||||
// defaultValue={[moment(moment(this.state.querySearch.startTime1), "YYYY-MM-DD"), moment(moment(this.state.querySearch.startTime2), "YYYY-MM-DD")]}
|
||||
onChange={this.endChange}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={3}>
|
||||
<Form.Item label={"状态"} {...formItemLayout}>
|
||||
<Select
|
||||
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="3">已读</Option>
|
||||
<Option value="1">已办</Option>
|
||||
</Select>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={2}>
|
||||
<Button
|
||||
type={"primary"}
|
||||
icon={"search"}
|
||||
onClick={() =>
|
||||
this.handleSearch(this.state.currentpageIndex)
|
||||
}
|
||||
>
|
||||
搜索
|
||||
</Button>
|
||||
</Col>
|
||||
</Row>
|
||||
</Form>
|
||||
<Table
|
||||
dataSource={this.state.workData}
|
||||
columns={this.state.searchColumns}
|
||||
onChange={(num) =>
|
||||
this.getBaseInfoData(num, this.state.currentpageIndex, null)
|
||||
}
|
||||
loading={this.state.showLoading}
|
||||
size="small"
|
||||
style={{padding: "0px 20px"}}
|
||||
/>
|
||||
</div>
|
||||
</Modal>
|
||||
|
||||
<Col span={24} style={{ width: "100%", height: "100%" }}>
|
||||
<Row
|
||||
@ -978,20 +1459,20 @@ class Home extends React.Component {
|
||||
padding: "0px 20px",
|
||||
margin: "0px",
|
||||
minHeight: "242px",
|
||||
minWidth: "1904px",
|
||||
minWidth: "1704px",
|
||||
// justifyContent: "space-between",
|
||||
// backgroundColor: "#fff",
|
||||
}}
|
||||
>
|
||||
<Col
|
||||
span={8}
|
||||
span={9}
|
||||
style={{
|
||||
backgroundColor: "#fff",
|
||||
height: "100%",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
padding: "0px 20px",
|
||||
borderRadius: "5px",
|
||||
borderRadius: "5px 0px 0px 5px",
|
||||
minWidth: "578px",
|
||||
}}
|
||||
>
|
||||
@ -1163,44 +1644,62 @@ class Home extends React.Component {
|
||||
data={this.state.workTotal.todoCount}
|
||||
title="待办事项"
|
||||
color="#2177d5"
|
||||
showAll={() => {
|
||||
this.showAll("1");
|
||||
}}
|
||||
/>
|
||||
<UserInfo
|
||||
data={this.state.workTotal.timeOverCount}
|
||||
title="待办超时"
|
||||
color="#f76707"
|
||||
showAll={() => {
|
||||
this.showAll("4");
|
||||
}}
|
||||
/>
|
||||
<UserInfo
|
||||
data={this.state.workTotal.doneCount}
|
||||
title="已办事项"
|
||||
color="#48a447"
|
||||
showAll={() => {
|
||||
this.showAll("2");
|
||||
}}
|
||||
/>
|
||||
<UserInfo
|
||||
data={this.state.workTotal.todayNewCount}
|
||||
title="今日提醒"
|
||||
color="#fcc419"
|
||||
showAll={() => {
|
||||
this.showAll("3");
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</Col>
|
||||
<div style={{ width: "30px" }}></div>
|
||||
{/* <div style={{ width: "30px" }}></div> */}
|
||||
|
||||
<Col
|
||||
span={9}
|
||||
span={8}
|
||||
style={{
|
||||
backgroundColor: "#fff",
|
||||
height: "100%",
|
||||
borderRadius: "5px",
|
||||
borderRadius: "0px 5px 5px 0px",
|
||||
padding: "0px",
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
flex: 1,
|
||||
}}
|
||||
>
|
||||
<Divider
|
||||
type="vertical"
|
||||
dashed={true}
|
||||
style={{ height: "100%", backgroundColor: "#fff" }}
|
||||
/>
|
||||
<div className="home-rate">
|
||||
<div className="home-always-title">
|
||||
{/* <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> */}
|
||||
<div style={{ flex: 1, height: "100%", padding: "0px" }}>
|
||||
<div
|
||||
id="completeRate"
|
||||
@ -1212,21 +1711,26 @@ class Home extends React.Component {
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
<Divider
|
||||
type="vertical"
|
||||
dashed={true}
|
||||
style={{ height: "100%" }}
|
||||
/>
|
||||
{/* <div
|
||||
style={{
|
||||
width: "20px",
|
||||
height: "100%",
|
||||
backgroundColor: "#f4f7ff",
|
||||
minWidth: "20px",
|
||||
}}
|
||||
></div>
|
||||
></div> */}
|
||||
<div className="home-rate">
|
||||
<div className="home-always-title">
|
||||
{/* <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> */}
|
||||
<div style={{ flex: 1, height: "100%", padding: "0px" }}>
|
||||
<div
|
||||
id="timelyRate"
|
||||
@ -1399,7 +1903,7 @@ class Home extends React.Component {
|
||||
justifyContent: "space-between",
|
||||
alignItems: "center",
|
||||
minHeight: "388px",
|
||||
minWidth: "1904px",
|
||||
minWidth: "1704px",
|
||||
// backgroundColor: "#fff",
|
||||
}}
|
||||
>
|
||||
@ -1413,7 +1917,7 @@ class Home extends React.Component {
|
||||
padding: "0px",
|
||||
borderRadius: "5px",
|
||||
flex: 1,
|
||||
minWidth: "1368px",
|
||||
minWidth: "1168px",
|
||||
}}
|
||||
>
|
||||
<div className="home-always-title">
|
||||
@ -1625,7 +2129,7 @@ class Home extends React.Component {
|
||||
style={{
|
||||
margin: "0px 0px 10px 0px",
|
||||
minHeight: "275px",
|
||||
minWidth: "1904px",
|
||||
minWidth: "1704px",
|
||||
}}
|
||||
>
|
||||
<Col
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-Width: "320px",
|
||||
min-Width: "220px",
|
||||
}
|
||||
:global(.home-userInfo-tabs) {
|
||||
background-color: #eefff8;
|
||||
@ -49,7 +49,7 @@
|
||||
white-space: nowrap;
|
||||
}
|
||||
:global(.home-userInfo-content) {
|
||||
font-size: 20px;
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
white-space: nowrap;
|
||||
/* margin-right: 20px; */
|
||||
@ -316,7 +316,7 @@ cursor: pointer;
|
||||
flex-direction: column;
|
||||
background-color: #fff;
|
||||
border-radius: 5px;
|
||||
min-width: 674px;
|
||||
min-width: 574px;
|
||||
}
|
||||
:global(.home-setting) {
|
||||
display: flex;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user