From d35d2cc5bebe5424e2d1a288d16e6336888e3050 Mon Sep 17 00:00:00 2001
From: liutong <836164388@qq.com>
Date: Tue, 11 Mar 2025 12:20:17 +0800
Subject: [PATCH] =?UTF-8?q?feat(components):=20=E6=B7=BB=E5=8A=A0=E8=87=AA?=
 =?UTF-8?q?=E5=AE=9A=E4=B9=89=20Tabbar=20=E7=BB=84=E4=BB=B6=E5=B9=B6?=
 =?UTF-8?q?=E6=9B=B4=E6=96=B0=E9=A6=96=E9=A1=B5=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 新增 AQTabber 自定义 Tabbar 组件，支持不同用户类型显示不同菜单
- 更新学生端首页布局，添加 Tabbar 组件
- 新增教练端和销售端的首页页面结构
- 修改全局配置，移除默认 Tabbar 设置
---
 components/AQ/AQTabber.vue    | 137 +++++++++++++++++
 pages.json                    |  25 +--
 pages/coach/home/index.vue    | 281 ++++++++++++++++++++++++++++++++++
 pages/student/index/index.vue |  10 +-
 4 files changed, 426 insertions(+), 27 deletions(-)
 create mode 100644 components/AQ/AQTabber.vue
 create mode 100644 pages/coach/home/index.vue

diff --git a/components/AQ/AQTabber.vue b/components/AQ/AQTabber.vue
new file mode 100644
index 0000000..779fce8
--- /dev/null
+++ b/components/AQ/AQTabber.vue
@@ -0,0 +1,137 @@
+<!--底部Tabber组件-->
+<template>
+	<view class="main_box">
+    <fui-tabbar :tabBar="tabBar" :current="current" @click="openView"></fui-tabbar>
+	</view>
+</template>
+
+<script>
+  import fuiTabbar from "@/components/firstui/fui-tabbar/fui-tabbar.vue"
+	export default {
+    components:{
+      fuiTabbar
+    },
+		data() {
+			return {
+			  userType:'',//用户类型|1=教练,2=销售,3=学员
+        current:'0',
+        tabBar: []
+			};
+		},
+    onShow(){
+      //设置缓存
+      uni.setStorageSync('userType',1)
+      //获取缓存
+      this.userType = uni.getStorageSync('userType')
+      this.init()
+    },
+
+		methods: {
+      async init(){
+        switch (String(this.userType)){
+          case "1"://教练
+            this.tabBar = [
+              {
+                text: "首页",
+                urlPath:'pages/student/index/index',//自定义页面跳转路径
+                iconPath: "/static/images/tabbar/assembly_default_3x.png",
+                selectedIconPath: "/static/images/tabbar/assembly_selected_3x.png"
+              },
+              {
+                text: "课表",
+                urlPath:'pages/student/timetable/index',//自定义页面跳转路径
+                iconPath: "/static/images/tabbar/assembly_default_3x.png",
+                selectedIconPath: "/static/images/tabbar/assembly_selected_3x.png"
+              },
+              {
+                text: "班级",
+                urlPath:'pages/student/my/my',//自定义页面跳转路径
+                iconPath: "/static/images/tabbar/assembly_default_3x.png",
+                selectedIconPath: "/static/images/tabbar/assembly_selected_3x.png"
+              },
+              {
+                text: "我的",
+                urlPath:'pages/student/my/my',//自定义页面跳转路径
+                iconPath: "/static/images/tabbar/assembly_default_3x.png",
+                selectedIconPath: "/static/images/tabbar/assembly_selected_3x.png"
+              }
+            ]
+            break;
+          case "2"://销售
+            this.tabBar = [
+              {
+                text: "首页",
+                urlPath:'pages/student/index/index',//自定义页面跳转路径
+                iconPath: "/static/images/tabbar/assembly_default_3x.png",
+                selectedIconPath: "/static/images/tabbar/assembly_selected_3x.png"
+              },
+              {
+                text: "线索",
+                urlPath:'pages/student/my/my',//自定义页面跳转路径
+                iconPath: "/static/images/tabbar/assembly_default_3x.png",
+                selectedIconPath: "/static/images/tabbar/assembly_selected_3x.png"
+              },
+              {
+                text: "添加",
+                urlPath:'pages/student/my/my',//自定义页面跳转路径
+                iconPath: "/static/images/tabbar/assembly_default_3x.png",
+                selectedIconPath: "/static/images/tabbar/assembly_selected_3x.png"
+                midButton: true,
+                width: 96,
+                height: 96
+              },
+              {
+                text: "数据",
+                urlPath:'pages/student/my/my',//自定义页面跳转路径
+                iconPath: "/static/images/tabbar/assembly_default_3x.png",
+                selectedIconPath: "/static/images/tabbar/assembly_selected_3x.png"
+              },
+              {
+                text: "我的",
+                urlPath:'pages/student/my/my',//自定义页面跳转路径
+                iconPath: "/static/images/tabbar/assembly_default_3x.png",
+                selectedIconPath: "/static/images/tabbar/assembly_selected_3x.png"
+              }
+            ]
+            break;
+          case "3"://学员
+            this.tabBar = [
+              {
+                text: "首页",
+                urlPath:'pages/student/index/index',//自定义页面跳转路径
+                iconPath: "/static/images/tabbar/assembly_default_3x.png",
+                selectedIconPath: "/static/images/tabbar/assembly_selected_3x.png"
+              },
+              {
+                text: "课表",
+                urlPath:'pages/student/timetable/index',//自定义页面跳转路径
+                iconPath: "/static/images/tabbar/assembly_default_3x.png",
+                selectedIconPath: "/static/images/tabbar/assembly_selected_3x.png"
+              },
+              {
+                text: "我的",
+                urlPath:'pages/student/my/my',//自定义页面跳转路径
+                iconPath: "/static/images/tabbar/assembly_default_3x.png",
+                selectedIconPath: "/static/images/tabbar/assembly_selected_3x.png"
+              }
+            ]
+            break;
+        }
+      },
+
+      openView(e){
+        console.log('点击跳转',e)
+      },
+		}
+	}
+</script>
+
+<style lang="less" scoped>
+.fui-wrap {
+  //为防止标签栏遮住页面内容，页面底部需留白高度不低于标签栏高度。非Nvue端和头条小程序如果fixedHeight属性没有设置为true，则页面外层还需加入以下样式（或者在页面最底部加入`fui-safe-area` 组件）兼容异形屏：
+  /* #ifndef APP-NVUE */
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+  /* #endif */
+}
+</style>
diff --git a/pages.json b/pages.json
index 57d8446..a0b8229 100644
--- a/pages.json
+++ b/pages.json
@@ -46,30 +46,7 @@
 		
 		}
 	}],
