@fleetbase/fleetops-engine 0.6.11 → 0.6.13

package/addon/components/customer/orders.js

@@ -6,8 +6,7 @@ import { isArray } from '@ember/array';
 import { later } from '@ember/runloop';
 import { debug } from '@ember/debug';
 import { task, timeout } from 'ember-concurrency';
-import { OSRMv1, Control as RoutingControl } from '@fleetbase/leaflet-routing-machine';
-import getRoutingHost from '@fleetbase/ember-core/utils/get-routing-host';
+import { Control as RoutingControl } from '@fleetbase/leaflet-routing-machine';
 import engineService from '@fleetbase/ember-core/decorators/engine-service';
 import registerComponent from '@fleetbase/ember-core/utils/register-component';
 import OrderProgressCardComponent from '../order-progress-card';
@@ -26,6 +25,7 @@ export default class CustomerOrdersComponent extends Component {
     @service modalsManager;
     @service customerSession;
     @service hostRouter;
+    @service leafletRouterControl;
     @engineService('@fleetbase/fleetops-engine') movementTracker;
     @engineService('@fleetbase/fleetops-engine') location;
     @tracked orders = [];
@@ -226,7 +226,6 @@ export default class CustomerOrdersComponent extends Component {
 
     @action displayOrderRoute() {
         const waypoints = this.getRouteCoordinatesFromOrder(this.selectedOrder);
-        const routingHost = getRoutingHost();
         if (this.cannotRouteWaypoints(waypoints)) {
             return;
         }
@@ -240,15 +239,14 @@ export default class CustomerOrdersComponent extends Component {
             debug(`Leaflet Map Error: ${error.message}`);
         }
 
-        const router = new OSRMv1({
-            serviceUrl: `${routingHost}/route/v1`,
-            profile: 'driving',
-        });
+        const routingService = this.currentUser.getOption('routing', { router: 'osrm' }).router;
+        const { router, formatter } = this.leafletRouterControl.get(routingService);
 
         this.routeControl = new RoutingControl({
-            fitSelectedRoutes: false,
             router,
+            formatter,
             waypoints,
+            fitSelectedRoutes: false,
             alternativeClassName: 'hidden',
             addWaypoints: false,
             markerOptions: {

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

@@ -162,6 +162,14 @@ export default class LayoutFleetOpsSidebarComponent extends Component {
                 permission: 'fleet-ops view notification-settings',
                 visible: this.abilities.can('fleet-ops see notification-settings'),
             },
+            {
+                intl: 'fleet-ops.component.layout.fleet-ops-sidebar.routing',
+                title: this.intl.t('fleet-ops.component.layout.fleet-ops-sidebar.routing'),
+                icon: 'route',
+                route: 'settings.routing',
+                permission: 'fleet-ops view routing-settings',
+                visible: this.abilities.can('fleet-ops see routing-settings'),
+            },
         ];
 
         const createPanel = (intl, routePrefix, items = []) => ({

package/addon/components/leaflet-tracking-marker.js

@@ -1,6 +1,16 @@
 import MarkerLayer from 'ember-leaflet/components/marker-layer';
 import { isArray } from '@ember/array';
 
+const __draggingHotfix = (layer) => {
+    if (!layer.dragging) {
+        layer.dragging = {
+            enabled: () => false,
+            enable: () => (layer.options.draggable = true),
+            disable: () => (layer.options.draggable = false),
+        };
+    }
+};
+
 const arrayFromLatLng = (latlng) => {
     if (isArray(latlng)) {
         return latlng;
@@ -52,6 +62,7 @@ L.TrackingMarker = L.Marker.extend({
         this._slideKeepAtCenter = false;
         this._slideDraggingWasAllowed = false;
         this._slideFrame = 0;
+        __draggingHotfix(this);
     },
 
     slideTo: function (latlng, options = {}) {
@@ -69,6 +80,7 @@ L.TrackingMarker = L.Marker.extend({
         this._nextPosition = arrayFromLatLng(latlng);
         this._slideKeepAtCenter = !!options.keepAtCenter;
         this._slideDraggingWasAllowed = this._slideDraggingWasAllowed !== undefined ? this._slideDraggingWasAllowed : this._map.dragging.enabled();
+        __draggingHotfix(this);
 
         if (this._slideKeepAtCenter) {
             this._map.dragging.disable();
@@ -245,6 +257,13 @@ export default class LeafletTrackingMarkerComponent extends MarkerLayer {
      */
     rotationAngle = 0;
 
+    /**
+     * Default value for the draggable prop.
+     *
+     * @memberof LeafletTrackingMarkerComponent
+     */
+    draggable = false;
+
     getOption(key, defaultValue = null) {
         const value = this.options[key] ?? this[key];
         if (value === undefined) {

package/addon/components/live-map.hbs

@@ -38,6 +38,7 @@
                         @icon={{icon iconUrl=driver.vehicle_avatar iconSize=(array 24 24)}}
                         @onAdd={{fn this.triggerAction "onDriverAdded" driver}}
                         @onClick={{fn this.triggerAction "onDriverClicked" driver}}
+                        @draggable={{false}}
                         as |marker|
                     >
                         <marker.popup @maxWidth="500" @minWidth="225">
@@ -77,6 +78,7 @@
                             @icon={{icon iconUrl=driver.vehicle_avatar iconSize=(array 24 24)}}
                             @onAdd={{fn this.triggerAction "onDriverAdded" driver}}
                             @onClick={{fn this.triggerAction "onDriverClicked" driver}}
+                            @draggable={{false}}
                             as |marker|
                         >
                             <marker.popup @maxWidth="500" @minWidth="225">
@@ -114,6 +116,7 @@
                             @icon={{icon iconUrl=vehicle.avatar_url iconSize=(array 24 24)}}
                             @onAdd={{fn this.triggerAction "onVehicleAdded" vehicle}}
                             @onClick={{fn this.triggerAction "onVehicleClicked" vehicle}}
+                            @draggable={{false}}
                             as |marker|
                         >
                             <marker.popup @permanent={{false}} @sticky={{true}}>
@@ -150,6 +153,7 @@
                             @icon={{icon iconUrl=vehicle.avatar_url iconSize=(array 24 24)}}
                             @onAdd={{fn this.triggerAction "onVehicleAdded" vehicle}}
                             @onClick={{fn this.triggerAction "onVehicleClicked" vehicle}}
+                            @draggable={{false}}
                             as |marker|
                         >
                             <marker.popup @permanent={{false}} @sticky={{true}}>
@@ -189,6 +193,7 @@
                             @alt={{place.address}}
                             @onAdd={{fn this.triggerAction "onPlaceAdded" place}}
                             @onClick={{fn this.triggerAction "onPlaceClicked" place}}
+                            @draggable={{false}}
                             as |marker|
                         >
                             <marker.popup>

package/addon/components/live-map.js

@@ -9,8 +9,7 @@ import { later } from '@ember/runloop';
 import { debug } from '@ember/debug';
 import { allSettled } from 'rsvp';
 import { task } from 'ember-concurrency';
-import { OSRMv1, Control as RoutingControl } from '@fleetbase/leaflet-routing-machine';
-import getRoutingHost from '@fleetbase/ember-core/utils/get-routing-host';
+import { Control as RoutingControl } from '@fleetbase/leaflet-routing-machine';
 import getWithDefault from '@fleetbase/ember-core/utils/get-with-default';
 
 /**
@@ -37,6 +36,7 @@ export default class LiveMapComponent extends Component {
     @service contextPanel;
     @service leafletMapManager;
     @service leafletContextmenuManager;
+    @service leafletRouterControl;
     @service theme;
 
     /**
@@ -1126,7 +1126,6 @@ export default class LiveMapComponent extends Component {
 
         // create order route preview
         const waypoints = this.getRouteCoordinatesFromOrder(order);
-        const routingHost = getRoutingHost();
         if (this.cannotRouteWaypoints(waypoints)) {
             return;
         }
@@ -1140,15 +1139,14 @@ export default class LiveMapComponent extends Component {
             debug(`Leaflet Map Error: ${error.message}`);
         }
 
-        const router = new OSRMv1({
-            serviceUrl: `${routingHost}/route/v1`,
-            profile: 'driving',
-        });
+        const routingService = this.currentUser.getOption('routing', { router: 'osrm' }).router;
+        const { router, formatter } = this.leafletRouterControl.get(routingService);
 
         this.routeControl = new RoutingControl({
-            fitSelectedRoutes: false,
             router,
+            formatter,
             waypoints,
+            fitSelectedRoutes: false,
             alternativeClassName: 'hidden',
             addWaypoints: false,
             markerOptions: {

package/addon/components/order-config/fields-editor.js

@@ -197,7 +197,7 @@ export default class OrderConfigFieldsEditorComponent extends Component {
         }
     }
 
-    /* eslint no-unused-vars: "off" */
+    /* eslint-disable no-unused-vars */
     @action sortMetaFieldOptions(metaField, el, target) {
         // const { fields } = this;
         // const { index } = el.dataset;

package/addon/components/route-optimization-engine-select-button.hbs

@@ -0,0 +1,25 @@
+<DropdownButton
+    @text="Optimize Route"
+    @icon="caret-down"
+    @type="magic"
+    @size="sm"
+    @iconPrefix="fas"
+    @triggerClass="hidden md:flex"
+    @helpText="Optimize route using an integrated optimization engine"
+    @disabled={{@disabled}}
+    @isLoading={{@isLoading}}
+    @renderInPlace={{true}}
+    as |dd|
+>
+    <div class="next-dd-menu" aria-labelledby="user-menu">
+        <div class="px-1">
+            {{#each this.routeOptimization.availableServices as |service|}}
+                <a href="javascript:;" class="next-dd-item" {{on "click" (dropdown-fn dd this.handleClick service)}}>
+                    <div >
+                        <div class="text-sm">{{service.name}}</div>
+                    </div>
+                </a>
+            {{/each}}
+        </div>
+    </div>
+</DropdownButton>

package/addon/components/route-optimization-engine-select-button.js

@@ -0,0 +1,13 @@
+import Component from '@glimmer/component';
+import { inject as service } from '@ember/service';
+import { action } from '@ember/object';
+
+export default class RouteOptimizationEngineSelectButtonComponent extends Component {
+    @service routeOptimization;
+
+    @action handleClick({ key }) {
+        if (typeof this.args.onClick === 'function') {
+            this.args.onClick(key);
+        }
+    }
+}

package/addon/controllers/operations/orders/index/new.js

@@ -9,11 +9,9 @@ import { isBlank } from '@ember/utils';
 import { dasherize } from '@ember/string';
 import { next } from '@ember/runloop';
 import { task } from 'ember-concurrency';
-import { OSRMv1, Control as RoutingControl } from '@fleetbase/leaflet-routing-machine';
+import { Control as RoutingControl } from '@fleetbase/leaflet-routing-machine';
 import { debug } from '@ember/debug';
-import polyline from '@fleetbase/ember-core/utils/polyline';
 import isNotEmpty from '@fleetbase/ember-core/utils/is-not-empty';
-import getRoutingHost from '@fleetbase/ember-core/utils/get-routing-host';
 import getWithDefault from '@fleetbase/ember-core/utils/get-with-default';
 import isModel from '@fleetbase/ember-core/utils/is-model';
 
@@ -31,95 +29,22 @@ L.Bounds.prototype.intersects = function (bounds) {
 export default class OperationsOrdersIndexNewController extends BaseController {
     @controller('operations.orders.index') ordersController;
 
-    /**
-     * Inject the `modalsManager` service
-     *
-     * @var {Service}
-     */
     @service modalsManager;
-
-    /**
-     * Inject the `notifications` service
-     *
-     * @var {Service}
-     */
     @service notifications;
-
-    /**
-     * Inject the `loader` service
-     *
-     * @var {Service}
-     */
     @service loader;
-
-    /**
-     * Inject the `currentUser` service
-     *
-     * @var {Service}
-     */
     @service currentUser;
-
-    /**
-     * Inject the `hostRouter` service
-     *
-     * @var {Service}
-     */
     @service hostRouter;
-
-    /**
-     * Inject the `fileQueue` service
-     *
-     * @var {Service}
-     */
     @service fileQueue;
-
-    /**
-     * Inject the `intl` service
-     *
-     * @var {Service}
-     */
     @service intl;
-
-    /**
-     * Inject the `fetch` service
-     *
-     * @var {Service}
-     */
     @service fetch;
-
-    /**
-     * Inject the `store` service
-     *
-     * @var {Service}
-     */
     @service store;
-
-    /**
-     * Inject the `contextPanel` service
-     *
-     * @var {Service}
-     */
     @service contextPanel;
-
-    /**
-     * Inject the `universe` service
-     *
-     * @var {Service}
-     */
     @service universe;
+    @service routeOptimization;
+    @service leafletRouterControl;
+    @service osrm;
 
-    /**
-     * Create an OrderModel instance.
-     *
-     * @var {OrderModel}
-     */
     @tracked order = this.store.createRecord('order', { meta: [] });
-
-    /**
-     * Create an PayloadModel instance.
-     *
-     * @var {OrderModel}
-     */
     @tracked payload = this.store.createRecord('payload');
     @tracked driversQuery = {};
     @tracked vehiclesQuery = {};
@@ -139,7 +64,6 @@ export default class OperationsOrdersIndexNewController extends BaseController {
     @tracked isCreatingOrder = false;
     @tracked isMultipleDropoffOrder = false;
     @tracked isViewingRoutePreview = false;
-    @tracked isOptimizingRoute = false;
     @tracked optimizedRouteMarkers = [];
     @tracked optimizedRoutePolyline;
     @tracked isFetchingQuotes = false;
@@ -191,14 +115,8 @@ export default class OperationsOrdersIndexNewController extends BaseController {
         'application/x-tar',
     ];
 
-    get renderableComponents() {
-        const renderableComponents = this.universe.getRenderableComponentsFromRegistry('fleet-ops:template:operations:orders:new');
-        return renderableComponents;
-    }
-
-    get renderableEntityInputComponents() {
-        const renderableComponents = this.universe.getRenderableComponentsFromRegistry('fleet-ops:template:operations:orders:new:entities-input');
-        return renderableComponents;
+    get hasRouteOptimizationEngines() {
+        return this.routeOptimization.availableEngines.length > 1;
     }
 
     @not('isServicable') isNotServicable;
@@ -677,7 +595,7 @@ export default class OperationsOrdersIndexNewController extends BaseController {
 
     @action resetInterface() {
         if (this.leafletMap && this.leafletMap.liveMap) {
-            this.leafletMap.liveMap.show(['drivers', 'vehicles', 'routes']);
+            this.leafletMap.liveMap.showAll();
         }
     }
 
@@ -709,31 +627,35 @@ export default class OperationsOrdersIndexNewController extends BaseController {
     }
 
     @action removeRoutingControlPreview() {
-        const leafletMap = this.leafletMap;
-        const previewRouteControl = this.previewRouteControl;
+        return new Promise((resolve) => {
+            const leafletMap = this.leafletMap;
+            const previewRouteControl = this.previewRouteControl;
 
-        let removed = false;
+            let removed = false;
 
-        if (leafletMap && previewRouteControl instanceof RoutingControl) {
-            try {
-                previewRouteControl.remove();
-                removed = true;
-            } catch (e) {
-                // silent
-            }
-
-            if (!removed) {
+            if (leafletMap && previewRouteControl instanceof RoutingControl) {
                 try {
-                    leafletMap.removeControl(previewRouteControl);
+                    previewRouteControl.remove();
+                    removed = true;
                 } catch (e) {
                     // silent
                 }
+
+                if (!removed) {
+                    try {
+                        leafletMap.removeControl(previewRouteControl);
+                    } catch (e) {
+                        // silent
+                    }
+                }
             }
-        }
 
-        if (!removed) {
-            this.forceRemoveRoutePreview();
-        }
+            if (!removed) {
+                this.forceRemoveRoutePreview();
+            }
+
+            resolve(true);
+        });
     }
 
     @action forceRemoveRoutePreview() {
@@ -869,13 +791,12 @@ export default class OperationsOrdersIndexNewController extends BaseController {
         const canPreviewRoute = this.routePreviewArray.length > 0;
 
         if (canPreviewRoute) {
-            const routingHost = getRoutingHost(payload, waypoints);
-            const router = new OSRMv1({
-                serviceUrl: `${routingHost}/route/v1`,
-                profile: 'driving',
-            });
+            const routingService = this.currentUser.getOption('routing', { router: 'osrm' }).router;
+            const { router, formatter } = this.leafletRouterControl.get(routingService);
 
             this.previewRouteControl = new RoutingControl({
+                router,
+                formatter,
                 waypoints: this.routePreviewCoordinates,
                 alternativeClassName: 'hidden',
                 addWaypoints: false,
@@ -888,7 +809,6 @@ export default class OperationsOrdersIndexNewController extends BaseController {
                         iconAnchor: [12, 41],
                     }),
                 },
-                router,
             }).addTo(leafletMap);
 
             this.previewRouteControl.on('routesfound', (event) => {
@@ -935,68 +855,54 @@ export default class OperationsOrdersIndexNewController extends BaseController {
         }
     }
 
-    @task *optimizeRoute() {
-        this.isOptimizingRoute = true;
-
-        // Build the coordinate list we’ll send to OSRM
-        const driverAssigned = this.order.driver_assigned;
-        const driverPosition = driverAssigned?.location?.coordinates; // [lon,lat] | undefined
-        const originalCoords = this.getCoordinatesFromPayload(); // [[lon,lat], …]
-        const coordinates = driverPosition ? [driverPosition, ...originalCoords] : [...originalCoords];
-        const hasDriverStart = Boolean(driverPosition);
-        const source = 'first';
-        const destination = 'any';
-        const roundtrip = false; // don’t loop back
-        const routingHost = getRoutingHost(this.payload, this.waypoints);
-
-        // Call the OSRM /trip service
+    @task *optimizeRouteWithService(service) {
         try {
-            const response = yield this.fetch.routing(coordinates, { source, destination, roundtrip, annotations: true }, { host: routingHost });
-
-            if (response?.code !== 'Ok') {
-                throw new Error(`OSRM error: ${response?.code}`);
-            }
-
-            // Pair each OSRM waypoint with its Waypoint model
-            const modelsByInputIndex = hasDriverStart ? [null, ...this.waypoints] : this.waypoints;
-
-            const pairs = response.waypoints.map((wp, idx) => ({
-                model: modelsByInputIndex[idx], // Ember model or null (driver)
-                wp,
-            }));
-
-            // Drop the driver start if present
-            const payloadPairs = hasDriverStart ? pairs.slice(1) : pairs;
-
-            // Sort by the optimised order
-            payloadPairs.sort((a, b) => a.wp.waypoint_index - b.wp.waypoint_index);
-
-            // Extract the Ember models (null-safe)
-            const sortedWaypoints = payloadPairs.map((p) => p.model).filter(Boolean);
+            const result = yield this.routeOptimization.optimize(service, {
+                context: 'create_order',
+                order: this.order,
+                payload: this.payload,
+                waypoints: this.waypoints,
+                coordinates: this.getCoordinatesFromPayload(),
+            });
+            this.handleRouteOptimization(result);
+        } catch (err) {
+            this.notifications.error(err.message ?? this.intl.t('fleet-ops.operations.orders.index.new.route-error'));
+        }
+    }
 
-            // Update map layers & UI
-            this.removeRoutingControlPreview();
-            this.removeOptimizedRoute(this.leafletMap);
-            this.clearLayers();
+    @task *optimizeRoute() {
+        try {
+            const result = yield this.osrm.optimize({
+                context: 'create_order',
+                order: this.order,
+                payload: this.payload,
+                waypoints: this.waypoints,
+                coordinates: this.getCoordinatesFromPayload(),
+            });
 
-            const trip = response.trips?.[0];
-            const route = polyline.decode(trip.geometry); // [[lat,lon], …]
+            this.handleRouteOptimization(result);
+        } catch (err) {
+            this.notifications.error(this.intl.t('fleet-ops.operations.orders.index.new.route-error'));
+        }
+    }
 
-            this.waypoints = sortedWaypoints;
-            this.setOptimizedRoute(route, trip, response.waypoints);
-            this.previewDraftOrderRoute(this.payload, this.waypoints, this.isMultipleDropoffOrder);
-            this.updatePayloadCoordinates();
+    handleRouteOptimization({ sortedWaypoints, route, trip, result }) {
+        // Update map layers & UI
+        this.removeRoutingControlPreview();
+        this.removeOptimizedRoute(this.leafletMap);
+        this.clearLayers();
 
-            this.order.set('is_route_optimized', true);
+        // Update controller state
+        this.waypoints = sortedWaypoints;
+        if (route) {
+            this.setOptimizedRoute(route, trip, result.waypoints);
+        }
+        this.previewDraftOrderRoute(this.payload, this.waypoints, this.isMultipleDropoffOrder);
+        this.updatePayloadCoordinates();
 
-            if (this.isUsingIntegratedVendor) {
-                this.getQuotes();
-            }
-        } catch (err) {
-            debug('Error optimizing route', err);
-            this.notifications.error(this.intl.t('fleet-ops.operations.orders.index.new.route-error'));
-        } finally {
-            this.isOptimizingRoute = false;
+        this.order.set('is_route_optimized', true);
+        if (this.isUsingIntegratedVendor) {
+            this.getQuotes();
         }
     }
 
@@ -1060,7 +966,7 @@ export default class OperationsOrdersIndexNewController extends BaseController {
         }
     }
 
-    @action resetForm() {
+    @action async resetForm() {
         const order = this.store.createRecord('order', { meta: [] });
         const payload = this.store.createRecord('payload');
         const driversQuery = {};
@@ -1080,8 +986,6 @@ export default class OperationsOrdersIndexNewController extends BaseController {
         const customFields = [];
         const customFieldValues = {};
 
-        this.removeRoutingControlPreview();
-        this.removeOptimizedRoute();
         this.setProperties({
             order,
             payload,
@@ -1102,6 +1006,9 @@ export default class OperationsOrdersIndexNewController extends BaseController {
             customFields,
             customFieldValues,
         });
+
+        await this.removeRoutingControlPreview();
+        this.removeOptimizedRoute();
         this.resetInterface();
     }