瀏覽代碼

bug 修复

lilei 2 年之前
父節點
當前提交
c35a037a07
共有 1 個文件被更改,包括 216 次插入7 次删除
  1. 216 7
      pages/soldOut/chooseProduct.vue

+ 216 - 7
pages/soldOut/chooseProduct.vue

@@ -26,22 +26,91 @@
 			</view>
 		</view>
 		<view class="check-list">
-			<productList ref="productList" noDataText="暂无产品" @updateNums="updateNums" @allChecked="allCheckedCallback"></productList>
+			<productList ref="productList" noDataText="暂无产品" @allChecked="allCheckedCallback"></productList>
 		</view>
 		<!-- 底部栏 -->
 		<view class="footer-bar flex align_center" v-if="partList.length">
 			<view class="f-left">
 				<u-checkbox size="40" @change="allCheckeChange" v-model="allChecked" shape="circle">{{allChecked?'取消全选':'全选'}}</u-checkbox>
 			</view>
-			<view class="f-mid">
-				<view v-if="totalCategory">
+			<view class="f-mid" @click="openCart">
+				<view>
 					已选<text>{{totalCategory}}</text>款产品
 				</view>
+				<view>
+					查看明细 <u-icon name="arrow-up"></u-icon>
+				</view>
 			</view>
 			<view class="f-btns">
 				<u-button size="medium" @click="submitOrder" :custom-style="customBtnStyle" shape="circle" type="primary" hover-class="none" >确定选择</u-button>
 			</view>
 		</view>
+		<!-- 已选配件 购物车 -->
+		<div class="cpb_cart-mask" v-if="showCart">
+			<div class="cpb_cart-box">
+				<div class="cpb_close flex align-center justify_center" @click="showCart=false">
+					<u-icon name="close"></u-icon>
+				</div>
+				<div class="cpb_cart-tit">
+					<view>已选配件</view>
+					<view class="cpb_heji flex align_center justify_between">
+						<text @click="clearDetail">清空列表</text>
+					</view>
+				</div>
+				<div class="cpb_cart-list">
+					<view 
+					v-for="(item, index) in chooseList" 
+					:key="'cpb_'+item.id" 
+					>
+					<view class="nav-right-item flex align_center">
+						<view class="uni-col-1" @click="delDetail(item,index)">
+							<u-icon name="close-circle" color="#999" size="35"></u-icon>
+						</view>
+						<view class="uni-col-11 flex">
+							<view class="uni-col-2">
+								<u-image :src="item.productImageUrl?item.productImageUrl:`../../static/${$config('themePath')}/def_img@2x.png`" width="128" height="128" border-radius="10"></u-image>
+							</view>
+							<view class="item-info uni-col-9">
+								<view class="item-name">
+									<text>{{item.shelfPlaceCode}}</text>
+									{{item.productCode}}
+								</view>
+								<view class="item-name">
+									{{item.productName}}
+								</view>
+								<view class="item-detail">
+									<view class="item-detail-info align_center flex justify_between">
+										<view></view>
+										<view class="flex justify_end">
+											<view class="item-detail-text">
+											最大库容:<text class="pnums">{{item.maxQty||0}}</text>
+											货架库存:<text class="pnums">{{item.qty||0}}</text>
+											门店库存:<text class="pnums">{{item.qplsStockQty||0}}</text>
+											</view>
+										</view>
+									</view>
+								</view>
+							</view>
+						</view>
+					</view>
+					<view class="nav-right-item">
+						<view class="item-detail">
+							<view class="item-detail-info">
+								<view class="flex justify_between">
+									<view class="item-detail-text flex">
+										<view v-if="item.replenishBillQty">补货在途:<text class="pnums1">{{item.replenishBillQty||0}}</text></view>
+										<view v-if="item.recallBillQty">调回在途:<text class="pnums1">{{item.recallBillQty||0}}</text></view>
+									</view>
+									 <view class="item-detail-text">
+									 </view>
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+				</div>
+			</div>
+		</div>
 		<!-- 筛选项 -->
 		<u-popup v-model="showTab" mode="right" width="70%">
 			<view class="tabBox flex flex_column">
@@ -84,6 +153,7 @@
 				status: 'loading',
 				partList: [],
 				allChecked: false,
