朱兆平 / vue_cli · 提交

转到一个项目

作者 shenhailong
提交 1d44de77f143571a151cfbf70e9810585d5cafcf 1 个父辈 77389fe5

修改 服务url 完善用户充值页面 订单查询

内嵌 并排对比
正在显示 11 个修改的文件 包含 484 行增加 和 11 行删除
@@ -33,7 +33,7 @@ module.exports = { @@ -33,7 +33,7 @@ module.exports = {
33 // target: 'http://192.168.43.78:12343',//设置你调用的接口域名和端口号 别忘了加http 33 // target: 'http://192.168.43.78:12343',//设置你调用的接口域名和端口号 别忘了加http
34 changeOrigin: true, 34 changeOrigin: true,
35 pathRewrite: { 35 pathRewrite: {
36 - '^/api': '/'//这里理解成用‘/api’代替target里面的地址，后面组件中我们掉接口时直接用api代替 比如我要调用'http://40.00.100.100:3002/user/add'，直接写‘/api/user/add’即可 36 + '^/api/': '/'//这里理解成用‘/api’代替target里面的地址，后面组件中我们掉接口时直接用api代替 比如我要调用'http://40.00.100.100:3002/user/add'，直接写‘/api/user/add’即可
37 } 37 }
38 } 38 }
39 }, 39 },
1 import axios from 'axios' 1 import axios from 'axios'
2 2
3 -let base = 'empt-electricity-meter/order'; 3 +let base = 'empt-location/order';
4 4
5 export const getOrder = params => { return axios.get(`${base}/list`, { params: params }); }; 5 export const getOrder = params => { return axios.get(`${base}/list`, { params: params }); };
6 6
  1 +import axios from 'axios'
  2 +
  3 +let base = 'empt-location/queryWater';
  4 +
  5 +export const getWater = params => { return axios.get(`${base}/list`, { params: params }); };
  6 +
  7 +export const addOrder=params=>{return http.post(`${base}/add`, params);};
  8 +
  9 +export const ediOrder=params=>{return http.put(`${base}/edi`, params);};
  10 +
  11 +export const remove = params => { return axios({
  12 + method: 'DELETE',
  13 + url: `${base}/del`,
  14 + data: params,
  15 + headers: {
  16 + 'Content-Type': 'application/json;charset=UTF-8'
  17 + }
  18 +})};
1 import axios from 'axios' 1 import axios from 'axios'
2 2
3 -let base = 'empt-electricity-meter/electricity_meter'; 3 +let base = 'empt-location/electricity_meter';
4 4
5 5
6 export const getList = params => { return axios.get(`${base}/list`, { params: params }); }; 6 export const getList = params => { return axios.get(`${base}/list`, { params: params }); };
  1 +import axios from 'axios'
  2 +
  3 +let base = 'empt-location/userPayOrder';
  4 +
  5 +
  6 +export const getList = params => { return axios.get(`${base}/list`, { params: params }); };
  7 +
  8 +
  9 +export const remove = params => { return axios({
  10 + method: 'DELETE',
  11 + url: `${base}/del`,
  12 + data: params,
  13 + headers: {
  14 + 'Content-Type': 'application/json;charset=UTF-8'
  15 + }
  16 +})};
  17 +
  18 +//批量删除
  19 +export const batchRemove = params => { return axios.get(`${base}/batchremove`, { params: params }); };
  20 +
  21 +export const edit = params => { return axios({
  22 + method: 'PUT',
  23 + url: `${base}/edit`,
  24 + data: params,
  25 + headers: {
  26 + 'Content-Type': 'application/json;charset=UTF-8'
  27 + }
  28 +})};
  29 +
  30 +export const add = params => { return axios({
  31 + method: 'POST',
  32 + url: `${base}/add`,
  33 + params: params,
  34 + headers: {
  35 + 'Content-Type': 'application/json;charset=UTF-8'
  36 + }
  37 +})};
  38 +
  39 +export const update = params => { return axios({
  40 + method: 'PUT',
  41 + url: `${base}/update`,
  42 + data: params,
  43 + headers: {
  44 + 'Content-Type': 'application/json;charset=UTF-8'
  45 + }
  46 +})};
