diff --git a/fs_image/static/src/scss/fsimage_field.scss b/fs_image/static/src/scss/fsimage_field.scss
index e69de29bb2..053fd35479 100644
--- a/fs_image/static/src/scss/fsimage_field.scss
+++ b/fs_image/static/src/scss/fsimage_field.scss
@@ -0,0 +1,5 @@
+.fs_file_download_button {
+ top: 10% !important;
+ left: 50% !important;
+ position: absolute !important;
+}
diff --git a/fs_image/static/src/views/fields/fsimage_field.esm.js b/fs_image/static/src/views/fields/fsimage_field.esm.js
index 053e6fe4a2..fe811f2eec 100644
--- a/fs_image/static/src/views/fields/fsimage_field.esm.js
+++ b/fs_image/static/src/views/fields/fsimage_field.esm.js
@@ -11,6 +11,7 @@ import {
} from "@web/views/fields/image/image_field";
import {AltTextDialog} from "../dialogs/alttext_dialog.esm";
import {_t} from "@web/core/l10n/translation";
+import {download, downloadFile} from "@web/core/network/download";
import {registry} from "@web/core/registry";
import {useService} from "@web/core/utils/hooks";
import {url as utilUrl} from "@web/core/utils/urls";
@@ -80,6 +81,27 @@ export class FSImageField extends ImageField {
};
this.dialogService.add(AltTextDialog, dialogProps);
}
+ async onFileDownload() {
+ if (this.props.value.content) {
+ const magic = fileTypeMagicWordMap[this.props.value.content[0]] || "png";
+ await downloadFile(
+ `data:image/${magic};base64,${this.props.value.content}`,
+ this.state.filename,
+ `image/${magic}`
+ );
+ } else {
+ await download({
+ data: {
+ model: this.props.record.resModel,
+ id: this.props.record.resId,
+ field: this.props.name,
+ filename: this.state.filename || "download",
+ download: true,
+ },
+ url: "/web/image",
+ });
+ }
+ }
}
FSImageField.template = "fs_image.FSImageField";
diff --git a/fs_image/static/src/views/fields/fsimage_field.xml b/fs_image/static/src/views/fields/fsimage_field.xml
index 511bdd7cd9..743c03eed8 100644
--- a/fs_image/static/src/views/fields/fsimage_field.xml
+++ b/fs_image/static/src/views/fields/fsimage_field.xml
@@ -23,24 +23,24 @@
-
-
+
+
+
+
@@ -59,6 +59,16 @@
t-att-data-tooltip-info="hasTooltip and tooltipAttributes.info"
t-att-data-tooltip-delay="hasTooltip and props.zoomDelay"
/>
+
+