完善商品搜索，商品分页，调整聊聊栏目提示开发提示，新增检查版本更新

2022-01-14 10:19:17 +08:00
parent e46e35cfbd
commit 1c4393bb6a
9 changed files with 419 additions and 162 deletions
--- a/App.vue
+++ b/App.vue
@@ -1,8 +1,63 @@
 <script>
+	import { getVersions } from './apis/interfaces/versions'
 	import im from '@/public/im'
 	export default {
 		onLaunch: function() {
-			// im.imInit()
+			//#ifdef APP-PLUS
+				// 获取系统版本号
+				getVersions({
+					platform: plus.os.name,
+					version	: plus.runtime.versionCode
+				}).then(res => {
+					if(res.update){
+						uni.showModal({
+							title: "更新提示",  
+							content: res.note || '版本更新信息',
+							confirmText: "更新",
+							success: modalRes => {
+								if (modalRes.confirm) {  
+									if (plus.os.name == "Android") {
+										uni.showToast({
+											title: '新版本下载中，将在下载完成后自动为您安装更新包',
+											icon : 'none'
+										})
+										uni.downloadFile({
+											url		: res.info.download,
+											success	: apkPick=> {
+												plus.runtime.install(apkPick.tempFilePath, '', installRES => {
+													// 安装完成用于提示新版本引导，暂时无用
+												}, installERR => {
+													// 安装失败
+												})
+											},
+											fail(err){
+												uni.showToast({
+													title: '安装包下载失败，请检查您的网络或稍后重试',
+													icon : 'none'
+												})
+											}
+										})
+									 //    plus.runtime.openURL(res.info.download, err => {
+										// 	console.log(err)
+										// }, 'com.android.browser');
+									} else{
+										uni.showToast({
+											title: 'IOS应用暂未上架，请打开测试(TestFlight)工具点击更新',
+											icon : 'none'
+										})
+									}
+								}
+							}
+						})
+					}
+				}).catch(err => {
+					console.log(err)
+					uni.showToast({
+						title: err.message,
+						icon : 'none'
+					})
+				})
+			//#endif
 		}
 	}
 </script>
