Eamco/eamco_office_frontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Updated looks

Browse Source
This commit is contained in:
Anekdotin
2024-04-04 16:38:35 -04:00
parent 2d9fce2e89
commit 7164e41aa1
36 changed files with 2863 additions and 1567 deletions
Download Patch File Download Diff File Expand all files Collapse all files

218
src/pages/customer/profile/home.vue
View File

@@ -1,9 +1,9 @@
<template>
<Header/>
<Header />
<div class="flex">
<div class="">
<SideBar/>
<SideBar />
</div>
<div class=" w-full px-10 ">
<div class="text-sm breadcrumbs">
@@ -22,27 +22,24 @@
<div class="w-full mt-10" v-if="customer !== null">
<div class="grid grid-cols-12 gap-5">
<div class="col-span-4 bg-neutral p-5 ">
<img src="../../../assets/images/user_placeholder.png"
alt="Drone Image"
width="200"
height="250"/>
<div class="col-span-4 p-5 ">
<img src="../../../assets/images/user_placeholder.png" alt="Drone Image" width="200" height="250" />
</div>
<div class="col-span-8 bg-neutral p-5">
<div class="col-span-8 p-5">
<div class="grid grid-cols-12">
<div class="col-span-12 font-bold flex justify-evenly pb-5">
<div class="btn">
<router-link :to="{ name: 'deliveryCreate', params: { id: customer.id } }"
class="cursor-pointer underline hover:text-blue-300">
Create Delivery
</router-link>
</div>
<div class="btn">
<router-link :to="{ name: 'customerEdit', params: { id: customer.id } }" class="">
Edit Customer
</router-link>
</div>
<router-link :to="{ name: 'deliveryCreate', params: { id: customer.id } }"
class="btn-sm btn btn-accent">
Create Delivery
</router-link>
<router-link :to="{ name: 'customerEdit', params: { id: customer.id } }"
class="btn-sm btn btn-accent">
Edit Customer
</router-link>
</div>
<div class="col-span-12 font-bold flex pb-5 text-lg">{{ customer.account_number }}</div>
<div class="col-span-12 font-bold flex">
@@ -95,7 +92,7 @@
</div>
</div>
<div class="col-span-12 bg-neutral p-5">
<div class="col-span-12 p-5">
<div class="grid grid-cols-12">
<div class="col-span-12 font-bold flex text-2xl">
Stats
@@ -114,7 +111,7 @@
</div>
</div>
</div>
<div class="col-span-12 bg-neutral p-5">
<div class="col-span-12 p-5">
<div class="grid grid-cols-12">
<div class="col-span-6 font-bold flex text-2xl">
Credit Cards
@@ -122,7 +119,7 @@
<div class="col-span-6 font-bold flex ">
<router-link :to="{ name: 'cardadd', params: { id: customer.user_id } }">
<button class="btn">Add Credit Card</button>
<button class="btn btn-sm btn-accent">Add Credit Card</button>
</router-link>
</div>
<div class="col-span-12 font-bold flex">
@@ -152,19 +149,17 @@
</div>
<div class="flex justify-between">
<a @click.prevent="editCard(card.id)"
class="cursor-pointer underline hover:text-blue-300">
Edit Card
</a>
<a @click.prevent="removeCard(card.id)"
class="cursor-pointer underline hover:text-blue-300">
RemoveCard
<a @click.prevent="editCard(card.id)" class="cursor-pointer underline hover:text-blue-300">
Edit Card
</a>
<a @click.prevent="removeCard(card.id)" class="cursor-pointer underline hover:text-blue-300">
RemoveCard
</a>
</div>
</div>
</div>
<div v-else class="basis-1/3 p-2">
<div class="bg-neutral rounded-md border-2 ">
<div class="rounded-md border-2 ">
<div class="flex p-3">
{{ card.type_of_card }}
</div>
@@ -178,9 +173,11 @@
{{ card.expiration_month }}/ {{ card.expiration_year }}
</div>
<div class="flex justify-between">
<a @click.prevent="editCard(card.id)" class="cursor-pointer underline hover:text-blue-300">Edit
<a @click.prevent="editCard(card.id)"
class="cursor-pointer underline hover:text-blue-300">Edit
Card</a>
<a @click.prevent="removeCard(card.id)" class="cursor-pointer underline hover:text-blue-300">Remove
<a @click.prevent="removeCard(card.id)"
class="cursor-pointer underline hover:text-blue-300">Remove
Card</a>
</div>
</div>
@@ -190,7 +187,7 @@
</div>
</div>
<div class="col-span-12 bg-neutral p-5">
<div class="col-span-12 p-5">
<div class="grid grid-cols-12">
<div class="col-span-6 font-bold flex text-2xl">
Financial
@@ -198,93 +195,92 @@
</div>
</div>
<div class="col-span-12 bg-neutral p-5">
<div class="col-span-12 p-5">
<div class="grid grid-cols-12">
<div class="col-span-12 font-bold flex text-2xl">Orders</div>
</div>
<div class="grid grid-cols-12 ">
<div role="tablist" class="tabs tabs-bordered">
<input type="radio" name="my_tabs_1" role="tab" class="tab" aria-label="Deliveries" checked/>
<div role="tabpanel" class="tab-content pt-10">
<table class="table">
<!-- head -->
<thead>
<tr>
<th>id</th>
<th>Status</th>
<th>Town</th>
<th>Name</th>
<th>Address</th>
<th>Gallons</th>
<th>Date</th>
<th>Automatic</th>
<th>Prime</th>
<th>Same Day</th>
</tr>
</thead>
<tbody>
<!-- row 1 -->
<tr v-for="oil in deliveries" :key="oil['id']">
<td>{{ oil['id'] }}</td>
<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'] == 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>
<div v-else-if="oil['delivery_status'] == 5">Issue</div>
<div v-else-if="oil['delivery_status'] == 10">Finalized</div>
<div v-else></div>
</td>
<td>{{ oil['customer_town'] }}</td>
<td>{{ oil['customer_name'] }}</td>
<td>{{ oil['customer_address'] }}</td>
<td>
<div v-if="oil['customer_asked_for_fill'] == 1">Fill</div>
<div v-else> {{ oil['gallons_ordered'] }}</div>
</td>
<td>{{ oil['expected_delivery_date'] }}</td>
<td>
<div v-if="oil['automatic'] == 0">No</div>
<div v-else>Yes</div>
</td>
<td>
<div v-if="oil['prime'] == 0">No</div>
<div v-else>Yes</div>
</td>
<td>
<div v-if="oil['same_day'] == 0">No</div>
<div v-else>Yes</div>
</td>
<td class="flex gap-5">
<router-link :to="{ name: 'deliveryEdit', params: { id: oil['id'] } }">
<button class="btn">Edit</button>
</router-link>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="grid grid-cols-12 bg-neutral">
<table class="table col-span-12">
<!-- head -->
<thead>
<tr>
<th>id</th>
<th>Status</th>
<th>Town</th>
<th>Name</th>
<th>Address</th>
<th>Gallons</th>
<th>Date</th>
<th>Automatic</th>
<th>Prime</th>
<th>Same Day</th>
</tr>
</thead>
<tbody>
<!-- row 1 -->
<tr v-for="oil in deliveries" :key="oil['id']">
<td>{{ oil['id'] }}</td>
<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'] == 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>
<div v-else-if="oil['delivery_status'] == 5">Issue</div>
<div v-else-if="oil['delivery_status'] == 10">Finalized</div>
<div v-else></div>
</td>
<td>{{ oil['customer_town'] }}</td>
<td>{{ oil['customer_name'] }}</td>
<td>{{ oil['customer_address'] }}</td>
<td>
<div v-if="oil['customer_asked_for_fill'] == 1">Fill</div>
<div v-else> {{ oil['gallons_ordered'] }}</div>
</td>
<td>{{ oil['expected_delivery_date'] }}</td>
<td>
<div v-if="oil['automatic'] == 0">No</div>
<div v-else>Yes</div>
</td>
<td>
<div v-if="oil['prime'] == 0">No</div>
<div v-else>Yes</div>
</td>
<td>
<div v-if="oil['same_day'] == 0">No</div>
<div v-else>Yes</div>
</td>
<td class="flex gap-5">
<router-link :to="{ name: 'deliveryEdit', params: { id: oil['id'] } }">
<button class="btn btn-sm btn-accent">Edit</button>
</router-link>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</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'
import Header from '../../../layouts/headers/headerauth.vue'
import SideBar from '../../../layouts/sidebar/sidebar.vue'
import Footer from '../../../layouts/footers/footer.vue'
import PaginationComp from "../../../components/pagination.vue";
import {notify} from "@kyvg/vue3-notification";
import { notify } from "@kyvg/vue3-notification";
export default defineComponent({
name: 'CustomerProfile',
@@ -367,14 +363,14 @@ export default defineComponent({
withCredentials: true,
headers: authHeader(),
})
.then((response: any) => {
if (response.data.ok) {
this.user = response.data.user;
}
})
.catch(() => {
this.user = null
})
.then((response: any) => {
if (response.data.ok) {
this.user = response.data.user;
}
})
.catch(() => {
this.user = null
})
},
getCustomer(userid: any) {
@@ -425,7 +421,7 @@ export default defineComponent({
},
editCard(card_id: any) {
this.$router.push({name: "cardedit", params: {id: card_id}});
this.$router.push({ name: "cardedit", params: { id: card_id } });
},
removeCard(card_id: any) {