Admin
2022-09-21 999cab6fb3fc6d2a288d365da991351c5a396bf0
src/views/riskWarningSys/warningBigScreen/index.vue
@@ -1,7 +1,8 @@
<template>
    <div id="container" class="dark">
        <div class="warn-dialog" :class="dialogShow">
            <div>预警消息:<p style="margin-top: 20px;font-size: 18px;line-height: 28px;text-align: left">企业8月份总体安全生产预警指数SPI风险值高于预警阈值,可能存在未处理隐患,请注意查阅相关风险因素,采取风险防控措施。</p></div>
            <div>预警消息</div>
            <p>企业8月份总体安全生产预警指数SPI风险值高于预警阈值,可能存在未处理隐患,请注意查阅相关风险因素,采取风险防控措施。</p>
            <span @click="dialogShow = 'hide'">关闭</span>
        </div>
        <div class="info-panel" :class="dialogHide"  @click="openDialog">
@@ -384,7 +385,13 @@
<style scoped lang="scss">
    $homeNavLengh: 8;
    .hide{
        display: none;
    }
    .showup{
        display: block;
    }
    .dark {
        width: 100%;
        height: 100%;
@@ -407,20 +414,27 @@
            transition: .3s;
            box-shadow: 0 15px 30px rgba(0,0,0,.2);
            border: 1px solid rgba(17,254,238,.4);
            padding: 40px;
            padding: 1.5rem;
            background: rgba(0,16,32,.8);
            div{
                font-size: 1.5rem;
                text-align: center;
            }
            p{
                margin-top: 20px;
                font-size: 1.125rem;
                line-height: 28px;
                text-align: left
            }
            span{
                position: inherit;
                right: 20px;
                top: 20px;
                font-size: 15px;
                font-size: 1rem;
                cursor: pointer;
            }
            div{
                font-size: 24px;
                text-align: center;
            }
        }
@@ -430,7 +444,7 @@
            right: 50px;
            bottom: 50px;
            z-index: 9999999;
            font-size: 16px;
            font-size: 1rem;
            padding: 0 10px;
            border-radius: 4px;
            cursor: pointer;
@@ -478,13 +492,7 @@
                background: #ff0000;
            }
        }
        .hide{
            display: none;
        }
        .showup{
            display: block;
        }
        .header-content {
            width: 100%;
            height: 7.8%;
@@ -704,7 +712,97 @@
        background-size: 100% 100%;
        color: #000;
        .warn-dialog{
            position: absolute;
            z-index: 999999;
            top: 25%;
            left: 50%;
            width: 50%;
            height: 50%;
            transform: translateX(-50%);
            border-radius: 8px;
            transition: .3s;
            box-shadow: 0 15px 30px rgba(0,0,0,.2);
            border: 1px solid #ccc;
            padding: 1.5rem;
            background: #fff;
            div{
                font-size: 1.5rem;
                text-align: center;
            }
            p{
                margin-top: 20px;
                font-size: 1.125rem;
                line-height: 28px;
                text-align: left
            }
            span{
                position: inherit;
                right: 20px;
                top: 20px;
                font-size: 1rem;
                cursor: pointer;
            }
        }
        .info-panel{
            position: absolute;
            width: 20%;
            right: 50px;
            bottom: 50px;
            z-index: 9999999;
            font-size: 1rem;
            color: #333;
            padding: 0 10px;
            border-radius: 4px;
            cursor: pointer;
            box-shadow: 0 15px 30px rgba(0,0,0,.2);
            border: 1px solid #ccc;
            background: #fff;
            .info-tit{
                display: flex;
                align-items: center;
                padding: 10px;
                border-bottom: 1px solid #ccc;
                justify-content: space-between;
                &>div{
                    display: flex;
                    align-items: center;
                    img{
                        width: 18px;
                        height: 18px;
                        margin-right: 10px;
                    }
                }
            }
            .info-desc{
                padding: 15px 10px;
                white-space: nowrap;
                text-overflow: ellipsis;
                overflow: hidden;
            }
            .info-num{
                position: inherit;
                width: 24px;
                height: 24px;
                line-height: 24px;
                text-align: center;
                left: -12px;
                top: -12px;
                color: #fff;
                z-index: 999999999;
                border-radius: 50%;
                border: 1px solid #ff0000;
                background: #ff0000;
            }
        }
        .header-content {
            width: 100%;