// 处于页面配置时，绑定方法 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 += `<a class="hover--underline-primary" target="_blank" href="/search_result.html?keyword=${e.name}" title="${e.name}">${e.name}</a>`
      })
      $('.' + 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')
    if(!$(this).hasClass('ignore'))
    $('.ys-header__cover').removeClass('display-none')
  }, function () {
    $(this).find('.ys-header__card').removeClass('show')
    $('.ys-header__cover').addClass('display-none')
  })
  // 产品中心悬停
  $('.ys-header__nav .product-item').hover(function () {
    $('.ys-header__nav .product-child').addClass('display-none')
    $('.ys-header__nav .product-item').removeClass('active')
    $(this).addClass('active')
    $(this).next().removeClass('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')) {
      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')
  }
  // 搜索事件
  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 += `<a class="hover--underline-primary" target="_blank" href="/search_result.html?keyword=${e}" title="${e}">${e}</a>`
    })
    $('.ys-header__search-card .search-history .search-words').html(html)
  }
  setHistory()
})

// 客服
$('.ys-header-shortcut__server span').click(function(){
  window.dispatchEvent(
    new CustomEvent('openService')
  )
})
// 点击tabs项
$(".ys-search__tabs").on("click", "li", function (e) {
  $(".ys-search__tabs li").removeClass('active')
  $(this).addClass('active')
  let type = $(this).attr('data-type')
  $('.ys-search__result').each(function (e) {
    if ($(this).attr('data-target') == type) {
      $(this).removeClass('display-none')
    } else {
      $(this).addClass('display-none')
    }
  })
  delete params.attributes
  filters = []
  $('.ys-product-filter-checked').remove()
  if (type === 'content') {
    result.type = $('.result-type input:checked').val()
  } else {
    result.type = type
  }
  params.page = 1
  request()
  e.preventDefault();
});

// 点击筛选项
let filters = []
$(".ys-product-filter__box").on("click", ".filter-item input[type=checkbox]", function (e) {
  let id = $(this).attr('id').replace('attr-','')
  let checked = $(this).is(":checked")
  let pid = $(this).parents('.filter-item').attr('data-filter_id')
  if (checked) {
    filters.push({
      id,
      pid,
      title: $(this).attr('data-title')
    })
  } else {
    filters.splice(filters.findIndex(i => i.id === id), 1)
  }
  handleFilterRequest()
});
$(".ys-product-filter").on("click", ".ys-product-filter-checked .icon-close", function () {
  let id = $(this).parent().data('id')
  let pid = $(this).parent().data('pid')
  if(pid === 'category_id') {
    handleClearChecked($('#' + id))
  }else {
    handleClearChecked($('#attr-' + id))
  }
  filters.splice(filters.findIndex(e => e.id == id && e.pid == pid), 1)
  handleFilterRequest()
});
$(".ys-product-filter").on("click", ".ys-product-filter-checked button", function () {
  filters = []
  $('.selection-item.checked').removeClass('checked')
  handleClearAllChecked()
  handleFilterRequest()
});
function handleClearAllChecked() {
  $('.selection-item input[type=checkbox]').prop('checked', false)
}
function handleFilterRequest() {
  params.attributes = {}
  filters.forEach(e => {
    params.attributes[e.pid] = +e.id
  })
  params.page = 1
  result.list = []
  request()
  showFiltered()
}
// 显示已选筛选项
function showFiltered() {
  $('.ys-product-filter-checked').remove()
  let html = ''
  filters.forEach(e => {
    html += `
    <div class="checked-item" data-id="${e.id}" data-pid="${e.pid}">
      ${e.title} <i class="iconfont icon-close"></i>
    </div>
    `
  })
  if (filters.length) {
    $('.ys-product-filter__box').before(`
      <div class="ys-product-filter-checked">
        ${html}
        <button>清空筛选</button>
      </div>
    `)
  }
}

