{"version":3,"file":"app-b459db1b.9729664bca28a8e6916d.bundle.js","mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AACA;AAEA;AAIA;AAAA;AAWA;AAAA;AAbA;AAAA;AAAA;AAAA;AAMA;AACA;AACA;AAAA;AAMA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AApIA;AAAA;AAAA;AAAA;AAAA;AAIA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAKA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;ACjBA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;AAEA;AACA;AACA;AACA;AACA;AAjBA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;ACZA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAYA;AACA;AAAA;AAXA;AACA;AACA;AAAA;AAAA;AAKA;AAKA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AAtIA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACfA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAeA;AACA;AAAA;AAdA;AACA;AACA;AACA;AAAA;AAAA;AAKA;AACA;AAMA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AAEA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AACA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AACA;AACA;AACA;AApNA;AAAA;AAAA;AAAA;AAAA;AACA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;;;ACpBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;;ACPA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;;ACPA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;;;ACPA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;ACPA;AACA;AACA;AACA;;;;;;;;;;;ACHA;AACA;AACA;AACA;;;;;;;;;;;ACHA;AACA;AACA;AACA;;;;;;;;;;;ACHA;AACA;AACA;AACA","sources":["webpack://www.zeusteam.com/./src/resources/elements/kpis/kpi-health.js","webpack://www.zeusteam.com/./src/resources/elements/kpis/kpi-number.js","webpack://www.zeusteam.com/./src/resources/elements/kpis/kpi-simple.js","webpack://www.zeusteam.com/./src/resources/elements/kpis/kpi.js","webpack://www.zeusteam.com/./src/resources/elements/kpis/kpi-health.scss","webpack://www.zeusteam.com/./src/resources/elements/kpis/kpi-number.scss","webpack://www.zeusteam.com/./src/resources/elements/kpis/kpi-simple.scss","webpack://www.zeusteam.com/./src/resources/elements/kpis/kpi.scss","webpack://www.zeusteam.com/./src/resources/elements/kpis/kpi-health.html","webpack://www.zeusteam.com/./src/resources/elements/kpis/kpi-number.html","webpack://www.zeusteam.com/./src/resources/elements/kpis/kpi-simple.html","webpack://www.zeusteam.com/./src/resources/elements/kpis/kpi.html"],"sourcesContent":["import { bindable, observable } from 'aurelia-framework';\r\nimport { Kpis } from 'services/kpis';\r\nimport moment from 'moment';\r\n\r\nexport class KpiHealth {\r\n    static inject = [Kpis];\r\n    _kpis;\r\n\r\n    @bindable({ changeHandler: '_load' }) memberId;\r\n    @bindable reload;\r\n    @bindable productionType = 'submitted';\r\n\r\n    momentTimePeriod = 'week';\r\n    asOfDate;\r\n    reload;\r\n    @observable kpiAsOfDate = moment();\r\n\r\n    @observable downlineMember;\r\n\r\n    constructor(kpis) {\r\n        this._kpis = kpis;\r\n    }\r\n\r\n    reloadChanged() {\r\n        if (!this.reload) return;\r\n        this._load();\r\n    }\r\n\r\n    previous() {\r\n        if (!this.canGoPrevious) return;\r\n        this.asOfDate = this.asOfDate.add(-1, this.momentTimePeriod);\r\n        this._load();\r\n    }\r\n\r\n    next() {\r\n        if (!this.canGoNext) return;\r\n        this.asOfDate = this.asOfDate.add(1, this.momentTimePeriod);\r\n        this._load();\r\n    }\r\n\r\n    kpiAsOfDateChanged() {\r\n        this.asOfDate = this.kpiAsOfDate.startOf('day').utc();\r\n        this._load();\r\n    }\r\n\r\n    current() {\r\n        this.asOfDate = undefined;\r\n        this._load();\r\n    }\r\n\r\n    downlineMemberChanged() {\r\n        this._load();\r\n    }\r\n\r\n    selectProductionType(productionType) {\r\n        this.productionType = productionType;\r\n        this._load();\r\n    }\r\n\r\n    async _load() {\r\n        if (!this.memberId) return;\r\n        this.loading = true;\r\n        try {\r\n            let initialLoad = false;\r\n            if (!this.asOfDate) {\r\n                initialLoad = true;\r\n                this.asOfDate = moment().utc();\r\n            }\r\n            const memberId = this.downlineMember ? this.downlineMember.id : this.memberId;\r\n            this.health = await this._kpis.health(memberId, this.asOfDate.toISOString(true), this.productionType);\r\n            if (this.health === null) {\r\n                // This member doesn't have data to display for the health widget\r\n                return;\r\n            }\r\n            if (initialLoad) this.asOfDate = moment.utc(this.health.weekPeriod.end); // on initial, adjust to the end of the week\r\n            const nextTimePeriodStartDate = moment.utc(this.health.weekPeriod.end).add(1, 'day');\r\n            this.canGoNext = !nextTimePeriodStartDate.isAfter(moment().utc().endOf('day'));\r\n            this.canGoPrevious = true;\r\n        } catch (err) {\r\n            console.log(err);\r\n        } finally {\r\n            this.loading = false;\r\n        }\r\n    }\r\n\r\n    calculateValueSize(value) {\r\n        if (value < 10) return 1;\r\n        if (value < 100) return 2;\r\n        if (value < 1000) return 3;\r\n        if (value < 10000) return 4;\r\n        if (value < 100000) return 5;\r\n        if (value < 1000000) return 6;\r\n        return '';\r\n    }\r\n\r\n    displayKpi(kpi) {\r\n        this.viewKpi = kpi;\r\n        const weekLineDatasets = [];\r\n        weekLineDatasets.push({\r\n            key: 'kpi-13-week-rolling-average',\r\n            data: kpi.week.sparkline,\r\n            color: 'green',\r\n        });\r\n        weekLineDatasets.push({\r\n            key: kpi.kpiType,\r\n            data: kpi.week.sparklineKpi,\r\n            color: 'blue',\r\n        });\r\n        this.weekLineDatasets = weekLineDatasets;\r\n        const monthLineDatasets = [];\r\n        monthLineDatasets.push({\r\n            key: 'kpi-5-month-rolling-average',\r\n            data: kpi.month.sparkline,\r\n            color: 'green',\r\n        });\r\n        monthLineDatasets.push({\r\n            key: kpi.kpiType,\r\n            data: kpi.month.sparklineKpi,\r\n            color: 'blue',\r\n        });\r\n        this.monthLineDatasets = monthLineDatasets;\r\n        this.showDetails();\r\n    }\r\n\r\n    async refreshData() {\r\n        this.refreshing = true;\r\n        await this._load();\r\n        this.refreshing = false;\r\n    }\r\n\r\n    async showDetails() {\r\n        this.showDrawer = moment().format();\r\n    }\r\n\r\n    drawerClosed() {\r\n        this.viewKpi = undefined;\r\n    }\r\n}\r\n","import { bindable, computedFrom } from 'aurelia-framework';\r\n\r\nexport class KpiNumber {\r\n    @bindable loading;\r\n    @bindable title;\r\n    @bindable value;\r\n    @bindable decimals = 0;\r\n    @bindable increasePercent;\r\n    @bindable increaseCount;\r\n    @bindable progressPeriod;\r\n    @bindable isPercent = false;\r\n    @bindable isMoney = false;\r\n    @bindable size;\r\n\r\n    @computedFrom('increasePercent')\r\n    get increasePercentCss() {\r\n        if (this.increasePercent > 0) return 'success';\r\n        if (this.increasePercent < 0) return 'error';\r\n        return '';\r\n    }\r\n}","import { bindable } from 'aurelia-framework';\r\nimport { Router } from 'aurelia-router';\r\nimport { EventAggregator } from 'aurelia-event-aggregator';\r\nimport { Kpis, KPI_PERIOD } from 'services/kpis';\r\nimport { I18n } from 'common/i18n';\r\nimport Chart from 'chart.js/auto';\r\nimport { TimePeriodNavigatorBase } from 'resources/base-classes/time-period-navigator-base';\r\n\r\nexport class KpiSimple extends TimePeriodNavigatorBase {\r\n    static inject = [Router, EventAggregator, Kpis, I18n];\r\n    _router;\r\n    _kpis;\r\n    _i18n;\r\n\r\n    @bindable kpi;\r\n    @bindable sync;\r\n\r\n    chartEl;\r\n    showChart = true;\r\n\r\n    constructor(router, ea, kpis, i18n) {\r\n        super('kpi-simple', ea);\r\n        this._router = router;\r\n        this._kpis = kpis;\r\n        this._i18n = i18n;\r\n    }\r\n\r\n    attached() {\r\n        this._isAttached = true;\r\n        this._attached();\r\n        this._loadData();\r\n    }\r\n\r\n    kpiChanged() {\r\n        if (!this._isAttached) return;\r\n        this._loadData();\r\n    }\r\n\r\n    async refreshData() {\r\n        this.refreshing = true;\r\n        await this._loadData();\r\n        this.refreshing = false;\r\n    }\r\n\r\n    async _loadData(fromSync = false) {\r\n        if (!this.kpi || !this.chartEl) return;\r\n        try {\r\n            this.loading = true;\r\n            this.initializeTimePeriodNavigation(fromSync);\r\n\r\n            this.kpiProgress = await this._kpis.progress(this.kpi, this.asOfDate.toISOString(true));\r\n            this.showChart = true;\r\n\r\n            this.timePeriod = KPI_PERIOD.toTimePeriod(this.kpiProgress.kpiPeriod);\r\n            this.currentPeriod = this.kpiProgress.timePeriod;\r\n            this.setTimePeriodNavigationDisplays();\r\n            this._loadChart();\r\n        } catch (err) {\r\n            console.log(err);\r\n            this.showChart = false;\r\n        } finally {\r\n            this.loading = false;\r\n        }\r\n    }\r\n\r\n    _loadChart() {\r\n        try {\r\n            const dayOfYear = moment().dayOfYear();\r\n            const remainingDays = 366 - dayOfYear;\r\n            const data = {\r\n              labels: [this._i18n.tr('kpi-progress'), this._i18n.tr('kpi-short')],\r\n              datasets: [\r\n                    {\r\n                        label: '',\r\n                        data: [this.kpiProgress.progress, this.kpiProgress.neededToMeetGoal],\r\n                        backgroundColor: ['#B8D935', '#F4FBDB'],\r\n                        borderJoinStyle: 'miter',\r\n                        borderRadius: 15,\r\n                    },\r\n                    {\r\n                        label: '',\r\n                        data: [dayOfYear, remainingDays],\r\n                        backgroundColor: ['lightgray', 'transparent'],\r\n                        borderJoinStyle: 'miter',\r\n                        borderRadius: 3,\r\n                        weight: .4,\r\n                    }\r\n                ]\r\n            };\r\n            const plugin = {\r\n                id: 'content-at-center',\r\n                beforeDraw: (chart) => {\r\n                    let width = chart.width;\r\n                    let height = chart.height;\r\n                    let ctx = chart.ctx;\r\n              \r\n                    ctx.restore();\r\n\r\n                    const centerText = `${this.kpiProgress.isCurrency ? '$' : ''}${this.kpiProgress.progress.formatMoney(0)}`;\r\n                    let heightDivisor = 50;\r\n                    if (centerText.length >= 9) {\r\n                        heightDivisor = 150;\r\n                    } else if (centerText.length >= 7) {\r\n                        heightDivisor = 125;\r\n                    } else if (centerText.length >= 6) {\r\n                        heightDivisor = 115;\r\n                    } else if (centerText.length >= 5) {\r\n                        heightDivisor = 100;\r\n                    } else if (centerText.length >= 3) {\r\n                        heightDivisor = 75;\r\n                    }\r\n\r\n                    let fontSize = (height / heightDivisor).toFixed(2);\r\n                    ctx.font = `${fontSize}em sans-serif`;\r\n                    ctx.textBaseline = 'middle';\r\n              \r\n                    let textX = Math.round((width - ctx.measureText(centerText).width) / 2);\r\n                    let textY = height / 1.9;\r\n              \r\n                    ctx.fillText(centerText, textX, textY);\r\n                    ctx.save();\r\n                }\r\n            }\r\n            const config = {\r\n                type: 'doughnut',\r\n                data: data,\r\n                plugins: [plugin],\r\n                options: {\r\n                    responsive: true,\r\n                    cutout: '85%',\r\n                    plugins: {\r\n                        legend: { display: false },\r\n                        title: { display: false }\r\n                    }\r\n                },\r\n            };\r\n\r\n            if (this._chart) {\r\n                this._chart.data.datasets = data.datasets;\r\n                this._chart.update();\r\n                return;\r\n            }\r\n\r\n            this._chart = new Chart(this.chartEl, config);\r\n        } catch (err) {\r\n            console.log(err);\r\n        }\r\n    }\r\n}\r\n","import { bindable } from 'aurelia-framework';\r\nimport { Router } from 'aurelia-router';\r\nimport { EventAggregator } from 'aurelia-event-aggregator';\r\nimport { Kpis } from 'services/kpis';\r\nimport { Products } from 'services/products';\r\nimport { I18n } from 'common/i18n';\r\nimport Chart from 'chart.js/auto';\r\nimport { TimePeriodNavigatorBase } from 'resources/base-classes/time-period-navigator-base';\r\nimport { WIDGET, CHART_COLORS, LOB } from 'common/constants';\r\nimport { mode } from 'common/ui';\r\nimport { c } from 'common/common';\r\n\r\nexport class Kpi extends TimePeriodNavigatorBase {\r\n    static inject = [Router, EventAggregator, Kpis, Products, I18n];\r\n    _router;\r\n    _kpis;\r\n    _products;\r\n    _i18n;\r\n\r\n    @bindable kpi;\r\n    @bindable sync;\r\n\r\n    chartEl;\r\n    showChart = true;\r\n\r\n    _handlers = [];\r\n\r\n    constructor(router, ea, kpis, products, i18n) {\r\n        super('kpi', ea);\r\n        this._router = router;\r\n        this._kpis = kpis;\r\n        this._products = products;\r\n        this._i18n = i18n;\r\n    }\r\n\r\n    attached() {\r\n        this._isAttached = true;\r\n        this._attached();\r\n        this._loadData();\r\n        this._loadProductTypes();\r\n        this._handlers.push(this._ea.subscribe(c.EventKeys.site.modeChanged, () => {\r\n            if (this._chart) {\r\n                this._chart.destroy();\r\n                this._chart = undefined;\r\n            }\r\n            this.refreshData();\r\n        }));\r\n    }\r\n\r\n    detached() {\r\n        this._handlers.forEach(h => h.dispose());\r\n        this._handlers = [];\r\n    }\r\n\r\n    async _loadProductTypes() {\r\n        try {\r\n            const productTypes = await this._products.typesByLOB();\r\n            this.totalLifeProductTypes = productTypes.find(x => x.lineOfBusiness === LOB.Life).productTypes.length;\r\n        } catch (err) {\r\n            console.log(err);\r\n        }\r\n    }\r\n\r\n    kpiChanged() {\r\n        if (!this._isAttached) return;\r\n        this._loadData();\r\n    }\r\n\r\n    async refreshData() {\r\n        this.refreshing = true;\r\n        await this._loadData();\r\n        this.refreshing = false;\r\n    }\r\n\r\n    async _loadData(fromSync = false) {\r\n        if (!this.kpi || !this.chartEl) return;\r\n        try {\r\n            this.loading = true;\r\n            this.initializeTimePeriodNavigation(fromSync);\r\n\r\n            this.kpiProgress = await this._kpis.progress2(this.kpi, this.asOfDate.toISOString(true));\r\n            this.showChart = true;\r\n\r\n            this.timePeriod = WIDGET.Period.toReportTimePeriod(this.kpi.period);\r\n            this.currentPeriod = this.kpiProgress.timePeriod;\r\n            this.setTimePeriodNavigationDisplays();\r\n            this._loadChart();\r\n        } catch (err) {\r\n            console.log(err);\r\n            this.showChart = false;\r\n        } finally {\r\n            this.loading = false;\r\n        }\r\n    }\r\n\r\n    _loadChart() {\r\n        try {\r\n            const uiMode = mode();\r\n\r\n            const data = {\r\n              labels: [this._i18n.tr('kpi-progress'), this._i18n.tr('kpi-short')],\r\n              datasets: [\r\n                    {\r\n                        label: '',\r\n                        data: [this.kpiProgress.progress, this.kpiProgress.neededToMeetGoal],\r\n                        backgroundColor: CHART_COLORS.KpiCurrent(uiMode.mode),\r\n                        borderJoinStyle: 'miter',\r\n                        borderRadius: 15,\r\n                        borderWidth: 0,\r\n                        borderColor: 'transparent',\r\n                        spacing: 2,\r\n                        settings: { timePeriod: this.kpiProgress.timePeriod },\r\n                    }\r\n                ]\r\n            };\r\n            const timePeriodProgress = this.getTimePeriodProgress();\r\n            if (timePeriodProgress) {\r\n                data.datasets.push({\r\n                    label: '',\r\n                    data: [timePeriodProgress.percentComplete, timePeriodProgress.percentRemaining],\r\n                    backgroundColor: CHART_COLORS.KpiProgress(uiMode.mode),\r\n                    borderJoinStyle: 'miter',\r\n                    borderRadius: 3,\r\n                    borderWidth: 0,\r\n                    borderColor: 'transparent',\r\n                    weight: .4,\r\n                    spacing: 2,\r\n                    settings: { timePeriod: this.kpiProgress.timePeriod, percentComplete: timePeriodProgress.percentComplete },\r\n                });\r\n            }\r\n            if (this.kpiProgress.priorKpi1) {\r\n                data.datasets.push({\r\n                    label: '',\r\n                    data: [this.kpiProgress.priorKpi1.progress, this.kpiProgress.priorKpi1.neededToMeetGoal],\r\n                    backgroundColor: CHART_COLORS.KpiPrior1(uiMode.mode),\r\n                    borderJoinStyle: 'miter',\r\n                    borderRadius: 15,\r\n                    borderWidth: 0,\r\n                    borderColor: 'transparent',\r\n                    spacing: 2,\r\n                    settings: { timePeriod: this.kpiProgress.priorKpi1.timePeriod },\r\n                });\r\n            }\r\n            if (this.kpiProgress.priorKpi2) {\r\n                data.datasets.push({\r\n                    label: '',\r\n                    data: [this.kpiProgress.priorKpi2.progress, this.kpiProgress.priorKpi2.neededToMeetGoal],\r\n                    backgroundColor: CHART_COLORS.KpiPrior2(uiMode.mode),\r\n                    borderJoinStyle: 'miter',\r\n                    borderRadius: 15,\r\n                    borderWidth: 0,\r\n                    borderColor: 'transparent',\r\n                    spacing: 2,\r\n                    settings: { timePeriod: this.kpiProgress.priorKpi2.timePeriod },\r\n                });\r\n            }\r\n            const plugin = {\r\n                id: 'content-at-center',\r\n                beforeDraw: (chart) => {\r\n                    let width = chart.width;\r\n                    let height = chart.height;\r\n                    let ctx = chart.ctx;\r\n              \r\n                    ctx.restore();\r\n\r\n                    const centerText = `${this.kpiProgress.isCurrency ? '$' : ''}${this.kpiProgress.progress.formatMoney(2)}`;\r\n                    let heightDivisor = 50;\r\n                    if (centerText.length >= 12) {\r\n                        heightDivisor = 175;\r\n                    } else if (centerText.length >= 9) {\r\n                        heightDivisor = 150;\r\n                    } else if (centerText.length >= 7) {\r\n                        heightDivisor = 125;\r\n                    } else if (centerText.length >= 6) {\r\n                        heightDivisor = 115;\r\n                    } else if (centerText.length >= 5) {\r\n                        heightDivisor = 100;\r\n                    } else if (centerText.length >= 3) {\r\n                        heightDivisor = 75;\r\n                    }\r\n\r\n                    let fontSize = (height / heightDivisor).toFixed(2);\r\n                    ctx.font = `${fontSize}em sans-serif`;\r\n                    ctx.textBaseline = 'middle';\r\n                    ctx.fillStyle = uiMode.fontColor;\r\n              \r\n                    let textX = Math.round((width - ctx.measureText(centerText).width) / 2);\r\n                    let textY = height / 1.9;\r\n              \r\n                    ctx.fillText(centerText, textX, textY);\r\n                    ctx.save();\r\n                }\r\n            };\r\n            const config = {\r\n                type: 'doughnut',\r\n                data: data,\r\n                plugins: [plugin],\r\n                options: {\r\n                    responsive: true,\r\n                    cutout: '60%',\r\n                    plugins: {\r\n                        legend: { display: false },\r\n                        title: { display: false },\r\n                        tooltip: {\r\n                            callbacks: {\r\n                                label: (ctx) => {\r\n                                    if (!ctx || !ctx.dataset || !ctx.dataset.settings) return '';\r\n                                    const timePeriodDisplay = this.getTimePeriodDisplay(ctx.dataset.settings.timePeriod);\r\n                                    if (ctx.dataset.settings.percentComplete) {\r\n                                        return this._i18n.tr('time-period-percent-complete', { period: timePeriodDisplay, percent: ctx.dataset.settings.percentComplete });\r\n                                    }\r\n                                    const formattedValue = `${this.kpiProgress.isCurrency ? '$' : ''}${ctx.formattedValue}`;\r\n                                    return [timePeriodDisplay, `${ctx.label}: ${formattedValue}`];\r\n                                },\r\n                            },\r\n                        },\r\n                    },\r\n                },\r\n            };\r\n\r\n            if (this._chart) {\r\n                this._chart.data.datasets = data.datasets;\r\n                this._chart.update();\r\n                return;\r\n            }\r\n\r\n            this._chart = new Chart(this.chartEl, config);\r\n        } catch (err) {\r\n            console.log(err);\r\n        }\r\n    }\r\n}\r\n","// Imports\nimport ___CSS_LOADER_API_SOURCEMAP_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/sourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, \".zeus-health-kpi-container {\\n  display: flex;\\n  align-items: center;\\n}\\n.zeus-health-kpi-container > * {\\n  flex: 50%;\\n  max-width: 50%;\\n  position: relative;\\n  text-align: center;\\n}\\n\\n.zeus-health-kpi-value {\\n  display: flex;\\n  flex-direction: column;\\n}\\n\\n.zeus-health-kpi-value {\\n  font-size: 1em;\\n}\\n.zeus-health-kpi-value.zeus-health-kpi-value-size-1 {\\n  font-size: 2.5em;\\n}\\n.zeus-health-kpi-value.zeus-health-kpi-value-size-2 {\\n  font-size: 2em;\\n}\\n.zeus-health-kpi-value.zeus-health-kpi-value-size-3 {\\n  font-size: 1.75em;\\n}\\n.zeus-health-kpi-value.zeus-health-kpi-value-size-4 {\\n  font-size: 1.5em;\\n}\\n.zeus-health-kpi-value.zeus-health-kpi-value-size-5 {\\n  font-size: 1.25em;\\n}\\n.zeus-health-kpi-value.zeus-health-kpi-value-size-6 {\\n  font-size: 1em;\\n}\\n.zeus-health-kpi-value .zeus-caption {\\n  font-size: 10pt;\\n}\\n\\n.zeus-kpi-health-drawer-chart {\\n  height: 100px;\\n}\\n.zeus-kpi-health-drawer-chart chart-goal-progress {\\n  justify-content: flex-start;\\n}\\n.zeus-kpi-health-drawer-chart chart-goal-progress .zeus-chart-goal-canvas {\\n  width: 100px;\\n  height: 100px;\\n}\", \"\",{\"version\":3,\"sources\":[\"webpack://./src/resources/elements/kpis/kpi-health.scss\"],\"names\":[],\"mappings\":\"AAAA;EACI,aAAA;EACA,mBAAA;AACJ;AACI;EACI,SAAA;EACA,cAAA;EACA,kBAAA;EACA,kBAAA;AACR;;AAGA;EACI,aAAA;EACA,sBAAA;AAAJ;;AAGA;EACI,cAAA;AAAJ;AAEI;EACI,gBAAA;AAAR;AAEI;EACI,cAAA;AAAR;AAEI;EACI,iBAAA;AAAR;AAEI;EACI,gBAAA;AAAR;AAEI;EACI,iBAAA;AAAR;AAEI;EACI,cAAA;AAAR;AAGI;EACI,eAAA;AADR;;AAKA;EACI,aAAA;AAFJ;AAII;EACI,2BAAA;AAFR;AAIQ;EACI,YAAA;EACA,aAAA;AAFZ\",\"sourcesContent\":[\".zeus-health-kpi-container {\\r\\n    display: flex;\\r\\n    align-items: center;\\r\\n\\r\\n    > * {\\r\\n        flex: 50%;\\r\\n        max-width: 50%;\\r\\n        position: relative;\\r\\n        text-align: center;\\r\\n    }\\r\\n}\\r\\n\\r\\n.zeus-health-kpi-value {\\r\\n    display: flex;\\r\\n    flex-direction: column;\\r\\n}\\r\\n\\r\\n.zeus-health-kpi-value {\\r\\n    font-size: 1em;\\r\\n\\r\\n    &.zeus-health-kpi-value-size-1 {\\r\\n        font-size: 2.5em;\\r\\n    }\\r\\n    &.zeus-health-kpi-value-size-2 {\\r\\n        font-size: 2em;\\r\\n    }\\r\\n    &.zeus-health-kpi-value-size-3 {\\r\\n        font-size: 1.75em;\\r\\n    }\\r\\n    &.zeus-health-kpi-value-size-4 {\\r\\n        font-size: 1.5em;\\r\\n    }\\r\\n    &.zeus-health-kpi-value-size-5 {\\r\\n        font-size: 1.25em;\\r\\n    }\\r\\n    &.zeus-health-kpi-value-size-6 {\\r\\n        font-size: 1em;\\r\\n    }\\r\\n\\r\\n    .zeus-caption {\\r\\n        font-size: 10pt;\\r\\n    }\\r\\n}\\r\\n\\r\\n.zeus-kpi-health-drawer-chart {\\r\\n    height: 100px;\\r\\n\\r\\n    chart-goal-progress {\\r\\n        justify-content: flex-start;\\r\\n\\r\\n        .zeus-chart-goal-canvas {\\r\\n            width: 100px;\\r\\n            height: 100px;\\r\\n        }\\r\\n    }\\r\\n}\\r\\n\"],\"sourceRoot\":\"\"}]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___;\n","// Imports\nimport ___CSS_LOADER_API_SOURCEMAP_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/sourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, \"kpi-number.zeus-kpi-success .zeus-kpi-number {\\n  background-color: var(--kt-success-light);\\n}\\nkpi-number.zeus-kpi-success.zeus-active .zeus-kpi-number {\\n  background-color: var(--kt-success);\\n}\\nkpi-number.zeus-kpi-primary .zeus-kpi-number {\\n  background-color: var(--kt-primary-light);\\n}\\nkpi-number.zeus-kpi-primary.zeus-active .zeus-kpi-number {\\n  background-color: var(--kt-primary);\\n}\\nkpi-number.zeus-kpi-danger .zeus-kpi-number {\\n  background-color: var(--kt-danger-light);\\n}\\nkpi-number.zeus-kpi-danger.zeus-active .zeus-kpi-number {\\n  background-color: var(--kt-danger);\\n}\\nkpi-number.zeus-kpi-light .zeus-kpi-number {\\n  background-color: var(--kt-light-light);\\n}\\nkpi-number.zeus-kpi-light.zeus-active .zeus-kpi-number {\\n  background-color: var(--kt-light);\\n}\\nkpi-number.zeus-kpi-warning .zeus-kpi-number {\\n  background-color: var(--kt-warning-light);\\n}\\nkpi-number.zeus-kpi-warning.zeus-active .zeus-kpi-number {\\n  background-color: var(--kt-warning);\\n}\\nkpi-number.zeus-kpi-info .zeus-kpi-number {\\n  background-color: var(--kt-info-light);\\n}\\nkpi-number.zeus-kpi-info.zeus-active .zeus-kpi-number {\\n  background-color: var(--kt-info);\\n}\\n\\n.zeus-kpi-number {\\n  border-radius: var(--zeus-space);\\n  padding: var(--zeus-space);\\n  max-width: 250px;\\n  min-width: 250px;\\n  margin-bottom: var(--zeus-space);\\n}\\n.zeus-kpi-number .zeus-kpi-number-title {\\n  font-weight: bold;\\n  font-size: 1em;\\n}\\n.zeus-kpi-number .zeus-kpi-number-value {\\n  font-size: 3em;\\n  font-weight: bold;\\n}\\n.zeus-kpi-number .zeus-kpi-number-progress {\\n  font-size: 1em;\\n}\\n.zeus-kpi-number.md {\\n  max-width: 200px;\\n  min-width: 200px;\\n}\\n.zeus-kpi-number.md .zeus-kpi-number-title {\\n  font-weight: bold;\\n  font-size: 0.9em;\\n}\\n.zeus-kpi-number.md .zeus-kpi-number-value {\\n  font-size: 2em;\\n  font-weight: bold;\\n}\\n.zeus-kpi-number.md .zeus-kpi-number-progress {\\n  font-size: 0.9em;\\n}\", \"\",{\"version\":3,\"sources\":[\"webpack://./src/resources/elements/kpis/kpi-number.scss\"],\"names\":[],\"mappings\":\"AAEQ;EACI,yCAAA;AADZ;AAIY;EACI,mCAAA;AAFhB;AAQQ;EACI,yCAAA;AANZ;AASY;EACI,mCAAA;AAPhB;AAaQ;EACI,wCAAA;AAXZ;AAcY;EACI,kCAAA;AAZhB;AAkBQ;EACI,uCAAA;AAhBZ;AAmBY;EACI,iCAAA;AAjBhB;AAuBQ;EACI,yCAAA;AArBZ;AAwBY;EACI,mCAAA;AAtBhB;AA4BQ;EACI,sCAAA;AA1BZ;AA6BY;EACI,gCAAA;AA3BhB;;AAiCA;EACI,gCAAA;EACA,0BAAA;EACA,gBAAA;EACA,gBAAA;EACA,gCAAA;AA9BJ;AAgCI;EACI,iBAAA;EACA,cAAA;AA9BR;AAiCI;EACI,cAAA;EACA,iBAAA;AA/BR;AAkCI;EACI,cAAA;AAhCR;AAmCI;EACI,gBAAA;EACA,gBAAA;AAjCR;AAmCQ;EACI,iBAAA;EACA,gBAAA;AAjCZ;AAoCQ;EACI,cAAA;EACA,iBAAA;AAlCZ;AAqCQ;EACI,gBAAA;AAnCZ\",\"sourcesContent\":[\"kpi-number {\\r\\n    &.zeus-kpi-success {\\r\\n        .zeus-kpi-number {\\r\\n            background-color: var(--kt-success-light);\\r\\n        }\\r\\n        &.zeus-active {\\r\\n            .zeus-kpi-number {\\r\\n                background-color: var(--kt-success);\\r\\n            }\\r\\n        }\\r\\n    }\\r\\n\\r\\n    &.zeus-kpi-primary {\\r\\n        .zeus-kpi-number {\\r\\n            background-color: var(--kt-primary-light);\\r\\n        }\\r\\n        &.zeus-active {\\r\\n            .zeus-kpi-number {\\r\\n                background-color: var(--kt-primary);\\r\\n            }\\r\\n        }\\r\\n    }\\r\\n\\r\\n    &.zeus-kpi-danger {\\r\\n        .zeus-kpi-number {\\r\\n            background-color: var(--kt-danger-light);\\r\\n        }\\r\\n        &.zeus-active {\\r\\n            .zeus-kpi-number {\\r\\n                background-color: var(--kt-danger);\\r\\n            }\\r\\n        }\\r\\n    }\\r\\n\\r\\n    &.zeus-kpi-light {\\r\\n        .zeus-kpi-number {\\r\\n            background-color: var(--kt-light-light);\\r\\n        }\\r\\n        &.zeus-active {\\r\\n            .zeus-kpi-number {\\r\\n                background-color: var(--kt-light);\\r\\n            }\\r\\n        }\\r\\n    }\\r\\n\\r\\n    &.zeus-kpi-warning {\\r\\n        .zeus-kpi-number {\\r\\n            background-color: var(--kt-warning-light);\\r\\n        }\\r\\n        &.zeus-active {\\r\\n            .zeus-kpi-number {\\r\\n                background-color: var(--kt-warning);\\r\\n            }\\r\\n        }\\r\\n    }\\r\\n\\r\\n    &.zeus-kpi-info {\\r\\n        .zeus-kpi-number {\\r\\n            background-color: var(--kt-info-light);\\r\\n        }\\r\\n        &.zeus-active {\\r\\n            .zeus-kpi-number {\\r\\n                background-color: var(--kt-info);\\r\\n            }\\r\\n        }\\r\\n    }\\r\\n}\\r\\n\\r\\n.zeus-kpi-number {\\r\\n    border-radius: var(--zeus-space);\\r\\n    padding: var(--zeus-space);\\r\\n    max-width: 250px;\\r\\n    min-width: 250px;\\r\\n    margin-bottom: var(--zeus-space);\\r\\n\\r\\n    .zeus-kpi-number-title {\\r\\n        font-weight: bold;\\r\\n        font-size: 1em;\\r\\n    }\\r\\n\\r\\n    .zeus-kpi-number-value {\\r\\n        font-size: 3em;\\r\\n        font-weight: bold;\\r\\n    }\\r\\n\\r\\n    .zeus-kpi-number-progress {\\r\\n        font-size: 1em;\\r\\n    }\\r\\n\\r\\n    &.md {\\r\\n        max-width: 200px;\\r\\n        min-width: 200px;\\r\\n\\r\\n        .zeus-kpi-number-title {\\r\\n            font-weight: bold;\\r\\n            font-size: 0.9em;\\r\\n        }\\r\\n    \\r\\n        .zeus-kpi-number-value {\\r\\n            font-size: 2em;\\r\\n            font-weight: bold;\\r\\n        }\\r\\n    \\r\\n        .zeus-kpi-number-progress {\\r\\n            font-size: 0.9em;\\r\\n        }\\r\\n    }\\r\\n}\\r\\n\"],\"sourceRoot\":\"\"}]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___;\n","// Imports\nimport ___CSS_LOADER_API_SOURCEMAP_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/sourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, \"kpi-simple {\\n  display: flex;\\n  position: relative;\\n  width: 100%;\\n  height: 100%;\\n}\\nkpi-simple .zeus-kpi-container {\\n  display: flex;\\n  flex-direction: column;\\n  width: 95%;\\n  height: 95%;\\n  position: relative;\\n}\\nkpi-simple .zeus-kpi-container .zeus-kpi-canvas {\\n  position: relative;\\n  display: flex;\\n  flex: 2;\\n  height: 100%;\\n}\\nkpi-simple .zeus-kpi-container .zeus-kpi-canvas > canvas {\\n  max-height: 100%;\\n}\", \"\",{\"version\":3,\"sources\":[\"webpack://./src/resources/elements/kpis/kpi-simple.scss\"],\"names\":[],\"mappings\":\"AAEA;EACI,aAAA;EACA,kBAAA;EACA,WAAA;EACA,YAAA;AADJ;AAGI;EACI,aAAA;EACA,sBAAA;EACA,UAAA;EACA,WAAA;EACA,kBAAA;AADR;AAGQ;EACI,kBAAA;EACA,aAAA;EACA,OAAA;EACA,YAAA;AADZ;AAGY;EACI,gBAAA;AADhB\",\"sourcesContent\":[\"@import \\\"./../../../styles/responsive.scss\\\";\\r\\n\\r\\nkpi-simple {\\r\\n    display: flex;\\r\\n    position: relative;\\r\\n    width: 100%;\\r\\n    height: 100%;\\r\\n\\r\\n    .zeus-kpi-container {\\r\\n        display: flex;\\r\\n        flex-direction: column;\\r\\n        width: 95%;\\r\\n        height: 95%;\\r\\n        position: relative;\\r\\n\\r\\n        .zeus-kpi-canvas {\\r\\n            position: relative;\\r\\n            display: flex;\\r\\n            flex: 2;\\r\\n            height: 100%;\\r\\n\\r\\n            > canvas {\\r\\n                max-height: 100%;\\r\\n            }\\r\\n        }\\r\\n    }\\r\\n}\\r\\n\"],\"sourceRoot\":\"\"}]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___;\n","// Imports\nimport ___CSS_LOADER_API_SOURCEMAP_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/sourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../../../node_modules/css-loader/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, \"kpi {\\n  display: flex;\\n  position: relative;\\n  width: 100%;\\n  height: 100%;\\n}\\nkpi .zeus-kpi-container {\\n  display: flex;\\n  flex-direction: column;\\n  width: 95%;\\n  height: 95%;\\n  position: relative;\\n}\\nkpi .zeus-kpi-container .zeus-kpi-canvas {\\n  position: relative;\\n  display: flex;\\n  flex: 2;\\n  height: 100%;\\n}\\nkpi .zeus-kpi-container .zeus-kpi-canvas > canvas {\\n  max-height: 100%;\\n}\\nkpi .zeus-kpi-container .zeus-kpi-canvas.zeus-kpi-canvas-small > canvas {\\n  max-width: 85%;\\n  max-height: 85%;\\n  margin: auto;\\n}\", \"\",{\"version\":3,\"sources\":[\"webpack://./src/resources/elements/kpis/kpi.scss\"],\"names\":[],\"mappings\":\"AAEA;EACI,aAAA;EACA,kBAAA;EACA,WAAA;EACA,YAAA;AADJ;AAGI;EACI,aAAA;EACA,sBAAA;EACA,UAAA;EACA,WAAA;EACA,kBAAA;AADR;AAGQ;EACI,kBAAA;EACA,aAAA;EACA,OAAA;EACA,YAAA;AADZ;AAGY;EACI,gBAAA;AADhB;AAKgB;EACI,cAAA;EACA,eAAA;EACA,YAAA;AAHpB\",\"sourcesContent\":[\"@import \\\"./../../../styles/responsive.scss\\\";\\r\\n\\r\\nkpi {\\r\\n    display: flex;\\r\\n    position: relative;\\r\\n    width: 100%;\\r\\n    height: 100%;\\r\\n\\r\\n    .zeus-kpi-container {\\r\\n        display: flex;\\r\\n        flex-direction: column;\\r\\n        width: 95%;\\r\\n        height: 95%;\\r\\n        position: relative;\\r\\n\\r\\n        .zeus-kpi-canvas {\\r\\n            position: relative;\\r\\n            display: flex;\\r\\n            flex: 2;\\r\\n            height: 100%;\\r\\n\\r\\n            > canvas {\\r\\n                max-height: 100%;\\r\\n            }\\r\\n\\r\\n            &.zeus-kpi-canvas-small {\\r\\n                > canvas {\\r\\n                    max-width: 85%;\\r\\n                    max-height: 85%;\\r\\n                    margin: auto;\\r\\n                }\\r\\n            }\\r\\n        }\\r\\n    }\\r\\n}\\r\\n\"],\"sourceRoot\":\"\"}]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___;\n","// Module\nvar code = \"<template>\\r\\n    <require from=\\\"./kpi-health.scss\\\"></require>\\r\\n    <container-and-drawer position=\\\"bottom\\\" toggle-trigger.bind=\\\"showDrawer\\\" drawerclosed.delegate=\\\"drawerClosed()\\\">\\r\\n\\r\\n        <div class=\\\"card mb-5 mb-xxl-8\\\">\\r\\n            <div class=\\\"card-header align-items-center zeus-heading zeus-heading-thirds zeus-no-break\\\">\\r\\n                <div class=\\\"card-title\\\">\\r\\n                    <h3 if.bind=\\\"health.teamType\\\" class=\\\"card-title fw-bold text-dark\\\">${`kpi-${health.teamType}-health-title`&t}</h3>\\r\\n                </div>\\r\\n                <div>\\r\\n                    <member-autocomplete result.bind=\\\"downlineMember\\\" size=\\\"form-control-sm\\\"></member-autocomplete>\\r\\n                </div>\\r\\n                <div>\\r\\n                    <ul class=\\\"nav zeus-inline-flex\\\" role=\\\"tablist\\\">\\r\\n                        <li class=\\\"nav-item\\\" role=\\\"presentation\\\">\\r\\n                            <a class=\\\"nav-link btn btn-sm btn-color-muted btn-active btn-active-light fw-bold px-4 me-1\\\" class.bind=\\\"productionType === 'submitted' ? 'active' : ''\\\" href=\\\"#\\\" click.delegate=\\\"selectProductionType('submitted')\\\" aria-selected.bind=\\\"productionType === 'submitted' ? 'true' : 'false'\\\" role=\\\"tab\\\">${'submitted'&t}</a>\\r\\n                        </li>\\r\\n                        <li class=\\\"nav-item\\\" role=\\\"presentation\\\">\\r\\n                            <a class=\\\"nav-link btn btn-sm btn-color-muted btn-active btn-active-light fw-bold px-4 me-1\\\" class.bind=\\\"productionType === 'paid' ? 'active' : ''\\\" href=\\\"#\\\" click.delegate=\\\"selectProductionType('paid')\\\" aria-selected.bind=\\\"productionType === 'paid' ? 'true' : 'false'\\\" role=\\\"tab\\\">${'paid'&t}</a>\\r\\n                        </li>\\r\\n                    </ul>\\r\\n                    <a href=\\\"#\\\" class=\\\"btn btn-icon\\\" click.delegate=\\\"refreshData()\\\"><refresh-icon refreshing.bind=\\\"refreshing\\\"></refresh-icon></a>\\r\\n                </div>\\r\\n            </div>\\r\\n            <div class=\\\"card-body\\\">\\r\\n                <div class=\\\"zeus-date-nav\\\">\\r\\n                    <button class=\\\"zeus-btn-icon\\\" disabled.bind=\\\"!canGoPrevious\\\" click.delegate=\\\"previous()\\\"><i class=\\\"fas fa-chevron-left\\\"></i></button>\\r\\n                    <div>\\r\\n                        <a href=\\\"#\\\" click.delegate=\\\"current()\\\" title.bind=\\\"'kpi-to-current'&t\\\">${health.weekPeriod.start|formatDate:'l'} - ${health.weekPeriod.end|formatDate:'l'}</a>\\r\\n                        <date-picker value.bind=\\\"kpiAsOfDate\\\" icon-only.bind=\\\"true\\\"></date-picker>\\r\\n                    </div>\\r\\n                    <button class=\\\"zeus-btn-icon\\\" disabled.bind=\\\"!canGoNext\\\" click.delegate=\\\"next()\\\"><i class=\\\"fas fa-chevron-right\\\"></i></button>\\r\\n                </div>\\r\\n\\r\\n                <div class=\\\"separator separator-dashed my-4\\\"></div>\\r\\n\\r\\n                <loader if.bind=\\\"loading\\\" size=\\\"xl\\\" cover.bind=\\\"true\\\" message.bind=\\\"'loading-health-data'&t\\\"></loader>\\r\\n                <div class=\\\"row\\\">\\r\\n                    <template repeat.for=\\\"kpi of health.kpis\\\" containerless>\\r\\n                        <section click.delegate=\\\"displayKpi(kpi)\\\" class=\\\"zeus-clickable col-md-4 col-sm-6\\\">\\r\\n                            <h4 class=\\\"zeus-center\\\">${kpi.kpiType&t}</h4>\\r\\n                            <div class=\\\"zeus-health-kpi-container\\\">\\r\\n                                <div class=\\\"zeus-caption\\\">${health.weekPeriod.start|formatDate:'M/D'} - ${health.weekPeriod.end|formatDate:'M/D'}</div>\\r\\n                                <div class=\\\"zeus-caption\\\">${health.monthPeriod.end|formatDate:'MMM YYYY'}</div>\\r\\n                            </div>\\r\\n                            <div class=\\\"zeus-health-kpi-container\\\">\\r\\n                                <div class=\\\"zeus-health-kpi-value zeus-health-kpi-value-size-${calculateValueSize(kpi.week.kpiValue)} zeus-colorized-color zeus-ryg-${kpi.week.rollingAverageRYG}\\\">\\r\\n                                    <chart-goal-progress key.bind=\\\"kpi.kpiType\\\" goal.bind=\\\"kpi.week.rollingAverageValue\\\" progress.bind=\\\"kpi.week.kpiValue\\\" ryg.bind=\\\"kpi.week.rollingAverageRYG\\\" format-money.bind=\\\"kpi.isMoney\\\"></chart-goal-progress>\\r\\n                                    <div class=\\\"zeus-caption\\\"><span class=\\\"zeus-success\\\" title.bind=\\\"'rolling-average'&t\\\"><i class=\\\"fas fa-circle-notch\\\"></i></span> ${kpi.week.rollingAverageValue|formatNumber:0:kpi.isMoney}</div>\\r\\n        \\r\\n                                    <div class=\\\"zeus-health-kpi-sparkline\\\">\\r\\n                                        <sparkline data.bind=\\\"kpi.week.sparkline\\\"></sparkline>\\r\\n                                    </div>\\r\\n        \\r\\n                                    <chart-goal-progress key.bind=\\\"kpi.kpiType\\\" goal.bind=\\\"kpi.week.previousPeriodKpiValue\\\" progress.bind=\\\"kpi.week.kpiValue\\\" ryg.bind=\\\"kpi.week.previousPeriodRYG\\\" format-money.bind=\\\"kpi.isMoney\\\"></chart-goal-progress>\\r\\n                                    <div class=\\\"zeus-caption\\\"><span class=\\\"zeus-success\\\">${kpi.week.previousPeriod.start|formatDate:'M/D'} - ${kpi.week.previousPeriod.end|formatDate:'M/D'}:</span> ${kpi.week.previousPeriodKpiValue|formatNumber:0:kpi.isMoney}</div>\\r\\n                                    <div if.bind=\\\"kpi.corroboratingIcon\\\" class=\\\"zeus-caption zeus-colorized-color zeus-ryg-${kpi.week.corroboratingRYG}\\\"><i class.bind=\\\"kpi.corroboratingIcon\\\"></i> ${kpi.week.corroboratingValue|formatNumber:0:kpi.isMoney}</div>\\r\\n                                </div>\\r\\n                                <div class=\\\"zeus-health-kpi-value zeus-health-kpi-value-size-${calculateValueSize(kpi.month.kpiValue)} zeus-colorized-color zeus-ryg-${kpi.month.rollingAverageRYG}\\\">\\r\\n                                    <chart-goal-progress key.bind=\\\"kpi.kpiType\\\" goal.bind=\\\"kpi.month.rollingAverageValue\\\" progress.bind=\\\"kpi.month.kpiValue\\\" ryg.bind=\\\"kpi.month.rollingAverageRYG\\\" format-money.bind=\\\"kpi.isMoney\\\"></chart-goal-progress>\\r\\n                                    <div class=\\\"zeus-caption\\\"><span class=\\\"zeus-success\\\" title.bind=\\\"'rolling-average'&t\\\"><i class=\\\"fas fa-circle-notch\\\"></i></span> ${kpi.month.rollingAverageValue|formatNumber:0:kpi.isMoney}</div>\\r\\n        \\r\\n                                    <div class=\\\"zeus-health-kpi-sparkline\\\">\\r\\n                                        <sparkline data.bind=\\\"kpi.month.sparkline\\\"></sparkline>\\r\\n                                    </div>\\r\\n        \\r\\n                                    <chart-goal-progress key.bind=\\\"kpi.kpiType\\\" goal.bind=\\\"kpi.month.previousPeriodKpiValue\\\" progress.bind=\\\"kpi.month.kpiValue\\\" ryg.bind=\\\"kpi.month.previousPeriodRYG\\\" format-money.bind=\\\"kpi.isMoney\\\"></chart-goal-progress>\\r\\n                                    <div class=\\\"zeus-caption\\\"><span class=\\\"zeus-success\\\">${kpi.month.previousPeriod.end|formatDate:'MMM'}:</span> ${kpi.month.previousPeriodKpiValue|formatNumber:0:kpi.isMoney}</div>\\r\\n                                    <div if.bind=\\\"kpi.corroboratingIcon\\\" class=\\\"zeus-caption zeus-colorized-color zeus-ryg-${kpi.month.corroboratingRYG}\\\"><i class.bind=\\\"kpi.corroboratingIcon\\\"></i> ${kpi.month.corroboratingValue|formatNumber:0:kpi.isMoney}</div>\\r\\n                                </div>\\r\\n                            </div>\\r\\n                        </section>\\r\\n                    </template>\\r\\n                </div>\\r\\n            </div>\\r\\n        </div>\\r\\n\\r\\n        <div slot=\\\"drawer\\\">\\r\\n            <h3>${viewKpi.kpiType&t}</h3>\\r\\n            <div class=\\\"zeus-data-view\\\">\\r\\n                <div class=\\\"row\\\">\\r\\n                    <section class=\\\"col-sm-6\\\">\\r\\n                        <h4>${viewKpi.week.period.start|formatDate:'M/D'} - ${viewKpi.week.period.end|formatDate:'M/D'}</h4>\\r\\n                        <div><label>${viewKpi.kpiType&t}:</label>${viewKpi.week.kpiValue|formatNumber:2:viewKpi.isMoney}</div>\\r\\n                        <div if.bind=\\\"viewKpi.corroboratingIcon\\\"><label>${'kpi-corroborating-data'&t} <i class.bind=\\\"viewKpi.corroboratingIcon\\\"></i>:</label>${viewKpi.week.corroboratingValue|formatNumber:2:viewKpi.isMoney} \\r\\n                            (<span class=\\\"zeus-colorized-color zeus-ryg-${viewKpi.week.corroboratingRYG}\\\">${viewKpi.week.corroboratingPlusMinus|formatNumber:2:viewKpi.isMoney:true}</span>)</div>\\r\\n                        <div><label>${'kpi-13-week-rolling-average'&t}:</label>${viewKpi.week.rollingAverageValue|formatNumber:2:viewKpi.isMoney} \\r\\n                            (<span class=\\\"zeus-colorized-color zeus-ryg-${viewKpi.week.rollingAverageRYG}\\\">${viewKpi.week.rollingAveragePlusMinus|formatNumber:2:viewKpi.isMoney:true}</span>)</div>\\r\\n                        <div class=\\\"zeus-kpi-health-drawer-chart\\\">\\r\\n                            <chart-goal-progress if.bind=\\\"viewKpi\\\" key.bind=\\\"viewKpi.kpiType\\\" goal.bind=\\\"viewKpi.week.rollingAverageValue\\\" progress.bind=\\\"viewKpi.week.kpiValue\\\" ryg.bind=\\\"viewKpi.week.rollingAverageRYG\\\" format-money.bind=\\\"viewKpi.isMoney\\\"></chart-goal-progress>\\r\\n                        </div>\\r\\n                        <div><label>${viewKpi.week.previousPeriod.start|formatDate:'M/D'} - ${viewKpi.week.previousPeriod.end|formatDate:'M/D'}:</label>${viewKpi.week.previousPeriodKpiValue|formatNumber:2:viewKpi.isMoney} \\r\\n                            (<span class=\\\"zeus-colorized-color zeus-ryg-${viewKpi.week.previousPeriodRYG}\\\">${viewKpi.week.previousPeriodPlusMinus|formatNumber:2:viewKpi.isMoney:true}</span>)</div>\\r\\n                        <div class=\\\"zeus-kpi-health-drawer-chart\\\">\\r\\n                            <chart-goal-progress key.bind=\\\"viewKpi.kpiType\\\" goal.bind=\\\"viewKpi.week.previousPeriodKpiValue\\\" progress.bind=\\\"viewKpi.week.kpiValue\\\" ryg.bind=\\\"viewKpi.week.previousPeriodRYG\\\" format-money.bind=\\\"viewKpi.isMoney\\\"></chart-goal-progress>\\r\\n                        </div>\\r\\n                        <div><label>${'rolling-average'&t}</label></div>\\r\\n                        <div class=\\\"zeus-kpi-health-drawer-chart\\\">\\r\\n                            <chart-line decimals.bind=\\\"1\\\" date-format=\\\"l\\\" datasets.bind=\\\"weekLineDatasets\\\"></chart-goal-progress>\\r\\n                        </div>\\r\\n                    </section>\\r\\n                    <section class=\\\"col-sm-6\\\">\\r\\n                        <h4>${viewKpi.month.period.end|formatDate:'MMM YYYY'}</h4>\\r\\n                        <div><label>${viewKpi.kpiType&t}:</label>${viewKpi.month.kpiValue|formatNumber:2:viewKpi.isMoney}</div>\\r\\n                        <div if.bind=\\\"viewKpi.corroboratingIcon\\\"><label>${'kpi-corroborating-data'&t} <i class.bind=\\\"viewKpi.corroboratingIcon\\\"></i>:</label>${viewKpi.month.corroboratingValue|formatNumber:2:viewKpi.isMoney} \\r\\n                            (<span class=\\\"zeus-colorized-color zeus-ryg-${viewKpi.month.corroboratingRYG}\\\">${viewKpi.month.corroboratingPlusMinus|formatNumber:2:viewKpi.isMoney:true}</span>)</div>\\r\\n                        <div><label>${'kpi-5-month-rolling-average'&t}:</label>${viewKpi.month.rollingAverageValue|formatNumber:2:viewKpi.isMoney} \\r\\n                            (<span class=\\\"zeus-colorized-color zeus-ryg-${viewKpi.month.rollingAverageRYG}\\\">${viewKpi.month.rollingAveragePlusMinus|formatNumber:2:viewKpi.isMoney:true}</span>)</div>\\r\\n                        <div class=\\\"zeus-kpi-health-drawer-chart\\\">\\r\\n                            <chart-goal-progress key.bind=\\\"viewKpi.kpiType\\\" goal.bind=\\\"viewKpi.month.rollingAverageValue\\\" progress.bind=\\\"viewKpi.month.kpiValue\\\" ryg.bind=\\\"viewKpi.month.rollingAverageRYG\\\" format-money.bind=\\\"viewKpi.isMoney\\\"></chart-goal-progress>\\r\\n                        </div>\\r\\n                        <div><label>${viewKpi.month.previousPeriod.end|formatDate:'MMM YYYY'}:</label>${viewKpi.month.previousPeriodKpiValue|formatNumber:2:viewKpi.isMoney} \\r\\n                            (<span class=\\\"zeus-colorized-color zeus-ryg-${viewKpi.month.previousPeriodRYG}\\\">${viewKpi.month.previousPeriodPlusMinus|formatNumber:2:viewKpi.isMoney:true}</span>)</div>\\r\\n                        <div class=\\\"zeus-kpi-health-drawer-chart\\\">\\r\\n                            <chart-goal-progress key.bind=\\\"viewKpi.kpiType\\\" goal.bind=\\\"viewKpi.month.previousPeriodKpiValue\\\" progress.bind=\\\"viewKpi.month.kpiValue\\\" ryg.bind=\\\"viewKpi.month.previousPeriodRYG\\\" format-money.bind=\\\"viewKpi.isMoney\\\"></chart-goal-progress>\\r\\n                        </div>\\r\\n                        <div><label>${'rolling-average'&t}</label></div>\\r\\n                        <div class=\\\"zeus-kpi-health-drawer-chart\\\">\\r\\n                            <chart-line decimals.bind=\\\"1\\\" date-format=\\\"MMM YY\\\" datasets.bind=\\\"monthLineDatasets\\\"></chart-goal-progress>\\r\\n                        </div>\\r\\n                    </section>\\r\\n                </div>\\r\\n            </div>\\r\\n        </div>\\r\\n    </container-and-drawer>\\r\\n</template>\\r\\n\";\n// Exports\nexport default code;","// Module\nvar code = \"<template>\\r\\n    <require from=\\\"./kpi-number.scss\\\"></require>\\r\\n    <loader if.bind=\\\"loading\\\" cover.bind=\\\"true\\\"></loader>\\r\\n    <div class=\\\"zeus-kpi-number\\\" class.bind=\\\"size\\\">\\r\\n        <div class=\\\"zeus-kpi-number-title\\\">${title&t}</div>\\r\\n        <div class=\\\"zeus-kpi-number-value\\\">${value|formatNumber2:decimals:isMoney:isPercent}</div>\\r\\n        <div class=\\\"zeus-kpi-number-progress\\\"><span class=\\\"me-3\\\" class.bind=\\\"increasePercentCss\\\">${increasePercent|formatNumber2:1:false:true:true:true}</span><span>${increaseCount|formatNumber2:1:false:isPercent:true:true:'+'} ${progressPeriod&t}</span></div>\\r\\n    </div>\\r\\n</template>\";\n// Exports\nexport default code;","// Module\nvar code = \"<template>\\r\\n    <require from=\\\"./kpi-simple.scss\\\"></require>\\r\\n    <div class=\\\"zeus-kpi-container\\\">\\r\\n        <h3 class=\\\"zeus-heading\\\">\\r\\n            <span if.bind=\\\"kpi.kpiType\\\">${`kpi-type-${kpi.kpiType}`&t}<span if.bind=\\\"kpi.kpiFor\\\" class=\\\"zeus-caption zeus-margin-left\\\">${`kpi-for-${kpi.kpiFor}`&t}</span></span>\\r\\n            <div>\\r\\n                <a href=\\\"#\\\" click.delegate=\\\"current()\\\" class=\\\"zeus-margin-right-sm\\\" title.bind=\\\"'current-period'&t\\\"><i class=\\\"fas fa-calendar-day\\\"></i></a>\\r\\n                <a href=\\\"#\\\" class=\\\"zeus-icon-link\\\" click.delegate=\\\"refreshData()\\\"><spinner spinning.bind=\\\"loading\\\"></spinner></a>\\r\\n            </div>\\r\\n        </h3>\\r\\n        <div class=\\\"zeus-date-nav\\\">\\r\\n            <button class=\\\"zeus-btn-icon\\\" disabled.bind=\\\"!canGoPrevious\\\" click.delegate=\\\"previous()\\\"><i class=\\\"fas fa-chevron-left\\\"></i></button>\\r\\n            <div class=\\\"zeus-data-view\\\">\\r\\n                <label class=\\\"zeus-margin-right\\\">${timePeriodDisplay}:</label><span class=\\\"zeus-bold\\\"><span if.bind=\\\"kpiProgress.isCurrency\\\">$</span>${kpiProgress.progress|formatNumber2:kpi.isCurrency ? 2 : 0}</span>\\r\\n            </div>\\r\\n            <button class=\\\"zeus-btn-icon\\\" disabled.bind=\\\"!canGoNext\\\" click.delegate=\\\"next()\\\"><i class=\\\"fas fa-chevron-right\\\"></i></button>\\r\\n        </div>\\r\\n        <div class=\\\"zeus-kpi-canvas\\\">\\r\\n            <canvas ref=\\\"chartEl\\\"></canvas>\\r\\n        </div>\\r\\n    </div>\\r\\n</template>\\r\\n\";\n// Exports\nexport default code;","// Module\nvar code = \"<template>\\r\\n    <require from=\\\"./kpi.scss\\\"></require>\\r\\n    <div class=\\\"zeus-kpi-container\\\">\\r\\n        <loader if.bind=\\\"loading\\\" size=\\\"xl\\\" cover.bind=\\\"true\\\"></loader>\\r\\n        <div class=\\\"zeus-widget-heading\\\">\\r\\n            <h3 if.bind=\\\"!kpi.friendlyName\\\"><span show.bind=\\\"kpi.view\\\">${`widget-view-${kpi.view}`&t}<br></span>\\r\\n                <span if.bind=\\\"kpi.policyStatus\\\" class=\\\"zeus-margin-right-xs\\\">${`widget-policy-status-group-${kpi.policyStatus}`&t}:</span>\\r\\n                <span if.bind=\\\"kpi.metric\\\"><span if.bind=\\\"!kpi.premiumType\\\">${`kpi-metric-${kpi.metric}`&t}</span><span if.bind=\\\"kpi.premiumType\\\">${kpi.premiumType&t}</span></span></h3>\\r\\n            <h3 if.bind=\\\"kpi.friendlyName\\\">${kpi.friendlyName|decodeJsProperty}</h3>\\r\\n        </div>\\r\\n        <div class=\\\"zeus-date-nav\\\">\\r\\n            <button class=\\\"zeus-btn-icon\\\" disabled.bind=\\\"!canGoPrevious\\\" click.delegate=\\\"previous()\\\"><i class=\\\"fas fa-chevron-left\\\"></i></button>\\r\\n            <div class=\\\"zeus-data-view\\\">\\r\\n                <label class=\\\"zeus-margin-right\\\">${timePeriodDisplay}</label>\\r\\n            </div>\\r\\n            <button class=\\\"zeus-btn-icon\\\" disabled.bind=\\\"!canGoNext\\\" click.delegate=\\\"next()\\\"><i class=\\\"fas fa-chevron-right\\\"></i></button>\\r\\n        </div>\\r\\n        <div class=\\\"zeus-kpi-canvas\\\" class.bind=\\\"kpi.linesOfBusiness.length || kpi.policyStatus ? 'zeus-kpi-canvas-small' : ''\\\">\\r\\n            <canvas ref=\\\"chartEl\\\"></canvas>\\r\\n        </div>\\r\\n        <div if.bind=\\\"kpi.linesOfBusiness.length\\\" class=\\\"zeus-widget-footer\\\">\\r\\n            <span class=\\\"zeus-comma-delimited\\\">\\r\\n                <span repeat.for=\\\"lob of kpi.linesOfBusiness\\\">${lob|lineOfBusiness}<span if.bind=\\\"lob === 'life' && $parent.kpi.lifeProductTypes.length && $parent.kpi.lifeProductTypes.length < totalLifeProductTypes\\\" class=\\\"zeus-caption ms-2\\\">(<span class=\\\"zeus-comma-delimited\\\"><span repeat.for=\\\"lpt of $parent.kpi.lifeProductTypes\\\">${lpt&t}</span></span>)</span></span>\\r\\n            </span>\\r\\n        </div>\\r\\n    </div>\\r\\n</template>\\r\\n\";\n// Exports\nexport default code;"],"names":[],"sourceRoot":""}