lilei 9 ヶ月 前
コミット
f19dcc3e3d

+ 32 - 16
components/icon-items-list/icon-items-list.vue

@@ -1,11 +1,12 @@
 <template>
 	<div class="icon-items-list" :class="'icon-items-list-'+type">
-		<div class="icon-items-icons" v-for="(item,index) in list" :key="item.id" :style="{width:itemWidth}" @click="toPage(item,index)">
+		<div class="icon-items-icons" :style="{width:itemWidth}" v-for="(item,index) in list" :key="item.id" @click="toPage(item,index)">
 			<div class="icon-items-imgse" >
-				<image class="imgs" :class="item.auth?'':'uni-img-gray'" :fade-show='true' :src="item.icon"></image>
+				<image class="imgs" v-if="type=='img'" :class="item.auth?'':'uni-img-gray'" :fade-show='true' :src="item.icon||'/static/def_imgs.png'"></image>
+				<u-icon class="icons" v-if="type=='icon'" :color="item.color" :size="60" :name="item.icon" custom-prefix="custom-icon"></u-icon>
 				<u-badge class="tag" :absolute="false" type="error"  v-if="item.nums" :count="item.nums"></u-badge>
 			</div>
-			<div class="icon-items-text">{{item.name.slice(0,14)}}</div>
+			<div class="icon-items-text">{{item.name}}</div>
 		</div>
 		<div class="nodata" v-if="list.length==0">
 			<u-empty :text="noDataText" mode="list"></u-empty>
@@ -44,13 +45,7 @@
 		},
 		methods: {
 			toPage(item,index){
-				if(!item.auth){
-					// uni.showToast({icon: 'none',title: '您还未登录'})
-					uni.navigateTo({
-						url: '/pages/login/login'
-					})
-					return
-				}
+				console.log(item,index)
 				if(item.url&&item.url!=''){
 					if(item.target == 'page'){
 						uni.navigateTo({
@@ -63,7 +58,7 @@
 						})
 					}
 					if(item.target == 'fun'){
-						this.$emit('callback',item.url)
+						this.$emit('callback',item)
 					}
 				}
 			}
@@ -73,7 +68,7 @@
 
 <style lang="less">
 	.icon-items-list{
-		align-items: center;
+		align-items: flex-start;
 		display: flex;
 		flex-wrap: wrap;
 		.nodata{
@@ -83,15 +78,21 @@
 			color: #999999;
 		}
 	}
-	.icon-items-list-icon{
+	.icon-items-list-img{
+		.icon-items-icons{
+			margin: 0;
+		}
 		.icon-items-imgse{
 			position: relative;
 			width: 100upx;
 			height: 100upx;
 			margin-bottom: 6upx;
+			display:flex;
+			align-items: center;
+			justify-content: center;
 			.imgs{
-				width: 100upx;
-				height: 100upx;
+				width: 90upx;
+				height: 90upx;
 			}
 			.tag{
 				position: absolute;
@@ -99,8 +100,23 @@
 				right: -5upx;
 			}
 		}
+	}
+	.icon-items-list-icon{
+		.icon-items-imgse{
+			position: relative;
+			width: 100upx;
+			margin-bottom: 6upx;
+			display:flex;
+			align-items: center;
+			justify-content: center;
+			.tag{
+				position: absolute;
+				top: -5upx;
+				right: -5upx;
+			}
+		}
 		.icon-items-text{
-			font-size: 28upx;
+			font-size: 24upx;
 			color: #666666;
 		}
 	}

+ 4 - 2
components/scrollBox.vue

@@ -35,7 +35,9 @@ export default {
 		};
 	},
 	mounted() {
-		this.prizeScroll();
+		if(this.list.length){
+			this.prizeScroll();
+		}
 	},
 	methods: {
 		getHeight(Class) {
@@ -43,7 +45,7 @@ export default {
 			query
 				.selectAll(Class)
 				.boundingClientRect(data => {
-					this.height = data[0].height;
+					this.height = data[0] ? data[0].height : 0;
 				})
 				.exec();
 		},

+ 57 - 21
pages.json

@@ -22,21 +22,6 @@
 				"navigationBarTitleText": "手机号登录"
 			}
 		},
-		{
-		    "path" : "pages/videos/index",
-		    "style" :                                                                                    
-		{
-		    "navigationBarTitleText": "视频内容",
-		    "enablePullDownRefresh": false
-		}
-		},{
-		    "path" : "pages/videos/detail",
-		    "style" :                                                                                    
-		{
-		    "navigationBarTitleText": "视频内容",
-		    "enablePullDownRefresh": false
-		}
-		},
 		{
 			"path": "pages/personData/personData",
 			"style": {
@@ -71,13 +56,19 @@
             "path" : "pages/morePage/morePage",
             "style" :                                                                                    
             {
-                "navigationBarTitleText": "更多功能",
-                "enablePullDownRefresh": false,
-				"navigationBarBackgroundColor": "#86defa"
+                "navigationBarTitleText": "",
+                "navigationStyle":"custom"
             }
             
-        }
-        ,{
+        },
+		{
+		    "path" : "pages/videos/index",
+		    "style" :                                                                                    
+			{
+				"navigationBarTitleText": "视频教程",
+				"enablePullDownRefresh": false
+			}
+		},{
             "path" : "pages/storeManage/personnel",
             "style" :                                                                                    
             {
@@ -152,6 +143,13 @@
         	{
         		"navigationBarTitleText" : "促销活动"
         	}
+        },
+        {
+        	"path" : "pages/cart/index",
+        	"style" : 
+        	{
+        		"navigationBarTitleText" : "购物车"
+        	}
         }
     ],
 	"subPackages":[
@@ -417,8 +415,22 @@
                 "navigationBarTitleText": "红包奖励",
                 "enablePullDownRefresh": false
             }
-            
         },
+		{
+		    "path" : "videos/index",
+		    "style" :                                                                                    
+			{
+				"navigationBarTitleText": "视频教程",
+				"enablePullDownRefresh": false
+			}
+		},{
+		    "path" : "videos/detail",
+		    "style" :                                                                                    
+			{
+				"navigationBarTitleText": "视频内容",
+				"enablePullDownRefresh": false
+			}
+		},
 		{
 			"path" : "promoProduct",
 			"style" : 
@@ -453,6 +465,27 @@
 			{
 				"navigationBarTitleText" : "采购订单"
 			}
+		},
+		{
+			"path" : "shopiing/searchProduct",
+			"style" : 
+			{
+				"navigationBarTitleText" : "商品搜索",
+				"navigationStyle": "custom",
+				"disableScroll": true,
+				"app-plus":{
+					"bounce":"none"
+				},
+				"renderer":"skyline",
+				"componentFramework": "glass-easel"
+			}
+		},
+		{
+			"path" : "shopiing/productDetail",
+			"style" : 
+			{
+				"navigationBarTitleText" : "商品详情"
+			}
 		}
 		]
 	}
@@ -483,6 +516,9 @@
 			{
 				"pagePath": "pages/videos/index"
 			},
+			{
+				"pagePath": "pages/cart/index"
+			},
 			{
 				"pagePath": "pages/morePage/morePage"
 			}

+ 385 - 0
pages/cart/index.vue

