51 lines
1.7 KiB
Vue
51 lines
1.7 KiB
Vue
<template>
|
|
<slot name="activator" v-bind="activatorProps" @click="dialog = !dialog"></slot>
|
|
<v-dialog transition="dialog-bottom-transition" fullscreen v-model="dialog">
|
|
<v-container>
|
|
<v-row>
|
|
<v-col v-for="(v, i) in items" :key="i" cols="12" xs="6" sm="4" md="3" xl="2" class="position-relative">
|
|
<v-img :src="`/asset/thumb/${v.asset?.thumb}`" @click="select(v.id)"></v-img>
|
|
<div class="d-flex">
|
|
<span class="flex-grow-1">{{ v.name }}</span>
|
|
<v-icon color="primary" size="x-large" class="position-absolute top-0 left-0 ma-6">mdi-{{ $p.objectTypes.find(t=>t.value == v.type).icon }}</v-icon>
|
|
<!-- <v-btn density="compact" variant="text" icon="mdi-pencil-outline" :to="`/game-objects/${v.id}`" color="primary"></v-btn> -->
|
|
</div>
|
|
</v-col>
|
|
</v-row>
|
|
</v-container>
|
|
</v-dialog>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
export default {
|
|
props:[
|
|
'modelValue', 'type'
|
|
],
|
|
emits:['select'],
|
|
data(){
|
|
return {
|
|
items: [],
|
|
activatorProps:{},
|
|
dialog: false
|
|
}
|
|
},
|
|
|
|
mounted(){
|
|
console.log(this.activatorProps, this.cls)
|
|
},
|
|
|
|
async created(){
|
|
this.items = (await this.$api.gameObject.search({
|
|
type: { $in: this.$p.objectTypes.filter(t=>t.type == this.type || !this.type).map(t=>t.value) }
|
|
})).data.data
|
|
},
|
|
|
|
methods:{
|
|
select(id){
|
|
this.$emit('select', id);
|
|
this.dialog = false;
|
|
}
|
|
}
|
|
}
|
|
</script> |