完成订单页面

App.vue

@@ -18,11 +18,22 @@
 					url: '/pages/index/index'
 				});
 			}
+			this.$on("login", () => {
+				if(this.$store.state.user.group_id === 2){
+					uni.setTabBarItem({
+					  index: 3,
+					  text: '我的商品',
+					  pagePath:'/pages/product/my-product-tabbar'
+					})
+				}
+			})
 		},
 		onShow: function() {
 			console.log('App Show')
 			this.$store.commit("user/load")
-			this.$store.dispatch("cart/load");			
+			this.$store.dispatch("cart/load");
+			
+						this.$emit("login");
 		},
 		onHide: function() {
 			console.log('App Hide')
@@ -75,14 +86,14 @@
 															function() {
 																console.log(
 																	'install success...'
-																	);
+																);
 																plus.runtime
 																	.restart();
 															},
 															function(e) {
 																console.error(
 																	'install fail...'
-																	);
+																);
 															});
 													}
 												}

main.js

@@ -3,6 +3,7 @@ import App from './App'
 import http from 'http.js'
 import verified from 'verified.js'
 import store from './store'
+import Moment from './static/moment.js'
 // import VueQuillEditor from 'vue-quill-editor'
 
 // // require styles
@@ -34,7 +35,17 @@ Vue.filter('imagesFilter', (images) => {
 
 
 Vue.filter('priceFilter', (price) => {
-	return price.toFixed(2);
+	return Number(price).toFixed(2);
+})
+
+Vue.filter('datetimeFilter', (value) => {
+	var datetimeFormat = 'YYYY-MM-DD HH:mm:ss'
+	if (isNaN(value)) {
+		return value ? Moment(value).format(datetimeFormat) : '';
+	} else {
+		return value ? Moment(parseInt(value) * 1000).format(datetimeFormat) :'None';
+	}
+
 })
 
 

manifest.json

@@ -47,7 +47,44 @@
                 "ad" : {}
             },
             "splashscreen" : {
-                "androidStyle" : "common"
+                "androidStyle" : "default",
+                "android" : {
+                    "hdpi" : "static/splash/640960.png",
+                    "xhdpi" : "static/splash/7201242.png",
+                    "xxhdpi" : "static/splash/10801882.png"
+                }
+            },
+            "icons" : {
+                "android" : {
+                    "hdpi" : "unpackage/res/icons/72x72.png",
+                    "xhdpi" : "unpackage/res/icons/96x96.png",
+                    "xxhdpi" : "unpackage/res/icons/144x144.png",
+                    "xxxhdpi" : "unpackage/res/icons/192x192.png"
+                },
+                "ios" : {
+                    "appstore" : "unpackage/res/icons/1024x1024.png",
+                    "ipad" : {
+                        "app" : "unpackage/res/icons/76x76.png",
+                        "app@2x" : "unpackage/res/icons/152x152.png",
+                        "notification" : "unpackage/res/icons/20x20.png",
+                        "notification@2x" : "unpackage/res/icons/40x40.png",
+                        "proapp@2x" : "unpackage/res/icons/167x167.png",
+                        "settings" : "unpackage/res/icons/29x29.png",
+                        "settings@2x" : "unpackage/res/icons/58x58.png",
+                        "spotlight" : "unpackage/res/icons/40x40.png",
+                        "spotlight@2x" : "unpackage/res/icons/80x80.png"
+                    },
+                    "iphone" : {
+                        "app@2x" : "unpackage/res/icons/120x120.png",
+                        "app@3x" : "unpackage/res/icons/180x180.png",
+                        "notification@2x" : "unpackage/res/icons/40x40.png",
+                        "notification@3x" : "unpackage/res/icons/60x60.png",
+                        "settings@2x" : "unpackage/res/icons/58x58.png",
+                        "settings@3x" : "unpackage/res/icons/87x87.png",
+                        "spotlight@2x" : "unpackage/res/icons/80x80.png",
+                        "spotlight@3x" : "unpackage/res/icons/120x120.png"
+                    }
+                }
             }
         }
     },

pages.json

