|
@@ -147,12 +147,7 @@ const SmartReport = () => {
|
|
}, []);
|
|
}, []);
|
|
|
|
|
|
const initData = () => {
|
|
const initData = () => {
|
|
- const legend = {
|
|
|
|
- orient: 'vertical',
|
|
|
|
- left: 'left',
|
|
|
|
- top: 'center',
|
|
|
|
- };
|
|
|
|
- const eqOption = getPieOption(data.eqData, legend);
|
|
|
|
|
|
+ const eqOption = getPieOption(data.eqData, true);
|
|
if (eqChartRef.current) eqChartRef.current.setOption(eqOption);
|
|
if (eqChartRef.current) eqChartRef.current.setOption(eqOption);
|
|
|
|
|
|
const taskOption = getPieOption(data.taskData);
|
|
const taskOption = getPieOption(data.taskData);
|
|
@@ -161,7 +156,7 @@ const SmartReport = () => {
|
|
const workOption = getPieOption(data.workOrderData);
|
|
const workOption = getPieOption(data.workOrderData);
|
|
if (workChartRef.current) workChartRef.current.setOption(workOption);
|
|
if (workChartRef.current) workChartRef.current.setOption(workOption);
|
|
|
|
|
|
- const workScoreOption = getPieOption(data.workScoreData, legend);
|
|
|
|
|
|
+ const workScoreOption = getPieOption(data.workScoreData, true);
|
|
if (workScoreChartRef.current)
|
|
if (workScoreChartRef.current)
|
|
workScoreChartRef.current.setOption(workScoreOption);
|
|
workScoreChartRef.current.setOption(workScoreOption);
|
|
};
|
|
};
|
|
@@ -467,7 +462,7 @@ const SmartReport = () => {
|
|
<div
|
|
<div
|
|
ref={taskDomRef}
|
|
ref={taskDomRef}
|
|
style={{
|
|
style={{
|
|
- height: '8rem',
|
|
|
|
|
|
+ height: '4rem',
|
|
width: '100%',
|
|
width: '100%',
|
|
marginTop: '0.2rem',
|
|
marginTop: '0.2rem',
|
|
}}
|
|
}}
|
|
@@ -478,7 +473,7 @@ const SmartReport = () => {
|
|
<div
|
|
<div
|
|
ref={workDomRef}
|
|
ref={workDomRef}
|
|
style={{
|
|
style={{
|
|
- height: '8rem',
|
|
|
|
|
|
+ height: '4rem',
|
|
width: '100%',
|
|
width: '100%',
|
|
marginTop: '0.2rem',
|
|
marginTop: '0.2rem',
|
|
}}
|
|
}}
|
|
@@ -507,7 +502,7 @@ const SmartReport = () => {
|
|
);
|
|
);
|
|
};
|
|
};
|
|
export default SmartReport;
|
|
export default SmartReport;
|
|
-const getPieOption = (chartData, legend = {}) => {
|
|
|
|
|
|
+const getPieOption = (chartData, isLeft = false) => {
|
|
const option = {
|
|
const option = {
|
|
color: [
|
|
color: [
|
|
'#5470c6',
|
|
'#5470c6',
|
|
@@ -523,21 +518,27 @@ const getPieOption = (chartData, legend = {}) => {
|
|
tooltip: {
|
|
tooltip: {
|
|
trigger: 'item',
|
|
trigger: 'item',
|
|
},
|
|
},
|
|
- legend: {
|
|
|
|
- orient: 'horizontal',
|
|
|
|
- // left: 'left',
|
|
|
|
- itemWidth: 10,
|
|
|
|
- itemHeight: 8,
|
|
|
|
- textStyle: {
|
|
|
|
- color: '#000000',
|
|
|
|
- fontSize: 12,
|
|
|
|
- },
|
|
|
|
- ...legend,
|
|
|
|
- },
|
|
|
|
|
|
+ legend: isLeft
|
|
|
|
+ ? {
|
|
|
|
+ orient: 'vertical',
|
|
|
|
+ left: 'left',
|
|
|
|
+ top: 'center',
|
|
|
|
+ }
|
|
|
|
+ : {
|
|
|
|
+ orient: 'horizontal',
|
|
|
|
+ // left: 'left',
|
|
|
|
+ itemWidth: 10,
|
|
|
|
+ itemHeight: 8,
|
|
|
|
+ textStyle: {
|
|
|
|
+ color: '#000000',
|
|
|
|
+ fontSize: 12,
|
|
|
|
+ },
|
|
|
|
+ },
|
|
series: [
|
|
series: [
|
|
{
|
|
{
|
|
type: 'pie',
|
|
type: 'pie',
|
|
- radius: '60%',
|
|
|
|
|
|
+ top: isLeft ? 0 : '10%',
|
|
|
|
+ radius: isLeft ? '60%' : '50%',
|
|
data: chartData,
|
|
data: chartData,
|
|
emphasis: {
|
|
emphasis: {
|
|
itemStyle: {
|
|
itemStyle: {
|