40 lines
1.4 KiB
Vue
40 lines
1.4 KiB
Vue
<template>
|
|
<div v-if="modelValue.go">
|
|
<v-text-field hide-details density="compact" v-model="modelValue.q" class="pb-2" label="Question" icon-color="blue" prepend-icon="mdi-chat-question-outline"></v-text-field>
|
|
<v-text-field hide-details density="compact" v-model="modelValue.a[0]" class="pb-2" label="Correct answer" icon-color="success" prepend-icon="mdi-check"></v-text-field>
|
|
<v-text-field v-for="i in 4" :key="i" hide-details density="compact" v-model="modelValue.a[i]"
|
|
v-show="modelValue.a[i-1]" class="pb-2" :label="`Wrong answer #${i}`" icon-color="error"
|
|
prepend-icon="mdi-close"></v-text-field>
|
|
<v-img :src="`/asset/thumb/${modelValue.go}.webp`" />
|
|
<div class="text-caption text-center">{{ modelValue.title }}</div>
|
|
</div>
|
|
<asset-selector @select="assignTexture" :type="['Texture']">
|
|
<template v-slot:activator="props">
|
|
<v-btn v-bind="props" prepend-icon="mdi-cube-outline" color="deep-orange-darken-4" block>Choose object</v-btn>
|
|
</template>
|
|
</asset-selector>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
export default {
|
|
data(){
|
|
return {
|
|
active: false
|
|
}
|
|
},
|
|
mounted(){
|
|
this.active = true;
|
|
},
|
|
props:{
|
|
modelValue: Object
|
|
},
|
|
methods:{
|
|
assignTexture(e){
|
|
this.modelValue.go = e.id;
|
|
this.modelValue.title = e.name
|
|
this.modelValue.a = [];
|
|
}
|
|
}
|
|
}
|
|
</script> |