// 设置筛选项options
  // 如果detail中不存在，则禁用
  function setOptionsDisable(options){
    if (!options || !options.length) {
      $('.ys-product-filter').addClass('display-none')
      return
    }
    $('.ys-product-filter__box').removeClass('display-none')
    
    // 将不在options里的数据全部禁用
    handleOptionItemDisable(options)
  }
  function handleOptionItemDisable(options){
    const optionsIdMap = handleOptionsIdMap(options)

    $('.filter-item.options .selection-item').addClass('disable')

    $('.filter-item.options').each(function(){
      const pid = $(this).data('filter_id')
      if(!optionsIdMap[pid]) return

      $(this).find('.selection-item').each(function(){
        const item = $(this).find('input[type=checkbox]')
        const id = item.attr('id').replace('attr-','')
        if(!optionsIdMap[pid][id]) return
        
        $(this).removeClass('disable')
        // item.prop('checked', true)
      })
    })
    // $('.selection-item input[type=checkbox]').each(function(){
      // $(this).prop('checked', false)
    // })
  }
  function handleOptionsIdMap(options){
    if(!Array.isArray(options) || !options.length ) return {}
    const idMap = {}
    options.forEach((e) => {
      if(!idMap[e.id]) idMap[e.id] = {}
      e.value.forEach(child => {
        idMap[e.id][child.id] = 1
      })
    })
    return idMap
  }

// 设置筛选项options
function setOptions(options) {
  if (!options || !options.length) {
    $('.ys-product-filter').addClass('display-none')
    return
  }
  $('.ys-product-filter').removeClass('display-none')
  let html = ''
  options.forEach((e, i) => {
    let c_html = ''
    e.value.forEach(child => {
      c_html += `
        <div class="selection-item">
          <input id="${child.id}" type="checkbox" data-title="${child.attribute_value}" ${filters.find(i => i.pid !== 'category_id' && +i.id === child.id) ? 'checked' : ''} />
          <label for="${child.id}">
            <span>${child.attribute_value}</span>
          </label>
        </div>
      `
    })
    html += `
      <div class="filter-item ${i < 6 ? '' : 'display-none'}" data-index="${i}" data-filter_id="${e.id}">
        <div class="filter-item-title">${e.attribute_name}</div>
        <div class="filter-item-selection">
          <div class="selection-box">
          `+ c_html + `
          </div>
        </div>
        <div class="filter-item-expand">
          <span>展开</span> <i class="iconfont icon-short-arrow"></i>
        </div>
      </div>
    `
  })
  $('.ys-product-filter__box').html(html)
}
/******** 筛选器搜索过滤 begin *********/
$('.ys-product-filter').on('input', '.filter-item-search', function(){
  const text = $(this).val()
  const selectionItemList = $(this).parents('.filter-item').find('.selection-item')
  selectionItemList.each(function(i,e){
    const current = $(e).find('label>span').text()
    if(!queryMatch(text, current)){
      $(e).addClass('display-none')
      return
    }
    $(e).removeClass('display-none')
  })
})
function queryMatch(query, current) {
  let parsedQuery = String(query).replace(/(\^|\(|\)|\[|\]|\$|\*|\+|\.|\?|\\|\{|\}|\|)/g, '\\$1');
  const visible = new RegExp(parsedQuery, 'i').test(current);
  
  return visible;
}
/******** 筛选器搜索过滤 end *********/


/******** 筛选器重置按钮 begin *********/
$('.ys-product-filter').on('click', '.filter-item-reset', function(){
  const parent = $(this).parent()
  const pid = parent.data('filter_id')
  parent.find('.selection-item input[type=checkbox]').prop('checked', false)
  parent.find('.selection-item.checked').removeClass('checked')
  filters = filters.filter(e => e.pid != pid)
  handleFilterRequest()
})
function handleClearChecked(item){
  if(!item) return
  item.prop('checked', false)
}
/******** 筛选器重置按钮 end *********/

