From 4401c1d77d00e5aae1c4b7c56c4d93e6cf1023ef Mon Sep 17 00:00:00 2001
From: Elsio Sanchez <45974454+elsiosanchez@users.noreply.github.com>
Date: Sun, 21 Mar 2021 19:19:07 -0400
Subject: [PATCH] Support Binary (#670)

* add services binary

* search for server image and use image service to view it

* add request Resource

* fix error and rename service

* rename service

Co-authored-by: Elsio Sanchez <elsiosanche@gmail.com>
---
 src/api/ADempiere/field/binary.js             | 36 ++++++++++++
 src/components/ADempiere/Field/FieldImage.vue | 56 ++++++++++++++++++-
 2 files changed, 91 insertions(+), 1 deletion(-)
 create mode 100644 src/api/ADempiere/field/binary.js

diff --git a/src/api/ADempiere/field/binary.js b/src/api/ADempiere/field/binary.js
new file mode 100644
index 00000000..5d436c70
--- /dev/null
+++ b/src/api/ADempiere/field/binary.js
@@ -0,0 +1,36 @@
+/**
+ * Get entity with binary by identifier
+ * @param {string} tableName
+ * @param {string} recordUuid
+ */
+export function getResource({
+  uuid,
+  tableName
+}) {
+  const { requestGetEntity } = require('@/api/ADempiere/persistence.js')
+
+  return requestGetEntity({
+    recordUuid: uuid,
+    tableName
+  })
+}
+
+/**
+ * Update an existing binary by id or uuid
+ * @param {string} tableName
+ * @param {string} recordUuid
+ * @param {object} binaryFile
+ */
+export function updateResource({
+  uuid,
+  tableName,
+  binaryFile
+}) {
+  const { requestUpdateEntity } = require('@/api/ADempiere/persistence.js')
+
+  return requestUpdateEntity({
+    recordUuid: uuid,
+    tableName,
+    attributesList: binaryFile
+  })
+}
diff --git a/src/components/ADempiere/Field/FieldImage.vue b/src/components/ADempiere/Field/FieldImage.vue
index 67db4c1c..60c9b129 100644
--- a/src/components/ADempiere/Field/FieldImage.vue
+++ b/src/components/ADempiere/Field/FieldImage.vue
@@ -4,6 +4,7 @@
     action="https://jsonplaceholder.typicode.com/posts/"
     :show-file-list="false"
     :on-success="handleAvatarSuccess"
+    :on-change="handleChange"
     :before-upload="beforeAvatarUpload"
     :disabled="isDisabled"
     :class="cssClassStyle"
@@ -15,10 +16,27 @@
 
 <script>
 import fieldMixin from '@/components/ADempiere/Field/mixin/mixinField.js'
+import { getResource, updateResource } from '@/api/ADempiere/field/binary.js'
 
 export default {
   name: 'FieldImage',
   mixins: [fieldMixin],
+  props: {
+    // receives the property that is an object with all the attributes
+    binary: {
+      type: Array,
+      default: () => []
+    }
+  },
+  data() {
+    return {
+      valuesImage: [{
+        identifier: 'undefined',
+        value: '',
+        isLoaded: true
+      }]
+    }
+  },
   computed: {
     cssClassStyle() {
       let styleClass = ' custom-field-image '
@@ -29,10 +47,46 @@ export default {
     }
   },
   methods: {
+    updateResource,
+    getResource,
+    handleChange(file, fileList) {
+      let message, type
+      this.binary.push({
+        columnName: this.metadata.columnName,
+        value: file
+      })
+      switch (file.status) {
+        case 'success':
+          message = 'succesful'
+          type = file.status
+          break
+        case 'ready':
+          message = 'loading'
+          type = 'loading'
+          break
+        case 'error':
+          message = file.status
+          type = file.status
+          break
+      }
+      this.$message({
+        type: type,
+        showClose: true,
+        message: this.$t('notifications.' + message)
+      })
+      updateResource({
+        uuid: this.metadata.recordUuid,
+        tableName: this.$route.params.tableName,
+        binaryFile: this.binary
+      })
+    },
     handleAvatarSuccess(res, file) {
       this.value = URL.createObjectURL(file.raw)
-      // TODO: define one method to control change value
       this.handleFieldChange({ value: this.value })
+      getResource({
+        uuid: this.metadata.recordUuid,
+        tableName: this.$route.params.tableName
+      })
     },
     beforeAvatarUpload(file) {
       const isJPG = file.type === 'image/jpeg'