场景页面优化

hongjli

2025-04-07 603944bff3fa6a0541235ed0ab39ef9ba986e648

 src/app/ai-scene/page.tsx

@@ -3,6 +3,7 @@
import { useState } from 'react';
import Card from '@/components/Card';
import ChatDialog from '@/components/ChatDialog';
import SceneIntroDialog from '@/components/SceneIntroDialog';
import Navbar from '@/components/layout/Navbar';

const services = [
@@ -10,37 +11,51 @@
    title: '补料',
    description: '智能动态分析产线，工位的缺料情况，降低停线风险',
    imageUrl: '/images/kanban.jpg',
    chatbotId: 'JELkWpPLHQfRNhEH'
    chatbotId: 'JELkWpPLHQfRNhEH',
    background: '在生产线运行过程中，及时发现并解决缺料问题是保证生产效率的关键。AI系统通过实时监控和分析，帮助您提前预警可能的缺料风险，优化补料计划。',
    instructions: '您可以描述具体的生产线情况和缺料问题，AI助手将基于历史数据和实时状态，为您提供最优的补料方案和建议。'
  },
  {
    title: '插单',
    description: '智能评估需求插单对产能，原材料和交付服务的影响，提升客户满意度',
    imageUrl: '/images/xuqiu.jpg',
    chatbotId: 'DfH4cIzujVGvn5iR'
    chatbotId: 'DfH4cIzujVGvn5iR',
    background: '在生产计划执行过程中，常常会遇到紧急订单需要插单的情况。AI系统可以快速评估插单对现有生产计划的影响，并提供最优的插单方案。',
    instructions: '请提供需要插单的订单信息，包括产品类型、数量和期望交付时间，AI助手将为您分析可行性并给出具体的插单建议。'
  },
  {
    title: '科沃斯销售推荐小助手',
    description: '智能化产品推荐提升导购效率',
    imageUrl: '/images/robot.jpg',
    chatbotId: 'sUAviPXvcEIw3oQC'
    chatbotId: 'sUAviPXvcEIw3oQC',
    background: '面对不同客户的个性化需求，如何准确推荐合适的产品是提升销售效率的关键。AI助手基于深度学习算法，能够精准分析客户需求，提供个性化的产品推荐。',
    instructions: '您可以描述客户的具体需求和偏好，AI助手将根据这些信息，为您推荐最适合的科沃斯产品，并提供专业的产品介绍和销售建议。'
  },
  {
    title: '库存管理知识库问答',
    description: '库存知识，提供专业的供应链库存知识问答',
    imageUrl: '/images/know.jpg',
    chatbotId: 'pDDfkU9HyBl2gzXx'
    chatbotId: 'pDDfkU9HyBl2gzXx',
    background: '高效的库存管理需要丰富的专业知识和经验。AI知识库整合了大量供应链和库存管理的专业知识，可以快速解答各类库存管理问题。',
    instructions: '您可以询问任何与库存管理相关的问题，包括库存策略、成本控制、周转率优化等，AI助手将为您提供专业的解答和建议。'
  },
];

export default function AIScenePage() {
  const [isChatOpen, setIsChatOpen] = useState(false);
  const [isIntroOpen, setIsIntroOpen] = useState(false);
  const [currentChatbot, setCurrentChatbot] = useState('');
  const [selectedScene, setSelectedScene] = useState(services[0]);

  const handleCardClick = (title: string, chatbotId?: string) => {
    if (chatbotId) {
      setCurrentChatbot(chatbotId);
      setIsChatOpen(true);
    }
  const handleCardClick = (service: typeof services[0]) => {
    setSelectedScene(service);
    setIsIntroOpen(true);
  };

  const handleStartChat = () => {
    setIsIntroOpen(false);
    setCurrentChatbot(selectedScene.chatbotId);
    setIsChatOpen(true);
  };

  return (
@@ -62,12 +77,20 @@
                <Card
                  key={index}
                  {...service}
                  onClick={() => handleCardClick(service.title, service.chatbotId)}
                  onClick={() => handleCardClick(service)}
                />
              ))}
            </div>
          </div>
        </div>
        
        <SceneIntroDialog
          isOpen={isIntroOpen}
          onClose={() => setIsIntroOpen(false)}
          onStartChat={handleStartChat}
          scene={selectedScene}
        />
        
        <ChatDialog 
          isOpen={isChatOpen} 
          onClose={() => setIsChatOpen(false)}