Skip to content

Commit 9f0d5f9

Browse files
lindongchenlindongchen
committed
update ui issue
1 parent d87cc09 commit 9f0d5f9

File tree

7 files changed

+97
-20
lines changed

7 files changed

+97
-20
lines changed

‎gui/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@
3434
"@tauri-apps/plugin-process": "2.0.0-beta.5",
3535
"@tauri-apps/plugin-shell": "2.0.0-beta.5",
3636
"@vee-validate/rules": "4.12.7",
37-
"axios": "^0.21.1",
37+
"axios": "^0.28.0",
3838
"chart.js": "3.3.2",
3939
"dayjs": "^1.11.10",
4040
"echarts": "5.4.3",

‎gui/src/components/common/Empty.vue

Lines changed: 17 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,13 @@
11
<script setup>
22
import { ref } from "vue";
33
import freeSvg from "@/assets/img/free.svg";
4+
import accessSvg from "@/assets/img/asset-access.svg";
5+
import errorSvg from "@/assets/img/asset-error.svg";
46
const props = defineProps({
7+
error: {
8+
type: Object,
9+
default: () => {}
10+
},
511
title: {
612
type: String,
713
default: ''
@@ -13,7 +19,17 @@ const props = defineProps({
1319
});
1420
</script>
1521
<template>
16-
<div class="w-full text-center empty-result">
22+
<div v-if="props.error?.status == 403 || props.error?.response?.status == 403" class="w-full text-center empty-result mt-4">
23+
<img :src="accessSvg" class="w-4 h-4 mx-aut" style="margin: auto;" />
24+
<h5 class="text-tip">{{props.error?.response?.statusText||"Forbidden"}}</h5>
25+
<p>{{props.error?.message}}</p>
26+
</div>
27+
<div v-else-if="props.error?.status >= 400 || props.error?.response?.status >= 400" class="w-full text-center empty-result mt-4">
28+
<img :src="errorSvg" class="w-4 h-4 mx-aut" style="margin: auto;" />
29+
<h5 class="text-tip">{{props.error?.response?.statusText||"Forbidden"}}</h5>
30+
<p>{{props.error?.message}}</p>
31+
</div>
32+
<div v-else class="w-full text-center empty-result mt-4">
1733
<img :src="freeSvg" class="w-4 h-4 mx-aut" style="margin: auto;" />
1834
<h5 class="text-tip">{{props.title||'No data.'}}</h5>
1935
<p>{{props.sub}}</p>

‎gui/src/service/common/request.js

Lines changed: 54 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,15 @@ async function request(url, method, params, config) {
4545
if(!window.__TAURI_INTERNALS__){
4646
switch (method) {
4747
case METHOD.GET:
48-
return axios.get(getUrl(url), { params, ...config }).then((res) => res?.data);
48+
return axios.get(getUrl(url), { params, ...config }).then((res) => {
49+
if (res.status >= 400) {
50+
const error = new Error(res.message);
51+
error.status = res.status;
52+
return Promise.reject(error);
53+
} else {
54+
return res?.data;
55+
}
56+
});
4957
case METHOD.POST:
5058
return axios.post(getUrl(url), params, config).then((res) => res?.data).catch((e)=>{
5159
toastMessage(e);
@@ -59,7 +67,15 @@ async function request(url, method, params, config) {
5967
toastMessage(e);
6068
});
6169
default:
62-
return axios.get(getUrl(url), { params, ...config }).then((res) => res?.data);
70+
return axios.get(getUrl(url), { params, ...config }).then((res) => {
71+
if (res.status >= 400) {
72+
const error = new Error(res.message);
73+
error.status = res.status;
74+
return Promise.reject(error);
75+
} else {
76+
return res?.data;
77+
}
78+
});
6379
}
6480
} else {
6581
return fetch(getUrl(url), {
@@ -69,7 +85,15 @@ async function request(url, method, params, config) {
6985
},
7086
body: !!params?JSON.stringify(params):null,
7187
...config
72-
}).then((res) => res.json()).catch((e)=>{
88+
}).then((res) => res.json()).then((res) => {
89+
if (res.status >= 400) {
90+
const error = new Error(res.message);
91+
error.status = res.status;
92+
return Promise.reject(error);
93+
} else {
94+
return res;
95+
}
96+
}).catch((e)=>{
7397
if(!!method && method != METHOD.GET){
7498
toastMessage(e);
7599
}
@@ -81,7 +105,15 @@ async function requestNM(url, method, params, config) {
81105
if(!window.__TAURI_INTERNALS__){
82106
switch (method) {
83107
case METHOD.GET:
84-
return axios.get(getUrl(url), { params, ...config }).then((res) => res?.data);
108+
return axios.get(getUrl(url), { params, ...config }).then((res) => {
109+
if (res.status >= 400) {
110+
const error = new Error(res.message);
111+
error.status = res.status;
112+
return Promise.reject(error);
113+
} else {
114+
return res?.data;
115+
}
116+
});
85117
case METHOD.POST:
86118
return axios.post(getUrl(url), params, config).then((res) => res?.data).catch((e)=>{
87119
//toastMessage(e);
@@ -95,7 +127,15 @@ async function requestNM(url, method, params, config) {
95127
//toastMessage(e);
96128
});
97129
default:
98-
return axios.get(getUrl(url), { params, ...config }).then((res) => res?.data);
130+
return axios.get(getUrl(url), { params, ...config }).then((res) => {
131+
if (res.status >= 400) {
132+
const error = new Error(res.message);
133+
error.status = res.status;
134+
return Promise.reject(error);
135+
} else {
136+
return res?.data;
137+
}
138+
});
99139
}
100140
} else {
101141
return fetch(getUrl(url), {
@@ -105,7 +145,15 @@ async function requestNM(url, method, params, config) {
105145
},
106146
body: !!params?JSON.stringify(params):null,
107147
...config
108-
}).then((res) => res.json()).catch((e)=>{
148+
}).then((res) => res.json()).then((res) => {
149+
if (res.status >= 400) {
150+
const error = new Error(res.message);
151+
error.status = res.status;
152+
return Promise.reject(error);
153+
} else {
154+
return res;
155+
}
156+
}).catch((e)=>{
109157
if(!!method && method != METHOD.GET){
110158
//toastMessage(e);
111159
}

‎gui/src/views/mesh/Endpoints.vue

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,7 @@ const emptyMsg = computed(()=>{
9292
<template>
9393
9494
<div class="flex flex-row">
95-
<div :class="{'w-22rem':!!selectEp,'w-full':!selectEp,'mobile-hidden':!!selectEp}">
95+
<div class="relative" :class="{'w-22rem':!!selectEp,'w-full':!selectEp,'mobile-hidden':!!selectEp}">
9696
<AppHeader :main="true">
9797
<template #center>
9898
<b>{{isChat?'Contacts':'Endpoints'}} ({{endpoints.length}})</b>
@@ -103,7 +103,8 @@ const emptyMsg = computed(()=>{
103103
</template>
104104
</AppHeader>
105105
<Loading v-if="loading"/>
106-
<DataView v-else-if="endpoints && endpoints.length >0" class="message-list" :value="endpoints">
106+
<ScrollPanel class="w-full absolute" style="top:35px;bottom: 0;" v-else-if="endpoints && endpoints.length >0">
107+
<DataView class="message-list" :value="endpoints">
107108
<template #list="slotProps">
108109
<div class="flex flex-col message-item pointer" v-for="(node, index) in slotProps.items" :key="index" @click="select(node)">
109110
<div class="flex flex-col py-3 px-3 gap-4 w-full" :class="{ 'border-t border-surface-200 dark:border-surface-700': index !== 0 }">
@@ -124,6 +125,7 @@ const emptyMsg = computed(()=>{
124125
</div>
125126
</template>
126127
</DataView>
128+
</ScrollPanel>
127129
<Empty v-else :title="emptyMsg"/>
128130
</div>
129131

‎gui/src/views/mesh/Ports.vue

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,7 @@ const getEndpoints = () => {
5050
})
5151
.catch(err => console.log('Request Failed', err));
5252
}
53+
const error = ref();
5354
const getPorts = () => {
5455
const _ep = props.embed?props.ep:selectedMesh.value?.agent?.id;
5556
if(!!_ep){
@@ -67,9 +68,11 @@ const getPorts = () => {
6768
setTimeout(() => {
6869
loader.value = false;
6970
},1400)
71+
error.value = null;
7072
ports.value = res || [];
7173
})
7274
.catch(err => {
75+
error.value = err;
7376
loading.value = false;
7477
loader.value = false;
7578
});
@@ -86,9 +89,11 @@ watch(()=>selectedMesh,()=>{
8689
immediate:true
8790
})
8891
const portsFilter = computed(() => {
89-
return ports.value.filter((port)=>{
92+
console.log(typeof(ports.value))
93+
console.log(ports.value)
94+
return !!ports.value?ports.value.filter((port)=>{
9095
return (typing.value == '' || typing.value == port.target.service|| typing.value == port.listen.port );
91-
})
96+
}):[]
9297
});
9398
9499
const typing = ref('');
@@ -113,7 +118,7 @@ const emptyMsg = computed(()=>{
113118
<Button icon="pi pi-refresh" text @click="getPorts" :loading="loader"/>
114119
</template>
115120
</AppHeader>
116-
<Card class="nopd">
121+
<Card class="nopd" v-if="!error">
117122
<template #content>
118123
<InputGroup class="search-bar" >
119124
<Button :disabled="!typing" icon="pi pi-search" :label="selectedMesh?.name" />
@@ -178,7 +183,7 @@ const emptyMsg = computed(()=>{
178183
</div>
179184
</div>
180185
</div>
181-
<Empty v-else :title="emptyMsg"/>
186+
<Empty v-else :title="emptyMsg" :error="error"/>
182187
</template>
183188
184189
<style scoped lang="scss">

‎gui/src/views/mesh/Services.vue

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,7 @@ const getEndpoints = () => {
6868
})
6969
.catch(err => console.log('Request Failed', err));
7070
}
71-
71+
const error = ref();
7272
const getServices = () => {
7373
visibleEditor.value = false;
7474
loading.value = true;
@@ -85,9 +85,15 @@ const getServices = () => {
8585
setTimeout(() => {
8686
loader.value = false;
8787
},2000)
88+
error.value = null;
8889
services.value = res || [];
8990
})
90-
.catch(err => console.log('Request Failed', err));
91+
.catch(err => {
92+
loading.value = false;
93+
loader.value = false;
94+
error.value = err;
95+
console.log('Request Failed', err)
96+
});
9197
}
9298
}
9399
@@ -98,7 +104,7 @@ const getPorts = () => {
98104
ep:props.embed?props.ep:selectedMesh.value?.agent?.id
99105
})
100106
.then(res => {
101-
res.forEach((port)=>{
107+
(res||[]).forEach((port)=>{
102108
portMap.value[`${port.target?.service}-${port.target?.endpoint||''}`] = `${port.listen.ip}:${port.listen.port}:${port.protocol}`;
103109
})
104110
})
@@ -254,7 +260,7 @@ const emptyMsg = computed(()=>{
254260
<Button icon="pi pi-plus" :label="visibleEditor?null:'Create'" @click="() => visibleEditor = true"/>
255261
</template>
256262
</AppHeader>
257-
<Card class="nopd">
263+
<Card class="nopd" v-if="!error">
258264
<template #content>
259265
<InputGroup class="search-bar" >
260266
<Button :disabled="!typing" icon="pi pi-search" :label="props.embed?null:selectedMesh?.name"/>
@@ -400,7 +406,7 @@ const emptyMsg = computed(()=>{
400406
</div>
401407
<Menu ref="actionMenu" :model="actions" :popup="true" />
402408
</div>
403-
<Empty v-else :title="emptyMsg"/>
409+
<Empty v-else :title="emptyMsg" :error="error"/>
404410
</div>
405411
<div class="flex-item" v-if="!!visibleEditor">
406412
<div class="shadow mobile-fixed">

‎pipy

Submodule pipy updated 296 files

0 commit comments

Comments
 (0)