1
1
<template >
2
2
<div >
3
3
<!-- eslint-disable-next-line vue/no-v-html -->
4
- <div v-html =" mucIconsSprite" />
4
+ <div v-html =" mucIconsSprite" />
5
5
<!-- eslint-disable-next-line vue/no-v-html -->
6
- <div v-html =" customIconsSprite" />
6
+ <div v-html =" customIconsSprite" />
7
7
8
8
<div v-if =" loading" >
9
- <skeleton-loader />
9
+ <skeleton-loader />
10
10
</div >
11
11
<div v-else-if =" snServices" >
12
12
<h1 >Abfrageergebnis</h1 >
13
13
<div >
14
14
<div
15
- class =" snServiceElement"
16
- v-for =" service in snServices"
17
- :key =" service.id"
15
+ class =" snServiceElement"
16
+ v-for =" service in snServices"
17
+ :key =" service.id"
18
18
>
19
- <p >
20
- <b >{{ service.serviceName }} (ID: {{ service.id }})</b ><br >
21
- <span >{{ service.summary }}</span ><br ><br >
19
+ <div >
20
+ <b >{{ service.serviceName }} (ID: {{ service.id }})</b ><br />
21
+ <span >{{ service.summary }}</span
22
+ ><br /><br />
22
23
<div v-if =" service.onlineServices" >
23
24
<b >Online-Services:</b >
24
25
<ul >
25
26
<li
26
- v-for =" onlineService in service.onlineServices"
27
- :key =" onlineService.uri"
27
+ v-for =" onlineService in service.onlineServices"
28
+ :key =" onlineService.uri"
28
29
>
29
30
<a :href =" onlineService.uri" >{{ onlineService.label }}</a >
30
31
</li >
31
32
</ul >
32
33
</div >
33
- </p >
34
+ </div >
34
35
</div >
35
36
</div >
36
37
</div >
37
- <div v-else >
38
- oops something went wrong
39
- </div >
38
+ <div v-else >oops something went wrong</div >
40
39
</div >
41
40
</template >
42
41
43
42
<script setup lang="ts">
43
+ import type { SNService } from " @/api/servicenavigator/ServiceNavigatorLookup.ts" ;
44
+ import type { ServiceNavigatorResult } from " @/api/servicenavigator/ServiceNavigatorResult.ts" ;
45
+
44
46
import customIconsSprite from " @muenchen/muc-patternlab-vue/assets/icons/custom-icons.svg?raw" ;
45
47
import mucIconsSprite from " @muenchen/muc-patternlab-vue/assets/icons/muc-icons.svg?raw" ;
48
+ import { onMounted , ref } from " vue" ;
49
+
46
50
import SkeletonLoader from " @/components/common/skeleton-loader.vue" ;
47
- import {onMounted , ref } from " vue " ;
48
- import { getAPIBaseURL , LOCALSTORAGE_KEY_SERVICENAVIGATOR_RESULT } from " @/util/constants.ts " ;
49
- import type { ServiceNavigatorResult } from " @/api/servicenavigator/ServiceNavigatorResult.ts " ;
50
- import type { SNService } from " @/api/servicenavigator/ServiceNavigatorLookup .ts" ;
51
+ import {
52
+ getAPIBaseURL ,
53
+ LOCALSTORAGE_KEY_SERVICENAVIGATOR_RESULT ,
54
+ } from " @/util/constants .ts" ;
51
55
52
56
const loading = ref (true );
53
57
const snServices = ref <SNService [] | null >(null );
54
58
55
59
onMounted (() => {
56
60
loading .value = true ;
57
61
58
- let serviceNavigatorResultString = localStorage .getItem (LOCALSTORAGE_KEY_SERVICENAVIGATOR_RESULT );
62
+ const serviceNavigatorResultString = localStorage .getItem (
63
+ LOCALSTORAGE_KEY_SERVICENAVIGATOR_RESULT
64
+ );
59
65
if (! serviceNavigatorResultString ) {
60
- console .error (" No Data found in LocalStorage with key " , LOCALSTORAGE_KEY_SERVICENAVIGATOR_RESULT );
66
+ console .debug (
67
+ " No Data found in LocalStorage with key " ,
68
+ LOCALSTORAGE_KEY_SERVICENAVIGATOR_RESULT
69
+ );
61
70
loading .value = false ;
62
71
} else {
63
- const snResult = JSON .parse (serviceNavigatorResultString ) as ServiceNavigatorResult ;
64
- const url = getAPIBaseURL () + " /public/api/backend-service/servicenavigator?ids=" + snResult .services .join (" ," );
72
+ const snResult = JSON .parse (
73
+ serviceNavigatorResultString
74
+ ) as ServiceNavigatorResult ;
75
+ const url =
76
+ getAPIBaseURL () +
77
+ " /public/api/backend-service/servicenavigator?ids=" +
78
+ snResult .services .join (" ," );
65
79
fetch (url )
66
- .then (resp => {
67
- if (resp .ok ) {
68
- resp .json ()
69
- .then ((snServicesBody : SNService []) => {
70
- console .log (snServicesBody );
71
- snServices .value = snServicesBody ;
72
- })
73
- } else {
74
- resp .text ().then (errBody => {
75
- throw Error (errBody )
76
- })
77
- }
78
- })
79
- .catch (error => {
80
- console .log (error );
81
- })
82
- .finally (() => loading .value = false );
80
+ .then ((resp ) => {
81
+ if (resp .ok ) {
82
+ resp .json ().then ((snServicesBody : SNService []) => {
83
+ snServices .value = snServicesBody ;
84
+ });
85
+ } else {
86
+ resp .text ().then ((errBody ) => {
87
+ throw Error (errBody );
88
+ });
89
+ }
90
+ })
91
+ .catch ((error ) => {
92
+ console .debug (error );
93
+ })
94
+ .finally (() => (loading .value = false ));
83
95
}
84
96
});
85
97
</script >
@@ -97,4 +109,4 @@ onMounted(() => {
97
109
border : 1px solid lightgray ;
98
110
border-radius : 16px ;
99
111
}
100
- </style >
112
+ </style >
0 commit comments