// ==UserScript==
// @name         标题生成一键填充（严格匹配表格品类版）
// @namespace    http://scriptcat.org
// @version      2.3.0
// @description  品类输入表格大标题，前缀后缀严格匹配表格，仅填充3个字段，无多余功能
// @author       自定义
// @match        https://pod.modaai.net/*
// @grant        none
// @run-at       document-end
// ==/UserScript==

(function () {
    'use strict';

    // ========== 严格1:1匹配Excel表格内容 ==========
    // 面板显示名 | 品类框填充内容 | 标题前缀 | 标题后缀
    const CATEGORY_DATA = {
        '女装彩棉': [
            {
                label: '短袖彩棉',
                category: '女士休闲运动T恤',
                prefix: '女士欧美夏季短袖',
                suffix: '印花时尚街头百搭休闲运动上衣圆领短袖T恤'
            },
            {
                label: '长袖彩棉',
                category: '女士休闲运动T恤',
                prefix: '女士休闲运动长袖',
                suffix: '设计宽松版型舒适适合年轻人日常穿搭理想适合户外活动为衣橱增添趣味与时尚感'
            },
            {
                label: '200g女装彩棉',
                category: '女士休闲运动T恤',
                prefix: 'overside风格女士100%棉休闲时尚T恤',
                suffix: '印花春夏百搭舒适潮流上衣圆领短袖T恤完美选择'
            },
            {
                label: '水洗棉',
                category: '女士休闲运动T恤',
                prefix: '100%水洗棉重工复古做旧潮牌宽松显瘦落肩',
                suffix: '女士柔软休闲时尚日常百搭街头圆领短袖运动T恤'
            },
            {
                label: 'V领T恤',
                category: '女士休闲运动T恤',
                prefix: '女士休闲运动T恤',
                suffix: '女士V领款落肩背心，柔软面料，夏季日常穿着，舒适透气'
            },
            {
                label: '前后幅',
                category: '女士T恤',
                prefix: '女士欧美圆领短袖T恤',
                suffix: '夏季运动轻薄透气上衣前后幅个性印花柔软舒适'
            }
        ],
        '裙装': [
            {
                label: '吊带连衣裙',
                category: '女士运动连衣裙',
                prefix: '女士清爽夏日欧美时尚垂感宽松优雅吊带连衣裙',
                suffix: '印花V领无袖系带弯曲下摆吊带连衣裙休闲外出百搭潮流'
            },
            {
                label: '背心裙',
                category: '女士运动连衣裙',
                prefix: '女士连衣裙夏季背心裙',
                suffix: '百搭休闲运动女装背心裙，舒适面料，日常穿搭，潮流时尚休闲。'
            }
        ],
        '男装': [
            {
                label: '男装彩棉',
                category: '男士休闲运动T恤',
                prefix: '夏季男士时尚休闲圆领短袖',
                suffix: '短袖 T 恤，适合运动户外休闲日常穿搭。'
            },
            {
                label: '男士彩棉',
                category: '男士休闲运动T恤',
                prefix: '夏季男士时尚休闲圆领短袖',
                suffix: '男士纯色简约休闲短袖 T 恤，适合运动户外休闲日常穿搭'
            }
        ],
        '瑜伽运动': [
            {
                label: '瑜伽外套',
                category: '女士休闲运动风衣',
                prefix: '女士春夏秋高弹修身运动瑜伽百搭街头户外休闲',
                suffix: '运动瑜伽适合户外活动，完美修身'
            },
            {
                label: '瑜伽裤',
                category: '女士运动服紧身裤',
                prefix: '女士春夏秋高弹提臀紧身修身运动印花百搭街头户外休闲日常穿搭',
                suffix: '运动瑜伽休闲适合所有户外活动'
            }
        ],
        '童装': [
            {
                label: '男童彩棉',
                category: '男童休闲运动T恤',
                prefix: '夏季男童时尚休闲圆领短袖',
                suffix: '休闲短袖T恤，适合运动户外休闲日常穿搭'
            },
            {
                label: '女童彩棉',
                category: '女童休闲运动T恤',
                prefix: '夏季女童时尚休闲圆领短袖',
                suffix: '休闲短袖T恤，适合运动户外休闲日常穿搭'
            },
            {
                label: '女童背心裙',
                category: '女童休闲连衣裙',
                prefix: '夏季女童时尚休闲背心裙',
                suffix: '女童休闲背心裙，适合运动户外休闲日常穿搭。'
            },
            {
                label: '女童满印',
                category: '女童休闲运动T恤',
                prefix: '夏款童装数码满印圆领T恤',
                suffix: '数码满印抽象印花圆领T恤，柔软舒适，休闲时尚日常百搭'
            }
        ],
        '青少年': [
            {
                label: '男青少年',
                category: '男青年 T 恤',
                prefix: '夏季男青年时尚休闲圆领短袖,',
                suffix: '男青年休闲短袖 T 恤，适合运动户外休闲日常穿搭。'
            },
            {
                label: '女青少年',
                category: '女青年 T 恤',
                prefix: '夏季女青年时尚休闲圆领短袖,',
                suffix: '女青年休闲短袖 T 恤，适合运动户外休闲日常穿搭。'
            }
        ]
    };

    // ========== 工具函数 ==========
    function isElementVisible(el) {
        if (!el) return false;
        const style = window.getComputedStyle(el);
        return style.display !== 'none'
            && style.visibility !== 'hidden'
            && style.opacity !== '0'
            && !(el.offsetWidth === 0 && el.offsetHeight === 0);
    }

    function getTitleModal() {
        const popups = document.querySelectorAll('.pop-up, .el-dialog, .modal');
        for (const popup of popups) {
            const titleEl = popup.querySelector('h2, .el-dialog__title');
            if (titleEl && titleEl.textContent.trim().includes('标题生成') && isElementVisible(popup)) {
                return popup;
            }
        }
        return null;
    }

    function nativeInput(inputEl, value) {
        if (!inputEl) return;
        inputEl.focus();
        inputEl.value = value;
        inputEl.dispatchEvent(new Event('input', { bubbles: true }));
        inputEl.dispatchEvent(new Event('change', { bubbles: true }));
        inputEl.blur();
    }

    function showToast(text) {
        const toast = document.createElement('div');
        toast.style.cssText = `
            position: fixed; top: 20px; left: 50%; transform: translateX(-50%);
            padding: 10px 20px; border-radius: 6px; color: #fff; font-size: 14px;
            background: #67c23a; z-index: 999999; opacity: 0; transition: opacity 0.3s;
            box-shadow: 0 2px 12px rgba(0,0,0,0.15);
        `;
        toast.textContent = text;
        document.body.appendChild(toast);
        requestAnimationFrame(() => toast.style.opacity = '1');
        setTimeout(() => {
            toast.style.opacity = '0';
            setTimeout(() => toast.remove(), 300);
        }, 1500);
    }

    // ========== 核心填充：仅填品类、前缀、后缀，不碰关键字 ==========
    function fillModal(item) {
        const modal = getTitleModal();
        if (!modal) {
            showToast('请先打开「标题生成」弹窗');
            return;
        }

        const categoryInput = modal.querySelector('input[placeholder="请输入品类"]');
        const prefixInput = modal.querySelector('input[placeholder="请输入标题前缀"]');
        const suffixInput = modal.querySelector('input[placeholder="请输入标题后缀"]');

        if (categoryInput) nativeInput(categoryInput, item.category);
        if (prefixInput) nativeInput(prefixInput, item.prefix);
        if (suffixInput) nativeInput(suffixInput, item.suffix);

        showToast('已填充');
    }

    // ========== 侧边面板 ==========
    function buildPanel() {
        const toggleBtn = document.createElement('div');
        toggleBtn.id = 'title-helper-toggle';
        toggleBtn.textContent = '标题助手';
        toggleBtn.style.cssText = `
            position: fixed; right: 0; top: 40%;
            width: 32px; padding: 10px 4px;
            background: #409eff; color: #fff;
            font-size: 13px; line-height: 1.4;
            border-radius: 6px 0 0 6px; cursor: pointer;
            z-index: 99999; writing-mode: vertical-rl;
            box-shadow: -2px 0 8px rgba(0,0,0,0.1);
            user-select: none;
        `;

        const panel = document.createElement('div');
        panel.id = 'title-helper-panel';
        panel.style.cssText = `
            position: fixed; right: -300px; top: 0;
            width: 280px; height: 100vh;
            background: #fff; box-shadow: -2px 0 12px rgba(0,0,0,0.1);
            z-index: 99998; transition: right 0.3s ease;
            padding: 16px 12px; box-sizing: border-box;
            overflow-y: auto;
        `;

        const categories = Object.keys(CATEGORY_DATA);
        let tabHTML = '<div style="display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px;">';
        categories.forEach((cat, idx) => {
            const active = idx === 0 ? 'background:#409eff; color:#fff;' : 'background:#f0f2f5; color:#666;';
            tabHTML += `<span class="helper-tab" data-cat="${cat}" style="padding:3px 8px; border-radius:4px; font-size:12px; cursor:pointer; ${active}">${cat}</span>`;
        });
        tabHTML += '</div>';

        panel.innerHTML = tabHTML + '<div id="helper-category-list"></div>';
        document.body.appendChild(toggleBtn);
        document.body.appendChild(panel);

        function renderList(catName) {
            const list = CATEGORY_DATA[catName];
            const container = document.getElementById('helper-category-list');
            container.innerHTML = list.map(item => `
                <div class="helper-item" style="padding:8px 10px; margin-bottom:6px; background:#f5f7fa; border-radius:4px; cursor:pointer; font-size:13px;">
                    ${item.label}
                </div>
            `).join('');

            container.querySelectorAll('.helper-item').forEach((el, i) => {
                el.addEventListener('click', () => fillModal(list[i]));
                el.addEventListener('mouseenter', () => el.style.background = '#ecf5ff');
                el.addEventListener('mouseleave', () => el.style.background = '#f5f7fa');
            });
        }

        renderList(categories[0]);

        panel.querySelectorAll('.helper-tab').forEach(tab => {
            tab.addEventListener('click', () => {
                panel.querySelectorAll('.helper-tab').forEach(t => {
                    t.style.background = '#f0f2f5';
                    t.style.color = '#666';
                });
                tab.style.background = '#409eff';
                tab.style.color = '#fff';
                renderList(tab.dataset.cat);
            });
        });

        let isOpen = false;
        toggleBtn.addEventListener('click', (e) => {
            e.stopPropagation();
            isOpen = !isOpen;
            panel.style.right = isOpen ? '0' : '-300px';
        });

        document.addEventListener('click', () => {
            isOpen = false;
            panel.style.right = '-300px';
        });
        panel.addEventListener('click', e => e.stopPropagation());
    }

    // ========== 初始化 ==========
    function init() {
        if (document.getElementById('title-helper-toggle')) return;
        buildPanel();
    }

    if (document.readyState === 'complete' || document.readyState === 'interactive') {
        setTimeout(init, 1000);
    } else {
        window.addEventListener('DOMContentLoaded', () => setTimeout(init, 1000));
    }

    let count = 0;
    const timer = setInterval(() => {
        if (document.getElementById('title-helper-toggle')) return clearInterval(timer);
        if (++count > 10) clearInterval(timer);
        init();
    }, 2000);

})();