<template>
	<view>
		<u-tabbar :value="value1" :fixed="true" :placeholder="false" :safeAreaInsetBottom="false">
			<u-tabbar-item :badge="`${item.menuName === '工作待办' ? $store.state.mine.xiaoxi : 0}`"
				v-for="(item, index) in isMenu" :key="index" :text="item.menuName" :name="item.menuName"
				@click="click1(item.path)">
				<image v-if="item.menuName === '工作待办'" class="u-page item slot-icon" slot="active-icon"
					src="../../static/images/login/chat.png" style="height: 25px;width: 25px"></image>
				<image v-if="item.menuName === '首页'" class="u-page item slot-icon" slot="active-icon"
					src="../../static/images/login/user.png" style="height: 25px;width: 25px"></image>
				<image v-if="item.menuName === '工作待办'" class="u-page item slot-icon" slot="inactive-icon"
					src="../../static/images/login/chat.png" style="height: 25px;width: 25px"></image>
				<image v-if="item.menuName === '首页'" class="u-page item slot-icon" slot="inactive-icon"
					src="../../static/images/login/user.png" style="height: 25px;width: 25px"></image>
			</u-tabbar-item>
		</u-tabbar>
		<view style="height: 50px; width: 100%;"></view>
	</view>
</template>

<script>
	export default {
		name: 'tabbar',
		props: {
			value: {
				type: [Number, String]
			},
			xiaoxi: {
				type: [Number, String]
			}
		},
		onShow() {
			this.xiaoxi = this.$store.state.mine.xiaoxi;
		},
		data() {
			return {
				//菜单权限数组
				isMenu: this.$store.getters.saveMenu,
				//tabber颜色接收
				value1: this.$props.value
			};
		},
		methods: {
			click1(e) {
				this.$tab.reLaunch(e);
				//获取消息条数
				this.$store.dispatch('getNewsListOne');
			}
		}
	};
</script>

<style lang="scss">
	/deep/.u-tabbar--fixed {
		height: calc(45px + constant(safe-area-inset-bottom));
		height: 45px;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		/* 直接扩展高度，因为padding-bottom是内边距 */
		height: calc(45px + env(safe-area-inset-bottom));
		/* 直接扩展高度 */
		padding-bottom: constant(safe-area-inset-bottom);
		/*兼容 iOS<11.2 */
		padding-bottom: env(safe-area-inset-bottom);
		/* 兼容iOS>= 11.2*/
	}
</style>