/******** 筛选器 swiper begin *********/
const filterSwiper = new Swiper(".ys-product-filter__box", {
  slidesPerView: "auto",
  // scrollbar: ".swiper-scrollbar",
  scrollbarHide: false,
  mousewheelControl: false,
  scrollbarDraggable: true,
  noSwipingSelector: 'input,label,button,.selection-item',
  scrollbar: {
    el: '.swiper-scrollbar',
    draggable: true
  },
})
function updateFilterSwiper() {
  filterSwiper.update()
  filterSwiper.onResize();
}
/******** 筛选器 swiper end *********/

const params = {
  page: 1,
  pageSize: 8,
  keyword: ''
}
const result = {
  total: 0,
  list: [],
  has_more: false,
  type: 'product'
}
params.keyword = parsePath(window.location).query.keyword

if ($('.product-table-item').length) {
  $(".c-pagination").zPager({
    totalData: +$('.ys-search__result[data-target="product"]').find('.result-num span').text(),
    pageStep: 5,
    current: params.page,
    pageData: params.pageSize
  })
}
// 分页
function currentPage(currentPage) {
  if (params.page === currentPage) return
  params.page = currentPage
  request()
}
function changePager(sizes) {
  params.pageSize = sizes
  params.page = 1
  result.list = []
  request()
}


