订单相关

src/apis/payment.js

@@ -1,7 +1,24 @@
 import request from '$project/utils/request'
 import Qs from 'qs';
 
+//订单列表
+export function orderList(params) {
 
+return request({
+		url: '/mobile/orderInfoApi/orderList',
+		data: Qs.stringify(params),
+		method: 'post',
+	})
+}
+//订单详情
+export function orderDetail(params) {
+
+   return request({
+   		url: '/mobile/orderInfoApi/orderDetail',
+   		data: Qs.stringify(params),
+   		method: 'post',
+   	})
+}
 
 //微信支付
 export function wxJsapiPay(params,code) {

src/projects/business/views/Master/Mine/Bill/Info.vue

@@ -42,7 +42,7 @@
 			</div>
 </div>
 </template>
-
+MasterMineBillInfo
 <script>
 </script>
 

src/projects/business/views/Master/Mine/Bill/List.vue

@@ -2,96 +2,162 @@
 <div>
     <header class="mui-bar mui-bar-nav">
 			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
-			<h1 class="mui-title">账单记录</h1>
+			<h1 class="mui-title">我的账单</h1>
+			<a class="mui-pull-right" href=""><span class="mui-icon iconfont icon-baobiao"></span>账单记录</a>
 		</header>
+	    <common @asynCallBack="asynCallBack"></common>
+    	<top-header :pageTitle="pageTitle" :rightLink="rightLink" :doRightLink="doRightLink"></top-header>
+
 		<div class="mui-content vongi-zd">
-			<div class="mui-content-padded">
-				<h5>本月</h5>
-			</div>
-			<ul class="mui-table-view vongi-zd-list">
-				<li class="mui-table-view-cell">
-					<a>
-						<div class="mui-media-object mui-pull-left">
-							<img src="~$project/assets/img/zd_dian.png">
-						</div>
-						<div class="mui-media-body">
-							<div class='mui-ellipsis flew-sp flew-items'>9月电费账单<span class="mui-h2">56.06</span></div>
-							<p>生活缴费</p>
-							<p>09-16 15:00</p>
-						</div>
-					</a>
-				</li>
-				<li class="mui-table-view-cell">
-					<a>
-						<div class="mui-media-object mui-pull-left">
-							<img src="~$project/assets/img/zd_shui.png">
-						</div>
-						<div class="mui-media-body">
-							<div class='mui-ellipsis flew-sp flew-items'>9月电费账单<span class="mui-h2">56.06</span></div>
-							<p>生活缴费</p>
-							<p>09-16 15:00</p>
-						</div>
-					</a>
-				</li>
-				<li class="mui-table-view-cell">
-					<a>
+			<ul class="mui-table-view">
+				<li class="mui-table-view-cell" v-for="mod in recordList">
+					<a @click="goto(mod.id)">
 						<div class="mui-media-object mui-pull-left">
-							<img src="~$project/assets/img/zd_fang.png">
+							<img :src="mod.iconPic">
 						</div>
 						<div class="mui-media-body">
-							<div class='mui-ellipsis flew-sp flew-items'>9月电费账单<span class="mui-h2">56.06</span></div>
-							<p>生活缴费</p>
-							<p>09-16 15:00</p>
-						</div>
-					</a>
-				</li>
-			</ul>
-			<div class="mui-content-padded">
-				<h5>九月</h5>
-			</div>
-			<ul class="mui-table-view vongi-zd-list">
-				<li class="mui-table-view-cell">
-					<a>
-						<div class="mui-media-object mui-pull-left">
-							<img src="~$project/assets/img/zd_dian.png">
-						</div>
-						<div class="mui-media-body">
-							<div class='mui-ellipsis flew-sp flew-items'>9月电费账单<span class="mui-h2">56.06</span></div>
-							<p>生活缴费</p>
-							<p>09-16 15:00</p>
-						</div>
-					</a>
-				</li>
-				<li class="mui-table-view-cell">
-					<a>
-						<div class="mui-media-object mui-pull-left">
-							<img src="~$project/assets/img/zd_shui.png">
-						</div>
-						<div class="mui-media-body">
-							<div class='mui-ellipsis flew-sp flew-items'>9月电费账单<span class="mui-h2">56.06</span></div>
-							<p>生活缴费</p>
-							<p>09-16 15:00</p>
-						</div>
-					</a>
-				</li>
-				<li class="mui-table-view-cell">
-					<a>
-						<div class="mui-media-object mui-pull-left">
-							<img src="~$project/assets/img/zd_fang.png">
-						</div>
-						<div class="mui-media-body">
-							<div class='mui-ellipsis flew-sp flew-items'>9月电费账单<span class="mui-h2">56.06</span></div>
-							<p>生活缴费</p>
-							<p>09-16 15:00</p>
+							<div class='flew-sp flew-items'>
+								<div class="mui-ellipsis mui-col-xs-8">{{mod.goodName}}</div><span :style="'color:'+mod.color" >{{mod.goodTypeName}}</span></div>
+							<div class='mui-ellipsis flew-sp mui-h2 flew-items'>{{mod.totalFee}}<span class="mui-h6">{{mod.createTime}}</span></div>
 						</div>
 					</a>
 				</li>
+
 			</ul>
+
 		</div>
 </div>
 </template>
 
 <script>
+	import * as API_Pay from '$project/apis/payment'
+	import Common from '$project/components/Common.vue'
+	import Loading from '$project/components/Loading.vue'
+	import TopHeader from '$project/components/TopHeader.vue'
+	import isReachBottom from '$project/utils/isReachBottom'
+	import NullList from '$project/components/NullList.vue'
+	import {
+
+		currentTimeStamp,
+		parseUnixTime
+	} from '$project/utils'
+	import {
+		mapGetters,
+		mapMutations
+	} from 'vuex'
+	export default {
+		name: 'MasterMineBillList',
+		components: {
+			Common,
+			Loading,
+			TopHeader,NullList
+		},
+		data() {
+			return {
+				pageTitle: '我的账单',
+
+				rightLink: {
+					show: true,
+					icon: 'icon-baobiao',
+					style: 'font-size:14px',
+					title: '账单记录'
+				},
+				isLoading: false,
+
+				listForm: {
+					pageIndex: 1,
+					pageSize: 20,
+ 					totalPage: 1,
+ 					status:10
+ 				},
+				recordList: [],
+ 				statusColor: ['colorf8b155', 'color55f868', 'colorfe616c','color999'],
+
+			}
+		},
+		created() {
+ 		},
+		methods: {
+	        //右上角点击事件
+			doRightLink() {
+				this.$router.push({
+					name: 'MasterMineBillList',
+					query: {
+ 					}
+				})
+			},
+			//info
+			goto(id) {
+
+				this.$router.push({
+					name: 'MasterMineBillPay',
+					query: {
+						id: id
+					}
+				})
+			},
+
+			//获取列表
+			getList() {
+				this.isLoading = true;
+				API_Pay.orderList(this.listForm).then(res => {
+					var response=res;
+					if (response) {
+						if (this.listForm.pageIndex == 1) {
+							this.recordList = response.data;
+							this.listForm.pageIndex = response.pageNumber;
+							this.listForm.totalPage = response.totalPage;
+						} else {
+							this.recordList = [
+								...this.recordList,
+								...response.data
+							];
+						}
+					}
+					this.listForm.pageIndex++;
+					this.isLoading = false;
+				}).catch(error => {
+					this.isLoading = false;
+					mui.toast(error);
+				})
+			},
+			//下拉事件
+			handleScrool() {
+				if (isReachBottom()) {
+					console.log('到达底部')
+					if (this.listForm.pageIndex <= this.listForm.totalPage && this.isLoading == false) {
+						this.getList();
+					} else {
+						return;
+					}
+				}
+			},
+
+			asynCallBack() {
+
+			},
+		},
+		mounted() {
+			this.getList();
+			//监控下拉加载事件
+			var _this = this;
+			window.addEventListener('scroll', _this.handleScrool);
+		},
+		destroyed() {
+			//销毁监听事件
+			var _this = this;
+			window.removeEventListener('scroll', _this.handleScrool);
+		},
+		computed: {
+			...mapGetters({
+				openId: 'wx_openid',
+				token: 'token',
+				person_data: 'person_data',
+				person_popedom: 'person_popedom',
+			})
+		},
+
+	}
 </script>
 
 <style scoped src="$project/assets/css/xpwyfyy.css"></style>

src/projects/business/views/Master/Mine/Bill/Pay.vue

@@ -4,14 +4,14 @@
 				<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
 				<h1 class="mui-title">收银台</h1>
 			</header>
-			<div class="mui-content vongi-qingjiadt margin60">
+			<div class="mui-content vongi-qingjiadt margin60"  >
 				<div class="vongi-cashier flew-sp">
 					<div class="vongi-zd flew-items">
 						<div class="mui-media-object">
-							<img src="~$project/assets/img/zd_dian.png">
+							<img :src="goodsTpey.iconPic">
 						</div>
 						<h3>
-							物业服务费
+							{{goodsTpey.goodsName}}
 						</h3>
 					</div>
 					<div class="vongi-cd-pay">
@@ -21,32 +21,21 @@
 				</div>
 				<form class="mui-input-group vongi-cd-payli">
 					<div class="mui-input-row flew-sp">
-						<h3>2021年物业管理费</h3>
-						<h3>1998.00</h3>
+						<h3>{{detail.body}}</h3>
+						<h3>￥{{detail.totalFee}}</h3>
 					</div>
-					<div class="mui-input-row">
-						<label>缴费单位</label>
-						<span>沙市花园XX物业</span>
-					</div>
-					<div class="mui-input-row">
-						<label>缴费户号</label>
-						<span>1-2-1101</span>
-					</div>
-					<div class="mui-input-row">
-						<label>户名</label>
-						<span>111</span>
-					</div>
-					<div class="mui-input-row">
-						<label>住址信息</label>
-						<span>沙市花园1-2-1101</span>
+					<div class="mui-input-row" v-for="(value,key,index)  in list">
+						<label>{{key}}</label>
+						<span>{{value}}</span>
 					</div>
+
 					<div class="mui-input-row">
 						<label>创建时间</label>
-						<span>2020-09-18 18:15</span>
+						<span>{{detail.createTime}}</span>
 					</div>
 					<div class="mui-input-row">
 						<label style="width:25%">订单号</label>
-						<span style="width:75%" class="mui-ellipsis">202009180000300018150060415263</span>
+						<span style="width:75%" class="mui-ellipsis">{{detail.outOrderNo}}</span>
 					</div>
 				</form>
 				<div class="mui-content-padded">
@@ -54,24 +43,174 @@
 				<form class="mui-input-group margin10">
 					<div class="mui-input-row mui-radio">
 						<label>微信支付</label>
-						<input name="radio1" type="radio">
+						<input name="radio1"  value="1" v-model="paytypeindex" type="radio">
 					</div>
 					<div class="mui-input-row mui-radio">
 						<label>支付宝支付</label>
-						<input name="radio1" type="radio" checked>
+						<input name="radio1"  value="2" v-model="paytypeindex" type="radio" checked>
 					</div>
 				</form>
 				<div class="vongi-cashier-btn-row">
 					<div class="vongi-cashier-btn-white">
-						<span>合计：<b class="colorfe616c">￥60.00</b></span>
-						<div class="vongi-cashier-btn">支付</div>
+						<span>合计：<b class="colorfe616c">￥{{detail.totalFee}}</b></span>
+						<div class="vongi-cashier-btn" v-if="detail.status=='1'" @click="submit">支付</div>
 					</div>
 				</div>
 			</div>
+			<img id="qrcode">
+           <loading :visible="isLoading"></loading>
+
 </div>
 </template>
 
+
 <script>
+	import * as API_Pay from '$project/apis/payment'
+	import Common from '$project/components/Common.vue'
+	import Loading from '$project/components/Loading.vue'
+	import TopHeader from '$project/components/TopHeader.vue'
+	require('$project/assets/js/mui.picker.min.js');
+	import QRCode from 'qrcodejs2'
+
+	import {
+		mapGetters,
+		mapMutations
+	} from 'vuex'
+	import {
+		wxPayJs
+	} from '$project/utils/wxpay'
+	import {
+
+		convertCanvasToImage,
+		currentTimeStamp,
+		parseUnixTime
+	} from '$project/utils'
+	export default {
+		name: 'MasterMineBillPay',
+		components: {
+			Common,
+			Loading,
+			TopHeader
+		},
+		data() {
+			return {
+				pageTitle: '收银台',
+				paytypeindex:"1",
+				paycode:'',
+				paytype:"微信支付",
+				qrCodeImg:"",
+				isLoading: false,
+				detail:{},
+
+				list:[],
+				goodsTpey:{},
+
+				id:''
+
+			}
+		},
+		created() {
+			this.id=this.$route.query.id;
+
+			},
+		methods:  {
+		getDetail(){
+	        	API_Pay.orderDetail({id:this.id}).then(res=>{
+                    this.detail=res.orderInfo;
+                    this.info=res.goodsTpey;
+                    this.goodsTpey=res.goodsTpey;
+
+                    this.list=JSON.parse(res.orderInfo.detail);
+        		}).catch(error => {
+
+        		})
+		},
+			selectPay() {
+				var picker = new mui.PopPicker();
+
+				picker.setData([{
+					text: "微信支付",
+					value: '1'
+				}
+					,
+					{
+						text: "支付宝扫码",
+						value: '2'
+					}
+					// ,
+					// {
+					// 	text: "现场支付",
+					// 	value: '0'
+					// }
+				]);
+
+				picker.show((selectItems) => {
+					this.paytypeindex=selectItems[0].value;
+					this.paytype=selectItems[0].text;
+				});
+			},
+			//提交表单
+			submit() {
+				this.isLoading=true;
+				if(this.paytypeindex=="1"){
+					API_Pay.wxJsapiPay(this.detail.id,'').then(data=>{
+
+						this.isLoading=false;
+						wxPayJs(data)
+					}).catch(error => {
+						this.isLoading = false;
+						mui.toast(error);
+					})
+
+				}else if(this.paytypeindex=="2"){
+					API_Pay.tradePrecreatePay(this.detail.id,'').then(url=>{
+						this.isLoading = false;
+						let qrcode = new QRCode('qrcode', {
+							width: 200,
+							height: 200,
+							text: url,
+							correctLevel: QRCode.CorrectLevel.M,
+
+						})
+						var canvas = document.getElementsByTagName('canvas')[0];
+						this.qrCodeImg = convertCanvasToImage(canvas);
+
+						var btnArray = ['关闭',"支付成功?"];
+						var _this=this
+						mui.confirm('<img src="'+this.qrCodeImg+'" >',
+
+								'请使用支付宝扫码', btnArray, function(e) {
+									if (e.index == 1) {
+										_this.$router.push({
+											name: 'MasterMineBillList',
+										})
+									}
+
+								})
+					}).catch(error => {
+						this.isLoading = false;
+						mui.toast(error);
+					})
+				}
+
+
+			},asynCallBack(){},
+		},
+		mounted() {
+            this.getDetail();
+		},
+		destroyed() {
+
+		},
+		computed: {
+			...mapGetters({
+				openId: 'wx_openid',
+				token: 'token',
+				person_data: 'person_data',
+				person_popedom: 'person_popedom',
+			})
+		}
+	}
 </script>
 
 <style scoped src="$project/assets/css/xpwyfyy.css"></style>

src/projects/business/views/Master/Mine/Bill/Record.vue

@@ -2,20 +2,22 @@
 <div>
     <header class="mui-bar mui-bar-nav">
 			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
-			<h1 class="mui-title">我的账单</h1>
-			<a class="mui-pull-right" href=""><span class="mui-icon iconfont icon-baobiao"></span>账单记录</a>
+			<h1 class="mui-title">账单记录</h1>
 		</header>
 		<div class="mui-content vongi-zd">
-			<ul class="mui-table-view">
+			<div class="mui-content-padded">
+				<h5>本月</h5>
+			</div>
+			<ul class="mui-table-view vongi-zd-list">
 				<li class="mui-table-view-cell">
 					<a>
 						<div class="mui-media-object mui-pull-left">
 							<img src="~$project/assets/img/zd_dian.png">
 						</div>
 						<div class="mui-media-body">
-							<div class='flew-sp flew-items'>
-								<div class="mui-ellipsis mui-col-xs-8">2021年沙市花园车位租赁费花园车位租赁费</div><span class="colorf8b155">电费</span></div>
-							<div class='mui-ellipsis flew-sp mui-h2 flew-items'>56.06<span class="mui-h6">09-16 14:00</span></div>
+							<div class='mui-ellipsis flew-sp flew-items'>9月电费账单<span class="mui-h2">56.06</span></div>
+							<p>生活缴费</p>
+							<p>09-16 15:00</p>
 						</div>
 					</a>
 				</li>
@@ -25,9 +27,9 @@
 							<img src="~$project/assets/img/zd_shui.png">
 						</div>
 						<div class="mui-media-body">
-							<div class='flew-sp flew-items'>
-								<div class="mui-ellipsis mui-col-xs-8">2021年沙市花园车位租赁费花园车位租赁费</div><span class="color4fc5f7">水费</span></div>
-							<div class='mui-ellipsis flew-sp mui-h2 flew-items'>56.06<span class="mui-h6">09-16 14:00</span></div>
+							<div class='mui-ellipsis flew-sp flew-items'>9月电费账单<span class="mui-h2">56.06</span></div>
+							<p>生活缴费</p>
+							<p>09-16 15:00</p>
 						</div>
 					</a>
 				</li>
@@ -37,57 +39,61 @@
 							<img src="~$project/assets/img/zd_fang.png">
 						</div>
 						<div class="mui-media-body">
-							<div class='flew-sp flew-items'>
-								<div class="mui-ellipsis mui-col-xs-8">2021年沙市花园车位租赁费花园车位租赁费</div><span class="colorfe616c">房租</span></div>
-							<div class='mui-ellipsis flew-sp mui-h2 flew-items'>56.06<span class="mui-h6">09-16 14:00</span></div>
+							<div class='mui-ellipsis flew-sp flew-items'>9月电费账单<span class="mui-h2">56.06</span></div>
+							<p>生活缴费</p>
+							<p>09-16 15:00</p>
 						</div>
 					</a>
 				</li>
+			</ul>
+			<div class="mui-content-padded">
+				<h5>九月</h5>
+			</div>
+			<ul class="mui-table-view vongi-zd-list">
 				<li class="mui-table-view-cell">
 					<a>
 						<div class="mui-media-object mui-pull-left">
-							<img src="~$project/assets/img/zd_car.png">
+							<img src="~$project/assets/img/zd_dian.png">
 						</div>
 						<div class="mui-media-body">
-							<div class='flew-sp flew-items'>
-								<div class="mui-ellipsis mui-col-xs-8">2021年沙市花园车位租赁费花园车位租赁费</div><span class="color4359DB">车位费</span></div>
-							<div class='mui-ellipsis flew-sp mui-h2 flew-items'>56.06<span class="mui-h6">09-16 14:00</span></div>
+							<div class='mui-ellipsis flew-sp flew-items'>9月电费账单<span class="mui-h2">56.06</span></div>
+							<p>生活缴费</p>
+							<p>09-16 15:00</p>
 						</div>
 					</a>
 				</li>
 				<li class="mui-table-view-cell">
 					<a>
 						<div class="mui-media-object mui-pull-left">
-							<img src="~$project/assets/img/zd_admin.png">
+							<img src="~$project/assets/img/zd_shui.png">
 						</div>
 						<div class="mui-media-body">
-							<div class='flew-sp flew-items'>
-								<div class="mui-ellipsis mui-col-xs-8">2021年沙市花园车位租赁费花园车位租赁费</div><span class="color55f868">物业管理费</span></div>
-							<div class='mui-ellipsis flew-sp mui-h2 flew-items'>56.06<span class="mui-h6">09-16 14:00</span></div>
+							<div class='mui-ellipsis flew-sp flew-items'>9月电费账单<span class="mui-h2">56.06</span></div>
+							<p>生活缴费</p>
+							<p>09-16 15:00</p>
 						</div>
 					</a>
 				</li>
 				<li class="mui-table-view-cell">
 					<a>
 						<div class="mui-media-object mui-pull-left">
-							<img src="~$project/assets/img/zd_prsion.png">
+							<img src="~$project/assets/img/zd_fang.png">
 						</div>
 						<div class="mui-media-body">
-							<div class='flew-sp flew-items'>
-								<div class="mui-ellipsis mui-col-xs-8">2021年沙市花园车位租赁费花园车位租赁费</div><span class="colorfe616c">养老服务费</span></div>
-							<div class='mui-ellipsis flew-sp mui-h2 flew-items'>56.06<span class="mui-h6">09-16 14:00</span></div>
+							<div class='mui-ellipsis flew-sp flew-items'>9月电费账单<span class="mui-h2">56.06</span></div>
+							<p>生活缴费</p>
+							<p>09-16 15:00</p>
 						</div>
 					</a>
 				</li>
 			</ul>
-
 		</div>
 </div>
 </template>
 
 <script>
 </script>
-
+MasterMineBillRecord
 <style scoped src="$project/assets/css/xpwyfyy.css"></style>
 <style src="$project/assets/css/iconfont.css"></style>
 <style>

src/projects/business/views/Master/Property/Car/Info.vue

@@ -176,12 +176,12 @@
 					{
 						text:'线下收款',value:'1'
 					}
-
+                    ,
+                    {
+                        text:'推送账单',value:'2'
+                    }
 				]);
-			// ,
-			// 	{
-			// 		text:'推送账单',value:'2'
-			// 	}
+
 				picker.show((selectItems) => {
 					this.payType = selectItems[0].value;
 					this.payTypeN = selectItems[0].text;
@@ -205,7 +205,8 @@
 					})
 				}
 				if(this.payType ==2){
-
+				    var url = window.location.href.split("#")[0];
+                    this.detail.url=url+"#/master/mine/bill/pay?id=";
 					API.ParkingApplicationSendOrder(this.detail).then(res => {
 						mui.toast("操作成功");
 						this.getDetail()