<?php
/** @var yii\web\View $this */

use yii\helpers\Url;

$this->title = 'Change Password';
?>

<div class="page-title"><i class="fa fa-key"></i> Change Password</div>

<div class="lms-card" style="max-width:500px;">
    <div class="lms-card-header"><i class="fa fa-key"></i> Update Password</div>
    <div class="lms-card-body">
        <div id="cp-alert" style="display:none;" class="lms-alert"></div>

        <div style="margin-bottom:18px;">
            <label>Current Password</label>
            <div class="input-icon-wrap">
                <i class="fa fa-lock"></i>
                <input type="password" id="current_password" class="form-control" placeholder="Current password">
            </div>
        </div>

        <div style="margin-bottom:18px;">
            <label>New Password</label>
            <div class="input-icon-wrap">
                <i class="fa fa-lock"></i>
                <input type="password" id="new_password" class="form-control" placeholder="New password">
            </div>
        </div>

        <div style="margin-bottom:22px;">
            <label>Repeat New Password</label>
            <div class="input-icon-wrap">
                <i class="fa fa-lock"></i>
                <input type="password" id="repeat_password" class="form-control" placeholder="Repeat new password">
            </div>
        </div>

        <button id="btn-change-pwd" class="lms-btn lms-btn-primary">
            <i class="fa fa-save"></i> Update Password
        </button>
    </div>
</div>

<script>
$('#btn-change-pwd').on('click', function () {
    $.post('<?= Url::to(['site/change-password']) ?>', {
        <?= Yii::$app->request->csrfParam ?>: '<?= Yii::$app->request->csrfToken ?>',
        current_password : $('#current_password').val(),
        new_password     : $('#new_password').val(),
        repeat_password  : $('#repeat_password').val()
    }, function (res) {
        var $a = $('#cp-alert');
        if (res.status === 'success') {
            $a.attr('class', 'lms-alert lms-alert-success').html('<i class="fa fa-check-circle"></i> Password updated.').show();
        } else {
            $a.attr('class', 'lms-alert lms-alert-danger').html('<i class="fa fa-exclamation-circle"></i> ' + (res.message || 'Update failed.')).show();
        }
    }, 'json');
});
</script>
