From 4ca18a514c116e01ff6040852f9ce8990df85149 Mon Sep 17 00:00:00 2001
From: rocketdebris <rocketdebris@gmail.com>
Date: Tue, 16 Dec 2025 10:39:04 -0500
Subject: [PATCH 1/2] Styling changes to the CRM page. More in-line with LMN.
 Removed Status Buttons, moved some information around to be more cohesive.

---
 .../components/clientSubPages/Overview.vue    | 263 ++++++++----------
 1 file changed, 112 insertions(+), 151 deletions(-)

diff --git a/frontend/src/components/clientSubPages/Overview.vue b/frontend/src/components/clientSubPages/Overview.vue
index ef54bde..518a6ba 100644
--- a/frontend/src/components/clientSubPages/Overview.vue
+++ b/frontend/src/components/clientSubPages/Overview.vue
@@ -1,165 +1,126 @@
 <template>
 	<div class="overview-container">
-		<template v-if="isNew || editMode">
-			<ClientInformationForm
-				ref="clientInfoRef"
-				:form-data="formData"
-				@update:form-data="formData = $event"
-				:is-submitting="isSubmitting"
-				:is-edit-mode="editMode"
-				@new-client-toggle="handleNewClientToggle"
-				@customer-selected="handleCustomerSelected"
-			/>
-
-			<ContactInformationForm
-				ref="contactInfoRef"
-				:form-data="formData"
-				@update:form-data="formData = $event"
-				:is-submitting="isSubmitting"
-				:is-edit-mode="editMode"
-				:is-new-client-locked="isNewClientMode"
-				:available-contacts="availableContacts"
-				@new-contact-toggle="handleNewContactToggle"
-			/>
-
-			<AddressInformationForm
-				:form-data="formData"
-				@update:form-data="formData = $event"
-				:is-submitting="isSubmitting"
-				:is-edit-mode="editMode"
+		<template v-if="!editMode">
+			<Button
+				@click="toggleEditMode"
+				icon="pi pi-pencil"
+				label="Edit Information"
+				size="small"
+				severity="secondary"
 			/>
 		</template>
+		<div class="status-cards">
+				<template v-if="isNew || editMode">
+				<ClientInformationForm
+					ref="clientInfoRef"
+					:form-data="formData"
+					@update:form-data="formData = $event"
+				:is-submitting="isSubmitting"
+					:is-edit-mode="editMode"
+					@new-client-toggle="handleNewClientToggle"
+					@customer-selected="handleCustomerSelected"
+				/>
 
-		<!-- Display Mode (existing client view) -->
-		<template v-else>
-			<!-- Client Basic Info Card -->
-			<div class="info-card">
-				<div class="card-header">
-					<h3>Client Information</h3>
-					<Button
-						@click="toggleEditMode"
-						icon="pi pi-pencil"
-						label="Edit"
-						size="small"
-						severity="secondary"
-					/>
-				</div>
-				<div class="info-grid">
-					<div class="info-item">
-						<label>Customer Name:</label>
-						<span>{{ clientData?.customerName || "N/A" }}</span>
-					</div>
-					<div class="info-item">
-						<label>Customer Type:</label>
-						<span>{{ clientData?.customerType || "N/A" }}</span>
-					</div>
-					<div class="info-item">
-						<label>Customer Group:</label>
-						<span>{{ clientData?.customerGroup || "N/A" }}</span>
-					</div>
-					<div class="info-item">
-						<label>Territory:</label>
-						<span>{{ clientData?.territory || "N/A" }}</span>
-					</div>
-				</div>
-			</div>
+				<ContactInformationForm
+					ref="contactInfoRef"
+					:form-data="formData"
+					@update:form-data="formData = $event"
+				:is-submitting="isSubmitting"
+					:is-edit-mode="editMode"
+					:is-new-client-locked="isNewClientMode"
+					:available-contacts="availableContacts"
+					@new-contact-toggle="handleNewContactToggle"
+				/>
 
