Browse Source

历史对账单

chenrui 2 years ago
parent
commit
af12f005e3
2 changed files with 348 additions and 11 deletions
  1. 49 11
      pages/sales/billHistoryDetail.vue
  2. 299 0
      pages/sales/billHistoryEdit.vue

+ 49 - 11
pages/sales/billHistoryDetail.vue

@@ -50,29 +50,42 @@
 				</view>
 			</view>
 		</view>
-		<view class="detail_con"><billList ref="billBox" :list="billArr" :showCheck="isShowEdit"></billList></view>
+		<view class="detail_con"><billList ref="billBox" :list="billArr"></billList></view>
 		<view class="footer flex align_center" v-if="billInfo.billStatus == 'UNSETTLE'">
-			<view style="flex:1;color:#00aaff;" @click="handleEdit">{{isShowEdit?'取消':'编辑'}}</view>
+			<navigator style="flex:1;" :url="'/pages/sales/billHistoryEdit?billId=' + verifySn" hover-class="none">
+				<view style="color:#00aaff;">编辑</view>
+			</navigator>
 			<view class="flex" style="width: 78%;">
 				<u-button type="warning" shape="circle" @click="openPaymentModal">确认收款</u-button>
 				<u-button type="primary" shape="circle" :loading="btnLoading" @click="submitOrder" :custom-style="customStyle">再次发送对账单</u-button>
 			</view>
 		</view>
+		<view class="footer" v-else>
+			<u-button type="primary" shape="circle" :loading="btnLoading" @click="submitOrder" :custom-style="customStyle">再次发送对账单</u-button>
+		</view>
 		<!-- 确认收款弹窗 -->
 		<u-popup v-model="showPayment" mode="center" :border-radius="20" width="82%">
 			<view class="slot-content">
-				<view style="padding:50rpx 40rpx;">
-					<u-form :model="form" ref="uForm" :label-width="190" :rules="rules" :label-style="{color:'#999'}">
+				<view style="padding:50rpx 40rpx 20rpx;">
+					<u-form :model="form" ref="uForm" :label-width="150" :rules="rules" :label-style="{color:'#999'}">
 						<u-form-item :border-bottom ="false" label="总单数:" prop="num">23</u-form-item>
-						<u-form-item :border-bottom ="false" label="实际收款金额:" prop="money"><u-input type="number" placeholder="请输入实际收款金额(最多2位小数)" :border="true" :height="60"  v-model="form.money"/></u-form-item>
+						<u-form-item :border-bottom ="false" label="结算方式:" prop="settleType">
+							<u-input type="text" placeholder="请选择结算方式" :disabled="true" :height="60"  v-model="form.settleType" @click="settleShow = true"/>
+							<u-icon :name="settleShow?'arrow-right':'arrow-down'" color="#e0e0e0" size="26"></u-icon>
+						</u-form-item>
+						<u-form-item :border-bottom ="false" label="待收金额:" prop="num">¥23</u-form-item>
+						<u-form-item :border-bottom ="false" label="折让金额:" prop="money"><u-input type="number" placeholder="请输入实际收款金额(最多2位小数)" :border="true" :height="60"  v-model="form.money"/></u-form-item>
 					</u-form>
 				</view>
+				<view class="costText">折让后金额</view>
+				<view class="costText1">¥520</view>
 				<view class="paymentFooter flex algin-center">
 					<view @click="showPayment = false">取消</view>
-					<view >确定</view>
+					<view @click="handlePay">确定</view>
 				</view>
 			</view>
 		</u-popup>
+		<u-select v-model="settleShow" :list="settleList" @confirm="confirmSettle"></u-select>
 		<!-- 分享询问弹窗 -->
 		<u-modal v-model="shareShow" :show-cancel-button="true" :content="shareContent" @confirm="handleShare" @cancel="shareShow = false;btnLoading = false;"></u-modal>
 	</view>
