update creation

frontend/src/components/clientSubPages/AddressInformationForm.vue

@@ -22,6 +22,16 @@
 					class="w-full"
 				/>
 			</div>
+			<div class="form-field full-width checkbox-row">
+				<input
+					type="checkbox"
+					id="isBilling"
+					v-model="localFormData.isBillingAddress"
+					:disabled="isSubmitting"
+					style="margin-top: 0"
+				/>
+				<label for="isBilling">Is Billing Address</label>
+			</div>
 			<div class="form-field">
 				<label for="zipcode"> Zip Code <span class="required">*</span> </label>
 				<InputText
@@ -59,7 +69,7 @@
 </template>
 
 <script setup>
-import { ref, computed } from "vue";
+import { ref, computed, onMounted } from "vue";
 import InputText from "primevue/inputtext";
 import Api from "../../api";
 import { useNotificationStore } from "../../stores/notifications-primevue";
@@ -88,6 +98,12 @@ const localFormData = computed({
 	set: (value) => emit("update:formData", value),
 });
 
+onMounted(() => {
+	if (localFormData.value.isBillingAddress === undefined) {
+		localFormData.value.isBillingAddress = true;
+	}
+});
+
 const zipcodeLookupDisabled = ref(true);
 
 const handleZipcodeInput = async (event) => {
@@ -181,6 +197,17 @@ const handleZipcodeInput = async (event) => {
 	width: 100% !important;
 }
 
+.form-field.checkbox-row {
+	flex-direction: row;
+	align-items: center;
+	gap: 0.5rem;
+}
+
+.form-field.checkbox-row label {
+	margin-bottom: 0;
+	cursor: pointer;
+}
+
 @media (max-width: 768px) {
 	.form-grid {
 		grid-template-columns: 1fr;

frontend/src/components/clientSubPages/ClientInformationForm.vue

@@ -3,40 +3,8 @@
 		<div class="form-section">
 			<div class="section-header">
 				<h3>Client Information</h3>
-				<label class="toggle-container" v-if="!isEditMode">
-					<v-switch v-model="isNewClient" color="success" />
-					<span class="toggle-label">New Client</span>
-				</label>
 			</div>
 			<div class="form-grid">
-				<div class="form-field">
-					<label for="customer-name"> Customer Name <span class="required">*</span> </label>
-					<div class="input-with-button">
-						<InputText
-							id="customer-name"
-							v-model="localFormData.customerName"
-							:disabled="isSubmitting || isEditMode"
-							placeholder="Enter customer name"
-							class="w-full"
-						/>
-						<Button
-							label="Check Client"
-							size="small"
-							icon="pi pi-user-check"
-							class="check-btn"
-							@click="checkCustomerExists"
-							:disabled="isSubmitting || !localFormData.customerName.trim()"
-						>Check</Button>
-						<Button
-							v-if="!isNewClient && !isEditMode"
-							@click="searchCustomers"
-							:disabled="isSubmitting || !localFormData.customerName.trim()"
-							size="small"
-							icon="pi pi-search"
-							class="search-btn"
-						></Button>
-					</div>
-				</div>
 				<div class="form-field">
 					<label for="customer-type"> Customer Type <span class="required">*</span> </label>
 					<Select
@@ -48,6 +16,34 @@
 						class="w-full"
 					/>
 				</div>
+				<div class="form-field">
+					<label for="customer-name"> Customer Name <span class="required">*</span> </label>
+					<div class="input-with-button">
+						<InputText
+							id="customer-name"
+							v-model="localFormData.customerName"
+							:disabled="isSubmitting || isEditMode || localFormData.customerType !== 'Company'"
+							placeholder="Enter customer name"
+							class="w-full"
+						/>
+						<Button
+							label="Check Client"
+							size="small"
+							icon="pi pi-user-check"
+							class="check-btn"
+							@click="checkCustomerExists"
+							:disabled="isSubmitting"
+						>Check</Button>
+						<Button
+							v-if="!isNewClient && !isEditMode"
+							@click="searchCustomers"
+							:disabled="isSubmitting || !localFormData.customerName.trim()"
+							size="small"
+							icon="pi pi-search"
+							class="search-btn"
+						></Button>
+					</div>
+				</div>
 			</div>
 		</div>
 
@@ -147,6 +143,23 @@ watch(isNewClient, (newValue) => {
 	emit("newClientToggle", newValue);
 });
 
+// Watch for changes that affect customer name
+watch(
+	() => localFormData.value,
+	(newData) => {
+		if (newData.customerType === "Individual" && newData.contacts && newData.contacts.length > 0) {
+			const primary = newData.contacts.find((c) => c.isPrimary) || newData.contacts[0];
+			const firstName = primary.firstName || "";
+			const lastName = primary.lastName || "";
+			const fullName = `${firstName} ${lastName}`.trim();
+			if (fullName !== newData.customerName) {
+				newData.customerName = fullName;
+			}
+		}
+	},
+	{ deep: true },
+);
+
 const searchCustomers = async () => {
 	const searchTerm = localFormData.value.customerName.trim();
 	if (!searchTerm) return;
@@ -172,8 +185,11 @@ const searchCustomers = async () => {
 };
 
 const checkCustomerExists = async () => {
-	const searchTerm = localFormData.value.customerName.trim();
-	if (!searchTerm) return;
+	const searchTerm = (localFormData.value.customerName || "").trim();
+	if (!searchTerm) {
+		notificationStore.addWarning("Please ensure a customer name is entered before checking.");
+		return;
+	}
 
 	try {
 		const client = await Api.getClient(searchTerm);