登录

pages/home/home.vue

@@ -0,0 +1,110 @@
+<template>
+	<view class="content">
+		<view class="header">
+			<view class="header-item">
+				<text class="header-user">登录人员：{{userName}}</text>
+			</view>
+			<view class="header-item header-r">
+				<button class="header-button" @click="toExit">退&nbsp;&nbsp;出</button>
+			</view>
+		</view>
+		<view class="nav-wrap">
+			<view class="nav-item"><text class="nav-text" @click="toJump('/pages/equipStatus/equipStatus')">设备状态修改</text></view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				userName: this.$store.getters.userInfo ? JSON.parse(this.$store.getters.userInfo).id : ''
+			}
+		},
+		onLoad() {
+
+		},
+		methods: {
+			toJump(path) {
+				uni.navigateTo({
+					url: path
+				});
+			},
+			toExit () {
+				this.$store.dispatch('delUserInfo', '')
+				uni.redirectTo({
+					url: '/pages/login/login'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.content{
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: flex-start;
+	width: 100%;
+	height: 100%;
+}
+.header{
+	display: flex;
+	width: 100%;
+	height: 44px;
+	background-color: #d7592f;
+}
+.header-item {
+	width: calc(50% - 10px);
+	padding: 0 10px;
+}
+.header-user {
+	font-size: 16px;
+	line-height: 44px;
+	color: #ffffff;
+}
+.header-r{
+	display: flex;
+	justify-content: flex-end;
+	align-items: center
+}
+/deep/ .header-r uni-button{
+	margin-right: 0;
+}
+.header-button{
+	width: 80px;
+	height: 30px;
+	font-size: 16px;
+	color: #333333;
+	line-height: 30px;
+}
+.nav-wrap{
+	display: flex;
+	flex-wrap: wrap;
+	justify-content: flex-start;
+	align-content: center;
+	width: calc(100% - 40%);
+	height: calc(100% - 44px);
+	padding: 0 20%;
+}
+.nav-item{
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	width: 30%;
+	height: 100px;
+	background-color: #acbec6;
+	border-radius: 10px;
+	margin: 7.5px 5% 7.5px 0;
+}
+.nav-item:nth-child(3n){
+	margin-right: 0;
+}
+.nav-text{
+	font-size: 22px;
+	line-height: 30px;
+	color: #ffffff;
+	letter-spacing: 2px;
+}
+</style>