<!--
// 功能：首页默认模板
// 作者：启肯科技
// Q Q：328493711
// 微信：13738373177（同手机）
// 官网：http://www.qiken.com
// 说明：QKCMS-轻量级AI智能内容管理建站系统
// 版权：© 2025 温州启肯网络有限公司 保留所有权利，盗版必究
-->

<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>{qkcms:site_title}</title>
  <meta name="keywords" content="{qkcms:site_keywords}">
  <meta name="description" content="{qkcms:site_description}">
</head>

<body>
  {qkcms:head.html}
  <main class="main-content">
    <div class="container">
      <div class="welcome-banner-container-full" style="position: relative; overflow: hidden;">


        <div class="banner-color-overlay"
          style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--primary); mix-blend-mode: hue; opacity: 0.85; pointer-events: none; z-index: 1; -webkit-mask-image: radial-gradient(circle at 10% 85%, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 10%, rgba(0,0,0,1) 25%, rgba(0,0,0,1) 100%); mask-image: radial-gradient(circle at 10% 85%, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 10%, rgba(0,0,0,1) 25%, rgba(0,0,0,1) 100%);">
        </div>


        <div class="banner-round-actions">
          <div class="banner-round-btn-wrapper">
            <div class="banner-btn-line"></div>
            <a href="/download.html" class="banner-round-btn banner-round-btn-install">

              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 299" fill="currentColor">
                <path
                  d="M153 20Q150 18 147 20L35 65L80 83L195 36ZM220 47L105 93L150 111L265 65ZM281 78L159 127L159 276L281 227ZM141 276L141 127L19 78L19 227ZM6 56L140 2Q150-2 160 2L294 56Q300 58 300 65L300 227Q300 233 297 237.50Q294 242 288 244L153 298Q150 300 147 298L12 244Q6 242 3 237.50Q0 233 0 227L0 65Q0 58 6 56Z" />
              </svg>
              <span>立即下载</span>
            </a>
          </div>
          <div class="banner-round-btn-wrapper">
            <div class="banner-btn-line"></div>

            <a href="javascript:void(0);" onclick="alert('视频正在准备中，敬请期待！');" class="banner-round-btn banner-round-btn-video">

              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 28 300 263" fill="currentColor">
                <path
                  d="M38 75Q38 79 40.50 82Q43 85 47 85L253 85Q257 85 260 82Q263 79 263 75Q263 71 260 68.50Q257 66 253 66L47 66Q43 66 40.50 68.50Q38 71 38 75ZM75 38Q75 42 77.50 44.50Q80 47 84 47L216 47Q220 47 222.50 44.50Q225 42 225 38Q225 34 222.50 31Q220 28 216 28L84 28Q80 28 77.50 31Q75 34 75 38ZM202 189L127 142Q122 139 117 142Q112 145 112 150L112 244Q112 250 117 252.50Q122 255 127 252L202 205Q206 202 206 197Q206 192 202 189ZM272 291L28 291Q16 291 8 282.50Q0 274 0 263L0 131Q0 120 8 111.50Q16 103 28 103L272 103Q284 103 292 111.50Q300 120 300 131L300 263Q300 274 292 282.50Q284 291 272 291ZM28 272L272 272Q276 272 278.50 269.50Q281 267 281 263L281 131Q281 128 278.50 125Q276 122 272 122L28 122Q24 122 21.50 125Q19 128 19 131L19 263Q19 267 21.50 269.50Q24 272 28 272Z" />
              </svg>
              <span>视频演示</span>
            </a>
          </div>
        </div>

        <div class="water-wave">
          <svg class="home-hero-waves" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
            viewBox="0 24 150 28" preserveAspectRatio="none" shape-rendering="auto">
            <defs>
              <path id="home-gentle-wave" d="M-160 44c30 0 58-18 88-18s58 18 88 18 58-18 88-18 58 18 88 18v44h-352z">
              </path>
            </defs>
            <g class="home-parallax">
              <use xlink:href="#home-gentle-wave" x="48" y="0" class="home-wave-a"></use>
              <use xlink:href="#home-gentle-wave" x="48" y="3" class="home-wave-b"></use>
              <use xlink:href="#home-gentle-wave" x="48" y="5" class="home-wave-c"></use>
              <use xlink:href="#home-gentle-wave" x="48" y="7" class="home-wave-d"></use>
            </g>
          </svg>
        </div>
      </div>
      <div class="content-layout" style="margin-top:20px">
        <div class="main-column">
          <section class="categories-section fade-in">
            <div class="section-header">
              <h2 class="section-title">分类栏目</h2>
              <a href="/category.html" class="section-link">查看全部</a>
            </div>
            <div class="categories-grid">
              {qkcms:categories row=12 parent_id=-1 sa=2 sort=2}
              <a href="{url}" class="category-item home-category-item">
                <div class="category-icon-small"><img src="{thumbnail}" alt="{name}" /></div>
                <div class="category-info">
                  <div class="category-name">
                    <span class="category-title">{name}</span>
                    <span class="category-count">{count} 话题</span>
                  </div>
                  <div class="category-meta">{description}</div>
                </div>
              </a>
              {/qkcms:categories}
            </div>
          </section>
          <section class="topics-section fade-in">
            <div class="topics-header">
              <h2 class="topics-title">全站头条</h2>
              <div class="topics-filter">
                <button class="filter-btn active" data-tab="latest"> <span class="icon clock"></span> 最新 </button>
                <button class="filter-btn" data-tab="comment"> <span class="icon comment"></span> 热门 </button>
                <button class="filter-btn" data-tab="hot"> <span class="icon fire"></span> 推荐 </button>
              </div>
            </div>

            <div class="topics-content">
              <div id="latest" class="tab-content active" data-loaded="true"> {qkcms:articles row=20 col=1 property=0 order=latest
                category_id=-1 titlelen=34 description_len=90 page=1}
                <div class="topic-item fade-in">
                  <a href="{url}" class="topic-title">
                    <div class="article-thumbnail-container"> <img src="{thumbnail}" alt="{title}"
                        class="article-thumbnail"> </div>
                  </a>
                  <div class="topic-content">
                    <div class="topic-header-row">
                      <div class="topic-meta"> <a href="/Member_id{author_id}.php" class="topic-author"
                          target="_blank">{author}</a> <span class="topic-time">{date_only}</span> </div>
                      <div class="topic-tags">
                        <a href="{cat_url}"><span class="topic-tag">{category}</span> </a>
                      </div>
                    </div>
                    <a href="{url}" class="topic-title">{property} {title}</a>
                    <p>描述: {description}</p>
                    <div class="topic-footer">
                      <div class="topic-stats"> <span class="topic-stat"> <span class="icon view"></span> {views}</span>
                        <span class="topic-stat"> <span class="icon message"></span> {comments} </span> <span
                          class="topic-stat"> <span class="icon like"></span> {like_count} </span>
                      </div>
                    </div>
                  </div>
                </div>
                {/qkcms:articles}
              </div>
              <div id="comment" class="tab-content" data-home-topics-url="/?ajax_home_topics=1&amp;order=comment">
              </div>
              <div id="hot" class="tab-content" data-home-topics-url="/?ajax_home_topics=1&amp;order=hot">
              </div>
            </div>
          </section>
        </div>
        <aside class="sidebar">
          <div class="user-profile fade-in" style="height: 228px;"> <img src="{qkcms:user_avatar}" alt="用户头像"
              class="user-avatar" id="nav-avatar-img">
            <div class="user-name" id="home-user-level">未登录</div>
            <div class="user-role" id="home-user-welcome"><span class="user-level"></span>欢迎你，{qkcms:user_nickname}
            </div>
            <div class="user-actions"> <a href="/Member_id{qkcms:user_id}.php" class="btn sidebar-post-btn">进入我的主页</a>
              <a href="/admin/login.php" class="btn btn-primary">登录</a> <a href="/admin/login.php?register=1"
                class="btn btn-outline">注册</a>
            </div>
          </div>
          <div class="tags-cloud-section">
            <h3 class="tags-header">热门标签<a href="/tag.html" class="section-link" style="float:right">更多</a></h3>

            <div class="tags-cloud"> {qkcms:tags row=30 order=1} <a href="{url}" class="tag">{name} （{count}）</a>
              {/qkcms:tags} </div>
          </div>


          <div class="trending-topics">
            <h3 class="trending-header">热门推荐</h3>
            <div class="trending-list"> {qkcms:articles row=5 order= hot titlelen=40} <a href="{url}"
                class="trending-item spaced-item">
                <div class="trending-rank  warm">{title_id}</div>
                <div class="trending-content">
                  <div class="trending-title">{title}</div>
                  <div class="trending-meta"> {views} 浏览 · {comments} 评论</div>
                </div>
              </a> {/qkcms:articles} </div>
          </div>
          <div class="events-section">
            <h3 class="events-header">最近访问</h3>
            <div class="members-grid"> {qkcms:members row=9 type=2}
              <div>
                <a href="{user_center_url}" class="member-link">
                  <div class="avatar-container"> <img src="{avatar}"></div>
                  <p class="member-name">{username}</p>
                </a>
              </div>
              {/qkcms:members}
            </div>
          </div>
          <div class="events-section">
            <h3 class="events-header">全站公告</h3>
            {qkcms:articles row=3 property=4 category_id=-1 titlelen=40} <a href="{url}" class="event-item">
              <div class="event-date">
                <div class="event-month">{date_mo}月</div>
                <div class="event-day">{date_dy}</div>
              </div>
              <div class="event-info">
                <div class="event-title">{title}</div>
                <div class="event-location">{keywords}</div>
              </div>
            </a> {/qkcms:articles}
          </div>
      </div>
      </aside>
    </div>
    </div>
  </main>
  <div class="video-modal-overlay" id="videoModalOverlay" onclick="closeVideoModal(event)">
    <div class="video-modal-backdrop"></div>
    <div class="video-modal-content" onclick="event.stopPropagation();">
      <button type="button" class="video-modal-close-circle" onclick="closeVideoModal()">
        <svg viewBox="0 0 24 24" width="20" height="20" stroke="currentColor" stroke-width="2" fill="none"
          stroke-linecap="round" stroke-linejoin="round">
          <line x1="18" y1="6" x2="6" y2="18"></line>
          <line x1="6" y1="6" x2="18" y2="18"></line>
        </svg>
      </button>
      <video id="demoVideo" controls preload="none">
        <source src="http://cloud.video.taobao.com//play/u/639129026/p/1/e/6/t/1/50182566705.mp4" type="video/mp4">
        您的浏览器不支持 HTML5 视频。
      </video>
    </div>
  </div>

  {qk_Plugin:ID50}
  {qkcms:footer.html}
</body>

</html>
{qk_Plugin:ID8}
