@things-factory/operato-wms 5.0.0-alpha.38 → 5.0.0-alpha.39

package/client/pages/report/costing-report.js

@@ -0,0 +1,453 @@
+import '@things-factory/form-ui'
+import '@things-factory/grist-ui'
+import '../inventory/inventory-by-product-detail'
+
+import gql from 'graphql-tag'
+import { css, html } from 'lit-element'
+import { connect } from 'pwa-helpers/connect-mixin'
+
+import { getCodeByName } from '@things-factory/code-base'
+import { i18next, localize } from '@things-factory/i18n-base'
+import { client, gqlContext, PageView, store } from '@things-factory/shell'
+import { flattenObject, isMobileDevice } from '@things-factory/utils'
+
+class CostingReport extends connect(store)(localize(i18next)(PageView)) {
+  static get styles() {
+    return css`
+      :host {
+        display: flex;
+        flex-direction: column;
+        width: 100%;
+      }
+
+      data-grist {
+        overflow-y: auto;
+        flex: 1;
+      }
+
+      .summary {
+        background-color: var(--main-section-background-color);
+        display: flex;
+        flex-direction: column;
+        overflow-y: auto;
+        align-items: flex-end;
+        padding: var(--data-list-item-padding);
+        display: grid;
+        font-size: 14px;
+        color: #394e64;
+        grid-template-columns: repeat(2, 1fr);
+        grid-auto-rows: minmax(24px, auto);
+      }
+    `
+  }
+
+  static get properties() {
+    return {
+      _searchFields: Object,
+      _config: Object,
+      _partners: Object,
+      _gristData: Object,
+      data: Object
+    }
+  }
+
+  get context() {
+    return {
+      title: 'Costing Report',
+      exportable: {
+        name: i18next.t('title.costing_report'),
+        data: this._exportableData.bind(this)
+      },
+      help: 'operato-wms/report/costing-report'
+    }
+  }
+
+  get dataGrist() {
+    return this.shadowRoot.querySelector('data-grist')
+  }
+
+  get searchForm() {
+    return this.shadowRoot.querySelector('search-form')
+  }
+
+  get _bizplaceSelector() {
+    return this.searchForm.shadowRoot.querySelector('select[name=bizplace]')
+  }
+
+  get _fromDateInput() {
+    return this.searchForm.shadowRoot.querySelector('input[name=fromDate]')
+  }
+
+  get _toDateInput() {
+    return this.searchForm.shadowRoot.querySelector('input[name=toDate]')
+  }
+
+  get searchFields() {
+    return [
+      {
+        label: i18next.t('field.company'),
+        name: 'bizplace',
+        type: 'select',
+        options: [
+          { value: '' },
+          ...this._partners
+            .map(partner => {
+              return {
+                name: `${partner.name} ${partner.description ? `(${partner.description})` : ''}`,
+                value: partner.id
+              }
+            })
+            .sort(this._compareValues('name', 'asc'))
+        ],
+        props: { searchOper: 'eq' }
+      },
+      {
+        label: i18next.t('field.from_date'),
+        name: 'fromDate',
+        type: 'date',
+        props: {
+          searchOper: 'eq',
+          max: new Date().toISOString().split('T')[0]
+        },
+        value: (() => {
+          let date = new Date()
+          date.setMonth(date.getMonth() - 1)
+          return date.toISOString().split('T')[0]
+        })(),
+        handlers: { change: this._modifyDateRange.bind(this) }
+      },
+      {
+        label: i18next.t('field.to_date'),
+        name: 'toDate',
+        type: 'date',
+        props: {
+          searchOper: 'eq',
+          min: (() => {
+            let date = new Date()
+            date.setMonth(date.getMonth() - 1)
+            return date.toISOString().split('T')[0]
+          })(),
+          max: (() => {
+            var max = new Date()
+            max.setMonth(max.getMonth() + 1)
+            return max.toISOString().split('T')[0]
+          })()
+        },
+        value: new Date().toISOString().split('T')[0]
+        // handlers: { change: this._submit.bind(this) }
+      }
+    ]
+  }
+
+  get reportConfig() {
+    let columns = [
+      { type: 'gutter', gutterName: 'sequence' },
+      {
+        type: 'string',
+        name: 'bizplace|name',
+        header: i18next.t('field.company'),
+        width: 200
+      },
+      {
+        type: 'string',
+        name: 'product|sku',
+        header: i18next.t('field.sku'),
+        width: 150
+      },
+      {
+        type: 'string',
+        name: 'product|name',
+        header: i18next.t('field.product_name'),
+        width: 200
+      },
+      {
+        type: 'string',
+        name: 'product|description',
+        header: i18next.t('field.product_description'),
+        width: 300
+      },
+      {
+        type: 'string',
+        name: 'product|type',
+        header: i18next.t('field.product_type'),
+        width: 150
+      },
+      {
+        type: 'float',
+        name: 'qty',
+        header: i18next.t('field.qty'),
+        width: 120
+      },
+      {
+        type: 'float',
+        name: 'uomValue',
+        header: i18next.t('field.uom_value'),
+        width: 120
+      },
+      {
+        type: 'string',
+        name: 'uom',
+        header: i18next.t('field.uom'),
+        width: 100
+      },
+      {
+        type: 'string',
+        name: 'weightedAvgUnitCost',
+        header: 'Weighted Avg Unit Cost',
+        width: 100
+      },
+      {
+        type: 'string',
+        name: 'totalCost',
+        header: i18next.t('field.total_cost'),
+        width: 100
+      }
+    ]
+    let list = {
+      fields: [
+        'bizplace|name',
+        'product|sku',
+        'product|name',
+        'product|description',
+        'product|type',
+        'qty',
+        'uomValue',
+        'uom',
+        'weightedAvgUnitCost',
+        'totalCost'
+      ]
+    }
+
+    return {
+      columns: columns,
+      list,
+      pagination: { limit: 100, pages: [100, 200, 500, 1000] },
+      rows: {
+        selectable: false,
+        insertable: false,
+        appendable: false
+      }
+    }
+  }
+
+  render() {
+    return html`
+      <search-form id="search-form" .fields=${this._searchFields} @submit=${e => this.dataGrist.fetch()}></search-form>
+
+      <data-grist
+        .mode=${isMobileDevice() ? 'LIST' : 'GRID'}
+        .config=${this._config}
+        .fetchHandler="${this.fetchHandler.bind(this)}"
+      ></data-grist>
+    `
+  }
+
+  async pageInitialized() {
+    this._gristData = { total: 0, records: [] }
+    this._products = []
+
+    const [_partnersReq] = await Promise.allSettled([this._fetchPartners()])
+
+    this._partners = _partnersReq.status == 'fulfilled' ? _partnersReq.value : []
+
+    this._searchFields = this.searchFields
+    this._config = this.reportConfig
+  }
+
+  async pageUpdated(changes, lifecycle) {
+    if (this.active) {
+      this.dataGrist.fetch()
+    }
+  }
+
+  async fetchHandler({ page, limit, sorters = [] }) {
+    try {
+      this._validate()
+      let filters = this.searchForm.queryFilters.map(filter => {
+        switch (filter.name) {
+          case 'fromDate':
+            let fromDt = new Date(filter.value)
+            fromDt.setHours(0)
+            filter.value = fromDt.toISOString()
+            break
+          case 'toDate':
+            let toDt = new Date(filter.value)
+            toDt.setHours(23, 59, 59)
+            filter.value = toDt.toISOString()
+            break
+          default:
+            break
+        }
+        return filter
+      })
+
+      const pagination = { page, limit }
+      const sortings = sorters
+
+      const response = await client.query({
+        query: gql`
+          query costingReport($filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {
+            costingReport(filters: $filters, pagination: $pagination, sortings: $sortings) {
+              items {
+                bizplace {
+                  name
+                  description
+                }
+                product {
+                  sku
+                  name
+                  description
+                  type
+                }
+                qty
+                uomValue
+                uom
+                weightedAvgUnitCost
+                totalCost
+              }
+              total
+            }
+          }
+        `,
+        variables: { filters, pagination, sortings },
+        context: gqlContext()
+      })
+
+      const data = {
+        total: response.data.costingReport.total,
+        records:
+          response.data.costingReport.items.map(itm => {
+            itm = {
+              ...itm,
+              weightedAvgUnitCost: parseFloat(itm.weightedAvgUnitCost ? itm.weightedAvgUnitCost : 0).toFixed(4),
+              totalCost: parseFloat(itm.totalCost ? itm.totalCost : 0).toFixed(4)
+            }
+            return flattenObject({ ...itm, bizplace: { name: `${itm.bizplace.name} ${itm.bizplace.description}` } })
+          }) || []
+      }
+
+      this._gristData = {
+        ...data
+      }
+
+      return data
+    } catch (e) {
+      this._showToast(e)
+    }
+  }
+
+  async _fetchPartners() {
+    const filters = []
+    const response = await client.query({
+      query: gql`
+        query partnersBizplaces($filters: [Filter!]) {
+          partnersBizplaces(filters: $filters) {
+            items {
+              id
+              name
+              description
+            }
+          }
+        }
+      `,
+      variables: { filters }
+    })
+
+    if (!response.errors) {
+      return response.data.partnersBizplaces.items
+    }
+  }
+  _validate() {
+    if (!this.searchForm.shadowRoot.querySelector('form').checkValidity())
+      throw new Error(i18next.t('text.invalid_form_value'))
+    if (!this._bizplaceSelector.value) throw new Error(i18next.t('text.no_company_selected'))
+    if (!this._fromDateInput.value) throw new Error(i18next.t('text.from_date_is_empty'))
+    if (!this._toDateInput.value) throw new Error(i18next.t('text.to_date_is_empty'))
+  }
+
+  _compareValues(key, order = 'asc') {
+    return function innerSort(a, b) {
+      if (!a.hasOwnProperty(key) || !b.hasOwnProperty(key)) {
+        return 0
+      }
+
+      const varA = typeof a[key] === 'string' ? a[key].toUpperCase() : a[key]
+      const varB = typeof b[key] === 'string' ? b[key].toUpperCase() : b[key]
+
+      let comparison = 0
+      if (varA > varB) {
+        comparison = 1
+      } else if (varA < varB) {
+        comparison = -1
+      }
+      return order === 'desc' ? comparison * -1 : comparison
+    }
+  }
+
+  _modifyDateRange(e) {
+    const fromDate = e.currentTarget.value
+
+    let min = new Date(fromDate)
+    let max = new Date(fromDate)
+    max.setMonth(max.getMonth() + 2)
+
+    min = min.toISOString().split('T')[0]
+    max = max.toISOString().split('T')[0]
+
+    if (this._toDateInput.value < fromDate) this._toDateInput.value = fromDate
+
+    if (this._toDateInput.value > max) this._toDateInput.value = max
+
+    this._toDateInput.max = max
+    this._toDateInput.min = min
+    this._submit()
+  }
+
+  _submit(e) {
+    this._config = { ...this.reportConfig }
+    this.searchForm.submit()
+  }
+
+  async _exportableData() {
+    try {
+      var headerSetting = [
+        { header: i18next.t('field.company'), key: 'bizplace|name', width: 60, type: 'string' },
+        { header: i18next.t('field.sku'), key: 'product|sku', width: 25, type: 'string' },
+        { header: i18next.t('field.product_name'), key: 'product|name', width: 50, type: 'string' },
+        { header: i18next.t('field.product_description'), key: 'product|description', width: 50, type: 'string' },
+        { header: i18next.t('field.product_type'), key: 'product|type', width: 30, type: 'string' },
+        { header: i18next.t('field.qty'), key: 'qty', width: 15, type: 'string' },
+        { header: i18next.t('field.uom_value'), key: 'uomValue', width: 15, type: 'string' },
+        { header: i18next.t('field.uom'), key: 'uom', width: 15, type: 'string' },
+        { header: 'Weighted Avg Unit Cost', key: 'weightedAvgUnitCost', width: 15, type: 'string' },
+        { header: i18next.t('field.total_cost'), key: 'totalCost', width: 15, type: 'string' }
+      ]
+
+      var exportData = {
+        header: [...headerSetting],
+        data: (await this.fetchHandler({ page: 1, limit: 9999999 })).records.map(itm => {
+          return {
+            ...itm
+          }
+        })
+      }
+
+      return exportData
+    } catch (e) {
+      this._showToast(e)
+    }
+  }
+
+  _showToast({ type, message }) {
+    document.dispatchEvent(
+      new CustomEvent('notify', {
+        detail: {
+          type,
+          message
+        }
+      })
+    )
+  }
+}
+
+window.customElements.define('costing-report', CostingReport)

