From 90b3b6329fec3205b845198ca6dc539dcde186c8 Mon Sep 17 00:00:00 2001
From: hongjli <3117313295@qq.com>
Date: 星期一, 16 六月 2025 17:12:20 +0800
Subject: [PATCH] 页面调整优化
---
src/app/ai-scene/chat/page.tsx | 501 +++++++++++++++++++++++++++++++++++++++++++++---------
1 files changed, 412 insertions(+), 89 deletions(-)
diff --git a/src/app/ai-scene/chat/page.tsx b/src/app/ai-scene/chat/page.tsx
index 3a11d4d..7a7e345 100644
--- a/src/app/ai-scene/chat/page.tsx
+++ b/src/app/ai-scene/chat/page.tsx
@@ -1,46 +1,317 @@
"use client";
-import { useState, useEffect } from 'react';
+import { useState, useEffect, Suspense } from 'react';
import { motion, AnimatePresence } from 'framer-motion';
+import { useSearchParams } from 'next/navigation';
+import { useRouter } from 'next/navigation';
+import Image from 'next/image';
+import DataPreviewDialog from '@/components/DataPreviewDialog';
// 瀵煎叆鍦烘櫙鏁版嵁
const defaultServices = [
{
- title: '琛ユ枡杩涢樁鐗�',
- description: '鏅鸿兘鍔ㄦ�佸垎鏋愪骇绾匡紝宸ヤ綅鐨勭己鏂欐儏鍐碉紝闄嶄綆鍋滅嚎椋庨櫓',
- imageUrl: '/images/kanban.jpg',
- chatbotId: 'zO9YQDEHdIApG9zC',
+ title: '搴撳瓨绠＄悊鐭ヨ瘑搴撻棶绛�',
+ description: '搴撳瓨鐭ヨ瘑锛屾彁渚涗笓涓氱殑渚涘簲閾惧簱瀛樼煡璇嗛棶绛�',
+ imageUrl: '/images/know.jpg',
+ chatbotId: 'pDDfkU9HyBl2gzXx',
+ background: '楂樻晥鐨勫簱瀛樼鐞嗛渶瑕佷赴瀵岀殑涓撲笟鐭ヨ瘑鍜岀粡楠屻�侫I鐭ヨ瘑搴撴暣鍚堜簡澶ч噺渚涘簲閾惧拰搴撳瓨绠＄悊鐨勪笓涓氱煡璇嗭紝鍙互蹇�熻В绛斿悇绫诲簱瀛樼鐞嗛棶棰樸��',
+ instructions: '鎮ㄥ彲浠ヨ闂换浣曚笌搴撳瓨绠＄悊鐩稿叧鐨勯棶棰橈紝鍖呮嫭搴撳瓨绛栫暐銆佹垚鏈帶鍒躲�佸懆杞巼浼樺寲绛夛紝AI鍔╂墜灏嗕负鎮ㄦ彁渚涗笓涓氱殑瑙ｇ瓟鍜屽缓璁��'
+ },
+ {
+ title: '鎵湴鏈哄櫒浜洪攢鍞帹鑽愬皬鍔╂墜',
+ description: '鏅鸿兘鍖栦骇鍝佹帹鑽愭彁鍗囧璐晥鐜�',
+ imageUrl: '/images/robot.jpg',
+ chatbotId: 'sUAviPXvcEIw3oQC',
+ background: '闈㈠涓嶅悓瀹㈡埛鐨勪釜鎬у寲闇�姹傦紝濡備綍鍑嗙‘鎺ㄨ崘鍚堥�傜殑浜у搧鏄彁鍗囬攢鍞晥鐜囩殑鍏抽敭銆侫I鍔╂墜鍩轰簬娣卞害瀛︿範绠楁硶锛岃兘澶熺簿鍑嗗垎鏋愬鎴烽渶姹傦紝鎻愪緵涓�у寲鐨勪骇鍝佹帹鑽愩��',
+ instructions: '鎮ㄥ彲浠ユ弿杩板鎴风殑鍏蜂綋闇�姹傚拰鍋忓ソ锛孉I鍔╂墜灏嗘牴鎹繖浜涗俊鎭紝涓烘偍鎺ㄨ崘鏈�閫傚悎鐨勪骇鍝侊紝骞舵彁渚涗笓涓氱殑浜у搧浠嬬粛鍜岄攢鍞缓璁��'
},
{
title: '琛ユ枡',
description: '鏅鸿兘鍔ㄦ�佸垎鏋愪骇绾匡紝宸ヤ綅鐨勭己鏂欐儏鍐碉紝闄嶄綆鍋滅嚎椋庨櫓',
imageUrl: '/images/kanban.jpg',
chatbotId: 'JELkWpPLHQfRNhEH',
+ background: '鍦ㄧ敓浜х嚎杩愯杩囩▼涓紝鍙婃椂鍙戠幇骞惰В鍐崇己鏂欓棶棰樻槸淇濊瘉鐢熶骇鏁堢巼鐨勫叧閿�侫I绯荤粺閫氳繃瀹炴椂鐩戞帶鍜屽垎鏋愶紝甯姪鎮ㄦ彁鍓嶉璀﹀彲鑳界殑缂烘枡椋庨櫓锛屼紭鍖栬ˉ鏂欒鍒掋��',
+ instructions: '鎮ㄥ彲浠ユ弿杩板叿浣撶殑鐢熶骇绾挎儏鍐靛拰缂烘枡闂锛孉I鍔╂墜灏嗗熀浜庡巻鍙叉暟鎹拰瀹炴椂鐘舵�侊紝涓烘偍鎻愪緵鏈�浼樼殑琛ユ枡鏂规鍜屽缓璁��',
+ dataDescription: '鏈満鏅�氳繃鏁村悎MES銆丼CADA銆乄MS绛夌郴缁熺殑瀹炴椂鏁版嵁锛岀粨鍚圓I绠楁硶杩涜鏅鸿兘鍒嗘瀽鍜岄璀︺�備互涓嬩负婕旂ず鏁版嵁锛屽疄闄呬娇鐢ㄦ椂灏嗚嚜鍔ㄥ鎺ョ浉鍏充笟鍔＄郴缁熴��',
+ exampleData: `
+### 鐢熶骇浜у搧P鏃讹紝璇︾粏宸ヤ綅鐨勭墿鏂欓渶姹備俊鎭�
+
+| 宸ヤ綅 | 鍘熸潗鏂欓渶姹� | 鍘熸潗鏂欐秷鑰楅�熺巼 | 鐢熶骇鐨勪骇鍝� | 浜х嚎鍚� |
+| :--: | :--: | :--: | :--: | :--: |
+| 1 | A1 | 2/灏忔椂 | P | 浜х嚎1 |
+| 2 | A2 | 1/灏忔椂 | P | 浜х嚎1 |
+| 3 | A3 | 2/灏忔椂 | P | 浜х嚎1 |
+| 4 | A4 | 4/灏忔椂 | P | 浜х嚎1 |
+| 5 | A5 | 5/灏忔椂 | P | 浜х嚎1 |
+| 6 | - | - | P | 浜х嚎1 |
+| 7 | A7 | 3/灏忔椂 | P | 浜х嚎1 |
+| 8 | - | - | P | 浜х嚎1 |
+| 9 | A9 | 3/灏忔椂 | P | 浜х嚎1 |
+
+### 鍙互閫氳繃闆嗘垚绾胯竟搴撳瓨鑾峰彇锛圛OT锛屼紶鎰熷櫒锛孍RP绯荤粺绛夛級锛屼汉宸ョ洰瑙嗗彂鐜扮己鏂欐垨鑰呯墿鏂欒緝灏戞椂锛屼汉涓鸿Е鍙戯紙椋炰功锛屽井淇＄瓑IM宸ュ叿涓婅緭鍏�/璇煶锛孹X宸ヤ綅锛孹X鐗╂枡缂烘枡锛�
+### 褰撳墠浜х嚎鐜板満搴撳瓨閲�
+
+| 鍘熸潗鏂� | 鏁伴噺 | 浜х嚎鍚� |
+| :--: | :--: | :--: |
+| A1 | 10 | 浜х嚎1 |
+| A2 | 10 | 浜х嚎1 |
+| A3 | 10 | 浜х嚎1 |
+| A4 | 10 | 浜х嚎1 |
+| A5 | 10 | 浜х嚎1 |
+| A6 | 10 | 浜х嚎1 |
+| A7 | 10 | 浜х嚎1 |
+| A8 | 10 | 浜х嚎1 |
+| A9 | 10 | 浜х嚎1 |
+
+### 闇�瑕侀�氳繃ERP/WMS鑾峰彇鏁版嵁锛岃嫢鏃犳硶鑾峰彇ERP/WMS绯荤粺鏁版嵁锛屽彲鐩存帴鐢变汉宸ュ懠鍙叿浣撹ˉ璐ф暟閲忥紝鐢熸垚浠撳簱琛ヨ揣鐪嬫澘
+### 褰撳墠鍘熸潗鏂欏簱涓紝瀛樻斁搴撲綅鍜屽簱瀛橀噺
+
+| 鍘熸潗鏂� | 搴撲綅 | 鏁伴噺 |
+| :--: | :--: | :--: |
+| A1 | 3-2 | 100 |
+| A2 | 3-1 | 100 |
+| A3 | 1-1 | 100 |
+| A4 | 1-2 | 100 |
+| A5 | 2-1 | 100 |
+| A7 | 2-2 | 100 |
+| A9 | 4-1 | 100 |
+`
},
{
- title: '鎻掑崟',
+ title: '鎻掑崟1.0',
description: '鏅鸿兘璇勪及闇�姹傛彃鍗曞浜ц兘锛屽師鏉愭枡鍜屼氦浠樻湇鍔＄殑褰卞搷锛屾彁鍗囧鎴锋弧鎰忓害',
imageUrl: '/images/xuqiu.jpg',
- chatbotId: 'DfH4cIzujVGvn5iR',
+ chatbotId: 'RhMYLHI1SZNiX4kl',
+ background: '鍦ㄧ敓浜ц鍒掓墽琛岃繃绋嬩腑锛屽父甯镐細閬囧埌绱ф�ヨ鍗曢渶瑕佹彃鍗曠殑鎯呭喌銆侫I绯荤粺鍙互蹇�熻瘎浼版彃鍗曞鐜版湁鐢熶骇璁″垝鐨勫奖鍝嶏紝骞舵彁渚涙渶浼樼殑鎻掑崟鏂规銆�',
+ instructions: '璇锋彁渚涢渶瑕佹彃鍗曠殑璁㈠崟淇℃伅锛屽寘鎷骇鍝佺被鍨嬨�佹暟閲忓拰鏈熸湜浜や粯鏃堕棿锛孉I鍔╂墜灏嗕负鎮ㄥ垎鏋愬彲琛屾�у苟缁欏嚭鍏蜂綋鐨勬彃鍗曞缓璁��',
+ dataDescription: '鏈満鏅�氳繃鏁村悎ERP銆丮ES绛夌郴缁熺殑瀹炴椂鏁版嵁锛岀粨鍚圓I绠楁硶杩涜鏅鸿兘鍒嗘瀽鍜岄璀︺�備互涓嬩负婕旂ず鏁版嵁锛屽疄闄呬娇鐢ㄦ椂灏嗚嚜鍔ㄥ鎺ョ浉鍏充笟鍔＄郴缁熴��',
+ exampleData: `
+### 鍩虹鏁版嵁锛氫骇鍝侊細A锛孊锛孋
+### A, B, C鐨凚OM
+
+| 浜у搧 | 鐗╂枡 | 鐗╂枡鍗曚綅鐢ㄩ噺 |
+| :--: | :--: | :--: |
+| A | 1001 | 1 |
+| A | 1002 | 3 |
+| A | 1003 | 3 |
+| B | 1001 | 1 |
+| B | 1002 | 2 |
+| B | 1004 | 3 |
+| C | 1005 | 1 |
+| C | 1002 | 3 |
+| C | 1003 | 2 |
+
+### 闇�姹傛暟鎹�
+
+| 浜у搧 | 闇�姹傛暟閲� | 闇�姹傛棩鏈� | 闇�姹傚崟鍙� | 瀹㈡埛 | 鍗曚环 |
+| :--: | :--: | :--: | :--: | :--: | :--: |
+| A | 1000 | 2/2/2025 | A1001 | 涓煶娌� | 100.0 |
+| A | 200 | 3/2/2025 | A1002 | 涓缓浜屽眬 | 95.0 |
+| A | 500 | 5/2/2025 | A1003 | 瀹濇闆嗗洟 | 90.0 |
+| B | 2000 | 3/2/2025 | B1001 | 涓煶娌� | 95.0 |
+| B | 300 | 4/2/2025 | B1002 | 涓缓浜屽眬 | 90.0 |
+| B | 100 | 7/2/2025 | B1003 | 瀹濇闆嗗洟 | 100.0 |
+| C | 800 | 4/2/2025 | C1001 | 涓煶娌� | 85.0 |
+| C | 600 | 7/2/2025 | C1002 | 涓缓浜屽眬 | 90.0 |
+| C | 400 | 8/2/2025 | C1003 | 瀹濇闆嗗洟 | 90.0 |
+
+### 鍋囪褰撳墠鏃ユ湡鏄�2鏈�1鏃ワ紝璁″垝寮�濮嬫棩鏈熸槸2鏈�2鏃ワ紝褰撳墠鏈変竴涓彃鍗曢渶姹傦細
+
+| 浜у搧 | 闇�姹傛暟閲� | 闇�姹傛棩鏈� | 闇�姹傚崟鍙� | 瀹㈡埛 | 鍗曚环 |
+| :--: | :--: | :--: | :--: | :--: | :--: |
+| A | 200 | 5/2/2025 | D1001 | 涓煶娌� | 100.0 |
+
+### 宸叉湁閲囪喘璁㈠崟
+
+| 渚涘簲鍟嗗悕绉� | 鐗╂枡 | 閲囪喘璁㈠崟鍙� | 棰勮鍒拌揣鏃ユ湡 | 閲囪喘鏁伴噺 |
+| :--: | :--: | :--: | :--: | :--: |
+| S1 | 1001 | PO1 | 2/2/2025 | 2000 |
+| S2 | 1002 | PO2 | 2/2/2025 | 1000 |
+| S3 | 1003 | PO3 | 2/2/2025 | 1000 |
+| S4 | 1004 | PO4 | 2/2/2025 | 800 |
+| S5 | 1005 | PO5 | 2/2/2025 | 800 |
+
+### 渚涘簲鍟嗗垪琛�
+
+| 渚涘簲鍟嗗悕绉� | 鐗╂枡 | 鑱旂郴鏂瑰紡 |
+| :--: | :--: | :--: |
+| S1 | 1001 | chenqinghonghs@163.com |
+| S2 | 1002 | chenqinghonghs@163.com |
+| S3 | 1003 | chenqinghonghs@163.com |
+| S4 | 1004 | chenqinghonghs@163.com |
+| S5 | 1005 | 16673976114@163.com |
+`
},
{
- title: '绉戞矁鏂攢鍞帹鑽愬皬鍔╂墜',
- description: '鏅鸿兘鍖栦骇鍝佹帹鑽愭彁鍗囧璐晥鐜�',
- imageUrl: '/images/robot.jpg',
- chatbotId: 'sUAviPXvcEIw3oQC',
+ title: '鎻掑崟2.0',
+ description: '鏅鸿兘璇勪及闇�姹傛彃鍗曞浜ц兘锛屽師鏉愭枡鍜屼氦浠樻湇鍔＄殑褰卞搷锛屾彁鍗囧鎴锋弧鎰忓害',
+ imageUrl: '/images/chadan2.jpg',
+ chatbotId: 'zO9YQDEHdIApG9zC',
+ background: '鍦ㄧ敓浜ц鍒掓墽琛岃繃绋嬩腑锛屽父甯镐細閬囧埌绱ф�ヨ鍗曢渶瑕佹彃鍗曠殑鎯呭喌銆侫I绯荤粺鍙互蹇�熻瘎浼版彃鍗曞鐜版湁鐢熶骇璁″垝鐨勫奖鍝嶏紝骞舵彁渚涙渶浼樼殑鎻掑崟鏂规銆�',
+ instructions: '璇锋彁渚涢渶瑕佹彃鍗曠殑璁㈠崟淇℃伅锛屽寘鎷骇鍝佺被鍨嬨�佹暟閲忓拰鏈熸湜浜や粯鏃堕棿锛孉I鍔╂墜灏嗕负鎮ㄥ垎鏋愬彲琛屾�у苟缁欏嚭鍏蜂綋鐨勬彃鍗曞缓璁��',
+ dataDescription: '鏈満鏅�氳繃鏁村悎ERP銆丮ES绛夌郴缁熺殑瀹炴椂鏁版嵁锛岀粨鍚圓I绠楁硶杩涜鏅鸿兘鍒嗘瀽鍜岄璀︺�備互涓嬩负婕旂ず鏁版嵁锛屽疄闄呬娇鐢ㄦ椂灏嗚嚜鍔ㄥ鎺ョ浉鍏充笟鍔＄郴缁熴��',
+ exampleData: `
+### 鍩虹鏁版嵁锛氫骇鍝侊細A锛孊锛孋
+### A, B, C鐨凚OM
+
+| 浜у搧 | 鐗╂枡 | 鐗╂枡鍗曚綅鐢ㄩ噺 |
+| :--: | :--: | :--: |
+| A | 1001 | 1 |
+| A | 1002 | 3 |
+| A | 1003 | 3 |
+| B | 1001 | 1 |
+| B | 1002 | 2 |
+| B | 1004 | 3 |
+| C | 1005 | 1 |
+| C | 1002 | 3 |
+| C | 1003 | 2 |
+
+### 闇�姹傛暟鎹�
+
+| 浜у搧 | 闇�姹傛暟閲� | 闇�姹傛棩鏈� | 闇�姹傚崟鍙� | 瀹㈡埛 | 鍗曚环 |
+| :--: | :--: | :--: | :--: | :--: | :--: |
+| A | 1000 | 2/2/2025 | A1001 | 涓煶娌� | 100.0 |
+| A | 200 | 3/2/2025 | A1002 | 涓缓浜屽眬 | 95.0 |
+| A | 500 | 5/2/2025 | A1003 | 瀹濇闆嗗洟 | 90.0 |
+| B | 2000 | 3/2/2025 | B1001 | 涓煶娌� | 95.0 |
+| B | 300 | 4/2/2025 | B1002 | 涓缓浜屽眬 | 90.0 |
+| B | 100 | 7/2/2025 | B1003 | 瀹濇闆嗗洟 | 100.0 |
+| C | 800 | 4/2/2025 | C1001 | 涓煶娌� | 85.0 |
+| C | 600 | 7/2/2025 | C1002 | 涓缓浜屽眬 | 90.0 |
+| C | 400 | 8/2/2025 | C1003 | 瀹濇闆嗗洟 | 90.0 |
+
+### 鍋囪褰撳墠鏃ユ湡鏄�2鏈�1鏃ワ紝璁″垝寮�濮嬫棩鏈熸槸2鏈�2鏃ワ紝褰撳墠鏈変竴涓彃鍗曢渶姹傦細
+
+| 浜у搧 | 闇�姹傛暟閲� | 闇�姹傛棩鏈� | 闇�姹傚崟鍙� | 瀹㈡埛 | 鍗曚环 |
+| :--: | :--: | :--: | :--: | :--: | :--: |
+| A | 200 | 5/2/2025 | D1001 | 涓煶娌� | 100.0 |
+
+### 宸叉湁閲囪喘璁㈠崟
+
+| 渚涘簲鍟嗗悕绉� | 鐗╂枡 | 閲囪喘璁㈠崟鍙� | 棰勮鍒拌揣鏃ユ湡 | 閲囪喘鏁伴噺 |
+| :--: | :--: | :--: | :--: | :--: |
+| S1 | 1001 | PO1 | 2/2/2025 | 2000 |
+| S2 | 1002 | PO2 | 2/2/2025 | 1000 |
+| S3 | 1003 | PO3 | 2/2/2025 | 1000 |
+| S4 | 1004 | PO4 | 2/2/2025 | 800 |
+| S5 | 1005 | PO5 | 2/2/2025 | 800 |
+
+### 渚涘簲鍟嗗垪琛�
+
+| 渚涘簲鍟嗗悕绉� | 鐗╂枡 | 鑱旂郴鏂瑰紡 |
+| :--: | :--: | :--: |
+| S1 | 1001 | chenqinghonghs@163.com |
+| S2 | 1002 | chenqinghonghs@163.com |
+| S3 | 1003 | chenqinghonghs@163.com |
+| S4 | 1004 | chenqinghonghs@163.com |
+| S5 | 1005 | 16673976114@163.com |
+`
},
{
- title: '搴撳瓨绠＄悊鐭ヨ瘑搴撻棶绛�',
- description: '搴撳瓨鐭ヨ瘑锛屾彁渚涗笓涓氱殑渚涘簲閾惧簱瀛樼煡璇嗛棶绛�',
- imageUrl: '/images/know.jpg',
- chatbotId: 'pDDfkU9HyBl2gzXx',
+ title: '渚涘簲閾惧叏鏅礊瀵�',
+ description: '閫氳繃AI Agent涓嶢PS鐨勬繁搴﹀崗鍚岋紝灏嗘彃鍗曞搷搴斾粠"琚姩鏁戠伀"鍗囩骇涓�"棰勬祴-鍐崇瓥-鎵ц"涓変綅涓�浣撶殑鏅鸿兘杩愯惀妯″紡锛屽姪鍔涙柊鑳芥簮涓氬姟澧為暱銆�',
+ imageUrl: '/images/333.png',
+ chatbotId: 'SCPanoramaInsight',
+ background: `渚涘簲閾惧叏鏅礊瀵熺郴缁熸槸鏂颁竴浠ｆ櫤鑳戒緵搴旈摼绠＄悊骞冲彴鐨勬牳蹇冨紩鎿庛�傝AI绯荤粺鑳藉瑙ｅ喅浼犵粺渚涘簲閾剧鐞嗕腑鐨勫洓澶у叧閿棶棰橈細
+
+**鐢熶骇璁″垝涓庝骇鑳藉奖鍝嶈瘎浼帮細**
+- 瀹炴椂鐩戞帶鐢熶骇绾跨姸鎬侊紝鍔ㄦ�佽瘎浼颁骇鑳藉埄鐢ㄧ巼
+- 鍩轰簬鍘嗗彶鏁版嵁鍜屽疄鏃惰鍗曪紝鏅鸿兘棰勬祴鐢熶骇鐡堕
+- 鑷姩璋冩暣鐢熶骇璁″垝锛屾渶澶у寲浜ц兘鍒╃敤鏁堢巼
+- 鎻愪緵澶氬満鏅敓浜ц鍒掑姣斿垎鏋愶紝杈呭姪鍐崇瓥鍒跺畾
+
+**渚涘簲鍗忓悓鑳藉姏璇勪及锛�**
+- 瀹炴椂杩借釜渚涘簲鍟嗕氦浠樼姸鎬侊紝璇勪及渚涘簲椋庨櫓
+- 鏅鸿兘鍒嗘瀽渚涘簲鍟嗙哗鏁堬紝鎻愪緵渚涘簲鍟嗕紭鍖栧缓璁�
+- 棰勬祴鍘熸潗鏂欓渶姹傦紝鎻愬墠鍚姩閲囪喘娴佺▼
+- 鏋勫缓渚涘簲閾剧綉缁滈煣鎬фā鍨嬶紝鎻愬崌鎶楅闄╄兘鍔�
+
+**浜や粯灞ョ害椋庨櫓璇勪及锛�**
+- 鍩轰簬璁㈠崟銆佸簱瀛樸�佺敓浜ц繘搴﹁繘琛岀患鍚堥闄╄瘎浼�
+- 鎻愬墠璇嗗埆娼滃湪寤舵湡椋庨櫓锛屽埗瀹氬簲瀵归妗�
+- 瀹炴椂璺熻釜浜や粯杩涘害锛岀‘淇濆鎴锋弧鎰忓害
+- 寤虹珛瀹㈡埛棰勬湡绠＄悊鏈哄埗锛屾彁鍗囨湇鍔′綋楠�
+
+**鎴愭湰涓庤储鍔″奖鍝嶈瘎浼帮細**
+- 鍏ㄩ摼璺垚鏈拷韪紝绮剧‘璁＄畻鍚勭幆鑺傛垚鏈瀯鎴�
+- 鍔ㄦ�佹垚鏈紭鍖栧缓璁紝闄嶄綆鏁翠綋杩愯惀鎴愭湰
+- 璐㈠姟褰卞搷棰勬祴鍒嗘瀽锛屾敮鎸佸晢涓氬喅绛�
+- ROI璇勪及妯″瀷锛岄噺鍖栨敼杩涙帾鏂界殑璐㈠姟鏁堢泭`,
+ instructions: `鎮ㄥ彲浠ラ�氳繃浠ヤ笅鏂瑰紡涓庝緵搴旈摼鍏ㄦ櫙娲炲療绯荤粺浜掑姩锛�
+
+**鍦烘櫙涓�锛氭彃鍗曞奖鍝嶅垎鏋�**
+鎻愪緵鏂拌鍗曚俊鎭紝绯荤粺灏嗕粠鍥涗釜缁村害璇勪及鎻掑崟鍙鎬у拰褰卞搷銆�
+
+**鍦烘櫙浜岋細鐢熶骇璁″垝浼樺寲**
+鎻忚堪褰撳墠鐢熶骇鐘跺喌锛岃幏鍙栨櫤鑳戒紭鍖栧缓璁拰椋庨櫓棰勮銆�
+
+**鍦烘櫙涓夛細渚涘簲閾鹃闄╄瘎浼�**
+杈撳叆渚涘簲鍟嗘垨鍘熸潗鏂欎俊鎭紝鑾峰彇渚涘簲椋庨櫓鍒嗘瀽鍜屽簲瀵圭瓥鐣ャ��
+
+**鍦烘櫙鍥涳細鎴愭湰浼樺寲鍒嗘瀽**
+鎻愪緵鎴愭湰鐩稿叧鏁版嵁锛岃幏鍙栨垚鏈紭鍖栧缓璁拰璐㈠姟褰卞搷璇勪及銆�
+
+绯荤粺灏嗗熀浜庡疄鏃舵暟鎹拰AI绠楁硶锛屼负鎮ㄦ彁渚涗笓涓氱殑鍒嗘瀽鎶ュ憡鍜屽喅绛栧缓璁�俙,
+ dataDescription: '鏈満鏅暣鍚堜簡OMS銆乄MS绛夊涓郴缁熺殑瀹炴椂鏁版嵁锛岄�氳繃AI绠楁硶杩涜娣卞害鍒嗘瀽銆備互涓嬩负鏂拌兘婧愯涓氱殑妯℃嫙鏁版嵁锛屽疄闄呭簲鐢ㄤ腑灏嗚嚜鍔ㄥ鎺ヤ紒涓氱幇鏈夌郴缁熴��',
+ exampleData: `
+### 璁㈠崟闇�姹傛暟鎹� (OMS绯荤粺)
+
+| 璁㈠崟鍙� | 浜у搧鍨嬪彿 | 鏁伴噺 | 瀹㈡埛鍚嶇О | 棰勬湡浜や粯鏃ユ湡 | 浼樺厛绾� | 璁㈠崟閲戦 |
+| :--: | :--: | :--: | :--: | :--: | :--: | :--: |
+| SO20250201001 | NEV-Battery-A | 500 | 姣斾簹杩� | 2025-02-15 | 楂� | 2,500,000 |
+| SO20250201002 | NEV-Motor-B | 200 | 钄氭潵姹借溅 | 2025-02-20 | 涓� | 1,800,000 |
+| SO20250201003 | NEV-Controller-C | 300 | 鐞嗘兂姹借溅 | 2025-02-25 | 楂� | 3,200,000 |
+| SO20250201004 | NEV-Charger-D | 150 | 灏忛箯姹借溅 | 2025-03-01 | 涓� | 1,200,000 |
+
+### 搴撳瓨鏁版嵁 (WMS绯荤粺)
+
+| 鐗╂枡缂栫爜 | 鐗╂枡鍚嶇О | 褰撳墠搴撳瓨 | 瀹夊叏搴撳瓨 | 鍦ㄩ�旀暟閲� | 棰勮鍒拌揣鏃堕棿 | 搴撲綅 |
+| :--: | :--: | :--: | :--: | :--: | :--: | :--: |
+| MAT001 | 閿傜數姹犺姱 | 1,200 | 500 | 800 | 2025-02-10 | A鍖�-01 |
+| MAT002 | 鐢垫満瀹氬瓙 | 350 | 200 | 150 | 2025-02-12 | B鍖�-02 |
+| MAT003 | 鎺у埗鑺墖 | 180 | 100 | 200 | 2025-02-15 | C鍖�-03 |
+| MAT004 | 鍏呯數妯″潡 | 95 | 50 | 100 | 2025-02-18 | D鍖�-04 |
+
+### 渚涘簲鍟嗙哗鏁堟暟鎹�
+
+| 渚涘簲鍟嗗悕绉� | 渚涘簲鐗╂枡 | 鎸夋椂浜や粯鐜� | 璐ㄩ噺鍚堟牸鐜� | 浠锋牸绔炰簤鍔� | 椋庨櫓绛夌骇 |
+| :--: | :--: | :--: | :--: | :--: | :--: |
+| 瀹佸痉鏃朵唬 | 閿傜數姹犺姱 | 95% | 99.5% | 楂� | 浣� |
+| 姹囧窛鎶�鏈� | 鐢垫満瀹氬瓙 | 88% | 98.2% | 涓� | 涓� |
+| 鍦板钩绾� | 鎺у埗鑺墖 | 92% | 99.8% | 涓� | 浣� |
+| 鐗规潵鐢� | 鍏呯數妯″潡 | 85% | 97.5% | 楂� | 涓� |
+`
},
];
export default function AISceneChatPage() {
- const [services, setServices] = useState(defaultServices);
- const [selectedScene, setSelectedScene] = useState(services[0]);
+ return (
+ <Suspense fallback={<div>Loading...</div>}>
+ <AISceneChatContent />
+ </Suspense>
+ );
+}
+
+function AISceneChatContent() {
+ const searchParams = useSearchParams();
+ const sceneId = searchParams.get('scene') || searchParams.get('chatbotId');
+ const router = useRouter();
+ const [showDataPreview, setShowDataPreview] = useState(false);
+
+ // 鏍规嵁URL鍙傛暟鎵惧埌瀵瑰簲鐨勫満鏅�
+ const initialScene = defaultServices.find(s => s.chatbotId === sceneId) || defaultServices[0];
+
+ // 淇敼涓轰娇鐢ㄥ畬鏁寸殑鍦烘櫙鏁版嵁
+ const [services] = useState([initialScene]);
+ const [selectedScene, setSelectedScene] = useState(initialScene);
const [iframeKey, setIframeKey] = useState(0);
+ const [token, setToken] = useState<string | null>(null);
+
+ useEffect(() => {
+ // Get token from localStorage
+ const storedToken = localStorage.getItem('token');
+ setToken(storedToken);
+ }, []);
// 鍒囨崲鍦烘櫙鏃堕噸鏂板姞杞絠frame
const handleSceneChange = (scene: typeof services[0]) => {
@@ -48,66 +319,58 @@
setIframeKey(prev => prev + 1);
};
- // 娣诲姞鏂板満鏅�
- const handleAddNewScene = () => {
- const newScene = {
- title: `鏂板満鏅� ${services.length + 1}`,
- description: '杩欐槸涓�涓柊鐨凙I鍦烘櫙',
- imageUrl: '/images/robot.jpg', // 榛樿鍥剧墖
- chatbotId: `new-scene-${Date.now()}`, // 鐢熸垚鍞竴ID
- };
- setServices(prev => [...prev, newScene]);
- };
-
return (
<div className="h-screen flex bg-white">
{/* 宸︿晶鍦烘櫙閫夐」鍗� */}
<div className="w-64 bg-white border-r flex flex-col">
{/* 鍥哄畾澶撮儴 */}
- <div className="p-4 pt-20 bg-white">
- <h2 className="text-xl font-bold flex items-center mb-4">
- <span className="text-gray-900">
- AI鍦烘櫙
- </span>
- <motion.span
- className="ml-2 inline-block w-2 h-2 rounded-full bg-[#6ADBFF]"
- animate={{
- scale: [1, 1.5, 1],
- opacity: [0.7, 1, 0.7]
- }}
- transition={{
- duration: 2,
- repeat: Infinity,
- ease: "easeInOut"
- }}
- />
- </h2>
-
- {/* 鏂板鍦烘櫙鎸夐挳 */}
- <button
- onClick={handleAddNewScene}
- className="w-full p-3 bg-[#EEF3FD] text-[#4080FF] rounded-lg font-medium transition-all duration-300 flex items-center hover:bg-[#E1E9FA] group cursor-pointer"
- >
- <svg
- className="w-5 h-5 mr-2"
- viewBox="0 0 24 24"
- fill="none"
- stroke="currentColor"
- >
- <path
- d="M12 5v14M5 12h14"
- strokeWidth="2"
- strokeLinecap="round"
- strokeLinejoin="round"
- />
- </svg>
- 寮�鍚柊鍦烘櫙
- </button>
+ <div className="pt-[65px] bg-white">
+ <div className="h-12 px-6 flex items-center border-b">
+ <div className="flex items-center">
+ <button
+ onClick={() => router.push('/ai-scene')}
+ className="group inline-flex items-center text-sm text-gray-500 hover:text-red-500 transition-all duration-300 cursor-pointer"
+ >
+ <svg
+ xmlns="http://www.w3.org/2000/svg"
+ className="h-4 w-4 transition-transform duration-300 group-hover:-translate-x-0.5"
+ fill="none"
+ viewBox="0 0 24 24"
+ stroke="currentColor"
+ >
+ <path
+ strokeLinecap="round"
+ strokeLinejoin="round"
+ strokeWidth={2}
+ d="M10 19l-7-7m0 0l7-7m-7 7h18"
+ />
+ </svg>
+ <span className="ml-1.5">杩斿洖</span>
+ </button>
+ <div className="mx-3 h-4 w-px bg-gray-200"></div>
+ <h2 className="text-base font-medium text-gray-900 flex items-center">
+ AI鍦烘櫙
+ <motion.span
+ className="ml-2 inline-block w-1.5 h-1.5 rounded-full bg-[#6ADBFF]"
+ animate={{
+ scale: [1, 1.5, 1],
+ opacity: [0.7, 1, 0.7]
+ }}
+ transition={{
+ duration: 2,
+ repeat: Infinity,
+ ease: "easeInOut"
+ }}
+ />
+ </h2>
+ </div>
+ </div>
</div>
{/* 婊氬姩鍐呭鍖� */}
- <div className="flex-1 overflow-y-auto px-4 [&::-webkit-scrollbar]:w-1 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:bg-[#E5E6EB] [&::-webkit-scrollbar-thumb]:rounded-full hover:[&::-webkit-scrollbar-thumb]:bg-[#C9CDD4]">
- <div className="space-y-3 py-4">
+ <div className="flex-1 overflow-y-auto">
+ {/* 鍦烘櫙鍒楄〃 */}
+ <div className="px-4 py-2 space-y-3">
{services.map((scene) => (
<motion.div
key={scene.chatbotId}
@@ -137,9 +400,11 @@
)}
<div className="flex items-center relative z-10">
<div className="w-8 h-8 rounded-lg overflow-hidden mr-3 relative flex-shrink-0">
- <img
+ <Image
src={scene.imageUrl}
alt={scene.title}
+ width={32}
+ height={32}
className="w-full h-full object-cover transform transition-transform duration-700 group-hover:scale-110"
/>
<div className="absolute inset-0 bg-gradient-to-br from-black/20 to-transparent"></div>
@@ -173,11 +438,79 @@
</motion.div>
))}
</div>
+
+ {/* 鍦烘櫙淇℃伅灞曠ず鍖哄煙 */}
+ <div className="p-4 space-y-4">
+ {/* 鍦烘櫙鑳屾櫙 */}
+ <div className="bg-gray-50 rounded-lg p-4 border border-gray-100 hover:border-gray-200 transition-colors duration-300 shadow-sm">
+ <div className="flex items-center gap-2 mb-2">
+ <svg xmlns="http://www.w3.org/2000/svg" className="h-4 w-4 text-gray-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+ <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 10V3L4 14h7v7l9-11h-7z" />
+ </svg>
+ <h3 className="text-sm font-medium text-gray-700">鍦烘櫙鑳屾櫙</h3>
+ </div>
+ <p className="text-gray-600 text-sm leading-relaxed">
+ {selectedScene.background}
+ </p>
+ </div>
+
+ {/* 浣跨敤璇存槑 */}
+ <div className="bg-gray-50 rounded-lg p-4 border border-gray-100 hover:border-gray-200 transition-colors duration-300 shadow-sm">
+ <div className="flex items-center gap-2 mb-2">
+ <svg xmlns="http://www.w3.org/2000/svg" className="h-4 w-4 text-gray-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+ <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253" />
+ </svg>
+ <h3 className="text-sm font-medium text-gray-700">浣跨敤璇存槑</h3>
+ </div>
+ <p className="text-gray-600 text-sm leading-relaxed">
+ {selectedScene.instructions}
+ </p>
+ </div>
+
+ {/* 鏁版嵁璇存槑 - 鍙湪琛ユ枡鍜屾彃鍗曞満鏅樉绀� */}
+ {(selectedScene.chatbotId === 'JELkWpPLHQfRNhEH' ||
+ selectedScene.chatbotId === 'RhMYLHI1SZNiX4kl' ||
+ selectedScene.chatbotId === 'zO9YQDEHdIApG9zC' ||
+ selectedScene.chatbotId === 'SCPanoramaInsight') && (
+ <>
+ <div className="bg-gray-50 rounded-lg p-4 border border-gray-100 hover:border-gray-200 transition-colors duration-300 shadow-sm">
+ <div className="flex items-center justify-between mb-2">
+ <div className="flex items-center gap-2">
+ <svg xmlns="http://www.w3.org/2000/svg" className="h-4 w-4 text-gray-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+ <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 7v10c0 2 1 3 3 3h10c2 0 3-1 3-3V7c0-2-1-3-3-3H7C5 4 4 5 4 7z M9 11h6 M12 8v6" />
+ </svg>
+ <h3 className="text-sm font-medium text-gray-700">鏁版嵁璇存槑</h3>
+ </div>
+ <button
+ onClick={() => setShowDataPreview(true)}
+ className="p-1.5 rounded-md text-gray-400 hover:text-gray-600 hover:bg-gray-100 transition-all duration-300"
+ title="鏌ョ湅婕旂ず鏁版嵁"
+ >
+ <svg xmlns="http://www.w3.org/2000/svg" className="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+ <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 17v-2m3 2v-4m3 4v-6m2 10H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
+ </svg>
+ </button>
+ </div>
+ <p className="text-gray-600 text-sm leading-relaxed">
+ {selectedScene.dataDescription || '鏈満鏅墍浣跨敤鐨勬暟鎹潎涓烘ā鎷熸暟鎹紝浠呯敤浜庢紨绀虹洰鐨勩�傚湪瀹為檯搴旂敤涓紝灏嗘牴鎹偍鐨勫叿浣撻渶姹備娇鐢ㄧ湡瀹炴暟鎹繘琛屽垎鏋愬拰澶勭悊銆�'}
+ </p>
+ </div>
+
+ <DataPreviewDialog
+ isOpen={showDataPreview}
+ onClose={() => setShowDataPreview(false)}
+ markdownContent={selectedScene.exampleData || ''}
+ sceneType={selectedScene.chatbotId === 'JELkWpPLHQfRNhEH' ? 'buliao' :
+ selectedScene.chatbotId === 'SCPanoramaInsight' ? 'panorama' : 'chadan'}
+ />
+ </>
+ )}
+ </div>
</div>
</div>
{/* 涓棿鑱婂ぉ鍖哄煙 */}
- <div className="flex-1 flex flex-col bg-white pt-20 overflow-hidden">
+ <div className="flex-1 flex flex-col bg-white pt-[65px] overflow-hidden">
{/* 鍦烘櫙鏍囬 */}
<div className="h-16 bg-white flex items-center justify-center px-6 border-b">
<h1 className="text-lg font-medium text-gray-900">
@@ -186,24 +519,14 @@
</div>
{/* 鑱婂ぉ绐楀彛 */}
- <div className="flex-1 relative [&::-webkit-scrollbar]:w-1 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:bg-[#E5E6EB] [&::-webkit-scrollbar-thumb]:rounded-full hover:[&::-webkit-scrollbar-thumb]:bg-[#C9CDD4]">
- <AnimatePresence mode="wait">
- <motion.div
- key={iframeKey}
- className="absolute inset-0"
- initial={{ opacity: 0, scale: 0.98 }}
- animate={{ opacity: 1, scale: 1 }}
- exit={{ opacity: 0, scale: 1.02 }}
- transition={{ duration: 0.3 }}
- >
- <iframe
- src={`http://121.43.139.99/chatbot/${selectedScene.chatbotId}`}
- className="w-full h-full"
- style={{ border: 'none' }}
- allow="microphone"
- />
- </motion.div>
- </AnimatePresence>
+ <div className="flex-1 relative">
+ <iframe
+ key={iframeKey}
+ className="w-full h-full rounded-lg"
+ src={`http://121.43.139.99:7000/chatbot/${selectedScene.chatbotId}${token ? `?token=${token}` : ''}`}
+ frameBorder="0"
+ allow="microphone"
+ ></iframe>
</div>
</div>
</div>
--
Gitblit v1.9.3