diff --git a/src/api/ADempiere/persistence.js b/src/api/ADempiere/persistence.js
index d97a911a..f6ee98be 100644
--- a/src/api/ADempiere/persistence.js
+++ b/src/api/ADempiere/persistence.js
@@ -271,6 +271,7 @@ export function requestResource({ resourceUuid }, callBack = {
 /**
  * Get image with uri request
  * @author EdwinBetanc0urt <EdwinBetanc0urt@oulook.com>
+ * @author Elsio15 <elsiiosanches@gmail.com>
  * @param {string} file
  * @param {number} width
  * @param {number} height
@@ -279,8 +280,8 @@ export function requestResource({ resourceUuid }, callBack = {
  */
 export function requestImage({
   file,
-  width = 300,
-  height = 300,
+  width,
+  height,
   operation = 'fit'
 }) {
   const { getImagePath } = require('@/utils/ADempiere/resource.js')
diff --git a/src/components/ADempiere/Form/PriceChecking/fieldsList.js b/src/components/ADempiere/Form/PriceChecking/fieldsList.js
index e138bb17..12fc03e5 100644
--- a/src/components/ADempiere/Form/PriceChecking/fieldsList.js
+++ b/src/components/ADempiere/Form/PriceChecking/fieldsList.js
@@ -8,7 +8,11 @@ export default [
       sequence: 10,
       cssClassName: 'price-inquiry',
       inputSize: 'large',
-      handleActionKeyPerformed: true
+      handleFocusGained: true,
+      handleFocusLost: true,
+      handleActionKeyPerformed: true,
+      isDisplayed: true,
+      isReadOnly: false
     }
   }
 ]
diff --git a/src/components/ADempiere/Form/PriceChecking/index.vue b/src/components/ADempiere/Form/PriceChecking/index.vue
index 92a7cbf8..cec51640 100644
--- a/src/components/ADempiere/Form/PriceChecking/index.vue
+++ b/src/components/ADempiere/Form/PriceChecking/index.vue
@@ -2,7 +2,6 @@
   <div
     v-if="isLoaded"
     style="height: 100% !important;"
-    @click="focusProductValue"
   >
     <el-container style="height: 100% !important;">
       <img
@@ -91,6 +90,7 @@ export default {
       productPrice: {},
       organizationBackground: '',
       currentImageOfProduct: '',
+      search: 'sad',
       unsubscribe: () => {}
     }
   },
@@ -127,13 +127,15 @@ export default {
         isSetOrg = true
         imageName = this.organizationImagePath
       }
