登录页修改

suerprisePlus

2024-10-17 78c7b6c6dfe40761e7b8eb60498f2eb73c0aaad1

登录页修改

 src/assets/logo/Login3.png

 src/assets/logo/ͼ²ã 3.png

 src/assets/logo/ÐÎ×´ 4.png

 src/assets/logo/ÐÎ×´ 5.png

 src/assets/logo/ÐÎ×´ 6.png

 src/views/login.vue

@@ -5,37 +5,46 @@
                <div class="logImg"></div>
            </div>

            <div class="titleItem">
            <!-- <div class="titleItem">
                <div class="logText">数字孪生智能配网巡检系统</div>
            </div>
            </div> -->
        </div>
        <div class="logContent">
            <div class="contFrom">
                <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
                    <!-- <div style="margin-bottom: 10px; font-size: 14px; font-family: '微软雅黑'; color: #f78e21">演示账号：fastbee 123456</div> -->
                    <el-form-item prop="username" >
                        <el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号">
                            <svg-icon slot="prefix" icon-class="user" class="input-icon" />
                    <el-form-item label="用户名"></el-form-item>
                    <el-form-item prop="username">
                        <el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="Admin">
                            <template slot="prefix">
                                <img src="../assets/logo/形状 4.png" alt="Custom Icon" style="width: 1rem; height: 1rem;">
                            </template>
                        </el-input>
                    </el-form-item>
                    <el-form-item label="密码"></el-form-item>
                    <el-form-item prop="password">
                        <el-input v-model="loginForm.password" type="password" auto-complete="off" placeholder="密码"
                            @keyup.enter.native="handleLogin">
                            <svg-icon slot="prefix" icon-class="password" class="input-icon" />
                            <template slot="prefix">
                                <img src="../assets/logo/形状 5.png" alt="Custom Icon" style="width: 1rem; height: 1rem;">
                            </template>
                        </el-input>
                    </el-form-item>
                    <el-form-item label="验证码"></el-form-item>
                    <el-form-item v-if="captchaOnOff" prop="code">
                        <el-input v-model="loginForm.code" auto-complete="off" placeholder="验证码" style="width: 63%"
                            @keyup.enter.native="handleLogin">
                            <svg-icon slot="prefix" icon-class="validCode" class="input-icon" />
                            <template slot="prefix">
                                <img src="../assets/logo/形状 6.png" alt="Custom Icon" style="width: 1rem; height: 1rem;">
                            </template>
                        </el-input>

                        <div class="login-code">
                            <img :src="codeUrl" @click="getCode" />
                        </div>
                    </el-form-item>
                    <el-checkbox v-model="loginForm.rememberMe"
                        style="margin: 0px 0px 25px 0px; color: #000">记住密码</el-checkbox>
                    <el-checkbox v-model="loginForm.rememberMe" style="margin: 0px 0px 25px 0px;   font-family: Source Han Sans SC;
    color: #ffffff;">记住密码</el-checkbox>

                    <el-form-item style="width: 100%">
                        <div style="margin-bottom: 10px">
@@ -336,13 +345,13 @@
    // overflow: auto;
    width: 100%;
    position: absolute;
    background: url('../assets/logo/sdw.png') no-repeat;
    background: url('../assets/logo/图层 3.png') no-repeat;
    background-size: 100% 100%;


    .logoTitle {
        height: 266px;
        background: rgba(51, 132, 198, 1);
        height: 100%;
        background: #368ED5;
        width: 100%;
        z-index: -1;
        position: absolute;
@@ -353,12 +362,13 @@
            height: 100%;
            display: flex;
            align-items: center;
            height: 266px;
        }

        .logImg {
            width: 89px;
            height: 89px;
            background: url('../assets/logo/logo2.png') no-repeat;
            width: 570px;
            height: 90px;
            background: url('../assets/logo/Login3.png') no-repeat;
            background-size: 100% 100%;
        }

@@ -381,6 +391,8 @@

        .contFrom {
            flex: 1;


        }

        .contMessage {
@@ -388,6 +400,8 @@
            display: flex;
            justify-content: center;
            line-height: 40px;
            font-family: Source Han Sans SC;
            color: #ffffff;
        }

    }
@@ -434,5 +448,20 @@
        }
    }

    ::v-deep .el-form-item__label {
        line-height: 0px !important;
        font-family: Source Han Sans SC;
        color: #ffffff;
        font-weight: 300;
        margin-top: 10px;
        font-size: 16px;
        line-height: 10px;
    }

    ::v-deep .el-button {
        background: transparent !important;
        border-color: #ffffff;
        height: 52px;
    }
}
</style>

 src/views/visualization/bottomMenu.vue