@@ -159,7 +159,13 @@
 			"path": "pages/product/my-product",
 			"style": {
 				"navigationBarTitleText": "我的商品",
-				"enablePullDownRefresh": false
+				"enablePullDownRefresh": true
+			}
+		},{
+			"path": "pages/product/my-product-tabbar",
+			"style": {
+				"navigationBarTitleText": "我的商品",
+				"enablePullDownRefresh": true
 			}
 		},{
 			"path": "pages/product/product-edit",

pages/home/home.vue

@@ -75,29 +75,29 @@
 			this.getNewProductData();
 			this.getLikeProductsData();
 			
-			uni.showModal({
-			    title: '清除launchFlag值',
-			    content: '确定要清除launchFlag值，进行重启测试？',
-			    success: function (res) {
-			        if (res.confirm) {
-			            console.log('用户点击确定');
-			            // 清除缓存
-			            uni.clearStorage();
-			            uni.showToast({
-			                icon: 'none',
-			                duration:3000,
-			                title: '清除成功2秒后重启'
-			            });
-			            // 两秒后重启
-			            setTimeout(function() {
-			                uni.hideToast();
-			                plus.runtime.restart();
-			            }, 2000);
-			        } else if (res.cancel) {
-			            console.log('用户点击取消');
-			        }
-			    }
-			});
+		// 	uni.showModal({
+		// 	    title: '清除launchFlag值',
+		// 	    content: '确定要清除launchFlag值，进行重启测试？',
+		// 	    success: function (res) {
+		// 	        if (res.confirm) {
+		// 	            console.log('用户点击确定');
+		// 	            // 清除缓存
+		// 	            uni.clearStorage();
+		// 	            uni.showToast({
+		// 	                icon: 'none',
+		// 	                duration:3000,
+		// 	                title: '清除成功2秒后重启'
+		// 	            });
+		// 	            // 两秒后重启
+		// 	            setTimeout(function() {
+		// 	                uni.hideToast();
+		// 	                plus.runtime.restart();
+		// 	            }, 2000);
+		// 	        } else if (res.cancel) {
+		// 	            console.log('用户点击取消');
+		// 	        }
+		// 	    }
+		// 	});
 
 		},
 		onShow() {},

pages/order/back-order.vue

@@ -3,33 +3,36 @@
 		<view class="order-list">
 			<view class="order-item" v-for="order in orders">
 				<view class="order-head">
-					<view class="factory-name">{{order.factory}}</view>
-					<view v-if="order.status === 0" class="order-status">待付款</view>
-					<view v-if="order.status === 2" class="order-status">待收货</view>
+					<view class="factory-name">{{order.seller.nickname?order.seller.nickname:'省心直供（该厂家暂未设置昵称）'}}</view>
+					<view v-if="order.status === 'wait_pay'" class="order-status">待付款</view>
+					<view v-if="order.status === 'wait_deliver'" class="order-status">待发货</view>
+					<view v-if="order.status === 'wait_sign'" class="order-status">待签收</view>
+					<view v-if="order.status === 'complete'" class="order-status">已完成</view>
+					<view v-if="order.status === 'invalid'" class="order-status">已失效</view>
 				</view>
-				<view class="order-info" @tap="openDetails()">
-					<view class="product-item" v-for="product in order.products">
+				<view class="order-info" @tap="openDetails(order.id)">
+					<view class="product-item" v-for="product in order.products_json">
 						<view class="product-image">
-							<image class="image" :src="product.image" mode="scaleToFill"></image>
+							<image class="image" :src="product.spec_image" mode="scaleToFill"></image>
 						</view>
 						<view class="product-info">
 							<view class="row">
 								<view class="name">{{product.name}}</view>
-								<view class="price">￥{{product.price}}</view>
+								<view class="price">￥{{product.spec_price}}</view>
 							</view>
 							<view class="row">
-								<view class="spec">{{product.specs_name}}</view>
-								<view class="num">×{{product.specs_num}}</view>
+								<view class="spec">{{product.spec_name}}</view>
+								<view class="num">×{{product.num}}</view>
 							</view>
 						</view>
 					</view>
 				</view>
 				<view class="total-price">
-					总价 <text class="warning">￥{{order.total}}</text>
+					总价 <text class="warning">￥{{order.total_amount}}</text>
 				</view>
 				<view class="option">
-					<button v-if="order.status === 0" class="pay-btn" type="default">立即支付</button>
-					<button v-if="order.status === 2" class="confirm-btn" type="default">确认收货</button>
+					<button v-if="order.status === 'wait_pay'" class="pay-btn" type="default">立即支付</button>
+					<button v-if="order.status === 'wait_sign'" class="confirm-btn" type="default">确认收货</button>
 				</view>
 			</view>
 		</view>
