@fleetbase/fleetops-engine 0.6.18 → 0.6.20

package/addon/components/driver-form-panel.js

@@ -1,243 +0,0 @@
-import Component from '@glimmer/component';
-import { tracked } from '@glimmer/tracking';
-import { inject as service } from '@ember/service';
-import { action } from '@ember/object';
-import { task } from 'ember-concurrency';
-import Point from '@fleetbase/fleetops-data/utils/geojson/point';
-import contextComponentCallback from '@fleetbase/ember-core/utils/context-component-callback';
-import applyContextComponentArguments from '@fleetbase/ember-core/utils/apply-context-component-arguments';
-
-export default class DriverFormPanelComponent extends Component {
-    @service store;
-    @service fetch;
-    @service intl;
-    @service currentUser;
-    @service notifications;
-    @service hostRouter;
-    @service contextPanel;
-    @service modalsManager;
-    @service universe;
-
-    /**
-     * Overlay context.
-     * @type {any}
-     */
-    @tracked context;
-
-    /**
-     * Status options for drivers.
-     * @type {Array}
-     */
-    @tracked driverStatusOptions = ['active', 'pending'];
-
-    /**
-     * The coordinates input component instance.
-     * @type {CoordinateInputComponent}
-     */
-    @tracked coordinatesInputComponent;
-
-    /**
-     * Permission needed to update or create record.
-     *
-     * @memberof DriverFormPanelComponent
-     */
-    @tracked savePermission;
-
-    /**
-     * The current controller if any.
-     *
-     * @memberof DriverFormPanelComponent
-     */
-    @tracked controller;
-
-    /**
-     * Action to create a new user quickly
-     *
-     * @memberof DriverFormPanelComponent
-     */
-    userAccountActionButtons = [
-        {
-            text: 'Create new user',
-            icon: 'user-plus',
-            size: 'xs',
-            permission: 'iam create user',
-            onClick: () => {
-                const user = this.store.createRecord('user', {
-                    status: 'pending',
-                    type: 'user',
-                });
-
-                this.modalsManager.show('modals/user-form', {
-                    title: 'Create a new user',
-                    user,
-                    formPermission: 'iam create user',
-                    uploadNewPhoto: (file) => {
-                        this.fetch.uploadFile.perform(
-                            file,
-                            {
-                                path: `uploads/${this.currentUser.companyId}/users/${user.slug}`,
-                                key_uuid: user.id,
-                                key_type: 'user',
-                                type: 'user_photo',
-                            },
-                            (uploadedFile) => {
-                                user.setProperties({
-                                    avatar_uuid: uploadedFile.id,
-                                    avatar_url: uploadedFile.url,
-                                    avatar: uploadedFile,
-                                });
-                            }
-                        );
-                    },
-                    confirm: async (modal) => {
-                        modal.startLoading();
-
-                        try {
-                            await user.save();
-                            this.notifications.success('New user created successfully!');
-                            modal.done();
-                        } catch (error) {
-                            this.notifications.serverError(error);
-                            modal.stopLoading();
-                        }
-                    },
-                });
-            },
-        },
-    ];
-
-    /**
-     * Constructs the component and applies initial state.
-     */
-    constructor(owner, { driver = null, controller }) {
-        super(...arguments);
-        this.driver = driver;
-        this.controller = controller;
-        this.savePermission = driver && driver.isNew ? 'fleet-ops create driver' : 'fleet-ops update driver';
-        applyContextComponentArguments(this);
-    }
-
-    /**
-     * Sets the overlay context.
-     *
-     * @action
-     * @param {OverlayContextObject} overlayContext
-     */
-    @action setOverlayContext(overlayContext) {
-        this.context = overlayContext;
-        contextComponentCallback(this, 'onLoad', ...arguments);
-    }
-
-    /**
-     * Task to save driver.
-     *
-     * @return {void}
-     * @memberof DriverFormPanelComponent
-     */
-    @task *save() {
-        contextComponentCallback(this, 'onBeforeSave', this.driver);
-
-        try {
-            this.driver = yield this.driver.save();
-        } catch (error) {
-            this.notifications.serverError(error);
-            return;
-        }
-
-        this.hostRouter.refresh();
-        this.notifications.success(this.intl.t('fleet-ops.component.driver-form-panel.success-message', { driverName: this.driver.name }));
-        this.universe.trigger('fleet-ops.driver.saved', this.driver);
-        contextComponentCallback(this, 'onAfterSave', this.driver);
-    }
-
-    /**
-     * Uploads a new photo for the driver.
-     *
-     * @param {File} file
-     * @memberof DriverFormPanelComponent
-     */
-    @action onUploadNewPhoto(file) {
-        this.fetch.uploadFile.perform(
-            file,
-            {
-                path: `uploads/${this.currentUser.companyId}/drivers/${this.driver.id}`,
-                subject_uuid: this.driver.id,
-                subject_type: 'fleet-ops:driver',
-                type: 'driver_photo',
-            },
-            (uploadedFile) => {
-                this.driver.setProperties({
-                    photo_uuid: uploadedFile.id,
-                    photo_url: uploadedFile.url,
-                    photo: uploadedFile,
-                });
-            }
-        );
-    }
-
-    /**
-     * View the details of the driver.
-     *
-     * @action
-     */
-    @action onViewDetails() {
-        const isActionOverrided = contextComponentCallback(this, 'onViewDetails', this.driver);
-
-        if (!isActionOverrided) {
-            this.contextPanel.focus(this.driver, 'viewing');
-        }
-    }
-
-    /**
-     * Handles cancel button press.
-     *
-     * @action
-     * @returns {any}
-     */
-    @action onPressCancel() {
-        return contextComponentCallback(this, 'onPressCancel', this.driver);
-    }
-
-    /**
-     * Handles the selection from an autocomplete. Updates the place properties with the selected data.
-     * If a coordinates input component is present, updates its coordinates too.
-     *
-     * @action
-     * @param {Object} selected - The selected item from the autocomplete.
-     * @param {Object} selected.location - The location data of the selected item.
-     * @memberof DriverFormPanelComponent
-     */
-    @action onAutocomplete({ location }) {
-        if (location) {
-            this.driver.set('location', location);
-            if (this.coordinatesInputComponent) {
-                this.coordinatesInputComponent.updateCoordinates(location);
-            }
-        }
-    }
-
-    /**
-     * Sets the coordinates input component.
-     *
-     * @action
-     * @param {Object} coordinatesInputComponent - The coordinates input component to be set.
-     * @memberof DriverFormPanelComponent
-     */
-    @action setCoordinatesInput(coordinatesInputComponent) {
-        this.coordinatesInputComponent = coordinatesInputComponent;
-    }
-
-    /**
-     * Updates the place coordinates with the given latitude and longitude.
-     *
-     * @action
-     * @param {Object} coordinates - The latitude and longitude coordinates.
-     * @param {number} coordinates.latitude - Latitude value.
-     * @param {number} coordinates.longitude - Longitude value.
-     * @memberof DriverFormPanelComponent
-     */
-    @action onCoordinatesChanged({ latitude, longitude }) {
-        const location = new Point(longitude, latitude);
-        this.driver.setProperties({ location });
-    }
-}

