From 24035f0f7f240dcce1569f276f66c1eb330749c2 Mon Sep 17 00:00:00 2001
From: "zeinab.ashrafi" <ashrafisokout@gmail.com>
Date: Wed, 26 Mar 2025 14:30:47 +0330
Subject: [PATCH] fix : style and items

---
 src/components/core/Drawer.vue            | 131 ++++++++++++----------
 src/components/modal/testresult/Show.vue  |  87 ++++----------
 src/components/modal/user/List.vue        |   8 +-
 src/config/urls.js                        |  11 +-
 src/router/paths.js                       |   4 +-
 src/services/global/api.service.js        |   6 +-
 src/store/modules/app/state.js            |   2 +-
 src/styles/css/Assets/Main.scss           |   6 +
 src/styles/css/Assets/WM-ModernTheme.scss |   5 +-
 src/views/Dashboard.vue                   |  14 +--
 src/views/Item/AddEdit.vue                |  25 ++---
 src/views/Item/List.vue                   |   2 -
 src/views/MyItem/List.vue                 |   2 +-
 src/views/MyItem/Tabs/MyItems.vue         | 126 +++++++++++++--------
 src/views/MyItem/Tabs/MyRequests.vue      |  77 ++++++-------
 src/views/Package/AddEdit.vue             |  33 +-----
 src/views/Package/List.vue                |  10 --
 17 files changed, 260 insertions(+), 289 deletions(-)

diff --git a/src/components/core/Drawer.vue b/src/components/core/Drawer.vue
index 3d52570..0de6261 100644
--- a/src/components/core/Drawer.vue
+++ b/src/components/core/Drawer.vue
@@ -1,54 +1,34 @@
 <template>
-    <v-navigation-drawer id="app-drawer" v-model="inputValue" app absolute dark floating persistent
+    <v-navigation-drawer id="app-drawer" v-model="inputValue" class="black" app absolute dark floating persistent
                          mobile-break-point="991"
                          width="260">
         <v-img :src="image" height="100%">
-            <v-layout class="fill-height" tag="v-list" column>
-                <v-list-tile avatar>
-                    <v-list-tile-avatar color="white">
-                        <!-- <v-img
-                          :src="logo"
-                          height="34"
-                          contain
-                        /> -->
-                    </v-list-tile-avatar>
-                    <v-list-tile-title class="title">
-                        {{ $store.state.user.name }}
-                        <br/>
-                        {{ $store.state.user.medical_center?.name }}
-                        <v-chip small class="user-role" color="#3a3a3a" text-color="#c3c3c3">
+            <v-layout class="fill-height px-3" tag="v-list" column>
+                <v-list-tile avatar class="px-3 pt-4">
+                    <v-list-tile-title class="title ">
+                        <p class="user-name mb-0">{{ $store.state.user.name }}</p>
+                        <p class="hospital-name mb-0">{{ $store.state.user.medical_center?.name }}</p>
+                        <v-chip small class="user-role mx-0" color="#323232" text-color="#dcdcdc">
                             {{ $store.state.roles[0] }}
                         </v-chip>
                     </v-list-tile-title>
-
                 </v-list-tile>
-                <v-divider/>
+                <v-divider class="mb-1"/>
                 <v-list-tile v-if="responsive">
                     <v-text-field class="purple-input search-input" label="Search..." color="purple"/>
                 </v-list-tile>
                 <template v-for="(link, i) in links">
-                    <v-list-tile v-if="!link.role || $hasRole(link.role)" :key="i" :to="link.to" :active-class="color"
-                                 avatar
-                                 class="v-list-item">
-                        <v-list-tile-action>
-                            <v-icon>{{ link.icon }}</v-icon>
-                        </v-list-tile-action>
-                        <v-list-tile-title v-text="link.text"/>
-                    </v-list-tile>
+
+                        <v-list-tile v-if="!link.role || $hasRole(link.role)" :key="i" :to="link.to" :active-class="color"
+                                     avatar
+                                     class="v-list-item ">
+                            <!--                        <v-list-tile-action>-->
+                            <!--                            <v-icon>{{ link.icon }}</v-icon>-->
+                            <!--                        </v-list-tile-action>-->
+                            <v-list-tile-title v-text="link.text"/>
+                        </v-list-tile>
+                        <v-divider class="my-1" v-if="(!link.role || $hasRole(link.role)) && link.line"/>
                 </template>
-                <!-- <v-list-tile
-                  disabled
-                  active-class="primary"
-                  class="v-list-item v-list__tile--buy"
-                  to="/upgrade"
-                >
-                  <v-list-tile-action>
-                    <v-icon>mdi-package-up</v-icon>
-                  </v-list-tile-action>
-                  <v-list-tile-title class="font-weight-light">
-                    Upgrade To PRO
-                  </v-list-tile-title>
-                </v-list-tile> -->
             </v-layout>
         </v-img>
     </v-navigation-drawer>