--- a/apis/interfaces/store.js
+++ b/apis/interfaces/store.js
@@ -33,7 +33,6 @@ const meals = (id, categoryId) => {

 // 商品列表
 const lists = data => {
-	console.log(data)
 	return request({
 		url: 'mall/goods',
 		data
--- a/pages.json
+++ b/pages.json
@@ -131,7 +131,20 @@
 		"style": {
 			"navigationBarTitleText": "商品",
 			"navigationBarBackgroundColor": "#FFFFFF",
-			"enablePullDownRefresh": true
+			"enablePullDownRefresh": true,
+			"app-plus": {
+				"titleNView": {
+					"backgroundColor": "#FFFFFF",
+					"titleSize": "16",
+					"buttons": [{
+						"float": "right",
+						"text": "\ue603",
+						"fontSrc": "/static/iconfont.ttf",
+						"color": "#000",
+						"fontSize": "20px"
+					}]
+				}
+			}
 		}
 	}, {
 		"path": "pages/store/meals",
@@ -237,75 +250,75 @@
 			"navigationBarBackgroundColor": "#FFFFFF",
 			"enablePullDownRefresh": true
 		}
-	},{
-        "path": "pages/im/index",
-        "name": "IM",
-        "style": {
-        	"navigationBarTitleText": "聊聊",
-        	"navigationBarBackgroundColor": "#FFFFFF",
-        	"app-plus": {
-        		"titleNView": {
-        			"buttons": [{
-        				"float": "right",
-        				"text": "\ue605",
-        				"fontSrc": "/static/iconfont.ttf",
-        				"color": "#000",
-        				"fontSize": "20px"
-        			}, {
-        				"float": "left",
-        				"text": "\ue606",
-        				"fontSrc": "/static/iconfont.ttf",
-        				"color": "#000",
-        				"fontSize": "20px"
-        			}]
-        		}
-        	}
-        }
-    },{
+	}, {
+		"path": "pages/im/index",
+		"name": "IM",
+		"style": {
+			"navigationBarTitleText": "聊聊",
+			"navigationBarBackgroundColor": "#FFFFFF",
+			"app-plus": {
+				"titleNView": {
+					"buttons": [{
+						"float": "right",
+						"text": "\ue605",
+						"fontSrc": "/static/iconfont.ttf",
+						"color": "#000",
+						"fontSize": "20px"
+					}, {
+						"float": "left",
+						"text": "\ue606",
+						"fontSrc": "/static/iconfont.ttf",
+						"color": "#000",
+						"fontSize": "20px"
+					}]
+				}
+			}
+		}
+	}, {
 		"path": "pages/im/chum",
 		"name": "ImChum",
 		"style": {
 			"navigationBarTitleText": "好友",
 			"enablePullDownRefresh": false
 		}
-	},{
+	}, {
 		"path": "pages/wallet/add",
 		"name": "WalletAdd",
 		"style": {
 			"navigationBarTitleText": "创建钱包",
-			"navigationBarBackgroundColor":"#FFFFFF",
+			"navigationBarBackgroundColor": "#FFFFFF",
 			"enablePullDownRefresh": false
 		}
-	},{
+	}, {
 		"path": "pages/wallet/create",
 		"name": "WalletCreate",
 		"style": {
 			"navigationBarTitleText": "设置密码",
-			"navigationBarBackgroundColor":"#FFFFFF",
+			"navigationBarBackgroundColor": "#FFFFFF",
 			"enablePullDownRefresh": false
 		}
-	},{
+	}, {
 		"path": "pages/wallet/mnemonic",
 		"name": "WalletMnemonic",
 		"style": {
 			"navigationBarTitleText": "导出助记词",
-			"navigationBarBackgroundColor":"#FFFFFF",
+			"navigationBarBackgroundColor": "#FFFFFF",
 			"enablePullDownRefresh": false
 		}
-	},{
+	}, {
 		"path": "pages/wallet/validation",
 		"name": "WalletValidation",
 		"style": {
 			"navigationBarTitleText": "验证助记词",
-			"navigationBarBackgroundColor":"#FFFFFF",
+			"navigationBarBackgroundColor": "#FFFFFF",
 			"enablePullDownRefresh": false
 		}
-	},{
+	}, {
 		"path": "pages/wallet/property",
 		"name": "WalletProperty",
 		"style": {
 			"navigationBarTitleText": "ZH钱包",
-			"navigationBarTextStyle":"white",
+			"navigationBarTextStyle": "white",
 			"app-plus": {
 				"titleNView": {
 					"backgroundImage": "linear-gradient(to right, #34ce98, #22aa98)",
@@ -318,50 +331,57 @@
 						"fontSize": "20px",
 						"background": "rgba(0,0,0,0)"
 					}],
-					"backButton":{
+					"backButton": {
 						"background": "rgba(0,0,0,0)"
 					}
 				}
 			}
 		}
-	},{
+	}, {
 		"path": "pages/service/index",
 		"name": "serviceIndex",
 		"style": {
 			"navigationBarTitleText": "",
-            "navigationStyle": "custom",
+			"navigationStyle": "custom",
 			"enablePullDownRefresh": false
 		}
-	},{
+	}, {
 		"path": "pages/service/index",
 		"name": "serviceIndex",
 		"style": {
 			"navigationBarTitleText": "",
-            "navigationStyle": "custom",
+			"navigationStyle": "custom",
 			"enablePullDownRefresh": false
 		}
-	},{
+	}, {
 		"path": "pages/service/details",
 		"name": "serviceDetails",
 		"style": {
 			"navigationBarTitleText": ""
-        }
-	},{
+		}
+	}, {
 		"path": "pages/wallet/privatekey",
 		"name": "WalletPrivatekey",
 		"style": {
 			"navigationBarTitleText": "钱包私钥",
-			"navigationBarBackgroundColor":"#FFFFFF",
+			"navigationBarBackgroundColor": "#FFFFFF",
 			"enablePullDownRefresh": false
 		}
-	},{
+	}, {
 		"path": "pages/wallet/resetPassword",
 		"name": "ResetPassword",
 		"style": {
 			"navigationBarTitleText": "修改钱包密码",
-			"navigationBarBackgroundColor":"#FFFFFF",
+			"navigationBarBackgroundColor": "#FFFFFF",
 			"enablePullDownRefresh": false
 		}
+	}, {
+		"path": "pages/store/search",
+		"name": "StoreSearch",
+		"style": {
+			"navigationBarTitleText": "搜索",
+			"navigationBarBackgroundColor": "#FFFFFF"
+		}
 	}],
 	"tabBar": {
 		"borderStyle": "white",
--- a/pages/im/index.vue
+++ b/pages/im/index.vue
@@ -1,6 +1,6 @@
 <template>
 	<view class="content">
-		<block v-if="messageArr.length >= 1">
+		<block v-if="messageArr.length < 1">
 			<view class="vertical null-list">
 				<u-empty
 					icon="http://cdn.uviewui.com/uview/empty/message.png"
@@ -17,22 +17,30 @@
 			<!-- <button type="default">连接</button> -->
 			<!-- <button type="default">发送</button> -->
 			
-			<view v-for="item in 2" :key="item" class="mssage-box">
-				<view class="mssage-action" @click="$Router.push({name: 'ImChat'})">
-					<u-avatar
-						clsss="mssage-action-cover"
-						src="https://cdn.uviewui.com/uview/album/1.jpg"
-						size="44"
-						text="唐"
-						font-size="14"
-						randomBgColor
-					></u-avatar>
+			<view v-for="(item, index) in messageArr" :key="index" class="mssage-box">
+				<view class="mssage-action" @click="openChum">
+					<block v-if="item.cover === ''">
+						<u-avatar
+							clsss="mssage-action-cover"
+							size="44"
+							:text="item.text"
+							font-size="14"
+							randomBgColor
+						></u-avatar>
+					</block>
+					<block v-else>
+						<u-avatar
+							clsss="mssage-action-cover"
+							:src="item.cover"
+							size="44"
+						></u-avatar>
+					</block>
 					<view class="mssage-action-content">
 						<view class="mssage-header">
-							<view class="header-name">唐明明</view>
-							<view class="header-time">2021/12/31</view>
+							<view class="header-name">{{item.name}}</view>
+							<view class="header-time">{{item.time}}</view>
 						</view>
-						<view class="mssage-msg">消息</view>
+						<view class="mssage-msg">{{item.message}}</view>
 					</view>
 				</view>
 			</view>
@@ -45,7 +53,33 @@
 	export default {
 		data() {
 			return {
-				messageArr	 : [],
+				messageArr	 : [
+					{
+						cover: 'https://cdn.uviewui.com/uview/album/1.jpg',
+						name: '班班五月',
+						message: '咱们进直播间了吗？上课啦~今天教大家【拆解项目背后的逻辑】',
+						time: '昨天'
+					},
+					{
+						cover: 'https://cdn.uviewui.com/uview/album/4.jpg',
+						name: '周磊',
+						message: '[语音]',
+						time: '周一'
+					},
+					{
+						cover: '',
+						text: 'S',
+						name: 'SKY',
+						message: '谢谢',
+						time: '2022/1/5'
+					},
+					{
+						cover: 'https://cdn.uviewui.com/uview/album/5.jpg',
+						name: '俊少',
+						message: '[语音]',
+						time: '2022/1/4'
+					},
+				],
 				optionsAction: [
 					{
 						text: '删除',
@@ -58,17 +92,26 @@
 		},
 		methods:{
 			openChum(){
-				this.$Router.push({name: 'ImChum'})
-				console.log("好友列表")
+				uni.showToast({
+					title: '聊聊系统正在开发中，敬请期待',
+					icon : 'none'
+				})
 			}
 		},
 		onNavigationBarButtonTap(e) {
+			
 			switch (e.index){
 				case 1:
-					this.openChum()
+					uni.showToast({
+						title: '聊聊好友系统正在开发中，敬请期待',
+						icon : 'none'
+					})
 					break;
 				case 0:
-					console.log("扫码添加好友")
+					uni.showToast({
+						title: '聊聊扫一扫系统正在开发中，敬请期待',
+						icon : 'none'
+					})
 					break;
 			}
 		}
--- a/pages/index/search.vue
+++ b/pages/index/search.vue
@@ -1,26 +1,28 @@
 <template>
-    <view class="content">
+    <view>
        <!-- 搜索 -->
-        <view class="search">
-        	<view class="search-nav">
-                <u-search
-                    v-model="keyword"
-                    placeholder="请输入食物名称"
-                    focus
-                    :clearabled="true"
-                    :showAction="false"
-                    @change="change"
-                    @search="search"
-                    @clear="clear"
-                    color="#000000"
-                    bgColor="#F3F6FB"
-                    searchIconColor="#34CE98"
-                />
-        	</view>
-            <view class="search-cancel" @click="$router.back(-1)">
-                取消
-            </view>
-        </view>
+		<u-sticky>
+			<view class="header ios-top">
+				<view class="search">
+					<view class="search-nav">
+						<u-search
+							v-model="keyword"
+							placeholder="请输入食物名称"
+							focus
+							:clearabled="true"
+							:showAction="false"
+							@change="change"
+							@search="search"
+							@clear="clear"
+							color="#000000"
+							bgColor="#F3F6FB"
+							searchIconColor="#34CE98"
+						/>
+					</view>
+					<view class="search-cancel" @click="$Router.back()">取消</view>
+				</view>
+			</view>
+		</u-sticky>
        
        <view class="recommend" v-if="listArr == ''">
            <view class="recommend-title">
@@ -123,44 +125,34 @@
 </script>

 <style lang="scss" scoped>
-    .content {
-    	padding-top: calc(var(--status-bar-height) + 120rpx);
-    	overflow: hidden;
-    }
-    
    // 搜索
-    .search {
-        position: fixed;
-        top: 0;
-        left: 0;
-        right: 0;
-        z-index: 99;
-        height: 120rpx;
-        background-color: white;
-        @extend .ios-top;
-    	padding: $padding;
-        box-sizing: border-box;
-    	.search-nav {
-            width: calc(100% - 100rpx);
-    		background: $window-color;
-    		height: 80rpx;
-    		line-height: 80rpx;
-    		border-radius: 40rpx;
-    		color: $text-gray;
-    		font-size: $title-size-lg;
-            display: flex;
-    	}
-        .search-cancel {
-            color: $main-color;
-            position: absolute;
-            right: $padding;
-            top: $padding;
-            line-height: 80rpx;
-            width: 100rpx;
-            text-align: right;
-        }
-    }
-    
+	.header{
+		background-color: white;
+		.search {
+			position: relative;
+			padding: $padding/2 $padding;
+		    box-sizing: border-box;
+			.search-nav {
+		        width: calc(100% - 100rpx);
+				background: $window-color;
+				height: 80rpx;
+				line-height: 80rpx;
+				border-radius: 40rpx;
+				color: $text-gray;
+				font-size: $title-size-lg;
+		        display: flex;
+			}
+		    .search-cancel {
+		        color: $main-color;
+		        position: absolute;
+		        right: $padding;
+		        top: $padding/2;
+		        line-height: 80rpx;
+		        width: 100rpx;
+		        text-align: right;
+		    }
+		}
+	}
    .recommend {
        padding: $padding;
        box-sizing: border-box;
--- a/pages/order/index.vue
+++ b/pages/order/index.vue
@@ -5,6 +5,7 @@
 			<u-tabs
 				class="tabs"
 				:list="tabs"
+				:current="index"
 				lineColor="#34CE98" 
 				@click="onTabs"
 				sticky
@@ -63,6 +64,7 @@
 			}
 		},
 		mounted() {
+			this.index = this.$Route.query.index
 			this.getOrder()
 		},
 		methods:{
--- a/pages/store/index.vue
+++ b/pages/store/index.vue
@@ -89,6 +89,9 @@
 		},
 		onPullDownRefresh() {
 			this.getMall()
+		},
+		onNavigationBarButtonTap() {
+			this.$Router.push({name: 'StoreSearch'})
 		}
 	}
 </script>
--- a/pages/store/list.vue
+++ b/pages/store/list.vue
@@ -11,6 +11,10 @@
 				color="#e6576b"
 				@onGoods="$Router.push({ name: 'StoreGoods', params: {id: $event.goods_id}})"
 			/>
+			<!-- 加载更多 -->
+			<view class="pages-load">
+				<u-loadmore :status="status" />
+			</view>
 		</block>
 		<block v-else>
 			<view class="vertical pages-empty">
@@ -34,7 +38,8 @@
 				classify: [
 					{ name: "全部", category_id: "" }
 				],
-				cid		: ""
+				cid		: "",
+				page	: 1
 			};
 		},
 		mounted(){
@@ -46,12 +51,17 @@
 		},
 		methods:{
 			// 商品列表
-			getLists(cid) {
+			getLists() {
 				lists({
 					category_id	: this.$Route.query.id,
-					category_cid: this.cid
+					category_cid: this.cid,
+					page		: this.page
 				}).then(res => {
-					this.goodsArr = res.data
+					if(res.page.current === 1){
+						this.goodsArr = []
+					}
+					this.goodsArr = this.goodsArr.concat(res.data)
+					this.status = res.page.has_more ? 'loadmore' : 'nomore'
 					uni.stopPullDownRefresh()
 				})
 			},
@@ -66,10 +76,22 @@
 				this.goodsArr = []
 				this.cid	  = e.category_id
 				this.getLists()
-			}
+			},
+			
 		},
 		onPullDownRefresh() {
+			this.page = 1
 			this.getLists()
+		},
+		onReachBottom() {
+			if(this.status === 'loadmore'){
+				this.page += 1
+				this.status = 'loading'
+				this.getLists()
+			}
+		},
+		onNavigationBarButtonTap() {
+			this.$Router.push({name: 'StoreSearch'})
 		}
 	}
 </script>
