页面

mini-pro-web/src/views/device/humidity/index.vue

@@ -3,7 +3,7 @@
        <div class='bgc-17b3ec ptb10 plr15 c-fff c-f14'>
            <div class='flex f_y_c f_x_s'>
                <span>设备实时湿度</span>
                <van-button plain size="small" type="info" class='tbtn'>获取</van-button>
                <van-button plain size="small" type="info" class='tbtn w60'>获取</van-button>
            </div>
            <div class='c-f20'>22°</div>
            <div class='mt10'>设备实时温度每10分钟会从设备端返回一次</div>

mini-pro-web/src/views/device/index.vue

@@ -62,10 +62,13 @@ export default{
        },
        stopSell(item){
        },
        initMain(){
        }
    },
    created(){
        this.initMain();
    }
}
</script>

mini-pro-web/src/views/device/temperature/index.vue

@@ -3,7 +3,7 @@
        <div class='bgc-17b3ec ptb10 plr15 c-fff c-f14'>
            <div class='flex f_y_c f_x_s'>
                <span>设备实时温度</span>
                <van-button plain size="small" type="info" class='tbtn'>获取</van-button>
                <van-button plain size="small" type="info" class='tbtn w60'>获取</van-button>
            </div>
            <div class='c-f20'>22°</div>
            <div class='mt10'>设备实时温度每10分钟会从设备端返回一次</div>

mini-pro-web/src/views/personal/switchAccount.vue

@@ -0,0 +1,68 @@
<template>
    <div class='switchAccount'>
        <div class='c-333 c-f14'>
            <div class='c-f20 c-t-center mt50 mb10'>轻触头像以切换账号</div>
            <van-swipe-cell class='mlr15' v-for='(item, index) in list'>
                <div class='mt10 c-border p15 bgc-fff flex f_x_s'>
                    <div class='flex f_y_c' style='flex: 1;width:0;'>
                        <div>
                            <van-image @click="switchAccount(item)" class='p-image' :src="item.photo?'':''"/>
                        </div>
                        <div class='ml15'>
                            <div class='mb5 c-f16'>{{item.name}}</div>
                            <span>{{item.phone}}</span>
                        </div>
                    </div>
                    <div class='c-20d7ad' v-if='index==0'>当前使用</div>
                </div>
                <template #right>
                    <van-button square text="清除" type="danger" class="delete-button" />
                </template>
            </van-swipe-cell>
            <div class='mt10 c-border p15 bgc-fff mlr15 flex f_y_c'>
                <div>
                    <!-- <van-image @click="addAccount()" class='p-image' src=""/> -->
                    <van-button icon="plus" class='p-image c-border bgc-fff c-17B3EC' type="text" />
                </div>
                <div class='c-f16 ml15'>添加账号</div>
            </div>
        </div>
    </div>
</template>
<script>
export default{
    name: 'switchAccount',
    data(){
        return {
            list: [
                {photo:'',name:'张三',phone:'15050505050'},
                {photo:'',name:'张二',phone:'15050505050'}
            ]
        }
    },
    methods:{
        switchAccount(item){
        },
        addAccount(){
        }
    },
    created(){
        
    }
}
</script>
<style scoped lang='scss'>
.switchAccount{
    .p-image{
        width: 45px;
        height: 45px;
        border-radius: 50%;
        overflow: hidden;
    }
    .delete-button{
        height: 100%;
    }
}
</style>