#!/usr/bin/env python3
# -*- coding: utf-8 -*-
"""
ECharts配置渲染HTML脚本

功能：
- 读取ECharts配置文件
- 生成包含ECharts库的HTML文件
- 支持响应式布局和交互操作
"""

import json
import argparse
from pathlib import Path


def render_html(option_file, output, title='AI生成图表'):
    """
    将ECharts配置渲染为HTML文件
    
    Args:
        option_file (str): ECharts配置文件路径
        output (str): 输出HTML文件路径
        title (str): 页面标题
    
    Raises:
        Exception: 配置文件不存在或格式错误
    """
    print(f"[INFO] 读取ECharts配置: {option_file}")
    
    option_path = Path(option_file)
    if not option_path.exists():
        raise Exception(f"配置文件不存在: {option_file}")
    
    try:
        option_content = option_path.read_text(encoding='utf-8')
        option = json.loads(option_content)
    except json.JSONDecodeError as e:
        raise Exception(f"配置文件格式错误: {option_file}")
    
    # 尝试从meta文件读取标题
    if title == 'AI生成图表':
        meta_file = option_path.parent / option_path.name.replace('_option.json', '_meta.json')
        if meta_file.exists():
            try:
                meta_content = meta_file.read_text(encoding='utf-8')
                meta = json.loads(meta_content)
                title = meta.get('title', 'AI生成图表')
                print(f"[INFO] 从meta文件读取标题: {title}")
            except json.JSONDecodeError:
                print('[WARN] meta文件格式错误，使用默认标题')
    
    option_json = json.dumps(option, ensure_ascii=False)
    
    html_template = f'''<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{title}</title>
    <style>
        * {{
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }}
        
        body {{
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
            background: #f5f5f5;
            padding: 20px;
        }}
        
        .container {{
            max-width: 1200px;
            margin: 0 auto;
            background: white;
            border-radius: 8px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
            padding: 20px;
        }}
        
        .header {{
            text-align: center;
            margin-bottom: 20px;
            padding-bottom: 20px;
            border-bottom: 1px solid #eee;
        }}
        
        .header h1 {{
            font-size: 24px;
            color: #333;
            margin-bottom: 8px;
        }}
        
        .header p {{
            color: #666;
            font-size: 14px;
        }}
        
        #chart {{
            width: 100%;
            height: 600px;
        }}
        
        .footer {{
            margin-top: 20px;
            padding-top: 20px;
            border-top: 1px solid #eee;
            text-align: center;
            color: #999;
            font-size: 12px;
        }}
    </style>
</head>
<body>
    <div class="container">
        <div class="header">
            <h1>{title}</h1>
            <p>AI智能生成的可视化图表</p>
        </div>
        <div id="chart"></div>
        <div class="footer">
            <p>Generated by AI Chart Generator</p>
        </div>
    </div>
    
    <!-- ECharts CDN -->
    <script src="https://cdn.jsdelivr.net/npm/echarts@5.4.3/dist/echarts.min.js"></script>
    
    <script>
        // 初始化图表
        var chartDom = document.getElementById('chart');
        var myChart = echarts.init(chartDom);
        
        // 图表配置
        var option = {option_json};
        
        // 渲染图表
        myChart.setOption(option);
        
        // 响应式调整
        window.addEventListener('resize', function() {{
            myChart.resize();
        }});
        
        // 监听图表点击事件
        myChart.on('click', function(params) {{
            console.log('图表点击:', params);
        }});
    </script>
</body>
</html>
'''
    
    # 创建输出目录
    output_path = Path(output)
    output_path.parent.mkdir(parents=True, exist_ok=True)
    
    print(f"[INFO] 生成HTML文件: {output}")
    output_path.write_text(html_template, encoding='utf-8')
    print('[SUCCESS] HTML文件生成成功')


def main():
    """主函数"""
    parser = argparse.ArgumentParser(description='ECharts配置渲染HTML脚本')
    parser.add_argument('--option-file', required=True, help='ECharts配置文件路径')
    parser.add_argument('--output', required=True, help='输出HTML文件路径')
    parser.add_argument('--title', default='AI生成图表', help='页面标题')
    
    args = parser.parse_args()
    
    try:
        render_html(args.option_file, args.output, args.title)
    except Exception as e:
        print(f"[ERROR] {e}")
        sys.exit(1)


if __name__ == '__main__':
    main()
