{{define "header"}}
{{$appAddr := .appConfig.AppAddr}}
<link rel="stylesheet" href="/static/css/header.css?v=12">
<header class="site-header">
  <div class="site-header__left">
    <button class="site-header__icon-btn only-h5" type="button" aria-label="菜单" data-drawer-open>
      <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/menu.svg" alt="菜单">
    </button>
    <a class="brand" href="/">
      <img decoding="async" loading="lazy" class="brand__logo" src="/static/images/placeholder.png?v=2" data-src="/static/logo.png" alt="黄果短剧">
    </a>
    <nav class="nav only-pc" aria-label="主导航">
      {{range .categoryList}}
      {{if navHasMegaMenu .URLValue}}
      <div class="nav__item-wrap">
        <a class="nav__item{{if navIsActive .URLValue $.requestPath}} is-active{{end}}" href="{{navHref .URLValue}}" {{externalLinkAttrs (navHref .URLValue)}} aria-haspopup="true">{{.Name}}</a>
        <div class="nav__mega" role="menu" aria-label="{{.Name}}快捷筛选">
          <div class="nav__mega-col nav__mega-col--themes">
            <p class="nav__mega-label">题材</p>
            <div class="nav__mega-chips">
              {{$themeSeg := listThemeSegment $.requestPath}}
              {{range $.themeList}}
              <a class="nav__mega-chip{{if or (eq $themeSeg .Slug) (eq $themeSeg (printf "%d" .ID))}} is-active{{end}}" href="{{allListURL .Slug .ID 0 1 1}}" role="menuitem">{{.Name}}</a>
              {{end}}
            </div>
          </div>
          <div class="nav__mega-col nav__mega-col--status">
            <p class="nav__mega-label">状态</p>
            <div class="nav__mega-chips">
              {{$status := listUpdateStatus $.requestPath}}
              <a class="nav__mega-chip{{if eq $status 0}} is-active{{end}}" href="{{allListURL "" 0 0 1 1}}" role="menuitem">全部</a>
              <a class="nav__mega-chip{{if eq $status 1}} is-active{{end}}" href="{{allListURL "" 0 1 1 1}}" role="menuitem">连载中</a>
              <a class="nav__mega-chip{{if eq $status 2}} is-active{{end}}" href="{{allListURL "" 0 2 1 1}}" role="menuitem">已完结</a>
            </div>
          </div>
          <div class="nav__mega-col nav__mega-col--links">
            <p class="nav__mega-label">快捷入口</p>
            {{range $i, $cfg := $.homeConfigPlaylets}}
            <a class="nav__mega-link" href="{{moreListURL $cfg.Slug $cfg.ID 0 "" 0 1}}" role="menuitem">
              {{if eq $cfg.Name "预告片"}}
              <img decoding="async" loading="lazy" class="icon icon--sm" src="/static/images/placeholder.png?v=2" data-src="/static/images/film2.svg" alt="短剧入口">
              {{else}}
              <img decoding="async" loading="lazy" class="icon icon--sm" src="/static/images/placeholder.png?v=2" data-src="{{navMegaIcon $i}}" alt="{{$cfg.Name}}入口">
              {{end}}
              {{$cfg.Name}}
            </a>
            {{end}}
          </div>
        </div>
      </div>
      {{else}}
      {{$isDownload := navIsDownload .URLValue .Name}}
      <a class="nav__item{{if navIsActive .URLValue $.requestPath}} is-active{{end}}" href="{{if $isDownload}}{{if $appAddr}}{{$appAddr}}{{else}}/download-app{{end}}{{else}}{{navHref .URLValue}}{{end}}"{{if and $isDownload $appAddr}} target="_blank" rel="sponsored nofollow noopener"{{else if not $isDownload}} {{externalLinkAttrs (navHref .URLValue)}}{{end}}>{{.Name}}</a>
      {{end}}
      {{end}}
    </nav>
  </div>
  <div class="site-header__right">
    <form class="search only-pc" action="/search" method="get" role="search" data-path-search data-header-search>
      <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/search.svg" alt="搜索">
      <input class="search__input" type="search" placeholder="搜索剧名 / 演员 / 标签" autocomplete="off" data-header-search-input{{if .query}} value="{{.query}}"{{end}} aria-autocomplete="list" aria-expanded="false" aria-controls="header-search-dropdown">
      <button class="search__clear" type="button" aria-label="清除搜索词" data-header-search-clear{{if not .query}} hidden{{end}}>
        <img decoding="async" loading="lazy" src="/static/images/placeholder.png?v=2" data-src="/static/images/close.svg" alt="关闭">
      </button>
      <div class="search-dropdown" id="header-search-dropdown" data-header-search-dropdown hidden>
        <div class="search-dropdown__idle" data-header-search-idle>
        <section class="search-dropdown__history" aria-label="搜索历史" data-header-search-history hidden>
          <div class="search-dropdown__head">
            <h2 class="search-dropdown__label">搜索历史</h2>
            <button class="search-dropdown__clear" type="button" aria-label="清除搜索历史" data-header-history-clear>
              <img decoding="async" loading="lazy" src="/static/images/placeholder.png?v=2" data-src="/static/images/close.svg" alt="清除">
            </button>
          </div>
          <div class="search-dropdown__chips" data-header-history-chips></div>
        </section>
        {{if .searchTrends}}
        <section class="search-dropdown__hot" aria-label="热门搜索">
          <h2 class="search-dropdown__label">热门搜索</h2>
          <ol class="search-dropdown__list">
            {{range .searchTrends}}
            <li class="search-dropdown__item">
              <a class="search-dropdown__link" href="{{searchResultsURL .Title}}">
                <span class="search-dropdown__rank{{if le .Rank 3}} is-top{{end}}">{{.Rank}}</span>
                <span class="search-dropdown__name">{{.Title}}</span>
                {{if .Badge}}
                <span class="search-dropdown__badge{{if eq .Badge "新"}} search-dropdown__badge--new{{else}} search-dropdown__badge--hot{{end}}">{{.Badge}}</span>
                {{end}}
                <span class="search-dropdown__heat">{{.Heat}}</span>
              </a>
            </li>
            {{end}}
          </ol>
        </section>
        {{end}}
        </div>
        <div class="search-dropdown__suggest" data-header-search-suggest hidden aria-label="搜索联想"></div>
      </div>
    </form>
    {{$bizTG := or .appConfig.TGGroup .appConfig.Telegram}}
    {{if $bizTG}}
    <a class="site-header__icon-btn site-header__tg only-h5" href="{{$bizTG}}" target="_blank" rel="sponsored nofollow noopener" aria-label="商务合作 Telegram">
      <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/brand-telegram.svg" alt="Telegram">
    </a>
    {{end}}
    <a class="site-header__icon-btn only-h5" href="/search-mobile" aria-label="搜索">
      <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/search_h5.svg" alt="搜索">
    </a>
    <a class="btn btn--ghost site-header__download" href="{{if $appAddr}}{{$appAddr}}{{else}}/download-app{{end}}"{{if $appAddr}} target="_blank" rel="sponsored nofollow noopener"{{end}}>
      <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/download.svg" alt="下载">
      <span>下载 APP</span>
    </a>
  </div>