-			<!-- Address Info Card -->
-			<div class="info-card" v-if="selectedAddressData">
-				<h3>Address Information</h3>
-				<div class="info-grid">
-					<div class="info-item full-width">
-						<label>Address Title:</label>
-						<span>{{ selectedAddressData.addressTitle || "N/A" }}</span>
-					</div>
-					<div class="info-item full-width">
-						<label>Full Address:</label>
-						<span>{{ fullAddress }}</span>
-					</div>
-					<div class="info-item">
-						<label>City:</label>
-						<span>{{ selectedAddressData.city || "N/A" }}</span>
-					</div>
-					<div class="info-item">
-						<label>State:</label>
-						<span>{{ selectedAddressData.state || "N/A" }}</span>
-					</div>
-					<div class="info-item">
-						<label>Zip Code:</label>
-						<span>{{ selectedAddressData.pincode || "N/A" }}</span>
-					</div>
-				</div>
-			</div>
+				<AddressInformationForm
+					:form-data="formData"
+					@update:form-data="formData = $event"
+				:is-submitting="isSubmitting"
+					:is-edit-mode="editMode"
+				/>
+			</template>
 
-			<!-- Contact Info Card -->
-			<div class="info-card" v-if="selectedAddressData">
-				<h3>Contact Information</h3>
-				<template v-if="contactsForAddress.length > 0">
-					<div v-if="contactsForAddress.length > 1" class="contact-selector">
-						<Dropdown
-							v-model="selectedContactIndex"
-							:options="contactOptions"
-							option-label="label"
-							option-value="value"
-							placeholder="Select Contact"
-							class="w-full"
-						/>
-					</div>
+			<!-- Display Mode (existing client view) -->
+			<template v-else>
+				<!-- Address Info Card -->
+				<div class="info-card" v-if="selectedAddressData">
+					<h3>General Information</h3>
 					<div class="info-grid">
-						<div class="info-item">
-							<label>Contact Name:</label>
-							<span>{{ contactFullName }}</span>
+						<div class="info-item full-width">
+							<label>Address Title:</label>
+							<span>{{ selectedAddressData.addressTitle || "N/A" }}</span>
 						</div>
-						<div class="info-item">
-							<label>Phone:</label>
-							<span>{{ primaryContactPhone }}</span>
+						<div class="info-item full-width">
+							<label>Full Address:</label>
+							<span>{{ fullAddress }}</span>
 						</div>
-						<div class="info-item">
-							<label>Email:</label>
-							<span>{{ primaryContactEmail }}</span>
+						<div class="info-item full-width">
+							<label>City:</label>
+							<span>{{ selectedAddressData.city || "N/A" }}</span>
+						</div>
+						<div class="info-item full-width">
+							<label>State:</label>
+							<span>{{ selectedAddressData.state || "N/A" }}</span>
+						</div>
+						<div class="info-item full-width">
+							<label>Zip Code:</label>
+							<span>{{ selectedAddressData.pincode || "N/A" }}</span>
 						</div>
 					</div>
-				</template>
-				<template v-else>
-					<p>No contacts available for this address.</p>
-				</template>
-			</div>
-		</template>
+				</div>
 
