parking_inspection/pages/index/index.vue

<template>
	<view class="index">
		<!-- 欢迎 -->
		<view class="index-header">
			<view class="index-header-left">
				<view>欢迎登录!</view>
				<view>张三丰</view>
			</view>
			<view class="index-header-right" @click="jumpPage('pages/index/messageCenter/messageCenter')">
				<u-icon
					name="bell"
					color="#fff"
					size="24"></u-icon>
				<u-badge
					type="error"
					max="99"
					:absolute="true"
					:offset="[10, 14]"
					bgColor="#FD0A0A"
					:value="infoVal"></u-badge>
			</view>
		</view>
		<!-- 数据汇总 -->
		<view class="index-statistics">
			<view class="index-statistics-list">
				<view class="index-statistics-list-item" @click="jumpPage('pages/index/deviceList/deviceList')">
					<view>36</view>
					<view>设备总数</view>
				</view>
				<view class="index-statistics-list-item" @click="jumpPage('pages/index/deviceList/deviceList')">
					<view>10</view>
					<view>设备离线</view>
				</view>
				<view class="index-statistics-list-item" @click="jumpPage('pages/index/deviceList/deviceList')">
					<view>5</view>
					<view>设备异常</view>
				</view>
			</view>
		</view>
		<!-- 设备信息 -->
		<view class="index-device">
			<view class="index-device-info">
				<view class="index-device-info-title">设备信息</view>
				<view class="index-device-info-menu">
					<view class="item" @click="jumpPage('pages/index/chooseRoad/chooseRoad', { type: 1 })">
						<u--image
							class="image"
							src="../../static/icons/geomagnetism-icon.svg"
							width="48rpx"
							height="48rpx"
						></u--image>
						<view>地磁</view>
					</view>
					<view class="item" @click="jumpPage('pages/index/chooseRoad/chooseRoad', { type: 2 })">
						<u--image
							class="image"
							src="../../static/icons/parking-lock-icon.svg"
							width="48rpx"
							height="48rpx"></u--image>
						<view>车位锁</view>
					</view>
					<view class="item" @click="jumpPage('pages/index/chooseRoad/chooseRoad', { type: 3 })">
						<u--image
							class="image"
							src="./../../static/icons/railing-gate-icon.svg"
							width="48rpx"
							height="48rpx"></u--image>
						<view>栏杆道闸</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 考勤管理 -->
		<view class="index-device">
			<view class="index-device-info">
				<view class="index-device-info-title">考勤管理</view>
				<view class="index-device-info-menu">
					<view class="item" @click="jumpPage('pages/index/clockIn/clockIn')">
						<u--image
							class="image"
							src="./../../static/icons/clock-in-icon.png"
							width="48rpx"
							height="48rpx"></u--image>
						<view>打卡</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				infoVal: 3
			}
		},
		onShow() {
			uni.getStorage({
				key: 'Token',
				success: function(res) {
					console.log(res.data);
				},
				error: function(err) {
					console.log(err)
				},
				complete: (e) => {
					console.log(e)
					if (e.data) {
						
					} else {
						uni.$u.route({
							url: 'pages/login/login'
						})
					}
				}
			});
		},
		methods: {
			/**
			 * @param { String } url
			 * @param { Object } params
			 */
			jumpPage(url, params) {
				uni.$u.route({
					url, params
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import './index.scss';
</style>