package/client/pages/report/inbound-order-details-report.js

@@ -362,6 +362,12 @@ class InboundOrderDetailsReport extends connect(store)(localize(i18next)(PageVie
         header: i18next.t('field.uom'),
         width: 100
       },
+      {
+        type: 'string',
+        name: 'unitCost',
+        header: i18next.t('field.unit_cost'),
+        width: 100
+      },
       {
         type: 'float',
         name: 'unitVolume',
@@ -497,6 +503,7 @@ class InboundOrderDetailsReport extends connect(store)(localize(i18next)(PageVie
         'qty',
         'uomValue',
         'uom',
+        'unitCost',
         'unitVolume',
         'totalVolume',
         'unitNettWeight',
@@ -613,6 +620,7 @@ class InboundOrderDetailsReport extends connect(store)(localize(i18next)(PageVie
                 qty
                 uomValue
                 uom
+                unitCost
                 unitVolume
                 totalVolume
                 unitNettWeight
@@ -643,6 +651,11 @@ class InboundOrderDetailsReport extends connect(store)(localize(i18next)(PageVie
         total: response.data.inboundOrderDetailsReport.total,
         records:
           response.data.inboundOrderDetailsReport.items.map(itm => {
+            itm = {
+              ...itm,
+              unitCost: parseFloat(itm.unitCost ? itm.unitCost : 0).toFixed(2)
+            }
+
             return flattenObject({ ...itm, bizplace: { name: `${itm.bizplace.name} ${itm.bizplace.description}` } })
           }) || []
       }
@@ -758,6 +771,7 @@ class InboundOrderDetailsReport extends connect(store)(localize(i18next)(PageVie
         { header: i18next.t('field.qty'), key: 'qty', width: 15, type: 'string' },
         { header: i18next.t('field.uom_value'), key: 'uomValue', width: 15, type: 'string' },
         { header: i18next.t('field.uom'), key: 'uom', width: 15, type: 'string' },
+        { header: i18next.t('field.unit_cost'), key: 'unitCost', width: 15, type: 'string' },
         { header: i18next.t('field.unit_volume'), key: 'unitVolume', width: 15, type: 'string' },
         { header: i18next.t('field.total_volume'), key: 'totalVolume', width: 15, type: 'string' },
         { header: i18next.t('field.unit_nett_weight'), key: 'unitNettWeight', width: 15, type: 'string' },

package/client/pages/report/outbound-order-details-report.js

@@ -330,6 +330,12 @@ class OutboundOrderDetailsReport extends connect(store)(localize(i18next)(PageVi
         header: i18next.t('field.uom'),
         width: 100
       },
+      {
+        type: 'string',
+        name: 'unitCost',
+        header: i18next.t('field.unit_cost'),
+        width: 100
+      },
       {
         type: 'float',
         name: 'returnToLocationQty',
@@ -489,6 +495,7 @@ class OutboundOrderDetailsReport extends connect(store)(localize(i18next)(PageVi
         'qty',
         'uomValue',
         'uom',
+        'unitCost',
         'returnToLocationQty',
         'returnToLocationUomValue',
         'unitVolume',
@@ -609,6 +616,7 @@ class OutboundOrderDetailsReport extends connect(store)(localize(i18next)(PageVi
                 returnToLocationQty
                 returnToLocationUomValue
                 uom
+                unitCost
                 unitVolume
                 totalVolume
                 unitNettWeight
@@ -642,6 +650,10 @@ class OutboundOrderDetailsReport extends connect(store)(localize(i18next)(PageVi
         total: response.data.outboundOrderDetailsReport.total,
         records:
           response.data.outboundOrderDetailsReport.items.map(itm => {
+            itm = {
+              ...itm,
+              unitCost: parseFloat(itm.unitCost ? itm.unitCost : 0).toFixed(2)
+            }
             return flattenObject({ ...itm, bizplace: { name: `${itm.bizplace.name} ${itm.bizplace.description}` } })
           }) || []
       }

package/client/pages/vas/print-product-label.js

@@ -786,12 +786,21 @@ class PrintProductLabel extends connect(store)(localize(i18next)(PageView)) {
           }
         } catch (ex) {
           this._showToast({ level: 'error', message: ex })
-
           delete this.printer
           break
         } finally {
           // we only need to update when the counter is more than 0
-          if (printCounter > 0) await this._updatePrintedLabelSequence(record.type, printCounter, record.bizplaceId)
+          if (printCounter > 0) {
+            try {
+              await this._updatePrintedLabelSequence(record.type, printCounter, record.bizplaceId)
+            } catch (e) {
+              this._showToast({
+                level: 'error',
+                message: i18next.t('text.unable_to_save_print_history_x', { state: { counter: printCounter } })
+              })
+              return
+            }
+          }
         }
       }
     }
@@ -801,8 +810,8 @@ class PrintProductLabel extends connect(store)(localize(i18next)(PageView)) {
     try {
       await client.mutate({
         mutation: gql`
-          mutation updateInsertSequence($type: String!, $counter: Int, $bizplaceId: String!) {
-            updateInsertSequence(type: $type, counter: $counter, bizplaceId: $bizplaceId) {
+          mutation upsertSequence($type: String!, $counter: Float!, $bizplaceId: String!) {
+            upsertSequence(type: $type, counter: $counter, bizplaceId: $bizplaceId) {
               pattern
               seq
             }
@@ -814,8 +823,8 @@ class PrintProductLabel extends connect(store)(localize(i18next)(PageView)) {
           bizplaceId
         }
       })
-    } catch (e) {
-      this._showToast({ message: e })
+    } catch (error) {
+      throw error
     }
   }
 

package/client/route.js

@@ -463,6 +463,10 @@ export default function route(page) {
     case 'outbound_serial_number_report':
       import('./pages/report/outbound-serial-number-report')
       return page
+
+    case 'costing_report':
+      import('./pages/report/costing-report')
+      return page
     /**
      * Custom ELCCL Menus Section
      */