Commit 0109100bd26d4ae969d47ddfaf046e8b4ff2a69c
1 parent
1c91a4fd
1
Showing
1 changed file
with
16 additions
and
252 deletions
src/main/resources/static/real_control_v2/zndd/deepseek/deepseek.html
| 1 | -<div class="uk-modal ct-form-modal" id="tts-config-modal"> | |
| 1 | +<div class="uk-modal ct-form-modal deepseek" id="tts-config-modal"> | |
| 2 | + | |
| 3 | + | |
| 4 | + | |
| 2 | 5 | <div class="uk-modal-dialog" style="width: 1030px;"> |
| 3 | 6 | <a href="" class="uk-modal-close uk-close"></a> |
| 4 | 7 | <div class="uk-modal-header"> |
| 5 | 8 | <h2>调度助手(deepseek)</h2></div> |
| 6 | - | |
| 7 | - <div class="chat-container"> | |
| 8 | - <div class="messages-container" id="messages"></div> | |
| 9 | - <div class="typing-indicator" id="typing" style="display: none;">DeepSeek 正在思考输入...</div> | |
| 10 | - <div class="input-container"> | |
| 11 | - <input type="text" id="input" placeholder="输入你的问题..."> | |
| 12 | - <button onclick="sendMessage()">发送</button> | |
| 13 | - </div> | |
| 14 | - </div> | |
| 9 | + <iframe | |
| 10 | + src="http://192.168.168.141/chatbot/MVrlx76fhT2uuFYA" | |
| 11 | + style="width: 100%; height: 100%; min-height: 700px" | |
| 12 | + frameborder="0" | |
| 13 | + allow="microphone"> | |
| 14 | + </iframe> | |
| 15 | 15 | </div> |
| 16 | 16 | <style> |
| 17 | - | |
| 18 | - | |
| 19 | - .chat-container { | |
| 20 | - max-width: 800px; | |
| 21 | - margin: 0 auto; | |
| 22 | - background-color: white; | |
| 23 | - border-radius: 10px; | |
| 24 | - box-shadow: 0 2px 10px rgba(0,0,0,0.1); | |
| 25 | - } | |
| 26 | - | |
| 27 | - .messages-container { | |
| 28 | - height: 500px; | |
| 29 | - overflow-y: auto; | |
| 30 | - padding: 20px; | |
| 31 | - } | |
| 32 | - | |
| 33 | - .message { | |
| 34 | - display: flex; | |
| 35 | - margin-bottom: 15px; | |
| 36 | - } | |
| 37 | - | |
| 38 | - .message.user { | |
| 39 | - justify-content: flex-end; | |
| 40 | - } | |
| 41 | - | |
| 42 | - .message.bot { | |
| 43 | - justify-content: flex-start; | |
| 17 | + .deepseek .uk-modal-dialog{ | |
| 18 | + padding:0px | |
| 44 | 19 | } |
| 45 | - | |
| 46 | - .bubble { | |
| 47 | - max-width: 70%; | |
| 48 | - padding: 12px 18px; | |
| 49 | - border-radius: 15px; | |
| 50 | - line-height: 1.4; | |
| 51 | - white-space: pre-line; | |
| 52 | - } | |
| 53 | - | |
| 54 | - .user .bubble { | |
| 55 | - background-color: #007bff; | |
| 56 | - color: white; | |
| 57 | - } | |
| 58 | - | |
| 59 | - .bot .bubble { | |
| 60 | - background-color: #e9ecef; | |
| 61 | - color: black; | |
| 62 | - } | |
| 63 | - | |
| 64 | - .input-container { | |
| 65 | - display: flex; | |
| 66 | - padding: 20px; | |
| 67 | - border-top: 1px solid #ddd; | |
| 20 | + .deepseek .uk-modal-dialog>.uk-close:first-child{ | |
| 21 | + margin:0px; | |
| 68 | 22 | } |
| 69 | - | |
| 70 | - input[type="text"] { | |
| 71 | - flex: 1; | |
| 72 | - padding: 12px; | |
| 73 | - border: 1px solid #ddd; | |
| 74 | - border-radius: 5px; | |
| 75 | - margin-right: 10px; | |
| 23 | + .deepseek .uk-modal-header{ | |
| 24 | + margin:0px; | |
| 76 | 25 | } |
| 77 | 26 | |
| 78 | - button { | |
| 79 | - padding: 12px 24px; | |
| 80 | - background-color: #007bff; | |
| 81 | - color: white; | |
| 82 | - border: none; | |
| 83 | - border-radius: 5px; | |
| 84 | - cursor: pointer; | |
| 85 | - } | |
| 86 | 27 | |
| 87 | - button:hover { | |
| 88 | - background-color: #0056b3; | |
| 89 | - } | |
| 90 | 28 | |
| 91 | - .typing-indicator { | |
| 92 | - padding: 0 20px 10px; | |
| 93 | - color: #666; | |
| 94 | - font-style: italic; | |
| 95 | - } | |
| 96 | 29 | </style> |
| 97 | - <script> | |
| 98 | - const messagesContainer = document.getElementById('messages'); | |
| 99 | - const input = document.getElementById('input'); | |
| 100 | - const typingIndicator = document.getElementById('typing'); | |
| 101 | - | |
| 102 | - // 处理回车键 | |
| 103 | - input.addEventListener('keypress', (e) => { | |
| 104 | - if (e.key === 'Enter') { | |
| 105 | - sendMessage(); | |
| 106 | - } | |
| 107 | - }); | |
| 108 | - | |
| 109 | - function sendMessage() { | |
| 110 | - const message = input.value.trim(); | |
| 111 | - if (!message) return; | |
| 112 | - | |
| 113 | - // 添加用户消息 | |
| 114 | - addMessage(message, 'user'); | |
| 115 | - input.value = ''; | |
| 116 | - var tEnum ={ | |
| 117 | - xl_1 : "线", | |
| 118 | - xl_2 : "路", | |
| 119 | - yyqk : "营运情况", | |
| 120 | - } | |
| 121 | - | |
| 122 | - // 模拟AI回复 | |
| 123 | - let date = { | |
| 124 | - "message": message/*"遇到大客流帮我推荐一种方案"*/, //消息 | |
| 125 | - "mode": "query" //chat聊天 query知识库查询 选一个 | |
| 126 | - } | |
| 127 | - //线路 | |
| 128 | - if ((message.includes(tEnum.xl_1) && message.includes(tEnum.yyqk)) || (message.includes(tEnum.xl_2) && message.includes(tEnum.yyqk))){ | |
| 129 | - bcyyqk(message); | |
| 130 | - }else { | |
| 131 | - subtim(date); | |
| 132 | - } | |
| 133 | - showTypingIndicator(); | |
| 134 | - | |
| 135 | - | |
| 136 | - | |
| 137 | - } | |
| 138 | - | |
| 139 | - function addMessage(text, sender) { | |
| 140 | - const messageDiv = document.createElement('div'); | |
| 141 | - messageDiv.className = `message ${sender}`; | |
| 142 | - | |
| 143 | - const bubble = document.createElement('div'); | |
| 144 | - bubble.className = 'bubble'; | |
| 145 | - bubble.textContent = text; | |
| 146 | - if (sender == 'bot'){ | |
| 147 | - bubble.textContent = ''; | |
| 148 | - tests = text | |
| 149 | - bubbles = bubble; | |
| 150 | - char_index = 0; | |
| 151 | - //type(text); | |
| 152 | - } | |
| 153 | - messageDiv.appendChild(bubble); | |
| 154 | - messagesContainer.appendChild(messageDiv); | |
| 155 | - | |
| 156 | - // 自动滚动到底部 | |
| 157 | - messagesContainer.scrollTop = messagesContainer.scrollHeight; | |
| 158 | - } | |
| 159 | - var tests ="" | |
| 160 | - var bubbles; | |
| 161 | - char_index = 0 | |
| 162 | - | |
| 163 | - function bcyyqk(message){ | |
| 164 | - $.get("/logZndd/schDeepSeep",{message:message},function (re){ | |
| 165 | - if (re.code == 200){ | |
| 166 | - //根据返回的参数组成一句话,再让deepseep扩充一下 | |
| 167 | - var mes = "根据后面这些话,解析并优化一下,"+"线路:"+re.xlName+",总班次数"+re.bcs | |
| 168 | - +",进场班次数"+re.inbcs+",出场班次数"+re.outbcs+",临加班次数"+re.ljbcs+",正常班次数"+re.normalbcs | |
| 169 | - +",区间班次"+re.regionbcs+",未执行班次数"+re.wzxbcs+",正在执行班次数"+re.zzxbcs+",已执行班次数"+re.yzxbcs | |
| 170 | - +",烂班班次数" +re.lbbcs; | |
| 171 | - | |
| 172 | - console.log(mes); | |
| 173 | - var datas = { | |
| 174 | - "message": mes/*"遇到大客流帮我推荐一种方案"*/, //消息 | |
| 175 | - "mode": "chat" //chat聊天 query知识库查询 选一个 | |
| 176 | - } | |
| 177 | - | |
| 178 | - subtim(datas); | |
| 179 | - }else { | |
| 180 | - // 弹出添加失败提示消息 | |
| 181 | - layer.msg('无法找到输入线路...'); | |
| 182 | - hideTypingIndicator(); | |
| 183 | - } | |
| 184 | - }) | |
| 185 | - } | |
| 186 | - | |
| 187 | - | |
| 188 | - function subtim(date){ | |
| 189 | - | |
| 190 | - const apiUrl = 'http://61.169.120.202:3001/api/v1/workspace/deep/stream-chat'; // 替换为实际接口地址 | |
| 191 | - let xhr = new XMLHttpRequest(); | |
| 192 | - xhr.open('POST', apiUrl, true); | |
| 193 | - // 设置请求头 | |
| 194 | - xhr.setRequestHeader('Content-Type', 'application/json'); | |
| 195 | - xhr.setRequestHeader('Authorization', `Bearer 701MSMS-JNS4WNG-JSDY4GH-RHD93NM`); | |
| 196 | - | |
| 197 | - addMessage("", 'bot'); | |
| 198 | - var ins = 0; | |
| 199 | - // 监听数据流 | |
| 200 | - xhr.onprogress = function (event) { | |
| 201 | - // 获取当前接收的数据片段 | |
| 202 | - const responseText = xhr.responseText; | |
| 203 | - const lines = responseText.split('\n').filter(line => line !== ''); | |
| 204 | - try { | |
| 205 | - for (var i = 0 ; i < lines.length ; i ++) { | |
| 206 | - if (i >= ins || ins == 0) { | |
| 207 | - ins = i +1; | |
| 208 | - var line = lines[i].replace(/^data: /, ''); | |
| 209 | - const data = JSON.parse(line); | |
| 210 | - let txt = bubbles.textContent; | |
| 211 | - bubbles.textContent += data.textResponse!= null? data.textResponse :""; | |
| 212 | - //结束 | |
| 213 | - if (data.type == "finalizeResponseStream"){ | |
| 214 | - hideTypingIndicator(); | |
| 215 | - } | |
| 216 | - } | |
| 217 | - } | |
| 218 | - } catch (e) { | |
| 219 | - console.error('解析错误:', e); | |
| 220 | - } | |
| 221 | - }; | |
| 222 | - | |
| 223 | - // 发送请求 | |
| 224 | - const requestBody = JSON.stringify(date); | |
| 225 | - xhr.send(requestBody); | |
| 226 | - | |
| 227 | - // 错误处理 | |
| 228 | - xhr.onerror = function () { | |
| 229 | - console.error('请求失败'); | |
| 230 | - }; | |
| 231 | - | |
| 232 | - | |
| 233 | - ///一次性请求的方法,慢弃用。 | |
| 234 | - /* // 提交 | |
| 235 | - $.ajax({ | |
| 236 | - type: 'POST', | |
| 237 | - url: "http://192.168.168.141:3001/api/v1/workspace/deep/stream-chat", | |
| 238 | - contentType: "application/json", | |
| 239 | - headers: { | |
| 240 | - authorization: "Bearer 701MSMS-JNS4WNG-JSDY4GH-RHD93NM", | |
| 241 | - }, | |
| 242 | - timeout: 0, | |
| 243 | - data: JSON.stringify(date), | |
| 244 | - success: function(datas){ | |
| 245 | - setTimeout(() => { | |
| 246 | - hideTypingIndicator(); | |
| 247 | - addMessage(datas.textResponse, 'bot'); | |
| 248 | - }, 1500); | |
| 249 | - }, | |
| 250 | - error: function(xhr, type){ | |
| 251 | - alert('错误:TODO'); | |
| 252 | - } | |
| 253 | - });*/ | |
| 254 | - } | |
| 255 | - | |
| 256 | - | |
| 257 | - function showTypingIndicator() { | |
| 258 | - typingIndicator.style.display = 'block'; | |
| 259 | - messagesContainer.scrollTop = messagesContainer.scrollHeight; | |
| 260 | - } | |
| 261 | - | |
| 262 | - function hideTypingIndicator() { | |
| 263 | - typingIndicator.style.display = 'none'; | |
| 264 | - } | |
| 265 | 30 | |
| 266 | - </script> | |
| 267 | 31 | </div> |
| 268 | 32 | ... | ... |