@fleetbase/fleetops-engine 0.6.38 → 0.6.40

package/addon/components/order/details/custom-fields.hbs

@@ -1 +1,10 @@
-<CustomField::Yield @subject={{@resource}} @owner={{@resource.order_config}} @loadOptions={{false}} @viewMode={{true}} @editable={{not-eq @resource.status "canceled"}} @onChange={{this.saveCustomFields}} @permission="fleet-ops update order" @wrapperClass="bordered-top" />
+<CustomField::Yield
+    @subject={{@resource}}
+    @owner={{@resource.order_config}}
+    @loadOptions={{false}}
+    @viewMode={{true}}
+    @editable={{not-eq @resource.status "canceled"}}
+    @onChange={{this.saveCustomFields}}
+    @permission="fleet-ops update order"
+    @wrapperClass="bordered-top"
+/>

package/addon/components/order/details/detail.hbs

@@ -16,7 +16,12 @@
                     <span>{{t "order.fields.driver-assigned"}}</span>
                 </div>
                 <div class="field-value">
-                    <Driver::Pill @driver={{@resource.driver_assigned}} @onClick={{this.focusOrderAssignedDriver}} @titleFallback="No driver assigned" @titleClass={{unless @resource.driver_assigned "text-gray-300"}} />
+                    <Driver::Pill
+                        @driver={{@resource.driver_assigned}}
+                        @onClick={{this.focusOrderAssignedDriver}}
+                        @titleFallback="No driver assigned"
+                        @titleClass={{unless @resource.driver_assigned "text-gray-300"}}
+                    />
                 </div>
             </div>
             <div class="field-info-container">
@@ -114,4 +119,34 @@
             {{/if}}
         </div>
     </:default>
-</ContentPanel>
+</ContentPanel>
+
+{{! ORCHESTRATOR CONSTRAINTS (read-only view) }}
+{{#if (or @resource.time_window_start @resource.time_window_end @resource.required_skills.length @resource.orchestrator_priority)}}
+    <ContentPanel @title="Orchestrator Constraints" @open={{true}} @isLoading={{@isLoading}} @wrapperClass="bordered-top">
+        <div class="grid grid-cols-2 gap-2 text-xs dark:text-gray-100">
+            {{#if (or @resource.time_window_start @resource.time_window_end)}}
+                <div class="field-info-container">
+                    <div class="field-name">Earliest Arrival</div>
+                    <div class="field-value">{{n-a @resource.time_window_start}}</div>
+                </div>
+                <div class="field-info-container">
+                    <div class="field-name">Latest Arrival</div>
+                    <div class="field-value">{{n-a @resource.time_window_end}}</div>
+                </div>
+            {{/if}}
+            {{#if @resource.required_skills.length}}
+                <div class="field-info-container col-span-2">
+                    <div class="field-name">Required Skills</div>
+                    <div class="field-value">{{join @resource.required_skills ", "}}</div>
+                </div>
+            {{/if}}
+            {{#if @resource.orchestrator_priority}}
+                <div class="field-info-container">
+                    <div class="field-name">Priority</div>
+                    <div class="field-value">{{@resource.orchestrator_priority}}</div>
+                </div>
+            {{/if}}
+        </div>
+    </ContentPanel>
+{{/if}}

package/addon/components/order/details/detail.js

@@ -36,7 +36,6 @@ export default class OrderDetailsDetailComponent extends Component {
     }
 
     @action focusOrderAssignedDriver(driver) {
-        console.log('[focusOrderAssignedDriver]', ...arguments);
         this.driverActions.panel.view(driver);
         this.leafletMapManager.map?.flyTo(driver.coordinates, 18);
     }

package/addon/components/order/details/integrated-vendor-details.hbs

@@ -1,5 +1,5 @@
 {{#if @resource.isIntegratedVendorOrder}}
-        <ContentPanel @title={{concat @resource.facilitator.name (t "order.fields.order-details-title")}} @open={{true}} @wrapperClass="bordered-top">
-            <IntegratedOrderDetails @integratedVendor={{@resource.facilitator}} @details={{@resource.meta.integrated_vendor_order}} />
-        </ContentPanel>
-    {{/if}}
+    <ContentPanel @title={{concat @resource.facilitator.name (t "order.fields.order-details-title")}} @open={{true}} @wrapperClass="bordered-top">
+        <IntegratedOrderDetails @integratedVendor={{@resource.facilitator}} @details={{@resource.meta.integrated_vendor_order}} />
+    </ContentPanel>
+{{/if}}

package/addon/components/order/details/notes.hbs

@@ -1,12 +1,6 @@
 <ContentPanel @title={{t "order.fields.notes-title"}} @isLoading={{@isLoading}} @open={{true}} @actionButtons={{this.actionButtons}} @wrapperClass="bordered-top">
     {{#if this.isEditing}}
-        <Textarea
-            @value={{@resource.notes}}
-            class="form-input w-full"
-            placeholder={{t "order.fields.notes-placeholder"}}
-            rows={{4}}
-            disabled={{cannot-write @resource}}
-        />
+        <Textarea @value={{@resource.notes}} class="form-input w-full" placeholder={{t "order.fields.notes-placeholder"}} rows={{4}} disabled={{cannot-write @resource}} />
         <div class="flex items-center space-x-2">
             <Button
                 @type="primary"

package/addon/components/order/details/route.hbs

@@ -1,11 +1,7 @@
 <ContentPanel @title={{t "order.fields.route-panel-title"}} @open={{true}} @actionButtons={{this.actionButtons}} @wrapperClass="bordered-top">
     {{#if @resource.payload.isMultiDrop}}
         <div>
-            <RouteList
-                @order={{@resource}}
-                @eta={{@resource.eta}}
-                @waypointActions={{hash viewWaypointLabel=(hash label=(t "order.fields.get-label") fn=this.viewWaypointLabel)}}
-            />
+            <RouteList @order={{@resource}} @eta={{@resource.eta}} @waypointActions={{hash viewWaypointLabel=(hash label=(t "order.fields.get-label") fn=this.viewWaypointLabel)}} />
         </div>
     {{else}}
         <div class="grid grid-cols-1 lg:grid-cols-2 gap-4 lg:gap-2">

package/addon/components/order/form/details.hbs

@@ -19,12 +19,7 @@
             </div>
         </InputGroup>
 
-        <InputGroup
-            @name={{t "order.fields.internal-id"}}
-            @value={{@resource.internal_id}}
-            @helpText={{t "order.fields.internal-id-help-text"}}
-            @disabled={{cannot-write @resource}}
-        />
+        <InputGroup @name={{t "order.fields.internal-id"}} @value={{@resource.internal_id}} @helpText={{t "order.fields.internal-id-help-text"}} @disabled={{cannot-write @resource}} />
 
         <InputGroup>
             <InputLabel @labelText={{t "order.fields.schedule"}} @helpText={{t "order.fields.schedule-help-text"}} />
@@ -92,10 +87,7 @@
         </InputGroup>
 
         {{#if (and @resource.facilitator.isIntegratedVendor @resource.facilitator.service_types.length)}}
-            <InputGroup
-                @name={{t "order.fields.service-type"}}
-                @helpText={{concat (t "order.fields.service-type-help-text") @resource.facilitator.name "."}}
-            >
+            <InputGroup @name={{t "order.fields.service-type"}} @helpText={{concat (t "order.fields.service-type-help-text") @resource.facilitator.name "."}}>
                 <Select
                     class="w-full"
                     @options={{@resource.facilitator.service_types}}
@@ -246,4 +238,46 @@
     </div>
 </ContentPanel>
 
+{{! ORCHESTRATOR CONSTRAINTS }}
+<ContentPanel @title="Orchestrator Constraints" @open={{true}} @wrapperClass="bordered-top">
+    <div class="grid grid-cols-1 gap-2 lg:grid-cols-2 lg:gap-2 no-input-group-padding text-xs">
+        <div class="col-span-1 lg:col-span-2 text-[11px] uppercase tracking-wide text-gray-500 font-semibold mt-1">
+            Delivery Window
+        </div>
+        <InputGroup
+            @name="Time Window Start"
+            @helpText="Earliest acceptable arrival time at the delivery location. The date defaults to the order's scheduled date (or creation date if not yet scheduled)."
+        >
+            <DateTimeInput class="form-input" @value={{@resource.time_window_start}} @onUpdate={{fn this.setTimeWindow "time_window_start"}} @disabled={{cannot-write @resource}} />
+        </InputGroup>
+        <InputGroup
+            @name="Time Window End"
+            @helpText="Latest acceptable arrival time at the delivery location. The date defaults to the order's scheduled date (or creation date if not yet scheduled)."
+        >
+            <DateTimeInput class="form-input" @value={{@resource.time_window_end}} @onUpdate={{fn this.setTimeWindow "time_window_end"}} @disabled={{cannot-write @resource}} />
+        </InputGroup>
+        <div class="col-span-1 lg:col-span-2 text-[11px] uppercase tracking-wide text-gray-500 font-semibold mt-3">
+            Requirements & Priority
+        </div>
+        <div class="col-span-1 lg:col-span-2">
+            <InputGroup @name="Required Skills" @helpText="Skills the assigned driver and vehicle must have to fulfil this order.">
+                <MultiSelect
+                    @options={{get-fleet-ops-options "driverSkills"}}
+                    @selected={{@resource.required_skills}}
+                    @onChange={{fn (mut @resource.required_skills)}}
+                    @placeholder="Select required skills…"
+                    @triggerClass="form-select form-input"
+                    @disabled={{cannot-write @resource}}
+                    as |option|
+                >
+                    {{option.label}}
+                </MultiSelect>
+            </InputGroup>
+        </div>
+        <InputGroup @name="Orchestrator Priority" @helpText="Priority score 0–100. Higher values are scheduled first when capacity is constrained. Default is 0.">
+            <Input @value={{@resource.orchestrator_priority}} @type="number" class="form-input w-full" placeholder="0–100" disabled={{cannot-write @resource}} />
+        </InputGroup>
+    </div>
+</ContentPanel>
+
 <Order::Form::CustomFields @resource={{@resource}} @customFields={{this.customFields}} />

package/addon/components/order/form/details.js

@@ -64,6 +64,63 @@ export default class OrderFormDetailsComponent extends Component {
         this.leafletLayerVisibilityManager.showModelLayer(this.args.resource.driver_assigned);
     }
 
+    /**
+     * Resolves the reference date to use when pre-populating the date portion
+     * of a time window field. Prefers scheduled_at, falls back to created_at,
+     * and finally falls back to now so there is always a valid date.
+     *
+     * @returns {Date}
+     */
+    get _timeWindowReferenceDate() {
+        const raw = this.args.resource.scheduled_at ?? this.args.resource.created_at ?? new Date();
+        return raw instanceof Date ? raw : new Date(raw);
+    }
+
+    /**
+     * Called by DateTimeInput @onUpdate for time_window_start and time_window_end.
+     *
+     * When the user picks a time, we preserve their chosen time but replace the
+     * date portion with the order's scheduled_at date (or created_at if
+     * scheduled_at is not set). This means the user only ever needs to set the
+     * time — the date is always contextually correct.
+     *
+     * If the incoming value already carries a different date (e.g. the user
+     * explicitly changed it via the date part of the picker) we respect that
+     * and do not override it.
+     *
+     * @param {'time_window_start'|'time_window_end'} field
+     * @param {Date|string|null} value  Value emitted by DateTimeInput
+     */
+    @action setTimeWindow(field, value) {
+        if (!value) {
+            this.args.resource[field] = null;
+            return;
+        }
+
+        const picked = value instanceof Date ? value : new Date(value);
+        if (isNaN(picked.getTime())) {
+            this.args.resource[field] = value;
+            return;
+        }
+
+        const ref = this._timeWindowReferenceDate;
+
+        // Only inject the reference date when the picked value has no meaningful
+        // date of its own — i.e. when the date portion is the Unix epoch
+        // (1970-01-01), which is what DateTimeInput emits when the user has only
+        // touched the time picker and not the date picker.
+        const isEpochDate = picked.getUTCFullYear() === 1970 && picked.getUTCMonth() === 0 && picked.getUTCDate() === 1;
+
+        if (isEpochDate) {
+            const merged = new Date(ref);
+            merged.setHours(picked.getHours(), picked.getMinutes(), picked.getSeconds(), 0);
+            this.args.resource[field] = merged;
+        } else {
+            // User explicitly set a date — honour it as-is.
+            this.args.resource[field] = picked;
+        }
+    }
+
     @action toggleAdhoc(toggled) {
         this.args.resource.adhoc = toggled;
         this.args.resource.adhoc_distance = this.currentUser.getCompanyOption('fleetops.adhoc_distance', 5000);

package/addon/components/order/form/notes.hbs

@@ -1,11 +1,5 @@
 <ContentPanel @title={{t "order.fields.notes-title"}} @open={{true}} @wrapperClass="bordered-top">
     <div>
-        <Textarea
-            @value={{@resource.notes}}
-            class="form-input w-full"
-            placeholder={{t "order.fields.notes-placeholder"}}
-            disabled={{cannot-write @resource}}
-            rows={{or @rows 4}}
-        />
+        <Textarea @value={{@resource.notes}} class="form-input w-full" placeholder={{t "order.fields.notes-placeholder"}} disabled={{cannot-write @resource}} rows={{or @rows 4}} />
     </div>
 </ContentPanel>

package/addon/components/order/form/payload.hbs

@@ -54,13 +54,7 @@
                                 <h4 class="font-bold dark:text-gray-100">{{group.waypoint.place.address}}</h4>
                             </div>
                             <div>
-                                <Button
-                                    @icon="plus"
-                                    @iconPrefix="fas"
-                                    @text={{t "order.fields.add-item-button"}}
-                                    @size="sm"
-                                    @onClick={{fn this.addEntity group.importId}}
-                                />
+                                <Button @icon="plus" @iconPrefix="fas" @text={{t "order.fields.add-item-button"}} @size="sm" @onClick={{fn this.addEntity group.importId}} />
                             </div>
                         </div>
                         <div class="grid grid-cols-2 lg:grid-cols-3 gap-4 lg:gap-2">

package/addon/components/order/form/route.hbs

@@ -175,11 +175,7 @@
                 </ModelSelect>
 
                 {{#if (and @resource.facilitator.isIntegratedVendor (is-not-facilitator-supported-place @resource.facilitator @resource.payload.pickup))}}
-                    <InfoBlock
-                        class="my-2 px-4 py-1.5 danger"
-                        @blockClass="flex flex-row items-center"
-                        @text={{concat @resource.facilitator.name (t "order.fields.infoblock-text")}}
-                    />
+                    <InfoBlock class="my-2 px-4 py-1.5 danger" @blockClass="flex flex-row items-center" @text={{concat @resource.facilitator.name (t "order.fields.infoblock-text")}} />
                 {{/if}}
 
                 {{#if @resource.payload.pickup.hasInvalidCoordinates}}
@@ -223,11 +219,7 @@
                 </ModelSelect>
 
                 {{#if (and @resource.facilitator.isIntegratedVendor (is-not-facilitator-supported-place @resource.facilitator @resource.payload.dropoff))}}
-                    <InfoBlock
-                        class="my-2 px-4 py-1.5 danger"
-                        @blockClass="flex flex-row items-center"
-                        @text={{concat @resource.facilitator.name (t "order.fields.infoblock-text")}}
-                    />
+                    <InfoBlock class="my-2 px-4 py-1.5 danger" @blockClass="flex flex-row items-center" @text={{concat @resource.facilitator.name (t "order.fields.infoblock-text")}} />
                 {{/if}}
 
                 {{#if @resource.payload.dropoff.hasInvalidCoordinates}}
@@ -264,11 +256,7 @@
                 </ModelSelect>
 
                 {{#if (and @resource.facilitator.isIntegratedVendor (is-not-facilitator-supported-place @resource.facilitator @resource.payload.return))}}
-                    <InfoBlock
-                        class="my-2 px-4 py-1.5 danger"
-                        @blockClass="flex flex-row items-center"
-                        @text={{concat @resource.facilitator.name (t "order.fields.infoblock-text")}}
-                    />
+                    <InfoBlock class="my-2 px-4 py-1.5 danger" @blockClass="flex flex-row items-center" @text={{concat @resource.facilitator.name (t "order.fields.infoblock-text")}} />
                 {{/if}}
 
                 {{#if @resource.payload.return.hasInvalidCoordinates}}

package/addon/components/order/header.hbs

@@ -7,13 +7,7 @@
                     {{@order.public_id}}
                 </h1>
                 <div class="flex flex-row">
-                    <Badge
-                        @status={{@order.status}}
-                        @helpText={{if
-                            (eq @order.status (t "order.header.dispatched"))
-                            (concat (t "order.header.dispatched-at") @order.dispatchedAt)
-                        }}
-                    />
+                    <Badge @status={{@order.status}} @helpText={{if (eq @order.status (t "order.header.dispatched")) (concat (t "order.header.dispatched-at") @order.dispatchedAt)}} />
                     {{#if @order.shouldDisplayDispatchLabel}}
                         <Badge @status="info" class="ml-2" @helpText={{t "order.header.dispatched" htmlSafe=true order=@order.dispatchedAt}}>{{t
                                 "fleet-ops.component.order.header.dispatched"

package/addon/components/order/route-editor.hbs

@@ -20,13 +20,7 @@
                         @isLoading={{this.optimizeRoute.isRunning}}
                     />
                 {{/if}}
-                <Button
-                    @icon="map-marked-alt"
-                    @text={{t "modals.order-route-form.add"}}
-                    @size="sm"
-                    @onClick={{this.addWaypoint}}
-                    @helpText={{t "modals.order-route-form.add-text"}}
-                />
+                <Button @icon="map-marked-alt" @text={{t "modals.order-route-form.add"}} @size="sm" @onClick={{this.addWaypoint}} @helpText={{t "modals.order-route-form.add-text"}} />
             {{/if}}
         </div>
     </div>
@@ -82,12 +76,7 @@
                     <label class="mb-0i">{{t "modals.order-route-form.pickup"}}</label>
 
                     {{#if @resource.payload.pickup}}
-                        <Button
-                            @text={{t "modals.order-route-form.edit-address"}}
-                            @icon="edit"
-                            @size="xs"
-                            @onClick={{fn this.placeActions.modal.edit @resource.payload.pickup}}
-                        />
+                        <Button @text={{t "modals.order-route-form.edit-address"}} @icon="edit" @size="xs" @onClick={{fn this.placeActions.modal.edit @resource.payload.pickup}} />
                     {{/if}}
                 </div>
 
@@ -119,12 +108,7 @@
                     <label class="mb-0i">{{t "modals.order-route-form.dropoff"}}</label>
 
                     {{#if @resource.payload.dropoff}}
-                        <Button
-                            @text={{t "modals.order-route-form.edit-address"}}
-                            @icon="edit"
-                            @size="xs"
-                            @onClick={{fn this.placeActions.modal.edit @resource.payload.dropoff}}
-                        />
+                        <Button @text={{t "modals.order-route-form.edit-address"}} @icon="edit" @size="xs" @onClick={{fn this.placeActions.modal.edit @resource.payload.dropoff}} />
                     {{/if}}
                 </div>
 
@@ -156,12 +140,7 @@
                     <label class="mb-0i">{{t "modals.order-route-form.return"}}</label>
 
                     {{#if @resource.payload.return}}
-                        <Button
-                            @text={{t "modals.order-route-form.edit-address"}}
-                            @icon="edit"
-                            @size="xs"
-                            @onClick={{fn this.placeActions.modal.edit @resource.payload.return}}
-                        />
+                        <Button @text={{t "modals.order-route-form.edit-address"}} @icon="edit" @size="xs" @onClick={{fn this.placeActions.modal.edit @resource.payload.return}} />
                     {{/if}}
                 </div>
 

package/addon/components/order/schedule-card.hbs

@@ -1,60 +1,79 @@
-<div class="order-schedule-card border border-gray-200 dark:border-gray-700" ...attributes>
-    <a href="javascript:;" class="{{@titleClass}} card-title border-b border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-900" {{on "click" (fn this.onTitleClick @order)}}>
-        <span>{{@order.tracking}}</span>
-        <div>
+{{!
+  Order::ScheduleCard
+  Compact sidebar card used in the Scheduler's unscheduled-orders panel.
+  Layout: header row (checkbox + tracking + badge), then a 2-column grid
+  of label/value pairs so everything fits without line-breaking.
+}}
+<div
+    class="order-schedule-card rounded border border-gray-200 dark:border-gray-700 overflow-hidden {{if @selected 'ring-2 ring-indigo-500 border-indigo-400 dark:border-indigo-500'}}"
+    ...attributes
+>
+    {{! ── Header ─────────────────────────────────────────────────────── }}
+    <div class="flex items-center gap-1.5 px-2 py-1.5 bg-gray-50 dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700">
+        {{#if @selectable}}
+            <input
+                type="checkbox"
+                class="form-checkbox h-3.5 w-3.5 rounded text-indigo-600 border-gray-300 dark:border-gray-600 cursor-pointer flex-shrink-0"
+                checked={{@selected}}
+                {{on "click" @onSelect}}
+            />
+        {{/if}}
+        <a
+            href="javascript:;"
+            class="flex-1 min-w-0 truncate text-xs font-semibold text-gray-800 dark:text-gray-100 hover:text-indigo-500 dark:hover:text-indigo-400 {{@titleClass}}"
+            {{on "click" (fn this.onTitleClick @order)}}
+        >
+            {{@order.tracking}}
+        </a>
+        <div class="flex-shrink-0">
             <Badge @status={{@order.status}} />
         </div>
-    </a>
-    <div class="{{@contentClass}} card-content bg-white dark:bg-gray-900 text-sm space-y-2">
-        <div class="flex items-center justify-between">
-            <div class="flex flex-row items-center leading-5">
-                <div class="w-4">
-                    <FaIcon @icon="clock" @size="xs" />
-                </div>
-                <span class="font-semibold">{{t "order.schedule-card.date"}}</span>
-            </div>
-            <span class={{unless @order.scheduled_at "dark:text-gray-600 text-gray-400"}}>{{n-a @order.scheduledAt "Not Scheduled"}}</span>
-        </div>
-        <div class="flex items-center justify-between">
-            <div class="flex flex-row items-center leading-5">
-                <div class="w-4">
-                    <FaIcon @icon="calendar" @size="xs" />
-                </div>
-                <span class="font-semibold">Date created</span>
-            </div>
-            <span>{{n-a @order.createdAtWithTime}}</span>
-        </div>
-        <div class="flex items-center justify-between">
-            <div class="flex flex-row items-center">
-                <div class="w-4">
-                    <FaIcon @icon="id-card-alt" @size="xs" />
-                </div>
-                <span class="font-semibold">{{t "order.schedule-card.driver-assigned"}}</span>
-                <div class="ml-1">
-                    {{#let (cannot "fleet-ops assign-driver-for order") as |unauthorized|}}
-                        <a
-                            href="javascript:;"
-                            class="text-blue-400 text-xs hover:opacity-75 {{if unauthorized 'opacity-50 disabled'}}"
-                            {{on "click" this.startAssignDriver}}
-                            disabled={{unauthorized}}
-                        >
-                            <FaIcon @icon="edit" @size="xs" />
-                        </a>
-                        {{#if unauthorized}}
-                            <Attach::Tooltip @class="clean" @animation="scale" @placement="right">
-                                <InputInfo @text={{t "common.unauthorized"}} />
-                            </Attach::Tooltip>
-                        {{/if}}
-                    {{/let}}
-                </div>
-            </div>
-            <div>
+    </div>
+
+    {{! ── Body — 2-column grid ───────────────────────────────────────── }}
+    <div class="{{@contentClass}} card-content bg-white dark:bg-gray-900 px-2 py-1.5">
+        <dl class="grid grid-cols-[auto_1fr] gap-x-2 gap-y-1 text-xs">
+
+            {{! Scheduled date }}
+            <dt class="flex items-center gap-1 text-gray-500 dark:text-gray-400 whitespace-nowrap">
+                <FaIcon @icon="clock" @size="xs" class="w-3 text-center" />
+                {{t "order.schedule-card.date"}}
+            </dt>
+            <dd class="truncate text-right {{unless @order.scheduled_at 'text-gray-400 dark:text-gray-600'}}">
+                {{n-a @order.scheduledAt (t "scheduler.not-scheduled")}}
+            </dd>
+
+            {{! Created date }}
+            <dt class="flex items-center gap-1 text-gray-500 dark:text-gray-400 whitespace-nowrap">
+                <FaIcon @icon="calendar" @size="xs" class="w-3 text-center" />
+                {{t "order.schedule-card.date-created"}}
+            </dt>
+            <dd class="truncate text-right">
+                {{n-a @order.createdAtWithTime}}
+            </dd>
+
+            {{! Driver }}
+            <dt class="flex items-center gap-1 text-gray-500 dark:text-gray-400 whitespace-nowrap">
+                <FaIcon @icon="id-card-alt" @size="xs" class="w-3 text-center" />
+                {{t "order.schedule-card.driver-assigned"}}
+                {{#let (cannot "fleet-ops assign-driver-for order") as |unauthorized|}}
+                    <a href="javascript:;" class="text-indigo-400 hover:text-indigo-300 {{if unauthorized 'opacity-40 pointer-events-none'}}" {{on "click" this.startAssignDriver}}>
+                        <FaIcon @icon="pen" @size="xs" />
+                    </a>
+                    {{#if unauthorized}}
+                        <Attach::Tooltip @class="clean" @animation="scale" @placement="right">
+                            <InputInfo @text={{t "common.unauthorized"}} />
+                        </Attach::Tooltip>
+                    {{/if}}
+                {{/let}}
+            </dt>
+            <dd class="truncate text-right">
                 {{#if this.isAssigningDriver}}
                     <ModelSelect
                         @modelName="driver"
                         @selectedModel={{@order.driver_assigned}}
                         @placeholder={{t "order.schedule-card.select-driver"}}
-                        @triggerClass="form-select form-input form-input-sm w-48"
+                        @triggerClass="form-select form-input form-input-sm w-full"
                         @infiniteScroll={{false}}
                         @renderInPlace={{true}}
                         @allowClear={{true}}
@@ -63,58 +82,46 @@
                         @permission="fleet-ops assign-driver-for order"
                         as |model|
                     >
-                        <div class="flex flex-row items-center truncate uppercase">
-                            <span class="uppercase mr-1.5">{{model.name}}</span>
-                            <span class="uppercase">{{model.phone}}</span>
-                        </div>
+                        <span class="truncate uppercase text-xs">{{model.name}}</span>
                     </ModelSelect>
                 {{else}}
                     <a
                         href="javascript:;"
                         disabled={{not @order.driver_assigned}}
-                        class={{unless @order.driver_assigned "dark:text-gray-600 text-gray-400"}}
+                        class="truncate {{unless @order.driver_assigned 'text-gray-400 dark:text-gray-600'}}"
                         {{on "click" (fn this.onClickDriver @order.driver_assigned)}}
-                    >{{n-a @order.driver_assigned.name (t "order.schedule-card.no-driver")}}</a>
+                    >
+                        {{n-a @order.driver_assigned.name (t "order.schedule-card.no-driver")}}
+                    </a>
                 {{/if}}
-            </div>
-        </div>
-        <div class="flex items-center justify-between">
-            <div class="flex flex-row items-center leading-5">
-                <div class="w-4">
-                    <FaIcon @icon="car" @size="xs" />
-                </div>
-                <span class="font-semibold">{{t "order.schedule-card.vehicle-assigned"}}</span>
-            </div>
-            {{#if @order.vehicle_assigned}}
-                <a
-                    href="javascript:;"
-                    disabled={{not @order.vehicle_assigned}}
-                    class={{unless @order.vehicle_assigned "dark:text-gray-600 text-gray-400"}}
-                    {{on "click" (fn this.onClickVehicle @order.vehicle_assigned)}}
-                >{{n-a @order.vehicle_assigned.display_name (t "order.schedule-card.no-vehicle")}}</a>
-            {{else if @order.driver_assigned.vehicle}}
-                <a
-                    href="javascript:;"
-                    disabled={{not @order.driver_assigned.vehicle}}
-                    class={{unless @order.driver_assigned.vehicle "dark:text-gray-600 text-gray-400"}}
-                    {{on "click" (fn this.onClickVehicle @order.driver_assigned.vehicle)}}
-                >{{n-a @order.driver_assigned.vehicle_name (t "order.schedule-card.no-vehicle")}}</a>
-            {{else}}
-                <div class="dark:text-gray-600 text-gray-400">{{t "order.schedule-card.no-vehicle"}}</div>
-            {{/if}}
-        </div>
-        <div class="flex items-center justify-between">
-            <div class="flex flex-row items-center leading-5">
-                <div class="w-4">
-                    <FaIcon @icon="location-dot" @size="xs" />
-                </div>
-                <span class="font-semibold">{{t "order.schedule-card.destination"}}</span>
-            </div>
-            <span>{{n-a @order.pickupName}}</span>
-        </div>
-        {{!-- <div class="z-20 relative">
-            <RouteList @order={{@order}} />
-        </div> --}}
+            </dd>
+
+            {{! Vehicle }}
+            <dt class="flex items-center gap-1 text-gray-500 dark:text-gray-400 whitespace-nowrap">
+                <FaIcon @icon="truck" @size="xs" class="w-3 text-center" />
+                {{t "order.schedule-card.vehicle-assigned"}}
+            </dt>
+            <dd class="truncate text-right">
+                {{#if @order.vehicle_assigned}}
+                    <a href="javascript:;" class="truncate" {{on "click" (fn this.onClickVehicle @order.vehicle_assigned)}}>{{@order.vehicle_assigned.display_name}}</a>
+                {{else if @order.driver_assigned.vehicle}}
+                    <a href="javascript:;" class="truncate" {{on "click" (fn this.onClickVehicle @order.driver_assigned.vehicle)}}>{{@order.driver_assigned.vehicle_name}}</a>
+                {{else}}
+                    <span class="text-gray-400 dark:text-gray-600">{{t "order.schedule-card.no-vehicle"}}</span>
+                {{/if}}
+            </dd>
+
+            {{! Destination }}
+            <dt class="flex items-center gap-1 text-gray-500 dark:text-gray-400 whitespace-nowrap">
+                <FaIcon @icon="location-dot" @size="xs" class="w-3 text-center" />
+                {{t "order.schedule-card.destination"}}
+            </dt>
+            <dd class="truncate text-right">
+                {{n-a @order.pickupName}}
+            </dd>
+
+        </dl>
     </div>
+
     {{yield}}
 </div>