添加持久化存储和数据配置优化

- 将实验数据抽离到独立配置文件 (src/data/experiments.js)
- 添加 localStorage 持久化存储功能
- 实现拖拽排序结果的自动保存和加载
- 页面刷新后保持用户自定义的排序顺序
- 添加完善的错误处理和注释

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

src/data/experiments.js

@@ -0,0 +1,75 @@
+import { Thermometer, Gauge, Radio, Zap, Droplets } from 'lucide-react';
+
+export const defaultExperiments = [
+  {
+    id: '1',
+    name: '温度传感器实验',
+    icon: Thermometer,
+    description: '学习温度传感器的工作原理及应用',
+  },
+  {
+    id: '2',
+    name: '压力传感器实验',
+    icon: Gauge,
+    description: '了解压力传感器的测量原理与特性',
+  },
+  {
+    id: '3',
+    name: '位移传感器实验',
+    icon: Radio,
+    description: '掌握位移传感器的检测方法',
+  },
+  {
+    id: '4',
+    name: '光电传感器实验',
+    icon: Zap,
+    description: '探索光电传感器的光电转换原理',
+  },
+  {
+    id: '5',
+    name: '湿度传感器实验',
+    icon: Droplets,
+    description: '研究湿度传感器的测量技术',
+  },
+];
+
+// localStorage 相关的工具函数
+const STORAGE_KEY = 'sensor-lab-experiments';
+
+/**
+ * 从 localStorage 加载实验数据
+ * @returns {Array} 返回保存的实验顺序，如果没有保存则返回 null
+ */
+export const loadExperimentsFromStorage = () => {
+  try {
+    const stored = localStorage.getItem(STORAGE_KEY);
+    if (stored) {
+      const storedIds = JSON.parse(stored);
+      // 根据保存的 ID 顺序重新排列实验数据
+      const orderedExperiments = storedIds
+        .map((id) => defaultExperiments.find((exp) => exp.id === id))
+        .filter(Boolean); // 过滤掉可能不存在的项目
+
+      // 如果顺序数量匹配，返回排序后的数据
+      if (orderedExperiments.length === defaultExperiments.length) {
+        return orderedExperiments;
+      }
+    }
+  } catch (error) {
+    console.error('加载实验数据失败:', error);
+  }
+  return null;
+};
+
+/**
+ * 保存实验数据到 localStorage
+ * @param {Array} experiments - 实验数据数组
+ */
+export const saveExperimentsToStorage = (experiments) => {
+  try {
+    const ids = experiments.map((exp) => exp.id);
+    localStorage.setItem(STORAGE_KEY, JSON.stringify(ids));
+  } catch (error) {
+    console.error('保存实验数据失败:', error);
+  }
+};