浏览代码

订单列表分页,暂无数据页修改

lgh 1 月之前
父节点
当前提交
a7492043d7

+ 127 - 65
components/no-data/no-data.vue

@@ -1,74 +1,136 @@
 <template>
-  <!-- 无数据展示 -->
-    <view class="no-data-box">
-      <slot v-if="custom"></slot>
-      <view v-else class="text-center">
-        <view class="flex jcc">
-          <image class="status-img" mode="widthFix" v-if="statusImgUrl" :src="statusImgUrl"></image>
-        </view>
-        <view class="no-data-tips">{{tipsTextCOM}}</view>
-      </view>
-  </view>
+	<!-- 无数据展示 -->
+	<view class="no-data-container" :style="{top: top === 0 ? 0 : `${navBarHeight + topCOM}px`}">
+		<view class="no-data-box">
+			<slot v-if="custom"></slot>
+			<view v-else class="text-center">
+				<!-- <view class="flex jcc">
+					<image class="status-img" mode="widthFix" v-if="statusImgUrl" :src="statusImgUrl"></image>
+				</view> -->
+				<view class="no-data-tips">{{tipsTextCOM}}</view>
+				<u-button :customStyle="{fontSize: '32rpx'}" v-if="buttonTextCOM" type="primary" :text="buttonTextCOM" shape="circle"
+					@click="buttonHandle">
+				</u-button>
+				<view v-if="login" style="margin-top: 20rpx;">
+					<u-button :customStyle="{fontSize: '32rpx'}" text="暂不登录" shape="circle" @click="inBuyer">
+					</u-button>
+				</view>
+			</view>
+		</view>
+	</view>
 </template>
 
 <script>
-  import defaultConfig from '@/config/default.js'
-  export default {
-    props: {
-      statusType: { // 空状态类型
-        type: Number,
-        default: 1
-      },
-      custom: Boolean, // 是否自定义插槽
-      tipsText: String, // 文案
-    },
-    data() {
-      return {
-        statusImgUrl: '',
-      }
-    },
-    computed: {
-      // statusImgUrl() {
-      //   console.log(this.$store.state.emptyStatus.status);
-      //   let url = ''
-      //   const maps = this.$store.state.emptyStatus.status
-      //   const index = maps.findIndex(item => item.type === this.statusType)
-      //   url = index !== -1 ? defaultConfig.ossImgUrl + maps[index].url : ''
-      //   console.log(url);
-      //   return url
-      // },
-      tipsTextCOM() {
-        let text = ''
-        text = this.tipsText
-        if (this.statusType === 1) {
-          text = '暂无数据'
-        }
-        return text
-      }
-    },
-    methods: {}
-  }
+	import {
+		toPx
+	} from '@/utils/calculate.js'
+	// import defaultConfig from '@/config/default.js'
+	export default {
+		props: {
+			top: { // 顶部位置 设置0则置顶  不设置则根据顶部导航高度自适应
+				type: [Number, String],
+				default: ''
+			},
+			statusType: { // 空状态类型
+				type: Number,
+				default: 8
+			},
+			custom: Boolean, // 是否自定义插槽
+			tipsText: String, // 文案
+			buttonText: String,
+			login: Boolean // 是否是登录按钮
+		},
+		data() {
+			return {
+				navBarHeight: this.$getSS('navBarHeight')
+			}
+		},
+		computed: {
+			topCOM() {
+				return toPx(this.top)
+			},
+			// statusImgUrl() {
+			// 	let url = ''
+			// 	const maps = this.$store.state.emptyStatus.status
+			// 	const index = maps.findIndex(item => item.type === this.statusType)
+			// 	url = index !== -1 ? defaultConfig.ossImgUrl + maps[index].url : ''
+			// 	return url
+			// },
+			buttonTextCOM() {
+				let text = ''
+				if (this.login) {
+					text = '去登录'
+				} else {
+					text = this.buttonText
+				}
+				if (this.statusType === 8) {
+					text = ''
+				}
+				return text
+			},
+			tipsTextCOM() {
+				let text = ''
+				if (this.login) {
+					text = '您还未登录哦  点击下方按钮去登录或者去首页逛逛'
+				} else {
+					text = this.tipsText
+				}
+				if (this.statusType === 8) {
+					text = '暂无数据'
+				}
+				return text
+			}
+		},
+		methods: {
+			// 去首页
+			inBuyer() {
+				this.$setSS('__platformType', 1)
+				this.$Router.replace({
+					name: 'bus'
+				})
+			},
+			buttonHandle() {
+				this.$emit('buttonHandle')
+				if (this.login) {
+					this.$navigateTo({
+						name: 'login'
+					})
+				}
+			}
+		}
+	}
 </script>
 
 <style lang="scss" scoped>
