dev #90
|
@ -19,6 +19,7 @@ const section_count = use_section_count()
|
||||||
const extra_section = use_extra_section()
|
const extra_section = use_extra_section()
|
||||||
const total_length = use_total_length()
|
const total_length = use_total_length()
|
||||||
const min_length = use_min_length()
|
const min_length = use_min_length()
|
||||||
|
const globalFenceType = useGlobalFenceType()
|
||||||
|
|
||||||
if (!pillar_color.value) {
|
if (!pillar_color.value) {
|
||||||
const r = Math.floor(Math.random() * predefPillarColors.length)
|
const r = Math.floor(Math.random() * predefPillarColors.length)
|
||||||
|
@ -205,7 +206,8 @@ const calc_table = computed(() => {
|
||||||
:goto_cam="new Vector3(1, 2, -1)" />
|
:goto_cam="new Vector3(1, 2, -1)" />
|
||||||
<label for="pillar_topper">Колпак столба</label>
|
<label for="pillar_topper">Колпак столба</label>
|
||||||
<DropdownPicker type="topper" :cb="setPillarTopper" name="pillar_topper"
|
<DropdownPicker type="topper" :cb="setPillarTopper" name="pillar_topper"
|
||||||
:pattern="getTopper(pillar_topper)" :disabled="remove_pillar"
|
:pattern="getTopper(pillar_topper, globalFenceType?.type == 'aristo' ? 'aristoToppers' : 'baseToppers')"
|
||||||
|
:disabled="remove_pillar"
|
||||||
:goto_target="new Vector3(fence_section * -0.5, lamelles_count * lamelle_height, 0)"
|
:goto_target="new Vector3(fence_section * -0.5, lamelles_count * lamelle_height, 0)"
|
||||||
:goto_cam="new Vector3(-1, 2, 1)" />
|
:goto_cam="new Vector3(-1, 2, 1)" />
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,24 +1,39 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { getFilename as getPattern, patterns } from '../pattern';
|
import { getFilename as getPattern, patterns } from '../pattern';
|
||||||
import { getFilename as getTopper, toppers } from '../topper';
|
import { getFilename as getTopper, baseToppers, aristoToppers } from '../topper';
|
||||||
|
|
||||||
|
const globalFenceType = useGlobalFenceType()
|
||||||
const props = defineProps(['cb', 'patterns']);
|
const props = defineProps(['cb', 'patterns']);
|
||||||
type pType = {
|
type pType = {
|
||||||
list: typeof patterns | typeof toppers,
|
list: typeof patterns | typeof baseToppers,
|
||||||
func: any
|
func: any
|
||||||
|
type: string | null
|
||||||
}
|
}
|
||||||
const p = {
|
const p = reactive({
|
||||||
list: [],
|
list: [],
|
||||||
|
type: null,
|
||||||
func: () => { }
|
func: () => { }
|
||||||
} as pType
|
} as pType)
|
||||||
|
|
||||||
if (props.patterns == 'pattern') {
|
if (props.patterns == 'pattern') {
|
||||||
p.list = patterns;
|
p.list = patterns;
|
||||||
p.func = getPattern
|
p.func = getPattern
|
||||||
} else if (props.patterns == 'topper') {
|
} else if (props.patterns == 'topper') {
|
||||||
p.list = toppers
|
p.list = baseToppers
|
||||||
p.func = getTopper
|
p.func = getTopper
|
||||||
}
|
}
|
||||||
|
watch(globalFenceType, () => {
|
||||||
|
if (props.patterns == 'topper') {
|
||||||
|
if (globalFenceType.value?.type == 'standart') {
|
||||||
|
p.list = baseToppers
|
||||||
|
p.type = 'toppers'
|
||||||
|
}
|
||||||
|
if (globalFenceType.value?.type == 'aristo') {
|
||||||
|
p.list = aristoToppers
|
||||||
|
p.type = 'aristoToppers'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<template v-for="item in p.list">
|
<template v-for="item in p.list">
|
||||||
|
|
|
@ -3,7 +3,7 @@ import { Object3D, Vector3 } from 'three';
|
||||||
//@ts-ignore
|
//@ts-ignore
|
||||||
import { useGLTF, } from '@tresjs/cientos'
|
import { useGLTF, } from '@tresjs/cientos'
|
||||||
import type { OrbitControlsProps } from '@tresjs/cientos/dist/core/controls/OrbitControls.vue.js';
|
import type { OrbitControlsProps } from '@tresjs/cientos/dist/core/controls/OrbitControls.vue.js';
|
||||||
import { getModel, toppers, type toppersIds } from '../topper';
|
import { getModel, allToppers, baseToppers, aristoToppers, type toppersIds } from '../topper';
|
||||||
|
|
||||||
const section_count = use_section_count()
|
const section_count = use_section_count()
|
||||||
const extra_section = use_extra_section()
|
const extra_section = use_extra_section()
|
||||||
|
@ -22,10 +22,16 @@ const { seek, seekAll } = useSeek()
|
||||||
|
|
||||||
const globalFenceType = useGlobalFenceType()
|
const globalFenceType = useGlobalFenceType()
|
||||||
|
|
||||||
const topper_models = {} as { [key: toppersIds]: Object3D }
|
const topper_models = {
|
||||||
for await (const element of toppers) {
|
baseToppers: {} as { [key: toppersIds]: Object3D },
|
||||||
const { scene } = await useGLTF(getModel(element.id))
|
aristoToppers: {} as { [key: toppersIds]: Object3D },
|
||||||
topper_models[element.id] = scene
|
}
|
||||||
|
for (const key of Object.keys(allToppers)) {
|
||||||
|
let toppers = allToppers[key]
|
||||||
|
for await (const element of toppers) {
|
||||||
|
const { scene } = await useGLTF(getModel(element.id, key))
|
||||||
|
topper_models[key][element.id] = scene
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const { scene: model_pillar_center } = await useGLTF('/models_one/pillar/center.glb')
|
const { scene: model_pillar_center } = await useGLTF('/models_one/pillar/center.glb')
|
||||||
|
@ -44,7 +50,7 @@ const { scene: lamelle_model_standart } = await useGLTF('/models_one/lamel_100.g
|
||||||
const { scene: lamelle_model_aristo } = await useGLTF('/models_one/lamel_100_aristo.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()
|
||||||
const pillar_center = ref(model_pillar_center)
|
const pillar_center = ref(model_pillar_center)
|
||||||
const pillar_bottom = ref(model_pillar_bottom)
|
const pillar_bottom = ref(model_pillar_bottom)
|
||||||
const pillar_inner = ref(model_pillar_inner)
|
const pillar_inner = ref(model_pillar_inner)
|
||||||
|
@ -54,9 +60,15 @@ const fastening_side = ref(model_fastening_side)
|
||||||
const fixing = ref(model_fixing)
|
const fixing = ref(model_fixing)
|
||||||
const lamelle = ref(lamelle_model_standart)
|
const lamelle = ref(lamelle_model_standart)
|
||||||
|
|
||||||
watch(pillar_topper, async () => {
|
const setPillarTopper = () => {
|
||||||
pillar_top.value = topper_models[pillar_topper.value]
|
let key = 'baseToppers'
|
||||||
})
|
if (globalFenceType.value?.type == 'aristo') {
|
||||||
|
key = 'aristoToppers'
|
||||||
|
}
|
||||||
|
pillar_top.value = topper_models[key][pillar_topper.value]
|
||||||
|
}
|
||||||
|
setPillarTopper()
|
||||||
|
watch(pillar_topper, setPillarTopper)
|
||||||
|
|
||||||
const total = ref((section_count.value + ~~(!!extra_section.value)))
|
const total = ref((section_count.value + ~~(!!extra_section.value)))
|
||||||
const size = ref(Math.ceil(total.value / 4))
|
const size = ref(Math.ceil(total.value / 4))
|
||||||
|
@ -120,13 +132,17 @@ const min_for_square = 12;
|
||||||
setTarget()
|
setTarget()
|
||||||
|
|
||||||
const setLamelleType = () => {
|
const setLamelleType = () => {
|
||||||
if (globalFenceType.value?.id == 5) {
|
if (globalFenceType.value?.type == 'standart') {
|
||||||
lamelle.value = lamelle_model_standart
|
lamelle.value = lamelle_model_standart
|
||||||
lamelle_height.value = 0.115
|
lamelle_height.value = 0.115
|
||||||
|
pillar_topper.value = 0
|
||||||
|
setPillarTopper()
|
||||||
}
|
}
|
||||||
if (globalFenceType.value?.id == 6) {
|
if (globalFenceType.value?.type == 'aristo') {
|
||||||
lamelle.value = lamelle_model_aristo
|
lamelle.value = lamelle_model_aristo
|
||||||
lamelle_height.value = 0.196
|
lamelle_height.value = 0.196
|
||||||
|
pillar_topper.value = 0
|
||||||
|
setPillarTopper()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
setLamelleType()
|
setLamelleType()
|
||||||
|
@ -134,7 +150,8 @@ watch(() => globalFenceType.value?.id, setLamelleType)
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<TresGroup name="base">
|
<TresGroup name="base">
|
||||||
<template v-for="line in (total >= min_for_square) ? 4 : 1" :key="`${globalFenceType?.id ?? 5}_${line}_${count}`">
|
<template v-for="line in (total >= min_for_square) ? 4 : 1"
|
||||||
|
:key="`${globalFenceType?.id ?? 5}_${line}_${count}`">
|
||||||
<ModelLine :models="{
|
<ModelLine :models="{
|
||||||
top,
|
top,
|
||||||
pillar_center, pillar_top, pillar_bottom, pillar_inner,
|
pillar_center, pillar_top, pillar_bottom, pillar_inner,
|
||||||
|
|
|
@ -1,24 +1,63 @@
|
||||||
export const toppers = [
|
interface Topper {
|
||||||
|
id: number; // ID элемента
|
||||||
|
name: string; // Название
|
||||||
|
filename: string; // Имя файла
|
||||||
|
model: string; // Модель
|
||||||
|
}
|
||||||
|
|
||||||
|
export const baseToppers = [
|
||||||
{ name: 'Ровный', filename: 'icon_stolb_verh_3.svg', model: 'top' },
|
{ name: 'Ровный', filename: 'icon_stolb_verh_3.svg', model: 'top' },
|
||||||
{ name: 'Вершина 1', filename: 'icon_stolb_verh_2.svg', model: 'decor1' },
|
{ name: 'Вершина 1', filename: 'icon_stolb_verh_2.svg', model: 'decor1' },
|
||||||
{ name: 'Вершина 2', filename: 'icon_stolb_verh_1.svg', model: 'decor2' },
|
{ name: 'Вершина 2', filename: 'icon_stolb_verh_1.svg', model: 'decor2' },
|
||||||
].map((el, i) => Object.assign(el, { id: i }))
|
].map((el, i) => Object.assign(el, { id: i }))
|
||||||
|
|
||||||
export const getFilename = (id: toppersIds) => {
|
export const aristoToppers = [
|
||||||
const el = toppers.find(el => el.id == id)
|
{ name: 'Колпак', filename: 'icon_stolb_verh_1.svg', model: 'aristo1' },
|
||||||
|
].map((el, i) => Object.assign(el, { id: i }))
|
||||||
|
|
||||||
|
export const allToppers = {
|
||||||
|
'baseToppers': baseToppers,
|
||||||
|
'aristoToppers': aristoToppers,
|
||||||
|
} as { [key: string]: Topper[] }
|
||||||
|
|
||||||
|
function getToppersByType(type: string | null): any {
|
||||||
|
if (!type) type = 'NONE'
|
||||||
|
// Проверяем, существует ли указанный тип в объекте allToppers
|
||||||
|
if (allToppers[type]) {
|
||||||
|
return allToppers[type];
|
||||||
|
}
|
||||||
|
|
||||||
|
// Если типа нет, берем первый доступный элемент из allToppers
|
||||||
|
const keys = Object.keys(allToppers);
|
||||||
|
if (keys.length > 0) {
|
||||||
|
const firstKey = keys[0];
|
||||||
|
return allToppers[firstKey];
|
||||||
|
}
|
||||||
|
|
||||||
|
// Если объект allToppers пустой, возвращаем значение по умолчанию (например, пустой массив)
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
export const getFilename = (id: toppersIds, type: string | null) => {
|
||||||
|
let toppers = getToppersByType(type)
|
||||||
|
|
||||||
|
const el = toppers.find((el: Topper) => el.id == id)
|
||||||
if (!el || !el.filename) return undefined
|
if (!el || !el.filename) return undefined
|
||||||
return `/topper/${el?.filename}`
|
return `/topper/${el?.filename}`
|
||||||
}
|
}
|
||||||
|
|
||||||
export const getName = (id: toppersIds) => {
|
export const getName = (id: toppersIds, type: string | null) => {
|
||||||
const el = toppers.find(el => el.id == id)
|
let toppers = getToppersByType(type)
|
||||||
|
|
||||||
|
const el = toppers.find((el: Topper) => el.id == id)
|
||||||
if (!el || !el.filename) return undefined
|
if (!el || !el.filename) return undefined
|
||||||
return el.name
|
return el.name
|
||||||
}
|
}
|
||||||
export const getModel = (id: toppersIds) => {
|
export const getModel = (id: toppersIds, type: string | null) => {
|
||||||
const el = toppers.find(el => el.id == id)
|
let toppers = getToppersByType(type)
|
||||||
|
|
||||||
|
let el = toppers.find((el: Topper) => el.id == id)
|
||||||
if (!el || !el.filename) return undefined
|
if (!el || !el.filename) return undefined
|
||||||
return `/models_one/pillar/topper/${el?.model}.glb`
|
return `/models_one/pillar/topper/${el?.model}.glb`
|
||||||
}
|
}
|
||||||
|
|
||||||
export type toppersIds = typeof toppers[number]['id']
|
export type toppersIds = typeof allToppers[string][number]['id']
|
|
@ -1,5 +1,6 @@
|
||||||
interface calc {
|
interface calc {
|
||||||
id: number
|
id: number
|
||||||
|
type: 'standart' | 'aristo'
|
||||||
calc: ApiCalcType
|
calc: ApiCalcType
|
||||||
}
|
}
|
||||||
export const useGlobalFenceType = () => useState<calc | null>('fence-global-type', () => null)
|
export const useGlobalFenceType = () => useState<calc | null>('fence-global-type', () => null)
|
||||||
|
|
|
@ -56,11 +56,14 @@ const setCalcData = (id: number) => {
|
||||||
watch(openTab, () => {
|
watch(openTab, () => {
|
||||||
if (!openTab.value) return
|
if (!openTab.value) return
|
||||||
if (!calculators.value) return
|
if (!calculators.value) return
|
||||||
|
let type = 'standart'
|
||||||
|
if (openTab.value == 6) {
|
||||||
|
type = 'aristo'
|
||||||
|
}
|
||||||
const v = {
|
const v = {
|
||||||
id: openTab.value as number,
|
id: openTab.value as number,
|
||||||
|
type: type as "standart"|"aristo",
|
||||||
calc: calculators.value.find(el => el.id == openTab.value) as ApiCalcType,
|
calc: calculators.value.find(el => el.id == openTab.value) as ApiCalcType,
|
||||||
|
|
||||||
}
|
}
|
||||||
globalFenceType.value = v
|
globalFenceType.value = v
|
||||||
})
|
})
|
||||||
|
|
Loading…
Reference in New Issue