173 lines
		
	
	
		
			3.4 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			173 lines
		
	
	
		
			3.4 KiB
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <template>
 | |
| 	<view class="bottoms">
 | |
| 		<view class="box" :class="{active: aindex == 1}" @click="getgogo(1)">
 | |
| 			<view class="imgs">
 | |
| 				<image mode="aspectFit" src="@/static/icons/tabbar/home.png" v-show="aindex != 1"></image>
 | |
| 				<image mode="aspectFit" src="@/static/icons/tabbar/home-checked.png" v-show="aindex == 1"></image>
 | |
| 			</view>
 | |
| 			<view class="">首页</view>
 | |
| 		</view>
 | |
| 		<view class="box" :class="{active: aindex == 2}" @click="getgogo(2)">
 | |
| 			<view class="imgs">
 | |
| 				<image mode="aspectFit" src="@/static/icons/tabbar/order.png" v-show="aindex != 2"></image>
 | |
| 				<image mode="aspectFit" src="@/static/icons/tabbar/order-checked.png" v-show="aindex == 2"></image>
 | |
| 			</view>
 | |
| 			<view class="">订单</view>
 | |
| 		</view>
 | |
| 		<view class="box" :class="{active: aindex == 3}" @click="getgogo(3)">
 | |
| 			<view class="imgs">
 | |
| 				<image mode="aspectFit" src="@/static/icons/tabbar/my.png" v-show="aindex != 3"></image>
 | |
| 				<image mode="aspectFit" src="@/static/icons/tabbar/my-checked.png" v-show="aindex == 3"></image>
 | |
| 			</view>
 | |
| 			<view class="">我的</view>
 | |
| 		</view>
 | |
| 	</view>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| 	import request from '../../utils/request';
 | |
| 	import {
 | |
| 		getToken
 | |
| 	} from '@/utils/auth'
 | |
| 	export default {
 | |
| 		data() {
 | |
| 			return {
 | |
| 				aindex: 1,
 | |
| 				msgNum: null,
 | |
|         identity: 'user',
 | |
| 				nowPageInterval: null,
 | |
| 				arr: [{
 | |
| 						text: '首页'
 | |
| 					},
 | |
| 					{
 | |
| 						text: '消息'
 | |
| 					},
 | |
| 					{
 | |
| 						text: '运力'
 | |
| 					}
 | |
| 				]
 | |
| 			}
 | |
| 		},
 | |
| 		props: {
 | |
| 			msg: String|Number
 | |
| 		},
 | |
| 		onLoad() {
 | |
| 			console.log('tabbag', uni.getStorageSync('identity'));
 | |
| 
 | |
| 		},
 | |
| 		onUnload() {
 | |
| 			if (this.nowPageInterval) {
 | |
| 				clearTimeout(this.nowPageInterval);
 | |
| 			}
 | |
| 		},
 | |
| 		mounted() {
 | |
| 			// #ifdef APP || H5
 | |
| 			this.identity = uni.getStorageSync('identity');
 | |
| 			// #endif
 | |
| 			this.aindex = this.msg
 | |
| 
 | |
| 		},
 | |
| 		methods: {
 | |
| 			async getbottom() {
 | |
| 				if (!getToken()) {
 | |
| 					return
 | |
| 				}
 | |
| 				let res = await request({
 | |
| 					url: '/announcement/announcement/getOwnNoRead',
 | |
| 					method: 'get',
 | |
| 
 | |
| 				})
 | |
| 				console.log('jitiao', res);
 | |
| 				if (res.code == 200) {
 | |
| 					this.msgNum = res.data
 | |
| 				}
 | |
| 			},
 | |
| 			getgogo(index) {
 | |
| 
 | |
| 
 | |
| 				if (index == 1) {
 | |
| 					this.aindex = index
 | |
| 					uni.reLaunch({
 | |
| 						url: '/pages-home/home/home'
 | |
| 					})
 | |
| 				}
 | |
| 				if (index == 2) {
 | |
| 					this.aindex = index
 | |
| 					uni.reLaunch({
 | |
| 						url: '/pages-order/orderList/orderList'
 | |
| 					})
 | |
| 				}
 | |
| 				if (index == 3) {
 | |
| 					this.aindex = index
 | |
| 					uni.reLaunch({
 | |
| 						url: '/pages/my/my'
 | |
| 					})
 | |
| 				}
 | |
| 			}
 | |
| 		}
 | |
| 
 | |
| 	}
 | |
| </script>
 | |
| 
 | |
| <style scoped lang="scss">
 | |
| 	.bottoms {
 | |
| 		width: 100%;
 | |
| 		// position: fixed;
 | |
| 		// bottom: 0px;
 | |
| 		background: #fff;
 | |
| 		display: flex;
 | |
| 		justify-content: space-between;
 | |
| 		font-size: 14px;
 | |
| 		font-weight: 400;
 | |
| 		color: #FFFFFF;
 | |
| 		padding: 12rpx 40rpx;
 | |
| 		box-sizing: border-box;
 | |
| 		box-shadow: 4rpx 2rpx 12rpx 0 #c3c3c3;
 | |
| 		position: relative;
 | |
| 		z-index: 99;
 | |
| 	}
 | |
| 
 | |
| 	.box {
 | |
| 		flex: 1;
 | |
| 		width: 0;
 | |
| 		display: flex;
 | |
| 		flex-direction: column;
 | |
| 		align-items: center;
 | |
| 		justify-content: center;
 | |
| 		font-size: 12px;
 | |
| 		color: #929292;
 | |
| 
 | |
| 		&.active {
 | |
| 			color: #327DFB;
 | |
| 		}
 | |
| 	}
 | |
| 
 | |
| 	.imgs {
 | |
| 		margin: 0 auto;
 | |
| 		width: 50rpx;
 | |
| 		height: 50rpx;
 | |
| 
 | |
| 		image {
 | |
| 			width: 100%;
 | |
| 			height: 100%;
 | |
| 		}
 | |
| 	}
 | |
| 
 | |
| 	.hongdian {
 | |
| 		width: 12px;
 | |
| 		height: 12px;
 | |
| 		background-color: crimson;
 | |
| 		border-radius: 50%;
 | |
| 		overflow: hidden;
 | |
| 		position: absolute;
 | |
| 		top: -5px;
 | |
| 		right: -8px;
 | |
| 		z-index: 9999;
 | |
| 		display: flex;
 | |
| 		align-items: center;
 | |
| 		justify-content: center;
 | |
| 		color: white;
 | |
| 		font-size: 2px;
 | |
| 	}
 | |
| </style>
 |