fix(admin-can): 닉네임 검색 시 선택 칩이 사라지는 문제 수정

- v-autocomplete에 cache-items 적용으로 선택 항목 캐시 유지
- value-comparator를 id 기반(compareMember)으로 지정해 동등성 안정화
- items를 displaySearchItems(선택 ∪ 검색 목록)로 제공해 선택 항목 항상 포함 보장
This commit is contained in:
Yu Sung
2025-11-10 16:32:26 +09:00
parent 1e8dd57eec
commit d1fedb151a

View File

@@ -10,7 +10,7 @@
<v-container>
<v-autocomplete
v-model="selectedMembers"
:items="searchItems"
:items="displaySearchItems"
:loading="searchLoading"
:search-input.sync="searchQuery"
label="닉네임으로 사용자 검색 (여러 명 선택 가능)"
@@ -21,6 +21,8 @@
small-chips
clearable
outlined
cache-items
:value-comparator="compareMember"
@update:search-input="onSearch"
/>
@@ -140,6 +142,23 @@ export default {
names.push(...manualIds.map(String))
}
return names
},
// 검색 결과 목록에 현재 선택된 사용자들을 항상 포함시켜
// 선택 chip이 사라지지 않도록 보장
displaySearchItems() {
const map = new Map()
;(this.selectedMembers || []).forEach(m => {
if (m && (m.id !== undefined && m.id !== null)) {
map.set(String(m.id), m)
}
})
;(this.searchItems || []).forEach(m => {
if (m && (m.id !== undefined && m.id !== null)) {
const key = String(m.id)
if (!map.has(key)) map.set(key, m)
}
})
return Array.from(map.values())
}
},
@@ -159,6 +178,16 @@ export default {
this.$dialog.notify.success(message)
},
// v-autocomplete의 선택 비교를 id 기준으로 수행
compareMember(a, b) {
if (a === b) return true
if (!a || !b) return false
const aid = typeof a === 'object' ? a.id : a
const bid = typeof b === 'object' ? b.id : b
if (aid === undefined || bid === undefined || aid === null || bid === null) return false
return String(aid) === String(bid)
},
onSearch(val) {
this.searchQuery = val