From 2f9e1fabd6e7436ccdcdb7d17091868b4e48584f Mon Sep 17 00:00:00 2001
From: ZF sun <34314687@qq.com>
Date: Tue, 9 Dec 2025 10:47:04 +0800
Subject: [PATCH] =?UTF-8?q?test(addon/aikefu):=20=E6=B5=8B=E8=AF=95?=
 =?UTF-8?q?=E4=BC=9A=E8=AF=9D=E7=AE=A1=E7=90=86=E5=8F=8A=E6=B6=88=E6=81=AF?=
 =?UTF-8?q?=E5=B1=95=E7=A4=BA=E6=98=AF=E5=90=A6=E6=9C=89=E5=88=86=E9=A1=B5?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../aikefu/shop/view/kefu/conversation.html   | 174 ++++++++++--------
 1 file changed, 101 insertions(+), 73 deletions(-)

diff --git a/src/addon/aikefu/shop/view/kefu/conversation.html b/src/addon/aikefu/shop/view/kefu/conversation.html
index 99257ab6e..00ab5652a 100644
--- a/src/addon/aikefu/shop/view/kefu/conversation.html
+++ b/src/addon/aikefu/shop/view/kefu/conversation.html
@@ -188,37 +188,35 @@
                 var role = item.role === 'user' ? (item.user_id ? '用户-' + item.user_id : '用户') : '机器人';
                 var roleClass = item.role === 'user' ? 'user' : 'assistant';
                 var avatar = item.role === 'user' ? '/addon/aikefu/static/images/user.svg' : '/addon/aikefu/static/images/robot.svg';
