{% extends "sqladmin/edit.html" %}

{% block content %}
  {{ super() }}

  <div class="card mt-3">
    <div class="card-body">
      <div class="row mb-3">
        <label class="form-label col-sm-2 col-form-label">服务账号密码</label>
        <div class="col-sm-10">
          <input id="connecthub-bind-password" class="form-control" type="password" autocomplete="new-password" placeholder="留空表示不修改；填写后将加密保存。">
          <div class="form-text">
            出于安全考虑，编辑页不回显历史密码。留空表示不修改；填写新密码将覆盖旧密码并加密落库。
          </div>
        </div>
      </div>
    </div>
  </div>
{% endblock %}

{% block tail %}
  {{ super() }}
  <script>
    (function () {
      // SQLAdmin 默认 edit 页面会渲染一个 form；这里将密码输入注入为隐藏字段，以便提交到后端。
      const form = document.querySelector("form");
      const password = document.getElementById("connecthub-bind-password");
      if (!form || !password) return;

      let hidden = form.querySelector('input[name="bind_password"]');
      if (!hidden) {
        hidden = document.createElement("input");
        hidden.type = "hidden";
        hidden.name = "bind_password";
        form.appendChild(hidden);
      }

      form.addEventListener("submit", function () {
        hidden.value = password.value || "";
      });
    })();
  </script>
{% endblock %}