@@ -0,0 +1,385 @@
+<template>
+	<view class="pages">
+		<view class="cart-body">
+				<!-- 头部 -->
+				<view class="cart-head">
+					<view class="cart-head-left">共<text>{{total}}</text>款商品</view>
+					<view class="cart-head-btton" @click="editFlag=!editFlag"><text>{{editFlag?'完成':'编辑'}}</text></view>
+				</view>
+				<!-- 内容 -->
+				<scroll-view scroll-y class="cart-list" :style="{height:scrollHeight+'px'}"  @scrolltolower="onreachBottom">
+					<productItem
+					v-for="(item, index) in list"
+					:key="item.id"  
+					:index="index"
+					:list="item" 
+					:edit="editFlag" 
+					@changeQty="changeQty" 
+					@check="chooseItem"
+					@remove="removeChoose">
+					</productItem>
+					<view style="padding: 20upx;">
+						 <u-empty :src="`/static/nodata.png`" icon-size="180" :text="noDataText" img-width="120" v-if="list.length==0 && status!='loading'" mode="list"></u-empty>
+						 <u-loadmore v-if="(total>=list.length&&list.length)||status=='loading'" :status="status" />
+					</view>
+				</scroll-view>
+				<!-- 底部 -->
+				<view class="cart-footer">
+					<view class="cart-footer-left">
+							<view class="cart-footer-left-all" @click="chooseAll">
+								<view class="cart-footer-left-all-icon">
+									<u-icon size="45" :color="allChecked?'#ff0000':'#969799'" :name="allChecked?'roundcheckfill':'round'" custom-prefix="custom-icon"></u-icon>
+								</view>
+								<view class="cart-footer-left-all-text">
+									<text>全选</text>
+								</view>
+							</view>
+					</view>
+					<view class="cart-footer-right">
+						<view class="cart-footer-left-price" v-if="!editFlag">
+							<view class="cart-footer-left-price-text">
+								<text>合计:</text>
+							</view>
+							<view class="cart-footer-left-price-num">
+								<text>¥{{totalAmount}}</text>
+							</view>
+						</view>
+						<view class="cart-footer-right-button">
+							<u-button v-if="!editFlag" type="error" shape="circle" @click="settlement">去结算</u-button>
+							<u-button v-else type="error" plain shape="circle" @click="batchRemove">删除</u-button>
+						</view>
+					</view>
+				</view>
+		</view>
+		<u-tabbar :list="vuex_tabBarList" :before-switch="beforeSwitch"></u-tabbar>
+	</view>
+</template>
+
+<script>
+	import {
+	    mapState,
+	    mapMutations,
+	} from 'vuex'
+	import productItem from '@/pages/cart/productitem.vue'
+	export default {
+		components:{
+			productItem
+		},
+		onLoad() {
+			this.cacheList = this.getCacheList()
+			this.cacheList.forEach(key => {
+				this.total += key.length // 总款数
+			})
+			this.pageInit()
+		},
+		data() {
+			return {
+				status: 'loading',
+				noDataText: '暂无活动',
+				// 查询条件
+				pageNo: 1,
+				pageSize: 3,
+				list: [],
+				total: 0,
+				totalAmount: 0,
+				totalNum: 0,
+				editFlag: false,
+				allChecked: false,
+				cacheList: []
+			}
+		},
+		computed: {
+			...mapState(['hasLogin','vuex_vinScanNums','vuex_scanMaxNums','vuex_tabBarList']),
+			userInfo(){
+				return this.$store.state.vuex_userInfo
+			},
+			scrollHeight(){
+				return uni.getSystemInfoSync().windowHeight - 142
+			}
+		},
+		methods: {
+			// 从缓存获取数据
+			getCacheList(){
+				const cacheList = this.$store.state.vuex_cartList.find(k => k.sn == '693459699332595712')
+				return cacheList ? JSON.parse(JSON.stringify(cacheList.list)) : []
+			},
+			pageInit(){
+				this.pageNo = 1
+				this.list = []
+				this.getRow()
+			},
+			// 查询列表
+			getRow (pageNo) {
+			  let _this = this
+			  if (pageNo) {
+			    this.pageNo = pageNo
+			  }
+			  let params = {
+			    pageNo: this.pageNo,
+			    pageSize: this.pageSize,
+				queryWord: this.queryWord
+			  }
+			  const storeShelf = this.$store.state.vuex_storeShelf
+			  this.status = "loading"
+			  setTimeout(()=>{
+				  let list = this.cacheList.slice(this.list.length,this.pageNo*this.pageSize)||[]
+				  list.forEach(key => {
+					  key.forEach(s => {
+						   s.checked = this.allChecked
+					  })
+				  })
+				  this.list = this.list.concat(list)
+				  this.status = this.total>=this.list.length ? "nomore" : 'loadmore'
+			  })
+			 //  promoTerminalListByPage(params).then(res => {
+				// if (res.code == 200 || res.status == 204 || res.status == 200) {
+				//   const list = res.data.list
+				//   if(_this.pageNo>1){
+				// 	  _this.list = _this.list.concat(list)
+				//   }else{
+				// 	  _this.list = list
+				//   }
+				//   _this.total = res.data.count || 0
+				// } else {
+				//   _this.list = []
+				//   _this.total = 0
+				//   _this.noDataText = res.message
+				// }
+				// _this.status = _this.total>=_this.list.length ? "nomore" : 'loadmore'
+			 //  })
+			},
+			// scroll-view到底部加载更多
+			onreachBottom() {
+				if(this.list.length < this.total){
+					this.pageNo += 1
+					this.getRow()
+				}else{
+					this.status = "nomore"
+				}
+			},
+			// 根据id查找
+			getItemById(id){
+				const a = this.list.findIndex(k => k.find(s=> s.id == id))
+				const b = a>=0 ? this.list[a].findIndex(s=> s.id == id) : -1
+				return {p:a,s:b}
+			},
+			// 已选产品变更数量
+			changeQty(val,id){
+				const crow = this.getItemById(id)
+				if(crow.p>=0&&crow.s>=0){
+					this.list[crow.p][crow.s].qty = val
+					this.list[crow.p].splice()
+					// 合计
+					this.getChooseHeji()
+				}
+			},
+			// 选择
+			chooseItem(id){
+				const crow = this.getItemById(id)
+				if(crow.p>=0&&crow.s>=0){
+					this.list[crow.p][crow.s].checked = !this.list[crow.p][crow.s].checked
+					// 合计
+					this.getChooseHeji()
+					// 判断是否全选
+					if(this.list.every(key => key.every(item => item.checked))){
+						this.allChecked = true
+					}else{
+						this.allChecked = false
+					}
+				}
+			},
+			// 全选
+			chooseAll(){
+				this.allChecked = !this.allChecked
+				this.list.forEach(key => {
+					key.forEach(item => {
+						item.checked = this.allChecked
+					})
+				})
+				// 合计
+				this.getChooseHeji()
+			},
+			//单个删除
+			removeChoose(id){
+				// 删除项
+				const crow = this.getItemById(id)
+				if(crow.p>=0&&crow.s>=0){
+					this.list[crow.p].splice(crow.s, 1);
+					// 合计
+					this.getChooseHeji()
+				}
+			},
+			// 批量删除
+			batchRemove(){
+				if(this.totalNum==0){
+					uni.showToast({
+						title: '请选择产品',
+						icon: 'none'
+					})
+					return false
+				}
+				// 如果是全选
+				if(this.allChecked){
+					this.list = []
+					this.allChecked = false
+				}else{
+					this.list.forEach(item => {
+						item.filter(k=>k.checked).forEach(s=>{
+							this.removeChoose(s.id)
+						})
+					})
+				}
+				// 合计
+				this.getChooseHeji()
+			},
+			// 去结算
+			settlement(){
+				if(this.totalAmount>0){
+					 
+				}else{
+					uni.showToast({
+						title: '请选择产品',
+						icon: 'none'
+					})
+				}
+			},
+			// 计算总款数、合计、数量
+			getChooseHeji(){
+				this.totalAmount = 0
+				this.totalNum = 0
+				this.list.forEach(key => {
+					key.filter(item=>item.checked).forEach(item => {
+						this.totalAmount += item.cost * item.qty // 总金额
+						this.totalNum += item.qty // 总数量
+					})
+				})
+			},
+			// 扫描vin
+			beforeSwitch(index){
+				const row = this.$store.state.vuex_tabBarList[index]
+				if(row.text == '促销'){
+					uni.$emit('refashProm')
+				}
+				if(row.text == '扫描VIN'){
+					this.openCamera()
+				}else{
+					return true
+				}
+			},
+			// 去扫描
+			openCamera(){
+				if(this.hasLogin){
+					if(this.userInfo.sysUserFlag == '0'){
+						if(this.vuex_vinScanNums < this.vuex_scanMaxNums){
+							uni.navigateTo({
+								url: "/pages/scan-frame/scan-frame"
+							})
+						}else{
+							uni.showModal({
+								title: '提示',
+								content: '个人用户扫描VIN仅限10次,您的次数已用完!',
+								confirmText: '好的',
+								showCancel: false,
+								success(res) {}
+							})
+						}
+					}else{
+						uni.navigateTo({
+							url: "/pages/scan-frame/scan-frame"
+						})
+					}
+				}else{
+					uni.navigateTo({
+						url: '/pages/login/login'
+					})
+				}
+			},
+		}
+	}
+</script>
+
+<style lang="less">
+.pages{
+	height: 100vh;
+	display: flex;
+	flex-direction: column;
+	.cart-body{
+		position: relative;
+		flex-grow: 1;
+		display: flex;
+		flex-direction: column;
+		.cart-head{
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			padding: 20rpx;
+			background-color: #FFFFFF;
+			.cart-head-left{
+				font-size: 28rpx;
+				color: #333333;
+				text{
+					color: #FF0000;
+					margin: 0 10rpx;
+				}
+			}
+			.cart-head-btton{
+				font-size: 28rpx;
+				color: #333333;
+			}
+		}
+		.cart-list{
+			flex-grow: 1;
+			background-color: #F5F5F5;
+			width: 100%;
+			height: calc(100% - 180rpx);
+			overflow: auto;
+		}
+		.cart-footer{
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			width: 100%;
+			height: 100rpx;
+			background-color: #FFFFFF;
+			.cart-footer-left{
+				display: flex;
+				align-items: center;
+				padding: 0 20rpx;
+				.cart-footer-left-all{
+					display: flex;
+					align-items: center;
+					.cart-footer-left-all-text{
+						margin-left: 10rpx;
+						font-size: 28rpx;
+						color: #333333;
+					}
+				}
+			}
+			.cart-footer-right{
+				padding: 0 20rpx;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				
+				.cart-footer-left-price{
+					display: flex;
+					align-items: center;
+					.cart-footer-left-price-text{
+						font-size: 28rpx;
+						color: #333333;
+					}
+					.cart-footer-left-price-num{
+						font-size: 28rpx;
+						color: #FF0000;
+					}
+				}
+				.cart-footer-right-button{
+					margin-left: 20rpx;
+					width: 180rpx;
+					text-align: right;
+				}
+			}
+		}
+	}
+}
+</style>

+ 179 - 0
pages/cart/productitem.vue

@@ -0,0 +1,179 @@
+<template>
+	<block>
+		<view class="choose-product-item"
+		v-for="(item, dix) in list"
+		:key="item.id" 
+		>
+			<view class="choose-product-item-check" @click="checkItem(item.id)">
+				<u-icon size="45" :color="item.checked?'#ff0000':'#969799'" :name="item.checked?'roundcheckfill':'round'" custom-prefix="custom-icon"></u-icon>
+			</view>
+			 <view>
+				 <view class="choose-product-item-img">
+					<image mode="aspectFit" :src="item.productImage+'?x-oss-process=image/resize,p_30'" style="width: 100%;height: 180rpx;"></image>
+					<view class="back-price" v-if="item.promoRuleValue">返<text>{{item.promoRuleValue}}</text>元</view>
+					<view class="choose-product-item-left-info-code ellipsis-one">{{item.productCode}}</view>
+				 </view>
+				 <view class="choose-product-item-info">
+					<view class="choose-product-item-left-info-name ellipsis-two">{{item.productName}}</view>
+					<view class="choose-product-item-left-info-guige ellipsis-two">{{item.productOrigCode}}</view>
+					<view class="choose-product-item-left-info-price">
+						<view class="price-txt">¥<text>{{item.cost}}</text></view>
+						<view>
+							<uni-number-box v-if="!edit" v-model="item.qty" :min="1" :max="999999" @change="v=>{changeQty(v,item.id)}"></uni-number-box>
+							<view v-else class="edit-qty">
+								X <text>{{item.qty}}</text>
+								<u-icon size="42" color="#ff0000" name="ashbin" custom-prefix="custom-icon" @click="remove(item.id)"></u-icon>
+							</view>
+						</view>
+					</view>
+				 </view>
+			 </view>
+		</view>
+	</block>
+</template>
+
+<script>
+	import uniNumberBox from '@/components/uni-number-box/uni-number-box.vue'
+	export default {
+		name: 'productItem',
+		components: {
+			uniNumberBox
+		},
+		props: {
+			index: {
+				type: Number,
+				default: 0
+			},
+			list: {
+				type: Array,
+				default: () => []
+			},
+			edit: {
+				type: Boolean,
+				default: false
+			}
+		},
+		data() {
+			return {
+			}
+		},
+		methods: {
+			changeQty(e, id) {
+				this.$emit('changeQty', e, id)
+			},
+			remove(id){
+				this.$emit('remove',id)
+			},
+			checkItem(id){
+				this.$emit('check',id)
+			}
+		}
+	}
+</script>
+
+<style lang="less" scoped>
+	.choose-product-item{
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: 10px;
+		background: #fff;
+		margin: 8px 0;
+		border-radius: 10px;
+		.price-txt{
+			color: red;
+			display: flex;
+			align-items: center;
+			text{
+				font-size: 36rpx;
+			}
+		}
+		> view{
+			 display: flex;
+			 align-items: center;
+			 justify-content: space-between;
+			 &:last-child{
+				 flex-grow: 1;
+			 }
+		}
+		.choose-product-item-check{
+			padding: 0 20rpx 0 0;
+		}
+		.choose-product-item-img{
+			margin-right: 20rpx;
+			width: 35%;
+			position: relative;
+			overflow: hidden;
+			border: 1px solid #eee;
+			padding: 10rpx;
+			.back-price{
+				zoom: calc(0.8);
+				padding: 6rpx 65rpx;
+				background: rgba(255 ,87 ,34 , 1);
+				position: absolute;
+				top: 18rpx;
+				right: -45rpx;
+				color: #fff;
+				z-index: 2;
+				font-size: 20rpx;
+				text-align: center;
+				transform: rotate(40deg);
+				display: flex;
+				align-items: center;
+				text{
+					font-size: 28rpx;
+					margin: 0 5rpx;
+				}
+			}
+			.choose-product-item-left-info-code{
+				color: #666;
+				position: absolute;
+				width: 100%;
+				left:0;
+				bottom:0;
+				background: rgba(255,255,255,0.7);
+				text-align: center;
+			}
+		}
+		.choose-product-item-info{
+			margin-right: 10rpx;
+			width: 65%;
+			flex-grow: 1;
+			.choose-product-item-left-info-price{
+				display: flex;
+				align-items:center;
+				justify-content: space-between;
+				>view{
+					&:last-child{
+						display: flex;
+						align-items:center;
+					}
+				}
+				.edit-qty{
+					display: flex;
+					align-items:center;
+					justify-content: space-between;
+					color: #999;
+					font-size: 12px;
+					> text{
+						color: #666;
+						font-size: 14px;
+						margin-right: 20px;
+					}
+				}
+			}
+			.choose-product-item-left-info-name{
+				font-size: 28rpx;
+				font-weight: 900;
+				color: #666;
+			}
+			.choose-product-item-left-info-guige{
+				color: #2196F3;
+				margin: 10rpx 0;
+				text{
+					margin-right: 10rpx;
+				}
+			}
+		}
+	}
+</style>

+ 425 - 138
pages/index/index.vue

@@ -1,6 +1,6 @@
 <template>
 	<view>
-		<view class="content">
+		<view class="content" :class="hasShopiing?'bg-1':'bg-0'">
 			<!-- 头部栏 -->
 			<view class="header-box">
 				<UniStatusBar></UniStatusBar>
@@ -11,95 +11,129 @@
 				</view>
 			</view>
 			<view class="cbody">
