From 23f50faa842fc8becfb28789666db2d95cc6b5f9 Mon Sep 17 00:00:00 2001
From: omair saleh <uldvstar@gmail.com>
Date: Thu, 24 Mar 2022 13:11:22 +0800
Subject: [PATCH] release create warehouse arrival parcel module

---
 ...reateWarehousePackageListFormComponent.vue |  26 +-
 .../orders/forms/PackageFormComponent.vue     | 248 +++++++++---------
 .../sections/OrderProfileSectionComponent.vue |   8 +-
 3 files changed, 149 insertions(+), 133 deletions(-)

diff --git a/resources/assets/vue/components/orders/forms/CreateWarehousePackageListFormComponent.vue b/resources/assets/vue/components/orders/forms/CreateWarehousePackageListFormComponent.vue
index 7193c928..27fe0a96 100644
--- a/resources/assets/vue/components/orders/forms/CreateWarehousePackageListFormComponent.vue
+++ b/resources/assets/vue/components/orders/forms/CreateWarehousePackageListFormComponent.vue
@@ -7,22 +7,28 @@
                 </div>
             </div>
             <error-message-component class="m-b-20" :error="error"></error-message-component>
-            <div class="row">
-                <div class="col">
-                    <validation-wrapper-component class="m-b-15" :validator="$v.parameters.receive_date">
+            <div class="row m-b-25">
+                <div class="col p-r-5">
+                    <validation-wrapper-component :validator="$v.parameters.receive_date">
                         <label class="text-primary">Receive Date</label>
-                        <date-picker-component :parameters="parameters" :value="'receive_date'"></date-picker-component>
+                        <date-picker-component v-model="parameters.receive_date"></date-picker-component>
                     </validation-wrapper-component>
-                     <validation-wrapper-component class="m-b-15" :validator="$v.parameters.tracking">
+                </div>
+                <div class="col p-l-5">
+                    <validation-wrapper-component :validator="$v.parameters.tracking">
                         <label class="text-primary">Tracking</label>
                         <input type="text" class="form-control fs-12" v-model.trim="parameters.tracking">
                     </validation-wrapper-component>
+                </div>
+            </div>
+            <div class="row">
+                <div class="col">
                     <package-form-component :section="section" :packages="parameters.packages"></package-form-component>
-                    <div class="row m-t-15 align-items-center justify-content-center">
-                        <div class="col">
-                            <div class="btn btn-block btn-lg btn-primary b-rad-none no-border" @click="submitForm">Submit</div>
-                        </div>
-                    </div>
+                </div>
+            </div>
+            <div class="row m-t-15 align-items-center justify-content-center" v-if="parameters.packages.length > 0">
+                <div class="col">
+                    <div class="btn btn-block btn-lg btn-primary b-rad-none no-border" @click="submitForm">Submit</div>
                 </div>
             </div>
         </div>
diff --git a/resources/assets/vue/components/orders/forms/PackageFormComponent.vue b/resources/assets/vue/components/orders/forms/PackageFormComponent.vue
index 7a4e40aa..a0b4340a 100644
--- a/resources/assets/vue/components/orders/forms/PackageFormComponent.vue
+++ b/resources/assets/vue/components/orders/forms/PackageFormComponent.vue
@@ -1,121 +1,101 @@
 <template>
     <div class="row">
         <div class="col">
