next/components/story/create/uploadOrPaste.vue

50 lines
1.6 KiB
Vue

<script lang="ts" setup>
import { useField } from "vee-validate";
import { story } from "@client/editorConfig";
import icon from "~/components/icon.vue";
import baseEditor from "../../baseEditor.vue";
const fname = inject<string>("curName");
const fileList = ref([]);
const potField = useField(fname + "pot");
const fileField = useField(fname + "file");
const { value: pvalue } = potField;
</script>
<template>
<a-radio-group v-model:value="pvalue">
<a-radio value="pasteOrType" :data-testid="$attrs['data-testid'] + '.radio.pasteOrType'">Paste or type content</a-radio>
<a-radio value="upload" :data-testid="$attrs['data-testid'] + '.radio.upload'">Upload a file</a-radio>
</a-radio-group>
<br />
<br />
<base-editor :data-testid="$attrs['data-testid'] + '.type'" label="" v-if="pvalue === 'pasteOrType'" :init="story" :name="fname + 'content'" />
<a-upload
v-model:file-list="fileList"
:data-testid="$attrs['data-testid'] + '.upload'"
v-else-if="pvalue === 'upload'"
:name="fname + 'file'"
accept=".doc,.docx,.md,.markdown"
:max-count="1"
action="/api/upload/content"
method="post"
@reject="(a) => console.error(a)"
@change="
(bap) => {
console.log(bap);
let resp;
try {
resp = bap.file.response;
console.log('RESPONSE', resp);
if (resp.success) {
fileField.setValue(resp.fileName);
console.log(fileField.value);
}
} catch (e) {
console.warn('not yet');
}
}
"
>
<a-button type="primary"> <icon istyle="regular" name="upload" /><span style="margin-left: 0.5em"> Upload a file</span> </a-button>
</a-upload>
</template>