@things-factory/operato-mms 4.0.0-alpha.7 → 4.0.0-beta.1

package/client/pages/order/logistics/shopee-order-init-batch-popup.js

@@ -1,11 +1,15 @@
-import { MultiColumnFormStyles } from '@things-factory/form-ui'
 import '@things-factory/grist-ui'
-import { i18next, localize } from '@things-factory/i18n-base'
-import { client, CustomAlert } from '@things-factory/shell'
-import { gqlBuilder, isMobileDevice } from '@things-factory/utils'
+
 import gql from 'graphql-tag'
 import { css, html, LitElement } from 'lit-element'
 
+import { MultiColumnFormStyles } from '@things-factory/form-ui'
+import { i18next, localize } from '@things-factory/i18n-base'
+import { client, CustomAlert } from '@things-factory/shell'
+import { isMobileDevice } from '@things-factory/utils'
+
+import { PLATFORM } from '../../constants'
+
 class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
   static get properties() {
     return {
@@ -16,16 +20,23 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
       addressList: Array,
       timeSlotList: Array,
       _type: String,
-      store: Object
+      _searchFields: Array,
+      store: Object,
+      marketplaceSettings: Array,
+      maxWeightSetting: Object,
+      ownShippingProviders: Array,
+      shippingProviders: Array
     }
   }
 
   constructor() {
     super()
-    this.logisticsParam = { pickup: true, dropoff: true }
+    this._searchFields = []
     this.addressList = []
     this.timeSlotList = []
     this.branchList = []
+    this.marketplaceSettings = []
+    this.maxWeightSetting = []
   }
 
   static get styles() {
@@ -69,6 +80,25 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
     return html`
       <search-form id="search-form" .fields=${this._searchFields} @submit=${e => this.grist.fetch()}></search-form>
 
+      ${this._type === 'non_integrated'
+        ? html`<div name="batchUpdate" class="multi-column-form">
+            <label>${i18next.t('label.own_shipping_provider')}</label>
+            <select name="ownShippingProvider-select">
+              <option value="">${i18next.t('text.select_courier')}</option>
+              ${(this.ownShippingProviders || []).map(
+                shippingProvider => html` <option value="${shippingProvider.name}">${shippingProvider.name}</option> `
+              )}
+            </select>
+
+            <div class="set-button-container">
+              <mwc-button
+                @click="${e => this.setShippingProvider()}"
+                raised
+                label="${i18next.t('button.set')}"
+              ></mwc-button>
+            </div>
+          </div>`
+        : ''}
       ${this._type === 'pickup'
         ? html` <div name="batchUpdate" class="multi-column-form">
             <label>${i18next.t('label.address')}</label>
@@ -98,13 +128,17 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
           id="grist"
           .mode=${isMobileDevice() ? 'LIST' : 'GRID'}
           .config=${this.config}
-          .data="${this.data}"
-          .fetchHandler="${this.fetchHandler.bind(this)}"
+          .fetchHandler=${this.fetchHandler.bind(this)}
           @field-change="${this._onFieldChangeHandler.bind(this)}"
         ></data-grist>
       </div>
 
       <div class="button-container">
+        <mwc-button
+          @click="${this.splitOrders.bind(this)}"
+          raised
+          label="${i18next.t('button.split_order')}"
+        ></mwc-button>
         <mwc-button
           @click="${this.initLogistics.bind(this)}"
           raised
@@ -130,7 +164,12 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
     return this.shadowRoot.querySelector('select[name=pickupdate-select]')
   }
 
