修改
This commit is contained in:
wjn
parent
3ccab42b68
commit
719d548f3b
@ -58,20 +58,17 @@ class BI014RiskPerformanceModel extends React.Component {
|
||||
{ DATE: "2024-12-31 23:59:59", COUNT: 116, TYPE: 1 },
|
||||
{ DATE: "2024-12-31 23:59:59", COUNT: 1154, TYPE: 0 },
|
||||
],
|
||||
CHART11:
|
||||
CHARTFXDJ1:
|
||||
{
|
||||
NAME: ["一级", "二级", "三级", "四级"],
|
||||
LEVEL1: [3, 8, 181, 1112],
|
||||
LEVEL2: [8],
|
||||
LEVEL3: [181],
|
||||
LEVEL4: [1112],
|
||||
}
|
||||
,
|
||||
CHART12: [
|
||||
{ name: "露天矿", value: 3 },
|
||||
{ name: "选矿厂", value: 8 },
|
||||
{ name: "尾矿库", value: 181 },
|
||||
{ name: "职能部门", value: 1112 },
|
||||
CHARTFXDJ2: [
|
||||
{ name: "一级", value: 3 },
|
||||
{ name: "二级", value: 8 },
|
||||
{ name: "三级", value: 181 },
|
||||
{ name: "四级", value: 1112 },
|
||||
],
|
||||
CHARTLIST: [
|
||||
{
|
||||
@ -172,11 +169,11 @@ class BI014RiskPerformanceModel extends React.Component {
|
||||
LEVEL4: [18, 33, 43, 21, 27],
|
||||
},
|
||||
{
|
||||
NAME: ["破碎一班", "破碎二班", "破碎三班", "磨重一班", "磨重二班", "磨重三班"],
|
||||
LEVEL1: [0, 0, 0, 0, 0, 0],
|
||||
LEVEL2: [0, 0, 0, 0, 1, 1],
|
||||
LEVEL3: [1, 3, 7, 22, 43, 1],
|
||||
LEVEL4: [7, 26, 8, 18, 21, 24],
|
||||
NAME: ["破碎车间", "磨重车间", "破碎一班", "破碎二班", "破碎三班", "磨重一班", "磨重二班", "磨重三班"],
|
||||
LEVEL1: [1, 3, 0, 0, 0, 0, 0, 0],
|
||||
LEVEL2: [2, 4, 0, 0, 0, 0, 1, 1],
|
||||
LEVEL3: [3, 5, 1, 3, 7, 22, 43, 1],
|
||||
LEVEL4: [4, 6, 7, 26, 8, 18, 21, 24],
|
||||
},
|
||||
{
|
||||
NAME: ["尾矿一班", "尾矿二班", "尾矿三班", "尾矿机修班"],
|
||||
@ -253,6 +250,17 @@ class BI014RiskPerformanceModel extends React.Component {
|
||||
LEVEL4: [70, 65, 54, 48, 33, 27, 16, 7]
|
||||
},
|
||||
],
|
||||
CHARTZYRW1:
|
||||
{
|
||||
NAME: ["一般任务", "关键任务", "许可作业"],
|
||||
LEVEL1: [67, 81, 91],
|
||||
}
|
||||
,
|
||||
CHARTZYRW2: [
|
||||
{ name: "一般任务", value: 67 },
|
||||
{ name: "关键任务", value: 81 },
|
||||
{ name: "许可作业", value: 91 },
|
||||
],
|
||||
},
|
||||
TotalCount: 0,
|
||||
MessageType: 0,
|
||||
@ -276,28 +284,28 @@ class BI014RiskPerformanceModel extends React.Component {
|
||||
onlyData: false,
|
||||
onComplete: (ret) => {
|
||||
this.chart4(ret?.Data.DATECOUNTS);
|
||||
this.chartFXDJ1(ret?.Data.CHART11);
|
||||
this.chartFXDJ2(ret?.Data.CHART12);
|
||||
this.chartFXDJ1(ret?.Data.CHARTFXDJ1);
|
||||
this.chartFXDJ2(ret?.Data.CHARTFXDJ2);
|
||||
this.chartSCDY(ret?.Data.CHARTLIST[0]);
|
||||
this.chartFXLB3(ret?.Data.CHARTLIST[1]);
|
||||
this.chartFXLB1(ret?.Data.CHARTLIST[1]);
|
||||
this.chartZRDW(ret?.Data.CHARTLIST[2]);
|
||||
this.chartCJ(ret?.Data.CHARTLIST[3]);
|
||||
|
||||
this.chartZYRW1(this.state.ret.Data.CHARTZYRW1);
|
||||
this.chartZYRW2(this.state.ret.Data.CHARTZYRW2);
|
||||
},
|
||||
});
|
||||
};
|
||||
getBaseInfoData = (mineType) => {
|
||||
this.chart4(this.state.ret.Data.DATECOUNTS);
|
||||
this.chartFXDJ1(this.state.ret.Data.CHART11);
|
||||
this.chartFXDJ2(this.state.ret.Data.CHART12);
|
||||
this.chartFXDJ1(this.state.ret.Data.CHARTFXDJ1);
|
||||
this.chartFXDJ2(this.state.ret.Data.CHARTFXDJ2);
|
||||
this.chartSCDY(this.state.ret.Data.CHARTLIST[0]);
|
||||
//this.chartFXLB3(this.state.ret.Data.CHARTLIST[1]);
|
||||
this.chartFXLB1(this.state.ret.Data.CHARTLIST[1]);
|
||||
this.chartCJ(this.state.ret.Data.CHARTLIST[3]);
|
||||
this.chartZRDW(this.state.ret.Data.CHARTLIST[2]);
|
||||
this.chartQY(this.state.ret.Data.CHARTLIST[4]);
|
||||
|
||||
this.chartZYRW1(this.state.ret.Data.CHARTZYRW1);
|
||||
this.chartZYRW2(this.state.ret.Data.CHARTZYRW2);
|
||||
};
|
||||
chart4 = (data) => {
|
||||
let riskArr = [];
|
||||
@ -504,10 +512,6 @@ class BI014RiskPerformanceModel extends React.Component {
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
left: "3%",
|
||||
right: "3%",
|
||||
bottom: "12%",
|
||||
top: "10%",
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: [
|
||||
@ -540,8 +544,18 @@ class BI014RiskPerformanceModel extends React.Component {
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
barWidth: 30
|
||||
barWidth: 30,
|
||||
label: {
|
||||
normal: {
|
||||
show: true,
|
||||
position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置
|
||||
formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数
|
||||
textStyle: {
|
||||
fontSize: 12, // 字体大小
|
||||
color: '#333', // 字体颜色
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
@ -558,12 +572,12 @@ class BI014RiskPerformanceModel extends React.Component {
|
||||
{
|
||||
tooltip: {
|
||||
trigger: "item",
|
||||
formatter: "{b} : {c} ({d}%)",
|
||||
formatter: "{b} : ({d}%)",
|
||||
},
|
||||
legend: {
|
||||
left: "0%",
|
||||
bottom: "10%",
|
||||
data: ["露天矿", "选矿厂", "尾矿库", "职能部门"],
|
||||
|
||||
data: ["一级", "二级", "三级", "四级"],
|
||||
},
|
||||
series: [
|
||||
{
|
||||
@ -571,13 +585,31 @@ class BI014RiskPerformanceModel extends React.Component {
|
||||
radius: '55%',
|
||||
center: ["50%", "45%"],
|
||||
data: Data,
|
||||
itemStyle: {
|
||||
color: function (params) {
|
||||
switch (params.dataIndex) {
|
||||
case 0:
|
||||
return "#c02e30"; // 第一个柱子颜色
|
||||
case 1:
|
||||
return "#f7aa52"; // 第二个柱子颜色
|
||||
case 2:
|
||||
return "#fbe06a"; // 第三个柱子颜色
|
||||
case 3:
|
||||
return "#5185f3"; // 第四个柱子颜色
|
||||
}
|
||||
}
|
||||
},
|
||||
emphasis: {
|
||||
itemStyle: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
}
|
||||
}
|
||||
},
|
||||
label: {
|
||||
show: true, // 开启标签显示
|
||||
formatter: '{d}%', // 格式化标签文本，仅显示数值
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
@ -705,105 +737,7 @@ class BI014RiskPerformanceModel extends React.Component {
|
||||
true
|
||||
);
|
||||
};
|
||||
chartFXLB3 = (Data) => {
|
||||
let chartFXLB3 = document.getElementById("chartFXLB3");
|
||||
let myChart = echarts.init(chartFXLB3);
|
||||
myChart.setOption(
|
||||
{
|
||||
// title: {
|
||||
// text: "风险类别(等级)",
|
||||
// left: "center",
|
||||
// },
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
axisPointer: {
|
||||
// 坐标轴指示器，坐标轴触发有效
|
||||
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
left: "center",
|
||||
align: "left",
|
||||
bottom: "2%",
|
||||
textStyle: {
|
||||
color: "#000",
|
||||
},
|
||||
itemWidth: 10,
|
||||
itemHeight: 10,
|
||||
data: ["一级", "二级", "三级", "四级"],
|
||||
},
|
||||
grid: {
|
||||
left: "3%",
|
||||
right: "5%",
|
||||
bottom: "12%",
|
||||
top: "10%",
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
type: "category",
|
||||
data: Data.NAME.slice(0, 10),
|
||||
axisLabel: {
|
||||
interval: 0,
|
||||
rotate: 20,
|
||||
formatter: function (value) {
|
||||
return value
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: "value",
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: "一级",
|
||||
type: "bar",
|
||||
stack: "总量",
|
||||
label: {
|
||||
show: true,
|
||||
position: "insideRight",
|
||||
},
|
||||
data: Data.LEVEL1.slice(0, 10),
|
||||
itemStyle: { color: this.state.level1Color },
|
||||
barWidth: 30
|
||||
},
|
||||
{
|
||||
name: "二级",
|
||||
type: "bar",
|
||||
stack: "总量",
|
||||
label: {
|
||||
show: true,
|
||||
position: "insideRight",
|
||||
},
|
||||
data: Data.LEVEL2.slice(0, 10),
|
||||
itemStyle: { color: this.state.level2Color },
|
||||
},
|
||||
{
|
||||
name: "三级",
|
||||
type: "bar",
|
||||
stack: "总量",
|
||||
label: {
|
||||
show: true,
|
||||
position: "insideRight",
|
||||
},
|
||||
data: Data.LEVEL3.slice(0, 10),
|
||||
itemStyle: { color: this.state.level3Color },
|
||||
},
|
||||
{
|
||||
name: "四级",
|
||||
type: "bar",
|
||||
stack: "总量",
|
||||
label: {
|
||||
show: true,
|
||||
position: "insideRight",
|
||||
},
|
||||
data: Data.LEVEL4.slice(0, 10),
|
||||
itemStyle: { color: this.state.level4Color },
|
||||
},
|
||||
],
|
||||
},
|
||||
true
|
||||
);
|
||||
};
|
||||
|
||||
chartFXLB1 = (Data) => {
|
||||
let chartFXLB1 = document.getElementById("chartFXLB1");
|
||||
let myChart = echarts.init(chartFXLB1);
|
||||
@ -1209,6 +1143,125 @@ class BI014RiskPerformanceModel extends React.Component {
|
||||
);
|
||||
}
|
||||
};
|
||||
chartZYRW1 = (Data) => {
|
||||
let chartZYRW1 = document.getElementById("chartZYRW1");
|
||||
if (chartZYRW1) {
|
||||
let myChart = echarts.init(chartZYRW1);
|
||||
myChart.setOption(
|
||||
{
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
axisPointer: {
|
||||
// 坐标轴指示器，坐标轴触发有效
|
||||
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: "category",
|
||||
data: Data.NAME,
|
||||
},
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: "value",
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: "一级",
|
||||
type: "bar",
|
||||
data: Data.LEVEL1,
|
||||
itemStyle: {
|
||||
color: function (params) {
|
||||
switch (params.dataIndex) {
|
||||
case 0:
|
||||
return "#c02e30"; // 第一个柱子颜色
|
||||
case 1:
|
||||
return "#f7aa52"; // 第二个柱子颜色
|
||||
case 2:
|
||||
return "#fbe06a"; // 第三个柱子颜色
|
||||
case 3:
|
||||
return "#5185f3"; // 第四个柱子颜色
|
||||
}
|
||||
}
|
||||
},
|
||||
barWidth: 30,
|
||||
label: {
|
||||
normal: {
|
||||
show: true,
|
||||
position: 'top', // 或者 'inside'（内部）、'insideLeft'、'insideRight' 等其他位置
|
||||
formatter: '{c}', // 使用变量 {c} 表示数值，也可以自定义格式化函数
|
||||
textStyle: {
|
||||
fontSize: 12, // 字体大小
|
||||
color: '#333', // 字体颜色
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
true
|
||||
);
|
||||
}
|
||||
};
|
||||
chartZYRW2 = (Data) => {
|
||||
let that = this;
|
||||
let chartZYRW2 = document.getElementById("chartZYRW2");
|
||||
if (chartZYRW2) {
|
||||
let myChart = echarts.init(chartZYRW2);
|
||||
myChart.setOption(
|
||||
{
|
||||
tooltip: {
|
||||
trigger: "item",
|
||||
formatter: "{b} : ({d}%)",
|
||||
},
|
||||
legend: {
|
||||
left: "0%",
|
||||
bottom: "10%",
|
||||
data: ["一般任务", "关键任务", "许可作业"],
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: "pie",
|
||||
radius: '55%',
|
||||
center: ["50%", "45%"],
|
||||
data: Data,
|
||||
itemStyle: {
|
||||
color: function (params) {
|
||||
switch (params.dataIndex) {
|
||||
case 0:
|
||||
return "#c02e30"; // 第一个柱子颜色
|
||||
case 1:
|
||||
return "#f7aa52"; // 第二个柱子颜色
|
||||
case 2:
|
||||
return "#fbe06a"; // 第三个柱子颜色
|
||||
case 3:
|
||||
return "#5185f3"; // 第四个柱子颜色
|
||||
}
|
||||
}
|
||||
},
|
||||
emphasis: {
|
||||
itemStyle: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
}
|
||||
},
|
||||
label: {
|
||||
show: true, // 开启标签显示
|
||||
formatter: '{d}%', // 格式化标签文本，仅显示数值
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
true
|
||||
);
|
||||
}
|
||||
};
|
||||
subtractRandomNotLessThanSelf = (obj) => {
|
||||
function getRandomNotLessThan(num) {
|
||||
return Math.floor(Math.random() * num);
|
||||
@ -2006,10 +2059,10 @@ class BI014RiskPerformanceModel extends React.Component {
|
||||
<Row gutter={12} style={{ marginTop: "5px" }}>
|
||||
<Col span={12}>
|
||||
<div id="chart21" style={{ width: "500px", height: "300px", flex: 1 }}></div>
|
||||
<div id="chart22" style={{ width: "500px", height: "300px", flex: 1 }}></div>
|
||||
<div id="chart23" style={{ width: "500px", height: "300px", flex: 1 }}></div>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<div id="chart23" style={{ width: "500px", height: "300px", flex: 1 }}></div>
|
||||
<div id="chart22" style={{ width: "500px", height: "300px", flex: 1 }}></div>
|
||||
<div id="chart24" style={{ width: "500px", height: "300px", flex: 1 }}></div>
|
||||
</Col>
|
||||
</Row>
|
||||
@ -2144,23 +2197,16 @@ class BI014RiskPerformanceModel extends React.Component {
|
||||
</div>
|
||||
</Col>
|
||||
<Col span={1}></Col>
|
||||
{/* <Col span={11} className="risk-model-col" style={{ padding: 0 }}>
|
||||
<Col span={11} className="risk-model-col" style={{ padding: 0 }}>
|
||||
<div className="home-always-title">
|
||||
<div className="home-always-left">
|
||||
<div className="home-always-badge"></div>
|
||||
<div className="home-always-name">风险类别</div>
|
||||
</div>
|
||||
<div type="primary" onClick={() => this.showDetailModal("风险类别1")}>
|
||||
<IconFont
|
||||
type="icon-24gl-expand2"
|
||||
className="home-always-icon"
|
||||
></IconFont>
|
||||
<div className="home-always-name">作业任务</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="risk-chart" style={{ height: "330px" }}>
|
||||
<div id="chartFXLB3" style={{ width: "100%", flex: 1 }}></div>
|
||||
</div>
|
||||
</Col> */}
|
||||
<div id="chartZYRW1" style={{ width: "45%", height: "330px", float: "left" }}></div>
|
||||
<div id="chartZYRW2" style={{ width: "45%", height: "330px", float: "left" }}></div>
|
||||
</Col>
|
||||
<Col span={1}></Col>
|
||||
</Row>
|
||||
<br />
|
||||
|
||||
Loading…
Reference in New Issue
Block a user