// 处于页面配置时,绑定方法 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)
})
/** 页码相关 **/
const defaultPageSize = 8
// 设置页码默认值,推荐在模板引擎控制option的selected
function initPageSize(pageSize, className = '.c-page-selector') {
if (!pageSize || isNaN(Number(pageSize))) {
pageSize = defaultPageSize
}
$(`${className} option[value=${pageSize}]`).attr('selected', true)
}
initPageSize($('.c-page-selector').data('default'))
// 页面切换每页个数
$('.c-page-selector').change(function () {
let sizes = $(this).val()
// 默认值
if (!sizes || isNaN(Number(sizes))) {
sizes = defaultPageSize
}
let query = parsePath(location.href).query || {}
if (query.cid) {
location.href =
location.origin +
location.pathname +
'?cid=' +
query.cid +
'&page=1&pageSize=' +
sizes
} else {
location.href =
location.origin + location.pathname + '?page=1&pageSize=' + sizes
}
})
function initPagination() {
const total = +$('.c-pagination-nav').data('total') || 0
const page = +$('.c-pagination-nav').data('page') || 1
const pageSize = +$('.c-page-selector').data('default') || defaultPageSize
const pageNum = Math.floor(total / pageSize) + 1
if (pageNum > 5) {
let query = parsePath(location.href).query || {}
if (page <= 3) {
$('.c-page-item').each(function () {
let p = +$(this).data('page')
if (p && p > page + 1 && p !== pageNum) {
$(this).css('display', 'none')
}
if (p === pageNum) {
let more = `
...
`
$(this).before(more)
}
})
} else if (page >= pageNum - 2) {
$('.c-page-item').each(function () {
let p = +$(this).data('page')
if (p && p < pageNum - 1 && p !== 1 && p !== page - 1 && p !== page) {
$(this).css('display', 'none')
}
if (p === 1) {
let more = `
...
`
$(this).after(more)
}
})
} else {
$('.c-page-item').each(function () {
let p = +$(this).data('page')
if (
p &&
p > 1 &&
p < pageNum &&
p !== page - 1 &&
p !== page + 1 &&
p !== page
) {
$(this).css('display', 'none')
}
if (p === 1) {
let more = `
...
`
$(this).after(more)
}
if (p === pageNum) {
let more = `
...
`
$(this).before(more)
}
})
}
}
}
initPagination()
// 处于页面配置时,绑定方法
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) => ` `)
.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) => `
${c.category}
${c.children
.map(
(s) => `
${s.title}
`
)
.join('')}
`
)
.join('')
)
$('.ys-footer__content .center-part').empty()
$('.ys-footer__content .center-part').append(nodes)
} else if (field === 'right_part') {
const nodes = $(
value
.map((item) => ` `)
.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()
})