package/addon/components/driver-panel/details.hbs

@@ -1,55 +0,0 @@
-<div class="p-4">
-    <div class="flex-1 space-y-4">
-        <ContentPanel @title={{t "fleet-ops.component.driver-panel.user-account"}} @open={{true}} @pad={{true}} @panelBodyClass="bg-white dark:bg-gray-900">
-            <div class="grid grid-cols-2 gap-4 text-xs dark:text-gray-100">
-                <div class="field-info-container md:col-span-3">
-                    <div class="field-name">{{t "fleet-ops.common.name"}}</div>
-                    <div class="field-value">{{n-a @driver.name}}</div>
-                </div>
-                <div class="field-info-container space-y-2">
-                    <div class="field-name">{{t "fleet-ops.common.email"}}</div>
-                    <ClickToCopy @value={{@driver.email}} class="field-value">{{n-a @driver.email}}</ClickToCopy>
-                </div>
-                <div class="field-info-container space-y-2">
-                    <div class="field-name">{{t "fleet-ops.common.phone"}}</div>
-                    <ClickToCopy @value={{@driver.phone}} class="field-value">{{n-a @driver.phone}}</ClickToCopy>
-                </div>
-            </div>
-        </ContentPanel>
-        <ContentPanel @title={{t "fleet-ops.component.driver-panel.driver-details"}} @open={{true}} @pad={{true}} @panelBodyClass="bg-white dark:bg-gray-900">
-            <div class="grid grid-cols-2 gap-4 text-xs dark:text-gray-100">
-                <div class="field-info-container space-y-2">
-                    <div class="field-name">{{t "fleet-ops.common.id"}}</div>
-                    <ClickToCopy @value={{@driver.public_id}} class="field-value">{{n-a @driver.public_id}}</ClickToCopy>
-                </div>
-                <div class="field-info-container space-y-2">
-                    <div class="field-name">{{t "fleet-ops.common.internal-id"}}</div>
-                    <div class="field-value">{{n-a @driver.internal_id}}</div>
-                </div>
-                <div class="field-info-container space-y-2">
-                    <div class="field-name">{{t "fleet-ops.common.driver-license"}}</div>
-                    <div class="field-value">{{n-a @driver.drivers_license_number}}</div>
-                </div>
-                <div class="field-info-container space-y-2">
-                    <div class="field-name">{{t "fleet-ops.common.vendor"}}</div>
-                    <div class="field-value">{{n-a @driver.vendor_name}}</div>
-                </div>
-                <div class="col-span-3"></div>
-                <div class="field-info-container space-y-2">
-                    <div class="field-name">{{t "fleet-ops.common.city"}}</div>
-                    <div class="field-value">{{n-a @driver.city}}</div>
-                </div>
-                <div class="field-info-container space-y-2">
-                    <div class="field-name">{{t "fleet-ops.common.country"}}</div>
-                    <div class="field-value">
-                        <CountryName @country={{@driver.country}} />
-                    </div>
-                </div>
-                <div class="field-info-container md:col-span-3">
-                    <div class="field-name">{{t "fleet-ops.common.coordinates"}}</div>
-                    <div class="field-value">{{point-coordinates @driver.location}}</div>
-                </div>
-            </div>
-        </ContentPanel>
-    </div>
-</div>