// 搜索事件
$(".ys-search").on("click", ".ys-search__input i", function (e) {
  let val = $(this).parent().find('input').val()
  search(val)
});
$(".ys-search").on("keyup", ".ys-search__input input", function (e) {
  let val = $(this).val()
  if (e.keyCode === 13) {
    search(val)
  }
});
function search(query) {
  if (!query) return $message.warning('请输入搜索关键词')
  location.href = location.pathname + `?keyword=${query}`
  // 1/11调整：执行搜索的时候，路由一起改变
  // $('.ys-search__title').html('正在搜索“' + e + '”')
  // params.keyword = e
  // params.page = 1
  // request()
}
function request() {
  $loading.start()
  $request
    .post("/api/search/" + result.type, params)
    .then((res) => {
      if(res.data.redirect_url) {
        window.location.href = res.data.redirect_url
        return;
      }

      result.list = params.page === 1 || result.type === 'product' ? res.data.list : result.list.concat(res.data.list)
      result.total = res.data.total
      result.has_more = res.data.has_more
      $('.ys-search__result .result-num span').html(res.data.total)
      $('.ys-search__empty').remove()
      let html = ''
      $('.ys-search__result').each(function() {
        if ($(this).attr('data-target') === result.type) {
          $(this).removeClass('display-none')
        }
      })
      if (result.type === 'content') {
        $('.ys-search__result[data-target="product"]').addClass('display-none')
        $('.ys-search__solution').css('display', 'none')
        $('.ys-search__article').css('display', 'block')
        result.list.forEach(content => {
          html += `
          <div class="article-item">
            <a class="article-img img-scale" target="_blank" href="/information/${content.route_code}.html" title="${content.title}">
              <img src="${content.cover_img || ''}" alt="${content.title}" />
            </a>
            <div class="article-info">
              <a class="article-title" href="/information/${content.route_code}.html" title="${content.title}">
                <h2>${content.title}</h2>
              </a>
              ${content.tags.length ? `
                <div class="article-tag">
                  ${content.tags
                    .map(
                      (s) => `<span>${s}</span>`
                    )
                    .join('')}
                </div>
              `:''}
              <p class="article-desc" title="${content.abstract}">
                ${content.abstract}
              </p>
              <p class="article-time">
                <span><i class="iconfont icon-time"></i>${content.publish_time}</span>
                <span><i class="iconfont icon-eye"></i>${content.clicks}</span>
              </p>
            </div>
          </div>
          `
        })
        if(result.list.length) {
          $('.ys-search__result[data-target="content"]').removeClass('display-none')
          if (!$('.ys-search__result[data-target="content"]').find('.ys-search__slide').length) {
            $('.ys-search__article').before('<div class="ys-search__slide"></div>')
          }
        }
        $('.ys-search__article').html(html)
      } else if (result.type === 'solution') {
        $('.ys-search__result[data-target="product"]').addClass('display-none')
        $('.ys-search__article').css('display', 'none')
        $('.ys-search__solution').css('display', 'flex')
        result.list.forEach(sector => {
          html += `
          <div class="grid-item">
            <a class="solution-img img-scale" target="_blank" href="/solution/article/${sector['route_code']}.html">
              <img src="${sector.cover_img || ''}" alt="${sector['title']}" title="${sector['title']}" />
            </a>
            <a class="solution-title" href="/solution/article/${sector['route_code']}.html" title="${sector['title']}">
              <h2>
                ${sector['title']}
              </h2>
            </a>
            <p class="solution-desc" title="${sector['abstract']}">
              ${sector['abstract']}
            </p>
          </div>
          `
        })
        if(result.list.length) {
          $('.ys-search__result[data-target="content"]').removeClass('display-none')
          if (!$('.ys-search__result[data-target="content"]').find('.ys-search__slide').length) {
            $('.ys-search__article').before('<div class="ys-search__slide"></div>')
          }
        }
        $('.ys-search__solution').html(html)
      } else {
        $('.ys-search__result[data-target="content"]').addClass('display-none')
        result.list.forEach(e => {
          html += `
          <tr class="product-table-item" data-alias_code="${e.alias_code}">
              <td class="product-table-cell">
                <a href="/product/${e.route_code}.html" class="product-table-img img-scale p-img">
                  <img src="${e.cover_img}" alt="${e.name}" />
                </a>
              </td>
              <td class="product-table-cell">
                <a class="hover--underline-primary" href="/product/${e.route_code}.html" title="${e.sku_code}">${e.sku_code}</a>
              </td>
              <td class="product-table-cell">
                <a href="/product/${e.route_code}.html" title="${e.name}">
                  <p title="${e.name}" class="line-2 product-table-desc">${e.name}</p>
                </a>
              </td>
              <td class="product-table-cell">
                ${
                  e.paper_2d
                  ? `<a class="hover--underline-primary product-table-draw" data-url="${e.paper_2d}" href="${e.paper_2d}" title="2D图纸" target="_blank">
                      <i class="iconfont icon-frame"></i>
                    </a>`
                  : `<i class="iconfont icon-frame disabled" title="暂无图纸"></i>`
                }
              </td>
              <td class="product-table-cell">
                ${
                  e.paper_3d
                  ? `<a class="hover--underline-primary product-table-draw" data-url="${e.paper_3d}" href="${e.paper_3d}" title="3D图纸" target="_blank">
                      <i class="iconfont icon-down"></i>
                    </a>`
                  : `<i class="iconfont icon-down disabled" title="暂无图纸"></i>`
                }
              </td>
              <td class="product-table-cell">
                <button class="product-table-enquiry c-button--primary">立即询价</button>
              </td>
            </tr>
          `
        })
        $('.ys-search__product .ys-product__table').html(`
          <thead class="product-table-header">
            <tr>
              <th class="product-table-cell">商品图片</th>
              <th class="product-table-cell">物料编码</th>
              <th class="product-table-cell">物料名称</th>
              <th class="product-table-cell">2D图纸</th>
              <th class="product-table-cell">3D图纸</th>
              <th class="product-table-cell">询价</th>
            </tr>
          </thead>
          `+ html + `
        `)
        $('.ys-search__result button span').html(compare_skus.length + '/' + $('.ys-search__product .product-table-item').length)
        if (!result.list.length) {
          $('.ys-search__result[data-target="product"]').addClass('display-none')
        } else {
          $('.ys-search__result[data-target="product"]').removeClass('display-none')
          $(".c-pagination").zPager({
            totalData: result.total,
            pageStep: 5,
            current: params.page,
            pageData: params.pageSize
          })
        }
        setOptionsDisable(res.data.options)
      }
      if (!result.list.length) {
        $('.ys-search__slide').remove()
        $('.ys-search').append(`<div class="ys-search__empty">
          <img src="/asset/img/product_nodata.png" alt="暂无内容">
          <p>抱歉，没有找到相关的内容</p>
          <p>抱歉，没有找到相关的内容</p>
        </div>`)
      }
    }).finally(() => {
      $loading.end()
    })
}
// 切换资讯/解决方案
$(".ys-search__result").on("click", ".result-type input", function (e) {
  result.type = $(this).val()
  params.page = 1
  request()
});

