User EnumTypeDisplay for objects

This commit is contained in:
Samuel Lorch 2024-07-30 18:36:04 +02:00
parent 3eb13e20d2
commit f1d7b57a21
2 changed files with 8 additions and 6 deletions

View file

@ -1,6 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { apiCall } from '../../api'; import { apiCall } from '../../api';
import getPlugins from '../../plugins'; import getPlugins from '../../plugins';
import EnumTypeDisplay from '~/components/display/EnumTypeDisplay.vue';
const p = getPlugins(); const p = getPlugins();
let addresses = $ref([]); let addresses = $ref([]);
@ -9,7 +10,7 @@ let selection = $ref([] as number[]);
const columns = [ const columns = [
{ heading: 'Name', path: 'name' }, { heading: 'Name', path: 'name' },
{ heading: 'Type', path: 'type' }, { heading: 'Type', path: 'type', component: markRaw(EnumTypeDisplay), componentProp: 'data' },
{ heading: 'Value', path: 'value' }, { heading: 'Value', path: 'value' },
{ heading: 'Comment', path: 'comment' }, { heading: 'Comment', path: 'comment' },
]; ];
@ -33,7 +34,7 @@ const displayData = $computed(() => {
data.push({ data.push({
name: addresses[index].name, name: addresses[index].name,
value: getAddressValue(addresses[index]), value: getAddressValue(addresses[index]),
type: addresses[index].type, type: addresses[index].address_type,
comment: addresses[index].comment, comment: addresses[index].comment,
}); });
} }
@ -42,7 +43,7 @@ const displayData = $computed(() => {
function getAddressValue(s: any): string { function getAddressValue(s: any): string {
let value: string; let value: string;
switch (s.type) { switch (s.address_type) {
case 'host': case 'host':
value = s.host; value = s.host;
break; break;
@ -88,4 +89,4 @@ onMounted(async() => {
<button :disabled="selection.length != 1" @click="editAddress">Edit</button> <button :disabled="selection.length != 1" @click="editAddress">Edit</button>
<button :disabled="selection.length != 1" @click="deleteAddress">Delete</button> <button :disabled="selection.length != 1" @click="deleteAddress">Delete</button>
</TableView> </TableView>
</template> </template>

View file

@ -1,6 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { apiCall } from '../../api'; import { apiCall } from '../../api';
import getPlugins from '../../plugins'; import getPlugins from '../../plugins';
import EnumTypeDisplay from '~/components/display/EnumTypeDisplay.vue';
const p = getPlugins(); const p = getPlugins();
let services = $ref({}); let services = $ref({});
@ -9,7 +10,7 @@ let selection = $ref([] as number[]);
const columns = [ const columns = [
{ heading: 'Name', path: 'name' }, { heading: 'Name', path: 'name' },
{ heading: 'Type', path: 'type' }, { heading: 'Type', path: 'type', component: markRaw(EnumTypeDisplay), componentProp: 'data' },
{ heading: 'Value', path: 'value' }, { heading: 'Value', path: 'value' },
{ heading: 'Comment', path: 'comment' }, { heading: 'Comment', path: 'comment' },
]; ];
@ -91,4 +92,4 @@ onMounted(async() => {
<button :disabled="selection.length != 1" @click="editService">Edit</button> <button :disabled="selection.length != 1" @click="editService">Edit</button>
<button :disabled="selection.length != 1" @click="deleteService">Delete</button> <button :disabled="selection.length != 1" @click="deleteService">Delete</button>
</TableView> </TableView>
</template> </template>