@fleetbase/fleetops-engine 0.6.38 → 0.6.39

package/addon/components/fleet-panel/vehicle-listing.hbs

@@ -3,12 +3,7 @@
         <div class="mb-3 flex items-center justify-between">
             <div class="flex items-center">
                 <div class="fleet-vehicle-listing-search">
-                    <Input
-                        @type="text"
-                        {{on "input" this.onInput}}
-                        placeholder={{t "fleet-panel.vehicle-listing.search-vehicle"}}
-                        class="w-64 form-input form-input-sm"
-                    />
+                    <Input @type="text" {{on "input" this.onInput}} placeholder={{t "fleet-panel.vehicle-listing.search-vehicle"}} class="w-64 form-input form-input-sm" />
                 </div>
                 {{#if this.search.isRunning}}
                     <div class="mx-2">

package/addon/components/fuel-report/form.hbs

@@ -77,11 +77,7 @@
                     @disabled={{cannot-write @resource}}
                 />
             </InputGroup>
-            <InputGroup
-                @name={{t "fuel-report.fields.fuel-volume"}}
-                @helpText={{t "fuel-report.fields.select-volume-help-text"}}
-                @wrapperClass="w-full"
-            >
+            <InputGroup @name={{t "fuel-report.fields.fuel-volume"}} @helpText={{t "fuel-report.fields.select-volume-help-text"}} @wrapperClass="w-full">
                 <UnitInput
                     class="w-full"
                     @measurement="volume"

package/addon/components/layout/fleet-ops-sidebar.hbs

@@ -135,44 +135,48 @@
                 >{{if menuItem.intl (t menuItem.intl) menuItem.title}}</Layout::Sidebar::Item>
             {{/if}}
         {{/each}}
-        {{#if (eq menuPanel.routePrefix "settings")}}
-            {{#each this.universeSettingsMenuItems as |menuItem|}}
-                {{#if menuItem.renderComponentInPlace}}
-                    {{component menuItem.component}}
-                {{else}}
-                    <Layout::Sidebar::Item
-                        @onClick={{fn this.universe.transitionMenuItem (concat this.routePrefix "virtual") menuItem}}
-                        @menuItem={{menuItem}}
-                        @icon={{menuItem.icon}}
-                        @iconComponent={{menuItem.iconComponent}}
-                        @iconComponentOptions={{menuItem.iconComponentOptions}}
-                        @iconSize={{menuItem.iconSize}}
-                        @iconPrefix={{menuItem.iconPrefix}}
-                        @iconClass={{menuItem.iconClass}}
-                        @rightSideComponent={{menuItem.rightSideComponent}}
-                        @rightSideComponentContext={{menuItem.rightSideComponentContext}}
-                        @rightSideStatus={{menuItem.rightSideStatus}}
-                        @rightSideStatusText={{menuItem.rightSideStatusText}}
-                        @hideRightSideStatusDot={{menuItem.hideRightSideStatusDot}}
-                        @rightSideStatusClass={{menuItem.rightSideStatusClass}}
-                        @disableRightSideStatusHumanize={{menuItem.disableRightSideStatusHumanize}}
-                        @dropdownButton={{menuItem.dropdownButton}}
-                        @dropdownButtonActions={{menuItem.dropdownButtonActions}}
-                        @dropdownButtonIcon={{menuItem.dropdownButtonIcon}}
-                        @dropdownButtonIconPrefix={{menuItem.dropdownButtonIconPrefix}}
-                        @dropdownButtonText={{menuItem.dropdownButtonText}}
-                        @dropdownButtonCalculatePosition={{menuItem.dropdownButtonCalculatePosition}}
-                        @dropdownButtonRenderInPlace={{menuItem.dropdownButtonRenderInPlace}}
-                        @dropdownButtonMenuLabel={{menuItem.dropdownButtonMenuLabel}}
-                        @dropdownButtonWrapperClass={{menuItem.dropdownButtonWrapperClass}}
-                        @dropdownButtonTriggerClass={{menuItem.dropdownButtonTriggerClass}}
-                        @registerDropdownButtonAPI={{menuItem.registerDropdownButtonAPI}}
-                        @permission={{menuItem.permission}}
-                        @visible={{menuItem.visible}}
-                    >{{if menuItem.intl (t menuItem.intl) menuItem.title}}</Layout::Sidebar::Item>
+        {{#let (array "operations" "management" "connectivity" "maintenance" "analytics" "settings") as |sectionsToRender|}}
+            {{#each sectionsToRender as |section|}}
+                {{#if (eq menuPanel.routePrefix section)}}
+                    {{#each (get this (concat "universe" (capitalize section) "MenuItems")) as |menuItem|}}
+                        {{#if menuItem.renderComponentInPlace}}
+                            {{component menuItem.component}}
+                        {{else}}
+                            <Layout::Sidebar::Item
+                                @onClick={{fn this.universe.transitionMenuItem (concat this.routePrefix "virtual") menuItem}}
+                                @menuItem={{menuItem}}
+                                @icon={{menuItem.icon}}
+                                @iconComponent={{menuItem.iconComponent}}
+                                @iconComponentOptions={{menuItem.iconComponentOptions}}
+                                @iconSize={{menuItem.iconSize}}
+                                @iconPrefix={{menuItem.iconPrefix}}
+                                @iconClass={{menuItem.iconClass}}
+                                @rightSideComponent={{menuItem.rightSideComponent}}
+                                @rightSideComponentContext={{menuItem.rightSideComponentContext}}
+                                @rightSideStatus={{menuItem.rightSideStatus}}
+                                @rightSideStatusText={{menuItem.rightSideStatusText}}
+                                @hideRightSideStatusDot={{menuItem.hideRightSideStatusDot}}
+                                @rightSideStatusClass={{menuItem.rightSideStatusClass}}
+                                @disableRightSideStatusHumanize={{menuItem.disableRightSideStatusHumanize}}
+                                @dropdownButton={{menuItem.dropdownButton}}
+                                @dropdownButtonActions={{menuItem.dropdownButtonActions}}
+                                @dropdownButtonIcon={{menuItem.dropdownButtonIcon}}
+                                @dropdownButtonIconPrefix={{menuItem.dropdownButtonIconPrefix}}
+                                @dropdownButtonText={{menuItem.dropdownButtonText}}
+                                @dropdownButtonCalculatePosition={{menuItem.dropdownButtonCalculatePosition}}
+                                @dropdownButtonRenderInPlace={{menuItem.dropdownButtonRenderInPlace}}
+                                @dropdownButtonMenuLabel={{menuItem.dropdownButtonMenuLabel}}
+                                @dropdownButtonWrapperClass={{menuItem.dropdownButtonWrapperClass}}
+                                @dropdownButtonTriggerClass={{menuItem.dropdownButtonTriggerClass}}
+                                @registerDropdownButtonAPI={{menuItem.registerDropdownButtonAPI}}
+                                @permission={{menuItem.permission}}
+                                @visible={{menuItem.visible}}
+                            >{{if menuItem.intl (t menuItem.intl) menuItem.title}}</Layout::Sidebar::Item>
+                        {{/if}}
+                    {{/each}}
                 {{/if}}
             {{/each}}
-        {{/if}}
+        {{/let}}
     </Layout::Sidebar::Panel>
 {{/each}}
 {{#each this.universeMenuPanels as |menuPanel|}}

package/addon/components/layout/fleet-ops-sidebar.js

@@ -15,6 +15,11 @@ export default class LayoutFleetOpsSidebarComponent extends Component {
     @tracked routePrefix = 'console.fleet-ops.';
     @tracked menuPanels = [];
     @tracked universeMenuItems = [];
+    @tracked universeOperationsMenuItems = [];
+    @tracked universeManagementMenuItems = [];
+    @tracked universeConnectivityMenuItems = [];
+    @tracked universeMaintenanceMenuItems = [];
+    @tracked universeAnalyticsMenuItems = [];
     @tracked universeSettingsMenuItems = [];
     @tracked universeMenuPanels = [];
 
@@ -26,8 +31,14 @@ export default class LayoutFleetOpsSidebarComponent extends Component {
 
     createMenuItemsFromUniverseRegistry() {
         const registeredMenuItems = this.menuService.getMenuItems('engine:fleet-ops');
+        console.log('Registered menu items for engine:fleet-ops:', registeredMenuItems);
         this.universeMenuPanels = this.menuService.getMenuPanels('engine:fleet-ops');
         this.universeMenuItems = registeredMenuItems.filter((menuItem) => menuItem.section === undefined);
+        this.universeOperationsMenuItems = registeredMenuItems.filter((menuItem) => menuItem.section === 'operations');
+        this.universeManagementMenuItems = registeredMenuItems.filter((menuItem) => menuItem.section === 'management');
+        this.universeMaintenanceMenuItems = registeredMenuItems.filter((menuItem) => menuItem.section === 'maintenance');
+        this.universeConnectivityMenuItems = registeredMenuItems.filter((menuItem) => menuItem.section === 'connectivity');
+        this.universeAnalyticsMenuItems = registeredMenuItems.filter((menuItem) => menuItem.section === 'analytics');
         this.universeSettingsMenuItems = registeredMenuItems.filter((menuItem) => menuItem.section === 'settings');
     }
 
@@ -43,12 +54,12 @@ export default class LayoutFleetOpsSidebarComponent extends Component {
                 visible: this.abilities.can('fleet-ops see order'),
             },
             {
-                intl: 'menu.service-rates',
-                title: this.intl.t('menu.service-rates'),
-                icon: 'file-invoice-dollar',
-                route: 'operations.service-rates',
-                permission: 'fleet-ops list service-rate',
-                visible: this.abilities.can('fleet-ops see service-rate'),
+                intl: 'menu.orchestrator',
+                title: this.intl.t('menu.orchestrator'),
+                icon: 'circle-nodes',
+                route: 'operations.orchestrator',
+                permission: 'fleet-ops list order',
+                visible: this.abilities.can('fleet-ops see order'),
             },
             {
                 intl: 'menu.scheduler',
@@ -66,6 +77,14 @@ export default class LayoutFleetOpsSidebarComponent extends Component {
                 permission: 'fleet-ops list order-config',
                 visible: this.abilities.can('fleet-ops see order-config'),
             },
+            {
+                intl: 'menu.service-rates',
+                title: this.intl.t('menu.service-rates'),
+                icon: 'file-invoice-dollar',
+                route: 'operations.service-rates',
+                permission: 'fleet-ops list service-rate',
+                visible: this.abilities.can('fleet-ops see service-rate'),
+            },
         ];
 
         const resourcesItems = [
@@ -183,6 +202,14 @@ export default class LayoutFleetOpsSidebarComponent extends Component {
         ];
 
         const maintenanceItems = [
+            {
+                intl: 'menu.schedules',
+                title: this.intl.t('menu.schedules'),
+                icon: 'calendar-alt',
+                route: 'maintenance.schedules',
+                permission: 'fleet-ops list maintenance-schedule',
+                visible: this.abilities.can('fleet-ops see maintenance-schedule'),
+            },
             {
                 intl: 'menu.work-orders',
                 title: this.intl.t('menu.work-orders'),
@@ -191,6 +218,14 @@ export default class LayoutFleetOpsSidebarComponent extends Component {
                 permission: 'fleet-ops list work-order',
                 visible: this.abilities.can('fleet-ops see work-order'),
             },
+            {
+                intl: 'menu.maintenances',
+                title: this.intl.t('menu.maintenances'),
+                icon: 'history',
+                route: 'maintenance.maintenances',
+                permission: 'fleet-ops list maintenance',
+                visible: this.abilities.can('fleet-ops see maintenance'),
+            },
             {
                 intl: 'menu.equipment',
                 title: this.intl.t('menu.equipment'),
@@ -253,6 +288,22 @@ export default class LayoutFleetOpsSidebarComponent extends Component {
                 permission: 'fleet-ops view routing-settings',
                 visible: this.abilities.can('fleet-ops see routing-settings'),
             },
+            {
+                intl: 'menu.orchestrator',
+                title: this.intl.t('menu.orchestrator'),
+                icon: 'circle-nodes',
+                route: 'settings.orchestrator',
+                permission: 'fleet-ops view routing-settings',
+                visible: this.abilities.can('fleet-ops see routing-settings'),
+            },
+            {
+                intl: 'menu.scheduling',
+                title: this.intl.t('menu.scheduling'),
+                icon: 'calendar-days',
+                route: 'settings.scheduling',
+                permission: 'fleet-ops view scheduling-settings',
+                visible: this.abilities.can('fleet-ops see scheduling-settings'),
+            },
             {
                 intl: 'menu.custom-fields',
                 title: this.intl.t('menu.custom-fields'),
@@ -289,10 +340,10 @@ export default class LayoutFleetOpsSidebarComponent extends Component {
                 open: this.appCache.get('fleet-ops:sidebar:management:open', true),
                 onToggle: (open) => this.appCache.set('fleet-ops:sidebar:management:open', open),
             }),
-            // createPanel('menu.maintenance', 'maintenance', maintenanceItems, {
-            //     open: this.appCache.get('fleet-ops:sidebar:maintenance:open', false),
-            //     onToggle: (open) => this.appCache.set('fleet-ops:sidebar:maintenance:open', open),
-            // }),
+            createPanel('menu.maintenance', 'maintenance', maintenanceItems, {
+                open: this.appCache.get('fleet-ops:sidebar:maintenance:open', false),
+                onToggle: (open) => this.appCache.set('fleet-ops:sidebar:maintenance:open', open),
+            }),
             createPanel('menu.connectivity', 'connectivity', connectivityItems, {
                 open: this.appCache.get('fleet-ops:sidebar:connectivity:open', false),
                 onToggle: (open) => this.appCache.set('fleet-ops:sidebar:connectivity:open', open),

package/addon/components/maintenance/cost-panel.hbs

@@ -0,0 +1,176 @@
+{{! ===== COST PANEL — invoice-style line items ===== }}
+<ContentPanel @title="Costs" @open={{true}} @wrapperClass="bordered-top">
+
+    {{! ── Currency selector (single, shared by all money fields) ── }}
+    <div class="grid grid-cols-1 gap-2 lg:grid-cols-2 lg:gap-2 no-input-group-padding text-xs mb-2">
+        <InputGroup @name="Currency">
+            <CurrencySelect @currency={{@resource.currency}} @onCurrencyChange={{fn (mut @resource.currency)}} @triggerClass="w-full form-select" @disabled={{this.isDisabled}} />
+        </InputGroup>
+    </div>
+
+    {{! ── Labour & Tax inputs (always editable on the form) ── }}
+    <div class="grid grid-cols-1 gap-2 lg:grid-cols-2 lg:gap-2 no-input-group-padding text-xs mb-4">
+        <InputGroup @name="Labour Cost">
+            <MoneyInput class="w-full" @value={{@resource.labor_cost}} @currency={{this.currency}} @onChange={{fn (mut @resource.labor_cost)}} @disabled={{this.isDisabled}} />
+        </InputGroup>
+        <InputGroup @name="Tax">
+            <MoneyInput class="w-full" @value={{@resource.tax}} @currency={{this.currency}} @onChange={{fn (mut @resource.tax)}} @disabled={{this.isDisabled}} />
+        </InputGroup>
+    </div>
+
+    {{! ── Line items table ── }}
+    <div class="text-[11px] uppercase tracking-wide text-gray-500 dark:text-gray-400 font-semibold mb-2">
+        Parts &amp; Services
+    </div>
+
+    <table class="w-full text-xs border-collapse mb-2 table-fixed">
+        <colgroup>
+            <col class="w-[45%]" />
+            <col class="w-[10%]" />
+            <col class="w-[20%]" />
+            <col class="w-[15%]" />
+            {{#unless this.isDisabled}}
+                <col class="w-[10%]" />
+            {{/unless}}
+        </colgroup>
+        <thead>
+            <tr class="border-b border-gray-200 dark:border-gray-700 text-gray-500 dark:text-gray-400 text-left">
+                <th class="pb-1 pr-2 font-medium">Description</th>
+                <th class="pb-1 pr-2 font-medium text-right">Qty</th>
+                <th class="pb-1 pr-2 font-medium text-right">Unit Cost</th>
+                <th class="pb-1 pr-2 font-medium text-right">Total</th>
+                {{#unless this.isDisabled}}
+                    <th class="pb-1"></th>
+                {{/unless}}
+            </tr>
+        </thead>
+        <tbody>
+            {{#each this.lineItems as |item index|}}
+                {{#if (eq this.editingIndex index)}}
+                    {{! ── Inline edit row ── }}
+                    <tr class="border-b border-gray-100 dark:border-gray-800">
+                        <td class="py-1 pr-2">
+                            <Input @value={{this.draftDescription}} class="form-input w-full text-xs" placeholder="Description" />
+                        </td>
+                        <td class="py-1 pr-2">
+                            <Input @value={{this.draftQuantity}} @type="number" class="form-input w-full text-xs text-right" min="0" />
+                        </td>
+                        <td class="py-1 pr-2">
+                            <MoneyInput class="w-full" @value={{this.draftUnitCost}} @currency={{this.currency}} @onChange={{this.setDraftUnitCost}} />
+                        </td>
+                        <td class="py-1 pr-2 text-right text-gray-500 dark:text-gray-400">
+                            {{format-currency this.draftLineTotal this.currency}}
+                        </td>
+                        <td class="py-1">
+                            <div class="flex items-center space-x-1">
+                                <Button @size="xs" @type="primary" @onClick={{this.saveEdit}} class="px-2 py-0.5">
+                                    Save
+                                </Button>
+                                <Button @size="xs" @type="default" @onClick={{this.cancelEdit}} class="px-2 py-0.5">
+                                    Cancel
+                                </Button>
+                            </div>
+                        </td>
+                    </tr>
+                {{else}}
+                    {{! ── Read row ── }}
+                    <tr class="border-b border-gray-100 dark:border-gray-800 hover:bg-gray-50 dark:hover:bg-gray-800/40 group">
+                        <td class="py-1.5 pr-2 text-gray-800 dark:text-gray-200 truncate">{{item.description}}</td>
+                        <td class="py-1.5 pr-2 text-right text-gray-600 dark:text-gray-400">{{item.quantity}}</td>
+                        <td class="py-1.5 pr-2 text-right text-gray-600 dark:text-gray-400">
+                            {{format-currency (this._toCents item.unit_cost) this.currency}}
+                        </td>
+                        <td class="py-1.5 pr-2 text-right font-medium text-gray-800 dark:text-gray-200">
+                            {{format-currency (this.lineTotal item) this.currency}}
+                        </td>
+                        {{#unless this.isDisabled}}
+                            <td class="py-1.5">
+                                <div class="flex items-center space-x-1 opacity-0 group-hover:opacity-100 transition-opacity">
+                                    <button
+                                        type="button"
+                                        class="text-gray-400 hover:text-blue-500 dark:hover:text-blue-400 transition-colors"
+                                        title="Edit"
+                                        {{on "click" (fn this.startEdit index)}}
+                                    >
+                                        <FaIcon @icon="pencil" @size="xs" />
+                                    </button>
+                                    <button
+                                        type="button"
+                                        class="text-gray-400 hover:text-red-500 dark:hover:text-red-400 transition-colors"
+                                        title="Remove"
+                                        {{on "click" (fn this.removeLineItem index)}}
+                                    >
+                                        <FaIcon @icon="trash" @size="xs" />
+                                    </button>
+                                </div>
+                            </td>
+                        {{/unless}}
+                    </tr>
+                {{/if}}
+            {{/each}}
+
+            {{! ── Add new item row ── }}
+            {{#if this.isAddingItem}}
+                <tr class="border-b border-gray-100 dark:border-gray-800">
+                    <td class="py-1 pr-2">
+                        <Input @value={{this.draftDescription}} class="form-input w-full text-xs" placeholder="Description" />
+                    </td>
+                    <td class="py-1 pr-2">
+                        <Input @value={{this.draftQuantity}} @type="number" class="form-input w-full text-xs text-right" min="0" />
+                    </td>
+                    <td class="py-1 pr-2">
+                        <MoneyInput class="w-full" @value={{this.draftUnitCost}} @currency={{this.currency}} @onChange={{this.setDraftUnitCost}} />
+                    </td>
+                    <td class="py-1 pr-2 text-right text-gray-500 dark:text-gray-400">
+                        {{format-currency this.draftLineTotal this.currency}}
+                    </td>
+                    <td class="py-1">
+                        <div class="flex items-center space-x-1">
+                            <Button @size="xs" @type="primary" @onClick={{this.addLineItem}} class="px-2 py-0.5">
+                                Add
+                            </Button>
+                            <Button @size="xs" @type="default" @onClick={{this.cancelAdd}} class="px-2 py-0.5">
+                                Cancel
+                            </Button>
+                        </div>
+                    </td>
+                </tr>
+            {{/if}}
+        </tbody>
+    </table>
+
+    {{! ── Add item button ── }}
+    {{#unless this.isDisabled}}
+        {{#unless this.isAddingItem}}
+            <button
+                type="button"
+                class="flex items-center space-x-1 text-xs text-blue-500 hover:text-blue-600 dark:text-blue-400 dark:hover:text-blue-300 font-medium mb-3 transition-colors"
+                {{on "click" this.showAddRow}}
+            >
+                <FaIcon @icon="plus" @size="xs" />
+                <span>Add line item</span>
+            </button>
+        {{/unless}}
+    {{/unless}}
+
+    {{! ── Totals summary ── }}
+    <div class="border-t border-gray-200 dark:border-gray-700 pt-2 mt-1 space-y-1 text-xs">
+        <div class="flex justify-between text-gray-500 dark:text-gray-400">
+            <span>Labour</span>
+            <span>{{format-currency this.laborCost this.currency}}</span>
+        </div>
+        <div class="flex justify-between text-gray-500 dark:text-gray-400">
+            <span>Parts</span>
+            <span>{{format-currency this.partsCost this.currency}}</span>
+        </div>
+        <div class="flex justify-between text-gray-500 dark:text-gray-400">
+            <span>Tax</span>
+            <span>{{format-currency this.tax this.currency}}</span>
+        </div>
+        <div class="flex justify-between font-semibold text-gray-800 dark:text-gray-100 border-t border-gray-200 dark:border-gray-700 pt-1 mt-1">
+            <span>Total</span>
+            <span>{{format-currency this.totalCost this.currency}}</span>
+        </div>
+    </div>
+
+</ContentPanel>

package/addon/components/maintenance/cost-panel.js

@@ -0,0 +1,241 @@
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { action } from '@ember/object';
+import { inject as service } from '@ember/service';
+import { isArray } from '@ember/array';
+import numbersOnly from '@fleetbase/ember-core/utils/numbers-only';
+
+/**
+ * `Maintenance::CostPanel`
+ *
+ * Renders an invoice-style line items editor for a maintenance record.
+ *
+ * Line items are stored in the `line_items` JSON column on the maintenance
+ * record (`@attr('raw')`). Mutations are purely in-memory — the array is
+ * written back onto `@resource.line_items` and the parent form's normal
+ * save flow persists everything together in a single request. This means
+ * the component works correctly for both new (unsaved) and existing records.
+ *
+ * All monetary values (unit_cost, labor_cost, tax, parts_cost, total_cost)
+ * are stored as **cents** (integers) on the backend via the Money::class cast
+ * and surfaced as strings by `@attr('string')` on the Ember model. The
+ * `numbersOnly()` utility strips any non-digit characters and `parseInt`
+ * converts to a safe integer before arithmetic.
+ *
+ * The `MoneyInput` component handles the cents ↔ display conversion:
+ *   - `@value` receives cents (e.g. 1000 = $10.00)
+ *   - `@onChange` emits cents (e.g. 1000 = $10.00)
+ *
+ * Usage:
+ *   <Maintenance::CostPanel @resource={{this.maintenance}} @disabled={{cannot-write this.maintenance}} />
+ */
+export default class MaintenanceCostPanelComponent extends Component {
+    @service notifications;
+    @service intl;
+
+    /** Whether the "Add line item" row is currently visible */
+    @tracked isAddingItem = false;
+
+    /** Tracks which line item index is currently being edited (null = none) */
+    @tracked editingIndex = null;
+
+    /**
+     * Draft values for the add/edit form row.
+     * `draftUnitCost` is stored in **cents** (integer) to match the backend
+     * Money::class cast and the MoneyInput component's expected input/output format.
+     */
+    @tracked draftDescription = '';
+    @tracked draftQuantity = 1;
+    @tracked draftUnitCost = 0;
+
+    // ─── Helpers ─────────────────────────────────────────────────────────────
+
+    /**
+     * Safely parse a monetary string attribute (cents stored as string) to int.
+     */
+    @action _toCents(value) {
+        if (value === null || value === undefined || value === '') return 0;
+        const parsed = parseInt(numbersOnly(String(value)), 10);
+        return isNaN(parsed) ? 0 : parsed;
+    }
+
+    // ─── Computed getters ─────────────────────────────────────────────────────
+
+    get lineItems() {
+        return isArray(this.args.resource?.line_items) ? this.args.resource.line_items : [];
+    }
+
+    get currency() {
+        return this.args.resource?.currency ?? 'USD';
+    }
+
+    get laborCost() {
+        return this._toCents(this.args.resource?.labor_cost);
+    }
+
+    get tax() {
+        return this._toCents(this.args.resource?.tax);
+    }
+
+    get partsCost() {
+        return this.lineItems.reduce((sum, item) => {
+            const qty = parseInt(item.quantity, 10) || 0;
+            const cost = this._toCents(item.unit_cost);
+            return sum + qty * cost;
+        }, 0);
+    }
+
+    get totalCost() {
+        return this.laborCost + this.partsCost + this.tax;
+    }
+
+    /**
+     * Live preview of the draft line total (in cents).
+     * Displayed via `format-currency` which also expects cents.
+     */
+    get draftLineTotal() {
+        return (parseInt(this.draftQuantity, 10) || 0) * this._toCents(this.draftUnitCost);
+    }
+
+    get isDisabled() {
+        return this.args.disabled ?? false;
+    }
+
+    // ─── Draft unit cost setter ───────────────────────────────────────────────
+
+    /**
+     * Called by MoneyInput's `@onChange`. The value is already in cents.
+     */
+    @action
+    setDraftUnitCost(cents) {
+        this.draftUnitCost = cents ?? 0;
+    }
+
+    // ─── Line item helpers ────────────────────────────────────────────────────
+
+    /**
+     * Returns the line total for a single item (quantity × unit_cost).
+     * Both values are in cents, so the result is also in cents.
+     * Used in the template as (this.lineTotal item).
+     */
+    @action
+    lineTotal(item) {
+        const qty = parseInt(item?.quantity, 10) || 0;
+        const cost = this._toCents(item?.unit_cost);
+        return qty * cost;
+    }
+
+    /**
+     * Write a new copy of the line items array back onto the resource so
+     * Ember Data tracks the change and includes it in the next save().
+     */
+    _commitItems(items) {
+        this.args.resource.set('line_items', [...items]);
+        // Recompute parts_cost and total_cost locally so the summary updates
+        // immediately without waiting for a server round-trip.
+        const partsCost = items.reduce((sum, item) => {
+            return sum + (parseInt(item.quantity, 10) || 0) * this._toCents(item.unit_cost);
+        }, 0);
+        this.args.resource.set('parts_cost', String(partsCost));
+        this.args.resource.set('total_cost', String(this.laborCost + partsCost + this.tax));
+    }
+
+    // ─── Add item ────────────────────────────────────────────────────────────
+
+    @action
+    showAddRow() {
+        this.isAddingItem = true;
+        this.editingIndex = null;
+        this._resetDraft();
+    }
+
+    @action
+    cancelAdd() {
+        this.isAddingItem = false;
+        this._resetDraft();
+    }
+
+    @action
+    addLineItem() {
+        if (!this.draftDescription?.trim()) {
+            this.notifications.warning('Please enter a description for the line item.');
+            return;
+        }
+
+        const newItem = {
+            description: this.draftDescription.trim(),
+            quantity: parseInt(this.draftQuantity, 10) || 1,
+            unit_cost: this.draftUnitCost,
+            currency: this.currency,
+        };
+
+        this._commitItems([...this.lineItems, newItem]);
+        this.isAddingItem = false;
+        this._resetDraft();
+    }
+
+    // ─── Edit item ───────────────────────────────────────────────────────────
+
+    @action
+    startEdit(index) {
+        const item = this.lineItems[index];
+        if (!item) return;
+        this.editingIndex = index;
+        this.isAddingItem = false;
+        this.draftDescription = item.description ?? '';
+        this.draftQuantity = item.quantity ?? 1;
+        // unit_cost from the record is already in cents
+        this.draftUnitCost = this._toCents(item.unit_cost);
+    }
+
+    @action
+    cancelEdit() {
+        this.editingIndex = null;
+        this._resetDraft();
+    }
+
+    @action
+    saveEdit() {
+        if (!this.draftDescription?.trim()) {
+            this.notifications.warning('Please enter a description for the line item.');
+            return;
+        }
+
+        const index = this.editingIndex;
+        const updatedItems = this.lineItems.map((item, i) => {
+            if (i !== index) return item;
+            return {
+                ...item,
+                description: this.draftDescription.trim(),
+                quantity: parseInt(this.draftQuantity, 10) || 1,
+                unit_cost: this.draftUnitCost,
+                currency: this.currency,
+            };
+        });
+
+        this._commitItems(updatedItems);
+        this.editingIndex = null;
+        this._resetDraft();
+    }
+
+    // ─── Remove item ─────────────────────────────────────────────────────────
+
+    @action
+    removeLineItem(index) {
+        const updatedItems = this.lineItems.filter((_, i) => i !== index);
+        this._commitItems(updatedItems);
+        // If we were editing this item, close the edit row
+        if (this.editingIndex === index) {
+            this.editingIndex = null;
+            this._resetDraft();
+        }
+    }
+
+    // ─── Private helpers ─────────────────────────────────────────────────────
+
+    _resetDraft() {
+        this.draftDescription = '';
+        this.draftQuantity = 1;
+        this.draftUnitCost = 0;
+    }
+}