zhgdyunapp/components/footers/footers.vue

<template>
	<view class="footerBox">
		<!-- 
		:class="userInfo.accountType==5||userInfo.accountType==6 || userInfo.accountType==10?'footerBox2':''" -->
		<view @click="tabClick(item.plugin)" class="footerItem" :class="activeTab==item.plugin?'active':''"
			v-for="(item,index) in tabList" v-if="item.appShow==1" :key="index">
			<image class="tabIcon tabIcon1" mode="heightFix" :src="'/static/'+item.moduleIcon2+'.png'"></image>
			<image class="tabIcon tabIcon2" mode="heightFix" :src="'/static/'+item.moduleIcon+'.png'"></image>
			<view class="desc">
				{{item.appName}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: ['activeTab'],
		data() {
			return {
				tabList: [
						{
							appName: '首页',
							moduleIcon2: 'tabIcon-index',
							moduleIcon: 'tabIcon-index-active',
							plugin: 'projectEnd',
							appShow: 1
						},
						{
							appName: '我的',
							moduleIcon2: 'tabIcon-my2',
							moduleIcon: 'tabIcon-my2-active',
							plugin: 'my',
							appShow: 1
						}],
					userInfo: {
						accountType: 1
					},
					haveModuleList: []
					// activeTab: 0
				};
			},
			mounted() {
					// console.log(this.tabList)
					this.$forceUpdate()
				},
				created() {
					let that = this;
					setTimeout(function() {
						that.getModuleList();
					}, 200)
				},
				methods: {
					getModuleList() {
						var that = this
						this.sendRequest({
							url: "xmgl/baseModule/getModuleAndMenuList",
							data: {
								projectSn: JSON.parse(uni.getStorageSync('projectDetail')).projectSn,
								moduleType: 7,
								userId: JSON.parse(uni.getStorageSync('userInfo')).userId,
							},
							method: "post",
							success(result) {
								if (result.success) {
									that.haveModuleList = result.result.moduleList
									that.userInfo = JSON.parse(uni.getStorageSync('userInfo'))
									if (that.userInfo.accountType == 5 || that.userInfo.accountType == 6 || that
										.userInfo
										.accountType == 10) {
										let findInfo = that.haveModuleList.find(item => item.modulePath ==
											"/infoCenter/allInfo")
										if (findInfo) {
											that.tabList = [{
												appName: '消息',
												moduleIcon2: 'footerIcon1',
												moduleIcon: 'footerIcon2',
												plugin: 'mssage',
												appShow: 1
											}, {
												appName: '首页',
												moduleIcon2: 'tabIcon-index',
												moduleIcon: 'tabIcon-index-active',
												plugin: 'projectEnd',
												appShow: 1
											}, {
												appName: '我的',
												moduleIcon2: 'tabIcon-my2',
												moduleIcon: 'tabIcon-my2-active',
												plugin: 'my',
												appShow: 1
											}]
										}
										let findWorkSpace = that.haveModuleList.find(item => item.modulePath ==
											"/workSpace")
										if (findWorkSpace) {
											that.tabList = [ {
												appName: '首页',
												moduleIcon2: 'tabIcon-index',
												moduleIcon: 'tabIcon-index-active',
												plugin: 'projectEnd',
												appShow: 1
											}, {
												appName: '发起审批',
												moduleIcon2: 'submit-n',
												moduleIcon: 'submit',
												plugin: 'submit',
												appShow: 1
											}, {
												appName: '工作台',
												moduleIcon2: 'workspace-n',
												moduleIcon: 'workspace',
												plugin: 'workspace',
												appShow: 1
											}, {
												appName: '我的',
												moduleIcon2: 'tabIcon-my2',
												moduleIcon: 'tabIcon-my2-active',
												plugin: 'my',
												appShow: 1
											}]
										}
									} else if (that.COMPANY == 'sanjiang') {
										that.tabList.push({
											appName: '首页总览',
											moduleIcon2: 'sjjt_syzl',
											moduleIcon: 'sjjt_syzl-tab',
											plugin: 'projectManage',
											appShow: 1
										}, {
											appName: '我的',
											moduleIcon2: 'tabIcon-my',
											moduleIcon: 'tabIcon-my-select',
											plugin: 'my',
											appShow: 1
										})
									} else if (that.userInfo.accountType == 11) {
										// 供应商
										that.tabList.push({
											appName: '首页总览',
											moduleIcon2: 'sjjt_syzl',
											moduleIcon: 'sjjt_syzl-tab',
											plugin: 'supplierHome',
											appShow: 1
										}, {
											appName: '我的',
											moduleIcon2: 'tabIcon-my',
											moduleIcon: 'tabIcon-my-select',
											plugin: 'supplierMy',
											appShow: 1
										})
									} else {
										try {
											var moduleList = that.userInfo.menuAuthority.moduleList
											for (let i = 0; i < moduleList.length; i++) {
												if (moduleList[i].moduleType == 1) {
													that.tabList.push(moduleList[i])
												}
											}
										} catch (e) {
											//TODO handle the exception
										}
										that.tabList.push({
											appName: '我的',
											moduleIcon2: 'tabIcon-my',
											moduleIcon: 'tabIcon-my-select',
											plugin: 'my',
											appShow: 1
										})

									}
									console.log(result, 777888)
								}
							}
						})
					},
					tabClick(plugin) {
						console.log(plugin)
						switch (plugin) {
							case 'projectManage':
								uni.redirectTo({
									url: '../../pages/projectManage/projectManage'
								})
								break;
							case 'videoManage':
								if (this.userInfo.accountType == 5) {
									uni.redirectTo({
										url: '../../pages/videoManage/videoList?sn=' + that.userInfo.sn
									})
								} else {
									uni.redirectTo({
										url: '../../pages/areaTree/areaTree'
									})
								}
								break;
							case 'my':
								uni.redirectTo({
									url: '/pages/my/my'
								})
								break;
							case 'submit':
								uni.redirectTo({
									url: '/pages/submit/submit'
								})
								break;
							case 'workspace':
								uni.redirectTo({
									url: '/pages/workspace/workspace'
								})
								break;
							case 'supplierHome':
								uni.redirectTo({
									url: '/pages/supplier/supplier'
								})
								break;
							case 'supplierMy':
								uni.redirectTo({
									url: '/pages/supplier/my/my'
								})
								break;
							case 'personManage':
								uni.redirectTo({
									url: '../../pages/personManage/personManage'
								})
								break;
							case 'projectEnd':
								uni.redirectTo({
									url: '/pages/projectEnd/projectIndex/projectIndex'
								})
								break;
							case 'mssage':
								uni.redirectTo({
									url: '/pages/messageCenter/messageCenter'
								})
								break;
							case 'deviceManage':
								uni.redirectTo({
									url: '../../pages/deviceManage/deviceManage'
								})
								break;
							case 'markRoom':
								uni.redirectTo({
									url: '../../pages/markRoomManage/markRoomManage'
								})
								break;
							case 'messageTask':
								uni.redirectTo({
									url: '/pages/messageTask/messageTask'
								})
								break;
						}
					}
				}
		}
</script>

<style lang="scss" scoped>
	.footerBox {
		background-color: white;
		display: flex;
		width: 100%;
		position: fixed;
		height: 110rpx;
		bottom: 0;
		left: 0;
		z-index: 9999;
		border-top: 1px solid rgba(151, 151, 151, 0.15);
	}

	.footerItem {
		font-size: 12px;
		flex: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		text-align: center;
		color: rgba(148, 149, 173, 1);

		.tabIcon {
			width: fit-content;
			height: 35rpx;
		}

		.tabIcon2 {
			display: none;
		}

		&.active {
			color: $uni-color-primary;

			.tabIcon2 {
				display: inline-block;
			}

			.tabIcon1 {
				display: none;
			}
		}

		.desc {
			padding-top: 5rpx;
		}
	}
</style>