@things-factory/operato-wms 3.7.2 → 3.7.7

package/client/pages/inventory-check/inspecting-product.js

@@ -11,7 +11,7 @@ import { i18next, localize } from '@things-factory/i18n-base'
 import { openPopup } from '@things-factory/layout-base'
 import { client, CustomAlert, PageView, store, UPDATE_CONTEXT } from '@things-factory/shell'
 import { CommonButtonStyles } from '@things-factory/styles'
-import { gqlBuilder, isMobileDevice } from '@things-factory/utils'
+import { isMobileDevice } from '@things-factory/utils'
 
 import { fetchLocationSortingRule } from '../../fetch-location-sorting-rule'
 import { fetchSettingRule } from '../../fetch-setting-value'
@@ -233,12 +233,7 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
                   : html` <barcode-scanable-input name="palletId" custom-input></barcode-scanable-input>`}
 
                 <label>${i18next.t('label.inspected_batch_no')}</label>
-                <input
-                  name="inspectedBatchNo"
-                  .value="${this._hideCCColumnSetting
-                    ? this.selectedInventory?.inspectedBatchNo || ''
-                    : this.selectedInventory?.inspectedBatchNo || this.selectedInventory?.batchId || ''}"
-                />
+                <input name="inspectedBatchNo" .value="${this.selectedInventory?.batchId || ''}" />
 
                 <label>${i18next.t('label.inspected_qty')}</label>
                 <input
@@ -434,6 +429,7 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
         { type: 'gutter', gutterName: 'sequence' },
         { type: 'boolean', name: 'completed', header: i18next.t('button.completed'), width: 80 },
         { type: 'string', name: 'palletId', header: i18next.t('label.lot_id'), width: 160 },
