mj_firm_former/src/views/system/login/page.vue

<template>
    <div class="jbd-login-page-bg">
        <div class="official">
            <a href="https://www.mingjiantech.com" target="_blank">官网首页</a>
        </div>
        <el-container class="login-container" @keyup.enter="handleLogin">
            <!-- <el-header style="width: 100%">
             <div style="width: 100%; height: 93px; text-align: center; position: relative; top: 10%; overflow: hidden">
                <h1 class="login-info-title" style="font-size: 40px; color: #a73a3a">明鉴实验室信息管理系统</h1>
            </div>
        </el-header> -->

            <el-main
                style="width: 80%; height: 100%; overflow: hidden; border: 0px"
            >
                <div class="login-border">
                    <!--                <div class="animated fadeIn jbd-login-page-main-img"></div> -->

                    <div class="login-main animated fadeIn jbd-login-page-main">
                        <!-- <h3> -->
                        <!-- <span>{{ $t('login.userLogin') }}</span> -->
                        <div
                            class="logo-box"
                            style="width: 100%; margin: -0.0625rem"
                        >
                            <p>
                                <img
                                    src="../../../assets/images/login/bg.png"
                                    style="
                                        height: 80px;
                                        width: 387px;
                                        background-size: 100% 100%;
                                    "
                                />
                            </p>
                            <p class="txt">
                                欢迎登陆·明鉴细胞检测实验室信息管理系统
                            </p>
                        </div>
                        <ibps-api-base-url-controller
                            v-if="$nodeEnv === 'development'"
                        >
                            <el-tooltip
                                effect="dark"
                                :content="$t('navbar.switchEnvironment')"
                                placement="bottom"
                            >
                                <el-button
                                    type="text"
                                    class="ibps-fr ibps-mr-5 btn-text can-hover"
                                >
                                    <ibps-icon
                                        name="wifi"
                                        style="font-size: 18px"
                                    />
                                </el-button>
                            </el-tooltip>
                        </ibps-api-base-url-controller>
                        <!-- </h3> -->
                        <user-login />
                        <login-bottom />
                    </div>
                </div>
            </el-main>

            <!-- <span style="text-align: center;"> <a href="https://www.mingjiantech.com" target="_blank">>>返回首页</a></span> -->
            <el-footer style="width: 100%">
                <div class="footer">
                    <!-- <p>
                            <i style="margin-left: 50px;" class="el-icon-office-building"/> 深圳市明鉴细胞专业技术有限公司
                          <i style="margin-left: 20px;" class="el-icon-location-information"/> 深圳市南山区科技园高新北区源兴科技大厦东座303
                          <i style="margin-left: 20px;" class="el-icon-phone"/> 400-9919-863
                          <i style="margin-left: 20px;" class="el-icon-message"/> services@mingjiantech.com
                          <i class="el-icon-s-platform" /> 深圳市金源信通科技有限公司开发
                        </p> -->
                    <hr />
                    <span style="display: flex; justify-content: space-between">
                        <a
                            ><i class="el-icon-s-platform" />
                            深圳市金源信通科技有限公司开发</a
                        >
                        <a href="https://beian.miit.gov.cn" target="_blank"
                            >粤ICP备2022077950号</a
                        >
                        <a></a>
                        <!-- <a
                            href="https://www.mingjiantech.com"
                            style="text-align: right"
                            >官网首页&nbsp;&nbsp;&nbsp;&nbsp;</a
                        > -->
                    </span>
                </div>
            </el-footer>
        </el-container>
    </div>
</template>
<script>
import '@/assets/styles/pages/login.scss'
import LoginBottom from './login-bottom'
import UserLogin from './user-login'
import IbpsPluginLanguage from '@/plugins/language'
import IbpsApiBaseUrlController from '@/plugins/api-base-url'

export default {
    name: 'login',
    components: {
        LoginBottom,
        UserLogin,
        IbpsPluginLanguage,
        IbpsApiBaseUrlController
    },
    data() {
        const date = new Date()
        return {
            activeName: 'user',
            year: date.getFullYear()
        }
    },
    methods: {
        handleLogin() {}
    }
}
</script>
<style lang="scss">
.jbd-login-page-bg {
    margin-top: 0px;
    height: 100%;
    width: 100%;
    background-color: #f0f3f5;
    //background-image: url("../../../assets/images/login/MJ02.jpg");
    //background-repeat:no-repeat;
    //background-size:100% ;
}

.jbd-login-page-main {
    //margin-top: 140px;
    //margin-right: 40%;
    margin-bottom: 20px;
    //box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.1);
    padding: 30px;
    height: 400px;
    width: 460px;
    //background-image: url('../../../assets/images/login/03.png');
    background-size: 100%;
    background-repeat: no-repeat;
    //border-radius: 5%;
    //box-sizing: border-box;
    // border: solid black;

    //opacity:0.9;
}

.logo-box {
    width: 460px;
    height: 120px;
    margin: 0;
    //margin: 150px auto;
    position: relative;
}

.txt {
    font-family: '微软雅黑';
    font-size: 20px;
    line-height: 24px;
    font-weight: bold;
    color: grey;
    text-align: center;
}

.backindex {
    text-align: right;
    padding-right: 45px;
}

.backindexText {
    font-family: '微软雅黑';
    font-size: 16px;
    line-height: 16px;
    font-weight: bold;
    color: #a73a3a;
}

// .jbd-login-page-main-img {
//     /* box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); */
//     margin-top: 70px;
//     height: 520px;
//     width: 650px;
//     margin-right: 3%;
//     background-image: url('../../../assets/images/login/MJ_login0.jpg');
//     background-size: 100%;
//     background-repeat: no-repeat;
// }

.footer {
    font-size: 12px;
    text-align: center;

    a {
        // color: #000;
        width: 200px;
        color: #8c92a4;
    }
}

.official {
    margin-left: 10px;
    font-size: 26px;
    font-weight: bold;
    a {
        // color: #8c92a4;
        color: black;
    }
}
</style>