mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-20 06:20:11 +00:00
4f3a5ae184
## Summary Fixes squashed `input controls` (color picker, sliders, dropdowns) in the 3D asset inspector side panel. ## Screenshots before <img width="3012" height="1580" alt="image" src="https://github.com/user-attachments/assets/edc6fadc-cdc5-4a4e-92e7-57faabfeb1a4" /> after <img width="4172" height="2062" alt="image" src="https://github.com/user-attachments/assets/766324ce-e8f7-43fc-899e-ae275f880e59" /> ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-10768-fix-load3d-fix-squashed-controls-in-3D-inspector-side-panel-3346d73d365081e8b438de8115180685) by [Unito](https://www.unito.io)
45 lines
1.1 KiB
Vue
45 lines
1.1 KiB
Vue
<template>
|
|
<div class="space-y-4">
|
|
<div class="flex flex-col gap-2">
|
|
<label>{{ t('load3d.viewer.cameraType') }}</label>
|
|
<Select
|
|
v-model="cameraType"
|
|
:options="cameras"
|
|
option-label="title"
|
|
option-value="value"
|
|
>
|
|
</Select>
|
|
</div>
|
|
|
|
<div v-if="showFOVButton" class="flex flex-col gap-2">
|
|
<label>{{ t('load3d.fov') }}</label>
|
|
<Slider
|
|
v-model="fov"
|
|
:min="10"
|
|
:max="150"
|
|
:step="1"
|
|
:aria-label="t('load3d.fov')"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import Select from 'primevue/select'
|
|
import Slider from 'primevue/slider'
|
|
import { computed } from 'vue'
|
|
import { useI18n } from 'vue-i18n'
|
|
|
|
import type { CameraType } from '@/extensions/core/load3d/interfaces'
|
|
|
|
const { t } = useI18n()
|
|
const cameras = [
|
|
{ title: t('load3d.cameraType.perspective'), value: 'perspective' },
|
|
{ title: t('load3d.cameraType.orthographic'), value: 'orthographic' }
|
|
]
|
|
|
|
const cameraType = defineModel<CameraType>('cameraType')
|
|
const fov = defineModel<number>('fov')
|
|
const showFOVButton = computed(() => cameraType.value === 'perspective')
|
|
</script>
|