import QtQuick
import QtQuick.Controls.Basic
import QtQuick.Dialogs
import QtQuick.Layouts
import "components"
import "." as App

Item {
    id: tab

    // ===== 状态 =====
    property var formData: ({
        "主石形状": "",
        "主石材质": "",
        "金属": "",
        "花头形式": "",
        "戒臂结构": "",
        "戒臂处理": "",
        "辅石镶嵌": "",
        "特殊元素": "",
    })
    property var lockedFields: []           // 被 🔓 锁定的字段名（不参与随机）
    property string assembledPrompt: ""
    property var myTaskIds: []              // 多任务支持：本 tab 提交过且还在跑/排队的 ids
    property string lastTaskId: ""          // 最近一次提交的 task — 进度显示锚点
    property string lastResultPath: ""

    function isMyTask(tid) { return tab.myTaskIds.indexOf(tid) >= 0 }
    function dropMyTask(tid) {
        var copy = tab.myTaskIds.slice()
        var i = copy.indexOf(tid)
        if (i >= 0) copy.splice(i, 1)
        tab.myTaskIds = copy
    }
    property string statusText: "● 就绪"
    property color statusColor: App.Theme.success

    // ➕ 添加词条对话框传参
    property string addingCategory: ""

    function updateField(category, value) {
        var copy = Object.assign({}, tab.formData)
        copy[category] = value || ""
        tab.formData = copy
        tab.assembledPrompt = jewelry.previewPrompt(copy)
    }

    function reassemble() {
        tab.assembledPrompt = jewelry.previewPrompt(tab.formData)
    }

    function isLocked(category) {
        return tab.lockedFields.indexOf(category) >= 0
    }

    function toggleLock(category) {
        var copy = tab.lockedFields.slice()
        var i = copy.indexOf(category)
        if (i >= 0) copy.splice(i, 1)
        else copy.push(category)
        tab.lockedFields = copy
    }

    function randomize() {
        var copy = Object.assign({}, tab.formData)
        for (var i = 0; i < jewelry.categories.length; i++) {
            var cat = jewelry.categories[i]
            if (tab.isLocked(cat)) continue
            var opts = jewelry.getOptions(cat)
            if (opts.length === 0) continue
            copy[cat] = opts[Math.floor(Math.random() * opts.length)]
        }
        tab.formData = copy
        tab.assembledPrompt = jewelry.previewPrompt(copy)
        // 同步 ComboBox 显示（model 列表里找到 currentIndex）
        comboReloadTrigger++
    }

    function resetFields() {
        var fresh = {}
        for (var i = 0; i < jewelry.categories.length; i++) {
            fresh[jewelry.categories[i]] = ""
        }
        tab.formData = fresh
        tab.reassemble()
        comboReloadTrigger++
    }

    function submit() {
        if (tab.assembledPrompt.trim().length === 0) {
            tab.statusText = "● 选几个字段先"
            tab.statusColor = App.Theme.danger
            return
        }
        try {
            var taskId = imageGen.submitTask(
                tab.assembledPrompt, [], "1:1", "2K", "慢速模式"
            )
            tab.myTaskIds = tab.myTaskIds.concat([taskId])
            tab.lastTaskId = taskId
            tab.statusText = "● 已提交（我的队列 " + tab.myTaskIds.length + " 条）"
            tab.statusColor = App.Theme.accent
        } catch (e) {
            tab.statusText = "● " + e
            tab.statusColor = App.Theme.danger
        }
    }

    // 触发 ComboBox model 刷新（随机 / 重置 / 词库变化时让 currentIndex 重算）
    property int comboReloadTrigger: 0

    Component.onCompleted: reassemble()

    Connections {
        target: jewelry
        function onLibraryChanged(category) {
            tab.comboReloadTrigger++
        }
    }

    Connections {
        target: imageGen
        function onTaskProgress(taskId, progress, msg) {
            if (taskId !== tab.lastTaskId) return
            tab.statusText = "● " + (msg || "生成中…")
            tab.statusColor = App.Theme.accent
        }
        function onTaskCompleted(taskId, resultPath, prompt, model) {
            if (!tab.isMyTask(taskId)) return
            tab.lastResultPath = resultPath
            tab.dropMyTask(taskId)
            if (tab.lastTaskId === taskId) tab.lastTaskId = ""
            tab.statusText = tab.myTaskIds.length === 0
                ? "● 已完成"
                : "● 已完成（队列还剩 " + tab.myTaskIds.length + " 条）"
            tab.statusColor = App.Theme.success
        }
        function onTaskFailed(taskId, error) {
            if (!tab.isMyTask(taskId)) return
            tab.dropMyTask(taskId)
            if (tab.lastTaskId === taskId) tab.lastTaskId = ""
            tab.statusText = "● " + (error || "失败")
            tab.statusColor = App.Theme.danger
        }
    }

    // ➕ 添加词条对话框
    Dialog {
        id: addItemDialog
        title: "添加词条 - " + tab.addingCategory
        anchors.centerIn: parent
        modal: true
        width: 400
        standardButtons: Dialog.Ok | Dialog.Cancel

        ColumnLayout {
            anchors.fill: parent
            spacing: App.Theme.space2

            Label {
                text: "请输入新的「" + tab.addingCategory + "」词条（纯中文）:"
                font.family: App.Theme.fontFamily
                font.pointSize: App.Theme.fontSm
                color: App.Theme.textPrimary
            }
            ThemedTextField {
                id: addItemField
                Layout.fillWidth: true
                placeholderText: "例如：圆形"
            }
        }

        onAccepted: {
            var v = addItemField.text.trim()
            if (v) jewelry.addItem(tab.addingCategory, v)
            addItemField.text = ""
        }
        onRejected: addItemField.text = ""
    }

    // 💾 下载图片
    FileDialog {
        id: saveImageDialog
        title: "保存生成的图片"
        fileMode: FileDialog.SaveFile
        nameFilters: ["PNG 图片 (*.png)"]
        defaultSuffix: "png"
        onAccepted: {
            var dest = selectedFile.toString().replace("file:///", "")
            var ok = imageGen.saveFile(tab.lastResultPath, dest)
            if (ok) {
                tab.statusText = "● 已保存到 " + dest
                tab.statusColor = App.Theme.success
            } else {
                tab.statusText = "● 保存失败"
                tab.statusColor = App.Theme.danger
            }
        }
    }

    RowLayout {
        anchors.fill: parent
        anchors.margins: App.Theme.space5
        spacing: App.Theme.space4

        // ===== 左侧：8 字段表单 =====
        Card {
            Layout.preferredWidth: 420
            Layout.fillHeight: true

            ColumnLayout {
                anchors.fill: parent
                anchors.margins: App.Theme.space4
                spacing: App.Theme.space3

                // header
                RowLayout {
                    spacing: App.Theme.space3
                    CaptionLabel {
                        text: "款式字段"
                        font.pointSize: App.Theme.fontLg
                    }
                    Item { Layout.fillWidth: true }
                }

                // 工具按钮行：随机 / 恢复默认词库 / 重置字段
                RowLayout {
                    Layout.fillWidth: true
                    spacing: App.Theme.space2
                    SecondaryButton {
                        text: "🎲 随机"
                        onClicked: tab.randomize()
                    }
                    SecondaryButton {
                        text: "🔄 恢复默认词库"
                        onClicked: jewelry.resetAll()
                    }
                    SecondaryButton {
                        text: "重置字段"
                        onClicked: tab.resetFields()
                    }
                    Item { Layout.fillWidth: true }
                }

                ScrollView {
                    Layout.fillWidth: true
                    Layout.fillHeight: true
                    clip: true

                    ColumnLayout {
                        width: parent.width
                        spacing: App.Theme.space3

                        Repeater {
                            model: jewelry.categories  // 8 个类别名

                            delegate: ColumnLayout {
                                Layout.fillWidth: true
                                spacing: 4

                                CaptionLabel {
                                    text: modelData
                                    font.pointSize: App.Theme.fontBase
                                    color: tab.isLocked(modelData)
                                        ? App.Theme.textTertiary
                                        : App.Theme.textPrimary
                                }
                                RowLayout {
                                    Layout.fillWidth: true
                                    spacing: App.Theme.space2

                                    ThemedComboBox {
                                        id: cb
                                        // 固定宽度：fillWidth + maximumWidth 锁住，避免内容长度变化撑大 RowLayout
                                        Layout.fillWidth: true
                                        Layout.preferredWidth: 240
                                        Layout.maximumWidth: 240
                                        // 头插 "（不选）"，用 trigger 强制每次随机/重置后刷新
                                        property var fullModel: {
                                            tab.comboReloadTrigger
                                            return ["（不选）"].concat(jewelry.getOptions(modelData))
                                        }
                                        model: fullModel
                                        // 同步 currentIndex 到 formData[modelData]
                                        currentIndex: {
                                            tab.comboReloadTrigger
                                            var v = tab.formData[modelData] || ""
                                            if (!v) return 0  // "（不选）"
                                            var idx = fullModel.indexOf(v)
                                            return idx >= 0 ? idx : 0
                                        }
                                        enabled: !tab.isLocked(modelData)
                                        onActivated: {
                                            var v = currentText === "（不选）" ? "" : currentText
                                            tab.updateField(modelData, v)
                                        }
                                    }

                                    // ➕ 添加词条
                                    SecondaryButton {
                                        text: "➕"
                                        Layout.preferredWidth: 36
                                        onClicked: {
                                            tab.addingCategory = modelData
                                            addItemDialog.open()
                                        }
                                    }
                                    // 🗑️ 删除当前选中词条
                                    SecondaryButton {
                                        text: "🗑️"
                                        Layout.preferredWidth: 36
                                        enabled: (tab.formData[modelData] || "").length > 0
                                        onClicked: {
                                            var v = tab.formData[modelData]
                                            if (v) {
                                                jewelry.removeItem(modelData, v)
                                                tab.updateField(modelData, "")
                                            }
                                        }
                                    }
                                    // 🔓 / 🔒 锁定字段（锁定的字段不参与随机）
                                    SecondaryButton {
                                        text: tab.isLocked(modelData) ? "🔒" : "🔓"
                                        Layout.preferredWidth: 36
                                        onClicked: tab.toggleLock(modelData)
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }

        // ===== 右侧：Prompt 预览 + 生成 + 结果 =====
        ColumnLayout {
            Layout.fillWidth: true
            Layout.fillHeight: true
            spacing: App.Theme.space4

            // Prompt 预览卡
            Card {
                Layout.fillWidth: true
                Layout.preferredHeight: 200

                ColumnLayout {
                    anchors.fill: parent
                    anchors.margins: App.Theme.space4
                    spacing: App.Theme.space3

                    RowLayout {
                        spacing: App.Theme.space3
                        CaptionLabel {
                            text: "Prompt 预览"
                            font.pointSize: App.Theme.fontLg
                        }
                        Item { Layout.fillWidth: true }
                        Label {
                            text: tab.assembledPrompt.length + " 字"
                            font.family: App.Theme.fontFamily
                            font.pointSize: App.Theme.fontXs
                            color: App.Theme.textTertiary
                        }
                    }

                    ScrollView {
                        Layout.fillWidth: true
                        Layout.fillHeight: true

                        Rectangle {
                            anchors.fill: parent
                            color: App.Theme.bgSubtle
                            radius: App.Theme.radiusMd

                            Text {
                                anchors.fill: parent
                                anchors.margins: App.Theme.space3
                                text: tab.assembledPrompt
                                color: App.Theme.textPrimary
                                font.family: App.Theme.fontFamily
                                font.pointSize: App.Theme.fontSm
                                wrapMode: Text.Wrap
                            }
                        }
                    }
                }
            }

            // 操作行：生成 + 下载 + 状态
            RowLayout {
                spacing: App.Theme.space3
                Layout.fillWidth: true

                PrimaryButton {
                    text: "🎨 生成图片"
                    onClicked: tab.submit()
                }
                SecondaryButton {
                    text: "💾 下载图片"
                    enabled: tab.lastResultPath !== ""
                    onClicked: saveImageDialog.open()
                }
                Label {
                    text: tab.statusText
                    font.family: App.Theme.fontFamily
                    font.pointSize: App.Theme.fontSm
                    color: tab.statusColor
                }
                Item { Layout.fillWidth: true }
            }

            // 预览大图
            Card {
                Layout.fillWidth: true
                Layout.fillHeight: true
                Layout.minimumHeight: 240

                ColumnLayout {
                    anchors.fill: parent
                    anchors.margins: App.Theme.space4
                    spacing: App.Theme.space3

                    CaptionLabel {
                        text: "预览"
                        font.pointSize: App.Theme.fontLg
                    }

                    Rectangle {
                        Layout.fillWidth: true
                        Layout.fillHeight: true
                        color: App.Theme.bgSubtle
                        radius: App.Theme.radiusMd

                        Image {
                            anchors.fill: parent
                            anchors.margins: App.Theme.space3
                            source: tab.lastResultPath ? "file:///" + tab.lastResultPath : ""
                            fillMode: Image.PreserveAspectFit
                            smooth: true
                            asynchronous: true
                            cache: false
                            visible: tab.lastResultPath !== ""

                            MouseArea {
                                anchors.fill: parent
                                cursorShape: Qt.PointingHandCursor
                                onDoubleClicked: {
                                    if (tab.lastResultPath) {
                                        Qt.openUrlExternally("file:///" + tab.lastResultPath)
                                    }
                                }
                            }
                        }

                        Text {
                            anchors.centerIn: parent
                            visible: tab.lastResultPath === ""
                            text: "点 \"🎲 随机\" 试手气，或选字段后点 \"🎨 生成图片\""
                            color: App.Theme.textTertiary
                            font.family: App.Theme.fontFamily
                            font.pointSize: App.Theme.fontSm
                        }
                    }
                }
            }
        }
    }
}