Compare commits
2 Commits
7990a63908
...
36ae04dbb5
Author | SHA1 | Date | |
---|---|---|---|
36ae04dbb5 | |||
03539d4144 |
Before Width: | Height: | Size: 383 KiB After Width: | Height: | Size: 385 KiB |
Before Width: | Height: | Size: 246 KiB After Width: | Height: | Size: 330 KiB |
Before Width: | Height: | Size: 386 KiB After Width: | Height: | Size: 304 KiB |
Before Width: | Height: | Size: 249 KiB After Width: | Height: | Size: 304 KiB |
Before Width: | Height: | Size: 341 KiB After Width: | Height: | Size: 334 KiB |
Before Width: | Height: | Size: 341 KiB After Width: | Height: | Size: 335 KiB |
Before Width: | Height: | Size: 345 KiB After Width: | Height: | Size: 339 KiB |
Before Width: | Height: | Size: 346 KiB After Width: | Height: | Size: 334 KiB |
Before Width: | Height: | Size: 248 KiB After Width: | Height: | Size: 297 KiB |
Before Width: | Height: | Size: 244 KiB After Width: | Height: | Size: 297 KiB |
Before Width: | Height: | Size: 248 KiB After Width: | Height: | Size: 332 KiB |
Before Width: | Height: | Size: 249 KiB After Width: | Height: | Size: 332 KiB |
@ -175,8 +175,8 @@
|
|||||||
></div>
|
></div>
|
||||||
<div
|
<div
|
||||||
style="font-family: 'BiaoTi';"
|
style="font-family: 'BiaoTi';"
|
||||||
@click="handleViewTendency(queryParams[0], titleMap[queryParams[0]], 'oip', '进油压力', 'Bar')"
|
@click="handleViewTendency(queryParams[0], titleMap[queryParams[0]], 'oip', '抽油泵压力', 'Bar')"
|
||||||
>进油压力</div>
|
>抽油泵压力</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="bottom-grid-item">
|
<div class="bottom-grid-item">
|
||||||
<div
|
<div
|
||||||
@ -185,13 +185,13 @@
|
|||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
class="extra-bar-item"
|
class="extra-bar-item"
|
||||||
:style="`height: ${parseInt(l1 * 100)}%;background-color:#6581f0;`"
|
:style="`height: ${parseInt(l1 )}%;background-color:#6581f0;`"
|
||||||
></div>
|
></div>
|
||||||
<div
|
<div
|
||||||
class="extra-bar-text"
|
class="extra-bar-text"
|
||||||
:style="`height: calc(100% - ${parseInt(l1 * 100)}%);`"
|
:style="`height: calc(100% - ${parseInt(l1)}%);`"
|
||||||
>
|
>
|
||||||
{{ parseInt(l1 * 100) }}
|
{{ parseInt(l1 ) }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
@ -270,13 +270,13 @@
|
|||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
class="extra-bar-item"
|
class="extra-bar-item"
|
||||||
:style="`height: ${parseInt(r2 * 100)}%;background-color:#6581f0;`"
|
:style="`height: ${parseInt(r2)}%;background-color:#6581f0;`"
|
||||||
></div>
|
></div>
|
||||||
<div
|
<div
|
||||||
class="extra-bar-text"
|
class="extra-bar-text"
|
||||||
:style="`height: calc(100% - ${parseInt(r2 * 100)}%);`"
|
:style="`height: calc(100% - ${parseInt(r2)}%);`"
|
||||||
>
|
>
|
||||||
{{ parseInt(r2 * 100) }}
|
{{ parseInt(r2) }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
@ -291,8 +291,8 @@
|
|||||||
></div>
|
></div>
|
||||||
<div
|
<div
|
||||||
style="font-family: 'BiaoTi';"
|
style="font-family: 'BiaoTi';"
|
||||||
@click="handleViewTendency(queryParams[1], titleMap[queryParams[1]], 'oip', '进油压力', 'Bar')"
|
@click="handleViewTendency(queryParams[1], titleMap[queryParams[1]], 'oip', '抽油泵压力', 'Bar')"
|
||||||
>进油压力</div>
|
>抽油泵压力</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="bottom-grid-item">
|
<div class="bottom-grid-item">
|
||||||
<div
|
<div
|
||||||
@ -814,7 +814,7 @@ export default {
|
|||||||
xAxis: {
|
xAxis: {
|
||||||
data: xAxis,
|
data: xAxis,
|
||||||
},
|
},
|
||||||
yAxis: { name: "单位: ㎛" },
|
yAxis: { name: "单位: m/s²" },
|
||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: "axis",
|
trigger: "axis",
|
||||||
axisPointer: {
|
axisPointer: {
|
||||||
@ -886,7 +886,7 @@ export default {
|
|||||||
xAxis: {
|
xAxis: {
|
||||||
data: xAxis,
|
data: xAxis,
|
||||||
},
|
},
|
||||||
yAxis: { name: "单位: ㎛" },
|
yAxis: { name: "单位: m/s²" },
|
||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: "axis",
|
trigger: "axis",
|
||||||
axisPointer: {
|
axisPointer: {
|
||||||
@ -1060,8 +1060,8 @@ export default {
|
|||||||
color: ["0ec6c4", "0ec6c4"],
|
color: ["0ec6c4", "0ec6c4"],
|
||||||
bgColor: "aef1f5",
|
bgColor: "aef1f5",
|
||||||
name: "",
|
name: "",
|
||||||
value: parseInt(owc * 100),
|
value: owc,
|
||||||
limit: 100,
|
limit: 20,
|
||||||
unit: "%",
|
unit: "%",
|
||||||
}),
|
}),
|
||||||
true,
|
true,
|
||||||
@ -1078,8 +1078,8 @@ export default {
|
|||||||
color: ["1860b1", "1860b1"],
|
color: ["1860b1", "1860b1"],
|
||||||
bgColor: "c2d6ec",
|
bgColor: "c2d6ec",
|
||||||
name: "",
|
name: "",
|
||||||
value: parseInt(ov * 100),
|
value: ov,
|
||||||
limit: 100,
|
limit: 800,
|
||||||
unit: "CP",
|
unit: "CP",
|
||||||
}),
|
}),
|
||||||
true,
|
true,
|
||||||
@ -1092,12 +1092,11 @@ export default {
|
|||||||
initBottomL3(oip = 0) {
|
initBottomL3(oip = 0) {
|
||||||
const chartIns = echarts.init(document.getElementById("bottomL3"));
|
const chartIns = echarts.init(document.getElementById("bottomL3"));
|
||||||
chartIns.setOption(
|
chartIns.setOption(
|
||||||
this.generateGaugeOption({
|
this.generateGaugeOption2({
|
||||||
color: ["f3c128", "f3c128"],
|
color: ["f3c128", "f3c128"],
|
||||||
bgColor: "f0eace",
|
bgColor: "f0eace",
|
||||||
name: "",
|
name: "",
|
||||||
value: parseInt(oip * 100),
|
value: oip,
|
||||||
limit: 100,
|
|
||||||
unit: "Bar",
|
unit: "Bar",
|
||||||
}),
|
}),
|
||||||
true,
|
true,
|
||||||
@ -1110,12 +1109,11 @@ export default {
|
|||||||
initBottomR1(oip = 0) {
|
initBottomR1(oip = 0) {
|
||||||
const chartIns = echarts.init(document.getElementById("bottomR1"));
|
const chartIns = echarts.init(document.getElementById("bottomR1"));
|
||||||
chartIns.setOption(
|
chartIns.setOption(
|
||||||
this.generateGaugeOption({
|
this.generateGaugeOption2({
|
||||||
color: ["f3c128", "f3c128"],
|
color: ["f3c128", "f3c128"],
|
||||||
bgColor: "f0eace",
|
bgColor: "f0eace",
|
||||||
name: "",
|
name: "",
|
||||||
value: parseInt(oip * 100),
|
value: oip ,
|
||||||
limit: 100,
|
|
||||||
unit: "Bar",
|
unit: "Bar",
|
||||||
}),
|
}),
|
||||||
true,
|
true,
|
||||||
@ -1132,8 +1130,8 @@ export default {
|
|||||||
color: ["1860b1", "1860b1"],
|
color: ["1860b1", "1860b1"],
|
||||||
bgColor: "c2d6ec",
|
bgColor: "c2d6ec",
|
||||||
name: "",
|
name: "",
|
||||||
value: parseInt(ov * 100),
|
value: ov,
|
||||||
limit: 100,
|
limit: 800,
|
||||||
unit: "CP",
|
unit: "CP",
|
||||||
}),
|
}),
|
||||||
true,
|
true,
|
||||||
@ -1150,8 +1148,8 @@ export default {
|
|||||||
color: ["0ec6c4", "0ec6c4"],
|
color: ["0ec6c4", "0ec6c4"],
|
||||||
bgColor: "aef1f5",
|
bgColor: "aef1f5",
|
||||||
name: "",
|
name: "",
|
||||||
value: parseInt(owc * 100),
|
value: owc,
|
||||||
limit: 100,
|
limit: 20,
|
||||||
unit: "%",
|
unit: "%",
|
||||||
}),
|
}),
|
||||||
true,
|
true,
|
||||||
@ -1276,6 +1274,121 @@ export default {
|
|||||||
}
|
}
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
generateGaugeOption2(
|
||||||
|
option = {
|
||||||
|
color: ["0DDF7A"],
|
||||||
|
bgColor: "fff",
|
||||||
|
name: "",
|
||||||
|
value: 0,
|
||||||
|
limit: 1,
|
||||||
|
}
|
||||||
|
) {
|
||||||
|
return merge(
|
||||||
|
{
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
type: "gauge",
|
||||||
|
center: ["50%", "60%"],
|
||||||
|
startAngle: 220,
|
||||||
|
endAngle: -40,
|
||||||
|
min: -1,
|
||||||
|
max: 1,
|
||||||
|
splitNumber: 12,
|
||||||
|
progress: {
|
||||||
|
show: true,
|
||||||
|
width: 20,
|
||||||
|
itemStyle: {
|
||||||
|
color: {
|
||||||
|
type: "linear",
|
||||||
|
x: 0.8,
|
||||||
|
y: 0,
|
||||||
|
x2: 0,
|
||||||
|
y2: 1,
|
||||||
|
colorStops: [
|
||||||
|
{
|
||||||
|
offset: 0,
|
||||||
|
color: "#" + option.color[1], // 0% 处的颜色
|
||||||
|
},
|
||||||
|
{
|
||||||
|
offset: 1,
|
||||||
|
color: "#" + option.color[0], // 100% 处的颜色
|
||||||
|
},
|
||||||
|
],
|
||||||
|
|
||||||
|
global: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
pointer: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
width: 20,
|
||||||
|
color: [[1, "#" + option.bgColor]],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
distance: -30,
|
||||||
|
splitNumber: 3,
|
||||||
|
lineStyle: {
|
||||||
|
width: 1,
|
||||||
|
color: "#" + option.color[0],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
distance: -40,
|
||||||
|
length: 10,
|
||||||
|
lineStyle: {
|
||||||
|
width: 2,
|
||||||
|
color: "#" + option.color[0],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
anchor: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
show: false,
|
||||||
|
fontSize: 16,
|
||||||
|
color: "#" + option.color[0],
|
||||||
|
offsetCenter: [0, "100%"],
|
||||||
|
},
|
||||||
|
detail: {
|
||||||
|
valueAnimation: true,
|
||||||
|
width: "60%",
|
||||||
|
offsetCenter: [0, 0],
|
||||||
|
formatter: "{back| {value} }\n{unit|" + option.unit + "}",
|
||||||
|
rich: {
|
||||||
|
back: {
|
||||||
|
fontSize: 20,
|
||||||
|
fontWeight: 700,
|
||||||
|
color: "#" + option.color[0],
|
||||||
|
},
|
||||||
|
unit: {
|
||||||
|
fontSize: 12,
|
||||||
|
fontWeight: 400,
|
||||||
|
color: "#" + option.color[0],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
value: option.value,
|
||||||
|
name: option.name,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{},
|
||||||
|
(objVal, srcVal) => {
|
||||||
|
if (isArray(objVal)) return srcVal;
|
||||||
|
}
|
||||||
|
);
|
||||||
|
},
|
||||||
generateOptions(option = {}) {
|
generateOptions(option = {}) {
|
||||||
return merge(
|
return merge(
|
||||||
{
|
{
|
||||||
|
@ -176,7 +176,7 @@
|
|||||||
show-overflow-tooltip
|
show-overflow-tooltip
|
||||||
/>
|
/>
|
||||||
<el-table-column
|
<el-table-column
|
||||||
label="进油压力"
|
label="抽油泵压力"
|
||||||
align="center"
|
align="center"
|
||||||
key="oip"
|
key="oip"
|
||||||
prop="oip"
|
prop="oip"
|
||||||
|
@ -451,7 +451,7 @@ export default {
|
|||||||
xAxis: {
|
xAxis: {
|
||||||
data: xAxis,
|
data: xAxis,
|
||||||
},
|
},
|
||||||
yAxis: { name: "单位: ㎛" },
|
yAxis: { name: "单位: m/s²" },
|
||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: "axis",
|
trigger: "axis",
|
||||||
axisPointer: {
|
axisPointer: {
|
||||||
|