-			<view class="body-box bg-blue">
-				<!-- 滚动区域 -->
-				<view class="scroll-list">
-					<scrollBox v-if="list.length&&!hasRedPacket" :list="list"></scrollBox>
-					<scrollBox v-if="slist.length&&hasRedPacket" :list="slist"></scrollBox>
-				</view>
-				<!-- 保证金 -->
-				<view class="notices flex align_center" v-if="bondRecord" @click="toPayBondAmount">
-					<view><u-icon name="volume" color="#f2a557" :size="28" :margin-right='15'></u-icon> 您有一笔保证金待支付 ¥{{bondRecord.bondAmount}}</view> 
-					<!-- <text class="text">立即支付>></text> -->
-				</view>
-				<!-- 待取货提醒 -->
-				<view class="notices flex align_center" v-if="!bondRecord&&orderTodo" @click="toOrder">
-					<view><u-icon name="volume" color="#f2a557" :size="28" :margin-right='15'></u-icon> 您有待取货的货架订单哦!</view> <text class="text">立即处理>></text>
-				</view>
-				<!-- 门店审核不通过 -->
-				<view class="notices flex justify_between" v-if="storeApply&&storeApply.auditStatus=='REFUSE'&&storeApply.readFlag=='0'">
-					<view><u-icon name="volume" color="#f2a557" :size="28" :margin-right='15'></u-icon> 门店认证资料审核不通过,请重新提交审核!</view> <text class="text" @click="toKnow">知道了</text>
-				</view>
-				<!-- 名片 -->
-				<view class="userCard flex align_center justify_between">
-					<view class="userCard-info flex align_center">
-						<view>
-							<u-image shape='circle' v-if="!hasLogin" src="/static/def_personal_avatar.png" width="90" height="90"></u-image>
-							<u-image shape='circle' v-else :src="avatarUrl||'/static/def_personal_avatar.png'" width="90" height="90"></u-image>
-						</view>
-						<view class="user-info" @click="toUser">
-							<view v-if="!hasLogin" style="font-size: 40rpx;">
-								请点击登录
+				<view :class="hasShopiing?'shopping bg-blue':'body-box bg-blue'">
+					<!-- 滚动区域 -->
+					<view class="scroll-list" v-if="!hasShopiing">
+						<scrollBox v-if="list.length&&!hasRedPacket" :list="list"></scrollBox>
+						<scrollBox v-if="slist.length&&hasRedPacket" :list="slist"></scrollBox>
+					</view>
+					<!-- 保证金 -->
+					<view class="notices flex align_center" v-if="bondRecord" @click="toPayBondAmount">
+						<view><u-icon name="volume" color="#f2a557" :size="28" :margin-right='15'></u-icon> 您有一笔保证金待支付 ¥{{bondRecord.bondAmount}}</view> 
+						<!-- <text class="text">立即支付>></text> -->
+					</view>
+					<!-- 待取货提醒 -->
+					<view class="notices flex align_center" v-if="!bondRecord&&orderTodo" @click="toOrder">
+						<view><u-icon name="volume" color="#f2a557" :size="28" :margin-right='15'></u-icon> 您有待取货的货架订单哦!</view> <text class="text">立即处理>></text>
+					</view>
+					<!-- 门店审核不通过 -->
+					<view class="notices flex justify_between" v-if="storeApply&&storeApply.auditStatus=='REFUSE'&&storeApply.readFlag=='0'">
+						<view><u-icon name="volume" color="#f2a557" :size="28" :margin-right='15'></u-icon> 门店认证资料审核不通过,请重新提交审核!</view> <text class="text" @click="toKnow">知道了</text>
+					</view>
+					<!-- 名片 -->
+					<view class="userCard flex align_center justify_between" v-if="!hasShopiing">
+						<view class="userCard-info flex align_center">
+							<view>
+								<u-image shape='circle' v-if="!hasLogin" src="/static/def_personal_avatar.png" width="90" height="90"></u-image>
+								<u-image shape='circle' v-else :src="avatarUrl||'/static/def_personal_avatar.png'" width="90" height="90"></u-image>
 							</view>
-							<view v-else>
-								<view class="user-name">{{userInfo.userNameCN || userInfo.mobile}}</view>
-								<view v-if="hasLogin&&userInfo&&userInfo.sysUserFlag == '0'">
-									<u-tag text="个人用户" mode="dark" type="warning" shape="circle" size="mini" />
+							<view class="user-info" @click="toUser">
+								<view v-if="!hasLogin" style="font-size: 40rpx;">
+									请点击登录
+								</view>
+								<view v-else>
+									<view class="user-name">{{userInfo.userNameCN || userInfo.mobile}}</view>
+									<view v-if="hasLogin&&userInfo&&userInfo.sysUserFlag == '0'">
+										<u-tag text="个人用户" mode="dark" type="warning" shape="circle" size="mini" />
+									</view>
+									<view v-else>{{userInfo.orgName}}</view>
 								</view>
-								<view v-else>{{userInfo.orgName}}</view>
 							</view>
 						</view>
+						<view @click="toUser">
+							<text v-if="hasLogin&&userInfo&&userInfo.sysUserFlag == '0'" class="user-rz">
+								{{storeApply&&storeApply.auditStatus=='WAIT'?'认证门店审核中':'认证成为门店'}}
+							</text>
+							<u-icon name="arrow-right"></u-icon>
+						</view>
 					</view>
-					<view @click="toUser">
-						<text v-if="hasLogin&&userInfo&&userInfo.sysUserFlag == '0'" class="user-rz">
-							{{storeApply&&storeApply.auditStatus=='WAIT'?'认证门店审核中':'认证成为门店'}}
-						</text>
-						<u-icon name="arrow-right"></u-icon>
+					<!-- 搜索 -->
+					<view class="search-head" v-if="hasShopiing">
+						<uni-search-bar radius="100" placeholder="请输入产品名称/轮胎规格" clearButton="auto" cancelButton="none" @confirm="toSearch"/>
 					</view>
 				</view>
-			</view>
-			<view class="body-box">	
-				<!-- 扫描按钮 -->
-				<view class="action-button flex" v-if="userInfo.sysUserFlag == '1'">
-					<view class="f1" @click="openTakeGood(1)">
-						<view class="icons"><u-icon name="bianmachaxun" custom-prefix="custom-icon"></u-icon></view>
-						<view class="tits">产品编码取货</view>
+				<view :class="hasShopiing?'body-box1':'body-box'">	
+					<!-- 扫描按钮 -->
+					<view class="action-button flex" v-if="userInfo.sysUserFlag == '1'&&!hasShopiing">
+						<view class="f1" @click="openTakeGood(1)">
+							<view class="icons"><u-icon name="bianmachaxun" custom-prefix="custom-icon"></u-icon></view>
+							<view class="tits">产品编码取货</view>
+						</view>
+						<view class="f2" @click="openTakeGood(0)">
+							<view class="icons"><u-icon name="saoma" custom-prefix="custom-icon"></u-icon></view>
+							<view class="tits">二维码/条形码取货</view>
+						</view>
 					</view>
-					<view class="f2" @click="openTakeGood(0)">
-						<view class="icons"><u-icon name="saoma" custom-prefix="custom-icon"></u-icon></view>
-						<view class="tits">二维码/条形码取货</view>
+					<!-- banner -->
+					<view class="banner">
+						<u-swiper mode="dot" bg-color="" img-mode="widthFix" @click="clickBanner" :interval="3000" :height="hasShopiing?280:374" :list="imgList"></u-swiper>
+					</view>
+					<!-- 快捷导航 -->
+					<view class="quick-nav pa-box" v-if="hasShopiing">
+						<iconItemsList :list="navList" @callback="onNavFun"></iconItemsList>
+					</view>
+					<!-- 产品分类 -->
+					<view class="ptype-nav pa-box" v-if="hasShopiing">
+						<swiper class="swiper" @change="e=>{currentPtypeDot=e.detail.current}">
+							<swiper-item v-for="(item, idx) in productTypeList" :index="idx" :key="item.id">
+								<iconItemsList :list="item.list" type="img" @callback="onNavFun"></iconItemsList>
+							</swiper-item>
+						</swiper>
+						<view class="indicator-dots">
+							<view v-for="(item,idx) in productTypeList" :key="idx" :class="currentPtypeDot==idx?'indicator-dots-active':''" ></view>
+						</view>
+					</view>
+					<!-- 产品列表 -->
+					<view class="product-box" v-if="hasShopiing">
+						<u-divider bg-color="">热门推荐</u-divider>
+						<view class="product-list">
+							<!-- 产品列表 -->
+							<productItem
+							v-for="(item,index) in productList"
+							:key="index" 
+							:list="item" 
+							:index="index"
+							:itemWidth="(screenWidth-30)*0.5"
+							:gap="10"
+							></productItem>
+						</view>
 					</view>
 				</view>
-				<!-- banner -->
-				<view style="margin-top: 20upx;">
-					<u-swiper mode="dot" bg-color="" img-mode="widthFix" @click="clickBanner" :interval="3000" :height="374" :list="imgList"></u-swiper>
-				</view>
-			</view>
-			<!-- 扫描记录 -->
-			<view class="list-box">
 				<!-- 扫描记录 -->
-				<u-cell-group :border="false">
-					<u-cell-item title="VIN查询历史" @click="toAllRecord" :title-style="{fontSize:'1em'}" value="全部">
-						<u-icon slot="icon" size="38" color="#066cff" style="margin-right: 0.3em;" name="order"></u-icon>
-					</u-cell-item>
-				</u-cell-group>
-				<u-cell-group :border="false" v-if="hasLogin">
-					<u-cell-item v-for="item in vinList" 
-					@click="toChoosePart(item)" 
-					:key="item.id" 
-					:title="item.vinCode" 
-					:title-style="{fontSize:'1em'}" 
-					:label="userInfo&&userInfo.sysUserFlag == '0' ? item.createDate : (item.brandName +' '+item.modelName)">
-						<text slot="icon"></text>
-					</u-cell-item>
-					<view style="padding: 20upx;">
-						<u-empty :src="`/static/nodata.png`" icon-size="180" :text="noDataText" img-width="120" v-if="vinList.length==0 && status!='loading'" mode="list"></u-empty>
-						<u-loadmore v-if="status=='loading'" :status="status" />
-					</view>
-				</u-cell-group>
-				<view class="des" v-if="vinList.length&&hasLogin">仅展示最近5条记录,点击“全部”查看更多</view>
-				<view class="des" v-if="!hasLogin">请登录后查看历史记录</view>
-			</view>
+				<view class="list-box" v-if="!hasShopiing">
+					<!-- 扫描记录 -->
+					<u-cell-group :border="false">
+						<u-cell-item title="VIN查询历史" @click="toAllRecord" :title-style="{fontSize:'1em'}" value="全部">
+							<u-icon slot="icon" size="38" color="#066cff" style="margin-right: 0.3em;" name="order"></u-icon>
+						</u-cell-item>
+					</u-cell-group>
+					<u-cell-group :border="false" v-if="hasLogin">
+						<u-cell-item v-for="item in vinList" 
+						@click="toChoosePart(item)" 
+						:key="item.id" 
+						:title="item.vinCode" 
+						:title-style="{fontSize:'1em'}" 
+						:label="userInfo&&userInfo.sysUserFlag == '0' ? item.createDate : (item.brandName +' '+item.modelName)">
+							<text slot="icon"></text>
+						</u-cell-item>
+						<view style="padding: 20upx;">
+							<u-empty :src="`/static/nodata.png`" icon-size="180" :text="noDataText" img-width="120" v-if="vinList.length==0 && status!='loading'" mode="list"></u-empty>
+							<u-loadmore v-if="status=='loading'" :status="status" />
+						</view>
+					</u-cell-group>
+					<view class="des" v-if="vinList.length&&hasLogin">仅展示最近5条记录,点击“全部”查看更多</view>
+					<view class="des" v-if="!hasLogin">请登录后查看历史记录</view>
+				</view>
 			</view>
 		</view>
 		<!-- tab栏 -->
@@ -114,6 +148,8 @@
 	} from 'vuex'
 	import scrollBox from '@/components/scrollBox.vue'
 	import UniStatusBar from '@/components/uni-status-bar/uni-status-bar.vue'
