@fleetbase/fleetops-engine 0.3.1 → 0.3.3

package/addon/routes/management/issues/index/details.js

@@ -0,0 +1,14 @@
+import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
+
+export default class ManagementIssuesIndexDetailsRoute extends Route {
+    @service store;
+
+    queryParams = {
+        view: { refreshModel: false },
+    };
+
+    model({ public_id }) {
+        return this.store.queryRecord('issue', { public_id, single: true, with: ['driver', 'vehicle', 'assignee', 'reporter'] });
+    }
+}

package/addon/routes/management/issues/index/edit.js

@@ -0,0 +1,10 @@
+import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
+
+export default class ManagementIssuesIndexEditRoute extends Route {
+    @service store;
+
+    model({ public_id }) {
+        return this.store.queryRecord('issue', { public_id, single: true, with: ['driver', 'vehicle', 'assignee', 'reporter'] });
+    }
+}

package/addon/routes/management/issues/index/new.js

@@ -0,0 +1,3 @@
+import Route from '@ember/routing/route';
+
+export default class ManagementIssuesIndexNewRoute extends Route {}

package/addon/routes/management/issues/index.js

@@ -19,6 +19,6 @@ export default class ManagementIssuesIndexRoute extends Route {
     };
 
     model(params) {
-        return this.store.query('issue', { ...params });
+        return this.store.query('issue', { ...params, with: ['driver', 'vehicle', 'assignee', 'reporter'] });
     }
 }

package/addon/routes/management/places/index/details.js

@@ -0,0 +1,14 @@
+import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
+
+export default class ManagementPlacesIndexDetailsRoute extends Route {
+    @service store;
+
+    queryParams = {
+        view: { refreshModel: false },
+    };
+
+    model({ public_id }) {
+        return this.store.findRecord('place', public_id);
+    }
+}

package/addon/routes/management/places/index/edit.js

@@ -0,0 +1,10 @@
+import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
+
+export default class ManagementPlacesIndexEditRoute extends Route {
+    @service store;
+
+    model({ public_id }) {
+        return this.store.findRecord('place', public_id);
+    }
+}

package/addon/routes/management/places/index/new.js

@@ -0,0 +1,3 @@
+import Route from '@ember/routing/route';
+
+export default class ManagementPlacesIndexNewRoute extends Route {}

package/addon/routes/management/places/index.js