@@ -83,4 +105,9 @@
 	.pages-empty{
 		height: 70vh;
 	}
+	
+	// 加载分页
+	.pages-load{
+		padding-bottom: $padding;
+	}
 </style>
--- a/pages/store/search.vue
+++ b/pages/store/search.vue
@@ -0,0 +1,116 @@
+<template>
+	<view class="content">
+		<!-- 搜索 -->
+		<view class="header">
+			<input type="text" v-model="searchVlaue" focus placeholder="输入产品关键搜索" />
+			<view class="btn" @click="getLists()">搜索</view>
+		</view>
+		<!-- 搜索列表 -->
+		<block v-if="goodsArr.length >= 1">
+			<oct-goods
+				:lists="goodsArr"
+				color="#e6576b"
+				@onGoods="$Router.push({ name: 'StoreGoods', params: {id: $event.goods_id}})"
+			/>
+			<!-- 加载更多 -->
+			<view class="pages-load">
+				<u-loadmore :status="status" />
+			</view>
+		</block>
+		<block v-else>
+			<view class="vertical pages-empty">
+				<u-empty
+					icon="http://cdn.uviewui.com/uview/empty/search.png"
+					textColor="#999"
+					text="暂无搜索结果"
+				></u-empty>
+			</view>
+		</block>
+	</view>
+</template>
+
+<script>
+	import { lists } from "@/apis/interfaces/store"
+	export default {
+		data() {
+			return {
+				searchVlaue : '',
+				goodsArr	: [],
+				status		: "loading",
+				page 		: 1
+			};
+		},
+		methods:{
+			getLists() {
+				lists({
+					name: this.searchVlaue,
+					page: this.page
+				}).then(res => {
+					console.log(res.page)
+					
+					if(res.page.current === 1){
+						this.goodsArr = []
+					}
+					this.goodsArr = this.goodsArr.concat(res.data)
+					this.status = res.page.has_more ? 'loadmore' : 'nomore'
+				})
+			}
+		},
+		onReachBottom() {
+			if(this.status === 'loadmore'){
+				this.page += 1
+				this.status = 'loading'
+				this.getLists()
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content{
+		min-height: 100vh;
+		padding-top: 110rpx;
+		background: $window-color;
+		box-sizing: border-box;
+	}
+	// 搜索
+	.header{
+		position: fixed;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 120rpx;
+		padding: 20rpx ($padding + 150) 20rpx $padding;
+		box-sizing: border-box;
+		background: white;
+		input{
+			background: $window-color;
+			height: 70rpx;
+			line-height: 70rpx;
+			padding: 0 $padding;
+			border-radius: 35rpx;
+			font-size: $title-size-lg;
+		}
+		.btn{
+			position: absolute;
+			top: 20rpx;
+			right: $padding;
+			width: 130rpx;
+			background: $window-color;
+			line-height: 70rpx;
+			text-align: center;
+			font-size: $title-size-lg;
+			color: $main-color;
+			font-weight: bold;
+			border-radius: 35rpx;
+		}
+	}
+	// 结果空
+	.pages-empty{
+		height: 80vh;
+	}
+	// 加载分页
+	.pages-load{
+		padding-bottom: $padding;
+	}
+</style>