Updated auto finalize button
This commit is contained in:
@@ -14,6 +14,7 @@ import deliveryFinalized from './viewstatus/finalized.vue'
|
||||
import deliveryTommorrow from './viewstatus/tommorrow.vue'
|
||||
import finalizeTicket from './update_tickets/finalize_ticket.vue';
|
||||
import finalizeTicketAuto from './update_tickets/finalize_ticket_auto.vue';
|
||||
import finalizeTicketAutoNocc from './update_tickets/finalize_ticket_auto_nocc.vue';
|
||||
|
||||
const deliveryRoutes = [
|
||||
{
|
||||
@@ -92,6 +93,11 @@ const deliveryRoutes = [
|
||||
name: 'finalizeTicketAuto',
|
||||
component: finalizeTicketAuto,
|
||||
},
|
||||
{
|
||||
path: '/delivery/tickets/finalize/auto/nocc/:id',
|
||||
name: 'finalizeTicketAutoNocc',
|
||||
component: finalizeTicketAutoNocc,
|
||||
},
|
||||
|
||||
]
|
||||
|
||||
|
||||
@@ -369,7 +369,7 @@
|
||||
type: "error",
|
||||
});
|
||||
});
|
||||
},//TODO STUCK HERE !!!!!!!!!
|
||||
},
|
||||
getAutoTicket(delivery_id: any) {
|
||||
let path = import.meta.env.VITE_AUTO_URL + "/delivery/autoticket/" + delivery_id;
|
||||
axios({
|
||||
@@ -416,7 +416,6 @@
|
||||
});
|
||||
});
|
||||
},
|
||||
//TODO STUCK HERE !!!!!!!!!
|
||||
today_price_oil() {
|
||||
let path = import.meta.env.VITE_BASE_URL + '/info/price/oil'
|
||||
axios({
|
||||
|
||||
@@ -0,0 +1,569 @@
|
||||
<!-- src/pages/delivery/update_tickets/finalize_ticket_auto.vue -->
|
||||
<template>
|
||||
<div class="flex">
|
||||
|
||||
<!-- Main container with responsive horizontal padding -->
|
||||
<div class="w-full px-4 md:px-6 py-4">
|
||||
<div class="text-sm breadcrumbs">
|
||||
<ul>
|
||||
<li><router-link :to="{ name: 'home' }">Home</router-link></li>
|
||||
<li><router-link :to="{ name: 'customer' }">Customers</router-link></li>
|
||||
<li v-if="customer && customer.id">
|
||||
<router-link :to="{ name: 'customerProfile', params: { id: customer.id } }">
|
||||
{{ customer.customer_first_name }} {{ customer.customer_last_name }}
|
||||
</router-link>
|
||||
</li>
|
||||
<li>Finalize Auto Ticket</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Page Header -->
|
||||
<div class="flex flex-wrap justify-between items-center gap-2 mt-4">
|
||||
<h1 class="text-3xl font-bold">
|
||||
Auto Delivery #{{ autoDelivery.id }}
|
||||
</h1>
|
||||
<router-link v-if="customer.id > 0" :to="{ name: 'customerProfile', params: { id: customer.id } }">
|
||||
<button class="btn btn-sm btn-secondary">Customer Profile</button>
|
||||
</router-link>
|
||||
</div>
|
||||
|
||||
<!-- NEW LAYOUT: A single 2-column grid for the whole page -->
|
||||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4 mt-4">
|
||||
|
||||
<!-- LEFT COLUMN: All Display Information -->
|
||||
<div class="space-y-4">
|
||||
|
||||
<!-- Customer Info Card -->
|
||||
<div class="bg-neutral rounded-lg p-5">
|
||||
<div class="text-xl font-bold mb-2">Customer</div>
|
||||
<!-- This section uses your original v-if logic -->
|
||||
<div>
|
||||
<div class="font-bold">{{ customer.customer_first_name }} {{ customer.customer_last_name }}</div>
|
||||
<div>{{ customer.customer_address }}</div>
|
||||
<div v-if="customer.customer_apt && customer.customer_apt !== 'None'">{{ customer.customer_apt }}</div>
|
||||
<div>
|
||||
{{ customer.customer_town }},
|
||||
<span v-if="customer.customer_state == 0">Massachusetts</span>
|
||||
<span v-else-if="customer.customer_state == 1">Rhode Island</span>
|
||||
<span v-else-if="customer.customer_state == 2">New Hampshire</span>
|
||||
<span v-else-if="customer.customer_state == 3">Maine</span>
|
||||
<span v-else-if="customer.customer_state == 4">Vermont</span>
|
||||
<span v-else-if="customer.customer_state == 5">Maine</span>
|
||||
<span v-else-if="customer.customer_state == 6">New York</span>
|
||||
<span v-else>Unknown state</span>
|
||||
{{ customer.customer_zip }}
|
||||
</div>
|
||||
<div class="mt-2 text-sm">
|
||||
{{ customer.customer_phone_number }}
|
||||
(<span v-if="customer.customer_home_type == 0">Residential</span>
|
||||
<span v-else-if="customer.customer_home_type == 1">apartment</span>
|
||||
<span v-else-if="customer.customer_home_type == 2">condo</span>
|
||||
<span v-else-if="customer.customer_home_type == 3">commercial</span>
|
||||
<span v-else-if="customer.customer_home_type == 4">business</span>
|
||||
<span v-else-if="customer.customer_home_type == 5">construction</span>
|
||||
<span v-else-if="customer.customer_home_type == 6">container</span>)
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Payment & Pricing Card -->
|
||||
<div class="bg-neutral rounded-lg p-5">
|
||||
<h3 class="text-xl font-bold mb-4">Payment & Pricing</h3>
|
||||
<div class="space-y-4">
|
||||
<div>
|
||||
<div class="font-bold text-sm">Today's Price / Gallon</div>
|
||||
<div class="text-lg font-mono">${{ Number(today_oil_price).toFixed(2) }}</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="font-bold text-sm">Payment Method</div>
|
||||
<div v-if="!userCardfound" class="text-warning text-sm">No card on file for this customer.</div>
|
||||
<div v-if="userCardfound" class="mt-2 p-3 rounded-lg border bg-primary/10 border-primary">
|
||||
<div class="font-bold text-sm">{{ userCard.name_on_card }}</div>
|
||||
<div class="text-xs opacity-70">{{ userCard.type_of_card }}</div>
|
||||
<div class="mt-1 text-sm font-mono tracking-wider">
|
||||
<p>{{ userCard.card_number }}</p>
|
||||
<p>{{ userCard.security_number }}</p>
|
||||
<p>Exp: {{ userCard.expiration_month }} / {{ userCard.expiration_year }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- RIGHT COLUMN: Finalize Form -->
|
||||
<div class="space-y-4">
|
||||
<div v-if="customer.id > 0" class="bg-base-100 rounded-lg p-5">
|
||||
<h2 class="text-2xl font-bold mb-4">Finalize Auto Delivery</h2>
|
||||
<form class="space-y-4" @submit.prevent="onSubmit">
|
||||
<div>
|
||||
<label class="label"><span class="label-text font-bold">Gallons Delivered</span></label>
|
||||
<input v-model="FinalizeOilOrderForm.gallons_delivered"
|
||||
class="input input-bordered input-sm w-full max-w-xs" type="number" placeholder="# gallons" />
|
||||
</div>
|
||||
|
||||
<div class="pt-2">
|
||||
<button type="submit" class="btn btn-success btn-sm">Finalize Delivery</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div v-else class="bg-base-100 rounded-lg p-5">
|
||||
<h2 class="text-2xl font-bold mb-4 text-error">Error</h2>
|
||||
<p>Customer information not found. Please check the automatic delivery data.</p>
|
||||
</div>
|
||||
</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"
|
||||
|
||||
|
||||
export default defineComponent({
|
||||
name: 'finalizeTicketAuto',
|
||||
|
||||
components: {
|
||||
Header,
|
||||
SideBar,
|
||||
Footer,
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
v$: useValidate(),
|
||||
loaded: false,
|
||||
user: {
|
||||
id: 0
|
||||
},
|
||||
userCardfound: false,
|
||||
deliveryStatus: [],
|
||||
userCards: [],
|
||||
deliveryNotesDriver: [],
|
||||
today_oil_price: 0,
|
||||
|
||||
FinalizeOilOrderForm: {
|
||||
fill_location: 0,
|
||||
check_number: 0,
|
||||
delivery_status: 10,
|
||||
userCards: [],
|
||||
credit_card_id: 0,
|
||||
driver: 0,
|
||||
gallons_delivered: '',
|
||||
customer_filled: false,
|
||||
prime: false,
|
||||
same_day: false,
|
||||
emergency: false,
|
||||
},
|
||||
CreateOilOrderForm: {
|
||||
basicInfo: {
|
||||
gallons_delivered: '',
|
||||
userCards: []
|
||||
},
|
||||
},
|
||||
userCard: {
|
||||
date_added: '',
|
||||
user_id: '',
|
||||
card_number: '',
|
||||
last_four_digits: '',
|
||||
name_on_card: '',
|
||||
expiration_month: '',
|
||||
expiration_year: '',
|
||||
type_of_card: '',
|
||||
security_number: '',
|
||||
accepted_or_declined: '',
|
||||
main_card: '',
|
||||
},
|
||||
customer: {
|
||||
id: 0,
|
||||
user_id: 0,
|
||||
customer_address: '',
|
||||
customer_first_name: '',
|
||||
customer_last_name: '',
|
||||
customer_town: '',
|
||||
customer_state: 0,
|
||||
customer_zip: '',
|
||||
customer_apt: '',
|
||||
customer_home_type: 0,
|
||||
customer_phone_number: '',
|
||||
},
|
||||
customerDescription: {
|
||||
customer_id: 0,
|
||||
account_number: '',
|
||||
company_id: 0,
|
||||
fill_location: 0,
|
||||
description: '',
|
||||
},
|
||||
|
||||
|
||||
autoTicket: {
|
||||
id: 0,
|
||||
customer_id: '',
|
||||
account_number: '',
|
||||
|
||||
customer_town: '',
|
||||
customer_state: '',
|
||||
customer_address: '',
|
||||
customer_zip: '',
|
||||
customer_full_name: '',
|
||||
|
||||
oil_prices_id: '',
|
||||
fill_date: '',
|
||||
gallons_delivered: '',
|
||||
price_per_gallon: '',
|
||||
|
||||
total_amount_customer: '',
|
||||
|
||||
payment_type: '',
|
||||
payment_card_id: '',
|
||||
payment_status: '',
|
||||
open_ticket_id: 0
|
||||
|
||||
},
|
||||
|
||||
autoDelivery: {
|
||||
id: 0,
|
||||
customer_id: 0,
|
||||
account_number: '',
|
||||
customer_town: '',
|
||||
customer_state: 0,
|
||||
customer_address: '',
|
||||
customer_zip: '',
|
||||
customer_full_name: '',
|
||||
last_fill: '',
|
||||
days_since_last_fill: 0,
|
||||
last_updated: '',
|
||||
estimated_gallons_left: 0,
|
||||
estimated_gallons_left_prev_day: 0,
|
||||
tank_height: '',
|
||||
tank_size: '',
|
||||
house_factor: 0,
|
||||
auto_status: 0,
|
||||
open_ticket_id: null,
|
||||
},
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
this.userStatus()
|
||||
},
|
||||
watch: {
|
||||
$route() {
|
||||
this.today_price_oil();
|
||||
this.getAutoTicket(this.$route.params.id);
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.today_price_oil();
|
||||
this.getAutoDelivery(this.$route.params.id);
|
||||
|
||||
|
||||
},
|
||||
|
||||
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;
|
||||
this.user.id = response.data.user_id;
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
getPaymentCard(card_id: any) {
|
||||
let path = import.meta.env.VITE_BASE_URL + "/payment/card/" + card_id;
|
||||
axios({
|
||||
method: "get",
|
||||
url: path,
|
||||
withCredentials: true,
|
||||
})
|
||||
.then((response: any) => {
|
||||
|
||||
if (response.data.userCard.card_number === '') {
|
||||
this.userCard === null;
|
||||
this.userCardfound = false;
|
||||
}
|
||||
else {
|
||||
this.userCard = response.data;
|
||||
this.userCardfound = true;
|
||||
}
|
||||
this.FinalizeOilOrderForm.userCards = response.data.id
|
||||
})
|
||||
.catch(() => {
|
||||
});
|
||||
},
|
||||
getPaymentCards(user_id: any) {
|
||||
let path = import.meta.env.VITE_BASE_URL + "/payment/cards/" + user_id;
|
||||
axios({
|
||||
method: "get",
|
||||
url: path,
|
||||
withCredentials: true,
|
||||
})
|
||||
.then((response: any) => {
|
||||
this.userCards = response.data;
|
||||
if (this.userCards && this.userCards.length > 0) {
|
||||
this.userCardfound = true;
|
||||
this.userCard = this.userCards.find((card: any) => card.main_card) || this.userCards[0];
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
});
|
||||
},
|
||||
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
|
||||
})
|
||||
},
|
||||
getCreditCards(userid: any) {
|
||||
let path = import.meta.env.VITE_BASE_URL + '/payment/cards/' + userid;
|
||||
axios({
|
||||
method: 'get',
|
||||
url: path,
|
||||
headers: authHeader(),
|
||||
}).then((response: any) => {
|
||||
this.userCards = response.data;
|
||||
if (this.userCards && this.userCards.length > 0) {
|
||||
this.userCardfound = true;
|
||||
this.userCard = this.userCards.find((card: any) => card.main_card) || this.userCards[0];
|
||||
}
|
||||
})
|
||||
},
|
||||
getCustomerDescription(user_id: any) {
|
||||
let path = import.meta.env.VITE_BASE_URL + "/customer/description/" + user_id;
|
||||
axios({
|
||||
method: "get",
|
||||
url: path,
|
||||
withCredentials: true,
|
||||
})
|
||||
.then((response: any) => {
|
||||
this.customerDescription = response.data;
|
||||
this.loaded = true
|
||||
})
|
||||
.catch(() => {
|
||||
notify({
|
||||
title: "Error",
|
||||
text: "Could not find customer",
|
||||
type: "error",
|
||||
});
|
||||
});
|
||||
},
|
||||
getAutoTicket(delivery_id: any) {
|
||||
let path = import.meta.env.VITE_AUTO_URL + "/delivery/autoticket/" + delivery_id;
|
||||
axios({
|
||||
method: "get",
|
||||
url: path,
|
||||
withCredentials: true,
|
||||
})
|
||||
.then((response: any) => {
|
||||
this.autoTicket = response.data;
|
||||
this.getCustomer(this.autoTicket.customer_id)
|
||||
|
||||
this.getAutoDelivery(this.autoTicket.id)
|
||||
this.getCustomerDescription(this.autoTicket.customer_id)
|
||||
|
||||
})
|
||||
.catch(() => {
|
||||
notify({
|
||||
title: "Error",
|
||||
text: "Could not get automatic",
|
||||
type: "error",
|
||||
});
|
||||
});
|
||||
},
|
||||
|
||||
getAutoDelivery(delivery_id: any) {
|
||||
let path = import.meta.env.VITE_AUTO_URL + "/delivery/delivery/" + delivery_id;
|
||||
axios({
|
||||
method: "get",
|
||||
url: path,
|
||||
withCredentials: true,
|
||||
})
|
||||
.then((response: any) => {
|
||||
if (response.data && response.data.customer_id) {
|
||||
this.autoDelivery = response.data;
|
||||
this.getCustomer(this.autoDelivery.customer_id)
|
||||
this.getCreditCards(this.autoDelivery.customer_id)
|
||||
} else {
|
||||
console.error("API Error:", response.data.error || "Failed to fetch auto delivery data.");
|
||||
}
|
||||
})
|
||||
.catch((error: any) => {
|
||||
console.error("API Error in getAutoDelivery:", error);
|
||||
notify({
|
||||
title: "Error",
|
||||
text: "Could not get automatic delivery",
|
||||
type: "error",
|
||||
});
|
||||
});
|
||||
},
|
||||
today_price_oil() {
|
||||
let path = import.meta.env.VITE_BASE_URL + '/info/price/oil'
|
||||
axios({
|
||||
method: "get",
|
||||
url: path,
|
||||
withCredentials: true,
|
||||
headers: authHeader(),
|
||||
})
|
||||
.then((response: any) => {
|
||||
this.today_oil_price = response.data.price_for_customer;
|
||||
})
|
||||
},
|
||||
UpdateAuto(payload: {
|
||||
gallons: string,
|
||||
delivery_id: string,
|
||||
}) {
|
||||
let path = import.meta.env.VITE_AUTO_URL + "/confirm/delivery"
|
||||
axios({
|
||||
method: "put",
|
||||
url: path,
|
||||
data: payload,
|
||||
withCredentials: true,
|
||||
headers: authHeader(),
|
||||
})
|
||||
.then((response: any) => {
|
||||
if (response.data.ok) {
|
||||
notify({
|
||||
text: 'Update',
|
||||
type: 'postive',
|
||||
title: 'top'
|
||||
})
|
||||
this.$router.push({ name: "auto" });
|
||||
}
|
||||
else {
|
||||
notify({
|
||||
text: 'Auto Failure',
|
||||
type: 'negative',
|
||||
title: 'Update'
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
UpdateDeliveredAuto(payload: {
|
||||
gallons_delivered: string,
|
||||
}) {
|
||||
let path = import.meta.env.VITE_AUTO_URL + "/confirm/auto/update/" + this.autoDelivery.id;
|
||||
axios({
|
||||
method: "put",
|
||||
url: path,
|
||||
data: payload,
|
||||
withCredentials: true,
|
||||
headers: authHeader(),
|
||||
})
|
||||
.then((response: any) => {
|
||||
if (response.data) {
|
||||
notify({
|
||||
title: "Success",
|
||||
text: "Auto Updated",
|
||||
type: "success",
|
||||
});
|
||||
// Removed redirect from here, will handle in onSubmit
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
|
||||
CreateTransaction(auto_ticket_id: string,) {
|
||||
let path = import.meta.env.VITE_MONEY_URL + "/delivery/add/auto/" + auto_ticket_id;
|
||||
axios({
|
||||
method: "post",
|
||||
url: path,
|
||||
withCredentials: true,
|
||||
headers: authHeader(),
|
||||
})
|
||||
.then((response: any) => {
|
||||
if (response.status == 201) {
|
||||
notify({
|
||||
message: 'Confirmed Transaction',
|
||||
type: 'positive',
|
||||
position: 'top'
|
||||
})
|
||||
}
|
||||
else {
|
||||
notify({
|
||||
message: 'Form Error',
|
||||
type: 'negative',
|
||||
position: 'top'
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
ConfirmAuto(payload: {
|
||||
gallons_delivered: string,
|
||||
}) {
|
||||
let path = import.meta.env.VITE_AUTO_URL + "/confirm/auto/create/nopreauth/" + this.autoDelivery.id;
|
||||
axios({
|
||||
method: "post",
|
||||
url: path,
|
||||
data: payload,
|
||||
withCredentials: true,
|
||||
headers: authHeader(),
|
||||
})
|
||||
.then((response: any) => {
|
||||
if (response.data) {
|
||||
notify({
|
||||
title: "Success",
|
||||
text: "Auto Delivered",
|
||||
type: "success",
|
||||
});
|
||||
this.CreateTransaction(response.data['0']['auto_ticket_id'])
|
||||
}
|
||||
if (response.data.error) {
|
||||
notify({
|
||||
title: "Error",
|
||||
text: "Could not finalize auto",
|
||||
type: "error",
|
||||
});
|
||||
this.$router.push("auto");
|
||||
}
|
||||
})
|
||||
},
|
||||
onSubmit() {
|
||||
let payload = {
|
||||
gallons_delivered: this.FinalizeOilOrderForm.gallons_delivered,
|
||||
};
|
||||
this.UpdateDeliveredAuto(payload);
|
||||
|
||||
this.ConfirmAuto(payload)
|
||||
this.$router.push({ name: "auto" });
|
||||
|
||||
},
|
||||
|
||||
},
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
|
||||
Reference in New Issue
Block a user