liuhairui
/
xh-erp.7in6.com


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796
							<!DOCTYPE html>
<html>
<head>
    {include file="common/meta" /}
    <style type="text/css">
        * {
            box-sizing: border-box;
        }

        html, body {
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
            overflow: hidden;
        }

        body.login-page {
            height: 100vh;
            min-height: 100vh;
            max-height: 100vh;
            overflow: hidden;
            background: #eef2f8;
            color: #1f2937;
            font-family: "PingFang SC", "Microsoft YaHei", "Helvetica Neue", sans-serif;
            display: flex;
        }

        /* ========== 左侧（背景图 / 插画图后续替换下方 url） ========== */
        .login-brand {
            position: relative;
            z-index: 1;
            flex: 1 1 68%;
            min-width: 0;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: space-between;
            color: #fff;
            /* 背景图 bj.png */
            background-color: #1a3a6e;
            background-image: url('https://a-7in6-com.oss-cn-hangzhou.aliyuncs.com/xinhua/img/bj.png?v={$site.version|default='1.0.1'|htmlentities}');
            background-repeat: no-repeat;
            background-position: center center;
            background-size: cover;
            padding: clamp(28px, 4vh, 48px) clamp(28px, 4vw, 56px) clamp(20px, 3vh, 36px);
        }

        .login-brand::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.03) 48%, rgba(15, 35, 70, 0.08) 100%);
            pointer-events: none;
        }

        /* 中间内容：图标标题在上，插画在下（参考图二） */
        .login-brand-stage {
            position: relative;
            z-index: 2;
            flex: 1 1 auto;
            min-height: 0;
            width: 100%;
            max-width: 720px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 14px;
            margin: 8px 0;
        }

        .login-brand-header {
            position: relative;
            z-index: 2;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: center;
            text-align: left;
            gap: 16px;
        }

        .login-brand-logo {
            flex: 0 0 auto;
            width: 64px;
            height: 64px;
            border-radius: 14px;
            background: transparent;
            box-shadow: none;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
        }

        .login-brand-logo img {
            width: 100%;
            height: 100%;
            object-fit: contain;
        }

        .login-brand-text {
            min-width: 0;
            text-align: left;
        }

        .login-brand-title {
            margin: 0 0 6px;
            font-size: clamp(24px, 2.6vw, 34px);
            font-weight: 700;
            letter-spacing: 3px;
            line-height: 1.25;
        }

        .login-brand-sub {
            margin: 0;
            font-size: 12px;
            letter-spacing: 3px;
            color: rgba(210, 228, 255, 0.72);
            text-transform: uppercase;
        }

        /* 插画区域 ch.png：缩小并放在标题下方 */
        .login-brand-illust {
            position: relative;
            z-index: 1;
            flex: 0 1 auto;
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .login-brand-illust img {
            display: block;
            max-width: min(360px, 46%);
            max-height: min(26vh, 240px);
            width: auto;
            height: auto;
            object-fit: contain;
            pointer-events: none;
            user-select: none;
            opacity: 0.96;
        }

        .login-brand-features {
            position: relative;
            z-index: 2;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0;
            margin: 6px 0 0;
            padding: 0;
            list-style: none;
            flex-shrink: 0;
        }

        .login-brand-features li {
            display: flex;
            flex-direction: row;
            align-items: center;
            gap: 10px;
            min-width: 0;
            padding: 0 22px;
            font-size: 13px;
            color: rgba(235, 244, 255, 0.92);
            position: relative;
            white-space: nowrap;
        }

        .login-brand-features li + li::before {
            content: "";
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-50%);
            width: 1px;
            height: 22px;
            background: rgba(180, 210, 255, 0.28);
        }

        .login-brand-features .feat-icon {
            width: 30px;
            height: 30px;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.1);
            border: 1px solid rgba(210, 228, 255, 0.35);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #eef4ff;
            font-size: 13px;
            flex-shrink: 0;
        }

        .login-brand-footer {
            position: relative;
            z-index: 2;
            text-align: center;
            font-size: 12px;
            color: rgba(235, 244, 255, 0.72);
        }

        .login-brand-footer a {
            color: rgba(220, 235, 255, 0.58);
        }

        .login-brand-footer a:hover {
            color: #fff;
        }

        /* ========== 右侧登录（按设计稿红框区域） ========== */
        body.login-page .login-side {
            position: relative;
            z-index: 2;
            flex: 0 0 40% !important;
            width: 40% !important;
            min-width: 380px !important;
            max-width: 500px !important;
            height: 100vh !important;
            background: linear-gradient(180deg, #f8fbff 0%, #f1f5fb 100%) !important;
            display: flex !important;
            flex-direction: column !important;
            justify-content: stretch !important;
            align-items: stretch !important;
            padding: 0 48px !important;
            margin: 0 !important;
            box-shadow: -4px 0 24px rgba(15, 23, 42, 0.06);
            border-left: 1px solid #e2e8f0;
        }

        body.login-page .login-side-main {
            width: 100%;
            max-width: 340px;
            margin: 0 auto;
            flex: 1 1 auto;
            display: flex;
            flex-direction: column;
            justify-content: center;
            padding: 64px 0 28px;
        }

        body.login-page .login-side-head {
            margin-bottom: 36px;
            margin-top: 12px;
            text-align: center;
        }

        body.login-page .login-side-head h1 {
            margin: 0 0 10px;
            font-size: 32px !important;
            font-weight: 700 !important;
            color: #111827 !important;
            letter-spacing: 0.5px;
            line-height: 1.25;
            text-align: center;
        }

        body.login-page .login-side-head p {
            margin: 0;
            font-size: 13px !important;
            color: #9ca3af !important;
            line-height: 1.6;
            text-align: center;
        }

        body.login-page #login-form {
            width: 100%;
            margin: 0;
            padding: 0;
            background: transparent !important;
            box-shadow: none !important;
            border: none !important;
        }

        body.login-page #login-form .login-field {
            margin-bottom: 18px;
        }

        body.login-page #login-form .login-field-label {
            display: block;
            margin: 0 0 8px;
            font-size: 14px;
            font-weight: 500;
            color: #111827;
            line-height: 1.2;
            text-align: left;
        }

        body.login-page #login-form .login-input {
            position: relative;
        }

        body.login-page #login-form .login-input-icon {
            position: absolute;
            left: 12px;
            top: 50%;
            transform: translateY(-50%);
            width: 16px;
            height: 16px;
            pointer-events: none;
            z-index: 2;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        body.login-page #login-form .login-input-icon img {
            display: block;
            width: 16px;
            height: 16px;
            object-fit: contain;
        }

        body.login-page #login-form .form-control {
            height: 40px !important;
            border: 1px solid #e5e7eb !important;
            border-radius: 8px !important;
            box-shadow: none !important;
            font-size: 13px !important;
            color: #111827 !important;
            background: #ffffff !important;
            padding: 8px 14px 8px 36px !important;
            transition: border-color .2s ease, box-shadow .2s ease;
        }

        body.login-page #login-form .login-password-wrap .form-control {
            padding-right: 40px !important;
        }

        body.login-page #login-form .form-control:hover {
            border-color: #d1d5db !important;
        }

        body.login-page #login-form .form-control:focus {
            border-color: #818cf8 !important;
            box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12) !important;
            background: #ffffff !important;
            outline: none !important;
        }

        body.login-page #login-form .form-control::placeholder {
            color: #c0c6d0 !important;
        }

        body.login-page #login-form .btn-toggle-password {
            position: absolute;
            right: 10px;
            top: 50%;
            transform: translateY(-50%);
            border: none;
            background: transparent;
            padding: 2px;
            cursor: pointer;
            line-height: 1;
            z-index: 2;
            width: 24px;
            height: 24px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        body.login-page #login-form .btn-toggle-password img {
            display: block;
            width: 16px;
            height: 16px;
            object-fit: contain;
        }

        body.login-page #login-form .btn-toggle-password:hover {
            opacity: 0.8;
        }

        body.login-page #login-form .login-captcha-row {
            display: flex;
            gap: 10px;
            align-items: stretch;
        }

        body.login-page #login-form .login-captcha-row .login-input {
            flex: 1 1 auto;
            min-width: 0;
        }

        body.login-page #login-form .login-captcha-img {
            flex: 0 0 auto;
            height: 40px;
            border-radius: 8px;
            border: 1px solid #e5e7eb;
            overflow: hidden;
            background: #fff;
            cursor: pointer;
        }

        body.login-page #login-form .login-captcha-img img {
            display: block;
            height: 100%;
            width: auto;
            min-width: 110px;
        }

        body.login-page .login-form-extra {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin: 4px 0 22px;
            font-size: 13px;
        }

        body.login-page .login-form-extra label {
            margin: 0 !important;
            font-weight: normal !important;
            color: #6b7280 !important;
            cursor: pointer;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            user-select: none;
        }

        body.login-page .login-form-extra input[type="checkbox"] {
            margin: 0;
            width: 15px;
            height: 15px;
            accent-color: #4f46e5;
            vertical-align: middle;
        }

        body.login-page .login-form-extra .login-forgot {
            color: #9ca3af !important;
            text-decoration: none !important;
        }

        body.login-page .login-form-extra .login-forgot:hover {
            color: #6b7280 !important;
            text-decoration: underline !important;
        }

        body.login-page #login-form .form-group {
            margin-bottom: 0 !important;
        }

        body.login-page #login-form .btn-login-submit {
            height: 42px !important;
            width: 100% !important;
            border: none !important;
            border-radius: 8px !important;
            background: linear-gradient(90deg, #3b82f6 0%, #6366f1 45%, #8b5cf6 100%) !important;
            color: #fff !important;
            font-size: 16px !important;
            font-weight: 600 !important;
            letter-spacing: 3px;
            box-shadow: 0 12px 28px rgba(99, 102, 241, 0.32) !important;
            transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
            display: inline-flex !important;
            align-items: center;
            justify-content: center;
            gap: 10px;
            text-shadow: none !important;
            line-height: 1 !important;
        }

        body.login-page #login-form .btn-login-submit:hover,
        body.login-page #login-form .btn-login-submit:focus {
            color: #fff !important;
            filter: brightness(1.05);
            box-shadow: 0 14px 32px rgba(99, 102, 241, 0.4) !important;
            transform: translateY(-1px);
            background: linear-gradient(90deg, #3b82f6 0%, #6366f1 45%, #8b5cf6 100%) !important;
        }

        body.login-page #login-form .btn-login-submit:active {
            transform: translateY(0);
        }

        body.login-page #errtips {
            margin-bottom: 14px;
        }

        body.login-page .login-side-register {
            margin-top: 22px;
            text-align: center;
            font-size: 13px;
        }

        body.login-page .login-side-register a {
            color: #374151 !important;
            text-decoration: none !important;
        }

        body.login-page .login-side-register a:hover {
            color: #4f46e5 !important;
            text-decoration: none !important;
        }

        body.login-page .login-side-company {
            flex: 0 0 auto;
            padding: 0 0 28px;
            text-align: center;
            font-size: 12px;
            color: #9ca3af;
            letter-spacing: 0.2px;
        }

        /* 覆盖 FastAdmin 默认灰色登录底 */
        body.login-page {
            background: #0a1630 !important;
        }

        body.login-page .wrapper,
        body.login-page .content-wrapper,
        body.login-page .login-box,
        body.login-page .login-box-body {
            background: transparent !important;
            box-shadow: none !important;
            margin: 0 !important;
            padding: 0 !important;
            width: auto !important;
        }

        @media (max-width: 960px) {
            html, body {
                overflow-x: hidden;
                overflow-y: auto;
            }

            body.login-page {
                height: auto;
                min-height: 100vh;
                max-height: none;
                flex-direction: column;
                overflow-x: hidden;
                overflow-y: auto;
            }

            .login-brand {
                flex: 0 0 auto;
                min-height: 40vh;
                padding: 24px 20px 16px;
            }

            .login-brand-illust {
                min-height: 110px;
            }

            .login-brand-illust img {
                max-width: min(280px, 72%);
                max-height: 180px;
            }

            .login-brand-features li {
                min-width: 88px;
                padding: 0 14px;
                font-size: 12px;
            }

            body.login-page .login-side {
                flex: 1 1 auto !important;
                width: 100% !important;
                max-width: none !important;
                min-width: 0 !important;
                height: auto !important;
                min-height: 60vh;
                padding: 0 24px !important;
                border-radius: 20px 20px 0 0;
            }

            body.login-page .login-side-main {
                padding: 36px 0 20px;
            }

            body.login-page .login-side-company {
                padding-bottom: 24px;
            }
        }

        @media (max-width: 480px) {
            .login-brand-features {
                display: none;
            }

            .login-side {
                padding: 28px 18px 24px;
            }

            .login-side-head h1 {
                font-size: 24px;
            }
        }
    </style>
    <script>
        document.addEventListener('wheel', function (e) {
            if (e.ctrlKey) {
                e.preventDefault();
            }
        }, {passive: false});
        document.addEventListener('gesturestart', function (e) { e.preventDefault(); });
        document.addEventListener('gesturechange', function (e) { e.preventDefault(); });
        document.addEventListener('gestureend', function (e) { e.preventDefault(); });
    </script>
