From 4b04958a2949f0d2359375a7dd965cda2a3ee208 Mon Sep 17 00:00:00 2001
From: Cxx0822 <1556464090@qq.com>
Date: Mon, 13 Oct 2025 23:22:15 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E5=A2=9E=E5=8A=A0=E7=8A=B6=E6=80=81?=
 =?UTF-8?q?=E5=AD=98=E5=82=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                    | 22 ++++++----------------
 src/components/HeroSection.vue | 17 ++++++-----------
 src/main.ts                    |  2 ++
 src/store/profile.ts           | 20 ++++++++++++++++++++
 4 files changed, 34 insertions(+), 27 deletions(-)
 create mode 100644 src/store/profile.ts

diff --git a/src/App.vue b/src/App.vue
index 5e59f7c..acbdd5b 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -8,7 +8,6 @@
 
     <!-- 英雄区域 -->
     <HeroSection
-        :personal-info="personalInfo"
         @scroll-to-section="scrollToSection"
     ></HeroSection>
 
@@ -33,13 +32,13 @@
     <!-- 联系方式 -->
     <ContactSection
         :contact-info="contactInfo"
-        :social-links="personalInfo.socials"
+        :social-links="profileStore.personalInfo.socials"
         section-id="contact"
     ></ContactSection>
 
     <!-- 页脚 -->
     <Footer
-        :name="personalInfo.name"
+        :name="profileStore.personalInfo.name"
     ></Footer>
   </div>
 </template>
@@ -54,6 +53,10 @@ import EducationSection from './components/EducationSection.vue'
 import ContactSection from './components/ContactSection.vue'
 import Footer from './components/Footer.vue'
 
+import { useProfileStore } from '@/store/profile.js'
+
+const profileStore = useProfileStore()
+
 // 滚动位置
 const scrollPosition = ref(0)
 
@@ -78,19 +81,6 @@ const scrollToSection = (sectionId) => {
   }
 }
 
-// 个人信息数据
-const personalInfo = {
-  name: '陈修翔',
-  title: '全栈工程师',
-  description: '拥有5年前端开发经验，专注于构建响应式、高性能的现代Web应用，精通JavaScript、React和Vue等前端技术栈。',
-  socials: [
-    { name: 'GitHub', icon: 'fa-brands fa-github', url: '#' },
-    { name: 'LinkedIn', icon: 'fa-brands fa-linkedin', url: '#' },
-    { name: 'Twitter', icon: 'fa-brands fa-twitter', url: '#' },
-    { name: 'Email', icon: 'fa-solid fa-envelope', url: '#' }
-  ]
-}
-
 // 技能数据
 const skills = [
   {
diff --git a/src/components/HeroSection.vue b/src/components/HeroSection.vue
index f713995..78074f8 100644
--- a/src/components/HeroSection.vue
+++ b/src/components/HeroSection.vue
@@ -10,14 +10,15 @@
 
         <div class="hero-info animate__animated animate__fadeIn animate__delay-300">
           <h1>
-            {{ personalInfo.name }} <span class="title-highlight">/ {{ personalInfo.title }}</span>
+            {{ profileStore.personalInfo.name }}
+            <span class="title-highlight">/ {{ profileStore.personalInfo.title }}</span>
           </h1>
-          <p class="description">{{ personalInfo.description }}</p>
+          <p class="description">{{ profileStore.personalInfo.description }}</p>
 
           <!-- 社交媒体链接 -->
           <div class="social-links">
             <a
-              v-for="(social, index) in personalInfo.socials"
+              v-for="(social, index) in profileStore.personalInfo.socials"
               :key="index"
               :href="social.url"
               :title="social.name"
@@ -52,16 +53,10 @@
 </template>
 
 <script setup>
-import { defineProps } from 'vue'
 import { getAssetsImageFile } from '@/utils/index.js'
+import { useProfileStore } from '@/store/profile.js'
 
-// 接收个人信息属性
-const props = defineProps({
-  personalInfo: {
-    type: Object,
-    required: true
-  }
-})
+const profileStore = useProfileStore()
 
 // 定义事件
 const emits = defineEmits(['scroll-to-section'])
diff --git a/src/main.ts b/src/main.ts
index f00a8ea..1d36201 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,4 +1,5 @@
 import { createApp } from 'vue'
+import { createPinia } from 'pinia'
 import App from './App.vue'
 
 // 引入element-ui组件
@@ -16,6 +17,7 @@ import 'animate.css'
 
 // 创建Vue3实例
 const app = createApp(App)
+app.use(createPinia())
 // 使用Element UI Plus
 app.use(ElementPlus, { locale: zhCn })
 // 挂载到根组件上
diff --git a/src/store/profile.ts b/src/store/profile.ts
new file mode 100644
index 0000000..b2292be
--- /dev/null
+++ b/src/store/profile.ts
@@ -0,0 +1,20 @@
+import { defineStore } from 'pinia'
+
+export const useProfileStore = defineStore('profile', {
+  state: () => ({
+    personalInfo: {
+      name: '陈修翔',
+      title: '全栈工程师',
+      description: '拥有5年前端开发经验，专注于构建响应式、高性能的现代Web应用，精通JavaScript、React和Vue等前端技术栈。',
+      socials: [
+        { name: 'GitHub', icon: 'fa-brands fa-github', url: '#' },
+        { name: 'LinkedIn', icon: 'fa-brands fa-linkedin', url: '#' },
+        { name: 'Twitter', icon: 'fa-brands fa-twitter', url: '#' },
+        { name: 'Email', icon: 'fa-solid fa-envelope', url: '#' }
+      ]
+    }
+  }),
+  actions: {
+
+  }
+})