<div class="hjcl-layout-container" th:fragment="body">

  <!-- 内页 幻灯片区域 -->
  <div th:replace="~{components/sub-banner::sub-banner}"></div>

  <!-- 内容 -->
  <div class="sub-section-main">
    <div class="wrapper">
      <div class="sub-section-container">

        <div class="article-detail">
          <div class="sub-section-container-title">
            <div class="article-detail-title" th:text="${articleDetail.title}"></div>
            <div class="article-detail-subtitle">
                <div th:text="${articleDetail.create_time}"></div>
                <a class="back" href="javascript:history.back();" th:text="#{back}"></a>
            </div>
          </div>
          <div class="sub-section-container-content bg-white" style="padding: 20px; box-sizing: border-box">
            <div class="sub-section-container-description" th:text="${articleDetail.description}"></div>
            <div class="content-detail" >
              <div th:utext="${articleDetail.content}"></div>
            </div>
          </div>
        </div>

      </div>

      <!-- 侧边 -->
      <div class="sub-section-sider">
        <div class="sub-section-sider-title" th:text="#{category}"></div>
        <div class="sub-section-sider-content">
          <div class="article-category horizontal">
            <ul id="category-bar">
<!--              <li class="mb-4"><a href="javascript:;">全部</a></li>-->
              <li th:each="item, itemStat : ${articleCategory}" th:if="${item.is_brand == 1}">
                <a href="javascript:;" th:text="${lang} == 'zh' ? ${item.category_name} : ${item.category_name_en}" th:data-category-id="${item.article_category_id}"></a>
              </li>
            </ul>
          </div>
        </div>
        <div class="sub-section-sider-content mt-2">
            <p th:text="#{sub.sider.welcome}"></p>
            <p th:text="@{#{sub.sider.wechat} + ' cpnana8 / anywayto'}"></p>
        </div>
      </div>
      <script th:inline="javascript">
          // [Click] 分类
          $('#category-bar > li > a').on('click', function(){
              var category_id = $(this).attr('data-category-id')
              if (category_id) {
                  window.location.href = '/article?category_id=' + parseInt(category_id)
              } else {
                  window.location.href = '/article';
              }
          })
      </script>

    </div>
  </div>

</div>