Office driver api get data works

src/pages/delivery/create.vue

@@ -163,6 +163,18 @@
           </div>
 
 
+          <div class="flex-1 mb-4">
+            <label class="block text-white text-sm font-bold mb-2">Delivery Driver </label>
+            <select class="select select-bordered w-full max-w-xs" aria-label="Default select example" id="customer_state"
+              v-model="CreateOilOrderForm.basicInfo.driver_driver">
+              <option class="text-white" v-for="(driver, index) in truckDriversList" :key="index" :value="driver['id']">
+                  {{ driver['employee_first_name'] }}  {{ driver['employee_last_name'] }}
+              </option>
+            </select>
+
+          </div>
+
+
           <div class="col-span-12 md:col-span-12 flex mt-5 mb-5">
             <button
                 class="btn">
@@ -179,15 +191,15 @@
 
 
 <script lang="ts">
-import {defineComponent} from 'vue'
+import { defineComponent } from 'vue'
 import axios from 'axios'
 import authHeader from '../../services/auth.header'
 import Header from '../../layouts/headers/headerauth.vue'
 import SideBar from '../../layouts/sidebar/sidebar.vue'
 import Footer from '../../layouts/footers/footer.vue'
 import useValidate from "@vuelidate/core";
-import {notify} from "@kyvg/vue3-notification"
-import {minLength, required} from "@vuelidate/validators";
+import { notify } from "@kyvg/vue3-notification"
+import { minLength, required } from "@vuelidate/validators";
 
 export default defineComponent({
   name: 'deliveryCreate',
@@ -203,7 +215,7 @@ export default defineComponent({
       v$: useValidate(),
       user: null,
       userCards: [],
-
+      truckDriversList: [],
       CreateOilOrderForm: {
         basicInfo: {
           gallons_ordered: '',
@@ -216,6 +228,7 @@ export default defineComponent({
           credit: false,
           cash: false,
           credit_card_id: 0,
+          driver_driver: '',
         },
       },
         customer: {
@@ -248,6 +261,7 @@ export default defineComponent({
   },
   created() {
     this.userStatus()
+      this.getDriversList()
   },
   watch: {
     $route() {
@@ -322,6 +336,8 @@ export default defineComponent({
       expected_delivery_date: string;
       dispatcher_notes_taken: string;
       credit_card_id: any;
+      driver_employee_id: string,
+
     }) {
       let path = import.meta.env.VITE_BASE_URL + "/delivery/create/" + this.customer.id;
       axios({
@@ -353,11 +369,26 @@ export default defineComponent({
         cash: this.CreateOilOrderForm.basicInfo.cash,
         credit: this.CreateOilOrderForm.basicInfo.credit,
         credit_card_id: this.CreateOilOrderForm.basicInfo.userCards,
+        driver_employee_id: this.CreateOilOrderForm.basicInfo.driver_driver,
       };
       this.CreateOilOrder(payload);
     },
 
 
+    getDriversList() {
+      let path = import.meta.env.VITE_BASE_URL + "/employee/drivers";
+      axios({
+        method: "get",
+        url: path,
+        withCredentials: true,
+         headers: authHeader(),
+      })
+          .then((response: any) => {
+            this.truckDriversList = response.data;
+          })
+          .catch(() => {
+          });
+    },
 
   },
 })

src/pages/delivery/edit.vue

@@ -221,6 +221,18 @@
                    type="checkbox"/>
           </div>
 
+            <div class="flex-1 mb-4">
+            <label class="block text-white text-sm font-bold mb-2">Delivery Driver </label>
+            <select class="select select-bordered w-full max-w-xs" aria-label="Default select example" id="customer_state"
+              v-model="CreateOilOrderForm.basicInfo.driver_driver">
+              <option class="text-white" v-for="(driver, index) in truckDriversList" :key="index" :value="driver['id']">
+                {{ driver['employee_first_name'] }}  {{ driver['employee_last_name'] }}
+              </option>
+            </select>
+
+          </div>
+
+
           <div class="col-span-12 md:col-span-12 flex mt-5 mb-5">
             <button
                 class="btn">
@@ -260,6 +272,7 @@ export default defineComponent({
       v$: useValidate(),
       user: null,
       deliveryStatus: [],
+      truckDriversList: [],
       userCards: [],
       userCard: {
         date_added: '',
@@ -329,6 +342,7 @@ export default defineComponent({
           credit_card_id: 0,
           cash: false,
           card: false,
+          driver_driver: '',
         },
       },
     }
@@ -346,6 +360,7 @@ export default defineComponent({
   },
   created() {
     this.userStatus()
+    this.getDriversList()
   },
   watch: {
     $route() {
@@ -394,6 +409,9 @@ export default defineComponent({
               this.CreateOilOrderForm.basicInfo.prime = response.data.delivery.delivery_prime;
               this.CreateOilOrderForm.basicInfo.same_day = response.data.delivery.delivery_same_day;
               this.CreateOilOrderForm.basicInfo.delivery_status = response.data.delivery.delivery_status;
+
+              this.CreateOilOrderForm.basicInfo.driver_driver = response.data.delivery.driver_employee_id;
+
               if (response.data.delivery.payment_type == 1) {
                 this.CreateOilOrderForm.basicInfo.userCards = response.data.delivery.payment_card_id;
               }
@@ -498,6 +516,7 @@ export default defineComponent({
       cash: boolean;
       credit: boolean;
       credit_card_id: any;
+      driver_employee_id: string,
     }) {
       let path = import.meta.env.VITE_BASE_URL + "/delivery/edit/" + this.deliveryOrder.id;
       axios({
@@ -540,13 +559,31 @@ export default defineComponent({
         prime: this.CreateOilOrderForm.basicInfo.prime,
         same_day: this.CreateOilOrderForm.basicInfo.same_day,
         delivery_status: this.CreateOilOrderForm.basicInfo.delivery_status,
-
+        driver_employee_id: this.CreateOilOrderForm.basicInfo.driver_driver,
         cash: this.CreateOilOrderForm.basicInfo.cash,
         credit: this.CreateOilOrderForm.basicInfo.card,
         credit_card_id: this.CreateOilOrderForm.basicInfo.userCards,
       };
       this.editOilOrder(payload);
     },
+
+
+    getDriversList() {
+      let path = import.meta.env.VITE_BASE_URL + "/employee/drivers";
+      axios({
+        method: "get",
+        url: path,
+        withCredentials: true,
+         headers: authHeader(),
+      })
+          .then((response: any) => {
+            this.truckDriversList = response.data;
+
+          })
+          .catch(() => {
+          });
+    },
+
   },
 })
 </script>

src/pages/delivery/home.vue

@@ -20,7 +20,7 @@
       </div>
 
       <div class="overflow-x-auto">
-        <div class="flex start">Oil Deliveries</div>
+        <div class="flex start ">Oil Deliveries</div>
         <table class="table">
           <!-- head -->
           <thead>
@@ -28,7 +28,6 @@
             <th>Name</th>
             <th>Status</th>
             <th>Town</th>
-
             <th>Address</th>
             <th>Gallons</th>
             <th>Date</th>
@@ -44,7 +43,7 @@
               </router-link>
             <td>
               <div v-if="oil['delivery_status'] == 0">Waiting</div>
-              <div v-else-if="oil['delivery_status'] == 1">delivered</div>
+              <div v-else-if="oil['delivery_status'] == 1">Delivered</div>
               <div v-else-if="oil['delivery_status'] == 2">Out for Delivery</div>
               <div v-else-if="oil['delivery_status'] == 3">Cancelled</div>
               <div v-else-if="oil['delivery_status'] == 4">Partial Delivery</div>