diff --git a/src/assets/images/linkPrediction/title/graph-title.png b/src/assets/images/linkPrediction/title/graph-title.png
deleted file mode 100644
index c30de30..0000000
Binary files a/src/assets/images/linkPrediction/title/graph-title.png and /dev/null differ
diff --git a/src/assets/images/linkPrediction/title/pre-title.png b/src/assets/images/linkPrediction/title/pre-title.png
deleted file mode 100644
index b1eec9e..0000000
Binary files a/src/assets/images/linkPrediction/title/pre-title.png and /dev/null differ
diff --git a/src/assets/images/linkPrediction/title/show-title.png b/src/assets/images/linkPrediction/title/show-title.png
deleted file mode 100644
index 391f6d5..0000000
Binary files a/src/assets/images/linkPrediction/title/show-title.png and /dev/null differ
diff --git a/src/assets/images/linkPrediction/title/strength-title.png b/src/assets/images/linkPrediction/title/strength-title.png
deleted file mode 100644
index 1e2bd47..0000000
Binary files a/src/assets/images/linkPrediction/title/strength-title.png and /dev/null differ
diff --git a/src/assets/images/linkPrediction/title/user-title.png b/src/assets/images/linkPrediction/title/user-title.png
new file mode 100644
index 0000000..43eae78
Binary files /dev/null and b/src/assets/images/linkPrediction/title/user-title.png differ
diff --git a/src/store/llinkPrediction/index.js b/src/store/llinkPrediction/index.js
index 8417106..c4b69cb 100644
--- a/src/store/llinkPrediction/index.js
+++ b/src/store/llinkPrediction/index.js
@@ -3,5 +3,5 @@ import { defineStore } from "pinia";
 export const useCharacterInteractionStore = defineStore("characterInteraction", {
   state: () => ({}),
   actions: {},
-  persist: false // 开启持久化
+  persist: true // 开启持久化
 });
diff --git a/src/views/LinkPrediction/characterInteraction/index.vue b/src/views/LinkPrediction/characterInteraction/index.vue
index b043a38..1e4ec3f 100644
--- a/src/views/LinkPrediction/characterInteraction/index.vue
+++ b/src/views/LinkPrediction/characterInteraction/index.vue
@@ -3,7 +3,9 @@
     <div class="top-container"></div>
     <div class="content">
       <div class="left-container">
-        <div class="userPanel"></div>
+        <div class="userPanel">
+          <UserPanel :title="userPanelTitleImg"></UserPanel>
+        </div>
         <div class="userChart"></div>
       </div>
       <div class="middle-container">
@@ -19,7 +21,9 @@
 </template>
 
 <script setup>
+import UserPanel from "../components/userPanel.vue";
 import { useCharacterInteractionStore } from "@/store/llinkPrediction/index";
+import userPanelTitleImg from "@/assets/images/linkPrediction/title/user-title.png";
 const interactionStore = useCharacterInteractionStore();
 </script>
 
diff --git a/src/views/LinkPrediction/components/userPanel.vue b/src/views/LinkPrediction/components/userPanel.vue
index d5ea7a3..0880b9f 100644
--- a/src/views/LinkPrediction/components/userPanel.vue
+++ b/src/views/LinkPrediction/components/userPanel.vue
@@ -1,7 +1,31 @@
 <template>
-  <div class="userPanel-component"></div>
+  <div class="userPanel-component">
+    <img :src="title" alt="" class="title" />
+  </div>
 </template>
 
-<script setup></script>
+<script setup>
+import { defineProps } from "vue";
 
-<style scoped lang="less"></style>
+const props = defineProps({
+  userList: {
+    type: Array,
+    default: []
+  },
+  title: {
+    type: String,
+    default: ""
+  }
+});
+</script>
+
+<style scoped lang="less">
+.userPanel-component {
+  width: 100%;
+  height: 100%;
+  .title {
+    margin-top: -7px;
+    margin-left: -2px;
+  }
+}
+</style>