Compare commits
4 Commits
79aceb1e01
...
3492bcff3c
| Author | SHA1 | Date |
|---|---|---|
|
|
3492bcff3c | |
|
|
a1143b9260 | |
|
|
f6651f9d68 | |
|
|
f296c3c785 |
|
|
@ -96,7 +96,7 @@ const onExport = () => {
|
||||||
<div className='time-line-item'>
|
<div className='time-line-item'>
|
||||||
<div style={{width:100}}>
|
<div style={{width:100}}>
|
||||||
<span>{item.eventsDate}</span>
|
<span>{item.eventsDate}</span>
|
||||||
<div className='dsj'>大事记</div>
|
<div className='dsj'>{item.typeName}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className='item-right'>
|
<div className='item-right'>
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
import React, { useEffect, useState } from 'react';
|
import React, { useEffect, useState } from 'react';
|
||||||
import { Form, Input, Button, DatePicker } from 'antd';
|
import { Form, Select, Button, DatePicker } from 'antd';
|
||||||
|
|
||||||
import moment from 'moment';
|
import moment from 'moment';
|
||||||
const { RangePicker } = DatePicker;
|
const { RangePicker } = DatePicker;
|
||||||
|
|
@ -25,8 +25,10 @@ const ToolBar = ({ setSearchVal, onExport, storeData, role }) => {
|
||||||
<>
|
<>
|
||||||
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
|
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
|
||||||
<Form form={form} className='toolbarBox' layout="inline" onFinish={onFinish}>
|
<Form form={form} className='toolbarBox' layout="inline" onFinish={onFinish}>
|
||||||
<Form.Item label="名称" name="name">
|
<Form.Item label="类型" name="types">
|
||||||
<Input allowClear style={{ width: '150px' }} />
|
<Select options={[
|
||||||
|
{value:1,label:'大事记'}, {value:2,label:'调度指令'}, {value:3,label:'维修养护'},{value:4,label:'安全鉴定'}, {value:5,label:"除险加固"}, {value:6,label:'白蚁普查'}
|
||||||
|
]} allowClear mode='tags' style={{ width: "400px" }}/>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
<Form.Item label="发生日期" name="tm">
|
<Form.Item label="发生日期" name="tm">
|
||||||
<RangePicker
|
<RangePicker
|
||||||
|
|
|
||||||
|
|
@ -36,17 +36,30 @@ const Page = ({ title = '标题' }) => {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
series: {
|
series: {
|
||||||
name: '圆环图系列名称',
|
name: '执行情况',
|
||||||
type: 'pie',
|
type: 'pie',
|
||||||
// center: ['50%', '50%'],
|
// center: ['50%', '50%'],
|
||||||
// radius: ['35%', '50%'],
|
// radius: ['35%', '50%'],
|
||||||
hoverAnimation: true,
|
// hoverAnimation: true,
|
||||||
data: plandata,
|
data: plandata,
|
||||||
label: {
|
label: {
|
||||||
normal: {
|
normal: {
|
||||||
show: true,
|
show: true,
|
||||||
position: 'outside',
|
position: 'outside',
|
||||||
formatter: '{c}'
|
formatter: '{c}',
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
itemStyle:{
|
||||||
|
color: function (colors) {
|
||||||
|
var colorList = [
|
||||||
|
'#5b8ff9',
|
||||||
|
'#5ad8a6',
|
||||||
|
'#5d7092',
|
||||||
|
'#f6bd16',
|
||||||
|
'#6f5ef9',
|
||||||
|
];
|
||||||
|
return colorList[colors.dataIndex];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -49,17 +49,29 @@ const Page = ({ title = '标题' }) => {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
series: {
|
series: {
|
||||||
name: '圆环图系列名称',
|
name: '案件来源',
|
||||||
type: 'pie',
|
type: 'pie',
|
||||||
center: ['50%', '50%'],
|
center: ['50%', '50%'],
|
||||||
radius: ['60%', '80%'],
|
radius: ['60%', '80%'],
|
||||||
hoverAnimation: true,
|
// hoverAnimation: true,
|
||||||
data: plandata,
|
data: plandata,
|
||||||
label: {
|
label: {
|
||||||
normal: {
|
normal: {
|
||||||
show: true,
|
show: true,
|
||||||
position: 'outside',
|
position: 'outside',
|
||||||
formatter: '{c}'
|
formatter: '{c}',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
itemStyle:{
|
||||||
|
color: function (colors) {
|
||||||
|
var colorList = [
|
||||||
|
'#5b8ff9',
|
||||||
|
'#5ad8a6',
|
||||||
|
'#5d7092',
|
||||||
|
'#f6bd16',
|
||||||
|
'#6f5ef9',
|
||||||
|
];
|
||||||
|
return colorList[colors.dataIndex];
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -23,79 +23,48 @@ const Page = ({ title = '标题' }) => {
|
||||||
const [sumTotal, setSum] = useState(0)
|
const [sumTotal, setSum] = useState(0)
|
||||||
|
|
||||||
const getPlanOption = useMemo((name, data) => {
|
const getPlanOption = useMemo((name, data) => {
|
||||||
// let total = 0
|
|
||||||
// for (let i = 0; i < data.length; i++) {
|
|
||||||
// total = total + Number(data[i].value)
|
|
||||||
// }
|
|
||||||
return {
|
return {
|
||||||
legend: {
|
legend: {
|
||||||
data: Object.values(obj)
|
data: Object.values(obj),
|
||||||
|
type: 'scroll'
|
||||||
},
|
},
|
||||||
angleAxis: {
|
tooltip: {},
|
||||||
type: 'category',
|
polar: {
|
||||||
data: Object.values(obj)
|
radius: [0, '80%']
|
||||||
},
|
},
|
||||||
// radar: [
|
|
||||||
// {
|
|
||||||
// indicator: [
|
|
||||||
// { text: '' },
|
|
||||||
// { text: '' },
|
|
||||||
// { text: '' },
|
|
||||||
// { text: '' },
|
|
||||||
// { text: '' },
|
|
||||||
// { text: '' },
|
|
||||||
// { text: '' },
|
|
||||||
// ],
|
|
||||||
// radius: '80%',
|
|
||||||
// splitNumber: 12,
|
|
||||||
// shape: 'circle',
|
|
||||||
// splitArea: {
|
|
||||||
// areaStyle: {
|
|
||||||
// color: '#fff',
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// axisLine: {
|
|
||||||
// lineStyle: {
|
|
||||||
// color: '#d4d4d4'
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
// ],
|
|
||||||
radiusAxis: {
|
radiusAxis: {
|
||||||
min: 0,
|
min: 0,
|
||||||
max: 20,
|
max: Math.max.apply(null, Object.values(plandata)),
|
||||||
interval: 2,
|
|
||||||
// 刻度
|
|
||||||
axisTick: {
|
|
||||||
show: false
|
|
||||||
},
|
|
||||||
//刻度数值
|
|
||||||
axisLabel: {
|
|
||||||
show: false
|
|
||||||
},
|
|
||||||
// 线
|
|
||||||
axisLine:{
|
axisLine:{
|
||||||
show:false
|
show:false
|
||||||
},
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
angleAxis: {
|
||||||
|
type: 'category',
|
||||||
|
data: Object.values(obj),
|
||||||
|
// startAngle: 75,
|
||||||
},
|
},
|
||||||
polar: {},
|
|
||||||
series: [
|
series: [
|
||||||
{
|
{
|
||||||
stack: 'a',
|
name: '案件类型',
|
||||||
type: 'pie',
|
type: 'bar',
|
||||||
center: ['50%', '50%'],
|
coordinateSystem: 'polar',
|
||||||
selectedOffset: 0,
|
itemStyle: {
|
||||||
radius: [0, 140],
|
|
||||||
roseType: 'area',
|
|
||||||
itemStyle: { //去除饼图的指示折线label
|
|
||||||
normal: {
|
normal: {
|
||||||
label: {
|
color: function (colors) {
|
||||||
show: false,
|
var colorList = [
|
||||||
},
|
'#5b8ff9',
|
||||||
borderRadius: 8
|
'#5ad8a6',
|
||||||
|
'#5d7092',
|
||||||
|
'#f6bd16',
|
||||||
|
'#6f5ef9',
|
||||||
|
];
|
||||||
|
return colorList[colors.dataIndex];
|
||||||
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
data: plandata
|
data: Object.values(plandata)
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue