<?php

/** @var yii\web\View $this */
/** @var yii\bootstrap5\ActiveForm $form */

/** @var app\models\LoginForm $model */

use yii\bootstrap5\ActiveForm;
use yii\bootstrap5\Html;

$this->title = 'Login';
$this->params['breadcrumbs'][] = $this->title;
?>
<div class="login-wrapper">
    <?php $form = ActiveForm::begin([
        'id' => 'login-form',
        'options' => [
            'class' => 'layui-form',
        ],
        'fieldConfig' => [
            'template' => "{label}\n{input}\n{error}",
            'labelOptions' => ['class' => 'col-lg-1 col-form-label mr-lg-3'],
            'inputOptions' => ['class' => 'col-lg-3 form-control'],
            'errorOptions' => ['class' => 'col-lg-7 invalid-feedback'],
        ],
    ]); ?>
        <h2 class="h2">线索管理</h2>
        <?= $form->field($model, 'username', [
            'options' => ['class' => 'layui-form-item layui-input-icon-group'],
            'template' => '
            <i class="layui-icon layui-icon-username"></i>
            {input}
            {error}
        ',
        ])->textInput([
            'autofocus' => true,
            'class' => 'layui-input',
            'placeholder' => '用户名',
        ])->label(false) ?>

        <?= $form->field($model, 'password', [
            'options' => ['class' => 'layui-form-item layui-input-icon-group'],
            'template' => '
            <i class="layui-icon layui-icon-username"></i>
            {input}
            {error}
        ',
        ])->passwordInput([
            'autofocus' => true,
            'class' => 'layui-input',
            'placeholder' => '密码',
        ])->label(false) ?>

        <div class="layui-form-item">
            <?= Html::submitButton('登陆', ['id' => 'loginBtn','class' => 'layui-btn layui-btn-fluid', 'name' => 'login-button']) ?>
        </div>
    <?php ActiveForm::end(); ?>
</div>
<script>
    let submitting = false;

    document.addEventListener('DOMContentLoaded', function () {
        const form = document.getElementById('login-form');
        const btn  = document.getElementById('loginBtn');
        const inputs = form.querySelectorAll('input[name="LoginForm[username]"], input[name="LoginForm[password]"]');

        if (!form || !btn) return;

        // 提交时锁定
        form.addEventListener('submit', function (e) {
            if (submitting) {
                e.preventDefault();
                return;
            }

            submitting = true;

            btn.disabled = true;
            btn.classList.add('layui-btn-disabled');
            btn.innerText = '登录中...';
        });

        // 输入变化时解锁
        inputs.forEach(function (input) {
            input.addEventListener('input', function () {
                submitting = false;
                btn.disabled = false;
                btn.classList.remove('layui-btn-disabled');
                btn.innerText = '登录';
            });
        });
    });
</script>

