自助采摘绑定商品直播绑定商品

pagesMain/messageForm.vue

@@ -4,7 +4,7 @@
 			<u-cell-group :border="false">
 				<u-field type="textarea" placeholder="请输入留言" v-model="formData.leaMsgContent" label-width="0"></u-field>
 			</u-cell-group>
-			<u-upload :action="uploadUrl" :form-data="uploadData" @on-success="uploadSuccess" @on-error="uploadError" @on-remove="uploadRemove"></u-upload>
+			<!-- <u-upload :action="uploadUrl" :form-data="uploadData" @on-success="uploadSuccess" @on-error="uploadError" @on-remove="uploadRemove"></u-upload> -->
 		</view>
 		<view class="form-handle">
 			<u-button type="success" shape="circle" :ripple="true" @click="submitData" class="handle-custom">发布</u-button>

pagesMain/orderItem.vue

@@ -1,56 +1,56 @@
 <template>
-	<view class="container">
-	<view class="order-row" @click="goToOrderDetail()">
-		<view class="shop-info" v-if="orderData">
-			<text class="iconfont iconwode"></text>
-			<text class="shop-name">{{orderData.nickname}}</text>
-			<text class="order-type">{{getOrderType(orderData.orderStatus)}}</text>
-		</view>
-		<view class="goods-list" v-if="orderData">
-			<view class="goods-row" v-for="(site, index) in orderData.products" :key="index">
-				<image class="goods-img" :src="site.imgUrl" mode="aspectFill"></image>
-				<view class="goods-info">
-					<view class="goods-name">{{site.productName}}</view>
-					<view class="goods-type">
-						类型：{{site.productType == 1 ? '普通商品' : (site.productType == 2 ? '拍卖' : (site.productType == 3 ? '自助采摘' : '共享种植'))}}
-					</view>
-					<view class="goods-price-number">
-						<text class="goods-unit">￥</text>
-						<text class="goods-price">{{site.bizPrice}}</text>
-						<text class="goods-number">x{{site.buyNum}}</text>
+	<view>
+		<view class="order-row" @click="goToOrderDetail()">
+			<view class="shop-info" v-if="orderData">
+				<text class="iconfont iconwode"></text>
+				<text class="shop-name">{{orderData.nickname}}</text>
+				<text class="order-type">{{getOrderType(orderData.orderStatus)}}</text>
+			</view>
+			<view class="goods-list" v-if="orderData">
+				<view class="goods-row" v-for="(site, index) in orderData.products" :key="index">
+					<image class="goods-img" :src="site.imgUrl" mode="aspectFill"></image>
+					<view class="goods-info">
+						<view class="goods-name">{{site.productName}}</view>
+						<view class="goods-type">
+							类型：{{site.productType == 1 ? '普通商品' : (site.productType == 2 ? '拍卖' : (site.productType == 3 ? '自助采摘' : '共享种植'))}}
+						</view>
+						<view class="goods-price-number">
+							<text class="goods-unit">￥</text>
+							<text class="goods-price">{{site.bizPrice}}</text>
+							<text class="goods-number">x{{site.buyNum}}</text>
+						</view>
 					</view>
 				</view>
 			</view>
+			<view class="pay-info" v-if="!isPick">总价￥{{getAllPrice()}}，实付￥{{orderData.paySum}}</view>
+			<view class="handle-box" v-if="(tabIndex >= 1 && tabIndex < 5) || (tabIndex == 5 && orderData.evaluateStatus == 2 && orderData.evaluateReplyStatus == 1)">
+				<u-button size="medium" :plain="true" type="success" shape="circle" :ripple="true" :hair-line="false" class="handle-button"
+				 v-if="tabIndex == 2 && orderData.auctionStatus != 1 && orderData.auctionStatus != 3" @click.stop="handleOrder(1)">发货</u-button>
+				<u-button size="medium" :plain="true" type="success" shape="circle" :ripple="true" :hair-line="false" class="handle-button"
+				 v-if="tabIndex == 3 || tabIndex == 4" @click.stop="handleOrder(2)">追踪物流</u-button>
+				<u-button size="medium" :plain="true" type="success" shape="circle" :ripple="true" :hair-line="false" class="handle-button"
+				 v-if="tabIndex == 5 && orderData.evaluateStatus == 2 && orderData.evaluateReplyStatus == 1" @click.stop="handleOrder(3)">回复</u-button>
+				<u-button size="medium" :plain="true" type="success" shape="circle" :ripple="true" :hair-line="false" class="handle-button"
+				 v-if="!orderData.noPick && (orderData.orderStatus == 1 || orderData.orderStatus == 2)" @click.stop="handleOrder(6)">自助采摘</u-button>
+			</view>
+			<u-top-tips ref="uTips"></u-top-tips>
 		</view>
