feat: branch upload image preview
This commit is contained in:
parent
981f779e1e
commit
5c1cc88a48
1 changed files with 9 additions and 0 deletions
|
|
@ -16,14 +16,23 @@ import { useI18n } from 'vue-i18n';
|
||||||
import BranchCard from 'src/components/01_branch-management/BranchCard.vue';
|
import BranchCard from 'src/components/01_branch-management/BranchCard.vue';
|
||||||
|
|
||||||
const profileFile = ref<File | undefined>(undefined);
|
const profileFile = ref<File | undefined>(undefined);
|
||||||
|
const imageUrl = ref<string | null>();
|
||||||
|
|
||||||
const inputFile = (() => {
|
const inputFile = (() => {
|
||||||
const element = document.createElement('input');
|
const element = document.createElement('input');
|
||||||
element.type = 'file';
|
element.type = 'file';
|
||||||
element.accept = 'image/*';
|
element.accept = 'image/*';
|
||||||
|
|
||||||
|
const reader = new FileReader();
|
||||||
|
reader.addEventListener('load', () => {
|
||||||
|
if (typeof reader.result === 'string') imageUrl.value = reader.result;
|
||||||
|
});
|
||||||
|
|
||||||
element.addEventListener('change', () => {
|
element.addEventListener('change', () => {
|
||||||
profileFile.value = element.files?.[0];
|
profileFile.value = element.files?.[0];
|
||||||
|
if (profileFile.value) {
|
||||||
|
reader.readAsDataURL(profileFile.value);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
return element;
|
return element;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue