<?xml version="1.0" encoding="utf-8"?>
<engine:UXML
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns:engine="UnityEngine.UIElements"
    xmlns:editor="UnityEditor.UIElements"
    xsi:noNamespaceSchemaLocation="../../UIElementsSchema/UIElements.xsd">
    
    <engine:VisualElement style="flex-grow: 1; padding: 10px;">
        <!-- 状态栏 -->
        <engine:VisualElement name="StatusBar" style="margin-bottom: 10px; padding: 8px; background-color: rgb(35, 35, 35); border-radius: 5px;">
            <engine:Label name="StatusLabel" text="⚪ 待保存状态：无修改" style="font-size: 13px; color: rgb(100, 150, 255); -unity-text-align: middle-left;" />
        </engine:VisualElement>
        
        <!-- 顶部配置区域 -->
        <engine:VisualElement name="ConfigArea" style="margin-bottom: 10px; padding: 10px; border-width: 2px; border-color: rgb(50, 50, 50); border-radius: 5px;">
            <!-- 标题行：配置管理 + 核心操作按钮 + 常用工具 + 折叠按钮 -->
            <engine:VisualElement style="flex-direction: row; align-items: center; margin-bottom: 10px;">
                <engine:Label text="配置管理" style="font-size: 16px; -unity-font-style: bold; width: 100px;" />
                <engine:Button name="LoadConfigButton" text="读取配置" style="width: 90px; height: 28px; margin-right: 5px; background-color: rgb(60, 120, 180);" />
                <engine:Button name="SaveConfigButton" text="保存配置" style="width: 90px; height: 28px; margin-right: 5px; background-color: rgb(80, 140, 80);" />
                <engine:Button name="RecordInitButton" text="记录初始状态" style="width: 110px; height: 28px; margin-right: 15px; background-color: rgb(180, 100, 60);" />
                
                <!-- 常用工具（高频按钮） -->
                <engine:Label text="常用工具:" style="font-size: 12px; margin-right: 5px; color: rgb(150, 200, 255);" />
                <engine:Button name="SortNamesButtonTop" text="名称排序" style="width: 85px; height: 28px; margin-right: 5px; background-color: rgb(100, 80, 140);" />
                <engine:Button name="ScaleImageButtonTop" text="图片X1.5" style="width: 80px; height: 28px; margin-right: 10px; background-color: rgb(100, 80, 140);" />
                
                <engine:VisualElement style="flex-grow: 1;" />
                <engine:Button name="ToggleConfigButton" text="▲ 折叠" style="width: 80px; height: 25px;" />
            </engine:VisualElement>
            
            <!-- 可折叠内容区域 -->
            <engine:VisualElement name="ConfigContent">
                <!-- 基础配置 -->
                <engine:VisualElement style="margin-bottom: 10px; padding: 8px; background-color: rgba(0, 0, 0, 0.2); border-radius: 3px;">
                    <engine:VisualElement style="flex-direction: row; margin-bottom: 5px;">
                        <engine:Label text="配置文件路径:" style="width: 120px; -unity-text-align: middle-left;" />
                        <engine:TextField name="ConfigPathField" style="flex-grow: 1; margin-right: 5px;" />
                        <engine:Button name="BrowseConfigButton" text="浏览..." style="width: 80px;" />
                    </engine:VisualElement>
                    
                    <engine:VisualElement style="flex-direction: row; margin-bottom: 5px;">
                        <engine:Label text="场景AreaId:" style="width: 120px; -unity-text-align: middle-left;" />
                        <engine:IntegerField name="AreaIdField" value="1" style="width: 100px;" />
                        <engine:Label text="步骤数量(固定):" style="width: 130px; margin-left: 20px; -unity-text-align: middle-left;" />
                        <engine:IntegerField name="StepCountField" value="25" style="width: 100px;" />
                        <engine:Label text="不可修改，如需调整请联系编辑器作者" style="margin-left: 10px; -unity-text-align: middle-left; font-size: 10px; opacity: 0.7;" />
                    </engine:VisualElement>
                    
                    <engine:VisualElement style="flex-direction: row;">
                        <engine:Label text="场景bg节点:" style="width: 120px; -unity-text-align: middle-left;" />
                        <editor:ObjectField name="BgObjectField" type="UnityEngine.Transform, UnityEngine.CoreModule" style="flex-grow: 1; margin-right: 5px;" />
                        <engine:Button name="CheckBgButton" text="检测bg格式" style="width: 100px;" />
                    </engine:VisualElement>
                </engine:VisualElement>
                
                <!-- 批量设置 -->
                <engine:Label text="批量设置" style="font-size: 13px; -unity-font-style: bold; margin-bottom: 5px; color: rgb(150, 200, 255);" />
                <engine:VisualElement style="flex-direction: row; margin-bottom: 5px;">
                    <engine:Button name="AutoSetTitleButton" text="自动设置标题" style="flex-grow: 1; margin-right: 5px; height: 28px;" />
                    <engine:Button name="AutoSetIconButton" text="自动设置Icon" style="flex-grow: 1; margin-right: 5px; height: 28px;" />
                    <engine:Button name="BatchSetIconPosButton" text="批量Icon位置" style="flex-grow: 1; margin-right: 5px; height: 28px;" />
                    <engine:Button name="AutoSetBuildButton" text="自动建造效果" style="flex-grow: 1; margin-right: 5px; height: 28px;" />
                    <engine:Button name="AutoSetShineButton" text="全部闪光" style="flex-grow: 1; height: 28px;" />
                </engine:VisualElement>
                <engine:VisualElement style="flex-direction: row;">
                    <engine:Button name="BatchSetCostButton" text="批量资源消耗" style="flex-grow: 1; margin-right: 5px; height: 28px;" />
                    <engine:Button name="BatchSetSkipButton" text="批量设置批次" style="flex-grow: 1; margin-right: 5px; height: 28px;" />
                    <engine:Button name="ClearSceneButton" text="清空场景" style="flex-grow: 1; margin-right: 5px; height: 28px; background-color: rgb(140, 60, 60);" />
                    <engine:VisualElement style="flex-grow: 2;" />
                </engine:VisualElement>
            </engine:VisualElement>
        </engine:VisualElement>
        
        <!-- 初始状态编辑区域 -->
        <engine:VisualElement style="margin-bottom: 10px; padding: 10px; border-width: 2px; border-color: rgb(50, 50, 50); border-radius: 5px;">
            <!-- 标题行带折叠按钮 -->
            <engine:VisualElement style="flex-direction: row; align-items: center; margin-bottom: 10px;">
                <engine:Label text="初始状态编辑" style="font-size: 14px; -unity-font-style: bold; flex-grow: 1;" />
                <engine:Button name="ToggleInitEditButton" text="▲ 折叠" style="width: 80px; height: 25px;" />
            </engine:VisualElement>
            
            <!-- 可折叠内容 -->
            <engine:VisualElement name="InitEditContent">
                <engine:Label text="点击【记录初始状态】后，可在此处编辑各对象的初始属性" style="font-size: 11px; color: rgb(150, 150, 150); margin-bottom: 8px;" />
                <engine:ScrollView style="max-height: 300px; border-width: 1px; border-color: rgb(60, 60, 60); border-radius: 3px; background-color: rgba(0, 0, 0, 0.2);">
                    <engine:VisualElement name="InitEditContainer" style="padding: 5px;">
                        <engine:Label name="InitEmptyLabel" text="暂无初始状态数据" style="margin: 20px; -unity-text-align: middle-center; color: rgb(128, 128, 128);" />
                    </engine:VisualElement>
                </engine:ScrollView>
            </engine:VisualElement>
        </engine:VisualElement>
        
        <!-- 步骤操作和编辑区域（双栏布局）-->
        <engine:VisualElement style="flex-direction: row; flex-grow: 1; gap: 10px;">
            <!-- 左侧：步骤快速选择面板 -->
            <engine:VisualElement style="width: 220px; border-width: 2px; border-color: rgb(50, 50, 50); border-radius: 5px; padding: 10px;">
                <engine:Label text="步骤导航" style="font-size: 14px; -unity-font-style: bold; margin-bottom: 8px;" />
                
                <!-- 快速跳转 -->
                <engine:VisualElement style="flex-direction: row; margin-bottom: 8px; align-items: center;">
                    <engine:Label text="当前:" style="width: 35px; font-size: 11px;" />
                    <engine:IntegerField name="CurrentStepField" value="0" style="width: 50px; margin-right: 3px;" />
                    <engine:Button name="GotoStepButton" text="GO" style="width: 35px; height: 22px; font-size: 11px;" />
                </engine:VisualElement>
                
                <!-- 导航按钮组 -->
                <engine:VisualElement style="flex-direction: row; gap: 3px; margin-bottom: 10px;">
                    <engine:Button name="PrevStepButton" text="◀上步" style="flex-grow: 1; height: 24px; font-size: 11px;" />
                    <engine:Button name="NextStepButton" text="下步▶" style="flex-grow: 1; height: 24px; font-size: 11px;" />
                </engine:VisualElement>
                
                <!-- 步骤网格（4列布局）-->
                <engine:ScrollView style="flex-grow: 1; border-width: 1px; border-color: rgb(60, 60, 60); border-radius: 3px; background-color: rgba(0, 0, 0, 0.3);">
                    <engine:VisualElement name="StepGridContainer" style="padding: 5px; flex-wrap: wrap; flex-direction: row;">
                        <!-- 这里会动态添加25个步骤按钮，每个按钮40x38像素，4列布局 -->
                    </engine:VisualElement>
                </engine:ScrollView>
                
                <!-- 预览控制 -->
                <engine:VisualElement style="margin-top: 8px; padding-top: 8px; border-top-width: 1px; border-color: rgb(60, 60, 60);">
                    <engine:Label name="StepInfoLabel" text="初始状态" style="margin-bottom: 5px; -unity-text-align: middle-center; font-size: 11px; color: rgb(180, 180, 180);" />
                    <engine:Button name="ShowDecorateButton" text="显示装饰按钮" style="width: 100%; height: 24px; margin-bottom: 3px; font-size: 11px;" />
                    <engine:Button name="HideDecorateButton" text="隐藏装饰按钮" style="width: 100%; height: 24px; font-size: 11px;" />
                </engine:VisualElement>
            </engine:VisualElement>
            
            <!-- 右侧：步骤编辑区域 -->
            <engine:ScrollView name="StepEditScrollView" style="flex-grow: 1; border-width: 2px; border-color: rgb(50, 50, 50); border-radius: 5px;">
                <engine:VisualElement name="StepEditContainer" style="padding: 10px;">
                    <engine:Label text="步骤编辑" style="font-size: 14px; -unity-font-style: bold; margin-bottom: 10px;" />
                    
                    <!-- 这里会动态添加步骤编辑项 -->
                    <engine:Label name="EmptyLabel" text="请先读取或创建配置" style="margin: 20px; -unity-text-align: middle-center; color: rgb(128, 128, 128);" />
                </engine:VisualElement>
            </engine:ScrollView>
        </engine:VisualElement>
    </engine:VisualElement>
</engine:UXML>