</head>
<body class="login-page">
    <section class="login-brand">
        <div class="login-brand-stage">
            <div class="login-brand-header">
                <div class="login-brand-logo">
                    <img src="https://a-7in6-com.oss-cn-hangzhou.aliyuncs.com/xinhua/img/tb.png?v={$site.version|default='1.0.1'|htmlentities}" alt="大数据协同系统"/>
                </div>
                <div class="login-brand-text">
                    <h2 class="login-brand-title">大数据协同系统</h2>
                    <p class="login-brand-sub">Big Data Collaborative System</p>
                </div>
            </div>

            <div class="login-brand-illust">
                <img src="https://a-7in6-com.oss-cn-hangzhou.aliyuncs.com/xinhua/img/ch.png?v={$site.version|default='1.0.1'|htmlentities}" alt=""/>
            </div>

            <ul class="login-brand-features">
                <li>
                    <span class="feat-icon"><i class="glyphicon glyphicon-dashboard"></i></span>
                    <span>数据看板</span>
                </li>
                <li>
                    <span class="feat-icon"><i class="glyphicon glyphicon-time"></i></span>
                    <span>流程管控</span>
                </li>
                <li>
                    <span class="feat-icon"><i class="glyphicon glyphicon-cog"></i></span>
                    <span>生产协同</span>
                </li>
            </ul>
        </div>

        <div class="login-brand-footer">
            Copyright @ 杭州可集达科技有限公司 2026-{:date('Y',time())} 版权所有
            {if $site.beian}<a href="https://beian.miit.gov.cn" target="_blank"> {$site.beian|htmlentities}</a>{/if}
        </div>
    </section>

    <aside class="login-side">
        <div class="login-side-main">
            <div class="login-side-head">
                <h1>欢迎回来</h1>
                <p>请输入账户登录大数据协同平台</p>
            </div>

            <form action="" method="post" id="login-form">
                <!--@AdminLoginFormBegin-->
                <div id="errtips" class="hide"></div>
                {:token()}

                <div class="login-field">
                    <div class="login-input">
                        <span class="login-input-icon">
                            <img src="https://a-7in6-com.oss-cn-hangzhou.aliyuncs.com/xinhua/img/5.png?v={$site.version|default='1.0.1'|htmlentities}" alt=""/>
                        </span>
                        <input type="text" class="form-control" id="pd-form-username" placeholder="请输入账号" name="username" autocomplete="username" value="" data-rule="{:__('Username')}:required;username"/>
                    </div>
                </div>

                <div class="login-field">
                    <div class="login-input login-password-wrap">
                        <span class="login-input-icon">
                            <img src="https://a-7in6-com.oss-cn-hangzhou.aliyuncs.com/xinhua/img/6.png?v={$site.version|default='1.0.1'|htmlentities}" alt=""/>
                        </span>
                        <input type="password" class="form-control" id="pd-form-password" placeholder="请输入密码" name="password" autocomplete="current-password" value="" data-rule="{:__('Password')}:required;length(4~30)"/>
                        <button type="button" class="btn-toggle-password" id="btn-toggle-password" title="显示/隐藏密码" aria-label="显示/隐藏密码"
                                data-eye-open="https://a-7in6-com.oss-cn-hangzhou.aliyuncs.com/xinhua/img/11.png?v={$site.version|default='1.0.1'|htmlentities}"
                                data-eye-close="https://a-7in6-com.oss-cn-hangzhou.aliyuncs.com/xinhua/img/10.png?v={$site.version|default='1.0.1'|htmlentities}">
                            <img src="https://a-7in6-com.oss-cn-hangzhou.aliyuncs.com/xinhua/img/11.png?v={$site.version|default='1.0.1'|htmlentities}" alt="显示密码"/>
                        </button>
                    </div>
                </div>

                {if $Think.config.fastadmin.login_captcha}
                <div class="login-field">
                    <div class="login-captcha-row">
                        <div class="login-input">
                            <span class="login-input-icon"><span class="glyphicon glyphicon-option-horizontal" aria-hidden="true"></span></span>
                            <input type="text" id="pd-form-captcha" name="captcha" class="form-control" placeholder="请输入验证码" data-rule="{:__('Captcha')}:required;length({$Think.config.captcha.length})" autocomplete="off"/>
                        </div>
                        <span class="login-captcha-img" title="点击刷新验证码">
                            <img src="{:rtrim('__PUBLIC__', '/')}/index.php?s=/captcha" height="40" alt="captcha" onclick="this.src = '{:rtrim('__PUBLIC__', '/')}/index.php?s=/captcha&r=' + Math.random();"/>
                        </span>
                    </div>
                </div>
                {/if}

                <div class="login-form-extra">
                    <label>
                        <input type="checkbox" id="remember-password" name="rememberpwd" value="1"/>
                        记住密码
                    </label>
                    <a href="javascript:;" class="login-forgot" onclick="Layer && Layer.msg ? Layer.msg('请联系管理员重置密码') : alert('请联系管理员重置密码'); return false;">忘记密码?</a>
                </div>

                <div class="form-group" style="margin-bottom:0;">
                    <button type="submit" class="btn btn-login-submit btn-lg btn-block">
                        登录
                        <span aria-hidden="true">→</span>
                    </button>
                </div>
                <!--@AdminLoginFormEnd-->
            </form>
        </div>

        <div class="login-side-company">浙江新华数码印务有限公司</div>
    </aside>

