modal
This commit is contained in:
commit
a138a63529
|
@ -4,6 +4,7 @@ import type { ralTypes } from '@/components/ral'
|
|||
|
||||
const config = useRuntimeConfig()
|
||||
const apiBase = config.public.apiBase
|
||||
const { data: calculatorData } = await useFetch(`${apiBase}/calculator/5/`)
|
||||
|
||||
const isModalOpen = useState('modal_open', () => false)
|
||||
|
||||
|
@ -85,6 +86,26 @@ const submit = (e: any) => {
|
|||
modal_data.name = undefined
|
||||
isModalOpen.value = false
|
||||
}
|
||||
const roubleSign = new Intl.NumberFormat('ru-RU', {
|
||||
style: 'currency',
|
||||
currency: 'RUB',
|
||||
});
|
||||
const total = computed(() => {
|
||||
const { mortgage, pillar, lamella } = calculatorData.value
|
||||
const pillar_count = (section_count.value + 1)
|
||||
const pil = (parseFloat(mortgage) + parseFloat(pillar)) * pillar_count
|
||||
|
||||
const lam_count = lamelles_count.value * section_count.value
|
||||
const lam = lam_count * lamella
|
||||
|
||||
const top_count = section_count.value
|
||||
const top = top_count * lamella
|
||||
return [
|
||||
`Столб, ${pillar_count}: ${roubleSign.format(pil)}`,
|
||||
`Ламели, ${lam_count}: ${roubleSign.format(lam)}`,
|
||||
`Верхняя планка, ${top_count}: ${roubleSign.format(top)}`,
|
||||
]
|
||||
})
|
||||
</script>
|
||||
<template>
|
||||
<div v-if="isModalOpen" class="modal-backdrop" @click.self="toggleModal">
|
||||
|
@ -104,6 +125,7 @@ const submit = (e: any) => {
|
|||
<template v-else>
|
||||
<h2>данные расчета</h2>
|
||||
<div class="flex gap-4 flex-col mb-4">
|
||||
<<<<<<< HEAD
|
||||
<div>
|
||||
Ламелей в одной секции: {{ lamelles_count }}
|
||||
</div>
|
||||
|
@ -124,6 +146,17 @@ const submit = (e: any) => {
|
|||
<div>
|
||||
Цвет ламелей: {{ getColorNameFromRal(lamelle_color) }}
|
||||
</div>
|
||||
=======
|
||||
<p>Ламелей: {{ lamelles_count }}<br />
|
||||
Длина секции: {{ fence_section * 1000 }}<br />
|
||||
Общая длина: {{ total_length }}<br />
|
||||
Секций: {{ section_count }}<br />
|
||||
Цвет столба: {{ getColorNameFromRal(pillar_color) }}<br />
|
||||
Цвет ламелей: {{ getColorNameFromRal(lamelle_color) }}</p>
|
||||
<p>
|
||||
<template v-for="i in total">{{ i }}<br /></template>
|
||||
</p>
|
||||
>>>>>>> ba62bb0ffa821cda603bdee91922c79da69d166d
|
||||
</div>
|
||||
<div class="flex gap-4">
|
||||
<button class="not-prose" @click="openForm">Данные верны</button>
|
||||
|
|
|
@ -38,7 +38,6 @@ const { scene: top } = await useGLTF('/models_one/verh_100.glb')
|
|||
const { scene: fence } = await useGLTF('/models_one/fence.glb')
|
||||
const { scene: fastening } = await useGLTF('/models_one/krepleniye_planok (1).glb')
|
||||
const { scene: lamelle } = await useGLTF('/models_one/lamel_100.glb')
|
||||
const { scene: back_light } = await useGLTF('/models_light/back_light.glb')
|
||||
|
||||
const { seek, seekAll } = useSeek()
|
||||
watch(section_count, () => {
|
||||
|
@ -82,7 +81,6 @@ ctx.fillRect(10, 10, 512, 512)
|
|||
console.log(canvas.toDataURL())
|
||||
const texture = new DataTexture(ctx?.getImageData(0, 0, 512, 512).data.buffer, width, height);
|
||||
texture.needsUpdate = true;
|
||||
console.log(back_light)
|
||||
</script>
|
||||
<template>
|
||||
<TresGroup :translate-y="-3.25" name="base">
|
||||
|
@ -107,7 +105,6 @@ console.log(back_light)
|
|||
<TresBoxGeometry :args="[1, 1, 1]" />
|
||||
<TresMeshStandardMaterial :map="texture_one" />
|
||||
</TresMesh>
|
||||
<TresDirectionalLight v-bind="back_light"/>
|
||||
<template v-for="i in section_count">
|
||||
<template v-if="i <= 20">
|
||||
<ModelFence :index="i" :models="{ top, fence, fastening, lamelle }" />
|
||||
|
|
Loading…
Reference in New Issue