-  .no-data-box {
-      width: 100%;
-      height: 100%;
-      z-index: 996;
-      margin-top: 160rpx;
-    }
-    .status-img {
-      width: 50%;
-      margin-bottom: 26rpx;
-    }
+	.no-data-container {
+		position: fixed;
+		left: 0;
+		width: 100%;
+		bottom: 0;
+		padding: 24rpx 18rpx 0;
+		// background-color: $bg-color-main;
+		z-index: 996;
 
-    .no-data-tips {
-      color: #707476;
-      font-size: 28rpx;
-      line-height: 40rpx;
-      // margin-bottom: 34rpx;
-      text-align: center;
-      padding: 0 50rpx;
-    }
-  
+		.status-img {
+			width: 50%;
+			margin-bottom: 60rpx;
+		}
+
+		.no-data-box {
+			border-radius: 24rpx 24rpx 0 0;
+			// background-color: #fff;
+			width: 100%;
+			height: 100%;
+			padding: 180rpx 34rpx;
+		}
+
+		.no-data-tips {
+			color: #707476;
+			font-size: 28rpx;
+			line-height: 40rpx;
+			margin-bottom: 34rpx;
+			text-align: center;
+			padding: 0 50rpx;
+		}
+	}
 </style>

+ 1 - 1
config/modules/test.js

@@ -1,5 +1,5 @@
 module.exports = {
 	env: 'test',
-	baseUrl: 'http://testseafood.mashangyl.com',
+	baseUrl: 'https://videotest.9jodia.net/weapi',
 	appid: 'wx32a0607fd20c6c16'
 }

+ 89 - 89
manifest.json

@@ -1,89 +1,89 @@
-{
-    "name" : "高投短视频分销系统",
-    "appid" : "__UNI__9C96AFB",
-    "description" : "",
-    "versionName" : "1.0.0",
-    "versionCode" : "100",
-    "transformPx" : false,
-    /* 5+App特有相关 */
-    "app-plus" : {
-        "usingComponents" : true,
-        "nvueStyleCompiler" : "uni-app",
-        "compilerVersion" : 3,
-        "splashscreen" : {
-            "alwaysShowBeforeRender" : true,
-            "waiting" : true,
-            "autoclose" : true,
-            "delay" : 0
-        },
-        /* 模块配置 */
-        "modules" : {},
-        /* 应用发布信息 */
-        "distribute" : {
-            /* android打包配置 */
-            "android" : {
-                "permissions" : [
-                    "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
-                    "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
-                    "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
-                    "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
-                    "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
-                    "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
-                    "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
-                    "<uses-permission android:name=\"android.permission.CAMERA\"/>",
-                    "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
-                    "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
-                    "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
-                    "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
-                    "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
-                    "<uses-feature android:name=\"android.hardware.camera\"/>",
-                    "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
-                ]
-            },
-            /* ios打包配置 */
-            "ios" : {},
-            /* SDK配置 */
-            "sdkConfigs" : {}
-        }
-    },
-    /* 快应用特有相关 */
-    "quickapp" : {},
-    /* 小程序特有相关 */
-    "mp-weixin" : {
-        "appid" : "",
-        "setting" : {
-            "urlCheck" : false
-        },
-        "usingComponents" : true
-    },
-    "mp-alipay" : {
-        "usingComponents" : true
-    },
-    "mp-baidu" : {
-        "usingComponents" : true
-    },
-    "mp-toutiao" : {
-        "usingComponents" : true
-    },
-    "uniStatistics" : {
-        "enable" : false
-    },
-    "vueVersion" : "2",
-    "h5" : {
-        "router" : {
-            "mode" : "hash",
-            "base" : "/h5/"
-        },
-        "sdkConfigs" : {
-            "weixin" : {
-                "appid" : "wx32a0607fd20c6c16",
-                "scope" : "snsapi_userinfo",
-                "callback" : "https://videotest.9jodia.net" // 必须与微信后台配置域名一致
-            }
-        },
-        "devServer" : {
-            "port" : 80
-        },
-        "template" : "template.h5.html"
-    }
-}
+{
+	"name": "高投短视频分销系统",
+	"appid": "__UNI__1F0A327",
+	"description": "",
+	"versionName": "1.0.0",
+	"versionCode": "100",
+	"transformPx": false,
+	/* 5+App特有相关 */
+	"app-plus": {
+		"usingComponents": true,
+		"nvueStyleCompiler": "uni-app",
+		"compilerVersion": 3,
+		"splashscreen": {
+			"alwaysShowBeforeRender": true,
+			"waiting": true,
+			"autoclose": true,
+			"delay": 0
+		},
+		/* 模块配置 */
+		"modules": {},
+		/* 应用发布信息 */
+		"distribute": {
+			/* android打包配置 */
+			"android": {
+				"permissions": [
+					"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
+					"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
+					"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
+					"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
+					"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
+					"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
+					"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
+					"<uses-permission android:name=\"android.permission.CAMERA\"/>",
+					"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
+					"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
+					"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+					"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
+					"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
+					"<uses-feature android:name=\"android.hardware.camera\"/>",
+					"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
+				]
+			},
+			/* ios打包配置 */
+			"ios": {},
+			/* SDK配置 */
+			"sdkConfigs": {}
+		}
+	},
+	/* 快应用特有相关 */
+	"quickapp": {},
+	/* 小程序特有相关 */
+	"mp-weixin": {
+		"appid": "",
+		"setting": {
+			"urlCheck": false
+		},
+		"usingComponents": true
+	},
+	"mp-alipay": {
+		"usingComponents": true
+	},
+	"mp-baidu": {
+		"usingComponents": true
+	},
+	"mp-toutiao": {
+		"usingComponents": true
+	},
+	"uniStatistics": {
+		"enable": false
+	},
+	"vueVersion": "2",
+	"h5": {
+		"router": {
+			"mode": "hash",
+			"base": "/h5/"
+		},
+		"sdkConfigs": {
+			"weixin": {
+				"appid": "wx32a0607fd20c6c16",
+				"scope": "snsapi_userinfo",
+				"callback": "https://videotest.9jodia.net" // 必须与微信后台配置域名一致
+			}
+		},
+		"devServer": {
+			"port": 80
+		},
+		"template": "template.h5.html"
+	}
+}