+      // the name of the image plus the height and width of the container is sent
       const imageBuffer = await requestImage({
-        file: imageName
+        file: imageName,
+        width: 750,
+        height: 380
       }).then(responseImage => {
         const arrayBufferAsImage = buildImageFromArrayBuffer({
           arrayBuffer: responseImage
         })
-
         if (isSetOrg) {
           this.organizationBackground = arrayBufferAsImage
           return arrayBufferAsImage
@@ -151,52 +153,56 @@ export default {
     formatPrice,
     subscribeChanges() {
       return this.$store.subscribe((mutation, state) => {
-        if (mutation.type === 'addActionKeyPerformed' && mutation.payload.columnName === 'ProductValue') {
+        // console.log(mutation.type.length)
+        if ((mutation.type === 'updateValueOfField' || mutation.type === 'addFocusGained') && mutation.payload.columnName === 'ProductValue') {
           // cleans all values except column name 'ProductValue'
-          requestGetProductPrice({
-            searchValue: mutation.payload.value
-          })
-            .then(productPrice => {
-              const { product, taxRate, priceStandard: priceBase } = productPrice
-              const { rate } = taxRate
-              const { imageURL: image } = product
+          this.search = mutation.payload.value
+          if (this.search.length >= 6) {
+            requestGetProductPrice({
+              searchValue: mutation.payload.value
+            })
+              .then(productPrice => {
+                const { product, taxRate, priceStandard: priceBase } = productPrice
+                const { rate } = taxRate
+                const { imageURL: image } = product
 
-              this.productPrice = {
-                productName: product.name,
-                productDescription: product.description,
-                priceBase,
-                priceStandard: productPrice.priceStandard,
-                priceList: productPrice.priceList,
-                priceLimit: productPrice.priceLimit,
-                taxRate: rate,
-                image,
-                taxName: taxRate.name,
-                taxIndicator: taxRate.taxIndicator,
-                taxAmt: this.getTaxAmount(priceBase, rate),
-                grandTotal: this.getGrandTotal(priceBase, rate),
-                currency: productPrice.currency
-              }
-            })
-            .catch(error => {
-              this.$message({
-                type: 'info',
-                message: error.message,
-                showClose: true
+                this.productPrice = {
+                  productName: product.name,
+                  productDescription: product.description,
+                  priceBase,
+                  priceStandard: productPrice.priceStandard,
+                  priceList: productPrice.priceList,
+                  priceLimit: productPrice.priceLimit,
+                  taxRate: rate,
+                  image,
+                  taxName: taxRate.name,
+                  taxIndicator: taxRate.taxIndicator,
+                  taxAmt: this.getTaxAmount(priceBase, rate),
+                  grandTotal: this.getGrandTotal(priceBase, rate),
+                  currency: productPrice.currency
+                }
               })
-              this.productPrice = {}
-            })
-            .finally(() => {
-              this.$store.commit('updateValueOfField', {
-                containerUuid: this.containerUuid,
-                columnName: 'ProductValue',
-                value: ''
+              .catch(error => {
+                this.$message({
+                  type: 'info',
+                  message: error.message,
+                  showClose: true
+                })
+                this.productPrice = {}
               })
-
-              this.currentImageOfProduct = ''
-              if (this.isEmptyValue(this.productPrice.image)) {
-                this.getImage(this.productPrice.image)
-              }
-            })
+              .finally(() => {
+                this.$store.commit('updateValueOfField', {
+                  containerUuid: this.containerUuid,
+                  columnName: 'ProductValue',
+                  value: ''
+                })
+                this.search = ''
+                this.currentImageOfProduct = ''
+                if (this.isEmptyValue(this.productPrice.image)) {
+                  this.getImage(this.productPrice.image)
+                }
+              })
+          }
         }
       })
     },
@@ -227,12 +233,12 @@ export default {
 
   .product-description {
     color: #32363a;
-    font-size: 25px;
+    font-size: 30px;
     float: right;
     padding-bottom: 0px;
   }
   .product-price-base, .product-tax {
-    font-size: 35px;
+    font-size: 30px;
     float: right;
   }
   .product-price {
@@ -250,7 +256,7 @@ export default {
   }
   .inquiry-product {
     position: absolute;
-    right: 5%;
+    right: 20%;
     width: 100%;
     top: 33%;
     .amount {
diff --git a/src/components/ADempiere/Form/VPOS/KeyLayout/index.vue b/src/components/ADempiere/Form/VPOS/KeyLayout/index.vue
index e84af0aa..7804e80e 100644
--- a/src/components/ADempiere/Form/VPOS/KeyLayout/index.vue
+++ b/src/components/ADempiere/Form/VPOS/KeyLayout/index.vue
@@ -202,8 +202,11 @@ export default {
             isLoaded: false
           })
         }
+        // the name of the image plus the height and width of the container is sent
         requestImage({
-          file: fileName
+          file: fileName,
+          width: 300,
+          height: 300
         }).then(responseImage => {
           const arrayBufferAsImage = buildImageFromArrayBuffer({
             arrayBuffer: responseImage,
diff --git a/src/components/Screenfull/index.vue b/src/components/Screenfull/index.vue
index 260c90de..75d41b7a 100644
--- a/src/components/Screenfull/index.vue
+++ b/src/components/Screenfull/index.vue
@@ -5,43 +5,42 @@
 </template>
 
 <script>
-import screenfull from 'screenfull'
 
 export default {
   name: 'Screenfull',
   data() {
     return {
+      elem: document.documentElement,
       isFullscreen: false
     }
   },
-  mounted() {
-    this.init()
-  },
-  beforeDestroy() {
-    this.destroy()
-  },
   methods: {
     click() {
-      if (!screenfull.enabled) {
-        this.$message({
-          message: 'you browser can not work',
-          type: 'warning'
-        })
-        return false
+      if (this.isFullscreen) {
+        this.closeFullscreen()
+        this.isFullscreen = true
+        return this.isFullscreen
       }
-      screenfull.toggle()
+      this.openFullscreen()
+      this.isFullscreen = false
+      return this.isFullscreen
     },
-    change() {
-      this.isFullscreen = screenfull.isFullscreen
-    },
-    init() {
-      if (screenfull.enabled) {
-        screenfull.on('change', this.change)
+    openFullscreen() {
+      if (this.elem.requestFullscreen) {
+        this.elem.requestFullscreen()
+      } else if (this.elem.webkitRequestFullscreen) { /* Safari */
+        this.elem.webkitRequestFullscreen()
+      } else if (this.elem.msRequestFullscreen) { /* IE11 */
+        this.elem.msRequestFullscreen()
       }
     },
-    destroy() {
-      if (screenfull.enabled) {
-        screenfull.off('change', this.change)
+    closeFullscreen() {
+      if (document.exitFullscreen) {
+        document.exitFullscreen()
+      } else if (document.webkitExitFullscreen) { /* Safari */
+        document.webkitExitFullscreen()
+      } else if (document.msExitFullscreen) { /* IE11 */
+        document.msExitFullscreen()
       }
     }
   }
diff --git a/src/layout/components/Settings/index.vue b/src/layout/components/Settings/index.vue
index 131b190e..fc553161 100644
--- a/src/layout/components/Settings/index.vue
+++ b/src/layout/components/Settings/index.vue
@@ -23,6 +23,16 @@
         <el-switch v-model="fixedHeader" class="drawer-switch" />
       </div>
 
+      <div class="drawer-item">
+        <span>Show Header</span>
+        <el-switch v-model="showNavar" class="drawer-switch" />
+      </div>
+
+      <div class="drawer-item">
+        <span>Show Menu</span>
+        <el-switch v-model="showMenu" class="drawer-switch" />
+      </div>
+
       <div class="drawer-item">
         <span>{{ $t('settings.sidebarLogo') }}</span>
         <el-switch v-model="sidebarLogo" class="drawer-switch" />
@@ -67,6 +77,28 @@ export default {
         })
       }
     },
+    showNavar: {
+      get() {
+        return this.$store.state.settings.showNavar
+      },
+      set(val) {
+        this.$store.dispatch('settings/changeSetting', {
+          key: 'showNavar',
+          value: val
+        })
+      }
+    },
+    showMenu: {
+      get() {
+        return this.$store.state.settings.showMenu
+      },
+      set(val) {
+        this.$store.dispatch('settings/changeSetting', {
+          key: 'showMenu',
+          value: val
+        })
+      }
+    },
     tagsView: {
       get() {
         return this.$store.state.settings.tagsView
diff --git a/src/layout/index.vue b/src/layout/index.vue
index a5f9a854..5119d8cd 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -1,10 +1,10 @@
 <template>
   <div :class="classObj" class="app-wrapper">
     <div v-if="device==='mobile'&&sidebar.opened" class="drawer-bg" @click="handleClickOutside" />
-    <sidebar class="sidebar-container" />
+    <sidebar v-show="showMenu" class="sidebar-container" />
     <div :class="{hasTagsView:needTagsView}" class="main-container">
       <div :class="{'fixed-header':fixedHeader}">
-        <navbar />
+        <navbar v-show="showNavar" />
         <tags-view v-if="needTagsView" />
       </div>
       <app-main />
@@ -38,7 +38,9 @@ export default {
       device: state => state.app.device,
       showSettings: state => state.settings.showSettings,
       needTagsView: state => state.settings.tagsView,
-      fixedHeader: state => state.settings.fixedHeader
+      fixedHeader: state => state.settings.fixedHeader,
+      showNavar: state => state.settings.showNavar,
+      showMenu: state => state.settings.showMenu
     }),
     classObj() {
       return {
diff --git a/src/settings.js b/src/settings.js
index 480fcf35..f0c59746 100644
--- a/src/settings.js
+++ b/src/settings.js
@@ -19,6 +19,12 @@ module.exports = {
    */
   fixedHeader: false,
 
+  /**
+   * @type {boolean} true | false
+   * @description Whether fix the menu
+   */
+  showNavar: true,
+
   /**
    * @type {boolean} true | false
    * @description Whether show the logo in sidebar
diff --git a/src/store/modules/settings.js b/src/store/modules/settings.js
index bb66f97a..a4340cb7 100644
--- a/src/store/modules/settings.js
+++ b/src/store/modules/settings.js
@@ -1,7 +1,7 @@
 import variables from '@/styles/element-variables.scss'
 import defaultSettings from '@/settings'
 
-const { showSettings, tagsView, fixedHeader, sidebarLogo, supportPinyinSearch, showContextMenu } = defaultSettings
+const { showSettings, tagsView, fixedHeader, showNavar, sidebarLogo, supportPinyinSearch, showContextMenu } = defaultSettings
 
 const state = {
   theme: variables.theme,
@@ -10,7 +10,9 @@ const state = {
   fixedHeader,
   sidebarLogo,
   supportPinyinSearch,
-  showContextMenu
+  showContextMenu,
+  showNavar,
+  showMenu: true
 }
 
 const mutations = {