Bläddra i källkod

历史对账单页面修改

chenrui 2 år sedan
förälder
incheckning
ccd220565e
2 ändrade filer med 81 tillägg och 11 borttagningar
  1. 1 4
      pages/sales/billHistory.vue
  2. 80 7
      pages/sales/billHistoryDetail.vue

+ 1 - 4
pages/sales/billHistory.vue

@@ -16,10 +16,7 @@
 					</view>
 					<view class="list_b u-flex u-row-between">
 						<view>{{ item.createDate }}</view>
-						<view class="u-flex" v-if="item.billStatus != 'UNSETTLE'">
-							<view>已付款</view>
-							<u-icon name="yifukuan" custom-prefix="iscm-icon" size="40" :color="wordColor"></u-icon>
-						</view>
+						<u-tag size="mini" :text="item.billStatus == 'UNSETTLE'?'未付款':'已结清'" :type="item.billStatus == 'UNSETTLE'?'info':'success'" />
 					</view>
 				</view>
 			</view>

+ 80 - 7
pages/sales/billHistoryDetail.vue

@@ -50,12 +50,29 @@
 				</view>
 			</view>
 		</view>
-		<view class="detail_con"><billList ref="billBox" :list="billArr"></billList></view>
-		<view class="footer flex" v-if="billInfo.billStatus == 'UNSETTLE'">
-			<div>编辑</div>
-			<u-button type="warning" shape="circle">确认收款</u-button>
-			<u-button type="primary" shape="circle" :loading="btnLoading" @click="submitOrder" :custom-style="customStyle">再次发送对账单</u-button>
+		<view class="detail_con"><billList ref="billBox" :list="billArr" :showCheck="isShowEdit"></billList></view>
+		<view class="footer flex align_center" v-if="billInfo.billStatus == 'UNSETTLE'">
+			<view style="flex:1;color:#00aaff;" @click="handleEdit">{{isShowEdit?'取消':'编辑'}}</view>
+			<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>
+		<!-- 确认收款弹窗 -->
+		<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>
@@ -80,8 +97,22 @@ export default {
 			timeInfo: '',
 			btnLoading: false,
 			shareShow: false,
+			isShowEdit:false,//编辑
 			shareContent: `是否同意发送对账单给微信好友?`,
-			toThousands
+			toThousands,
+			showPayment:false,
+			form:{
+				money:''
+			},
+			rules: {
+				money: [
+					{ 
+						required: true, 
+						message: '请输入实际收款金额', 
+						trigger: ['change','blur'],
+					}
+				]
+			}
 		};
 	},
 	onReady() {
@@ -117,10 +148,31 @@ export default {
 				}
 			});
 		},
+		// 打开确认收款弹窗
+		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/','')
@@ -168,6 +220,7 @@ export default {
 		.head_list {
 			padding: 14rpx 20rpx;
 			border-bottom: 1rpx solid #f8f8f8;
+			
 			text {
 				&:first-child {
 					color: $uni-text-color-grey;
@@ -210,9 +263,29 @@ export default {
 		background-color: #fff;
 	}
 	.footer {
+		width: 100%;
+		box-sizing: border-box;
 		padding: 10rpx 20rpx;
 		background: #fff;
-		align-items: center;
 	}
 }
+// 确认收款弹窗
+.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>