<template> 
 | 
    <view class="box"> 
 | 
        <view class="box_head"> 
 | 
            <text>华晟智慧园区</text> 
 | 
            <text>安全重于泰山 服务追求卓越</text> 
 | 
        </view> 
 | 
        <view class="box_list"> 
 | 
            <view class="box_list_item" @click="jump(1)"> 
 | 
                <image src="@/static/ic_laifang@2x.png" mode="widthFix" /> 
 | 
            </view> 
 | 
            <view class="box_list_item" @click="jump(2)"> 
 | 
                <image src="@/static/ic_shenqing@2x.png" mode="widthFix" /> 
 | 
            </view> 
 | 
            <view class="box_list_item" @click="jump(3)"> 
 | 
                <image src="@/static/ic_renyuan@2x.png" mode="widthFix" /> 
 | 
            </view> 
 | 
            <view class="box_list_item" @click="jump(4)"> 
 | 
                <image src="@/static/ic_mima@2x.png" mode="widthFix" /> 
 | 
            </view> 
 | 
        </view> 
 | 
        <view class="box_btn">退出登录</view> 
 | 
    </view> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
    export default { 
 | 
  
 | 
        data() { 
 | 
            return { 
 | 
  
 | 
            } 
 | 
        }, 
 | 
  
 | 
        methods: { 
 | 
            jump(type) { 
 | 
                switch (type) { 
 | 
                    case 1: 
 | 
                        uni.navigateTo({ 
 | 
                            url: '/pages/notice/notice' 
 | 
                        }) 
 | 
                        break 
 | 
                    case 2: 
 | 
                        uni.navigateTo({ 
 | 
                            url: '/pages/applicationRecord/applicationRecord' 
 | 
                        }) 
 | 
                        break 
 | 
                    case 3: 
 | 
                        uni.navigateTo({ 
 | 
                            url: '/pages/personnel/personnel' 
 | 
                        }) 
 | 
                        break 
 | 
                    case 4: 
 | 
                        uni.navigateTo({ 
 | 
                            url: '/pages/changePassword/changePassword' 
 | 
                        }) 
 | 
                        break 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
    } 
 | 
</script> 
 | 
  
 | 
<style lang="scss" scoped> 
 | 
    .box { 
 | 
        width: 100%; 
 | 
        height: auto; 
 | 
        padding: 30rpx; 
 | 
        box-sizing: border-box; 
 | 
  
 | 
        .box_btn { 
 | 
            position: fixed; 
 | 
            bottom: 70rpx; 
 | 
            left: 50%; 
 | 
            transform: translate(-50%, 0); 
 | 
            width: 208rpx; 
 | 
            height: 72rpx; 
 | 
            line-height: 72rpx; 
 | 
            text-align: center; 
 | 
            border-radius: 36rpx; 
 | 
            border: 1rpx solid #999999; 
 | 
            font-size: 28rpx; 
 | 
            font-weight: 400; 
 | 
            color: #333333; 
 | 
        } 
 | 
  
 | 
        .box_head { 
 | 
            width: 100%; 
 | 
            height: 270rpx; 
 | 
            padding: 0 44rpx; 
 | 
            box-sizing: border-box; 
 | 
            background: #D8D8D8; 
 | 
            border-radius: 8rpx; 
 | 
            display: flex; 
 | 
            flex-direction: column; 
 | 
            text { 
 | 
                &:first-child { 
 | 
                    font-size: 44rpx; 
 | 
                    font-family: SourceHanSansSC, SourceHanSansSC; 
 | 
                    font-weight: bold; 
 | 
                    color: #FFFFFF; 
 | 
                    margin-top: 54rpx; 
 | 
                } 
 | 
                &:last-child { 
 | 
                    font-size: 28rpx; 
 | 
                    font-family: SourceHanSansSC, SourceHanSansSC; 
 | 
                    font-weight: 400; 
 | 
                    color: #FFFFFF; 
 | 
                    margin-top: 14rpx; 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
  
 | 
        .box_list { 
 | 
            width: 100%; 
 | 
            display: flex; 
 | 
            align-items: center; 
 | 
            flex-wrap: wrap; 
 | 
            justify-content: space-between; 
 | 
            margin-top: 40rpx; 
 | 
  
 | 
            .box_list_item { 
 | 
                width: 49%; 
 | 
                // height: 200rpx; 
 | 
                margin-bottom: 20rpx; 
 | 
  
 | 
                image { 
 | 
                    width: 100%; 
 | 
                    height: 100%; 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
    } 
 | 
</style> 
 |