feat: Initialize AI Studio project structure

Sets up the basic project files and dependencies for an AI Studio application. Includes README, `.env.example`, `.gitignore`, basic HTML structure, metadata, `package.json`, Vite configuration, and initial React component setup. This commit provides the foundation for running and deploying the AI Studio app locally.

src/components/views/EfficiencyView.tsx

@@ -0,0 +1,146 @@
+import React from 'react';
+import { AreaChart, Area, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer, BarChart, Bar, Legend, Cell } from 'recharts';
+import { StatCard } from '../ui/StatCard';
+import { Activity, Target, TrendingUp, Zap, Clock, Radio, AlertCircle } from 'lucide-react';
+
+const stationData = [
+  { name: '嘉兴嘉燃', 消耗: 420, 剩余: 580, 上限: 1000 },
+  { name: '嘉兴嘉锦', 消耗: 380, 剩余: 420, 上限: 800 },
+  { name: '如皋华神', 消耗: 160, 剩余: 340, 上限: 500 },
+  { name: '花桥中石油', 消耗: 80, 剩余: 220, 上限: 300 },
+  { name: '常熟嘉化', 消耗: 45, 剩余: 155, 上限: 200 }
+];
+
+const stationGrowth = [
+  { date: '4/18', 嘉燃: 10, 嘉锦: 3, 其他: 0 },
+  { date: '4/19', 嘉燃: 6, 嘉锦: 3, 其他: 0 },
+  { date: '4/20', 嘉燃: 7, 嘉锦: 0, 其他: 0 },
+  { date: '4/21', 嘉燃: 5, 嘉锦: 3, 其他: 0 },
+  { date: '4/22', 嘉燃: 7, 嘉锦: 3, 其他: 1 },
+  { date: '4/23', 嘉燃: 7, 嘉锦: 15, 其他: 7 },
+  { date: '4/24', 嘉燃: 9, 嘉锦: 14, 其他: 6 },
+  { date: '4/25', 嘉燃: 6, 嘉锦: 12, 其他: 4 },
+  { date: '4/26', 嘉燃: 6, 嘉锦: 13, 其他: 3 },
+  { date: '4/27', 嘉燃: 6, 嘉锦: 13, 其他: 3 },
+  { date: '4/28', 嘉燃: 7, 嘉锦: 13, 其他: 2 },
+  { date: '4/29', 嘉燃: 7, 嘉锦: 13, 其他: 2 },
+];
+
+export function EfficiencyView() {
+  return (
+    <div className="space-y-6 animate-in fade-in slide-in-from-bottom-4 duration-500">
+      <div className="bg-gradient-to-r from-indigo-50 to-blue-50 border border-indigo-100 rounded-xl p-5 flex items-start shadow-sm">
+        <div className="bg-indigo-100/80 p-2 rounded-lg mr-4 shrink-0">
+          <Radio className="w-5 h-5 text-indigo-600" />
+        </div>
+        <div>
+          <h4 className="text-sm font-bold text-indigo-900 flex items-center">
+            二期底层物联网 (IoT) 直连规划中
+            <span className="ml-3 px-2 py-0.5 rounded text-[10px] bg-indigo-200 text-indigo-800 font-bold tracking-wider">PHASE 2</span>
+          </h4>
+          <p className="text-sm text-indigo-700 mt-1.5 leading-relaxed">
+            目前系统已全面掌握<span className="font-semibold text-indigo-900 border-b border-indigo-200">「商流与信息流」</span>（在线预约单量与排班）。当前板块基于历史单量测算，呈现<b>算法预估负荷模型演示</b>。下阶段将重点打通<span className="font-semibold text-indigo-900 border-b border-indigo-200">「物理数据流」</span>，与加气机等底层硬件直连获取真实库存，彻底实现“数字孪生式”的加氢调配闭环。
+          </p>
+        </div>
+      </div>
+
+      <div className="grid grid-cols-1 md:grid-cols-4 gap-6">
+        <StatCard 
+          title="全网综合日均加注量预估" 
+          value="1,085 kg" 
+          subValue="主要覆盖嘉兴、南通等核心枢纽网的测算值"
+          icon={Activity} 
+          highlight
+        />
+        <StatCard 
+          title="全网各站总负荷上限满载" 
+          value="2,800 kg" 
+          subValue="所有加注站理论最高吞吐物理上限汇总"
+          icon={Zap} 
+        />
+        <StatCard 
+          title="系统优化全站有效工时" 
+          value="~4.5 小时" 
+          subValue="主要由预约时限测算出的无效排队节省时间"
+          icon={Clock} 
+          trend={-45}
+        />
+        <StatCard 
+          title="平均承载饱和度 (预估)" 
+          value="38.5 %" 
+          subValue="预留了充足的峰值缓冲池与调配拓展空间"
+          icon={Target} 
+        />
+      </div>
+
+      <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
+        <div className="bg-white rounded-xl border border-slate-100 p-6 shadow-sm">
+          <div className="flex justify-between items-center mb-6">
+            <div>
+              <h3 className="text-lg font-bold text-slate-800">主力站点日增单量趋势实况</h3>
+              <p className="text-sm text-slate-500 mt-1">此部分属于已打通的一期“信息流”真实数据展示</p>
+            </div>
+            <div className="flex bg-indigo-50 text-indigo-600 px-3 py-1.5 rounded-lg text-sm font-semibold items-center border border-indigo-100">
+              <TrendingUp className="w-4 h-4 mr-1.5" />
+              全线看涨
+            </div>
+          </div>
+          <div className="h-[300px] w-full">
+            <ResponsiveContainer width="100%" height="100%">
+              <AreaChart data={stationGrowth} margin={{ top: 10, right: 10, left: -25, bottom: 0 }}>
+                <defs>
+                  <linearGradient id="colorJr" x1="0" y1="0" x2="0" y2="1">
+                    <stop offset="5%" stopColor="#0ea5e9" stopOpacity={0.3}/>
+                    <stop offset="95%" stopColor="#0ea5e9" stopOpacity={0}/>
+                  </linearGradient>
+                  <linearGradient id="colorJj" x1="0" y1="0" x2="0" y2="1">
+                    <stop offset="5%" stopColor="#8b5cf6" stopOpacity={0.3}/>
+                    <stop offset="95%" stopColor="#8b5cf6" stopOpacity={0}/>
+                  </linearGradient>
+                </defs>
+                <XAxis dataKey="date" axisLine={false} tickLine={false} tick={{fill: '#64748b', fontSize: 12}} dy={10} />
+                <YAxis axisLine={false} tickLine={false} tick={{fill: '#64748b', fontSize: 12}} />
+                <CartesianGrid vertical={false} stroke="#f1f5f9" strokeDasharray="4 4" />
+                <Tooltip cursor={{stroke: '#cbd5e1', strokeWidth: 1, strokeDasharray: '4 4'}} contentStyle={{ borderRadius: '12px', border: 'none', boxShadow: '0 10px 15px -3px rgb(0 0 0 / 0.1)' }} />
+                <Legend verticalAlign="top" height={36} iconType="circle" wrapperStyle={{ fontSize: '12px' }} />
+                <Area type="monotone" dataKey="嘉燃" stackId="1" stroke="#0ea5e9" strokeWidth={2} fillOpacity={1} fill="url(#colorJr)" />
+                <Area type="monotone" dataKey="嘉锦" stackId="1" stroke="#8b5cf6" strokeWidth={2} fillOpacity={1} fill="url(#colorJj)" />
+                <Area type="monotone" dataKey="其他" stackId="1" stroke="#f59e0b" strokeWidth={2} fillOpacity={0.1} />
+              </AreaChart>
+            </ResponsiveContainer>
+          </div>
+        </div>
+
+        <div className="bg-white rounded-xl border border-slate-100 p-6 shadow-sm flex flex-col justify-between relative overflow-hidden">
+          <div className="absolute top-0 right-0 p-6 opacity-5 pointer-events-none">
+            <Zap className="w-32 h-32" />
+          </div>
+          <div className="mb-6 relative z-10">
+            <div className="flex flex-col xl:flex-row xl:justify-between xl:items-start gap-3">
+              <div>
+                <h3 className="text-lg font-bold text-slate-800">各站负荷吞吐预估模型 (kg)</h3>
+                <p className="text-sm text-slate-500 mt-1">数据按历史预约进行算法推演，演示智能匹配效果</p>
+              </div>
+              <span className="flex items-center text-[10px] lg:text-xs font-bold bg-amber-50 text-amber-600 px-2 py-1 rounded-md border border-amber-200 w-fit shrink-0">
+                <AlertCircle className="w-3 h-3 mr-1.5" />
+                IoT硬件直连筹备中
+              </span>
+            </div>
+          </div>
+          <div className="flex-1 min-h-[300px] relative z-10">
+            <ResponsiveContainer width="100%" height="100%">
+              <BarChart data={stationData} layout="vertical" margin={{ top: 0, right: 30, left: 20, bottom: 0 }}>
+                <XAxis type="number" hide />
+                <YAxis dataKey="name" type="category" axisLine={false} tickLine={false} tick={{fill: '#475569', fontSize: 12, fontWeight: 500}} width={80} />
+                <Tooltip cursor={{fill: '#f8fafc'}} contentStyle={{ borderRadius: '12px', border: '1px solid #e2e8f0', boxShadow: '0 4px 6px -1px rgb(0 0 0 / 0.05)' }}/>
+                <Legend verticalAlign="top" height={36} iconType="circle" wrapperStyle={{ fontSize: '12px' }} />
+                <Bar dataKey="消耗" stackId="a" fill="#4f46e5" radius={[0, 0, 0, 0]} barSize={24} name="当前消耗测算负荷" />
+                <Bar dataKey="剩余" stackId="a" fill="#e2e8f0" radius={[0, 4, 4, 0]} barSize={24} name="未饱和推演备用空间" />
+              </BarChart>
+            </ResponsiveContainer>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}