import { createElement, lazy } from 'react'

const ShipmentInfo = lazy(
  () => import('../../components/Dashboard/Inventory/Shipments/ShipmentInfo')
)
const NewShipment = lazy(
  () => import('../../components/Dashboard/Inventory/Shipments/NewShipment')
)
const ShipShipment = lazy(
  () => import('../../components/Dashboard/Inventory/Shipments/ShipShipment')
)
const ReceiveShipment = lazy(
  () => import('../../components/Dashboard/Inventory/Shipments/ReceiveShipment')
)
const CancelShipment = lazy(
  () => import('../../components/Dashboard/Inventory/Shipments/CancelShipment')
)
const DeleteObject = lazy(
  () => import('../../components/Dashboard/common/DeleteObject')
)
import ShipmentIcon from '../../components/Icons/ShipmentIcon'
import PlusIcon from '../../components/Icons/PlusIcon'
import InfoCircleIcon from '../../components/Icons/InfoCircleIcon'
import EditIcon from '../../components/Icons/EditIcon'
import BinIcon from '../../components/Icons/BinIcon'
import CheckIcon from '../../components/Icons/CheckIcon'
import XMarkIcon from '../../components/Icons/XMarkIcon'
import ListIcon from '../../components/Icons/ListIcon'

export const Shipment = {
  name: 'shipment',
  label: 'Shipment',
  labelPlural: 'Shipments',
  url: '/dashboard/inventory/shipments',
  prefix: 'SHP',
  icon: ShipmentIcon,
  actions: [
    {
      name: 'new',
      type: 'modal',
      pageName: 'list',
      modalWidth: 800,
      label: 'New Shipment',
      icon: PlusIcon,
      content: (objectData, { onOk } = {}) => {
        return createElement(NewShipment, {
          defaultValues: objectData,
          onOk,
          reset: true
        })
      }
    },
    {
      name: 'list',
      type: 'page',
      pageName: 'list',
      label: 'List',
      icon: ListIcon
    },
    {
      name: 'info',
      type: 'page',
      pageName: 'info',
      label: 'Info',
      default: true,
      row: true,
      icon: InfoCircleIcon
    },
    {
      name: 'edit',
      type: 'page',
      pageName: 'info',
      label: 'Edit',
      row: true,
      icon: EditIcon,
      visible: (objectData) => {
        return !(objectData?._isEditing && objectData?._isEditing == true)
      },
      disabled: (objectData) => {
        return objectData?.state?.type != 'draft'
      }
    },
    {
      name: 'cancelEdit',
      label: 'Cancel Edits',
      type: 'page',
      pageName: 'info',
      icon: XMarkIcon,
      visible: (objectData) => {
        return objectData?._isEditing && objectData?._isEditing == true
      }
    },
    {
      name: 'finishEdit',
      label: 'Save Edits',
      type: 'page',
      pageName: 'info',
      icon: CheckIcon,
      visible: (objectData) => {
        return objectData?._isEditing && objectData?._isEditing == true
      }
    },
    {
      name: 'delete',
      type: 'modal',
      modalWidth: 520,
      modalCentered: true,
      label: 'Delete',
      icon: BinIcon,
      danger: true,
      visible: (objectData) => {
        return !(objectData?._isEditing && objectData?._isEditing == true)
      },
      disabled: (objectData) => {
        return objectData?.state?.type != 'draft'
      },
      content: (objectData, { onOk } = {}) => {
        return createElement(DeleteObject, { objectData, onOk })
      }
    },
    { type: 'divider' },
    {
      name: 'ship',
      type: 'modal',
      modalWidth: 520,
      label: 'Ship',
      icon: CheckIcon,
      disabled: (objectData) => {
        return objectData?.state?.type != 'planned'
      },
      visible: (objectData) => {
        return (
          objectData?.state?.type == 'planned' ||
          objectData?.state?.type == 'draft'
        )
      },
      content: (objectData, { onOk } = {}) => {
        return createElement(ShipShipment, { objectData, onOk })
      }
    },
    {
      name: 'receive',
      type: 'modal',
      modalWidth: 520,
      label: 'Receive',
      icon: CheckIcon,
      disabled: (objectData) => {
        return objectData?.state?.type != 'shipped'
      },
      visible: (objectData) => {
        return (
          objectData?.state?.type == 'shipped' ||
          objectData?.state?.type == 'delivered'
        )
      },
      content: (objectData, { onOk } = {}) => {
        return createElement(ReceiveShipment, { objectData, onOk })
      }
    },
    {
      name: 'cancel',
      type: 'modal',
      modalWidth: 520,
      label: 'Cancel',
      icon: CheckIcon,
      danger: true,
      content: (objectData, { onOk } = {}) => {
        return createElement(CancelShipment, { objectData, onOk })
      }
    }
  ],
  pages: [
    {
      name: 'info',
      content: () => createElement(ShipmentInfo)
    }
  ],
  group: [],
  filters: [
    'orderType',
    'order',
    'state',
    'courierService',
    'taxRate',
    'createdAt',
    'updatedAt',
    '_reference'
  ],
  sorters: [
    'createdAt',
    'state',
    'updatedAt',
    'shippedAt',
    'expectedAt',
    'deliveredAt'
  ],
  columns: [
    '_reference',
    'state',
    'orderType',
    'order',
    'amount',
    'amountWithTax',
    'taxRate',
    'taxAmount',
    'invoicedAmount',
    'invoicedAmountWithTax',
    'invoicedAmountRemaining',
    'invoicedAmountWithTaxRemaining',
    'trackingNumber',
    'shippedAt',
    'expectedAt',
    'deliveredAt',
    'updatedAt',
    'createdAt'
  ],
  properties: [
    {
      name: '_id',
      label: 'ID',
      type: 'id',
      columnFixed: 'left',
      objectType: 'shipment',
      columnWidth: 140,
      showCopy: true
    },
    {
      name: 'createdAt',
      label: 'Created At',
      type: 'dateTime',
      readOnly: true,
      columnWidth: 200
    },
    {
      name: '_reference',
      label: 'Reference',
      type: 'reference',
      columnFixed: 'left',
      objectType: 'shipment',
      showCopy: true,
      readOnly: true,
      columnWidth: 180
    },

    {
      name: 'updatedAt',
      label: 'Updated At',
      type: 'dateTime',
      readOnly: true,
      columnWidth: 200
    },
    {
      name: 'state',
      label: 'State',
      type: 'state',
      readOnly: true,
      columnWidth: 260
    },

    {
      name: 'shippedAt',
      label: 'Shipped At',
      type: 'dateTime',
      required: false,
      columnWidth: 175
    },
    {
      name: 'orderType',
      label: 'Order Type',
      required: true,
      type: 'objectType',
      masterFilter: ['purchaseOrder', 'salesOrder'],
      showHyperlink: true,
      columnWidth: 150
    },

    {
      name: 'expectedAt',
      label: 'Expected At',
      type: 'dateTime',
      required: false,
      columnWidth: 175
    },
    {
      name: 'order',
      label: 'Order',
      required: true,
      type: 'object',
      showHyperlink: true,
      objectType: (objectData) => {
        return objectData?.orderType
      },
      columnWidth: 200
    },

    {
      name: 'deliveredAt',
      label: 'Delivered At',
      type: 'dateTime',
      required: false,
      columnWidth: 175
    },
    {
      name: 'courierService',
      label: 'Courier Service',
      required: true,
      type: 'object',
      objectType: 'courierService',
      columnWidth: 200
    },
    {
      name: 'trackingNumber',
      label: 'Tracking Number',
      type: 'text',
      required: false,
      columnWidth: 180
    },
    {
      name: 'taxRate',
      label: 'Tax Rate',
      type: 'object',
      objectType: 'taxRate',
      showHyperlink: true,
      columnWidth: 150
    },
    {
      name: 'taxRecord',
      label: 'Tax Record',
      type: 'object',
      objectType: 'taxRecord',
      showHyperlink: true,
      columnWidth: 150
    },
    {
      name: 'amount',
      label: 'Amount',
      type: 'number',
      required: true,
      prefix: '£',
      min: 0,
      step: 0.01,
      columnWidth: 150
    },
    {
      name: 'taxAmount',
      label: 'Tax Amount',
      type: 'number',
      required: true,
      prefix: '£',
      fixedNumber: 2,
      min: 0,
      step: 0.01,
      readOnly: true,
      columnWidth: 125,
      value: (objectData) => {
        return (objectData?.amount * objectData?.taxRate?.rate) / 100 || 0
      }
    },
    {
      name: 'amountWithTax',
      label: 'Amount w/ Tax',
      type: 'number',
      required: true,
      prefix: '£',
      min: 0,
      step: 0.01,
      readOnly: true,
      columnWidth: 175,
      value: (objectData) => {
        if (objectData?._isEditing == true) {
          return (
            (objectData?.amount || 0) + (objectData?.taxAmount || 0)
          ).toFixed(2)
        }
        if (
          Number.parseFloat(objectData?.amount) &&
          (objectData.taxRate == undefined || objectData.taxRate == null)
        ) {
          return Number.parseFloat(objectData?.amount).toFixed(2)
        }
        if (Number.parseFloat(objectData?.amountWithTax)) {
          return Number.parseFloat(objectData?.amountWithTax).toFixed(2)
        }
        return 0
      }
    },
    {
      name: 'invoicedAmount',
      label: 'Invoiced Amount',
      type: 'number',
      required: false,
      readOnly: true,
      prefix: '£',
      fixedNumber: 2,
      min: 0,
      step: 0.01,
      columnWidth: 150
    },
    {
      name: 'invoicedAmountWithTax',
      label: 'Invoiced Amount w/ Tax',
      type: 'number',
      required: false,
      readOnly: true,
      prefix: '£',
      fixedNumber: 2,
      min: 0,
      step: 0.01,
      columnWidth: 200
    },
    {
      name: 'invoicedAmountRemaining',
      label: 'Remaining Invoiced Amount',
      type: 'number',
      required: false,
      readOnly: true,
      prefix: '£',
      min: 0,
      step: 0.01,
      columnWidth: 225,
      fixedNumber: 2
    },
    {
      name: 'invoicedAmountWithTaxRemaining',
      label: 'Remaining Invoiced Amount w/ Tax',
      type: 'number',
      required: false,
      readOnly: true,
      prefix: '£',
      min: 0,
      fixedNumber: 2,
      step: 0.01,
      columnWidth: 275
    }
  ],
  stats: [
    {
      name: 'draft.count',
      label: 'Draft',
      type: 'number',
      color: 'default'
    },
    {
      name: 'planned.count',
      label: 'Planned',
      type: 'number',
      color: 'warning'
    },
    {
      name: 'shipped.count',
      label: 'Shipped',
      type: 'number',
      color: 'processing'
    },
    {
      name: 'delivered.count',
      label: 'Delivered',
      type: 'number',
      color: 'success'
    },
    {
      name: 'cancelled.count',
      label: 'Cancelled',
      type: 'number',
      color: 'error'
    },
    {
      name: 'inTransitValue.amountWithTax.sum',
      label: 'In Transit Value',
      type: 'number',
      prefix: '£',
      roundNumber: 2,
      color: 'processing',
      cardWidth: 200
    }
  ]
}