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

updated

Browse Source
This commit is contained in:
Anekdotin
2024-05-16 14:36:52 -04:00
parent 7164e41aa1
commit 52a02c7595
34 changed files with 771 additions and 2342 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/layouts/headers/headerauth.vue
View File

@@ -123,7 +123,7 @@ export default defineComponent({
}, 600),
getSearchUrl() {
if (this.type_of_search == 0) {
const url = "http://127.0.0.1:4056/search/customer";
const url = import.meta.env.VITE_BASE_URL + "/search/customer";
const params = {
q: this.searchTerm,
};
@@ -131,7 +131,7 @@ export default defineComponent({
return `${url}?${searchParams}`;
}
else if (this.type_of_search == 1) {
const url = "http://127.0.0.1:4056/search/customer";
const url = import.meta.env.VITE_BASE_URL +"/search/customer";
const params = {
q: this.searchTerm,
};
@@ -139,7 +139,7 @@ export default defineComponent({
return `${url}?${searchParams}`;
}
else if (this.type_of_search == 2) {
const url = "http://127.0.0.1:4056/search/customer";
const url = import.meta.env.VITE_BASE_URL +"/search/customer";
const params = {
q: this.searchTerm,
};
@@ -147,7 +147,7 @@ export default defineComponent({
return `${url}?${searchParams}`;
}
else {
const url = "http://127.0.0.1:4056/search/customer";
const url = import.meta.env.VITE_BASE_URL +"/search/customer";
const params = {
q: this.searchTerm,
};
@@ -195,10 +195,7 @@ export default defineComponent({
})
},
getCompany() {
let path = import.meta.env.VITE_BASE_URL + '/admin/company/' + import.meta.env.VITE_COMPANY_ID;
axios({
method: "get",
url: path,

66
src/layouts/headers/search.vue
View File

@@ -1,66 +0,0 @@
<template>
<div class="navbar bg-base-100">
<div class="basis-1/4 md:basis-1/4">
<router-link :to="{ name: 'home' }">
Auburn Oil
</router-link>
</div>
<div class="basis-1/4 md:basis-1/2 justify-center text-center">
<input type="search" placeholder="Search " class="input input-bordered w-24 md:w-auto" v-model="searchTerm"/>
</div>
<SearchResults v-if="customers.length" :customers="customers" />
<div class="basis-1/2 md:basis-1/4 justify-end gap-5">
<router-link :to="{ name: 'customerCreate' }">
<button class="btn">Create Customer</button>
</router-link>
<!-- <div v-if="employee.id">-->
<!-- <router-link :to="{ name: 'employeeProfile', params: { id: employee.id } }">-->
<!-- <button class="btn">{{ user.user_name }}</button>-->
<!-- </router-link>-->
<!-- </div>-->
</div>
</div>
</template>
<script lang="ts">
import { debounce } from "vue-debounce";
import SearchResults from "./SearchResults.vue";
import { ref, watch } from "vue";
const searchTerm = ref("");
const customers = ref([]);
const getSearchUrl = () => {
const url = "https://dummyjson.com/products/search";
const params = {
q: searchTerm.value,
limit: "5",
};
const searchParams = new URLSearchParams(params);
return `${url}?${searchParams}`;
};
const performSearch = debounce(async () => {
if (searchTerm.value === "") {
customers.value = [];
return;
}
if (searchTerm.value.length < 2) {
return;
}
const searchUrl = getSearchUrl();
const response = await (await fetch(searchUrl)).json();
customers.value = response.products;
}, 600);
watch(searchTerm, () => {
performSearch();
});
</script>

28
src/pages/admin/oilprice.vue
View File

@@ -31,38 +31,44 @@
<div class="col-span-12 md:col-span-4 mb-5 md:mb-0 gap-10">
<label class="block text-white text-sm font-bold cursor-pointer label">Price Customer</label>
<input v-model="CreateOilForm.basicInfo.price_for_customer"
class="input input-bordered w-full max-w-xs"
class="input input-bordered input-sm w-full max-w-xs"
id="title" type="text" placeholder="Todays Price"/>
</div>
<div class="mb-4">
<label class="block text-white text-sm font-bold mb-2">Price Employee</label>
<input v-model="CreateOilForm.basicInfo.price_for_employee"
class="input input-bordered w-full max-w-xs"
class="input input-bordered input-sm w-full max-w-xs"
id="title" type="text" placeholder="Todays Price Employee"/>
</div>
<div class="mb-4">
<label class="block text-white text-sm font-bold mb-2"> Price from Supplier</label>
<input v-model="CreateOilForm.basicInfo.price_from_supplier"
class="input input-bordered w-full max-w-xs"
class="input input-bordered input-sm w-full max-w-xs"
id="prime" type="text" placeholder="Price Prime"/>
</div>
<div class="mb-4">
<label class="block text-white text-sm font-bold mb-2">Price same day</label>
<input v-model="CreateOilForm.basicInfo.price_same_day"
class="input input-bordered w-full max-w-xs"
class="input input-bordered input-sm w-full max-w-xs"
id="title" type="text" placeholder="Price Same Day"/>
</div>
<div class="mb-4">
<label class="block text-white text-sm font-bold mb-2">Price Prime</label>
<input v-model="CreateOilForm.basicInfo.price_prime"
class="input input-bordered input-sm w-full max-w-xs"
id="title" type="text" placeholder="Price Prime"/>
</div>
<div class="col-span-12 md:col-span-12 flex mt-5 mb-5">
<button
class="btn">
Create Price
class="btn btn-accent btn-sm">
Create Pricing
</button>
</div>
</form>
@@ -103,6 +109,7 @@
price_for_customer: '',
price_for_employee: '',
price_same_day: '',
price_prime: '',
},
},
}
@@ -152,6 +159,7 @@
this.CreateOilForm.basicInfo.price_for_customer = response.data.price_for_customer;
this.CreateOilForm.basicInfo.price_for_employee = response.data.price_for_employee;
this.CreateOilForm.basicInfo.price_same_day = response.data.price_same_day;
this.CreateOilForm.basicInfo.price_prime = response.data.price_prime;
}
})
},
@@ -160,6 +168,7 @@
price_for_customer: string;
price_for_employee: string;
price_same_day: string;
price_prime: string;
}) {
let path = import.meta.env.VITE_BASE_URL + "/admin/oil/create";
@@ -189,7 +198,8 @@
price_from_supplier: this.CreateOilForm.basicInfo.price_from_supplier,
price_for_customer: this.CreateOilForm.basicInfo.price_for_customer,
price_for_employee: this.CreateOilForm.basicInfo.price_for_employee,
price_same_day: this.CreateOilForm.basicInfo.price_same_day,
price_same_day: this.CreateOilForm.basicInfo.price_same_day,
price_prime: this.CreateOilForm.basicInfo.price_prime,
};
this.CreatePricing(payload);
},

135
src/pages/card/editcard.vue
View File

