feat: tkx 增加柱状图

This commit is contained in:
zty 2024-12-03 11:44:50 +08:00
parent 6cb44c71ec
commit 4db4a87d99
8 changed files with 134 additions and 22 deletions

View File

@ -1021,7 +1021,7 @@ const routes = [
meta: { meta: {
title: "水报表", title: "水报表",
// icon: "el-icon-grid", // icon: "el-icon-grid",
perms: ["hour_base"], perms: ["water_base"],
}, },
component: "enm_energy/water", component: "enm_energy/water",
}, },

View File

@ -42,12 +42,27 @@
</el-table-column> </el-table-column>
<el-table-column label="生产厂" prop="factory" show-overflow-tooltip> <el-table-column label="生产厂" prop="factory" show-overflow-tooltip>
</el-table-column> </el-table-column>
<el-table-column label="设备重要性" prop="importance"> <el-table-column label="设备重要性">
<template #default="scope">
<el-tag v-if="scope.row.importance === 10" type="A">
{{ importance_[scope.row.importance] }}
</el-tag>
<el-tag v-else-if="scope.row.importance === 20" type="B">
{{ importance_[scope.row.importance] }}
</el-tag>
<el-tag v-else-if="scope.row.importance === 30" type="C">
{{ importance_[scope.row.importance] }}
</el-tag>
</template>
</el-table-column> </el-table-column>
<el-table-column label="购置日期" prop="buy_date"> <el-table-column label="购置日期" prop="buy_date">
</el-table-column> </el-table-column>
<el-table-column label="工段运行" prop="indicate_mgroup_running">
</el-table-column>
<el-table-column label="设备负责人" prop="device_people" show-overflow-tooltip> <el-table-column label="设备负责人" prop="device_people" show-overflow-tooltip>
</el-table-column> </el-table-column>
<el-table-column label="更新时间" prop="update_time"></el-table-column> <el-table-column label="更新时间" prop="update_time"></el-table-column>
<el-table-column label="状态"> <el-table-column label="状态">
<template #default="scope"> <template #default="scope">
@ -243,6 +258,11 @@ export default {
30: '在修', 30: '在修',
40: '禁用', 40: '禁用',
}, },
importance_: {
10: 'A',
20: 'B',
30: 'C',
},
groupsProps: { groupsProps: {
// value: "id", // value: "id",
multiple: false, multiple: false,

View File

@ -28,7 +28,7 @@
<el-input v-model="form.number" placeholder="设备位号" /> <el-input v-model="form.number" placeholder="设备位号" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :md="12" :sm="24" v-if="form.type == 10"> <el-col :md="12" :sm="24" v-if="form.type == 10" v-auth="['equipment.running']">
<el-form-item <el-form-item
label="表明工段运行的方式" label="表明工段运行的方式"
label-width="160" label-width="160"

View File

@ -175,6 +175,11 @@
prop="material_name" prop="material_name"
width="100" width="100"
></el-table-column> ></el-table-column>
<el-table-column
label="计算系数"
prop="coefficient"
width="100"
></el-table-column>
<el-table-column <el-table-column
label="所属工段" label="所属工段"
prop="mgroup_name" prop="mgroup_name"

View File

@ -53,19 +53,12 @@
></el-table-column> ></el-table-column>
<el-table-column label="开启能源监测" min-width="100"> <el-table-column label="开启能源监测" min-width="100">
<template #default="scope"> <template #default="scope">
<el-icon v-if="scope.row.need_enm" color="green" <span v-if="scope.row.need_enm" style="color: green"></span>
><CircleCheckFilled
/></el-icon>
<el-icon v-else color="red"
><CircleCloseFilled
/></el-icon>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="是否正在运行" min-width="100"> <el-table-column label="是否正在运行" min-width="100">
<template #default="scope"> <template #default="scope">
<el-icon v-if="scope.row.is_running" color="green" <span v-if="scope.row.is_running" style="color: green"></span>
><CircleCheckFilled
/></el-icon>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column

View File

@ -52,15 +52,100 @@
</table> </table>
</div> </div>
</el-card> </el-card>
<div class="chartWrap">
<div class="chartTitle">本年工业总产值</div>
<scEcharts
height="400px"
width="1033px"
:option="optionMonth"
></scEcharts>
</div>
</div> </div>
</template> </template>
<script> <script>
import scEcharts from "@/components/scEcharts";
import { defineAsyncComponent } from "vue";
const colors = ["#647bfe", "#cbd3fe", "#91CC75", "#EE6666", "#CC00CC", "#551e13"];
let tooltip = {
show: true,
trigger: "axis",
axisPointer: {
type: "cross",
},
confine: false,
showContent: true,
triggerOn: "mousemove",
};
let grid = {
right: "7%",
left: "4%",
top: "15%",
};
let toolbox = {
right: "5%",
feature: {
dataView: { show: true, readOnly: false },
saveAsImage: { show: true },
},
};
let legend = {
top: "2%",
data: ["总产量", "分布电耗", "总电耗", "成本", "消耗", "进厂"],
};
let yAxis = [
{
type: "value",
name: "产值 (万元)",
position: "left",
alignTicks: true,
axisLine: {
show: true,
lineStyle: {
color: colors[0],
},
},
axisLabel: {
formatter: "{value}",
},
}
];
export default { export default {
components: {
scEcharts,
charts: defineAsyncComponent(() =>
import("@/components/scEnm/lineChartsdialog.vue")
),
},
data() { data() {
return { return {
timeStamp: 0, timeStamp: 0,
year_s: "", year_s: "",
tableDatas: [], tableDatas: [],
optionMonth:{},
option1: {
color: colors,
tooltip: tooltip,
grid: grid,
toolbox: toolbox,
legend: legend,
xAxis: {
axisTick: {
show: true,
length: 5,
inside: true,
},
data: [],
},
yAxis: yAxis,
series: [
{
name: "工业总产值",
type: "bar",
yAxisIndex: 0,
data: [],
}
],
},
}; };
}, },
mounted() { mounted() {
@ -69,6 +154,7 @@ export default {
let year = myDate.getFullYear(); let year = myDate.getFullYear();
that.year_s = year; that.year_s = year;
this.getData(); this.getData();
let month = (that.month = myDate.getMonth() + 1);
}, },
methods: { methods: {
getData() { getData() {
@ -93,6 +179,7 @@ export default {
obj2.page = 0; obj2.page = 0;
obj2.type = 'month_s'; obj2.type = 'month_s';
that.$API.enm.enstat2.req(obj2).then((res2) => { that.$API.enm.enstat2.req(obj2).then((res2) => {
let seriesData0 = [];
if (res2.length > 0) { if (res2.length > 0) {
res2.forEach((item2) => { res2.forEach((item2) => {
let ind2 = item2.month_s - 1; let ind2 = item2.month_s - 1;
@ -100,17 +187,20 @@ export default {
}); });
} else { } else {
} }
for (let i = 0; i < wrapArr2.length; i++) { for (let i = 0; i < wrapArr2.length; i++) {
if (Boolean(wrapArr2[i])) { if (Boolean(wrapArr2[i])) {
if (this.tableDatas[i]) { if (this.tableDatas[i]) {
} else { } else {
this.tableDatas[i] = []; this.tableDatas[i] = [];
} }
let ind = wrapArr2[i].month_s - 1;
let time = let time =
wrapArr2[i].year_s + "." + wrapArr2[i].month_s; wrapArr2[i].year_s + "." + wrapArr2[i].month_s;
this.tableDatas[i][0] = time; this.tableDatas[i][0] = time;
this.tableDatas[i][1] = this.tableDatas[i][1] =
wrapArr2[i].industry_total_val; wrapArr2[i].industry_total_val;
seriesData0[ind] = wrapArr2[i].industry_total_val;
this.tableDatas[i][2] = this.tableDatas[i][2] =
wrapArr2[i].industry_add_val; wrapArr2[i].industry_add_val;
this.tableDatas[i][3] = wrapArr2[i].en_consume; // this.tableDatas[i][3] = wrapArr2[i].en_consume; //
@ -230,6 +320,15 @@ export default {
} else { } else {
} }
} }
let options = { ...that.option1 };
options.series[0].data = seriesData0;
let monthXAxis = [];
for (let i = 1; i <= that.month; i++) {
let item = i + "月";
monthXAxis.push(item);
}
options.xAxis.data = monthXAxis;
that.optionMonth = options;
}); });
}); });
}, },

View File

@ -641,9 +641,9 @@ export default {
if (data1.imaterial_data.length > 0) { if (data1.imaterial_data.length > 0) {
data1.imaterial_data.forEach((item) => { data1.imaterial_data.forEach((item) => {
if (item.material_name == "湿电石渣消耗") { if (item.material_name == "湿电石渣消耗") {
that.tableDatas[4][4] = item.amount_consume; that.tableDatas[4][4] = (item.amount_consume).toFixed(2);
}else if(item.material_name == "湿电石渣进厂"){ }else if(item.material_name == "湿电石渣进厂"){
that.tableDatas[5][4] = item.amount_consume; that.tableDatas[5][4] = (item.amount_consume).toFixed(2);
} }
}); });
} }

View File

@ -71,12 +71,7 @@
<el-col :span='12'> <el-col :span='12'>
<el-form-item label="所属工段:">{{ eventItem.enm_data.mgroup_name }}</el-form-item> <el-form-item label="所属工段:">{{ eventItem.enm_data.mgroup_name }}</el-form-item>
</el-col> </el-col>
<el-col :span='12'>
<el-form-item label="所在班组:">{{ eventItem.enm_data.team_name }}</el-form-item>
</el-col>
<el-col :span='12'>
<el-form-item label="所在班次:">{{ eventItem.enm_data.shift_name }}</el-form-item>
</el-col>
<el-col :span='12'> <el-col :span='12'>
<el-form-item label="发生时间:">{{ eventItem.create_time }}</el-form-item> <el-form-item label="发生时间:">{{ eventItem.create_time }}</el-form-item>
</el-col> </el-col>
@ -107,7 +102,7 @@
<el-descriptions-item label="处理时间"> <el-descriptions-item label="处理时间">
{{ eventItem.handle_time }} {{ eventItem.handle_time }}
</el-descriptions-item> </el-descriptions-item>
<el-descriptions-item label="处理描述" column="3"> <el-descriptions-item label="异常分析" column="3">
{{ eventItem.handle_desc }} {{ eventItem.handle_desc }}
</el-descriptions-item> </el-descriptions-item>
</el-descriptions> </el-descriptions>
@ -126,7 +121,7 @@
</el-row> </el-row>
<el-row> <el-row>
<el-col :span='12'> <el-col :span='12'>
<el-form-item label="处理描述"> <el-form-item label="异常分析">
<el-input v-model="form.handle_desc" clearable type="textarea"></el-input> <el-input v-model="form.handle_desc" clearable type="textarea"></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>