</header>
<div class="drawer" data-drawer>
  <div class="drawer__mask" data-drawer-close></div>
  <aside class="drawer__panel" id="site-drawer" role="dialog" aria-modal="true" aria-label="侧边导航">
    <div class="drawer__head">
      <div class="drawer__brand-row">
        <a class="brand" href="/">
          <img decoding="async" loading="lazy" class="brand__logo" src="/static/images/placeholder.png?v=2" data-src="/static/logo.png" alt="黄果短剧">
        </a>
        <button class="drawer__close" type="button" aria-label="关闭" data-drawer-close>
          <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/close.svg" alt="关闭">
        </button>
      </div>
    </div>

    <hr class="drawer__rule">

    <nav class="drawer__nav" aria-label="页面导航">
      {{range .categoryList}}
      {{$isDownload := navIsDownload .URLValue .Name}}
      <a class="drawer__nav-item{{if navIsActive .URLValue $.requestPath}} is-active{{end}}" href="{{if $isDownload}}{{if $appAddr}}{{$appAddr}}{{else}}/download-app{{end}}{{else}}{{navHref .URLValue}}{{end}}"{{if and $isDownload $appAddr}} target="_blank" rel="sponsored nofollow noopener"{{else if not $isDownload}} {{externalLinkAttrs (navHref .URLValue)}}{{end}}>
      <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="{{navDrawerIcon .URLValue}}" alt="{{.Name}}入口">
        {{.Name}}
      </a>
      {{end}}
    </nav>

    <hr class="drawer__rule">

    <div class="drawer__tags">
      <p class="drawer__tags-label">题材</p>
      <div class="drawer__tag-list">
        {{range .themeList}}
        <a class="drawer__tag" href="{{allListURL .Slug .ID 0 1 1}}">{{.Name}}</a>
        {{end}}
      </div>
    </div>

    <div class="drawer__foot">
      <a class="btn btn--ghost drawer__download" href="{{if $appAddr}}{{$appAddr}}{{else}}/download-app{{end}}"{{if $appAddr}} target="_blank" rel="sponsored nofollow noopener"{{end}}>
        <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/download.svg" alt="下载">
        下载 APP
      </a>
    </div>
  </aside>
</div>

<script defer src="/static/js/common/request.js?v=6"></script>
<script defer src="/static/js/common/adsClick.js?v=1"></script>
<script defer src="/static/common/imgDecypt.js?v=9"></script>
<script defer src="/static/js/header.js?v=13"></script>

{{template "eighteen" .}}
{{template "dialogAd" .}}
{{template "nineGridDialog" .}}
{{template "toast" .}}
<script defer src="/static/js/common/sharePage.js?v=1"></script>
{{end}}