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,

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) {