mirror of
https://gitlab.com/bramw/baserow.git
synced 2025-05-13 04:41:43 +00:00
Resolve "Add user file upload docs to the generated API docs"
This commit is contained in:
Peter Evans
Nigel Gott
parent
f893a027bd
commit
e3ecce1de7
11 changed files with 522 additions and 8 deletions
web-frontend/modules/database/components/docs
|
|
@ -165,6 +165,11 @@ export default {
|
|||
required: false,
|
||||
default: '',
|
||||
},
|
||||
fileRequest: {
|
||||
type: String,
|
||||
required: false,
|
||||
default: '',
|
||||
},
|
||||
request: {
|
||||
type: [Object, Boolean],
|
||||
required: false,
|
||||
|
|
@ -226,6 +231,11 @@ export default {
|
|||
example += '\n-H "Content-Type: application/json" \\'
|
||||
}
|
||||
|
||||
if (this.fileRequest !== '') {
|
||||
index++
|
||||
example += ` \\\n-F file=@${this.fileRequest}`
|
||||
}
|
||||
|
||||
example += `\n${this.url}`
|
||||
|
||||
if (this.request !== false) {
|
||||
|
|
@ -250,6 +260,12 @@ export default {
|
|||
example += `${this.url} HTTP`
|
||||
example += '\nAuthorization: Token YOUR_API_KEY'
|
||||
|
||||
if (this.fileRequest !== '') {
|
||||
example += '\nContent-Length: YOUR_CONTENT_LENGTH'
|
||||
example +=
|
||||
'\nContent-Type: multipart/form-data; boundary=------------------------YOUR_BOUNDARY'
|
||||
}
|
||||
|
||||
if (this.request !== false) {
|
||||
index += 2
|
||||
example += '\nContent-Type: application/json'
|
||||
|
|
@ -263,7 +279,14 @@ export default {
|
|||
},
|
||||
getJavaScriptExample() {
|
||||
let index = 5
|
||||
let example = 'axios({'
|
||||
let example = ''
|
||||
if (this.fileRequest !== '') {
|
||||
example += 'const formData = new FormData()'
|
||||
example += `\nformData.append('file', '${this.fileRequest}')`
|
||||
example += "\naxios.post('/fileupload', formData, {"
|
||||
} else {
|
||||
example = 'axios({'
|
||||
}
|
||||
|
||||
if (this.type !== '') {
|
||||
index++
|
||||
|
|
@ -274,6 +297,11 @@ export default {
|
|||
example += '\n headers: {'
|
||||
example += '\n Authorization: "Token YOUR_API_KEY"'
|
||||
|
||||
if (this.fileRequest !== '') {
|
||||
index++
|
||||
example += ',\n "Content-Type": "multipart/form-data"'
|
||||
}
|
||||
|
||||
if (this.request !== false) {
|
||||
index++
|
||||
example += ',\n "Content-Type": "application/json"'
|
||||
|
|
@ -309,6 +337,11 @@ export default {
|
|||
|
||||
example += '\n }'
|
||||
|
||||
if (this.fileRequest !== '') {
|
||||
index++
|
||||
example += `\n files={'file': open('${this.fileRequest}', 'rb')}`
|
||||
}
|
||||
|
||||
if (this.request !== false) {
|
||||
index++
|
||||
const data = this.format(this.request).split('\n').join('\n ')
|
||||
|
|
|
|||
|
|
@ -125,6 +125,42 @@
|
|||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="api-docs__nav-link"
|
||||
@click.prevent="navigate('section-upload-file')"
|
||||
>{{ $t('apiDocs.fileUploads') }}</a
|
||||
>
|
||||
<ul
|
||||
class="api-docs__nav-sub"
|
||||
:class="{
|
||||
open:
|
||||
navActive === 'section-upload-file' ||
|
||||
navActive === 'section-upload-file-via-url',
|
||||
}"
|
||||
>
|
||||
<li>
|
||||
<a
|
||||
class="api-docs__nav-link"
|
||||
:class="{
|
||||
active: navActive === 'section-upload-file',
|
||||
}"
|
||||
@click.prevent="navigate('section-upload-file')"
|
||||
>{{ $t('apiDocs.uploadFile') }}</a
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="api-docs__nav-link"
|
||||
:class="{
|
||||
active: navActive === 'section-upload-file-via-url',
|
||||
}"
|
||||
@click.prevent="navigate('section-upload-file-via-url')"
|
||||
>{{ $t('apiDocs.uploadFileViaUrl') }}</a
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
class="api-docs__nav-link"
|
||||
|
|
|
|||
|
|
@ -0,0 +1,68 @@
|
|||
<template>
|
||||
<div class="api-docs__item">
|
||||
<div class="api-docs__left">
|
||||
<div class="api-docs__heading-wrapper">
|
||||
<h3 :id="'section-upload-file'" class="api-docs__heading-3">
|
||||
<span>
|
||||
{{ $t('apiDocs.uploadFile') }}
|
||||
</span>
|
||||
</h3>
|
||||
<div class="api-docs__endpoint-type"></div>
|
||||
</div>
|
||||
|
||||
<MarkdownIt
|
||||
tag="p"
|
||||
class="api-docs__content"
|
||||
:content="
|
||||
$t('apiDocsUploadFile.description', {
|
||||
PUBLIC_BACKEND_URL: `${$env.PUBLIC_BACKEND_URL}`,
|
||||
})
|
||||
"
|
||||
/>
|
||||
|
||||
<h4 class="api-docs__heading-4">{{ $t('apiDocs.requestBodySchema') }}</h4>
|
||||
<ul class="api-docs__parameters">
|
||||
<APIDocsParameter name="file" :optional="false" type="multipart">
|
||||
<MarkdownIt
|
||||
class="api-docs__content"
|
||||
:content="$t('apiDocs.uploadFileDescription')"
|
||||
/>
|
||||
</APIDocsParameter>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="api-docs__right">
|
||||
<APIDocsExample
|
||||
:value="value"
|
||||
type="POST"
|
||||
:url="getUploadFileListUrl()"
|
||||
:file-request="getUploadFileExample()"
|
||||
:response="getUploadFileResponse()"
|
||||
:include-user-fields-checkbox="false"
|
||||
@input="$emit('input', $event)"
|
||||
></APIDocsExample>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import APIDocsExample from '@baserow/modules/database/components/docs/APIDocsExample'
|
||||
import APIDocsParameter from '@baserow/modules/database/components/docs/APIDocsParameter'
|
||||
|
||||
export default {
|
||||
name: 'APIDocsUploadFile',
|
||||
components: {
|
||||
APIDocsParameter,
|
||||
APIDocsExample,
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
getUploadFileListUrl: { type: Function, required: true },
|
||||
getUploadFileExample: { type: Function, required: true },
|
||||
getUploadFileResponse: { type: Function, required: true },
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,68 @@
|
|||
<template>
|
||||
<div class="api-docs__item">
|
||||
<div class="api-docs__left">
|
||||
<div class="api-docs__heading-wrapper">
|
||||
<h3 :id="'section-upload-file-via-url'" class="api-docs__heading-3">
|
||||
<span>
|
||||
{{ $t('apiDocs.uploadFileViaUrl') }}
|
||||
</span>
|
||||
</h3>
|
||||
<div class="api-docs__endpoint-type"></div>
|
||||
</div>
|
||||
|
||||
<MarkdownIt
|
||||
tag="p"
|
||||
class="api-docs__content"
|
||||
:content="
|
||||
$t('apiDocsUploadFileViaURL.description', {
|
||||
PUBLIC_BACKEND_URL: `${$env.PUBLIC_BACKEND_URL}`,
|
||||
})
|
||||
"
|
||||
/>
|
||||
|
||||
<h4 class="api-docs__heading-4">{{ $t('apiDocs.requestBodySchema') }}</h4>
|
||||
<ul class="api-docs__parameters">
|
||||
<APIDocsParameter name="url" :optional="false" type="string">
|
||||
<MarkdownIt
|
||||
class="api-docs__content"
|
||||
:content="$t('apiDocs.uploadFileViaUrlDescription')"
|
||||
/>
|
||||
</APIDocsParameter>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="api-docs__right">
|
||||
<APIDocsExample
|
||||
:value="value"
|
||||
type="POST"
|
||||
:url="getUploadFileViaUrlListUrl()"
|
||||
:response="getUploadFileResponse()"
|
||||
:request="getUploadFileViaUrlRequestExample()"
|
||||
:include-user-fields-checkbox="false"
|
||||
@input="$emit('input', $event)"
|
||||
></APIDocsExample>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import APIDocsExample from '@baserow/modules/database/components/docs/APIDocsExample'
|
||||
import APIDocsParameter from '@baserow/modules/database/components/docs/APIDocsParameter'
|
||||
|
||||
export default {
|
||||
name: 'APIDocsUploadFileViaURL',
|
||||
components: {
|
||||
APIDocsParameter,
|
||||
APIDocsExample,
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
type: Object,
|
||||
required: true,
|
||||
},
|
||||
getUploadFileViaUrlListUrl: { type: Function, required: true },
|
||||
getUploadFileViaUrlRequestExample: { type: Function, required: true },
|
||||
getUploadFileResponse: { type: Function, required: true },
|
||||
},
|
||||
}
|
||||
</script>
|
||||
Loading…
Add table
Add a link
Reference in a new issue