{{define "header"}}
{{$appAddr := .appConfig.AppAddr}}
<link rel="stylesheet" href="/static/css/header.css?v=11">
<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="/" data-navigation-key="home" data-navigation-name="首页">
      <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" data-navigation-key="{{.URLValue}}" data-navigation-name="{{.Name}}">{{.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" data-navigation-key="mega_theme_{{.ID}}" data-navigation-name="题材：{{.Name}}">{{.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" data-navigation-key="mega_status_all" data-navigation-name="状态：全部">全部</a>
              <a class="nav__mega-chip{{if eq $status 1}} is-active{{end}}" href="{{allListURL "" 0 1 1 1}}" role="menuitem" data-navigation-key="mega_status_serializing" data-navigation-name="状态：连载中">连载中</a>
              <a class="nav__mega-chip{{if eq $status 2}} is-active{{end}}" href="{{allListURL "" 0 2 1 1}}" role="menuitem" data-navigation-key="mega_status_completed" data-navigation-name="状态：已完结">已完结</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" data-navigation-key="mega_section_{{$cfg.ID}}" data-navigation-name="快捷入口：{{$cfg.Name}}">
              {{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}} data-navigation-key="{{.URLValue}}" data-navigation-name="{{.Name}}">{{.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>
    <a class="site-header__icon-btn only-h5" href="/search-mobile" aria-label="搜索" data-navigation-key="header_search" data-navigation-name="搜索">
      <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}} data-navigation-key="header_download" data-navigation-name="下载 APP">
      <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>
    {{if not .isLoggedIn}}
    <button class="btn btn--primary site-header__login" type="button" data-login-open>登录</button>
    {{else}}
    <div class="user-menu" data-user-menu>
      <button class="user-chip" type="button" aria-haspopup="menu" aria-expanded="false" data-user-menu-toggle>
        {{if .avatar}}
        <img decoding="async" loading="lazy" class="user-chip__avatar lazy" src="/static/images/placeholder.png?v=2" data-src="{{.avatar}}" data-header-avatar alt="用户头像">
        {{else}}
        <img decoding="async" loading="lazy" class="user-chip__avatar" src="/static/images/placeholder.png?v=2" data-header-avatar alt="默认用户头像">
        {{end}}
        <span class="user-chip__name only-pc">{{if .userName}}{{.userName}}{{else}}游客{{end}}</span>
        <span class="user-chip__coin only-pc">
          <img decoding="async" loading="lazy" class="icon icon--sm" src="/static/images/placeholder.png?v=2" data-src="/static/images/coin.png" alt="金币">
          <span data-header-recharge>{{if .rechargeText}}{{.rechargeText}}{{else}}0{{end}}</span>
        </span>
        <img decoding="async" loading="lazy" class="icon icon--sm user-chip__caret only-pc" src="/static/images/placeholder.png?v=2" data-src="/static/images/chevron-right.svg" alt="前往下一项">
      </button>
      <div class="user-menu__dropdown" role="menu">
        <div class="user-menu__profile">
          {{if .avatar}}
          <img decoding="async" loading="lazy" class="user-menu__avatar lazy" src="/static/images/placeholder.png?v=2" data-src="{{.avatar}}" data-header-avatar alt="用户头像">
          {{else}}
          <img decoding="async" loading="lazy" class="user-menu__avatar" src="/static/images/placeholder.png?v=2" data-header-avatar alt="默认用户头像">
          {{end}}
          <div class="user-menu__meta">
            <strong>{{if .userName}}{{.userName}}{{else}}游客{{end}}</strong>
            <span>{{if .userId}}ID {{.userId}}{{else}}ID —{{end}}</span>
          </div>
        </div>
        <div class="user-menu__list">
          {{if not .isRegistered}}
          <button class="user-menu__item" type="button" role="menuitem" data-login-open>
            <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/user.svg" alt="用户">
            <span class="user-menu__label">账号登录</span>
            <img decoding="async" loading="lazy" class="icon icon--sm user-menu__arrow" src="/static/images/placeholder.png?v=2" data-src="/static/images/chevron-right.svg" alt="前往下一项">
          </button>
          <button class="user-menu__item" type="button" role="menuitem" data-register-open>
            <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/gift-dim.svg" alt="绑定账号">
            <span class="user-menu__label">绑定账号</span>
            <img decoding="async" loading="lazy" class="icon icon--sm user-menu__arrow" src="/static/images/placeholder.png?v=2" data-src="/static/images/chevron-right.svg" alt="前往下一项">
          </button>
          {{end}}
          <a class="user-menu__item" href="/profile" role="menuitem" data-navigation-key="user_profile" data-navigation-name="个人中心">
            <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/menu_grzx.svg" alt="个人中心">
            <span class="user-menu__label">个人中心</span>
            <img decoding="async" loading="lazy" class="icon icon--sm user-menu__arrow" src="/static/images/placeholder.png?v=2" data-src="/static/images/chevron-right.svg" alt="前往下一项">
          </a>
          <a class="user-menu__item" href="/favorites" role="menuitem" data-navigation-key="user_favorites" data-navigation-name="我的收藏">
            <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/menu_sc.svg" alt="我的收藏">
            <span class="user-menu__label">我的收藏</span>
            {{if .favoriteCount}}<span class="user-menu__extra">{{.favoriteCount}}</span>{{end}}
            <img decoding="async" loading="lazy" class="icon icon--sm user-menu__arrow" src="/static/images/placeholder.png?v=2" data-src="/static/images/chevron-right.svg" alt="前往下一项">
          </a>
          <a class="user-menu__item" href="/history" role="menuitem" data-navigation-key="user_history" data-navigation-name="观看历史">
            <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/menu_gkls.svg" alt="观看历史">
            <span class="user-menu__label">观看历史</span>
            <img decoding="async" loading="lazy" class="icon icon--sm user-menu__arrow" src="/static/images/placeholder.png?v=2" data-src="/static/images/chevron-right.svg" alt="前往下一项">
          </a>
          <a class="user-menu__item" href="/recharge" role="menuitem" data-navigation-key="user_recharge" data-navigation-name="金币充值">
            <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/menu_jbcz.svg" alt="金币充值">
            <span class="user-menu__label">金币充值</span>
            <span class="user-menu__extra" data-header-recharge>{{if .rechargeText}}{{.rechargeText}}{{else}}0{{end}}</span>
            <img decoding="async" loading="lazy" class="icon icon--sm user-menu__arrow" src="/static/images/placeholder.png?v=2" data-src="/static/images/chevron-right.svg" alt="前往下一项">
          </a>
        </div>
        <hr class="user-menu__rule">
        <button class="user-menu__item user-menu__item--logout" type="button" role="menuitem" data-account-switch>
          <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/logout.svg" alt="切换账号">
          <span class="user-menu__label">切换账号</span>
        </button>
      </div>
    </div>
    {{end}}
  </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="/" data-navigation-key="drawer_home" data-navigation-name="首页">
          <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>
      {{if not .isLoggedIn}}
      <button class="drawer__user drawer__user--login" type="button" data-login-open>
        <img decoding="async" loading="lazy" class="drawer__avatar" src="/static/images/placeholder.png?v=2" alt="默认用户头像">
        <div class="drawer__user-info">
          <strong>登录 / 注册</strong>
          <span class="drawer__coin">登录后同步收藏与进度</span>
        </div>
        <img decoding="async" loading="lazy" class="icon icon--sm drawer__user-arrow" src="/static/images/placeholder.png?v=2" data-src="/static/images/chevron-right.svg" alt="前往下一项">
      </button>
      {{else}}
      <a class="drawer__user" href="/profile" data-navigation-key="drawer_profile" data-navigation-name="个人中心">
        {{if .avatar}}
        <img decoding="async" loading="lazy" class="drawer__avatar lazy" src="/static/images/placeholder.png?v=2" data-src="{{.avatar}}" data-header-avatar alt="用户头像">
        {{else}}
        <img decoding="async" loading="lazy" class="drawer__avatar" src="/static/images/placeholder.png?v=2" data-header-avatar alt="默认用户头像">
        {{end}}
        <div class="drawer__user-info">
          <strong>{{if .userName}}{{.userName}}{{else}}游客{{end}}</strong>
          <span class="drawer__coin">
            <img decoding="async" loading="lazy" class="icon icon--sm" src="/static/images/placeholder.png?v=2" data-src="/static/images/coin.png" alt="金币">
            <span data-header-recharge>{{if .rechargeText}}{{.rechargeText}}{{else}}0{{end}}</span> 金币
          </span>
        </div>
        <img decoding="async" loading="lazy" class="icon icon--sm drawer__user-arrow" src="/static/images/placeholder.png?v=2" data-src="/static/images/chevron-right.svg" alt="前往下一项">
      </a>
      {{end}}
    </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}} data-navigation-key="{{.URLValue}}" data-navigation-name="{{.Name}}">
      <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}}" data-navigation-key="drawer_theme_{{.ID}}" data-navigation-name="题材：{{.Name}}">{{.Name}}</a>
        {{end}}
      </div>
    </div>

    <div class="drawer__links">
      {{if and .isLoggedIn (not .isRegistered)}}
      <button class="drawer__link" type="button" data-login-open>
        <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/user.svg" alt="用户">
        账号登录
      </button>
      <button class="drawer__link" type="button" data-register-open>
        <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/gift-dim.svg" alt="绑定账号">
        绑定账号
      </button>
      {{end}}
      <a class="drawer__link" href="/favorites" data-navigation-key="drawer_favorites" data-navigation-name="我的收藏">
        <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/menu_sc.svg" alt="我的收藏">
        我的收藏
      </a>
      <a class="drawer__link" href="/history" data-navigation-key="drawer_history" data-navigation-name="观看历史">
        <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/menu_gkls.svg" alt="观看历史">
        观看历史
      </a>
    </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}} data-navigation-key="drawer_download" data-navigation-name="下载 APP">
        <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/download.svg" alt="下载">
        下载 APP
      </a>
      {{if .isLoggedIn}}
      <button class="drawer__logout" type="button" data-account-switch>
        <img decoding="async" loading="lazy" class="icon icon--sm" src="/static/images/placeholder.png?v=2" data-src="/static/images/logout.svg" alt="切换账号">
        切换账号
      </button>
      {{end}}
    </div>
  </aside>
</div>

<script defer src="/static/js/common/cookie.js?v=1"></script>
<script defer src="/static/js/common/request.js?v=6"></script>
<script defer src="/static/js/common/auth.js?v=3"></script>
<script defer src="/static/common/imgDecypt.js?v=9"></script>
<script defer src="/static/js/header.js?v=13"></script>
<script defer src="/static/js/pages/loginPop.js?v=5"></script>
<script defer src="/static/js/pages/registerPop.js?v=7"></script>

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