<template>
    <Cn-page :loading='loading'>
        <view slot='body'>
            <view class='index' :class="{ 'device': userInfo.role == '5' }">
                <uni-card title="监测网关" sub-title="监测" @click="look" thumbnail="/static/gateway.png"
                    :padding="userInfo.role == '5' ? 0 : '10px'">
                    <view class="footer" v-if="userInfo.role != 5">
                        <text style="flex:1"> </text>
                        <view class="footer-btn" @click.stop="newDevice">注册设备</view>
                        <view class="footer-btn ml20">查看</view>
                    </view>
                </uni-card>
                <uni-card title="用能网关" sub-title="用能" @click="look" thumbnail="/static/gateway.png"
                    :padding="userInfo.role == '5' ? 0 : '10px'">
                    <view class="footer" v-if="userInfo.role != 5">
                        <text style="flex:1"> </text>
                        <view class="footer-btn" @click.stop="newDevice">注册设备</view>
                        <view class="footer-btn ml20">查看</view>
                    </view>
                </uni-card>
                <uni-load-more status="nomore"></uni-load-more>
            </view>
        </view>
    </Cn-page>
</template>
<script>
export default {
    data () {
        return {
            loading: false,
            userInfo: {}
        }
    },
    onLoad (options) {
        this.userInfo = uni.getStorageSync('userInfo')
    },
    methods: {
        newDevice () {
            // uni.scanCode({
            //     success: function (res) {
            //         console.log('条码类型：' + res.scanType);
            //         console.log('条码内容：' + res.result);

            //     }
            // });
            uni.navigateTo({
                url: '/pages/gateway/newDevice'
            })
        },
        look () {
            uni.navigateTo({
                url: '/pages/gateway/detail'
            })
        }
    }
}
</script>
<style lang='scss'>
.index {
    padding-top: 20rpx;
    .footer {
        display: flex;
        justify-content: space-between;
        align-items: center;

        .footer-btn {
            padding: 0 20rpx;
            height: 50rpx;
            background-color: #007aff;
            font-size: 24rpx;
            color: #fff;
            text-align: center;
            line-height: 50rpx;
            border-radius: 10rpx;
        }
    }
}
</style>