123456

pages.json

@@ -69,7 +69,7 @@
 		{
 			"path": "pages/collection/collection",
 			"style": {
-				"navigationBarTitleText": "银行卡管理"
+				"navigationBarTitleText": "支付方式管理"
 			}
 		},
 		{
@@ -321,7 +321,7 @@
 		{
 			"path": "pages/user/favorites",
 			"style": {
-				"navigationBarTitleText": "收藏夹"
+				"navigationBarTitleText": "我的收藏"
 			}
 		}, {
 			"path": "pages/user/coupon",

pages/collection/bank.vue

@@ -13,13 +13,17 @@
 				<text>所属银行</text>
 				<input type="text" v-model="idName" value="" placeholder="请输入银行" />
 			</view>
+			<view class="item">
+				<text>手机号</text>
+				<input type="text" v-model="phone" value="" placeholder="请输入手机号" />
+			</view>
 		</view>
 		<view class="button" @click="confirm()">确认</view>
 	</view>
 </template>
 
 <script>
-import { userEdit } from '@/api/set.js';
+import { auction,pay_list } from '@/api/wallet.js';
 import { orderData,getUserInfo } from '@/api/user.js';
 import { mapState, mapMutations } from 'vuex';
 export default {
@@ -31,18 +35,18 @@ export default {
 			name:'',
 			id:'',
 			idName:'',
+			phone:''
 		};
 	},
 	onLoad() {
-		if(this.userInfo.bank_code != null){
-			this.id = this.userInfo.bank_code
-		}
-		if(this.userInfo.bank_name != null){
-			this.idName = this.userInfo.bank_name
-		}
-		if(this.userInfo.bank_user_name != null){
-			this.name = this.userInfo.bank_user_name
-		}
+		pay_list().then(({data}) =>{
+			if(data.bank != ''){
+				this.name = data.bank.name
+				this.id = data.bank.payment
+				this.phone = data.bank.phone
+				this.idName = data.bank.bank
+			}
+		})
 	},
 	methods: {
 		...mapMutations('user', ['setUserInfo', 'setOrderInfo']),
@@ -57,43 +61,19 @@ export default {
 			if (!obj.id) {
 				return this.$api.msg('请输入银行卡号');
 			}
-			userEdit({
-				bank_user_name: obj.name,
-				bank_name: obj.idName,
-				bank_code: obj.id
+			if (!obj.phone) {
+				return this.$api.msg('请输入手机号码');
+			}
+			auction({
+				type:3,
+				name: obj.name,
+				bank: obj.idName,
+				payment: obj.id,
+				phone: obj.phone,
 			}).then(e => {
 				obj.$api.msg('修改成功');
-				obj.getUserInfo();
 			});
 		},
-		// 更新用户信息
-		getUserInfo() {
-			getUserInfo({})
-				.then(({ data }) => {
-					console.log(data)
-					this.setUserInfo(data);
-					// 获取用户数据完毕后在获取订单数据防止多次跳转到登录页
-					orderData({})
-						.then(({ data }) => {
-							this.setOrderInfo(data);
-							uni.navigateBack({
-								delta: 1
-							});
-						})
-						.catch(e => {
-							this.setOrderInfo({
-								complete_count: 0, //完成
-								received_count: 0, //待收货
-								unshipped_count: 0, //待发货
-								order_count: 0, //订单总数
-								unpaid_count: 0 //待付款
-							});
-						});
-				})
-				.catch(e => {
-					console.log(e);
-				});
-		},
 	}
 };
 </script>
@@ -137,7 +117,7 @@ page,
 	text-align: center;
 	width: 560rpx;
 	height: 80rpx;
-	background: linear-gradient(0deg, #2e58ff, #32c6ff);
+	background: #FD3B39;
 	border-radius: 40rpx;
 	font-size: 30rpx;
 	font-family: PingFangSC;

pages/collection/collection.vue

@@ -7,7 +7,7 @@
 					<view class="bank">银行卡</view>
 				</view>
 				<view class="gg" @click="nav('/pages/collection/bank')">
-					<view class="status" v-if="bankData.fullname != null">{{ bankData.fullname}}</view>
+					<view class="status" v-if="bankData.name != null">{{ bankData.name}}</view>
 					<view class="status" v-else>未添加</view>
 					<view class="img1"><text class="iconfont iconenter"></text></view>
 				</view>
@@ -18,12 +18,12 @@
 					<view class="bank">支付宝</view>
 				</view>
 				<view class="gg" @click="nav('/pages/collection/zfb')">
-					<view class="status" v-if="aliData.fullname != null">{{aliData.fullname}}</view>
+					<view class="status" v-if="aliData.name != null">{{aliData.name}}</view>
 					<view class="status" v-else>未添加</view>
 					<view class="img1"><text class="iconfont iconenter"></text></view>
 				</view>
 			</view>
-			<!-- <view class="collection-item">
+			<view class="collection-item">
 				<view class="left">
 					<view class="img">
 						<image src="../../static/user/wx.png" mode=""></image>
@@ -33,43 +33,46 @@
 					</view>
 				</view>
 				<view class="gg" @click="nav('/pages/collection/wx')">
-					<view class="status">
-						未添加
-					</view>
+					<view class="status" v-if="wx.name != null">{{wx.name}}</view>
+					<view class="status" v-else>未添加</view>
 					<view class="img1">
 						<text class="iconfont iconenter"></text>
 					</view>
 				</view>
-			</view> -->
+			</view>
 		</view>
 	</view>
 </template>
 
 <script>
 import { mapState, mapMutations } from 'vuex';
+import { pay_list } from '../../api/wallet.js'
 export default {
 	data() {
 		return {
-			aliData: {fullname:'',alino:''},
-			bankData: {fullname:'',bank:'',bankno:''},
+			aliData: {},
+			bankData: {},
+			wx:{},
 		};
 	},
 	computed: {
 		...mapState('user', ['userInfo', 'orderInfo', 'hasLogin']),
 	},
 	onShow() {
-		this.aliData.fullname = this.userInfo.alipay_name;
-		console.log(this.aliData.fullname);
-		this.aliData.alino = this.userInfo.alipay_code
-		this.bankData.fullname = this.userInfo.bank_user_name;
-		this.bankData.bank = this.userInfo.bank_name;
-		this.bankData.bankno = this.userInfo.bank_code;
+		this.loadDate();
 	},
 	methods: {
 		nav(url) {
 			uni.navigateTo({
 				url
 			});
+		},
+		loadDate() {
+			pay_list().then(({data}) =>{
+				this.wx = data.wx
+				this.aliData = data.zfb
+				this.bankData = data.bank
+			})
 		}
 	}
 };

pages/collection/wx.vue

@@ -1,40 +1,90 @@
 <template>
 	<view class="content">
 		<view class="box">
+			<view class="wx">
+				<text>姓名</text>
+				<input type="text" v-model="name" value="" placeholder="请输入姓名" />
+			</view>
 			<view class="wx">
 				<text>微信号</text>
-				<input type="text" value="" placeholder="请输入微信号" />
+				<input type="text" v-model="code" value="" placeholder="请输入微信号" />
+			</view>
+			<view class="wx">
+				<text>手机号</text>
+				<input type="text" v-model="phone" value="" placeholder="请输入手机号" />
 			</view>
 			<view class="erweima">
 				<text>微信收款码</text>
-				<view class="img" @click="upload()">
+				<view class="img" @click="uploads()">
 					<image src="../../static/user/erweima.png" mode="" v-if="image == ''"></image>
 					<image :src="image" mode="" v-else></image>
 				</view>
 			</view>
 		</view>
-		<view class="button">
+		<view class="button" @click="confirm()">
 			确认
 		</view>
 	</view>
 </template>
 
 <script>
-	import { uploads } from '@/api/user.js'
+	import { upload } from '@/api/order.js'
+	import { auction,pay_list } from '@/api/wallet.js';
 	export default {
 		data() {
 			return {
-				image:''
+				code:'',
+				name:'',
+				image:'',
+				phone:''
 			};
 		},
+		onLoad() {
+			pay_list().then(({data}) =>{
+				if(data.wx != ''){
+					this.name = data.wx.name
+					this.code = data.wx.payment
+					this.image = data.wx.image
+					this.phone = data.wx.phone
+				}
+			})
+		},
 		methods: {
-			upload(){
-				uploads({
+			uploads(){
+				upload({
 					filename: ''
 				}).then(data => {
 					this.image = data[0].url;
 				})
-			}
+			},
+			confirm() {
+				let obj = this;
+				if (!obj.name) {
+					return this.$api.msg('请输入提款人姓名');
+				}
+				if (!obj.code) {
+					return this.$api.msg('请输入微信账号');
+				}
+				if (!obj.image) {
+					return this.$api.msg('请上传微信二维码');
+				}
+				if (!obj.phone) {
+					return this.$api.msg('请输入手机号码');
+				}
+				auction({
+					type:1,
+					name: obj.name,
+					payment: obj.code,
+					image: obj.image,
+					phone: obj.phone,
+				})
+					.then(e => {
+						obj.$api.msg('修改成功');
+					})
+					.catch(e => {
+						console.log(e);
+					});
+			},
 		}
 	}
 </script>
@@ -93,7 +143,7 @@ page , .content{
 	margin: 0 auto;
 	width: 560rpx;
 	height: 80rpx;
-	background: linear-gradient(0deg, #2E58FF, #32C6FF);
+	background: #FD3B39;
 	border-radius: 40rpx;
 	font-size: 30rpx;
 	font-family: PingFangSC;

pages/collection/zfb.vue

@@ -9,6 +9,10 @@
 				<text>支付宝账号</text>
 				<input type="text" v-model="id" value="" placeholder="请输入支付宝账号" />
 			</view>
+			<view class="item">
+				<text>手机号</text>
+				<input type="text" v-model="phone" value="" placeholder="请输入手机号" />
+			</view>
 		</view>
 		<view class="button" @click="confirm()">确认</view>
 	</view>
@@ -17,7 +21,7 @@
 <script>
 import { orderData, getUserInfo } from '@/api/user.js';
 import { mapState, mapMutations } from 'vuex';
-import { userEdit } from '@/api/set.js';
+import { auction,pay_list } from '@/api/wallet.js';
 export default {
 	computed: {
 		...mapState('user', ['userInfo', 'orderInfo', 'hasLogin'])
@@ -25,16 +29,18 @@ export default {
 	data() {
 		return {
 			name: '',
-			id: ''
+			id: '',
+			phone:''
 		};
 	},
 	onLoad() {
-		if (this.userInfo.alipay_code != null) {
-			this.id = this.userInfo.alipay_code;
-		}
-		if (this.userInfo.alipay_name != null) {
-			this.name = this.userInfo.alipay_name;
-		}
+		pay_list().then(({data}) =>{
+			if(data.zfb != ''){
+				this.name = data.zfb.name
+				this.id = data.zfb.payment
+				this.phone = data.zfb.phone
+			}
+		})
 	},
 	methods: {
 		...mapMutations('user', ['setUserInfo', 'setOrderInfo']),
@@ -46,41 +52,17 @@ export default {
 			if (!obj.id) {
 				return this.$api.msg('请输入支付宝账号');
 			}
-			userEdit({
-				alipay_name: obj.name,
-				alipay_code: obj.id
+			if (!obj.phone) {
+				return this.$api.msg('请输入手机号码');
+			}
+			auction({
+				type:2,
+				name: obj.name,
+				payment: obj.id,
+				phone: obj.phone,
 			})
 				.then(e => {
 					obj.$api.msg('修改成功');
-					obj.getUserInfo();
-				})
-				.catch(e => {
-					console.log(e);
-				});
-		},
-		// 更新用户信息
-		getUserInfo() {
-			getUserInfo({})
-				.then(({ data }) => {
-					console.log(data)
-					this.setUserInfo(data);
-					// 获取用户数据完毕后在获取订单数据防止多次跳转到登录页
-					orderData({})
-						.then(({ data }) => {
-							this.setOrderInfo(data);
-							uni.navigateBack({
-								delta: 1
-							});
-						})
-						.catch(e => {
-							this.setOrderInfo({
-								complete_count: 0, //完成
-								received_count: 0, //待收货
-								unshipped_count: 0, //待发货
-								order_count: 0, //订单总数
-								unpaid_count: 0 //待付款
-							});
-						});
 				})
 				.catch(e => {
 					console.log(e);
@@ -128,7 +110,7 @@ page,
 	text-align: center;
 	width: 560rpx;
 	height: 80rpx;
-	background: linear-gradient(0deg, #2e58ff, #32c6ff);
+	background: #FD3B39;
 	border-radius: 40rpx;
 	font-size: 30rpx;
 	font-family: PingFangSC;

pages/order/order.vue

@@ -3,158 +3,94 @@
 		<view class="order-title">
 			<text>我的订单</text>
 			<view class="roder-content">
-				<view class="left" :class="{current:currentIndex===index}" :key='index' v-for="(item,index) in maiList"
-					@click="navGo(index)">
-					{{item.title}}
-				</view>
-				<!-- <view class="left">
-					我的卖单
-				</view> -->
+				<view class="left" :class="{ current: currentIndex === index }" :key="index" v-for="(item, index) in maiList" @click="navGo(index)">{{ item.title }}</view>
 			</view>
 		</view>
-		<view class="navbar" v-show="currentIndex==0">
-			<view v-for="(item, index) in navList" :key="index" class="nav-item"
-				:class="{ current: tabCurrentIndex === index }" @click="tabClick(index)">{{ item.text }}</view>
+		<view class="navbar" v-show="currentIndex == 0">
+			<view v-for="(item, index) in navList" :key="index" class="nav-item" :class="{ current: tabCurrentIndex === index }" @click="tabClick(index, 0)">{{ item.text }}</view>
 		</view>
-		<view class="navbar" v-show="currentIndex==1">
-			<view v-for="(item, index) in navList1" :key="index" class="nav-item"
-				:class="{ current: tabCurrentIndex === index }" @click="tabClick(index)">{{ item.text }}</view>
+		<view class="navbar" v-show="currentIndex == 1">
+			<view v-for="(item, index) in navList1" :key="index" class="nav-item" :class="{ current: tabCurrentIndex1 === index }" @click="tabClick(index, 1)">
+				{{ item.text }}
+			</view>
 		</view>
 
-		<swiper :current="tabCurrentIndex" class="swiper-box-one" duration="300" @change="changeTab"
-			:style="{'height': height}">
-			<swiper-item class="tab-content" v-for="(tabItem, tabIndex) in navList" :key="tabIndex"
-				:style="{'height': height}" v-if="currentIndex==0">
+		<swiper :current="currentAuto" class="swiper-box-one" duration="0" @change="changeTab">
+			<swiper-item class="tab-content" v-for="(tabItem, tabIndex) in navList" :key="tabIndex" v-if="currentIndex == 0">
 				<scroll-view class="list-scroll-content" scroll-y @scrolltolower="loadData">
 					<!-- 空白页 -->
 					<empty v-if="tabItem.loaded === true && tabItem.orderList.length === 0"></empty>
 
 					<!-- 订单列表 -->
-					<view @click="goToOrderDetail(item)" v-for="(item, index) in tabItem.orderList" :key="index"
-						class="order-item">
+					<view v-for="(item, index) in tabItem.orderList" :key="index" class="order-item">
 						<view class="i-top b-b">
-							<text class="time">{{ item._add_time }}</text>
-							<text class="state" :style="{ color: item.stateTipColor }">{{ item._status._title }}</text>
-							<text v-if="item.status === 4" class="del-btn iconfont icondelete"
-								@click="deleteOrder(index)"></text>
+							<text class="time">{{ item.order_id }}</text>
+							<text class="state" :style="{ color: item.stateTipColor }">{{ item.stateTip }}</text>
+							<text v-if="item.status === 4" class="del-btn iconfont icondelete" @click="deleteOrder(index)"></text>
 						</view>
 
-						<scroll-view v-if="item.cartInfo.length > 1" class="goods-box" scroll-x>
-							<view v-for="(goodsItem, goodsIndex) in item.cartInfo" :key="goodsIndex" class="goods-item">
-								<image class="goods-img" :src="goodsItem.productInfo.image" mode="aspectFill"></image>
-							</view>
-						</scroll-view>
-						<!-- <view v-if="item.cartInfo.length === 1" class="goods-box-single" v-for="(goodsItem, goodsIndex) in item.cartInfo" :key="goodsIndex">
-							<image class="goods-img" :src="goodsItem.productInfo.image" mode="aspectFill"></image>
+						<view class="goods-box-single">
+							<image class="goods-img" :src="item.image" mode="aspectFill"></image>
 							<view class="right">
-								<text class="title clamp">{{ goodsItem.productInfo.store_name }}</text>
-								<text class="attr-box">{{ goodsItem.attrInfo ? goodsItem.attrInfo.suk : '' }} x {{ goodsItem.cart_num }}</text>
-								<text class="price">{{ moneyNum(goodsItem.productInfo.price)}}</text>
-							</view>
-						</view> -->
-						<view class="goods-box-single" v-for="(goodsItem, goodsIndex) in item.cartInfo"
-							:key="goodsIndex">
-							<image class="goods-img" :src="goodsItem.productInfo.image" mode="scaleToFill"></image>
-							<view class="right">
-								<view class="flex-start">
-									<text class="title clamp">{{ goodsItem.productInfo.store_name }}</text>
-									<text class="price">{{ goodsItem.productInfo.price|moneyNum }}</text>
-								</view>
-								<view class="row flex">
-									<text
-										class="row_title">{{ goodsItem.productInfo.attrInfo ? goodsItem.productInfo.attrInfo.suk : '' }}</text>
-									<text class="attr-box"> x {{ goodsItem.cart_num }}</text>
-								</view>
+								<text class="title clamp">{{ item.name }}</text>
+								<text class="attr-box">x1</text>
+								<text class="price">{{ moneyNum(item.price) }}</text>
 							</view>
 						</view>
 
 						<view class="price-box">
 							共
-							<text class="num">{{ item.cartInfo.length }}</text>
+							<text class="num">1</text>
 							件商品 邮费
-							<text class="price">{{ moneyNum(item.pay_postage)}}</text>
+							<text class="price">0</text>
 							实付款
-							<text class="price">{{ moneyNum(item.pay_price)}}</text>
-						</view>
-						<view class="action-box b-t" v-if="item.status != 5">
-							<button v-if="item._status._title == '未支付'" class="action-btn"
-								@click.stop="cancelOrder(item)">取消订单</button>
-							<button v-if="item._status._title == '未支付'" @click.stop="orderPay(item)"
-								class="action-btn recom">立即支付</button>
-							<button v-if="item._status._title == '待评价'" class="action-btn">评价</button>
-							<button v-if="item._status._title == '待收货'" @click.stop="orderTake(item, index)"
-								class="action-btn">确认收货</button>
-							<button v-if="item._status._title == '未发货'" class="action-btn"
-								@click.stop="orderRefund(item)">申请退款</button>
+							<text class="price">{{ moneyNum(item.price) }}</text>
 						</view>
+						<view class="action-box b-t" v-if="item.stateTip == '待支付'"><button @click.stop="pay(item)" class="action-btn recom">立即支付</button></view>
 					</view>
 
 					<uni-load-more :status="tabItem.loadingType"></uni-load-more>
 				</scroll-view>
 			</swiper-item>
-			<swiper-item class="tab-content" v-for="(tabItem, tabIndex) in navList" :key="tabIndex"
-				:style="{'height': height}" v-if="currentIndex==1">
+			<swiper-item class="tab-content" v-for="(tabItem, tabIndex) in navList1" :key="tabIndex" v-if="currentIndex == 1">
 				<scroll-view class="list-scroll-content" scroll-y @scrolltolower="loadData">
 					<!-- 空白页 -->
 					<empty v-if="tabItem.loaded === true && tabItem.orderList.length === 0"></empty>
 
 					<!-- 订单列表 -->
-					<view @click="goToOrderDetail(item)" v-for="(item, index) in tabItem.orderList" :key="index"
-						class="order-item">
+					<view v-for="(item, index) in tabItem.orderList" :key="index" class="order-item">
 						<view class="i-top b-b">
-							<text class="time">{{ item._add_time }}</text>
-							<text class="state" :style="{ color: item.stateTipColor }">{{ item._status._title }}</text>
-							<text v-if="item.status === 4" class="del-btn iconfont icondelete"
-								@click="deleteOrder(index)"></text>
+							<text class="time">{{ item.order_id }}</text>
+							<text class="state" :style="{ color: item.stateTipColor }">{{ item.stateTip }}</text>
 						</view>
-
-						<scroll-view v-if="item.cartInfo.length > 1" class="goods-box" scroll-x>
-							<view v-for="(goodsItem, goodsIndex) in item.cartInfo" :key="goodsIndex" class="goods-item">
-								<image class="goods-img" :src="goodsItem.productInfo.image" mode="aspectFill"></image>
-							</view>
-						</scroll-view>
-						<!-- <view v-if="item.cartInfo.length === 1" class="goods-box-single" v-for="(goodsItem, goodsIndex) in item.cartInfo" :key="goodsIndex">
-							<image class="goods-img" :src="goodsItem.productInfo.image" mode="aspectFill"></image>
-							<view class="right">
-								<text class="title clamp">{{ goodsItem.productInfo.store_name }}</text>
-								<text class="attr-box">{{ goodsItem.attrInfo ? goodsItem.attrInfo.suk : '' }} x {{ goodsItem.cart_num }}</text>
-								<text class="price">{{ moneyNum(goodsItem.productInfo.price)}}</text>
-							</view>
-						</view> -->
-						<view class="goods-box-single" v-for="(goodsItem, goodsIndex) in item.cartInfo"
-							:key="goodsIndex">
-							<image class="goods-img" :src="goodsItem.productInfo.image" mode="scaleToFill"></image>
+						<view class="goods-box-single">
+							<image class="goods-img" :src="item.image" mode="scaleToFill"></image>
 							<view class="right">
 								<view class="flex-start">
-									<text class="title clamp">{{ goodsItem.productInfo.store_name }}</text>
-									<text class="price">{{ goodsItem.productInfo.price|moneyNum }}</text>
-								</view>
-								<view class="row flex">
-									<text
-										class="row_title">{{ goodsItem.productInfo.attrInfo ? goodsItem.productInfo.attrInfo.suk : '' }}</text>
-									<text class="attr-box"> x {{ goodsItem.cart_num }}</text>
+									<text class="title clamp">{{ item.name }}</text>
+									<text class="price">{{ item.price | moneyNum }}</text>
 								</view>
+								<view class="row flex"><text class="attr-box">x1</text></view>
 							</view>
 						</view>
 
-						<view class="price-box">
-							共
-							<text class="num">{{ item.cartInfo.length }}</text>
-							件商品 邮费
-							<text class="price">{{ moneyNum(item.pay_postage)}}</text>
-							实付款
-							<text class="price">{{ moneyNum(item.pay_price)}}</text>
+						<view class="buy-box">
+							<view class="buy-info" v-if="item.status != 0">
+								<view class="font">买家：</view>
+								<image class="avter" :src="item.avatar" mode=""></image>
+								<view class="buy-name">{{ item.nickname }}</view>
+								<view class="phone">{{item.phone}}</view>
+							</view>
+						</view>
+						<view class="upimg" v-if="item.status == 2 || item.status == 3">
+							<view class="up-tit">打款凭证：</view>
+							<view class="img-wrap" v-if="item.upload_image" @click="lookimg(item.upload_image)"><image :src="item.upload_image" mode=""></image></view>
+							<view class="" style="color: #0F253A;font-weight: bold;font-size: 26rpx;" v-else>买家未上传支付凭证</view>
 						</view>
-						<view class="action-box b-t" v-if="item.status != 5">
-							<button v-if="item._status._title == '未支付'" class="action-btn"
-								@click.stop="cancelOrder(item)">取消订单</button>
-							<button v-if="item._status._title == '未支付'" @click.stop="orderPay(item)"
-								class="action-btn recom">立即支付</button>
-							<button v-if="item._status._title == '待评价'" class="action-btn">评价</button>
-							<button v-if="item._status._title == '待收货'" @click.stop="orderTake(item, index)"
-								class="action-btn">确认收货</button>
-							<button v-if="item._status._title == '未发货'" class="action-btn"
-								@click.stop="orderRefund(item)">申请退款</button>
+						<view class="action-box b-t" v-if="item.status == 1"><button @click.stop="orderPay(item)" class="action-btn recom">联系买家</button></view>
+						<view class="action-box b-t" v-if="item.status == 2">
+							<!-- <button @click.stop="orderPay(item)" class="refuse recom">拒绝</button> -->
+							<button @click.stop="orderPay(item)" class="action-btn recom">通过</button>
 						</view>
 					</view>
 
@@ -162,247 +98,269 @@
 				</scroll-view>
 			</swiper-item>
 		</swiper>
+		<!-- <u-tabbar activeColor="#f42b4e" v-model="current" :list="tabbar" :mid-button="true"></u-tabbar> -->
 	</view>
 </template>
 
 <script>
-	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
-	import empty from '@/components/empty';
-	import {
-		orderList,
-		orderCancel,
-		orderDel,
-		orderTake
-	} from '@/api/order.js';
-	import {
-		tabbar
-	} from '@/utils/tabbar.js'
-	export default {
-		components: {
-			uniLoadMore,
-			empty
-		},
-		data() {
-			return {
-				height: '', //第一层swiper高度
-				tabbar: tabbar,
-				current: 1,
-				currentIndex: 0,
-				tabCurrentIndex: 0,
-				maiList: [{
-						title: '我的买单'
-					},
-					{
-						title: '我的卖单'
-					}
-				],
-				navList: [{
-						state: 0,
-						text: '全部',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					},
-					{
-						state: 1,
-						text: '待支付',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					},
-					{
-						state: 2,
-						text: '待放货',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					},
-					{
-						state: 3,
-						text: '待挂售',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					},
-					{
-						state: 4,
-						text: '提货订单',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					}
-				],
-				navList1: [{
-						state: 0,
-						text: '全部',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					},
-					{
-						state: 1,
-						text: '售卖中',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					},
-					{
-						state: 2,
-						text: '待支付',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					},
-					{
-						state: 3,
-						text: '待放货',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					},
-					{
-						state: 4,
-						text: '已完成',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					}
-				],
-
-			};
-		},
-
-		onLoad(options) {
-			/**
-			 * 修复app端点击除全部订单外的按钮进入时不加载数据的问题
-			 * 替换onLoad下代码即可
-			 */
-			this.tabCurrentIndex = +options.state;
-			// #ifndef MP
+import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
+import empty from '@/components/empty';
+import { orderList, orderCancel, orderDel, orderTake, adopt, user_auction_order, seller } from '@/api/order.js';
+import { tabbar } from '@/utils/tabbar.js';
+export default {
+	components: {
+		uniLoadMore,
+		empty
+	},
+	data() {
+		return {
+			height: '', //第一层swiper高度
+			tabbar: tabbar,
+			current: 1, //底部tabar选中的icon对象
+			currentIndex: 0, //当前选中的第一级0为我要买单，1我要卖单
+			tabCurrentIndex: 0, //当前选中的第二级别我要买单选中项
+			tabCurrentIndex1: 0, //当前选中的第二级别我要卖单选中项
+			maiList: [
+				{
+					title: '我的买单'
+				},
+				{
+					title: '我的卖单'
+				}
+			],
+			navList: [
+				{
+					state: 0,
+					text: '已过期',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				},
+				{
+					state: 1,
+					text: '待支付',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				},
+				{
+					state: 2,
+					text: '待审核',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				},
+				{
+					state: 3,
+					text: '已完成',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				}
+			],
+			navList1: [
+				{
+					state: 0,
+					text: '已过期',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				},
+				{
+					state: 1,
+					text: '待支付',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				},
+				{
+					state: 2,
+					text: '待审核',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				},
+				{
+					state: 3,
+					text: '已完成',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				}
+			]
+		};
+	},
+	computed: {
+		currentAuto() {
+			if (this.currentIndex == 0) {
+				return this.tabCurrentIndex;
+			}
+			if (this.currentIndex == 1) {
+				return this.tabCurrentIndex1;
+			}
+		}
+	},
+	onLoad(options) {
+		/**
+		 * 修复app端点击除全部订单外的按钮进入时不加载数据的问题
+		 * 替换onLoad下代码即可
+		 */
+		this.tabCurrentIndex = +options.state || 0;
+		// #ifndef MP
+		this.loadData();
+		// #endif
+		// #ifdef MP
+		if (options.state == 0) {
 			this.loadData();
-			// #endif
-			// #ifdef MP
-			if (options.state == 0) {
-				this.loadData();
+		}
+		// #endif
+	},
+	// #ifdef APP-PLUS || H5
+	onBackPress(e) {
+		uni.switchTab({
+			url: '/pages/user/user'
+		});
+		return true;
+	},
+	// #endif
+	filters: {
+		moneyNum(value) {
+			return +value;
+		}
+	},
+	// 页面加载完获取swiper高度
+	onReady(res) {
+		var obj = this;
+		uni.getSystemInfo({
+			success: resu => {
+				const query = uni.createSelectorQuery();
+				query.select('.swiper-box-one').boundingClientRect();
+				query.exec(function(res) {
+					console.log(res, 'ddddddddddddd');
+					obj.height = resu.windowHeight - res[0].top + 'px';
+					console.log('打印页面的剩余高度', obj.height);
+				});
+			},
+			fail: res => {}
+		});
+	},
+	methods: {
+		//顶部tab点击
+		tabClick(index, type) {
+			if (type == 0) {
+				this.tabCurrentIndex = index;
+			}
+			if (type == 1) {
+				this.tabCurrentIndex1 = index;
 			}
-			// #endif
 		},
-		// #ifdef APP-PLUS || H5
-		onBackPress(e) {
-			uni.switchTab({
-				url: '/pages/user/user',
-			});
-			return true;
+		navGo(index) {
+			this.currentIndex = index;
+			console.log(this.currentIndex, '点击');
+			this.loadData();
 		},
-		// #endif
-		filters: {
-			moneyNum(value) {
-				return +value;
-			},
+		// 转换金额为数字
+		moneyNum(value) {
+			return +value;
 		},
-		// 页面加载完获取swiper高度
-		onReady(res) {
-			var obj = this;
-			uni.getSystemInfo({
-				success: resu => {
-					const query = uni.createSelectorQuery();
-					query.select('.swiper-box-one').boundingClientRect();
-					query.exec(function(res) {
-						console.log(res, 'ddddddddddddd');
-						obj.height = resu.windowHeight - res[0].top + 'px';
-						console.log('打印页面的剩余高度', obj.height);
-					});
-				},
-				fail: res => {}
+		// 查看大图
+		lookimg(src) {
+			console.log(src);
+			let arr = [src]
+			uni.previewImage({
+				current: src,
+				urls: arr
 			});
 		},
-		methods: {
-			navGo(index) {
-				this.currentIndex = index
-				console.log(this.currentIndex, '点击');
-			},
-			// 转换金额为数字
-			moneyNum(value) {
-				return +value;
-			},
-			// 确认收货
-			orderTake(item, index) {
-				let obj = this;
-				uni.showModal({
-					title: '是否确认收货？',
-					success: () => {
-						orderTake({
-								uni: item.order_id
-							})
-							.then(e => {
-								obj.navList[obj.tabCurrentIndex].orderList.splice(index, 1);
-								uni.showToast({
-									title: '收货成功'
-								});
-							})
-							.catch(e => {
-								console.log(e);
+		// 确认收货
+		orderTake(item, index) {
+			let obj = this;
+			uni.showModal({
+				title: '是否确认收货？',
+				success: () => {
+					orderTake({
+						uni: item.order_id
+					})
+						.then(e => {
+							obj.navList[obj.tabCurrentIndex].orderList.splice(index, 1);
+							uni.showToast({
+								title: '收货成功'
 							});
-					}
-				});
-			},
-			//跳转到订单详情
-			goToOrderDetail(e) {
-				uni.navigateTo({
-					url: '/pages/order/orderDetail?id=' + e.order_id
-				});
-			},
-			// 申请退款
-			orderRefund(e) {
-				uni.navigateTo({
-					url: '/pages/order/orderRefund?id=' + e.order_id
-				});
-			},
-			// 订单支付
-			orderPay(e) {
-				uni.navigateTo({
-					url: '/pages/money/pay?type=1&ordid=' + e.order_id + '&money=' + e.pay_price
-				});
-			},
-			//获取订单列表
-			loadData(source) {
-				//这里是将订单挂载到tab列表下
-				let index = this.tabCurrentIndex;
-				let navItem = this.navList[index];
-				let state = navItem.state;
-				if (source === 'tabChange' && navItem.loaded === true) {
-					//tab切换只有第一次需要加载数据
-					return;
-				}
-				if (navItem.loadingType === 'loading') {
-					//防止重复加载
-					return;
-				}
-				if (navItem.loadingType === 'noMore') {
-					//防止重复加载
-					return;
+						})
+						.catch(e => {
+							console.log(e);
+						});
 				}
-				// 修改当前对象状态为加载中
-				navItem.loadingType = 'loading';
+			});
+		},
+		//跳转到订单详情
+		goToOrderDetail(e) {
+			uni.navigateTo({
+				url: '/pages/order/orderDetail?id=' + e.order_id
+			});
+		},
+		// 申请退款
+		orderRefund(e) {
+			uni.navigateTo({
+				url: '/pages/order/orderRefund?id=' + e.order_id
+			});
+		},
+		// 订单支付
+		pay(item) {
+			uni.navigateTo({
+				url:'/pages/hall/hallpay?ordid='+item.order_id
+			})
+		},
+		orderPay(e) {
+			console.log(e);
+			adopt({order_id: e.order_id}).then(({data}) =>{
+				this.loadData()
+			})
+		},
+		//获取订单列表
+		loadData(source) {
+			//这里是将订单挂载到tab列表下
+			let index, navItem;
+			if (this.currentIndex == 0) {
+				index = this.tabCurrentIndex;
+				navItem = this.navList[index];
+			}
+			if (this.currentIndex == 1) {
+				index = this.tabCurrentIndex1;
+				navItem = this.navList1[index];
+			}
 
-				orderList({
-						type: state,
-						page: navItem.page,
-						limit: navItem.limit
-					})
-					.then(({
-						data
-					}) => {
+			let state = navItem.state;
+			if (source === 'tabChange' && navItem.loaded === true) {
+				//tab切换只有第一次需要加载数据
+				return;
+			}
+			if (navItem.loadingType === 'loading') {
+				//防止重复加载
+				return;
+			}
+			if (navItem.loadingType === 'noMore') {
+				//防止重复加载
+				return;
+			}
+			// 修改当前对象状态为加载中
+			navItem.loadingType = 'loading';
+			if (this.currentIndex == 0) {
+				user_auction_order({
+					type: state,
+					page: navItem.page,
+					limit: navItem.limit
+				})
+					.then(({ data }) => {
+						console.log(data);
 						let arr = data.map(e => {
 							let b = this.orderStateExp(e.status);
 							e.stateTip = b.stateTip;
@@ -411,7 +369,6 @@
 						});
 						navItem.orderList = navItem.orderList.concat(arr);
 
-
 						// console.log(navItem.orderList);
 						navItem.page++;
 						if (navItem.limit == data.length) {
@@ -421,7 +378,6 @@
 						} else {
 							//判断是否还有数据， 有改为 more， 没有改为noMore
 							navItem.loadingType = 'noMore';
-
 						}
 						uni.hideLoading();
 						this.$set(navItem, 'loaded', true);
@@ -429,520 +385,637 @@
 					.catch(e => {
 						console.log(e);
 					});
-			},
+			}
+			if (this.currentIndex == 1) {
+				seller({
+					type: state,
+					page: navItem.page,
+					limit: navItem.limit
+				})
+					.then(({ data }) => {
+						console.log(data);
+						let arr = data.map(e => {
+							let b = this.orderStateExp(e.status);
+							e.stateTip = b.stateTip;
+							e.stateTipColor = b.stateTipColor;
+							return e;
+						});
+						navItem.orderList = navItem.orderList.concat(arr);
 
-			//swiper 切换
-			changeTab(e) {
+						// console.log(navItem.orderList);
+						navItem.page++;
+						if (navItem.limit == data.length) {
+							//判断是否还有数据， 有改为 more， 没有改为noMore
+							navItem.loadingType = 'more';
+							return;
+						} else {
+							//判断是否还有数据， 有改为 more， 没有改为noMore
+							navItem.loadingType = 'noMore';
+						}
+						uni.hideLoading();
+						this.$set(navItem, 'loaded', true);
+					})
+					.catch(e => {
+						console.log(e);
+					});
+			}
+		},
+		//swiper 切换
+		changeTab(e) {
+			if (this.currentIndex == 0) {
 				this.tabCurrentIndex = e.target.current;
-				this.loadData('tabChange');
-			},
+			}
+			if (this.currentIndex == 1) {
+				this.tabCurrentIndex1 = e.target.current;
+			}
+			this.loadData('tabChange');
+		},
 
-			//删除订单
-			deleteOrder(index) {
-				uni.showLoading({
-					title: '请稍后'
-				});
-				setTimeout(() => {
-					this.navList[this.tabCurrentIndex].orderList.splice(index, 1);
-					uni.hideLoading();
-				}, 600);
-			},
-			//取消订单
-			cancelOrder(item) {
-				uni.showModal({
-					title: '订单取消',
-					content: '是否取消订单？',
-					success: e => {
-						if (e.confirm) {
-							uni.showLoading({
-								title: '请稍后'
-							});
-							orderCancel({
-									id: item.order_id
-								})
-								.then(e => {
-									uni.showToast({
-										title: '取消成功',
-										duration: 2000,
-										position: 'top'
-									});
-								})
-								.catch(e => {
-									console.log(e);
+		//删除订单
+		deleteOrder(index) {
+			uni.showLoading({
+				title: '请稍后'
+			});
+			setTimeout(() => {
+				this.navList[this.tabCurrentIndex].orderList.splice(index, 1);
+				uni.hideLoading();
+			}, 600);
+		},
+		//取消订单
+		cancelOrder(item) {
+			uni.showModal({
+				title: '订单取消',
+				content: '是否取消订单？',
+				success: e => {
+					if (e.confirm) {
+						uni.showLoading({
+							title: '请稍后'
+						});
+						orderCancel({
+							id: item.order_id
+						})
+							.then(e => {
+								uni.showToast({
+									title: '取消成功',
+									duration: 2000,
+									position: 'top'
 								});
-							//取消订单后删除待付款中该项
-							let list = this.navList[this.tabCurrentIndex].orderList;
-							let index = list.findIndex(val => val.id === item.id);
-							index !== -1 && list.splice(index, 1);
-							uni.hideLoading();
-						}
+							})
+							.catch(e => {
+								console.log(e);
+							});
+						//取消订单后删除待付款中该项
+						let list = this.navList[this.tabCurrentIndex].orderList;
+						let index = list.findIndex(val => val.id === item.id);
+						index !== -1 && list.splice(index, 1);
+						uni.hideLoading();
 					}
-				});
-			},
-
-			//订单状态文字和颜色
-			orderStateExp(state) {
-				let stateTip = '',
-					stateTipColor = '#fa436a';
-				switch (+state) {
-					case 0:
-						stateTip = '待付款';
-						break;
-					case 1:
-						stateTip = '待发货';
-						break;
-					case 2:
-						stateTip = '待收货';
-						break;
-					case 3:
-						stateTip = '待评价';
-						break;
-					case 4:
-						stateTip = '已完成';
-						stateTipColor = '#4166FC';
-						break;
-					case 9:
-						stateTip = '订单已关闭';
-						stateTipColor = '#909399';
-						break;
-
-						//更多自定义
 				}
-				return {
-					stateTip,
-					stateTipColor
-				};
+			});
+		},
+
+		//订单状态文字和颜色
+		orderStateExp(state) {
+			let stateTip = '',
+				stateTipColor = '#fa436a';
+			switch (+state) {
+				case 0:
+					stateTip = '已过期';
+					break;
+				case 1:
+					stateTip = '待支付';
+					break;
+				case 2:
+					stateTip = '待审核';
+					break;
+				case 3:
+					stateTip = '已完成';
+					break;
+				case 9:
+					stateTip = '订单已关闭';
+					stateTipColor = '#909399';
+					break;
+
+				//更多自定义
 			}
+			return {
+				stateTip,
+				stateTipColor
+			};
 		}
-	};
+	}
+};
 </script>
 
 <style lang="scss">
-	page,
-	.content {
-		background: $page-color-base;
-		height: 100%;
-	}
-
-	.order-title {
-
-
-		width: 750rpx;
-		height: 262rpx;
-		// background: linear-gradient(-41deg, rgba(60, 237, 237, 0.99), #04B8FF, #375AFE);
-		background: url(../../static/img/order99.png) repeat-x 0;
+page,
+.content {
+	background: $page-color-base;
+	height: 100%;
+}
+
+.order-title {
+	width: 750rpx;
+	height: 135px;
+	// background: linear-gradient(-41deg, rgba(60, 237, 237, 0.99), #04B8FF, #375AFE);
+	background: url(../../static/img/order99.png) repeat-x 0;
+	display: flex;
+	flex-direction: column;
+	// padding: 50rpx 0;
+	text-align: center;
+
+	text {
+		margin: 30px 0;
+		font-size: 17px;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #ffffff;
+	}
+
+	.roder-content {
 		display: flex;
-		flex-direction: column;
-		// padding: 50rpx 0;
-		text-align: center;
-
-		text {
-			margin: 60rpx 0;
-			font-size: 34rpx;
+		justify-content: space-around;
+
+		.left {
+			width: 168px;
+			height: 40px;
+			line-height: 40px;
+			border: 1px solid #ffffff;
+			border-radius: 5px;
+			text-align: center;
+			font-size: 15px;
 			font-family: PingFang SC;
 			font-weight: bold;
-			color: #FFFFFF;
+			color: #ffffff;
+			background: #dc262b;
 		}
 
-		.roder-content {
-
-
-			display: flex;
-			justify-content: space-around;
-
-			.left {
-				width: 336rpx;
-				height: 81rpx;
-				line-height: 81rpx;
-				border: 2rpx solid #FFFFFF;
-				border-radius: 10rpx;
-				text-align: center;
-				font-size: 30rpx;
-				font-family: PingFang SC;
-				font-weight: bold;
-				color: #FFFFFF;
-				background: #DC262b;
-			}
-
-			.current {
-				color: #DC262B;
-				background: #FFFFFF;
-			}
+		.current {
+			color: #dc262b;
+			background: #ffffff;
 		}
 	}
+}
 
-	.swiper-box {
-		background: red;
-	}
+.swiper-box {
+	background: red;
+}
 
-	.list-scroll-content {
-		height: 100%;
-	}
+.list-scroll-content {
+	height: 100%;
+}
 
+.uni-swiper-item {
+	height: auto;
+}
 
-	.uni-swiper-item {
-		height: auto;
-	}
+.navbar {
+	display: flex;
+	height: 40px;
+	padding: 0 5px;
+	background: #fff;
+	box-shadow: 0 1px 5px rgba(0, 0, 0, 0.06);
+	position: relative;
+	z-index: 10;
 
-	.navbar {
+	.nav-item {
+		flex: 1;
 		display: flex;
-		height: 40px;
-		padding: 0 5px;
-		background: #fff;
-		box-shadow: 0 1px 5px rgba(0, 0, 0, 0.06);
+		justify-content: center;
+		align-items: center;
+		height: 100%;
+		font-size: 15px;
+		color: $font-color-dark;
 		position: relative;
-		z-index: 10;
 
-		.nav-item {
-			flex: 1;
-			display: flex;
-			justify-content: center;
-			align-items: center;
-			height: 100%;
-			font-size: 15px;
-			color: $font-color-dark;
-			position: relative;
+		&.current {
+			color: $base-color;
 
-			&.current {
-				color: $base-color;
-
-				&:after {
-					content: '';
-					position: absolute;
-					left: 50%;
-					bottom: 0;
-					transform: translateX(-50%);
-					width: 44px;
-					height: 0;
-					border-bottom: 2px solid $base-color;
-				}
+			&:after {
+				content: '';
+				position: absolute;
+				left: 50%;
+				bottom: 0;
+				transform: translateX(-50%);
+				width: 44px;
+				height: 0;
+				border-bottom: 2px solid $base-color;
 			}
 		}
 	}
+}
 
-	.order-item {
+.order-item {
+	display: flex;
+	flex-direction: column;
+	background: #fff;
+	margin-top: 16rpx;
+
+	.i-top {
 		display: flex;
-		flex-direction: column;
-		padding-left: 30rpx;
-		background: #fff;
-		margin-top: 16rpx;
+		align-items: center;
+		height: 80rpx;
+		font-size: $font-base;
+		color: $font-color-dark;
+		position: relative;
+		padding: 0 30rpx;
 
-		.i-top {
-			display: flex;
-			align-items: center;
-			height: 80rpx;
-			padding-right: 30rpx;
-			font-size: $font-base;
-			color: $font-color-dark;
+		.time {
+			flex: 1;
+		}
+
+		.state {
+			color: $base-color;
+		}
+
+		.del-btn {
+			padding: 10rpx 0 10rpx 36rpx;
+			font-size: $font-lg;
+			color: $font-color-light;
 			position: relative;
 
-			.time {
-				flex: 1;
+			&:after {
+				content: '';
+				width: 0;
+				height: 30rpx;
+				border-left: 1px solid $border-color-dark;
+				position: absolute;
+				left: 20rpx;
+				top: 50%;
+				transform: translateY(-50%);
 			}
+		}
+	}
 
-			.state {
-				color: $base-color;
-			}
+	/* 多条商品 */
+	.goods-box {
+		height: 160rpx;
+		padding: 20rpx 0;
+		white-space: nowrap;
 
-			.del-btn {
-				padding: 10rpx 0 10rpx 36rpx;
-				font-size: $font-lg;
-				color: $font-color-light;
-				position: relative;
-
-				&:after {
-					content: '';
-					width: 0;
-					height: 30rpx;
-					border-left: 1px solid $border-color-dark;
-					position: absolute;
-					left: 20rpx;
-					top: 50%;
-					transform: translateY(-50%);
-				}
-			}
+		.goods-item {
+			width: 120rpx;
+			height: 120rpx;
+			display: inline-block;
+			margin-right: 24rpx;
 		}
 
-		/* 多条商品 */
-		.goods-box {
-			height: 160rpx;
-			padding: 20rpx 0;
-			white-space: nowrap;
-
-			.goods-item {
-				width: 120rpx;
-				height: 120rpx;
-				display: inline-block;
-				margin-right: 24rpx;
-			}
+		.goods-img {
+			display: block;
+			width: 100%;
+			height: 100%;
+		}
+	}
 
-			.goods-img {
-				display: block;
-				width: 100%;
-				height: 100%;
-			}
+	/* 单条商品 */
+	.goods-box-single {
+		display: flex;
+		padding: 20rpx 30rpx;
+		background: #f7f7f7;
+		.goods-img {
+			display: block;
+			width: 120rpx;
+			height: 120rpx;
 		}
 
-		/* 单条商品 */
-		.goods-box-single {
+		.right {
+			flex: 1;
 			display: flex;
-			padding: 20rpx 0;
+			flex-direction: column;
+			padding: 0 0 0 24rpx;
+			overflow: hidden;
 
-			.goods-img {
-				display: block;
-				width: 120rpx;
-				height: 120rpx;
+			.row {
+				margin-top: 10rpx;
 			}
 
-			.right {
-				flex: 1;
-				display: flex;
-				flex-direction: column;
-				padding: 0 30rpx 0 24rpx;
-				overflow: hidden;
-
-				.row {
-					margin-top: 10rpx;
-				}
-
-				.row_title {
-					padding: 5rpx 10rpx;
-					background-color: #dddddd;
-					border-radius: 10rpx;
-					font-size: 22rpx;
-					color: #ffffff;
-				}
-
-				.title {
-					font-size: $font-base + 2rpx;
-					color: $font-color-dark;
-					line-height: 1;
-					width: 80%;
-				}
-
-				.attr-box {
-					display: flex;
-					justify-content: flex-end;
-					font-size: $font-sm + 2rpx;
-					color: $font-color-light;
-				}
-
-				.price {
-					display: inline;
-					font-size: $font-base + 2rpx;
-					color: $font-color-dark;
-
-					&:before {
-						content: '￥';
-						font-size: $font-sm;
-
-					}
-				}
+			.row_title {
+				padding: 5rpx 10rpx;
+				background-color: #dddddd;
+				border-radius: 10rpx;
+				font-size: 22rpx;
+				color: #ffffff;
 			}
-		}
-
-		.price-box {
-			display: flex;
-			justify-content: flex-end;
-			align-items: baseline;
-			padding: 20rpx 30rpx;
-			font-size: $font-sm + 2rpx;
-			color: $font-color-light;
 
-			.num {
-				margin: 0 8rpx;
+			.title {
+				font-size: $font-base + 2rpx;
 				color: $font-color-dark;
+				line-height: 1;
+				width: 80%;
+			}
+
+			.attr-box {
+				display: flex;
+				justify-content: flex-end;
+				font-size: $font-sm + 2rpx;
+				color: $font-color-light;
 			}
 
 			.price {
-				font-size: $font-lg;
+				display: inline;
+				font-size: $font-base + 2rpx;
 				color: $font-color-dark;
 
 				&:before {
 					content: '￥';
 					font-size: $font-sm;
-					margin: 0 2rpx 0 8rpx;
 				}
 			}
 		}
-
-		.action-box {
+	}
+	.buy-box {
+		height: 84rpx;
+		padding: 0 22rpx;
+		background-color: #ffffff;
+		.buy-info {
+			height: 100%;
 			display: flex;
-			justify-content: flex-end;
 			align-items: center;
-			height: 100rpx;
-			position: relative;
-			padding-right: 30rpx;
-		}
-
-		.action-btn {
-			width: 160rpx;
-			height: 60rpx;
-			margin: 0;
-			margin-left: 24rpx;
-			padding: 0;
-			text-align: center;
-			line-height: 60rpx;
-			font-size: $font-sm + 2rpx;
-			color: $font-color-dark;
-			background: #fff;
-			border-radius: 100px;
-
-			&:after {
-				border-radius: 100px;
+			.font {
+				font-size: 32rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #333333;
 			}
-
-			&.recom {
-				color: $base-color;
-
-				&:after {
-					border-color: $base-color;
-				}
+			.avter {
+				margin-left: 10rpx;
+				width: 46rpx;
+				height: 46rpx;
+				border-radius: 50%;
 			}
-
-			&.evaluate {
-				color: $color-yellow;
-
-				&:after {
-					border-color: $color-yellow;
-				}
+			.buy-name {
+				margin-left: 10rpx;
+				font-size: 32rpx;
+				font-family: PingFang SC;
+				font-weight: bold;
+				color: #333333;
+			}
+			.phone {
+				margin-left: 12rpx;
+				font-size: 24rpx;
+				font-family: PingFang SC;
+				font-weight: 500;
+				color: #999999;
 			}
 		}
 	}
-
-	/* load-more */
-	.uni-load-more {
+	.upimg {
+		padding-left: 20rpx;
+		padding-top: 10rpx;
+		padding-bottom: 10rpx;
 		display: flex;
-		flex-direction: row;
-		height: 80rpx;
-		align-items: center;
-		justify-content: center;
-	}
-
-	.uni-load-more__text {
-		font-size: 28rpx;
-		color: #999;
-	}
-
-	.uni-load-more__img {
-		height: 24px;
-		width: 24px;
-		margin-right: 10px;
-	}
-
-	.uni-load-more__img>view {
-		position: absolute;
-	}
-
-	.uni-load-more__img>view view {
-		width: 6px;
-		height: 2px;
-		border-top-left-radius: 1px;
-		border-bottom-left-radius: 1px;
-		background: #999;
-		position: absolute;
-		opacity: 0.2;
-		transform-origin: 50%;
-		animation: load 1.56s ease infinite;
-	}
-
-	.uni-load-more__img>view view:nth-child(1) {
-		transform: rotate(90deg);
-		top: 2px;
-		left: 9px;
-	}
-
-	.uni-load-more__img>view view:nth-child(2) {
-		transform: rotate(180deg);
-		top: 11px;
-		right: 0;
-	}
-
-	.uni-load-more__img>view view:nth-child(3) {
-		transform: rotate(270deg);
-		bottom: 2px;
-		left: 9px;
-	}
-
-	.uni-load-more__img>view view:nth-child(4) {
-		top: 11px;
-		left: 0;
-	}
-
-	.load1,
-	.load2,
-	.load3 {
-		height: 24px;
-		width: 24px;
-	}
-
-	.load2 {
-		transform: rotate(30deg);
-	}
-
-	.load3 {
-		transform: rotate(60deg);
-	}
 
-	.load1 view:nth-child(1) {
-		animation-delay: 0s;
-	}
+		.up-tit {
+			display: inline-block;
+			font-size: 26rpx;
+			font-family: PingFang SC;
+			font-weight: 500;
+			color: #6d7c88;
+		}
 
-	.load2 view:nth-child(1) {
-		animation-delay: 0.13s;
-	}
+		.img-wrap {
+			width: 153rpx;
+			height: 152rpx;
 
-	.load3 view:nth-child(1) {
-		animation-delay: 0.26s;
-	}
+			border-radius: 20rpx;
 
-	.load1 view:nth-child(2) {
-		animation-delay: 0.39s;
+			image {
+				border-radius: 20rpx;
+				width: 153rpx;
+				height: 152rpx;
+				background-color: #ccc;
+			}
+		}
 	}
+	.price-box {
+		display: flex;
+		justify-content: flex-end;
+		align-items: baseline;
+		padding: 20rpx 30rpx;
+		font-size: $font-sm + 2rpx;
+		color: $font-color-light;
+
+		.num {
+			margin: 0 8rpx;
+			color: $font-color-dark;
+		}
 
-	.load2 view:nth-child(2) {
-		animation-delay: 0.52s;
-	}
+		.price {
+			font-size: $font-lg;
+			color: $font-color-dark;
 
-	.load3 view:nth-child(2) {
-		animation-delay: 0.65s;
+			&:before {
+				content: '￥';
+				font-size: $font-sm;
+				margin: 0 2rpx 0 8rpx;
+			}
+		}
 	}
 
-	.load1 view:nth-child(3) {
-		animation-delay: 0.78s;
+	.action-box {
+		padding: 0 30rpx;
+		display: flex;
+		justify-content: flex-end;
+		align-items: center;
+		height: 100rpx;
+		position: relative;
 	}
 
-	.load2 view:nth-child(3) {
-		animation-delay: 0.91s;
-	}
+	.refuse {
+		margin: 0;
+		padding: 0;
+		width: 160rpx;
+		height: 60rpx;
+		border: 2rpx solid #ebebeb;
+		border-radius: 28rpx;
+		text-align: center;
+		line-height: 60rpx;
+		font-size: 26rpx;
+		font-family: PingFang SC;
+		font-weight: 500;
+		color: #999999;
+		&:after {
+			border-radius: 100px;
+		}
 
-	.load3 view:nth-child(3) {
-		animation-delay: 1.04s;
-	}
+		&.recom {
+			color: #999999;
 
-	.load1 view:nth-child(4) {
-		animation-delay: 1.17s;
+			&:after {
+				border-color: #999999;
+			}
+		}
 	}
 
-	.load2 view:nth-child(4) {
-		animation-delay: 1.3s;
-	}
+	.action-btn {
+		width: 160rpx;
+		height: 60rpx;
+		margin: 0;
+		margin-left: 24rpx;
+		padding: 0;
+		text-align: center;
+		line-height: 60rpx;
+		font-size: $font-sm + 2rpx;
+		color: $font-color-dark;
+		background: #fff;
+		border-radius: 100px;
+		border: 2rpx solid #fd3b39;
+		border-radius: 28px;
+		&:after {
+			border-radius: 100px;
+		}
 
-	.load3 view:nth-child(4) {
-		animation-delay: 1.43s;
-	}
+		&.recom {
+			color: $base-color;
 
-	@-webkit-keyframes load {
-		0% {
-			opacity: 1;
+			&:after {
+				border-color: $base-color;
+			}
 		}
 
-		100% {
-			opacity: 0.2;
+		&.evaluate {
+			color: $color-yellow;
+
+			&:after {
+				border-color: $color-yellow;
+			}
 		}
 	}
-
-	.swiper-box-one {
-		background-color: #bfa;
+}
+
+/* load-more */
+.uni-load-more {
+	display: flex;
+	flex-direction: row;
+	height: 80rpx;
+	align-items: center;
+	justify-content: center;
+}
+
+.uni-load-more__text {
+	font-size: 28rpx;
+	color: #999;
+}
+
+.uni-load-more__img {
+	height: 24px;
+	width: 24px;
+	margin-right: 10px;
+}
+
+.uni-load-more__img > view {
+	position: absolute;
+}
+
+.uni-load-more__img > view view {
+	width: 6px;
+	height: 2px;
+	border-top-left-radius: 1px;
+	border-bottom-left-radius: 1px;
+	background: #999;
+	position: absolute;
+	opacity: 0.2;
+	transform-origin: 50%;
+	animation: load 1.56s ease infinite;
+}
+
+.uni-load-more__img > view view:nth-child(1) {
+	transform: rotate(90deg);
+	top: 2px;
+	left: 9px;
+}
+
+.uni-load-more__img > view view:nth-child(2) {
+	transform: rotate(180deg);
+	top: 11px;
+	right: 0;
+}
+
+.uni-load-more__img > view view:nth-child(3) {
+	transform: rotate(270deg);
+	bottom: 2px;
+	left: 9px;
+}
+
+.uni-load-more__img > view view:nth-child(4) {
+	top: 11px;
+	left: 0;
+}
+
+.load1,
+.load2,
+.load3 {
+	height: 24px;
+	width: 24px;
+}
+
+.load2 {
+	transform: rotate(30deg);
+}
+
+.load3 {
+	transform: rotate(60deg);
+}
+
+.load1 view:nth-child(1) {
+	animation-delay: 0s;
+}
+
+.load2 view:nth-child(1) {
+	animation-delay: 0.13s;
+}
+
+.load3 view:nth-child(1) {
+	animation-delay: 0.26s;
+}
+
+.load1 view:nth-child(2) {
+	animation-delay: 0.39s;
+}
+
+.load2 view:nth-child(2) {
+	animation-delay: 0.52s;
+}
+
+.load3 view:nth-child(2) {
+	animation-delay: 0.65s;
+}
+
+.load1 view:nth-child(3) {
+	animation-delay: 0.78s;
+}
+
+.load2 view:nth-child(3) {
+	animation-delay: 0.91s;
+}
+
+.load3 view:nth-child(3) {
+	animation-delay: 1.04s;
+}
+
+.load1 view:nth-child(4) {
+	animation-delay: 1.17s;
+}
+
+.load2 view:nth-child(4) {
+	animation-delay: 1.3s;
+}
+
+.load3 view:nth-child(4) {
+	animation-delay: 1.43s;
+}
+
+@-webkit-keyframes load {
+	0% {
+		opacity: 1;
+	}
+
+	100% {
+		opacity: 0.2;
 	}
+}
+
+.swiper-box-one {
+	height: calc(100% - 175px);
+}
 </style>

pages/order/order1.vue

@@ -1,105 +1,676 @@
 <template>
 	<view class="content">
 		<view class="navbar">
-			<view v-for="(item, index) in navList" :key="index" class="nav-item"
-				:class="{ current: tabCurrentIndex === index }" @click="navTo(index)">{{ item.text }}</view>
+			<view v-for="(item, index) in navList" :key="index" class="nav-item" :class="{ current: tabCurrentIndex === index }" @click="tabClick(index)">{{ item.text }}</view>
 		</view>
-		<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000"  :class="{current:tabCurrentIndex===0}">
-			<swiper-item v-for="(item,index) in navList">
-				<view class="swiper-item">1111</view>
+
+		<swiper :current="tabCurrentIndex" class="swiper-box" duration="300" @change="changeTab">
+			<swiper-item class="tab-content" v-for="(tabItem, tabIndex) in navList" :key="tabIndex">
+				<scroll-view class="list-scroll-content" scroll-y @scrolltolower="loadData">
+					<!-- 空白页 -->
+					<empty v-if="tabItem.loaded === true && tabItem.orderList.length === 0"></empty>
+
+					<!-- 订单列表 -->
+					<view @click="goToOrderDetail(item)" v-for="(item, index) in tabItem.orderList" :key="index" class="order-item">
+						<view class="i-top b-b">
+							<text class="time">{{ item._add_time }}</text>
+							<text class="state" :style="{ color: item.stateTipColor }">{{ item._status._title }}</text>
+							<text v-if="item.status === 4" class="del-btn iconfont icondelete" @click="deleteOrder(index)"></text>
+						</view>
+
+						<scroll-view v-if="item.cartInfo.length > 1" class="goods-box" scroll-x>
+							<view v-for="(goodsItem, goodsIndex) in item.cartInfo" :key="goodsIndex" class="goods-item">
+								<image class="goods-img" :src="goodsItem.productInfo.image" mode="aspectFill"></image>
+							</view>
+						</scroll-view>
+						<!-- <view v-if="item.cartInfo.length === 1" class="goods-box-single" v-for="(goodsItem, goodsIndex) in item.cartInfo" :key="goodsIndex">
+							<image class="goods-img" :src="goodsItem.productInfo.image" mode="aspectFill"></image>
+							<view class="right">
+								<text class="title clamp">{{ goodsItem.productInfo.store_name }}</text>
+								<text class="attr-box">{{ goodsItem.attrInfo ? goodsItem.attrInfo.suk : '' }} x {{ goodsItem.cart_num }}</text>
+								<text class="price">{{ moneyNum(goodsItem.productInfo.price)}}</text>
+							</view>
+						</view> -->
+						<view class="goods-box-single" v-for="(goodsItem, goodsIndex) in item.cartInfo" :key="goodsIndex">
+							<image class="goods-img" :src="goodsItem.productInfo.image" mode="scaleToFill"></image>
+							<view class="right">
+								<view class="flex-start">
+									<text class="title clamp">{{ goodsItem.productInfo.store_name }}</text>
+									<text class="price">{{ moneyNum(goodsItem.productInfo.price) }}</text>
+								</view>
+								<view class="row flex">
+									<text class="row_title">{{ goodsItem.productInfo.attrInfo ? goodsItem.productInfo.attrInfo.suk : '' }}</text>
+									<text class="attr-box"> x {{ goodsItem.cart_num }}</text>
+								</view>
+							</view>
+						</view>
+
+						<view class="price-box">
+							共
+							<text class="num">{{ item.cartInfo.length }}</text>
+							件商品 邮费
+							<text class="price">{{ moneyNum(item.pay_postage)}}</text>
+							实付款
+							<text class="price" v-if="item.use_integral != 0">{{ moneyNum(item.pay_price)}}+{{item.use_integral}}趣豆</text>
+							<text class="price" v-if="item.use_integral == 0">{{ moneyNum(item.pay_price)}}</text>
+						</view>
+						<view class="action-box b-t" v-if="item.status != 5">
+							<button v-if="item._status._title == '未支付'" class="action-btn" @click.stop="cancelOrder(item)">取消订单</button>
+							<button v-if="item._status._title == '未支付'" @click.stop="orderPay(item)" class="action-btn recom">立即支付</button>
+							<button v-if="item._status._title == '待评价'" class="action-btn">评价</button>
+							<button v-if="item._status._title == '待收货'" @click.stop="orderTake(item, index)" class="action-btn">确认收货</button>
+							<button v-if="item._status._title == '未发货'" class="action-btn" @click.stop="orderRefund(item)">申请退款</button>
+						</view>
+					</view>
+
+					<uni-load-more :status="tabItem.loadingType"></uni-load-more>
+				</scroll-view>
 			</swiper-item>
 		</swiper>
-
 	</view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				tabCurrentIndex: 0, //当前选择
-				navList: [{
-						state: 0,
-						text: '待付款',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					},
-					{
-						state: 1,
-						text: '待发货',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					},
-					{
-						state: 2,
-						text: '待收货',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					},
-					{
-						state: 3,
-						text: '待评价',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					},
-					{
-						state: 4,
-						text: '已完成',
-						loadingType: 'more',
-						orderList: [],
-						page: 1, //当前页数
-						limit: 10 //每次信息条数
-					}
-				]
+import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
+import empty from '@/components/empty';
+import { orderList, orderCancel, orderDel, orderTake } from '@/api/order.js';
+export default {
+	components: {
+		uniLoadMore,
+		empty
+	},
+	data() {
+		return {
+			tabCurrentIndex: 0,
+			navList: [
+				{
+					state: 0,
+					text: '待付款',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				},
+				{
+					state: 1,
+					text: '待发货',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				},
+				{
+					state: 2,
+					text: '待收货',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				},
+				{
+					state: 3,
+					text: '待评价',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				},
+				{
+					state: 4,
+					text: '已完成',
+					loadingType: 'more',
+					orderList: [],
+					page: 1, //当前页数
+					limit: 10 //每次信息条数
+				}
+			]
+		};
+	},
+
+	onLoad(options) {
+		/**
+		 * 修复app端点击除全部订单外的按钮进入时不加载数据的问题
+		 * 替换onLoad下代码即可
+		 */
+		this.tabCurrentIndex = +options.state;
+		// #ifndef MP
+		this.loadData();
+		// #endif
+		// #ifdef MP
+		if (options.state == 0) {
+			this.loadData();
+		}
+		// #endif
+	},
+	// #ifdef APP-PLUS || H5
+	onBackPress(e){
+		uni.switchTab({
+			url: '/pages/user/user',
+		});
+		return true;
+	},
+	// #endif
+	methods: {
+		// 转换金额为数字
+		moneyNum(value){
+				return +value;
+		},
+		// 确认收货
+		orderTake(item, index) {
+			let obj = this;
+			uni.showModal({
+				title: '是否确认收货？',
+				success: () => {
+					orderTake({
+						uni: item.order_id
+					})
+						.then(e => {
+							obj.navList[obj.tabCurrentIndex].orderList.splice(index, 1);
+							uni.showToast({
+								title: '收货成功'
+							});
+						})
+						.catch(e => {
+							console.log(e);
+						});
+				}
+			});
+		},
+		//跳转到订单详情
+		goToOrderDetail(e) {
+			uni.navigateTo({
+				url: '/pages/order/orderDetail?id=' + e.order_id
+			});
+		},
+		// 申请退款
+		orderRefund(e) {
+			uni.navigateTo({
+				url: '/pages/order/orderRefund?id=' + e.order_id
+			});
+		},
+		// 订单支付
+		orderPay(e) {
+			uni.navigateTo({
+				url: '/pages/money/pay?type=1&ordid=' + e.order_id + '&money=' + e.pay_price
+			});
+		},
+		//获取订单列表
+		loadData(source) {
+			//这里是将订单挂载到tab列表下
+			let index = this.tabCurrentIndex;
+			let navItem = this.navList[index];
+			let state = navItem.state;
+			if (source === 'tabChange' && navItem.loaded === true) {
+				//tab切换只有第一次需要加载数据
+				return;
+			}
+			if (navItem.loadingType === 'loading') {
+				//防止重复加载
+				return;
 			}
+			if (navItem.loadingType === 'noMore') {
+				//防止重复加载
+				return;
+			}
+			// 修改当前对象状态为加载中
+			navItem.loadingType = 'loading';
+
+			orderList({
+				type: state,
+				page: navItem.page,
+				limit: navItem.limit
+			})
+				.then(({ data }) => {
+					let arr = data.map(e => {
+						let b = this.orderStateExp(e.status);
+						e.stateTip = b.stateTip;
+						e.stateTipColor = b.stateTipColor;
+						return e;
+					});
+					navItem.orderList = navItem.orderList.concat(arr);
+					// console.log(navItem.orderList);
+					navItem.page++;
+					if (navItem.limit == data.length) {
+						//判断是否还有数据， 有改为 more， 没有改为noMore
+						navItem.loadingType = 'more';
+						return;
+					} else {
+						//判断是否还有数据， 有改为 more， 没有改为noMore
+						navItem.loadingType = 'noMore';
+					}
+					uni.hideLoading();
+					this.$set(navItem, 'loaded', true);
+				})
+				.catch(e => {
+					console.log(e);
+				});
+		},
+
+		//swiper 切换
+		changeTab(e) {
+			this.tabCurrentIndex = e.target.current;
+			this.loadData('tabChange');
+		},
+		//顶部tab点击
+		tabClick(index) {
+			this.tabCurrentIndex = index;
+		},
+		//删除订单
+		deleteOrder(index) {
+			uni.showLoading({
+				title: '请稍后'
+			});
+			setTimeout(() => {
+				this.navList[this.tabCurrentIndex].orderList.splice(index, 1);
+				uni.hideLoading();
+			}, 600);
+		},
+		//取消订单
+		cancelOrder(item) {
+			uni.showModal({
+				title: '订单取消',
+				content: '是否取消订单？',
+				success: e => {
+					if (e.confirm) {
+						uni.showLoading({
+							title: '请稍后'
+						});
+						orderCancel({ id: item.order_id })
+							.then(e => {
+								uni.showToast({
+									title: '取消成功',
+									duration: 2000,
+									position: 'top'
+								});
+							})
+							.catch(e => {
+								console.log(e);
+							});
+						//取消订单后删除待付款中该项
+						let list = this.navList[this.tabCurrentIndex].orderList;
+						let index = list.findIndex(val => val.id === item.id);
+						index !== -1 && list.splice(index, 1);
+						uni.hideLoading();
+					}
+				}
+			});
 		},
-		methods: {
-			navTo(index){
-				this.tabCurrentIndex = index
+
+		//订单状态文字和颜色
+		orderStateExp(state) {
+			let stateTip = '',
+				stateTipColor = '#fa436a';
+			switch (+state) {
+				case 0:
+					stateTip = '待付款';
+					break;
+				case 1:
+					stateTip = '待发货';
+					break;
+				case 2:
+					stateTip = '待收货';
+					break;
+				case 3:
+					stateTip = '待评价';
+					break;
+				case 4:
+					stateTip = '已完成';
+					stateTipColor = '#5dbc7c';
+					break;
+				case 9:
+					stateTip = '订单已关闭';
+					stateTipColor = '#909399';
+					break;
+
+				//更多自定义
 			}
+			return { stateTip, stateTipColor };
 		}
 	}
+};
 </script>
 
 <style lang="scss">
-	.content {
-		background: $page-color-base;
+page,
+.content {
+	background: $page-color-base;
+	height: 100%;
+}
+
+.swiper-box {
+	height: calc(100% - 40px);
+}
+.list-scroll-content {
+	height: 100%;
+}
+
+.navbar {
+	display: flex;
+	height: 40px;
+	padding: 0 5px;
+	background: #fff;
+	box-shadow: 0 1px 5px rgba(0, 0, 0, 0.06);
+	position: relative;
+	z-index: 10;
+	.nav-item {
+		flex: 1;
+		display: flex;
+		justify-content: center;
+		align-items: center;
 		height: 100%;
+		font-size: 15px;
+		color: $font-color-dark;
+		position: relative;
+		&.current {
+			color: $base-color;
+			&:after {
+				content: '';
+				position: absolute;
+				left: 50%;
+				bottom: 0;
+				transform: translateX(-50%);
+				width: 44px;
+				height: 0;
+				border-bottom: 2px solid $base-color;
+			}
+		}
 	}
-	.navbar{
+}
+
+.uni-swiper-item {
+	height: auto;
+}
+.order-item {
+	display: flex;
+	flex-direction: column;
+	padding-left: 30rpx;
+	background: #fff;
+	margin-top: 16rpx;
+	.i-top {
 		display: flex;
-		padding: 0 5px;
-		height: 40px;
-		background-color: #FFFFFF;
-		box-shadow: 0 1px 5px rgba(0, 0, 0, 0.06);
+		align-items: center;
+		height: 80rpx;
+		padding-right: 30rpx;
+		font-size: $font-base;
+		color: $font-color-dark;
 		position: relative;
-		z-index: 100;
-		
-		.nav-item{
+		.time {
 			flex: 1;
-			display: flex;
-			text-align: center;
-			justify-content: center;
-			font-size: 15px;
-			height: 100%;
+		}
+		.state {
+			color: $base-color;
+		}
+		.del-btn {
+			padding: 10rpx 0 10rpx 36rpx;
+			font-size: $font-lg;
+			color: $font-color-light;
 			position: relative;
-			&.current{
-				border-bottom: 2rpx solid #F0AD4E;
-				color:#F0AD4E ;
-				
+			&:after {
+				content: '';
+				width: 0;
+				height: 30rpx;
+				border-left: 1px solid $border-color-dark;
+				position: absolute;
+				left: 20rpx;
+				top: 50%;
+				transform: translateY(-50%);
+			}
+		}
+	}
+	/* 多条商品 */
+	.goods-box {
+		height: 160rpx;
+		padding: 20rpx 0;
+		white-space: nowrap;
+		.goods-item {
+			width: 120rpx;
+			height: 120rpx;
+			display: inline-block;
+			margin-right: 24rpx;
+		}
+		.goods-img {
+			display: block;
+			width: 100%;
+			height: 100%;
+		}
+	}
+	/* 单条商品 */
+	.goods-box-single {
+		display: flex;
+		padding: 20rpx 0;
+		.goods-img {
+			display: block;
+			width: 120rpx;
+			height: 120rpx;
+		}
+		.right {
+			flex: 1;
+			display: flex;
+			flex-direction: column;
+			padding: 0 30rpx 0 24rpx;
+			overflow: hidden;
+			.row{
+				margin-top: 10rpx;
+			}
+			.row_title{
+				padding:5rpx 10rpx;
+				background-color: #dddddd;
+				border-radius: 10rpx;
+				font-size: 22rpx;
+				color: #ffffff;
+			}
+			.title {
+				font-size: $font-base + 2rpx;
+				color: $font-color-dark;
+				line-height: 1;
+				width: 80%;
+			}
+			.attr-box {
+				display: flex;
+				justify-content: flex-end;
+				font-size: $font-sm + 2rpx;
+				color: $font-color-light;
+			}
+			.price {
+				display: inline;
+				font-size: $font-base + 2rpx;
+				color: $font-color-dark;
+				&:before {
+					content: '￥';
+					font-size: $font-sm;
+					
+				}
+			}
+		}
+	}
+	.price-box {
+		display: flex;
+		justify-content: flex-end;
+		align-items: baseline;
+		padding: 20rpx 30rpx;
+		font-size: $font-sm + 2rpx;
+		color: $font-color-light;
+		.num {
+			margin: 0 8rpx;
+			color: $font-color-dark;
+		}
+		.price {
+			font-size: $font-lg;
+			color: $font-color-dark;
+			&:before {
+				content: '￥';
+				font-size: $font-sm;
+				margin: 0 2rpx 0 8rpx;
+			}
+		}
+	}
+	.action-box {
+		display: flex;
+		justify-content: flex-end;
+		align-items: center;
+		height: 100rpx;
+		position: relative;
+		padding-right: 30rpx;
+	}
+	.action-btn {
+		width: 160rpx;
+		height: 60rpx;
+		margin: 0;
+		margin-left: 24rpx;
+		padding: 0;
+		text-align: center;
+		line-height: 60rpx;
+		font-size: $font-sm + 2rpx;
+		color: $font-color-dark;
+		background: #fff;
+		border-radius: 100px;
+		&:after {
+			border-radius: 100px;
+		}
+		&.recom {
+			color: $base-color;
+			&:after {
+				border-color: $base-color;
+			}
+		}
+		&.evaluate {
+			color: $color-yellow;
+			&:after {
+				border-color: $color-yellow;
 			}
-			
-			
-			
 		}
 	}
-	
+}
+
+/* load-more */
+.uni-load-more {
+	display: flex;
+	flex-direction: row;
+	height: 80rpx;
+	align-items: center;
+	justify-content: center;
+}
+
+.uni-load-more__text {
+	font-size: 28rpx;
+	color: #999;
+}
+
+.uni-load-more__img {
+	height: 24px;
+	width: 24px;
+	margin-right: 10px;
+}
+
+.uni-load-more__img > view {
+	position: absolute;
+}
+
+.uni-load-more__img > view view {
+	width: 6px;
+	height: 2px;
+	border-top-left-radius: 1px;
+	border-bottom-left-radius: 1px;
+	background: #999;
+	position: absolute;
+	opacity: 0.2;
+	transform-origin: 50%;
+	animation: load 1.56s ease infinite;
+}
+
+.uni-load-more__img > view view:nth-child(1) {
+	transform: rotate(90deg);
+	top: 2px;
+	left: 9px;
+}
+
+.uni-load-more__img > view view:nth-child(2) {
+	transform: rotate(180deg);
+	top: 11px;
+	right: 0;
+}
+
+.uni-load-more__img > view view:nth-child(3) {
+	transform: rotate(270deg);
+	bottom: 2px;
+	left: 9px;
+}
+
+.uni-load-more__img > view view:nth-child(4) {
+	top: 11px;
+	left: 0;
+}
+
+.load1,
+.load2,
+.load3 {
+	height: 24px;
+	width: 24px;
+}
+
+.load2 {
+	transform: rotate(30deg);
+}
+
+.load3 {
+	transform: rotate(60deg);
+}
+
+.load1 view:nth-child(1) {
+	animation-delay: 0s;
+}
+
+.load2 view:nth-child(1) {
+	animation-delay: 0.13s;
+}
+
+.load3 view:nth-child(1) {
+	animation-delay: 0.26s;
+}
+
+.load1 view:nth-child(2) {
+	animation-delay: 0.39s;
+}
+
+.load2 view:nth-child(2) {
+	animation-delay: 0.52s;
+}
+
+.load3 view:nth-child(2) {
+	animation-delay: 0.65s;
+}
+
+.load1 view:nth-child(3) {
+	animation-delay: 0.78s;
+}
+
+.load2 view:nth-child(3) {
+	animation-delay: 0.91s;
+}
+
+.load3 view:nth-child(3) {
+	animation-delay: 1.04s;
+}
+
+.load1 view:nth-child(4) {
+	animation-delay: 1.17s;
+}
+
+.load2 view:nth-child(4) {
+	animation-delay: 1.3s;
+}
+
+.load3 view:nth-child(4) {
+	animation-delay: 1.43s;
+}
+
+@-webkit-keyframes load {
+	0% {
+		opacity: 1;
+	}
+
+	100% {
+		opacity: 0.2;
+	}
+}
 </style>

pages/user/user.vue

@@ -46,7 +46,7 @@
 			</view>
 		</view>
 		<view class="main-box">
-			<view class="title flex">
+			<view class="title flex" @click="navTo('/pages/order/order1?state=0')">
 				<view class="title-left">
 					<image class="title-icon" src="../../static/user/user5.png" mode=""></image>
 					<view class="title-font">我的订单</view>
@@ -54,19 +54,19 @@
 				<image class="title-right" src="../../static/img/back.png" mode=""></image>
 			</view>
 			<view class="main flex">
-				<view class="oitem">
+				<view class="oitem" @click="navTo('/pages/order/order1?state=0')">
 					<image class="oitem-image" src="../../static/user/user6.png" mode=""></image>
 					<view class="oitem-font">待付款</view>
 				</view>
-				<view class="oitem">
+				<view class="oitem" @click="navTo('/pages/order/order1?state=1')">
 					<image class="oitem-image" src="../../static/user/user7.png" mode=""></image>
 					<view class="oitem-font">待发货</view>
 				</view>
-				<view class="oitem">
+				<view class="oitem" @click="navTo('/pages/order/order1?state=2')">
 					<image class="oitem-image" src="../../static/user/user8.png" mode=""></image>
 					<view class="oitem-font">待收货</view>
 				</view>
-				<view class="oitem">
+				<view class="oitem" @click="navTo('/pages/order/order1?state=3')">
 					<image class="oitem-image" src="../../static/user/user9.png" mode=""></image>
 					<view class="oitem-font">已完成</view>
 				</view>
@@ -74,8 +74,8 @@
 		</view>
 		<uni-list class="tool-list">
 			<uni-list-item title="邀请有礼" @click="navTo('/pages/user/collection')" thumb="/static/user/user10.png"></uni-list-item>
-			<uni-list-item title="我的收藏" @click="navTo('/pages/user/approve')" thumb="/static/user/user11.png"></uni-list-item>
-			<uni-list-item title="收款方式" @click="navTo('/pages/set/address')" thumb="/static/user/user12.png"></uni-list-item>
+			<uni-list-item title="我的收藏" @click="navTo('/pages/user/favorites')" thumb="/static/user/user11.png"></uni-list-item>
+			<uni-list-item title="收款方式" @click="navTo('/pages/collection/collection')" thumb="/static/user/user12.png"></uni-list-item>
 			<uni-list-item title="客服中心" @click="openKf()" thumb="/static/user/user13.png"></uni-list-item>
 		</uni-list>
 		<uni-popup ref="popupkf" type="center">
@@ -271,6 +271,7 @@ export default {
 		 * navigator标签现在默认没有转场动画，所以用view
 		 */
 		navTo(url) {
+			console.log(url);
 			// if (!this.hasLogin) {
 			// 	// 保存地址
 			// 	saveUrl();