{include file="common/script" /}
<script>
(function () {
    var REMEMBER_KEY = 'xh_admin_remember_pwd';

    function loadRemember() {
        var $user = document.getElementById('pd-form-username');
        var $pass = document.getElementById('pd-form-password');
        var $cb = document.getElementById('remember-password');
        if (!$user || !$pass || !$cb) {
            return;
        }
        try {
            var raw = localStorage.getItem(REMEMBER_KEY);
            if (!raw) {
                return;
            }
            var data = JSON.parse(raw);
            if (data && data.username) {
                $user.value = data.username;
            }
            if (data && data.password) {
                $pass.value = data.password;
            }
            $cb.checked = true;
        } catch (e) {
        }
    }

    function saveRemember() {
        var $user = document.getElementById('pd-form-username');
        var $pass = document.getElementById('pd-form-password');
        var $cb = document.getElementById('remember-password');
        if (!$user || !$pass || !$cb) {
            return;
        }
        if ($cb.checked) {
            localStorage.setItem(REMEMBER_KEY, JSON.stringify({
                username: $user.value || '',
                password: $pass.value || ''
            }));
        } else {
            localStorage.removeItem(REMEMBER_KEY);
        }
    }

    loadRemember();

    var form = document.getElementById('login-form');
    if (form) {
        form.addEventListener('submit', function () {
            saveRemember();
        });
    }
    var cb = document.getElementById('remember-password');
    if (cb) {
        cb.addEventListener('change', function () {
            if (!cb.checked) {
                localStorage.removeItem(REMEMBER_KEY);
            }
        });
    }

    var btn = document.getElementById('btn-toggle-password');
    var input = document.getElementById('pd-form-password');
    if (!btn || !input) {
        return;
    }
    var eyeOpen = btn.getAttribute('data-eye-open') || '';
    var eyeClose = btn.getAttribute('data-eye-close') || '';
    btn.addEventListener('click', function () {
        var show = input.getAttribute('type') === 'password';
        input.setAttribute('type', show ? 'text' : 'password');
        var img = btn.querySelector('img');
        if (img) {
            img.src = show ? eyeClose : eyeOpen;
            img.alt = show ? '隐藏密码' : '显示密码';
        }
    });
})();
</script>
</body>
</html>