1 import axios from 'axios' 1 import axios from 'axios'
2 2
3 -let base = 'empt-electricity-meter/water_meter'; 3 +let base = 'empt-location/water_meter';
4 4
5 5
6 export const getList = params => { return axios.get(`${base}/list`, { params: params }); }; 6 export const getList = params => { return axios.get(`${base}/list`, { params: params }); };
@@ -2,11 +2,9 @@ import Login from './views/Login.vue' @@ -2,11 +2,9 @@ import Login from './views/Login.vue'
2 import NotFound from './views/404.vue' 2 import NotFound from './views/404.vue'
3 import Home from './views/Home.vue' 3 import Home from './views/Home.vue'
4 import Main from './views/Main.vue' 4 import Main from './views/Main.vue'
5 -// import Table from './views/nav1/Table.vue'  
6 import Role from './views/nav1/role.vue' 5 import Role from './views/nav1/role.vue'
7 import Perm from './views/nav1/perm.vue' 6 import Perm from './views/nav1/perm.vue'
8 import LOG from './views/nav1/Log.vue' 7 import LOG from './views/nav1/Log.vue'
9 -import PreManifest from './views/agent/PreManifest.vue'  
10 import Company from './views/nav1/company.vue' 8 import Company from './views/nav1/company.vue'
11 import Department from './views/nav1/department.vue' 9 import Department from './views/nav1/department.vue'
12 import Group from './views/nav1/groupcompany.vue' 10 import Group from './views/nav1/groupcompany.vue'
@@ -22,6 +20,8 @@ import Maintain from './views/staff/maintain.vue' @@ -22,6 +20,8 @@ import Maintain from './views/staff/maintain.vue'
22 import Location from './views/empt/Location.vue' 20 import Location from './views/empt/Location.vue'
23 import QueryOrder from './views/empt/QueryOrder.vue' 21 import QueryOrder from './views/empt/QueryOrder.vue'
24 import PayOrder from './views/empt/PayOrder.vue' 22 import PayOrder from './views/empt/PayOrder.vue'
  23 +import userPayOrder from './views/empt/userPayOrder.vue'
  24 +import QueryWater from './views/empt/QueryWater.vue'
