ui-lib/lib/element/addworkorder.js

import { createElement, Dropdown, Popup, validation, toDateValue, showAlert } from "../ui";
import { r as lang, nullOrEmpty } from "../utility";

let r = lang;

const iconWorkOrder = 'data:image/png;base64,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';

export default class AddWorkOrder {
    _var = {
        option: {
            isCustomerRecord: true
        },
        /**
         * @private
         * @type {HTMLElement}
         */
        container: null
    };

    constructor(opt) {
        opt ??= {};
        this._var.option = opt;
        const getText = opt.getText;
        if (typeof getText === 'function') {
            r = getText;
        }
    }

    get complaint() {
        return this._var.container.querySelector('.wo-complaint')?.value;
    }

    show() {
        const option = this._var.option;
        var title = r('P_WO_OPENWORKORDER', 'Open Work Order');
        const container = createElement('div', 'open-wo-container',
            createElement('div', 'open-wo-header',
                createElement('img', img => img.src = iconWorkOrder),
                createElement('h3', h3 => h3.innerText = title)
            ),
            createElement('div', 'open-wo-content',
                createElement('div', 'wo-line',
                    createElement('span', span => {
                        span.className = 'wo-title wo-title-required';
                        span.innerText = r('P_WO_ASSET_COLON', 'Asset:');
                    })
                ),
                createElement('div', 'wo-line',
                    createElement('span', span => {
                        span.className = 'wo-title wo-title-required';
                        span.innerText = r('P_WO_COMPLAINTCOLON', 'Complaint:');
                    })
                ),
                createElement('div', 'wo-line wo-sub-line',
                    createElement('textarea', textarea => {
                        textarea.className = 'ui-text wo-complaint';
                        textarea.placeholder = r('P_WO_ENTERCOMPLAINT', 'Enter Complaint');
                    })
                ),
                createElement('div', 'wo-line',
                    createElement('span', span => {
                        span.className = 'wo-title';
                        span.innerText = r('P_WO_WORKORDERTYPE_COLON', 'Work Order Type:');
                    })
                ),
                createElement('div', 'wo-line wo-customer-record',
                    createElement('span', span => {
                        span.className = 'wo-title';
                        span.innerText = r('P_WO_COMPANYNAME_COLON', 'Company Name:');
                    })
                ),
                createElement('div', 'wo-line',
                    createElement('span', span => {
                        span.className = 'wo-title';
                        span.innerText = r('P_WO_STATUS_COLON', 'Status:');
                    })
                ),
                createElement('div', 'wo-line wo-sub-line wo-status-closed',
                    createElement('span', span => {
                        span.className = 'wo-title';
                        span.innerText = r('P_WO_COMPLETEDDATE_COLON', 'Completed Date:');
                    })
                ),
                createElement('div', 'wo-line wo-sub-line wo-status-closed',
                    createElement('span', span => {
                        span.className = 'wo-title';
                        span.innerText = r('P_WO_HOURS_COLON', 'Hours:');
                    })
                ),
                createElement('div', 'wo-line wo-sub-line wo-status-closed',
                    createElement('span', span => {
                        span.className = 'wo-title';
                        span.innerText = r('P_WO_ODOMETER_COLON', 'Odometer:');
                    })
                ),
                createElement('div', 'wo-line',
                    createElement('span', span => {
                        span.className = 'wo-title';
                        span.innerText = r('P_WO_ASSIGNEDTO_COLON', 'Assigned To:');
                    })
                ),
                createElement('div', 'wo-line wo-customer-record',
                    createElement('span', span => {
                        span.className = 'wo-title';
                        span.innerText = r('P_WO_ADVISOR_COLON', 'Advisor:');
                    })
                ),
                createElement('div', 'wo-line wo-customer-record',
                    createElement('span', span => {
                        span.className = 'wo-title';
                        span.innerText = r('P_WO_LOCATION_COLON', 'Location:');
                    })
                ),
                createElement('div', 'wo-line wo-customer-record',
                    createElement('span', span => {
                        span.className = 'wo-title';
                        span.innerText = r('P_WO_DEPARTMENT_COLON', 'Department:');
                    })
                )
            )
        );
        this._var.container = container;
        const popup = new Popup({
            title,
            content: container,
            buttons: [
                {
                    key: 'open',
                    text: title,
                    trigger: () => {
                        if (nullOrEmpty(this.complaint)) {
                            showAlert(title, r('P_WO_COMPLAINTREQUIRED', 'Complaint is required.')).then(() => container.querySelector('.wo-complaint')?.focus());
                            return false;
                        }
                    }
                },
                { text: r('P_WO_CANCEL', 'Cancel') }
            ]
        });
        popup.create();
        popup.rect = { width: 600 };
        return popup.show();
    }
}