mia/FoundKey
1
0
Fork 0
forked from FoundKeyGang/FoundKey
Code Issues Pull requests Projects Releases Packages Wiki Activity

refactor API console

Browse source 
Refactor to use $ref sugar.

Also forego the API call to fetch endpoint information if the endpoint
name is not in the list of available endpoints that has already been
fetched.
This commit is contained in:
Johann150 2022-10-18 22:04:42 +02:00
parent fed41d8d15
commit f0f673843e
Signed by untrusted user: Johann150
GPG key ID: 9EE6577A2A06F8F1
1 changed files with 18 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
packages/client/src/pages/api-console.vue
View file

@ -29,7 +29,6 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref } from 'vue';
import JSON5 from 'json5'; import JSON5 from 'json5';
import { Endpoints } from 'foundkey-js'; import { Endpoints } from 'foundkey-js';
import MkButton from '@/components/ui/button.vue'; import MkButton from '@/components/ui/button.vue';
@ -39,31 +38,33 @@ import MkSwitch from '@/components/form/switch.vue';
import * as os from '@/os'; import * as os from '@/os';
import { definePageMetadata } from '@/scripts/page-metadata'; import { definePageMetadata } from '@/scripts/page-metadata';
const body = ref('{}'); let body = $ref('{}');
const endpoint = ref(''); let endpoint = $ref('');
const endpoints = ref<any[]>([]); let endpoints = $ref<any[]>([]);
const sending = ref(false); let sending = $ref(false);
const res = ref(''); let res = $ref('');
const withCredential = ref(true); let withCredential = $ref(true);
os.api('endpoints').then(endpointResponse => { os.api('endpoints').then(endpointResponse => {
endpoints.value = endpointResponse; endpoints = endpointResponse;
}); });
function send(): void { function send(): void {
sending.value = true; sending = true;
const requestBody = JSON5.parse(body.value); const requestBody = JSON5.parse(body);
os.api(endpoint.value as keyof Endpoints, requestBody, requestBody.i || (withCredential.value ? undefined : null)).then(resp => { os.api(endpoint as keyof Endpoints, requestBody, requestBody.i || (withCredential ? undefined : null)).then(resp => {
sending.value = false; sending = false;
res.value = JSON5.stringify(resp, null, 2); res = JSON5.stringify(resp, null, 2);
}, err => { }, err => {
sending.value = false; sending = false;
res.value = JSON5.stringify(err, null, 2); res = JSON5.stringify(err, null, 2);
}); });
} }
function onEndpointChange(): void { function onEndpointChange(): void {
os.api('endpoint', { endpoint: endpoint.value }, withCredential.value ? undefined : null).then(resp => { if (!endpoints.includes(endpoint)) return;
os.api('endpoint', { endpoint }, withCredential ? undefined : null).then(resp => {
const endpointBody = {}; const endpointBody = {};
for (const p of resp.params) { for (const p of resp.params) {
endpointBody[p.name] = endpointBody[p.name] =
@ -74,7 +75,7 @@ function onEndpointChange(): void {
p.type === 'Object' ? {} : p.type === 'Object' ? {} :
null; null;
} }
body.value = JSON5.stringify(endpointBody, null, 2); body = JSON5.stringify(endpointBody, null, 2);
}); });
} }