-        }}}
-        <div class="message-item {{roleClass}}">
-            {{# if(item.role === 'assistant') {
-                <img src="{{avatar}}" class="message-avatar">
-            }}}
-            <div>
-                <div class="message-role">{{role}}</div>
-                <div class="message-content">{{item.content}}</div>
-                <div class="message-time">{{item.create_time}}</div>
-            </div>
-            {{# if(item.role === 'user') {
-                <img src="{{avatar}}" class="message-avatar">
-            }}}
-        </div>
-        {{# });
+                <div class="message-item {{= roleClass }}">
+                    {{# if(item.role === 'assistant') { }}}
+                        <img src="{{= avatar }}" class="message-avatar">
+                    {{# } }}
+                    <div>
+                        <div class="message-role">{{= role }}</div>
+                        <div class="message-content">{{= item.content }}</div>
+                        <div class="message-time">{{= item.create_time }}</div>
+                    </div>
+                    {{# if(item.role === 'user') { }}}
+                        <img src="{{= avatar }}" class="message-avatar">
+                    {{# } }}
+                </div>
+            });
         } else {
-        }}}
-        <div class="empty-state">
-            <i class="layui-icon layui-icon-message"></i>
-            <p>暂无消息记录</p>
-        </div>
-        {{# }
-        }}
+            <div class="empty-state">
+                <i class="layui-icon layui-icon-message"></i>
+                <p>暂无消息记录</p>
+            </div>
+        } }}
     </div>
 </script>
 
 <script>
-    layui.use(['table', 'form', 'layer'], function() {
+    layui.use(['table', 'form', 'layer', 'laypage'], function() {
         var table = layui.table;
         var form = layui.form;
         var layer = layui.layer;
+        var laypage = layui.laypage;
         
         // 渲染表格
         var tableIns = table.render({
@@ -315,60 +313,90 @@
                 layer.open({
                     type: 1,
                     title: '消息记录',
-                    content: '<div class="message-list" style="padding: 25px; max-height: 650px; overflow-y: auto;">加载中...</div>',
+                    content: '<div style="padding: 25px; max-height: 700px;"><div class="message-list" style="max-height: 580px; overflow-y: auto; margin-bottom: 20px;">加载中...</div><div id="messagePage" style="text-align: center;"></div></div>',
                     area: ['80%', '70%'],
                     success: function(layero, index) {
-                        // 获取消息列表
-                        $.ajax({
-                            url: ns.url("aikefu://shop/kefu/getMessageList"),
-                            type: 'POST',
-                            data: {
-                                conversation_id: data.conversation_id,
-                                page: 1,
-                                limit: 100, // 加载最多100条消息
-                                sort_field: 'create_time',
-                                sort_order: 'desc' // 默认最新消息在前面
-                            },
-                            dataType: 'json',
-                            success: function(res) {
-                                var messageList = res.data?.messages || [];
-                                var html = '';
-                                
-                                if (messageList.length > 0) {
-                                    messageList.forEach(function(item) {
-                                        var role = item.role === 'user' ? (item.user_id ? '用户-' + item.user_id : '用户') : '机器人';
-                                        var roleClass = item.role === 'user' ? 'user' : 'assistant';
-                                        var avatar = item.role === 'user' ? '/addon/aikefu/static/images/user.svg' : '/addon/aikefu/static/images/robot.svg';
-                                        
-                                        html += '<div class="message-item ' + roleClass + '">';
-                                        if (item.role === 'assistant') {
-                                            html += '<img src="' + avatar + '" class="message-avatar">';
-                                        }
-                                        html += '<div>';
-                                        html += '<div class="message-role">' + role + '</div>';
-                                        html += '<div class="message-content">' + item.content + '</div>';
-                                        html += '<div class="message-time">' + item.create_time + '</div>';
+                        var currentPage = 1;
+                        var pageSize = 15; // 每页显示15条消息
+                        var total = 0;
+                        
+                        // 加载消息列表函数
+                        function loadMessages(page) {
+                            $.ajax({
+                                url: ns.url("aikefu://shop/kefu/getMessageList"),
+                                type: 'POST',
+                                data: {
+                                    conversation_id: data.conversation_id,
+                                    page: page,
+                                    limit: pageSize,
+                                    sort_field: 'create_time',
+                                    sort_order: 'desc' // 默认最新消息在前面
+                                },
+                                dataType: 'json',
+                                success: function(res) {
+                                    var messageList = res.data?.messages || [];
+                                    total = res.data?.total || 0;
+                                    var html = '';
+                                    
+                                    if (messageList.length > 0) {
+                                        messageList.forEach(function(item) {
+                                            var role = item.role === 'user' ? (item.user_id ? '用户-' + item.user_id : '用户') : '机器人';
+                                            var roleClass = item.role === 'user' ? 'user' : 'assistant';
+                                            var avatar = item.role === 'user' ? '/addon/aikefu/static/images/user.svg' : '/addon/aikefu/static/images/robot.svg';
+                                            
+                                            html += '<div class="message-item ' + roleClass + '">';
+                                            if (item.role === 'assistant') {
+                                                html += '<img src="' + avatar + '" class="message-avatar">';
+                                            }
+                                            html += '<div>';
+                                            html += '<div class="message-role">' + role + '</div>';
+                                            html += '<div class="message-content">' + item.content + '</div>';
+                                            html += '<div class="message-time">' + item.create_time + '</div>';
+                                            html += '</div>';
+                                            if (item.role === 'user') {
+                                                html += '<img src="' + avatar + '" class="message-avatar">';
+                                            }
+                                            html += '</div>';
+                                        });
+                                    } else {
+                                        html += '<div class="empty-state">';
+                                        html += '<i class="layui-icon layui-icon-message"></i>';
+                                        html += '<p>暂无消息记录</p>';
                                         html += '</div>';
-                                        if (item.role === 'user') {
-                                            html += '<img src="' + avatar + '" class="message-avatar">';
-                                        }
-                                        html += '</div>';
-                                    });
-                                } else {
-                                    html += '<div class="empty-state">';
-                                    html += '<i class="layui-icon layui-icon-message"></i>';
-                                    html += '<p>暂无消息记录</p>';
-                                    html += '</div>';
+                                    }
+                                    
+                                    layero.find('.message-list').html(html);
+                                    // 滚动到顶部显示当前页消息
+                                    layero.find('.message-list').scrollTop(0);
+                                    
+                                    // 渲染分页控件
+                                    initPagination(total, page);
+                                },
+                                error: function() {
+                                    layero.find('.message-list').html('<div class="empty-state">加载消息失败</div>');
                                 }
-                                
-                                layero.find('.message-list').html(html);
-                                // 默认滚动到底部（最新消息）
-                                layero.find('.message-list').scrollTop(layero.find('.message-list')[0].scrollHeight);
-                            },
-                            error: function() {
-                                layero.find('.message-list').html('<div class="empty-state">加载消息失败</div>');
-                            }
-                        });
+                            });
+                        }
+                        
+                        // 初始化分页控件
+                        function initPagination(total, curr) {
+                            layui.laypage.render({
+                                elem: layero.find('#messagePage')[0],
+                                count: total,
+                                limit: pageSize,
+                                curr: curr,
+                                layout: ['prev', 'page', 'next', 'count', 'skip'],
+                                jump: function(obj, first) {
+                                    if (!first) {
+                                        currentPage = obj.curr;
+                                        loadMessages(currentPage);
+                                    }
+                                }
+                            });
+                        }
+                        
+                        // 初始加载第一页消息
+                        loadMessages(currentPage);
                     }
                 });
             } else if (layEvent === 'end') {