mirror of
https://github.com/open-webui/open-webui
synced 2025-06-13 09:55:04 +00:00
enh: upload audio
This commit is contained in:
parent
62366ad020
commit
d8e9b000e3
19
src/lib/components/icons/ArrowUpTray.svelte
Normal file
19
src/lib/components/icons/ArrowUpTray.svelte
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
export let className = 'size-4';
|
||||||
|
export let strokeWidth = '1.5';
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
fill="none"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
stroke-width={strokeWidth}
|
||||||
|
stroke="currentColor"
|
||||||
|
class={className}
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5m-13.5-9L12 3m0 0 4.5 4.5M12 3v13.5"
|
||||||
|
/>
|
||||||
|
</svg>
|
19
src/lib/components/icons/DocumentArrowUp.svelte
Normal file
19
src/lib/components/icons/DocumentArrowUp.svelte
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
export let className = 'size-4';
|
||||||
|
export let strokeWidth = '1.5';
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
fill="none"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
stroke-width={strokeWidth}
|
||||||
|
stroke="currentColor"
|
||||||
|
class={className}
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-linejoin="round"
|
||||||
|
d="M19.5 14.25v-2.625a3.375 3.375 0 0 0-3.375-3.375h-1.5A1.125 1.125 0 0 1 13.5 7.125v-1.5a3.375 3.375 0 0 0-3.375-3.375H8.25m6.75 12-3-3m0 0-3 3m3-3v6m-1.5-15H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 0 0-9-9Z"
|
||||||
|
/>
|
||||||
|
</svg>
|
@ -445,6 +445,21 @@
|
|||||||
|
|
||||||
recording = true;
|
recording = true;
|
||||||
}}
|
}}
|
||||||
|
onUpload={async () => {
|
||||||
|
const input = document.createElement('input');
|
||||||
|
input.type = 'file';
|
||||||
|
input.accept = 'audio/*';
|
||||||
|
input.multiple = false;
|
||||||
|
input.click();
|
||||||
|
|
||||||
|
input.onchange = async (e) => {
|
||||||
|
const files = e.target.files;
|
||||||
|
|
||||||
|
if (files && files.length > 0) {
|
||||||
|
await uploadFileHandler(files[0]);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
<button
|
<button
|
||||||
class="cursor-pointer p-2.5 flex rounded-full border border-gray-50 dark:border-none dark:bg-gray-850 hover:bg-gray-50 dark:hover:bg-gray-800 transition shadow-xl"
|
class="cursor-pointer p-2.5 flex rounded-full border border-gray-50 dark:border-none dark:bg-gray-850 hover:bg-gray-50 dark:hover:bg-gray-800 transition shadow-xl"
|
||||||
|
@ -4,12 +4,11 @@
|
|||||||
|
|
||||||
import { showSettings, activeUserIds, USAGE_POOL, mobile, showSidebar, user } from '$lib/stores';
|
import { showSettings, activeUserIds, USAGE_POOL, mobile, showSidebar, user } from '$lib/stores';
|
||||||
import { fade, slide } from 'svelte/transition';
|
import { fade, slide } from 'svelte/transition';
|
||||||
import { userSignOut } from '$lib/apis/auths';
|
|
||||||
|
|
||||||
import Tooltip from '$lib/components/common/Tooltip.svelte';
|
|
||||||
import ArchiveBox from '$lib/components/icons/ArchiveBox.svelte';
|
|
||||||
import Mic from '../icons/Mic.svelte';
|
import Mic from '../icons/Mic.svelte';
|
||||||
import CursorArrowRays from '../icons/CursorArrowRays.svelte';
|
import CursorArrowRays from '../icons/CursorArrowRays.svelte';
|
||||||
|
import DocumentArrowUp from '../icons/DocumentArrowUp.svelte';
|
||||||
|
import CloudArrowUp from '../icons/CloudArrowUp.svelte';
|
||||||
|
|
||||||
const i18n = getContext('i18n');
|
const i18n = getContext('i18n');
|
||||||
|
|
||||||
@ -18,6 +17,7 @@
|
|||||||
|
|
||||||
export let onRecord = () => {};
|
export let onRecord = () => {};
|
||||||
export let onCaptureAudio = () => {};
|
export let onCaptureAudio = () => {};
|
||||||
|
export let onUpload = () => {};
|
||||||
|
|
||||||
const dispatch = createEventDispatcher();
|
const dispatch = createEventDispatcher();
|
||||||
</script>
|
</script>
|
||||||
@ -65,6 +65,19 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class=" self-center truncate">{$i18n.t('Capture Audio')}</div>
|
<div class=" self-center truncate">{$i18n.t('Capture Audio')}</div>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
<button
|
||||||
|
class="flex rounded-md py-2 px-3 w-full hover:bg-gray-50 dark:hover:bg-gray-800 transition"
|
||||||
|
on:click={() => {
|
||||||
|
onUpload();
|
||||||
|
show = false;
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div class=" self-center mr-2">
|
||||||
|
<CloudArrowUp className="size-5" strokeWidth="1.5" />
|
||||||
|
</div>
|
||||||
|
<div class=" self-center truncate">{$i18n.t('Upload Audio')}</div>
|
||||||
|
</button>
|
||||||
</DropdownMenu.Content>
|
</DropdownMenu.Content>
|
||||||
</slot>
|
</slot>
|
||||||
</DropdownMenu.Root>
|
</DropdownMenu.Root>
|
||||||
|
Loading…
Reference in New Issue
Block a user