diff --git a/src/pages/workorders/api.js b/src/pages/workorders/api.js
index 37b5e44e..ebdfbb8b 100644
--- a/src/pages/workorders/api.js
+++ b/src/pages/workorders/api.js
@@ -18,6 +18,7 @@ export const getWorkOrderById = async (id) => {
     const wo = await workOrderApi.getById(id);
     return {
       id: wo.id,
+      internalWONumber: wo.internalWONumber ?? "",
       workOrderNumber: wo.workerOrderNumber ?? wo.workOrderNumber ?? "",
       title: wo.title ?? wo.workerOrderTitle ?? "",
       location: wo.location ?? "",
diff --git a/src/pages/workorders/form/WorkOrderFormPage.js b/src/pages/workorders/form/WorkOrderFormPage.js
index 14911639..df3d977d 100644
--- a/src/pages/workorders/form/WorkOrderFormPage.js
+++ b/src/pages/workorders/form/WorkOrderFormPage.js
@@ -111,7 +111,7 @@ export default function WorkOrderFormPage() {
                       <i className="fa fa-square fa-stack-2x text-primary"></i>
                       <i className={`fa fa-${isEdit ? "edit" : "plus"} fa-stack-1x fa-inverse`}></i>
                     </span>
-                    <span>{isEdit ? "Edit a Work Order" : "Create a Work Order"}</span>
+                    <span>{isEdit ? `Edit Work Order ${formData.internalWONumber}` : "Create a Work Order"}</span>
                   </h3>
                 </div>
               </div>
@@ -126,7 +126,7 @@ export default function WorkOrderFormPage() {
                 <div className="row">
                   <div className="col-sm-6">
                     <div className="form-group">
-                      <label className="required-field" htmlFor="workOrderNumber">Work Order Number</label>
+                      <label htmlFor="workOrderNumber">Customer WO</label>
                       <input
                         className="form-control"
                         type="text"
@@ -134,8 +134,7 @@ export default function WorkOrderFormPage() {
                         name="workOrderNumber"
                         value={formData.workOrderNumber}
                         onChange={handleChange}
-                        placeholder="e.g., WO-001"
-                        required
+                        placeholder="Customer work order number"
                       />
                     </div>
                   </div>
diff --git a/src/pages/workorders/view/WorkOrderViewPage.js b/src/pages/workorders/view/WorkOrderViewPage.js
index 46672da8..87b60abc 100644
--- a/src/pages/workorders/view/WorkOrderViewPage.js
+++ b/src/pages/workorders/view/WorkOrderViewPage.js
@@ -288,7 +288,7 @@ export default function WorkOrderViewPage() {
                 Work Orders
               </a>
             </li>
-            <li className="active">{wo.workOrderNumber}</li>
+            <li className="active">{wo.internalWONumber}</li>
           </ol>
 
           <div className="woViewHeader">
@@ -311,8 +311,12 @@ export default function WorkOrderViewPage() {
               <h4>Details</h4>
               <div className="woFieldGrid">
                 <div className="woField">
-                  <span className="woFieldLabel">WO #</span>
-                  <span className="woFieldValue">{wo.workOrderNumber}</span>
+                  <span className="woFieldLabel">Internal WO</span>
+                  <span className="woFieldValue">{wo.internalWONumber}</span>
+                </div>
+                <div className="woField">
+                  <span className="woFieldLabel">Customer WO</span>
+                  <span className="woFieldValue">{wo.workOrderNumber || "—"}</span>
                 </div>
                 <div className="woField">
                   <span className="woFieldLabel">Priority</span>