@@ -4,6 +4,11 @@ import { inject as service } from '@ember/service';
 export default class ManagementPlacesIndexRoute extends Route {
     @service store;
 
+    /**
+     * Queryable parameters
+     *
+     * @var {Object}
+     */
     queryParams = {
         page: { refreshModel: true },
         limit: { refreshModel: true },
@@ -13,6 +18,6 @@ export default class ManagementPlacesIndexRoute extends Route {
     };
 
     model(params) {
-        return this.store.query('place', { ...params });
+        return this.store.query('place', { params });
     }
 }

package/addon/routes/management/vendors/index/details.js

@@ -0,0 +1,15 @@
+import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
+
+export default class ManagementVendorsIndexDetailsRoute extends Route {
+    @service store;
+
+    queryParams = {
+        view: { refreshModel: false },
+    };
+
+    model({ public_id }) {
+        const isIntegratedVendor = typeof public_id === 'string' && public_id.startsWith('integrated_vendor_');
+        return this.store.findRecord(isIntegratedVendor ? 'integrated-vendor' : 'vendor', public_id);
+    }
+}

package/addon/routes/management/vendors/index/edit.js

@@ -0,0 +1,11 @@
+import Route from '@ember/routing/route';
+import { inject as service } from '@ember/service';
+
+export default class ManagementVendorsIndexEditRoute extends Route {
+    @service store;
+
+    model({ public_id }) {
+        const isIntegratedVendor = typeof public_id === 'string' && public_id.startsWith('integrated_vendor_');
+        return this.store.findRecord(isIntegratedVendor ? 'integrated-vendor' : 'vendor', public_id);
+    }
+}

package/addon/routes/management/vendors/index/new.js

@@ -0,0 +1,3 @@
+import Route from '@ember/routing/route';
+
+export default class ManagementVendorsIndexNewRoute extends Route {}

package/addon/routes/management/vendors/index.js

@@ -23,6 +23,7 @@ export default class ManagementVendorsIndexRoute extends Route {
     }
 
     async setupController(controller, model) {
+        console.log('setupController action called');
         super.setupController(...arguments);
 
         // load integrated vendors

package/addon/routes/operations/scheduler/index.js

@@ -1,5 +1,16 @@
 import Route from '@ember/routing/route';
 import { inject as service } from '@ember/service';
+import { isValid as isValidDate } from 'date-fns';
+import { isNone } from '@ember/utils';
+import createFullCalendarEventFromOrder from '../../../utils/create-full-calendar-event-from-order';
+
+const getUnscheduledOrder = (order) => {
+    return isNone(order.scheduled_at);
+};
+
+const getScheduledOrder = (order) => {
+    return isValidDate(order.scheduled_at);
+};
 
 export default class OperationsSchedulerIndexRoute extends Route {
     @service store;
@@ -7,4 +18,18 @@ export default class OperationsSchedulerIndexRoute extends Route {
     model() {
         return this.store.query('order', { status: 'created', with: ['payload'] });
     }
+
+    setupController(controller, model) {
+        // get orders
+        const orders = model.toArray();
+
+        // set unscheduled orders
+        controller.unscheduledOrders = orders.filter(getUnscheduledOrder);
+
+        // set scheduled orders
+        controller.scheduledOrders = orders.filter(getScheduledOrder);
+
+        // create events from scheduledOrders
+        controller.events = controller.scheduledOrders.map(createFullCalendarEventFromOrder);
+    }
 }

package/addon/routes.js

@@ -31,7 +31,11 @@ export default buildRoutes(function () {
             });
         });
         this.route('vendors', function () {
-            this.route('index', { path: '/' });
+            this.route('index', { path: '/' }, function () {
+                this.route('new');
+                this.route('details', { path: '/:public_id' });
+                this.route('edit', { path: '/edit/:public_id' });
+            });
         });
         this.route('drivers', function () {
             this.route('index', { path: '/' }, function () {
@@ -48,16 +52,32 @@ export default buildRoutes(function () {
             });
         });
         this.route('places', function () {
-            this.route('index', { path: '/' });
+            this.route('index', { path: '/' }, function () {
+                this.route('new');
+                this.route('details', { path: '/:public_id' });
+                this.route('edit', { path: '/edit/:public_id' });
+            });
         });
         this.route('contacts', function () {
-            this.route('index', { path: '/' });
-        });
-        this.route('issues', function () {
-            this.route('index', { path: '/' });
+            this.route('index', { path: '/' }, function () {
+                this.route('new');
+                this.route('details', { path: '/:public_id' });
+                this.route('edit', { path: '/edit/:public_id' });
+            });
         });
         this.route('fuel-reports', function () {
-            this.route('index', { path: '/' });
+            this.route('index', { path: '/' }, function () {
+                this.route('new');
+                this.route('details', { path: '/:public_id' });
+                this.route('edit', { path: '/edit/:public_id' });
+            });
+        });
+        this.route('issues', function () {
+            this.route('index', { path: '/' }, function () {
+                this.route('new');
+                this.route('details', { path: '/:public_id' });
+                this.route('edit', { path: '/edit/:public_id' });
+            });
         });
         this.route('settings', function () {});
     });

package/addon/services/context-panel.js

@@ -36,6 +36,66 @@ export default class ContextPanelService extends Service {
                 componentArguments: [{ isResizable: true }, { width: '600px' }],
             },
         },