-	"tabBar": {
-		"color": "#999999",
-		"selectedColor": "#60ba61",
-		"borderStyle": "white",
-		"backgroundColor": "#fff",
-		"fontSize": "18px",
-		"iconWidth": "25px",
-		"list": [{
-			"pagePath": "pages/student/index/index",
-			"iconPath": "static/images/tabbar/home.png",
-			"selectedIconPath": "static/images/tabbar/home_selected.png",
-			"text": "首页"
-		}, {
-			"pagePath": "pages/student/timetable/index",
-			"iconPath": "static/images/tabbar/index.png",
-			"selectedIconPath": "static/images/tabbar/index_selected.png",
-			"text": "课表"
-		}, {
-			"pagePath": "pages/student/my/my",
-			"iconPath": "static/images/tabbar/my.png",
-			"selectedIconPath": "static/images/tabbar/my_selected.png",
-			"text": "我的"
-		}]
-	},
+
 	"share": {
 		"title": "用药提醒",
 		"imageUrl": "/static/images/home/tixing.png",
diff --git a/pages/coach/home/index.vue b/pages/coach/home/index.vue
new file mode 100644
index 0000000..180a71f
--- /dev/null
+++ b/pages/coach/home/index.vue
@@ -0,0 +1,281 @@
+<template>
+	<view>
+		<view class="top">
+			<view class="top_1">发现</view>
+			<view class="top_2" @click="publishing"><fui-icon name="plussign" size="80" fontWeight="Number"></fui-icon></view> 
+		</view>
+		<view style="position: relative;" class="middle" v-for="(item, index) in list" :key="index"  v-if="list.length > 0">
+			<view class="middles">
+				<view class="middles_1" v-if="item.headimg">
+					<image class="middles_1_img" :src="item.headimg"></image>
+				</view>
+				<view class="middles_1" v-else>
+					<image class="middles_1_img" src="/static/images/home/tixing.png"></image>
+				</view>
+				<view class="middles_2">
+					<view class="middles_info1">{{item.user}}</view>
+					<view class="middles_info2">{{item.timedifference}}</view>
+				</view>
+			</view>
+			<view class="shoucang" style="border: 5rpx #f8627f solid;color: #f8627f;" v-if="item.collections == 1" @click="collection(item.id,um_id)">收藏</view>
+			<view class="shoucang" style="border: 5rpx #ccc solid;" v-else @click="collection(item.id,um_id)">收藏</view>
+			<view @click="coninfo(item)" style="height: 300rpx;width: 100%;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;">
+				<view class="middles_con">
+					{{item.activity}}
+				</view>
+				<view class="middles_con" v-if="item.imagesnum!=0">
+					<view>
+						<view style="width: 32%;height: 200rpx;display: inline-block;margin:2rpx;" v-for="(item1, index) in item.images" :key="index">
+							<image :src="item1" style="width: 100%;height: 100%;"></image>
+						</view>
+					</view>
+				</view>
+				<view class="middles_con">
+					{{item.content}}
+				</view>
+			</view>
+			<view class="middles_con" style="font-size: 20rpx;color: #ccc;" @click="coninfo(item)">
+				点击内容查看详情
+			</view>
+			<view class="middles_bom">
+				<view class="middles_bom_1 middles_boms" v-if="item.area">{{item.area}}</view>
+				<view class="middles_bom_2 middles_boms">
+					<fui-icon name="fabulous-fill" color="#f8627f" size="45" @click="like(item.id,item.um_id)"></fui-icon>
+					{{item.likes}}
+				</view>
+				<view class="middles_bom_3 middles_boms" @click="Comment(item.id)">
+					<fui-icon name="comment-fill" color="#6281a6" size="45"></fui-icon>
+					{{item.comment}}
+				</view>
+			</view>
+			<view style="width: 100%;height: 20rpx;"></view>
+		</view>
+		<view class="empty" v-if="!list.length">
+			<view style="width: 200rpx;">
+				<img src="@/static/icon-img/kkry.png" alt="" style="width: 180rpx;height: 180rpx;">
+				<view style="font-size: 28rpx;font-weight: 800;color: #00be8c;">
+					还没有任何提醒
+				</view>
+			</view>
+		</view>
+		
+		<view style="width: 100%;height: 20rpx;"></view>
+	</view>
+</template>
+
+<script>
+	import user from '@/api/user.js';
+	import fuiIcon from "@/components/firstui/fui-icon/fui-icon.vue"
+	export default {
+		components:{
+				fuiIcon
+			},
+		data() {
+			return {
+				list:[],
+				likes:0,
+				type:1,
+				type1:1,
+				activity_id:0,
+				um_id:0,
+				urls:'http://medication.zeyan.wang/'
+			}
+		},
+		onLoad() {
+			const um_id = uni.getStorageSync('um_id');
+			this.um_id = um_id
+			if (um_id == '') {
+				uni.navigateTo({
+					url: '/pages/login/login'
+				})
+			}
+			this.fetchData(this.um_id)
+		},
+		methods: {
+			fetchData(um_id) {
+				user.activity_index({
+			      um_id: um_id
+			    }).then(res => {
+					console.log(res)
+					if(res.status == 200){
+						if(res.data == null){
+							this.list = []
+						}else{
+							this.list = res.data
+						}
+					}else{
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				});
+			},
+			onPullDownRefresh(){
+				this.fetchData(this.um_id)
+			},
+			publishing(){
+				uni.navigateTo({
+					url: '/pages/index/publishing'
+				})
+			},
+			like(id,um_id){
+				user.activity_like({um_id:um_id,activity_id:id,type:1}).then(res => {
+					if(res.status == 200){
+						user.activity_index({
+						  um_id: um_id
+						}).then(res => {
+							console.log(res)
+							if(res.status == 200){
+								this.list = res.data
+							}
+						});
+						this.type = res.data.type
+						this.activity_id = res.data.activity_id
+					}else{
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				});
+			},
+			collection(id,um_id){
+				user.activity_like({um_id:um_id,activity_id:id,type:2}).then(res => {
+					if(res.status == 200){
+						console.log(res)
+						this.fetchData(this.um_id)
+						this.type1 = res.data.type
+						this.activity_id = res.data.activity_id
+					}else{
+						uni.showToast({
+							title: res.msg,
+							icon: 'none'
+						})
+					}
+				});
+			},
+			coninfo(item){
+				// user.coninfo({id:id}).then(res => {
+				// 	if(res.status == 200){
+						uni.setStorageSync('coninfo', item);
+						uni.navigateTo({
+							url: '/pages/index/coninfo'
+						})
+					// }else{
+					// 	uni.showToast({
+					// 		title: res.msg,
+					// 		icon: 'none'
+					// 	})
+					// }
+				// });
+			},
+			Comment(id){
+				uni.setStorageSync('actid', id);
+				uni.navigateTo({
+					url: '/pages/index/Comment'
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+	.empty {
+		width: 100%;
+		display: flex;
+		flex-wrap: wrap;
+		justify-content: center;
+		height: 85vh;
+		align-items: center;
+	}
+	.top{
+		background-color: #fff;
+		height: 100rpx;
+		width: 100%;
+	}
+	.top_1{
+		display: inline-block;
+		font-size: 55rpx;
+		font-weight: bold;
+		margin-left: 30rpx;
+		line-height: 100rpx;
+	}
+	.top_2{
+		margin-left: 600rpx; 
+		position: absolute;
+		top: 15rpx;
+	}
+	.middle{
+		width: 95%;
+		background-color: #fff;
+		margin: auto;
+		margin-top: 20rpx;
+		border-radius: 10rpx;
+	}
+	.middles{
+		height: 150rpx;
+		/* background-color: aqua; */
+		margin-top: 20rpx;
+	}
+	.middles_1{
+		height: 100%;
+		width: 24%;
+		/* background-color: red; */
+		display: inline-block;
+	}
+	.middles_2{
+		width: 70%;
+		/* background-color: green; */
+		display: inline-block;
+		position: relative;
+		top: -15%;
+		left: 2%;
+	}
+	.middles_1_img{
+		width: 130rpx;
+		height: 130rpx;
+		margin-left: 12%;
+		border-radius: 100rpx;
+		margin-top: 6%;
+	}
+	.middles_info1{
+		font-size: 40rpx;
+		font-weight: bold;
+	}
+	.middles_info2{
+		color: #5e5e5e;
+	}
+	.middles_con{
+		width: 92%;
+		margin: 20rpx auto;
+		font-size: 30rpx;
+	}
+	.middles_bom{
+		padding: 30rpx 0 40rpx 25rpx;
+		position: relative;
+	}
+	.middles_boms{
+		display: inline-block;
+		color: #9297b2;
+	}
+	.middles_bom_2{
+		position: absolute;
+		right: 30%;
+	}
+	.middles_bom_3{
+		position: absolute;
+		right: 10%;
+	}
+	.shoucang{
+		position: absolute;
+		right: 10%;
+		top: 10%;
+		height: 60rpx;
+		width: 140rpx;
+		border-radius: 10rpx;
+		line-height: 54rpx;
+		text-align: center;
+	}
+	
+</style>
\ No newline at end of file
diff --git a/pages/student/index/index.vue b/pages/student/index/index.vue
index 180a71f..3b15403 100644
--- a/pages/student/index/index.vue
+++ b/pages/student/index/index.vue
@@ -60,16 +60,20 @@
 		</view>
 		
 		<view style="width: 100%;height: 20rpx;"></view>
+
+    <AQTabber></AQTabber>
 	</view>
 </template>
 
 <script>
 	import user from '@/api/user.js';
 	import fuiIcon from "@/components/firstui/fui-icon/fui-icon.vue"
+	import AQTabber from "@/components/AQ/AQTabber.vue"
 	export default {
-		components:{
-				fuiIcon
-			},
+    components: {
+      fuiIcon,
+      AQTabber
+    },
 		data() {
 			return {
 				list:[],