pad-app/components/sider-bar/slider-bar.vue

<template>
	<view class="sidebar">
		<navigator url="/pages/index/index" open-type="redirect">
			<view class="item" :class="path==1?'active':''">
				装船指令
			</view>
		</navigator>
		<navigator url="/pages/discharge/index" open-type="redirect">
			<view class="item" :class="path==2?'active':''">
				卸船指令
			</view>
		</navigator>
		<navigator url="/pages/shipWork/index" open-type="redirect">
			<view class="item" :class="path==3?'active':''">
				船舶作业
			</view>
		</navigator>
		<navigator url="/pages/quality/index" open-type="redirect">
			<view class="item" :class="path==4?'active':''">
				货物质量
			</view>
		</navigator>
		<navigator url="/pages/monitor/index" open-type="redirect">
			<view class="item" :class="path==5?'active':''">
				场位监控
			</view>
		</navigator>
	</view>
</template>
<script>
	export default {
		name: "footTab",
		props: {
			path: {
				type: [String || Number]
			},
		},
		onLoad() {

		},
		components: {},
		methods: {

		}
	};
</script>

<style lang="less" scoped>
	.sidebar {
		min-width: 100px;
		background-color: #f2f2f2;

		.item {
			height: 45px;
			line-height: 45px;
			text-align: center;
			color: #999999;
		}

		.active {
			color: #5573d7;
		}
	}
</style>