@@ -98,12 +111,24 @@ export default {
 			btnLoading: false,
 			shareShow: false,
 			isShowEdit:false,//编辑
+			settleShow:false,//结算方式
 			shareContent: `是否同意发送对账单给微信好友?`,
 			toThousands,
 			showPayment:false,
 			form:{
-				money:''
+				money:'',
+				settleType:''
 			},
+			settleList:[
+				{
+										value: '1',
+										label: '江'
+									},
+									{
+										value: '2',
+										label: '湖'
+									}
+			],
 			rules: {
 				money: [
 					{ 
@@ -155,6 +180,10 @@ export default {
 				this.$refs.uForm.setRules(this.rules);
 			})
 		},
+		//结算方式
+		confirmSettle(e){
+			this.form.settleType = e[0].label
+		},
 		submitOrder() {
 			//发送对账单
 			this.shareShow = true;
@@ -169,10 +198,6 @@ export default {
 				}
 			});
 		},
-		handleEdit(){
-			this.isShowEdit=!this.isShowEdit
-			this.$refs.billBox.allSelect(true)
-		},
 		// 分享图文
 		handleShare() {
 			let jumpUrl = getApp().globalData.baseUrl.replace('qpls-md/','')
@@ -286,6 +311,19 @@ export default {
 			color:#007aff;
 			border-left:1rpx solid #eee;
 		}
+		.costText {
+			text-align: center;
+			color: $uni-text-color-grey;
+			font-size: 22rpx;
+		}
+		.costText1 {
+			text-align: center;
+			font-weight: bold;
+			color: $uni-color-error;
+			font-size: 36rpx;
+			line-height: 60rpx;
+			padding-bottom: 30rpx;
+		}
 }
 
 </style>

+ 299 - 0
pages/sales/billHistoryEdit.vue