-		<!-- Status Cards (only for existing clients) -->
-		<div class="status-cards" v-if="!isNew && !editMode && selectedAddressData">
-			<div class="status-card">
-				<h4>On-Site Meeting</h4>
-				<Button
-					:label="selectedAddressData.customOnsiteMeetingScheduled || 'Not Started'"
-					:severity="getStatusSeverity(selectedAddressData.customOnsiteMeetingScheduled)"
-					@click="handleStatusClick('onsite')"
-				/>
-			</div>
-			<div class="status-card">
-				<h4>Estimate Sent</h4>
-				<Button
-					:label="selectedAddressData.customEstimateSentStatus || 'Not Started'"
-					:severity="getStatusSeverity(selectedAddressData.customEstimateSentStatus)"
-					@click="handleStatusClick('estimate')"
-				/>
-			</div>
-			<div class="status-card">
-				<h4>Job Status</h4>
-				<Button
-					:label="selectedAddressData.customJobStatus || 'Not Started'"
-					:severity="getStatusSeverity(selectedAddressData.customJobStatus)"
-					@click="handleStatusClick('job')"
-				/>
-			</div>
-			<div class="status-card">
-				<h4>Payment Received</h4>
-				<Button
-					:label="selectedAddressData.customPaymentReceivedStatus || 'Not Started'"
-					:severity="getStatusSeverity(selectedAddressData.customPaymentReceivedStatus)"
-					@click="handleStatusClick('payment')"
-				/>
-			</div>
+				<!-- Client Basic Info Card -->
+				<div class="info-card">
+					<h3>Contact Information</h3>
+					<template v-if="contactsForAddress.length > 0">
+						<div class="info-grid">
+							<div class="info-item">
+								<label>Customer Name:</label>
+								<span>{{ clientData?.customerName || "N/A" }}</span>
+							</div>
+							<div class="info-item">
+								<label>Customer Type:</label>
+								<span>{{ clientData?.customerType || "N/A" }}</span>
+							</div>
+							<div v-if="contactsForAddress.length > 1" class="contact-selector">
+								<Dropdown
+									v-model="selectedContactIndex"
+									:options="contactOptions"
+									option-label="label"
+									option-value="value"
+									placeholder="Select Contact"
+									class="w-full"
+								/>
+							</div>
+							<div class="info-grid">
+								<div class="info-item">
+									<label>Contact Name:</label>
+									<span>{{ contactFullName }}</span>
+								</div>
+								<div class="info-item">
+									<label>Phone:</label>
+									<span>{{ primaryContactPhone }}</span>
+								</div>
+								<div class="info-item">
+									<label>Email:</label>
+									<span>{{ primaryContactEmail }}</span>
+								</div>
+							</div>
+							<div class="info-item">
+								<label>Customer Group:</label>
+								<span>{{ clientData?.customerGroup || "N/A" }}</span>
+							</div>
+							<div class="info-item">
+								<label>Territory:</label>
+								<span>{{ clientData?.territory || "N/A" }}</span>
+							</div>
+						</div>
+					</template>
+					<template v-else>
+						<p>No contacts available for this address.</p>
+					</template>
+				</div>
+			</template>
 		</div>
 
 		<!-- Form Actions -->
@@ -410,7 +371,7 @@ const isFormValid = computed(() => {
 	const hasCity = formData.value.city?.trim();
 	const hasState = formData.value.state?.trim();
 	const hasContacts = formData.value.contacts && formData.value.contacts.length > 0;
-	
+
 	// Check that all contacts have required fields
 	const allContactsValid = formData.value.contacts?.every((contact) => {
 		return (
@@ -686,7 +647,7 @@ const handleCancel = () => {
 
 .info-item {
 	display: flex;
-	flex-direction: column;
+	flex-direction: row;
 	gap: 0.5rem;
 }
 

From 59320f90bbe115be1e23314d87ae0bd897e39de5 Mon Sep 17 00:00:00 2001
From: Casey <casey@shilohcode.com>
Date: Tue, 16 Dec 2025 10:26:58 -0600
Subject: [PATCH 2/2] update mapping of data return for a lead

---
 frontend/src/components/clientSubPages/Overview.vue | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/frontend/src/components/clientSubPages/Overview.vue b/frontend/src/components/clientSubPages/Overview.vue
index 518a6ba..27f1a01 100644
--- a/frontend/src/components/clientSubPages/Overview.vue
+++ b/frontend/src/components/clientSubPages/Overview.vue
@@ -10,12 +10,13 @@
 			/>
 		</template>
 		<div class="status-cards">
+				<template v-if="isNew || editMode">
 				<template v-if="isNew || editMode">
 				<ClientInformationForm
 					ref="clientInfoRef"
 					:form-data="formData"
-					@update:form-data="formData = $event"
-				:is-submitting="isSubmitting"
+				@update:form-data="formData = $event"
+					:is-submitting="isSubmitting"
 					:is-edit-mode="editMode"
 					@new-client-toggle="handleNewClientToggle"
 					@customer-selected="handleCustomerSelected"
@@ -24,8 +25,8 @@
 				<ContactInformationForm
 					ref="contactInfoRef"
 					:form-data="formData"
-					@update:form-data="formData = $event"
-				:is-submitting="isSubmitting"
+				@update:form-data="formData = $event"
+					:is-submitting="isSubmitting"
 					:is-edit-mode="editMode"
 					:is-new-client-locked="isNewClientMode"
 					:available-contacts="availableContacts"
@@ -34,8 +35,8 @@
 
 				<AddressInformationForm
 					:form-data="formData"
-					@update:form-data="formData = $event"
-				:is-submitting="isSubmitting"
+				@update:form-data="formData = $event"
+					:is-submitting="isSubmitting"
 					:is-edit-mode="editMode"
 				/>
 			</template>