You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
385 lines
9.6 KiB
385 lines
9.6 KiB
2 years ago
|
<!-- 污水处置排放记录 -->
|
||
|
|
<template>
|
||
|
|
<basic-container>
|
||
|
|
<!-- <el-card style="height:300px;">
|
||
|
|
<VueEcharts style="width: 100%; height:300px" :option="linear"></VueEcharts>
|
||
|
|
</el-card> -->
|
||
|
|
<SearchHeader :searchForm="searchForm" :searchText="searchText" @searchHandle="searchHandle" @addHandle="addHandle" />
|
||
|
|
<avue-crud
|
||
|
|
id="avue-id"
|
||
|
|
ref="crud"
|
||
|
|
:option="option"
|
||
|
|
:data="data"
|
||
|
|
:page="page"
|
||
|
|
:table-loading="loading"
|
||
|
|
@on-load="onLoad"
|
||
|
|
@row-save="rowSave"
|
||
|
|
@search-change="searchChangeScope"
|
||
|
|
@row-update="rowUpdate"
|
||
|
|
@row-del="rowDel"
|
||
|
|
@refresh-change="refresh"
|
||
|
|
@selection-change="selectionChange"
|
||
|
|
>
|
||
|
|
<template slot-scope="{row,index}" slot="menu">
|
||
|
|
<el-button class="look" size="small" @click="$refs.crud.rowEdit(row,index)">编辑</el-button>
|
||
|
|
<el-button class="look" size="small" @click="$refs.crud.rowDel(row,index)">删除</el-button>
|
||
|
|
</template>
|
||
|
|
<!-- 新增按钮 -->
|
||
|
|
<!-- <template slot="menuLeft">
|
||
|
|
<el-button size="small" class="search" style="position: absolute;right:0;" @click="addHandle" >新 增</el-button>
|
||
|
|
</template> -->
|
||
|
|
<!-- 弹框内按钮 -->
|
||
|
|
<template slot-scope="{type}" slot="menuForm">
|
||
|
|
<el-button size="small" @click="$refs.crud.closeDialog()" class="button-el">取消</el-button>
|
||
|
|
<el-button size="small" @click="$refs.crud.rowSave()" class="button-el">确定</el-button>
|
||
|
|
</template>
|
||
|
|
</avue-crud>
|
||
|
|
</basic-container>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { insert, deleteByIds, update, list } from "../../api/lims/sewageDischargeLog";
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
loading: false,
|
||
|
|
page: [
|
||
|
|
{
|
||
|
|
current: 1, //当前第几页
|
||
|
|
total: 1, //总页数
|
||
|
|
size: 10, //每一页加载多少数据
|
||
|
|
},
|
||
|
|
],
|
||
|
|
// 搜索
|
||
|
|
searchForm: {
|
||
|
|
name: "",
|
||
|
|
},
|
||
|
|
option: {
|
||
|
|
header:false,
|
||
|
|
selection: true,
|
||
|
|
index: true,
|
||
|
|
labelPosition: "top",
|
||
|
|
labelSuffix: " ", //控制标题后缀
|
||
|
|
labelWidth: 120,
|
||
|
|
border: false,
|
||
|
|
// index: true,
|
||
|
|
gutter: 60, //设置input的大小
|
||
|
|
expandLevel: 3,
|
||
|
|
headerAlign: "left",
|
||
|
|
align: "left",
|
||
|
|
menuPosition: "left",
|
||
|
|
tree: true,
|
||
|
|
menuBtn: true,
|
||
|
|
submitBtn: true,
|
||
|
|
editBtn:false,
|
||
|
|
delBtn:false,
|
||
|
|
addBtn:false,
|
||
|
|
searchBtn:false,
|
||
|
|
emptyBtn:false,
|
||
|
|
columnBtn:false,
|
||
|
|
refreshBtn:false,
|
||
|
|
tip:false,
|
||
|
|
saveBtn:false,
|
||
|
|
cancelBtn:false,
|
||
|
|
dialogWidth: 920,
|
||
|
|
updateBtn:false,
|
||
|
|
dialogCustomClass:"custom",
|
||
|
|
addTitle:"新增",
|
||
|
|
column: [
|
||
|
|
// {
|
||
|
|
// // width:130,
|
||
|
|
// type: "input",
|
||
|
|
// span: 8,
|
||
|
|
// label: "id",
|
||
|
|
// prop: "Id",
|
||
|
|
// },
|
||
|
|
{
|
||
|
|
type: "datetime",
|
||
|
|
span: 8,
|
||
|
|
label: "添加消毒剂时间",
|
||
|
|
prop: "addDisinfectantTime",
|
||
|
|
display: true,
|
||
|
|
format: "yyyy-MM-dd HH:mm:ss",
|
||
|
|
valueFormat: "yyyy-MM-dd HH:mm:ss",
|
||
|
|
overHidden: true
|
||
|
|
},
|
||
|
|
{
|
||
|
|
type: "input",
|
||
|
|
label: "消毒或污水排放管理",
|
||
|
|
span: 8,
|
||
|
|
prop: "disinfectOrDischargeSewageMan",
|
||
|
|
overHidden: true
|
||
|
|
},
|
||
|
|
{
|
||
|
|
type: "input",
|
||
|
|
span: 8,
|
||
|
|
label: "监督人员",
|
||
|
|
prop: "supervisor",
|
||
|
|
overHidden: true
|
||
|
|
},
|
||
|
|
{
|
||
|
|
type: "input",
|
||
|
|
span: 8,
|
||
|
|
label: "消毒剂名称",
|
||
|
|
prop: "disinfectantName",
|
||
|
|
overHidden: true
|
||
|
|
},
|
||
|
|
{
|
||
|
|
type: "input",
|
||
|
|
span: 8,
|
||
|
|
label: "消毒剂用量",
|
||
|
|
prop: "consumption",
|
||
|
|
overHidden: true
|
||
|
|
},
|
||
|
|
{
|
||
|
|
type: "datetime",
|
||
|
|
span: 8,
|
||
|
|
label: "消毒时间",
|
||
|
|
prop: "disinfectTime",
|
||
|
|
display: true,
|
||
|
|
format: "yyyy-MM-dd HH:mm:ss",
|
||
|
|
valueFormat: "yyyy-MM-dd HH:mm:ss",
|
||
|
|
overHidden: true
|
||
|
|
},
|
||
|
|
{
|
||
|
|
type: "datetime",
|
||
|
|
span: 8,
|
||
|
|
label: "污水排放时间",
|
||
|
|
prop: "dischargeSewageTime",
|
||
|
|
display: true,
|
||
|
|
format: "yyyy-MM-dd HH:mm:ss",
|
||
|
|
valueFormat: "yyyy-MM-dd HH:mm:ss",
|
||
|
|
overHidden: true
|
||
|
|
},
|
||
|
|
{
|
||
|
|
type: "textarea",
|
||
|
|
span: 24,
|
||
|
|
label: "备注",
|
||
|
|
prop: "remark",
|
||
|
|
overHidden: true
|
||
|
|
},
|
||
|
|
|
||
|
|
],
|
||
|
|
group: [
|
||
|
|
{
|
||
|
|
//为新增的添加 配置数据
|
||
|
|
headerAlign: "center",
|
||
|
|
align: "center",
|
||
|
|
menuPosition: "center",
|
||
|
|
prop: "a165344452805342299",
|
||
|
|
arrow: false,
|
||
|
|
collapse: true,
|
||
|
|
display: true,
|
||
|
|
// column: [
|
||
|
|
// {
|
||
|
|
// type: "input",
|
||
|
|
// label: "编号",
|
||
|
|
// span: 7,
|
||
|
|
// display: true,
|
||
|
|
// prop: "a16534445487483112",
|
||
|
|
// },
|
||
|
|
// ],
|
||
|
|
},
|
||
|
|
],
|
||
|
|
},
|
||
|
|
data: [
|
||
|
|
{
|
||
|
|
//全局数据
|
||
|
|
Id: "1",
|
||
|
|
serial:'检测编号',
|
||
|
|
name: "样品管理员",
|
||
|
|
ypname: "样品名称",
|
||
|
|
number: "样品数量",
|
||
|
|
Date: "保留期（A->B）",
|
||
|
|
suggest: "管理员处理建议",
|
||
|
|
glyday: "管理员建议日期",
|
||
|
|
sprsuggest:'审批人建议',
|
||
|
|
sprday:'审批人建议日期',
|
||
|
|
principal:'技术负责人',
|
||
|
|
},
|
||
|
|
],
|
||
|
|
timeArr:[],
|
||
|
|
num: []
|
||
|
|
};
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
onLoad(page, param = {}, loading) {
|
||
|
|
//dow加载完毕后触发
|
||
|
|
//模拟分页
|
||
|
|
this.$set(this.page, 0, page);
|
||
|
|
this.loading = true;
|
||
|
|
list(
|
||
|
|
Object.assign({ current: page.currentPage, size: page.pageSize }, param)
|
||
|
|
).then((res) => {
|
||
|
|
console.log(res);
|
||
|
|
this.data = res.data.data.records;
|
||
|
|
let arr = []
|
||
|
|
this.data.forEach(item => {
|
||
|
|
arr.push(item.dischargeSewageTime.substr(0,10))
|
||
|
|
parseFloat(this.num.push(item.consumption.substr(0,3)))
|
||
|
|
})
|
||
|
|
this.timeArr = arr
|
||
|
|
// position1
|
||
|
|
this.page[0].total = res.data.data.total;
|
||
|
|
this.loading = false;
|
||
|
|
});
|
||
|
|
},
|
||
|
|
//搜索
|
||
|
|
searchHandle(item, index) {
|
||
|
|
this.page[0].currentPage = 1
|
||
|
|
if (index === 1) {
|
||
|
|
this.searchForm = {
|
||
|
|
name: "",
|
||
|
|
};
|
||
|
|
this.onLoad(this.page[0]);
|
||
|
|
} else {
|
||
|
|
this.onLoad(this.page[0], item);
|
||
|
|
}
|
||
|
|
},
|
||
|
|
//查找分页
|
||
|
|
searchChangeScope(params, done) {
|
||
|
|
this.onLoad(this.page[0]);
|
||
|
|
done();
|
||
|
|
},
|
||
|
|
selectionChange(list) {
|
||
|
|
console.log(list.id);
|
||
|
|
},
|
||
|
|
toggleSelection(val) {
|
||
|
|
console.log("aaa");
|
||
|
|
},
|
||
|
|
// 新增
|
||
|
|
addHandle() {
|
||
|
|
this.$refs.crud.rowAdd();
|
||
|
|
},
|
||
|
|
//新增
|
||
|
|
rowSave(from, done, loading) {
|
||
|
|
console.log(from);
|
||
|
|
insert(from)
|
||
|
|
.then((res) => {
|
||
|
|
this.onLoad(this.page[0]);
|
||
|
|
})
|
||
|
|
.then(() => {
|
||
|
|
this.$message.success("新增成功");
|
||
|
|
});
|
||
|
|
done();
|
||
|
|
},
|
||
|
|
refresh(val) {
|
||
|
|
console.log("刷新回调");
|
||
|
|
},
|
||
|
|
//删除
|
||
|
|
rowDel(form, index) {
|
||
|
|
this.$confirm("此操作会删除该数据，且无法恢复，确定要删除吗?", {
|
||
|
|
confirmButtonText: "确定",
|
||
|
|
cancelButtonText: "取消",
|
||
|
|
type: "warning",
|
||
|
|
}).then(() => {
|
||
|
|
deleteByIds(form.id).then((res) => {
|
||
|
|
console.log(res);
|
||
|
|
this.$message.success("删除成功");
|
||
|
|
this.onLoad(this.page[0]);
|
||
|
|
});
|
||
|
|
});
|
||
|
|
},
|
||
|
|
//修改
|
||
|
|
rowUpdate(form, index, done, loading) {
|
||
|
|
console.log(form, "啊啊啊啊无大大无大大无多");
|
||
|
|
update(form).then((res) => {
|
||
|
|
this.onLoad(this.page[0]);
|
||
|
|
done();
|
||
|
|
});
|
||
|
|
},
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
linear() {
|
||
|
|
return {
|
||
|
|
xAxis: {
|
||
|
|
type: 'category',
|
||
|
|
data: this.timeArr
|
||
|
|
},
|
||
|
|
yAxis: {
|
||
|
|
type: 'value'
|
||
|
|
},
|
||
|
|
grid: {
|
||
|
|
top: '10%',
|
||
|
|
left: '5%',
|
||
|
|
right: '5%',
|
||
|
|
bottom: '10%',
|
||
|
|
containLabel: true
|
||
|
|
},
|
||
|
|
series: [
|
||
|
|
{
|
||
|
|
data: this.num,
|
||
|
|
type: 'line'
|
||
|
|
}
|
||
|
|
]
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
::v-deep .el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf{
|
||
|
|
border-bottom: 1px solid #f0f3f7;
|
||
|
|
}
|
||
|
|
::v-deep .avue-crud .el-table th{
|
||
|
|
color: #999999;
|
||
|
|
font-weight: 400;
|
||
|
|
background: #f6f8fa;
|
||
|
|
height: 66px;
|
||
|
|
}
|
||
|
|
::v-deep .avue-crud .el-table td{
|
||
|
|
height: 66px;
|
||
|
|
color: #333333;
|
||
|
|
}
|
||
|
|
::v-deep .el-table .el-table__cell.is-center{
|
||
|
|
text-align: left;
|
||
|
|
}
|
||
|
|
::v-deep .el-table__row .el-button--default, .el-table__row .el-button--text{
|
||
|
|
background-color: #fff !important;
|
||
|
|
}
|
||
|
|
::v-deep .el-pagination .el-select .el-input .el-input__inner{
|
||
|
|
height: 20px;
|
||
|
|
}
|
||
|
|
/deep/ .avue-crud__pagination{
|
||
|
|
height:20px;
|
||
|
|
padding-top:20px;
|
||
|
|
padding-bottom: 20px;
|
||
|
|
}
|
||
|
|
//新增样式
|
||
|
|
.search {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #1E60F5;
|
||
|
|
border-color: #1E60F5;
|
||
|
|
height: 46px;
|
||
|
|
width: 100px;
|
||
|
|
border-radius: 0px;
|
||
|
|
margin-left:18px!important;
|
||
|
|
margin-right: 0!important;
|
||
|
|
}
|
||
|
|
//新增按钮下边距
|
||
|
|
::v-deep .avue-crud__menu{
|
||
|
|
padding-bottom:20px !important;
|
||
|
|
}
|
||
|
|
// 取消
|
||
|
|
.button-el {
|
||
|
|
color: #999999;
|
||
|
|
background-color: #fff;
|
||
|
|
border-color: #e4e7ec;
|
||
|
|
height: 46px;
|
||
|
|
width: 100px;
|
||
|
|
border-radius: 0px;
|
||
|
|
margin-left: 20px;
|
||
|
|
}
|
||
|
|
// 确定
|
||
|
|
.button-el:hover {
|
||
|
|
color: #fff;
|
||
|
|
background-color: #1e60f5;
|
||
|
|
border-color: #1e60f5;
|
||
|
|
height: 46px;
|
||
|
|
width: 100px;
|
||
|
|
border-radius: 0px;
|
||
|
|
margin-left: 20px;
|
||
|
|
}
|
||
|
|
</style>
|