中航光电热表web
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.
 
 
 
 

399 lines
10 KiB

<template>
<div>
<avue-crud
:option="option"
:table-loading="loading"
:data="data"
v-model="form"
v-model:page="page"
ref="crud"
@row-del="handleDelete"
@row-update="rowUpdate"
@search-change="searchChange"
@search-reset="searchReset"
@selection-change="selectionChange"
@current-change="currentChange"
@size-change="sizeChange"
@refresh-change="refreshChange"
@on-load="onLoad"
:search.sync="search"
>
<template #menu-left>
<el-button type="primary" @click="moldAddFn(null, true)"> 新增 </el-button>
<el-button type="danger" @click="handleBatchDelete">删 除 </el-button>
</template>
<template #menu-right>
<el-button type="primary" @click="handleImport">导入 </el-button>
</template>
</avue-crud>
<!-- 导入 -->
<basic-import
v-if="isShowImport"
title="导入"
:isShow="isShowImport"
templateUrl="/blade-desk/bsDosingRec/downloadExcelTemplate"
templateName="废气加药记录导入模板.xls"
importUrl="/blade-desk/bsDosingRec/importExcel"
@closeDialog="closeImportDialog"
:basicImportSearch="search"
></basic-import>
<!-- 新增弹窗 -->
<addEditDialogDosingRecord
v-if="addOpen"
:showDialog="addOpen"
@closeDialog="closeDialog"
:moldAddMore="moldAddMore"
:dosingManList="dosingManList"
@submitData="handleSubmitData"
>
</addEditDialogDosingRecord>
</div>
</template>
<script>
import basicImport from '@/components/basic-import/main.vue';
import addEditDialogDosingRecord from './addEditDialogDosingRecord.vue';
import {
getList,
remove,
add,
update,
getDosingManList,
} from '@/api/safetyManagement/dosingRecord.js';
export default {
components: {
basicImport,
addEditDialogDosingRecord,
},
data() {
return {
dosingManList: [],
addOpen: false, //新增弹窗
moldAddMore: false,
isShowImport: false,
loading: false,
selectionList: [],
search: {
dorType: '1',
},
option: {
addBtn: false,
height: 'auto',
calcHeight: 32,
tip: false,
simplePage: true,
searchShow: true,
searchMenuSpan: 6,
searchIcon: true,
searchIndex: 3,
tree: false,
border: true,
index: true,
selection: true,
viewBtn: false,
delBtn: true,
editBtnText: '修改',
addBtnIcon: ' ',
viewBtnIcon: ' ',
delBtnIcon: ' ',
editBtnIcon: ' ',
viewBtnText: '详情',
labelWidth: 120,
menuWidth: 100,
dialogWidth: 1040,
dialogClickModal: false,
searchEnter: true,
excelBtn: false,
filterBtn: true,
searchShowBtn: false,
columnSort: true,
excelBtn: true,
columnSort: true,
index: false,
showOverflowTooltip: true,
searchLabelPosition: 'left',
searchLabelPosition: 'left',
searchGutter: 24,
searchSpan: 6,
menuAlign: 'center',
gridBtn: false,
searchMenuPosition: 'right',
align: 'center',
column: [
{
label: '设施',
prop: 'device',
sortable: true,
filter: true,
span: 12,
search: true,
searchLabelWidth: 50,
rules: [
{
required: true,
message: '请输入设施',
trigger: 'blur',
},
],
},
{
label: '药品',
prop: 'drug',
search: true,
sortable: true,
filter: true,
span: 12,
searchLabelWidth: 50,
rules: [
{
required: true,
message: '请输入药品',
trigger: 'blur',
},
],
},
{
label: '剂量(kg)',
prop: 'dose',
search: true,
sortable: true,
filter: true,
span: 12,
searchLabelWidth: 70,
type: 'number',
rules: [
{
required: true,
message: '请输入剂量',
trigger: 'blur',
},
],
},
{
label: '加药时间',
prop: 'queryDosingTime',
search: true,
sortable: true,
filter: true,
display: false,
editDisplay: false,
hide: true,
span: 12,
type: 'datetime',
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
rules: [
{
required: true,
message: '请选择加药时间',
trigger: 'blur',
},
],
searchRange: true,
startPlaceholder: '开始时间',
endPlaceholder: '结束时间',
},
{
label: '加药时间',
prop: 'dosingTime',
sortable: true,
filter: true,
span: 12,
type: 'datetime',
format: 'YYYY-MM-DD HH:mm:ss',
valueFormat: 'YYYY-MM-DD HH:mm:ss',
rules: [
{
required: true,
message: '请选择加药时间',
trigger: 'blur',
},
],
},
{
label: '加药人',
prop: 'dosingMan',
search: true,
span: 12,
searchLabelWidth: 60,
sortable: true,
filter: true,
type: 'select',
dicData: [],
rules: [
{
required: true,
message: '请选择加药人',
trigger: 'blur',
},
],
props: {
label: 'name',
value: 'id',
},
},
{
label: '备注',
prop: 'memo',
search: false,
sortable: true,
filter: true,
span: 12,
},
],
},
form: {},
page: {
pageSize: 10,
currentPage: 1,
total: 0,
},
};
},
mounted() {
this.fetchDosingManList();
},
methods: {
// 加药人
fetchDosingManList() {
getDosingManList({
current: 1,
size: 10000000,
roleId: '2008474700619563009',
}).then(res => {
const result = res.data.data.records;
this.dosingManList = result;
console.log('加药人result', result);
this.option.column.forEach(col => {
if (col.prop === 'dosingMan') {
col.dicData = this.dosingManList;
}
});
});
},
// 新增
moldAddFn(row, flag) {
this.addOpen = true;
this.moldAddMore = flag;
},
//关闭弹窗
closeDialog() {
this.addOpen = false;
this.onLoad(this.page);
},
// 关闭导入弹窗
closeImportDialog() {
this.isShowImport = false; // 关闭导入弹窗
this.onLoad(this.page);
},
//更新
rowUpdate(row, index, done, loading) {
update(row).then(
() => {
this.onLoad(this.page);
this.$message({
type: 'success',
message: '操作成功!',
});
done();
},
error => {
window.console.log(error);
loading();
}
);
},
// 处理子组件提交的数据
handleSubmitData(data) {
add(data).then(
res => {
this.onLoad(this.page);
this.$message({
type: 'success',
message: '操作成功!',
});
this.addOpen = false;
done();
},
error => {
window.console.log(error);
loading();
}
);
},
// 点击导入按钮
handleImport() {
this.isShowImport = true;
},
//刷新
refreshChange() {
this.onLoad(this.page, this.query);
},
// 批量删除
handleBatchDelete() {
if (this.selectionList.length === 0) {
this.$message.error('请至少选择一条数据');
return;
}
this.$confirm('确定将选择数据删除?', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}).then(() => {
remove(this.selectionList.map(item => item.id).join(',')).then(res => {
this.$message.success('删除成功');
this.refreshChange();
});
});
},
handleDelete(row) {
this.$confirm('确定删除数据吗?', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}).then(() => {
remove(row.id).then(res => {
this.$message.success('删除成功');
this.refreshChange();
});
});
},
// 多选
selectionChange(list) {
this.selectionList = list;
},
//搜索
searchChange(params, done) {
this.query = params;
this.page.currentPage = 1;
this.onLoad(this.page, params);
done();
},
// 搜索重置
searchReset() {
this.query = {};
this.onLoad(this.page);
},
// 加载页面数据
onLoad(page, params = {}) {
this.loading = true;
this.query = { ...this.query, dorType: 1 }; //类型:1、废气加药;2、废水加药
const requestParams = Object.assign({}, params, this.query);
// 后端要字符串类型
if (requestParams.queryDosingTime && Array.isArray(requestParams.queryDosingTime)) {
requestParams.queryDosingTime = requestParams.queryDosingTime.join(',');
}
getList(page.currentPage, page.pageSize, Object.assign(params, requestParams))
.then(res => {
const data = res.data.data;
this.page.total = data.total;
this.data = data.records;
this.loading = false;
})
.catch(() => {
this.loading = false;
});
},
},
};
</script>
<style lang="scss" scoped></style>