jhlapp/components/Tabbar/index.vue

<template>
	<u-tabbar :value="value" :list="tabbar_list" active-color="#4076D6" inactive-color="#B8C0C8" :border-top="false">
	</u-tabbar>
</template>

<script>
	import indexIcon from '../../static/Tar_bar_slices/index.png'
	import indexIconFill from '../../static/Tar_bar_slices/index-fill.png'
	import orderIcon from '../../static/Tar_bar_slices/order.png'
	import orderIconFill from '../../static/Tar_bar_slices/order-fill.png'
	import goodsIcon from '../../static/Tar_bar_slices/goods.png'
	import goodsIconFill from '../../static/Tar_bar_slices/goods-fill.png'
	import userIcon from '../../static/Tar_bar_slices/user.png'
	import userIconFill from '../../static/Tar_bar_slices/user-fill.png'
	import myIcon from '../../static/Tar_bar_slices/my.png'
	import myIconFill from '../../static/Tar_bar_slices/my-fill.png'
	export default {
		model: {
			props: 'value'
		},
		props: {
			value: {
				type: Number,
				default: 0
			}
		},
		computed: {
			tabbar_list() {
				let roleType = uni.getStorageSync('roleType')
				if (roleType == 2) {
					return [{
							iconPath: indexIcon,
							selectedIconPath: indexIconFill,
							text: '工作台',
							customIcon: false,
							pagePath: '/pages/index/index'
						}, {
							iconPath: userIcon,
							selectedIconPath: userIconFill,
							text: '客户',
							customIcon: false,
							pagePath: '/pages/customer/CustomerList'
						},
						{
							iconPath: myIcon,
							selectedIconPath: myIconFill,
							text: '我的',
							customIcon: false,
							pagePath: '/pages/user/index'
						}
					]
				}else {
					return [{
							iconPath: indexIcon,
							selectedIconPath: indexIconFill,
							text: '工作台',
							customIcon: false,
							pagePath: '/pages/index/index'
						},
						{
							iconPath: orderIcon,
							selectedIconPath: orderIconFill,
							text: '订单',
							customIcon: false,
							pagePath: '/pages/order/index'
						},
						{
							iconPath: goodsIcon,
							selectedIconPath: goodsIconFill,
							text: '商品',
							customIcon: false,
							pagePath: '/pages/goods/index'
						},
						{
							iconPath: userIcon,
							selectedIconPath: userIconFill,
							text: '客户',
							customIcon: false,
							pagePath: '/pages/customer/CustomerList'
						},
						{
							iconPath: myIcon,
							selectedIconPath: myIconFill,
							text: '我的',
							customIcon: false,
							pagePath: '/pages/user/index'
						}
					];
				}
				
			}
		}
	};
</script>

<style>
	.u-tabbar__content__item__text .u-line-1 {
		font-size: 20rpx !important;
	}
</style>