+        fleet: {
+            viewing: {
+                component: 'fleet-panel',
+                componentArguments: [{ isResizable: true }, { width: '600px' }],
+            },
+            editing: {
+                component: 'fleet-form-panel',
+                componentArguments: [{ isResizable: true }, { width: '600px' }],
+            },
+        },
+        fuelReport: {
+            viewing: {
+                component: 'fuel-report-panel',
+                componentArguments: [{ isResizable: true }, { width: '600px' }],
+            },
+            editing: {
+                component: 'fuel-report-form-panel',
+                componentArguments: [{ isResizable: true }, { width: '600px' }],
+            },
+        },
+        vendor: {
+            viewing: {
+                component: 'vendor-panel',
+                componentArguments: [{ isResizable: true }, { width: '600px' }],
+            },
+            editing: {
+                component: 'vendor-form-panel',
+                componentArguments: [{ isResizable: true }, { width: '600px' }],
+            },
+        },
+        contact: {
+            viewing: {
+                component: 'contact-panel',
+                componentArguments: [{ isResizable: true }, { width: '600px' }],
+            },
+            editing: {
+                component: 'contact-form-panel',
+                componentArguments: [{ isResizable: true }, { width: '600px' }],
+            },
+        },
+        place: {
+            viewing: {
+                component: 'place-panel',
+                componentArguments: [{ isResizable: true }, { width: '600px' }],
+            },
+            editing: {
+                component: 'place-form-panel',
+                componentArguments: [{ isResizable: true }, { width: '600px' }],
+            },
+        },
+        issue: {
+            viewing: {
+                component: 'issue-panel',
+                componentArguments: [{ isResizable: true }, { width: '600px' }],
+            },
+            editing: {
+                component: 'issue-form-panel',
+                componentArguments: [{ isResizable: true }, { width: '600px' }],
+            },
+        },
     };
 
     /**

package/addon/styles/fleetops-engine.css

@@ -0,0 +1,28 @@
+.scheduler-left-sidebar {
+    border-right: 1px rgba(229, 231, 235, 1) solid;
+    height: 100vh;
+    overflow-y: scroll;
+}
+
+body[data-theme="dark"] .scheduler-left-sidebar {
+    border-right: 1px rgba(55, 65, 81, 1) solid;
+}
+
+.scheduler-left-sidebar > .next-content-panel-wrapper  > .next-content-panel-container  > .next-content-panel > .next-content-panel-header.next-content-panel-is-closed {
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+}
+.scheduler-left-sidebar > .next-content-panel-wrapper  > .next-content-panel-container  > .next-content-panel > .next-content-panel-header {
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
+    border-top: 0;
+    border-left: 0;
+    border-right: 0;
+}
+
+.scheduler-left-sidebar > .next-content-panel-wrapper  > .next-content-panel-container  > .next-content-panel > .next-content-panel-body {
+    border-left: 0;
+    border-right: 0;
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+}

package/addon/templates/management/contacts/index/details.hbs

@@ -0,0 +1 @@
+<ContactPanel @contact={{@model}} @tab={{this.view}} @onTabChanged={{this.onTabChanged}} @onPressCancel={{this.transitionBack}} @onEdit={{this.onEdit}} />

package/addon/templates/management/contacts/index/edit.hbs

@@ -0,0 +1 @@
+<ContactFormPanel @contact={{@model}} @onPressCancel={{this.transitionBack}} @onAfterSave={{this.onAfterSave}} @onViewDetails={{this.onViewDetails}} @onLoad={{this.setOverlayContext}} />

package/addon/templates/management/contacts/index/new.hbs

@@ -0,0 +1 @@
+<ContactFormPanel @contact={{this.contact}} @onPressCancel={{this.transitionBack}} @onAfterSave={{this.onAfterSave}} @onLoad={{this.setOverlayContext}} />

package/addon/templates/management/contacts/index.hbs

@@ -1,7 +1,14 @@
 <Layout::Section::Header @title="Contacts" @searchQuery={{this.query}} @onSearch={{perform this.search}}>
-    <FiltersPicker @columns={{this.columns}} @onApply={{fn this.filters.apply this}} @onClear={{fn this.filters.reset this}} @onFilterClear={{this.filters.clear}} @onChange={{this.filters.set}} @buttonWrapperClass="mr-2" />
+    <FiltersPicker
+        @columns={{this.columns}}
+        @onApply={{fn this.filters.apply this}}
+        @onClear={{fn this.filters.reset this}}
+        @onFilterClear={{this.filters.clear}}
+        @onChange={{this.filters.set}}
+        @buttonWrapperClass="mr-2"
+    />
     <VisibleColumnPicker @columns={{this.columns}} @onChange={{fn (mut this.columns)}} class="mr-2" />
-   {{#if (safe-has this.table "selectedRows")}}
+    {{#if (safe-has this.table "selectedRows")}}
         <DropdownButton @icon="layer-group" @text="Bulk Action" @type="magic" @size="sm" @buttonWrapperClass="mr-2" @contentClass="dropdown-menu" as |dd|>
             <div class="next-dd-menu mt-2 mx-0">
                 <div class="px-1">
@@ -17,7 +24,19 @@
 </Layout::Section::Header>
 
 <Layout::Section::Body>
-    <Table @rows={{@model}} @columns={{this.columns}} @selectable={{true}} @canSelectAll={{true}} @onSetup={{fn (mut this.table)}} @pagination={{true}} @paginationMeta={{@model.meta}} @page={{this.page}} @onPageChange={{fn (mut this.page)}} @tfootVerticalOffset="53" @tfootVerticalOffsetElements=".next-view-section-subheader" />
+    <Table
+        @rows={{@model}}
+        @columns={{this.columns}}
+        @selectable={{true}}
+        @canSelectAll={{true}}
+        @onSetup={{fn (mut this.table)}}
+        @pagination={{true}}
+        @paginationMeta={{@model.meta}}
+        @page={{this.page}}
+        @onPageChange={{fn (mut this.page)}}
+        @tfootVerticalOffset="53"
+        @tfootVerticalOffsetElements=".next-view-section-subheader"
+    />
 </Layout::Section::Body>
 
 {{outlet}}

package/addon/templates/management/drivers/index.hbs

@@ -1,9 +1,21 @@
-<Layout::Section::Header @title={{t "fleet-ops.management.drivers.index.title"}} @searchPlaceholder={{t "fleet-ops.management.drivers.index.fields.search.placeholder"}} @searchQuery={{this.query}} @onSearch={{perform this.search}}>
+<Layout::Section::Header
+    @title={{t "fleet-ops.management.drivers.index.title"}}
+    @searchPlaceholder={{t "fleet-ops.management.drivers.index.fields.search.placeholder"}}
+    @searchQuery={{this.query}}
+    @onSearch={{perform this.search}}
+>
     <Button @icon="grip-horizontal" @prefix="fas" @onClick={{fn this.changeLayout "grid"}} @disabled={{this.isGridLayout}} class="mr-2" />
     <Button @icon="table" @prefix="fas" @onClick={{fn this.changeLayout "table"}} @disabled={{this.isTableLayout}} class="mr-2" />
-    <FiltersPicker @columns={{this.columns}} @onApply={{fn this.filters.apply this}} @onClear={{fn this.filters.reset this}} @onFilterClear={{this.filters.clear}} @onChange={{this.filters.set}} @buttonWrapperClass="mr-2" />
+    <FiltersPicker
+        @columns={{this.columns}}
+        @onApply={{fn this.filters.apply this}}
+        @onClear={{fn this.filters.reset this}}
+        @onFilterClear={{this.filters.clear}}
+        @onChange={{this.filters.set}}
+        @buttonWrapperClass="mr-2"
+    />
     <VisibleColumnPicker @columns={{this.columns}} @onChange={{fn (mut this.columns)}} class="mr-2" />
-   {{#if (safe-has this.table "selectedRows")}}
+    {{#if (safe-has this.table "selectedRows")}}
         <DropdownButton @icon="layer-group" @text="Bulk Action" @type="magic" @size="sm" @buttonWrapperClass="mr-2" @contentClass="dropdown-menu" as |dd|>
             <div class="next-dd-menu mt-2 mx-0">
                 <div class="px-1">
@@ -20,7 +32,19 @@
 
 {{#if this.isTableLayout}}
     <Layout::Section::Body>
-        <Table @rows={{@model}} @columns={{this.columns}} @selectable={{true}} @canSelectAll={{true}} @onSetup={{fn (mut this.table)}} @pagination={{true}} @paginationMeta={{@model.meta}} @page={{this.page}} @onPageChange={{fn (mut this.page)}} @tfootVerticalOffset="53" @tfootVerticalOffsetElements=".next-view-section-subheader" />
+        <Table
+            @rows={{@model}}
+            @columns={{this.columns}}
+            @selectable={{true}}
+            @canSelectAll={{true}}
+            @onSetup={{fn (mut this.table)}}
+            @pagination={{true}}
+            @paginationMeta={{@model.meta}}
+            @page={{this.page}}
+            @onPageChange={{fn (mut this.page)}}
+            @tfootVerticalOffset="53"
+            @tfootVerticalOffsetElements=".next-view-section-subheader"
+        />
     </Layout::Section::Body>
 {{/if}}
 
@@ -34,4 +58,4 @@
     </div>
 {{/if}}
 
-{{outlet}}
+{{outlet}}

package/addon/templates/management/fleets/index/details.hbs

@@ -1 +1 @@
-<FleetPanel @fleet={{@model}} @tab={{this.view}} @onPressCancel={{this.transitionBack}} />
+<FleetPanel @fleet={{@model}} @tab={{this.view}} @onTabChanged={{this.onTabChanged}} @onPressCancel={{this.transitionBack}} @onEdit={{this.onEdit}} />

package/addon/templates/management/fleets/index/edit.hbs

@@ -1 +1 @@
-<FleetFormPanel @fleet={{@model}} @onUpdateFleet={{this.updateFleet}} @onPressCancel={{this.transitionBack}}/>
+<FleetFormPanel @fleet={{@model}} @onPressCancel={{this.transitionBack}} @onViewDetails={{this.onViewDetails}} @onAfterSave={{this.onAfterSave}} @onLoad={{this.setOverlayContext}} />

package/addon/templates/management/fleets/index/new.hbs

@@ -1 +1 @@
-<FleetFormPanel @fleet={{this.fleet}} @onCreateFleet={{this.createFleet}} @onPressCancel={{this.transitionBack}}/>
+<FleetFormPanel @fleet={{this.fleet}} @onPressCancel={{this.transitionBack}} @onAfterSave={{this.onAfterSave}} @onLoad={{this.setOverlayContext}} />

package/addon/templates/management/fuel-reports/index/details.hbs

@@ -0,0 +1 @@
+<FuelReportPanel @fuelReport={{@model}} @tab={{this.view}} @onTabChanged={{this.onTabChanged}} @onPressCancel={{this.transitionBack}} @onEdit={{this.onEdit}} />

package/addon/templates/management/fuel-reports/index/edit.hbs

@@ -0,0 +1 @@
+<FuelReportFormPanel @fuelReport={{@model}} @onPressCancel={{this.transitionBack}} @onAfterSave={{this.onAfterSave}} @onViewDetails={{this.onViewDetails}} @onLoad={{this.setOverlayContext}} />

package/addon/templates/management/fuel-reports/index/new.hbs

@@ -0,0 +1 @@
+<FuelReportFormPanel @fuelReport={{this.fuelReport}} @onPressCancel={{this.transitionBack}} @onAfterSave={{this.onAfterSave}} @onLoad={{this.setOverlayContext}} />

package/addon/templates/management/fuel-reports/index.hbs

@@ -1,7 +1,14 @@
 <Layout::Section::Header @title="Fuel Reports" @searchQuery={{this.query}} @onSearch={{perform this.search}}>
-    <FiltersPicker @columns={{this.columns}} @onApply={{fn this.filters.apply this}} @onClear={{fn this.filters.reset this}} @onFilterClear={{this.filters.clear}} @onChange={{this.filters.set}} @buttonWrapperClass="mr-2" />
+    <FiltersPicker
+        @columns={{this.columns}}
+        @onApply={{fn this.filters.apply this}}
+        @onClear={{fn this.filters.reset this}}
+        @onFilterClear={{this.filters.clear}}
+        @onChange={{this.filters.set}}
+        @buttonWrapperClass="mr-2"
+    />
     <VisibleColumnPicker @columns={{this.columns}} @onChange={{fn (mut this.columns)}} class="mr-2" />
-   {{#if (safe-has this.table "selectedRows")}}
+    {{#if (safe-has this.table "selectedRows")}}
         <DropdownButton @icon="layer-group" @text="Bulk Action" @type="magic" @size="sm" @buttonWrapperClass="mr-2" @contentClass="dropdown-menu" as |dd|>
             <div class="next-dd-menu mt-2 mx-0">
                 <div class="px-1">
@@ -17,5 +24,19 @@
 </Layout::Section::Header>
 
 <Layout::Section::Body @pagination={{true}} @onToggleAll={{this.toggleAll}} @allToggled={{this.allToggled}}>
-    <Table @rows={{@model}} @columns={{this.columns}} @selectable={{true}} @canSelectAll={{true}} @onSetup={{fn (mut this.table)}} @pagination={{true}} @paginationMeta={{@model.meta}} @page={{this.page}} @onPageChange={{fn (mut this.page)}} @tfootVerticalOffset="53" @tfootVerticalOffsetElements=".next-view-section-subheader" />
-</Layout::Section::Body>
+    <Table
+        @rows={{@model}}
+        @columns={{this.columns}}
+        @selectable={{true}}
+        @canSelectAll={{true}}
+        @onSetup={{fn (mut this.table)}}
+        @pagination={{true}}
+        @paginationMeta={{@model.meta}}
+        @page={{this.page}}
+        @onPageChange={{fn (mut this.page)}}
+        @tfootVerticalOffset="53"
+        @tfootVerticalOffsetElements=".next-view-section-subheader"
+    />
+</Layout::Section::Body>
+
+{{outlet}}

package/addon/templates/management/issues/index/details.hbs

@@ -0,0 +1 @@
+<IssuePanel @issue={{@model}} @tab={{this.view}} @onTabChanged={{this.onTabChanged}} @onPressCancel={{this.transitionBack}} @onEdit={{this.onEdit}} />

package/addon/templates/management/issues/index/edit.hbs

@@ -0,0 +1 @@
+<IssueFormPanel @issue={{@model}} @onPressCancel={{this.transitionBack}} @onAfterSave={{this.onAfterSave}} @onViewDetails={{this.onViewDetails}} @onLoad={{this.setOverlayContext}} />

package/addon/templates/management/issues/index/new.hbs

@@ -0,0 +1 @@
+<IssueFormPanel @issue={{this.issue}} @onPressCancel={{this.transitionBack}} @onAfterSave={{this.onAfterSave}} @onLoad={{this.setOverlayContext}} />

package/addon/templates/management/issues/index.hbs

@@ -12,10 +12,12 @@
             </div>
         </DropdownButton>
     {{/if}}
-    <Button @icon="plus" @iconPrefix="fas" @type="primary" @text="New" class="mr-2" />
-    <Button @icon="long-arrow-up" @iconClass="rotate-icon-45" @text="Export" />
+    <Button @icon="plus" @iconPrefix="fas" @type="primary" @text="New" class="mr-2" @onClick={{this.createIssue}} />
+    <Button @icon="long-arrow-up" @iconClass="rotate-icon-45" @text="Export" @onClick={{this.exportIssues}} />
 </Layout::Section::Header>
 
 <Layout::Section::Body>
     <Table @rows={{@model}} @columns={{this.columns}} @selectable={{true}} @canSelectAll={{true}} @onSetup={{fn (mut this.table)}} @pagination={{true}} @paginationMeta={{@model.meta}} @page={{this.page}} @onPageChange={{fn (mut this.page)}} @tfootVerticalOffset="53" @tfootVerticalOffsetElements=".next-view-section-subheader" />
-</Layout::Section::Body>
+</Layout::Section::Body>
+
+{{outlet}}

package/addon/templates/management/places/index/details.hbs

@@ -0,0 +1 @@
+<PlacePanel @place={{@model}} @tab={{this.view}} @onTabChanged={{this.onTabChanged}} @onPressCancel={{this.transitionBack}} @onEdit={{this.onEdit}} />

package/addon/templates/management/places/index/edit.hbs

@@ -0,0 +1 @@
+<PlaceFormPanel @place={{@model}} @onPressCancel={{this.transitionBack}} @onAfterSave={{this.onAfterSave}} @onViewDetails={{this.onViewDetails}} @onLoad={{this.setOverlayContext}} />

package/addon/templates/management/places/index/new.hbs

@@ -0,0 +1 @@
+<PlaceFormPanel @place={{this.place}} @onPressCancel={{this.transitionBack}} @onAfterSave={{this.onAfterSave}} @onLoad={{this.setOverlayContext}} />

package/addon/templates/management/vendors/index/details.hbs

@@ -0,0 +1 @@
+<VendorPanel @vendor={{@model}} @tab={{this.view}} @onTabChanged={{this.onTabChanged}} @onPressCancel={{this.transitionBack}} @onEdit={{this.onEdit}} />

package/addon/templates/management/vendors/index/edit.hbs

@@ -0,0 +1 @@
+<VendorFormPanel @vendor={{@model}} @onPressCancel={{this.transitionBack}} @onAfterSave={{this.onAfterSave}} @onViewDetails={{this.onViewDetails}} @onLoad={{this.setOverlayContext}} />

package/addon/templates/management/vendors/index/new.hbs

@@ -0,0 +1 @@
+<VendorFormPanel @vendor={{this.vendor}} @onPressCancel={{this.transitionBack}} @onAfterSave={{this.onAfterSave}} @onLoad={{this.setOverlayContext}} />

package/addon/templates/operations/orders/index.hbs

@@ -1,21 +1,21 @@
 <MapContainer::Topbar class="next-topbar-{{this.layout}}">
     <MapContainer::ViewSwitch>
         <FaIcon @icon="layer-group" class="mr-2 text-gray-400 dark:text-gray-600" />
-        <button type="button" class="{{if this.isMapLayout 'active'}}" {{on "click" (fn this.setLayoutMode "map")}}>Map</button>
-        <button type="button" class="{{if this.isTableLayout 'active'}} flex flex-row items-center relative" {{on "click" (fn this.setLayoutMode "table")}}>
+        <button type="button" id="ops-map-view-button" class="{{if this.isMapLayout 'active'}}" {{on "click" (fn this.setLayoutMode "map")}}>Map</button>
+        <button type="button" id="ops-table-view-button" class="{{if this.isTableLayout 'active'}} flex flex-row items-center relative" {{on "click" (fn this.setLayoutMode "table")}}>
             <div class="mr-1.5">Table</div>
             <Badge class="flex items-center justify-center -mr-4" @spanClass="rounded-full items-center justify-center h-4 w-4" @hideStatusDot={{true}} @status="info">{{@model.meta.total}}</Badge>
         </button>
-        {{!-- <button type="button" class="{{if this.isKanbanView 'active'}}" {{on "click" (fn this.setLayoutMode "kanban")}}>Board</button> --}}
+        {{!-- <button type="button" id="ops-kanban-view-button" class="{{if this.isKanbanView 'active'}}" {{on "click" (fn this.setLayoutMode "kanban")}}>Board</button> --}}
     </MapContainer::ViewSwitch>
 </MapContainer::Topbar>
 
 {{#if this.isMapLayout}}
     <MapContainer @layout={{this.layout}} @onReady={{this.onMapContainerReady}}>
         <GlobalSearch @visible={{this.isSearchVisible}} @onPressOrder={{this.viewOrder}} />
-        <MapContainer::Toolbar @activeOrdersCount={{this.activeOrdersCount}} @liveMap={{this.liveMap}} @map={{this.leafletMap}} @onPressViewOrders={{this.toggleOrdersPanel}} @onPressSearch={{this.toggleSearch}} @onPressCreateOrder={{this.createOrder}} @onPressCreateDriver={{this.driversController.createDriver}} @onPressDriverProfile={{this.driversController.viewDriver}} />
+        <MapContainer::Toolbar @activeOrdersCount={{this.activeOrdersCount}} @liveMap={{this.liveMap}} @map={{this.leafletMap}} @onPressViewOrders={{this.toggleOrdersPanel}} @onPressSearch={{this.toggleSearch}} @onPressCreateOrder={{this.createOrder}} @onPressLiveMapDrawerToggle={{this.onPressLiveMapDrawerToggle}} />
         <OrderListOverlay @noBackdrop={{true}} @fullHeight={{true}} @outView={{not this.isOrdersPanelVisible}} @width={{if (media 'isMobile') "100%" "338px"}} @onPressCancel={{this.hideOrdersPanel}} @onPressCreateOrder={{this.createOrder}} @onPressViewOrder={{this.viewOrder}} @onPressCreateFleet={{this.fleetController.createFleet}} @onPressManageFleet={{this.fleetController.viewFleet}} @onPressCancelOrders={{this.bulkCancelOrders}} @onPressDeleteOrders={{this.bulkDeleteOrders}} />
-        <LiveMap id="leafletMap" class="next-leaflet-container-map" @lat={{1.3521}} @lng={{103.8198}} @zoom={{12}} @zoomControl={{false}} @onLoad={{this.setMapReference}} {{set-container-dimensions}} />
+        <LiveMap id="leafletMap" class="next-leaflet-container-map" @lat={{1.3521}} @lng={{103.8198}} @zoom={{12}} @zoomControl={{false}} @onLoad={{this.setMapReference}} @onDrawerReady={{this.setDrawerContext}} {{set-container-dimensions}} />
     </MapContainer>
 {{/if}}
 

package/addon/templates/operations/scheduler/index.hbs

@@ -1,10 +1,18 @@
 <Layout::Section::Header @title="Scheduler" />
 
-{{!-- <div>
-    <div class="p-6">
-        <div class="grid grid-cols-3 gap-4">
-            <div class="space-y-4">
-                <ContentPanel @title="Unscheduled Orders" @titleStatuRight={{this.unscheduledOrders.length}} @titleStatuRightClass="info-status-badge" @hideStatusDot={{true}} @open={{this.unscheduledOrders.length}} @pad={{true}} @panelBodyClass="bg-white dark:bg-gray-800">
+<Layout::Section::Body class="overflow-y-scroll h-screen">
+    <div class="h-screen">
+        <div class="grid grid-cols-1 lg:grid-cols-3">
+            <div class="scheduler-left-sidebar">
+                <ContentPanel
+                    @title="Unscheduled Orders"
+                    @titleStatuRight={{this.unscheduledOrders.length}}
+                    @titleStatuRightClass="info-status-badge"
+                    @hideStatusDot={{true}}
+                    @open={{true}}
+                    @pad={{true}}
+                    @panelBodyClass="bg-white dark:bg-gray-900"
+                >
                     <div class="space-y-4">
                         {{#each this.unscheduledOrders as |order|}}
                             <FullCalendar::Draggable @eventData={{json-hash id=order.id title=order.eventTitle allDay=true}}>
@@ -13,7 +21,15 @@
                         {{/each}}
                     </div>
                 </ContentPanel>
-                <ContentPanel @title="Scheduled Orders" @titleStatuRight={{this.scheduledOrders.length}} @titleStatusRightClass="info-status-badge" @hideStatusDot={{true}} @open={{this.scheduledOrders.length}} @pad={{true}} @panelBodyClass="bg-white dark:bg-gray-800">
+                <ContentPanel
+                    @title="Scheduled Orders"
+                    @titleStatuRight={{this.scheduledOrders.length}}
+                    @titleStatusRightClass="info-status-badge"
+                    @hideStatusDot={{true}}
+                    @open={{true}}
+                    @pad={{true}}
+                    @panelBodyClass="bg-white dark:bg-gray-900"
+                >
                     <div class="space-y-4">
                         {{#each this.scheduledOrders as |order|}}
                             <Order::ScheduleCard @order={{order}} @titleClass="cursor-pointer" @onTitleClick={{fn this.viewEvent order}} />
@@ -22,9 +38,17 @@
                 </ContentPanel>
             </div>
 
-            <div class="col-span-2">
-                <FullCalendar @events={{this.events}} @onDrop={{this.scheduleEventFromDrop}} @onEventReceive={{this.receivedEvent}} @onEventDrop={{this.rescheduleEventFromDrag}} @onEventClick={{this.viewOrderAsEvent}} />
+            <div class="col-span-2 p-4">
+                <FullCalendar
+                    @events={{this.events}}
+                    @editable={{true}}
+                    @onDrop={{this.scheduleEventFromDrop}}
+                    @onEventReceive={{this.receivedEvent}}
+                    @onEventDrop={{this.rescheduleEventFromDrag}}
+                    @onEventClick={{this.viewOrderAsEvent}}
+                    @onInit={{this.setCalendarApi}}
+                />
             </div>
         </div>
     </div>
-</div> --}}
+</Layout::Section::Body>