added print button and finalize

This commit is contained in:
2024-03-29 19:57:34 -04:00
parent 5b13032cd6
commit 2d9fce2e89
21 changed files with 1040 additions and 684 deletions

View File

@@ -1,8 +1,8 @@
<template>
<Header/>
<Header />
<div class="flex">
<div class="">
<SideBar/>
<SideBar />
</div>
<div class=" w-full px-10 ">
<div class="text-sm breadcrumbs">
@@ -27,52 +27,55 @@
<table class="table">
<!-- head -->
<thead>
<tr>
<th>Name</th>
<th>Town</th>
<th>Automatic</th>
<th>Phone Number</th>
<th></th>
</tr>
<tr>
<th>Account Number</th>
<th>Name</th>
<th>Town</th>
<th>Automatic</th>
<th>Phone Number</th>
<th></th>
</tr>
</thead>
<tbody>
<!-- row 1 -->
<tr v-for="person in customers" :key="person['id']">
<!-- row 1 -->
<tr v-for="person in customers" :key="person['id']">
<td>{{ person['account_number'] }}</td>
<td>
<router-link :to="{ name: 'customerProfile', params: { id: person['id'] } }">
{{ person['customer_first_name'] }} {{ person['customer_last_name'] }}
</router-link>
</td>
<td>{{ person['customer_town'] }}</td>
<td>
<div v-if="person['customer_automatic'] == 0">No</div>
<div v-else>Yes</div>
</td>
<td>{{ person['customer_phone_number'] }}</td>
<td>
<router-link :to="{ name: 'customerProfile', params: { id: person['id'] } }">
{{ person['customer_first_name'] }} {{ person['customer_last_name'] }}
</router-link>
</td>
<td>{{ person['customer_town'] }}</td>
<td>
<div v-if="person['customer_automatic'] == 0">No</div>
<div v-else>Yes</div>
</td>
<td>{{ person['customer_phone_number'] }}</td>
<td class="flex gap-5">
<router-link :to="{ name: 'deliveryCreate', params: { id: person['id'] } }"
class="cursor-pointer underline hover:text-blue-300">
Oil
</router-link>
<td class="flex gap-5">
<router-link :to="{ name: 'deliveryCreate', params: { id: person['id'] } }" class="cursor-pointer underline hover:text-blue-300">
Oil
</router-link>
<router-link :to="{ name: 'customerEdit', params: { id: person['id'] } }" class="cursor-pointer underline hover:text-blue-300">
Edit
</router-link>
<router-link :to="{ name: 'customerProfile', params: { id: person['id'] } }" class="cursor-pointer underline hover:text-blue-300">
View
</router-link>
<a @click.prevent="deleteCustomer(person['id'])" class="cursor-pointer underline hover:text-blue-300">
Delete
</a>
</td>
</tr>
<router-link :to="{ name: 'customerEdit', params: { id: person['id'] } }"
class="cursor-pointer underline hover:text-blue-300">
Edit
</router-link>
<router-link :to="{ name: 'customerProfile', params: { id: person['id'] } }"
class="cursor-pointer underline hover:text-blue-300">
View
</router-link>
<a @click.prevent="deleteCustomer(person['id'])" class="cursor-pointer underline hover:text-blue-300">
Delete
</a>
</td>
</tr>
</tbody>
</table>
</div>
<div class="flex justify-center" v-if="recordsLength > 9">
<pagination @paginate="getPage" :records="recordsLength" v-model="page" :per-page="perPage"
:options="options">
<pagination @paginate="getPage" :records="recordsLength" v-model="page" :per-page="perPage" :options="options">
</pagination>
<div class="flex justify-center mb-10"> {{ recordsLength }} items Found</div>
</div>
@@ -80,11 +83,11 @@
</div>
</div>
<Footer/>
<Footer />
</template>
<script lang="ts">
import {defineComponent} from 'vue'
import { defineComponent } from 'vue'
import axios from 'axios'
import authHeader from '../../services/auth.header'
@@ -140,15 +143,15 @@ export default defineComponent({
withCredentials: true,
headers: authHeader(),
})
.then((response: any) => {
if (response.data.ok) {
this.user = response.data.user;
.then((response: any) => {
if (response.data.ok) {
this.user = response.data.user;
}
})
.catch(() => {
this.user = null
})
}
})
.catch(() => {
this.user = null
})
},
get_customers(page: any) {
let path = import.meta.env.VITE_BASE_URL + '/customer/all/' + page;
@@ -160,7 +163,7 @@ export default defineComponent({
this.customers = response.data
})
},
deleteCustomer(user_id: any) {
deleteCustomer(user_id: any) {
let path = import.meta.env.VITE_BASE_URL + '/customer/delete/' + user_id;
axios({
method: 'delete',
@@ -168,13 +171,11 @@ export default defineComponent({
headers: authHeader(),
}).then(() => {
this.get_customers(1)
this.get_customers(1)
})
},
},
})
</script>
<style scoped>
</style>
<style scoped></style>