更新admin 和 swagger

frontend/src/api.js

@@ -16,6 +16,7 @@ export const confirmPayment = (orderId) => api.post(`/orders/${orderId}/confirm_
 
 export const getServices = () => api.get('/services/');
 export const getServiceDetail = (id) => api.get(`/services/${id}/`);
+export const createServiceOrder = (data) => api.post('/service-orders/', data);
 export const getARServices = () => api.get('/ar/');
 
 export default api;

frontend/src/pages/Home.jsx

@@ -19,10 +19,9 @@ const Home = () => {
     fetchProducts();
     let i = 0;
     const typingInterval = setInterval(() => {
-      if (i < fullText.length) {
-        setTypedText(prev => prev + fullText.charAt(i));
-        i++;
-      } else {
+      i++;
+      setTypedText(fullText.slice(0, i));
+      if (i >= fullText.length) {
         clearInterval(typingInterval);
       }
     }, 150);
@@ -73,6 +72,26 @@ const Home = () => {
   return (
     <div>
       <div style={{ textAlign: 'center', marginBottom: 60, marginTop: 40 }}>
+        <motion.div
+          initial={{ opacity: 0, scale: 0.8 }}
+          animate={{ opacity: 1, scale: 1 }}
+          transition={{ duration: 1 }}
+          style={{ marginBottom: 30 }}
+        >
+          <motion.img 
+            src="/gXEu5E01.svg"
+            alt="LiangJi Tech Logo"
+            animate={{ 
+              filter: [
+                'invert(1) drop-shadow(0 0 10px rgba(0, 240, 255, 0.3))',
+                'invert(1) drop-shadow(0 0 20px rgba(0, 240, 255, 0.7))',
+                'invert(1) drop-shadow(0 0 10px rgba(0, 240, 255, 0.3))'
+              ]
+            }}
+            transition={{ duration: 3, repeat: Infinity, ease: "easeInOut" }}
+            style={{ width: 180, height: 'auto' }}
+          />
+        </motion.div>
         <Title level={1} style={{ color: '#fff', fontSize: 'clamp(2rem, 5vw, 4rem)', marginBottom: 20, minHeight: '60px' }}>
           <span className="neon-text-green">{typedText}</span><span className="cursor-blink">|</span>
         </Title>

frontend/src/pages/ServiceDetail.jsx

@@ -1,8 +1,8 @@
 import React, { useEffect, useState } from 'react';
 import { useParams, useNavigate } from 'react-router-dom';
-import { Typography, Button, Spin, Empty } from 'antd';
-import { ArrowLeftOutlined } from '@ant-design/icons';
-import { getServiceDetail } from '../api';
+import { Typography, Button, Spin, Empty, Descriptions, Tag, Row, Col, Modal, Form, Input, message, Statistic } from 'antd';
+import { ArrowLeftOutlined, ClockCircleOutlined, GiftOutlined, ShoppingCartOutlined } from '@ant-design/icons';
+import { getServiceDetail, createServiceOrder } from '../api';
 import { motion } from 'framer-motion';
 
 const { Title, Paragraph } = Typography;
@@ -12,6 +12,9 @@ const ServiceDetail = () => {
   const navigate = useNavigate();
   const [service, setService] = useState(null);
   const [loading, setLoading] = useState(true);
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const [submitting, setSubmitting] = useState(false);
+  const [form] = Form.useForm();
 
   useEffect(() => {
     const fetchDetail = async () => {
@@ -27,6 +30,28 @@ const ServiceDetail = () => {
     fetchDetail();
   }, [id]);
 
+  const handlePurchase = async (values) => {
+      setSubmitting(true);
+      try {
+          const orderData = {
+              service: service.id,
+              customer_name: values.customer_name,
+              company_name: values.company_name,
+              phone_number: values.phone_number,
+              email: values.email,
+              requirements: values.requirements
+          };
+          await createServiceOrder(orderData);
+          message.success('需求已提交，我们的销售顾问将尽快与您联系！');
+          setIsModalOpen(false);
+      } catch (error) {
+          console.error(error);
+          message.error('提交失败，请重试');
+      } finally {
+          setSubmitting(false);
+      }
+  };
+
   if (loading) {
     return (
         <div style={{ textAlign: 'center', padding: '100px 0' }}>
@@ -62,36 +87,135 @@ const ServiceDetail = () => {
         animate={{ opacity: 1, y: 0 }}
         transition={{ duration: 0.5 }}
       >
-        <div style={{ textAlign: 'center', marginBottom: 40 }}>
-            <Title level={1} style={{ color: '#fff' }}>
-                {service.title}
-            </Title>
-            <Paragraph style={{ color: '#888', fontSize: 18, maxWidth: 800, margin: '0 auto' }}>
-                {service.description}
-            </Paragraph>
-        </div>
+        <Row gutter={[40, 40]}>
+            <Col xs={24} md={16}>
+                <div style={{ textAlign: 'left', marginBottom: 40 }}>
+                    <Title level={1} style={{ color: '#fff' }}>
+                        {service.title}
+                    </Title>
+                    <Paragraph style={{ color: '#888', fontSize: 18 }}>
+                        {service.description}
+                    </Paragraph>
+                    
+                    <div style={{ marginTop: 30, background: 'rgba(255,255,255,0.05)', padding: 20, borderRadius: 12 }}>
+                        <Title level={4} style={{ color: '#fff' }}>服务详情</Title>
+                        <Descriptions column={1} labelStyle={{ color: '#888' }} contentStyle={{ color: '#fff' }}>
+                            <Descriptions.Item label={<span style={{ display: 'flex', alignItems: 'center' }}><ClockCircleOutlined style={{ marginRight: 8 }} /> 交付周期</span>}>
+                                {service.delivery_time || '待沟通'}
+                            </Descriptions.Item>
+                            <Descriptions.Item label={<span style={{ display: 'flex', alignItems: 'center' }}><GiftOutlined style={{ marginRight: 8 }} /> 交付内容</span>}>
+                                {service.delivery_content || '根据需求定制'}
+                            </Descriptions.Item>
+                        </Descriptions>
+                    </div>
+                </div>
 
-        {service.display_detail_image ? (
-            <div style={{ 
-                width: '100%', 
-                background: '#111', 
-                borderRadius: 12, 
-                overflow: 'hidden',
-                boxShadow: `0 0 30px ${service.color}22`,
-                border: `1px solid ${service.color}33`
-            }}>
-                <img 
-                    src={service.display_detail_image} 
-                    alt={service.title} 
-                    style={{ width: '100%', display: 'block' }} 
-                />
-            </div>
-        ) : (
-            <div style={{ textAlign: 'center', padding: 100, background: '#111', borderRadius: 12, color: '#666' }}>
-                暂无详情图片
-            </div>
-        )}
+                {service.display_detail_image ? (
+                    <div style={{ 
+                        width: '100%', 
+                        background: '#111', 
+                        borderRadius: 12, 
+                        overflow: 'hidden',
+                        boxShadow: `0 0 30px ${service.color}22`,
+                        border: `1px solid ${service.color}33`
+                    }}>
+                        <img 
+                            src={service.display_detail_image} 
+                            alt={service.title} 
+                            style={{ width: '100%', display: 'block' }} 
+                        />
+                    </div>
+                ) : (
+                    <div style={{ textAlign: 'center', padding: 100, background: '#111', borderRadius: 12, color: '#666' }}>
+                        暂无详情图片
+                    </div>
+                )}
+            </Col>
+            
+            <Col xs={24} md={8}>
+                <div style={{ position: 'sticky', top: 100 }}>
+                    <div style={{ 
+                        background: '#1f1f1f', 
+                        padding: 30, 
+                        borderRadius: 16, 
+                        border: `1px solid ${service.color}44`,
+                        boxShadow: `0 0 20px ${service.color}11`
+                    }}>
+                        <Title level={3} style={{ color: '#fff', marginTop: 0 }}>服务报价</Title>
+                        <div style={{ display: 'flex', alignItems: 'baseline', marginBottom: 20 }}>
+                            <span style={{ fontSize: 36, color: service.color, fontWeight: 'bold' }}>¥{service.price}</span>
+                            <span style={{ color: '#888', marginLeft: 8 }}>/ {service.unit} 起</span>
+                        </div>
+                        
+                        <div style={{ marginBottom: 20 }}>
+                            {service.features_list && service.features_list.map((feat, i) => (
+                                <Tag color={service.color} key={i} style={{ marginBottom: 8, padding: '4px 10px' }}>
+                                    {feat}
+                                </Tag>
+                            ))}
+                        </div>
+
+                        <Button 
+                            type="primary" 
+                            size="large" 
+                            block 
+                            icon={<ShoppingCartOutlined />}
+                            style={{ 
+                                height: 50, 
+                                background: service.color, 
+                                borderColor: service.color,
+                                color: '#000',
+                                fontWeight: 'bold'
+                            }}
+                            onClick={() => setIsModalOpen(true)}
+                        >
+                            立即咨询 / 购买
+                        </Button>
+                        <p style={{ color: '#666', marginTop: 15, fontSize: 12, textAlign: 'center' }}>
+                            * 具体价格可能因需求复杂度而异，提交需求后我们将提供详细报价单
+                        </p>
+                    </div>
+                </div>
+            </Col>
+        </Row>
       </motion.div>
+
+      {/* Purchase Modal */}
+      <Modal
+        title={`咨询/购买 - ${service.title}`}
+        open={isModalOpen}
+        onCancel={() => setIsModalOpen(false)}
+        footer={null}
+        destroyOnHidden
+      >
+        <p style={{ marginBottom: 20, color: '#666' }}>请填写您的联系方式和需求，我们的技术顾问将在 24 小时内与您联系。</p>
+        <Form
+          form={form}
+          layout="vertical"
+          onFinish={handlePurchase}
+        >
+          <Form.Item label="您的姓名" name="customer_name" rules={[{ required: true, message: '请输入姓名' }]}>
+            <Input placeholder="例如：张经理" />
+          </Form.Item>
+          <Form.Item label="公司/机构名称" name="company_name">
+            <Input placeholder="例如：某某科技有限公司" />
+          </Form.Item>
+          <Form.Item label="联系电话" name="phone_number" rules={[{ required: true, message: '请输入电话' }]}>
+            <Input placeholder="13800000000" />
+          </Form.Item>
+          <Form.Item label="电子邮箱" name="email" rules={[{ type: 'email' }]}>
+            <Input placeholder="example@company.com" />
+          </Form.Item>
+          <Form.Item label="需求描述" name="requirements">
+            <Input.TextArea rows={4} placeholder="请简单描述您的业务场景或具体需求..." />
+          </Form.Item>
+          
+          <div style={{ display: 'flex', justifyContent: 'flex-end', gap: 10, marginTop: 20 }}>
+            <Button onClick={() => setIsModalOpen(false)}>取消</Button>
+            <Button type="primary" htmlType="submit" loading={submitting}>提交需求</Button>
+          </div>
+        </Form>
+      </Modal>
     </div>
   );
 };