+	import iconItemsList from '@/components/icon-items-list/icon-items-list.vue'
+	import productItem from './productItem.vue'
 	import { shelfBondRecordWaitPayRecord, findStoreShelf, shelfGetTotalWaitQty, getProductfindByScanCode, queryQplsConfig } from '@/api/shelf.js'
 	import { xprhStoreApplyRead } from '@/api/xprh.js'
 	import { findCurrentRewardRule } from '@/api/rewardRule.js'
@@ -124,13 +160,17 @@
 	import { openWebView } from "@/utils/index.js"
 	export default {
 		components: {
+			iconItemsList, // 图标网格
 			scrollBox, // 无缝滚动组件
-			UniStatusBar // 状态栏组件
+			UniStatusBar, // 状态栏组件
+			productItem // 产品列表
 		},
 		data() {
+			const _this = this
 			return {
 				status: 'loading',
 				noDataText: '暂无数据',
+				hasShopiing: false, // 是否开通商城
 				bondRecord: null, // 保证金
 				list:[], // 扫描记录滚动
 				slist:[], // 红包滚动
@@ -139,7 +179,11 @@
 				avatarUrl:'', // 用户图像
 				navHeight: '44', // 头部高度
 				scanMaxNums: 10, // 扫描VIN仅限10次
-				carouselList: [] // 修理厂促销活动列表
+				carouselList: [] ,// 修理厂促销活动列表
+				productTypeList: [], // 产品分类
+				currentPtypeDot: 0,
+				screenWidth: 325,
+				productList:[]
 			}
 		},
 		computed: {
@@ -170,25 +214,67 @@
 			imgList(){
 				let list = [
 					{
-						image: '/static/banner1.png',
+						image: this.hasShopiing ? '/static/banner1.jpg':'/static/banner1.png',
 						activeType: ''
 					}
 				]
+				// 红包
 				if(this.hasRedPacket&&this.hasShelf){
 					list.push(
 					{
-						image: '/static/banner2.png',
+						image: this.hasShopiing ? '/static/banner2.jpg':'/static/banner2.png',
 						activeType: 'redPacket'
 					})
 				}
 				return list.concat(this.carouselList) 
+			},
+			// 快捷导航
+			navList(){
+				const list = [
+					{
+						id:'n0',
+						auth: this.hasLogin&&this.userInfo.sysUserFlag == '1',
+						icon:'bianmachaxun',
+						name: '产品编码取货',
+						color:'#2196f3',
+						url: 'openTakeGood0',
+						target: 'fun'
+					},
+					{
+						id:'n1',
+						auth: this.hasLogin&&this.userInfo.sysUserFlag == '1',
+						icon:'saoma',
+						name: '二维/条码取货',
+						color:'#FF9800',
+						url:'openTakeGood1',
+						target: 'fun'
+					},
+					{
+						id:'n3',
+						auth: this.hasLogin,
+						icon:'shipin1',
+						name: '视频讲堂',
+						color:'#55aa00',
+						url:'/pagesB/videos/index',
+						target: 'page'
+					},
+					{
+						id:'n2',
+						auth: this.hasLogin,
+						icon:'chaxunjilu',
+						name: 'VIN查询历史',
+						color:'#55557f',
+						url:'/pagesA/vinRecord/vinRecord',
+						target: 'page'
+					}
+				]
+				return list.filter(item=> item.auth)
 			}
 		},
 		onReady() {
-			// 滚动扫描记录
-			this.getScrollLog()
 			// 获取导航栏高度
 			const res = uni.getSystemInfoSync()
+			this.screenWidth = res.windowWidth
 			const system = res.platform
 			if (system === 'android') {
 				this.navHeight = 48
@@ -200,6 +286,8 @@
 			this.orderTodo = null
 			this.bondRecord = null
 			this.vinList = []
+			// 推荐产品列表
+			this.getProductList()
 			// 视频类型
 			this.getLookUpList('CONTENT_CATEGORY', 'vuex_videoTypeList');
 			// 检测是否登录
@@ -248,6 +336,8 @@
 			}else{
 				// 隐藏促销模块
 				this.hidePromoTab()
+				// 滚动扫描记录
+				this.getScrollLog()
 			}
 		},
 		methods: {
@@ -263,44 +353,74 @@
 					return true
 				}
 			},
