Page MenuHomec4science
Files F72614308

AssetListView.vue
No OneTemporary
Actions

File Metadata

Created
Tue, Jul 16, 04:49

AssetListView.vue
View Options

<script setup>
import { ref } from 'vue';
import { useRouter } from 'vue-router';
import { useSoundAssetStore, use2DAssetStore, use3DAssetStore } from '../stores';
import ElemList from '../components/ElemList.vue';
import ElemTypeToggle from '../components/ElemTypeToggle.vue';
const asset2DStore = use2DAssetStore();
const asset3DStore = use3DAssetStore();
const soundAssetStore = useSoundAssetStore();
await asset2DStore.fetch();
await asset3DStore.fetch();
await soundAssetStore.fetch();
const router = useRouter();
const translateIsVideo = (id) =>
asset2DStore.state.find(v => v.id === id).isVideo ? 'oui': 'non';
const translateType = (id) => {
switch (asset3DStore.state.find(v => v.id === id).type) {
case 'full':
return 'asset libre';
case 'partial':
return 'asset liée';
default:
return 'habillage de scène';
}
};
const edit = async ({ id }) => await router.push(`/assets/${type.value}/${id}/edit`);
const type = ref();
const onTypeChange = (n) => {
router.push(router.currentRoute.value.path.replace(type.value, n));
type.value = n;
};
</script>
<template>
<v-container>
<v-row>
<ElemTypeToggle
:types="[
{ name: 'Asset sonore', value: 'sound' },
{ name: 'Asset 2D', value: '2d' },
{ name: 'Asset 3D', value: '3d' },
]"
@on-type-change="onTypeChange"
/>
</v-row>
<v-row>
<ElemList
v-if="type === 'sound'"
:elems="soundAssetStore.state"
readonly-prop="description"
:elem-props="[
{ header: 'Nom', prop: 'name'},
{ header: 'Chemin', prop: 'path'}
]"
:deleteFunc="soundAssetStore.remove"
:editFunc="edit"
#="{ elem: { description } }"
>{{ description }}</ElemList>
<ElemList
v-if="type === '2d'"
:elems="asset2DStore.state"
readonly-prop="description"
:elem-props="[
{ header: 'Nom', prop: 'name' },
{ header: 'Chemin', prop: 'path' },
{ header: 'Video ?', getter: translateIsVideo }
]"
thumbnail-prop="thumbnail"
:deleteFunc="asset2DStore.remove"
:editFunc="edit"
#="{ elem: { description } }"
>{{ description }}</ElemList>
<ElemList
v-if="type === '3d'"
:elems="asset3DStore.state"
readonly-prop="description"
:elem-props="[
{ header: 'Nom', prop: 'name'},
{ header: 'Chemin de l\'assetBundle', prop: 'assetBundle'},
{ header: 'Nom du prefab', prop: 'prefabName'},
{ header: 'Type', getter: translateType }
]"
thumbnail-prop="thumbnail"
:deleteFunc="asset3DStore.remove"
:editFunc="edit"
#="{ elem: { description } }"
>{{ description }}</ElemList>
<v-row class="my-8" justify="center">
<v-btn :to="`/assets/${type}/add`">Ajouter</v-btn>
</v-row>
</v-row>
</v-container>
</template>

Event Timeline

c4science · Help