2 changed files with 524 additions and 0 deletions
@ -0,0 +1,27 @@ |
|||||||
|
import request from "@/utils/request"; |
||||||
|
|
||||||
|
// 查询运行记录
|
||||||
|
export function boilerSysList(data) { |
||||||
|
return request({ |
||||||
|
url: "/reportSteam/list", |
||||||
|
method: "post", |
||||||
|
data, |
||||||
|
}); |
||||||
|
} |
||||||
|
// 编辑运行记录
|
||||||
|
export function boilerSysEdit(data) { |
||||||
|
return request({ |
||||||
|
url: "/reportSteam/edit", |
||||||
|
method: "put", |
||||||
|
data, |
||||||
|
}); |
||||||
|
} |
||||||
|
// 导出
|
||||||
|
export function boilerSysExport(data) { |
||||||
|
return request({ |
||||||
|
url: "/reportSteam/export", |
||||||
|
method: "post", |
||||||
|
data, |
||||||
|
responseType: "blob", |
||||||
|
}); |
||||||
|
} |
||||||
@ -0,0 +1,497 @@ |
|||||||
|
<template> |
||||||
|
<div class="app-container"> |
||||||
|
<div class="btn-condition"> |
||||||
|
<div class="condition-left" v-show="showSearch"> |
||||||
|
<el-form |
||||||
|
:model="queryParams" |
||||||
|
ref="queryForm" |
||||||
|
size="small" |
||||||
|
:inline="true" |
||||||
|
> |
||||||
|
<el-form-item label="日期" prop="msgCode"> |
||||||
|
<el-date-picker |
||||||
|
v-model="dayDate" |
||||||
|
type="daterange" |
||||||
|
range-separator="至" |
||||||
|
value-format="yyyy-MM-dd" |
||||||
|
start-placeholder="开始日期" |
||||||
|
end-placeholder="结束日期" |
||||||
|
@change="dateChange" |
||||||
|
> |
||||||
|
</el-date-picker> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<div class="primary-btn"> |
||||||
|
<el-button |
||||||
|
type="primary" |
||||||
|
icon="el-icon-search" |
||||||
|
size="mini" |
||||||
|
@click="handleQuery" |
||||||
|
>搜索</el-button |
||||||
|
> |
||||||
|
</div> |
||||||
|
<div class="warning-btn"> |
||||||
|
<el-button |
||||||
|
type="warning" |
||||||
|
icon="el-icon-download" |
||||||
|
size="mini" |
||||||
|
@click="handleExport" |
||||||
|
>导出</el-button |
||||||
|
> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<el-table |
||||||
|
:data="tableData" |
||||||
|
border |
||||||
|
style="width: 100%" |
||||||
|
v-loading="loading" |
||||||
|
:cell-style="tableRowStyle" |
||||||
|
class="log_table" |
||||||
|
> |
||||||
|
<el-table-column prop="curTime" label="记录时间" width="110"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="runStatus" label="运行状态"> </el-table-column> |
||||||
|
<el-table-column prop="flameIntensity" label="火焰强度"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="tempFlueGas" label="烟气温度(℃)"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="percentFlameIntensity" label="火焰百分比(%)"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="waterLevel" label="液位(%)"> </el-table-column> |
||||||
|
<el-table-column prop="tempCur" label="蒸汽温度(℃)"> </el-table-column> |
||||||
|
<el-table-column prop="pressCur" label="当前压力(Mpa)"> </el-table-column> |
||||||
|
<el-table-column prop="pressSet" label="压力设定值(Mpa)"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="pressStartDiff" label="启动压差(Mpa)"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="pressShutdownDiff" label="停止压差(Mpa)"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="pressInstance" label="瞬时压力(Mpa)"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="flowInstance" label="瞬时流量(t/h)"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="flowTotal" label="累计流量(t)"> </el-table-column> |
||||||
|
<el-table-column prop="recorder" label="巡查记录人"> </el-table-column> |
||||||
|
<el-table-column prop="remark" label="备注"> </el-table-column> |
||||||
|
<el-table-column |
||||||
|
label="操作" |
||||||
|
align="center" |
||||||
|
class-name="small-padding fixed-width" |
||||||
|
> |
||||||
|
<template slot-scope="scope"> |
||||||
|
<el-button |
||||||
|
size="mini" |
||||||
|
type="text" |
||||||
|
icon="el-icon-edit" |
||||||
|
@click="handleUpdate(scope.row)" |
||||||
|
>修改</el-button |
||||||
|
> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
</el-table> |
||||||
|
|
||||||
|
<pagination |
||||||
|
v-show="total > 0" |
||||||
|
:total="total" |
||||||
|
:page.sync="queryParams.pageNum" |
||||||
|
:limit.sync="queryParams.pageSize" |
||||||
|
@pagination="getList" |
||||||
|
/> |
||||||
|
<!-- 添加或修改设备台账对话框 --> |
||||||
|
<el-dialog :title="title" :visible.sync="open" append-to-body> |
||||||
|
<el-form ref="form" :model="form" :rules="rules"> |
||||||
|
<el-row type="flex" justify="felx-start"> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="记录时间" prop="curTime"> |
||||||
|
<el-input |
||||||
|
v-model="form.curTime" |
||||||
|
disabled |
||||||
|
placeholder="" |
||||||
|
/> </el-form-item |
||||||
|
></el-col> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="运行状态" prop="runStatus"> |
||||||
|
<el-input |
||||||
|
v-model="form.runStatus" |
||||||
|
disabled |
||||||
|
placeholder="" |
||||||
|
/> </el-form-item |
||||||
|
></el-col> |
||||||
|
</el-row> |
||||||
|
<el-row type="flex" justify="center"> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="火焰强度" prop="flameIntensity"> |
||||||
|
<el-input |
||||||
|
clearable |
||||||
|
v-model="form.flameIntensity" |
||||||
|
placeholder="请输入" |
||||||
|
/> </el-form-item |
||||||
|
></el-col> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="烟气温度℃" prop="tempFlueGas"> |
||||||
|
<el-input |
||||||
|
clearable |
||||||
|
v-model="form.tempFlueGas" |
||||||
|
placeholder="请输入温度℃" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
<el-row type="flex" justify="center"> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="火焰百分比%" prop="percentFlameIntensity"> |
||||||
|
<el-input |
||||||
|
clearable |
||||||
|
v-model="form.percentFlameIntensity" |
||||||
|
placeholder="请输入百分比℃" |
||||||
|
/> </el-form-item |
||||||
|
></el-col> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="液位%" prop="waterLevel"> |
||||||
|
<el-input |
||||||
|
clearable |
||||||
|
v-model="form.waterLevel" |
||||||
|
placeholder="请输入液位%" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
<el-row type="flex" justify="center"> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="蒸汽温度℃" prop="tempCur"> |
||||||
|
<el-input |
||||||
|
clearable |
||||||
|
v-model="form.tempCur" |
||||||
|
placeholder="请输入温度℃" |
||||||
|
/> </el-form-item |
||||||
|
></el-col> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="当前压力Mpa" prop="pressCur"> |
||||||
|
<el-input |
||||||
|
clearable |
||||||
|
v-model="form.pressCur" |
||||||
|
placeholder="请输入压力Mpa" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
<el-row type="flex" justify="center"> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="压力设定值Mpa" prop="pressSet"> |
||||||
|
<el-input |
||||||
|
clearable |
||||||
|
v-model="form.pressSet" |
||||||
|
placeholder="请输入压力Mpa" |
||||||
|
/> </el-form-item |
||||||
|
></el-col> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="启动压差Mpa" prop="pressStartDiff"> |
||||||
|
<el-input |
||||||
|
clearable |
||||||
|
v-model="form.pressStartDiff" |
||||||
|
placeholder="请输入压差Mpa" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
<el-row type="flex" justify="center"> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="停止压差Mpa" prop="pressShutdownDiff"> |
||||||
|
<el-input |
||||||
|
clearable |
||||||
|
v-model="form.pressShutdownDiff" |
||||||
|
placeholder="请输入压差Mpa" |
||||||
|
/> </el-form-item |
||||||
|
></el-col> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="瞬时压力Mpa" prop="pressInstance"> |
||||||
|
<el-input |
||||||
|
clearable |
||||||
|
v-model="form.pressInstance" |
||||||
|
placeholder="请输入压力Mpa" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
<el-row type="flex" justify="center"> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="瞬间流量(t/h)" prop="flowInstance"> |
||||||
|
<el-input |
||||||
|
clearable |
||||||
|
v-model="form.flowInstance" |
||||||
|
placeholder="请输入流量(t/h)" |
||||||
|
/> </el-form-item |
||||||
|
></el-col> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="累计流量t" prop="flowTotal"> |
||||||
|
<el-input |
||||||
|
clearable |
||||||
|
v-model="form.flowTotal" |
||||||
|
placeholder="请输入流量t" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
<el-row type="flex" justify="center"> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="巡查人签名" prop="recorder"> |
||||||
|
<el-input |
||||||
|
clearable |
||||||
|
v-model="form.recorder" |
||||||
|
placeholder="请输入" |
||||||
|
/> </el-form-item |
||||||
|
></el-col> |
||||||
|
<el-col :span="12"> |
||||||
|
<el-form-item label="备注" prop="remark"> |
||||||
|
<el-input |
||||||
|
clearable |
||||||
|
v-model="form.remark" |
||||||
|
placeholder="请输入备注" |
||||||
|
/> |
||||||
|
</el-form-item> |
||||||
|
</el-col> |
||||||
|
</el-row> |
||||||
|
</el-form> |
||||||
|
<div slot="footer" class="dialog-footer"> |
||||||
|
<el-button @click="cancel">取 消</el-button> |
||||||
|
<el-button type="primary" @click="submitForm">确 定</el-button> |
||||||
|
</div> |
||||||
|
</el-dialog> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { |
||||||
|
boilerSysList, |
||||||
|
boilerSysEdit, |
||||||
|
boilerSysExport, |
||||||
|
} from "@/api/boiler/boilerRunReport"; |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
// 遮罩层 |
||||||
|
loading: true, |
||||||
|
// 选中数组 |
||||||
|
ids: [], |
||||||
|
// 非单个禁用 |
||||||
|
single: true, |
||||||
|
// 非多个禁用 |
||||||
|
multiple: true, |
||||||
|
// 显示搜索条件 |
||||||
|
showSearch: true, |
||||||
|
// 总条数 |
||||||
|
total: 0, |
||||||
|
// 表格数据 |
||||||
|
postList: [], |
||||||
|
// 弹出层标题 |
||||||
|
title: "", |
||||||
|
// 是否显示弹出层 |
||||||
|
open: false, |
||||||
|
// 查询参数 |
||||||
|
queryParams: { |
||||||
|
pageNum: 1, |
||||||
|
pageSize: 10, |
||||||
|
params: {}, |
||||||
|
}, |
||||||
|
dayDate: "", |
||||||
|
tableData: [], |
||||||
|
// 表单参数 |
||||||
|
form: {}, |
||||||
|
// 表单校验 |
||||||
|
rules: { |
||||||
|
deviceName: [ |
||||||
|
{ required: true, message: "设备名称不能为空", trigger: "blur" }, |
||||||
|
], |
||||||
|
}, |
||||||
|
deviceRun: [ |
||||||
|
{ |
||||||
|
label: "不运行", |
||||||
|
value: 0, |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "运行", |
||||||
|
value: 1, |
||||||
|
}, |
||||||
|
], |
||||||
|
}; |
||||||
|
}, |
||||||
|
mounted() { |
||||||
|
this.initializeTimeDate(); |
||||||
|
this.getList(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
// 初始化时间 |
||||||
|
initializeTimeDate() { |
||||||
|
let date = new Date(); //获取新的时间 |
||||||
|
//获取当前年份,并且转为字符串 |
||||||
|
let year = date.getFullYear().toString(); |
||||||
|
//获取当前月份，因为月份是要从0开始，此处要加1， |
||||||
|
//使用三元表达式，判断是否小于10，如果是的话，就在字符串前面拼接'0' |
||||||
|
let month = |
||||||
|
date.getMonth() + 1 < 10 |
||||||
|
? "0" + (date.getMonth() + 1).toString() |
||||||
|
: (date.getMonth() + 1).toString(); |
||||||
|
//获取天，判断是否小于10，如果是的话，就在在字符串前面拼接'0' |
||||||
|
let day = |
||||||
|
date.getDate() < 10 |
||||||
|
? "0" + date.getDate().toString() |
||||||
|
: date.getDate().toString(); |
||||||
|
//字符串拼接，将开始时间和结束时间进行拼接 |
||||||
|
let start1 = year + "-" + month + "-01"; //当月第一天 |
||||||
|
let end1 = year + "-" + month + "-" + day; //当天 |
||||||
|
this.dayDate = [start1, end1]; // 更新 |
||||||
|
}, |
||||||
|
tableRowStyle({ row, column, rowIndex, columnIndex }) { |
||||||
|
if (columnIndex === 2 || columnIndex === 6 || columnIndex === 13) { |
||||||
|
return "color: #fd1e00;!important;text-align:center;font-weight: bold;"; |
||||||
|
} |
||||||
|
// return "text-align:center"; |
||||||
|
}, |
||||||
|
// 选中日期事件 |
||||||
|
dateChange() { |
||||||
|
// console.log("打印时间", this.timeform.time1); |
||||||
|
if (!this.dayDate) { |
||||||
|
this.$nextTick(() => { |
||||||
|
this.dayDate = []; |
||||||
|
}); |
||||||
|
} |
||||||
|
}, |
||||||
|
|
||||||
|
/** 查询表格数据 */ |
||||||
|
getList() { |
||||||
|
this.loading = true; |
||||||
|
this.queryParams.params.startTime = |
||||||
|
this.dayDate.length > 0 ? this.dayDate[0] : ""; |
||||||
|
this.queryParams.params.endTime = |
||||||
|
this.dayDate.length > 0 ? this.dayDate[1] : ""; |
||||||
|
boilerSysList(this.queryParams).then((res) => { |
||||||
|
console.log("列表返回", res); |
||||||
|
if (res.code == 200 && res.rows) { |
||||||
|
this.tableData = res.rows; |
||||||
|
this.total = res.total; |
||||||
|
this.loading = false; |
||||||
|
} else { |
||||||
|
this.tableData = []; |
||||||
|
this.total = 0; |
||||||
|
this.loading = false; |
||||||
|
} |
||||||
|
}); |
||||||
|
// 处理表格数据 |
||||||
|
this.loading = false; |
||||||
|
}, |
||||||
|
/** 搜索按钮操作 */ |
||||||
|
handleQuery() { |
||||||
|
this.queryParams.pageNum = 1; |
||||||
|
this.getList(); |
||||||
|
}, |
||||||
|
/** 导出按钮操作 */ |
||||||
|
handleExport() { |
||||||
|
this.queryParams.params.startTime = |
||||||
|
this.dayDate.length > 0 ? this.dayDate[0] : ""; |
||||||
|
this.queryParams.params.endTime = |
||||||
|
this.dayDate.length > 0 ? this.dayDate[1] : ""; |
||||||
|
boilerSysExport(this.queryParams).then((res) => { |
||||||
|
console.log("导出返回", res); |
||||||
|
if (res) { |
||||||
|
// 请求的结果就是文件 |
||||||
|
// 创建一个blob URL，用于生成下载链接 |
||||||
|
const url = window.URL.createObjectURL(new Blob([res])); |
||||||
|
// 创建一个<a>元素，并设置其href和download属性 |
||||||
|
const link = document.createElement("a"); |
||||||
|
link.href = url; |
||||||
|
link.setAttribute("download", "蒸汽机运行记录.xls"); // 设置下载的文件名 |
||||||
|
// 模拟点击下载链接 |
||||||
|
document.body.appendChild(link); |
||||||
|
link.click(); |
||||||
|
document.body.removeChild(link); |
||||||
|
// 释放blob URL资源 |
||||||
|
window.URL.revokeObjectURL(url); |
||||||
|
this.$message({ |
||||||
|
type: "success", |
||||||
|
message: "导出成功!", |
||||||
|
}); |
||||||
|
} else { |
||||||
|
this.$message.error("导出失败!"); |
||||||
|
} |
||||||
|
}); |
||||||
|
// .catch((err) => { |
||||||
|
// this.$message.error('导出失败!'); |
||||||
|
// }) |
||||||
|
}, |
||||||
|
// 取消按钮 |
||||||
|
cancel() { |
||||||
|
this.open = false; |
||||||
|
this.reset(); |
||||||
|
this.form.id = ""; |
||||||
|
}, |
||||||
|
// 表单重置 |
||||||
|
reset() { |
||||||
|
this.form = { |
||||||
|
id: "", |
||||||
|
curTime: "", |
||||||
|
runStatus: "", |
||||||
|
flameIntensity: "", |
||||||
|
tempFlueGas: "", |
||||||
|
percentFlameIntensity: "", |
||||||
|
waterLevel: "", |
||||||
|
tempCur: "", |
||||||
|
pressCur: "", |
||||||
|
pressSet: "", |
||||||
|
pressStartDiff: "", |
||||||
|
pressShutdownDiff: "", |
||||||
|
pressInstance: "", |
||||||
|
flowInstance: "", |
||||||
|
flowTotal: "", |
||||||
|
recorder: "", |
||||||
|
remark: "", |
||||||
|
}; |
||||||
|
}, |
||||||
|
/** 修改按钮操作 */ |
||||||
|
handleUpdate(row) { |
||||||
|
this.reset(); |
||||||
|
this.form = Object.assign({}, row); |
||||||
|
this.open = true; |
||||||
|
this.title = "修改蒸汽机运行记录"; |
||||||
|
}, |
||||||
|
/** 提交按钮 */ |
||||||
|
submitForm: function () { |
||||||
|
this.$refs["form"].validate((valid) => { |
||||||
|
if (valid) { |
||||||
|
if (this.form.id != undefined) { |
||||||
|
boilerSysEdit(this.form).then((response) => { |
||||||
|
this.$modal.msgSuccess("修改成功"); |
||||||
|
this.open = false; |
||||||
|
this.getList(); |
||||||
|
}); |
||||||
|
} else { |
||||||
|
console.log("新增参数", this.form); |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
}, |
||||||
|
}; |
||||||
|
</script> |
||||||
|
<style scoped lang="scss"> |
||||||
|
/* 媒体查询，适配大于2000px分辨率的大屏样式 - element样式 */ |
||||||
|
@media (max-width: 2000px) { |
||||||
|
::v-deep .el-dialog { |
||||||
|
width: 800px !important; |
||||||
|
} |
||||||
|
::v-deep .print-dialog .el-dialog { |
||||||
|
width: 1200px !important; |
||||||
|
} |
||||||
|
::v-deep .el-dialog .el-form-item__label { |
||||||
|
width: 130px !important; |
||||||
|
} |
||||||
|
::v-deep .el-dialog .el-form-item { |
||||||
|
display: flex; |
||||||
|
flex-direction: row; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
::v-deep .el-dialog .el-form-item__content { |
||||||
|
width: 220px !important; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
Loading…
Reference in new issue