// 滚动到底部
$(window).scroll(function () {
  if (result.type === 'product') return
  if ($(document).scrollTop() + 400 >= $(document).height() - $(window).height()) {
    if (result.has_more && !$loading.status) {
      params.page++
      request()
    }
  }
})
// 点击表格行（选中/取消选中）
let compare_skus = []
$(".ys-search__result").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-search__result button span').html(compare_skus.length + '/' + $('.product-table-item').length)
  
  $('.ys-product__action .batch-action-num i').text(compare_skus.length)
  if (compare_skus.length) {
    $('.ys-search__result button').removeClass('disabled')
    $('.ys-product__action').addClass('active')
  } else {
    $('.ys-search__result button').addClass('disabled')
    $('.ys-product__action').removeClass('active')
  }
});
// 开始对比按钮
$(".ys-search__result").on("click", ".ys-search__num 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-search__result").on("click", ".ys-search__num button div", function (e) {
  compare_skus = []
  $('.product-table-item').each(function() {
    $(this).find('input').prop('checked', false)
  })
  $('.ys-search__result button span').html(compare_skus.length + '/' + $('.product-table-item').length)
  $('.ys-search__result button').addClass('disabled')
  $('.ys-product__action .batch-action-num i').text(compare_skus.length)
  $('.ys-product__action').removeClass('active')
  e.preventDefault();
});
// 保存至清单
$('.ys-search__product').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('保存成功')
      // 取消选择
      $(".product-table-item input[type='checkbox']").prop('checked', false)
    })
})

// 客服
$('.ys-product__table').on('click', '.product-table-enquiry', function() {
  window.dispatchEvent(
    new CustomEvent('openService')
  )
})

/* 埋点方法 start */
$(function() {
  productViewListItem() // 搜索列表展示
  productSelectItemClick() // 搜索列表点击
})

const ItemListId = 'search_products_list'; // ga view_item_list 列表id
const ItemListName = 'Search products list';// ga view_item_list 列表名称
function productViewListItem() {
  const itemsInfoList = getProductListInfo({from_search: $('.ys-search__title > span').text()})
  if(!Array.isArray(itemsInfoList) || !itemsInfoList.length) return
  const ecommerceListObj = {
    event: "view_item_list",
    ecommerce: {
      item_list_id: ItemListId,
      item_list_name: ItemListName,
      items: itemsInfoList,
    }
  }
  customEventLog('ecommerce', ecommerceListObj, {onlyTrack: ["DataLayerTracker"]})
}

function getProductListInfo(otherInfo = {}) {
  const itemInfoList = []
  $('.ys-search__product .product-table-item').each(function (index, value) {
    const colsEle = $(this).children("td");
    const item = {
      item_id: colsEle.eq(1).find('a').text(),
      item_name: colsEle.eq(2).find('.product-table-desc').text(),
      index: index + 1,
      item_list_id: ItemListId,
      item_list_name: ItemListName,
      ...otherInfo || {} // 其他自定义属性 主要为 {from_search: 搜索词} 分辨是否经过过滤
    }
    itemInfoList.push(item)
  })

  return itemInfoList
}

