我有一个前端HTML配置表单，当复选框开关设置为1时，这意味着此配置是活动的，当它是0时，配置是不活动的，插入和更新按预期工作，只有当页面刷新时复选框开关的当前状态始终设置为启用，这是无论数据库值是1还是0，我如何纠正这一点？
复选框状态存储在configuration_status表中
我的PHP文件是：

<?php

require 'credentials/credentials.php';

// Retrieve the email designer configuration information from the database
$mysqli = new mysqli($host_name, $user_name, $password, $database);
if ($mysqli->connect_error) {
  error_log("Connection failed: " . $mysqli->connect_error);
  die("Connection failed: " . $mysqli->connect_error);
}

//get the current values from the database
$sql = "SELECT * FROM configurations WHERE key_name IN ('smtp_server', 'port_number', 'username', 'password')";
$result = $mysqli->query($sql);
$configurations = array();
while ($row = $result->fetch_assoc()) {
  $configurations[$row['key_name']] = $row['value'];
}

// Retrieve the checkbox state from the settings table
$sql = "SELECT * FROM configuration_status WHERE config_key = 'email-designer'";
$result = $mysqli->query($sql);
$settings = $result->fetch_assoc();
$config_enabled = $settings['config_enabled'];

// Close the database connection
$mysqli->close();

// Update the HTML with the retrieved values
$smtp_server_value = $configurations['smtp_server'] ?? '';
$port_number_value = $configurations['port_number'] ?? '';
$username_value = $configurations['username'] ?? '';
$password_value = $configurations['password'] ?? '';

// Check if config is enabled
if (isset($_POST['config-enabled']) && $_POST['config-enabled'] == 1) ? 1: 0{
  $config_enabled_checked = 'checked';
} else {
  $config_enabled_checked = $config_enabled ? 'checked' : '';
}

?>

我的HTML是

<form id="email-config-form" method="post" action="assets/php/email_config.php">
<div class="form-check form-switch">
    <label for="email-designer-enabled" class="form-check-label">Enable Email Designer</label>
    <input type="hidden" id="config-key" name="config-key" value="email-designer">
    <input type="checkbox" class="form-check-input" id="email-designer-enabled" name="config-enabled" value="1"<?php echo $config_enabled_checked; ?>>
</div>
<div class="form-group">
    <label for="smtp-server">SMTP Server:</label>
    <input type="text" class="form-control" id="smtp-server" name="smtp-server" value="<?php echo $configurations['smtp_server']; ?>">
</div>
<div class="form-group">
    <label for="port-number">Port Number:</label>
    <input type="text" class="form-control" id="port-number" name="port-number" value="<?php echo $configurations['port_number']; ?>">
</div>
<div class="form-group">
    <label for="username">Username:</label>
    <input type="text" class="form-control" id="username" name="username" value="<?php echo $configurations['username']; ?>">
</div>
<div class="form-group">
    <label for="password">Password:</label>
    <input type="password" class="form-control" id="password" name="password" value="<?php echo $configurations['password']; ?>">
</div>
<script>
document.addEventListener("DOMContentLoaded", function() {
  const checkbox = document.getElementById("email-designer-enabled");

  // Set the initial state of the checkbox based on the value from the database
  if (checkbox.value === "1") {
    checkbox.checked = true;
  } else {
    checkbox.checked = false;
  }

  // Add an event listener to the checkbox to update the value in the database when the checkbox is clicked
  checkbox.addEventListener("change", function() {
    const newValue = this.checked ? "1" : "0";
    const xhr = new XMLHttpRequest();
    xhr.open("POST", "email_config.php");
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    xhr.onload = function() {
      if (xhr.status === 200) {
        console.log("Value updated successfully");
      } else {
        console.log("Error updating value");
      }
    };
    xhr.send("config_enabled=" + encodeURIComponent(newValue));
  });
});
</script>
<input type="hidden" id="config-def" name="config-def" value="email-designer">
<button type="submit" class="btn btn-primary" name="update">Update</button>
<button type="submit" class="btn btn-primary" name="insert">Insert</button>
</form>

我需要复选框切换状态与存储在DB中的值相同，或者0（禁用）或者1（启用）