-            <div class="row no-margin">
-                <div class="col p-t-25 p-t-25">
-                    <div class="row">
-                        <div class="col p-b-10 b-b b-grey">
-                            <div class="row align-items-center">
-                                <div class="col-auto p-r-0" style="min-width: 40px;">
-                                    <div class="font-heading all-caps fs-10"></div>
-                                </div>
-                                <div class="col p-r-5">
-                                    <div class="font-heading all-caps fs-10 muted">Type</div>
-                                </div>
-                                <div class="col-4 p-r-5 p-l-5">
-                                    <div class="font-heading all-caps fs-10 muted">Description</div>
-                                </div>
-                                <div class="col text-center p-r-5 p-l-5">
-                                    <div class="font-heading all-caps fs-10 muted">Width</div>
-                                </div>
-                                <div class="col text-center p-r-5 p-l-5">
-                                    <div class="font-heading all-caps fs-10 muted">Height</div>
-                                </div>
-                                <div class="col-1 text-center p-r-5 p-l-5">
-                                    <div class="font-heading all-caps fs-10 muted">Length</div>
-                                </div>
-                                <div class="col-1 text-right p-r-5 p-l-5">
-                                    <div class="font-heading all-caps fs-10 muted">Weight</div>
-                                </div>
-                                <div class="col-1 text-right p-r-5 p-l-5">
-                                    <div class="font-heading all-caps fs-10 muted">Quantity</div>
-                                </div>
-                                <div class="col-1 text-right p-r-5 p-l-5">
-                                    <div class="font-heading all-caps fs-10 muted">Reference</div>
-                                </div>
-                                <div class="col-auto text-center">
-                                    <button class="btn btn-xs btn-outline-success b-rad-none invisible"><i class="fa fa-check"></i></button>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
+            <div class="row">
+                <div class="col">
                     <div class="row m-b-20">
                         <div class="col">
                             <div class="row" v-if="!submitted">
-                                <div class="col p-b-5 p-t-5 b-b b-grey">
-                                    <div class="row align-items-center">
-                                        <div class="col-auto p-r-0" style="min-width: 40px;">
-                                            <div class="font-heading all-caps fs-10"></div>
-                                        </div>
+                                <div class="col p-b-10 p-t-10 b-b b-grey">
+                                    <div class="row align-items-center m-b-15">
                                         <div class="col p-r-5">
-                                            <select-component :options="[{'id': 0, 'text': 'Carton'}, {'id': 1, 'text': 'Pallet'}]" v-model="product.type"></select-component>
+                                            <validation-wrapper-component :validator="$v.product.description">
+                                                <label class="text-primary">Description</label>
+                                                <input type="text" class="form-control fs-12" v-model="product.description">
+                                            </validation-wrapper-component>
                                         </div>
-                                        <div class="col-4 p-r-5 p-l-5">
-                                            <textarea class="form-control fs-10 b-rad-none" placeholder="Description" rows="1" @keyup="onlyEnglish($event)" v-model="product.description"></textarea>
+                                        <div class="col p-l-5">
+                                            <validation-wrapper-component :validator="$v.product.quantity">
+                                                <label class="text-primary">Quantity</label>
+                                                <input type="text" class="form-control fs-12" v-model="product.quantity">
+                                            </validation-wrapper-component>
                                         </div>
-
-                                        <div class="col text-center p-r-5 p-l-5">
-                                            <input type="text" class="form-control fs-10 b-rad-none text-center" placeholder="Width" v-model.lazy="product.width"/>
+                                    </div>
+                                    <div class="row m-b-15">
+                                        <div class="col p-r-5">
+                                            <validation-wrapper-component :validator="$v.product.width">
+                                                <label class="text-primary">Width</label>
+                                                <input type="text" class="form-control fs-12" v-model="product.width">
+                                            </validation-wrapper-component>
                                         </div>
-
-                                        <div class="col text-center p-r-5 p-l-5">
-                                            <input type="text" class="form-control fs-10 b-rad-none text-center" placeholder="Height" v-model.lazy="product.height"/>
+                                        <div class="col p-r-5 p-l-5">
+                                            <validation-wrapper-component :validator="$v.product.height">
+                                                <label class="text-primary">Height</label>
+                                                <input type="text" class="form-control fs-12" v-model="product.height">
+                                            </validation-wrapper-component>
                                         </div>
-
-                                        <div class="col text-center p-r-5 p-l-5">
-                                            <input type="text" class="form-control fs-10 b-rad-none text-center" placeholder="Length" v-model.lazy="product.length"/>
+                                        <div class="col p-l-5">
+                                            <validation-wrapper-component :validator="$v.product.length">
+                                                <label class="text-primary">Length</label>
+                                                <input type="text" class="form-control fs-12" v-model="product.length">
+                                            </validation-wrapper-component>
                                         </div>
-
-                                        <div class="col text-center p-r-5 p-l-5">
-                                            <input type="text" class="form-control fs-10 b-rad-none text-center" placeholder="Weight" v-model.lazy="product.weight"/>
-                                        </div>
-
-                                        <div class="col text-center p-r-5 p-l-5">
-                                            <input type="text" class="form-control fs-10 b-rad-none text-center" placeholder="Quantity" v-model.lazy="product.quantity"/>
-                                        </div>
-                                        
-                                        <div class="col text-center p-r-5 p-l-5">
-                                            <input type="text" class="form-control fs-10 b-rad-none text-center" placeholder="Reference" v-model.lazy="product.reference"/>
-                                        </div>
-                                       
-                                        <div class="col-auto">
-                                            <button class="btn btn-xs btn-outline-success b-rad-none" @click="addPackage()"><i class="fa fa-check"></i></button>
+                                    </div>
+                                    <div class="row">
+                                        <div class="col">
+                                            <button class="btn btn-success btn-block b-rad-none" @click="addPackage()">Add Package</button>
                                         </div>
                                     </div>
                                 </div>
                             </div>
                             <div class="row" v-for="(item, index) in packages">
                                 <div class="col p-b-10 p-t-10 b-b b-grey">
-                                    <div class="row  align-items-center">
-                                        <div class="col-auto p-r-0" style="min-width: 40px;">
-                                            <div class="font-heading all-caps fs-10">{{index + 1}}</div>
-                                        </div>
-                                        <div class="col p-r-5">
-                                            <div class="font-heading all-caps fs-10">{{item.type}}</div>
-                                        </div>
-                                        <div class="col-4 p-r-5 p-l-5">
-                                            <div class="font-heading all-caps fs-10">{{item.description}}</div>
-                                        </div>
-                                        <div class="col text-center p-r-5 p-l-5">
-                                            <div class="font-heading all-caps fs-10">{{item.width}}</div>
-                                        </div>
-                                        <div class="col text-center p-r-5 p-l-5">
-                                            <div class="font-heading all-caps fs-10">{{item.height}}</div>
-                                        </div>
-                                        <div class="col-1 text-center p-r-5 p-l-5">
-                                            <div class="font-heading all-caps fs-10">{{item.length}}</div>
-                                        </div>
-                                        <div class="col-1 text-center p-r-5 p-l-5">
-                                            <div class="font-heading all-caps fs-10">{{item.weight}}</div>
-                                        </div>
-                                        <div class="col-1 text-right p-r-5 p-l-5">
-                                            <div class="font-heading all-caps fs-10">{{item.quantity}}</div>
-                                        </div>
-                                        <div class="col-1 text-right p-r-5 p-l-5">
-                                            <div class="font-heading all-caps fs-10">{{item.reference}}</div>
-                                        </div>
-                                        <div class="col-auto">
-                                            <button class="btn btn-xs btn-outline-danger b-rad-none" v-if="!submitted" @click="removePackage(index)"><i class="fa fa-times"></i></button>
+                                    <div class="row">
+                                        <div class="col">
+                                            <div class="row align-items-center m-b-15">
+                                                <div class="col-auto">
+                                                    <div @click="removePackage(index)" class="pointer">
+                                                        <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"
+                                                             width="25" height="25"
+                                                             viewBox="0 0 172 172"
+                                                             style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#e74c3c"><path d="M18.87987,153.12013c2.23887,2.23819 5.86807,2.23819 8.10693,0l59.0132,-59.0132l59.0132,59.0132c2.24964,2.17277 5.82555,2.1417 8.03709,-0.06984c2.21154,-2.21154 2.24261,-5.78745 0.06984,-8.03709l-59.0132,-59.0132l59.0132,-59.0132c1.49042,-1.43949 2.08815,-3.57117 1.56346,-5.57571c-0.52469,-2.00454 -2.09015,-3.57 -4.09469,-4.09469c-2.00454,-0.52469 -4.13622,0.07305 -5.57571,1.56346l-59.0132,59.0132l-59.0132,-59.0132c-2.24964,-2.17277 -5.82555,-2.1417 -8.03709,0.06984c-2.21154,2.21154 -2.24261,5.78745 -0.06984,8.03709l59.0132,59.0132l-59.0132,59.0132c-2.23819,2.23887 -2.23819,5.86807 0,8.10693z"></path></g></g></svg>
+                                                    </div>
+                                                </div>
+                                                <div class="col">
+                                                    <div class="row">
+                                                        <div class="col-3">
+                                                            <p class="m-b-0 small muted">Description</p>
+                                                            <p class="m-b-0 bold">{{item.description}}</p>
+                                                        </div>
+                                                        <div class="col-auto">
+                                                            <p class="m-b-0 small muted">Quantity</p>
+                                                            <p class="m-b-0 bold">{{item.quantity}}</p>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
+                                            <div class="row">
+                                                <div class="col-12">
+                                                    <div class="row align-items-center">
+                                                        <div class="col-auto">
+                                                            <p class="m-b-0 small muted">Width</p>
+                                                            <p class="m-b-0 bold">{{item.width}}</p>
+                                                        </div>
+                                                        <div class="col-auto text-center">
+                                                            <p class="m-b-0 small muted">Height</p>
+                                                            <p class="m-b-0 bold">{{item.height}}</p>
+                                                        </div>
+                                                        <div class="col-auto text-center">
+                                                            <p class="m-b-0 small muted">Length</p>
+                                                            <p class="m-b-0 bold">{{item.length}}</p>
+                                                        </div>
+                                                        <div class="col text-right">
+                                                            <p class="m-b-0 small muted">Total CBM</p>
+                                                            <p class="m-b-0 bold text-success">{{(Math.round((((item.width / 100) * (item.height / 100) * (item.length / 100) * item.quantity)) * 1000) / 1000).toFixed(3)}}</p>
+                                                        </div>
+                                                    </div>
+                                                </div>
+                                            </div>
                                         </div>
                                     </div>
                                 </div>
@@ -129,6 +109,7 @@
     </div>
 </template>
 <script>
+    import { required, numeric } from "vuelidate/lib/validators";
     import formHandler from '../../../general/mixins/formHandler';
     export default {
         props: {
@@ -141,7 +122,7 @@
           return {
               submitted: false,
               product: {
-                  type: '',
+                  type: 0,
                   description: '',
                   width: 0,
                   height: 0,
@@ -152,15 +133,40 @@
               },
           }
         },
-        methods: {
-            onlyEnglish(event){
-                let value = event.target.value,
-                    regex = /^[^~`!@#$%^&*()_+=[\]\{}|;':",.\/<>?a-zA-Z0-9-]+$/;
-                event.preventDefault();
-                if(regex.test(value)){
-                    this.product.description = value.replace(regex, '');
+        validations: {
+            product: {
+                type: {
+                    required
+                },
+                description: {
+                    required
+                },
+                width: {
+                    required,
+                    numeric
+                },
+                height: {
+                    required,
+                    numeric
+                },
+                length: {
+                    required,
+                    numeric
+                },
+                weight: {
+                    required,
+                    numeric
+                },
+                quantity: {
+                    required,
+                    numeric
+                },
+                reference: {
+                    required
                 }
-            },
+            }
+        },
+        methods: {
             addPackage(){
               this.packages.push({
                   type: this.product.type,
@@ -173,17 +179,19 @@
                   reference: this.product.reference,
               });
 
-              this.product = {
-                  type: '',
-                  description: '',
-                  width: 0,
-                  height: 0,
-                  length: 0,
-                  weight: 0,
-                  quantity: 1,
-                  reference: 0,
-              };
-
+              this.resetProduct();
+            },
+            resetProduct(){
+                this.product = {
+                    type: '',
+                    description: '',
+                    width: 0,
+                    height: 0,
+                    length: 0,
+                    weight: 0,
+                    quantity: 1,
+                    reference: 0,
+                };
             },
             removePackage(index){
                 this.packages.splice(index, 1);
diff --git a/resources/assets/vue/components/orders/sections/OrderProfileSectionComponent.vue b/resources/assets/vue/components/orders/sections/OrderProfileSectionComponent.vue
index 7156d78c..0dacb883 100644
--- a/resources/assets/vue/components/orders/sections/OrderProfileSectionComponent.vue
+++ b/resources/assets/vue/components/orders/sections/OrderProfileSectionComponent.vue
@@ -273,9 +273,11 @@
                                                                          viewBox="0 0 172 172"
                                                                          style=" fill:#000000;"><g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode: normal"><path d="M0,172v-172h172v172z" fill="none"></path><g fill="#000000"><path d="M8.6,23.65c-2.37676,0 -4.3,1.92324 -4.3,4.3c0,2.37676 1.92324,4.3 4.3,4.3c2.37676,0 4.3,-1.92324 4.3,-4.3c4.77031,0 8.6,3.82969 8.6,8.6v85.10137c0,8.28926 6.76074,15.05 15.05,15.05h0.50391c0.99941,2.98145 3.72051,5.19863 7.02109,5.19863h4.43438c-0.74746,1.26816 -1.20938,2.72949 -1.20938,4.3c0,4.72832 3.87168,8.6 8.6,8.6c4.72832,0 8.6,-3.87168 8.6,-8.6c0,-1.57051 -0.46191,-3.03184 -1.20938,-4.3h66.91875c-0.74746,1.26816 -1.20937,2.72949 -1.20937,4.3c0,4.72832 3.87168,8.6 8.6,8.6c4.72832,0 8.6,-3.87168 8.6,-8.6c0,-1.57051 -0.46191,-3.03184 -1.20937,-4.3h4.43437c3.36777,0 6.13926,-2.30117 7.08828,-5.375h0.43672v-2.15c0,-3.90527 -3.04863,-7.12188 -6.87832,-7.45781c0.26035,-0.69707 0.42832,-1.43613 0.42832,-2.21719v-40.85c0,-1.67129 -0.73066,-3.14941 -1.78887,-4.3c1.0582,-1.15059 1.78887,-2.62871 1.78887,-4.3v-43c0,-3.53574 -2.91426,-6.45 -6.45,-6.45h-94.6c-3.53574,0 -6.45,2.91426 -6.45,6.45v43c0,1.67129 0.73066,3.14941 1.78887,4.3c-1.0582,1.15059 -1.78887,2.62871 -1.78887,4.3v40.85c0,0.78105 0.16797,1.52012 0.42832,2.21719c-3.15781,0.27715 -5.75293,2.51953 -6.57598,5.48418h-0.30234c-5.96289,0 -10.75,-4.78711 -10.75,-10.75v-85.10137c0,-7.09668 -5.80332,-12.9 -12.9,-12.9zM49.45,30.1h94.6c1.21777,0 2.15,0.93223 2.15,2.15v43c0,1.21777 -0.93223,2.15 -2.15,2.15c-1.17578,0.0168 -2.11641,0.97422 -2.11641,2.15c0,1.17578 0.94062,2.1332 2.11641,2.15c1.21777,0 2.15,0.93223 2.15,2.15v40.85c0,1.21777 -0.93223,2.15 -2.15,2.15h-94.6c-1.21777,0 -2.15,-0.93223 -2.15,-2.15v-40.85c0,-1.21777 0.93223,-2.15 2.15,-2.15c1.17578,-0.0168 2.11641,-0.97422 2.11641,-2.15c0,-1.17578 -0.94063,-2.1332 -2.11641,-2.15c-1.21777,0 -2.15,-0.93223 -2.15,-2.15v-43c0,-1.21777 0.93223,-2.15 2.15,-2.15zM88.15,38.7c-0.77266,-0.0084 -1.49492,0.39473 -1.88965,1.0666c-0.38633,0.67188 -0.38633,1.49492 0,2.1668c0.39473,0.67188 1.11699,1.075 1.88965,1.0666h17.2c0.77266,0.0084 1.49492,-0.39473 1.88965,-1.0666c0.38633,-0.67187 0.38633,-1.49492 0,-2.1668c-0.39472,-0.67187 -1.11699,-1.075 -1.88965,-1.0666zM58.05,77.4c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM66.65,77.4c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM75.25,77.4c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM83.85,77.4c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM92.45,77.4c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM101.05,77.4c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM109.65,77.4c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM118.25,77.4c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM126.85,77.4c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM135.45,77.4c-1.18418,0 -2.15,0.96582 -2.15,2.15c0,1.18418 0.96582,2.15 2.15,2.15c1.18418,0 2.15,-0.96582 2.15,-2.15c0,-1.18418 -0.96582,-2.15 -2.15,-2.15zM88.15,90.3c-0.77266,-0.0084 -1.49492,0.39473 -1.88965,1.0666c-0.38633,0.67188 -0.38633,1.49492 0,2.1668c0.39473,0.67188 1.11699,1.075 1.88965,1.0666h17.2c0.77266,0.0084 1.49492,-0.39473 1.88965,-1.0666c0.38633,-0.67187 0.38633,-1.49492 0,-2.1668c-0.39472,-0.67187 -1.11699,-1.075 -1.88965,-1.0666zM44.075,131.15h105.35c1.80566,0 3.225,1.41934 3.225,3.225c0,1.80566 -1.41934,3.225 -3.225,3.225h-105.35c-1.80566,0 -3.225,-1.41934 -3.225,-3.225c0,-1.80566 1.41934,-3.225 3.225,-3.225zM55.9,141.9c2.40195,0 4.3,1.89805 4.3,4.3c0,2.40195 -1.89805,4.3 -4.3,4.3c-2.40195,0 -4.3,-1.89805 -4.3,-4.3c0,-2.40195 1.89805,-4.3 4.3,-4.3zM137.6,141.9c2.40195,0 4.3,1.89805 4.3,4.3c0,2.40195 -1.89805,4.3 -4.3,4.3c-2.40195,0 -4.3,-1.89805 -4.3,-4.3c0,-2.40195 1.89805,-4.3 4.3,-4.3z"></path></g></g></svg>
                                                                 </div>
-                                                                <div class="col-auto" v-if="false">
-                                                                    <div data-type="createWarehousePackageList" class="btn btn-sm btn-block bg-white text-info b-rad-sm pointer requestModal">Add</div>
-                                                                    <modal-component class="animate__animated animate__fast animate__fadeIn" styleType="stick-up" type="createWarehousePackageList" size="large">
+                                                            </div>
+                                                            <div class="row" v-if="$store.getters.isSuperAdmin()">
+                                                                <div class="col">
+                                                                    <div data-type="createWarehousePackageList" class="text-complete pointer requestModal fs-11 all-caps text-underline">Add Arrived Parcel</div>
+                                                                    <modal-component class="animate__animated animate__fast animate__fadeIn" styleType="stick-up" type="createWarehousePackageList" >
                                                                         <create-warehouse-package-list-form-component :id="order.id" :section="section"></create-warehouse-package-list-form-component>
                                                                     </modal-component>
                                                                 </div>