修改主页面设备示意图显示效果

zhangyong

2023-09-04 4e8d4f3b0fccc68364ea8655dfb60b015de2857e

修改主页面设备示意图显示效果

 CanadaMes-ui/src/views/home/index.vue

@@ -29,8 +29,13 @@


.el-main {

    padding: 3px;

    min-height: 40vh;

}



.el-footer {

    max-height: 60vh;

    padding: 0px;

    margin: 0px;

}

.green {

    background-color: green;

}

@@ -73,11 +78,13 @@
}



.block {

    width: 685px;

    height: 350px;

    min-height: 50vh;

    max-width: 100vw;  
    background-image: url('xmjc.png');

    background-size: contain;

    margin: 0 auto;

    margin: 0px;

    background-repeat:no-repeat ;

    background-size:100% 100%;

    background-attachment:local;

}

</style>

<template>

@@ -119,8 +126,7 @@
                </div>

            </div>

        </el-main>

        <el-footer>

            <div>

        <el-footer> 
                <div class="block" style="text-align: center;position: relative;">

                    <div style="display:flex;position: absolute;float:left;z-index: 999;top:71px;left:136px;">

                        <div :class="getStatusClass(item.state)" v-for="item in cagelist1" :key="item['date']"></div>

@@ -134,8 +140,7 @@
                    <div style="display:flex;position: absolute;float:left;z-index: 999;top:96px;left:366px;">

                        <div :class="getStatusClass(item.state)" v-for="item in cagelist4" :key="item['date']"></div>

                    </div>

                </div>

            </div>

                </div> 
        </el-footer>

    </el-container>

</template>