case 4602 - logo and attachment forms: upload and delete only shown when usable

Business logos: file choosers only with change rights on global settings,
Upload only once a file is chosen (cleared after upload), Delete only for a
logo that exists (image load / error). Removed the unused, undeclared
readOnly. Attachments: Upload only once a file is selected.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
2026-10-26 10:11:35 -07:00
parent f2f10b819b
commit 439de1500f
2 changed files with 68 additions and 22 deletions

View File

@@ -115,9 +115,13 @@
v-model="notes"
:label="$ay.t('AttachmentNotes')"
></v-text-field>
<v-btn color="primary" text @click="upload">{{
$ay.t("Upload")
}}</v-btn>
<v-btn
v-if="uploadFiles && uploadFiles.length > 0"
color="primary"
text
@click="upload"
>{{ $ay.t("Upload") }}</v-btn
>
</div>
</v-tab-item>
</v-tabs-items>

View File

@@ -16,8 +16,11 @@
class="grey lighten-2"
:src="smallUrl"
:alt="$ay.t('SmallLogo')"
@load="hasSmall = true"
@error="hasSmall = false"
/>
<v-file-input
v-if="rights.change"
v-model="uploadSmall"
dense
accept="image/*"
@@ -26,20 +29,31 @@
:rules="rules"
data-cy="uploadSmall"
></v-file-input>
<v-btn color="primary" text @click="remove('small')">{{
$ay.t("Delete")
}}</v-btn>
<v-btn color="primary" text @click="upload('small')">{{
$ay.t("Upload")
}}</v-btn>
<v-btn
v-if="rights.change && hasSmall"
color="primary"
text
@click="remove('small')"
>{{ $ay.t("Delete") }}</v-btn
>
<v-btn
v-if="rights.change && uploadSmall"
color="primary"
text
@click="upload('small')"
>{{ $ay.t("Upload") }}</v-btn
>
</v-col>
<v-col cols="12" class="mt-10">
<img
class="mt-10 grey lighten-2"
:src="mediumUrl"
:alt="$ay.t('MediumLogo')"
@load="hasMedium = true"
@error="hasMedium = false"
/>
<v-file-input
v-if="rights.change"
v-model="uploadMedium"
dense
accept="image/*"
@@ -47,20 +61,31 @@
:label="$ay.t('MediumLogo')"
:rules="rules"
></v-file-input>
<v-btn color="primary" text @click="remove('medium')">{{
$ay.t("Delete")
}}</v-btn>
<v-btn color="primary" text @click="upload('medium')">{{
$ay.t("Upload")
}}</v-btn>
<v-btn
v-if="rights.change && hasMedium"
color="primary"
text
@click="remove('medium')"
>{{ $ay.t("Delete") }}</v-btn
>
<v-btn
v-if="rights.change && uploadMedium"
color="primary"
text
@click="upload('medium')"
>{{ $ay.t("Upload") }}</v-btn
>
</v-col>
<v-col cols="12" class="mt-10">
<img
class="mt-10 grey lighten-2"
:src="largeUrl"
:alt="$ay.t('LargeLogo')"
@load="hasLarge = true"
@error="hasLarge = false"
/>
<v-file-input
v-if="rights.change"
v-model="uploadLarge"
dense
accept="image/*"
@@ -68,12 +93,20 @@
:label="$ay.t('LargeLogo')"
:rules="rules"
></v-file-input>
<v-btn color="primary" text @click="remove('large')">{{
$ay.t("Delete")
}}</v-btn>
<v-btn color="primary" text @click="upload('large')">{{
$ay.t("Upload")
}}</v-btn>
<v-btn
v-if="rights.change && hasLarge"
color="primary"
text
@click="remove('large')"
>{{ $ay.t("Delete") }}</v-btn
>
<v-btn
v-if="rights.change && uploadLarge"
color="primary"
text
@click="upload('large')"
>{{ $ay.t("Upload") }}</v-btn
>
</v-col>
</v-row>
</v-form>
@@ -94,6 +127,10 @@ export default {
mediumUrl: null,
largeUrl: null,
smallUrl: null,
//case 4602: Delete is shown only for a logo that exists (set by the image's load / error)
hasSmall: false,
hasMedium: false,
hasLarge: false,
fileSizeExceededWarning: "",
formState: {
ready: false,
@@ -119,7 +156,6 @@ export default {
try {
await initForm(vm);
vm.formState.ready = true;
vm.readOnly = !vm.rights.change;
window.$gz.eventBus.$on("menu-click", clickHandler);
//NOTE: this would normally be in getDataFromAPI but this form doesn't really need that function so doing it here
generateMenu(vm);
@@ -171,12 +207,15 @@ export default {
switch (size) {
case "small":
vm.smallUrl = `${window.$gz.api.logoUrl(size)}?x=${Date.now()}`;
vm.uploadSmall = null;
break;
case "medium":
vm.mediumUrl = `${window.$gz.api.logoUrl(size)}?x=${Date.now()}`;
vm.uploadMedium = null;
break;
case "large":
vm.largeUrl = `${window.$gz.api.logoUrl(size)}?x=${Date.now()}`;
vm.uploadLarge = null;
break;
default:
return;
@@ -207,12 +246,15 @@ export default {
switch (size) {
case "small":
vm.smallUrl = null;
vm.hasSmall = false;
break;
case "medium":
vm.mediumUrl = null;
vm.hasMedium = false;
break;
case "large":
vm.largeUrl = null;
vm.hasLarge = false;
break;
default:
return;