@@ -40,43 +43,54 @@
 	export default {
 		data() {
 			return {
-				orders: [{
-					factory: '省心一号工厂',
-					products: [{
-						name: '泰国Mistine小黄帽防晒霜',
-						image: 'https://img.alicdn.com/i4/2929053804/O1CN01RSromv1dyHBcuS4I6_!!2929053804.jpg',
-						price: 9.52,
-						specs_name: "白色",
-						specs_num: 5
-					}],
-					status: 2,
-					total: '99.51'
-				}, {
-					factory: '省心二号工厂',
-					products: [{
-							name: '【三只松鼠】元宵送礼坚果礼盒1498g',
-							image: 'https://img.alicdn.com/i4/880734502/O1CN01tA7hal1j7xjnwHQZC_!!880734502.jpg',
-							price: 9.52,
-							specs_name: "白色",
-							specs_num: 5
-						},
-						{
-							name: '泰国Mistine小黄帽防晒霜',
-							image: 'https://img.alicdn.com/i4/2929053804/O1CN01RSromv1dyHBcuS4I6_!!2929053804.jpg',
-							price: 9.52,
-							specs_name: "白色",
-							specs_num: 5
-						}
-					],
-					status: 0,
-					total: '58.51'
-				}]
+				orderStatus: '',
+				orders: [],
+				page: 1,
+				pageLoading: false
 			}
 		},
+		onLoad() {
+			this.getOrdersData();
+		},
+		onShow() {
+			if (this.$store.state.user.group_id === 2) {
+				this.orderStatus = 'wait_deliver'
+			}
+			if (this.$store.state.user.group_id === 3) {
+				this.orderStatus = 'wait_pay'
+			}
+		},
+		onPageScroll(e) {
+			const query = uni.createSelectorQuery();
+			query.select("#order").boundingClientRect(data => {
+				if (e.scrollTop > data.height - uni.getSystemInfoSync().windowHeight * 2) {
+					this.getOrdersData();
+				}
+			}).exec();
+
+		},
 		methods: {
-			openDetails() {
+			openDetails(id) {
 				uni.navigateTo({
-					url:"order-details"
+					url: "order-details?id="+id
+				})
+			},
+			getOrdersData() {
+				this.$http.get({
+					url: "/order/lists",
+					data: {
+						status: this.orderStatus,
+						limit: 10,
+						page: this.page
+					},
+					success: (res) => {
+						this.orders = [...this.orders, ...res.data.data.rows.map((item) => {
+							item.products_json = JSON.parse(item.products_snapshot)
+							return item;
+						})]
+						this.page++;
+						this.pageLoading = false;
+					}
 				})
 			}
 		}
@@ -167,11 +181,12 @@
 				text-align: right;
 				font-size: 28upx;
 				padding: 10upx 0;
+
 				.warning {
 					color: $primary-color;
 					font-weight: bold;
 				}
-				
+
 			}
 
 			.option {

pages/order/order-details.vue

@@ -4,48 +4,51 @@
 
 			<view class="contacts">
 				<view class="name">
-					刘亦菲
+					{{order.poststation.contacts}}
 				</view>
 				<view class="phone">
-					86-18112512562
+					{{order.poststation.phone}}
 				</view>
 			</view>
 			<view class="address">
-				广东省广州市花都区合成村2街5号
+				{{order.poststation.address}}
 			</view>
 		</view>
 		<view class="order">
 			<view class="order-head">
-				<view class="factory-name">{{order.factory}}</view>
-				<view v-if="order.status === 0" class="order-status">待付款</view>
-				<view v-if="order.status === 2" class="order-status">待收货</view>
+				<view class="factory-name">{{order.seller.nickname?order.seller.nickname:'省心直供（该厂家暂未设置昵称）'}}</view>
+				<view v-if="order.status === 'wait_pay'" class="order-status">待付款</view>
+				<view v-if="order.status === 'wait_deliver'" class="order-status">待发货</view>
+				<view v-if="order.status === 'wait_sign'" class="order-status">待签收</view>
+				<view v-if="order.status === 'complete'" class="order-status">已完成</view>
+				<view v-if="order.status === 'invalid'" class="order-status">已失效</view>
 			</view>
 			<view class="order-info">
-				<view class="product-item" v-for="product in order.products">
+				<view class="product-item" v-for="product in order.products_json">
 					<view class="product-image">
-						<image class="image" :src="product.image" mode="scaleToFill"></image>
+						<image class="image" :src="product.spec_image" mode="scaleToFill"></image>
 					</view>
 					<view class="product-info">
 						<view class="row">
 							<view class="name">{{product.name}}</view>
-							<view class="price">￥{{product.price}}</view>
+							<view class="price">￥{{product.spec_price}}</view>
 						</view>
 						<view class="row">
-							<view class="spec">{{product.specs_name}}</view>
-							<view class="num">×{{product.specs_num}}</view>
+							<view class="spec">{{product.spec_name}}</view>
+							<view class="num">×{{product.num}}</view>
 						</view>
 					</view>
 				</view>
 			</view>
 			<view class="total-price">
-				总价 <text class="warning">￥{{order.total}}</text>
+				总价 <text class="warning">￥{{order.total_amount}}</text>
 			</view>
 		</view>
 		<view class="info">
 			<view class="title">订单信息</view>
 			<view class="row">
 				<view class="label">订单编号</view>
-				<view>264545121255151212</view>
+				<view>{{order.order_no}}</view>
 			</view>
 			<view class="row">
 				<view class="label">支付宝交易号</view>
@@ -53,15 +56,15 @@
 			</view>
 			<view class="row">
 				<view class="label">创建时间</view>
-				<view>2021-03-14 01:25:01</view>
+				<view>{{order.createtime|datetimeFilter}}</view>
 			</view>
-			<view class="row">
+			<view class="row" v-if="order.paytime">
 				<view class="label">付款时间</view>
-				<view>2021-03-14 01:25:01</view>
+				<view>{{order.paytime|datetimeFilter}}</view>
 			</view>
-			<view class="row">
+			<view class="row" v-if="order.deliver_time">
 				<view class="label">发货时间</view>
-				<view>2021-03-15 01:05:01</view>
+				<view>{{order.deliver_time|datetimeFilter}}</view>				
 			</view>
 			<view v-if="false" class="option">
 				<view class="option-item">
@@ -77,8 +80,8 @@
 
 		<view class="footer">
 			<view class="option">
-				<button v-if="order.status === 0" class="pay-btn" type="default">立即支付</button>
-				<button v-if="order.status === 2" class="confirm-btn" type="default">确认收货</button>
+				<button v-if="order.status === 'wait_pay'" class="pay-btn" type="default">立即支付</button>
+				<button v-if="order.status === 'wait_sign'" class="confirm-btn" type="default">确认收货</button>
 			</view>
 
 		</view>
@@ -90,30 +93,29 @@
 		data() {
 			return {
 				order: {
-					factory: '省心二号工厂',
-					products: [{
-							name: '【三只松鼠】元宵送礼坚果礼盒1498g',
-							image: 'https://img.alicdn.com/i4/880734502/O1CN01tA7hal1j7xjnwHQZC_!!880734502.jpg',
-							price: 9.52,
-							specs_name: "白色",
-							specs_num: 5
-						},
-						{
-							name: '泰国Mistine小黄帽防晒霜',
-							image: 'https://img.alicdn.com/i4/2929053804/O1CN01RSromv1dyHBcuS4I6_!!2929053804.jpg',
-							price: 9.52,
-							specs_name: "白色",
-							specs_num: 5
-						}
-					],
-					status: 0,
-					total: '58.51'
+					seller:{}
 				}
 			}
 
 
 		},
+		onLoad(option) {
+			this.order.id = option.id;
+			this.getOrderData();
+		},
 		methods: {
+			getOrderData() {
+				this.$http.get({
+					url: "/order",
+					data: {
+						id: this.order.id
+					},
+					success: (res) => {
+						res.data.data.products_json = JSON.parse(res.data.data.products_snapshot)
+						this.order = res.data.data
+					}
+				})
+			},
 
 		}
 	}
@@ -220,7 +222,7 @@
 				justify-content: space-between;
 				margin-bottom: 10upx;
 			}
