dev #90
|
@ -16,7 +16,6 @@ const pillar_pattern = use_pattern()
|
||||||
const pillar_topper = use_topper()
|
const pillar_topper = use_topper()
|
||||||
const lamelle_color = use_lamelle_color()
|
const lamelle_color = use_lamelle_color()
|
||||||
|
|
||||||
const lSize = lamelle_height.value
|
|
||||||
const pillar_size = 104 * 0.001
|
const pillar_size = 104 * 0.001
|
||||||
|
|
||||||
const pillar_one_pos = ref()
|
const pillar_one_pos = ref()
|
||||||
|
@ -80,7 +79,7 @@ const instanced_fixing_two_el = [
|
||||||
const lamelleMatrix = (i: number) => {
|
const lamelleMatrix = (i: number) => {
|
||||||
const scale_x = (((extra.value as number) || fence_section.value) * 9.9)
|
const scale_x = (((extra.value as number) || fence_section.value) * 9.9)
|
||||||
const pos_x = pillar_size * 0.5
|
const pos_x = pillar_size * 0.5
|
||||||
const pos_y = (lSize * i)
|
const pos_y = (lamelle_height.value * i)
|
||||||
const pos_z = 0.022 * scale_koef
|
const pos_z = 0.022 * scale_koef
|
||||||
return new Matrix4().fromArray([
|
return new Matrix4().fromArray([
|
||||||
scale_x, 0, 0, 0,
|
scale_x, 0, 0, 0,
|
||||||
|
@ -91,7 +90,7 @@ const lamelleMatrix = (i: number) => {
|
||||||
}
|
}
|
||||||
const fixingOneMatrix = (i: number) => {
|
const fixingOneMatrix = (i: number) => {
|
||||||
const pos_x = pillar_one_pos.value + pillar_size * 0.66
|
const pos_x = pillar_one_pos.value + pillar_size * 0.66
|
||||||
const pos_y = (lSize * i) + 0.01 * scale_koef;
|
const pos_y = (lamelle_height.value * i) + 0.01 * scale_koef;
|
||||||
const pos_z = 0.022 * scale_koef
|
const pos_z = 0.022 * scale_koef
|
||||||
return new Matrix4().fromArray([
|
return new Matrix4().fromArray([
|
||||||
1, 0, 0, 0,
|
1, 0, 0, 0,
|
||||||
|
@ -102,7 +101,7 @@ const fixingOneMatrix = (i: number) => {
|
||||||
}
|
}
|
||||||
const fixingTwoMatrix = (i: number) => {
|
const fixingTwoMatrix = (i: number) => {
|
||||||
const pos_x = pillar_two_pos.value - pillar_size * 0.66
|
const pos_x = pillar_two_pos.value - pillar_size * 0.66
|
||||||
const pos_y = (lSize * i) + 0.01 * scale_koef;
|
const pos_y = (lamelle_height.value * i) + 0.01 * scale_koef;
|
||||||
const pos_z = 0.022 * scale_koef
|
const pos_z = 0.022 * scale_koef
|
||||||
return new Matrix4().fromArray([
|
return new Matrix4().fromArray([
|
||||||
1, 0, 0, 0,
|
1, 0, 0, 0,
|
||||||
|
@ -133,7 +132,7 @@ watch(lamelles_count, setBraceCount)
|
||||||
const pillar = ref<Mesh[]>([])
|
const pillar = ref<Mesh[]>([])
|
||||||
const setPillar = () => {
|
const setPillar = () => {
|
||||||
const top = props.models.pillar_top.children[0];
|
const top = props.models.pillar_top.children[0];
|
||||||
top.position.setComponent(1, lSize * lamelles_count.value + lamelles_count.value * 0.0001 * scale_koef);
|
top.position.setComponent(1, lamelle_height.value * lamelles_count.value + lamelles_count.value * 0.0001 * scale_koef);
|
||||||
|
|
||||||
const pillar_outer = props.models.pillar_center.children[0];
|
const pillar_outer = props.models.pillar_center.children[0];
|
||||||
pillar_outer.scale.setComponent(1, lamelles_count.value);
|
pillar_outer.scale.setComponent(1, lamelles_count.value);
|
||||||
|
@ -142,7 +141,7 @@ const setPillar = () => {
|
||||||
pillar_inner.scale.setComponent(1, lamelles_count.value);
|
pillar_inner.scale.setComponent(1, lamelles_count.value);
|
||||||
|
|
||||||
const bottom = props.models.pillar_bottom.children[0];
|
const bottom = props.models.pillar_bottom.children[0];
|
||||||
bottom.position.setComponent(1, lSize * -0.5);
|
bottom.position.setComponent(1, lamelle_height.value * -0.5);
|
||||||
|
|
||||||
let arr = [top, pillar_outer, pillar_inner, bottom]
|
let arr = [top, pillar_outer, pillar_inner, bottom]
|
||||||
arr.map(el => {
|
arr.map(el => {
|
||||||
|
@ -157,21 +156,21 @@ const setPillar = () => {
|
||||||
pillar.value = arr.map(el => el.clone())
|
pillar.value = arr.map(el => el.clone())
|
||||||
}
|
}
|
||||||
setPillar()
|
setPillar()
|
||||||
watch([pillar_pattern, pillar_color, pillar_topper, fence_section, lamelles_count], setPillar)
|
watch([pillar_pattern, pillar_color, pillar_topper, fence_section, lamelles_count, lamelle_height], setPillar)
|
||||||
|
|
||||||
const fastening = ref<Object3D[]>([])
|
const fastening = ref<Object3D[]>([])
|
||||||
const setFastening = () => {
|
const setFastening = () => {
|
||||||
const top_one = props.models.fixing.clone().children[0];
|
const top_one = props.models.fixing.clone().children[0];
|
||||||
top_one.position.set(
|
top_one.position.set(
|
||||||
pillar_one_pos.value + pillar_size * 0.66,
|
pillar_one_pos.value + pillar_size * 0.66,
|
||||||
lamelles_count.value * lSize - 0.015 * scale_koef,
|
lamelles_count.value * lamelle_height.value - 0.015 * scale_koef,
|
||||||
0.025 * scale_koef
|
0.025 * scale_koef
|
||||||
)
|
)
|
||||||
|
|
||||||
const top_two = props.models.fixing.clone().children[0];
|
const top_two = props.models.fixing.clone().children[0];
|
||||||
top_two.position.set(
|
top_two.position.set(
|
||||||
pillar_two_pos.value - pillar_size * 0.66,
|
pillar_two_pos.value - pillar_size * 0.66,
|
||||||
lamelles_count.value * lSize - 0.01 * scale_koef,
|
lamelles_count.value * lamelle_height.value - 0.01 * scale_koef,
|
||||||
0.025 * scale_koef
|
0.025 * scale_koef
|
||||||
)
|
)
|
||||||
|
|
||||||
|
@ -179,7 +178,7 @@ const setFastening = () => {
|
||||||
const top = props.models.fastening_top.clone().children[0];
|
const top = props.models.fastening_top.clone().children[0];
|
||||||
top.position.set(
|
top.position.set(
|
||||||
pillar_size * 0.5,
|
pillar_size * 0.5,
|
||||||
lamelles_count.value * lSize - 0.0275 * scale_koef,
|
lamelles_count.value * lamelle_height.value - 0.0275 * scale_koef,
|
||||||
0
|
0
|
||||||
);
|
);
|
||||||
top.scale.setComponent(0, v);
|
top.scale.setComponent(0, v);
|
||||||
|
@ -188,6 +187,7 @@ const setFastening = () => {
|
||||||
side_one.name = 'side_one'
|
side_one.name = 'side_one'
|
||||||
side_one.position.set(pillar_one_pos.value, 0, 0.002 * scale_koef);
|
side_one.position.set(pillar_one_pos.value, 0, 0.002 * scale_koef);
|
||||||
side_one.scale.set(1, lamelles_count.value, 1)
|
side_one.scale.set(1, lamelles_count.value, 1)
|
||||||
|
console.log(side_one)
|
||||||
|
|
||||||
const side_two = props.models.fastening_side.clone().children[0];
|
const side_two = props.models.fastening_side.clone().children[0];
|
||||||
side_two.name = 'side_two'
|
side_two.name = 'side_two'
|
||||||
|
@ -201,7 +201,7 @@ const setFastening = () => {
|
||||||
fastening.value = arr.map(el => el.clone())
|
fastening.value = arr.map(el => el.clone())
|
||||||
}
|
}
|
||||||
setFastening()
|
setFastening()
|
||||||
watch([pillar_color, lamelles_count, pillar_one_pos, pillar_two_pos], setFastening)
|
watch([pillar_color, pillar_one_pos, pillar_two_pos, lamelles_count, lamelle_height], setFastening)
|
||||||
|
|
||||||
const setLamellesColor = () => {
|
const setLamellesColor = () => {
|
||||||
if (instanced_lamelle.value) {
|
if (instanced_lamelle.value) {
|
||||||
|
@ -214,6 +214,7 @@ watch([instanced_lamelle, lamelle_color], setLamellesColor)
|
||||||
watch([
|
watch([
|
||||||
instanced_lamelle,
|
instanced_lamelle,
|
||||||
lamelles_count,
|
lamelles_count,
|
||||||
|
lamelle_height,
|
||||||
fence_section,
|
fence_section,
|
||||||
], () => {
|
], () => {
|
||||||
const translationVector = new Vector3(0, 20, 20)
|
const translationVector = new Vector3(0, 20, 20)
|
||||||
|
|
|
@ -74,9 +74,6 @@ watch(() => [props.count, fence_section.value, section_count.value, extra_sectio
|
||||||
count_pos,
|
count_pos,
|
||||||
{ flush: 'post' }
|
{ flush: 'post' }
|
||||||
)
|
)
|
||||||
watch(()=>props.models.lamelle, () => {
|
|
||||||
console.log(props.models.lamelle)
|
|
||||||
}, { deep: true })
|
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<TresGroup :name="`line_${props.number}`" :rotate-y="rotate()" :position-x="position.x" :position-y="position.y"
|
<TresGroup :name="`line_${props.number}`" :rotate-y="rotate()" :position-x="position.x" :position-y="position.y"
|
||||||
|
|
|
@ -38,10 +38,10 @@ const { scene: model_fastening_side } = await useGLTF('/models_one/fastening/sid
|
||||||
const { scene: model_fixing } = await useGLTF('/models_one/fixing.glb');
|
const { scene: model_fixing } = await useGLTF('/models_one/fixing.glb');
|
||||||
|
|
||||||
const { scene: top_model } = await useGLTF('/models_one/top_100.glb', { draco: true })
|
const { scene: top_model } = await useGLTF('/models_one/top_100.glb', { draco: true })
|
||||||
const { scene: lamelle_model } = await useGLTF('/models_one/lamel_100.glb', { draco: true });
|
// const { scene: lamelle_model } = await useGLTF('/models_one/lamel_100.glb', { draco: true });
|
||||||
|
|
||||||
const { scene: lamelle_model_aristo } = await useGLTF('/models_one/top_100.glb', { draco: true });
|
|
||||||
const { scene: lamelle_model_standart } = await useGLTF('/models_one/lamel_100.glb', { draco: true });
|
const { scene: lamelle_model_standart } = await useGLTF('/models_one/lamel_100.glb', { draco: true });
|
||||||
|
const { scene: lamelle_model_aristo } = await useGLTF('/models_one/lamel_100_aristo.glb', { draco: true });
|
||||||
|
|
||||||
const top = ref(top_model)
|
const top = ref(top_model)
|
||||||
const pillar_top = ref(topper_models[pillar_topper.value])
|
const pillar_top = ref(topper_models[pillar_topper.value])
|
||||||
|
@ -52,7 +52,7 @@ const pillar_brace = ref(model_pillar_brace)
|
||||||
const fastening_top = ref(model_fastening_top)
|
const fastening_top = ref(model_fastening_top)
|
||||||
const fastening_side = ref(model_fastening_side)
|
const fastening_side = ref(model_fastening_side)
|
||||||
const fixing = ref(model_fixing)
|
const fixing = ref(model_fixing)
|
||||||
const lamelle = ref(lamelle_model)
|
const lamelle = ref(lamelle_model_standart)
|
||||||
|
|
||||||
watch(pillar_topper, async () => {
|
watch(pillar_topper, async () => {
|
||||||
pillar_top.value = topper_models[pillar_topper.value]
|
pillar_top.value = topper_models[pillar_topper.value]
|
||||||
|
@ -119,15 +119,18 @@ const min_for_square = 12;
|
||||||
|
|
||||||
setTarget()
|
setTarget()
|
||||||
|
|
||||||
watch(() => globalFenceType.value?.id, () => {
|
const setLamelleType = () => {
|
||||||
console.log('t')
|
|
||||||
if (globalFenceType.value?.id == 5) {
|
if (globalFenceType.value?.id == 5) {
|
||||||
lamelle.value = lamelle_model_aristo
|
lamelle.value = lamelle_model_standart
|
||||||
|
lamelle_height.value = 0.115
|
||||||
}
|
}
|
||||||
if (globalFenceType.value?.id == 6) {
|
if (globalFenceType.value?.id == 6) {
|
||||||
lamelle.value = lamelle_model_standart
|
lamelle.value = lamelle_model_aristo
|
||||||
|
lamelle_height.value = 0.196
|
||||||
}
|
}
|
||||||
})
|
}
|
||||||
|
setLamelleType()
|
||||||
|
watch(() => globalFenceType.value?.id, setLamelleType)
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<TresGroup name="base">
|
<TresGroup name="base">
|
||||||
|
|
|
@ -132,7 +132,7 @@ watch(openTab, () => {
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="siteblock siteblock_imgbg bg-slate-500"
|
<div class="siteblock siteblock_imgbg bg-slate-500 hidden"
|
||||||
:style="[{ backgroundImage: `url(${[imgBase, delivery?.image].join('/')})` }]">
|
:style="[{ backgroundImage: `url(${[imgBase, delivery?.image].join('/')})` }]">
|
||||||
<NuxtImg :src="[imgBase, delivery?.image].join('/')" class="invisible" v-if="delivery"
|
<NuxtImg :src="[imgBase, delivery?.image].join('/')" class="invisible" v-if="delivery"
|
||||||
alt="коричневый забор" title="" format="webp" loading="lazy" />
|
alt="коричневый забор" title="" format="webp" loading="lazy" />
|
||||||
|
|
Binary file not shown.
Binary file not shown.
Binary file not shown.
Loading…
Reference in New Issue