|
| 1 | +<template> |
| 2 | + <ViewerContextMenuItem |
| 3 | + :itemProps="props.itemProps" |
| 4 | + :tooltip="props.tooltip" |
| 5 | + :btn_image="props.btn_image" |
| 6 | + > |
| 7 | + <template #options> |
| 8 | + <ViewerOptionsVisibilitySwitch v-model="visibility" /> |
| 9 | + <template v-if="visibility"> |
| 10 | + <ViewerOptionsColoringTypeSelector |
| 11 | + :id="id" |
| 12 | + v-model:coloring_style_key="coloring_style_key" |
| 13 | + v-model:color="color" |
| 14 | + v-model:textures="textures" |
| 15 | + v-model:vertex_attribute="vertex_attribute" |
| 16 | + v-model:cell_attribute="cell_attribute" |
| 17 | + /> |
| 18 | + </template> |
| 19 | + </template> |
| 20 | + </ViewerContextMenuItem> |
| 21 | +</template> |
| 22 | + |
| 23 | +<script setup> |
| 24 | + import ViewerContextMenuItem from "@ogw_front/components/Viewer/ContextMenuItem.vue" |
| 25 | + import ViewerOptionsVisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch.vue" |
| 26 | + import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector.vue" |
| 27 | +
|
| 28 | + const dataStyleStore = useDataStyleStore() |
| 29 | + const hybridViewerStore = useHybridViewerStore() |
| 30 | +
|
| 31 | + const props = defineProps({ |
| 32 | + itemProps: { type: Object, required: true }, |
| 33 | + btn_image: { type: String, required: true }, |
| 34 | + tooltip: { type: String, required: false, default: "Cells options" }, |
| 35 | + }) |
| 36 | +
|
| 37 | + const id = toRef(() => props.itemProps.id) |
| 38 | +
|
| 39 | + const visibility = computed({ |
| 40 | + get: () => dataStyleStore.meshCellsVisibility(id.value), |
| 41 | + set: (newValue) => { |
| 42 | + dataStyleStore.setMeshCellsVisibility(id.value, newValue) |
| 43 | + hybridViewerStore.remoteRender() |
| 44 | + }, |
| 45 | + }) |
| 46 | + const coloring_style_key = computed({ |
| 47 | + get: () => dataStyleStore.meshCellsActiveColoring(id.value), |
| 48 | + set: (newValue) => { |
| 49 | + dataStyleStore.setMeshCellsActiveColoring(id.value, newValue) |
| 50 | + hybridViewerStore.remoteRender() |
| 51 | + }, |
| 52 | + }) |
| 53 | + const color = computed({ |
| 54 | + get: () => dataStyleStore.meshCellsColor(id.value), |
| 55 | + set: (newValue) => { |
| 56 | + dataStyleStore.setMeshCellsColor(id.value, newValue) |
| 57 | + hybridViewerStore.remoteRender() |
| 58 | + }, |
| 59 | + }) |
| 60 | + const textures = computed({ |
| 61 | + get: () => dataStyleStore.meshCellsTextures(id.value), |
| 62 | + set: (newValue) => { |
| 63 | + dataStyleStore.setMeshCellsTextures(id.value, newValue) |
| 64 | + hybridViewerStore.remoteRender() |
| 65 | + }, |
| 66 | + }) |
| 67 | + const vertex_attribute = computed({ |
| 68 | + get: () => dataStyleStore.meshCellsVertexAttribute(id.value), |
| 69 | + set: (newValue) => { |
| 70 | + dataStyleStore.setMeshCellsVertexAttribute(id.value, newValue) |
| 71 | + hybridViewerStore.remoteRender() |
| 72 | + }, |
| 73 | + }) |
| 74 | + const cell_attribute = computed({ |
| 75 | + get: () => dataStyleStore.meshCellsCellAttribute(id.value), |
| 76 | + set: (newValue) => { |
| 77 | + dataStyleStore.setMeshCellsCellAttribute(id.value, newValue) |
| 78 | + hybridViewerStore.remoteRender() |
| 79 | + }, |
| 80 | + }) |
| 81 | +</script> |
0 commit comments