{% extends "layout.html" %}
{% block content %}
<style type="text/css">
  .modify_password {
    background-color: #fff;
    margin: 15px;
    min-height: 500px;
  }

  .modify_password .bt-form {
    width: 380px;
  }

  .modify_password .header {
    font-size: 19px;
    margin-bottom: 15px;
  }

  .modify_password .bt-input-text {
    height: 40px !important;
    line-height: 40px !important;
    border-radius: 2px;
    width: 100% !important;
    font-size: 14px;
  }

  .modify_password_btn {
    width: 340px;
    height: 40px;
    background: #20a53a;
    background: linear-gradient(#20a53a, #189d32);
    box-shadow: inset 0 1px 2px #30ad42;
    color: #fff;
    text-shadow: #00851a 0 -1px 0;
    border: 1px solid #20a53a;
    text-align: center;
    font-size: 14px;
    color: #fff;
    border-radius: 3px;
    cursor: pointer;
  }

  .random_paw {
    position: absolute;
    top: 10px;
    right: 5px;
  }

  .bt-form {
    position: absolute;
    top: 120px;
    left: 50%;
    margin-left: -150px;
    padding: 40px 20px;
  }

  .bt-form .line {
    position: relative;
  }

  .bt-form input {
    margin-bottom: 10px;
  }
</style>
<div class="main-content pb55" style="min-height: 525px;">
  <div class="container-fluid modify_password">
    <div class="bt-form" style="text-align: center;">
      <span class="header" style="">当前面板密码已过期，请立即修改密码!</span>
      <div class="line" style="margin-top: 15px;">
        <input class="bt-input-text" type="text" name="password1" id="p1" value="" placeholder="新的密码"
          style="width:300px">
        <span title="随机密码" class="btn btn-success btn-sm random_paw" onclick="randPwd(16)">随机密码</span>
      </div>
      <div class="line">
        <input class="bt-input-text" type="text" name="password2" id="p2" value="" placeholder="重复输入密码，确认新的密码"
          style="width:300px">
      </div>
      <div>
        <button type="button" class="btn btn-success btn-sm modify_password_btn"
          onclick="modify_password()">修改密码</button>
      </div>
    </div>
  </div>
</div>
{% endblock %}
{% block scripts %}
{{ super() }}
<script type="text/javascript">
  function modify_password() {
    p1 = $("#p1").val();
    p2 = $("#p2").val();
    if (p1 == "" || p1.length < 8) {
      layer.msg(lan.bt.pass_err_len, {
        icon: 2
      });
      return
    }
    $.post("/config?action=setPassword", "password1=" + encodeURIComponent(p1) + "&password2=" + encodeURIComponent(p2),
      function (b) {
        if (b.status) {
          layer.msg(b.msg, {
            icon: 1
          });
          setTimeout(function () {
            location.href = "/"
          }, 3000)
        } else {
          layer.msg(b.msg, {
            icon: 2,
            time: 8000
          })
        }
      });
  }
</script>

{%endblock %}