Commit 2ac1643d authored by 沈翠玲's avatar 沈翠玲

修改bug

parent c1e3b8ac
...@@ -81,31 +81,54 @@ const formatOptions = (data: any) => { ...@@ -81,31 +81,54 @@ const formatOptions = (data: any) => {
}, },
], ],
grid: { grid: {
left: 82, left: 10,
bottom: 30, bottom: 30,
right: 40, right: 40,
}, },
legend: { legend: {
show: false show: false
}, },
yAxis: { yAxis: [{
type: 'category', type: 'category',
triggerEvent: true, triggerEvent: true,
data: [], data: [],
axisLabel: {
color: '#fff',
fontSize: 14,
formatter: function (value: string) {
return (value.length > 4 ? (value.slice(0,4)+"...") : value )
}
},
axisTick: { axisTick: {
show: false, show: false,
}, },
show: false,
axisLine: { axisLine: {
show: false, show: false,
}, },
}, },
{
type: "category",
axisLine: {
show: false,
},
axisTick: {
show: false,
},
axisLabel: {
show: true,
inside: false,
textStyle: {
color: "#fff",
fontSize: "14",
fontFamily: "PingFangSC-Regular",
},
formatter: function (val) {
return `${val}`;
},
},
splitArea: {
show: false,
},
splitLine: {
show: false,
},
data: [],
}
],
series: [], series: [],
}; };
if (data && data.length) { if (data && data.length) {
...@@ -114,13 +137,22 @@ const formatOptions = (data: any) => { ...@@ -114,13 +137,22 @@ const formatOptions = (data: any) => {
type: 'bar', type: 'bar',
barGap: 0, barGap: 0,
label: { label: {
show: true, normal: {
position: 'right', color: "#fff",
color: '#fff', show: true,
position: [0, "-14px"],
textStyle: {
fontSize: 17,
},
formatter: function (a) {
return a.name;
},
},
}, },
data: data.map((item: any) => item.ct), data: data.map((item: any) => item.ct),
}]; }];
option.yAxis.data = xAxisData; option.yAxis[0].data = xAxisData;
option.yAxis[1].data = data.map((item: any) => item.ct);
option.series = series; option.series = series;
} }
console.log('option', option) console.log('option', option)
...@@ -168,25 +200,11 @@ const Main: React.FC<ProcessOutProps> = ({ data, setting }) => { ...@@ -168,25 +200,11 @@ const Main: React.FC<ProcessOutProps> = ({ data, setting }) => {
const chart = getInstanceByDom(chartRef.current); const chart = getInstanceByDom(chartRef.current);
const option = formatOptions(data); const option = formatOptions(data);
chart?.setOption(option); chart?.setOption(option);
chart?.off('click');
chart?.on('click', (p) => {
if (p.seriesName === '完成量') {
console.log(setting.productionComprehensKanbanSettingId, '----');
setProcessParams({
dataRange: setting.dataRange,
processName: p.name,
current: 1,
pageSize: 10,
kanbanSettingId: setting.productionComprehensKanbanSettingId,
});
setIsModalOpen(true);
}
});
// 如果数据工序大于5那么需要自动轮训播放 // 如果数据工序大于5那么需要自动轮训播放
if (option.yAxis.data.length > 4 && setting.rowMovingTime > 0) { if (option.yAxis[0].data.length > 4 && setting.rowMovingTime > 0) {
timer = setInterval(() => { timer = setInterval(() => {
option.dataZoom[0].startValue++; option.dataZoom[0].startValue++;
if (option.dataZoom[0].endValue++ >= option.yAxis.data.length - 1) { if (option.dataZoom[0].endValue++ >= option.yAxis[0].data.length - 1) {
option.dataZoom[0].startValue = 0; option.dataZoom[0].startValue = 0;
option.dataZoom[0].endValue = 3; option.dataZoom[0].endValue = 3;
} }
......
...@@ -73,9 +73,9 @@ const formatOptions = (data: any) => { ...@@ -73,9 +73,9 @@ const formatOptions = (data: any) => {
}, },
], ],
grid: { grid: {
left: 70, left: 10,
bottom: 30, bottom: 30,
right: 40, right: 50,
}, },
legend: { legend: {
orient: 'vertical', orient: 'vertical',
...@@ -88,17 +88,11 @@ const formatOptions = (data: any) => { ...@@ -88,17 +88,11 @@ const formatOptions = (data: any) => {
fontSize: 14, fontSize: 14,
}, },
}, },
yAxis: { yAxis: [{
type: 'category', type: 'category',
triggerEvent: true, triggerEvent: true,
data: [], data: [],
axisLabel: { show: false,
color: '#fff',
fontSize: 14,
formatter: function (value: string) {
return (value.length > 4 ? (value.slice(0,4)+"...") : value )
}
},
axisTick: { axisTick: {
show: false, show: false,
}, },
...@@ -106,6 +100,35 @@ const formatOptions = (data: any) => { ...@@ -106,6 +100,35 @@ const formatOptions = (data: any) => {
show: false, show: false,
}, },
}, },
{
type: "category",
axisLine: {
show: false,
},
axisTick: {
show: false,
},
axisLabel: {
show: true,
inside: false,
textStyle: {
color: "#fff",
fontSize: "14",
fontFamily: "PingFangSC-Regular",
},
formatter: function (val) {
return `${val}%`;
},
},
splitArea: {
show: false,
},
splitLine: {
show: false,
},
data: [],
}
],
series: [], series: [],
}; };
if (data && data.length) { if (data && data.length) {
...@@ -119,15 +142,23 @@ const formatOptions = (data: any) => { ...@@ -119,15 +142,23 @@ const formatOptions = (data: any) => {
name: item.label, name: item.label,
barGap: 0, barGap: 0,
label: { label: {
show: true, normal: {
position: 'right', color: "#fff",
color: '#fff', show: true,
formatter: '{c}%', position: [0, "-14px"],
textStyle: {
fontSize: 17,
},
formatter: function (a) {
return a.name;
},
},
}, },
data: data.map((v) => v[item.field]), data: data.map((v) => v[item.field]),
}; };
}); });
option.yAxis.data = xAxisData; option.yAxis[0].data = xAxisData;
option.yAxis[1].data = data.map((v) => v['qualifiedRate']);
option.series = series; option.series = series;
} }
return option; return option;
...@@ -199,10 +230,10 @@ const Main: React.FC<ProcessFailProps> = ({ data, setting }) => { ...@@ -199,10 +230,10 @@ const Main: React.FC<ProcessFailProps> = ({ data, setting }) => {
} }
}); });
// 如果数据工序大于5那么需要自动轮训播放 // 如果数据工序大于5那么需要自动轮训播放
if (option.yAxis.data.length > 4 && setting.rowMovingTime > 0) { if (option.yAxis[0].data.length > 4 && setting.rowMovingTime > 0) {
timer = setInterval(() => { timer = setInterval(() => {
option.dataZoom[0].startValue++; option.dataZoom[0].startValue++;
if (option.dataZoom[0].endValue++ >= option.yAxis.data.length - 1) { if (option.dataZoom[0].endValue++ >= option.yAxis[0].data.length - 1) {
option.dataZoom[0].startValue = 0; option.dataZoom[0].startValue = 0;
option.dataZoom[0].endValue = 3; option.dataZoom[0].endValue = 3;
} }
......
...@@ -80,6 +80,8 @@ const formatOptions = (data: any) => { ...@@ -80,6 +80,8 @@ const formatOptions = (data: any) => {
interval: 0, interval: 0,
color: '#fff', color: '#fff',
fontSize: 14, fontSize: 14,
width: 120,
overflow: 'breakAll'
}, },
axisTick: { axisTick: {
show: false, show: false,
...@@ -99,7 +101,7 @@ const formatOptions = (data: any) => { ...@@ -99,7 +101,7 @@ const formatOptions = (data: any) => {
grid: { grid: {
left: 5, left: 5,
// right: 60, // right: 60,
bottom: 30, bottom: 40,
}, },
legend: { legend: {
orient: 'vertical', orient: 'vertical',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment