diff --git a/app/Classes/Modules/Accounts/ControllersLogic/CreateCustomerLogic.php b/app/Classes/Modules/Accounts/ControllersLogic/CreateCustomerLogic.php
index 9cb48b0f..7762dffa 100644
--- a/app/Classes/Modules/Accounts/ControllersLogic/CreateCustomerLogic.php
+++ b/app/Classes/Modules/Accounts/ControllersLogic/CreateCustomerLogic.php
@@ -126,7 +126,9 @@ class CreateCustomerLogic extends AbstractControllerLogic
         /** @var CompanyModule $companyModule */
         $companyModule = $this->createCompanyModuleProcessor->execute($company, BusinessType::IMPORTER);
 
-        $connectionObject = new CompanyConnectionObject($companyModule, 'CIEF', mt_rand(1000, 9999).(new GeneratesInitials())->name($company->name)->length(3)->generate());
+        $inviter = $this->fetchesCompanyModule->execute(['reference'=>'CIEF']);
+
+        $connectionObject = new CompanyConnectionObject($companyModule, $inviter, 'CIEF', mt_rand(1000, 9999).(new GeneratesInitials())->name($company->name)->length(3)->generate());
 
         $connection = $this->createsCompanyConnection->execute($connectionObject);
 
diff --git a/app/Classes/Modules/Accounts/Services/AuthenticationRedirect.php b/app/Classes/Modules/Accounts/Services/AuthenticationRedirect.php
index b359108d..1d08a191 100644
--- a/app/Classes/Modules/Accounts/Services/AuthenticationRedirect.php
+++ b/app/Classes/Modules/Accounts/Services/AuthenticationRedirect.php
@@ -2,6 +2,7 @@
 
 namespace App\Classes\Modules\Accounts\Services;
 
+use App\Classes\ValueObjects\Constants\BusinessType;
 use App\Classes\ValueObjects\Constants\RoleTypes;
 use App\Models\User;
 
@@ -11,6 +12,9 @@ class AuthenticationRedirect
     public function url(User $user){
 
         if($user->type === RoleTypes::USER){
+            if ($user->companyModule()->first()->type === BusinessType::ONLINE_SELLER) {
+                return route('delivery.dashboard');
+            }
             return route('dashboard');
         }
 
diff --git a/app/Classes/Modules/Companies/DataTransferObjects/CompanyConnectionObject.php b/app/Classes/Modules/Companies/DataTransferObjects/CompanyConnectionObject.php
index 300d76c5..d74a64c8 100644
--- a/app/Classes/Modules/Companies/DataTransferObjects/CompanyConnectionObject.php
+++ b/app/Classes/Modules/Companies/DataTransferObjects/CompanyConnectionObject.php
@@ -10,6 +10,9 @@ class CompanyConnectionObject implements DataTransferObject
 
     /** @var CompanyModule */
     private $invitee;
+    
+    /** @var CompanyModule */
+    private $inviter;
 
     /** @var string */
     private $inviterReference;
@@ -20,12 +23,14 @@ class CompanyConnectionObject implements DataTransferObject
     /**
      * CompanyConnectionObject constructor.
      * @param CompanyModule $invitee
+     * @param CompanyModule $inviter
      * @param string $inviterReference
      * @param string $inviteeReference
      */
-    public function __construct(CompanyModule $invitee, string $inviterReference, string $inviteeReference)
+    public function __construct(CompanyModule $invitee, CompanyModule $inviter, string $inviteeReference, string $inviterReference)
     {
         $this->invitee = $invitee;
+        $this->inviter = $inviter;
         $this->inviterReference = $inviterReference;
         $this->inviteeReference = $inviteeReference;
     }
@@ -38,6 +43,14 @@ class CompanyConnectionObject implements DataTransferObject
         return $this->invitee;
     }
 
+    /**
+     * @return CompanyModule
+     */
+    public function getInviter(): CompanyModule
+    {
+        return $this->inviter;
+    }
+
     /**
      * @return string
      */
