二级市场购物车

common/style.scss

@@ -799,3 +799,31 @@
 		}
 	}
 }
+.addBtn {
+	width: 65px;
+	height: 65px;
+	text-align: center;
+	position: fixed;
+	right: 0;
+	bottom: 0;
+	margin: 20px 30px 30px 20px;
+	box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.4);
+	color: white;
+	background-color: $main-color;
+	font-size: 25px;
+	line-height: 60px;
+	border-radius: 50%;
+	.bag {
+		position: absolute;
+		background-color: red;
+		border-radius: 50%;
+		color: white;
+		width: 22px;
+		height: 22px;
+		font-size: 14px;
+		font-weight: bold;
+		top: 10px;
+		right: 11px;
+		line-height: 21px;
+	}
+}

pages/market/two/list.vue

@@ -22,14 +22,18 @@
 				<view class="con">
 					<view class="productName omit">{{ item.goodsName }}</view>
 					<view class="price">¥ {{ item.resalePrice }}</view>
-					<view class="icon btn" v-if="user.userType == 3" @click.stop="addCar(item)">加入购物车</view>
-					<view class="icon btn" v-if="user.userType == 3" @click.stop="buy(item)">购买</view>
+					<view class="icon btn" v-if="user.userType == 3" @click.stop="addCar(item)">&#xe600;</view>
+					<view class="btn" v-if="user.userType == 3" @click.stop="buy(item)">购买</view>
 				</view>
 			</view>
 			<view class="loading" v-if="loadMore"><u-loadmore :status="loadMore ? 'loading' : 'nomore'" /></view>
 			<u-empty v-if="!loadMore && list.length == 0"></u-empty>
 		</view>
 		<productType v-model="show"></productType>
+		<button class="addBtn" @click="goCar()">
+			<text class="icon">&#xe600;</text>
+			<view class="bag animated" :class="{ bounce: add }" v-if="cars > 0">{{ cars }}</view>
+		</button>
 	</view>
 </template>
 
@@ -40,6 +44,8 @@ export default {
 			user: this.getUser(),
 			show: false,
 			isAsc: 'desc',
+			cars: 0,
+			add: false,
 			sort: [
 				{ name: '综合', sortName: 'id', isAsc: 'desc', check: false },
 				{ name: '日期', sortName: 'create_time', isAsc: 'desc', check: false },
@@ -87,18 +93,26 @@ export default {
 			uni.navigateTo({ url: '/pages/market/productType?current=' + this.param.current + '&now=' + this.param.now });
 		},
 		detail(item) {
-			uni.navigateTo({ url: '/pages/market/two/detail?item=' + JSON.stringify(item) });
+			uni.navigateTo({ url: '/pages/market/two/detail?orderId=' + item.id });
 		},
 		addCar(item) {
+			this.add = true;
 			this.http.request({
 				url: '/level-two-server/app/TbOrdersCart/add',
 				method: 'POST',
 				data: { orderId: item.id },
 				success: res => {
+					this.cars++;
+					setTimeout(() => {
+						this.add = false;
+					}, 500);
 					uni.showToast({ title: '添加成功' });
 				}
 			});
 		},
+		goCar() {
+			uni.navigateTo({ url: '/pages/market/two/purchaser/order/cart' });
+		},
 		buy(item) {
 			uni.navigateTo({ url: '/pages/market/two/purchaser/buy/buy?orderId=' + item.id });
 		},
@@ -131,14 +145,20 @@ export default {
 page {
 	background-color: $pg;
 }
-.btn {
-	width: 120rpx;
-	height: 40rpx;
-	background-color: #fff;
-	color: #000;
-	border: #b5b5b5 1px solid;
-	position: relative;
-	left: 350rpx;
-	font-size: 14px;
+.con {
+	.btn {
+		float: right;
+		background-color: $main-color;
+		color: #000;
+		height: 20px;
+		position: relative;
+		color: white;
+		padding: 5px 20px;
+		margin-left: 10px;
+	}
+	.icon {
+		line-height: 30px;
+		line-height: 20px;
+	}
 }
 </style>