-		<view class="pay-info" v-if="!isPick">总价￥{{getAllPrice()}}，实付￥{{orderData.paySum}}</view>
-		<view class="handle-box" v-if="(tabIndex >= 1 && tabIndex < 5) || (tabIndex == 5 && orderData.evaluateStatus == 2 && orderData.evaluateReplyStatus == 1)">
-			<u-button size="medium" :plain="true" type="success" shape="circle" :ripple="true" :hair-line="false" class="handle-button"
-			 v-if="tabIndex == 2 && orderData.auctionStatus != 1 && orderData.auctionStatus != 3" @click.stop="handleOrder(1)">发货</u-button>
-			<u-button size="medium" :plain="true" type="success" shape="circle" :ripple="true" :hair-line="false" class="handle-button"
-			 v-if="tabIndex == 3 || tabIndex == 4" @click.stop="handleOrder(2)">追踪物流</u-button>
-			<u-button size="medium" :plain="true" type="success" shape="circle" :ripple="true" :hair-line="false" class="handle-button"
-			 v-if="tabIndex == 5 && orderData.evaluateStatus == 2 && orderData.evaluateReplyStatus == 1" @click.stop="handleOrder(3)">回复</u-button>
-			 <u-button size="medium" :plain="true" type="success" shape="circle" :ripple="true" :hair-line="false" class="handle-button"
-			  v-if="!orderData.noPick && (orderData.orderStatus == 1 || orderData.orderStatus == 2)" @click.stop="handleOrder(6)">自助采摘</u-button>
-		</view>
-		<u-top-tips ref="uTips"></u-top-tips>
-	</view>
-	<view class="uni-popup-dialog" :hidden="show_qx">
-		<view class="uni-dialog-title">
-			<text class="uni-dialog-title-text">提示</text>
-		</view>
-		<view class="uni-dialog-content">
-			<text class="uni-dialog-content-text">请在设置中开启摄像头权限和麦克风权限</text>
+		<view class="uni-popup-dialog" :hidden="show_qx">
+			<view class="uni-dialog-title">
+				<text class="uni-dialog-title-text">提示</text>
+			</view>
+			<view class="uni-dialog-content">
+				<text class="uni-dialog-content-text">请在设置中开启摄像头权限和麦克风权限</text>
+			</view>
+			<view class="uni-dialog-button-group">
+				<button class="uni-dialog-button uni-border-left" open-type="openSetting" @click="closeSetting">
+					设置权限
+				</button>
+			</view>
+
 		</view>
-		<view class="uni-dialog-button-group">
-			<button class="uni-dialog-button uni-border-left" open-type="openSetting" @click="closeSetting">
-				设置权限
-			</button>
+		<view class="qx_bg" :hidden="show_qx">
 		</view>
-	
-	</view>
-	<view class="qx_bg" :hidden="show_qx">
-	</view>
 	</view>
 </template>
 
@@ -88,19 +88,19 @@
 					}],
 					supplierName: '',
 					noPick: true
