cms/wwwroot/cms_scripts.js

/* ===== 开元云科技 官网交互脚本 ===== */

document.addEventListener('DOMContentLoaded', function() {
    initScrollAnimations();
    initProductCards();
    initFloatingWidget();
    initSmoothScroll();
});

/* === Scroll Fade-in Animations === */
function initScrollAnimations() {
    var elements = document.querySelectorAll('.fade-in');
    if (!elements.length) return;
    
    var observer = new IntersectionObserver(function(entries) {
        entries.forEach(function(entry) {
            if (entry.isIntersecting) {
                entry.target.classList.add('visible');
            }
        });
    }, { threshold: 0.1 });
    
    elements.forEach(function(el) { observer.observe(el); });
}

/* === Product Card Expand === */
function initProductCards() {
    var cards = document.querySelectorAll('.product-card');
    cards.forEach(function(card) {
        card.addEventListener('click', function() {
            var wasActive = card.classList.contains('active');
            // Close all
            cards.forEach(function(c) { c.classList.remove('active'); });
            // Toggle current
            if (!wasActive) {
                card.classList.add('active');
            }
        });
    });
}

/* === Floating Contact Widget === */
function initFloatingWidget() {
    var avatar = document.querySelector('.float-avatar');
    var panel = document.querySelector('.float-panel');
    if (!avatar || !panel) return;
    
    avatar.addEventListener('click', function(e) {
        e.stopPropagation();
        panel.classList.toggle('active');
    });
    
    // Close panel on outside click
    document.addEventListener('click', function(e) {
        if (!panel.contains(e.target) && !avatar.contains(e.target)) {
            panel.classList.remove('active');
        }
    });
    
    // Panel option clicks -> show form
    var options = panel.querySelectorAll('.panel-option');
    options.forEach(function(opt) {
        opt.addEventListener('click', function() {
            var formType = opt.getAttribute('data-form');
            var panelBody = panel.querySelector('.panel-body');
            var panelForm = panel.querySelector('.panel-form');
            if (panelBody) panelBody.style.display = 'none';
            if (panelForm) {
                panelForm.classList.add('active');
                panelForm.setAttribute('data-type', formType);
            }
        });
    });
    
    // Back button
    var backBtn = panel.querySelector('.back-btn');
    if (backBtn) {
        backBtn.addEventListener('click', function() {
            var panelBody = panel.querySelector('.panel-body');
            var panelForm = panel.querySelector('.panel-form');
            if (panelBody) panelBody.style.display = 'block';
            if (panelForm) panelForm.classList.remove('active');
        });
    }
    
    // Form submit
    var submitBtn = panel.querySelector('.submit-btn');
    if (submitBtn) {
        submitBtn.addEventListener('click', function(e) {
            e.preventDefault();
            var form = panel.querySelector('.panel-form');
            var name = form.querySelector('[name="name"]');
            var phone = form.querySelector('[name="phone"]');
            var company = form.querySelector('[name="company"]');
            var message = form.querySelector('[name="message"]');
            
            if (!phone || !phone.value.trim()) {
                alert('请填写联系电话');
                return;
            }
            
            var data = {
                name: name ? name.value : '',
                phone: phone ? phone.value : '',
                company: company ? company.value : '',
                message: message ? message.value : '',
                interest_products: form.getAttribute('data-type') || ''
            };
            
            // Submit via fetch
            var submitUrl = form.getAttribute('data-submit-url');
            if (!submitUrl) {
                alert('提交成功，我们会尽快联系您！');
                panel.classList.remove('active');
                return;
            }
            
            fetch(submitUrl, {
                method: 'POST',
                headers: {'Content-Type': 'application/json'},
                body: JSON.stringify(data)
            })
            .then(function(r) { return r.json(); })
            .then(function(resp) {
                alert('感谢您的留言，我们会尽快联系您！');
                panel.classList.remove('active');
                // Reset form
                if (name) name.value = '';
                if (phone) phone.value = '';
                if (company) company.value = '';
                if (message) message.value = '';
            })
            .catch(function(err) {
                console.error('Submit error:', err);
                alert('提交失败，请稍后重试');
            });
        });
    }
}

/* === Smooth Scroll for Nav Links === */
function initSmoothScroll() {
    var links = document.querySelectorAll('.nav-links a[href^="#"]');
    links.forEach(function(link) {
        link.addEventListener('click', function(e) {
            var target = document.querySelector(this.getAttribute('href'));
            if (target) {
                e.preventDefault();
                target.scrollIntoView({ behavior: 'smooth', block: 'start' });
            }
        });
    });
}