cabinet/assets/controllers/searchNameInput_controller.js

import { Controller } from 'stimulus';
const helper = require("./../components/helper.js");

export default class extends Controller {
    connect() {
        let showContent = this.element.parentElement.querySelector('.show-content');
        const input = this.element;

        const searchConfig = {
            'name': {
                url: '/specialists',
                paramName: 'specialist_search[name]',
                encodedParam: 'specialist_search%5Bname%5D'
            },
            'pl': {
                url: '/stoimost-uslug',
                paramName: 'price_list_form[schname]',
                encodedParam: 'price_list_form%5Bschname%5D'
            },
            'dep': {
                url: '/specialists',
                paramName: 'specialist_search[depname]',
                encodedParam: 'specialist_search%5Bdepname%5D'
            }
        };

        const performSearch = () => {
            const selectSearch = document.getElementById("select-search").value;
            const searchValue = input.value.trim();
            
            if (!searchValue) return;
            
            const config = searchConfig[selectSearch];
            if (!config) return;
            
            // Извлекаем alias из текущего URL, если он есть
            const currentPath = window.location.pathname;
            const aliasMatch = currentPath.match(/\/specialists\/([^\/]+)/);
            const alias = aliasMatch ? aliasMatch[1] : null;
            
            // Создаем URL с параметром поиска, сохраняя alias если он есть
            const encodedValue = encodeURIComponent(searchValue);
            let baseUrl = config.url;
            if (alias && (selectSearch === 'name' || selectSearch === 'dep')) {
                baseUrl = `/specialists/${alias}`;
            }
            const searchUrl = `${baseUrl}?${config.encodedParam}=${encodedValue}`;
            
            console.log('Редирект на:', searchUrl);
            window.location.href = searchUrl;
        };

        // Функция для автодополнения (при вводе 3+ символов)
        const handleAutocomplete = (searchValue, selectSearch) => {
            const onlineMode = location.pathname.includes('/online-specialists') ? 1 : 0;

            if (searchValue.length >= 3 && selectSearch !== 'pl') {
                let data = {
                    q: searchValue,
                    type: selectSearch,
                    onlineMode: onlineMode
                };

                showContent.innerText = '';
                showContent.classList.add('d-none');

                helper.sendRequest(data, "/api/search", "POST").then(function (response) {
                    showContent.innerHTML = '';
                    const ul = document.createElement('ul');
                    const { data: searchData } = response;
                    
                    const listItemsHTML = searchData.map(el => {
                        const { alias, name, speciality } = el;
                        const config = searchConfig[selectSearch];
                        
                        let url;
                        // Извлекаем alias из текущего URL, если он есть
                        const currentPath = window.location.pathname;
                        const currentAliasMatch = currentPath.match(/\/specialists\/([^\/]+)/);
                        const currentAlias = currentAliasMatch ? currentAliasMatch[1] : null;
                        
                        if (selectSearch === 'name') {
                            url = `/specialist/${alias}?specialist_search[onlineMode]=${onlineMode}`;
                        } else if (selectSearch === 'pl') {
                            url = `/stoimost-uslug?${config.encodedParam}=${encodeURIComponent(name)}`;
                        } else if (selectSearch === 'dep') {
                            // Сохраняем текущий alias при поиске по отделению
                            const depUrl = currentAlias ? `/specialists/${currentAlias}` : '/specialists';
                            url = `${depUrl}?${config.encodedParam}=${encodeURIComponent(name)}`;
                        }
                        
                        return `
                            <li>
                                <a href="${url}" class="search-result-link">
                                    <span class="result-name">${name}</span>
                                    ${speciality ? `<span class="result-speciality">, ${speciality}</span>` : ''}
                                </a>
                            </li>
                        `;
                    }).join('');

                    ul.innerHTML = listItemsHTML;
                    showContent.append(ul);
                    showContent.classList.remove('d-none');
                });
            } else {
                showContent.classList.add('d-none');
            }
        };

        // Обработчик ввода в поле поиска
        input.oninput = function(e) {
            const selectSearch = document.getElementById("select-search").value;
            const searchValue = e.target.value;
            
            handleAutocomplete(searchValue, selectSearch);
        };

        // Обработчик нажатия Enter
        input.addEventListener('keyup', function (evn) {
            if (evn.keyCode == 13) { // Enter
                evn.preventDefault();
                performSearch();
            }
        });

        // Делаем функцию доступной глобально для другого контроллера
        window.performSearch = performSearch;
        window.handleAutocomplete = handleAutocomplete;
        
        // Инициализация значения из текущего параметра URL
        this.initializeFromUrl();
    }
    
    // Метод для инициализации значения поля из параметров URL
    initializeFromUrl() {
        const input = this.element;
        const urlParams = new URLSearchParams(window.location.search);
        const selectSearch = document.getElementById("select-search").value;
        
        const searchConfig = {
            'name': ['specialist_search[name]', 'specialist_search%5Bname%5D'],
            'pl': ['price_list_form[schname]', 'price_list_form%5Bschname%5D'],
            'department': ['specialist_search[department]', 'specialist_search%5Bdepartment%5D']
        };
        
        const config = searchConfig[selectSearch];
        if (config) {
            // Пробуем получить значение из разных вариантов параметра
            let searchValue = urlParams.get(config[0]) || 
                            urlParams.get(config[1]) ||
                            urlParams.get(decodeURIComponent(config[1]));
            
            if (searchValue) {
                input.value = searchValue;
                
                // Если есть значение, показываем автодополнение
                setTimeout(() => {
                    window.handleAutocomplete && window.handleAutocomplete(searchValue, selectSearch);
                }, 100);
            }
        }
    }
}