IOT/SourceCode/ui/fbs-ui_app2/components/home-tabs/index.vue

<template>
	<view class="">
		<u-sticky bgColor="#fff">
			<u-tabs
				:list="tabList"
				:current="currentTab"
				:activeStyle="{
					color: '#303133',
					fontWeight: 'bold',
					transform: 'scale(1.05)',
				}"
				:lineWidth="tabLineWidth"
				:inactiveStyle="{
					color: '#606266',
					transform: 'scale(1)',
				}"
				@click="click"
			></u-tabs>
		</u-sticky>
	</view>
</template>
<script>
export default {
	data() {
		return {
			tabList: [
				{
					id: "over",
					name: "超标商户概览",
					badge: {
						value: 0,
					},
				},
				{
					id: "info",
					name: "商户设施概览",
				},
				{
					id: "po",
					name: "排放总量分析",
				},
				{
					id: "clean",
					name: "商户清洗分析",
					badge: {
						value: 0,
					},
				},
			],
			//currentTab: 0,
			tabLineWidth: "110",
		};
	},
	props: {
		currentTab: {
			type: Number,
			default: 0,
		},
	},
	mounted() {
		this.changeOverNum(this.$store.state.overNum);
	},
	methods: {
		click(e) {
			// #ifndef H5
			// switch (e.index) {
			// 	case 0:
			// 		uni.reLaunch({
			// 			url: "/pages/home/home",
			// 		});
			// 		break;
			// 	case 1:
			// 		uni.reLaunch({
			// 			url: "/pages_home/info",
			// 		});
			// 		break;
			// 	case 2:
			// 		uni.reLaunch({
			// 			url: "/pages_home/pollution",
			// 		});
			// 		break;
			// 	case 3:
			// 		uni.reLaunch({
			// 			url: "/pages_home/clean",
			// 		});
			// 		break;
			// }
			// #endif
			// #ifdef H5
			//this.$emit("changeIndex", e.index);
			//#endif
			this.$emit("changeIndex", e.index);
			//this.currentTab = e.index;
		},
		changeOverNum(num) {
			num = num || 0;
			const overTab = this.tabList.find(a => a.id == "over");
			overTab.badge.value = num;
		},
	},
};
</script>

<style>
.container {
	padding: 20px;
	font-size: 14px;
	line-height: 24px;
}
</style>