+				showCart: false,
 				showTab: false,
 				customBtnStyle: {  //  自定义按钮样式
 					borderColor: this.$config('primaryColor'),
@@ -121,8 +191,10 @@
 			}
 		},
 		onBackPress(e) {
-		  if(this.showTab) {  
+		  console.log(e)
+		  if((this.showTab || this.showCart)&&e.from != 'navigateBack') {
 			this.showTab = false;
+			this.showCart = false;
 			return true;  
 		  } 
 		},
@@ -166,17 +238,50 @@
 				// 是否全选
 				this.allChecked = isAllChecked
 			},
+			// 打开购物车
+			openCart(){
+				if(this.totalCategory){
+					this.showCart = !this.showCart
+				}else{
+					uni.showToast({
+						icon: 'none',
+						title: '请先添加产品'
+					})
+				}
+			},
+			// 删除购物车产品
+			delDetail(item,i){
+				console.log(item.id,i)
+				this.$refs.productList.setChecked(item.id,false)
+				const index = this.chooseList.findIndex(k => k.id == item.id)
+				this.chooseList.splice(index,1)
+				// 全部清空
+				if(this.chooseList.length==0){
+					this.clearChoose()
+				}
+			},
+			// 空列表
+			clearDetail(){
+				const _this = this
+				clzConfirm({
+				  title: '提示',
+				  content: '确认要清空列表吗?',
+				  success (ret) {
+					if (ret.confirm || ret.index == 0) {
+						_this.clearChoose()
+					}
+				  }
+				})
+			},
 			// 清空已选数据
 			clearChoose(){
 				this.chooseList = []
+				this.showCart = false
 				this.allChecked = false
 				if(this.$refs.productList){
 					this.$refs.productList.allSelect(false)
 				}
 			},
-			updateNums(){
-				this.chooseList = this.$refs.productList.getAllChecked()
-			},
 			clearSearch(){
 				this.queryWord = ''
 				this.changeSearch()
@@ -365,6 +470,7 @@
 				&:first-child{
 					text{
 						color: red;
+						margin: 0 5upx;
 					}
 				}
 				&:last-child{
@@ -414,5 +520,108 @@
 			}
 		}
 	}
+	// 购物车
+	.cpb_cart-mask{
+		position: fixed;
+		width: 100%;
+		background: rgba(0,0,0,0.5);
+		z-index: 900;
+		bottom: 100rpx;
+		top: 0;
+	}
+	.cpb_cart-box{
+		background-color: #fff;
+		position: absolute;
+		width: 100%;
+		z-index: 1000;
+		bottom: 0;
+		border-radius: 30rpx 30rpx 0 0;
+		max-height: 70vh;
+		display: flex;
+		flex-direction: column;
+		.cpb_close{
+			position: absolute;
+			top: 10rpx;
+			right: 20rpx;
+			width: 70rpx;
+			height: 70rpx;
+			font-size: 32rpx;
+			color: #999;
+		}
+		.cpb_cart-tit{
+			text-align: center;
+			padding: 20rpx;
+			font-size: 32rpx;
+			border-bottom: 2rpx solid #eee;
+			.cpb_heji{
+				padding-top: 20rpx;
+				font-size: 26upx;
+				> text{
+					color: #00aaff;
+				}
+				> view{
+					color: #999;
+					> text{
+						color: #333;
+						&:first-child{
+							margin-right: 20upx;
+						}
+					}
+				}
+			}
+		}
+		.cpb_cart-list{
+			padding: 20rpx 0;
+			overflow: auto;
+			flex-grow: 1;
+			> view{
+				margin-bottom: 20rpx;
+			}
+			.nav-right-item{
+				padding: 0 30upx;
+				&:last-child{
+					border-bottom:2rpx solid #eee;
+				}
+			}
+			.item-name{
+				font-size: 26rpx;
+				text{
+					background: rgba(3, 54, 146, 0.15);
+					color: #1c588a;
+					border-radius: 1em;
+					font-size: 0.8em;
+					padding: 0 0.5em;
+					margin-right: 10upx;
+				}
+				margin-top: 10upx;
+			}
+			.item-info{
+				flex-grow: 1;
+				padding-left: 0.8em;
+			}
+			.item-detail{
+				.item-detail-info{
+					padding: 10upx 0 4upx;
+					font-size: 24upx;
+					.pnums{
+						margin-right: 10rpx;
+						color: #333;
+					}
+					.pnums1{
+							margin-right: 10rpx;
+							color: red;
+						}
+						> view{
+							padding-bottom: 10rpx;
+							align-items: center;
+							.item-detail-text{
+								color: #999;
+								margin-left: 20upx;
+							}
+						}
+					}
+				}
+			}
+		}
 }
 </style>