Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 | 6x 8x 7x 7x 7x 1x 1x 1x 1x 1x 1x 1x 1x 7x 6x 6x 2x 2x 2x 2x 2x 2x 2x 2x 2x 6x 6x | <template>
<v-menu
v-model="menuState"
data-testid="menu"
:close-on-content-click="false"
>
<template #activator="{ props: menu }">
<v-tooltip location="top">
<template #activator="{ props: tooltip }">
<v-btn
v-bind="mergeProps(menu, tooltip)"
data-testid="activator"
color="white"
variant="text"
icon="flip"
/>
</template>
<span>{{ t('labels.flip') }}</span>
</v-tooltip>
</template>
<v-list>
<v-list-item
data-testid="sagittal"
@click="flipSagittal"
>
<v-list-item-title>
{{ t('labels.flipView', { view: t('enums.scanView.sagittal') }) }}
</v-list-item-title>
</v-list-item>
<v-list-item
data-testid="coronal"
@click="flipCoronal"
>
<v-list-item-title>
{{ t('labels.flipView', { view: t('enums.scanView.coronal') }) }}
</v-list-item-title>
</v-list-item>
<v-list-item
data-testid="transverse"
@click="flipTransverse"
>
<v-list-item-title>
{{ t('labels.flipView', { view: t('enums.scanView.transverse') }) }}
</v-list-item-title>
</v-list-item>
</v-list>
</v-menu>
</template>
<script setup lang="ts">
import { computed, mergeProps, ref } from 'vue';
import { InvertTransformData, ScanView } from '@3cr/types-ts';
import { useViewer3cr } from '@/composables/useViewer3cr';
import { useI18n } from 'vue-i18n';
interface Props {
view: ScanView;
}
type Emits = {
'update:modal': [value: boolean];
};
defineProps<Props>();
const emit = defineEmits<Emits>();
const { t } = useI18n();
const viewer3cr = useViewer3cr();
const menu = ref<boolean>(false);
const sagittal = ref<boolean>(false);
const coronal = ref<boolean>(false);
const transverse = ref<boolean>(false);
const menuState = computed({
get(): boolean {
return menu.value;
},
set(value: boolean): void {
menu.value = value;
emit('update:modal', value);
},
});
async function flipSagittal(): Promise<void> {
const value = !sagittal.value;
await invert(value, coronal.value, transverse.value);
sagittal.value = value;
}
async function flipCoronal(): Promise<void> {
const value = !coronal.value;
await invert(sagittal.value, value, transverse.value);
coronal.value = value;
}
async function flipTransverse(): Promise<void> {
const value = !transverse.value;
await invert(sagittal.value, coronal.value, value);
transverse.value = value;
}
async function invert(
sagittal: boolean,
coronal: boolean,
transverse: boolean,
): Promise<void> {
const message: InvertTransformData = {
Version: '0.0.0',
InvertedSagittal: sagittal,
InvertedCoronal: coronal,
InvertedTransverse: transverse,
};
await viewer3cr.invertTransform({ message });
}
</script>
|