// 处于页面配置时,绑定方法 start if ($isDecorateMode) { document.addEventListener("diy_header/1", (event) => { const { field, value } = event.detail; console.log(field, value) if (field === 'hots') { let html = '' value.forEach(e => { html += `${e.name}` }) $('.' + field).html(html) } }); } // 处于页面配置时,绑定方法 end $(function () { $("#logout").click(function () { $request .post("/api/user/logout") .then((res) => { // 跳转页面 location.href = "/"; }); }) // 防止一开始进入页面在底部不显示 setHeaderSticky() $(window).scroll(setHeaderSticky) function setHeaderSticky(){ let offset = $("html,body").scrollTop() if (offset) { $('.ys-header').addClass('is-sticky') } else { $('.ys-header').removeClass('is-sticky') } } // 导航栏悬停 $('.ys-header__nav .nav-item').hover(function () { $(this).find('.ys-header__card').addClass('show') $('.ys-header__cover').removeClass('display-none') }, function () { $(this).find('.ys-header__card').removeClass('show') $('.ys-header__cover').addClass('display-none') }) // 搜索框悬停事件 $('.ys-header__search').focus(function () { $('.ys-header__nav').addClass('display-none') $('.ys-header__right').addClass('open') }, function() { if (!$('.ys-header__search-card').hasClass('show')) { $('.ys-header__nav').removeClass('display-none') $('.ys-header__right').removeClass('open') } }) // 搜索框聚焦事件 $('.ys-header__search input').focus(function () { openSearchCard() }) $('.ys-header__search-card .icon-close').click(function () { closeSearchCard() }) $(document).on('click', function (e) { if ( $(".ys-header__search-card")[0].contains(e.target) || $(".ys-header__search input").is(":focus") || $(".ys-header .ys-header__menu")[0].contains(e.target) || $(".ys-header .ys-header-menu")[0].contains(e.target) || $(".ys-header .ys-header-search--mobile")[0].contains(e.target) ) return closeSearchCard(); }) // 搜索 $('.ys-header__search input').keyup(function (e) { if (e.keyCode === 13) { search() } }) $('.ys-header__search .search-btn').click(function () { search() }) // 清空历史记录 $('.ys-header__search-card .search-history span').click(function () { localStorage.removeItem('searchHistory') setHistory() }) // 展开搜索卡片 function openSearchCard() { $('.ys-header__nav').addClass('display-none') $('.ys-header__search-card').addClass('show') $('.ys-header__cover').removeClass('display-none') $('.ys-header__right').addClass('open') } // 收起搜索卡片 function closeSearchCard() { $('.ys-header__nav').removeClass('display-none') $('.ys-header__search-card').removeClass('show') $('.ys-header__cover').addClass('display-none') $('.ys-header__right').removeClass('open') $('.ys-header').removeClass('is-show-mobile-search') } // 搜索事件 function search() { let val = $('.ys-header__search input').val() if (!val) return $message.warning('请输入搜索关键词') let history = JSON.parse(localStorage.getItem('searchHistory')) || [] history.unshift(val) history = [...new Set(history)] localStorage.setItem('searchHistory', JSON.stringify(history.slice(0, 10))) window.open('/search_result.html?keyword=' + val) closeSearchCard() setHistory() } // 设置搜索历史 function setHistory() { let history = JSON.parse(localStorage.getItem('searchHistory')) || [] let html = '' history.forEach(e => { html += `${e}` }) $('.ys-header__search-card .search-history .search-words').html(html) } setHistory() // 移动端搜索 $('.ys-header .ys-header-search--mobile .icon-search').click(function(){ $('.ys-header').addClass('is-show-mobile-search') openSearchCard() }) // 熊猫体育官网首页入口 tabs切换 const moreTypeList = ['information', 'catalog'] // 存在 more 的类型 $('.service-cate li').hover(function () { let type = $(this).attr('data-type') if (type) { $('.service-cate li').removeClass('active') $(this).addClass('active') $('.ys-header__service .content-item').addClass('display-none') $('.ys-header__service .content-item[data-type='+type+']').removeClass('display-none') if(moreTypeList.includes(type)){ $('.service-content-more').not('.' + type).addClass('display-none') $('.service-content-slide').removeClass('display-none') $('.service-content-more.' + type).removeClass('display-none') } else { $('.service-content-more').addClass('display-none') $('.service-content-slide').addClass('display-none') } } }) // 关于我们tabs切换 $('.about-cate-item').hover(function () { let type = $(this).attr('data-type') if (type) { $('.about-cate-item').removeClass('active') $(this).addClass('active') $('.about-content .about-item').addClass('display-none') $('.about-content .about-item[data-type='+type+']').removeClass('display-none') // 用于切换底部更多链接跳转,现在没有更多,如果需要参考上方取消注释 /* $('.about-content-slide').addClass('display-none') $('.about-content-more').addClass('display-none') */ } }) // 点击遮罩 $('.ys-header__cover').click(function(){ closeMenuFold() }) // 抽屉 function openMenuFold() { $('.ys-header .ys-header-menu').addClass('show') $('.ys-header__cover').removeClass('display-none') } function closeMenuFold() { $('.ys-header__cover').addClass('display-none') $('.ys-header .ys-header-menu').removeClass('show') } $('.ys-header .ys-header__menu .icon-menu').click(openMenuFold) $('.ys-header .ys-header-menu .icon-close').click(closeMenuFold) }) $(document).ready(function() { $('.selection-item input[type=checkbox]').each(function(){ $(this).prop('checked', false) }) }) // 更多筛选的展开/收起 $(".ys-product-filter").on("click", ".ys-product-filter__more", function (e) { if ($(this).hasClass('expand')) { $(this).removeClass('expand') $('.ys-product-filter__box .filter-item').each(function() { if (+$(this).attr('data-index') >= 6) { $(this).addClass('display-none') } }) } else { $(this).addClass('expand') $('.ys-product-filter__box .filter-item').removeClass('display-none') showExpand() } e.preventDefault(); }); // 条件过滤项的展开/收起 $(".ys-product-filter__box").on("click", ".filter-item .filter-item-expand", function (e) { if ($(this).hasClass('expand')) { $(this).removeClass('expand') $(this).parent().find('.filter-item-selection').removeClass('expand') $(this).find('span').html('展开') $(this).find('i').removeClass('expand') } else { $(this).addClass('expand') $(this).parent().find('.filter-item-selection').addClass('expand') $(this).find('span').html('收起') $(this).find('i').addClass('expand') } e.preventDefault(); }); // 点击筛选项 let filters = [] $(".ys-product-filter__box").on("click", ".filter-item input[type=checkbox]", function (e) { let id = $(this).attr('id') // 如果第一个就是勾选了分类,则直接跳转分类 if(filters.length === 0 && id.startsWith('c')) { location.href = `/category/${$(this).data('title')}.html` return } let checked = $(this).is(":checked") let type = $(this).parents('.filter-item').attr('data-filter_target') let pid = $(this).parents('.filter-item').attr('data-filter_id') if (checked) { let i = filters.findIndex(i => i.pid === 'category_id') if (i > -1 && pid === 'category_id') { filters[i] = { id, pid, type, title: $(this).attr('data-title') } } else { filters.push({ id, pid, type, title: $(this).attr('data-title') }) } } else { filters.splice(filters.findIndex(i => i.id === id), 1) } filterEvent() }); $(".ys-product-filter").on("click", ".ys-product-filter-checked .icon-close", function () { let id = $(this).parent().data('id') let pid = $(this).parent().data('pid') filters.splice(filters.findIndex(e => e.id == id && e.pid == pid), 1) filterEvent() }); $(".ys-product-filter").on("click", ".ys-product-filter-checked button", function () { filters = [] filterEvent() }); // 筛选事件 function filterEvent() { let params = { filters } if ($('.ys-product-filter').attr('data-category_id')) { params.category_id = $('.ys-product-filter').attr('data-category_id') } window.dispatchEvent( new CustomEvent('product_filter', { detail: params }) ) showFiltered() } // 显示已选筛选项 function showFiltered() { $('.ys-product-filter-checked').remove() let html = '' filters.forEach(e => { html += `
${e.title}
` }) if (filters.length) { $('.ys-product-filter__box').before(`
${html}
`) } } $(function () { window.addEventListener('product_options', setOptions) // 监听筛选项变化事件 showExpand() // 设置筛选项options function setOptions(event) { if (!event.detail || !event.detail.options || !event.detail.options.length) { $('.ys-product-filter__more').addClass('display-none') $('.ys-product-filter__box').addClass('display-none') return } $('.ys-product-filter__box').removeClass('display-none') let html = '' if (event.detail.categorys) { let c_html = '' event.detail.categorys.forEach(e => { c_html += `
i.pid === 'category_id' && i.id === 'c' + e.id) ? 'checked' : ''} />
` }) html += `
分类
`+ c_html + `
展开
` } event.detail.options.forEach((e, i) => { let c_html = '' e.value.forEach(child => { c_html += `
i.pid !== 'category_id' && +i.id === child.id) ? 'checked' : ''} />
` }) html += `
${e.attribute_name}
`+ c_html + `
展开
` }) $('.ys-product-filter__box').html(html) showExpand() if (event.detail.length > 6) { $('.ys-product-filter__more').removeClass('display-none') } } }) // 是否显示展开收起 let filterHeight = 135 // 过滤器高度,超过折叠 function showExpand() { $('.ys-product-filter__box .filter-item').each(function() { let height = $(this).find('.selection-box').height() if (height < filterHeight) { $(this).find('.filter-item-expand').addClass('display-none') } else { $(this).find('.filter-item-expand').removeClass('display-none') } }) } /* 抽屉 start */ function openMobileFilter() { $('.ys-product-filter').addClass('mobile-show') $('.ys-product-filter-cover--mobile').addClass('show') $('body').addClass('overflow-hidden') } function closeMobileFilter() { $('.ys-product-filter').removeClass('mobile-show') $('.ys-product-filter-cover--mobile').removeClass('show') $('body').removeClass('overflow-hidden') } function initMobileFilter () { $('.ys-product-filter-switch').on('click', function() { openMobileFilter() }) $('.filter-mobile-close .icon-close').on('click', function() { closeMobileFilter() }) $('.ys-product-filter-cover--mobile').on('click', function() { closeMobileFilter() }) showExpand() } $(function(){ initMobileFilter() }) /* 抽屉 end */ $(function () { window.addEventListener('product_filter', filter) // 监听筛选结果 window.addEventListener('pager_change', pagerChange) // 监听分页条数变化 window.addEventListener('current_page', currentPage) // 监听页码变化 const params = { page: 1, pageSize: 8, attributes: {}, keyword: '', category_id: '' } const result = { type: -1, total: 0, list: [] } let filters = [] function filter(e) { filters = e.detail.filters if (e.detail.category_id) params.category_id = e.detail.category_id params.attributes = {} filters.forEach(e => { params.attributes[e.pid] = +e.id }) params.page = 1 result.list = [] request() } function pagerChange(e) { params.pageSize = +e.detail params.page = 1 result.list = [] request() } function currentPage(e) { if (e.detail == params.page) return params.page = +e.detail request() } function request() { if ($('.ys-product__spu').data('category_id')) params.category_id = $('.ys-product__spu').data('category_id') result.type = filters.find(e => e.type == 1) ? 1 : 0 $loading.start() $request .post("/api/goods/filter-products", params) .then((res) => { if(res.data && res.data.redirect_url) { window.location.href = res.data.redirect_url return; } window.dispatchEvent( new CustomEvent('product_options', { detail: { options: res.data.options } }) ) $('.ys-product__cate').remove() if ((result.type === 0 && res.data.spus.total > 1) || !res.data.skus.list.length) { $('.ys-product__sku').css('display', 'none') $('.ys-product__spu .ys-product__search').removeClass('display-none') $('.ys-product__spu .ys-product__search .ys-product__total span').html(res.data.spus.total) $('.ys-product__spu .ys-product__search input').val(params.keyword) $('.ys-product__list').removeClass('display-none') result.list = params.page === 1 ? res.data.spus.list : result.list.concat(res.data.spus.list) result.total = res.data.spus.total let spu_html = '' if (result.list.length) { result.list.forEach(e => { spu_html += `
${e.name}

