订单管理模块

pages.json

@@ -185,6 +185,12 @@
                     "style" : {
                         "navigationStyle" : "custom"
                     }
+                },
+                {
+                	"path" : "commodity/sendoutgoods",//发货
+                	"style" : {
+                		 "navigationStyle" : "custom"
+                	}
                 }
             ]
         },

pages/my/index.vue

@@ -87,7 +87,7 @@
 			
 			
 			console.log('我的show===>>>>>>')
-				
+			
 			
 			this.authorization = uni.getStorageSync('authorization')
 			let userinfo = uni.getStorageSync('userinfo')
@@ -327,7 +327,7 @@
 			background: #1F7CFF;
 			border-radius: 8rpx;
 			position: fixed;
-			bottom: 26rpx;
+			bottom: 150rpx;
 			font-size: 36rpx;
 			font-weight: 400;
 			color: #FFFFFF;

pages/ordermanagement/components/quickPickUp/quickPickUp.vue

@@ -0,0 +1,97 @@
+<template>
+	<!-- .设置了自提模式的商户展示该模块，没有自提模式的不展示； -->
+	<view class="quick-pick-up-wrapper">
+	   <view class="quick-pick-up-wrapper__text">快速提货</view>
+	   <view class="quick-pick-up-wrapper__input">
+		 <!-- 输入框 -->
+		    <input 
+		      class="input-box"
+		      type="text"
+		      placeholder="请输入提货码"
+		      v-model="pickupCode"
+		    />
+		 <!-- 查询按钮 -->
+		    <button 
+			type="primary"
+		      class="query-btn"
+		      @click="handleQuery"
+		    >查询</button>
+	   </view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				pickupCode:""
+				
+			};
+		},
+		methods:{
+			handleQuery(){
+				if (!this.pickupCode){
+					uni.showToast({
+					  title: '请输入提货码',
+					  icon: 'none'
+					})
+					return
+				}
+			  console.log(this.pickupCode)
+			}
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+.quick-pick-up-wrapper{
+	width: 100%;
+	min-height: 222rpx;
+	background: #FFFFFF;
+	 border-radius: 16rpx;
+	  display: flex;
+	  flex-direction: column;
+	&__text{
+	  font-size: 36rpx;
+	  font-weight: bold;
+	  color: #333;
+	  margin: 32rpx 0rpx 26rpx 26rpx;
+	  user-select: none;
+	}
+	&__input{
+		display: flex;
+		flex-direction: row;
+		width: calc(100% - 0rpx);
+		height: 74rpx;
+		border-radius: 6rpx;
+		padding: 0 26rpx;
+		box-sizing: border-box;
+		.input-box {
+		  width: 85%;
+		  border-radius: 12rpx;
+		  padding: 0 20rpx;
+		  font-size: 32rpx;
+		  height: 74rpx;
+		  background: #F5F5F5;
+		  border-radius: 6rpx;
+		  box-sizing: border-box;
+		}
+	.query-btn {
+		user-select: none;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	  width: 150rpx;
+	  height: 74rpx;
+	background: #1F7CFF;
+	  border-radius: 6rpx;
+	  font-family: PingFangSC, PingFang SC;
+	  font-weight: 400;
+	  font-size: 28rpx;
+	  color: #FFFFFF;
+	}
+		
+	}
+}
+</style>

pages/ordermanagement/index.vue

@@ -32,11 +32,17 @@
 			</view>
 		</view>
 		<view class="ordermanagement-ding">
-			<view class="ordermanagement-ding-text">
-				我的订单
+			<view class="view-wrapper">
+				<view class="ordermanagement-ding-text">
+					我的订单
+				</view>
+				<view class="view-all" @click="jiru('all',0)">
+					<text>查看全部</text>
+					<image src="/static/images/new_ui/arrow-right.png" class="icon-img"></image>
+				</view>
 			</view>
 			<view class="ordermanagement-ding-nei">
-				<view class="ordermanagement-yisdf" v-for="(item,index) in dingdan" :key="index" @click="jiru(item.status,index)">
+				<view class="ordermanagement-yisdf" v-for="(item,index) in dingdan" :key="index" @click="jiru(item.status,index+1)">
 					<view class="ordermanagement-img">
 						<image :src="item.img" mode="widthFix"></image>
 						<view class="ordermanagement-img-biao" v-if="item.num==0?false:true">
@@ -49,6 +55,9 @@
 				</view>
 			</view>
 		</view>
+		
+		<quickPickUpVue class="custom_pick-up"></quickPickUpVue>
+		
 		<!-- 		<view class="ordermanagement-dingsss">
 			<view class="ordermanagement-ding-text">
 				售后管理
@@ -71,7 +80,9 @@
 	import {
 		getOrderStstusAmount
 	} from '@/commit/order.js'
+	import quickPickUpVue from './components/quickPickUp/quickPickUp.vue';
 	export default {
+		components:{quickPickUpVue},
 		data() {
 			return {
 				num: [], //正向订单状态数
@@ -79,23 +90,28 @@
 				dingdan: [{
 						img: 'https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154736170.png',
 						name: '待付款',
+						status:1
 					},
 					{
 						img: 'https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154723185.png',
 						name: '待发货',
+						status:2
 					},
 					{
 						img: 'https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154804269.png',
 						name: '待收货',
+						status:3
 					},
 					{
 						img: 'https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154750259.png',
 						name: '待评价',
+						status:4
 					}
 					// ,
 					// {
 					// 	img: 'https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154847886.png',
-					// 	name: '已退款'
+					// 	name: '已退款',
+					//status:6
 					// }
 				],
 				dingdansss: [{
@@ -181,7 +197,11 @@
 				let authorization = uni.getStorageSync('authorization')
 				let userinfo = uni.getStorageSync('userinfo')
 				let selectmerchant = uni.getStorageSync('selectmerchant')
-				let uid = userinfo.uid
+				let uid = userinfo.uid
+				uni.redirectTo({
+					url: "../../shop/commodity/order?status="+e + "&index="+ i
+				})
+				return
 				if (authorization && uid) {
 					if (selectmerchant.merId >= 0 && selectmerchant.status == -1) {
 						uni.redirectTo({
@@ -260,8 +280,9 @@
 			.ordermanagement-list {
 				position: absolute;
 				top: 298rpx;
-				width: 686rpx;
-				height: 150rpx;
+				width: calc(100% - 54rpx);
+				min-height: 150rpx;
+				margin: 0 26rpx;
 				background: #FFFFFF;
 				border-radius: 16rpx;
 				display: flex;
@@ -291,14 +312,37 @@
 		}
 
 		.ordermanagement-ding {
-			width: 686rpx;
-			height: 216rpx;
-			margin: 156rpx 0 32rpx 0;
+			width: calc(100% - 54rpx);
+			min-height: 216rpx;
+			margin: 156rpx 26rpx 32rpx 26rpx;
 			display: flex;
 			flex-direction: column;
 			justify-content: space-between;
 			align-items: flex-start;
-
+            .view-wrapper{
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				width:100%;
+				
+			}
+			.view-all{
+				display: flex;
+				justify-content:center;
+				align-items: center;
+				font-family: PingFangSC, PingFang SC;
+				font-weight: 400;
+				font-size: 24rpx;
+				>text:first-child{
+					padding-right: 8rpx;
+					color: #999999;
+				}
+				.icon-img{
+					width: 26rpx;
+					height: 26rpx;
+					
+				}
+			}
 			.ordermanagement-ding-text {
 				font-size: 30rpx;
 				font-weight: 600;
@@ -399,5 +443,10 @@
 				}
 			}
 		}
+	
+	    .custom_pick-up{
+			width: calc(100% - 54rpx);
+			margin:0 26rpx;
+		}
 	}
 </style>

shop/commodity/components/fillLogisticsInfo.vue

@@ -0,0 +1,116 @@
+<template>
+	<view class="logistics-information">
+		 <view class="logistics-information__text">填写物流信息</view>
+		 <view class="logistics-information__form">
+		 	<view class="form_item">
+				<view class="form_item--left">
+					物流单号
+				</view>
+				<view class="form_item--right">
+					<view class="upop">
+						<input type="text" class="title upop_input" placeholder="请手动输入或扫描二维码"/>
+						<image src="/static/images/new_ui/qcode.png" mode="" class="image-box" @click="handleQrcode"></image>
+					</view>
+				</view>
+			</view>
+		 	<view class="form_item">
+			<view class="form_item--left">
+				物流公司
+			</view>
+			<view class="form_item--right">
+				<view class="upop">
+					<view class="title xcv">请选择物流公司</view>
+					<image src="/static/images/new_ui/arrow-right.png" mode=""></image>
+				</view>
+			</view>
+			</view>
+		 </view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			handleQrcode(){
+				console.log("")
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.logistics-information{
+	background: #FFFFFF;
+	 border-radius: 16rpx;
+    padding: 26rpx 21rpx 10rpx 32rpx;
+	  display: flex;
+	  flex-direction: column;
+	  &__text{
+        font-weight: 500;
+        font-size: 30rpx;
+        color: #333333;
+	    margin-bottom:10rpx ;
+	    user-select: none;
+	  }
+	  &__form{
+		  .form_item{
+			  display: flex;
+			  align-items: center;
+			  justify-content: space-between;
+			  height: 100rpx;
+			  border-bottom: 2rpx solid  #E5E5E5;
+			  &--left{
+				  width: 120rpx;
+				  font-family: PingFangSC, PingFang SC;
+				  font-weight: 400;
+				  font-size: 30rpx;
+				  color: #333333;
+				  line-height: 30rpx;
+			  }
+			  &--right{
+				  flex: 1;
+				  padding-left: 50rpx;
+				  padding-right: 12rpx;
+				  text-align: right;
+				  .title{
+				  	font-family: PingFangSC, PingFang SC;
+				  	 font-weight: 400;
+				  	 font-size: 28rpx;
+				  	color: #999999;
+				  }
+				  .upop{
+					  display: flex;
+					  width:100%;
+					  align-items: center;
+					  justify-content: flex-end;
+					  image{
+					  	 width: 30rpx;
+					  	height:30rpx;
+						margin-left:5rpx;
+					  }
+					  .image-box{
+						  width: 40rpx;
+						  height:38rpx;
+					  }
+				  }
+.upop_input{
+	padding: 15rpx 10rpx;
+	flex: 1;
+}
+.xcv{
+	flex: 1;
+}
+				  
+			  }
+			  &:last-child{
+				  border-bottom:none;
+			  }
+		  }
+	  }
+}
+</style>

shop/commodity/components/orderDetailSendCard.vue

@@ -0,0 +1,141 @@
+<template>
+	<view class="detail-send-order">
+		<view class="detail-send-order-top">
+			<view class="detail-send-order-top-left">
+				订单编号：425676547654
+			</view>
+		</view>
+	<view class="detail-send-order-product">
+	 <view class="detail-send-order-product__wrapper">
+	 	<view class="detail-send-order-content" v-for="(items,indexs) in orderProduct" :key="indexs">
+	 		<view class="detail-send-order-content-left">
+	 			<view class="detail-send-order-content-left-img">
+					<image v-if="items.image" :src="items.image" mode="widthFix"></image>
+					<text  v-else>暂无照片</text>
+	 			</view>
+	 		</view>
+			<view class="detail-send-order-content-middle">
+				<view class="detail-send-order-content-middle-top" >
+					三个苹果 纯天然浓缩果蔬汁清汁苹果
+				</view>
+			<!-- 	<view class="detail-send-order-content-middle-top-bot" v-if="items.cart_info">
+					{{items.cart_info.product.sku}}
+				</view> -->
+			</view>
+	 		<view class="detail-send-order-content-right">
+	 			<view class="detail-send-order-yi-in-neibu-right-im">
+	 				¥1855555
+	 			</view>
+	 			<view class="detail-send-order-yi-in-neibu-right-in">
+	 				共10件
+	 			</view>
+	 		</view>
+	 	</view>
+	 	
+	 
+	 </view>
+	</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				orderProduct:[{
+					image:"https://cdn.bjtdba.com/chuxubao/images/2025-02-10/8198d202502101042344757.png"
+				}]
+				
+			};
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.detail-send-order{
+	// width: 100%;
+	min-height: 267rpx;
+	background: #FFFFFF;
+	border-radius: 16rpx;
+	padding: 0 26rpx 20rpx;
+	.detail-send-order-top{
+		width: 100%;
+		padding: 32rpx 0 32rpx 0;
+		display: flex;
+		color: #333333;
+		justify-content: space-between;
+		align-items: center;
+		font-size: 26rpx;
+		.detail-send-order-top-left {
+			font-weight: 500;
+			color: #333333;
+		}
+	}
+.detail-send-order-product{
+	width: calc(100% - 54rpx);
+	margin:0 26rpx;
+	&__wrapper{
+		
+		display: flex;
+		flex-direction: column;
+		justify-content: space-between;
+		align-items: flex-end;
+		.detail-send-order-content{
+			width:100%;
+			display: flex;
+			align-items: center;
+			padding: 10rpx 0 15rpx 0;
+			gap:20rpx;
+			.detail-send-order-content-left{
+				height: 100%;
+				display: flex;
+				align-items: flex-start;
+				justify-content: space-between;
+				&-img{
+					width: 158rpx;
+					height: 158rpx;
+					background-color: #eee;
+					overflow: hidden;
+					border-radius: 10rpx;
+					flex-shrink: 0;
+					image {
+						width: 100%;
+						height: auto;
+					}
+				}
+			}
+}
+     }
+	 .detail-send-order-content-middle{
+		 height: 100%;
+		 &-top{
+		 	width: 100%;
+		 	font-weight: 400;
+		 	color: #333333;
+		 	font-size: 28rpx;
+		 	display: -webkit-box;
+		 	-webkit-box-orient: vertical;
+		 	-webkit-line-clamp: 2;
+		 	overflow: hidden;
+		 	justify-content: space-between;
+		 }
+	 }
+  
+  .detail-send-order-content-right{
+	  .detail-send-order-yi-in-neibu-right-im{
+		  font-weight: 500;
+		  font-size: 28rpx;
+		  color: #333333;
+	  }
+	  .detail-send-order-yi-in-neibu-right-in{
+		  font-weight: 400;
+		  font-size: 24rpx;
+		  color: #666666;
+		  text-align: center;
+		  padding-top:5rpx;                                                               
+	  }
+  }
+   }
+
+}
+</style>

shop/commodity/components/orderList/orderListCard.vue

@@ -0,0 +1,419 @@
+<template>
+	<view class="order-list-card-wrapper" :class="[itemProduct.status==0?downP:incrseP]">
+		<view class="order-list-yi-top">
+			<view class="order-list-yi-top-left">
+				订单编号：{{itemProduct.order_sn}}
+			</view>
+			<view class="order-list-yi-top-right">
+			{{formatStatusValue(itemProduct.status)}}
+			</view>
+		</view>
+		<view class="order-list-address">
+			 <view class="order-list-address__container">
+				 <view class="order-list-address__remdk">
+				 		 <image src="https://cdn.bjtdba.com/vod/image/2022-08-13/20220813164638215.png"
+				 		 	mode="widthFix"></image>
+							<view class="order-list-address__content">
+								{{item.user_address || "暂无地址信息"}}
+							</view>
+				 </view>
+				 <view class="order-list-address__xadasrfe" >
+				 		<template v-if="item.real_name && item.user_phone">
+							<view class="">
+								{{item.real_name }}
+							</view>
+								 <text class="user_phone" >
+								 	{{item.user_phone.substr(0, 3) + '****' + item.user_phone.substr(7)}}
+								 </text>
+						</template>
+						<template v-else>
+							<view class="">
+								{{item.real_name || "暂无用户名" }}
+							</view>
+								 <text class="user_phone"v-if="item.user_phone" >
+								 	{{item.user_phone.substr(0, 3) + '****' + item.user_phone.substr(7)}}
+								 </text>
+								 <text class="user_phone"v-else >
+								 	暂无用户手机号码
+								 </text>
+						</template>
+				 </view>
+			 </view>
+		</view>
+		<view class="order-list-product">
+		 <view class="order-list-product__wrapper">
+		 	<view class="order-list-content" v-for="(items,indexs) in itemProduct.orderProduct" :key="indexs">
+		 		<view class="order-list-content-left">
+		 			<view class="order-list-content-left-img">
+						<template v-if="items.cart_info">
+							<image v-if="items.cart_info.product.image" :src="items.cart_info.product.image" mode="widthFix"></image>
+				      	<text  v-else>暂无照片</text>
+						</template>
+						<template v-else>
+							<text>暂无照片</text>
+						</template>
+		 				
+		 			</view>
+		 		</view>
+				<view class="order-list-content-middle">
+					<view class="order-list-content-middle-top" v-if="items.cart_info">
+						{{items.cart_info.product.store_name}}
+					</view>
+					<view class="order-list-content-middle-top-bot" v-if="items.cart_info">
+						{{items.cart_info.product.sku}}
+					</view>
+				</view>
+		 		<view class="order-list-content-right">
+		 			<view class="order-list-yi-in-neibu-right-im">
+		 				¥{{items.product_price}}
+		 			</view>
+		 			<view class="order-list-yi-in-neibu-right-in">
+		 				共10件
+		 			</view>
+		 		</view>
+		 	</view>
+		 	
+		 
+		 </view>
+		</view>
+	   <view class="order-list-btn">
+		<view v-if="itemProduct.status=='0'" class="btn-list" @click="handleSendOutGoods">
+	    	立即发货
+	    </view>
+		<!-- <view  class="btn-list" @click="handleSendOutGoods">
+			已送达
+		</view>
+		<view  class="btn-list" @click="handleSendOutGoods">
+			查看物流
+		</view> -->
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props:{
+			item:{
+				type:Object,
+				default:()=>{}
+			}
+		},
+		
+		data() {
+			return {
+				incrseP: 'order-list-yi',
+				downP: 'order-list-yissss',//待发货
+				itemProduct:{}
+			};
+		},
+		mounted() {
+			this.itemProduct  =this.item
+		},
+		watch:{
+			item:{
+				handler(value){
+					this.$set(this,"itemProduct",value)
+				},
+				deep:true
+			}
+		},
+		methods:{
+			handleSendOutGoods(){
+				this.$emit("handleSendOutGoods",this.item)
+			},
+			getDataFormatValue(data,type){
+				console.log(this.item,"item======item")
+			},
+			formatStatusValue(status){
+				let obj = {
+					"6":'已取消',
+					"0":'待发货',
+					"1":'待收货',
+					"2":'待评价',
+					"3":'已完成',
+					"4":'已申请退款',
+					"-1":'已退款',
+					"5":'待付款',
+				}
+				return obj[status] || "--"
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.order-list-card-wrapper{
+	width: 100%;
+	min-height: 450rpx;
+	background: #FFFFFF;
+	border-radius: 16rpx;
+	// border:2rpx solid #f00;
+	.order-list-yi-top {
+		width: 100%;
+		padding: 32rpx 0 32rpx 0;
+		border-bottom: 1rpx solid #E5E5E5;
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		font-size: 26rpx;
+		.order-list-yi-top-left {
+			font-weight: 500;
+			color: #333333;
+			margin-left: 26rpx;
+		}
+		.order-list-yi-top-right {
+			font-weight: 400;
+			color: #1F7CFF;
+			margin-right: 26rpx;
+		}
+		}
+	&.order-list-yi{
+		margin-bottom: 20rpx;
+		display: flex;
+		flex-direction: column;
+		justify-content: flex-start;
+		align-items: center;
+		
+	}
+	.order-list-address{
+		width: calc(100% - 54rpx);
+		margin: 26rpx;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		background: #F8F8F8;
+		border-radius: 16rpx;
+		&__container{
+			width: 100%;
+			padding:20rpx 20rpx 9rpx 16rpx;
+			.order-list-address__remdk{
+				display: flex;
+				image {
+				width: 38rpx;
+				height: 38rpx;
+				flex-shrink: 0;
+				margin-right: 10rpx;
+				}
+				.order-list-address__content{
+					width: 100%;
+					font-size: 26rpx;
+					font-weight: 400;
+					color: #333333;
+					display: -webkit-box;
+					-webkit-box-orient: vertical;
+					-webkit-line-clamp: 2;
+					overflow: hidden;
+				}
+			}
+			.order-list-address__xadasrfe{
+				width:100%;
+				padding:10rpx ;
+				font-size: 28rpx;
+				font-weight: 400;
+				color: #999999;
+				display: flex;
+				align-items: center;
+				word-break: break-all;
+				box-sizing: border-box;
+				min-height:28rpx;
+				gap:32rpx;
+				.user_phone{
+					padding-top:6rpx;
+				}
+			}
+		}
+
+	}
+.order-list-product{
+	// border: 2rpx solid #F00;
+	width: calc(100% - 54rpx);
+	margin:0 26rpx;
+	&__wrapper{
+		
+		display: flex;
+		flex-direction: column;
+		justify-content: space-between;
+		align-items: flex-end;
+		.order-list-content{
+			width:100%;
+			display: flex;
+			align-items: center;
+			padding: 10rpx 0 15rpx 0;
+			gap:20rpx;
+			.order-list-content-left{
+				height: 100%;
+				display: flex;
+				align-items: flex-start;
+				justify-content: space-between;
+				&-img{
+					width: 158rpx;
+					height: 158rpx;
+					background-color: #eee;
+					overflow: hidden;
+					border-radius: 10rpx;
+					flex-shrink: 0;
+					image {
+						width: 100%;
+						height: auto;
+					}
+				}
+			}
+		}
+	.order-list-content-middle{
+		height: 100%;
+		width: calc(100% - 158rpx - 23.6%);
+		
+		&-top{
+			// width:100%;
+			
+			font-family: PingFangSC, PingFang SC;
+			font-weight: 400;
+			font-size: 28rpx;
+			color: #333333;
+			text-align: left;
+			overflow: hidden;
+            white-space: nowrap;
+			text-overflow: ellipsis;
+			line-height: 28rpx;
+			padding-bottom: 10rpx;
+		}
+		&-top-bot{
+			font-family: PingFangSC, PingFang SC;
+			font-weight: 400;
+			font-size: 22rpx;
+			color: #666666;
+			text-align: left;
+		}
+	}
+	.order-list-content-right{
+		height: 73rpx;
+		flex-shrink: 0;
+		font-size: 28rpx;
+		font-weight: 500;
+		color: #333333;
+		display: flex;
+		flex-direction: column;
+		justify-content: space-between;
+		align-items: flex-end;
+	}
+	}
+	.osjdhujfhueihfg {
+		// width: 634rpx;
+		// height: 272rpx;
+	
+		display: flex;
+		flex-direction: column;
+		justify-content: space-between;
+		align-items: flex-end;
+	
+	
+		.order-list-yi-in-neibu {
+			width: 634rpx;
+			// height: 158rpx;
+			// background-color: #1F7CFF;
+			display: flex;
+			justify-content: space-between;
+			align-items: flex-start;
+			padding: 10rpx 0 10rpx 0;
+	
+			.order-list-yi-in-neibu-left {
+				width: 474rpx;
+				height: 100%;
+				display: flex;
+				align-items: flex-start;
+				justify-content: space-between;
+	
+				.order-list-yi-in-neibu-left-img {
+					width: 158rpx;
+					height: 158rpx;
+					// background-color: #1F7CFF;
+					overflow: hidden;
+	
+					image {
+						width: 100%;
+						height: auto;
+					}
+				}
+	
+				.order-list-yi-in-neibu-left-url {
+					width: 290rpx;
+					height: 70rpx;
+					display: flex;
+					flex-direction: column;
+					justify-content: space-between;
+	
+					.order-list-yi-in-neibu-left-url-top {
+						width: 100%;
+						font-weight: 400;
+						color: #333333;
+						font-size: 28rpx;
+						display: inline-block;
+						overflow: hidden;
+						text-overflow: ellipsis;
+						white-space: nowrap;
+					}
+	
+					.order-list-yi-in-neibu-left-url-top-bot {
+						width: 100%;
+						font-size: 24rpx;
+						font-weight: 400;
+						color: #666666;
+						display: inline-block;
+						overflow: hidden;
+						text-overflow: ellipsis;
+						white-space: nowrap;
+					}
+				}
+			}
+	
+			.order-list-yi-in-neibu-right {
+				height: 73rpx;
+				font-size: 28rpx;
+				font-weight: 500;
+				color: #333333;
+				display: flex;
+				flex-direction: column;
+				justify-content: space-between;
+				align-items: flex-end;
+	
+				.order-list-yi-in-neibu-right-im {
+					font-size: 28rpx;
+					font-weight: 500;
+					color: #333333;
+				}
+	
+				.order-list-yi-in-neibu-right-in {
+					font-size: 24rpx;
+					font-weight: 400;
+					color: #666666;
+				}
+			}
+		}
+	}
+}
+
+.order-list-btn{
+	display: flex;
+	align-items: center;
+	justify-content: flex-end;
+	padding: 10rpx 26rpx 26rpx;
+	gap:10rpx;
+	.btn-list{
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 142rpx;
+		border-radius: 40rpx;
+		border: 1rpx solid #999999;
+		font-size: 24rpx;
+		font-weight: 400;
+		color: #333333;
+		text-align: center;
+		padding: 15rpx 10rpx;
+		// 
+	}
+}
+
+
+}
+</style>

shop/commodity/components/search/search.vue

@@ -0,0 +1,88 @@
+<template>
+	<view class="search-wrapper">
+		      <view class=" flex-row justify-end">
+		        <image
+		          class="search__image"
+		          referrerpolicy="no-referrer"
+		          src="/static/images/new_ui/search_icon_blod.png"
+		        />
+				<input class="search__input" v-model="searchValue" type="text" placeholder="请输入订单号/收货人/联系方式/提货码" />
+		        <button class="search__btn" @click="haandleSearch">
+		          搜索
+		        </button>
+		      </view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				searchValue:""
+			};
+		},
+		methods:{
+			haandleSearch(){
+				this.$emit("search",this.searchValue)
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+.search-wrapper{
+	background: #FFFFFF;
+	height: 110rpx;
+	display: flex;
+	align-items: center;
+	width: 100%;
+	
+	.search__image{
+		position: absolute;
+		  width: 32rpx;
+		  height: 32rpx;
+		  left:40rpx;
+		  top:28rpx;
+	}
+	.search__input{
+		border:2rpx solid #000;
+		flex:1;
+		height: 80rpx;
+		margin-left:26rpx;
+		padding: 0 120rpx 0 55rpx;
+		border-radius: 40rpx 0 0 40rpx;
+		margin-right: 20rpx;
+		border: none;
+			background: #F8F8F8;
+			font-size: 26rpx;
+			color: #333333;
+	}
+	.flex-row{
+		display: flex;
+		flex-direction: row;
+		align-items: center;
+		
+	}
+	.justify-end{
+		position: relative;
+		border-radius: 30rpx;
+		    flex: 1;
+		
+		
+	}
+	.search__btn{
+		position: absolute;
+		right:20rpx;
+		width: 108rpx;
+		 background-color: rgba(31, 124, 255, 1);
+		  border-radius: 30px;
+		   overflow-wrap: break-word;
+		   text-align: center;
+		    font-size: 28rpx;
+			 line-height: 40px;
+			 color: rgba(255, 255, 255, 1);
+			 
+	}
+	     
+}
+</style>

shop/commodity/components/shipmentGoodsCard.vue

@@ -0,0 +1,95 @@
+<template>
+	
+	<view class="card-wrapper">
+	   <view class="card-wrapper__text">发货商品</view>
+	   <view class="card-wrapper__address">
+		   北京市通州区经开壹中心14号楼9层北京市通州区经开壹中心14号楼9层
+	   </view>
+	   <view class="card-wrapper__user">
+		   <view class="card-wrapper__user--info">
+		   	<view class="">
+		   		郭郭备份
+		   	</view>
+		   		 <text class="user_phone" >
+		   		 	{{user_phone.substr(0, 3) + '****' + user_phone.substr(7)}}
+		   		 </text>
+		   </view>
+		   <view class="card-wrapper__user--btn">
+		    <image src="/static/images/new_ui/look.png" ></image>
+			</view>
+	   </view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				showDetailInfo:false,
+				user_phone:"18533332222"
+			};
+		},
+		methods:{
+			
+			changeDetailInfo(){
+				this.showDetailInfo = !this.showDetailInfo
+			}
+			
+		}
+	}
+</script>
+
+<style lang="scss">
+.card-wrapper{
+
+	background: #FFFFFF;
+	 border-radius: 16rpx;
+	 padding: 26rpx 21rpx 10rpx 32rpx;
+	  display: flex;
+	  flex-direction: column;
+	&__text{
+	  font-size: 36rpx;
+	  font-weight: bold;
+	  color: #333;
+	  margin: 0 0 26rpx;
+	}
+ &__address{
+	font-weight: 400;
+	font-size: 26rpx;
+	color: #333333;
+	line-height: 37rpx;
+	text-align: left;
+ }
+		
+	.card-wrapper__user{
+		display: flex;
+		justify-content: space-around;
+		align-items: center;
+		&--info{
+			width:100%;
+			padding:10rpx 10rpx 10rpx 0 ;
+			font-size: 28rpx;
+			font-weight: 400;
+			color: #999999;
+			display: flex;
+			align-items: center;
+			word-break: break-all;
+			box-sizing: border-box;
+			min-height:28rpx;
+			gap:32rpx;
+			flex:1;
+			.user_phone{
+				padding-top:6rpx;
+			}
+		}
+		&--btn{
+			width:45rpx;
+			flex-shrink: 0;
+			image{
+				width:41rpx;
+				height: 27rpx;
+			}
+		}
+	}
+}
+</style>

shop/commodity/order.vue

@@ -9,85 +9,32 @@
 					</view>
 				</view>
 				<view class="order-header-text-title">
-					我的订单
+					订单列表
 				</view>
 			</view>
 		</view>
-		<view class="order-nbeirong">
-			<view class="order-nbeirong-yi" v-for="(item,index) in num" :key="index" @click="ysne(index,item.status)"
-				:style="index==indexs?'font-weight: 500;color: #1F7CFF;':'font-weight: 400;color: #333333;'">
-				{{item.name}}
-				<view class="order-nbeirong-yi-xiabiapo" v-if="index==indexs?true:false">
-
-				</view>
+		<view class="order-list-filter-wrapper">
+			<view class="order-search_customs">
+				<searchVue @search="search"></searchVue>
 			</view>
-		</view>
-		<view class="order-list">
-			<view :class="item.status=='待发货'?downP:incrseP" v-for="(item,index) in list" :key="index"
-				@click="details(item.order_id)">
-				<view class="order-list-yi-top">
-					<view class="order-list-yi-top-left">
-						订单编号：{{item.order_id}}
-					</view>
-					<view class="order-list-yi-top-right">
-						{{item.status}}
-					</view>
-				</view>
-				<view class="order-list-yi-in">
-					<view class="osjdhujfhueihfg">
-						<view class="order-list-yi-in-neibu" v-for="(items,indexs) in item.procductList" :key="indexs">
-							<view class="order-list-yi-in-neibu-left">
-								<view class="order-list-yi-in-neibu-left-img">
-									<image :src="items.image" mode="widthFix"></image>
-								</view>
-								<view class="order-list-yi-in-neibu-left-url">
-									<view class="order-list-yi-in-neibu-left-url-top">
-										{{items.store_name}}
-									</view>
-									<view class="order-list-yi-in-neibu-left-url-top-bot">
-										{{items.sku}}
-									</view>
-								</view>
-							</view>
-							<view class="order-list-yi-in-neibu-right">
-								<view class="order-list-yi-in-neibu-right-im">
-									¥{{items.pay_price}}
-								</view>
-								<view class="order-list-yi-in-neibu-right-in">
-									共{{items.cart_num}}件
-								</view>
-							</view>
-						</view>
-						
-						<view class="" v-if="item.status=='待发货'?true:false"
-							style="width: 142rpx;height: 58rpx;border-radius: 30rpx;border: 1rpx solid #999999;font-size: 24rpx;font-weight: 400;color: #333333;text-align: center;line-height: 58rpx;">
-							立即发货
-						</view>
-					</view>
-				</view>
-				<view class="order-list-yi-bot">
-					<view class="order-list-yi-bot-xiangxi">
-						<view class="order-list-yi-bot-xiangxier">
-							<image src="https://cdn.bjtdba.com/vod/image/2022-08-13/20220813164638215.png"
-								mode="widthFix"></image>
-						</view>
-						<view class="order-list-yi-bot-xadasrfe">
-							<view class="order-list-yi-bot-xadasrfe-top">
-								{{item.user_address}}
-							</view>
-							<view class="order-list-yi-bot-xadasrfe-bot">
-								<view class="">
-									{{item.real_name}}
-								</view>
-								<view class="" style="margin-left: 32rpx;">
-									{{item.user_phone.substr(0, 3) + '****' + item.user_phone.substr(7)}}
-								</view>
-							</view>
-						</view>
-					</view>
-				</view>
+			<view class="order-nbeirong_customs">
+				<tabsVue :category="num" :curruntActive="indexs" @tabs="tabsHandleClick"/>
 			</view>
-			<view class="" v-if="tihsi==0" style="margin: 60rpx 0 30rpx 0; color: #999999; font-size: 26rpx;">
+		</view>
+		
+		 <view class="order-list">
+			
+			<template v-if="listMock.length>0">
+				<template v-for="(item,index) in listMock">
+					 <orderListCardVue class="order-list__card" @handleSendOutGoods="handleSendOutGoods" :item="item" :key="index+'index'"/>
+				</template>
+			</template>
+			<template v-else>
+				<emptyDataVue/>
+			</template>
+			 </view>
+			
+			<view class="" v-if="tihsi==0&&listMock.length>0" style="margin: 60rpx 0 30rpx 0; color: #999999; font-size: 26rpx;">
 				—— 已经到最底部了哦 ——
 			</view>
 		</view>
@@ -98,9 +45,16 @@
 	import {
 		orderList
 	} from '@/commit/order.js'
+	import emptyDataVue from '../components/emptyData/emptyData.vue'
+	import tabsVue from '../components/tabs/tabs/tabs.vue'
+	import orderListCardVue from './components/orderList/orderListCard.vue'
+	import searchVue from './components/search/search.vue'
+	import {listData} from "./mockData.js"
 	export default {
+		components:{emptyDataVue,tabsVue,orderListCardVue,searchVue},
 		data() {
 			return {
+				listMock:[],
 				page: 1,
 				limit: 10,
 				tihsi: '',
@@ -114,33 +68,82 @@
 				downP: 'order-list-yissss',
 				list: [],
 				num: [{
+						name: "全部",
+						status: null,
+						totalNum:0,
+						show:true
+					},{
 						name: "待付款",
-						status: 5
+						status: 1,
+						totalNum:0,
+						show:true
 					},
 					{
 						name: "待发货",
-						status: 0
+						status: 2,
+						totalNum:0,
+						show:true
 					},
 					{
 						name: "待收货",
-						status: 1
+						status: 3,
+						totalNum:0,
+						show:true
+					},
+					{
+						name: "待评价",//售后中
+						status: 4,
+						totalNum:0,
+						show:true
+					},
+					{
+						name: "已完成",
+						status: 5,
+						totalNum:0,
+						show:true
 					},
 					{
-						name: "待评价",
-						status: 2
+						name: "已退款",
+						status: 6,
+						totalNum:0,
+						show:true
 					},
-					// {
-					// 	name: "已完成"
-					// }
+					{
+						name: "已删除",
+						status: 7,
+						totalNum:0,
+						show:true
+					}
 				]
+				// num: [{
+				// 		name: "待付款",
+				// 		status: 5
+				// 	},
+				// 	{
+				// 		name: "待发货",
+				// 		status: 0
+				// 	},
+				// 	{
+				// 		name: "待收货",
+				// 		status: 1
+				// 	},
+				// 	{
+				// 		name: "待评价",
+				// 		status: 2
+				// 	},
+				// 	// {
+				// 	// 	name: "已完成"
+				// 	// }
+				// ]
 			}
 		},
 		onLoad(e) {
 			let selectmerchant = uni.getStorageSync('selectmerchant')
 			this.mer_id = selectmerchant.merId
 			this.status = e.status //进入状态
-			this.indexs = e.index
-			this.orderList()
+			this.indexs = e.index==null?0:Number(e.index)
+			this.listMock = listData || []
+			// this.orderList()
 		},
 		onPullDownRefresh() {
 			uni.showLoading({
@@ -149,7 +152,7 @@
 			this.page = 1
 			this.is_panudn = true
 			this.list = []
-			this.orderList();
+			// this.orderList();
 		},
 		onReachBottom() {
 			if (this.is_panudn == true) {
@@ -160,6 +163,15 @@
 			}
 		},
 		methods: {
+			search(val){
+				console.log(val,"搜索")
+			},
+			handleSendOutGoods(v){
+				console.log("發貨",v)
+				uni.redirectTo({
+					url: './sendoutgoods?order_id=' + v.order_id + "&status=" + v.status + "&indexs=" + this.indexs
+				});
+			},
 			// 正向订单列表
 			orderList() {
 				uni.showLoading({
@@ -199,12 +211,19 @@
 					url: './details?order_id=' + e + "&status=" + this.status + "&indexs=" + this.indexs
 				});
 			},
-			ysne(e, i) {
-				this.status = i
-				this.indexs = e
+			tabsHandleClick({index,item}){
+				this.ysne(index,item.status)
+				
+			},
+			ysne(index, status) {
+				this.status = status
+				this.indexs = index
 				this.page = 1
 				this.is_panudn = true
-				this.orderList()
+				
+				console.log(index,this.indexs,"---tabsHandleClick")
+				console.log(status,this.status ,"---tabsHandleClickitem")
+				// this.orderList()
 			},
 			topgi() {
 				uni.switchTab({
@@ -237,7 +256,8 @@
 			height: 176rpx;
 			background: #FFFFFF;
 			display: flex;
-			justify-content: center;
+			// justify-content: center;
+			padding-left:20rpx;
 
 			.order-header-text {
 				width: 686rpx;
@@ -266,7 +286,7 @@
 				}
 			}
 		}
-
+        
 		.order-nbeirong {
 			width: 686rpx;
 			height: 30rpx;
@@ -274,402 +294,36 @@
 			display: flex;
 			justify-content: space-around;
 			align-items: center;
-
-			.order-nbeirong-yi {
-				font-size: 30rpx;
-				position: relative;
-				display: flex;
-				justify-content: center;
-
-				.order-nbeirong-yi-xiabiapo {
-					position: absolute;
-					top: 45rpx;
-					width: 50rpx;
-					height: 6rpx;
-					background: #1F7CFF;
-					border-radius: 3rpx;
-				}
+		}
+		.order-list-filter-wrapper{
+			margin: 176rpx 0rpx 0rpx;
+			width: 100%;
+			position: fixed;
+			top:0rpx;
+			z-index:99;
+			.order-nbeirong_customs{
+				width: 100%;
+				min-height: 30rpx;
+				
+				margin: 0rpx 0 26rpx 0;
 			}
+			.order-search_customs{
+			width: 100%;
+			min-height: 30rpx;
+			
+				}
+			
 		}
-
 		.order-list {
 			width: 100%;
 			height: 100%;
 			display: flex;
 			flex-direction: column;
 			align-items: center;
-
-			.order-list-yi {
-				width: 686rpx;
-				// height: 472rpx;
-				background: #FFFFFF;
-				border-radius: 16rpx;
-				margin-bottom: 20rpx;
-				display: flex;
-				flex-direction: column;
-				justify-content: space-between;
-				align-items: center;
-
-				.order-list-yi-top {
-					width: 100%;
-					// height: 90rpx;
-					padding: 32rpx 0 32rpx 0;
-					border-bottom: 1rpx solid #E5E5E5;
-					display: flex;
-					justify-content: space-between;
-					align-items: center;
-					font-size: 26rpx;
-
-					.order-list-yi-top-left {
-						font-weight: 500;
-						color: #333333;
-						margin-left: 26rpx;
-					}
-
-					.order-list-yi-top-right {
-						font-weight: 400;
-						color: #1F7CFF;
-						margin-right: 26rpx;
-					}
-				}
-
-				.order-list-yi-in {
-					width: 100%;
-					// height: 210rpx;
-					padding: 26rpx 0 26rpx 0;
-					border-bottom: 1rpx solid #E5E5E5;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-
-					.order-list-yi-in-neibu {
-						width: 634rpx;
-						height: 158rpx;
-						display: flex;
-						margin: 10rpx 0 10rpx 0;
-						justify-content: space-between;
-						align-items: flex-start;
-
-						.order-list-yi-in-neibu-left {
-							width: 474rpx;
-							height: 100%;
-							display: flex;
-							align-items: flex-start;
-							justify-content: space-between;
-
-							.order-list-yi-in-neibu-left-img {
-								width: 158rpx;
-								height: 158rpx;
-								overflow: hidden;
-
-								image {
-									width: 100%;
-									height: 100%;
-								}
-							}
-
-							.order-list-yi-in-neibu-left-url {
-								width: 290rpx;
-								height: 70rpx;
-								display: flex;
-								flex-direction: column;
-								justify-content: space-between;
-
-								.order-list-yi-in-neibu-left-url-top {
-									width: 100%;
-									font-weight: 400;
-									color: #333333;
-									font-size: 28rpx;
-									display: inline-block;
-									overflow: hidden;
-									text-overflow: ellipsis;
-									white-space: nowrap;
-								}
-
-								.order-list-yi-in-neibu-left-url-top-bot {
-									width: 100%;
-									font-size: 24rpx;
-									font-weight: 400;
-									color: #666666;
-									display: inline-block;
-									overflow: hidden;
-									text-overflow: ellipsis;
-									white-space: nowrap;
-								}
-							}
-						}
-
-						.order-list-yi-in-neibu-right {
-							height: 73rpx;
-							font-size: 28rpx;
-							font-weight: 500;
-							color: #333333;
-							display: flex;
-							flex-direction: column;
-							justify-content: space-between;
-							align-items: flex-end;
-
-							.order-list-yi-in-neibu-right-im {
-								font-size: 28rpx;
-								font-weight: 500;
-								color: #333333;
-							}
-
-							.order-list-yi-in-neibu-right-in {
-								font-size: 24rpx;
-								font-weight: 400;
-								color: #666666;
-							}
-						}
-					}
-				}
-
-				.order-list-yi-bot {
-					width: 100%;
-					// height: 170rpx;
-					padding: 26rpx 0 32rpx 0;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-
-					.order-list-yi-bot-xiangxi {
-						width: 634rpx;
-						height: 112rpx;
-						display: flex;
-						align-items: flex-start;
-
-						.order-list-yi-bot-xiangxier {
-							width: 38rpx;
-							height: 38rpx;
-
-							image {
-								width: 100%;
-								height: 100%;
-							}
-						}
-
-						.order-list-yi-bot-xadasrfe {
-							width: 544rpx;
-							height: 100%;
-							margin-left: 16rpx;
-							display: flex;
-							flex-direction: column;
-							justify-content: space-between;
-							align-items: flex-start;
-
-							.order-list-yi-bot-xadasrfe-top {
-								width: 100%;
-								font-size: 26rpx;
-								font-weight: 400;
-								color: #333333;
-								display: -webkit-box;
-								-webkit-box-orient: vertical;
-								-webkit-line-clamp: 2;
-								overflow: hidden;
-							}
-
-							.order-list-yi-bot-xadasrfe-bot {
-								font-size: 28rpx;
-								font-weight: 400;
-								color: #999999;
-								display: flex;
-							}
-						}
-					}
-				}
-			}
-
-			.order-list-yissss {
-				width: 686rpx;
-				// height: 556rpx;
-				background: #FFFFFF;
-				border-radius: 16rpx;
-				margin-bottom: 20rpx;
-				display: flex;
-				flex-direction: column;
-				justify-content: space-between;
-				align-items: center;
-
-				.order-list-yi-top {
-					width: 100%;
-					// height: 90rpx;
-					padding: 32rpx 0 32rpx 0;
-					border-bottom: 1rpx solid #E5E5E5;
-					display: flex;
-					justify-content: space-between;
-					align-items: center;
-					font-size: 26rpx;
-
-					.order-list-yi-top-left {
-						font-weight: 500;
-						color: #333333;
-						margin-left: 26rpx;
-					}
-
-					.order-list-yi-top-right {
-						font-weight: 400;
-						color: #1F7CFF;
-						margin-right: 26rpx;
-					}
-				}
-
-				.order-list-yi-in {
-					width: 100%;
-					// height: 294rpx;
-					border-bottom: 1rpx solid #E5E5E5;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-					padding: 26rpx 0 26rpx 0;
-
-					.osjdhujfhueihfg {
-						width: 634rpx;
-						// height: 272rpx;
-
-						display: flex;
-						flex-direction: column;
-						justify-content: space-between;
-						align-items: flex-end;
-
-
-						.order-list-yi-in-neibu {
-							width: 634rpx;
-							height: 158rpx;
-							// background-color: #1F7CFF;
-							display: flex;
-							justify-content: space-between;
-							align-items: flex-start;
-							padding: 10rpx 0 10rpx 0;
-
-							.order-list-yi-in-neibu-left {
-								width: 474rpx;
-								height: 100%;
-								display: flex;
-								align-items: flex-start;
-								justify-content: space-between;
-
-								.order-list-yi-in-neibu-left-img {
-									width: 158rpx;
-									height: 158rpx;
-									// background-color: #1F7CFF;
-									overflow: hidden;
-
-									image {
-										width: 100%;
-										height: auto;
-									}
-								}
-
-								.order-list-yi-in-neibu-left-url {
-									width: 290rpx;
-									height: 70rpx;
-									display: flex;
-									flex-direction: column;
-									justify-content: space-between;
-
-									.order-list-yi-in-neibu-left-url-top {
-										width: 100%;
-										font-weight: 400;
-										color: #333333;
-										font-size: 28rpx;
-										display: inline-block;
-										overflow: hidden;
-										text-overflow: ellipsis;
-										white-space: nowrap;
-									}
-
-									.order-list-yi-in-neibu-left-url-top-bot {
-										width: 100%;
-										font-size: 24rpx;
-										font-weight: 400;
-										color: #666666;
-										display: inline-block;
-										overflow: hidden;
-										text-overflow: ellipsis;
-										white-space: nowrap;
-									}
-								}
-							}
-
-							.order-list-yi-in-neibu-right {
-								height: 73rpx;
-								font-size: 28rpx;
-								font-weight: 500;
-								color: #333333;
-								display: flex;
-								flex-direction: column;
-								justify-content: space-between;
-								align-items: flex-end;
-
-								.order-list-yi-in-neibu-right-im {
-									font-size: 28rpx;
-									font-weight: 500;
-									color: #333333;
-								}
-
-								.order-list-yi-in-neibu-right-in {
-									font-size: 24rpx;
-									font-weight: 400;
-									color: #666666;
-								}
-							}
-						}
-					}
-
-				}
-
-				.order-list-yi-bot {
-					width: 100%;
-					height: 170rpx;
-					display: flex;
-					align-items: center;
-					justify-content: center;
-
-					.order-list-yi-bot-xiangxi {
-						width: 634rpx;
-						height: 112rpx;
-						display: flex;
-						align-items: flex-start;
-
-						.order-list-yi-bot-xiangxier {
-							width: 38rpx;
-							height: 38rpx;
-
-							image {
-								width: 100%;
-								height: 100%;
-							}
-						}
-
-						.order-list-yi-bot-xadasrfe {
-							width: 544rpx;
-							height: 100%;
-							margin-left: 16rpx;
-							display: flex;
-							flex-direction: column;
-							justify-content: space-between;
-							align-items: flex-start;
-
-							.order-list-yi-bot-xadasrfe-top {
-								width: 100%;
-								font-size: 26rpx;
-								font-weight: 400;
-								color: #333333;
-								display: -webkit-box;
-								-webkit-box-orient: vertical;
-								-webkit-line-clamp: 2;
-								overflow: hidden;
-							}
-
-							.order-list-yi-bot-xadasrfe-bot {
-								font-size: 28rpx;
-								font-weight: 400;
-								color: #999999;
-								display: flex;
-							}
-						}
-					}
-				}
+			margin-top: 415rpx;
+            .order-list__card{
+				width: calc(100% - 40rpx);
+				margin:0 20rpx 26rpx;
 			}
 		}
 	}

shop/commodity/sendoutgoods.vue

@@ -0,0 +1,134 @@
+<template>
+	<view class="order-send-out-goods">
+		<view class="order-send-out-goods-header">
+			<view class="order-send-out-goods-header-text">
+				<view class="order-send-out-goods-header-text-neishi" @click="topgi">
+					<view class="order-send-out-goods-header-text-neishi-icon">
+						<image src="https://cdn.bjtdba.com/vod/image/2022-08-11/20220811133828415.png" mode="widthFix">
+						</image>
+					</view>
+				</view>
+				<view class="order-send-out-goods-header-text-title">
+					发货
+				</view>
+			</view>
+		</view>
+		<view class="order-send-out-goods__content">
+			<shipmentGoodsCardVue />
+			<orderDetailSendCardVue class="custom_class"/>
+			<fillLogisticsInfoVue class="custom_class"/>
+			<view class="btn-box">
+			  <button type="primary" class="send-goods">发货</button>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import shipmentGoodsCardVue from './components/shipmentGoodsCard.vue'
+	import orderDetailSendCardVue from './components/orderDetailSendCard.vue'
+	import fillLogisticsInfoVue from './components/fillLogisticsInfo.vue'
+	export default {
+		components:{shipmentGoodsCardVue,orderDetailSendCardVue,fillLogisticsInfoVue},
+		data() {
+			return {
+				indexs: '',
+				status: '',
+				order_id: '', //订单ID
+			}
+		},
+		onLoad(e) {
+			this.order_id = e.order_id
+			this.indexs = e.indexs
+			this.status = e.status
+		},
+		methods: {
+			topgi(){
+               uni.redirectTo({
+					url: './order?status=' + this.status + '&index=' + this.indexs
+					// url: './order'
+				});
+			}
+		}
+	}
+</script>
+<style>
+	page {
+		background-color: #F7F8FC;
+	}
+</style>
+<style scoped lang="scss">
+	.order-send-out-goods{
+		width: 100%;
+		height: 100%;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		// 头部 start 
+		&-header {
+			position: fixed;
+			top: 0;
+			left: 0;
+			z-index: 111;
+			width: 100%;
+			height: 176rpx;
+			background: #FFFFFF;
+			display: flex;
+			// justify-content: center;
+			padding-left:20rpx;
+		
+			&-text {
+				width: 686rpx;
+				font-size: 36rpx;
+				font-weight: 500;
+				color: #333333;
+				display: flex;
+				margin-top: 107rpx;
+				align-items: center;
+		
+				&-neishi {
+					width: 45rpx;
+					height: 45rpx;
+					margin-right: 17rpx;
+		
+					&-icon {
+						width: 36rpx;
+						height: 36rpx;
+						margin-top: 2rpx;
+		
+						image {
+							width: 100%;
+							height: 100%;
+						}
+					}
+				}
+			}
+		}
+	   // 头部 end
+	
+	&__content{
+		width: 100%;
+		margin: 190rpx 0 50rpx;
+		.btn-box{
+			width: 100%;
+			position: fixed;
+			
+           bottom:30rpx;
+		   .send-goods{
+			   margin:0 32rpx;
+		   }
+		}
+		
+	}
+	
+	.custom_class{
+		margin-top: 26rpx;
+	}
+	
+	
+	
+	}
+	
+
+
+</style>

shop/components/emptyData/emptyData.vue

@@ -0,0 +1,51 @@
+<template>
+	    <view class="flex-col">
+	      <image
+	        class="image_wrapper"
+	        src="/static/images/new_ui/empty_data.png"
+	      />
+	      <text class="text_tilte">{{title}}</text>
+	    </view>
+</template>
+
+<script>
+	export default {
+		props:{
+			title:{
+				type:String,
+				default:"暂无数据"
+			}
+		},
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style lang="scss">
+.flex-col{
+	user-select: none;
+	position: absolute;
+	top:50%;
+	margin-top: -30%;
+	display: flex;
+	flex-direction: column;
+	.text_tilte{
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 400;
+		font-size: 30rpx;
+		color: #333333;
+		line-height: 30rpx;
+		text-align: center;
+		font-style: normal;
+	}
+	.image_wrapper{
+		     width: 327px;
+		      height: 257px;
+			  
+		
+	}
+}
+</style>

shop/components/tabs/tabs/tabs.vue

@@ -0,0 +1,241 @@
+<template>
+	<view class="content">
+		<view class="nav">
+			<!-- 选项卡水平方向滑动，scroll-with-animation是滑动到下一个选项时，有一个延时效果 -->
+			<scroll-view class="tab-scroll" scroll-x="true" scroll-with-animation :scroll-left="scrollLeft">
+				<view class="tab-scroll_box">
+					<!-- 选项卡类别列表 -->
+					<view class="tab-scroll_item" v-for=" (item,index) in category" 
+					:key="index"  :class="{'active':isActive==index}" @click="chenked(index,item)">
+							<span>{{item.name}}</span><span v-if="isShowNumber && item.show">({{item.totalNum|| 0}})</span>
+					</view>
+				</view>
+			</scroll-view>
+		</view>
+		<!-- <swiper @change="change" :current="isActive" class="swiper-content" :style="fullHeight">
+			<swiper-item class="swiperitem-content">
+				<scroll-view scroll-y style="height: 100%;">
+					<view class="nav_item" >
+						1
+					</view>
+				</scroll-view>	
+			</swiper-item>
+			<swiper-item class="swiperitem-content">
+				<scroll-view scroll-y style="height: 100%;">
+					<view class="nav_item" >
+						2
+					</view>
+				</scroll-view>	
+			</swiper-item>
+			<swiper-item class="swiperitem-content">
+				<scroll-view scroll-y style="height: 100%;">
+					<view class="nav_item" >
+						3
+					</view>
+				</scroll-view>
+			</swiper-item>
+			<swiper-item class="swiperitem-content">
+				<scroll-view scroll-y style="height: 100%;">
+					<view class="nav_item" >
+						4
+					</view>
+				</scroll-view>	
+			</swiper-item>
+			<swiper-item class="swiperitem-content">
+				<scroll-view scroll-y style="height: 100%;">
+					<view class="nav_item" >
+						5
+				    </view>
+				</scroll-view>	
+			</swiper-item>
+			<swiper-item class="swiperitem-content">
+				<scroll-view scroll-y style="height: 100%;">
+					<view class="nav_item" >
+						6
+				    </view>
+				</scroll-view>	
+			</swiper-item>
+		</swiper> -->
+	</view>
+</template>
+<script>
+	export default {
+		props:{
+			category:{
+				type:Array,
+				default:()=>[]
+			},
+			isShowNumber:{
+				type:Boolean,
+				default:true
+			},
+			curruntActive:{
+				type:[Number,String],
+				default:0
+			}
+		},
+		watch:{
+			// swiper与上面选项卡联动
+			currentindex(newval){
+				this.isActive = newval;
+				this.scrollLeft = 0;
+				// 滑动swiper后，每个选项距离其父元素最左侧的距离
+				for (let i = 0; i < newval - 1; i++) {
+					this.scrollLeft += this.category[i].width
+				};
+			},
+		},
+		data() {	
+			return {
+				isActive: 0,
+				index: 0,
+				currentindex:0,
+				// category:[
+				// 	{
+				// 		id:1,
+				// 		name:'选项',
+				// 	},
+				// 	{
+				// 		id:2,
+				// 		name:'选项卡二',
+				// 	},
+				// 	{
+				// 		id:3,
+				// 		name:'选项卡三',
+				// 	},
+				// 	{
+				// 		id:4,
+				// 		name:'选项卡四',
+				// 	},
+				// 	{
+				// 		id:5,
+				// 		name:'选项卡五',
+				// 	},
+				// 	{
+				// 		id:6,
+				// 		name:'选项卡六',
+				// 	},
+				// ],
+				contentScrollW: 0, // 导航区宽度
+				scrollLeft: 0, // 横向滚动条位置
+				fullHeight:"",	
+			}
+		},
+		mounted() {
+			var that = this;
+			this.isActive = this.curruntActive
+			 //获取手机屏幕的高度，让其等于swiper的高度，从而使屏幕充满
+			uni.getSystemInfo({
+			      success: function (res) {
+				         that.fullHeight ="height:" + res.windowHeight + "px";
+				  }
+				});
+			// 获取标题区域宽度，和每个子元素节点的宽度
+			this.getScrollW()
+		},
+		methods: {
+			// 获取标题区域宽度，和每个子元素节点的宽度以及元素距离左边栏的距离
+			getScrollW() {
+				const query = uni.createSelectorQuery().in(this);
+				query.select('.tab-scroll').boundingClientRect(data => {
+					  this.contentScrollW = data.width
+				 }).exec();
+				 query.selectAll('.tab-scroll_item').boundingClientRect(data => {
+					 let dataLen = data.length;
+					  for (let i = 0; i < dataLen; i++) {
+						  this.category[i].left = data[i].left;
+						 this.category[i].width = data[i].width
+					}
+				 }).exec()
+			},
+			// 当前点击子元素靠左留一个选项展示，子元素宽度不相同也可实现
+			chenked(index,item) {
+				this.isActive = index;
+				this.scrollLeft = 0;
+				for (let i = 0; i < index - 1; i++) {
+					this.scrollLeft += this.category[i].width
+				};
+				this.$emit('tabs',{index,item})
+			},
+			// swiper滑动时，获取其索引，也就是第几个
+			change(e){
+				const {current} = e.detail;
+				this.currentindex = current;
+			},	
+		}
+	}
+</script>
+<style lang="scss">
+	.content{
+		display: flex;
+		flex-direction: column;
+		width: 100%;
+		flex: 1;
+		.nav{
+			background-color: #fff;	
+			// position: fixed;
+			z-index: 99;
+			width: 100%;
+			align-items: center;
+			// min-height: 40rpx;
+			.tab-scroll{
+				flex: 1;
+				overflow: hidden;
+				box-sizing: border-box;
+				padding-left: 30rpx;
+				padding-right: 30rpx;
+				.tab-scroll_box{
+					display: flex;
+					align-items: center;
+					flex-wrap: nowrap;
+					box-sizing: border-box;
+					height:100rpx;
+					.tab-scroll_item{
+						line-height: 80rpx;
+						margin-right: 35rpx;
+						flex-shrink: 0;
+						display: flex;
+						justify-content: center;
+						font-size: 30rpx;
+						padding-top: 10rpx;
+						color:#333;
+					}
+				}
+			}
+		}
+		.swiper-content{
+			   padding-top: 120rpx;
+			   // flex: 1;
+			.swiperitem-content{
+			    background-color: #ffffff;
+				.nav_item{	
+					background-color: #FFFFFF;
+					padding:20rpx 40rpx 0rpx 40rpx ;
+				}
+			}
+		}	
+	}
+	.active {
+		position: relative;
+		color: #1F7CFF !important;
+		font-weight: 600;
+	}
+	.active::after {
+		content: "";
+		position: absolute;
+		width: 50rpx;
+		height: 8rpx;
+		background-color: #1F7CFF;
+		left: 0px;
+		right: 0px;
+		bottom: 0px;
+		margin: auto;
+        border-radius:8rpx ;
+        margin-top: 10rpx;
+        transition: all 0.3s;
+	}
+	/* 隐藏滚动条，但依旧具备可以滚动的功能 */
+	/deep/.uni-scroll-view::-webkit-scrollbar {
+		display: none
+	}
+</style>

uni_modules/lime-painter/package-lock.json

@@ -0,0 +1,23 @@
+{
+  "name": "lime-painter",
+  "version": "1.9.5.7",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "lime-painter",
+      "version": "1.9.5.7",
+      "license": "ISC",
+      "dependencies": {
+        "lime-painter": "file:"
+      },
+      "engines": {
+        "HBuilderX": "^3.4.14"
+      }
+    },
+    "node_modules/lime-painter": {
+      "resolved": "",
+      "link": true
+    }
+  }
+}

uni_modules/lime-painter/package.json

@@ -9,12 +9,12 @@
     "生成海报",
     "生成二维码",
     "JSON"
-],
-  "repository": "https://gitee.com/liangei/lime-painter", 
+  ],
+  "repository": "https://gitee.com/liangei/lime-painter",
   "engines": {
     "HBuilderX": "^3.4.14"
   },
-"dcloudext": {
+  "dcloudext": {
     "sale": {
       "regular": {
         "price": "0.00"
@@ -65,19 +65,19 @@
           "阿里": "y",
           "百度": "y",
           "字节跳动": "y",
-        "QQ": "y",
-        "钉钉": "u",
-        "快手": "u",
-        "飞书": "u",
-        "京东": "u"
+          "QQ": "y",
+          "钉钉": "u",
+          "快手": "u",
+          "飞书": "u",
+          "京东": "u"
         },
         "快应用": {
           "华为": "u",
           "联盟": "u"
         },
         "Vue": {
-            "vue2": "y",
-            "vue3": "y"
+          "vue2": "y",
+          "vue3": "y"
         }
       }
     }
@@ -88,5 +88,8 @@
     "test": "echo \"Error: no test specified\" && exit 1"
   },
   "author": "",
-  "license": "ISC"
+  "license": "ISC",
+  "dependencies": {
+    "lime-painter": "file:"
+  }
 }

uni_modules/uview-ui/package-lock.json

@@ -0,0 +1,22 @@
+{
+	"name": "uview-ui",
+	"version": "2.0.37",
+	"lockfileVersion": 3,
+	"requires": true,
+	"packages": {
+		"": {
+			"name": "uview-ui",
+			"version": "2.0.37",
+			"dependencies": {
+				"uview-ui": "file:"
+			},
+			"engines": {
+				"HBuilderX": "^3.1.0"
+			}
+		},
+		"node_modules/uview-ui": {
+			"resolved": "",
+			"link": true
+		}
+	}
+}

uni_modules/uview-ui/package.json

@@ -5,20 +5,20 @@
 	"version": "2.0.37",
 	"description": "uView UI已完美兼容nvue，全面的组件和便捷的工具会让您信手拈来，如鱼得水",
 	"keywords": [
-        "uview",
-        "uview",
-        "ui",
-        "ui",
-        "uni-app",
-        "uni-app",
-        "ui"
-    ],
+		"uview",
+		"uview",
+		"ui",
+		"ui",
+		"uni-app",
+		"uni-app",
+		"ui"
+	],
 	"repository": "https://github.com/umicro/uView2.0",
 	"engines": {
 		"HBuilderX": "^3.1.0"
 	},
-    "dcloudext": {
-        "sale": {
+	"dcloudext": {
+		"sale": {
 			"regular": {
 				"price": "0.00"
 			},
@@ -34,8 +34,8 @@
 			"data": "无",
 			"permissions": "无"
 		},
-        "npmurl": "https://www.npmjs.com/package/uview-ui",
-        "type": "component-vue"
+		"npmurl": "https://www.npmjs.com/package/uview-ui",
+		"type": "component-vue"
 	},
 	"uni_modules": {
 		"dependencies": [],
@@ -80,5 +80,8 @@
 				}
 			}
 		}
+	},
+	"dependencies": {
+		"uview-ui": "file:"
 	}
 }

uni_modules/z-paging/package-lock.json

@@ -0,0 +1,22 @@
+{
+  "name": "z-paging",
+  "version": "2.6.3",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "z-paging",
+      "version": "2.6.3",
+      "dependencies": {
+        "z-paging": "file:"
+      },
+      "engines": {
+        "HBuilderX": "^3.0.7"
+      }
+    },
+    "node_modules/z-paging": {
+      "resolved": "",
+      "link": true
+    }
+  }
+}

uni_modules/z-paging/package.json

@@ -10,12 +10,12 @@
     "分页器",
     "nvue",
     "虚拟列表"
-],
+  ],
   "repository": "https://github.com/SmileZXLee/uni-z-paging",
   "engines": {
     "HBuilderX": "^3.0.7"
   },
-"dcloudext": {
+  "dcloudext": {
     "sale": {
       "regular": {
         "price": "0.00"
@@ -67,20 +67,23 @@
           "百度": "y",
           "字节跳动": "y",
           "QQ": "y",
-		  "钉钉": "y",
-		  "快手": "y",
-		  "飞书": "y",
-		  "京东": "y"
+          "钉钉": "y",
+          "快手": "y",
+          "飞书": "y",
+          "京东": "y"
         },
         "快应用": {
           "华为": "y",
           "联盟": "y"
         },
         "Vue": {
-            "vue2": "y",
-            "vue3": "y"
+          "vue2": "y",
+          "vue3": "y"
         }
       }
     }
+  },
+  "dependencies": {
+    "z-paging": "file:"
   }
-}
+}