所有页面的语法改写为setup形式；

修改了Header组件的样式、布局；
更新了IFLOW上下文；
添加了全局样式；
添加了pinia状态管理；

src/pages/SettingsPage.vue

@@ -79,78 +79,64 @@
   </ion-page>
 </template>
 
-<script>
-import { useAppData } from '../utils/AppDataContext';
+<script setup>
+import { computed, onMounted } from 'vue';
+import { useAppStore } from '../stores/useAppStore';
 import Header from '../components/Header.vue';
 
-export default {
-  name: 'SettingsPage',
-  components: {
-    Header
-  },
-  setup() {
-    const { state, updateSettings } = useAppData();
-    
-    const toggleCloudSync = () => {
-      updateSettings({ cloudSync: !state.settings.cloudSync });
-    };
-    
-    const toggleDarkMode = () => {
-      updateSettings({ darkMode: !state.settings.darkMode });
-    };
-    
-    const handleLogin = () => {
-      // In a full implementation, this would open a login screen
-      console.log('Login to cloud');
-    };
-    
-    const handlePrivacyPolicy = () => {
-      // In a full implementation, this would show the privacy policy
-      console.log('Privacy policy');
-    };
-    
-    const handleTermsOfService = () => {
-      // In a full implementation, this would show the terms of service
-      console.log('Terms of service');
-    };
-    
-    const handleBackup = () => {
-      // In a full implementation, this would backup notes
-      console.log('Backup notes');
-    };
-    
-    const handleRestore = () => {
-      // In a full implementation, this would restore notes
-      console.log('Restore notes');
-    };
-    
-    const handleExport = () => {
-      // In a full implementation, this would export notes
-      console.log('Export notes');
-    };
-    
-    const handleImport = () => {
-      // In a full implementation, this would import notes
-      console.log('Import notes');
-    };
-    
-    const handleBackPress = () => {
-      window.history.back();
-    };
-    
-    return {
-      settings: state.settings,
-      toggleCloudSync,
-      toggleDarkMode,
-      handleLogin,
-      handlePrivacyPolicy,
-      handleTermsOfService,
-      handleBackup,
-      handleRestore,
-      handleExport,
-      handleImport,
-      handleBackPress
-    };
-  }
+const store = useAppStore();
+
+// 加载初始数据
+onMounted(() => {
+  store.loadData();
+});
+
+const toggleCloudSync = () => {
+  store.toggleCloudSync();
 };
+
+const toggleDarkMode = () => {
+  store.toggleDarkMode();
+};
+
+const handleLogin = () => {
+  // In a full implementation, this would open a login screen
+  console.log('Login to cloud');
+};
+
+const handlePrivacyPolicy = () => {
+  // In a full implementation, this would show the privacy policy
+  console.log('Privacy policy');
+};
+
+const handleTermsOfService = () => {
+  // In a full implementation, this would show the terms of service
+  console.log('Terms of service');
+};
+
+const handleBackup = () => {
+  // In a full implementation, this would backup notes
+  console.log('Backup notes');
+};
+
+const handleRestore = () => {
+  // In a full implementation, this would restore notes
+  console.log('Restore notes');
+};
+
+const handleExport = () => {
+  // In a full implementation, this would export notes
+  console.log('Export notes');
+};
+
+const handleImport = () => {
+  // In a full implementation, this would import notes
+  console.log('Import notes');
+};
+
+const handleBackPress = () => {
+  window.history.back();
+};
+
+const settings = computed(() => store.settings);
 </script>