refactor: nest data inside instead

This will make it easy to integrate something into item in the list.
This commit is contained in:
Methapon2001 2024-12-20 11:46:10 +07:00 committed by Thanaphon Frappet
parent d210592589
commit 02f2216d6b

View file

@ -112,25 +112,25 @@ watch(() => state.search, getList);
<slot name="empty" :data="{ notFound: !!state.search }" /> <slot name="empty" :data="{ notFound: !!state.search }" />
</div> </div>
<div <div
:key="item.id" :key="item.data.id"
v-for="(item, index) in list.map((data) => ({ v-for="(item, index) in list.map((data) => ({
...data, data: data,
_selectedIndex: selectedIndex(data), selectedIndex: selectedIndex(data),
}))" }))"
class="col-2" class="col-2"
> >
<button <button
class="selectable-item full-width" class="selectable-item full-width"
:class="{ :class="{
['selectable-item__selected']: item._selectedIndex !== -1, ['selectable-item__selected']: item.selectedIndex !== -1,
['selectable-item__disabled']: disabledItemId?.some( ['selectable-item__disabled']: disabledItemId?.some(
(id) => id === item.id, (id) => id === item.data.id,
), ),
}" }"
@click="toggleSelect(item)" @click="toggleSelect(item.data)"
> >
<span class="selectable-item__pos" v-if="!orderHidden"> <span class="selectable-item__pos" v-if="!orderHidden">
{{ item._selectedIndex + 1 }} {{ item.selectedIndex + 1 }}
</span> </span>
<slot name="card" :data="{ index, item }" /> <slot name="card" :data="{ index, item }" />
</button> </button>