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.
332 lines
9.1 KiB
332 lines
9.1 KiB
<template> |
|
<basic-container> |
|
<avue-crud :option="option" :table-loading="loading" :data="data" v-model="form" v-model:page="page" ref="crud" |
|
@row-del="rowDel" @search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange" |
|
@current-change="currentChange" @size-change="sizeChange" @refresh-change="refreshChange" |
|
@on-load="onLoad" @sort-change="sortChange"> |
|
<template #isJumbotron="scope" > |
|
<el-switch v-model="scope.row.isJumbotron" :active-value="1" |
|
:disabled="!permission.waterMonitoring_big_screen" |
|
:inactive-value="0" @change="(val) => changeJumbtron(scope.row,val)"></el-switch> |
|
</template> |
|
</avue-crud> |
|
</basic-container> |
|
</template> |
|
|
|
<script> |
|
import { pageList,editItem } from "@/api/energyManagement/waterManagement" |
|
import { mapGetters } from 'vuex'; |
|
export default { |
|
data() { |
|
return { |
|
loading: false, |
|
form: {}, |
|
data: [], |
|
query:{}, |
|
page: { |
|
pageSize: 10, |
|
currentPage: 1, |
|
total: 0, |
|
}, |
|
selectionList:[], |
|
option: { |
|
columnSort: true, |
|
tip: false, |
|
height: "auto", |
|
align: "center", |
|
calcHeight: 32, |
|
simplePage: false, |
|
searchShow: true, |
|
searchMenuSpan: 12, |
|
searchIcon: true, |
|
searchIndex: 3, |
|
tree: false, |
|
border: true, |
|
index: false, |
|
selection: false, |
|
viewBtn: false, |
|
delBtn: false, |
|
editBtn: false, |
|
delBtnIcon: " ", |
|
addBtn: false, |
|
labelWidth: 120, |
|
searchLabelWidth: "auto", |
|
menu: false, |
|
menuWidth: 200, |
|
dialogWidth: 600, |
|
dialogClickModal: false, |
|
searchEnter: true, |
|
excelBtn: true, |
|
gridBtn: false, |
|
searchShowBtn: false, |
|
showOverflowTooltip: true, |
|
searchLabelPosition: "left", |
|
searchGutter: 24, |
|
searchSpan: 6, |
|
menuAlign: "left", |
|
gridBtn: false, |
|
searchMenuPosition: "right", |
|
addBtnIcon: " ", |
|
viewBtnIcon: " ", |
|
delBtnIcon: " ", |
|
editBtnIcon: " ", |
|
|
|
column: [ |
|
{ |
|
label: "作业中心", |
|
prop: "workCenterId", |
|
sortable: 'custom', |
|
type:"select", |
|
multiple: true, |
|
span: 24, |
|
width: 200, |
|
overflow: true, |
|
search: true, |
|
dicUrl:"/api/blade-desk/BA/WorkCenter/listForSelect", |
|
props:{ |
|
label: 'wcName', |
|
value: 'id', |
|
}, |
|
rules: [ |
|
{ |
|
required: true, |
|
message: "请输入作业中心", |
|
trigger: "blur", |
|
}, |
|
], |
|
}, |
|
{ |
|
label: "日期", |
|
prop: "date", |
|
sortable: 'custom', |
|
span: 24, |
|
width: 200, |
|
overflow: true, |
|
search: true, |
|
type: "date", |
|
searchRange: true, |
|
startPlaceholder: "开始时间", |
|
endPlaceholder: "结束时间", |
|
format:"YYYY-MM-DD", |
|
valueFormat:"YYYY-MM-DD", |
|
rules: [ |
|
{ |
|
required: true, |
|
message: "请输入日期", |
|
trigger: "blur", |
|
}, |
|
], |
|
}, |
|
{ |
|
label: "加工面积(dm²)", |
|
prop: "workArea", |
|
span: 24, |
|
sortable: 'custom', |
|
width: 200, |
|
overflow: true, |
|
search: false, |
|
rules: [ |
|
{ |
|
required: true, |
|
message: "请输入加工面积(dm²)", |
|
trigger: "blur", |
|
}, |
|
], |
|
}, |
|
{ |
|
label: "定额单位自来水用水量(L/dm²)", |
|
prop: "quoTapWaterNum", |
|
sortable: 'custom', |
|
span: 24, |
|
width: 280, |
|
overflow: true, |
|
search: false, |
|
rules: [ |
|
{ |
|
required: true, |
|
message: "请输入定额单位自来水用水量(L/dm²)", |
|
trigger: "blur", |
|
}, |
|
], |
|
}, |
|
{ |
|
label: "实际单位自来水用水量(L/dm²)", |
|
prop: "realTapWaterNum", |
|
span: 24, |
|
sortable: 'custom', |
|
width: 280, |
|
overflow: true, |
|
search: false, |
|
rules: [ |
|
{ |
|
required: true, |
|
message: "请输入实际单位自来水用水量(L/dm²)", |
|
trigger: "blur", |
|
}, |
|
], |
|
}, |
|
{ |
|
label: "实际总自来水用水量(t)", |
|
prop: "totalTapWaterNum", |
|
span: 24, |
|
width: 200, |
|
overflow: true, |
|
sortable: 'custom', |
|
search: false, |
|
rules: [ |
|
{ |
|
required: true, |
|
message: "请输入实际总自来水用水量(t)", |
|
trigger: "blur", |
|
}, |
|
], |
|
}, |
|
{ |
|
label: "定额单位纯水用水量(L/dm²)", |
|
prop: "quoPureWaterNum", |
|
span: 24, |
|
width: 240, |
|
overflow: true, |
|
sortable: 'custom', |
|
search: false, |
|
rules: [ |
|
{ |
|
required: true, |
|
message: "请输入定额单位纯水用水量(L/dm²)", |
|
trigger: "blur", |
|
}, |
|
], |
|
}, |
|
{ |
|
label: "实际单位纯水用水量(L/dm²)", |
|
prop: "realPureWaterNum", |
|
span: 24, |
|
sortable: 'custom', |
|
width: 200, |
|
overflow: true, |
|
search: false, |
|
rules: [ |
|
{ |
|
required: true, |
|
message: "请输入实际单位纯水用水量(L/dm²)", |
|
trigger: "blur", |
|
}, |
|
], |
|
}, |
|
{ |
|
label: "实际总纯水用水量(t)", |
|
prop: "totalPureWaterNum", |
|
span: 24, |
|
sortable: 'custom', |
|
width: 200, |
|
overflow: true, |
|
search: false, |
|
rules: [ |
|
{ |
|
required: true, |
|
message: "请输入实际总纯水用水量(t)", |
|
trigger: "blur", |
|
}, |
|
], |
|
}, |
|
{ |
|
label: '是否大屏显示', |
|
prop: 'isJumbotron', |
|
type: 'switch', |
|
width:120, |
|
}, |
|
], |
|
}, |
|
}; |
|
}, |
|
computed: { |
|
...mapGetters(['permission']), |
|
}, |
|
mounted() { |
|
console.log('permission-------',this.permission) |
|
}, |
|
methods: { |
|
// 表格排序 |
|
sortChange({ prop, order }) { |
|
if (!prop) { |
|
// 如果取消排序，清空排序参数 |
|
this.query.orderByField = undefined; |
|
// this.query.isAsc = undefined; |
|
this.query.asc = undefined; |
|
} else { |
|
const orderByField = prop.replace(/([a-z])([A-Z0-9])/g, '$1_$2').toUpperCase(); |
|
this.query.orderByField = orderByField == "DATE" ? "CREATE_TIME" : orderByField; |
|
// this.query.isAsc = order === 'ascending' ? true : false; |
|
this.query.asc = order === 'ascending' ? true : false; |
|
} |
|
// // 重新加载数据 |
|
this.onLoad(this.page, this.query); |
|
}, |
|
searchChange(params, done){ |
|
this.query = params |
|
this.page.currentPage = 1; |
|
this.onLoad() |
|
done() |
|
}, |
|
searchReset(){ |
|
this.query = {} |
|
this.onLoad() |
|
}, |
|
selectionChange(list){ |
|
this.selectionList = list |
|
}, |
|
currentChange(currentPage){ |
|
this.page.currentPage = currentPage; |
|
}, |
|
sizeChange(pageSize){ |
|
this.page.pageSize = pageSize; |
|
}, |
|
refreshChange(){ |
|
this.onLoad() |
|
}, |
|
changeJumbtron(row,val){ |
|
if(row && row.id){ |
|
row.isJumbotron = val == 1 ? 0 : 1 |
|
console.log('row-----------',row) |
|
console.log('val-----------',val) |
|
editItem(({ |
|
id:row.id, |
|
isJumbotron:val |
|
})).then(res => { |
|
if(res.data.code == 200){ |
|
this.$message.success('修改成功') |
|
this.onLoad() |
|
}else{ |
|
this.$message.error('修改失败') |
|
} |
|
}) |
|
} |
|
|
|
}, |
|
onLoad(){ |
|
this.loading = true; |
|
let params = { |
|
...this.query, |
|
startDate:this.query.date && this.query.date.length != 0 && this.query.date[0], |
|
endDate:this.query.date && this.query.date.length != 0 && this.query.date[1], |
|
} |
|
if(params.date) delete params.date |
|
console.log('params ==============',params) |
|
// this.data = [{id:"001",isJumbotron:0},{id:"002",isJumbotron:1}] |
|
// this.loading = false |
|
pageList({ |
|
current:this.page.currentPage, |
|
size:this.page.pageSize, |
|
type:1, |
|
...params |
|
}).then(res =>{ |
|
this.data = res.data.data.records; |
|
this.page.total = res.data.data.total; |
|
this.loading = false |
|
}) |
|
}, |
|
}, |
|
}; |
|
</script> |
|
|
|
<style></style>
|
|
|