Files
ComfyUI_frontend/src/components/load3d/controls/viewer/ViewerModelControls.vue
Comfy Org PR Bot 8deca4459d [backport core/1.42] fix(load3d): fix squashed controls in 3D inspector side panel (#10871)
Backport of #10768 to `core/1.42`

Automatically created by backport workflow.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-10871-backport-core-1-42-fix-load3d-fix-squashed-controls-in-3D-inspector-side-panel-33a6d73d365081048cd5f9ebbdc57b63)
by [Unito](https://www.unito.io)

Co-authored-by: Kelly Yang <124ykl@gmail.com>
2026-04-06 14:26:47 -07:00

74 lines
1.8 KiB
Vue

<template>
<div class="space-y-4">
<div class="flex flex-col gap-2">
<label>{{ $t('load3d.upDirection') }}</label>
<Select
v-model="upDirection"
:options="upDirectionOptions"
option-label="label"
option-value="value"
/>
</div>
<div v-if="!hideMaterialMode" class="flex flex-col gap-2">
<label>{{ $t('load3d.materialMode') }}</label>
<Select
v-model="materialMode"
:options="materialModeOptions"
option-label="label"
option-value="value"
/>
</div>
</div>
</template>
<script setup lang="ts">
import Select from 'primevue/select'
import { computed } from 'vue'
import { useI18n } from 'vue-i18n'
import type {
MaterialMode,
UpDirection
} from '@/extensions/core/load3d/interfaces'
const { t } = useI18n()
const { hideMaterialMode = false, isPlyModel = false } = defineProps<{
hideMaterialMode?: boolean
isPlyModel?: boolean
}>()
const upDirection = defineModel<UpDirection>('upDirection')
const materialMode = defineModel<MaterialMode>('materialMode')
const upDirectionOptions = [
{ label: t('load3d.upDirections.original'), value: 'original' },
{ label: '-X', value: '-x' },
{ label: '+X', value: '+x' },
{ label: '-Y', value: '-y' },
{ label: '+Y', value: '+y' },
{ label: '-Z', value: '-z' },
{ label: '+Z', value: '+z' }
]
const materialModeOptions = computed(() => {
const options = [
{ label: t('load3d.materialModes.original'), value: 'original' }
]
if (isPlyModel) {
options.push({
label: t('load3d.materialModes.pointCloud'),
value: 'pointCloud'
})
}
options.push(
{ label: t('load3d.materialModes.normal'), value: 'normal' },
{ label: t('load3d.materialModes.wireframe'), value: 'wireframe' }
)
return options
})
</script>