+  get ownShippingProviderSelect() {
+    return this.shadowRoot.querySelector('select[name=ownShippingProvider-select]')
+  }
+
   get gristConfig() {
+    const maxWeight = this.maxWeightSetting[0].value
     return {
       list: {
         fields: [
@@ -140,11 +179,25 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
           'shippingProvider',
           'itemCount',
           'totalAmount',
+          'totalVolume',
+          'totalWeight',
           'status',
           'updatedAt'
         ]
       },
-      rows: { selectable: { multiple: true }, appendable: false },
+      rows: {
+        selectable: { multiple: true },
+        appendable: false,
+        classifier: function (record, rowIndex) {
+          const totalWeight = record['totalWeight']
+          var emphasized
+          if (totalWeight > maxWeight) {
+            emphasized = ['#F43838', 'yellow']
+          }
+
+          return { emphasized }
+        }
+      },
       pagination: { infinite: true },
       columns: [
         { type: 'gutter', gutterName: 'sequence' },
@@ -175,6 +228,13 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
           sortable: true,
           width: 130
         },
+        {
+          type: 'string',
+          name: 'ownShippingProvider',
+          header: i18next.t('field.own_shipping_carrier'),
+          sortable: true,
+          width: 130
+        },
         {
           type: 'string',
           name: 'itemCount',
@@ -187,7 +247,21 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
           name: 'totalAmount',
           header: i18next.t('field.total_amount'),
           sortable: true,
-          width: 100
+          width: 80
+        },
+        {
+          type: 'number',
+          name: 'totalVolume',
+          header: i18next.t('field.total_volume'),
+          label: true,
+          width: 80
+        },
+        {
+          type: 'number',
+          name: 'totalWeight',
+          header: i18next.t('field.total_weight'),
+          label: true,
+          width: 80
         },
         {
           type: 'string',
@@ -201,39 +275,46 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
   }
 
   async firstUpdated() {
-    const shippingProviders = await this.fetchShippingProvider()
+    this.ownShippingProviders = [{ name: 'SeeBuu Logistics' }]
+    this.shippingProviders = await this.fetchShippingProvider()
+    this.marketplaceSettings = await this.fetchMarketplaceSettings()
+    this.maxWeightSetting = this.marketplaceSettings.filter(
+      setting => setting.category === 'marketplace_order_max_weight'
+    )
+
+    await this.fetchHandler({ page: 1, limit: 100 })
     this._initGrist()
 
     this._searchFields = [
       {
-        label: i18next.t('field.shipping_carrier'),
-        name: 'shippingProvider',
+        label: i18next.t('field.type'),
+        name: 'logisticsType',
         type: 'select',
         options: [
-          { value: '' },
-          ...shippingProviders.map(shippingProvider => {
+          { name: '', value: '' },
+          ...Object.keys(this.logisticsParam).map(key => {
             return {
-              name: shippingProvider.name,
-              value: shippingProvider.name
+              name: key,
+              value: key
             }
           })
         ],
+        handlers: { change: this._initGrist.bind(this) },
         props: { searchOper: 'eq' }
       },
       {
-        label: i18next.t('field.type'),
-        name: 'logisticsType',
+        label: i18next.t('field.shipping_carrier'),
+        name: 'shippingProvider',
         type: 'select',
         options: [
-          { name: '', value: '' },
-          ...Object.keys(this.logisticsParam).map(key => {
+          { value: '' },
+          ...this.shippingProviders.map(shippingProvider => {
             return {
-              name: key,
-              value: key
+              name: shippingProvider.name,
+              value: shippingProvider.name
             }
           })
         ],
-        handlers: { change: this._initGrist.bind(this) },
         props: { searchOper: 'eq' }
       }
     ]
@@ -241,8 +322,6 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
 
   async fetchHandler({ page, limit, sorters = [{ name: 'orderUpdatedAt', desc: true }] }) {
     try {
-      this._validateInput()
-
       let filters = [
         {
           name: 'marketplaceStore',
@@ -251,7 +330,8 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
         },
         {
           name: 'trackingNo',
-          operator: 'is_null'
+          operator: 'is_null',
+          value: ''
         },
         {
           name: 'status',
@@ -264,7 +344,6 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
       const pagination = { page, limit }
       const sortings = sorters
 
-      // should add store filter conditions
       const response = await client.query({
         query: gql`
           query marketplaceOrdersForBatchInit($filters: [Filter], $pagination: Pagination, $sortings: [Sorting]) {
@@ -295,6 +374,13 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
                     phone2
                     attentionTo
                     trackingNo
+                    ownTrackingNo
+                    transporter
+                    ownTransporter
+                    totalWeight
+                    weightUnit
+                    totalVolume
+                    volumeUnit
                   }
                   marketplaceProductVariation {
                     name
@@ -308,10 +394,12 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
                 status
                 itemCount
                 shippingProvider
+                ownShippingProvider
                 totalAmount
                 orderCreatedAt
                 orderUpdatedAt
                 trackingNo
+                ownTrackingNo
                 updatedAt
                 fullLogisticsDetail {
                   pickup
@@ -352,74 +440,92 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
       })
 
       if (!response.errors) {
-        let marketplaceOrders = response.data.marketplaceOrdersForBatchInit.items
-        marketplaceOrders = marketplaceOrders.map(item => {
+        const marketplaceOrders = response.data.marketplaceOrdersForBatchInit.items.map(item => {
           return {
             ...item,
-            trackingNo: this.getTrackingNos(item.marketplaceOrderItems)
+            trackingNo: this.getOrderShippingInformation(item.marketplaceOrderItems, 'trackingNo'),
+            ownTrackingNo: this.getOrderShippingInformation(item.marketplaceOrderItems, 'ownTrackingNo'),
+            totalWeight: this.getOrderShippingInformation(item.marketplaceOrderItems, 'totalWeight'),
+            totalVolume: this.getOrderShippingInformation(item.marketplaceOrderItems, 'totalVolume')
           }
         })
 
-        const records = marketplaceOrders.map(itm => {
-          switch (this._type) {
-            case 'pickup':
-              return {
-                ...itm,
-                rowOptionPickupAddress: {
-                  options: [
-                    {
-                      display: '',
-                      value: ''
-                    },
-                    ...itm.fullLogisticsDetail.logisticsDetail.pickup.map(pickup => {
-                      const addressDetail = {
-                        display: pickup.address + ' ,' + pickup.city + ' ,' + pickup.zipcode + ' ,' + pickup.state,
-                        value: pickup.addressId.toString(),
-                        timeSlot: pickup.timeSlot
-                      }
+        const logisticsDetails = marketplaceOrders.map(order => order.fullLogisticsDetail)
+        this.logisticsParam = this.buildLogisticsParam(logisticsDetails)
 
-                      if (!this.addressList.map(list => list.value).includes(addressDetail.value)) {
-                        this.addressList = Array.from(new Set([...this.addressList, addressDetail]))
-                      }
+        let records = []
+        if (this._type) {
+          records = marketplaceOrders.map(itm => {
+            switch (this._type) {
+              case 'pickup':
+                if (itm.fullLogisticsDetail?.pickup?.length > 0) {
+                  return {
+                    ...itm,
+                    rowOptionPickupAddress: {
+                      options: [
+                        {
+                          display: '',
+                          value: ''
+                        },
+                        ...itm.fullLogisticsDetail.logisticsDetail.pickup.map(pickup => {
+                          const addressDetail = {
+                            display: pickup.address + ' ,' + pickup.city + ' ,' + pickup.zipcode + ' ,' + pickup.state,
+                            value: pickup.addressId.toString(),
+                            timeSlot: pickup.timeSlot
+                          }
 
-                      return addressDetail
-                    })
-                  ]
+                          if (!this.addressList.map(list => list.value).includes(addressDetail.value)) {
+                            this.addressList = Array.from(new Set([...this.addressList, addressDetail]))
+                          }
+
+                          return addressDetail
+                        })
+                      ]
+                    }
+                  }
+                } else {
+                  return
                 }
-              }
 
-            case 'dropoff':
-              return {
-                ...itm,
-                requiredBranch: itm.fullLogisticsDetail.dropoff.indexOf('branch_id') >= 0 ? true : false,
-                requiredSender: itm.fullLogisticsDetail.dropoff.indexOf('sender_real_name') >= 0 ? true : false,
-                requiredTracking: itm.fullLogisticsDetail.dropoff.indexOf('tracking_no') >= 0 ? true : false,
-                rowOptionDropoffBranch: {
-                  options: [
-                    {
-                      display: '',
-                      value: ''
-                    },
-                    ...itm.fullLogisticsDetail.logisticsDetail.dropoff.map(dropoff => {
-                      const addressDetail = {
-                        display: dropoff.address + ' ,' + dropoff.city + ' ,' + dropoff.zipcode + ' ,' + dropoff.state,
-                        value: dropoff.branchId.toString()
-                      }
+              case 'dropoff':
+                if (itm.fullLogisticsDetail?.dropoff?.length > 0) {
+                  return {
+                    ...itm,
+                    requiredBranch: itm.fullLogisticsDetail.dropoff.includes('branch_id'),
+                    requiredSender: itm.fullLogisticsDetail.dropoff.includes('sender_real_name'),
+                    requiredTracking: itm.fullLogisticsDetail.dropoff.includes('tracking_no'),
+                    rowOptionDropoffBranch: {
+                      options: [
+                        {
+                          display: '',
+                          value: ''
+                        },
+                        ...itm.fullLogisticsDetail.logisticsDetail.dropoff.map(dropoff => {
+                          const addressDetail = {
+                            display:
+                              dropoff.address + ' ,' + dropoff.city + ' ,' + dropoff.zipcode + ' ,' + dropoff.state,
+                            value: dropoff.branchId.toString()
+                          }
 
-                      if (!this.addressList.map(list => list.value).includes(addressDetail.value)) {
-                        this.addressList = Array.from(new Set([...this.addressList, addressDetail]))
-                      }
+                          if (!this.addressList.map(list => list.value).includes(addressDetail.value)) {
+                            this.addressList = Array.from(new Set([...this.addressList, addressDetail]))
+                          }
 
-                      return addressDetail
-                    })
-                  ]
+                          return addressDetail
+                        })
+                      ]
+                    }
+                  }
+                } else {
+                  return { ...itm }
                 }
-              }
 
-            default:
-              break
-          }
-        })
+              default:
+                return { ...itm }
+            }
+          })
+        }
+
         return {
           total: records.length || 0,
           records
@@ -430,8 +536,19 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
     }
   }
 
-  getTrackingNos(marketplaceOrderItems) {
-    let trackingNo = ''
+  buildLogisticsParam(logisticsDetails) {
+    let logisticsParam = {}
+
+    if (logisticsDetails.some(param => param.pickup !== null)) logisticsParam = { ...logisticsParam, pickup: true }
+    if (logisticsDetails.some(param => param.dropoff !== null)) logisticsParam = { ...logisticsParam, dropoff: true }
+    if (logisticsDetails.some(param => param.non_integrated !== null))
+      logisticsParam = { ...logisticsParam, non_integrated: true }
+
+    return logisticsParam
+  }
+
+  getOrderShippingInformation(marketplaceOrderItems, type) {
+    let item
     let marketplaceOrderShippings = []
 
     marketplaceOrderItems.map(item => {
@@ -446,27 +563,86 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
       return marketplaceOrderShippings.find(a => a.id === id)
     })
 
-    if (uniqueMarketplaceOrderShippings) {
-      uniqueMarketplaceOrderShippings.map(marketplaceOrderShipping => {
-        if (this.store?.platform === PLATFORM.LAZADA.value) {
-          var newTrackingNo = []
-          if (marketplaceOrderShipping?.trackingNo) {
-            const trackingNos = JSON.parse(marketplaceOrderShipping.trackingNo)
-            newTrackingNo = trackingNos.map(item => item.tracking_code)
-          }
-          let uniqueTrackingNos = [...new Set(newTrackingNo)]
-          trackingNo = uniqueTrackingNos.join(', ')
-        } else {
-          trackingNo = marketplaceOrderShipping.trackingNo
+    switch (type) {
+      case 'trackingNo':
+        if (uniqueMarketplaceOrderShippings) {
+          uniqueMarketplaceOrderShippings.map(marketplaceOrderShipping => {
+            if (this.store?.platform === PLATFORM.LAZADA.value) {
+              var newTrackingNo = []
+              if (marketplaceOrderShipping?.trackingNo) {
+                const trackingNos = JSON.parse(marketplaceOrderShipping.trackingNo)
+                newTrackingNo = trackingNos.map(item => item.tracking_code)
+              }
+              let uniqueTrackingNos = [...new Set(newTrackingNo)]
+              item = uniqueTrackingNos.join(', ')
+            } else {
+              item = marketplaceOrderShipping.trackingNo
+            }
+          })
         }
-      })
+        break
+      case 'ownTrackingNo':
+        if (uniqueMarketplaceOrderShippings) {
+          uniqueMarketplaceOrderShippings.map(marketplaceOrderShipping => {
+            if (this.store?.platform === PLATFORM.LAZADA.value) {
+              var newTrackingNo = []
+              if (marketplaceOrderShipping?.ownTrackingNo) {
+                const trackingNos = JSON.parse(marketplaceOrderShipping.ownTrackingNo)
+                newTrackingNo = trackingNos.map(item => item.tracking_code)
+              }
+              let uniqueTrackingNos = [...new Set(newTrackingNo)]
+              item = uniqueTrackingNos.join(', ')
+            } else {
+              item = marketplaceOrderShipping.ownTrackingNo
+            }
+          })
+        }
+        break
+      case 'totalVolume':
+        let totalVolume = 0
+        if (uniqueMarketplaceOrderShippings) {
+          uniqueMarketplaceOrderShippings.map(marketplaceOrderShipping => {
+            totalVolume += marketplaceOrderShipping?.totalVolume || 0
+          })
+        }
+
+        item = parseFloat(totalVolume) || 0
+        break
+      case 'totalWeight':
+        let totalWeight = 0
+        if (uniqueMarketplaceOrderShippings) {
+          uniqueMarketplaceOrderShippings.map(marketplaceOrderShipping => {
+            totalWeight += marketplaceOrderShipping?.totalWeight
+          })
+        }
+        item = parseFloat(totalWeight) || 0
+        break
     }
 
-    return trackingNo
+    return item
   }
 
   _initGrist() {
     let extension = []
+    let trackingNoColumn = {}
+    if (this.store.isOwnTransport) {
+      trackingNoColumn = {
+        type: 'string',
+        name: 'ownTrackingNo',
+        header: i18next.t('field.own_tracking_no'),
+        record: { editable: true },
+        width: 300
+      }
+    } else {
+      trackingNoColumn = {
+        type: 'string',
+        name: 'trackingNo',
+        header: i18next.t('field.tracking_no'),
+        record: { editable: true },
+        width: 300
+      }
+    }
+
     switch (this.searchForm.serialize().logisticsType) {
       case 'pickup':
         extension = [
@@ -522,19 +698,14 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
             header: i18next.t('field.required_tracking'),
             width: 110
           },
-          {
-            type: 'string',
-            name: 'trackingNo',
-            header: i18next.t('field.tracking_no'),
-            record: { editable: true },
-            width: 300
-          }
+          trackingNoColumn
         ]
         this._type = 'dropoff'
         break
 
-      default:
-        this._type = ''
+      case 'non_integrated':
+        extension = [trackingNoColumn]
+        this._type = 'non_integrated'
         break
     }
 
@@ -548,15 +719,14 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
     try {
       const response = await client.query({
         query: gql`
-          query {
-            getStoreLogistics(${gqlBuilder.buildArgs({
-              storeId: this.store.id
-            })}) {
+          query getStoreLogistics($storeId: String!) {
+            getStoreLogistics(storeId: $storeId) {
               name
               isDefault
             }
           }
-        `
+        `,
+        variables: { storeId: this.store.id }
       })
 
       if (!response.errors) {
@@ -567,6 +737,74 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
     }
   }
 
+  async fetchMarketplaceSettings() {
+    const filters = []
+    const sortings = []
+
+    const response = await client.query({
+      query: gql`
+        query marketplaceSettings($filters: [Filter], $sortings: [Sorting]) {
+          marketplaceSettings(filters: $filters, sortings: $sortings) {
+            items {
+              id
+              name
+              marketplaceStore {
+                id
+                name
+                storeName
+                platform
+                description
+              }
+              category
+              value
+              updatedAt
+            }
+            total
+          }
+        }
+      `,
+      variables: { filters, sortings }
+    })
+
+    if (!response.error) {
+      return response.data.marketplaceSettings.items || []
+    }
+  }
+
+  async setShippingProvider() {
+    try {
+      let selectedData = this.grist.selected
+      if (!selectedData?.length) throw new Error('please select at least one order')
+
+      const ownShippingProviderValue = this.ownShippingProviderSelect?.value
+      if (!ownShippingProviderValue) throw new Error('Own Shipping provider selection is required')
+
+      const patches = selectedData.map(patch => {
+        return {
+          id: patch.id,
+          orderNo: patch.orderNo,
+          ownShippingProvider: ownShippingProviderValue
+        }
+      })
+
+      const response = await client.mutate({
+        mutation: gql`
+          mutation setOwnShippingProviderByOrders($patches: [LogisticsInfo]!) {
+            setOwnShippingProviderByOrders(patches: $patches)
+          }
+        `,
+        variables: { patches }
+      })
+
+      if (!response.errors) {
+        await this.fetchHandler({ page: 1, limit: 100 })
+        this._initGrist()
+      }
+    } catch (e) {
+      this._showToast(e)
+    }
+  }
+
   async initLogistics() {
     let result = await CustomAlert({
       title: i18next.t('title.are_you_sure'),
@@ -580,6 +818,7 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
     try {
       let selectedData = this.grist.selected
       let deliveryType = this.searchForm.queryFilters.find(itm => itm.name == 'logisticsType')?.value
+      let shippingProvider = this.searchForm.queryFilters.find(itm => itm.name == 'shippingProvider')?.value
       let patches = []
       this._validateInit(selectedData)
 
@@ -589,7 +828,7 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
             return {
               id: patch.id,
               orderNo: patch.orderNo,
-              deliveryType: deliveryType,
+              deliveryType,
               addressId: parseInt(patch?.addressId),
               pickupTimeId: patch?.pickupTimeId
             }
@@ -601,14 +840,27 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
       } else if (this._type == 'dropoff') {
         patches = selectedData.map(patch => {
           let data = {
-            id: data.id,
+            id: patch.id,
             orderNo: patch.orderNo,
-            deliveryType: deliveryType
+            deliveryType
           }
 
-          if (itm.requiredBranch) data = { ...data, branchId: patch.branchId }
-          if (itm.requiredSender) data = { ...data, senderRealName: patch.senderRealName }
-          if (itm.requiredTracking) data = { ...data, trackingNo: patch.trackingNo }
+          if (patch.requiredBranch) data = { ...data, branchId: patch.branchId }
+          if (patch.requiredSender) data = { ...data, senderRealName: patch.senderRealName }
+          if (patch.requiredTracking) data = { ...data, trackingNo: patch.trackingNo }
+
+          return data
+        })
+      } else if (this._type == 'non_integrated') {
+        patches = selectedData.map(patch => {
+          return {
+            id: patch.id,
+            orderNo: patch.orderNo,
+            deliveryType,
+            trackingNo: patch.trackingNo,
+            ownTrackingNo: patch.ownTrackingNo,
+            shippingProvider
+          }
         })
       }
 
@@ -724,25 +976,18 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
             return { ...item, ...updateData }
           })
         ]
-      }
 
-      this.grist.refresh()
+        this.grist.refresh()
+      }
     } catch (e) {
       this._showToast(e)
     }
   }
 
-  _validateInput() {
-    const shippingProvider = this.searchForm.queryFilters.find(filter => filter.name == 'shippingProvider')
-    if (!(shippingProvider && shippingProvider.value)) {
-      throw new Error(i18next.t('text.kindly_select_a_shipping_provider'))
-    }
-  }
-
   _validateInit(patches) {
     if (this._type == 'pickup') {
       patches.forEach(itm => {
-        if (itm.orderNo == '' || itm.addressId == NaN || itm.pickupTimeId == undefined)
+        if (itm.orderNo == '' || isNaN(itm.addressId) || itm.pickupTimeId == undefined)
           throw new Error(i18next.t('text.invalid_data'))
       })
     }
@@ -756,6 +1001,63 @@ class ShopeeOrderInitBatchPopup extends localize(i18next)(LitElement) {
           throw new Error(i18next.t('text.tracking_is_required'))
       })
     }
+
+    if (this._type == 'non_integrated') {
+      let deliveryType = this.searchForm.queryFilters.find(itm => itm.name == 'logisticsType')?.value
+      let shippingProvider = this.searchForm.queryFilters.find(itm => itm.name == 'shippingProvider')?.value
+
+      if (!shippingProvider || shippingProvider === '') {
+        throw new Error('Shipping provider selection is required for initiate logistics')
+      }
+
+      if (!deliveryType || deliveryType === '') {
+        throw new Error('Delivery type selection is required for initiate logistics')
+      }
+
+      patches.forEach(itm => {
+        if (!itm?.trackingNo) throw new Error(i18next.t('text.tracking_is_required'))
+      })
+    }
+  }
+
+  async splitOrders() {
+    try {
+      let selectedData = this.grist.selected
+      this._validateSplitting(selectedData)
+
+      const patches = selectedData.map(patch => {
+        return {
+          id: patch.id,
+          orderNo: patch.orderNo
+        }
+      })
+
+      const response = await client.mutate({
+        mutation: gql`
+          mutation splitOrdersByBatch($patches: [LogisticsInfo]!) {
+            splitOrdersByBatch(patches: $patches)
+          }
+        `,
+        variables: { patches }
+      })
+
+      if (!response.errors) {
+        this.dispatchEvent(new CustomEvent('order-updated'))
+        history.back()
+      }
+    } catch (e) {
+      this._showToast(e)
+    }
+  }
+
+  _validateSplitting(data) {
+    if (!data) {
+      throw new Error('No order to split')
+    }
+
+    if (data.some(item => item.trackingNo)) {
+      throw new Error('Order with tracking no not allowed to split')
+    }
   }
 
   _showToast({ type, message }) {