修改

api/ProductList/ProductList.js

@@ -6,3 +6,11 @@ export function goodsList(pageSize,pageNum,goodsCategoryId,goodsName) {
 		method: 'GET'
 	})
 }
+
+//查询商品分类二级分类上边列表  小程序
+export function getGoodsCategoryNameList(goodsCategoryId) {
+	return request({
+		url: `/nurseApplet/nursingStationGoods/getGoodsCategoryNameList?goodsCategoryId=${goodsCategoryId}`,
+		method: 'GET'
+	})
+}

api/shopping/shopping.js

@@ -2,7 +2,7 @@ import request from "../request.js"
 
 export function goodsCategoryList(pageSize, pageNum) {
 	return request({
-		url: `/nurseApplet/nursingStationGoods/goodsCategoryList?pageSize=${pageSize}&pageNum=${pageNum}`,
+		url: `/nurseApplet/nursingStationGoods/goodsCategoryList?pageSize=${pageSize}&pageNum=${pageNum}&categoryLevel=${1}`,
 		method: 'GET'
 	})
 }

pages.json

@@ -332,6 +332,15 @@
 				"navigationBarBackgroundColor": "#ffffff"
 			}
 		}
+	    ,{
+            "path" : "pages/toptabbar/toptabbar",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "",
+                "enablePullDownRefresh": false
+            }
+            
+        }
     ],
 	"globalStyle": {
 		"navigationBarTextStyle": "black",

pages/ProductList/ProductList.vue

@@ -1,5 +1,8 @@
 <template>
 	<view class="app">
+		<top-tabbar :tabIndex="tabIndex" :tabBars="GoodsCategorychildrenlist" @toggleToptab="toggleTab"
+			selectedBottomColor="#30c58d" selectedTextColor="#343434" textColor="#7d7e80" bgColor="#ffffff">
+		</top-tabbar>
 		<view class="inputs">
 			<i class="icon"></i>
 			<input v-model="goodsName" type="text" name="" id="" class="input" placeholder="请输入商品名称">
@@ -31,12 +34,19 @@
 
 <script>
 	import {
-		goodsList
+		goodsList,
+		getGoodsCategoryNameList
 	} from '@/api/ProductList/ProductList.js';
 	import baseurl from '@/api/baseurl.js'
+	import topTabbar from '../toptabbar/toptabbar.vue'
 	export default {
+		components: {
+			topTabbar
+		},
 		data() {
 			return {
+				//将选中标签的索引绑定为tabIndex，以便后续的调用
+				tabIndex: 0,
 				baseurl: '',
 				title: '医路优品', //导航栏标题
 				pageNum: 1,
@@ -45,6 +55,8 @@
 				goodsList: [], //商品列表list
 				total: 0, //list总长度
 				goodsName: '',
+				GoodsCategorychildrenlist: [], //子分类list
+				GoodsCategorychildrenid: null,
 			};
 		},
 		watch: { //监听
@@ -60,14 +72,12 @@
 			var that = this
 			try {
 				const value = uni.getStorageSync('openid');
+				const value3 = uni.getStorageSync('Refresh');
 				if (value) {} else {
 					uni.navigateTo({
 						url: '/pages/login/login'
 					})
 				}
-			} catch (e) {}
-			try {
-				const value3 = uni.getStorageSync('Refresh');
 				if (value3) {
 					that.goodsListinfo();
 				}
@@ -78,10 +88,52 @@
 				this.title = options.title //导航栏标题
 			}
 			this.goodsCategoryId = options.goodsCategoryId //请求id
+			this.GoodsCategorychildrenid = options.goodsCategoryId //请求id
 			this.baseurl = baseurl;
 			this.goodsListinfo()
+			this.GoodsCategorychildren(this.goodsCategoryId);
 		},
 		methods: {
+			//点击导航栏标签改变当前索引
+			toggleTab(index) {
+				if (index == 1111111111111) {} else if (index == 0) {
+					this.GoodsCategorychildrenid = this.goodsCategoryId
+					this.tabIndex = index
+					this.pageNum = 1
+					goodsList(this.pageSize, this.pageNum, this.goodsCategoryId, this.goodsName).then(
+						res => {
+							if (res.code == 200) {
+								this.goodsList = res.rows
+								this.total = res.total
+							}
+							uni.removeStorageSync('Refresh');
+						})
+				} else {
+					this.GoodsCategorychildrenid = this.GoodsCategorychildrenlist[index].id
+					this.tabIndex = index
+					this.pageNum = 1
+					goodsList(this.pageSize, this.pageNum, this.GoodsCategorychildrenid, this.goodsName).then(
+						res => {
+							if (res.code == 200) {
+								this.goodsList = res.rows
+								this.total = res.total
+							}
+							uni.removeStorageSync('Refresh');
+						})
+				}
+			},
+			//根据父级分类id获取子分类
+			GoodsCategorychildren(value) {
+				getGoodsCategoryNameList(value).then(res => {
+					this.GoodsCategorychildrenlist = [{
+						goodsCategoryName: '全部',
+						id: 99999999999999999,
+					}]
+					res.data.forEach(e => {
+						this.GoodsCategorychildrenlist.push(e)
+					})
+				})
+			},
 			// 查询商品列表
 			goodsListinfo() {
 				this.pageNum = 1;
@@ -110,7 +162,7 @@
 		onReachBottom() { //下滑加载
 			if (this.goodsList.length >= this.total) {} else {
 				this.pageNum++;
-				goodsList(this.pageSize, this.pageNum, this.goodsCategoryId, this.goodsName).then(res => {
+				goodsList(this.pageSize, this.pageNum, this.GoodsCategorychildrenid, this.goodsName).then(res => {
 					if (res.code == 200) {
 						res.rows.forEach(e => {
 							this.goodsList.push(e)
@@ -121,7 +173,7 @@
 		},
 		onPullDownRefresh() { //下拉刷新
 			this.pageNum = 1;
-			goodsList(this.pageSize, this.pageNum, this.goodsCategoryId, this.goodsName).then(res => {
+			goodsList(this.pageSize, this.pageNum, this.GoodsCategorychildrenid, this.goodsName).then(res => {
 				this.goodsList = res.rows
 				this.total = res.total
 			})

pages/information/information.scss

@@ -176,6 +176,9 @@
 					display: inline-block;
 					height: 120rpx;
 					line-height: 120rpx;
+					white-space: nowrap;
+					  text-overflow: ellipsis;
+					  overflow: hidden;
 				}
 				
 				span {

pages/information/information.vue

@@ -28,11 +28,8 @@
 				<view class="address" style="">
 					{{query.locationName}}
 				</view>
-				<!-- <u-input type="text" placeholder='' /> -->
 			</view>
 		</view>
-		<!-- <u-select v-model="areashow" mode="mutil-column-auto" label-name='areaName' value-name='areaCode'
-			:list="arealist" @confirm="areaconfirm"></u-select> -->
 		<view class="">
 			<m-city style='z-index: 10076;' :provinceData="list" headTitle="地区选择" ref="cityPicker"
 				@funcValue="getpickerParentValue" pickerSize="4">
@@ -322,10 +319,6 @@
 				}
 			})
 		},
-		onUnload() {
-			// 页面卸载时设置插件选点数据为null，防止再次进入页面，geLocation返回的是上次选点结果
-			// chooseLocation.setLocation(null);
-		},
 	}
 </script>
 <style lang="scss">

pages/m-city/m-city.vue

@@ -91,6 +91,8 @@
 				var list = null
 				if (this.tabbars[this.tabbars.length - 1].localName == '请选择') {
 					list = this.tabbars.filter(e => e.localName != '请选择')
+				} else {
+					list = this.tabbars
 				}
 				this.$emit("funcValue", list);
 				this.hide();

pages/modifyAddress/modifyAddress.vue

@@ -167,25 +167,33 @@
 			// 三级地址联动回调
 			getpickerParentValue(e) {
 				this.addresslength = e
-				if (e) {
-					if (e.length == 4) {
-						this.infolist.address = e[0].localName + '-' + e[1].localName + '-' + e[2].localName + '-' + e[3]
-							.localName
-						this.infolist.areaCode = e[3].id
-					} else if (e.length == 3) {
-						this.infolist.address = e[0].localName + '-' + e[1].localName + '-' + e[2].localName
-						this.infolist.areaCode = e[2].id
-					} else if (e.length == 2) {
-						this.infolist.address = e[0].localName + '-' + e[1].localName
-						this.infolist.areaCode = e[1].id
-					} else if (e.length == 1) {
-						this.infolist.address = e[0].localName
-						this.infolist.areaCode = e[0].id
-					} else {
 				this.infolist.address = ''
 				this.infolist.areaCode = ''
+				if (e && e.length >= 1) {
+					e.forEach(el => {
+						this.infolist.address = this.infolist.address + el.localName
+					})
+					this.infolist.areaCode = e[e.length - 1].id
 				}
-				}
+				// if (e) {
+				// 	if (e.length == 4) {
+				// 		this.infolist.address = e[0].localName + '-' + e[1].localName + '-' + e[2].localName + '-' + e[3]
+				// 			.localName
+				// 		this.infolist.areaCode = e[3].id
+				// 	} else if (e.length == 3) {
+				// 		this.infolist.address = e[0].localName + '-' + e[1].localName + '-' + e[2].localName
+				// 		this.infolist.areaCode = e[2].id
+				// 	} else if (e.length == 2) {
+				// 		this.infolist.address = e[0].localName + '-' + e[1].localName
+				// 		this.infolist.areaCode = e[1].id
+				// 	} else if (e.length == 1) {
+				// 		this.infolist.address = e[0].localName
+				// 		this.infolist.areaCode = e[0].id
+				// 	} else {
+				// 		this.infolist.address = ''
+				// 		this.infolist.areaCode = ''
+				// 	}
+				// }
 			},
 			// 显示三级地址联动
 			showPicker() {
@@ -324,19 +332,15 @@
 				this.shipAddress = '修改地址'
 				this.isedit = false
 				nursingStationGoodsinfo(item.id).then(res => {
-					this.infolist = res.data
+					getSubordinate(res.data.areaCode).then(resp => {
-					getSubordinate(res.data.areaCode).then(res => {
+						if (resp.data.streetName) {
-						if (res.data.streetName) {
+							res.data.address = resp.data.provinceName + resp.data.cityName + resp.data
-							this.infolist.address = res.data.provinceName + '-' + res.data.cityName +
+								.regionName + resp.data.streetName
-								'-' +
-								res
-								.data.regionName + '-' + res.data.streetName
 						} else {
-							this.infolist.address = res.data.provinceName + '-' + res.data.cityName +
+							res.data.address = resp.data.provinceName + resp.data.cityName + resp.data
-								'-' +
+								.regionName
-								res
-								.data.regionName
 						}
+						this.infolist = res.data
 						this.show = true
 					})
 				})

pages/toptabbar/toptabbar.vue

@@ -0,0 +1,168 @@
+<template>
+	<view style="position: relative;">
+		<!--顶部导航栏-->
+		<view class="uni-top-tabbar">
+			<scroll-view scroll-x="true" class="uni-swiper-tab" :style="{backgroundColor:bgColor}">
+				<view v-for="(tabBar,index) in tabBars" :key="index" class="swiper-tab-list"
+					:class="{'active': tabIndex==index}" :style="{color:tabIndex==index?selectedTextColor:textColor}"
+					@tap="toggleTab(index)">
+					<view class="title">
+						{{tabBar.goodsCategoryName}}
+					</view>
+					<view class="swiper-tab-line"
+						:style="{backgroundColor:tabIndex==index?selectedBottomColor:bgColor}"></view>
+				</view>
+			</scroll-view>
+			<view class="fenlei" @tap='toggleTab(1111111111111)'>
+				<image src="../../static/fenlei.png" mode=""></image>
+				<view class="">
+					分类
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: "topTabbar",
+		props: {
+			//选中标签栏的索引
+			tabIndex: {
+				type: Number,
+				default: 0
+			},
+			//导航栏标签内容
+			tabBars: {
+				type: Array,
+				default: [{
+						goodsCategoryName: '标签1',
+						id: 1
+					},
+					{
+						goodsCategoryName: '标签2',
+						id: 2
+					},
+					{
+						goodsCategoryName: '标签3',
+						id: 3
+					},
+					{
+						goodsCategoryName: '标签4',
+						id: 4
+					},
+					{
+						goodsCategoryName: '标签5',
+						id: 5
+					},
+					{
+						goodsCategoryName: '标签6',
+						id: 6
+					}
+				]
+			},
+			//选中时底部横条颜色
+			selectedBottomColor: {
+				type: String,
+				default: '#30c58d'
+			},
+
+			//导航区背景颜色
+			bgColor: {
+				type: String,
+				default: '#ffffff'
+			},
+
+			//选中时文字颜色
+			selectedTextColor: {
+				type: String,
+				default: '#343434'
+			},
+
+			//默认文本颜色
+			textColor: {
+				type: String,
+				default: '#7d7e80'
+			}
+		},
+		data() {
+			return {}
+		},
+		methods: {
+			//点击导航栏标签触发
+			toggleTab(index) {
+				console.log(index)
+				this.$emit("toggleToptab", index)
+			}
+		}
+	}
+</script>
+<style lang="scss">
+	.fenlei {
+		width: 25%;
+		display: inline-block;
+		background-color: #fff;
+		line-height: 70rpx;
+		font-weight: normal;
+		height: 75rpx;
+		text-align: center;
+		color: #7d7e80;
+		position: absolute;
+		right: 0;
+		top: 0;
+
+		view {
+			position: absolute;
+			right: 25%;
+		}
+
+		image {
+			width: 40rpx;
+			height: 40rpx;
+			position: absolute;
+			left: 25%;
+			top: 50%;
+			transform: translateY(-55%);
+		}
+	}
+
+	.title {
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		width: 100%;
+	}
+
+	.uni-top-tabbar {
+		/* 以下3项设置用于开启底部阴影显示 */
+		/* position: relative;
+		z-index: 1;
+		overflow: visible; */
+		width: 75%;
+
+		.uni-swiper-tab {
+			height: 75rpx;
+			//设置底部阴影
+			//box-shadow: rgba(170, 170, 170, 0.5) 0 2rpx 8rpx 0;
+			white-space: nowrap;
+
+			.swiper-tab-list {
+				font-size: 28rpx;
+				font-weight: normal;
+				line-height: 70rpx;
+				//设置标签宽度
+				width: 25%;
+				text-align: center;
+				display: inline-block;
+			}
+
+			.active {
+				.swiper-tab-line {
+					height: 4rpx;
+					width: 80rpx;
+					margin: auto;
+				}
+			}
+		}
+	}
+</style>