first commit

application/index/controller/User.php

@@ -347,6 +347,7 @@ class User extends Frontend
         // 获取搜索参数
         $keyword = input('param.keyword', '', 'trim');
         $type = input('param.type', '', 'trim');
+        $style = input('param.style', '', 'trim');
 
         // 构建查询条件
         $where = [];
@@ -356,14 +357,24 @@ class User extends Frontend
         if (!empty($type)) {
             $where['type'] = ['like', '%' . $type . '%'];
         }
+        if (!empty($style)) {
+            $where['style'] = ['like', '%' . $style . '%'];
+        }
+        
+        // 查询去重后的风格列表
+        $styleList = Db::name('product_template')
+            ->where('mod_rq', null)
+            ->where('toexamine', '审核通过')
+            ->whereNotNull('style')
+            ->where('style', '<>', '')
+            ->group('style')
+            ->column('style');
 
         // 查询模版表
         $products = Db::name('product_template')->alias('a')
-            ->field('
-                a.chinese_description,
+            ->field('a.chinese_description,
                 a.template_image_url,
                 a.template_name,
-                a.template_name,
                 a.style,
                 a.size,
                 a.type,
@@ -371,16 +382,17 @@ class User extends Frontend
                 a.seconds,
                 a.user_id,
                 a.toexamine,
-                b.id,
+                a.id,
                 b.avatar,
-                b.nickname
-            ')
+                b.nickname')
             ->join('user b', 'a.user_id = b.id', 'left')
-            ->where($where)->order('id desc')
-            ->where('mod_rq', null)
-            ->where('toexamine', '审核通过')
+            ->where($where)
+            ->where('a.mod_rq', null)
+            ->where('a.toexamine', '审核通过')
+            ->order('a.id desc')
             ->select();
 
+
         // // 检查并修正图片URL
         // foreach ($products as &$val) {
         //     // 如果URL不包含http，添加baseUrl
@@ -404,6 +416,8 @@ class User extends Frontend
         $this->view->assign('products', $products);
         $this->view->assign('keyword', $keyword);
         $this->view->assign('type', $type);
+        $this->view->assign('style', $style);
+        $this->view->assign('styleList', $styleList);
         return $this->view->fetch();
     }
 
@@ -443,8 +457,16 @@ class User extends Frontend
     }
 
     public function diagrams_list(){
-        // 获取作品ID
-        $id = input('param.id', 0, 'intval');
+        // 获取作品ID（支持参数和pathinfo两种方式）
+        $id = input('param.id/d', 0);
+        
+        // 如果param.id为空，尝试从pathinfo获取
+        if (empty($id)) {
+            $path = $this->request->pathinfo();
+            if (preg_match('/diagrams_list\/id\/(\d+)\.html/', $path, $matches)) {
+                $id = $matches[1];
+            }
+        }
 
         if (empty($id)) {
             $this->error(__('Invalid parameter'));

application/index/view/layout/default.html

@@ -14,7 +14,7 @@
                 <div class="collapse navbar-collapse" id="header-navbar">
                     <ul class="nav navbar-nav">
                         <li><a href="{:url('user/text_to_image')}">AI设计</a></li>
-                        <li><a href="{:url('user/template')}">模板</a></li>
+                        <li><a href="{:url('user/template')}">模板中心</a></li>
                         <li><a href="{:url('user/diagrams')}">个人</a></li>
                     </ul>
                     <ul class="nav navbar-nav navbar-right">

application/index/view/user/index.html

@@ -17,7 +17,7 @@
             <div class="panel panel-default">
                 <div class="panel-body">
                     <h2 class="page-header">
-                        {:__('Member center')}
+                        个人中心
                         <a href="{:url('user/profile')}" class="btn btn-primary pull-right"><i class="fa fa-pencil"></i> {:__('Profile')}</a>
                     </h2>
                     <div class="row user-baseinfo">

application/index/view/user/recycle.html

@@ -256,7 +256,7 @@
     <div class="sidebar">
         <ul class="menu">
             <li class="menu-item">
-                <a href="{:url('user/diagrams')}">我的作品</a>
+                <a href="{:url('user/diagrams')}">我的模版</a>
             </li>
             <li class="menu-item active">
                 <a href="{:url('user/recycle')}">收回站</a>

application/index/view/user/template.html

@@ -210,7 +210,10 @@
             <div class="search-box">
                 <input type="text" id="keywordInput" placeholder="搜索" value="{$keyword|default=''}">
                 <input type="hidden" id="typeFilter" value="{$type|default=''}">
-                <button id="searchBtn" type="button">查询</button>
+                <input type="hidden" id="styleFilter" value="{$style|default=''}">
+                <button id="searchBtn" type="button">
+                    <span class="icons search-icon"></span>
+                    搜索</button>
             </div>
         </div>
 
@@ -219,11 +222,10 @@
             <div class="filter-options">
                  <div class="filter-group">
                     <label>风格:</label>
-                    <span {if condition="empty($style)"}style="background-color: #e9ecef;"{/if}>全部</span>
-                    <span>动漫</span>
-                    <span>油画</span>
-                    <span>风景</span>
-                    <span>人像</span>
+                    <span id="styleAll" {if condition="empty($style)"}style="background-color: #e9ecef; color: #007bff;"{else}style="color: #333;"{/if} onclick="filterByStyle('')">全部</span>
+                    {volist name="styleList" id="styleItem"}
+                    <span id="style{$styleItem}" {if condition="$style eq $styleItem"}style="background-color: #e9ecef; color: #007bff;"{else}style="color: #333;"{/if} onclick="filterByStyle('{$styleItem}')">{$styleItem}</span>
+                    {/volist}
                 </div>
                  <div class="filter-group">
                     <label>模版类型:</label>
@@ -240,11 +242,11 @@
             <div class="template-card">
                 <div class="template-thumbnail">
                     {if condition="$template.type eq '文生图'"}
-                        <a href="{:url('user/diagrams_list', ['id' => $template.id])}">
+                        <a href="/index/user/diagrams_list/id/{$template.id}.html">
                             <img src="{$template.template_image_url}" alt="{$template.template_name}" onerror="this.src=''; this.alt='图片加载失败';">
                         </a>
                     {elseif condition="$template.type eq '文生视频'"}
-                        <a href="{:url('user/diagrams_list', ['id' => $template.id])}">
+                        <a href="/index/user/diagrams_list/id/{$template.id}.html">
                             <video src="{$template.template_image_url}" alt="{$template.template_name}" controls muted></video>
                         </a>
                     {/if}
@@ -261,31 +263,31 @@
         </div>
     </section>
 
-    <!-- 大图查看容器 -->
-    <div id="largeViewContainer">
-        <div id="largeMediaContent"></div>
-    </div>
+
 
     <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
     <script>
         // 初始化变量
         let currentKeyword = '{$keyword|default=\'\'}';
         let currentType = '{$type|default=\'\'}';
+        let currentStyle = '{$style|default=\'\'}';
 
         // 搜索函数
         function searchTemplates() {
-            // 获取当前的关键词和类型
+            // 获取当前的关键词、类型和风格
             const keyword = $('#keywordInput').val().trim();
             const type = $('#typeFilter').val();
+            const style = $('#styleFilter').val();
 
             // 如果参数没有变化，不发送请求
-            if (keyword === currentKeyword && type === currentType) {
+            if (keyword === currentKeyword && type === currentType && style === currentStyle) {
                 return;
             }
 
             // 更新当前参数
             currentKeyword = keyword;
             currentType = type;
+            currentStyle = style;
 
             // 发送AJAX请求
             $.ajax({
@@ -293,7 +295,8 @@
                 type: 'GET',
                 data: {
                     keyword: keyword,
-                    type: type
+                    type: type,
+                    style: style
                 },
                 dataType: 'json',
                 success: function(response) {
@@ -326,21 +329,23 @@
                 let mediaElement;
                 // 根据类型创建媒体元素
                 if (template.type === '文生图') {
-                    mediaElement = `<img src="${template.template_image_url}" alt="${template.template_name}" onclick="showMedia('${template.template_image_url}', '${template.type}')" onerror="this.src=''; this.alt='图片加载失败';">`;
+                    mediaElement = `<img src="${template.template_image_url}" alt="${template.template_name}" onerror="this.src=''; this.alt='图片加载失败';">`;
                 } else if (template.type === '文生视频') {
-                    mediaElement = `<video src="${template.template_image_url}" alt="${template.template_name}" controls muted onclick="showMedia('${template.template_image_url}', '${template.type}')"></video>`;
+                    mediaElement = `<video src="${template.template_image_url}" alt="${template.template_name}" controls muted></video>`;
                 }
 
                 // 创建模板卡片
                 const templateCard = `
                     <div class="template-card">
                         <div class="template-thumbnail">
-                            ${mediaElement}
+                            <a href="/index/user/diagrams_list/id/${template.id}.html">
+                                ${mediaElement}
+                            </a>
                         </div>
                         <div class="template-info">
                             <div class="template-name">${template.template_name}</div>
                             <div class="template-meta">
-                                <span>${template.type === '文生图' ? '图片' : '视频'}</span>
+                                <span style="color: black">${template.nickname || '未知用户'}</span>
                                 <span>免费</span>
                             </div>
                         </div>
@@ -370,6 +375,25 @@
             searchTemplates();
         }
 
+        // 风格筛选函数
+        function filterByStyle(style) {
+            // 更新风格筛选器的值
+            $('#styleFilter').val(style);
+
+            // 更新风格筛选按钮的样式
+            // 先重置所有风格按钮的样式
+            $('.filter-group span[id^="style"]').css({'background-color': '', 'color': '#333'});
+            // 然后设置选中的按钮样式
+            if (style === '') {
+                $('#styleAll').css({'background-color': '#e9ecef', 'color': '#007bff'});
+            } else {
+                $('#style' + style).css({'background-color': '#e9ecef', 'color': '#007bff'});
+            }
+
+            // 执行搜索
+            searchTemplates();
+        }
+
         // 搜索按钮点击事件
         $('#searchBtn').click(function() {
             searchTemplates();
@@ -390,50 +414,7 @@
             searchTimer = setTimeout(searchTemplates, 300);
         });
 
-        // 图片/视频放大查看功能
-        function showMedia(url, type) {
-            const container = document.getElementById('largeViewContainer');
-            const content = document.getElementById('largeMediaContent');
-
-            // 清空容器
-            content.innerHTML = '';
 
-            // 创建媒体元素
-            if (type === '文生图') {
-                const img = document.createElement('img');
-                img.src = url;
-                img.alt = '大图查看';
-                content.appendChild(img);
-            } else if (type === '文生视频') {
-                const video = document.createElement('video');
-                video.src = url;
-                video.controls = true;
-                content.appendChild(video);
-            }
-
-            // 显示大图查看容器
-            container.style.display = 'flex';
-        }
-
-        // 关闭大图查看
-        function closeLargeView() {
-            document.getElementById('largeViewContainer').style.display = 'none';
-        }
-
-        // 点击大图容器关闭
-        document.getElementById('largeViewContainer').addEventListener('click', function(event) {
-            // 只有点击容器本身才关闭，避免点击媒体元素也关闭
-            if (event.target === this) {
-                closeLargeView();
-            }
-        });
-
-        // 按ESC键关闭大图查看
-        document.addEventListener('keydown', function(event) {
-            if (event.key === 'Escape') {
-                closeLargeView();
-            }
-        });
     </script>
 </body>
 </html>

application/route.php

@@ -16,7 +16,10 @@ return [
     ],
     //变量规则
     '__pattern__' => [
+        'id' => '\\d+',
     ],
+    // 路由规则
+    'user/diagrams_list/id/:id.html' => 'index/user/diagrams_list',
 //        域名绑定到模块
 //        '__domain__'  => [
 //            'admin' => 'admin',