-		
+
 		}
 
 		.total-price {
@@ -257,7 +259,8 @@
 				width: 200upx;
 			}
 		}
-		.option{
+
+		.option {
 			display: flex;
 			justify-content: space-around;
 			text-align: center;
@@ -265,13 +268,16 @@
 			border-top: 2upx solid #EEEEEE;
 			color: #666666;
 			margin-top: 40upx;
-			.icon{
+
+			.icon {
 				margin-right: 10upx;
 			}
-			.option-item{
+
+			.option-item {
 				flex: 1;
 			}
-			.option-item:first-child{
+
+			.option-item:first-child {
 				border-right: 2upx solid #EEEEEE;
 			}
 		}

pages/order/order.vue

@@ -5,41 +5,47 @@
 				订单明细
 			</view>
 			<view class="tabs">
-				<view class="tab-item active">全部</view>
-				<view class="tab-item">已付款</view>
-				<view class="tab-item">已完成</view>
+				<view class="tab-item" :class="{'active':orderStatus===undefined}"
+					@tap="orderStatus=undefined,orders=[],getOrdersData()">全部</view>
+				<view class="tab-item" :class="{'active':orderStatus==='wait_deliver'}"
+					@tap="orderStatus='wait_deliver',orders=[],getOrdersData()">已付款</view>
+				<view class="tab-item" :class="{'active':orderStatus==='complete'}"
+					@tap="orderStatus='complete',orders=[],getOrdersData()">已完成</view>
 			</view>
 		</view>
 		<view class="order-list">
 			<view class="order-item" v-for="order in orders">
 				<view class="order-head">
-					<view class="factory-name">{{order.factory}}</view>
-					<view v-if="order.status === 0" class="order-status">待付款</view>
-					<view v-if="order.status === 2" class="order-status">待收货</view>
+					<view class="factory-name">{{order.seller.nickname?order.seller.nickname:'省心直供（该厂家暂未设置昵称）'}}</view>
+					<view v-if="order.status === 'wait_pay'" class="order-status">待付款</view>
+					<view v-if="order.status === 'wait_deliver'" class="order-status">待发货</view>
+					<view v-if="order.status === 'wait_sign'" class="order-status">待签收</view>
+					<view v-if="order.status === 'complete'" class="order-status">已完成</view>
+					<view v-if="order.status === 'invalid'" class="order-status">已失效</view>
 				</view>
-				<view class="order-info" @tap="openDetails()">
-					<view class="product-item" v-for="product in order.products">
+				<view class="order-info" @tap="openDetails(order.id)">
+					<view class="product-item" v-for="product in order.products_json">
 						<view class="product-image">
-							<image class="image" :src="product.image" mode="scaleToFill"></image>
+							<image class="image" :src="product.spec_image" mode="scaleToFill"></image>
 						</view>
 						<view class="product-info">
 							<view class="row">
 								<view class="name">{{product.name}}</view>
-								<view class="price">￥{{product.price}}</view>
+								<view class="price">￥{{product.spec_price}}</view>
 							</view>
 							<view class="row">
-								<view class="spec">{{product.specs_name}}</view>
-								<view class="num">×{{product.specs_num}}</view>
+								<view class="spec">{{product.spec_name}}</view>
+								<view class="num">×{{product.num}}</view>
 							</view>
 						</view>
 					</view>
 				</view>
 				<view class="total-price">
-					总价 <text class="warning">￥{{order.total}}</text>
+					总价 <text class="warning">￥{{order.total_amount}}</text>
 				</view>
 				<view class="option">
-					<button v-if="order.status === 0" class="pay-btn" type="default">立即支付</button>
-					<button v-if="order.status === 2" class="confirm-btn" type="default">确认收货</button>
+					<button v-if="order.status === 'wait_pay'" class="pay-btn" type="default">立即支付</button>
+					<button v-if="order.status === 'wait_sign'" class="confirm-btn" type="default">确认收货</button>
 				</view>
 			</view>
 		</view>
@@ -50,43 +56,47 @@
 	export default {
 		data() {
 			return {
-				orders: [{
-					factory: '省心一号工厂',
-					products: [{
-						name: '泰国Mistine小黄帽防晒霜',
-						image: 'https://img.alicdn.com/i4/2929053804/O1CN01RSromv1dyHBcuS4I6_!!2929053804.jpg',
-						price: 9.52,
-						specs_name: "白色",
-						specs_num: 5
-					}],
-					status: 2,
-					total: '99.51'
-				}, {
-					factory: '省心二号工厂',
-					products: [{
-							name: '【三只松鼠】元宵送礼坚果礼盒1498g',
-							image: 'https://img.alicdn.com/i4/880734502/O1CN01tA7hal1j7xjnwHQZC_!!880734502.jpg',
-							price: 9.52,
-							specs_name: "白色",
-							specs_num: 5
-						},
-						{
-							name: '泰国Mistine小黄帽防晒霜',
-							image: 'https://img.alicdn.com/i4/2929053804/O1CN01RSromv1dyHBcuS4I6_!!2929053804.jpg',
-							price: 9.52,
-							specs_name: "白色",
-							specs_num: 5
-						}
-					],
-					status: 0,
-					total: '58.51'
-				}]
+				orderStatus: undefined,
+				orders: [],
+				page: 1,
+				pageLoading: false
 			}
 		},
+		onLoad() {
+			this.getOrdersData();
+		},
+		onPageScroll(e) {
+			const query = uni.createSelectorQuery();
+			query.select("#order").boundingClientRect(data => {
+				if (e.scrollTop > data.height - uni.getSystemInfoSync().windowHeight * 2) {
+					this.getOrdersData();
+				}
+			}).exec();
+
+		},
 		methods: {
-			openDetails() {
+			openDetails(id) {
 				uni.navigateTo({
-					url:"order-details"
+					url: "order-details?id="+id
+					
+				})
+			},
+			getOrdersData() {
+				this.$http.get({
+					url: "/order/lists",
+					data: {
+						status: this.orderStatus,
+						limit: 10,
+						page: this.page
+					},
+					success: (res) => {
+						this.orders = [...this.orders, ...res.data.data.rows.map((item) => {
+							item.products_json = JSON.parse(item.products_snapshot)
+							return item;
+						})]
+						this.page++;
+						this.pageLoading = false;
+					}
 				})
 			}
 		}
@@ -209,11 +219,12 @@
 				text-align: right;
 				font-size: 28upx;
 				padding: 10upx 0;
+
 				.warning {
 					color: $primary-color;
 					font-weight: bold;
 				}
-				
+
 			}
 
 			.option {

pages/product/my-product-tabbar.vue

@@ -0,0 +1,224 @@
+<template>
+	<view class="my-product">
+		<view class="header">
+			<view class="title">
+				我的商品
+			</view>
+			<view style="position: relative;">
+				<view class="sub-title">全部商品</view>
+				<view class="release">
+					<navigator url="/pages/product/product-edit">发布商品</navigator>
+				</view>
+			</view>
+		</view>
+
+		<view class="product-list">
+			<view class="product-item" v-for="product in products" @tap="goToEdit(product.id)">
+				<view class="product-image">
+					<image class="image" :src="product.images|imagesFilter" mode="scaleToFill"></image>
+				</view>
+				<view>
+					<view class="row row-1">
+						<text class="title"><text class="sxzg-icon">省心直供</text>{{product.name}}</text>
+					</view>
+					<view class="row row-2">
+						<text class="org-price">￥{{product.org_price}}</text>
+					</view>
+					<view class="row row-3">
+						<text class="sxj-icon">省心价</text>
+						<text class="price">￥{{product.price}}</text>
+					</view>
+					<view class="row row-4">
+						<text>发布日期：</text>
+						<text class="time">{{product.createtime|datetimeFilter}}</text>
+					</view>
+				</view>
+
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				page: 1,
+				pageLoading: false,
+				products: []
+			}
+		},
+		onLoad() {
+			this.getProductData();
+		},
+
+		onPageScroll(e) {
+			const query = uni.createSelectorQuery();
+			query.select("#my-product").boundingClientRect(data => {
+				if (e.scrollTop > data.height - uni.getSystemInfoSync().windowHeight * 2) {
+					this.getProductData();
+				}
+			}).exec();
+		},
+		onPullDownRefresh() {
+			this.refresh();
+		},
+		onShow() {
+			uni.startPullDownRefresh()
+		},
+		methods: {
+			getProductData() {
+				return new Promise((resolve, reject) => {
+					this.$http.get({
+						url: "/product/my",
+						data: {
+							limit: 10,
+							page: this.page,
+						},
+						success: (res) => {
+							this.products = [...this.products, ...res.data.data.rows];
+							this.page++;
+							this.pageLoading = false;
+							resolve(res)
+						},
+						fail: (err) => {
+							reject(err)
+						}
+					})
+				})
+			},
+			goToEdit(id) {
+				uni.navigateTo({
+					url: "/pages/product/product-edit?id=" + id
+				})
+			},
+			refresh() {
+				this.page = 1;
+				this.products = [];
+				this.getProductData()
+					.then(uni.stopPullDownRefresh())
+					.catch(uni.stopPullDownRefresh());
+
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.my-product {
+		overflow: hidden;
+	}
+
+	.header {
+		margin: 20upx;
+		background: white;
+		text-align: center;
+		border-radius: 20upx;
+		padding-bottom: 10upx;
+
+		.title {
+			height: 100upx;
+			font-size: 32upx;
+			line-height: 100upx;
+			// font-weight: bold;
+		}
+
+		.sub-title {
+			font-size: 28upx;
+			color: #999999;
+		}
+
+		.release {
+			position: absolute;
+			right: 20upx;
+			font-size: 24upx;
+			bottom: 4upx;
+		}
+	}
+
+
+	.product-list {
+		.product-item {
+			display: flex;
+			background: white;
+			margin: 20upx;
+			padding: 20upx;
+
+			.product-image {
+				width: 180upx;
+				height: 180upx;
+				margin-right: 20upx;
+			}
+
+			.image {
+				width: 180upx;
+				height: 180upx;
+				background: #EEEEEE;
+			}
+		}
+
+		.sxzg-icon {
+			color: $primary-color;
+			font-size: 16rpx;
+			width: 80rpx;
+			text-align: center;
+			line-height: normal;
+			border: 2rpx solid $primary-color;
+			border-radius: 20rpx;
+			display: inline-block;
+			position: relative;
+			top: -4rpx;
+			margin-right: 10upx;
+			// transform: scale(0.9);
+		}
+
+		.title {
+			font-size: 24rpx;
+			display: inline-block;
+			white-space: normal;
+			display: -webkit-box;
+			-webkit-box-orient: vertical;
+			-webkit-line-clamp: 2;
+			overflow: hidden;
+			height: 68upx;
+		}
+
+		.row {
+			// padding: 0 10upx;
+		}
+
+		.row-2 {
+			display: flex;
+			justify-content: space-between;
+		}
+
+		.org-price {
+			font-size: 26rpx;
+			color: #cccccc;
+		}
+
+		.org-price {
+			text-decoration: line-through;
+		}
+
+		.sxj-icon {
+			background: $primary-color;
+			color: white;
+			font-size: 20upx;
+			padding: 0 5upx;
+			border-radius: 5upx;
+			vertical-align: middle;
+		}
+
+		.price {
+			font-size: 26rpx;
+			color: $primary-color;
+			font-weight: bold;
+		}
+
+		.row-4 {
+			font-size: 24upx;
+			color: #999999;
+		}
+	}
+</style>

pages/product/my-product.vue

@@ -13,24 +13,24 @@
 		</view>
 
 		<view class="product-list">
-			<view class="product-item">
+			<view class="product-item" v-for="product in products" @tap="goToEdit(product.id)">
 				<view class="product-image">
-					<image class="image" :src="image" mode="scaleToFill"></image>
+					<image class="image" :src="product.images|imagesFilter" mode="scaleToFill"></image>
 				</view>
 				<view>
 					<view class="row row-1">
-						<text class="title"><text class="sxzg-icon">省心直供</text>{{title}}</text>
+						<text class="title"><text class="sxzg-icon">省心直供</text>{{product.name}}</text>
 					</view>
 					<view class="row row-2">
-						<text class="org-price">￥{{orgPrice}}</text>
+						<text class="org-price">￥{{product.org_price}}</text>
 					</view>
 					<view class="row row-3">
 						<text class="sxj-icon">省心价</text>
-						<text class="price">￥{{price}}</text>
+						<text class="price">￥{{product.price}}</text>
 					</view>
 					<view class="row row-4">
 						<text>发布日期：</text>
-						<text class="time">2021-02-25 13:12:41</text>
+						<text class="time">{{product.createtime|datetimeFilter}}</text>
 					</view>
 				</view>
 
@@ -43,13 +43,63 @@
 	export default {
 		data() {
 			return {
-				title: "商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称",
-				orgPrice: "102.20",
-				price: "100.20"
+				page: 1,
+				pageLoading: false,
+				products: []
 			}
 		},
+		onLoad() {
+			this.getProductData();
+		},
+
+		onPageScroll(e) {
+			const query = uni.createSelectorQuery();
+			query.select("#my-product").boundingClientRect(data => {
+				if (e.scrollTop > data.height - uni.getSystemInfoSync().windowHeight * 2) {
+					this.getProductData();
+				}
+			}).exec();
+		},
+		onPullDownRefresh() {
+			this.refresh();
+		},
+		onShow() {
+			uni.startPullDownRefresh()
+		},
 		methods: {
+			getProductData() {
+				return new Promise((resolve, reject) => {
+					this.$http.get({
+						url: "/product/my",
+						data: {
+							limit: 10,
+							page: this.page,
+						},
+						success: (res) => {
+							this.products = [...this.products, ...res.data.data.rows];
+							this.page++;
+							this.pageLoading = false;
+							resolve(res)
+						},
+						fail: (err) => {
+							reject(err)
+						}
+					})
+				})
+			},
+			goToEdit(id) {
+				uni.navigateTo({
+					url: "/pages/product/product-edit?id=" + id
+				})
+			},
+			refresh() {
+				this.page = 1;
+				this.products = [];
+				this.getProductData()
+					.then(uni.stopPullDownRefresh())
+					.catch(uni.stopPullDownRefresh());
 
+			}
 		}
 	}
 </script>

pages/product/product-details.vue

@@ -1,5 +1,5 @@
 <template>
-	<view style="padding-bottom: 100upx;">		
+	<view style="padding-bottom: 100upx;">
 		<view style="background: white;padding-bottom: 10upx;">
 			<view class="section carousel-wrapper">
 				<swiper class="carousel" :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000"
@@ -120,9 +120,9 @@
 				</view>
 				<view class="row row-6 option">
 					<button v-if="option === 'addcart'" class="btn" type="default" @tap="addCart">加入购物车</button>
-					<button v-if="option === 'buy'" class="btn" type="default" @tap="">立即购买</button>
+					<button v-if="option === 'buy'" class="btn" type="default" @tap="buy">立即购买</button>
 				</view>
-				
+
 			</view>
 		</view>
 	</view>
@@ -184,9 +184,35 @@
 					num: this.num,
 					specIndex: this.curSpecIndex
 				}).then(uni.showToast({
-					title:"加入购物车成功",
-					icon:"none"
+					title: "加入购物车成功",
+					icon: "none"
 				}))
+			},
+			buy() {
+				let data = {
+					id: this.product.id,
+					spec_index: this.curSpecIndex,
+					num: this.num
+				}
+				this.$http.post({
+					url: '/order/create',
+					data: {
+						'products[]':JSON.stringify(data)
+					},
+					success: (res) => {
+						uni.showModal({
+							content: "下单成功",
+							success: (res) => {
+								if (res.confirm) {
+									uni.navigateTo({
+										url: "/pages/order/order"
+									})
+								}
+							}
+						})
+
+					}
+				})
 			}
 		}
 	}

pages/product/product-edit.vue

@@ -78,7 +78,6 @@
 	export default {
 		data() {
 			return {
-				html: "333",
 				mainImages: [],
 				mainImagesLimit: 5,
 				form: {},
@@ -90,6 +89,22 @@
 		components: {
 			robinEditor
 		},
+		onLoad(option) {
+			console.log(option)
+			this.$http.get({
+				url: "/product",
+				data: {
+					id: option.id
+				},
+				success: (res) => {
+					this.mainImages = res.data.data.images.split(",")
+					this.form.name = res.data.data.name
+					this.form.details = res.data.data.details
+					this.specs = JSON.parse(res.data.data.specs)
+					this.form.id = res.data.data.id
+				}
+			})
+		},
 		methods: {
 			imageUploader(path, callback) {
 				this.$http.upload({
@@ -179,8 +194,63 @@
 					return parseInt(accumulator) + parseInt(currentValue.stock)
 				}, 0)
 				this.form.images = this.mainImages.join(",");
-				this.form.specs = JSON.stringify(this.specs); 
+				this.form.specs = JSON.stringify(this.specs);
 				console.log(this.form)
+
+				for (var i = 0; i < this.specs.length; i++) {
+					if (!this.specs[i].image) {
+						uni.showToast({
+							icon: "none",
+							title: `请上传颜色${i+1}的图片`
+						})
+						return;
+					}
+					if (!this.specs[i].name) {
+						uni.showToast({
+							icon: "none",
+							title: `请填写颜色${i+1}的名称`
+						})
+						return;
+					}
+					if (!this.specs[i].org_price) {
+						uni.showToast({
+							icon: "none",
+							title: `请填写颜色${i+1}的正常售价`
+						})
+						return;
+					}
+					if (!this.specs[i].price) {
+						uni.showToast({
+							icon: "none",
+							title: `请填写颜色${i+1}的直销价`
+						})
+						return;
+					}
+					if (!this.specs[i].stock) {
+						uni.showToast({
+							icon: "none",
+							title: `请填写颜色${i+1}的库存`
+						})
+						return;
+					}
+				}
+
+				this.$http.post({
+					url: "/product/create",
+					data: this.form,
+					success: (res) => {
+						console.log(res)
+						uni.showModal({
+							title: "商品发布",
+							content: "发布成功",
+							success: (res) => {
+								if (res.confirm) {
+									uni.navigateBack()
+								}
+							}
+						})
+					}
+				})
 			}
 		}
 	}

pages/shopping-cart/shopping-cart.vue

@@ -50,7 +50,7 @@
 				</label>
 			</view>
 			<view class="total">合计 <text>￥{{total}}</text></view>
-			<view class="settlement"><button class="settlement-btn" type="default">结算</button></view>
+			<view class="settlement"><button class="settlement-btn" type="default" @tap="buy">结算</button></view>
 		</view>
 	</view>
 
@@ -126,6 +126,43 @@
 					num: num,
 					spec_index: spec_index
 				})
+			},
+			buy() {
+				let i = 0;
+				let postData = {}
+				for (let seller of this.cart) {
+					for (let product of seller.products) {
+						if(product.checked){
+							postData[`products[${i}]`] = JSON.stringify({
+								id: product.id,
+								spec_index: product.spec_index,
+								num: product.num
+							})
+							i++;
+						}
+					}
+				}
+
+				this.$http.post({
+					url: '/order/create',
+					data: postData,
+					success: (res) => {
+						for (const [key, value] of Object.entries(postData)) {
+							console.log(value)
+							this.$store.commit("cart/remove", JSON.parse(value))
+						}
+						uni.showModal({
+							content: "下单成功",
+							success: (res) => {
+								if (res.confirm) {
+									uni.navigateTo({
+										url: "/pages/order/order"
+									})
+								}
+							}
+						})
+					}
+				})
 			}
 		}
 	}

store/modules/cart.js

@@ -71,6 +71,7 @@ const mutations = {
 				}
 			}
 		}
+		this.commit("cart/save", state)
 	},
 	selectSeller(state, payload) {
 		for (let sellerIndex in state) {
@@ -143,8 +144,8 @@ const actions = {
 						spec_index: payload.specIndex,
 						spec_name: spec.name,
 						spec_image: spec.image,
-						spec_org_price: spec.org_price.toFixed(2),
-						spec_price: spec.price.toFixed(2),
+						spec_org_price: Number(spec.org_price).toFixed(2),
+						spec_price: Number(spec.price).toFixed(2),
 						spec_stock: spec.stock,
 						seller_id: res.data.data.user_id,
 						seller_nickname: res.data.data.user.nickname,