Ehrenamt/ff-admin
2
0
Fork 0
Code Issues 11 Pull requests Projects Releases 18 Packages Wiki Activity Actions

image upload and keep if not changed

Browse source
This commit is contained in:
Julian Krauser 2025-04-30 10:43:11 +02:00
parent 91ede95530
commit 939c982c40
2 changed files with 16 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
src/components/admin/management/setting/ClubImageSetting.vue
View file

@ -12,14 +12,14 @@
> >
Kein eigenes Icon ausgewählt Kein eigenes Icon ausgewählt
</div> </div>
<img ref="icon_img" class="hidden w-full h-20 object-contain" /> <img ref="icon_img" class="hidden w-full h-10 object-contain" />
<XMarkIcon <XMarkIcon
v-if="enableEdit && (icon != '' || overwriteIcon)" v-if="enableEdit && (icon != '' || overwriteIcon)"
class="h-5 w-5 cursor-pointer" class="h-5 w-5 cursor-pointer"
@click="resetImage('icon')" @click="resetImage('icon')"
/> />
</div> </div>
<input class="hidden!" type="file" ref="icon" accept="image/*" @change="previewImage('icon')" /> <input class="hidden!" type="file" ref="icon" accept="image/png" @change="previewImage('icon')" />
</div> </div>
<div class="w-full"> <div class="w-full">
<p>Vereins-Logo</p> <p>Vereins-Logo</p>
@ -33,14 +33,14 @@
> >
Kein eigenes Logo ausgewählt Kein eigenes Logo ausgewählt
</div> </div>
<img ref="logo_img" class="hidden w-full h-20 object-contain" /> <img ref="logo_img" class="hidden w-full h-10 object-contain" />
<XMarkIcon <XMarkIcon
v-if="enableEdit && (logo != '' || overwriteLogo)" v-if="enableEdit && (logo != '' || overwriteLogo)"
class="h-5 w-5 cursor-pointer" class="h-5 w-5 cursor-pointer"
@click="resetImage('logo')" @click="resetImage('logo')"
/> />
</div> </div>
<input class="hidden!" type="file" ref="logo" accept="image/*" @change="previewImage('logo')" /> <input class="hidden!" type="file" ref="logo" accept="image/png" @change="previewImage('logo')" />
</div> </div>
</BaseSetting> </BaseSetting>
</template> </template>
@ -135,11 +135,15 @@ export default defineComponent({
return this.uploadImage([ return this.uploadImage([
{ {
key: "club.icon", key: "club.icon",
value: (this.$refs.icon as HTMLInputElement).files?.[0], value:
(this.$refs.icon as HTMLInputElement).files?.[0] ??
(this.icon != "" && !this.overwriteIcon ? "keep" : undefined),
}, },
{ {
key: "club.logo", key: "club.logo",
value: (this.$refs.logo as HTMLInputElement).files?.[0], value:
(this.$refs.logo as HTMLInputElement).files?.[0] ??
(this.logo != "" && !this.overwriteLogo ? "keep" : undefined),
}, },
]); ]);
}, },

8
src/stores/admin/management/setting.ts
View file

@ -74,10 +74,14 @@ export const useSettingStore = defineStore("setting", {
return res; return res;
}); });
}, },
async uploadImage(data: { key: "club.logo" | "club.icon"; value?: File }[]): Promise<AxiosResponse<any, any>> { async uploadImage(
data: { key: "club.logo" | "club.icon"; value?: File | "keep" }[]
): Promise<AxiosResponse<any, any>> {
const formData = new FormData(); const formData = new FormData();
for (let entry of data) { for (let entry of data) {
if (entry.value) formData.append(entry.key, entry.value); if (entry.value) {
formData.append(typeof entry.value == "string" ? entry.key : entry.key.split(".")[1], entry.value);
}
} }
return await http return await http
.put("/admin/setting/images", formData, { .put("/admin/setting/images", formData, {