@@ -23,8 +23,7 @@
<div class="grid grid-cols-1 rounded-md p-6 ">
<div class="text-[24px]">
Credit Card Customer: {{ customer }}
Credit Card Customer: {{ customer.customer_first_name }}
</div>
<div class="text-[20px]">
Card Id: {{card.id}}
@@ -44,7 +43,7 @@
<div class="mb-4">
<label class="block text-white text-sm font-bold mb-2">Name on Card</label>
<input v-model="CreateCardForm.basicInfo.card_name"
class="input input-bordered w-full max-w-xs"
class="input input-bordered input-sm w-full max-w-xs"
id="title" type="text" placeholder="Name on Card"/>
<span v-if="v$.CreateCardForm.basicInfo.card_name.$error"
class="text-red-600 text-center">
@@ -55,7 +54,7 @@
<div class="mb-4">
<label class="block text-white text-sm font-bold mb-2">Card Number</label>
<input v-model="CreateCardForm.basicInfo.card_number"
class="input input-bordered w-full max-w-xs"
class="input input-bordered input-sm w-full max-w-xs"
id="title" type="text" placeholder="Card Number"/>
<span v-if="v$.CreateCardForm.basicInfo.card_number.$error"
class="text-red-600 text-center">
@@ -67,18 +66,18 @@
<label class="block text-white text-sm font-bold mb-2">Expiration Month</label>
<select
v-model="CreateCardForm.basicInfo.expiration_month"
class="input input-bordered w-full max-w-xs"
class="input input-bordered input-sm w-full max-w-xs"
id="Month"
>
<option>01</option>
<option>02</option>
<option>03</option>
<option>04</option>
<option>05</option>
<option>06</option>
<option>07</option>
<option>08</option>
<option>09</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
@@ -89,7 +88,7 @@
<label class="block text-white text-sm font-bold mb-2">Expiration Year</label>
<select
v-model="CreateCardForm.basicInfo.expiration_year"
class="input input-bordered w-full max-w-xs"
class="input input-bordered input-sm w-full max-w-xs"
id="Month"
>
<option>2024</option>
@@ -100,7 +99,6 @@
<option>2029</option>
<option>2030</option>
</select>
<span v-if="v$.CreateCardForm.basicInfo.expiration_year.$error"
class="text-red-600 text-center">
{{ v$.CreateCardForm.basicInfo.expiration_year.$errors[0].$message }}
@@ -111,7 +109,7 @@
<label class="block text-white text-sm font-bold mb-2">Type of Card</label>
<select
v-model="CreateCardForm.basicInfo.type_of_card"
class="input input-bordered w-full max-w-xs"
class="input input-bordered input-sm w-full max-w-xs"
id="Month"
>
<option>Visa</option>
@@ -119,7 +117,6 @@
<option>Discover</option>
<option>American Express</option>
</select>
<span v-if="v$.CreateCardForm.basicInfo.type_of_card.$error"
class="text-red-600 text-center">
{{ v$.CreateCardForm.basicInfo.type_of_card.$errors[0].$message }}
@@ -129,7 +126,7 @@
<div class="mb-4">
<label class="block text-white text-sm font-bold mb-2">Security Number</label>
<input v-model="CreateCardForm.basicInfo.security_number"
class="input input-bordered w-full max-w-xs"
class="input input-bordered input-sm w-full max-w-xs"
id="title" type="text" placeholder="Back of card"/>
<span v-if="v$.CreateCardForm.basicInfo.security_number.$error"
class="text-red-600 text-center">
@@ -137,7 +134,6 @@
</span>
</div>
<div class="col-span-12 md:col-span-12 flex mt-5 mb-5">
<button class="btn">
Edit Card
@@ -155,7 +151,6 @@
<script lang="ts">
import {defineComponent} from 'vue'
import axios from 'axios'
import { notify } from "@kyvg/vue3-notification";
import authHeader from '../../services/auth.header'
import Header from '../../layouts/headers/headerauth.vue'
import SideBar from '../../layouts/sidebar/sidebar.vue'
@@ -180,20 +175,19 @@
id: '',
},
customer: {
id: 0,
customer_last_name: '',
customer_first_name: '',
customer_town: '',
customer_state: '',
customer_zip: '',
customer_first_call: '',
customer_email: '',
customer_automatic: '',
customer_phone_number: '',
customer_home_type: '',
customer_apt: '',
customer_address: '',
},
id: 0,
user_id: 0,
customer_first_name: '',
customer_last_name: '',
customer_town: '',
customer_address: '',
customer_state: 0,
customer_zip: '',
customer_apt: '',
customer_home_type: 0,
customer_phone_number: '',
account_number: '',
},
card: {
id: '',
card_name: '',
@@ -235,7 +229,6 @@
};
},
created() {
this.userStatus()
},
watch: {
@@ -265,41 +258,18 @@
this.user.id = '';
})
},
getCustomer(user_id: any) {
let path = import.meta.env.VITE_BASE_URL + "/customer/" + user_id;
getCustomer(userid: any) {
let path = import.meta.env.VITE_BASE_URL + '/customer/' + userid;
axios({
method: "get",
method: 'get',
url: path,
withCredentials: true,
})
.then((response: any) => {
this.customer_id = response.data.user_id;
this.customer.customer_last_name= response.data.customer_last_name;
this.customer.customer_first_name = response.data.customer_first_name;
this.customer.customer_town = response.data.customer_town;
this.customer.customer_state = response.data.customer_state;
this.customer.customer_zip = response.data.customer_zip;
this.customer.customer_first_call = response.data.customer_first_call;
this.customer.customer_email = response.data.customer_email;
this.customer.customer_automatic = response.data.customer_automatic;
this.customer.customer_phone_number = response.data.customer_phone_number;
this.customer.customer_home_type = response.data.customer_home_type;
this.customer.customer_apt = response.data.customer_last_name;
this.customer.customer_address = response.data.customer_last_name;
})
.catch(() => {
notify({
title: "Error",
text: "Could not find customer",
type: "error",
});
});
headers: authHeader(),
}).then((response: any) => {
this.customer = response.data
})
},
getCard (card_id:any) {
let path = import.meta.env.VITE_BASE_URL + "/payment/card/" + card_id ;
axios({
method: "get",
@@ -308,28 +278,19 @@
headers: authHeader(),
})
.then((response: any) => {
if (response.data.ok) {
this.CreateCardForm.basicInfo.card_name= response.data.card.card_name;
this.CreateCardForm.basicInfo.expiration_month= response.data.card.expiration_month;
this.CreateCardForm.basicInfo.expiration_year= response.data.card.expiration_year;
this.CreateCardForm.basicInfo.type_of_card= response.data.card.type_of_card;
this.CreateCardForm.basicInfo.security_number= response.data.card.security_number;
this.CreateCardForm.basicInfo.main_card= response.data.card.main_card;
this.CreateCardForm.basicInfo.card_number= response.data.card.card_number;
this.CreateCardForm.basicInfo.card_name= response.data.name_on_card;
this.CreateCardForm.basicInfo.expiration_month= response.data.expiration_month;
this.CreateCardForm.basicInfo.expiration_year= response.data.expiration_year;
this.CreateCardForm.basicInfo.type_of_card= response.data.type_of_card;
this.CreateCardForm.basicInfo.security_number= response.data.security_number;
this.CreateCardForm.basicInfo.main_card= response.data.main_card;
this.CreateCardForm.basicInfo.card_number= response.data.card_number;
this.user.id = response.data.card.user_id
this.card.id=response.data.card.id;
this.card.user_id=response.data.card.user_id;
this.card.card_name= response.data.card.card_name
this.card.expiration_month=response.data.card.expiration_month;
this.card.expiration_year=response.data.card.expiration_year;
this.card.type_of_card=response.data.card.type_of_card;
this.card.security_number=response.data.card.security_number;
this.card.main_card=response.data.card.main_card;
this.getCustomer(response.data.card.user_id)
}
this.user.id = response.data.user_id
this.card=response.data
this.getCustomer(response.data.user_id)
})
},
editCard(payload: {

2
src/pages/card/home.vue
View File

@@ -21,7 +21,7 @@
</div>
<div class="flex justify-end">
<router-link :to="{ name: 'customerCreate' }">
<button class="btn">Create Customer</button>
<button class="btn btn-sm btn-accent">Create Customer</button>
</router-link>
</div>

32
src/pages/customer/create.vue
View File

@@ -122,13 +122,14 @@
</span>
</div>
<div class="col-span-12 md:col-span-4 mb-5 md:mb-0">
<div class="col-span-12 md:col-span-4 mb-5 md:mb-0 py-5">
<label class="block text-white text-sm font-bold mb-2">Automatic</label>
<input v-model="CreateCustomerForm.basicInfo.customer_automatic" class="checkbox checkbox-xs" id="automatic"
type="checkbox" />
</div>
<div class="col-span-12 md:col-span-12 flex mt-5 mb-5">
<button class="btn btn-accent">
<button class="btn btn-accent btn-sm">
Create Customer
</button>
</div>
@@ -167,6 +168,16 @@ export default defineComponent({
x: '',
custList: [],
new_user_id: 0,
company: {
creation_date: "",
account_prefix: "",
company_name: "",
company_address: "",
company_town: "",
company_zip: "",
company_state: "",
company_phone_number: "",
},
CreateCustomerForm: {
basicInfo: {
customer_last_name: "",
@@ -207,6 +218,7 @@ export default defineComponent({
mounted() {
this.getCustomerTypeList();
this.getStatesList();
this.getCompany();
},
methods: {
acceptNumber() {
@@ -218,6 +230,20 @@ export default defineComponent({
this.CreateCustomerForm.basicInfo.customer_phone_number = ''
}
},
getCompany() {
let path = import.meta.env.VITE_BASE_URL + '/admin/company/' + import.meta.env.VITE_COMPANY_ID;
axios({
method: "get",
url: path,
withCredentials: true,
headers: authHeader(),
})
.then((response: any) => {
this.company = response.data;
})
},
userStatus() {
let path = import.meta.env.VITE_BASE_URL + '/auth/whoami';
axios({
@@ -247,6 +273,7 @@ export default defineComponent({
customer_automatic: string;
customer_home_type: string,
customer_state: string;
}) {
let path = import.meta.env.VITE_BASE_URL + "/customer/create";
axios({
@@ -279,6 +306,7 @@ export default defineComponent({
customer_state: this.CreateCustomerForm.basicInfo.customer_state,
customer_apt: this.CreateCustomerForm.basicInfo.customer_apt,
customer_address: this.CreateCustomerForm.basicInfo.customer_address,
};
this.CreateCustomer(payload);
},

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

@@ -19,7 +19,7 @@
</router-link>
</li>
</ul>
<div class="w-full mt-10" v-if="customer !== null">
<div class="w-full mt-10" >
<div class="grid grid-cols-12 gap-5">
<div class="col-span-4 p-5 ">
@@ -215,6 +215,7 @@
<th>Automatic</th>
<th>Prime</th>
<th>Same Day</th>
<th></th>
</tr>
</thead>
<tbody>
@@ -254,16 +255,16 @@
<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>
</router-link>
<a @click.prevent="deleteCall(oil['id'])">
<button class="btn btn-sm btn-error">Delete</button>
</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
@@ -332,16 +333,19 @@ export default defineComponent({
delivery_format: false,
delivery_template: PaginationComp
},
}
},
created() {
this.userStatus()
this.getCustomer(this.$route.params.id);
this.getCreditCards(this.$route.params.id)
this.getCreditCardsCount(this.$route.params.id)
},
mounted() {
this.getCustomer(this.$route.params.id)
this.getCustomerDelivery(this.$route.params.id, this.delivery_page)
this.getPage(this.delivery_page)
},
@@ -353,7 +357,7 @@ export default defineComponent({
methods: {
getPage: function (page: any) {
// we simulate an api call that fetch the records from a backend
this.getCustomer(page)
this.getCustomerDelivery(this.$route.params.id, page)
},
userStatus() {
let path = import.meta.env.VITE_BASE_URL + '/auth/whoami';
@@ -441,6 +445,29 @@ export default defineComponent({
})
},
deleteCall(delivery_id: any) {
let path = import.meta.env.VITE_BASE_URL + '/delivery/delete/' + delivery_id;
axios({
method: 'delete',
url: path,
headers: authHeader(),
}).then((response: any) => {
if (response.data.ok) {
notify({
title: "Success",
text: "deleted oil order",
type: "success",
});
this.getPage
} else {
notify({
title: "Failure",
text: "error deleting oil order",
type: "success",
});
}
})
},
},
})
</script>

58
src/pages/delivery/create.vue
View File

@@ -73,10 +73,10 @@
<tr>
<th>id</th>
<th>Date</th>
<th>Gallons</th>
<th>Status</th>
<th>Prime</th>
<th>Same Day</th>
@@ -131,8 +131,8 @@
<div class="col-span-12 md:col-span-4 mb-5 md:mb-0 gap-10">
<label class="block text-white text-sm font-bold cursor-pointer label">Fill </label>
<input v-model="CreateOilOrderForm.basicInfo.customer_asked_for_fill" class="checkbox checkbox-xs" id="fill"
type="checkbox" />
<input v-model="CreateOilOrderForm.basicInfo.customer_asked_for_fill" class="checkbox checkbox-xs"
id="fill" type="checkbox" />
</div>
<div class="mb-4">
@@ -170,23 +170,18 @@
<div class="col-span-12 md:col-span-4 mb-5 md:mb-0 gap-10">
<label class="block text-white text-sm font-bold cursor-pointer label">Prime</label>
<input v-model="CreateOilOrderForm.basicInfo.prime" class="checkbox checkbox-xs" id="prime" type="checkbox" />
<input v-model="CreateOilOrderForm.basicInfo.prime" class="checkbox checkbox-xs" id="prime"
type="checkbox" />
</div>
<div class="col-span-12 md:col-span-4 mb-5 md:mb-0 gap-10">
<label class="block text-white text-sm font-bold cursor-pointer label">Same Day </label>
<input v-model="CreateOilOrderForm.basicInfo.same_day" class="checkbox checkbox-xs" id="same_day" type="checkbox" />
<input v-model="CreateOilOrderForm.basicInfo.same_day" class="checkbox checkbox-xs" id="same_day"
type="checkbox" />
</div>
<div class="col-span-12 md:col-span-4 mb-5 md:mb-0 gap-10">
<label class="block text-white text-sm font-bold cursor-pointer label">Cash</label>
<input v-model="CreateOilOrderForm.basicInfo.cash" class="checkbox checkbox-xs" id="cash" type="checkbox" />
</div>
<div class="col-span-12 md:col-span-4 mb-5 md:mb-0 gap-10">
<label class="block text-white text-sm font-bold cursor-pointer label">Credit </label>
<input v-model="CreateOilOrderForm.basicInfo.credit" class="checkbox checkbox-xs" id="Credit" type="checkbox" />
</div>
<div class="flex-1 mb-4">
<label class="block text-white text-sm font-bold mb-2">Customer Cards Payment</label>
@@ -208,7 +203,21 @@
</option>
</select>
</div>
<div class="col-span-12 md:col-span-4 mb-5 md:mb-0 gap-10 text-error">
One or Both must be selected
</div>
<div class="col-span-12 md:col-span-4 mb-5 md:mb-0 gap-10">
<label class="block text-white text-sm font-bold cursor-pointer label">Cash</label>
<input v-model="CreateOilOrderForm.basicInfo.cash" class="checkbox checkbox-xs" id="cash"
type="checkbox" />
</div>
<div class="col-span-12 md:col-span-4 mb-5 md:mb-0 gap-10">
<label class="block text-white text-sm font-bold cursor-pointer label">Credit </label>
<input v-model="CreateOilOrderForm.basicInfo.credit" class="checkbox checkbox-xs" id="Credit"
type="checkbox" />
</div>
<div class="col-span-12 md:col-span-12 flex mt-5 mb-5">
<button class="btn btn-sm btn-accent">
@@ -251,6 +260,7 @@ export default defineComponent({
return {
v$: useValidate(),
user: null,
checked: false,
userCards: [],
truckDriversList: [],
CreateOilOrderForm: {
@@ -293,6 +303,7 @@ export default defineComponent({
basicInfo: {
gallons_ordered: { required, minLength: minLength(1) },
expected_delivery_date: { required },
},
},
};
@@ -435,14 +446,29 @@ export default defineComponent({
credit_card_id: this.CreateOilOrderForm.basicInfo.userCards,
driver_employee_id: this.CreateOilOrderForm.basicInfo.driver_driver,
};
if (this.CreateOilOrderForm.basicInfo.driver_driver == '') {
let pass = 0;
if (this.CreateOilOrderForm.basicInfo.driver_driver === '') {
notify({
title: "Error",
text: "Did not add a driver",
type: "error",
});
pass += 1;
}
this.CreateOilOrder(payload);
if (this.CreateOilOrderForm.basicInfo.cash === false && this.CreateOilOrderForm.basicInfo.credit === false) {
notify({
title: "Error",
text: "Did not select a payment method",
type: "error",
});
pass += 1;
}
if (pass == 0) {
this.CreateOilOrder(payload);
}
},
},

10
src/pages/delivery/edit.vue
View File

@@ -73,9 +73,9 @@
<div class="grid grid-cols-1" v-if="deliveryOrder.payment_type == 1">
<div class="flex">
<div class="basis-1/3 p-2">
<div class="rounded-md border-2 ">
<div class="flex ">
<div class="basis-1/3 p-2 ">
<div class="rounded-md border-2 bg-accent">
<div class="flex p-3">
{{ userCard.type_of_card }}
</div>
@@ -360,7 +360,7 @@ export default defineComponent({
},
getDeliveryOrder(delivery_id: any) {
let path = import.meta.env.VITE_BASE_URL + "/delivery/" + delivery_id;
let path = import.meta.env.VITE_BASE_URL +"/delivery/" + delivery_id;
axios({
method: "get",
url: path,
@@ -494,7 +494,7 @@ export default defineComponent({
})
.then((response: any) => {
if (response.data.ok) {
this.$router.push({ name: "delivery" });
this.$router.push({ name: "deliveryOrder", params: { id: this.deliveryOrder.id } });
}
if (response.data.error) {
this.$router.push("/");

4
src/pages/delivery/home.vue
View File

@@ -55,7 +55,9 @@
<tr v-for="oil in deliveries" :key="oil['id']">
<td>{{ oil['id'] }} </td>
<router-link :to="{ name: 'customerProfile', params: { id: oil['customer_id'] } }">
<td>{{ oil['customer_name'] }} </td>
<td>
<div class="hover:text-accent">{{ oil['customer_name'] }} </div>
</td>
</router-link>
<td>
<div v-if="oil['delivery_status'] == 0">Waiting</div>

444
src/pages/delivery/update_tickets/finalize_ticket.vue
View File

@@ -22,17 +22,22 @@
</div>
<div class="grid grid-cols-1 rounded-md pb-5" v-if="total_amount">
<div class="text-[24px]">
<div class="text-2xl border-b border-gray-500">
Finalize Oil Order # {{ deliveryOrder.id }}
</div>
<div class="flex justify-end" v-if="deliveryOrder.id">
<router-link :to="{ name: 'deliveryEdit', params: { id: deliveryOrder.id } }">
<button class="btn btn-sm btn-accent">Edit Order</button>
</router-link>
</div>
<div class="grid grid-cols-12">
<div class="col-span-6">
<div class="col-span-6 ">
<div class="col-span-12 font-bold">
Customer
</div>
<div class="col-span-6 bg-neutral p-5">
<div class="grid grid-cols-12">
<div class="col-span-12 p-5 ">
<div class="grid grid-cols-12 mb-10">
<div class="col-span-12 font-bold flex">
{{ customer.customer_first_name }}
{{ customer.customer_last_name }}
@@ -55,7 +60,6 @@
{{ customer.customer_zip }}
</div>
</div>
<div class="col-span-12 font-bold flex" v-if="customer.customer_apt !== 'None'">
{{ customer.customer_apt }}
</div>
@@ -72,189 +76,276 @@
{{ customer.customer_phone_number }}
</div>
</div>
</div>
<div class="col-span-12 ">
<div class="grid grid-cols-12 ">
<div class="col-span-12 font-bold">
Status
</div>
<div class="col-span-12 text-gray-500">
<div v-if="deliveryOrder.delivery_status == 0">waiting</div>
<div v-else-if="deliveryOrder.delivery_status == 1">delivered</div>
<div v-else-if="deliveryOrder.delivery_status == 2">Out for Delivery</div>
<div v-else-if="deliveryOrder.delivery_status == 3">Cancelled</div>
<div v-else-if="deliveryOrder.delivery_status == 4">Partial Delivery</div>
<div v-else-if="deliveryOrder.delivery_status == 5">misdelivery</div>
<div v-else-if="deliveryOrder.delivery_status == 6">unknown</div>
<div v-else></div>
</div>
<div class="col-span-12 font-bold mt-5">
Scheduled date/time
</div>
<div class="col-span-12 text-gray-500">
{{ deliveryOrder.expected_delivery_date }}
</div>
<div class="col-span-12 font-bold mt-5">
When Called
</div>
<div class="col-span-12 text-gray-500 ">
{{ deliveryOrder.when_ordered }}
</div>
<div class="col-span-12 font-bold mt-5">
When Delivered
</div>
<div class="col-span-12 text-gray-500 " >
{{ deliveryOrder.when_delivered }}
</div>
<div class="col-span-12 font-bold mt-5">
Driver Name
</div>
<div class="col-span-12 text-gray-500">
{{ deliveryOrder.driver_first_name }} {{ deliveryOrder.driver_last_name }}
</div>
</div>
</div>
</div>
</div>
<div class="col-span-6 ">
<div class="flex justify-end" v-if="deliveryOrder.id">
<router-link :to="{ name: 'deliveryEdit', params: { id: deliveryOrder.id } }">
<button class="btn">Edit Order</button>
</router-link>
</div>
</div>
</div>
</div>
<div class="col-span-6">
<div class="col-span-12 font-bold">
Delivery Status
</div>
<div class="grid grid-cols-12 bg-neutral p-5">
<div class="col-span-12 font-bold">
Status
</div>
<div class="col-span-12">
<div v-if="deliveryOrder.delivery_status == 0">waiting</div>
<div v-else-if="deliveryOrder.delivery_status == 1">delivered</div>
<div v-else-if="deliveryOrder.delivery_status == 2">Out for Delivery</div>
<div v-else-if="deliveryOrder.delivery_status == 3">Cancelled</div>
<div v-else-if="deliveryOrder.delivery_status == 4">Partial Delivery</div>
<div v-else-if="deliveryOrder.delivery_status == 5">misdelivery</div>
<div v-else-if="deliveryOrder.delivery_status == 6">unknown</div>
<div v-else></div>
</div>
<div class="col-span-12 font-bold mt-5">
Scheduled date/time
</div>
<div class="col-span-12 ">
{{ deliveryOrder.expected_delivery_date }}
</div>
<div class="col-span-12 font-bold mt-5">
When Called
</div>
<div class="col-span-12 ">
{{ deliveryOrder.when_ordered }}
</div>
<div class="col-span-12 font-bold mt-5">
Driver Name
</div>
<div class="col-span-12 ">
{{ deliveryOrder.driver_first_name }} {{ deliveryOrder.driver_last_name }}
</div>
</div>
</div>
<div class="col-span-6 mt-5">
<div class="col-span-12 font-bold">
Info
</div>
<div class="grid grid-cols-12 bg-neutral p-5">
<div class="col-span-12 font-bold">
<div v-if="deliveryOrder.customer_asked_for_fill == 1">Fill</div>
<div v-else>Gallons delivered: {{ deliveryOrder.gallons_delivered }}</div>
</div>
<div class="col-span-12 font-bold">
<div v-if="deliveryOrder.prime == 1">
Prime Required: Yes
</div>
<div v-if="deliveryOrder.prime == 0">
Prime Required: No
</div>
</div>
<div class="col-span-12 font-bold">
<div v-if="deliveryOrder.same_day == 1">
Same Day: Yes
</div>
<div v-if="deliveryOrder.same_day == 0">
Same Day: No
</div>
</div>
</div>
</div>
<div class="col-span-6 mt-5">
<div class="col-span-12 font-bold">
Payment
</div>
<div class="grid grid-cols-12 bg-neutral p-2">
<div class="col-span-12 font-bold">
<div v-if="deliveryOrder.payment_type == 0">Cash</div>
<div v-else-if="deliveryOrder.payment_type == 1">Credit Card</div>
<div v-else-if="deliveryOrder.payment_type == 2">Credit Card & cash</div>
<div v-else>No Payment Type Added</div>
</div>
<div class="col-span-12" v-if="deliveryOrder.payment_type == 1">
<div class="flex">
<div class="basis-1/3 p-2">
<div class="bg-neutral rounded-md border-2 ">
<div class="flex p-2">
{{ userCard.type_of_card }}
<div class="grid grid-cols-12 ">
<div class="col-span-12 py-3">
<div v-if="deliveryOrder.prime == 1">
<div class="col-span-12 ">
Prime
</div>
<div class="flex p-1 pl-4">
{{ userCard.name_on_card }}
<div class="col-span-12 text-gray-500">
Yes
</div>
<div class="flex p-1 pl-4">
{{ userCard.card_number }}
</div>
<div v-else>
<div class="col-span-12 ">
Prime
</div>
<div class="flex p-1 pl-4">
{{ userCard.expiration_month }}/ {{ userCard.expiration_year }}
<div class="col-span-12 text-gray-500">
No
</div>
</div>
</div>
<div class="col-span-12 py-3">
<div v-if="deliveryOrder.same_day === 1">
<div class="col-span-12 ">
Same Day
</div>
<div class="col-span-12 text-gray-500">
Yes
</div>
</div>
<div v-else>
<div class="col-span-12 ">
Same Day
</div>
<div class="col-span-12 text-gray-500">
No
</div>
</div>
</div>
</div>
</div>
<div class="col-span-12" v-if="deliveryOrder.payment_type == 2">
<div class="flex">
<div class="basis-1/3 p-2">
<div class="bg-neutral rounded-md border-2 ">
<div class="flex p-3">
<div class="col-span-12 mt-5">
<div class="col-span-12 font-bold">
Payment
</div>
<div class="grid grid-cols-12">
<div class="col-span-12 text-gray-500">
<div v-if="deliveryOrder.payment_type == 0">Cash</div>
<div v-else-if="deliveryOrder.payment_type == 1">Credit Card</div>
<div v-else-if="deliveryOrder.payment_type == 2">Credit Card & cash</div>
<div v-else>No Payment Type Added</div>
</div>
</div>
</div>
<div class="col-span-12 mt-5">
<div class="col-span-12 font-bold">
<div class="grid grid-cols-12 mb-5">
<div class="col-span-12 ">
Price / Gallon
</div>
<div class="flex p-1 pl-4">
{{ userCard.name_on_card }}
<div class="col-span-12 text-gray-500">
{{ deliveryOrder.customer_price }}
</div>
<div class="flex p-1 pl-4">
{{ userCard.card_number }}
<div class="col-span-12 " v-if="deliveryOrder.customer_asked_for_fill == 1">
<div class="">
Gallons Ordered:
</div>
<div class="col-span-12 text-gray-500">
FILL (250)
</div>
</div>
<div class="flex p-1 pl-4">
{{ userCard.expiration_month }}/ {{ userCard.expiration_year }}
<div class="col-span-12 py-3">
<div class="">
Gallons delivered:
</div>
<div class="col-span-12 text-gray-500">
{{ deliveryOrder.gallons_delivered }}
</div>
</div>
<div class="col-span-12 py-3">
<div class="">
Gallons Ordered:
</div>
<div class="col-span-12 text-gray-500">
{{ deliveryOrder.gallons_ordered }}
</div>
</div>
<div class="col-span-12" v-if="deliveryOrder.prime == 1">
<div class="">
Prime Fee:
</div>
<div class="col-span-12 text-gray-500">
{{ pricing.price_prime }}
</div>
</div>
<div class="col-span-12 " v-if="deliveryOrder.same_day === 1">
<div>
Same Day
</div>
<div class="col-span-12 text-gray-500">
{{ pricing.price_same_day }}
</div>
</div>
<div class="col-span-12 " v-if="deliveryOrder.payment_type == 0">
<div class="col-span-12 ">
cash total:
</div>
<div class="col-span-12 text-gray-500">
${{ total_amount }}
</div>
</div>
<div class="col-span-12 py-5 " v-if="deliveryOrder.payment_type == 1">
<div class="flex">
<div class="rounded-md border-2 bg-accent">
<div class="flex p-2">
{{ userCard.type_of_card }}
</div>
<div class="flex p-1 pl-4">
{{ userCard.name_on_card }}
</div>
<div class="flex p-1 pl-4">
{{ userCard.card_number }}
</div>
<div class="flex p-1 pl-4">
{{ userCard.expiration_month }}/ {{ userCard.expiration_year }}
</div>
</div>
</div>
</div>
<div class="col-span-12 py-5 " v-if="deliveryOrder.payment_type == 2">
<div class="flex ">
<div class=" rounded-md border-2 bg-accent ">
<div class="flex p-1 pl-4">
{{ userCard.name_on_card }}
</div>
<div class="flex p-1 pl-4">
{{ userCard.card_number }}
</div>
<div class="flex p-1 pl-4">
{{ userCard.expiration_month }}/ {{ userCard.expiration_year }}
</div>
</div>
</div>
</div>
<div class="col-span-12 font-bold py-5 text-lg text-accent" v-if="deliveryOrder.payment_type == 1">
<div >
Pre Charge Credit Card Total
</div>
<div class="col-span-12 text-green-500">
${{ total_amount }}
</div>
</div>
<div class="col-span-12 font-bold py-5 text-lg text-accent" v-if="deliveryOrder.payment_type == 2">
<div >
Pre Charge Credit Card Total
</div>
<div class="col-span-12 text-green-500">
${{ total_amount }}
</div>
</div>
</div>
</div>
</div>
<form class="rounded-md " enctype="multipart/form-data" @submit.prevent="onSubmit">
<div class="grid grid-cols-12 p-5">
<div class="col-span-12 md:col-span-12 flex mt-5 mb-5">
<button class="btn btn-sm btn-accent">
Finalize Delivery
</button>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="col-span-6 mt-5">
<div class="col-span-12 font-bold">
<div class="grid grid-cols-12 mb-5 bg-neutral">
<div class="col-span-12 py-3">Price / Gallon: {{ deliveryOrder.customer_price }}</div>
<div class="col-span-12 py-3">
<div v-if="deliveryOrder.customer_asked_for_fill == 1"> Gallons Ordered: FILL (250)</div>
<div v-else> Gallons Ordered: {{ deliveryOrder.gallons_ordered }}</div>
</div>
<div class="col-span-12 py-3" v-if="deliveryOrder.prime == 1">
Prime Fee: {{ pricing.price_prime }}
</div>
<div class="col-span-12 py-3" v-if="deliveryOrder.same_day == 1">
Same Day: {{ pricing.price_same_day }}
</div>
<div class="col-span-12 font-bold py-5 text-lg" v-if="deliveryOrder.payment_type == 0">
<div class="">
CASH Total: ${{ total_amount }}
</div>
</div>
<div class="col-span-12 font-bold py-5 text-lg text-primary" v-if="deliveryOrder.payment_type == 1">
<div class="">
Pre Charge Credit Card Total: ${{ total_amount }}
</div>
</div>
<div class="col-span-12 font-bold py-5 text-lg text-primary" v-if="deliveryOrder.payment_type == 2">
<div class="">
Pre Charge Credit Card Total: ${{ total_amount }}
</div>
</div>
</div>
</div>
</div>
<form class="rounded-md bg-neutral" enctype="multipart/form-data" @submit.prevent="onSubmit">
<div class="grid grid-cols-12 p-5">
<div class="col-span-12 md:col-span-12 flex mt-5 mb-5">
<button class="btn">
Finalize Delivery
</button>
</div>
</div>
</form>
</div>
</div>
<Footer />
@@ -390,13 +481,14 @@ export default defineComponent({
$route() {
this.sumdelivery(this.$route.params.id);
this.getOilOrder(this.$route.params.id);
this.getOilPricing();
},
},
mounted() {
this.sumdelivery(this.$route.params.id);
this.getOilOrder(this.$route.params.id);
this.getOilPricing();
},
@@ -428,8 +520,11 @@ export default defineComponent({
if (response.data) {
this.deliveryOrder = response.data
this.getCustomer(this.deliveryOrder.customer_id)
if (this.deliveryOrder.payment_type == 1) {
if (this.deliveryOrder.payment_type === 1 ) {
this.getPaymentCard(this.deliveryOrder.payment_card_id);
}
if (this.deliveryOrder.payment_type === 2 ) {
this.getPaymentCard(this.deliveryOrder.payment_card_id);
}
if (response.data.prime == 1) {
@@ -488,7 +583,6 @@ export default defineComponent({
.then((response: any) => {
this.pricing = response.data;
})
.catch(() => {
notify({
@@ -506,10 +600,10 @@ export default defineComponent({
withCredentials: true,
})
.then((response: any) => {
if (response.data.ok){
if (response.data.ok) {
this.priceprime = response.data.priceprime;
this.pricesameday = response.data.pricesameday;
this.total_amount = response.data.total_amount;
this.pricesameday = response.data.pricesameday;
this.total_amount = response.data.total_amount;
}
@@ -547,7 +641,7 @@ export default defineComponent({
text: "Ticket is finalized",
type: "success",
});
this.$router.push({ name: "deliveryTicketsMissing" });
this.$router.push({ name: "DeliveryHome" });
}
if (response.data.error) {
notify({
@@ -555,7 +649,7 @@ export default defineComponent({
text: "Could not finalize ticket",
type: "error",
});
this.$router.push("deliveryTicketsMissing");
this.$router.push("DeliveryHome");
}
})
},

12
src/pages/delivery/view.vue
View File

@@ -161,7 +161,7 @@
<div class="col-span-12" v-if="deliveryOrder.payment_type == 1">
<div class="flex">
<div class="basis-1/3 p-2">
<div class="bg-neutral rounded-md border-2 ">
<div class="rounded-md border-2 bg-accent">
<div class="flex p-3">
{{ userCard.type_of_card }}
</div>
@@ -182,7 +182,7 @@
<div class="col-span-12" v-if="deliveryOrder.payment_type == 2">
<div class="flex">
<div class="basis-1/3 p-2">
<div class="bg-neutral rounded-md border-2 ">
<div class="bg-accent rounded-md border-2 ">
<div class="flex p-3">
{{ userCard.type_of_card }}
</div>
@@ -353,7 +353,7 @@ export default defineComponent({
},
mounted() {
this.getOilOrder(this.$route.params.id);
this.getOilOrderMoney(this.$route.params.id);
// this.getOilOrderMoney(this.$route.params.id);
},
methods: {
@@ -397,7 +397,6 @@ export default defineComponent({
});
},
getPaymentCard(card_id: any) {
let path = import.meta.env.VITE_BASE_URL + "/payment/card/" + card_id;
axios({
method: "get",
@@ -426,11 +425,14 @@ export default defineComponent({
if (this.deliveryOrder.payment_type == 1) {
this.getPaymentCard(this.deliveryOrder.payment_card_id);
}
if (this.deliveryOrder.payment_type == 2) {
this.getPaymentCard(this.deliveryOrder.payment_card_id);
}
}
})
},
getOilOrderMoney(delivery_id: any) {
let path = import.meta.env.VITE_BASE_URL + "/delivery/order/money/" + delivery_id;
let path = import.meta.env.VITE_MONEY_URL + "/delivery/order/money/" + delivery_id;
axios({
method: "get",
url: path,

4
src/pages/delivery/viewstatus/cancelled.vue
View File

@@ -39,7 +39,9 @@
<tbody>
<!-- row 1 -->
<tr v-for="oil in deliveries" :key="oil['id']"> <router-link :to="{ name: 'customerProfile', params: { id: oil['customer_id'] } }">
<td>{{ oil['customer_name'] }} </td>
<td>
<div class="hover:text-accent">{{ oil['customer_name'] }} </div>
</td>
</router-link>
<td>
<div v-if="oil['delivery_status'] == 0">Waiting</div>

4
src/pages/delivery/viewstatus/delivered.vue
View File

@@ -39,7 +39,9 @@
<!-- row 1 -->
<tr v-for="oil in deliveries" :key="oil['id']">
<router-link :to="{ name: 'customerProfile', params: { id: oil['customer_id'] } }">
<td>{{ oil['customer_name'] }} </td>
<td>
<div class="hover:text-accent">{{ oil['customer_name'] }} </div>
</td>
</router-link>
<td>
<div v-if="oil['delivery_status'] == 0">Waiting</div>

4
src/pages/delivery/viewstatus/finalized.vue
View File

@@ -41,7 +41,9 @@
<tr v-for="oil in deliveries" :key="oil['id']">
<td>{{ oil['id'] }} </td>
<router-link :to="{ name: 'customerProfile', params: { id: oil['customer_id'] } }">
<td>{{ oil['customer_name'] }} </td>
<td>
<div class="hover:text-accent">{{ oil['customer_name'] }} </div>
</td>
</router-link>
<td>
<div v-if="oil['delivery_status'] == 0">Waiting</div>

4
src/pages/delivery/viewstatus/issue.vue
View File

@@ -40,7 +40,9 @@
<tr v-for="oil in deliveries" :key="oil['id']">
<td>{{ oil['id'] }} </td>
<router-link :to="{ name: 'customerProfile', params: { id: oil['customer_id'] } }">
<td>{{ oil['customer_name'] }} </td>
<td>
<div class="hover:text-accent">{{ oil['customer_name'] }} </div>
</td>
</router-link>
<td>
<div v-if="oil['delivery_status'] == 0">Waiting</div>

15
src/pages/delivery/viewstatus/out_for_delivery.vue
View File

@@ -46,7 +46,9 @@
<td>{{ oil['id'] }} </td>
<router-link :to="{ name: 'customerProfile', params: { id: oil['customer_id'] } }">
<td>{{ oil['customer_name'] }} </td>
<td>
<div class="hover:text-accent">{{ oil['customer_name'] }} </div>
</td>
</router-link>
<td>
<div v-if="oil['delivery_status'] == 0">Waiting</div>
@@ -86,12 +88,13 @@
<router-link :to="{ name: 'deliveryEdit', params: { id: oil['id'] } }">
<button class="btn btn-accent btn-sm">Edit</button>
</router-link>
<button @click.prevent="deleteCall(oil['id'])" class="btn btn-accent btn-sm">
Delete
</button>
<button @click.prevent="printTicket(oil['id'])" class="btn btn-accent btn-sm">
Print
</button>
<button @click.prevent="deleteCall(oil['id'])" class="btn btn-error btn-sm">
Delete
</button>
</td>
</tr>
</tbody>
@@ -227,7 +230,7 @@ export default defineComponent({
printtTicketAll() {
let path = import.meta.env.VITE_PRINT_URL + '/command/printticket/print_today';
axios({
method: 'delete',
method: 'get',
url: path,
headers: authHeader(),
}).then((response: any) => {
@@ -250,7 +253,7 @@ export default defineComponent({
printTicket(delivery_id: number) {
let path = import.meta.env.VITE_PRINT_URL + '/command/printticket/' + delivery_id;
axios({
method: 'delete',
method: 'options',
url: path,
headers: authHeader(),
}).then((response: any) => {

11
src/pages/delivery/viewstatus/tommorrow.vue
View File

@@ -46,7 +46,9 @@
<td>{{ oil['id'] }} </td>
<router-link :to="{ name: 'customerProfile', params: { id: oil['customer_id'] } }">
<td>{{ oil['customer_name'] }} </td>
<td>
<div class="hover:text-accent">{{ oil['customer_name'] }} </div>
</td>
</router-link>
<td>
<div v-if="oil['delivery_status'] == 0">Waiting</div>
@@ -86,12 +88,13 @@
<router-link :to="{ name: 'deliveryEdit', params: { id: oil['id'] } }">
<button class="btn btn-accent btn-sm">Edit</button>
</router-link>
<button @click.prevent="deleteCall(oil['id'])" class="btn btn-accent btn-sm">
Delete
</button>
<button @click.prevent="printTicket(oil['id'])" class="btn btn-accent btn-sm">
Print
</button>
<button @click.prevent="deleteCall(oil['id'])" class="btn btn-error btn-sm">
Delete
</button>
</td>
</tr>
</tbody>

7
src/pages/delivery/viewstatus/waiting.vue
View File

@@ -44,7 +44,9 @@
<tr v-for="oil in deliveries" :key="oil['id']">
<td>{{ oil['id'] }} </td>
<router-link :to="{ name: 'customerProfile', params: { id: oil['customer_id'] } }">
<td>{{ oil['customer_name'] }} </td>
<td>
<div class="hover:text-accent">{{ oil['customer_name'] }} </div>
</td>
</router-link>
<td>
<div v-if="oil['delivery_status'] == 0">Waiting</div>
@@ -84,8 +86,9 @@
<router-link :to="{ name: 'deliveryEdit', params: { id: oil['id'] } }">
<button class="btn btn-accent btn-sm">Edit</button>
</router-link>
<button @click.prevent="deleteCall(oil['id'])" class="btn btn-accent btn-sm">Delete</button>
<button @click.prevent="printTicket(oil['id'])" class="btn btn-accent btn-sm">Print</button>
<button @click.prevent="deleteCall(oil['id'])" class="btn btn-error btn-sm">Delete</button>
</td>
</tr>
</tbody>

2
src/pages/employee/edit.vue
View File

@@ -158,7 +158,7 @@
</div>
<div class="col-span-12 md:col-span-12 flex mt-5 mb-5">
<button class="btn">
<button class="btn btn-sm btn-accent">
Edit Employee
</button>
</div>

2
src/pages/employee/profile/home.vue
View File

@@ -29,7 +29,7 @@
<div class="col-span-9">
<div class="grid grid-cols-12">
<div class="col-span-12 font-bold flex justify-end">
<div class="btn">
<div class="btn btn-sm btn-accent">
<router-link :to="{ name: 'employeeEdit', params: { id: employee.id } }">
Edit Employee
</router-link>

171
src/pages/pay/cancel.vue
View File

@@ -1,171 +0,0 @@
<template>
<Header />
<div class="flex">
<div class="">
<SideBar />
</div>
<div class=" w-full px-10">
<div class="text-sm breadcrumbs">
<ul>
<li>
<router-link :to="{ name: 'home' }">
Home
</router-link>
</li>
<li>
<router-link :to="{ name: 'deliveryEdit', params: { id: oil['id'] } }">
Edit Delivery
</router-link>
</li>
</ul>
</div>
<div class="grid grid-cols-1 rounded-md p-6 ">
<div class="text-[24px]">Create Oil Delivery {{ customer_id }}
</div>
<form class="rounded-md px-8 pt-6 pb-8 mb-4 w-full" enctype="multipart/form-data" @submit.prevent="checkoutOil">
<div class="col-span-12 md:col-span-4 mb-5 md:mb-0 gap-10">
<label class="block text-white text-sm font-bold cursor-pointer label">Order </label>
<div class=""></div>
<div class=""></div>
<div class=""></div>
</div>
<div class="col-span-12 md:col-span-12 flex mt-5 mb-5">
<button class="btn">
Create Oil Order
</button>
</div>
</form>
</div>
</div>
</div>
<Footer />
</template>
<script lang="ts">
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";
export default defineComponent({
name: 'PayCancel',
components: {
Header,
SideBar,
Footer,
},
data() {
return {
v$: useValidate(),
user: null,
customer: null,
customer_id: null,
stripe: null,
}
},
validations() {
return {
CreateOilOrderForm: {
basicInfo: {
gallons_ordered: {required, minLength: minLength(1)},
expected_delivery_date: {required},
},
},
};
},
created() {
this.userStatus()
},
watch: {
$route() {
this.getCustomer(this.$route.params.id);
},
},
mounted() {
this.getCustomer(this.$route.params.id)
this.getStripePublishableKey();
},
methods: {
userStatus() {
let path = import.meta.env.VITE_BASE_URL + '/auth/whoami';
axios({
method: 'get',
url: path,
withCredentials: true,
headers: authHeader(),
})
.then((response: any) => {
if (response.data.ok) {
this.user = response.data.user;
}
})
.catch(() => {
this.user = null
})
},
getCustomer(user_id: any) {
let path = import.meta.env.VITE_BASE_URL + "/customer/" + user_id;
axios({
method: "get",
url: path,
withCredentials: true,
})
.then((response: any) => {
this.customer = response.data;
this.customer_id = response.datauser_id
})
.catch(() => {
notify({
title: "Error",
text: "Could not find customer",
type: "error",
});
});
},
checkoutOil() {
// Get Checkout Session ID
fetch('http://localhost:5001/create-checkout-session', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ book_id: book.id }),
})
.then((result) => result.json())
.then((data) => {
// Redirect to Stripe Checkout
return this.stripe.redirectToCheckout({ sessionId: data.sessionId });
})
.then((res) => {
console.log(res);
});
},
getStripePublishableKey() {
fetch('http://localhost:5001/config')
.then((result) => result.json())
.then((data) => {
// Initialize Stripe.js
this.stripe = Stripe(data.publicKey);
});
},
},
})
</script>
<style scoped></style>

375
src/pages/pay/pay_oil.vue
View File

@@ -17,171 +17,204 @@
</ul>
</div>
<div class="grid grid-cols-1 rounded-md p-6 mb-5" v-if="loaded">
<div class=" col-span-12 text-[24px]">
<div class="grid grid-cols-1 rounded-md p-6 mb-5">
<div class=" col-span-12 text-2xl">
Confirm Payment Oil Delivery {{ delivery.id }}
</div>
<div class="grid grid-cols-12 bg-neutral mb-5">
<div class="col-span-12 font-bold flex pb-5 text-lg">
{{ customer.account_number }}
</div>
<div class="col-span-12 font-bold flex">
{{ customer.customer_first_name }}
{{ customer.customer_last_name }}
</div>
<div class="col-span-12 font-bold flex">
{{ customer.customer_address }}
<div v-if="customer.customer_apt != 'None'">
<div class="grid grid-cols-12 mb-5 gap-5">
<div class="col-span-12 xl:col-span-6 ">
<div class="col-span-12 font-bold flex pb-5 text-lg">
{{ customer.account_number }}
</div>
<div class="col-span-12 font-bold flex">
{{ customer.customer_first_name }}
{{ customer.customer_last_name }}
</div>
<div class="col-span-12 font-bold flex">
{{ customer.customer_address }}
<div v-if="customer.customer_apt != 'None'">
{{ customer.customer_apt }}
</div>
</div>
<div class="col-span-12 font-bold flex">
<div class="pr-2">
{{ customer.customer_town }},
</div>
<div class="pr-2">
<div v-if="customer.customer_state == 0">Massachusetts</div>
<div v-else-if="customer.customer_state == 1">Rhode Island</div>
<div v-else-if="customer.customer_state == 2">New Hampshire</div>
<div v-else-if="customer.customer_state == 3">Maine</div>
<div v-else-if="customer.customer_state == 4">Vermont</div>
<div v-else-if="customer.customer_state == 5">Maine</div>
<div v-else-if="customer.customer_state == 6">New York</div>
<div v-else>Unknown state</div>
</div>
<div class="pr-2">
{{ customer.customer_zip }}
</div>
</div>
<div class="col-span-12 font-bold flex" v-if="customer.customer_apt !== 'None'">
{{ customer.customer_apt }}
</div>
</div>
<div class="col-span-12 font-bold flex">
<div class="pr-2">
{{ customer.customer_town }},
<div class="col-span-12 font-bold flex">
<div v-if="customer.customer_home_type == 0">Residential</div>
<div v-else-if="customer.customer_home_type == 1">apartment</div>
<div v-else-if="customer.customer_home_type == 2">condo</div>
<div v-else-if="customer.customer_home_type == 3">commercial</div>
<div v-else-if="customer.customer_home_type == 4">business</div>
<div v-else-if="customer.customer_home_type == 5">construction</div>
<div v-else-if="customer.customer_home_type == 6">container</div>
</div>
<div class="pr-2">
<div v-if="customer.customer_state == 0">Massachusetts</div>
<div v-else-if="customer.customer_state == 1">Rhode Island</div>
<div v-else-if="customer.customer_state == 2">New Hampshire</div>
<div v-else-if="customer.customer_state == 3">Maine</div>
<div v-else-if="customer.customer_state == 4">Vermont</div>
<div v-else-if="customer.customer_state == 5">Maine</div>
<div v-else-if="customer.customer_state == 6">New York</div>
<div v-else>Unknown state</div>
</div>
<div class="pr-2">
{{ customer.customer_zip }}
</div>
</div>
<div class="col-span-12 font-bold flex" v-if="customer.customer_apt !== 'None'">
{{ customer.customer_apt }}
</div>
<div class="col-span-12 font-bold flex">
<div v-if="customer.customer_home_type == 0">Residential</div>
<div v-else-if="customer.customer_home_type == 1">apartment</div>
<div v-else-if="customer.customer_home_type == 2">condo</div>
<div v-else-if="customer.customer_home_type == 3">commercial</div>
<div v-else-if="customer.customer_home_type == 4">business</div>
<div v-else-if="customer.customer_home_type == 5">construction</div>
<div v-else-if="customer.customer_home_type == 6">container</div>
</div>
<div class="col-span-12 font-bold flex">
{{ customer.customer_phone_number }}
</div>
</div>
<div class="col-span-12 ">
<div class="grid grid-cols-12 mb-5 bg-neutral">
<div class="col-span-12 py-3">
<div v-if="delivery.delivery_status == 0"> Delivery Status: Waiting</div>
<div v-else-if="delivery.delivery_status == 1">Delivery Status: delivered</div>
<div v-else-if="delivery.delivery_status == 2">Delivery Status: Out for Delivery</div>
<div v-else-if="delivery.delivery_status == 3">Delivery Status: Cancelled</div>
<div v-else-if="delivery.delivery_status == 4">Delivery Status: Partial Delivery</div>
<div v-else-if="delivery.delivery_status == 5">Delivery Status: Issue</div>
<div v-else></div>
<div class="col-span-12 font-bold flex">
{{ customer.customer_phone_number }}
</div>
<div class="col-span-12 py-3">Expected Delivery: {{ delivery.expected_delivery_date }}</div>
<div class="col-span-12 ">
<div class="grid grid-cols-12 mb-5">
<div class="col-span-12 pt-10 font-bold">Delivery Status</div>
<div class="col-span-12 text-gray-500">
<div v-if="delivery.delivery_status == 0"> Waiting</div>
<div v-else-if="delivery.delivery_status == 1"> delivered</div>
<div v-else-if="delivery.delivery_status == 2"> Out for Delivery</div>
<div v-else-if="delivery.delivery_status == 3">Cancelled</div>
<div v-else-if="delivery.delivery_status == 4"> Partial Delivery</div>
<div v-else-if="delivery.delivery_status == 5">Issue</div>
<div v-else></div>
</div>
<div class="col-span-12 pt-3 font-bold">
Expected Delivery:
</div>
<div class="col-span-12 text-gray-500">
{{ delivery.expected_delivery_date }}
</div>
</div>
</div>
</div>
<div class="grid grid-cols-12 mb-5 bg-neutral">
<div v-for="card in credit_cards" class="col-span-12">
<div class="flex flex-row ">
<div v-if="card.main_card" class="basis-1/3 p-2">
<div class="bg-accent rounded-md border-2 ">
<div class="flex p-3">
{{ card.type_of_card }}
</div>
<div class="flex p-1 pl-4">
{{ card.name_on_card }}
</div>
<div class="flex p-1 pl-4">
{{ card.card_number }}
</div>
<div class="flex p-1 pl-4">
{{ card.expiration_month }}/ {{ card.expiration_year }}
</div>
<div class="flex p-1 pl-4">
{{ card.security_number }}
<div class="col-span-12 xl:col-span-6">
<div class="grid grid-cols-12 mb-5 ">
<div v-for="card in credit_cards" class="col-span-12">
<div class="col-span-12 ">
<div v-if="card.main_card" class="basis-1/3 p-2">
<div class="bg-secondary rounded-md border-2 ">
<div class="flex p-3">
{{ card.type_of_card }}
</div>
<div class="flex p-1 pl-4">
{{ card.name_on_card }}
</div>
<div class="flex p-1 pl-4">
{{ card.card_number }}
</div>
<div class="flex p-1 pl-4">
{{ card.expiration_month }}/ {{ card.expiration_year }}
</div>
<div class="flex p-1 pl-4">
{{ card.security_number }}
</div>
</div>
</div>
</div>
<div v-else class="basis-1/3 p-2">
<div class="bg-neutral rounded-md border-2 ">
<div class="flex p-3">
{{ card.type_of_card }}
</div>
<div class="flex p-1 pl-4">
{{ card.name_on_card }}
</div>
<div class="flex p-1 pl-4">
{{ card.card_number }}
</div>
<div class="flex p-1 pl-4">
{{ card.expiration_month }}/ {{ card.expiration_year }}
</div>
<div class="flex p-1 pl-4">
{{ card.security_number }}
<div v-else class="basis-1/3 p-2">
<div class=" rounded-md border-2 ">
<div class="flex p-3">
{{ card.type_of_card }}
</div>
<div class="flex p-1 pl-4">
{{ card.name_on_card }}
</div>
<div class="flex p-1 pl-4">
{{ card.card_number }}
</div>
<div class="flex p-1 pl-4">
{{ card.expiration_month }}/ {{ card.expiration_year }}
</div>
<div class="flex p-1 pl-4">
{{ card.security_number }}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="grid grid-cols-12 mb-5 bg-neutral">
<div class="col-span-12 py-3">Price / Gallon: {{ delivery.customer_price }}</div>
<div class="col-span-12 py-3">
<div v-if="delivery.customer_asked_for_fill == 1"> Gallons Ordered: FILL (250)</div>
<div v-else> Gallons Ordered: {{ delivery.gallons_ordered }}</div>
</div>
<div class="col-span-12 py-3" v-if="delivery.prime == 1">
Prime Fee: {{ pricing.price_prime }}
</div>
<div class="col-span-12 py-3" v-if="delivery.same_day == 1">
Same Day: {{ pricing.price_same_day }}
</div>
<div class="col-span-12 font-bold py-5 text-lg" v-if="delivery.payment_type == 0">
<div class="">
CASH Total: ${{ total_amount }}
<div class="grid grid-cols-12 mb-5">
<div class="col-span-12 pt-3 font-bold">
Price / Gallon:
</div>
<div class="col-span-12 text-gray-500">
{{ delivery.customer_price }}
</div>
<div class="col-span-12 pt-3 font-bold">
Gallons Ordered:
</div>
<div class="col-span-12 text-gray-500">
<div v-if="delivery.customer_asked_for_fill == 1"> FILL (250)</div>
<div v-else> Gallons Ordered: {{ delivery.gallons_ordered }}</div>
</div>
<div class="col-span-12 py-3" v-if="delivery.prime == 1">
Prime Fee: {{ pricing.price_prime }}
</div>
<div class="col-span-12 py-3" v-if="delivery.same_day == 1">
Same Day: {{ pricing.price_same_day }}
</div>
<div class="col-span-12 font-bold py-5 " v-if="delivery.payment_type == 0">
<div class="">
CASH Total: ${{ total_amount }}
</div>
</div>
<div class="col-span-12 font-bold py-5 text-accent" v-if="delivery.payment_type == 1">
<div class="">
Pre Charge Credit Card Total: ${{ total_amount }}
</div>
</div>
<div class="col-span-12 font-bold py-5 text-accent" v-if="delivery.payment_type == 2">
<div class="">
Pre Charge Credit Card Total: ${{ total_amount }}
</div>
</div>
<div class="col-span-12 font-bold py-5 text-accent" v-if="delivery.payment_type == 3">
<div class="">
Pre Charge Credit Card Total: ${{ total_amount }}
</div>
</div>
</div>
<div class="col-span-12 font-bold py-5 text-lg text-primary" v-if="delivery.payment_type == 1">
<div class="">
Pre Charge Credit Card Total: ${{ total_amount }}
<div class="flex justify-between">
<!-- <button class="btn" @click="checkoutOilCreditStripe()">-->
<!-- Pay Credit Card (Stripe)-->
<!-- </button>-->
<div class="" v-if="delivery.payment_type == 0">
<button class="btn btn-accent btn-sm" @click="checkoutOilUpdatePayment(0)">
Confirm Cash Payment
</button>
</div>
<div class="" v-if="delivery.payment_type == 1">
<button class="btn btn-accent btn-sm" @click="checkoutOilUpdatePayment(1)">
Pay Credit Terminal
</button>
</div>
<div class="" v-if="delivery.payment_type == 2">
<button class="btn btn-accent btn-sm" @click="checkoutOilUpdatePayment(2)">
Cash + Pay Credit Terminal
</button>
</div>
<div class="" v-if="delivery.payment_type == 3">
<button class="btn btn-accent btn-sm" @click="checkoutOilUpdatePayment(3)">
Error
</button>
</div>
</div>
<div class="col-span-12 font-bold py-5 text-lg text-primary" v-if="delivery.payment_type == 2">
<div class="">
Pre Charge Credit Card Total: ${{ total_amount }}
</div>
</div>
</div>
</div>
<div class="flex justify-between">
<!-- <button class="btn" @click="checkoutOilCreditStripe()">-->
<!-- Pay Credit Card (Stripe)-->
<!-- </button>-->
<div class="" v-if="delivery.payment_type == 0">
<button class="btn btn-primary" @click="checkoutOilUpdatePayment(0)">
Cash Payment
</button>
</div>
<div class="" v-if="delivery.payment_type == 1">
<button class="btn btn-accent" @click="checkoutOilUpdatePayment(1)">
Pay Credit Terminal
</button>
</div>
<div class="" v-if="delivery.payment_type == 2">
Cash +
<button class="btn btn-accent" @click="checkoutOilUpdatePayment(3)">
Pay Credit Terminal
</button>
</div>
</div>
</div>
@@ -291,7 +324,8 @@ export default defineComponent({
},
priceprime: 0,
pricesameday: 0,
total_amount: 0
total_amount: 0,
total_precharge_amount: 0
}
},
validations() {
@@ -315,24 +349,36 @@ export default defineComponent({
},
mounted() {
this.getOilOrder(this.$route.params.id)
this.sumdelivery(this.$route.params.id);
this.getOilPricing()
// this.getStripePublishableKey();
},
methods: {
sumdelivery() {
if (this.delivery.same_day == 1)
this.pricesameday = this.pricing.price_same_day
else { this.pricesameday = 0 };
sumdelivery(delivery_id: any) {
let path = import.meta.env.VITE_BASE_URL + "/delivery/total/" + delivery_id;
axios({
method: "get",
url: path,
withCredentials: true,
})
.then((response: any) => {
if (response.data.ok) {
this.priceprime = response.data.priceprime;
this.pricesameday = response.data.pricesameday;
this.total_amount = response.data.total_amount;
if (this.delivery.prime == 1)
this.priceprime = this.pricing.price_prime
else { this.priceprime = 0 };
this.total_amount = Number(this.delivery.total_price) + Number(this.priceprime) + Number(this.pricesameday)
}
this.loaded = true
})
.catch(() => {
notify({
title: "Error",
text: "Could not get oil pricing",
type: "error",
});
});
},
@@ -361,8 +407,8 @@ export default defineComponent({
})
.then((response: any) => {
this.pricing = response.data;
this.sumdelivery();
})
.catch(() => {
@@ -448,6 +494,13 @@ export default defineComponent({
})
.then((response: any) => {
if (response.data.ok) {
if (payment_type == 0) {
notify({
title: "Success",
text: "marked payment as cash (COD)",
type: "success",
});
}
if (payment_type == 1) {
notify({
title: "Success",
@@ -455,7 +508,15 @@ export default defineComponent({
type: "success",
});
}
if (payment_type == 0) {
if (payment_type == 2) {
notify({
title: "Success",
text: "marked payment as cash (COD)",
type: "success",
});
}
if (payment_type == 3) {
notify({
title: "Success",
text: "marked payment as cash (COD)",

465
src/pages/pay/pay_service.vue
View File

@@ -1,465 +0,0 @@
<template>
<Header/>
<div class="flex">
<div class="">
<SideBar/>
</div>
<div class=" w-full px-10">
<div class="text-sm breadcrumbs">
<ul>
<li>
<router-link :to="{ name: 'home' }">
Home
</router-link>
</li>
<li>
</li>
</ul>
</div>
<div class="grid grid-cols-1 rounded-md p-6 mb-5">
<div class=" col-span-12 text-[24px]">
Confirm Payment Service Call {{ service_id }}
</div>
<div class="grid grid-cols-12 bg-neutral mb-5">
<div class="col-span-12 font-bold flex pb-5 text-lg">{{ customer.account_number }}</div>
<div class="col-span-12 font-bold flex">
{{ customer.customer_first_name }}
{{ customer.customer_last_name }}
</div>
<div class="col-span-12 font-bold flex">
{{ customer.customer_address }}
<div v-if="customer.customer_apt != 'None'">
{{ customer.customer_apt }}
</div>
</div>
<div class="col-span-12 font-bold flex">
<div class="pr-2">
{{ customer.customer_town }},
</div>
<div class="pr-2">
<div v-if="customer.customer_state == 0">Massachusetts</div>
<div v-else-if="customer.customer_state == 1">Rhode Island</div>
<div v-else-if="customer.customer_state == 2">New Hampshire</div>
<div v-else-if="customer.customer_state == 3">Maine</div>
<div v-else-if="customer.customer_state == 4">Vermont</div>
<div v-else-if="customer.customer_state == 5">Maine</div>
<div v-else-if="customer.customer_state == 6">New York</div>
<div v-else>Unknown state</div>
</div>
<div class="pr-2">
{{ customer.customer_zip }}
</div>
</div>
<div class="col-span-12 font-bold flex" v-if="customer.customer_apt !== 'None'">
{{ customer.customer_apt }}
</div>
<div class="col-span-12 font-bold flex">
<div v-if="customer.customer_home_type == 0">Residential</div>
<div v-else-if="customer.customer_home_type == 1">apartment</div>
<div v-else-if="customer.customer_home_type == 2">condo</div>
<div v-else-if="customer.customer_home_type == 3">commercial</div>
<div v-else-if="customer.customer_home_type == 4">business</div>
<div v-else-if="customer.customer_home_type == 5">construction</div>
<div v-else-if="customer.customer_home_type == 6">container</div>
</div>
<div class="col-span-12 font-bold flex">
{{ customer.customer_phone_number }}
</div>
</div>
<div class="col-span-12 ">
<div class="grid grid-cols-12 mb-5 bg-neutral">
<div class="col-span-12 py-3">
<div v-if="service.service_type == '0'">Service Type: General</div>
<div v-else-if="service.service_type == '1'">Service Type: Cleaning / Tuneup</div>
<div v-else-if="service.service_type == '2'">Service Type: No Heat</div>
<div v-else-if="service.service_type == '3'">Service Type: Install</div>
<div v-else-if="service.service_type == '4'">Service Type: Call Back</div>
<div v-else-if="service.service_type == '5'">Service Type: Quote</div>
<div v-else-if="service.service_type == '6'">Service Type: Emergency</div>
<div v-else></div>
</div>
<div class="col-span-12 py-3">Tech: {{ service.tech_first_name }} {{ service.tech_last_name }}</div>
<div class="col-span-12 py-3">Expected Service Date: {{ service.scheduled_date }}</div>
</div>
<div class="grid grid-cols-12 mb-5 bg-neutral">
<div v-for="card in credit_cards" class="col-span-12">
<div class="flex flex-row ">
<div v-if="card.main_card" class="basis-1/3 p-2">
<div class="bg-accent rounded-md border-2 ">
<div class="flex p-3">
{{ card.type_of_card }}
</div>
<div class="flex p-1 pl-4">
{{ card.name_on_card }}
</div>
<div class="flex p-1 pl-4">
{{ card.card_number }}
</div>
<div class="flex p-1 pl-4">
{{ card.expiration_month }}/ {{ card.expiration_year }}
</div>
<div class="flex p-1 pl-4">
{{ card.security_number }}
</div>
</div>
</div>
<div v-else class="basis-1/3 p-2">
<div class="bg-neutral rounded-md border-2 ">
<div class="flex p-3">
{{ card.type_of_card }}
</div>
<div class="flex p-1 pl-4">
{{ card.name_on_card }}
</div>
<div class="flex p-1 pl-4">
{{ card.card_number }}
</div>
<div class="flex p-1 pl-4">
{{ card.expiration_month }}/ {{ card.expiration_year }}
</div>
<div class="flex p-1 pl-4">
{{ card.security_number }}
</div>
</div>
</div>
</div>
</div>
</div>
<div class="grid grid-cols-12 mb-5 bg-neutral">
<div class="col-span-12 py-3">Price / hour: {{ service_prices.price_service_hour }}</div>
<div class="col-span-12 py-3" v-if="service.payment_type == 0">Pay Method: Cash (COD)</div>
<div class="col-span-12 py-3" v-if="service.payment_type == 1">Pay Method: Credit Card</div>
<div class="col-span-12 py-3" v-if="service.payment_type == 2">Pay Method: Stripe</div>
<div class="col-span-12 py-3" v-if="service.payment_type == 2">Pay Method: Cash/Credit Mix</div>
<div class="col-span-12 font-bold py-5 text-lg">Pre-Charge: 300$</div>
</div>
</div>
<div class="flex justify-between">
<!-- <button class="btn" @click="checkoutServiceCreditStripe()">-->
<!-- Pay Credit Card (Stripe)-->
<!-- </button>-->
<button class="btn" @click="checkoutServiceUpdatePayment(0)">
Cash Payment
</button>
<button class="btn" @click="checkoutServiceUpdatePayment(1)">
Pay Credit Terminal
</button>
</div>
</div>
</div>
</div>
<Footer/>
</template>
<script lang="ts">
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";
export default defineComponent({
name: 'PayOil',
components: {
Header,
SideBar,
Footer,
},
data() {
return {
v$: useValidate(),
user: {
user_id: 0,
},
service_id: null,
service: {
id: 0,
customer_id: 0,
customer_last_name: '',
customer_first_name: '',
customer_town: '',
customer_state: '',
customer_zip: '',
customer_apt: '',
customer_address: '',
status: 0,
service_type: '',
when_called: '',
scheduled_date: '',
scheduled_time: '',
when_serviced: '',
completed: 0,
tech_id: 0,
tech_first_name: '',
tech_last_name: '',
payment_type: 0,
payment_card_id: 0,
},
service_notes: {
service_call_id: 0,
dispatcher_notes: '',
dispatcher_subject: '',
time_added: '',
dispatcher_id: 0,
dispatcher_name: '',
},
service_prices: {
id: 0,
price_service_hour: 0,
price_emergency_service_hour: 0,
price_emergency_call: 0,
price_out_of_oil: 0,
price_prime: 0,
price_same_day: 0,
price_cleaning: 0,
date: '',
},
credit_cards: [
{
id: 0,
name_on_card: '',
main_card: false,
card_number: '',
expiration_month: '',
type_of_card: '',
last_four_digits: '',
expiration_year: '',
security_number: 0,
}
],
stripe: null,
customer: {
id: 0,
user_id: 0,
customer_first_name: '',
customer_last_name: '',
customer_town: '',
customer_address: '',
customer_state: 0,
customer_zip: '',
customer_apt: '',
customer_home_type: 0,
customer_phone_number: '',
account_number: '',
},
}
},
validations() {
return {
CreateOilOrderForm: {
basicInfo: {
gallons_ordered: {required, minLength: minLength(1)},
expected_delivery_date: {required},
},
},
};
},
created() {
this.userStatus();
this.getServiceOrder(this.$route.params.id);
},
watch: {
$route() {
},
},
mounted() {
// this.getStripePublishableKey();
},
methods: {
userStatus() {
let path = import.meta.env.VITE_BASE_URL + '/auth/whoami';
axios({
method: 'get',
url: path,
withCredentials: true,
headers: authHeader(),
})
.then((response: any) => {
if (response.data.ok) {
this.user = response.data.user;
}
})
},
getServiceOrder(service_id: any) {
let path = import.meta.env.VITE_BASE_URL + "/service/" + service_id;
axios({
method: "get",
url: path,
withCredentials: true,
headers: authHeader(),
})
.then((response: any) => {
this.service = response.data;
this.getCustomer(this.service.customer_id)
this.getCreditCards(this.service.customer_id)
})
.catch(() => {
notify({
title: "Error",
text: "Could not get service order",
type: "error",
});
});
},
getServiceOrderNotes(service_id: any) {
let path = import.meta.env.VITE_BASE_URL + "/service/call/notes" + service_id;
axios({
method: "get",
url: path,
withCredentials: true,
})
.then((response: any) => {
this.service = response.data;
})
.catch(() => {
notify({
title: "Error",
text: "Could not get service order",
type: "error",
});
});
},
getCreditCards(user_id: any) {
let path = import.meta.env.VITE_BASE_URL + '/payment/cards/' + user_id;
axios({
method: 'get',
url: path,
headers: authHeader(),
}).then((response: any) => {
this.credit_cards = response.data
})
},
getCustomer(userid: any) {
let path = import.meta.env.VITE_BASE_URL + '/customer/' + userid;
axios({
method: 'get',
url: path,
headers: authHeader(),
}).then((response: any) => {
this.customer = response.data
})
},
checkoutServiceUpdateCreditStripe() {
let path = import.meta.env.VITE_BASE_URL + "/service/cash/" + this.service.id + '/2';
axios({
method: "PUT",
url: path,
})
.then((response: any) => {
if (response.data.ok) {
notify({
title: "Success",
text: "marked payment as STRIPE credit card",
type: "success",
});
}
})
.catch(() => {
notify({
title: "Error",
text: "Could not update with credit card Stripe",
type: "error",
});
});
},
checkoutServiceUpdatePayment(payment_type: number) {
let path = import.meta.env.VITE_BASE_URL + "/service/paymenttype/" + this.service.id + '/' + payment_type;
axios({
method: "PUT",
url: path,
})
.then((response: any) => {
if (response.data.ok) {
if (payment_type == 1) {
notify({
title: "Success",
text: "marked payment as credit (bank terminal)",
type: "success",
});
}
if (payment_type == 0) {
notify({
title: "Success",
text: "marked payment as cash (COD)",
type: "success",
});
}
this.$router.push({name: "customerProfile", params: {id: this.customer.id}});
}
})
.catch(() => {
notify({
title: "Error",
text: "Could not update wth cash",
type: "error",
});
});
},
// checkoutServiceCreditStripe() {
//
// let path = import.meta.env.VITE_PAY_URL + "/pay/charge";
// axios({
// method: "get",
// url: path,
// })
// .then((response: any) => {
// this.checkoutServiceUpdateCreditStripe();
// // Redirect to Stripe Checkout
// return this.stripe.redirectToCheckout({sessionId: response.data.sessionId});
// })
// .catch(() => {
// notify({
// title: "Error",
// text: "Could not find customer",
// type: "error",
// });
// });
// },
//
// getStripePublishableKey() {
// let path = import.meta.env.VITE_PAY_URL + "/pay/config";
// axios({
// method: "get",
// url: path,
// })
// .then((response: any) => {
// this.stripe = Stripe(response.data.publicKey);
// })
//
// },
},
})
</script>
<style scoped></style>

23
src/pages/pay/routes.ts
View File

@@ -1,32 +1,19 @@
import PayOil from '../pay/pay_oil.vue';
import PayService from "../pay/pay_service.vue";
import PaySuccess from "../pay/success.vue";
import PayCancel from "../pay/cancel.vue";
const payRoutes = [
{
path: '/pay/service/:id',
name: 'payService',
component: PayService,
},
{
path: '/pay/oil/:id',
name: 'payOil',
component: PayOil,
},
{
path: '/pay/success',
name: 'paySuccess',
component: PaySuccess,
},
{
path: '/pay/cancel',
name: 'payCancel',
component: PayCancel,
},
]
export default payRoutes

176
src/pages/pay/success.vue
View File

@@ -1,176 +0,0 @@
<template>
<Header />
<div class="flex">
<div class="">
<SideBar />
</div>
<div class=" w-full px-10">
<div class="text-sm breadcrumbs">
<ul>
<li>
<router-link :to="{ name: 'home' }">
Home
</router-link>
</li>
<li>
<router-link :to="{ name: 'deliveryEdit', params: { id: oil['id'] } }">
Edit Delivery
</router-link>
</li>
</ul>
</div>
<div class="grid grid-cols-1 rounded-md p-6 ">
<div class="text-[24px]">Create Oil Delivery {{ customer_id }}
</div>
<form class="rounded-md px-8 pt-6 pb-8 mb-4 w-full" enctype="multipart/form-data" @submit.prevent="checkoutOil">
<div class="col-span-12 md:col-span-4 mb-5 md:mb-0 gap-10">
<label class="block text-white text-sm font-bold cursor-pointer label">Order </label>
<div class=""></div>
<div class=""></div>
<div class=""></div>
</div>
<div class="col-span-12 md:col-span-12 flex mt-5 mb-5">
<button class="btn">
Create Oil Order
</button>
</div>
</form>
</div>
</div>
</div>
<Footer />
</template>
<script lang="ts">
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";
export default defineComponent({
name: 'PaySuccess',
components: {
Header,
SideBar,
Footer,
},
data() {
return {
v$: useValidate(),
user: null,
customer: null,
customer_id: null,
stripe: null,
}
},
validations() {
return {
CreateOilOrderForm: {
basicInfo: {
gallons_ordered: {required, minLength: minLength(1)},
expected_delivery_date: {required},
},
},
};
},
created() {
this.userStatus()
},
watch: {
$route() {
this.getCustomer(this.$route.params.id);
},
},
mounted() {
this.getCustomer(this.$route.params.id)
this.getStripePublishableKey();
},
methods: {
userStatus() {
let path = import.meta.env.VITE_BASE_URL + '/auth/whoami';
axios({
method: 'get',
url: path,
withCredentials: true,
headers: authHeader(),
})
.then((response: any) => {
if (response.data.ok) {
this.user = response.data.user;
}
})
.catch(() => {
this.user = null
})
},
getCustomer(user_id: any) {
let path = import.meta.env.VITE_BASE_URL + "/customer/" + user_id;
axios({
method: "get",
url: path,
withCredentials: true,
})
.then((response: any) => {
this.customer = response.data;
this.customer_id = response.data.user_id;
})
.catch(() => {
notify({
title: "Error",
text: "Could not find customer",
type: "error",
});
});
},
checkoutOil() {
// Get Checkout Session ID
fetch('http://localhost:5001/create-checkout-session', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ book_id: book.id }),
})
.then((result) => result.json())
.then((data) => {
console.log(data);
// Redirect to Stripe Checkout
return this.stripe.redirectToCheckout({ sessionId: data.sessionId });
})
.then((res) => {
console.log(res);
});
},
getStripePublishableKey() {
fetch('http://localhost:5001/config')
.then((result) => result.json())
.then((data) => {
// Initialize Stripe.js
this.stripe = Stripe(data.publicKey);
});
},
},
})
</script>
<style scoped></style>