function updateMessageForm(scope) {
  const typeSelect = scope.querySelector("[data-message-type]");
  if (!typeSelect) return;
  const isText = typeSelect.value === "text";
  const titleLabel = scope.querySelector("[data-title-label]");
  const bodyLabel = scope.querySelector("[data-body-label]");
  const titleTemplate = scope.querySelector("[data-title-template]");
  const bodyTemplate = scope.querySelector("[data-body-template]");

  scope.classList.toggle("text-message", isText);
  if (titleLabel) titleLabel.textContent = isText ? "文本标题模板" : "卡片标题模板";
  if (bodyLabel) bodyLabel.textContent = isText ? "文本内容模板" : "卡片正文模板";
  if (titleTemplate) {
    titleTemplate.placeholder = isText ? "例如：TradingView {{symbol}}" : "例如：TradingView {{symbol}} {{action}}";
  }
  if (bodyTemplate) {
    bodyTemplate.placeholder = isText ? "{{symbol}} {{timeframe}} {{strategy}} {{action}}" : "**品种**: {{symbol}}";
  }
}

document.addEventListener("DOMContentLoaded", () => {
  document.querySelectorAll("[data-message-form]").forEach((scope) => {
    updateMessageForm(scope);
    const typeSelect = scope.querySelector("[data-message-type]");
    if (typeSelect) {
      typeSelect.addEventListener("change", () => updateMessageForm(scope));
    }
  });
});