(function () {
    function initSymbolInput(wrapper) {
        const input = wrapper.querySelector('.symbol-input');
        const hiddenCode = wrapper.querySelector('input[name="symbol"]');
        const hiddenName = wrapper.querySelector('input[name="symbol_name"]');
        const dropdown = wrapper.querySelector('.symbol-dropdown');
        const selectedEl = wrapper.querySelector('.symbol-selected');
        let timer = null;

        function hideDropdown() {
            dropdown.classList.remove('show');
        }

        function selectItem(item) {
            input.value = item.name;
            hiddenCode.value = item.code;
            hiddenName.value = item.name;
            selectedEl.textContent = item.display + ' | ' + item.code;
            hideDropdown();
        }

        function renderItems(items) {
            dropdown.innerHTML = '';
            if (!items.length) {
                dropdown.innerHTML = '<div class="symbol-option">无匹配品种</div>';
            } else {
                items.forEach(function (item) {
                    const div = document.createElement('div');
                    div.className = 'symbol-option';
                    div.innerHTML = item.display + '<div class="sub">' + item.code + ' · ' + item.exchange + '</div>';
                    div.addEventListener('mousedown', function (e) {
                        e.preventDefault();
                        selectItem(item);
                    });
                    dropdown.appendChild(div);
                });
            }
            dropdown.classList.add('show');
        }

        input.addEventListener('input', function () {
            hiddenCode.value = '';
            hiddenName.value = '';
            selectedEl.textContent = '';
            const q = input.value.trim();
            if (!q) {
                hideDropdown();
                return;
            }
            clearTimeout(timer);
            timer = setTimeout(function () {
                fetch('/api/symbols/search?q=' + encodeURIComponent(q))
                    .then(function (r) { return r.json(); })
                    .then(renderItems)
                    .catch(function () { hideDropdown(); });
            }, 200);
        });

        input.addEventListener('blur', function () {
            setTimeout(hideDropdown, 150);
        });

        input.addEventListener('focus', function () {
            const q = input.value.trim();
            if (q && !hiddenCode.value) {
                fetch('/api/symbols/search?q=' + encodeURIComponent(q))
                    .then(function (r) { return r.json(); })
                    .then(renderItems);
            }
        });
    }

    document.addEventListener('DOMContentLoaded', function () {
        document.querySelectorAll('.symbol-wrap').forEach(initSymbolInput);

        document.querySelectorAll('form').forEach(function (form) {
            if (!form.querySelector('.symbol-wrap')) return;
            form.addEventListener('submit', function (e) {
                const hidden = form.querySelector('input[name="symbol"]');
                if (hidden && !hidden.value.trim()) {
                    e.preventDefault();
                    alert('请从下拉列表中选择品种');
                }
            });
        });
    });
})();