+ 15 - 14
pages/index/index.vue

@@ -178,7 +178,8 @@
 				setData: {},
 				isList: false,
 				configs: [],
-				caseVisible: false
+				caseVisible: false,
+				videoList:[]
 			}
 		},
 		onLoad() {
@@ -190,12 +191,12 @@
 			this.changeTabbar()
 		},
 		methods: {
-			showCase(item) {
+			showCase(item) {
 				this.videoList=item.videoUrls
 				this.caseVisible = true
 			},
 			// 跳转到购买详情页
-			toBuy() {
+			toBuy() {
 				
 				uni.navigateTo({
 					url: '/pages/order/order_confirm?id=' + this.setData.packageId + '&strip=' + this.setData
@@ -205,16 +206,16 @@
 			showMoreCase() {
 				this.isList = !this.isList
 				if (this.isList) {
-					uni.createSelectorQuery().select('#caseMore').boundingClientRect(data => {
-						if (data) {
-							uni.pageScrollTo({
-								scrollTop: data.top + uni.getSystemInfoSync().scrollTop + 100,
-								duration: 300
-							});
-						}
-					}).exec(result=>{
-						console.log('滚动',result);
-					});
+					uni.createSelectorQuery().select('#caseMore').boundingClientRect(data => {
+						if (data) {
+							uni.pageScrollTo({
+								scrollTop: data.top + uni.getSystemInfoSync().scrollTop + 100,
+								duration: 300
+							});
+						}
+					}).exec(result=>{
+						console.log('滚动',result);
+					});
 					
 				}
 			},
@@ -633,7 +634,7 @@
 	}
 
 	.video-list {
-		margin: 0rpx auto;
+		margin: 0rpx auto;
 		height: 800rpx;
 		width: 600rpx;
 		background-color: #000;

+ 47 - 25
pages/order/index.vue

@@ -2,7 +2,7 @@
 <template>
   <view class="order">
     <view class="tabs">
-      <u-tabs :list="tabLists" lineWidth="40" lineHeight="8" :lineColor="`url(${lineBg}) 100% 100%`" :activeStyle="{
+      <u-tabs :list="tabLists" lineWidth="40" :current="current" lineHeight="8" :lineColor="`url(${lineBg}) 100% 100%`" :activeStyle="{
                 color: '#0D121A',
                 fontSize: '32rpx',
                 fontWeight: 'bold',
@@ -15,7 +15,7 @@
       </u-tabs>
     </view>
     <view class="content">
-      <mescroll-body height="100%" class="custom-height" ref="mescrollRef" @down="downCallback"
+      <mescroll-body :height="`calc(100% - 24rpx)`" class="custom-height" ref="mescrollRef" @down="downCallback"
                      :up="upOption" @up="upCallback">
         <view class="order-list" v-if="arrList && arrList.length">
           <view class="tab-content" v-for="(item, index) in arrList" :key="index" @click="goOrderDetail(item)">
@@ -96,7 +96,7 @@
             </view>
           </view>
         </view>
-        <no-data :statusType="2" tipsText="暂无记录" v-if="!isInit && !arrList.length"></no-data>
+        <no-data  :top="230" :statusType="1" @buttonHandle="buttonHandle" tipsText="暂无记录" v-if="!isInit && !arrList.length"></no-data>
       </mescroll-body>
     </view>
 
@@ -123,13 +123,13 @@ export default {
   },
   data() {
     return {
-
+      current: 0,
       page: 1,
       limit: 10,
       lineBg: 'https://ovp-shop.oss-cn-hangzhou.aliyuncs.com/static/9dshop/ic_line.png',
       timeImg: 'https://ovp-shop.oss-cn-hangzhou.aliyuncs.com/static/9dshop/ic_time.png',
       arrList: [],
-      isInit: false,
+      isInit: true,
       downOption: {
         auto: false //是否在初始化完毕之后自动执行下拉回调callback; 默认true
       },
@@ -139,12 +139,12 @@ export default {
           size: 10 // 每页数据的数量,默认10
         },
         noMoreSize: 5, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
-        empty: {
-          tip: '暂无相关数据'
-        }
+        textNoMore: '- 没有更多了 -'
       },
       paymentStatus: 'WAIT_PAYMENT',
-      tabLists: [{name: '待付款', value: 'WAIT_PAYMENT'},
+      tabLists: [
+        {name: '全部', value: ''},
+        {name: '待付款', value: 'WAIT_PAYMENT'},
         {name: '待接单', value: 'WAIT_ORDER'},
         // {name: '待寄样', value: 'WAIT_SEND'},
         {name: '拍摄中', value: 'SHOOTING'},
@@ -158,8 +158,10 @@ export default {
   },
   computed: {},
   watch: {},
-  onLoad() {
-    this.getOrderListPage()
+  onLoad(options) {
+    if(options.status) this.paymentStatus = options.status 
+    if(options.current) this.current = options.current
+    // this.getOrderListPage()
   },
   methods: {
     goOrderDetail(item){
@@ -219,25 +221,43 @@ export default {
     },
     tabsChange(item) {
       this.paymentStatus = item.value
-      this.page = 1
-      setTimeout(() => {
-        this.getOrderListPage()
-      }, 200)
+      this.mescroll.resetUpScroll()
+      this.mescroll.scrollTo(0, 300)
+    },
+    // upCallback(){
+    //     console.log('123456');
+    // },
+
+    buttonHandle() {
+        this.mescroll.resetUpScroll()
+        this.mescroll.scrollTo(0, 300)
     },
-    getOrderListPage() {
+    upCallback(page) {
       getOrderListPage({
         paymentStatus: this.paymentStatus,
-        page: 1,
-        limit: 50,
+        page: page.num,
+        limit: page.size,
       }).then(res => {
-        this.arrList = res.list
+        // this.arrList = res.list
+        if(res){
+            if (page.num == 1) { //如果是第一页需手动制空列表
+                this.arrList = res.list
+            } else {
+                this.arrList = this.arrList.concat(res.list) //追加新数据
+            }
+            this.mescroll.endSuccess(res.list.length, res.total > this.arrList.length) // 参考https://www.mescroll.com/uni.html#mescrolluni
+
+        }else{
+            this.mescroll.endErr()
+        }
+        this.isInit = false
       })
     },
-    downCallback() {
-      this.page=1
-      this.getOrderListPage()
-      this.mescroll.endSuccess(); // 结束下拉刷新状态
-    },
+    // downCallback() {
+    //   this.page = 1
+    // //   this.upCallback()
+    //   this.mescroll.endSuccess(); // 结束下拉刷新状态
+    // },
 
     cancelOrder(orderId) {
       const that = this
@@ -354,10 +374,12 @@ export default {
   .content {
     flex: 1;
     overflow: hidden;
+    padding: 24rpx;
+
   }
 
   .order-list {
-    padding: 24rpx;
+    // padding: 24rpx;
 
 
     .tab-content {

+ 3 - 2
pages/order/order_confirm.vue

@@ -427,7 +427,8 @@
 										})
 									} else if (res.err_msg === 'get_brand_wcpay_request:cancel') {
 										uni.showToast({
-											title: '用户取消了支付'
+											title: '用户取消了支付',
+                                            icon: 'none'
 										})
 									} else {
 										console.error('支付失败', res.err_msg);
@@ -441,7 +442,7 @@
 						submitOrder() {
 							if (!this.checkForm()) {
 								return; // 如果校验失败,停止提交
-							}
+							}
 							
 							if (!this.checkContents()) {
 								return; // 如果校验失败,停止提交

+ 13 - 9
pages/user/index.vue

@@ -22,7 +22,7 @@
         <view class="order">
           <view class="order_top">
             <text class="mytt">我的订单</text>
-            <view class="myall" @click="toOrder">
+            <view class="myall" @click="toOrder(orderList[0])">
               <text class="all">全部</text>
               <image class="more" :src="moreImg"></image>
             </view>
@@ -72,24 +72,28 @@ export default {
       avatar: '',
       orderList: [
         {
-          value: 1,
+          value: '',
           label: '全部',
-          icon: "https://ovp-shop.oss-cn-hangzhou.aliyuncs.com/static/9dshop/ic_daifukuan%403x.png"
+          index: 0,
+          icon: "https://ovp-shop.oss-cn-hangzhou.aliyuncs.com/static/9dshop/ic_diankaguanli%403x.png"
         },
         {
-          value: 2,
+          value: 'WAIT_PAYMENT',
           label: '待付款',
+          index: 1,
           icon: "https://ovp-shop.oss-cn-hangzhou.aliyuncs.com/static/9dshop/ic_daifukuan%403x.png"
         },
         {
-          value: 3,
+          value: 'SHOOTING',
           label: '拍摄中',
+          index: 3,
           icon: "https://ovp-shop.oss-cn-hangzhou.aliyuncs.com/static/9dshop/ic_daifukuan%403x.png"
         },
         {
-          value: 4,
-          label: '已完成',
-          icon: "https://ovp-shop.oss-cn-hangzhou.aliyuncs.com/static/9dshop/ic_diankaguanli%403x.png"
+          value: 'DELIVERED',
+          label: '已交付',
+          index: 5,
+          icon: "https://ovp-shop.oss-cn-hangzhou.aliyuncs.com/static/9dshop/ic_daifukuan%403x.png"
         }
       ]
     };
@@ -112,7 +116,7 @@ export default {
     },
     toOrder(item) {
       this.$router.push({
-        path: '/pages/order/index'
+        path: '/pages/order/index?status='+item.value+'&current='+item.index
       })
     },
     outLogin() {

+ 4 - 2
plugins/mescroll/components/mescroll-uni/mescroll-uni.vue

@@ -25,7 +25,7 @@
 					<slot></slot>
 
 					<!-- 空布局 -->
-					<mescroll-empty v-if="isShowEmpty" :option="mescroll.optUp.empty" @emptyclick="emptyClick"></mescroll-empty>
+					<!-- <mescroll-empty v-if="isShowEmpty" :option="mescroll.optUp.empty" @emptyclick="emptyClick"></mescroll-empty> -->
 
 					<!-- 上拉加载区域 (下拉刷新时不显示, 支付宝小程序子组件传参给子子组件仍报单项数据流的异常,暂时不通过mescroll-up组件实现)-->
 					<!-- <mescroll-up v-if="mescroll.optUp.use && !isDownLoading && upLoadType!==3" :option="mescroll.optUp" :type="upLoadType"></mescroll-up> -->
@@ -84,6 +84,7 @@
 	import mescrollI18n from './mescroll-i18n.js';
 	// 引入回到顶部组件
 	import MescrollTop from './components/mescroll-top.vue';
+	// import mescrollEmpty from '../mescroll-empty/mescroll-empty.vue';
 	// 引入兼容wxs(含renderjs)写法的mixins
 	import WxsMixin from './wxs/mixins.js';
 	
@@ -112,7 +113,8 @@
 		name: 'mescroll-uni',
 		mixins: [WxsMixin],
 		components: {
-			MescrollTop
+			MescrollTop,
+			// mescrollEmpty
 		},
 		props: {
 			down: Object,