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

Working log in/route guard

Browse Source
This commit is contained in:
Edwin Eames
2025-09-04 08:03:24 -04:00
parent 992a1a217d
commit dc1ee95827
37 changed files with 1283 additions and 1191 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/pages/service/ServiceHome.vue
View File

@@ -48,7 +48,7 @@
</thead>
<tbody>
<!-- Removed @click from tr to avoid conflicting actions -->
<tr v-for="service in services" :key="service.id" class="hover">
<tr v-for="service in services" :key="service.id" class=" hover:bg-blue-600">
<td class="align-top">
<div>{{ formatDate(service.scheduled_date) }}</div>
<div class="text-xs opacity-70">{{ formatTime(service.scheduled_date) }}</div>
@@ -56,7 +56,10 @@
<td class="align-top">{{ service.customer_name }}</td>
<td class="align-top">{{ service.customer_address }}, {{ service.customer_town }}</td>
<td class="align-top">
<span class="font-medium" :style="{ color: getServiceTypeColor(service.type_service_call) }">
<span
class="badge badge-sm text-white"
:style="{ 'background-color': getServiceTypeColor(service.type_service_call), 'border-color': getServiceTypeColor(service.type_service_call) }"
>
{{ getServiceTypeName(service.type_service_call) }}
</span>
</td>

28
src/pages/service/ServicePast.vue
View File

@@ -1,3 +1,4 @@
<template>
<div class="flex">
<div class="w-full px-4 md:px-10 py-4">
@@ -46,21 +47,30 @@
</tr>
</thead>
<tbody>
<!-- Removed @click from tr to avoid conflicting with "Read more" -->
<tr v-for="service in services" :key="service.id" class="hover">
<tr v-for="service in services" :key="service.id" class="hover:bg-blue-600">
<td class="align-top">
<div>{{ formatDate(service.scheduled_date) }}</div>
<div class="text-xs opacity-70">{{ formatTime(service.scheduled_date) }}</div>
</td>
<td class="align-top">{{ service.customer_name }}</td>
<td class="align-top">{{ service.customer_address }}, {{ service.customer_town }}</td>
<!--
FIX IS HERE: Replaced the colored text with a styled badge.
- `badge-sm`: Makes the pill small and compact.
- `text-white`: Ensures text is readable against the colored background.
- The background color is set dynamically using your existing `getServiceTypeColor` method.
-->
<td class="align-top">
<span class="font-medium" :style="{ color: getServiceTypeColor(service.type_service_call) }">
<span
class="badge badge-sm text-white"
:style="{ 'background-color': getServiceTypeColor(service.type_service_call), 'border-color': getServiceTypeColor(service.type_service_call) }"
>
{{ getServiceTypeName(service.type_service_call) }}
</span>
</td>
<td class="whitespace-normal text-sm align-top">
<!-- TRUNCATION LOGIC FOR DESKTOP -->
<div v-if="!isLongDescription(service.description) || isExpanded(service.id)">
{{ service.description }}
<a v-if="isLongDescription(service.description)" @click.prevent="toggleExpand(service.id)" href="#" class="link link-info link-hover text-xs ml-1 whitespace-nowrap">Show less</a>
@@ -72,7 +82,6 @@
</td>
<td class="text-right font-mono align-top">{{ formatCurrency(service.service_cost) }}</td>
<td class="text-right align-top">
<!-- Moved @click handler to the button for explicit action -->
<button @click="openEditModal(service)" class="btn btn-sm btn-primary">View</button>
</td>
</tr>
@@ -82,14 +91,14 @@
<!-- MOBILE VIEW: Cards (Revamped) -->
<div class="xl:hidden space-y-4">
<!-- Removed @click from card div -->
<div v-for="service in services" :key="service.id" class="card bg-base-100 shadow-md">
<div v-for="service in services" :key="service.id" class="card bg-base-100 shadow-md ">
<div class="card-body p-4">
<div class="flex justify-between items-start">
<div>
<h2 class="card-title text-base">{{ service.customer_name }}</h2>
<p class="text-xs text-gray-400">{{ service.customer_address }}, {{ service.customer_town }}</p>
</div>
<!-- Mobile view already uses a badge, which is great! No changes needed here. -->
<div class="badge badge-outline text-right" :style="{ 'border-color': getServiceTypeColor(service.type_service_call), color: getServiceTypeColor(service.type_service_call) }">
{{ getServiceTypeName(service.type_service_call) }}
</div>
@@ -101,7 +110,6 @@
<p><strong class="font-semibold">Cost:</strong> <span class="font-mono">{{ formatCurrency(service.service_cost) }}</span></p>
</div>
<!-- TRUNCATION LOGIC FOR MOBILE -->
<div v-if="service.description" class="text-sm mt-2 p-2 bg-base-200 rounded-md prose max-w-none">
<div v-if="!isLongDescription(service.description) || isExpanded(service.id)">
{{ service.description }}
@@ -114,7 +122,6 @@
</div>
<div class="card-actions justify-end mt-2">
<!-- Moved @click handler to the button -->
<button @click="openEditModal(service)" class="btn btn-sm btn-primary">View</button>
</div>
</div>
@@ -135,6 +142,7 @@
@delete-service="handleDeleteService"
/>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
import axios from 'axios'
@@ -297,7 +305,7 @@ export default defineComponent({
0: 'Tune-up',
1: 'No Heat',
2: 'Fix',
3: 'Tank Install',
3: 'Tank_Install',
4: 'Other',
};
return typeMap[typeId] || 'Unknown Service';