@@ -83,7 +63,8 @@ export default {
             {
                 to: {name: 'AllResultTest'},
                 icon: 'description',
-                text: 'All Test Result'
+                text: 'All Test Result',
+                line: true
             },
             {
                 to: {name: 'ManageMedicalCenter'},
@@ -101,7 +82,8 @@ export default {
                 to: {name: 'ListTestType'},
                 icon: 'fas fa-vial',
                 text: 'List Test Type',
-                role: 'Admin'
+                role: 'Admin',
+                line: true
             },
             {
                 to: {name: 'AllItem'},
@@ -109,23 +91,33 @@ export default {
                 text: 'Items',
                 role: 'Admin|Supervisor|User'
             },
+            {
+                to: {name: 'MyItem'},
+                icon: 'far fa-clone',
+                text: 'My Items',
+                role: 'Admin|Supervisor|User',
+                line: true
+            },
             {
                 to: {name: 'AllPackage'},
                 icon: 'fas fa-archive',
                 text: 'Packages',
-                role: 'Admin|Supervisor|User'
+                role: 'Admin|Supervisor|User',
+                line: true
             },
             {
                 to: {name: 'AllLabels'},
                 icon: 'fas fa-inbox',
-                text: 'Labels'
+                text: 'Labels',
+                line: true
             },
             {
                 to: {name: 'AllCycle'},
                 icon: 'cached',
-                text: 'Cycles'
+                text: 'Cycles',
+                line: true
             },
-            {
+    /*        {
                 to: {name: 'Statistics'},
                 icon: 'fas fa-chart-bar',
                 text: 'Statistics',
@@ -134,7 +126,7 @@ export default {
                 to: {name: 'Tickets'},
                 icon: 'style',
                 text: 'Tickets',
-            },
+            },*/
         ],
         responsive: false
     }),
@@ -174,30 +166,47 @@ export default {
 
 <style lang="scss">
 #app-drawer {
-    .v-list__tile {
-        border-radius: 4px;
+    .title {
+        .user-name {
+            line-height: 22px;
+            font-size: 18px !important;
+        }
 
-        &--buy {
-            margin-top: auto;
-            margin-bottom: 17px;
+        .hospital-name {
+            line-height: 20px;
+            font-family: 'Montserrat-Light';
+            color: #c6c6c6;
+        }
+
+        .v-chip.user-role {
+            border-radius: 4px;
+            height: 20px !important;
+            line-height: 20px;
+            font-size: 12px;
+            letter-spacing: 1px;
         }
     }
 
-    .v-chip.user-role {
-        border-radius: 4px;
-        height: 20px !important;
-        line-height: 20px;
-        font-size: 11px;
-        letter-spacing: 1px;
+    .v-list .v-list-item {
+        .v-list__tile {
+            padding-top: 0;
+            padding-bottom: 0;
+            border-radius: 5px;
 
-        .v-chip__content {
-            padding: 0 5px;
+            .v-list__tile__title {
+                font-family: 'Montserrat-light';
+                color: #e9e9e9;
+                //letter-spacing: 1px !important;
+            }
+        }
+
+        .v-list__tile.v-list__tile--active .v-list__tile__title {
+            color: #000;
         }
     }
 
-    .v-image__image--contain {
-        top: 9px;
-        height: 60%;
+    .v-list .v-list-item:not(:nth-child(3)) {
+        margin: 5px 15px;
     }
 
     .search-input {
diff --git a/src/components/modal/testresult/Show.vue b/src/components/modal/testresult/Show.vue
index e70d934..3afbcb7 100644
--- a/src/components/modal/testresult/Show.vue
+++ b/src/components/modal/testresult/Show.vue
@@ -20,25 +20,19 @@
                     <v-flex xs3 md3 sm3>
                         <div class>
                             <span class="subtitle-1">ID :</span>
-                            <span
-                                class="title font-weight-bold ml-1"
-                                style="letter-spacing:0 !important"
-                            >{{ data.id }}</span>
+                            <span class="title font-weight-bold ml-1" style="letter-spacing:0 !important">{{ data.id }}</span>
                         </div>
                     </v-flex>
                     <v-flex xs3 md3 sm3>
                         <div class>
                             <span class="subtitle-1">Result :</span>
                             <span v-if="data.result == 'Reject'" class="NotVerified" style="vertical-align: text-bottom;">
-                                <v-icon class="caption fa fa-times NotVerified"></v-icon>
+                                <v-icon class="caption fa fa-times NotVerified"/>
                             </span>
                             <span v-if="data.result == 'Accept'" class="">
-                                <v-icon class="caption fa fa-check Verified"></v-icon>
+                                <v-icon class="caption fa fa-check Verified"/>
                             </span>
-                            <span
-                                class="title font-weight-bold ml-1"
-                                style="letter-spacing:0 !important"
-                            >{{ data.result }}</span>
+                            <span class="title font-weight-bold ml-1" style="letter-spacing:0 !important">{{ data.result }}</span>
                         </div>
                     </v-flex>
                     <v-flex xs3 md3 sm3>
@@ -50,15 +44,12 @@
                                 style="letter-spacing:0 !important"
                             >{{ data.verified }}</span> -->
                             <span v-if="data.verified == 'NotVerified'" class="NotVerified">
-                                <v-icon class="caption fa fa-times NotVerified"></v-icon>
+                                <v-icon class="caption fa fa-times NotVerified"/>
                             </span>
                             <span v-if="data.verified == 'Verified'" class="">
-                                <v-icon class="caption fa fa-check Verified"></v-icon>
+                                <v-icon class="caption fa fa-check Verified"/>
                             </span>
-                            <span
-                                class="title font-weight-bold ml-1"
-                                style="letter-spacing:0 !important"
-                            >{{ data.verified }}</span>
+                            <span class="title font-weight-bold ml-1" style="letter-spacing:0 !important">{{ data.verified }}</span>
                         </div>
                     </v-flex>
                     <v-flex xs3 md3 sm3>
@@ -82,10 +73,7 @@
                     <v-flex xs4 md4 sm4>
                         <div class>
                             <span class="subtitle-1">Medical Center :</span>
-                            <span
-                                class="title font-weight-bold ml-2"
-                                style="letter-spacing:0 !important"
-                            >{{ data.user.medical_center.name }}</span>
+                            <span class="title font-weight-bold ml-2" style="letter-spacing:0 !important">{{ data.user.medical_center.name }}</span>
                         </div>
                     </v-flex>
                 </v-layout>
@@ -97,62 +85,35 @@
                 </v-flex>
                 <v-layout row wrap class="ml-4">
                     <template v-if="data.inputs">
-                        <v-flex
-                            xs3
-                            md3
-                            sm3
-                            v-for="(inputData, keyInputs) in data.inputs"
-                            :key="keyInputs"
-                        >
+                        <v-flex xs3 md3 sm3 v-for="(inputData, keyInputs) in data.inputs" :key="keyInputs">
                             <span class="subtitle-1">{{keyInputs}} :</span>
-                            <span
-                                class="title font-weight-bold ml-2"
-                                style="letter-spacing:0 !important"
-                            >{{inputData}}</span>
+                            <span class="title font-weight-bold ml-2" style="letter-spacing:0 !important">{{inputData}}</span>
                         </v-flex>
                     </template>
                     <template v-if="data.options">
-                        <v-flex
-                            xs3
-                            md3
-                            sm3
-                            v-for="(optionData, keyOptions) in data.options"
-                            :key="keyOptions"
-                        >
+                        <v-flex xs3 md3 sm3 v-for="(optionData, keyOptions) in data.options" :key="keyOptions">
                             <span class="subtitle-1">{{keyOptions}} :</span>
                             <span
                                 style="letter-spacing:0 !important"
                                 class="title font-weight-bold ml-2"
                                 v-for="(data, dataKey) in optionData"
-                                :key="dataKey"
-                            >{{data}},</span>
+                                :key="dataKey">{{data}},</span>
                         </v-flex>
                     </template>
                     <template v-if="data.children">
                         <v-layout row wrap class="WM-Width-Full">
-                        <v-flex class="mt-4 pb-4" style="border-left:3px solid #32c5d2;border-bottom:1px solid #ddd"
-                            xs12
-                            md12
-                            sm12
-                            v-for="(formData, keyForm) in data.children"
-                            :key="keyForm"
-                        >
+                        <v-flex class="mt-4 pb-4" style="border-left:3px solid #32c5d2;border-bottom:1px solid #ddd" xs12 md12 sm12 v-for="(formData, keyForm) in data.children" :key="keyForm">
                             <h4 class="ml-4 headline CSSD-font font-weight-bold">{{keyForm}}</h4>
                             <v-layout row wrap>
                             <v-layout row wrap v-for="(childData, keyChild) in formData" :key="keyChild">
-                                    <v-flex
-                                            xs12
-                                            md12
-                                            sm12
-                                            class="ml-4">
+                                    <v-flex xs12 md12 sm12 class="ml-4">
                                     <span class="subtitle-1">{{keyChild}} :</span>
                                     <template v-if="Array.isArray(childData)">
                                         <span
                                             style="letter-spacing:0 !important"
                                             class="title font-weight-bold ml-2"
                                             v-for="(data, dataKey) in childData"
-                                            :key="dataKey"
-                                        >{{data}},</span>
+                                            :key="dataKey">{{data}},</span>
                                     </template>
                                     <template v-else>
                                         <span class="headline ml-2">{{childData}}</span>
@@ -186,24 +147,16 @@
         <!-- </material-card>
         <material-card> -->
             <v-layout row wrap align-center justify-center class="px-5 my-3" v-if="$hasRole('Admin|Supervisor')">
-                <v-flex
-                    class="WM-Align-R mr-1"
-                    xs12
-                    md3
-                    sm3
+                <v-flex class="WM-Align-R mr-1" xs12 md3 sm3
                     v-if="data.verified == 'None' || (data.verified == 'NotVerified' && $hasRole('Admin'))"
-                    @click="verify(data.id, 'Verified')"
-                >
+                    @click="verify(data.id, 'Verified')">
                     <v-btn class="WM-CyanBlueGradient-BG" style="padding:10px 60px">
                         <v-icon class="white--text mr-2 caption">fas fa-check</v-icon>
                         <span class="white--text">Verify</span>
                     </v-btn>
                 </v-flex>
                 <v-flex class="WM-Align-R" xs6 md3 sm3 v-if="data.verified == 'None' || (data.verified == 'Verified' && $hasRole('Admin'))">
-                    <v-btn
-                        class="WM-NoShadow WM-Outline-Btn WM-Border WM-Border-Gray"
-                        @click="verify(data.id, 'NotVerified')"
-                    >
+                    <v-btn class="WM-NoShadow WM-Outline-Btn WM-Border WM-Border-Gray" @click="verify(data.id, 'NotVerified')">
                         <v-icon class="black--text mr-2 caption">fas fa-check</v-icon>
                         <span class="black--text">UnVerify</span>
                     </v-btn>
@@ -211,9 +164,7 @@
 
                 <v-flex xs6 md2 sm2>
                     <a :href="'/Show/TestResult/'+data.id">
-                        <v-btn
-                            class="WM-NoShadow WM-Outline-Btn WM-Border WM-Border-Gray"
-                        >
+                        <v-btn class="WM-NoShadow WM-Outline-Btn WM-Border WM-Border-Gray">
                             <v-icon class="black--text mr-2 caption">fas fa-print</v-icon>
                             <span class="black--text">Go to Print Page</span>
                         </v-btn>
diff --git a/src/components/modal/user/List.vue b/src/components/modal/user/List.vue
index 85434b5..078a192 100644
--- a/src/components/modal/user/List.vue
+++ b/src/components/modal/user/List.vue
@@ -9,9 +9,9 @@
                                 <span class="subheading font-weight-light text-white text--darken-3" v-text="header.text" />
                             </template>
                             <template slot="items" slot-scope="{ item }">
-                                <tr :active="item.selected" @click="selectUser(item)">
+                                <tr :active="item.selected" @click="selectUser(item)" v-if="item.id !== getModalProperties.data.user_id">
                                     <td>
-                                        <v-checkbox :input-value="item.selected" primary hide-details></v-checkbox>
+                                        <v-checkbox :input-value="item.selected" primary hide-details/>
                                     </td>
                                     <td class="headline font-weight-light">
                                         {{ item.name }}
@@ -34,9 +34,9 @@
                 <div class="text-xs-center mt-2" v-if="lastPage > 1">
                     <v-pagination color="black" v-model="currentPage" :length="lastPage" :total-visible="6"/>
                 </div>
-                <v-layout row wrap align-center justify-strart class="mt-3">
+                <v-layout row wrap align-center class="mt-3 justify-end mr-5">
                     <v-btn type="submit" class="WM-CyanBlueGradient-BG ml-5 px-5">
-                        <v-icon class="black--text mr-2 caption">fas fa-chevron-left</v-icon>
+                        <v-icon class="black--text mr-2 caption">fas fa-check</v-icon>
                         <span class="black--text">Submit</span>
                     </v-btn>
                 </v-layout>
diff --git a/src/config/urls.js b/src/config/urls.js
index 476072c..c4501a2 100644
--- a/src/config/urls.js
+++ b/src/config/urls.js
@@ -153,7 +153,7 @@ const urls = {
         return "/Items" + filter;
     },
     listMyItem: function (filter) {
-        return "/my-Items" + filter;
+        return "/MyItems" + filter;
     },
     listAllItem: function () {
         return "/GetItems";
@@ -173,6 +173,9 @@ const urls = {
     updateItem: function (id) {
         return `/Items/${id}`;
     },
+    transferItem: function (id) {
+        return `/transfer-items/${id}`;
+    },
     removeItem: function (id) {
         return `Items/${id}`;
     },
@@ -192,8 +195,8 @@ const urls = {
     changeItemStatus: function (id) {
         return `/Items/ChangeStatus/${id}`;
     },
-    transferItem: function (id) {
-        return `/transfers/${id}`;
-    }
+    // transferItem: function (id) {
+    //     return `/transfers/${id}`;
+    // }
 };
 export { urls };
diff --git a/src/router/paths.js b/src/router/paths.js
index 3c63ed0..4417191 100644
--- a/src/router/paths.js
+++ b/src/router/paths.js
@@ -292,14 +292,14 @@ export default [
       title:'Tickets | CSSD Dashboard',
     }
   },
-  {
+/*  {
     path: '/ShowPackage/:package',
     name: 'ShowPackage',
     view: 'Package/ShowPackage',
     meta:{
       title:'Show Package | CSSD Dashboard',
     }
-  },
+  },*/
   {
     path: '/Intro',
     name: 'Intro',
diff --git a/src/services/global/api.service.js b/src/services/global/api.service.js
index 957d6ca..4719af8 100644
--- a/src/services/global/api.service.js
+++ b/src/services/global/api.service.js
@@ -110,9 +110,9 @@ axios.interceptors.request.use(request => {
 });
 
 axios.interceptors.response.use(response => {
-    // console.log("🟢 API Response:", response.config.url);
-    // console.log("🟢 Status:", response.status);
-    // console.log("🟢 Data:", response.data);
+    console.log("🟢 API Response:", response.config.url);
+    console.log("🟢 Status:", response.status);
+    console.log("🟢 Data:", response.data);
     return response;
 }, error => {
     console.error("🔴 API Error:", error.response ? error.response.data : error);
diff --git a/src/store/modules/app/state.js b/src/store/modules/app/state.js
index 0bdfb21..1f194b1 100644
--- a/src/store/modules/app/state.js
+++ b/src/store/modules/app/state.js
@@ -1,5 +1,5 @@
 export default {
   drawer: null,
-  color: 'WM-CyanBlueGradient-BG',
+  color: 'WM-BG-White',
   // image: 'https://demos.creative-tim.com/vue-material-dashboard/img/sidebar-2.32103624.jpg'
 }
diff --git a/src/styles/css/Assets/Main.scss b/src/styles/css/Assets/Main.scss
index 26027a4..fe08e60 100644
--- a/src/styles/css/Assets/Main.scss
+++ b/src/styles/css/Assets/Main.scss
@@ -18,6 +18,12 @@
   font-weight: bold;
   src: url('../../fonts/Montserrat-Bold.ttf') format('truetype');
 }
+@font-face {
+  font-family: 'Montserrat-light';
+  font-style: normal;
+  font-weight: 100;
+  src: url('../../fonts/Montserrat-Light.ttf') format('truetype');
+}
 
 body,
 h1,
diff --git a/src/styles/css/Assets/WM-ModernTheme.scss b/src/styles/css/Assets/WM-ModernTheme.scss
index 57553a7..c235f4e 100644
--- a/src/styles/css/Assets/WM-ModernTheme.scss
+++ b/src/styles/css/Assets/WM-ModernTheme.scss
@@ -838,8 +838,9 @@
 }
 
 .WM-BG-White, .WM-Link-White::after, .WM-Input.WM-White + .WM-Input100-Focus::before {
-  background-color: #fff;
-  color: #fff;
+  //background-color: #fff;
+  color: #000;
+    background: linear-gradient(90deg, #fff 20.5625%, #fff 20.5625%, #fff 80.5625%);
 }
 
 .WM-Color-White, .WM-Link-White:hover, .WM-Link-White.WM-Selected, .WM-Link-White.WM-Active {
diff --git a/src/views/Dashboard.vue b/src/views/Dashboard.vue
index 3d26f2e..f90e000 100644
--- a/src/views/Dashboard.vue
+++ b/src/views/Dashboard.vue
@@ -17,7 +17,7 @@
             </v-layout>
         </material-card>
 
-        <material-card v-if="$hasRole('Supervisor')" color="black" title="Supervisor" text="">
+        <material-card v-if="$hasRole('Admin|Supervisor')" color="black" title="Supervisor" text="">
             <v-layout row wrap>
                 <template v-for="(SupervisorCard, Key ) in SupervisorCards">
                     <v-flex v-if="!SupervisorCard.role || $hasRole(SupervisorCard.role)"
@@ -35,7 +35,7 @@
             </v-layout>
         </material-card>
 
-        <material-card v-if="$hasRole('User')" color="black" title="User" text="">
+        <material-card v-if="$hasRole('Admin|Supervisor|User')" color="black" title="User" text="">
             <v-layout row wrap>
                 <template v-for="(UsersCard, Key ) in UsersCards">
                     <v-flex v-if="!UsersCard.role || $hasRole(UsersCard.role)" :class="[UsersCard.column, 'pa-2']"
@@ -104,7 +104,7 @@ export default {
                     aligntext: 'text-md-left',
                     alignimg: 'text-md-left',
                     column: 'xs12 md12 sm12',
-                    role: 'Supervisor'
+                    role: 'Admin|Supervisor'
                 },
                 {
                     title: 'Test to Verify',
@@ -115,7 +115,7 @@ export default {
                     aligntext: 'text-md-left',
                     alignimg: 'text-md-left',
                     column: 'xs12 md12 sm12',
-                    role: 'Supervisor'
+                    role: 'Admin|Supervisor'
                 },
             ],
             UsersCards: [
@@ -128,7 +128,7 @@ export default {
                     aligntext: 'text-md-left',
                     alignimg: 'text-md-right',
                     column: 'xs12 md6 sm6',
-                    role: 'User'
+                    role: 'Admin|Supervisor|User'
                 },
                 {
                     title: 'All Test Result',
@@ -139,7 +139,7 @@ export default {
                     aligntext: 'text-md-left',
                     alignimg: 'text-md-right',
                     column: 'xs12 md6 sm6',
-                    role: 'User'
+                    role: 'Admin|Supervisor|User'
                 },
                 {
                     title: 'Add a Test Result',
@@ -150,7 +150,7 @@ export default {
                     aligntext: 'text-md-left',
                     alignimg: 'text-md-left',
                     column: 'xs12 md12 sm12',
-                    role: 'User'
+                    role: 'Admin|Supervisor|User'
                 },
             ],
         }
diff --git a/src/views/Item/AddEdit.vue b/src/views/Item/AddEdit.vue
index 6c052c5..1da44a4 100644
--- a/src/views/Item/AddEdit.vue
+++ b/src/views/Item/AddEdit.vue
@@ -4,13 +4,13 @@
             <material-card color="black" title="Add Instrument">
                 <v-layout align-center justify-center wrap class="px-5 my-3">
                     <v-flex xs12 sm6 md6 lg3 class="WM-FlexCenter">
-                        <v-icon class="fa fa-align-left mr-2 WM-Margin-B-8"></v-icon>
+                        <v-icon class="fa fa-align-left mr-2 WM-Margin-B-8"/>
                         <v-text-field name="name" label="Name" color="black" v-model="formData.name"
                                       :rules="[rules.required]"
-                                      class="py-3 pr-3"></v-text-field>
+                                      class="py-3 pr-3"/>
                     </v-flex>
                     <!-- <v-flex xs12 md3 sm3 class="WM-FlexCenter pl-3">
-                      <v-icon class="fas fa-sort-numeric-up mr-2 WM-Margin-B-8"></v-icon>
+                      <v-icon class="fas fa-sort-numeric-up mr-2 WM-Margin-B-8"/>
                       <v-text-field
                         name="unique_id"
                         label="Item ID"
@@ -18,28 +18,28 @@
                         v-model="formData.unique_id"
                         :rules="[rules.required]"
                         class="py-3 pr-3"
-                      ></v-text-field>
+                      />
                     </v-flex> -->
                     <v-flex xs12 sm6 md6 lg3 class="WM-FlexCenter pl-3">
-                        <v-icon class="fas fa-check mr-2 WM-Margin-B-8"></v-icon>
+                        <v-icon class="fas fa-check mr-2 WM-Margin-B-8"/>
                         <v-text-field name="size" label="Size" color="black" v-model="formData.size"
-                                      class="py-3 pr-3"></v-text-field>
+                                      class="py-3 pr-3"/>
                     </v-flex>
                     <v-flex xs12 sm6 md6 lg3 class="WM-FlexCenter pl-3">
-                        <v-icon class="fas fa-check mr-2 WM-Margin-B-8"></v-icon>
+                        <v-icon class="fas fa-check mr-2 WM-Margin-B-8"/>
                         <v-text-field name="specific" label="Specific" color="black" v-model="formData.specific"
-                                      class="py-3 pr-3"></v-text-field>
+                                      class="py-3 pr-3"/>
                     </v-flex>
                     <v-flex xs12 sm6 md6 lg3 class="WM-FlexCenter">
-                        <v-icon class="fa fa-align-left mr-2 WM-Margin-B-8"></v-icon>
+                        <v-icon class="fa fa-align-left mr-2 WM-Margin-B-8"/>
                         <v-text-field name="UDI" label="UDI" color="black" v-model="formData.udi"
                                       :rules="[rules.required]"
-                                      class="py-3 pr-3"></v-text-field>
+                                      class="py-3 pr-3"/>
                     </v-flex>
                     <v-flex xs12 sm12 class="WM-FlexCenter" v-if="galleryDataLoaded">
                         <wm-Dropzone class="w-100" :Images="galleries" :BatchID="file_batch_id"
-                                     :ModelID="$route.params.Item"
-                                     ModelType="Item"></wm-Dropzone>
+                                     :ModelID="$route.params.Item||null"
+                                     ModelType="Item"/>
                     </v-flex>
                 </v-layout>
                 <v-layout align-center wrap class="px-5 mb-3">
@@ -66,7 +66,6 @@
                             <span class="white--text">SAVE</span>
                         </v-btn>
                     </v-flex>
-
                 </v-layout>
             </material-card>
         </v-container>
diff --git a/src/views/Item/List.vue b/src/views/Item/List.vue
index 269eb4d..4498fb1 100644
--- a/src/views/Item/List.vue
+++ b/src/views/Item/List.vue
@@ -42,8 +42,6 @@
                             </v-btn>
                         </router-link>
                     </v-flex>
-
-
                 </v-layout>
                 <v-layout class="px-4 my-3">
                     <v-divider/>
diff --git a/src/views/MyItem/List.vue b/src/views/MyItem/List.vue
index 09cf3f9..1773769 100644
--- a/src/views/MyItem/List.vue
+++ b/src/views/MyItem/List.vue
@@ -3,7 +3,7 @@
         <v-container fluid>
             <material-card class color="black" title="My Items" text>
                 <v-tabs centered color="cyan" dark icons-and-text>
-                    <v-tabs-slider color="yellow"></v-tabs-slider>
+                    <v-tabs-slider color="yellow"/>
 
                     <v-tab href="#tab-1">
                         My Items
diff --git a/src/views/MyItem/Tabs/MyItems.vue b/src/views/MyItem/Tabs/MyItems.vue
index 3921200..07285e4 100644
--- a/src/views/MyItem/Tabs/MyItems.vue
+++ b/src/views/MyItem/Tabs/MyItems.vue
@@ -1,54 +1,51 @@
 <template>
     <div>
         <v-layout align-center wrap class="my-3 px-5">
-            <v-flex xs12 md3 sm3 class="WM-FlexCenter">
-                <v-icon class="fas fa-sort-numeric-up mr-2 WM-Margin-B-8"></v-icon>
-                <v-text-field class="py-3 pr-3" v-model="filter.item_id" label="Item ID" color="black"></v-text-field>
+            <v-flex xs12 sm4 md4 lg2 xl2 class="WM-FlexCenter">
+                <v-icon class="fas fa-sort-numeric-up mr-2 WM-Margin-B-8"/>
+                <v-text-field class="py-3 pr-3" v-model="filter.item_id" label="Item ID" color="black"/>
             </v-flex>
-            <v-flex xs12 md3 sm3 class="WM-FlexCenter pl-3">
-                <v-icon class="fa fa-align-left mr-2 WM-Margin-B-8"></v-icon>
-                <v-text-field class="py-3 pr-3" v-model="filter.name" label="Name" color="black"></v-text-field>
+            <v-flex xs12 sm4 md4 lg2 xl2 class="WM-FlexCenter pl-3">
+                <v-icon class="fa fa-align-left mr-2 WM-Margin-B-8"/>
+                <v-text-field class="py-3 pr-3" v-model="filter.name" label="Name" color="black"/>
             </v-flex>
-            <v-flex xs12 md3 sm3 class="WM-FlexCenter pl-3" v-if="$hasRole('Admin')">
-                <v-icon class="fa fa-hospital-o mr-2 WM-Margin-B-8"></v-icon>
+            <v-flex xs12 sm4 md4 lg2 xl2 class="WM-FlexCenter pl-3" v-if="$hasRole('Admin')">
+                <v-icon class="fa fa-hospital-o mr-2 WM-Margin-B-8"/>
                 <v-autocomplete class="py-3 pr-3" v-model="filter.medical_center_id" item-text="name" item-value="id"
-                    label="Hospital" color="black" :items="medicalCenters" :clearable="true"></v-autocomplete>
+                                label="Hospital" color="black" :items="medicalCenters" :clearable="true"/>
             </v-flex>
-            <v-flex xs12 md3 sm3 class="WM-FlexCenter pl-3">
-                <v-icon class="fas fa-sort-numeric-up mr-2 WM-Margin-B-8"></v-icon>
-                <v-text-field class="py-3 pr-3" v-model="filter.size" label="Size" color="black"></v-text-field>
+            <v-flex xs12 sm4 md4 lg2 xl2 class="WM-FlexCenter pl-3">
+                <v-icon class="fas fa-sort-numeric-up mr-2 WM-Margin-B-8"/>
+                <v-text-field class="py-3 pr-3" v-model="filter.size" label="Size" color="black"/>
             </v-flex>
-            <v-flex xs12 md3 sm3 class="WM-FlexCenter pl3">
-                <v-icon class="fa fa-align-left mr-2 WM-Margin-B-8"></v-icon>
-                <v-text-field class="py-3 pr-3" v-model="filter.udi" label="UDI" color="black"></v-text-field>
+            <v-flex xs12 sm4 md4 lg2 xl2 class="WM-FlexCenter pl3">
+                <v-icon class="fa fa-align-left mr-2 WM-Margin-B-8"/>
+                <v-text-field class="py-3 pr-3" v-model="filter.udi" label="UDI" color="black"/>
             </v-flex>
-
-        </v-layout>
-        <v-layout class="px-5 my-3">
-            <v-flex class xs12 md2 sm3>
-                <v-btn class="WM-CyanBlueGradient-BG" style="padding:10px 60px" @click="load()">
+            <v-spacer/>
+            <v-flex class xs12 sm6 md6 lg2 xl1>
+                <v-btn class="WM-CyanBlueGradient-BG" style="padding:10px 30px" @click="load()">
                     <v-icon class="white--text mr-2 caption">fas fa-search</v-icon>
-                    <span class="white--text CSSD-font">Filter</span>
+                    <span class="white--text">Filter</span>
                 </v-btn>
             </v-flex>
-            <v-spacer></v-spacer>
-            <v-flex xs12 md2 sm2 class="text-xs-right">
+            <v-flex xs12 sm6 md6 lg1 xl1 class="text-xs-right">
                 <router-link :to="{ name: 'AddItem' }">
                     <v-btn class="WM-NoShadow WM-Outline-Btn WM-Border WM-Border-Black">
                         <v-icon class="black--text mr-2 caption">fas fa-plus</v-icon>
-                        <span class="black--text CSSD-font">Add</span>
+                        <span class="black--text">Add</span>
                     </v-btn>
                 </router-link>
             </v-flex>
         </v-layout>
         <v-layout class="px-4 my-3">
-            <v-divider></v-divider>
+            <v-divider/>
         </v-layout>
         <v-layout align-center wrap class="my-3 px-5">
             <v-flex md12>
                 <v-data-table :headers="headers" :items="items" hide-actions>
                     <template slot="headerCell" slot-scope="{ header }">
-                        <span class="subheading font-weight-light text-white text--darken-3" v-text="header.text" />
+                        <span class="subheading font-weight-light text-white text--darken-3" v-text="header.text"/>
                     </template>
                     <template slot="items" slot-scope="{ item }">
                         <td class="title font-weight-light">{{ item.id }}</td>
@@ -69,28 +66,48 @@
                             <v-tooltip bottom open-on-hover>
                                 <template v-slot:activator="{ on, attrs }">
                                     <v-btn class="mr-2" v-bind="attrs" v-on="on" color="orange darken-1"
-                                        @click="generateBarcode(item, 'Item')">
+                                           @click="generateBarcode(item, 'Item')">
                                         <v-icon class="white--text mr-2 caption">fas fa-barcode</v-icon>
                                         <span class="CSSD-font">Generate Barcode</span>
                                     </v-btn>
                                 </template>
                                 <span>Generate Barcode</span>
                             </v-tooltip>
+                            <v-tooltip bottom open-on-hover>
+                                <template v-slot:activator="{ on, attrs }">
+                                    <v-btn class="mr-2" v-bind="attrs" v-on="on" color="pink darken-1"
+                                           @click="transfer(item)">
+                                        <v-icon class="white--text mr-2 caption">fas fa-arrows-alt</v-icon>
+                                        <span class="CSSD-font">Transfer</span>
+                                    </v-btn>
+                                </template>
+                                <span>Transfer</span>
+                            </v-tooltip>
+                            <v-tooltip bottom open-on-hover>
+                                <template v-slot:activator="{ on, attrs }">
+                                    <v-btn v-bind="attrs" v-on="on" color="red" class="WM-ActionButton mr-2"
+                                           @click="remove(item.id)">
+                                        <v-icon class="white--text mr-2 caption">fas fa-trash</v-icon>
+                                        <span>Remove</span>
+                                    </v-btn>
+                                </template>
+                                <span>Remove</span>
+                            </v-tooltip>
                         </td>
                     </template>
                 </v-data-table>
             </v-flex>
         </v-layout>
-        <v-divider></v-divider>
+        <v-divider/>
         <div class="text-xs-center" v-if="lastPage > 1">
-            <v-pagination color="black" v-model="currentPage" :length="lastPage" :total-visible="6"></v-pagination>
+            <v-pagination color="black" v-model="currentPage" :length="lastPage" :total-visible="6"/>
         </div>
     </div>
 </template>
 <script>
-import { ApiService } from "@/services";
-import { urls } from "@/config/urls";
-import { mapMutations, mapGetters } from "vuex";
+import {ApiService} from "@/services";
+import {urls} from "@/config/urls";
+import {mapMutations, mapGetters} from "vuex";
 import toast from "@/services/global/toast.service";
 
 export default {
@@ -153,11 +170,9 @@ export default {
                 }
             }
             filter += (page) ? `page=${page}` : `page=1`;
-            const result = await ApiService.get(
-                urls.listItem(filter)
-            );
+            const result = await ApiService.get(urls.listMyItem(filter));
             if (result && result.status == 200) {
-                this.items = result.data.data.data;
+                this.items = result.data.data;
                 this.currentPage = result.data.data.current_page;
                 this.lastPage = result.data.data.last_page;
             }
@@ -169,7 +184,7 @@ export default {
                 if (result && result.status == 200) {
                     this.changeCurrentModal({
                         modal: "modal-barcode-barcode",
-                        properties: { result, item },
+                        properties: {result, item},
                     });
                 }
             } else {
@@ -177,31 +192,54 @@ export default {
             }
         },
         async show(testResultId) {
-            const result = await ApiService.get(
-                urls.showItem(testResultId)
-            );
+            const result = await ApiService.get(urls.showItem(testResultId));
             if (result && result.status == 200) {
                 this.changeCurrentModal({
                     modal: "modal-item-show",
-                    properties: { result },
+                    properties: {result},
                 });
             }
         },
         async changeStatus(id) {
             const result = await ApiService.post(
-                urls.changeItemStatus(id)
+                    urls.changeItemStatus(id)
             );
             if (result) {
                 for (const key in this.items) {
                     if (
-                        this.items.hasOwnProperty(key) &&
-                        this.items[key].id == id
+                            this.items.hasOwnProperty(key) &&
+                            this.items[key].id == id
                     ) {
                         this.items[key].status = result.data.data.status;
                     }
                 }
             }
         },
+        async remove(testResultId) {
+            const result = await ApiService.delete(
+                    urls.removeItem(testResultId)
+            );
+            if (result && result.status == 200) {
+                for (const key in this.items) {
+                    if (
+                            this.items.hasOwnProperty(key) &&
+                            this.items[key].id == testResultId
+                    ) {
+                        this.items.splice(key, 1);
+                    }
+                }
+            }
+        },
+        async transfer(data) {
+            this.changeCurrentModal({
+                modal: "modal-user-list",
+                properties: {data},
+            });
+            // const result = await ApiService.post(urls.transferItem(id));
+            // if (result && result.status == 200) {
+            //     console.log(result , 'transfer - result')
+            // }
+        }
     },
     watch: {
         currentPage(page) {
diff --git a/src/views/MyItem/Tabs/MyRequests.vue b/src/views/MyItem/Tabs/MyRequests.vue
index 4131188..9747a9e 100644
--- a/src/views/MyItem/Tabs/MyRequests.vue
+++ b/src/views/MyItem/Tabs/MyRequests.vue
@@ -1,54 +1,51 @@
 <template>
     <div>
         <v-layout align-center wrap class="my-3 px-5">
-            <v-flex xs12 md3 sm3 class="WM-FlexCenter">
-                <v-icon class="fas fa-sort-numeric-up mr-2 WM-Margin-B-8"></v-icon>
-                <v-text-field class="py-3 pr-3" v-model="filter.request_id" label="Request ID" color="black"></v-text-field>
+            <v-flex xs12 sm4 md4 lg2 xl2 class="WM-FlexCenter">
+                <v-icon class="fas fa-sort-numeric-up mr-2 WM-Margin-B-8"/>
+                <v-text-field class="py-3 pr-3" v-model="filter.request_id" label="Request ID" color="black"/>
             </v-flex>
-            <v-flex xs12 md3 sm3 class="WM-FlexCenter pl-3">
-                <v-icon class="fa fa-align-left mr-2 WM-Margin-B-8"></v-icon>
-                <v-text-field class="py-3 pr-3" v-model="filter.name" label="Name" color="black"></v-text-field>
+            <v-flex xs12 sm4 md4 lg2 xl2 class="WM-FlexCenter pl-3">
+                <v-icon class="fa fa-align-left mr-2 WM-Margin-B-8"/>
+                <v-text-field class="py-3 pr-3" v-model="filter.name" label="Name" color="black"/>
             </v-flex>
-            <v-flex xs12 md3 sm3 class="WM-FlexCenter pl-3" v-if="$hasRole('Admin')">
-                <v-icon class="fa fa-hospital-o mr-2 WM-Margin-B-8"></v-icon>
+            <v-flex xs12 sm4 md4 lg2 xl2 class="WM-FlexCenter pl-3" v-if="$hasRole('Admin')">
+                <v-icon class="fa fa-hospital-o mr-2 WM-Margin-B-8"/>
                 <v-autocomplete class="py-3 pr-3" v-model="filter.medical_center_id" item-text="name" item-value="id"
-                    label="Hospital" color="black" :items="medicalCenters" :clearable="true"></v-autocomplete>
+                                label="Hospital" color="black" :items="medicalCenters" :clearable="true"/>
             </v-flex>
-            <v-flex xs12 md3 sm3 class="WM-FlexCenter pl-3">
-                <v-icon class="fas fa-sort-numeric-up mr-2 WM-Margin-B-8"></v-icon>
-                <v-text-field class="py-3 pr-3" v-model="filter.size" label="Size" color="black"></v-text-field>
+            <v-flex xs12 sm4 md4 lg2 xl2 class="WM-FlexCenter pl-3">
+                <v-icon class="fas fa-sort-numeric-up mr-2 WM-Margin-B-8"/>
+                <v-text-field class="py-3 pr-3" v-model="filter.size" label="Size" color="black"/>
             </v-flex>
-            <v-flex xs12 md3 sm3 class="WM-FlexCenter pl3">
-                <v-icon class="fa fa-align-left mr-2 WM-Margin-B-8"></v-icon>
-                <v-text-field class="py-3 pr-3" v-model="filter.udi" label="UDI" color="black"></v-text-field>
+            <v-flex xs12 sm4 md4 lg2 xl2 class="WM-FlexCenter pl3">
+                <v-icon class="fa fa-align-left mr-2 WM-Margin-B-8"/>
+                <v-text-field class="py-3 pr-3" v-model="filter.udi" label="UDI" color="black"/>
             </v-flex>
-
-        </v-layout>
-        <v-layout class="px-5 my-3">
-            <v-flex class xs12 md2 sm3>
-                <v-btn class="WM-CyanBlueGradient-BG" style="padding:10px 60px" @click="load()">
+            <v-spacer/>
+            <v-flex class xs12 sm6 md6 lg2 xl1>
+                <v-btn class="WM-CyanBlueGradient-BG" style="padding:10px 30px" @click="load()">
                     <v-icon class="white--text mr-2 caption">fas fa-search</v-icon>
-                    <span class="white--text CSSD-font">Filter</span>
+                    <span class="white--text">Filter</span>
                 </v-btn>
             </v-flex>
-            <v-spacer></v-spacer>
-            <v-flex xs12 md2 sm2 class="text-xs-right">
+            <v-flex xs12 sm6 md6 lg1 xl1 class="text-xs-right">
                 <router-link :to="{ name: 'AddItem' }">
                     <v-btn class="WM-NoShadow WM-Outline-Btn WM-Border WM-Border-Black">
                         <v-icon class="black--text mr-2 caption">fas fa-plus</v-icon>
-                        <span class="black--text CSSD-font">Add</span>
+                        <span class="black--text">Add</span>
                     </v-btn>
                 </router-link>
             </v-flex>
         </v-layout>
         <v-layout class="px-4 my-3">
-            <v-divider></v-divider>
+            <v-divider/>
         </v-layout>
         <v-layout align-center wrap class="my-3 px-5">
             <v-flex md12>
                 <v-data-table :headers="headers" :items="items" hide-actions>
                     <template slot="headerCell" slot-scope="{ header }">
-                        <span class="subheading font-weight-light text-white text--darken-3" v-text="header.text" />
+                        <span class="subheading font-weight-light text-white text--darken-3" v-text="header.text"/>
                     </template>
                     <template slot="items" slot-scope="{ item }">
                         <td class="title font-weight-light">{{ item.id }}</td>
@@ -69,7 +66,7 @@
                             <v-tooltip bottom open-on-hover>
                                 <template v-slot:activator="{ on, attrs }">
                                     <v-btn class="mr-2" v-bind="attrs" v-on="on" color="orange darken-1"
-                                        @click="generateBarcode(item, 'Item')">
+                                           @click="generateBarcode(item, 'Item')">
                                         <v-icon class="white--text mr-2 caption">fas fa-barcode</v-icon>
                                         <span class="CSSD-font">Generate Barcode</span>
                                     </v-btn>
@@ -81,16 +78,16 @@
                 </v-data-table>
             </v-flex>
         </v-layout>
-        <v-divider></v-divider>
+        <v-divider/>
         <div class="text-xs-center" v-if="lastPage > 1">
-            <v-pagination color="black" v-model="currentPage" :length="lastPage" :total-visible="6"></v-pagination>
+            <v-pagination color="black" v-model="currentPage" :length="lastPage" :total-visible="6"/>
         </div>
     </div>
 </template>
 <script>
-import { ApiService } from "@/services";
-import { urls } from "@/config/urls";
-import { mapMutations, mapGetters } from "vuex";
+import {ApiService} from "@/services";
+import {urls} from "@/config/urls";
+import {mapMutations, mapGetters} from "vuex";
 import toast from "@/services/global/toast.service";
 
 export default {
@@ -154,10 +151,10 @@ export default {
             }
             filter += (page) ? `page=${page}` : `page=1`;
             const result = await ApiService.get(
-                urls.listItem(filter)
+                    urls.listItem(filter)
             );
             if (result && result.status == 200) {
-                this.items = result.data.data.data;
+                this.items = result.data.data;
                 this.currentPage = result.data.data.current_page;
                 this.lastPage = result.data.data.last_page;
             }
@@ -169,7 +166,7 @@ export default {
                 if (result && result.status == 200) {
                     this.changeCurrentModal({
                         modal: "modal-barcode-barcode",
-                        properties: { result, item },
+                        properties: {result, item},
                     });
                 }
             } else {
@@ -178,24 +175,24 @@ export default {
         },
         async show(testResultId) {
             const result = await ApiService.get(
-                urls.showItem(testResultId)
+                    urls.showItem(testResultId)
             );
             if (result && result.status == 200) {
                 this.changeCurrentModal({
                     modal: "modal-item-show",
-                    properties: { result },
+                    properties: {result},
                 });
             }
         },
         async changeStatus(id) {
             const result = await ApiService.post(
-                urls.changeItemStatus(id)
+                    urls.changeItemStatus(id)
             );
             if (result) {
                 for (const key in this.items) {
                     if (
-                        this.items.hasOwnProperty(key) &&
-                        this.items[key].id == id
+                            this.items.hasOwnProperty(key) &&
+                            this.items[key].id == id
                     ) {
                         this.items[key].status = result.data.data.status;
                     }
diff --git a/src/views/Package/AddEdit.vue b/src/views/Package/AddEdit.vue
index 2fc37b4..aee1d0a 100644
--- a/src/views/Package/AddEdit.vue
+++ b/src/views/Package/AddEdit.vue
@@ -41,9 +41,10 @@
                     <v-flex xs12 md3 sm3 class="WM-FlexCenter WM-DuplicateInput"
                             style="position: relative" v-for="(item, key) in formData.items" :key="key">
                         <div class="Inner">
-                            <v-icon class="fas fa-check mr-2 WM-Margin-B-8"/>
+<!--                            <v-icon class="fas fa-check mr-2 WM-Margin-B-8"/>-->
                             <v-autocomplete
                                     @keydown.enter.native.prevent="duplicateForm(key)"
+                                    @change="duplicateForm(key)"
                                     :ref="`selectItem-${key}`"
                                     class="py-3 pr-3"
                                     :items="items"
@@ -62,28 +63,12 @@
                                 </template>
                             </v-autocomplete>
 
-                            <v-btn
-                                    absolute
-                                    small
-                                    right
-                                    bottom
-                                    color="cyan"
-                                    @click="duplicateForm(key)">
+                            <v-btn absolute small right bottom color="cyan" @click="duplicateForm(key)">
                                 <v-icon class="white--text mr-2 caption">fas fa-plus</v-icon>
                                 ADD
                             </v-btn>
-                            <v-btn
-                                    v-if="key > 0"
-                                    absolute
-                                    small
-                                    right
-                                    top
-                                    color="pink"
-                                    @click="removeForm(key)"
-                            >
-                                <v-icon class="white--text mr-2 caption">fas fa-remove
-                                </v-icon
-                                >
+                            <v-btn v-if="key > 0" absolute small right top color="pink" @click="removeForm(key)">
+                                <v-icon class="white--text mr-2 caption">fas fa-remove</v-icon>
                                 REMOVE
                             </v-btn>
                         </div>
@@ -185,10 +170,6 @@ export default {
             if (result.status == 200) {
                 this.items = result.data.data;
             }
-            //   this.items = [
-            //     { name: "test", udi: "23" },
-            //     { name: "saj", udi: "43" },
-            //   ];
         },
         async submitForm() {
             let result;
@@ -207,9 +188,7 @@ export default {
         },
 
         duplicateForm(infoIndex) {
-            this.formData.items.push({
-                name: "",
-            });
+            this.formData.items.push({name: "",});
             console.log(this.$refs[`selectItem-1`], infoIndex);
             this.$refs[`selectItem-${infoIndex}`][0].focus();
         },
diff --git a/src/views/Package/List.vue b/src/views/Package/List.vue
index 30bcb3f..636349f 100644
--- a/src/views/Package/List.vue
+++ b/src/views/Package/List.vue
@@ -63,7 +63,6 @@
                                 <td class="title font-weight-light">
                                     {{item.user ? item.user.name : '' | text_20_letter}}
                                 </td>
-                                <td class="title font-weight-light">{{ item.udi | text_20_letter }}</td>
                                 <td class="title font-weight-light">{{ item.description }}</td>
                                 <td class="title font-weight-light">{{ item.status }}</td>
                                 <td class="text-xs-right FlexBtn Height-MD-60 justify-self-end">
@@ -163,11 +162,6 @@ import toast from "@/services/global/toast.service";
 export default {
     data: () => ({
         headers: [
-            // {
-            //     sortable: true,
-            //     text: " ID",
-            //     value: " ID"
-            // },
             {
                 sortable: true,
                 text: "Package ID",
@@ -188,10 +182,6 @@ export default {
                 text: "Owner",
                 value: "User"
             },
-            {
-                text: "UDI",
-                value: "udi"
-            },
             {
                 sortable: true,
                 text: "Description",