mirror/hotomoe
1
0
Fork 0
mirror of https://github.com/hotomoe/hotomoe synced 2024-11-24 23:26:17 +09:00
Code

refactor(client): refactor api-console to use Composition API (#8566)

Browse Source
This commit is contained in:
Andreas Nedbal 2022-04-29 03:21:02 +02:00 committed by GitHub
parent 6a44616725
commit 8f32064fea
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 43 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

98
packages/client/src/pages/api-console.vue
View File

@ -25,8 +25,8 @@
</MkSpacer>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
<script lang="ts" setup>
import { defineExpose, ref } from 'vue';
import * as JSON5 from 'json5';
import MkButton from '@/components/ui/button.vue';
import MkInput from '@/components/form/input.vue';
@ -34,63 +34,51 @@ import MkTextarea from '@/components/form/textarea.vue';
import MkSwitch from '@/components/form/switch.vue';
import * as os from '@/os';
import * as symbols from '@/symbols';
import { Endpoints } from 'misskey-js';
export default defineComponent({
components: {
MkButton, MkInput, MkTextarea, MkSwitch,
},
const body = ref('{}');
const endpoint = ref('');
const endpoints = ref<any[]>([]);
const sending = ref(false);
const res = ref('');
const withCredential = ref(true);
data() {
return {
[symbols.PAGE_INFO]: {
title: 'API console',
icon: 'fas fa-terminal'
},
os.api('endpoints').then(endpointResponse => {
endpoints.value = endpointResponse;
});
endpoint: '',
body: '{}',
res: null,
sending: false,
endpoints: [],
withCredential: true,
function send() {
sending.value = true;
const requestBody = JSON5.parse(body.value);
os.api(endpoint.value as keyof Endpoints, requestBody, requestBody.i || (withCredential.value ? undefined : null)).then(resp => {
sending.value = false;
res.value = JSON5.stringify(resp, null, 2);
}, err => {
sending.value = false;
res.value = JSON5.stringify(err, null, 2);
});
}
};
},
created() {
os.api('endpoints').then(endpoints => {
this.endpoints = endpoints;
});
},
methods: {
send() {
this.sending = true;
const body = JSON5.parse(this.body);
os.api(this.endpoint, body, body.i || (this.withCredential ? undefined : null)).then(res => {
this.sending = false;
this.res = JSON5.stringify(res, null, 2);
}, err => {
this.sending = false;
this.res = JSON5.stringify(err, null, 2);
});
},
onEndpointChange() {
os.api('endpoint', { endpoint: this.endpoint }, this.withCredential ? undefined : null).then(endpoint => {
const body = {};
for (const p of endpoint.params) {
body[p.name] =
p.type === 'String' ? '' :
p.type === 'Number' ? 0 :
p.type === 'Boolean' ? false :
p.type === 'Array' ? [] :
p.type === 'Object' ? {} :
null;
}
this.body = JSON5.stringify(body, null, 2);
});
function onEndpointChange() {
os.api('endpoint', { endpoint: endpoint.value }, withCredential.value ? undefined : null).then(resp => {
const endpointBody = {};
for (const p of resp.params) {
endpointBody[p.name] =
p.type === 'String' ? '' :
p.type === 'Number' ? 0 :
p.type === 'Boolean' ? false :
p.type === 'Array' ? [] :
p.type === 'Object' ? {} :
null;
}
}
body.value = JSON5.stringify(endpointBody, null, 2);
});
}
defineExpose({
[symbols.PAGE_INFO]: {
title: 'API console',
icon: 'fas fa-terminal'
},
});
</script>