${e.name}

${e.spu_code}

${e.description}

` }) } else { spu_html += `
暂无内容

抱歉,没有找到相关的内容

抱歉,没有找到相关的内容

` } $('.ys-product__list').html(spu_html) } else { result.type = 1 result.list = res.data.skus.list result.total = res.data.skus.total $('.ys-product__list').addClass('display-none') $('.ys-product__spu .ys-product__search').addClass('display-none') $('.ys-product__sku').css('display', 'block') $('.ys-product__sku .ys-product__total span').html(result.total) $('.ys-product__sku .ys-product__search input').val(params.keyword) $('.ys-product__sku .ys-product__search button span').html(0 + '/' + result.list.length) let sku_html = '' if (result.list.length) { result.list.forEach(e => { sku_html += `
保存至清单 图纸 申请试样
` }) $('.ys-product__sku .ys-product__table').html(`
产品名称及描述
产品信息
`+ sku_html + ` `) } else { sku_html += `
暂无内容

抱歉,没有找到相关的内容

抱歉,没有找到相关的内容

` $('.c-pagination-nav').remove() $('.ys-product__sku .ys-product__table').html(sku_html) } $(".c-pagination").html('') $(".c-pagination").zPager({ totalData: result.total, pageStep: 5, current: params.page, pageData: params.pageSize }) } }).finally(() => { $loading.end() }) } // 滚动到底部 $(window).scroll(function () { if (result.type === 0) { if ($(document).scrollTop() + 400 >= $(document).height() - $(window).height()) { if (result.total > params.page * params.pageSize && !$loading.status) { params.page++ request() } } } }) // spu搜索框事件 $("body").on("click", ".ys-product__input--spu i", function (e) { let val = $(this).parent().find('input').val() search(val) }); $("body").on("keyup", ".ys-product__input--spu input", function (e) { let val = $(this).val() if (e.keyCode === 13) { search(val) } }); // sku搜索事件 $("body").on("click", ".ys-product__sku .ys-product__input i", function (e) { let val = $(this).parent().find('input').val() search(val) }); $("body").on("keyup", ".ys-product__sku .ys-product__input input", function (e) { let val = $(this).val() if (e.keyCode === 13) { search(val) } }); function search(val) { params.keyword = val params.page = 1 result.list = [] request() } // 分页 $("body").on("click", ".c-page-item", function (e) { if ($(this).hasClass('disabled')) return params.page = +$(this).attr('data-page') request() }); }) // 点击表格行(选中/取消选中) let compare_skus = [] $('.ys-product__table').on('click', '.product-table-item input', function (e) { let checked = $(this).is(':checked') if (checked) { compare_skus.push($(this).attr('id')) } else { compare_skus.splice( compare_skus.findIndex((e) => e === $(this).attr('id')), 1 ) } $('.ys-product__search button span').html( compare_skus.length + '/' + ($('.product-table-item').length - $('.product-table-item.display-none').length) ) $('.ys-product__action .batch-action-num i').text(compare_skus.length) if (compare_skus.length) { $('.ys-product__search button').removeClass('disabled') $('.ys-product__action').addClass('active') } else { $('.ys-product__search button').addClass('disabled') $('.ys-product__action').removeClass('active') } }) // 开始对比按钮 $('.ys-product__sku').on('click', '.ys-product__search button', function (e) { if (!compare_skus.length) return if (compare_skus.length < 2) return $message.info("请至少选择两种物料") window.open('/compare.html?sku_code=' + compare_skus.join(',')) }) $(".ys-product__sku").on("click", ".ys-product__search button div", function (e) { compare_skus = [] $('.product-table-item').each(function() { $(this).find('input').prop('checked', false) }) $('.ys-product__search button span').html(compare_skus.length + '/' + ($('.product-table-item').length - $('.product-table-item.display-none').length)) $('.ys-product__search button').addClass('disabled') $('.ys-product__action .batch-action-num i').text(compare_skus.length) $('.ys-product__action').removeClass('active') e.preventDefault(); }); // 保存至清单 $('.ys-product__sku').on('click', '.save-sku', function (e) { if (!$isLogin) { $message.info('请先登录') return } let sku_id = $(this).attr('data-id') $request.post('/api/user/collect', { sku_id }).then((res) => { $message.success('保存成功') }) }) // 批量保存至清单 $('.ys-product__action .batch-action-save').on('click', function (e) { if (!$isLogin) { $message.info('请先登录') return } $request .post('/api/user/collect', { sku_id: $('.product-table-item:has(input:checked) .save-sku') .map(function () { return $(this).data('id') }) .toArray(), }) .then((res) => { $message.success('保存成功') // 取消选择 $('.ys-product__search button div').click() }) }) // 分页 function currentPage(currentPage) { window.dispatchEvent( new CustomEvent('current_page', { detail: currentPage, }) ) } function changePager(sizes) { window.dispatchEvent( new CustomEvent('pager_change', { detail: sizes, }) ) } // 清除选中 window.addEventListener('clearSku', clearSku) function clearSku() { compare_skus = [] } // empty 联系客服 $('.ys-product__table').on('click', '.product-table-service', function (e) { window.dispatchEvent( new CustomEvent('openService') ) }) // 处于页面配置时,绑定方法 if ($isDecorateMode) { document.addEventListener('diy_footer/1', (event) => { const { field, value } = event.detail console.log(field, value) if (field === 'footer_ad') { const nodes = $( value .map((item) => `${item.alt}`) .join('') ) $('.ys-footer__ad').empty() $('.ys-footer__ad').append(nodes) } else if (field === 'contact_phone') { $('.footer_phone').text(value) } else if (field === 'work_time') { $('.footer_work_time').text(value) } else if (field === 'contact_email') { $('.footer_email').text(value) } else if (field === 'footer_nav') { const nodes = $( value .map( (c) => ` ` ) .join('') ) $('.ys-footer__content .center-part').empty() $('.ys-footer__content .center-part').append(nodes) } else if (field === 'right_part') { const nodes = $( value .map((item) => `${item.alt}`) .join('') ) $('.ys-footer__content .right-part').empty() $('.ys-footer__content .right-part').append(nodes) } else if (field === 'friendly_links') { const nodes = $( value .map( (e) => `
  • ${e.title}
  • ` ) .join('') ) $('.ys-footer__friendly ul').empty() $('.ys-footer__friendly ul').append(nodes) } else if (field === 'copyright') { $('.copyright-wrap span').text(value) } else if (field === 'beian') { $('.copyright-wrap a').text(value) } else if (field === 'footer_logo') { $('.footer-logo').attr('alt', value.alt) $('.footer-logo').attr('src', value.src) } else if (field === 'map_links') { const nodes = $( value .map( (e) => ` ${e.title} ` ) .join('') ) $('.ys-footer__end .end-link').empty() $('.ys-footer__end .end-link').append(nodes) } }) } // 底部导航折叠面板 $('.ys-footer__content .center-part').on('click','.content-link__title',function(){ const item = $(this) item.parent().toggleClass('show') item.next().stop().slideToggle() }) window.addEventListener('openService', openService) // 监听全局客服点击事件 // 打开客服弹窗 function openService() { if ($('#aff-im-root .embed-toolbar-btn').length > 0) { $('#aff-im-root .embed-toolbar-btn').eq(0).click() } else { window.open('https://affimvip.baidu.com/cps5/chat?siteToken=a7ba6ebbc2c4e8d66bd2f203b94d6c07&siteId=16910226', '_blank') } } $('.ys-tabbar__service').click(function(){ openService() })