+        { type: 'string', name: 'batchId', header: i18next.t('label.batch_id'), width: 120 },
         {
           type: 'string',
           name: 'orderInventoryStatus',
@@ -900,19 +896,34 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
         inspectedQty = Number(inspectedQty)
         inspectedUomValue = Number(inspectedUomValue)
 
-        const response = await client.query({
-          query: gql`
-            mutation {
-              addExtraPallet(${gqlBuilder.buildArgs({
-                cycleCountNo: this.cycleCountNo,
-                palletId,
-                inspectedBatchNo,
-                inspectedQty,
-                inspectedUomValue,
-                locationName
-              })})
+        const response = await client.mutate({
+          mutation: gql`
+            mutation addExtraPallet(
+              $cycleCountNo: String!
+              $palletId: String!
+              $inspectedBatchNo: String!
+              $inspectedQty: Int!
+              $inspectedUomValue: Float!
+              $locationName: String!
+            ) {
+              addExtraPallet(
+                cycleCountNo: $cycleCountNo
+                palletId: $palletId
+                inspectedBatchNo: $inspectedBatchNo
+                inspectedQty: $inspectedQty
+                inspectedUomValue: $inspectedUomValue
+                locationName: $locationName
+              )
             }
-          `
+          `,
+          variables: {
+            cycleCountNo: this.cycleCountNo,
+            palletId,
+            inspectedBatchNo,
+            inspectedQty,
+            inspectedUomValue,
+            locationName
+          }
         })
 
         if (!response.errors) {
@@ -1003,10 +1014,8 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
 
       const response = await client.query({
         query: gql`
-          query {
-            orderInventories(${gqlBuilder.buildArgs({
-              filters
-            })}) {
+          query orderInventories($filters: [Filter]) {
+            orderInventories(filters: $filters) {
               items {
                 id
                 name
@@ -1014,7 +1023,8 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
               total
             }
           }
-        `
+        `,
+        variables: { filters }
       })
 
       if (!response.errors) {
@@ -1044,14 +1054,13 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
         return
       }
 
-      const response = await client.query({
-        query: gql`
-          mutation {
-            checkMissingPallet(${gqlBuilder.buildArgs({
-              worksheetDetailName: this.selectedInventory.worksheetDetailName
-            })})
+      const response = await client.mutate({
+        mutation: gql`
+          mutation checkMissingPallet($worksheetDetailName: String!) {
+            checkMissingPallet(worksheetDetailName: $worksheetDetailName)
           }
-        `
+        `,
+        variables: { worksheetDetailName: this.selectedInventory.worksheetDetailName }
       })
 
       if (!response.errors) {
@@ -1065,7 +1074,7 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
 
   async relocatePallet() {
     try {
-      this.checkInputFormValidity()
+      await this.checkInputFormValidity()
 
       const result = await CustomAlert({
         title: i18next.t('title.are_you_sure'),
@@ -1078,25 +1087,35 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
         return
       }
 
-      let { inspectedBatchNo, inspectedQty, inspectedUomValue } = Object.fromEntries(
+      const { inspectedBatchNo, inspectedQty, inspectedUomValue } = Object.fromEntries(
         new FormData(this.inputForm).entries()
       )
-      inspectedQty = Number(inspectedQty)
-      inspectedUomValue = Number(inspectedUomValue)
-      var locationName = this.locationInput.value
 
-      const response = await client.query({
-        query: gql`
-          mutation {
-            relocatePallet(${gqlBuilder.buildArgs({
-              worksheetDetailName: this.selectedInventory.worksheetDetailName,
-              inspectedBatchNo,
-              inspectedQty,
-              inspectedUomValue,
-              inspectedLocationName: locationName
-            })})
+      const response = await client.mutate({
+        mutation: gql`
+          mutation relocatePallet(
+            $worksheetDetailName: String!
+            $inspectedBatchNo: String!
+            $inspectedQty: Int!
+            $inspectedUomValue: Float!
+            $inspectedLocationName: String!
+          ) {
+            relocatePallet(
+              worksheetDetailName: $worksheetDetailName
+              inspectedBatchNo: $inspectedBatchNo
+              inspectedQty: $inspectedQty
+              inspectedUomValue: $inspectedUomValue
+              inspectedLocationName: $inspectedLocationName
+            )
           }
-        `
+        `,
+        variables: {
+          worksheetDetailName: this.selectedInventory.worksheetDetailName,
+          inspectedBatchNo,
+          inspectedQty: Number(inspectedQty),
+          inspectedUomValue: Number(inspectedUomValue),
+          inspectedLocationName: this.locationInput.value
+        }
       })
 
       if (!response.errors) {
@@ -1119,24 +1138,34 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
       inspectedQty = Number(inspectedQty)
       inspectedUomValue = Number(inspectedUomValue)
 
-      const response = await client.query({
-        query: gql`
-          mutation {
-            inspecting(${gqlBuilder.buildArgs({
-              worksheetDetailName: this.selectedInventory.worksheetDetailName,
-              inspectedBatchNo,
-              inspectedQty,
-              inspectedUomValue
-            })})
+      const response = await client.mutate({
+        mutation: gql`
+          mutation inspecting(
+            $worksheetDetailName: String!
+            $inspectedBatchNo: String!
+            $inspectedQty: Int!
+            $inspectedUomValue: Float!
+          ) {
+            inspecting(
+              worksheetDetailName: $worksheetDetailName
+              inspectedBatchNo: $inspectedBatchNo
+              inspectedQty: $inspectedQty
+              inspectedUomValue: $inspectedUomValue
+            )
           }
-        `
+        `,
+        variables: {
+          worksheetDetailName: this.selectedInventory.worksheetDetailName,
+          inspectedBatchNo,
+          inspectedQty,
+          inspectedUomValue
+        }
       })
 
       if (!response.errors) {
         await this.fetchCycleCountWorksheet()
         this.renewInventoryGrist()
-        this.inspectedQtyInput.value = ''
-        this.locationInput.value = ''
+        this.resetInput()
       }
     } catch (e) {
       this.showToast(e)
@@ -1145,14 +1174,13 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
 
   async undoInventoryCheck() {
     try {
-      const response = await client.query({
-        query: gql`
-          mutation {
-            undoInspection(${gqlBuilder.buildArgs({
-              worksheetDetailName: this.selectedInventory.worksheetDetailName
-            })})
+      const response = await client.mutate({
+        mutation: gql`
+          mutation undoInspection($worksheetDetailName: String!) {
+            undoInspection(worksheetDetailName: $worksheetDetailName)
           }
-        `
+        `,
+        variables: { worksheetDetailName: this.selectedInventory.worksheetDetailName }
       })
 
       if (!response.errors) {
@@ -1182,14 +1210,13 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
     })
 
     try {
-      const response = await client.query({
-        query: gql`
-          mutation {
-            completeInspection(${gqlBuilder.buildArgs({
-              inventoryCheckNo: this.cycleCountNo
-            })})
+      const response = await client.mutate({
+        mutation: gql`
+          mutation completeInspection($inventoryCheckNo: String!) {
+            completeInspection(inventoryCheckNo: $inventoryCheckNo)
           }
-        `
+        `,
+        variables: { inventoryCheckNo: this.cycleCountNo }
       })
 
       if (!response.errors) {
@@ -1213,6 +1240,12 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
     }
   }
 
+  resetInput() {
+    this.inspectedQtyInput.value = ''
+    this.locationInput.value = ''
+    this.inspectedUomValueInput.value = ''
+  }
+
   renewInventoryGrist() {
     this.selectedLocation = this.selectedLocation?.id
       ? this.formattedLocations.find(loc => loc.id === this.selectedLocation.id)
@@ -1226,13 +1259,11 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
     try {
       const response = await client.query({
         query: gql`
-          query {
-            checkInventoryOwner(${gqlBuilder.buildArgs({
-              palletId,
-              bizplaceName
-            })})
+          query checkInventoryOwner($palletId: String!, $bizplaceName: String!) {
+            checkInventoryOwner(palletId: $palletId, bizplaceName: $bizplaceName)
           }
-        `
+        `,
+        variables: { palletId, bizplaceName }
       })
 
       if (!response.errors) {
@@ -1243,7 +1274,37 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
     }
   }
 
-  checkInputFormValidity() {
+  async validateLocation(scannedLocation) {
+    try {
+      const response = await client.query({
+        query: gql`
+          query locations($filters: [Filter]) {
+            locations(filters: $filters) {
+              items {
+                id
+                name
+              }
+            }
+          }
+        `,
+        variables: { filters: [{ name: 'name', operator: 'eq', value: scannedLocation }] }
+      })
+
+      if (!response.errors) {
+        const locations = response.data.locations.items || []
+
+        if (!locations?.length) {
+          return false
+        } else {
+          return true
+        }
+      }
+    } catch (e) {
+      this.showToast(e)
+    }
+  }
+
+  async checkInputFormValidity() {
     let { inspectedBatchNo, inspectedQty, inspectedUomValue, location } = Object.fromEntries(
       new FormData(this.inputForm).entries()
     )
@@ -1285,6 +1346,11 @@ class InspectingProduct extends connect(store)(localize(i18next)(PageView)) {
     if (!locationName) {
       this.selectOnInput(this.locationInput)
       throw new Error(i18next.t('text.invalid_x', { state: { x: i18next.t('label.location') } }))
+    } else {
+      const locationExist = await this.validateLocation(locationName)
+      if (!locationExist) {
+        throw new Error(i18next.t('text.invalid_x', { state: { x: i18next.t('label.location') } }))
+      }
     }
   }
 

package/client/pages/manifest/create-loading-manifest.js

@@ -0,0 +1,314 @@
+import '@things-factory/grist-ui'
+import '@things-factory/barcode-ui'
+
+import gql from 'graphql-tag'
+import { css, html } from 'lit-element'
+
+import { MultiColumnFormStyles } from '@things-factory/form-ui'
+import { i18next, localize } from '@things-factory/i18n-base'
+import { client, navigate, PageView } from '@things-factory/shell'
+import { CommonButtonStyles } from '@things-factory/styles'
+import { isMobileDevice } from '@things-factory/utils'
+
+class CreateLoadingManifest extends localize(i18next)(PageView) {
+  static get styles() {
+    return [
+      MultiColumnFormStyles,
+      css`
+        :host {
+          display: flex;
+          flex-direction: column;
+          overflow-x: auto;
+        }
+        .container {
+          flex: 1;
+          display: flex;
+          overflow-y: auto;
+          min-height: 50vh;
+        }
+        .grist {
+          background-color: var(--main-section-background-color);
+          display: flex;
+          flex-direction: column;
+          flex: 1;
+          overflow-y: auto;
+        }
+        data-grist {
+          overflow-y: hidden;
+          flex: 1;
+        }
+        h2 {
+          padding: var(--subtitle-padding);
+          font: var(--subtitle-font);
+          color: var(--subtitle-text-color);
+          border-bottom: var(--subtitle-border-bottom);
+        }
+        .grist h2 {
+          margin: var(--grist-title-margin);
+          border: var(--grist-title-border);
+          font: var(--grist-title-font);
+          color: var(--secondary-color);
+        }
+
+        .grist h2 mwc-icon {
+          vertical-align: middle;
+          margin: var(--grist-title-icon-margin);
+          font-size: var(--grist-title-icon-size);
+          color: var(--grist-title-icon-color);
+        }
+
+        h2 + data-grist {
+          padding-top: var(--grist-title-with-grid-padding);
+        }
+      `
+    ]
+  }
+
+  static get properties() {
+    return {
+      shippingData: Object,
+      shippingGristConfig: Object
+    }
+  }
+
+  get context() {
+    return {
+      title: i18next.t('title.manifest'),
+      actions: [
+        {
+          title: i18next.t('button.submit'),
+          action: this._generateLoadingManifest.bind(this),
+          ...CommonButtonStyles.submit
+        }
+      ]
+    }
+  }
+
+  render() {
+    return html`
+      <form name="manifest" class="multi-column-form" autocomplete="off">
+        <fieldset>
+          <legend>${i18next.t('title.create_loading_manifest')}</legend>
+          <label>${i18next.t('label.scan_tracking_no')}</label>
+          <barcode-scanable-input
+            name="trackingNo"
+            custom-input
+            @keypress="${e => {
+              if (e.keyCode === 13) {
+                e.preventDefault()
+                if (this.trackingNoInput.value) {
+                  this._fetchManifestItems(this.trackingNoInput.value)
+                }
+              }
+            }}"
+          ></barcode-scanable-input>
+        </fieldset>
+      </form>
+
+      <div class="container">
+        <div class="grist">
+          <h2><mwc-icon>list_alt</mwc-icon>${i18next.t('title.manifest_items')}</h2>
+
+          <data-grist
+            .mode=${isMobileDevice() ? 'LIST' : 'GRID'}
+            .config=${this.shippingGristConfig}
+            .data=${this.shippingData}
+          ></data-grist>
+        </div>
+      </div>
+    `
+  }
+
+  constructor() {
+    super()
+    this.shippingData = { records: [] }
+  }
+
+  get shippingGrist() {
+    return this.shadowRoot.querySelector('data-grist')
+  }
+
+  get manifestForm() {
+    return this.shadowRoot.querySelector('form[name=manifest]')
+  }
+
+  get trackingNoInput() {
+    return this.shadowRoot.querySelector('barcode-scanable-input[name=trackingNo]')?.shadowRoot.querySelector('input')
+  }
+
+  pageUpdated(changes, lifecycle, before) {
+    if (this.active) {
+      this._focusOnTrackingNoInput()
+    }
+  }
+
+  pageInitialized() {
+    this.shippingGristConfig = {
+      list: { fields: ['refNo', 'trackingNo', 'transporter'] },
+      pagination: { infinite: true },
+      columns: [
+        { type: 'gutter', gutterName: 'sequence' },
+        {
+          type: 'gutter',
+          gutterName: 'button',
+          icon: 'close',
+          handlers: {
+            click: (columns, data, column, record, rowIndex) => {
+              const newData = data.records.filter((_, idx) => idx !== rowIndex)
+              this.shippingData = { ...this.shippingData, records: newData }
+              this.shippingGrist.dirtyData.records = newData
+            }
+          }
+        },
+        {
+          type: 'string',
+          name: 'refNo',
+          label: true,
+          header: i18next.t('field.order_no'),
+          width: 200
+        },
+        {
+          type: 'string',
+          name: 'trackingNo',
+          label: true,
+          header: i18next.t('field.tracking_no'),
+          width: 200
+        },
+        {
+          type: 'string',
+          name: 'transporter',
+          label: true,
+          header: i18next.t('field.shipping_provider'),
+          width: 200
+        }
+      ]
+    }
+  }
+
+  async _fetchManifestItems() {
+    try {
+      this._validateTrackingNo()
+
+      const filters = [
+        { name: 'trackingNo', operator: 'eq', value: this.trackingNoInput.value.trim() },
+        { name: 'manifest_id', operator: 'is_null', value: '' },
+        { name: 'status', operator: 'in', value: ['PACKING', 'DONE'] }
+      ]
+      const response = await client.query({
+        query: gql`
+          query releaseGoods($filters: [Filter], $sortings: [Sorting]) {
+            releaseGoods(filters: $filters, sortings: $sortings) {
+              items {
+                id
+                name
+                trackingNo
+                refNo
+                transporter
+              }
+            }
+          }
+        `,
+        variables: { filters, sortings: [] }
+      })
+
+      if (!response.errors) {
+        const releaseGood = (response.data.releaseGoods.items || []).map(record => {
+          return {
+            ...record,
+            orderNo: record?.refNo
+          }
+        })[0]
+
+        if (releaseGood && !this.shippingData.records.map(record => record.refNo).includes(releaseGood.refNo)) {
+          let manifestItems = this.shippingData.records || []
+          manifestItems.push({ ...releaseGood })
+          this.shippingData = { records: manifestItems }
+        } else {
+          this._showToast({ message: i18next.t('text.tracking_no_already_exist_in_manifest_list') })
+        }
+
+        this._clearTrackingNoInput()
+      }
+    } catch (e) {
+      this._showToast(e)
+    }
+  }
+
+  async _generateLoadingManifest() {
+    try {
+      this._validateManifestSubmission()
+
+      let manifest = {}
+      manifest.manifestItems = await this._getManifestItems()
+
+      const response = await client.mutate({
+        mutation: gql`
+          mutation generateManifest($manifest: NewManifest!) {
+            generateManifest(manifest: $manifest)
+          }
+        `,
+        variables: { manifest }
+      })
+
+      if (!response.errors) {
+        this._showToast({ message: i18next.t('text.manifest_has_been_generated') })
+        this._clearPage()
+        navigate('loading_manifest_list')
+      }
+    } catch (e) {
+      this._showToast(e)
+    }
+  }
+
+  _focusOnTrackingNoInput() {
+    setTimeout(() => this.trackingNoInput.focus(), 50)
+  }
+
+  _getManifestItems() {
+    return this.shippingGrist.data.records.map(record => {
+      return {
+        refNo: record.refNo,
+        trackingNo: record.trackingNo,
+        transporter: record.transporter
+      }
+    })
+  }
+
+  _validateManifestSubmission() {
+    if (!this.shippingGrist.data.records?.length) {
+      this._focusOnTrackingNoInput()
+      throw new Error(i18next.t('text.manifest_items_is_empty'))
+    }
+  }
+
+  _validateTrackingNo() {
+    if (!this.trackingNoInput?.value) {
+      this._focusOnTrackingNoInput()
+      throw new Error(i18next.t('text.tracking_no_is_empty'))
+    }
+  }
+
+  _clearTrackingNoInput() {
+    this.trackingNoInput.value = ''
+    this._focusOnTrackingNoInput()
+  }
+
+  _clearPage() {
+    this._clearTrackingNoInput()
+    this.shippingData = { ...this.shippingData, records: [] }
+  }
+
+  _showToast({ type, message }) {
+    document.dispatchEvent(
+      new CustomEvent('notify', {
+        detail: {
+          type,
+          message,
+          option: { timer: 1000 }
+        }
+      })
+    )
+  }
+}
+
+customElements.define('create-loading-manifest', CreateLoadingManifest)