From a4cf43b88ad8be92c2e8ddd0d98cabfdf2f3790e Mon Sep 17 00:00:00 2001
From: Yu Sung <hwchon1234@gmail.com>
Date: Thu, 18 Sep 2025 20:04:20 +0900
Subject: [PATCH] =?UTF-8?q?feat(character-list):=20=EC=BA=90=EB=A6=AD?=
 =?UTF-8?q?=ED=84=B0=20=EB=A6=AC=EC=8A=A4=ED=8A=B8=20=ED=8E=98=EC=9D=B4?=
 =?UTF-8?q?=EC=A7=80=20=EA=B2=80=EC=83=89=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/character.js             | 10 +++++++-
 src/views/Chat/CharacterList.vue | 40 ++++++++++++++++++++++++++++----
 2 files changed, 45 insertions(+), 5 deletions(-)

diff --git a/src/api/character.js b/src/api/character.js
index 9986da2..394c923 100644
--- a/src/api/character.js
+++ b/src/api/character.js
@@ -7,13 +7,20 @@ async function getCharacterList(page = 1, size = 20) {
   })
 }
 
-// 캐릭터 검색
+// 캐릭터 검색 (배너용 기존 함수)
 async function searchCharacters(searchTerm, page = 1, size = 20) {
   return Vue.axios.get('/admin/chat/banner/search-character', {
     params: { searchTerm, page: page - 1, size }
   })
 }
 
+// 캐릭터 리스트 검색 (요구사항: /admin/chat/character/search)
+async function searchCharacterList(searchTerm, page = 1, size = 20) {
+  return Vue.axios.get('/admin/chat/character/search', {
+    params: { searchTerm, page: page - 1, size }
+  })
+}
+
 // 캐릭터 상세 조회
 async function getCharacter(id) {
   return Vue.axios.get(`/admin/chat/character/${id}`)
@@ -257,6 +264,7 @@ async function getCharacterCalculateList({ startDateStr, endDateStr, sort = 'TOT
 export {
   getCharacterList,
   searchCharacters,
+  searchCharacterList,
   getCharacter,
   createCharacter,
   updateCharacter,
diff --git a/src/views/Chat/CharacterList.vue b/src/views/Chat/CharacterList.vue
index 31f872d..117c5c4 100644
--- a/src/views/Chat/CharacterList.vue
+++ b/src/views/Chat/CharacterList.vue
@@ -9,7 +9,7 @@
     <br>
 
     <v-container>
-      <v-row>
+      <v-row align="center">
         <v-col cols="4">
           <v-btn
             color="primary"
@@ -19,6 +19,29 @@
             캐릭터 추가
           </v-btn>
         </v-col>
+        <v-col
+          cols="8"
+          class="d-flex justify-end align-center"
+        >
+          <v-text-field
+            v-model="searchTerm"
+            label="검색어"
+            placeholder="캐릭터명, 태그, mbti 검색"
+            outlined
+            dense
+            hide-details
+            style="max-width: 320px;"
+            class="mr-2"
+            @keyup.enter="onSearch"
+          />
+          <v-btn
+            :style="{ backgroundColor: '#3bb9f1', color: 'white' }"
+            :disabled="is_loading"
+            @click="onSearch"
+          >
+            검색
+          </v-btn>
+        </v-col>
       </v-row>
       <v-row>
         <v-col>
@@ -244,7 +267,7 @@
 </template>
 
 <script>
-import { getCharacterList, updateCharacter } from '@/api/character'
+import { getCharacterList, updateCharacter, searchCharacterList } from '@/api/character'
 
 export default {
   name: "CharacterList",
@@ -260,7 +283,8 @@ export default {
       page: 1,
       total_page: 0,
       characters: [],
-      selected_character: {}
+      selected_character: {},
+      searchTerm: ''
     }
   },
 
@@ -369,10 +393,18 @@ export default {
       await this.getCharacters()
     },
 
+    onSearch() {
+      this.page = 1;
+      this.getCharacters();
+    },
+
     async getCharacters() {
       this.is_loading = true
       try {
-        const response = await getCharacterList(this.page);
+        const hasSearch = this.searchTerm && this.searchTerm.trim() !== '';
+        const response = hasSearch
+          ? await searchCharacterList(this.searchTerm.trim(), this.page, 20)
+          : await getCharacterList(this.page);
 
         if (response && response.status === 200) {
           if (response.data.success === true) {