25 25
26 let routes = [ 26 let routes = [
27 { 27 {
@@ -80,7 +80,9 @@ let routes = [ @@ -80,7 +80,9 @@ let routes = [
80 children: [ 80 children: [
81 { path: '/location', component: Location, name: '能源缴费' }, 81 { path: '/location', component: Location, name: '能源缴费' },
82 { path: '/PayOrder', component: PayOrder, name: '缴水电费订单' }, 82 { path: '/PayOrder', component: PayOrder, name: '缴水电费订单' },
  83 + { path: '/userPayOrder', component: userPayOrder, name: '用户水电缴费' },
83 { path: '/QueryOrder', component: QueryOrder, name: '订单查询' }, 84 { path: '/QueryOrder', component: QueryOrder, name: '订单查询' },
  85 + { path: '/QueryWater', component: QueryWater, name: '水表实施信息' },
84 ] 86 ]
85 }, 87 },
86 { 88 {
@@ -542,7 +542,8 @@ @@ -542,7 +542,8 @@
542 water: '', 542 water: '',
543 free: '', 543 free: '',
544 freeWater: '', 544 freeWater: '',
545 - eeId: row.eeid 545 + eeId: row.eeid,
  546 + reamke2:row.adrname
546 } 547 }
547 }, 548 },
548 549
@@ -9,10 +9,9 @@ @@ -9,10 +9,9 @@
9 <div class="block"> 9 <div class="block">
10 <el-date-picker 10 <el-date-picker
11 v-model="filters.payTime" 11 v-model="filters.payTime"
12 - type="daterange"  
13 - align="right" 12 + type="datetimerange"
14 unlink-panels 13 unlink-panels
15 - value-format="yyyy-MM-dd" 14 + value-format="yyyy-MM-dd HH:mm:ss"
16 range-separator="至" 15 range-separator="至"
17 start-placeholder="开始日期" 16 start-placeholder="开始日期"
18 end-placeholder="结束日期" 17 end-placeholder="结束日期"
@@ -103,7 +102,8 @@ @@ -103,7 +102,8 @@
103 data() { 102 data() {
104 return { 103 return {
105 filters: { 104 filters: {
106 - orderNumber: '' 105 + orderNumber: '',
  106 + payTime:''
107 }, 107 },
108 total: 0, 108 total: 0,
109 pageNum: 1, 109 pageNum: 1,
@@ -152,10 +152,18 @@ @@ -152,10 +152,18 @@
152 this.pageNum = val; 152 this.pageNum = val;
153 }, 153 },
154 QueryOrder(){ 154 QueryOrder(){
  155 +
  156 + // 清空后为null 问题
  157 + var payTimes = '';
  158 + if (this.filters.payTime!==null){
  159 + payTimes = this.filters.payTime[0]+','+this.filters.payTime[1]
  160 + }
155 let params = { 161 let params = {
156 pageNum: this.pageNum, 162 pageNum: this.pageNum,
157 pageSize: this.pageSize, 163 pageSize: this.pageSize,
158 orderNumber: this.filters.orderNumber, 164 orderNumber: this.filters.orderNumber,
  165 + payTime: payTimes,
  166 +
159 }; 167 };
160 getOrder(params).then(res=>{ 168 getOrder(params).then(res=>{
161 let resData = res.data; 169 let resData = res.data;
  1 +<template>
  2 + <section>
  3 + <el-col :span="24" class="toolbar" style="padding-bottom: 0px">
  4 + <el-form :inline="true" :model="filters">
  5 + <el-form-item>
  6 + <el-input v-model="filters.orderNumber" placeholder="订单号"></el-input>
  7 + </el-form-item>
  8 + <el-form-item>
  9 + <div class="block">
  10 + <el-date-picker
  11 + v-model="filters.payTime"
  12 + type="datetimerange"
  13 + unlink-panels
  14 + value-format="yyyy-MM-dd HH:mm:ss"
  15 + range-separator="至"
  16 + start-placeholder="开始日期"
  17 + end-placeholder="结束日期"
  18 + :picker-options="pickerOptions">
  19 + </el-date-picker>
  20 + </div>
  21 + </el-form-item>
  22 + <el-form-item>
  23 + <el-button type="primary" v-on:click="QueryOrder()">查询</el-button>
  24 + </el-form-item>
  25 + </el-form>
  26 + </el-col>
  27 + <el-table
  28 + :data="tableData"
  29 + stripe
  30 + style="width: 100%">
  31 + <el-table-column prop="ordernumber" label="订单号" width="180">
  32 + </el-table-column>
  33 + <el-table-column
  34 + prop="payuserid"
  35 + label="用户编号"
  36 + width="100">
  37 + </el-table-column>
  38 + <el-table-column
  39 + prop="payusername"
  40 + label="用户名称"
  41 + width="90">
  42 + </el-table-column>
  43 + <el-table-column
  44 + prop="paylocationname"
  45 + label="房间号码"
  46 + width="100">
  47 + </el-table-column>
  48 + <el-table-column
  49 + prop="paytime"
  50 + label="充值日期"
  51 + width="160">
  52 + </el-table-column>
  53 + <el-table-column
  54 + prop="payfees"
  55 + label="充值金额"
  56 + width="100">
  57 + </el-table-column>
  58 + <el-table-column prop="paytype" label="充值类型" width="100">
  59 + <template slot-scope="scope">
  60 + <div v-if="scope.row.paytype === false" style="color:#20a0ff">水</div>
  61 + <div v-else="scope.row.paytype === true" style="color: #42d885">电</div>
  62 + </template>
  63 + </el-table-column>
  64 +
  65 + <el-table-column prop="payfesstype" label="支付方式" width="100">
  66 + <template slot-scope="scope">
  67 + <div v-if="scope.row.payfesstype === false" style="color:#42d885">微信</div>
  68 + <div v-else="scope.row.payfesstype === true" style="color: #20a0ff">支付宝</div>
  69 + </template>
  70 + </el-table-column>
  71 + <el-table-column prop="paystatus" label="支付状态" width="100">
  72 + <template slot-scope="scope">
  73 + <div v-if="scope.row.payfesstype === false" style="color:#ff4d51">未完成</div>
  74 + <div v-else="scope.row.payfesstype === true" style="color: #42d885">已完成</div>
  75 + </template>
  76 + </el-table-column>
  77 + <el-table-column
  78 + fixed="right"
  79 + label="操作"
  80 + >
  81 + <template slot-scope="scope" align="center" class-name="small-padding fixed-width" >
  82 + <el-button @click="Pay(scope.row)" type="primary" size="mini">去完成</el-button>
  83 + <el-button type="primary" @click="payDelete(scope.$index,scope.row)" size="small">移除订单</el-button>
  84 + </template>
  85 + </el-table-column>
  86 + </el-table>
  87 +
  88 + <!--工具条-->
  89 + <el-col :span="24" class="toolbar">
  90 + <!--<el-button type="danger" @click="batchRemove" :disabled="this.sels.length===0">批量删除</el-button>-->
  91 + <el-pagination layout="total, prev, pager, next" @current-change="handleCurrentChange" :page-size="5" :total="total" style="float:right;">
  92 + </el-pagination>
  93 + </el-col>
  94 +
  95 + </section>
  96 +</template>
  97 +<script>
  98 + import { getWater,addOrder,ediOrder,remove} from '../../api/empt/PayWater';
  99 + import ElButton from "../../../node_modules/element-ui/packages/button/src/button.vue";
  100 + export default {
  101 + components: {ElButton},
  102 + data() {
  103 + return {
  104 + filters: {
  105 + orderNumber: '',
  106 + payTime:''
  107 + },
  108 + total: 0,
  109 + pageNum: 1,
  110 + pageSize: 5,
  111 +
  112 + pickerOptions: {
  113 + shortcuts: [{
  114 + text: '最近一周',
  115 + onClick(picker) {
  116 + const end = new Date();
  117 + const start = new Date();
  118 + start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
  119 + picker.$emit('pick', [start, end]);
  120 + }
  121 + }, {
  122 + text: '最近一个月',
  123 + onClick(picker) {
  124 + const end = new Date();
  125 + const start = new Date();
  126 + start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
  127 + picker.$emit('pick', [start, end]);
  128 + }
  129 + }, {
  130 + text: '最近三个月',
  131 + onClick(picker) {
  132 + const end = new Date();
  133 + const start = new Date();
  134 + start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
  135 + picker.$emit('pick', [start, end]);
  136 + }
  137 + }]},
  138 + formInline: {
  139 + user: '',
  140 + date1:'',
  141 +
  142 + },
  143 + tableData: [],
  144 + }
  145 + },
  146 + mounted() {
  147 + this.QueryOrder();
  148 + },
  149 + methods: {
  150 +
  151 + handleCurrentChange(val) {
  152 + this.pageNum = val;
  153 + },
  154 + QueryOrder(){
  155 +
  156 + // 清空后为null 问题
  157 + var payTimes = '';
  158 + if (this.filters.payTime!==null){
  159 + payTimes = this.filters.payTime[0]+','+this.filters.payTime[1]
  160 + }
  161 + let params = {
  162 + pageNum: this.pageNum,
  163 + pageSize: this.pageSize,
  164 + orderNumber: this.filters.orderNumber,
  165 + payTime: payTimes,
  166 +
  167 + };
  168 + getOrder(params).then(res=>{
  169 + let resData = res.data;
  170 + this.total = resData.total;
  171 + this.tableData = resData.list;
  172 + }).catch((error) => {
  173 + if(null!= error.response && error.response!==undefined){
  174 + let status= error.response.status;
  175 + let msg = error.response.statusText;
  176 + alert(status+msg);
  177 + }else {
  178 + alert(error);
  179 + }
  180 + })
  181 + },
  182 +
  183 + //删除
  184 + payDelete: function (index, row) {
  185 + this.$confirm('确认移出该订单吗?', '提示', {
  186 + type: 'warning'
  187 + }).then(() => {
  188 + this.listLoading = true;
  189 + let para = { id: row.id };
  190 + remove(para).then((res) => {
  191 + this.listLoading = false;
  192 + //NProgress.done();
  193 + this.$message({
  194 + message: '移出成功',
  195 + type: 'success'
  196 + });
  197 + this.QueryOrder();
  198 + }).catch((error) => {
  199 + this.listLoading = false;
  200 + alert(error);
  201 + });
  202 + }).catch();
  203 + },
  204 +
  205 + Pay(row){
  206 + this.$router.push({name:'缴水电费订单',params:{row,Edistatus:'update'}})
  207 + },
  208 + },
  209 +
  210 + }
  211 +</script>
  1 +<template>
  2 + <el-container>
  3 + <el-main >
  4 + <el-row type="flex" class="row-bg" justify="center">
  5 + <el-col :span="20">
  6 + <div style="background-color: mediumseagreen; height: 45px; color: #e6f1fe;">
  7 + <h2>&nbsp;&nbsp;查询房间号</h2>
  8 + </div>
  9 + <br/>
  10 + <el-form :inline="true" :model="filters">
  11 + <el-form-item prop="roomNumber">
  12 + <el-input style="width: 700px" v-model="filters.roomNumber" placeholder="房间号"></el-input>
  13 + <br/><br/>
  14 + <el-button style="width: 150px" type="primary" v-on:click="getdefaultData()">查询</el-button>
  15 + </el-form-item>
  16 + </el-form>
  17 +
  18 + <el-form :model="userPayForm" :rules="rules" ref="userPayForm" label-width="180px" :label-position="labelPosition">
  19 + <el-col :span="24">
  20 + <el-form-item label="透支电费">
  21 + <el-input disabled="" style="width: 100px" v-model="userPayForm.overdraftthreshold"></el-input>&nbsp;元
  22 + </el-form-item>
  23 +
  24 +
  25 + </el-col>
  26 + <el-col :span="24">
  27 + <el-form-item label="状态">
  28 + <el-input disabled="" style="width: 100px" v-model="userPayForm.payUserName"></el-input>
  29 + </el-form-item>
  30 + </el-col>
  31 + <el-col :span="24">
  32 + <el-form-item label="剩余电费">
  33 + <el-input disabled="" style="width: 100px" v-model="userPayForm.payLocationName"></el-input>
  34 + </el-form-item>
  35 + </el-col>
  36 +
  37 + <el-col :span="24">
  38 + <el-form-item label="充值日期">
  39 + <el-date-picker type="date" placeholder="" v-model="userPayForm.payTime" disabled="" style="width: 200px;" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
  40 + </el-form-item>
  41 + </el-col>
  42 + <el-col :span="24">
  43 + <el-form-item v-if="Edistatus=='create'" label="充值金额" prop="payFees">
  44 + <el-input type="number" oninput ="value=value.replace(/[^0-9.]/g,'')" v-model.number="userPayForm.payFees"></el-input>
  45 + </el-form-item>
  46 + <el-form-item v-else label="充值金额" prop="payFees">
  47 + <el-input type="number" oninput ="value=value.replace(/[^0-9]/g,'')" v-model.number="userPayForm.payFees"></el-input>
  48 + </el-form-item>
  49 + </el-col>
  50 + </el-form>
  51 +
  52 + <el-form :model="waterForm" :rules="rules" ref="userPayForm" label-width="180px" :label-position="labelPosition">
  53 + <el-col :span="24">
  54 + <el-form-item label="透支水费">
  55 + <el-input disabled="" style="width: 100px" v-model="waterForm.overdraftthreshold"></el-input>&nbsp;元
  56 + </el-form-item>
  57 +
  58 +
  59 + </el-col>
  60 + <el-col :span="24">
  61 + <el-form-item label="状态">
  62 + <el-input disabled="" style="width: 100px" v-model="waterForm.payUserName"></el-input>
  63 + </el-form-item>
  64 + </el-col>
  65 + <el-col :span="24">
  66 + <el-form-item label="剩余水费">
  67 + <el-input disabled="" style="width: 100px" v-model="waterForm.payLocationName"></el-input>
  68 + </el-form-item>
  69 + </el-col>
  70 +
  71 + <el-col :span="24">
  72 + <el-form-item label="充值日期">
  73 + <el-date-picker type="date" placeholder="" v-model="waterForm.payTime" disabled="" style="width: 200px;" value-format="yyyy-MM-dd HH:mm:ss"></el-date-picker>
  74 + </el-form-item>
  75 + </el-col>
  76 + <el-col :span="24">
  77 + <el-form-item v-if="Edistatus=='create'" label="充值金额" prop="payFees">
  78 + <el-input type="number" oninput ="value=value.replace(/[^0-9.]/g,'')" v-model.number="waterForm.payFees"></el-input>
  79 + </el-form-item>
  80 + <el-form-item v-else label="充值金额" prop="payFees">
  81 + <el-input type="number" oninput ="value=value.replace(/[^0-9]/g,'')" v-model.number="waterForm.payFees"></el-input>
  82 + </el-form-item>
  83 + </el-col>
  84 + </el-form>
  85 + </el-col>
  86 +
  87 +
  88 + </el-row>
  89 + </el-main>
  90 + </el-container>
  91 +</template>
  92 +<style scoped>
  93 +
  94 +</style>
  95 +<script>
  96 + import loginUserInfo from '@/api/base'
  97 + import {getList} from '../../api/empt/userPayOrder';
  98 +
  99 + export default {
  100 + data() {
  101 + return{
  102 + filters:{
  103 + roomNumber:''
  104 + },
  105 +
  106 + userPayForm:{
  107 + overdraftthreshold:'',
  108 + payTime:'',
  109 + },
  110 + waterForm:{
  111 + overdraftthreshold:'',
  112 + payTime:'',
  113 + },
  114 + rules:{
  115 + payType: [
  116 + { required: true, message: '请选择充值类型', trigger: 'change' }
  117 + ],
  118 + payFees:[
  119 + { required: true, message: '充值金额不能为空'},
  120 + { type: 'number', message: '金额必须为数字值'}
  121 + ],
  122 +
  123 + },
  124 +
  125 + labelPosition:'left',
  126 + Edistatus:'',
  127 + shuibiao:'',
  128 + dianbiao:''
  129 + }
  130 + },
  131 + methods:{
  132 +
  133 + getdefaultData(){
  134 +
  135 + let para = {
  136 + roomNumber: this.filters.roomNumber
  137 + };
  138 +
  139 +
  140 + getList(para).then((res) => {
  141 + let resData = res.data;
  142 + if (resData.length>0){
  143 + for(var i=0; i<resData.length; i++){
  144 + if(resData[i].wmId === null){
  145 +
  146 + this.userPayForm = resData[i];
  147 + this.userPayForm.payTime = new Date();
  148 + }else {
  149 + this.waterForm = resData[i];
  150 + this.waterForm.payTime = new Date();
  151 + }
  152 + }
  153 + }else {
  154 + this.$alert('请输入正确的房间号', '提示', {
  155 + confirmButtonText: '确定',
  156 + callback: action => {
  157 + }
  158 + });
  159 + }
  160 +
  161 +
  162 + this.listLoading = false;
  163 + //NProgress.done();
  164 + }).catch((error) => {
  165 + this.listLoading = false;
  166 + if(null!= error.response && error.response!==undefined){
  167 + let status= error.response.status;
  168 + let msg = error.response.statusText;
  169 + alert("请输入所查询的房号1");
  170 + }else {
  171 + this.$alert('请输入房间号', '提示', {
  172 + confirmButtonText: '确定',
  173 +
  174 + });
  175 + }
  176 +
  177 + });
  178 +
  179 +
  180 + },
  181 +
  182 + },
  183 + mounted(){
  184 +
  185 + }
  186 + }
  187 +</script>