import type { SectionBlock, SectionConfig } from '~/types/site';
import { resolveAssetUrl } from '~/utils/resolveAssetUrl';

/**
 * 区块内容多语言解析
 *
 * Section 的各文本字段均有 _zh / _en 两个版本，
 * 该 composable 根据当前语言返回对应的值，避免各布局组件重复判断。
 */
export function useSectionContent(section: SectionBlock) {
  const { locale } = useI18n();
  const isEn = computed(() => locale.value === 'en');

  const overline = computed(() => (isEn.value ? section.overline_en : section.overline_zh) || '');
  const title = computed(() => (isEn.value ? section.title_en : section.title_zh) || '');
  const subtitle = computed(() => (isEn.value ? section.subtitle_en : section.subtitle_zh) || '');
  const content = computed(() => (isEn.value ? section.content_en : section.content_zh) || '');
  const ctaPrimaryText = computed(() => (isEn.value ? section.cta_primary_en : section.cta_primary_zh) || '');
  const ctaSecondaryText = computed(() => (isEn.value ? section.cta_secondary_en : section.cta_secondary_zh) || '');
  // media_url_zh/_en 以语言后缀结尾，不命中数据层 resolveAssetUrls 的 *_url 匹配，需在此单独解析相对路径
  const mediaUrl = computed(() =>
    resolveAssetUrl((isEn.value ? section.media_url_en : section.media_url_zh) || section.media_url_zh || '')
  );

  const config = computed<SectionConfig>(() => section.config ?? {});

  /** 深色主题区块 */
  const isDark = computed(() => section.theme === 'dark');

  // 前景文案自定义颜色（空 = 跟随 theme 默认配色，由布局组件的 class 控制）
  // 内联 style 优先级高于 class，非空时直接覆盖默认色
  const overlineStyle = computed(() => (section.overline_color ? { color: section.overline_color } : undefined));
  // 标题字号由 main.css 的 section h2 规则统一控制（config.title_font_size 经 SectionRenderer
  // 注入 --sec-title-fs/--sec-title-fs-m 变量，留空兜底 36px，移动端 22.5px）
  const titleStyle = computed(() => (section.title_color ? { color: section.title_color } : undefined));
  const bodyStyle = computed(() => (section.body_color ? { color: section.body_color } : undefined));

  return {
    isEn,
    overline,
    title,
    subtitle,
    content,
    ctaPrimaryText,
    ctaSecondaryText,
    mediaUrl,
    config,
    isDark,
    overlineStyle,
    titleStyle,
    bodyStyle
  };
}