diff --git a/app/Classes/Modules/Companies/Services/CreatesCompanyConnection.php b/app/Classes/Modules/Companies/Services/CreatesCompanyConnection.php
index d5d11ecc..6095da18 100644
--- a/app/Classes/Modules/Companies/Services/CreatesCompanyConnection.php
+++ b/app/Classes/Modules/Companies/Services/CreatesCompanyConnection.php
@@ -30,10 +30,8 @@ class CreatesCompanyConnection extends AbstractUpdateRecord
     public function execute(CompanyConnectionObject $object)
     {
 
-        $companyModule = $this->fetchesCompany->execute(['id', 1])->companyModules()->first();
-
         $connection = new CompanyConnection();
-        $connection->inviter_id = $companyModule->id;
+        $connection->inviter_id = $object->getInviter()->id;
         $connection->invitee_id = $object->getInvitee()->id;
         $connection->inviter_reference = $object->getInviterReference();
         $connection->invitee_reference = $object->getInviteeReference();
diff --git a/app/Classes/Modules/Delivery/ControllersLogic/CreateDeliveryCustomerLogic.php b/app/Classes/Modules/Delivery/ControllersLogic/CreateDeliveryCustomerLogic.php
new file mode 100644
index 00000000..c7368439
--- /dev/null
+++ b/app/Classes/Modules/Delivery/ControllersLogic/CreateDeliveryCustomerLogic.php
@@ -0,0 +1,149 @@
+<?php
+
+namespace App\Classes\Modules\Delivery\ControllersLogic;
+
+use App\Classes\General\Abstracts\AbstractControllerLogic;
+
+use App\Classes\General\Services\GeneratesInitials;
+use App\Classes\Modules\Accounts\Processors\AuthenticationProcessor;
+use App\Classes\Modules\Accounts\Processors\CreateUserProcessor;
+use App\Classes\Modules\Accounts\Processors\GenerateEmailVerificationAttemptProcessor;
+use App\Classes\Modules\Companies\DataTransferObjects\CompanyConnectionObject;
+use App\Classes\Modules\Companies\Processors\AssignEmployeeProcessor;
+use App\Classes\Modules\Companies\Processors\CreateCompanyProcessor;
+use App\Classes\Modules\Companies\Processors\CreateCompanyModuleProcessor;
+use App\Classes\Modules\Companies\DataTransferObjects\EmploymentObject;
+use App\Classes\Modules\Companies\Services\ApprovesCompanyConnection;
+use App\Classes\Modules\Companies\Services\CreatesCompanyConnection;
+use App\Classes\Modules\Contacts\DataTransferObjects\ContactObject;
+use App\Classes\Modules\Contacts\Processors\CreateContactProcessor;
+use App\Classes\Modules\Documents\Processors\UploadIdentityDocumentProcessor;
+
+use App\Classes\ValueObjects\Constants\ApprovalStatus;
+use App\Classes\ValueObjects\Constants\BusinessType;
+use App\Classes\ValueObjects\Constants\CompanyType;
+use App\Classes\ValueObjects\Constants\RoleTypes;
+
+use App\Models\Company;
+use App\Models\CompanyModule;
+use App\Models\User;
+
+use Illuminate\Http\JsonResponse;
+use Illuminate\Http\Request;
+use Illuminate\Support\Facades\App;
+use App\Classes\Modules\Companies\Services\FetchesCompanyModule;
+
+class CreateDeliveryCustomerLogic extends AbstractControllerLogic
+{
+
+    /**
+     * @return array
+     */
+    protected function notification(): array
+    {
+        return [
+            'title' => 'Created User',
+            'message' => 'You have successfully created a new User'
+        ];
+    }
+
+    /** @var CreateUserProcessor */
+    private $createUserProcessor;
+
+    /** @var CreateCompanyProcessor */
+    private $createCompanyProcessor;
+
+    /** @var CreateCompanyModuleProcessor */
+    private $createCompanyModuleProcessor;
+
+    /** @var CreateContactProcessor */
+    private $createContactProcessor;
+
+    /** @var CreatesCompanyConnection */
+    private $createsCompanyConnection;
+
+    /** @var ApprovesCompanyConnection */
+    private $approvesCompanyConnection;
+
+    /** @var AssignEmployeeProcessor */
+    private $assignEmployeeProcessor;
+
+    /** @var UploadIdentityDocumentProcessor */
+    private $uploadIdentityDocumentProcessor;
+
+    /** @var AuthenticationProcessor */
+    private $authenticationProcessor;
+
+    /** @var GenerateEmailVerificationAttemptProcessor */
+    private $generateEmailVerificationAttemptProcessor;
+
+    /** @var FetchesCompanyModule */
+    private $fetchesCompanyModule;
+
+    /**
+     * CreateDeliveryCustomerLogic constructor.
+     * @param CreateUserProcessor $createUserProcessor
+     * @param CreateCompanyProcessor $createCompanyProcessor
+     * @param CreateCompanyModuleProcessor $createCompanyModuleProcessor
+     * @param CreateContactProcessor $createContactProcessor
+     * @param CreatesCompanyConnection $createsCompanyConnection
+     * @param ApprovesCompanyConnection $approvesCompanyConnection
+     * @param AssignEmployeeProcessor $assignEmployeeProcessor
+     * @param UploadIdentityDocumentProcessor $uploadIdentityDocumentProcessor
+     * @param AuthenticationProcessor $authenticationProcessor
+     * @param GenerateEmailVerificationAttemptProcessor $generateEmailVerificationAttemptProcessor
+     * @param FetchesCompanyModule $fetchesCompanyModule
+     */
+    public function __construct(CreateUserProcessor $createUserProcessor, CreateCompanyProcessor $createCompanyProcessor, CreateCompanyModuleProcessor $createCompanyModuleProcessor, CreateContactProcessor $createContactProcessor, CreatesCompanyConnection $createsCompanyConnection, ApprovesCompanyConnection $approvesCompanyConnection, AssignEmployeeProcessor $assignEmployeeProcessor, UploadIdentityDocumentProcessor $uploadIdentityDocumentProcessor, AuthenticationProcessor $authenticationProcessor, GenerateEmailVerificationAttemptProcessor $generateEmailVerificationAttemptProcessor, FetchesCompanyModule $fetchesCompanyModule)
+    {
+        $this->createUserProcessor = $createUserProcessor;
+        $this->createCompanyProcessor = $createCompanyProcessor;
+        $this->createCompanyModuleProcessor = $createCompanyModuleProcessor;
+        $this->createContactProcessor = $createContactProcessor;
+        $this->createsCompanyConnection = $createsCompanyConnection;
+        $this->approvesCompanyConnection = $approvesCompanyConnection;
+        $this->assignEmployeeProcessor = $assignEmployeeProcessor;
+        $this->uploadIdentityDocumentProcessor = $uploadIdentityDocumentProcessor;
+        $this->authenticationProcessor = $authenticationProcessor;
+        $this->generateEmailVerificationAttemptProcessor = $generateEmailVerificationAttemptProcessor;
+        $this->fetchesCompanyModule = $fetchesCompanyModule;
+    }
+
+    /**
+     * @param Request $request
+     * @return JsonResponse
+     * @throws \App\Classes\Exceptions\AccessForbiddenException
+     * @throws \App\Classes\Exceptions\AccessUnauthorisedException
+     * @throws \App\Classes\Exceptions\MalformedRequestException
+     * @throws \App\Classes\Exceptions\RequestValidationException
+     */
+    public function logic(Request $request): JsonResponse
+    {
+        /** @var User $user */
+        $user = $this->createUserProcessor->execute($request, RoleTypes::USER, !App::environment(['production']) ? ApprovalStatus::APPROVED : ApprovalStatus::PENDING_VERIFICATION);
+
+        /** @var Company $company */
+        $company = $this->createCompanyProcessor->execute($request->input('name'), CompanyType::PERSONAL_BUSINESS, ApprovalStatus::PENDING_SUBMISSION);
+
+        $contactObject = new ContactObject($request->input('name'), $request->input('phone'), $request->input('contact_email'), $request->input('wechat_id'));
+
+        $this->createContactProcessor->execute($contactObject, $company);
+
+        /** @var CompanyModule $companyModule */
+        $companyModule = $this->createCompanyModuleProcessor->execute($company, BusinessType::ONLINE_SELLER);
+
+        $inviter = $this->fetchesCompanyModule->execute(['reference'=>'EXP']);
+
+        $connectionObject = new CompanyConnectionObject($companyModule, $inviter, 'EXP', mt_rand(1000, 9999).(new GeneratesInitials())->name($company->name)->length(3)->generate());
+
+        $connection = $this->createsCompanyConnection->execute($connectionObject);
+
+        $this->approvesCompanyConnection->execute($connection);
+
+        $Object = new EmploymentObject($companyModule, $user);
+
+        $this->assignEmployeeProcessor->execute($Object);
+
+        return $this->response($this->authenticationProcessor->execute($request));
+    }
+}
diff --git a/app/Classes/ValueObjects/Constants/BusinessType.php b/app/Classes/ValueObjects/Constants/BusinessType.php
index 41c673c6..ec38450f 100644
--- a/app/Classes/ValueObjects/Constants/BusinessType.php
+++ b/app/Classes/ValueObjects/Constants/BusinessType.php
@@ -18,4 +18,7 @@ final class BusinessType {
 
     public const CURRENCY_VENDOR = 6;
 
+    public const ONLINE_SELLER = 7;
+
+    public const LAST_MILE_DELIVERY_AGENT = 8;
 }
diff --git a/app/Http/Controllers/Delivery/CreateDeliveryCustomerController.php b/app/Http/Controllers/Delivery/CreateDeliveryCustomerController.php
new file mode 100644
index 00000000..6321d758
--- /dev/null
+++ b/app/Http/Controllers/Delivery/CreateDeliveryCustomerController.php
@@ -0,0 +1,20 @@
+<?php
+
+namespace App\Http\Controllers\Delivery;
+
+use App\Classes\Modules\Delivery\ControllersLogic\CreateDeliveryCustomerLogic;
+use Illuminate\Http\JsonResponse;
+use Illuminate\Http\Request;
+
+class CreateDeliveryCustomerController
+{
+    /**
+     * @param Request $request
+     * @param CreateDeliveryCustomerLogic $createDeliveryCustomerLogic
+     * @return JsonResponse
+     */
+    public function create(Request $request, CreateDeliveryCustomerLogic $createDeliveryCustomerLogic): JsonResponse
+    {
+        return $createDeliveryCustomerLogic->execute($request);
+    }
+}
\ No newline at end of file
diff --git a/resources/assets/vue/components/accounts/forms/NewRegistrationFormComponent.vue b/resources/assets/vue/components/accounts/forms/NewRegistrationFormComponent.vue
new file mode 100644
index 00000000..abca50db
--- /dev/null
+++ b/resources/assets/vue/components/accounts/forms/NewRegistrationFormComponent.vue
@@ -0,0 +1,102 @@
+<template>
+    <div class="row">
+        <div class="col">
+            <div class="row text-left" @keyup.enter="submitForm">
+                <div class="col">
+                    <error-message-component class="m-b-20" :error="error"></error-message-component>
+                    <div class="row">
+                        <div class="col">
+                            <div class="row m-b-15">
+                                <div class="col p-r-5">
+                                    <validation-wrapper-component :validator="$v.parameters.name">
+                                        <label>Full Name</label>
+                                        <input class="form-control" v-model="parameters.name">
+                                    </validation-wrapper-component>
+                                </div>
+                                <div class="col p-l-5">
+                                    <validation-wrapper-component :validator="$v.parameters.phone">
+                                        <label>Phone</label>
+                                        <input class="form-control" v-model="parameters.phone">
+                                    </validation-wrapper-component>
+                                </div>
+                            </div>
+                            <div class="row m-b-15">
+                                <div class="col">
+                                    <validation-wrapper-component :validator="$v.parameters.email">
+                                        <label>Email</label>
+                                        <input class="form-control" v-model="parameters.email">
+                                    </validation-wrapper-component>
+                                </div>
+                            </div>
+
+                            <div class="row m-b-15">
+                                <div class="col p-r-5">
+                                    <validation-wrapper-component :validator="$v.parameters.password">
+                                        <label>Password</label>
+                                        <input class="form-control" type="password" v-model="parameters.password">
+                                    </validation-wrapper-component>
+                                </div>
+                                <div class="col p-l-5">
+                                    <validation-wrapper-component :validator="$v.parameters.password_confirmation">
+                                        <label>Password Confirmation</label>
+                                        <input class="form-control" type="password" v-model="parameters.password_confirmation">
+                                    </validation-wrapper-component>
+                                </div>
+                            </div>
+                            <div class="row">
+                                <div class="col-auto">
+                                    <button type="button" class="btn btn-sm p-t-10 p-b-10 btn-default bg-master-lighter b-rad-none" @click="$store.dispatch('toggleSection', {name: 'registrationForm', status: false})">
+                                        <div class="row align-items-center">
+                                            <div class="col-auto p-r-10">
+                                                <i class="fa fa-angle-left fs-16" style="margin-top: 1px;"></i>
+                                            </div>
+                                            <div class="col p-l-5">I already have an account</div>
+                                        </div>
+                                    </button>
+                                </div>
+                                <div class="col text-right">
+                                    <button type="button" class="btn btn-sm btn-block p-t-10 p-b-10 p-r-35 p-l-35 btn-primary b-rad-none p-r-30" @click="submitForm()">
+                                        <div class="row align-items-center">
+                                            <div class="col p-r-5">Sign Up</div>
+                                        </div>
+                                    </button>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+</template>
+<script>
+    import registrationFormValidation from '../../../general/mixins/accounts/validation/newRegistrationFormValidation';
+    export default {
+        data() {
+            return {
+                error: '',
+                step: 1,
+                parameters : {
+                    name: '',
+                    email: '',
+                    type: 1,
+                    phone: '',
+                    password: '',
+                    password_confirmation: '',
+                },
+                status:{
+                    direction:null,
+                },
+                watchCheckEmail:null
+
+            }
+        },
+        methods:{
+            submitForm(){
+                this.submit(this.route('api.delivery.account.registration.register'), 'post', this.section, false, false);
+            }
+        },
+        mixins: [registrationFormValidation]
+    }
+</script>
diff --git a/resources/assets/vue/components/containers/forms/CreateDeliveryOrderFormComponent.vue b/resources/assets/vue/components/containers/forms/CreateDeliveryOrderFormComponent.vue
new file mode 100644
index 00000000..068f7404
--- /dev/null
+++ b/resources/assets/vue/components/containers/forms/CreateDeliveryOrderFormComponent.vue
@@ -0,0 +1,238 @@
+<template>
+    <div class="row justify-content-center" @keyup.enter="submitForm">
+        <div class="col col-md-8">
+            <div class="row m-b-0 text-info">
+                <div class="col">
+                    <h3 class="text-center">Create Order</h3>
+                </div>
+            </div>
+            <error-message-component class="m-b-0" :error="error"></error-message-component>
+            <div class="row">
+                <div class="col">
+                    <div class="row" v-if="step === 1">
+                        <div class="col">
+                            <div class="row m-b-20">
+                                <div class="col">
+                                    <div class="row m-b-20 text-info">
+                                        <div class="col text-center">
+                                            <h5 class="m-b-0 m-t-0">Select Mode</h5>
+                                        </div>
+                                    </div>
+                                    <div class="row text-center justify-content-center">
+                                        <div class="col col-md-3 p-r-5">
+                                            <div class="b-a b-thick p-t-15 p-b-15 p-l-35 p-r-35 pointer" :class="{ 'b-primary': parameters.selectedMode === 'Lodge In / Walk In', 'b-grey': parameters.selectedMode !== 'Lodge In / Walk In' }"  @click="updateMode('Lodge In / Walk In')">
+                                                <div class="row m-b-15 justify-content-center">
+                                                    <div class="col-8">
+                                                        <img src="/images/guangzhou-map.png" class="w-100">
+                                                    </div>
+                                                </div>
+                                                <div class="row">
+                                                    <div class="col">
+                                                        <h5 class="no-margin" :class="{ 'text-primary': parameters.selectedMode === 'Lodge In / Walk In', 'semi-bold': parameters.selectedMode === 'Lodge In / Walk In' }">Lodge In / Walk In</h5>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                        <div class="col col-md-3 p-l-5">
+                                            <div class="b-a b-thick p-t-15 p-b-15 p-l-35 p-r-35 pointer" :class="{ 'b-primary': parameters.selectedMode === 'Pick Up', 'b-grey': parameters.selectedMode !== 'Pick Up' }" @click="updateMode('Pick Up')">
+                                                <div class="row m-b-15 justify-content-center">
+                                                    <div class="col-8">
+                                                        <img src="/images/yiwu-map.png" class="w-100">
+                                                    </div>
+                                                </div>
+                                                <div class="row">
+                                                    <div class="col">
+                                                        <h5 class="no-margin" :class="{ 'text-primary': parameters.selectedMode === 'Pick Up', 'semi-bold': parameters.selectedMode === 'Pick Up'}">Pick Up</h5>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <div class="row m-b-20" v-if="parameters.selectedMode === 'Pick Up'">
+                                <div class="col">
+                                    <div class="row m-b-20 p-t-5 p-b-5 text-info b-a b-grey pointer" @click="expandPickUpAddress = !expandPickUpAddress">
+                                        <div class="col text-center">
+                                            <h3>Please select your Pick Up address</h3>
+                                        </div>
+                                        <div class="col-auto d-flex justify-content-center align-items-center">
+                                            <i class="fa fs-30 lightest" :class="{'fa-angle-down': !expandPickUpAddress, 'fa-angle-up': expandPickUpAddress}"></i>
+                                        </div>
+                                    </div>
+                                    <div class="row justify-content-center m-b-15" v-if="error">
+                                        <div class="col-10">
+                                            <small class="text-danger">{{error}}</small>
+                                        </div>
+                                    </div>
+                                    <div class="row justify-content-center b-l b-r b-b b-grey" v-if="expandPickUpAddress">
+                                        <div class="col col-md-10">
+                                            <list-component style="min-height: 50px;" section="addressList" :emptyListSection=false :endpoint="route('api.address.list')" :options="{per_page: 5, HasMorphCompanyModule: parameters.company_module_id}">
+                                                <template slot="list" slot-scope="{data}">
+                                                    <select-address-component :data="data" :value="parameters.address_id" v-model="parameters.address_id"></select-address-component>
+                                                </template>
+                                            </list-component>
+                                            <div class="row m-t-10 m-b-10 animate__animated animate__fadeInUpBig animate__delay-1 animate__fast">
+                                                <div class="col b-a p-t-15 p-b-15 pointer" :class="{ 'b-primary': !parameters.address_id, 'b-grey': parameters.address_id}" @click="parameters.address_id = null">
+                                                    <div class="row align-items-center">
+                                                        <div class="col-auto p-r-0">
+                                                            <i class="fa fs-20 p-t-5" :class="{'fa-circle-o': parameters.address_id, 'fa-check-circle': !parameters.address_id, 'text-primary': !parameters.address_id}"></i>
+                                                        </div>
+                                                        <div class="col-auto semi-bold">New Address</div>
+                                                    </div>
+                                                    <div class="row" v-show="!parameters.address_id">
+                                                        <div class="col">
+                                                            <address-form-component :id="0" section="addressList" @input="parameters.address_id = $event"></address-form-component>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <div class="row m-t-15 align-items-center justify-content-center">
+                                <div class="col">
+                                    <div class="btn btn-block btn-lg btn-default b-rad-none" @click="$store.dispatch('toggleSection', {name: 'createOrderFormSection', status: false})">Cancel</div>
+                                </div>
+                                <div class="col">
+                                    <div class="btn btn-block btn-lg btn-primary b-rad-none" @click="step++">Next</div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="row m-t-20" v-if="step === 2">
+                        <div class="col">
+                            <validation-wrapper-component class="m-b-15" :validator="$v.parameters.container_reference">
+                                <label class="text-primary">Shipment Type</label>
+                                <input type="text" class="form-control fs-12" v-model.trim="parameters.container_reference">
+                            </validation-wrapper-component>
+
+                            <validation-wrapper-component class="m-b-15" :validator="$v.parameters.container_reference">
+                                <label class="text-primary">Quantity</label>
+                                <input type="text" class="form-control fs-12" v-model.trim="parameters.container_reference">
+                            </validation-wrapper-component>
+
+                            <validation-wrapper-component class="m-b-15" :validator="$v.parameters.container_reference">
+                                <label class="text-primary">Weight</label>
+                                <input type="text" class="form-control fs-12" v-model.trim="parameters.container_reference">
+                            </validation-wrapper-component>
+
+                             <div class="row m-b-20">
+                                <div class="col">
+                                    <div class="row m-b-20 text-info">
+                                        <div class="col text-center">
+                                            <h3>Please select your delivery address</h3>
+                                        </div>
+                                    </div>
+                                    <div class="row justify-content-center m-b-15" v-if="error">
+                                        <div class="col-10">
+                                            <small class="text-danger">{{error}}</small>
+                                        </div>
+                                    </div>
+                                    <div class="row justify-content-center">
+                                        <div class="col col-md-10">
+                                            <list-component style="min-height: 50px;" section="addressList" :emptyListSection=false :endpoint="route('api.address.list')" :options="{per_page: 5, HasMorphCompanyModule: parameters.company_module_id}">
+                                                <template slot="list" slot-scope="{data}">
+                                                    <select-address-component :data="data" :value="parameters.address_id" v-model="parameters.address_id"></select-address-component>
+                                                </template>
+                                            </list-component>
+                                            <div class="row m-t-10 m-b-10 animate__animated animate__fadeInUpBig animate__delay-1 animate__fast">
+                                                <div class="col b-a p-t-15 p-b-15 pointer" :class="{ 'b-primary': !parameters.address_id, 'b-grey': parameters.address_id}" @click="parameters.address_id = null">
+                                                    <div class="row align-items-center">
+                                                        <div class="col-auto p-r-0">
+                                                            <i class="fa fs-20 p-t-5" :class="{'fa-circle-o': parameters.address_id, 'fa-check-circle': !parameters.address_id, 'text-primary': !parameters.address_id}"></i>
+                                                        </div>
+                                                        <div class="col-auto semi-bold">New Address</div>
+                                                    </div>
+                                                    <div class="row" v-show="!parameters.address_id">
+                                                        <div class="col">
+                                                            <address-form-component :id="0" section="addressList" @input="parameters.address_id = $event"></address-form-component>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <div class="row m-t-15 align-items-center justify-content-center">
+                                <div class="col">
+                                    <div class="btn btn-block btn-lg btn-default b-rad-none" @click="step--">Back</div>
+                                </div>
+                                <div class="col">
+                                    <div class="btn btn-block btn-lg btn-primary b-rad-none" @click="submitForm">Submit</div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+<script>
+    import componentHandler from '../../../general/mixins/componentHandler';
+    import modalFormHandler from '../../../general/mixins/modalFormHandler';
+    import { required } from "vuelidate/lib/validators";
+
+    export default {
+        data() {
+            return {
+                error: '',
+                step: 1,
+                expandPickUpAddress: false,
+                parameters: {
+                    address_id: null,
+                    selectedMode: 'Lodge In / Walk In',
+                    container_reference: this.container_reference,
+                    container_number: this.container_number,
+                    seal_reference: this.seal_reference,
+                    container_type: 1,
+                    company_module_id: this.company_module_id,
+                    etd: this.etd, 
+                    eta: this.eta, 
+                }
+            };
+        },
+        validations: {
+            parameters: {
+                etd: {
+                    required
+                },
+                eta: {
+                    required
+                },
+                company_module_id: {
+                    required
+                },
+                container_reference: {
+                    required
+                },
+                container_number: {
+                    required
+                },
+                seal_reference: {
+                    required
+                },
+                container_type: {
+                    required
+                },
+            }
+        },
+        methods: {
+            submitForm(){
+                this.submit(this.route('api.packing_list.container.create.load'), 'post', this.section, true, true)
+            },
+            updateMode(mode){
+                this.parameters.selectedMode = mode;
+            }
+        },
+        mixins: [componentHandler, modalFormHandler]
+    }
+
+</script>
\ No newline at end of file
diff --git a/resources/assets/vue/general/mixins/accounts/validation/newRegistrationFormValidation.js b/resources/assets/vue/general/mixins/accounts/validation/newRegistrationFormValidation.js
new file mode 100644
index 00000000..b311215a
--- /dev/null
+++ b/resources/assets/vue/general/mixins/accounts/validation/newRegistrationFormValidation.js
@@ -0,0 +1,27 @@
+import { required, email, numeric, sameAs, requiredUnless, requiredIf } from "vuelidate/lib/validators";
+import authenticationHandler from '../authenticationHandler'
+export default {
+    validations: {
+        parameters: {
+            name: {
+                required
+            },
+            email: {
+                required,
+                email
+            },
+            phone: {
+                required,
+                numeric
+            },
+            password: {
+                required
+            },
+            password_confirmation: {
+                required,
+                sameAs: sameAs('password')
+            },
+        }
+    },
+    mixins: [authenticationHandler]
+}
\ No newline at end of file
diff --git a/resources/views/pages/accounts/signup.blade.php b/resources/views/pages/accounts/signup.blade.php
index 226cd994..a8f49cf8 100644
--- a/resources/views/pages/accounts/signup.blade.php
+++ b/resources/views/pages/accounts/signup.blade.php
@@ -42,12 +42,60 @@
                                         <div class="content p-t-0 overflow-hidden">
                                             <div class="row h-100 no-margin align-items-center justify-content-center">
                                                 <div class="col col-md-10">
-                                                    <div class="row">
+                                                    <div class="row" v-show="!$store.getters.isShowing('registrationForm')">
+                                                        <div class="col">
+                                                            <div class="row" v-show="!$store.getters.isShowing('forgetPassword')">
+                                                                <div class="col">
+                                                                    <loading-component style="height: 350px;" key="1" color="primary" v-show="$store.getters.isLoading('loginSection')"></loading-component>
+                                                                    <div class="row" v-show="!$store.getters.isLoading('loginSection')">
+                                                                        <div class="col">
+                                                                            <div class="row m-b-15">
+                                                                                <div class="col">
+                                                                                    <div class="inline v-align-middle">
+                                                                                        <div class="font-heading fs-20 all-caps no-margin lh-28 bold">Sign In</div>
+                                                                                        <p class="no-margin fs-11 light">To keep using the service please sign in with your personal info</p>
+                                                                                    </div>
+                                                                                </div>
+                                                                            </div>
+                                                                            <div class="row">
+                                                                                <div class="col">
+                                                                                    <login-form-component section="loginSection"></login-form-component>
+                                                                                </div>
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                            <div class="row" v-show="$store.getters.isShowing('forgetPassword')">
+                                                                <div class="col">
+                                                                    <loading-component style="height: 350px;" key="1" color="primary" v-show="$store.getters.isLoading('forgetPasswordSection')"></loading-component>
+                                                                    <div class="row" v-show="!$store.getters.isLoading('forgetPasswordSection')">
+                                                                        <div class="col">
+                                                                            <div class="row m-b-15" v-show="!$store.getters.isShowing('forgetPasswordSuccess')">
+                                                                                <div class="col">
+                                                                                    <div class="inline v-align-middle">
+                                                                                        <div class="font-heading fs-20 all-caps no-margin lh-28 bold">Forget Password</div>
+                                                                                        <p class="no-margin fs-11 light">Enter your registered email below to receive the password reset instruction</p>
+                                                                                    </div>
+                                                                                </div>
+                                                                            </div>
+                                                                            <div class="row">
+                                                                                <div class="col">
+                                                                                    <forget-password-form-component section="forgetPasswordSection"></forget-password-form-component>
+                                                                                </div>
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+                                                        </div>
+                                                    </div>
+                                                    <div class="row" v-show="$store.getters.isShowing('registrationForm')">
                                                         <div class="col">
                                                             <loading-component style="height: 350px;" key="1" color="primary" v-show="$store.getters.isLoading('loginSection')"></loading-component>
                                                             <div class="row justify-content-center" v-show="!$store.getters.isLoading('loginSection')">
                                                                 <div class="col">
-                                                                    <registration-form-component section="loginSection"></registration-form-component>
+                                                                    <new-registration-form-component section="loginSection"></new-registration-form-component>
                                                                 </div>
                                                             </div>
                                                         </div>
diff --git a/resources/views/pages/delivery/admin.blade.php b/resources/views/pages/delivery/admin.blade.php
new file mode 100644
index 00000000..b435a520
--- /dev/null
+++ b/resources/views/pages/delivery/admin.blade.php
@@ -0,0 +1,43 @@
+<div class="row d-none" :class="[{'d-flex': $store.getters.isAdmin}]" v-if="$store.getters.isAdmin">
+    <div class="col">
+        <div class="row">
+            <div class="col-6">
+                <div class="row p-b-5 b-b b-grey m-b-10 m-l-0 m-r-0">
+                    <div class="col no-padding">
+                        <h6>Orders List</h6>
+                    </div>
+                </div>
+                <div class="row m-l-0 m-r-0">
+                    <div class="col">
+                        <list-component key="2" section="customerWithoutConfirmedOrdersListSection" :endpoint="route('api.company.list')" :options="{'has_business_module_type': 1, 'created_after': '18-09-2021','without_confirmed_orders': true}">
+                            <template slot="list" slot-scope="{data}">
+                                <company-component :data="data"></company-component>
+                            </template>
+                        </list-component>
+                        <list-component section="searchOrderListSection" :endpoint="route('api.order.list')" :options="{reference_like:query, with_packing_lists: true}" :columns=3 v-if="$store.getters.isShowing('searchOrderSection')">
+                            <template slot="list" slot-scope="{data}">
+                                <order-component :data="data"></order-component>
+                            </template>
+                        </list-component>
+                    </div>
+                </div>
+            </div>
+            <div class="col-6">
+                <div class="row p-b-5 b-b b-grey m-b-10 m-l-0 m-r-0">
+                    <div class="col no-padding">
+                        <h6>Customers List</h6>
+                    </div>
+                </div>
+                <div class="row m-l-0 m-r-0">
+                    <div class="col">
+                        <list-component key="2" section="customerListSection" :endpoint="route('api.company.list')" :options="{'has_business_module_type': 1}">
+                            <template slot="list" slot-scope="{data}">
+                                <company-component :data="data"></company-component>
+                            </template>
+                        </list-component>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/resources/views/pages/delivery/customers.blade.php b/resources/views/pages/delivery/customers.blade.php
new file mode 100644
index 00000000..1cf41bb6
--- /dev/null
+++ b/resources/views/pages/delivery/customers.blade.php
@@ -0,0 +1,16 @@
+<div class="row d-none" :class="[{'d-flex': !$store.getters.isAdmin}]" v-if="!$store.getters.isAdmin">
+    <div class="col">
+        <div class="row">
+            <div class="col">
+                <div class="row m-b-15" v-show="!$store.getters.isShowing('createOrderFormSection')">
+                    <div class="col">
+                        <div data-type="createContainer" class="btn btn-sm btn-primary all-caps b-rad-none pointer m-l-5 rounded btn-lg" @click="$store.dispatch('toggleSection', {name: 'createOrderFormSection', status: true})"><i class="fa fa-plus m-r-10"></i>Create Order</div>
+                    </div>
+                </div>
+                <create-delivery-order-form-component section="deliveryOrderComponent" v-show="$store.getters.isShowing('createOrderFormSection')"></create-delivery-order-form-component>
+            </div>
+        </div>
+        <!-- <customer-profile-section-component :company_id="$store.getters.getCompanyId"></customer-profile-section-component> -->
+        <p>orders list</p>
+    </div>
+</div>
\ No newline at end of file
diff --git a/resources/views/pages/delivery/dashboard.blade.php b/resources/views/pages/delivery/dashboard.blade.php
new file mode 100644
index 00000000..c4a2362c
--- /dev/null
+++ b/resources/views/pages/delivery/dashboard.blade.php
@@ -0,0 +1,5 @@
+@extends('layouts.base_portal')
+@section('inner_content')
+    @include('pages.delivery.customers')
+    @include('pages.delivery.admin')
+@endsection
\ No newline at end of file
diff --git a/routes/api.php b/routes/api.php
index a9383a2b..04094f78 100644
--- a/routes/api.php
+++ b/routes/api.php
@@ -22,6 +22,8 @@ Route::group(['middleware' => 'api', 'prefix' => 'v1', 'as' => 'api.'], function
 
     require __DIR__ . '/account.php';
 
+    require __DIR__ . '/delivery.php';
+
     Route::group(['middleware' => 'valid.token'], function () {
 
         Route::get('/storage/{fileName}/fetch', 'Documents\RenderDocumentController@fileStorageServe')->where(['fileName' => '.*'])->name('storage.document.file');
diff --git a/routes/delivery.php b/routes/delivery.php
new file mode 100644
index 00000000..7370f146
--- /dev/null
+++ b/routes/delivery.php
@@ -0,0 +1,7 @@
+<?php
+
+use Illuminate\Support\Facades\Route;
+
+Route::group(['prefix' => 'delivery', 'namespace' => 'Delivery', 'as' => 'delivery.'], function () {
+    Route::post('/delivery/registration', 'CreateDeliveryCustomerController@create')->name('account.registration.register');
+});
diff --git a/routes/web.php b/routes/web.php
index b99ae38f..8a727a21 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -31,10 +31,14 @@ Route::get('', function () {
     return view('pages.accounts.login');
 })->name('login');
 
-Route::get('/signup', function () {
+Route::get('/delivery', function () {
     return view('pages.accounts.signup');
 })->name('signup');
 
+Route::get('/delivery/dashboard', function () {
+    return view('pages.delivery.dashboard');
+})->name('delivery.dashboard');
+
 Route::group(['prefix' => 'swagger'], function () {
     Route::get('/', function () {
         return view('swagger.index');