-					
+
 				}
 			},
 		},
 		data() {
 			return {
-				show_qx:true
+				show_qx: true
 			}
 		},
 		onLoad() {},
 		methods: {
-			closeSetting:function(){
-				this.show_qx=true;
+			closeSetting: function() {
+				this.show_qx = true;
 			},
 			//  获取订单总价
 			getAllPrice() {
@@ -160,13 +160,13 @@
 				} else if (type == 3) {
 					//  回复
 					uni.navigateTo({
-						url: '/pagesMain/evaluateForm?orderId=' + this.orderData.orderId + '&mid='+this.orderData.mid
+						url: '/pagesMain/evaluateForm?orderId=' + this.orderData.orderId + '&mid=' + this.orderData.mid
 					});
 				} else if (type == 6) {
 					// 自助采摘
 					// #ifdef MP-WEIXIN
-					var that=this;
-					if(uni.getStorageSync("firstTimeLive")==""){
+					var that = this;
+					if (uni.getStorageSync("firstTimeLive") == "") {
 						uni.setStorage({
 							key: 'firstTimeLive',
 							data: 1
@@ -174,19 +174,19 @@
 						uni.navigateTo({
 							url: '/pagesMedia/pickVideo?tenantCode=' + that.orderData.tenantCode + '&orderId=' + that.orderData.orderId
 						});
-					}else{
+					} else {
 						wx.getSetting({
-						  success(res) {
-							if (!res.authSetting['scope.camera']){
-							  that.show_qx=false;
-							}else if (!res.authSetting['scope.record']){
-							  that.show_qx=false;
-							}else{
-								uni.navigateTo({
-									url: '/pagesMedia/pickVideo?tenantCode=' + that.orderData.tenantCode + '&orderId=' + that.orderData.orderId
-								});
+							success(res) {
+								if (!res.authSetting['scope.camera']) {
+									that.show_qx = false;
+								} else if (!res.authSetting['scope.record']) {
+									that.show_qx = false;
+								} else {
+									uni.navigateTo({
+										url: '/pagesMedia/pickVideo?tenantCode=' + that.orderData.tenantCode + '&orderId=' + that.orderData.orderId
+									});
+								}
 							}
-						  }
 						})
 					}
 					// #endif
@@ -205,8 +205,8 @@
 					});
 				} else {
 					//  自助采摘
-					var that=this;
-					if(uni.getStorageSync("firstTimeLive")==""){
+					var that = this;
+					if (uni.getStorageSync("firstTimeLive") == "") {
 						uni.setStorage({
 							key: 'firstTimeLive',
 							data: 1
@@ -214,20 +214,20 @@
 						uni.navigateTo({
 							url: '/pagesMedia/pickVideo?tenantCode=' + that.orderData.tenantCode + '&orderId=' + that.orderData.orderId
 						});
-					}else{
+					} else {
 						// #ifdef MP-WEIXIN
 						wx.getSetting({
-						  success(res) {
-							if (!res.authSetting['scope.camera']){
-							  that.show_qx=false;
-							}else if (!res.authSetting['scope.record']){
-							  that.show_qx=false;
-							}else{
-								uni.navigateTo({
-									url: '/pagesMedia/pickVideo?tenantCode=' + that.orderData.tenantCode + '&orderId=' + that.orderData.orderId
-								});
+							success(res) {
+								if (!res.authSetting['scope.camera']) {
+									that.show_qx = false;
+								} else if (!res.authSetting['scope.record']) {
+									that.show_qx = false;
+								} else {
+									uni.navigateTo({
+										url: '/pagesMedia/pickVideo?tenantCode=' + that.orderData.tenantCode + '&orderId=' + that.orderData.orderId
+									});
+								}
 							}
-						  }
 						})
 						// #endif
 
@@ -399,12 +399,13 @@
 				/deep/button {
 					padding: 0 12px;
 					border: 1px solid #BFBFBF !important;
-					background-color: #FFFFFF!important;
+					background-color: #FFFFFF !important;
 					color: #333333 !important;
 				}
 			}
 		}
 	}
+
 	.uni-popup-dialog {
 		width: 80vw;
 		border-radius: 15px;
@@ -414,7 +415,7 @@
 		top: 34vh;
 		z-index: 11;
 	}
-	
+
 	.uni-dialog-title {
 		/* #ifndef APP-NVUE */
 		display: flex;
@@ -424,12 +425,12 @@
 		padding-top: 15px;
 		padding-bottom: 5px;
 	}
-	
+
 	.uni-dialog-title-text {
 		font-size: 16px;
 		font-weight: 500;
 	}
-	
+
 	.uni-dialog-content {
 		/* #ifndef APP-NVUE */
 		display: flex;
@@ -440,12 +441,12 @@
 		padding: 5px 15px 15px 15px;
 		text-align: center;
 	}
-	
+
 	.uni-dialog-content-text {
 		font-size: 14px;
 		color: #6e6e6e;
 	}
-	
+
 	.uni-dialog-button-group {
 		/* #ifndef APP-NVUE */
 		display: flex;
@@ -455,55 +456,56 @@
 		border-top-style: solid;
 		border-top-width: 1px;
 	}
-	
+
 	.uni-dialog-button {
 		/* #ifndef APP-NVUE */
 		display: flex;
 		/* #endif */
-		    background: rgba(0, 0, 0, 0);
-		    border: none;
+		background: rgba(0, 0, 0, 0);
+		border: none;
 		flex: 1;
 		flex-direction: row;
 		justify-content: center;
 		align-items: center;
 		height: 45px;
 	}
-	
+
 	.uni-border-left {
 		border-left-color: #f0f0f0;
 		border-left-style: solid;
 		border-left-width: 0px;
 	}
-	
+
 	.uni-dialog-button-text {
 		font-size: 14px;
 	}
-	
+
 	.uni-button-color {
 		color: #007aff;
 	}
-	
+
 	.uni-dialog-input {
 		flex: 1;
 		font-size: 14px;
 	}
-	
+
 	.uni-popup__success {
 		color: #4cd964;
 	}
-	
+
 	.uni-popup__warn {
 		color: #f0ad4e;
 	}
-	
+
 	.uni-popup__error {
 		color: #dd524d;
 	}
-	
+
 	.uni-popup__info {
 		color: #909399;
 	}
-	.qx_bg{
+
+	.qx_bg {
 		width: 100vw;
 		height: 100vh;
 		background: rgba(0, 0, 0, 0.25);

pagesMedia/liveDetail.nvue

@@ -11,7 +11,7 @@
 			<view class="popup-box">
 				<view class="popup-close">
 					<text class="popup-close-text" @click="$refs.popup.close()">收起</text>
-					<text class="popup-close-text">绑定</text>
+					<text class="popup-close-text" @click="bindGood">绑定</text>
 				</view>
 				<scroll-view v-if="true" scroll-y="true" class="good-box2">
 					<view class="goods-row2" v-for="(item, index) in goodsList" :key="index">
@@ -93,29 +93,29 @@
 			this.windowWidth = info.windowWidth;
 			this.windowHeight = info.windowHeight;
 			// 假数据
-			this.goodsList.push({
-				productId: 1336146105292816384,
-				tenantCode: null,
-				imgPath: 'https: //www.qianjiadi.com:443/file/2020/12/2af4eb48-35c4-4aa7-80c9-ab7a7cb49984.jpg',
-				productName: '测试拍卖商品zxw111',
-				sellCount: 0,
-				owner: 1,
-				productType: 2,
-				originalPrice: 1.00,
-				bizPrice: 0.01,
-				unit: '个'
-			},{
-				productId: 1336146105292816386,
-				tenantCode: null,
-				imgPath: 'https: //www.qianjiadi.com:443/file/2020/12/2af4eb48-35c4-4aa7-80c9-ab7a7cb49984.jpg',
-				productName: '测试拍卖商品zxw222',
-				sellCount: 0,
-				owner: 1,
-				productType: 2,
-				originalPrice: 1.00,
-				bizPrice: 0.01,
-				unit: '个'
-			})
+			// this.goodsList.push({
+			// 	productId: 1336146105292816384,
+			// 	tenantCode: null,
+			// 	imgPath: 'https: //www.qianjiadi.com:443/file/2020/12/2af4eb48-35c4-4aa7-80c9-ab7a7cb49984.jpg',
+			// 	productName: '测试拍卖商品zxw111',
+			// 	sellCount: 0,
+			// 	owner: 1,
+			// 	productType: 2,
+			// 	originalPrice: 1.00,
+			// 	bizPrice: 0.01,
+			// 	unit: '个'
+			// },{
+			// 	productId: 1336146105292816386,
+			// 	tenantCode: null,
+			// 	imgPath: 'https: //www.qianjiadi.com:443/file/2020/12/2af4eb48-35c4-4aa7-80c9-ab7a7cb49984.jpg',
+			// 	productName: '测试拍卖商品zxw222',
+			// 	sellCount: 0,
+			// 	owner: 1,
+			// 	productType: 2,
+			// 	originalPrice: 1.00,
+			// 	bizPrice: 0.01,
+			// 	unit: '个'
+			// })
 			this.goodsIds = this.goodsList.map(site => {
 				return site.productId
 			}).join(',')
@@ -204,8 +204,56 @@
 			onBtnClick(index, item) {
 				if(index === 0) {
 					this.$refs.popup.open()
+					//  打开弹窗
+					NET.request(API.getBindedLiveGoods, {
+						liveId: this.liveId
+					}, 'GET').then(res => {
+						let goodsIds = res.data.map(site => {
+							return site.productId
+						}).join(',')
+						this.getAllGoods(goodsIds)
+					}).catch(res => {
+						this.$refs.uTips.show({
+							title: '获取已绑定商品失败',
+							type: 'warning',
+						})
+					})
 				}
 			},
+			//  获取可绑定商品
+			getAllGoods(goodsIds) {
+				NET.request(API.getVideoGoods, {}, 'GET').then(res => {
+					res.data.forEach(site => {
+						site.check = goodsIds.indexOf(site.productId) != -1
+					})
+					this.goodsList = res.data
+				}).catch(res => {
+					this.$refs.uTips.show({
+						title: '获取商品失败',
+						type: 'warning',
+					})
+				})
+			},
+			//  绑定商品
+			bindGood() {
+				NET.request(API.bindLiveGoods, {
+					liveId: this.liveId,
+					prudoctIds: this.goodsList.filter(site => site.check).map(site => {
+						return site.productId
+					})
+				}, 'POST').then(res => {
+					this.$refs.popup.close()
+					this.$refs.uTips.show({
+						title: '设置成功',
+						type: 'success',
+					})
+				}).catch(res => {
+					this.$refs.uTips.show({
+						title: '设置失败',
+						type: 'warning',
+					})
+				})
+			},
 			//  勾选商品
 			checkGoods(site) {
 				site.check = !site.check

pagesMedia/pickVideo.nvue

@@ -13,7 +13,25 @@
           <text class="popup-close-text" @click="$refs.popup.close()">收起</text>
         </view>
         <scroll-view scroll-y="true" class="good-box">
-          
+		  <view class="goods-row" v-for="(item, index) in goodsList" :key="index">
+			<view class="goods-img-box">
+				<image class="goods-img" :src="item.imgPath" mode="aspectFill"></image>
+			</view>
+			<view class="goods-info">
+				<view>
+					<text class="goods-name">{{item.productName}}</text>
+				</view>
+				<text class="goods-sales">{{item.sellCount ? item.sellCount : 0}}人付款</text>
+				<text class="price">原价:{{item.originalPrice}}</text>
+				<view class="goods-number-bottom">
+					<view class="goods-number">
+						<!-- <text class="goods-number-left">惊爆价:</text> -->
+						<text class="goods-icon">￥</text>
+						<text class="goods-spec">{{item.bizPrice}}</text>
+					</view>
+				</view>
+			</view>
+		  </view>
         </scroll-view>
       </view>
     </uni-popup>
@@ -152,4 +170,99 @@
   font-family: PingFang SC;
   text-align: left;
 }
+
+.good-box {
+	width: 750rpx;
+	height: 230px;
+	padding: 0 0 10px 0;
+	overflow: visible;
+}
+
+.goods-row:first-child {
+	margin-top: 12px;
+}
+
+.goods-row {
+	width: 700rpx;
+	height: 104px;
+	display: flex;
+	flex-direction: row;
+	flex-wrap: nowrap;
+	background-color: #FFFFFF;
+	box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.1);
+	border-radius: 5px;
+	margin: 0 15px 10px 15px;
+}
+
+.goods-img-box {
+	margin-right: 15px;
+}
+
+.goods-img {
+	width: 104px;
+	height: 104px;
+	object-fit: cover;
+}
+
+.goods-info {
+	flex: 1;
+	padding-top: 10px;
+}
+
+.goods-name {
+	line-height: 15px;
+	overflow: hidden;
+	display: -webkit-box;
+	-webkit-line-clamp: 2;
+	-webkit-box-orient: vertical;
+	word-wrap: break-word;
+	text-overflow: ellipsis;
+	font-size: 15px;
+	font-family: PingFang SC;
+	color: #333333;
+}
+
+.goods-sales {
+	font-size: 12px;
+	font-family: PingFang SC;
+	color: #666666;
+	line-height: 15px;
+	margin: 8px 0 8px 0;
+}
+
+.price {
+	font-size: 12px;
+	text-decoration: line-through;
+	color: #A67954;
+}
+
+.goods-number-bottom {
+	display: flex;
+	flex-direction: row;
+}
+
+.goods-number {
+	display: flex;
+	flex-direction: row;
+	white-space: nowrap;
+	line-height: 24px;
+}
+
+.goods-number-left {
+	font-size: 12px;
+	color: #666666;
+}
+
+.goods-icon {
+	font-size: 14px;
+	font-family: PingFang SC;
+	color: #52A63A;
+}
+
+.goods-spec {
+	font-size: 24px;
+	font-family: PingFang SC;
+	color: #52A63A;
+}
+
 </style>