This commit is contained in:
Kseninia Mikhaylova 2024-06-11 16:45:51 +03:00
parent 72d7fd4dbc
commit 43e796e612
4 changed files with 22 additions and 16 deletions

View File

@ -11,20 +11,10 @@ const controlsState = reactive({
// maxZoom: 2,
// minZoom: 1,
})
const { hasFinishLoading, progress, items } = await useProgress()
</script>
<template>
<div class="container min-w-full relative">
<Transition name="fade-overlay" enter-active-class="opacity-1 transition-opacity duration-200"
leave-active-class="opacity-0 transition-opacity duration-200">
<div v-show="!hasFinishLoading"
class="absolute bg-neutral-600 t-0 l-0 w-full h-full z-20 flex justify-center items-center text-black font-mono">
<div class="w-200px">
Идет загрузка... {{ progress }} %
<i class="i-ic-twotone-catching-pokemon animate-rotate-in"></i>
</div>
</div>
</Transition>
<Loader />
<TresCanvas shadows>
<TresPerspectiveCamera :position="[8, 2, -4]" />
<OrbitControls v-bind="controlsState" make-default />

View File

@ -183,9 +183,9 @@ const toggleModal = () => {
<textarea id="calculation" disabled class="w-full">{{ calc_text }}</textarea>
</div>
</div>
<p>
<button @click="toggleModal">Купить прямо сейчас</button>
</p>
<div class="form-row justify-center">
<button @click.prevent="toggleModal">Купить прямо сейчас</button>
</div>
</form>
</div>
</template>

View File

@ -42,11 +42,11 @@ const targetExplosion = useState('targetExplosion', () => {
<input type="number" v-for="(item, n) in value" v-model="targetExplosion[key][n]" step="0.25">
</div>
</template>
<TresCanvas shadows>
<TresCanvas preset="realistic">
<TresPerspectiveCamera :position="[-7, 2, 4]" />
<OrbitControls v-bind="controlsState" make-default />
<Suspense>
<Environment files='/hdrmaps/kiara_1_dawn_4k.hdr' :background="true" />
<Environment files='/hdrmaps/kiara_1_dawn_4k.hdr' :background="false" />
</Suspense>
<ModelDiagram />

16
components/loader.vue Normal file
View File

@ -0,0 +1,16 @@
<script setup lang="ts">
const { hasFinishLoading, progress, items } = await useProgress()
console.log(progress)
</script>
<template>
<Transition name="fade-overlay" enter-active-class="opacity-1 transition-opacity duration-200"
leave-active-class="opacity-0 transition-opacity duration-200">
<div v-show="!hasFinishLoading"
class="absolute bg-neutral-600 t-0 l-0 w-full h-full z-20 flex justify-center items-center text-black font-mono">
<div class="w-200px">
Идет загрузка... {{ progress }} %
<i class="i-ic-twotone-catching-pokemon animate-rotate-in"></i>
</div>
</div>
</Transition>
</template>