-			// 轮播图片
-			getCarousel(){
-				this.carouselList = []
-				// 获取所有促销活动数据
-				promoTerminalList({}).then(res => {
-					if(res.status == 200){
-						res.data&&res.data.map(item => {
-							item.image = item.imageSet&&item.imageSet[0] // 默认取第一张图片
-						})
-						// 过滤掉产品促销活动
-						// this.carouselList = res.data.filter(item => item.content.indexOf("pages/promo/index") < 0)
-						// 所有数据
-						this.carouselList = res.data
-					}
+			// 去搜索产品
+			toSearch(event){
+				uni.navigateTo({
+					url:'/pagesB/shopiing/searchProduct?queryWord='+event.value+'&clzId='
 				})
 			},
+			// 获取产品列表
+			getProductList(){
+				const cacheList = this.$store.state.vuex_cartList.find(k => k.sn == '693459699332595712')
+				this.productList = cacheList ? JSON.parse(JSON.stringify(cacheList.list)) : []
+			},
+			// 初始化页面
 			pageInit(flag){
 				this.carouselList = []
 				if(this.hasLogin){
-					// 获取扫描记录
-					this.getVinLog()
 					// 非游客
 					if(this.userInfo.sysUserFlag == '1'){
-						// 查询是否有数字货架
-						this.getStoreShelf(flag)
+						// 查询是否有商城
+						this.getHasShopping(flag)
 					}else{
+						// 游客
 						// 获取扫描次数
 						this.$store.dispatch("getScanNums")
 						// 获取最大扫描次数
 						this.getMaxQty()
 						// 查询门店认证信息
 						this.findLastApply()
+						// 获取扫描记录
+						this.getVinLog()
 					}
 					
 				}else{
 					uni.removeStorageSync('token')
 				}
 			},
+			// 轮播图片
+			getCarousel(){
+				this.carouselList = []
+				// 获取所有促销活动数据
+				promoTerminalList({}).then(res => {
+					if(res.status == 200){
+						res.data&&res.data.map(item => {
+							item.image = item.imageSet&&item.imageSet[0] // 默认取第一张图片
+						})
+						// 过滤掉产品促销活动
+						// this.carouselList = res.data.filter(item => item.content.indexOf("pages/promo/index") < 0)
+						// 所有数据
+						this.carouselList = res.data
+					}
+				})
+			},
+			// 快速导航单击
+			onNavFun(item){
+				// 编码取货
+				if(item.url=='openTakeGood1'){
+					this.openTakeGood(1)
+				}
+				// 扫码取货
+				if(item.url=='openTakeGood0'){
+					this.openTakeGood(0)
+				}
+				// 产品分类跳转
+				if(item.url=='ptypeNav'){
+					uni.navigateTo({
+						url:'/pagesB/shopiing/searchProduct?clzId='+item.sn+'&clzName='+item.name
+					})
+				}
+			},
 			//  获取数据字典
 			getListLookUp() {
 				const _this = this;
@@ -402,6 +522,147 @@
 					this.status = 'nomore'
 				})
 			},
+			// 商城信息, flag: true 再次刷新,false 首次加载
+			getHasShopping(flag){
+				if(!flag){
+					setTimeout(()=>{
+						this.hasShopiing = true
+						// 有商城
+						if(this.hasShopiing){
+							// 隐藏tab 视频,显示购物车tab
+							this.showCatTab()
+							// 商品分类
+							const list = [
+								{
+									id:'0',
+									sn:'0',
+									name:'轮胎',
+									icon:'',
+									url: 'ptypeNav',
+									target: 'fun'
+								},
+								{
+									id:'1',
+									sn:'1',
+									name:'滤清器',
+									icon:'',
+									url: 'ptypeNav',
+									target: 'fun'
+								},
+								{
+									id:'2',
+									sn:'3',
+									name:'刹车片',
+									icon:'',
+									url: 'ptypeNav',
+									target: 'fun'
+								},{
+									id:'4',
+									sn:'4',
+									name:'油品',
+									icon:'',
+									url: 'ptypeNav',
+									target: 'fun'
+								},{
+									id:'5',
+									sn:'5',
+									name:'雨刮',
+									icon:'',
+									url: 'ptypeNav',
+									target: 'fun'
+								},{
+									id:'6',
+									sn:'6',
+									name:'火花塞',
+									icon:'',
+									url: 'ptypeNav',
+									target: 'fun'
+								},{
+									id:'7',
+									sn:'7',
+									name:'电火线圈',
+									icon:'',
+									url: 'ptypeNav',
+									target: 'fun'
+								},{
+									id:'8',
+									sn:'8',
+									name:'照明系列',
+									icon:'',
+									url: 'ptypeNav',
+									target: 'fun'
+								},{
+									id:'9',
+									sn:'9',
+									name:'空气滤',
+									icon:'',
+									url: 'ptypeNav',
+									target: 'fun'
+								},{
+									id:'10',
+									sn:'10',
+									name:'机油率',
+									icon:'',
+									url: 'ptypeNav',
+									target: 'fun'
+								},{
+									id:'11',
+									sn:'11',
+									name:'电瓶电池',
+									icon:'',
+									url: 'ptypeNav',
+									target: 'fun'
+								},{
+									id:'12',
+									sn:'12',
+									name:'洗美养护',
+									icon:'',
+									url: 'ptypeNav',
+									target: 'fun'
+								}
+							]
+							// 转成二维数组
+							for(let i=0;i<list.length;i=i+8){
+								this.productTypeList.push({
+									id: 'swiper-item-'+i,
+									list: list.slice(i,(i+8)>list.length?list.length:(i+8))
+								})
+							}
+						}else{ // 没有商城
+							// 滚动扫描记录
+							this.getScrollLog()
+							// 获取扫描记录
+							this.getVinLog()
+						}
+						// 查询是否有数字货架
+						this.getStoreShelf(flag)
+					},150)
+				}else{
+					if(!this.hasShopiing){
+						// 滚动扫描记录
+						this.getScrollLog()
+						// 获取扫描记录
+						this.getVinLog()
+					}
+					// 查询是否有数字货架
+					this.getStoreShelf(flag)
+				}
+			},
+			// 显示购物车tab
+			showCatTab(){
+				const videoIndex = this.$store.state.vuex_tabBarList.findIndex(item => item.text == '视频')
+				const catIndex = this.$store.state.vuex_tabBarList.findIndex(item => item.text == '购物车')
+				if(catIndex<0 && videoIndex >= 0){
+					// 替换视频为购物车
+					this.$store.state.vuex_tabBarList.splice(videoIndex,1,{
+						"pagePath": "/pages/cart/index",
+						"iconPath": "/static/tab/tab_cart_normal.png",
+						"selectedIconPath": "/static/tab/tab_cart_pressed.png",
+						"text": "购物车",
+						'customIcon': false,
+					})
+				}
+			},
 			// 查询是否支持数字货架, flag: true 再次刷新,false 首次加载
 			getStoreShelf(flag){
 				findStoreShelf().then(res => {
@@ -650,13 +911,18 @@
 	page{
 		background-color: #ffffff;
 	}
+	.bg-0{
+		background-image: linear-gradient(#86defa 0%,#cdeff9 25%,#ffffff 40%);
+	}
+	.bg-1{
+		background-image: linear-gradient(#86defa 0%, #cdeff9 15%, #f8f8f8 60%);
+	}
 	.content {
 		margin: 0;
 		padding: 0;
 		height: 100vh;
 		display: flex;
 		flex-direction: column;
-		background-image: linear-gradient(#86defa 0%,#cdeff9 25%,#ffffff 40%);
 		.header-box{
 			z-index: 5;
 			padding: 0em 1em;
@@ -674,23 +940,57 @@
 			flex-grow: 1;
 			overflow-y: auto;
 			overflow-x: hidden;
-		}
-		.body-box{
-			padding: 0em 1em 0.8em;
-			z-index: 4;
 			.notices{
 				padding: 0.5em 0 0;
 				font-size: 0.9em;
 				margin-top: 0.5rem;
 				view{
 					color: #ffaf46;
-					max-width: 80%;
+					flex-grow: 1;
 				}
 				.text{
 					color: #ffffff;
 					margin-left: 1em;
 				}
 			}
+			.pa-box{
+				background: #fff;
+				border-radius: 6px;
+				margin: 10px 0;
+			}
+			.product-box{
+				margin: 10px 0;
+			}
+			.ptype-nav{
+				padding: 10px 0;
+				position: relative;
+				.indicator-dots{
+					width: 100%;
+					height: 3px;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+					position: absolute;
+					left: 0;
+					bottom:5px;
+				}
+				.indicator-dots > view{
+					width: 10px;
+					height: 3px;
+					background: #e7e7e7;
+					display: inline-block;
+				}
+				.indicator-dots >.indicator-dots-active{
+					background: #00aaff;
+				}
+			}
+		}
+		.body-box{
+			padding: 0em 1em 0.8em;
+			z-index: 4;
+			.banner{
+				margin-top: 20rpx;
+			}
 			.action-button{
 				padding:40upx 0 0 0;
 				justify-content: space-between;
@@ -724,35 +1024,9 @@
 					font-size:28rpx;
 				}
 			}
-			.scanButton{
-				margin: 0.8em 0 0.5em;
-				padding: 0.5em;
-				background: #066cff;
-				color: #fff;
-				font-size: 1.5em;
-				border-radius: 5em;
-				justify-content: center;
-				&:active{
-					opacity: 0.8;
-				}
-			}
-			.quickButton{
-				margin: 0.8em 0 0.5em;
-				padding: 0.5em;
-				background: #fff;
-				color: #333;
-				font-size: 1.5em;
-				border-radius: 5em;
-				justify-content: center;
-				border:0.1rpx solid #eee;
-				box-shadow: 1rpx 2rpx 5rpx #f8f8f8;
-				&:active{
-					opacity: 0.8;
-				}
-			}
-			.ml10{
-				margin-left: 0.4em;
-			}
+		}
+		.body-box1{
+			padding: 0em 10px 0.8em;
 		}
 		.bg-blue{
 			position: relative;
@@ -774,6 +1048,9 @@
 				border-radius: 0 0 50% 50%;
 				/*分别对应 左上 右上 右下 左下 可以修改成其它颜色*/
 			    background: linear-gradient(to bottom, #066cff, #1d77ff);  
+			}
+			.search-head{
+				 
 			}
 			.userCard{
 				position:relative;
@@ -807,6 +1084,16 @@
 				}
 			}
 		}
+		.shopping{
+			padding: 0;
+			.notices{
+				padding: 0.5em 10px 0
+			}
+			&::after{
+				top: -25px;
+				border-radius: 0 0 150px 150px;
+			}
+		}
 		.list-box{
 			padding: 0 1em;
 			overflow: auto;

+ 184 - 0
pages/index/productItem.vue

@@ -0,0 +1,184 @@
+<template>
+	<view
+	class="product-list"
+	>
+		<view 
+		class="product-item" 
+		:style="{width:itemWidth+'px',marginTop:gap+'px'}"
+		v-for="(item,index) in list"
+	    :key="item.id" @click="toDetail(item)">
+			<view>
+				<image mode="aspectFit" :src="item.productImage+'?x-oss-process=image/resize,p_30'" style="height: 140px;width: 100%;"></image>
+				<!-- <view class="back-price" v-if="item.promoRuleValue">返<text>{{item.promoRuleValue}}</text>元</view> -->
+				<view class="product-code"><text class="ellipsis-one" overflow="ellipsis">{{item.productCode}}</text></view>
+			</view>
+			<view>
+				<view class="product-name ellipsis-two">{{item.productName}}</view>
+				<view class="product-guige"><text class="ellipsis-two" max-lines="2" overflow="ellipsis">{{item.productOrigCode}}</text></view>
+				<view class="product-button">
+					<view class="price-txt">¥<text>{{item.cost}}</text></view>
+					<view>
+						 
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'productItem',
+		props: {
+			list: {
+				type: Array,
+				default: () => []
+			},
+			index:{
+				type: [Number,String],
+				default: 0
+			},
+			gap:{
+				type: [Number,String],
+				default: 10
+			},
+			itemWidth:{
+				type: [Number,String],
+				default: 0
+			}
+		},
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			toDetail(item){
+				uni.navigateTo({
+					url:'/pagesB/shopiing/productDetail?sn='+item.productSn
+				})
+				this.$emit('detail',item)
+			},
+		},
+	}
+</script>
+
+<style lang="less">
+/* 显示一行省略号 */
+.ellipsis-one{
+	white-space: nowrap;
+	text-overflow: ellipsis;
+	overflow: hidden;
+	word-break: break-all;
+}
+/* 显示两行,省略号 */
+.ellipsis-two{
+	overflow: hidden;
+	text-overflow: ellipsis;
+	display: -webkit-box;
+	-webkit-line-clamp: 2;
+	line-clamp: 2;
+	-webkit-box-orient: vertical;
+}
+.product-list{
+	display:flex;
+	flex-wrap: wrap;
+	justify-content: space-between;
+	padding: 0;
+}
+.product-item{
+	background: #ffffff;
+	border-radius: 10upx;
+	box-shadow: 1px 1px 3px #EEEEEE;
+	width: 48%;
+	margin: 10px 0 0 0;
+	display: flex;
+	flex-direction: column;
+	.price-txt{
+		color: red;
+		display: flex;
+		align-items: center;
+		text{
+			font-size: 36rpx;
+		}
+	}
+	> view{
+		&:first-child{
+			position: relative;
+			overflow: hidden;
+			.product-code{
+				color: #666;
+				position: absolute;
+				width: 100%;
+				left:0;
+				bottom:0;
+				background: rgba(255,255,255,0.7);
+				text-align: center;
+			}
+		}
+		&:last-child{
+			position: relative;
+			flex-grow: 1;
+			padding: 10px 10px 40px;
+			.product-name{
+				font-size: 28rpx;
+				font-weight: 900;
+				color: #666;
+			}
+			.product-guige{
+				margin: 10rpx 0;
+				color: #2196F3;
+			}
+		}
+		.product-button{
+			position: absolute;
+			left: 5%;
+			bottom: 0;
+			width: 90%;
+			padding: 5px 0 10px;
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			button{
+				display: flex;
+				align-items: center;
+				text-align: center;
+				justify-content: center;
+				min-width:50rpx;
+				height: 50rpx;
+				font-size: 28rpx;
+				border-radius: 25rpx;
+				padding: 0 10rpx;
+				color: #fff;
+				&:active{
+					background: #2abcff;
+				}
+			}
+			.bg-0{
+				background: #066cff;
+			}
+			.bg-1{
+				background: #34aa0a;
+			}
+		}
+	}
+	.back-price{
+		padding: 6rpx 65rpx;
+		background: rgba(255 ,87 ,34 , 1);
+		position: absolute;
+		top: 18rpx;
+		right: -45rpx;
+		color: #fff;
+		z-index: 2;
+		font-size: 20rpx;
+		text-align: center;
+		transform: rotate(40deg);
+		display: flex;
+		align-items: center;
+		text{
+			font-size: 28rpx;
+			margin: 0 5rpx;
+		}
+	}
+	}
+</style>

+ 366 - 112
pages/morePage/morePage.vue

@@ -1,48 +1,83 @@
 <template>
 	<view>
 	<view class="morePages">
-		<view class="list-box" v-if="hasRedPacket&&hasShelf">
-			<view class="list-title flex align_center justify_between" @click="toPage('/pagesB/redPacket')">
-				<view><u-icon size="34" color="#f10000" name="red-packet-fill"></u-icon> <text style="color: #ff0000;margin-left: 10rpx;">红包奖励</text></view>
-				<view>
-					<u-icon size="28" color="#969799" name="arrow-right"></u-icon>
-				</view>
+		<!-- 头部栏 -->
+		<view class="header-box">
+			<UniStatusBar></UniStatusBar>
+			<view class="title flex align_center" :style="{height:(navHeight+'px')}">
+				 <u-image src="/static/logo-h.png" width="349" height='40'></u-image>
 			</view>
 		</view>
-		<view class="list-box" v-if="hasLogin&&$hasPermissions('M_couponList_mini')">
-			<view class="list-title flex align_center justify_between" @click="toPage('/pagesB/coupon')">
-				<view><u-icon size="34" color="#ff7d0b" name="gift-fill"></u-icon> <text style="color: #ff7d0b;margin-left: 10rpx;">我的优惠券</text></view>
-				<view>
-					<u-icon size="28" color="#969799" name="arrow-right"></u-icon>
+		<!-- body -->
+		<view class="morePages-body">
+			<view class="body-box bg-blue">
+				<!-- 名片 -->
+				<view class="userCard flex align_center justify_between">
+					<view class="userCard-info flex align_center">
+						<view>
+							<u-image shape='circle' v-if="!hasLogin" src="/static/def_personal_avatar.png" width="90" height="90"></u-image>
+							<u-image shape='circle' v-else :src="avatarUrl||'/static/def_personal_avatar.png'" width="90" height="90"></u-image>
+						</view>
+						<view class="user-info" @click="toUser">
+							<view v-if="!hasLogin" style="font-size: 40rpx;">
+								请点击登录
+							</view>
+							<view v-else>
+								<view class="user-name">{{userInfo.userNameCN || userInfo.mobile}}</view>
+								<view v-if="hasLogin&&userInfo&&userInfo.sysUserFlag == '0'">
+									<u-tag text="个人用户" mode="dark" type="warning" shape="circle" size="mini" />
+								</view>
+								<view v-else>{{userInfo.orgName}}</view>
+							</view>
+						</view>
+					</view>
+					<view @click="toUser">
+						<text v-if="hasLogin&&userInfo&&userInfo.sysUserFlag == '0'" class="user-rz">
+							{{storeApply&&storeApply.auditStatus=='WAIT'?'认证门店审核中':'认证成为门店'}}
+						</text>
+						<u-icon name="arrow-right"></u-icon>
+					</view>
 				</view>
 			</view>
-		</view>
-		
-		<!-- 网格图标 -->
-		<view class="list-box" v-for="item in itemList" :key="item.id">
-			<view class="list-title">
-				<u-icon size="35" :name="item.icon"></u-icon> <text>{{item.text}}</text>
+			
+			<view class="list-box" v-if="hasRedPacket&&hasShelf">
+				<view class="list-title flex align_center justify_between" @click="toPage('/pagesB/redPacket')">
+					<view><u-icon size="34" color="#f10000" name="red-packet-fill"></u-icon> <text style="color: #ff0000;margin-left: 10rpx;">红包奖励</text></view>
+					<view>
+						<u-icon size="28" color="#969799" name="arrow-right"></u-icon>
+					</view>
+				</view>
 			</view>
-			<view class="list-body">
-				<uni-grid :column="item.column" :highlight="true" :show-border="false" :square="false" @change="e=>openPage(e,item.child)">
-					<uni-grid-item v-for="(sub, idx) in item.child" :index="idx" :key="idx">
-						<view class="grid-item-box">
-							<u-icon class="icons" :color="sub.color" :name="sub.icon" custom-prefix="custom-icon"></u-icon>
-							<text class="text">{{sub.text}}</text>
-						</view>
-					</uni-grid-item>
-				</uni-grid>
+			<view class="list-box" v-if="hasLogin&&$hasPermissions('M_couponList_mini')">
+				<view class="list-title flex align_center justify_between" @click="toPage('/pagesB/coupon')">
+					<view><u-icon size="34" color="#ff7d0b" name="gift-fill"></u-icon> <text style="color: #ff7d0b;margin-left: 10rpx;">我的优惠券</text></view>
+					<view>
+						<u-icon size="28" color="#969799" name="arrow-right"></u-icon>
+					</view>
+				</view>
 			</view>
-		</view>
-		
-		<view class="list-box" v-if="hasLogin&&dealerPhone">
-			<view class="list-title flex justify_center phone" @click="call">
-				<u-icon size="36" name="phone"></u-icon> <text>联系汽配商</text>
+					
+			<!-- 网格图标 -->
+			<view class="list-box" v-for="item in itemList" :key="item.id">
+				<view class="list-title" v-if="item.text">
+					<text>{{item.text}}</text>
+				</view>
+				<view class="list-body" :style="{paddingTop:item.text?0:'10px'}">
+					<uni-grid :column="item.column" :highlight="true" :show-border="false" :square="false" @change="e=>openPage(e,item.child)">
+						<uni-grid-item v-for="(sub, idx) in item.child" :index="idx" :key="idx">
+							<view class="grid-item-box">
+								<u-icon class="icons" :color="sub.color" :size="item.size" :name="sub.icon" custom-prefix="custom-icon"></u-icon>
+								<text class="text">{{sub.text}}</text>
+							</view>
+						</uni-grid-item>
+					</uni-grid>
+				</view>
 			</view>
-		</view>
-		<view class="list-box" v-if="hasLogin">
-			<view class="list-title flex justify_center phone" @click="quitOut">
-				<text>退出登录</text>
+			 
+			<view class="list-box" v-if="hasLogin">
+				<view class="list-title flex justify_center phone" @click="quitOut">
+					<text>退出登录</text>
+				</view>
 			</view>
 		</view>
 		
@@ -66,14 +101,20 @@
 	    mapState,
 	    mapMutations
 	} from 'vuex'
-	import { queryQplsConfig } from '@/api/shelf.js'
+	import UniStatusBar from '@/components/uni-status-bar/uni-status-bar.vue'
+	import { queryQplsConfig,getProductfindByScanCode } from '@/api/shelf.js'
 	export default {
+		components: {
+			UniStatusBar // 状态栏组件
+		},
 		data() {
 			return {
 				dealerPhone: null, // 经销商电话
 				showPopup: false,
 				showPriceSet: false,
 				shelfSn: null,
+				avatarUrl:'', // 用户图像
+				navHeight: 44
 			}
 		},
 		computed: {
@@ -93,69 +134,109 @@
 			},
 			itemList(){
 				const list = [
+					{
+						text: '订单管理',
+						icon: 'order',
+						auth: true,
+						column: 4,
+						size: 60,
+						child:[
+							{
+								text: '货架订单',
+								icon: 'huojiaguanli',
+								auth: this.$hasPermissions('M_shelfOrder_mini'),
+								path: '/pagesA/digitalShelf/orderList',
+								color: '#00aaff',
+								isShelf: true
+							},
+							{
+								text: '急送订单',
+								icon: 'yijianshansong',
+								auth: this.$hasPermissions('M_tempShelfOrder_mini'),
+								path: '/pagesA/digitalShelf/tempOrderList/tempOrderList',
+								color: '#ff7b1c',
+								isShelf: true
+							},
+							{
+								text: '采购订单',
+								icon: 'purchaseorder',
+								auth: this.$hasPermissions('M_procureOrder_mini'),
+								path: '/pagesB/procureOrderList',
+								color: '#00aa00'
+							}
+						],
+					},
 					{
 						text: '货架管理',
 						icon: 'list-dot',
 						auth: true,
 						column: 4,
+						size: 60,
 						child:[
+							{
+								text: '编码取货',
+								icon: 'ziyuanxhdpi',
+								auth: this.userInfo && this.userInfo.sysUserFlag == '1',
+								path: '#quhuo1',
+								color: '#2196f3',
+								isShelf: true
+							},
+							{
+								text: '扫码取货',
+								icon: 'saoma1',
+								auth: this.userInfo && this.userInfo.sysUserFlag == '1',
+								path: '#quhuo0',
+								color: '#FF9800',
+								isShelf: true
+							},
+							{
+								text: 'VIN查询历史',
+								icon: 'lishijilu',
+								auth: this.hasLogin,
+								path: '/pagesA/vinRecord/vinRecord',
+								color: '#55557f',
+								isShelf: true
+							},
 							{
 								text: '库存查询',
 								icon: 'stockquery',
 								auth: this.$hasPermissions('M_stockQueryList_mini'),
 								path: '/pagesB/stockQuery/stockQuery',
-								color: '#00aaff'
+								color: '#00aaff',
+								isShelf: true
 							},
 							{
 								text: '补货记录',
 								icon: 'replenishment',
 								auth: this.$hasPermissions('M_stockPut_mini'),
 								path: '/pagesA/digitalShelf/stockPut',
-								color: '#aa55ff'
+								color: '#aa55ff',
+								isShelf: true
 							},
 							{
 								text: '结算记录',
 								icon: 'settlement',
 								auth: this.$hasPermissions('M_settlementRecord_mini'),
 								path: '/pagesA/digitalShelf/settlementRecord/settlementRecord',
-								color: '#00aaff'
+								color: '#55aa00',
+								isShelf: true
 							},
 							{
 								text: '付款结算',
 								icon: 'payrecord',
 								auth: this.$hasPermissions('M_settlementManage_mini'),
 								path: '/pagesA/digitalShelf/settlementManage/settlementManage',
-								color: '#ff5500'
+								color: '#ff5500',
+								isShelf: true
 							},
-						],
-					},
-					{
-						text: '订单管理',
-						icon: 'order',
-						auth: true,
-						column: 4,
-						child:[
 							{
-								text: '货架订单',
-								icon: 'shelforder',
-								auth: this.$hasPermissions('M_shelfOrder_mini'),
-								path: '/pagesA/digitalShelf/orderList',
-								color: '#0055ff'
+								text: '联系汽配商',
+								icon: 'phone',
+								auth: this.hasLogin&&this.dealerPhone,
+								path: '#call',
+								color: '#00aaff',
+								isShelf: true
 							},
-							{
-								text: '急送订单',
-								icon: 'yijianshansong',
-								auth: this.$hasPermissions('M_tempShelfOrder_mini'),
-								path: '/pagesA/digitalShelf/tempOrderList/tempOrderList',
-								color: '#ff7b1c'
-							},
-							{
-								text: '采购订单',
-								icon: 'purchaseorder',
-								auth: this.$hasPermissions('M_procureOrder_mini'),
-								path: '/pagesB/procureOrderList',
-								color: '#00aa00'
-							}
 						],
 					},
 					{
@@ -163,6 +244,7 @@
 						icon: 'file-text',
 						auth: true,
 						column: 4,
+						size: 60,
 						child:[
 							{
 								text: '创建质保单',
@@ -185,6 +267,7 @@
 						icon: 'setting',
 						auth: true,
 						column: 4,
+						size: 60,
 						child:[
 							{
 								text: '员工管理',
@@ -205,7 +288,8 @@
 								icon: 'permission',
 								auth: this.$hasPermissions('M_priceShow_mini')&&this.showPriceSet,
 								path: '/pages/storeManage/priceSetting/priceSetting',
-								color: '#ff5500'
+								color: '#ff5500',
+								isShelf: true
 							},
 						],
 					}
@@ -220,6 +304,8 @@
 			}
 		},
 		onShow() {
+			// 用户头像
+			this.avatarUrl = uni.getStorageSync('userPhoto');
 			// 获取货架信息
 			const shelfInfo = this.$store.state.vuex_storeShelf
 			this.shelfSn = shelfInfo ? shelfInfo.shelfSn : ''
@@ -233,6 +319,19 @@
 			uni.$off('refashProm')
 		},
 		methods: {
+			// 查看用户信息
+			toUser(){
+				if(this.hasLogin){
+					// 用户详细信息 或 门店认证
+					uni.navigateTo({
+						url: this.userInfo.sysUserFlag == '1' ? '/pages/personData/personData' : '/pages/storeManage/storeAuth'
+					})
+				}else{
+					uni.navigateTo({
+						url: '/pages/login/login'
+					})
+				}
+			},
 			// tab单击
 			beforeSwitch(index){
 				const row = this.$store.state.vuex_tabBarList[index]
@@ -248,7 +347,7 @@
 			// 网格打开页面
 			openPage(e,child){
 				const item = child[e.detail.index]
-				this.toPage(item.path)
+				this.toPage(item.path,item.isShelf)
 			},
 			// 获取价格配置
 			getPriceCofig(){
@@ -288,8 +387,79 @@
 					})
 				}
 			},
+			// 取货
+			openTakeGood(index){
+				// 已有数字货架
+				if(this.hasShelf){
+					this.clickAction(index)
+				}else{
+					uni.showToast({
+						icon:'none',
+						title: '门店没有关联数字货架,无法使用此功能!'
+					})
+				}
+			},
+			// 选择取货方式
+			clickAction(index){
+				const shelfSn = this.hasShelf.shelfSn
+				const _this = this
+				// 扫描
+				if(index == 0){
+					uni.scanCode({
+						success: function (ret) {
+							console.log(ret);
+							const params = {
+								codeType: ret.scanType == 'QR_CODE' ? 0 : 1
+							}
+							// 二维码
+							if(ret.scanType == 'QR_CODE'){
+								const result = ret.result.split("&")
+								params.productSn = result[2] // 产品编码sn
+							}else{
+								params.qrCode = ret.result
+							}
+							uni.showLoading({
+								title: "正在查询产品..."
+							})
+							// 确认取货
+							getProductfindByScanCode(params).then(res => {
+								if(res.status == 200 && res.data){
+									if(res.data.currentInven){
+										const billSource = ret.scanType == 'QR_CODE' ? 'qr_code': 'bar_code'
+										const retData = Object.assign({shelfSn: shelfSn, billSource: billSource},res.data)
+										_this.$store.state.vuex_tempData = retData
+										uni.navigateTo({
+											url: '/pagesA/queryByCode/confirmQh'
+										})
+									}else{
+										uni.showModal({
+											title: '提示',
+											content: '产品库存为0,无法取货!',
+											confirmText: '好的',
+											showCancel: false
+										})
+									}
+								}else{
+									uni.showModal({
+										title: '提示',
+										content: '产品不属于此货架,请重新扫描!',
+										confirmText: '好的',
+										showCancel: false
+									})
+								}
+								uni.hideLoading()
+							})
+						}
+					});
+				}else{
+					// 按编码搜索
+					uni.navigateTo({
+						url: '/pagesA/queryByCode/queryByCode'
+					})
+				}
+			},
 			// 跳转打开页面
-			toPage(path){
+			toPage(path,isShelf){
 				const _this = this
 				if(this.hasLogin){
 					// 游客未认证
@@ -321,10 +491,22 @@
 						}
 					}else{
 						// 已有数字货架
-						if(this.hasShelf){
-							uni.navigateTo({
-								url: path
-							})
+						if(this.hasShelf || !isShelf){
+							if(path.indexOf("/pages")>=0){
+								uni.navigateTo({
+									url: path
+								})
+							}else{
+								if(path == '#quhuo1'){
+									this.openTakeGood(1)
+								}
+								if(path == '#quhuo0'){
+									this.openTakeGood(0)
+								}
+								if(path == '#call'){
+									this.call()
+								}
+							}
 						}else{
 							uni.showToast({
 								icon:'none',
@@ -359,12 +541,11 @@
 					  if(ret.confirm){
 						  _this.$store.dispatch('userLogout');
 						  uni.navigateTo({
-						  	 url: '/pages/login/login'
+							 url: '/pages/login/login'
 						  });
 					  }
 					}
 				})
-				
 			}
 		}
 	}
@@ -373,53 +554,126 @@
 <style lang="less">
 .morePages{
 	width: 100%;
-	padding: 30rpx;
 	background-image: linear-gradient(#86defa 0%,#cdeff9 20%,#f8f8f8 30%);
-	.list-box{
-		background: #ffffff;
-		margin-bottom: 20rpx;
-		border-radius: 25rpx;
+	.header-box{
+		z-index: 5;
+		padding: 0em 1em;
+		background: #066cff;
+		 .title{
+			 padding: 0;
+		 }
+		 .version{
+			 color: #FFEB3B;
+			 font-size: 0.8em;
+			 margin-left: 1em;
+		 }
+	}
+	.morePages-body{
+		padding: 0 30rpx;
 		overflow: hidden;
-		box-shadow: 2rpx 2rpx 5rpx #eee;
-		.list-title{
-			padding: 25rpx 20rpx;
-			font-size: 30rpx;
-			> text{
-				margin-left: 10rpx;
-			}
+		.body-box{
+			margin-bottom: 10px;
+			z-index: 4;
 		}
-		&:first-child{
-			box-shadow: 2rpx 2rpx 5rpx #cdeff9;
-		}
-		.list-body{
-			padding: 0 20rpx 25rpx;
+		.bg-blue{
+			position: relative;
+			> view{
+				z-index: 100;
+				position: relative;
+			}
+			&::after{
+				/* 这个伪类的作用就是一个圆弧的背景色 */
+				width: 130%;
+				height: 100%;
+				position: absolute;
+				/*设置水平居中*/
+				left: -15%;
+				/* 之所以left:20%,是因为width:140%,若width:160%,那么left:30%才能水平居中 */
+				top: -25%; 
+				/*层叠顺序,最底层显示*/
+				content: '';
+				border-radius: 0 0 50% 50%;
+				/*分别对应 左上 右上 右下 左下 可以修改成其它颜色*/
+			    background: linear-gradient(to bottom, #066cff, #1d77ff);  
+			}
+			.userCard{
+				position:relative;
+				left:0;
+				bottom:0;
+				padding: 0.5rem;
+				background: #fff;
+				border-radius: 25rpx;
+				box-shadow: 2rpx 2rpx 5rpx #bcdede;
+				.userCard-info{
+					flex-grow:1;
+					> view{
+						&:last-child{
+							margin-left: 0.5em;
+							line-height: 1.5em;
+							.user-name{
+								font-size: 1rem;
+							}
+							>view{
+								padding: 0.2em;
+							}
+						}
+					}
+					.user-info{
+						flex-grow:1;
+					}
+				}
+				.user-rz{
+					font-size: 0.8rem;
+					color:#58aff5;
+				}
+			}
 		}
-		.grid-item-box{
-			display: flex;
-			flex-direction: column;
-			align-items:center;
-			justify-content: center;
-			.text{
-				text-align:center;
+		.list-box{
+			background: #ffffff;
+			margin-bottom: 20rpx;
+			border-radius: 25rpx;
+			overflow: hidden;
+			box-shadow: 2rpx 2rpx 5rpx #eee;
+			.list-title{
+				padding: 25rpx 20rpx;
 				color: #666;
+				> text{
+					font-size: 28rpx;
+				}
+			}
+			&:first-child{
+				box-shadow: 2rpx 2rpx 5rpx #cdeff9;
 			}
-			.icons{
-				font-size: 70rpx;
-				width: 90rpx;
-				height: 90rpx;
-				text-align:center;
+			.list-body{
+				padding: 0 20rpx;
+			}
+			.grid-item-box{
 				display: flex;
-				align-items: center;
 				flex-direction: column;
+				align-items:center;
 				justify-content: center;
+				margin-bottom: 15px;
+				.text{
+					text-align:center;
+					color: #666;
+					margin-top: 3px;
+					font-size: 12px;
+				}
+				.icons{
+					text-align:center;
+					display: flex;
+					align-items: center;
+					flex-direction: column;
+					justify-content: center;
+				}
 			}
 		}
-	}
-	.phone{
-		color: #00aaff;
-		&:active{
-			opacity: 0.8;
-			transform:scale(0.9);
+		.phone{
+			color: #00aaff;
+			&:active{
+				opacity: 0.8;
+				transform:scale(0.9);
+			}
 		}
 	}
 }

+ 1 - 2
pages/videos/index.vue

@@ -117,7 +117,6 @@
 			},
 			// scroll-view到底部加载更多
 			onreachBottom() {
-				console.log(this.list.length, this.total)
 				if(this.list.length < this.total){
 					this.pageNo += 1
 					this.getRow()
@@ -166,7 +165,7 @@
 							item.viewNum = res.data.viewNum
 							this.list.splice()
 							uni.navigateTo({
-								url: "/pages/videos/detail?form=videoList&&title="+item.titile+"&&content="+item.content
+								url: "/pagesB/videos/detail?form=videoList&&title="+item.titile+"&&content="+item.content
 							})
 						}
 					})

+ 0 - 9
pagesB/components/chooseProductItemSkline.vue

@@ -6,7 +6,6 @@
 		>
 			 <view>
 				 <view class="choose-product-item-img">
-					<!-- <text class="no-txt">{{index?(index*pageSize-(pageSize-fristLength))+(dix+1):(dix+1)}}</text> -->
 					<image mode="aspectFit" :src="item.productImage+'?x-oss-process=image/resize,p_30'" style="width: 100%;height: 180rpx;"></image>
 					<view class="back-price" v-if="item.promoRuleValue">返<text>{{item.promoRuleValue}}</text>元</view>
 					<view class="choose-product-item-left-info-code ellipsis-one">{{item.productCode}}</view>
@@ -49,14 +48,6 @@
 			edit: {
 				type: Boolean,
 				default: false
-			},
-			pageSize: {
-				type: Number,
-				default: 6
-			},
-			fristLength: {
-				type: Number,
-				default: 0
 			}
 		},
 		data() {

+ 0 - 2
pagesB/promoProduct.vue

@@ -94,8 +94,6 @@
 						:key="item.id"  
 						:index="index"
 						:list="item" 
-						:fristLength="fristLength"
-						:pageSize="choosePageSize"
 						:edit="editChoose" 
 						@changeQty="changeQty" 
 						@remove="removeChoose">

+ 8 - 0
pagesB/shopiing/productDetail.vue

@@ -0,0 +1,8 @@
+<template>
+</template>
+
+<script>
+</script>
+
+<style>
+</style>

+ 338 - 0
pagesB/shopiing/searchProduct.vue

@@ -0,0 +1,338 @@
+<template>
+	<view class="pages">
+		<!-- head -->
+		<view class="scrollPage-header">
+			<view :style="{height:statusBarHeight+'px'}"></view>
+			<view class="header-title">
+				<view class="header-left" @click="goBack">
+					<image style="width: 16px; height: 16px;margin-right:3px;" mode="aspectFit" src="../static/arrow-left.png"></image>
+					<text>返回</text>
+				</view>
+				<view class="header-title"><text class="ellipsis-one" overflow="ellipsis">{{title}}</text></view>
+				<view class="header-right"></view>
+			</view>
+		</view>
+		<view class="search-result">
+			<view class="tab-left" v-if="clzId">
+				<view class="item-clz active">滤清器</view>
+				<view class="item-clz">机油</view>
+				<view class="item-clz">轮胎</view>
+				<view class="item-clz">火花塞</view>
+				<view class="item-clz">刹车片</view>
+			</view>
+			<view class="right-box" :style="{width:clzId?'75%':'100%'}">
+				<!-- body -->
+				<scroll-view 
+				class="scrollPage-body" 
+				:style="{height: (screenHeight - statusBarHeight - safeAreaBottom - 40) + 'px'}" 
+				scroll-y="true" 
+				type="custom" 
+				@scrolltolower="reachBottom">
+					<!-- 搜索,吸顶 -->
+					<sticky-header>
+						<view class="search-head">
+							<uni-search-bar v-model="queryWord" radius="100" placeholder="请输入产品名称/轮胎规格" bgColor="#fff" textColor="#666" clearButton="auto" cancelButton="none" @confirm="searchList" @clear="searchList" />
+						</view>
+					</sticky-header>
+					<!-- 产品列表 -->
+					<chooseProductItem
+					v-for="(item, index) in list"
+					:key="item.id"  
+					:index="index"
+					:list="item" 
+					:edit="editChoose" 
+					>
+					</chooseProductItem>
+					<!-- loading -->
+					<view class="loading-bar" v-if="list.length && (loading||loadEnd)">{{loadText}}</view>
+					<view class="empty-bar" v-if="total==0&&!loading">
+						<image mode="aspectFit" :src="empty.imgUrl"></image>
+						<view v-if="queryWord!=''">{{empty.tip}}</view>
+					</view>
+					<!-- 搜索记录 -->
+					<view class="search-history" v-if="historyList.length&&queryWord==''">
+						<view class="search-history-title">
+							<text>搜索记录</text>
+							<image @click="clearHistory" style="width: 30px; height: 30px;" mode="aspectFit" src="../static/del.png"></image>
+						</view>
+						<view class="search-history-body">
+							<view class="item" v-for="item in historyList" :key="item.id" @click="toSearch(item)">
+								<text class="ellipsis-one" max-lines="1" overflow="ellipsis">{{item.text}}</text>
+							</view>
+						</view>
+					</view>
+				</scroll-view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import chooseProductItem from '@/pagesB/components/chooseProductItemSkline.vue'
+	import { queryPromoProductByPage } from '@/api/video.js'
+	export default {
+		components:{
+			chooseProductItem
+		},
+		data() {
+			return {
+				clzId: null,
+				title: '',
+				loadText: '加载中...',
+				empty: {
+					tip: '',
+					imgUrl: '/static/nodata.png'
+				},
+				queryWord:'',
+				screenWidth: 325,
+				screenHeight: 0,
+				statusBarHeight: 44,
+				safeAreaBottom: 0,
+				pageSize: 10,
+				pageNo:1,
+				total:0,
+				list: [],
+				loading:false,
+				loadEnd: false,
+				searchHistoryList: []
+			};
+		},
+		computed: {
+			historyList() {
+				return this.searchHistoryList.filter(item=>item.text!='')
+			}
+		},
+		onLoad(opts) {
+			this.clzId = opts.clzId
+			
+			// 搜索历史
+			this.searchHistoryList = uni.getStorageSync('searchHistoryList') || []
+			
+			if(opts.clzId==''){
+				this.title = '商城商品搜索'
+				this.queryWord = opts.queryWord
+				this.searchList()
+			}else{
+				this.title = opts.clzName
+			}
+			// 计算区域高度
+			this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight
+			this.screenWidth = uni.getSystemInfoSync().windowWidth
+			this.screenHeight = uni.getSystemInfoSync().windowHeight
+			this.safeAreaBottom = uni.getSystemInfoSync().safeAreaInsets.bottom
+		},
+		methods: {
+			goBack(){
+				uni.navigateBack()
+			},
+			// 清空历史记录
+			clearHistory(){
+				const _this = this
+				uni.showModal({
+					title: '提示',
+					content: '确定清空搜索历史?',
+					confirmText: '确定',
+					success(res) {
+						if(res.confirm){
+							_this.searchHistoryList = []
+							uni.setStorageSync('searchHistoryList', _this.searchHistoryList)
+						}
+					}
+				})
+			},
+			// 选择搜索记录
+			toSearch(item){
+				this.queryWord = item.text
+				this.searchList()
+			},
+			// 搜索列表
+			searchList(event) {
+				 //  存储搜索记录
+				 const has = this.searchHistoryList.some(k => k.text == this.queryWord)
+				 if(!has && this.queryWord!=''){
+					 this.searchHistoryList.push({
+						 id: new Date().getTime(),
+						 text: this.queryWord
+					 })
+					 uni.setStorageSync('searchHistoryList', this.searchHistoryList)
+				 }
+				 
+				 this.loadEnd = false
+				 this.loadText = '加载中...'
+				 this.list = []
+				 this.pageNo = 1
+				 this.getList()
+			},
+			// 滚动到底部
+			reachBottom() {
+				if(!this.loading && !this.loadEnd){
+					this.pageNo++
+					this.getList()
+				}
+			},
+			// 列表查询
+			getList(){
+				this.loading = true
+				queryPromoProductByPage({
+					pageNo: this.pageNo,
+					pageSize: this.pageSize,
+					queryWord: this.queryWord,
+					promoActiveSn: '693459699332595712'
+				}).then(res => {
+					this.loading = false
+					if(res.status == 200){
+						this.total = res.data.count
+						if(this.total){
+							const list = res.data.list || []
+							const ret = []
+							// 更新已选状态
+							list.forEach(k => {
+							  ret.push({
+								  id: k.id,
+								  cost: k.cost,
+								  productCode: k.productCode,
+								  productSn: k.productSn,
+								  productImage: k.productImage,
+								  productName: k.productName,
+								  productOrigCode: k.productOrigCode,
+								  promoActiveSn: k.promoActiveSn,
+								  promoRuleSn: k.promoRuleSn,
+								  promoRuleValue: k.promoRuleValue,
+								  promoRuleType: k.promoRuleType,
+							  })
+							})
+							// 追加数据
+							this.list.push(ret)
+							// 判断是否最后一页
+							const maxPages = Math.ceil(this.total / this.pageSize)
+							if(this.pageNo >= maxPages){
+								this.loadEnd = true
+								this.loadText = '没有更多了'
+							}
+						}else{
+							this.loadEnd = false
+							this.loadText = '没有找到相关产品'
+						}
+					}else{
+						this.loadEnd = false
+						this.loadText = res.message
+					}
+				}).catch(err => {
+					this.loading = false
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="less">
+.pages{
+	height: 100vh;
+	display: flex;
+	flex-direction: column;
+	.scrollPage-header{
+		z-index: 1;
+		.header-title{
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			padding: 0 10px;
+			height: 44px;
+			background-color: #FFFFFF;
+			box-shadow: 0px 1px 0px 0px #E6E6E6;
+			.header-title{
+				font-size: 16px;
+				color: #333333;
+				max-width: 70%;
+			}
+			.header-left{
+				display: flex;
+				align-items: center;
+				text{
+					font-size: 14px;
+					color: #333333;
+					margin-left: 5px;
+				}
+			}
+			.header-right{
+				width: 50px;
+			}
+		}
+	}
+	.search-result{
+		flex-grow: 1;
+		display: flex;
+		justify-content: space-between;
+		.tab-left{
+			width: 25%;
+			flex-grow: 1;
+			background: #FFFFFF;
+			.item-clz{
+				font-size: 14px;
+				padding: 8px 10px;
+				line-height: 30px;
+			}
+			.active{
+				border-left: 3px solid #00aaff;
+				background: #f8f8f8;
+			}
+		}
+		.right-box{
+			width: 75%;
+			.scrollPage-body{
+				width:100%;
+				.search-head input{
+					background-color: #FFFFFF;
+				}
+				.loading-bar{
+					text-align: center;
+					padding: 10px 0;
+					color: #999999;
+				}
+				.empty-bar{
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					justify-content: center;
+					padding: 20px 0;
+					image{
+						width: 100px;
+						height: 100px;
+					}
+					view{
+						font-size: 12px;
+						color: #999999;
+					}
+				}
+				.search-history{
+					padding: 0 1.5rem;
+					.search-history-title{
+						display: flex;
+						align-items: center;
+						justify-content: space-between;
+						padding: 6px 0;
+						font-size: 14px;
+						color: #333333;
+						border-bottom: 1px solid #E6E6E6;
+					}
+					.search-history-body{
+						display: flex;
+						flex-wrap: wrap;
+						align-items: center;
+						justify-content: space-between;
+						padding: 10px 10px;
+						.item{
+							padding: 6px 0;
+							background-color: #f8f8f8;
+							border-radius: 20px;
+							font-size: 12px;
+							color: #333333;
+							width: 46%;
+						}
+					}
+				}
+			}
+		}
+	}
+}
+</style>

+ 0 - 0
pages/videos/detail.vue → pagesB/videos/detail.vue


+ 240 - 0
pagesB/videos/index.vue

@@ -0,0 +1,240 @@
+<template>
+	<view class="video-pagesCons">
+		<view class="tab-body">
+			    <view>
+					<u-tabs-swiper ref="uTabs" :list="tabList" :offset="[5,40]" bar-width='100' active-color="#1283d4" name="dispName" :current="current" @change="tabsChange" :is-scroll="false"
+					 swiperWidth="750"></u-tabs-swiper>
+				</view>
+				<swiper class="check-list" :current="swiperCurrent" @transition="transition" @change="swiperChange" @animationfinish="animationfinish">
+					<swiper-item class="swiper-item" style="height: 100%;width: 100%;overflow: hidden;" v-for="(tabs, indexs) in tabList" :key="indexs">
+						<scroll-view scroll-y style="height: 100%;width: 100%;overflow: auto;" @scrolltolower="onreachBottom">
+							<view  
+							class="check-order-list" 
+							v-for="(item,index) in list" 
+							:key="item.id" 
+							 @click="viewRow(item)"
+							>
+								<view class="video-item">
+									<view>
+										<view class="play-btn" v-if="!item.showVideo&&item.contentType == 'VIDEO'">
+											<u-icon size="24" color="#fff" name="play-right-fill"></u-icon>
+										</view>
+										<view class="pnums" v-if="!item.showVideo&&item.contentType == 'VIDEO'">
+											<u-icon size="30" color="#fff" name="eye-fill"></u-icon>
+											{{item.viewNum}}
+										</view>
+										<u-image :src="item.imageSet[0]" height="200px" width="100%"></u-image>
+									</view>
+									<view class="ellipsis-two">{{item.titile}}</view>
+								</view>
+							 </view>
+							 <view style="padding: 20upx;">
+								 <u-empty :src="`/static/nodata.png`" icon-size="180" :text="noDataText" img-width="120" v-if="list.length==0 && status!='loading'" mode="list"></u-empty>
+								 <u-loadmore v-if="(total>=list.length&&list.length)||status=='loading'" :status="status" />
+							 </view>
+						</scroll-view>
+					</swiper-item>
+				</swiper>
+		</view>
+	</view>
+</template>
+
+<script>
+	import {
+	    mapState,
+	    mapMutations,
+	} from 'vuex'
+	import { getVideoList, videoDetail } from "@/api/video.js"
+	import { openWebView } from "@/utils/index.js"
+	export default {
+		data() {
+			return {
+				status: 'loading',
+				noDataText: '暂无数据',
+				current: 0,
+				swiperCurrent: 0,
+				// 查询条件
+				pageNo: 1,
+				pageSize: 10,
+				list: [],
+				total: 0,
+				videoObj:null
+			}
+		},
+		computed: {
+			...mapState(['hasLogin','vuex_videoTypeList']),
+			userInfo(){
+				return this.$store.state.vuex_userInfo
+			},
+			tabList(){
+				return this.$store.state.vuex_videoTypeList
+			}
+		},
+		onLoad() {
+			this.pageInit()
+		},
+		// 页面卸载
+		onUnload() {
+			uni.$off('refashProm')
+		},
+		onHide() {
+			this.list.map(item => {
+				item.showVideo = false
+			})
+		},
+		methods: {
+			pageInit(){
+				this.total = 0
+				this.pageNo = 1
+				this.list = []
+				this.getRow()
+			},
+			// tabs通知swiper切换
+			tabsChange(index) {
+				this.swiperCurrent = index;
+			},
+			swiperChange(event){
+				console.log(event.detail)
+				this.list = []
+				this.status = "loading"
+			},
+			// swiper-item左右移动,通知tabs的滑块跟随移动
+			transition(e) {
+				let dx = e.detail.dx;
+				this.$refs.uTabs.setDx(dx);
+			},
+			// 由于swiper的内部机制问题,快速切换swiper不会触发dx的连续变化,需要在结束时重置状态
+			// swiper滑动结束,分别设置tabs和swiper的状态
+			animationfinish(e) {
+				let current = e.detail.current;
+				if(current != this.current){
+					this.$refs.uTabs.setFinishCurrent(current);
+					this.swiperCurrent = current;
+					this.current = current;
+					this.pageInit()
+				}
+			},
+			// scroll-view到底部加载更多
+			onreachBottom() {
+				console.log(this.list.length, this.total)
+				if(this.list.length < this.total){
+					this.pageNo += 1
+					this.getRow()
+				}else{
+					this.status = "nomore"
+				}
+			},
+			// 查询列表
+			getRow (pageNo) {
+			  let _this = this
+			  if (pageNo) {
+			    this.pageNo = pageNo
+			  }
+			  let params = {
+			    pageNo: this.pageNo,
+			    pageSize: this.pageSize,
+			  }
+			  params.category = this.tabList ? this.tabList[this.swiperCurrent].code : ''
+			  this.status = "loading"
+			  getVideoList(params).then(res => {
+				if (res.code == 200 || res.status == 204 || res.status == 200) {
+				  const list = res.data.list || []
+				  list.map(item => {
+					  item.showVideo = false
+				  })
+				  if(_this.pageNo>1){
+					  _this.list = _this.list.concat(list)
+				  }else{
+					  _this.list = list
+				  }
+				  _this.total = res.data.count || 0
+				} else {
+				  _this.list = []
+				  _this.total = 0
+				  _this.noDataText = res.message
+				}
+				_this.status = _this.total>=_this.list.length ? "nomore" : 'loadmore'
+			  })
+			},
+			// 详细页
+			viewRow(item){
+				if(item.contentType == 'VIDEO' && !item.showVideo){
+					// item.showVideo = true
+					videoDetail({id: item.id}).then(res => {
+						if(res.data){
+							item.viewNum = res.data.viewNum
+							this.list.splice()
+							uni.navigateTo({
+								url: "/pagesB/videos/detail?form=videoList&&title="+item.titile+"&&content="+item.content
+							})
+						}
+					})
+				}
+				if(item.contentType == 'LINK'){
+					openWebView({url:item.content})
+				}
+			},
+		}
+	}
+</script>
+
+<style lang="less">
+    page{
+		height: 100vh;
+	}
+	.video-pagesCons{
+		height: 100%;
+		display: flex;
+		flex-direction: column;
+		.tab-body{
+			.check-list{
+				height: calc(100vh - 126px);
+			}
+			.check-order-list{
+				background: #ffffff;
+				padding: 20upx;
+				margin: 25upx;
+				border-radius: 10upx;
+				box-shadow: 1px 1px 3px #EEEEEE;
+				.video-item{
+					> view{
+						&:first-child{
+							position: relative;
+							.play-btn{
+								width: 40rpx;
+								height: 40rpx;
+								background: rgba(0,0,0,0.35);
+								border-radius: 150rpx;
+								position: absolute;
+								top: 20rpx;
+								right:30rpx;
+								z-index: 100;
+								display: flex;
+								align-items: center;
+								justify-content: center;
+							}
+							.pnums{
+								position: absolute;
+								left:20rpx;
+								bottom: 20rpx;
+								background: rgba(0,0,0,0.35);
+								padding: 4rpx 10rpx;
+								border-radius: 50rpx;
+								display: flex;
+								align-items: center;
+								color:#fff;
+								z-index: 110;
+								font-size: 24rpx;
+							}
+						}
+						&:last-child{
+							text-align: center;
+							font-size: 36rpx;
+							margin: 20rpx 0 0;
+						}
+					}
+				}
+			}
+		}
+	}
+</style>

BIN
static/banner1.jpg


BIN
static/banner2.jpg


ファイルの差分が大きいため隠しています
+ 0 - 0
static/iconfont/iconfont.css


BIN
static/tab/tab_cart_normal.png


BIN
static/tab/tab_cart_pressed.png


BIN
static/tab/tab_personal_normal.png


BIN
static/tab/tab_personal_pressed.png


+ 1 - 1
store/index.js

@@ -92,7 +92,7 @@ const store = new Vuex.Store({
 				"pagePath": "/pages/morePage/morePage",
 				"iconPath": "/static/tab/tab_personal_normal.png",
 				"selectedIconPath": "/static/tab/tab_personal_pressed.png",
-				"text": "更多",
+				"text": "我的",
 				'customIcon': false,
 			}
 		]

この差分においてかなりの量のファイルが変更されているため、一部のファイルを表示していません