several improvements, new components for customer portal order mgmt a…

…nd order creation, added eta and tracker info to order view, added vietnamese translations

addon/components/custom-field.js

@@ -45,6 +45,7 @@ export default class CustomFieldComponent extends Component {
     constructor(owner, { customField, orderConfig, order }) {
         super(...arguments);
         this.customField = customField;
+        this.value = customField.value;
         this.orderConfig = orderConfig;
         this.order = order;
         this.customFieldComponent = typeof customField.component === 'string' ? customField.component : 'input';

addon/components/customer/admin-settings.hbs

@@ -0,0 +1,46 @@
+<ContentPanel @title="Fleet-Ops Order Settings" @open={{true}} @pad={{true}} @panelBodyClass="bg-white dark:bg-gray-800 mb-4">
+    <InputGroup @name="Enabled Order Types">
+        <div class="space-y-1">
+            {{#if this.loadOrderConfigs.isRunning}}
+                <Spinner />
+            {{else}}
+                {{#each this.orderConfigs as |orderConfig|}}
+                    <Checkbox @value={{includes orderConfig.id this.enabledOrderConfigs}} @onChange={{perform this.toggleOrderConfig orderConfig}}>{{orderConfig.name}}</Checkbox>
+                {{/each}}
+            {{/if}}
+        </div>
+        {{#if this.toggleOrderConfig.isRunning}}
+            <div class="mt-4">
+                <Spinner @loadingMessage="Saving changes..." @loadingMessageClass="ml-2" @wrapperClass="flex flex-row items-center" />
+            </div>
+        {{/if}}
+    </InputGroup>
+    <InputGroup @name="Enable Payments" @wrapperClass="mb-0i">
+        <Toggle
+            @isToggled={{this.paymentsEnabled}}
+            @onToggle={{perform this.togglePayments}}
+            @label="Enable customer to make payments through portal"
+            @wrapperClass={{if (or this.togglePayments.isRunning this.loadOrderConfigs.isRunning) "pointer-events-none opacity-50" ""}}
+            @disable={{not this.paymentsOnboardCompleted}}
+        />
+        {{#if this.toggleOrderConfig.isIdle}}
+            <div class="space-y-4 mt-4">
+                {{#unless this.paymentsOnboardCompleted}}
+                    <InfoBlock @type="warning" @icon="triangle-exclamation">
+                        <span>Payment onboard must be completed to enable payments from customers.</span>
+                        <Button @text="Completed Payments Onboard" @onClick={{transition-to "settings.payments.onboard"}} @wrapperClass="mt-2" />
+                    </InfoBlock>
+                {{/unless}}
+                <InfoBlock
+                    @type={{if this.isStripeEnabled "success" "warning"}}
+                    @icon={{if this.isStripeEnabled "check" "triangle-exclamation"}}
+                    @text={{if
+                        this.isStripeEnabled
+                        "Stripe is configured."
+                        "Stripe is NOT configured. The system administrator needs to configure stripe in order for customer payments to be accepted"
+                    }}
+                />
+            </div>
+        {{/if}}
+    </InputGroup>
+</ContentPanel>

addon/components/customer/admin-settings.js

@@ -0,0 +1,82 @@
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { inject as service } from '@ember/service';
+import { isEmpty } from '@ember/utils';
+import { task } from 'ember-concurrency';
+import config from 'ember-get-config';
+
+export default class CustomerAdminSettingsComponent extends Component {
+    @service fetch;
+    @service store;
+    @service notifications;
+    @tracked orderConfigs = [];
+    @tracked enabledOrderConfigs = [];
+    @tracked paymentsEnabled = false;
+    @tracked paymentsOnboardCompleted = false;
+    @tracked paymentGateway = 'stripe';
+
+    get isStripeEnabled() {
+        return window.stripeInstance !== undefined || !isEmpty(config.stripe.publishableKey);
+    }
+
+    constructor() {
+        super(...arguments);
+        this.loadOrderConfigs.perform();
+    }
+
+    @task *loadOrderConfigs() {
+        try {
+            this.orderConfigs = this.store.findAll('order-config');
+        } catch (error) {
+            this.notifications.serverError(error);
+        }
+
+        try {
+            this.enabledOrderConfigs = yield this.fetch.get('fleet-ops/settings/customer-enabled-order-configs');
+        } catch (error) {
+            this.notifications.serverError(error);
+        }
+
+        try {
+            const paymentsConfig = yield this.fetch.get('fleet-ops/settings/customer-payments-config');
+            if (paymentsConfig) {
+                this.paymentsEnabled = paymentsConfig.paymentsEnabled;
+                this.paymentsOnboardCompleted = paymentsConfig.paymentsOnboardCompleted;
+            }
+        } catch (error) {
+            this.notifications.serverError(error);
+        }
+    }
+
+    @task *toggleOrderConfig(orderConfig) {
+        const inlcudesOrderConfig = this.enabledOrderConfigs.find((id) => id === orderConfig.id);
+        if (inlcudesOrderConfig) {
+            this.enabledOrderConfigs.removeObject(orderConfig.id);
+        } else {
+            this.enabledOrderConfigs.pushObject(orderConfig.id);
+        }
+
+        try {
+            yield this.fetch.post('fleet-ops/settings/customer-enabled-order-configs', { enabledOrderConfigs: this.enabledOrderConfigs });
+            this.notifications.success('Settings saved.');
+        } catch (error) {
+            this.notifications.serverError(error);
+        }
+    }
+
+    @task *togglePayments(enabled) {
+        if (!this.isStripeEnabled) {
+            this.paymentsEnabled = false;
+            return this.notifications.warning('You must configure Stripe first to accept payments.');
+        }
+
+        this.paymentsEnabled = enabled;
+
+        try {
+            yield this.fetch.post('fleet-ops/settings/customer-payments-config', { paymentsConfig: { paymentsEnabled: this.paymentsEnabled, paymentGateway: 'stripe' } });
+            this.notifications.success('Settings saved.');
+        } catch (error) {
+            this.notifications.serverError(error);
+        }
+    }
+}