@@ -0,0 +1,299 @@
+<template>
+	<view class="content flex flex_column" v-if="billInfo">
+		<view class="b_head">
+			<view class="head_list">
+				<text>分享时间</text>
+				<text>{{ billInfo.createDate }}</text>
+			</view>
+			<view class="head_list" v-if="billInfo.customer">
+				<text>客户名称</text>
+				<text>{{ billInfo.customer.customerName }}</text>
+			</view>
+			<!-- <view class="head_list">
+				<text>对账周期</text>
+				<text>{{ timeInfo || '--' }}</text>
+			</view> -->
+			<view class="head_list">
+				<text>付款状态</text>
+				<text>{{ billInfo.billStatus == 'UNSETTLE' ? '未付款' : billInfo.settleStyleSnDictValue ? '已结清(' + billInfo.settleStyleSnDictValue + ')' : '已结清' }}</text>
+			</view>
+		</view>
+		<view class="b_detail">
+			<view class="detail_list u-flex">
+				<view class="detail_box">
+					<text>总单数:</text>
+					<text>{{ billInfo.detailNum }}</text>
+				</view>
+				<view class="detail_box">
+					<text>待收金额合计:</text>
+					<text>¥{{ billInfo.totalAmount ||billInfo.totalAmount == 0 ? toThousands(billInfo.totalAmount,2):'--' }}</text>
+				</view>
+			</view>
+			<view class="detail_list u-flex">
+				<view class="detail_box">
+					<text>折让金额:</text>
+					<text>¥{{ billInfo.discountAmount||billInfo.discountAmount==0? toThousands(billInfo.discountAmount,2):'--'}}</text>
+				</view>
+				<view class="detail_box">
+					<text>折让后待收金额:</text>
+					<text>¥{{ billInfo.settleAmount||billInfo.settleAmount ==0? toThousands(billInfo.settleAmount,2):'--' }}</text>
+				</view>
+			</view>
+			<view class="detail_list u-flex" v-if="billInfo.billStatus != 'UNSETTLE'">
+				<view class="detail_box">
+					<text>实际折让金额:</text>
+					<text>¥{{ billInfo.discountAmount||billInfo.discountAmount==0? toThousands(billInfo.discountAmount,2):'--'}}</text>
+				</view>
+				<view class="detail_box">
+					<text>实际收款金额:</text>
+					<text>¥{{ billInfo.settleAmount||billInfo.settleAmount ==0? toThousands(billInfo.settleAmount,2):'--' }}</text>
+				</view>
+			</view>
+		</view>
+		<view class="detail_con"><billList ref="billBox" :list="billArr" :showCheck="isShowEdit" @allChecked="chooseBillList"></billList></view>
+		<view class="footer flex align_center" v-if="billInfo.billStatus == 'UNSETTLE'">
+			<u-checkbox-group style="flex:1;">
+				<u-checkbox v-model="checkedAll" shape="circle" @change="chooseAll">{{checkedAll?'取消全选':'全选'}}</u-checkbox>
+			</u-checkbox-group>
+			<view class="u-flex u-row-right">
+				<u-button type="error" shape="circle" :loading="btnLoading" @click="submitOrder" :custom-style="customStyle">删除</u-button>
+				<u-button type="warning" shape="circle" style="margin-left: 30rpx;" @click="openPaymentModal">一键刷新</u-button>	
+			</view>
+		</view>
+		<!-- 确认收款弹窗 -->
+		<u-popup v-model="showPayment" mode="center" :border-radius="20" width="82%">
+			<view class="slot-content">
+				<view style="padding:50rpx 40rpx;">
+					<u-form :model="form" ref="uForm" :label-width="190" :rules="rules" :label-style="{color:'#999'}">
+						<u-form-item :border-bottom ="false" label="总单数:" prop="num">23</u-form-item>
+						<u-form-item :border-bottom ="false" label="实际收款金额:" prop="money"><u-input type="number" placeholder="请输入实际收款金额(最多2位小数)" :border="true" :height="60"  v-model="form.money"/></u-form-item>
+					</u-form>
+				</view>
+				<view class="paymentFooter flex algin-center">
+					<view @click="showPayment = false">取消</view>
+					<view >确定</view>
+				</view>
+			</view>
+		</u-popup>
+		<!-- 分享询问弹窗 -->
+		<u-modal v-model="shareShow" :show-cancel-button="true" :content="shareContent" @confirm="handleShare" @cancel="shareShow = false;btnLoading = false;"></u-modal>
+	</view>
+</template>
+
+<script>
+import billList from './billListComponent.vue';
+import { findBySn, insert } from '@/api/verify.js';
+import getDate from '@/libs/getDate.js';
+import { toThousands } from '@/libs/tools.js'
+export default {
+	components: { billList },
+	data() {
+		return {
+			customStyle: {
+				width:'200rpx',
+				color: '#fff'
+			},
+			verifySn: '',
+			billInfo: null,
+			billArr: [],
+			timeInfo: '',
+			btnLoading: false,
+			shareShow: false,
+			isShowEdit:true,//删除
+			shareContent: `是否同意发送对账单给微信好友?`,
+			toThousands,
+			showPayment:false,
+			form:{
+				money:''
+			},
+			checkedAll:false,
+			rules: {
+				money: [
+					{ 
+						required: true, 
+						message: '请输入实际收款金额', 
+						trigger: ['change','blur'],
+					}
+				]
+			}
+		};
+	},
+	onReady() {
+		uni.setNavigationBarColor({
+			frontColor: '#ffffff',
+			backgroundColor: this.$config('primaryColor')
+		});
+	},
+	onLoad(options) {
+		if (options && options.billId) {
+			this.verifySn = options.billId;
+			this.loadData({ verifySn: options.billId });
+		}
+	},
+	computed: {
+		//经销商信息
+		userData() {
+			return this.$store.state.vuex_userData;
+		}
+	},
+	methods: {
+		chooseBillList(flag){
+			this.checkedAll = flag
+		},
+		chooseAll(){
+			this.$refs.billBox.allSelect(!this.checkedAll);
+		},
+		loadData(ajaxData) {
+			let that = this;
+			findBySn(ajaxData).then(res => {
+				if (res.status == 200) {
+					that.billInfo = res.data;
+					that.billArr = res.data.detailList;
+					let timeobj = getDate.editDay(res.data.bizBeginDate, res.data.bizEndDate);
+					that.timeInfo = timeobj.starttime + '~' + timeobj.endtime;
+					that.$nextTick(() => {
+						that.$refs.billBox.setData(res.data.detailList);
+					});
+				}
+			});
+		},
+		// 打开确认收款弹窗
+		openPaymentModal(){
+			this.showPayment = true
+			this.$nextTick(()=>{
+				this.$refs.uForm.setRules(this.rules);
+			})
+		},
+		submitOrder() {
+			//发送对账单
+			this.shareShow = true;
+		},
+		//确认收款
+		handlePay(){
+			this.$refs.uForm.validate(valid => {
+				if (valid) {
+					console.log('验证通过');
+				} else {
+					console.log('验证失败');
+				}
+			});
+		},
+		handleEdit(){
+			this.isShowEdit=!this.isShowEdit
+			this.$refs.billBox.allSelect(true)
+		},
+		// 分享图文
+		handleShare() {
+			let jumpUrl = getApp().globalData.baseUrl.replace('qpls-md/','')
+			let url = jumpUrl+'dzd/index.html?' + this.userData.orgSn + '&' + this.verifySn;
+			if (uni.getSystemInfoSync().platform == 'ios') {
+				uni.share({
+					provider: 'weixin',
+					scene: 'WXSceneSession',
+					type: 0,
+					href: url,
+					title: this.billInfo.customer.customerName + '的对账单',
+					summary: '共' + this.billInfo.settleAmount + '元,请您查阅',
+					imageUrl: '../../static/logo.png',
+					success: function(res) {
+						console.log('success:' + JSON.stringify(res));
+					},
+					fail: function(err) {
+						console.log('fail:' + JSON.stringify(err));
+					}
+				});
+			} else {
+				uni.shareWithSystem({
+					summary: this.billInfo.customer.customerName + '您好,您有一个对账单共' + this.billInfo.settleAmount + '元,请您查阅',
+					href: url,
+					success() {
+						console.log('调取微信列表成功,分享不一定成功');
+					},
+					fail() {
+						console.log('分享失败');
+					}
+				});
+			}
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+.content {
+	height: 100vh;
+	width: 100%;
+	box-sizing: border-box;
+	.b_head {
+		background-color: #fff;
+		.head_list {
+			padding: 14rpx 20rpx;
+			border-bottom: 1rpx solid #f8f8f8;
+			
+			text {
+				&:first-child {
+					color: $uni-text-color-grey;
+					display: inline-block;
+					width: 160rpx;
+				}
+			}
+		}
+	}
+	.b_detail {
+		margin: 6rpx 0;
+		background-color: #fff;
+		padding: 20rpx;
+		box-sizing: border-box;
+		.detail_list {
+			margin-bottom: 10rpx;
+			&:last-child {
+				margin-bottom: 0rpx;
+			}
+			.detail_box::after {
+				content: ';';
+				color: $uni-text-color-grey;
+			}
+			.detail_box {
+				text {
+					&:first-child {
+						color: $uni-text-color-grey;
+					}
+					&:last-child {
+						color: $uni-color-warning;
+						font-weight: 600;
+					}
+				}
+			}
+		}
+	}
+	.detail_con {
+		flex-grow: 1;
+		overflow: auto;
+		background-color: #fff;
+	}
+	.footer {
+		width: 100%;
+		box-sizing: border-box;
+		padding: 10rpx 20rpx;
+		background: #fff;
+	}
+}
+// 确认收款弹窗
+.slot-content{
+	.u-form-item{
+			line-height:0 !important;
+		}
+		.paymentFooter{
+			border-top:1rpx solid #eee;
+			view{
+				width: 50%;
+				text-align:center;
+				padding:26rpx 0;
+			}
+		}
+		.paymentFooter view:last-child{
+			color:#007aff;
+			border-left:1rpx solid #eee;
+		}
+}
+</style>