Added calender

src/layouts/sidebar/sidebar.vue

@@ -18,13 +18,12 @@
         </li>
 
         <div class="font-bold text-lg text-gray-500 pt-5 ">Customer</div>
-
         <li class="text-white">
           <router-link :to="{ name: 'customer' }">
             <div class=" hover:underline py-1">All Customers</div>
           </router-link>
-
         </li>
+
         <div class="font-bold text-lg text-gray-500 pt-5">Delivery</div>
         <li class="text-white">
           <router-link :to="{ name: 'delivery' }">
@@ -57,7 +56,6 @@
             </div>
             <div class=" hover:underline py-1" v-else>Waiting Deliveries </div>
           </router-link>
-
           <router-link :to="{ name: 'deliveryIssue' }">
             <div class=" hover:underline py-1">Issue Tickets</div>
           </router-link>
@@ -70,16 +68,17 @@
             </div>
             <div class=" hover:underline py-1" v-else>Pending Payment </div>
           </router-link>
-
-
           <router-link :to="{ name: 'deliveryFinalized' }">
             <div class=" hover:underline py-1">Finalized Tickets</div>
           </router-link>
         </li>
 
-
-
-
+        <div class="font-bold text-lg text-gray-500 pt-5">Service</div>
+        <li class="text-white">
+          <router-link :to="{ name: 'ServiceHome' }">
+            <div class=" hover:underline py-1">Service Home</div>
+          </router-link>
+        </li>
 
 
         <div class="font-bold text-lg text-gray-500 pt-5">Automatics</div>
@@ -95,13 +94,13 @@
           </router-link>
         </li>
 
-
         <div class="font-bold text-lg text-gray-500 pt-5">Employees</div>
         <li class="text-white">
           <router-link :to="{ name: 'employee' }">
             <div class=" hover:underline py-1">Employees</div>
           </router-link>
         </li>
+
         <div class="font-bold text-lg text-gray-500 pt-5">Admin</div>
         <li class="text-white">
           <router-link :to="{ name: 'oilprice' }">