app-govern/pages/device/list.vue

<template>
    <Cn-page :loading="loading">
        <view slot="body">
            <view class="device-list device">
                <Cn-empty v-if="projectList.length == 0"></Cn-empty>
                <template v-else>
                    <uni-card
                        :title="item.name"
                        :sub-title="item.projectName"
                        :extra="item.mac"
                        padding="0"
                        v-for="(item, index) in projectList"
                        :key="index"
                        @click="jump(item)"
                        :thumbnail="deviceIcon(item.runStatus)"
                    >
                    </uni-card>
                    <uni-load-more status="nomore"></uni-load-more>
                </template>
            </view>
        </view>
    </Cn-page>
</template>
<script>
export default {
    data() {
        return {
            loading: false,
            current: 0,
            items: ['正常', '报警', '离线'],
            styleType: 'text',
            activeColor: '#007aff',
            content: [
                {
                    iconPath: '/static/add.png',
                    text: '添加 ',
                },
            ],
            projectList: [],
        }
    },
    methods: {
        deviceIcon(e) {
            let str = ''
            switch (e) {
                case 1:
                    str = '/static/device_bad.png'
                    break
                case 2:
                    str = '/static/device.png'
                    break
                default:
                    str = '/static/device.png'
                    break
            }
            return str
        },
        onClickItem(e) {
            this.current = e.currentIndex
        },
        jump(item) {
            uni.navigateTo({
                url: '/pages/device/APF/detail?id=' + item.id + '&isPrimaryUser=0',
            })
        },
        trigger(e) {
            if (e.index === 0) {
                uni.navigateTo({
                    url: '/pages/device/new',
                })
            }
        },
    },
    onLoad(options) {
        this.projectList = JSON.parse(decodeURIComponent(options.projectList))
        console.log(this.projectList);
        switch (options.type) {
            case 'alarmLineDevs':
                uni.setNavigationBarTitle({
                    title: '报警设备',
                })
                break
            case 'offLineDevs':
                uni.setNavigationBarTitle({
                    title: '离线设备',
                })
                break
        }
    },
}
</script>
<style lang="scss">
.device-list {
    padding-top: 20rpx;
    .header {
        position: sticky;
        top: 0;
        left: 0;
        z-index: 10;
        background: #fff;
        padding: 10rpx 20rpx 20rpx;
        box-shadow: 0 0 10rpx #eee;
    }
}
</style>