package/addon/components/driver-panel/orders.hbs

@@ -1,144 +0,0 @@
-<Layout::Section::Header @title={{t "fleet-ops.common.orders"}} @onSearch={{this.search}}>
-    {{#unless this.queryOrders.isIdle}}
-        <div>
-            <Spinner class="dark:text-blue-400 text-blue-900" />
-        </div>
-    {{/unless}}
-</Layout::Section::Header>
-
-<Layout::Section::Body>
-    <div class="flex-col p-4 space-y-4">
-        {{#each this.orders as |order|}}
-            <div class="rounded-lg shadow-sm bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-700">
-                <div class="flex flex-row justify-between rounded-t-lg px-4 py-2 border-b bg-gray-100 dark:bg-gray-900 border-gray-200 dark:border-gray-700">
-                    <div class="flex flex-row">
-                        <div class="mr-2 pt-1">
-                            <a href="#" {{on "click" (fn this.viewOrder order)}}>
-                                <FaIcon @icon="arrow-up-right-from-square" @size="xs" class="text-gray-500 dark:text-gray-700" />
-                            </a>
-                        </div>
-                        <div>
-                            <div>{{order.public_id}}</div>
-                            <div class="text-xs">{{order.createdAt}}</div>
-                        </div>
-                    </div>
-                    <div>
-                        <Badge @status={{order.status}} />
-                        <Badge @status="info">{{n-a (humanize order.type)}}</Badge>
-                    </div>
-                </div>
-                <div class="rounded-b-lg bg-white dark:bg-gray-800 py-2 px-4">
-                    <div class="grid grid-cols-1 lg:grid-cols-3 gap-2">
-                        <div class="field-info-container space-y-2">
-                            {{#if order.isMultipleDropoffOrder}}
-                                <div class="field-name">{{pluralize (t "fleet-ops.operations.orders.index.view.customer")}}</div>
-                                <div class="flex flex-row space-x-2">
-                                    {{#each order.payload.waypoints as |waypoint|}}
-                                        <div class="flex flex-col items-center justify-center text-center">
-                                            <Image
-                                                src={{avatar-url waypoint.customer.photo_url}}
-                                                @fallbackSrc={{config "defaultValues.contactImage"}}
-                                                class="w-8 h-8 rounded-full shadow-sm mr-2"
-                                                alt={{waypoint.customer.name}}
-                                            />
-                                            <div class="text-xs truncate mt-1 w-12">{{waypoint.customer.name}}</div>
-                                            <Attach::Tooltip @class="clean" @animation="scale" @placement="top">
-                                                <InputInfo>
-                                                    <div class="field-value">{{n-a waypoint.customer.name "No Customer"}}</div>
-                                                    {{#if waypoint.customer}}
-                                                        <div class="mt-1 text-xs">{{n-a waypoint.customer.phone "No Phone"}}</div>
-                                                    {{/if}}
-                                                </InputInfo>
-                                            </Attach::Tooltip>
-                                        </div>
-                                    {{/each}}
-                                </div>
-                            {{else}}
-                                <div class="field-name">{{t "fleet-ops.operations.orders.index.view.customer"}}</div>
-                                <div class="flex flex-row">
-                                    <div>
-                                        <Image
-                                            src={{avatar-url order.customer.photo_url}}
-                                            @fallbackSrc={{config "defaultValues.contactImage"}}
-                                            class="w-8 h-8 rounded-md shadow-sm mr-2"
-                                            alt={{order.customer.name}}
-                                        />
-                                    </div>
-                                    <div>
-                                        <div class="field-value">{{n-a order.customer.name "No Customer"}}</div>
-                                        {{#if order.customer}}
-                                            <div>{{n-a order.customer.phone "No Phone"}}</div>
-                                        {{/if}}
-                                    </div>
-                                </div>
-                            {{/if}}
-                        </div>
-                        <div class="field-info-container space-y-2">
-                            <div class="field-name">{{t "fleet-ops.operations.orders.index.view.facilitator"}}</div>
-                            <div class="flex flex-row">
-                                <div>
-                                    <Image
-                                        src={{avatar-url order.facilitator.photo_url}}
-                                        @fallbackSrc={{config "defaultValues.contactImage"}}
-                                        class="w-8 h-8 rounded-md border border-gray-200 dark:border-gray-900 shadow-sm mr-2"
-                                        alt={{order.facilitator.name}}
-                                    />
-                                </div>
-                                <div>
-                                    <div class="field-value">{{n-a order.facilitator.name "No Facilitator"}}</div>
-                                    {{#if order.facilitator}}
-                                        <div>{{n-a order.facilitator.phone "No Phone"}}</div>
-                                    {{/if}}
-                                </div>
-                            </div>
-                        </div>
-                        <div class="field-info-container space-y-2">
-                            <div class="field-name flex flex-row items-center justify-between">
-                                <span>{{t "fleet-ops.operations.orders.index.view.vehicle-assigned"}}</span>
-                            </div>
-                            <div>
-                                <a href="javascript:;" class="flex flex-row">
-                                    <div>
-                                        <Image
-                                            src={{order.vehicle_assigned.avatar_url}}
-                                            @fallbackSrc={{config "defaultValues.vehicleAvatar"}}
-                                            width="24"
-                                            height="24"
-                                            class="w-6 h-6 rounded-md shadow-sm mr-3 lg:mr-2"
-                                            alt={{order.vehicle_assigned.display_name}}
-                                        />
-                                    </div>
-                                    <div class="field-value">
-                                        <div>{{n-a order.vehicle_assigned.display_name "No Vehicle"}}</div>
-                                    </div>
-                                </a>
-                            </div>
-                        </div>
-                        <div class="field-info-container space-y-2">
-                            <div class="field-name">{{t "fleet-ops.operations.orders.index.view.tracking-number"}}</div>
-                            <div class="field-value">{{n-a order.tracking_number.tracking_number}}</div>
-                        </div>
-                        <div class="field-info-container space-y-2">
-                            <div class="field-name">{{t "fleet-ops.common.internal-id"}}</div>
-                            <div class="field-value">{{n-a order.internal_id}}</div>
-                        </div>
-                        {{#if order.pod_required}}
-                            <div class="field-info-container space-y-2">
-                                <div class="field-name">{{t "fleet-ops.operations.orders.index.view.proof-of-delivery"}}</div>
-                                <div class="field-value">{{n-a (smart-humanize order.pod_method)}}</div>
-                            </div>
-                        {{/if}}
-                        <div class="field-info-container space-y-2">
-                            <div class="field-name">{{t "fleet-ops.operations.orders.index.view.date-started"}}</div>
-                            <div class="field-value">{{n-a order.startedAt}}</div>
-                        </div>
-                        <div class="col-span-3">
-                            <RouteList @order={{order}} class="mt-2" />
-                        </div>
-                    </div>
-                </div>
-            </div>
-        {{/each}}
-    </div>
-    <Spacer @height="300px" />
-</Layout::Section::Body>

package/addon/components/driver-panel/orders.js

@@ -1,44 +0,0 @@
-import Component from '@glimmer/component';
-import { tracked } from '@glimmer/tracking';
-import { inject as service } from '@ember/service';
-import { action, computed } from '@ember/object';
-import { task } from 'ember-concurrency';
-
-export default class CustomerOrderHistoryComponent extends Component {
-    @service store;
-    @service fetch;
-    @service intl;
-    @service hostRouter;
-    @tracked orders = [];
-    @tracked driver;
-
-    @computed('args.title') get title() {
-        return this.args.title ?? this.intl.t('fleetops.component.widget.orders.widget-title');
-    }
-
-    constructor() {
-        super(...arguments);
-        this.driver = this.args.driver;
-        this.queryOrders.perform();
-    }
-
-    @task *queryOrders(params = {}) {
-        try {
-            this.orders = yield this.store.query('order', {
-                driver_assigned_uuid: this.driver.id,
-                sort: '-created_at',
-                ...params,
-            });
-        } catch (error) {
-            this.notifications.serverError('error', error);
-        }
-    }
-
-    @action search(event) {
-        this.queryOrders.perform({ query: event.target.value ?? '' });
-    }
-
-    @action async viewOrder(order) {
-        this.hostRouter.transitionTo('console.fleet-ops.operations.orders.index.view', order);
-    }
-}

package/addon/components/driver-panel.hbs

@@ -1,84 +0,0 @@
-<Overlay
-    @onLoad={{this.setOverlayContext}}
-    @onOpen={{this.onOpen}}
-    @onClose={{this.onClose}}
-    @onToggle={{this.onToggle}}
-    @position="right"
-    @noBackdrop={{true}}
-    @fullHeight={{true}}
-    @isResizeble={{or this.isResizable @isResizable}}
-    @width={{or this.width @width "570px"}}
->
-    <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={{t "fleet-ops.component.driver-panel.locate-button-text"}} @onClick={{@onPressCancel}} /> --}}
-                <Button @type="default" @icon="pen" @helpText={{t "fleet-ops.component.driver-panel.edit-button-text"}} @onClick={{this.onEdit}} @permission="fleet-ops update driver" />
-            </div>
-            <div class="flex flex-1 justify-end">
-                <Button @type="default" @icon="times" @helpText={{t "fleet-ops.component.driver-panel.close-button-text"}} @onClick={{this.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">
-                        <div class="w-12 h-12 flex items-center justify-start rounded-lg">
-                            <Image
-                                src={{this.driver.photo_url}}
-                                @fallbackSrc={{config "defaultValues.driverImage"}}
-                                alt={{this.driver.name}}
-                                height="48"
-                                width="48"
-                                class="h-12 w-12 rounded-lg shadow-sm"
-                            />
-                            <Attach::Tooltip @class="clean" @animation="scale" @placement="top">
-                                <InputInfo @text={{this.driver.name}} />
-                            </Attach::Tooltip>
-                        </div>
-                    </div>
-                    <div class="flex flex-col">
-                        <h1 class="text-gray-900 dark:text-white text-2xl">{{this.driver.name}}</h1>
-                        <div class="-mt-1">
-                            {{#if this.driver.vehicle}}
-                                <div class="flex flex-row items-center">
-                                    <a
-                                        href="javascript:;"
-                                        class="text-sm dark:text-blue-400 text-blue-600 hover:opacity-50"
-                                        {{on "click" this.onClickDriverVehicle}}
-                                    >{{this.driver.vehicle.displayName}}</a>
-                                </div>
-                            {{else}}
-                                <div class="flex flex-row items-center">
-                                    <span class="text-sm dark:text-gray-500 text-gray-700 mr-3">{{t "fleet-ops.component.driver-panel.no-vehicle-message"}}</span>
-                                    {{!-- <Button @icon="plus" @size="xs" @helpText={{t "fleet-ops.component.driver-panel.assign-vehicle-button"}} /> --}}
-                                </div>
-                            {{/if}}
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div class="flex justify-end w-1/4">
-                <Badge @status={{if this.driver.online "online" "offline"}}>{{if this.driver.online "Online" "Offline"}}</Badge>
-            </div>
-        </div>
-    </Overlay::Header>
-    <Overlay::Body class="no-padding">
-        <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.tab.slug tab.slug) 'active'}}" {{on "click" (fn this.onTabChanged tab.slug)}}>
-                            <FaIcon @icon={{tab.icon}} class="mr-1" />
-                            <span>{{tab.title}}</span>
-                        </a>
-                    {{/each}}
-                </nav>
-            </div>
-        </div>
-        <div class="tab-content tab-{{this.tab.slug}}">
-            {{component this.tab.component driver=this.driver tabOptions=this.tab options=this.tab.componentParams}}
-        </div>
-        <Spacer @height="300px" />
-    </Overlay::Body>
-</Overlay>