@fleetbase/fleetops-engine 0.2.2 → 0.2.4

package/addon/components/vehicle-panel.hbs

@@ -0,0 +1,60 @@
+<Overlay @position="right" @noBackdrop={{true}} @fullHeight={{true}} @width="700">
+    <Overlay::Header @hideLeftSection={{true}} @actionsWrapperClass="flex-1 flex-col py-3" class="h-auto-i min-h-[127px]">
+        <div class="flex flex-row items-center justify-between w-full mb-4">
+            <div class="flex flex-1 space-x-2">
+                {{!-- <Button @type="default" @icon="location-arrow" @helpText="Locate vehicle" @onClick={{@onPressCancel}} /> --}}
+                <Button @type="default" @icon="pen" @helpText="Edit vehicle" @onClick={{this.editVehicle}} />
+            </div>
+            <div class="flex flex-1 justify-end">
+                <Button @type="default" @icon="times" @helpText="Close vehicle details" @onClick={{@onPressCancel}} />
+            </div>
+        </div>
+        <div class="flex flex-row justify-between w-full">
+            <div class="flex flex-col flex-1 w-3/4">
+                <div class="flex flex-row">
+                    <div class="w-14 flex items-center justify-center">
+                        <Image src={{@vehicle.photo_url}} @fallbackSrc={{@vehicle.avatar_url}} alt={{@vehicle.name}} height="48" width="48" class="h-12 w-12" />
+                        <Attach::Tooltip @class="clean" @animation="scale" @placement={{"top"}}>
+                            <InputInfo @text={{@vehicle.public_id}} />
+                        </Attach::Tooltip>
+                    </div>
+                    <div class="flex flex-col">
+                        <h1 class="text-gray-900 dark:text-white text-2xl">{{@vehicle.display_name}}</h1>
+                        <div class="-mt-1">
+                            {{#if @vehicle.driver}}
+                                <div class="flex flex-row items-center">
+                                    <span class="text-sm dark:text-gray-500 text-gray-700 mr-3">{{@vehicle.driver.name}}</span>
+                                </div>
+                            {{else}}
+                                <div class="flex flex-row items-center">
+                                    <span class="text-sm dark:text-gray-500 text-gray-700 mr-3">No driver assigned</span>
+                                    {{!-- <Button @icon="user-plus" @size="xs" @helpText="Assign a driver to vehicle" /> --}}
+                                </div>
+                            {{/if}}
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="flex justify-end w-1/4">
+                <Badge @status={{@vehicle.status}} />
+            </div>
+        </div>
+    </Overlay::Header>
+    <Overlay::Body class="no-padding" @increaseInnerBodyHeightBy={{1000}}>
+        <div class="section-header-actions w-full overflow-x-scroll lg:overflow-x-auto">
+            <div class="ui-tabs mt-4">
+                <nav>
+                    {{#each this.tabs as |tab|}}
+                        <a href="javascript:;" class="ui-tab {{if (eq this.currentTab tab.slug) 'active' }}" {{on "click" (fn this.changeTab tab.slug)}}>
+                            <FaIcon @icon={{tab.icon}} class="mr-1" />
+                            <span>{{tab.title}}</span>
+                        </a>
+                    {{/each}}
+                </nav>
+            </div>
+        </div>
+        <div class="tab-content tab-{{this.currentTab}}">
+            {{component this.tab.component vehicle=@vehicle tabOptions=this.tab params=this.tab.componentParams}}
+        </div>
+    </Overlay::Body>
+</Overlay>

package/addon/components/vehicle-panel.js

@@ -0,0 +1,57 @@
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { action, computed } from '@ember/object';
+import { inject as service } from '@ember/service';
+import { isArray } from '@ember/array';
+import VehiclePanelDetailComponent from './vehicle-panel/details';
+
+export default class VehiclePanelComponent extends Component {
+    @service fetch;
+    @service modalsManager;
+    @service universe;
+    @service store;
+    @service hostRouter;
+    @tracked currentTab;
+    @tracked devices = [];
+    @tracked deviceApi = {};
+    @tracked vehicle;
+
+    get tabs() {
+        const registeredTabs = this.universe.getMenuItemsFromRegistry('component:vehicle-panel');
+        // this.universe._createMenuItem('Tracking', null, { icon: 'satellite-dish', component: VehiclePanelTrackingComponent }),
+        const defaultTabs = [this.universe._createMenuItem('Details', null, { icon: 'circle-info', component: VehiclePanelDetailComponent })];
+
+        if (isArray(registeredTabs)) {
+            return [...defaultTabs, ...registeredTabs];
+        }
+
+        return defaultTabs;
+    }
+
+    @computed('currentTab', 'tabs') get tab() {
+        if (this.currentTab) {
+            return this.tabs.find(({ slug }) => slug === this.currentTab);
+        }
+
+        return null;
+    }
+
+    constructor() {
+        super(...arguments);
+        this.vehicle = this.args.vehicle;
+        this.changeTab(this.args.tab || 'details');
+    }
+
+    @action async changeTab(tab) {
+        this.currentTab = tab;
+
+        if (typeof this.args.onTabChanged === 'function') {
+            this.args.onTabChanged(tab);
+        }
+    }
+
+    @action editVehicle() {
+        const { vehicle } = this.args;
+        return this.hostRouter.transitionTo('console.fleet-ops.management.vehicles.index.edit', vehicle.public_id);
+    }
+}

package/addon/controllers/management/drivers/index/details.js

@@ -0,0 +1,8 @@
+import Controller from '@ember/controller';
+import { action } from '@ember/object';
+
+export default class ManagementDriverIndexDetailsController extends Controller {
+    @action transitionBack() {
+        return this.transitionToRoute('management.drivers.index');
+    }
+}

package/addon/controllers/management/drivers/index/edit.js

@@ -0,0 +1,80 @@
+import Controller from '@ember/controller';
+import { inject as service } from '@ember/service';
+import { tracked } from '@glimmer/tracking';
+import { action } from '@ember/object';
+
+export default class ManagementDriversIndexEditController extends Controller {
+    /**
+     * True if updating service rate.
+     *
+     * @var {Boolean}
+     */
+    @tracked isUpdatingDriver = false;
+    /**
+     * Inject the `loader` service
+     *
+     * @var {Service}
+     */
+    @service loader;
+    /**
+     * Inject the `notifications` service
+     *
+     * @var {Service}
+     */
+    @service notifications;
+    /**
+     * Inject the `hostRouter` service
+     *
+     * @var {Service}
+     */
+    @service hostRouter;
+    /**
+     * Inject the `currentUser` service
+     *
+     * @var {Service}
+     */
+    @service store;
+    /**
+     * Updates the drivers to server
+     *
+     * @void
+     */
+    @action updateDriver() {
+        const { driver } = this;
+
+        this.isUpdatingDriver = true;
+        this.loader.showLoader('.overlay-inner-content', 'Updating driver...');
+
+        try {
+            return driver
+                .save()
+                .then((driver) => {
+                    return this.transitionToRoute('management.drivers.index').then(() => {
+                        this.notifications.success(`Driver '${driver.name}' updated`);
+                        this.resetForm();
+                        this.hostRouter.refresh();
+                    });
+                })
+                .catch(this.notifications.serverError)
+                .finally(() => {
+                    this.isUpdatingDriver = false;
+                    this.loader.removeLoader();
+                });
+        } catch (error) {
+            this.isUpdatingDriver = false;
+            this.loader.removeLoader();
+        }
+    }
+
+    @action transitionBack() {
+        return this.transitionToRoute('management.drivers.index');
+    }
+    /**
+     * Resets the driver form
+     *
+     * @void
+     */
+    @action resetForm() {
+        this.driver = this.store.createRecord('driver');
+    }
+}

package/addon/controllers/management/drivers/index/new.js

@@ -0,0 +1,128 @@
+import Controller, { inject as controller } from '@ember/controller';
+import { inject as service } from '@ember/service';
+import { tracked } from '@glimmer/tracking';
+import { action } from '@ember/object';
+import generateSlug from '@fleetbase/ember-core/utils/generate-slug';
+
+export default class ManagementDriversIndexNewController extends Controller {
+    /**
+     * Inject the `management.drivers.index` controller
+     *
+     * @var {Controller}
+     */
+    @controller('management.drivers.index') index;
+
+    /**
+     * Inject the `currentUser` service
+     *
+     * @var {Service}
+     */
+    @service store;
+
+    /**
+     * Inject the `hostRouter` service
+     *
+     * @var {Service}
+     */
+    @service hostRouter;
+
+    /**
+     * Inject the `notifications` service
+     *
+     * @var {Service}
+     */
+    @service notifications;
+
+    /**
+     * Inject the `loader` service
+     *
+     * @var {Service}
+     */
+    @service loader;
+
+    /**
+     * The driver being created.
+     *
+     * @var {DriverModel}
+     */
+    @tracked driver = this.store.createRecord('driver', {
+        status: `active`,
+        slug: generateSlug(),
+    });
+
+    /**
+     * Different service types available, based on order type.
+     *
+     * @var {Array}
+     */
+    @tracked serviceTypes = [];
+
+    /**
+     * Service areas.
+     *
+     * @var {Array}
+     */
+    @tracked serviceAreas = [];
+
+    /**
+     * Zones.
+     *
+     * @var {Array}
+     */
+    @tracked zones = [];
+
+    /**
+     * True if creating driver.
+     *
+     * @var {Boolean}
+     */
+    @tracked isCreatingDriver = false;
+
+    /**
+     * Saves the driver to server
+     *
+     * @void
+     */
+    @action createDriver() {
+        const { driver } = this;
+
+        this.isCreatingDriver = true;
+        this.loader.showLoader('.overlay-inner-content', 'Creating driver...');
+
+        try {
+            return driver
+                .save()
+                .then((driver) => {
+                    return this.transitionToRoute('management.drivers.index').then(() => {
+                        this.notifications.success(`New Driver ${driver.name} Created`);
+                        this.resetForm();
+                        this.hostRouter.refresh();
+                    });
+                })
+                .catch((error) => {
+                    console.log(error);
+                    this.notifications.serverError(error);
+                })
+                .finally(() => {
+                    this.isCreatingDriver = false;
+                    this.loader.removeLoader();
+                });
+        } catch (error) {
+            this.isCreatingDriver = false;
+            this.loader.removeLoader();
+        }
+    }
+
+    /**
+     * Resets the driver form
+     *
+     * @void
+     */
+    @action resetForm() {
+        this.driver = this.store.createRecord('driver');
+    }
+
+    @action transitionBack() {
+        return this.transitionToRoute('management.drivers.index');
+    }
+}