// 列表点击商品
function productSelectItemClick() {
  $('.ys-search__product').on('click', '.product-table-img', productSelectItem)
  $('.ys-search__product').on('click', '.product-table-item > .product-table-cell:nth-child(2) a', productSelectItem)
  $('.ys-search__product').on('click', '.product-table-item > .product-table-cell:nth-child(3) a', productSelectItem)
}
function productSelectItem() {
  const tableItemEle = $(this).parents('.product-table-item')
  const colsEle = tableItemEle.children("td")

  const ecommerceItemObj = {
    event: "select_item",
    ecommerce : {
      item_list_id: ItemListId,
      item_list_name: ItemListName,
      items: [{
        item_id: colsEle.eq(1).find('a').text(),
        item_name: colsEle.eq(2).find('.product-table-desc').text(),
        index: tableItemEle.index() + 1,
        item_list_id: ItemListId,
        item_list_name: ItemListName,
        from_search: $('.ys-search__title > span').text()
      }]
    }
  }
  customEventLog('ecommerce', ecommerceItemObj, {onlyTrack: ["DataLayerTracker"]})
}

// 图纸点击
$('.ys-search__result').on('click', '.product-table-draw', function() {
  const drawEle = $(this)
  const tableItemEle = drawEle.parents('.product-table-item')
  const colsEle = tableItemEle.children("td")

  const drawInfo = {
    draw_type: drawEle.attr('title') === '2D图纸' ? '2d' : '3d', // 图纸类型
    draw_event_type: 'preview', // 事件类型
    draw_item_id: colsEle.eq(1).find('a').text(), // sku
    draw_item_name: colsEle.eq(2).find('.product-table-desc').text(), // name
    from_list_name: ItemListName // 列表名称
  }

  customEventLog("set", { key:'clue', value:'click_draw_list'}, {onlyTrack: ["ClarityTracker"]}); // clarity标签
  customEventLog('click_draw', drawInfo, {onlyTrack: ["DataLayerTracker"]})
})
/* 埋点方法 end */
// 处于页面配置时，绑定方法
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) => `<img src="${item.src}" alt="${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) => `
           <nav class="content-link">
            <span>${c.category}</span>
            <ul class="children-link-wrap">
              ${c.children
                .map(
                  (s) => `
                      <li>
                        <a href="${s.href}" target="_blank" title="${s.title}">${s.title}</a>
                      </li>
                  `
                )
                .join('')}
            </ul>
          </nav>
      `
          )
          .join('')
      )
      $('.ys-footer__content .center-part').empty()
      $('.ys-footer__content .center-part').append(nodes)
    } else if (field === 'right_part') {
      const nodes = $(
        value
          .map((item) => `<img src="${item.src}" alt="${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) => `
            <li>
              <a href="${e.href}" target="_blank" title="${e.title}" ref="${e.nofollow ? 'nofollow' : ''}">${e.title}</a>
            </li>
          `
          )
          .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) => `
            <a href="${e.href}" target="_blank" title="${e.title}" ref="${e.nofollow ? 'nofollow' : ''}">${e.title}</a>
          `
          )
          .join('')
      )
      $('.ys-footer__end .end-link').empty()
      $('.ys-footer__end .end-link').append(nodes)
    }
  })
}

window.addEventListener('openService', openService) // 监听全局客服点击事件

$('#backTop').click(function () {
  $('html, body').animate({ scrollTop: 0 }, 300)
})
$('.ys-rightNav .online-serve').click(function() {
  openService()
})
// 打开客服弹窗
function openService() {
  if ($('#aff-im-root .embed-icon-pcIcon5').length > 0) {
    $('#aff-im-root .embed-icon-pcIcon5').click()
  } else {
    $('#newBridge .nb-icon-wrap').click()
  }
  customEventLog("open_server"); // 打点
  customEventLog("set", { key:'purchase', value:'service'}, {onlyTrack: ["ClarityTracker"]}); // clarity标签
}
// 监听页面滚动
$(window).scroll(function () {
  $('.ys-rightNav #backTop').css('display', $(document).scrollTop() ? 'block' : 'none')
})