videoApp/src/renderer/components/Admin.vue

<!--管理界面-->
<template>
    <div class="containers">
        <!--主页-->
        <div
                :style="{
                position: 'relative',
                left:windowJson[0].Left+'px',
                top:windowJson[0].Top+'px',
                width:windowJson[0].Width + 'px',
                height:windowJson[0].Height + 'px',
                zIndex:windowJson[0].ZIndex,
                display:windowJson[0].IsVisibility ? 'block' : 'none',
                backgroundImage:windowJson[0].BackIcon ? 'url('+require(`../../../static/images/${windowJson[0].BackIcon}`)+')' : null,
                backgroundRepeat:'no-repeat',
                backgroundSize:'100% 100%',
                backgroundColor:`#${windowJson[0].BrackgroupStr ? windowJson[0].BrackgroupStr.slice(3) : null}`,
                margin:'0 auto',
            }"
        >
            <!--按钮-->
            <ButtonComponent />

            <!--大屏显示-->
            <BigShowComponent />

            <!--label标签-->
            <LabelComponent />

            <!--图片-->
            <ImageComponent />

            <!--信号源列表-->
            <SignalListComponent />

            <!--滑块-->
            <SliderComponent />

            <!--其他页面-->
            <!--<div v-for="item in windowJson"
                 :style="{
                    left:item.Left+'px',
                    top:item.Top+'px',
                    width:item.Width + 'px',
                    height:item.Height + 'px',
                    zIndex:item.ZIndex,
                    display:item.IsVisibility ? 'block' : 'none',
                    backgroundColor:`#${item.BrackgroupStr.slice(3)}`,
                    backgroundImage:item.BackIcon ? 'url('+require(`../../../static/images/${item.BackIcon}`)+')' : null,
                    backgroundRepeat:'no-repeat',
                    backgroundSize:'100% 100%',
                    margin:'0 auto',
                }"
            >
            </div>-->
        </div>

        <button class="logoutBtn" @click="logout">退出</button>
    </div>
</template>

<script>
    import {mapState} from 'vuex'
    import storageUtils from "../../utils/storageUtils"
    import '../assets/less/mainpage.less'

    import ButtonComponent from './Button'
    import LabelComponent from './Label'
    import BigShowComponent from './BigShow'
    import SignalListComponent from './SignalList'
    import ImageComponent from './Image'
    import SliderComponent from './Slider'
    import {reqLogout} from "../api"

    export default {
        components: {
            ButtonComponent,
            LabelComponent,
            BigShowComponent,
            SignalListComponent,
            ImageComponent,
            SliderComponent
        },

        data() {
            return {
                user: storageUtils.getUser(), // 本地存储的用户
            }
        },

        mounted() {

        },

        methods: {
            // 退出登录
            async logout() {
                await reqLogout(this.user)
                // 重置用户
                this.$store.dispatch('resetUser')
                // 去登录界面
                this.$router.replace('/login')
            }
        },

        computed: {
            ...mapState(['windowJson']),
        }
    }
</script>