@@ -31,7 +31,7 @@
        return {
            menuOption: [
                {
                    name: '配网巡检',
                    name: '一体建模',
                    children: [
                        {
                            id: 'a1',
@@ -44,21 +44,24 @@
                        }
                    ]
                }, {
                    name: '配网运检',
                    name: '图模融合',
                    children: [{
                        id: 'a1',
                        name: '数据统计',
                        pid: 's2',
                    }]
                }, {
                    name: '灾害管理',
                    children: [{
                        id: 'a1',
                        name: '数据分析',
                        pid: 's3',
                    }]
                }, {
                    name: '数字线损',
                },
                
                // {
                //     name: '灾害管理',
                //     children: [{
                //         id: 'a1',
                //         name: '数据分析',
                //         pid: 's3',
                //     }]
                // }, 
                {
                    name: '配网运检',

                }
            ],

 src/views/visualization/index.vue

@@ -173,7 +173,7 @@
    }

    .leftMenu {
        width: 15%;
        width: 12%;
        top: 90px;
        left: 10px;
        height: calc(100% - 180px);
@@ -182,7 +182,7 @@
    }

    .rightMenu {
        width: 15%;
        width: 12%;
        top: 90px;
        right: 10px;
        height: calc(100% - 180px);

 src/views/visualization/list/chart.vue

@@ -116,6 +116,12 @@
            }
            const myChart = echarts.init(id);
            var option = {
                grid: {
                    left: "10%",
                    top: "10%",
                    right: "5%",
                    bottom: "25%",
                },
                title: {
                    text: "",
                    textStyle: {
@@ -163,7 +169,7 @@
            option && myChart.setOption(option);
        },
        setEchartChange(res) {
            


            this.roadItem = res.val[0]
            this.showEchart();
@@ -189,7 +195,7 @@
        color: #fff;
        width: 100%;
        height: 45px;
        line-height: 45px;
        line-height: 30px;
        background-size: 100% 100%;
        background-repeat: no-repeat;
    }

 src/views/visualization/list/chart1.vue

@@ -117,6 +117,12 @@
            }
            const myChart = echarts.init(id);
            var option = {
                grid: {
                    left: "10%",
                    top: "10%",
                    right: "5%",
                    bottom: "25%",
                },
                title: {
                    text: "",
                    textStyle: {
@@ -187,7 +193,7 @@
        color: #fff;
        width: 100%;
        height: 45px;
        line-height: 45px;
        line-height:30px;
        background-size: 100% 100%;
        background-repeat: no-repeat;
    }

 src/views/visualization/list/chart2.vue

@@ -117,7 +117,14 @@
            }
            const myChart = echarts.init(id);
            var option = {
                grid: {
                    left: "10%",
                    top: "10%",
                    right: "5%",
                    bottom: "20%",
                },
                title: {
                    
                    text: "",
                    textStyle: {
                        color: "white"
@@ -189,7 +196,7 @@
        color: #fff;
        width: 100%;
        height: 45px;
        line-height: 45px;
        line-height: 30px;
        background-size: 100% 100%;
        background-repeat: no-repeat;
    }

 src/views/visualization/list/chartList.vue

@@ -63,7 +63,7 @@
        color: #fff;
        width: 100%;
        height: 45px;
        line-height: 45px;
        line-height: 30px;
        background-size: 100% 100%;
        background-repeat: no-repeat;
    }
@@ -76,6 +76,7 @@
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        overflow: auto;

        .chartTd {
            width: 100%;
@@ -100,4 +101,24 @@

    }
}
/*滚动条整体样式*/
::-webkit-scrollbar {
  /*高宽分别对应横竖滚动条的尺寸*/
  width: 1px;
  height: 1px;
}

/*滚动条里面小方块*/
::-webkit-scrollbar-thumb {
  border-radius: 5px;
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  background: #409EFF;
}

/*滚动条里面轨道*/
::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  background: rgba(237, 237, 237, .1);
}
</style>

 src/views/visualization/list/chartList1.vue

@@ -66,7 +66,7 @@
        color: #fff;
        width: 100%;
        height: 45px;
        line-height: 45px;
        line-height: 30px;
        background-size: 100% 100%;
        background-repeat: no-repeat;
    }