作者 shenhailong

修改左侧菜单名称 完善电表实施信息loading加载

import axios from 'axios'
let base = 'empt-location/eeInfo';
export const getList = params => { return axios.get(`${base}/list`, { params: params }); };
\ No newline at end of file
... ...
... ... @@ -21,6 +21,7 @@ import Location from './views/empt/Location.vue'
import QueryOrder from './views/empt/QueryOrder.vue'
import PayOrder from './views/empt/PayOrder.vue'
import userPayOrder from './views/empt/userPayOrder.vue'
import eeInfo from "./views/empt/eeInfo";
let routes = [
{
... ... @@ -77,10 +78,11 @@ let routes = [
name: '能源管理',
iconCls: 'fa fa-id-card-o',
children: [
{ path: '/location', component: Location, name: '能源缴费' },
{ path: '/location', component: Location, name: '公寓管理' },
{ path: '/PayOrder', component: PayOrder, name: '缴水电费订单' },
{ path: '/userPayOrder', component: userPayOrder, name: '用户水电缴费' },
{ path: '/QueryOrder', component: QueryOrder, name: '订单查询' },
{ path: '/eeInfo', component: eeInfo, name: '电表充值信息' },
]
},
{
... ...
... ... @@ -21,9 +21,10 @@
row-key="id"
border
v-loading = "listLoading"
lazy
:load="load"
:row-class-name="tableRowClassName"
default-expand-all
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
:tree-props="{children: 'children', hasChildren: 'type'}">
<el-table-column
prop="adrname"
label="名称"
... ... @@ -258,7 +259,7 @@
<!--电表实时信息-->
<el-dialog title="电表实施信息" :visible.sync="electrixityeditFormVisible" :close-on-click-modal="false">
<el-form :model="electricityForm" label-width="100px" ref="waterMaterForm">
<el-form v-loading = "electrixityLoading" :model="electricityForm" label-width="100px" ref="waterMaterForm">
<el-form-item label="电表编号" prop="deviceId">
<el-input v-model="electricityForm.deviceId" auto-complete="off" ></el-input>
</el-form-item>
... ... @@ -310,7 +311,7 @@
</el-form-item>
<el-col v-if="waterNumber === 'waterNum'">
<el-form-item label="水表编号" prop="adrName">
<el-form-item label="水表编号" prop="wmid">
<el-select style="height: 38px; width: 100%"
v-model="editLocationForm.wmid"
filterable
... ... @@ -327,7 +328,9 @@
</el-select>
</el-form-item>
</el-col>
<el-form-item v-if="electricityNumber==='eeNum'" label="电表编号" prop="eeid">
<el-input v-model="editLocationForm.eeid" auto-complete="off" placeholder="请输入电表编号"></el-input>
</el-form-item>
... ... @@ -374,14 +377,15 @@
locationList:[],
total: 0,
pageNum: 1,
pageSize: 5,
pageSize: 30,
listLoading: false,
electrixityLoading: false,
waterNumber: undefined,
electricityNumber: undefined,
waterMeterList:[],
restaurants: [],
state4: '',
timeout: null,
sels: [],//列表选中列
//编辑界面是否显示
editFormVisible: false,
... ... @@ -501,7 +505,8 @@
adrname: '',
parent: '',
type:'',
wmid:''
wmid:'',
eeid:''
},
centerDialogVisible: false,
dialogData:{
... ... @@ -574,6 +579,7 @@
one: function(prepaid){
return prepaid?true:one='是'?false:one='否'
},
//类型显示转换
formatType: function (row, column) {
let msg = '未知';
... ... @@ -605,7 +611,8 @@
let para = {
pageNum: this.pageNum,
pageSize: this.pageSize,
processName: this.filters.processName
processName: this.filters.processName,
parent: 0
};
this.listLoading= true;
getList(para).then((res) => {
... ... @@ -625,8 +632,26 @@
}
});
},
load(tree, treeNode, resolve) {
setTimeout(() => {
// tree为点击那一行的数据
let para = {
pageNum: this.pageNum,
pageSize: this.pageSize,
parent: tree.id
}
getList(para).then((res) => {
let resData = res.data.data;
resolve(resData.list);
}).catch((error) => {
alert(error);
});
}, 1000)
},
//删除
handleDel: function (row) {
this.$confirm('确认删除该记录吗?', '提示', {
... ... @@ -661,12 +686,13 @@
* @param row 为这行的数据对象
*/
electrixityMeterEdit: function (row) {
this.electrixityeditFormVisible = true;
var ids = row.eeid;
let para = { eeId: ids };
// 查询电表参数配置表数据
this.electrixityeditFormVisible = true;
getEEModel(para).then((res) => {
this.electrixityeditForm = res.data;
this.electrixityeditFormVisible = false;
});
},
... ... @@ -734,6 +760,7 @@
this.editLocationForm = row;
if (row.type == 3){
this.waterNumber ='waterNum';
this.electricityNumber ='eeNum';
}
},
... ... @@ -824,11 +851,12 @@
// 电表实施信息查询
electicityInfo: function(row){
this.electrixityeditFormVisible=true;
this.electrixityLoading=true;
var eeId = row.eeid;
let para = { eeId: eeId};
electricityInfo(para).then((res) => {
this.electricityForm = res.data;
this.electrixityLoading = false;
});
},
... ...
<template>
<section>
<el-col :span="24" class="toolbar" style="padding-bottom: 0px">
<el-form :inline="true" :model="filters">
<el-form-item>
<el-input v-model="filters.deviceId" placeholder="设备编号"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" v-on:click="EeInfoQuery()">查询</el-button>
</el-form-item>
</el-form>
</el-col>
<el-table
v-loading="listLoading"
:data="eeInfoList"
stripe
style="width: 100%">
<el-table-column prop="orderNumber" label="订单号">
</el-table-column>
<el-table-column prop="actionType" label="充值类型">
<template slot-scope="scope">
<div v-if="scope.row.actionType === '0'" style="color:#20a0ff">充值</div>
<div v-else="scope.row.paytype === 1" style="color: #42d885">扣费</div>
</template>
</el-table-column>
<el-table-column prop="deviceId" label="设备编号">
</el-table-column>
<el-table-column prop="money" label="充值金额">
</el-table-column>
<el-table-column prop="status" label="充值状态">
<template slot-scope="scope">
<div v-if="scope.row.status === '0'" style="color:#42d885">成功</div>
<div v-else="scope.row.status === 1" style="color:#ff4d51">失败</div>
</template>
</el-table-column>
<el-table-column prop="opertTime" :formatter="dateForma" label="充值日期">
</el-table-column>
</el-table>
<!--工具条-->
<el-col :span="24" class="toolbar">
<el-pagination layout="total, prev, pager, next" @current-change="handleCurrentChange" :page-size="5" :total="total" style="float:right;">
</el-pagination>
</el-col>
</section>
</template>
<script>
import {getList} from "../../api/empt/eeInfo";
import moment from "moment";
export default {
data() {
return {
filters: {
deviceId: ''
},
total: 0,
pageNum: 1,
pageSize: 5,
eeInfoList: [],
listLoading: false
}
},
methods: {
handleCurrentChange(val) {
this.pageNum = val;
this.EeInfoQuery();
},
EeInfoQuery(){
let params = {
pageNum: this.pageNum,
pageSize: this.pageSize,
deviceId: this.filters.deviceId
};
this.listLoading = true;
getList(params).then(res=>{
let resData = res.data;
this.total = resData.total;
this.eeInfoList = resData.list;
this.listLoading = false;
}).catch((error) => {
if(null!= error.response && error.response!==undefined){
let status= error.response.status;
let msg = error.response.statusText;
this.listLoading = false;
alert(status+msg);
}else {
this.listLoading = false;
alert(error);
}
})
},
dateForma:function(row,column){
var date = row[column.property];
if(date == undefined){return ''};
return moment(date).format("YYYY-MM-DD HH:mm:ss")
}
},
mounted() {
this.EeInfoQuery();
}
}
</script>
<style scoped>
</style>
\ No newline at end of file
... ...
... ... @@ -131,13 +131,12 @@
}
},
methods:{
getdefaultData() {
let para = {
roomNumber: this.filters.roomNumber
};
this.loading=true;
this.electricityForm.balance="";
getList(para).then((res) => {
let resData = res.data;
if (resData.length > 0) {
... ... @@ -248,8 +247,6 @@
createSocket();
// 监听ws数据响应
const getDataFunc = function(e) {
console.log(e);
console.log(e.detail.data.data);
if (e.detail.data.data!==undefined){
let resultMessage = JSON.parse(e.detail.data.data);
if(resultMessage.orderNumber===res.data.data.orderNumber){
... ...