salix/modules/worker/front/time-control/index.js

import ngModule from '../module';
import './style.scss';

class Controller {
    constructor($scope, $http, $stateParams, $element) {
        this.$stateParams = $stateParams;
        this.$ = $scope;
        this.$http = $http;
        this.$element = $element;
        this.defaultDate = new Date();
        this.currentWeek = [];
        this.weekDays = [];
        this.weekdayNames = [
            {name: 'Monday'},
            {name: 'Tuesday'},
            {name: 'Wednesday'},
            {name: 'Thursday'},
            {name: 'Friday'},
            {name: 'Saturday'},
            {name: 'Sunday'}
        ];
    }


    /**
     * Gets worker data
     */
    get worker() {
        return this._worker;
    }

    /**
     * Sets worker data and retrieves
     * worker hours
     *
     * @param {Object} value - Worker data
     */
    set worker(value) {
        this._worker = value;

        if (value) {
            this.$.$applyAsync(() => {
                this.getHours();
            });
        }
    }

    /**
     * Gets worker hours data
     *
     */
    get hours() {
        return this._hours;
    }

    /**
     * Gets worker hours data
     *
     * @param {Object} value - Hours data
     */
    set hours(value) {
        this._hours = value;
        if (value) this.build();
    }

    getHours() {
        const params = {workerFk: this.worker.id};
        const filter = {
            where: {
                timed: {between: [this.started, this.ended]}
            }
        };

        return this.$.model.applyFilter(filter, params);
    }

    refresh() {
        this.getHours().then(() => this.build());
    }

    build() {
        let weekdays = new Array(7);
        const currentWeek = [];

        for (let i = 0; i < weekdays.length; i++) {
            const dated = new Date();
            dated.setHours(23, 59, 0, 0);
            dated.setMonth(this.started.getMonth());
            dated.setDate(this.started.getDate() + i);

            const hours = this.hours.filter(hour => {
                const timed = new Date(hour.timed);
                const weekDay = timed.getDay() == 0 ? 7 : timed.getDay();
                return weekDay == (i + 1);
            });

            const sortedHours = hours.sort((a, b) => {
                return new Date(a.timed) - new Date(b.timed);
            });

            weekdays[i] = {dated, hours: sortedHours};

            currentWeek.push({
                dated: dated,
                className: 'orange-circle',
                title: 'Current week',
                isRemovable: false
            });
        }

        this.currentWeek = currentWeek;
        this.weekDays = weekdays;
    }

    hourColor(weekDay) {
        if (weekDay.manual)
            return 'alert';

        return 'warning';
    }
    get weekOffset() {
        const timed = this.defaultDate;
        const weekDay = timed.getDay() == 0 ? 7 : timed.getDay();

        return weekDay - 1;
    }

    /**
     * Returns week start date
     * from current selected week
     */
    get started() {
        const started = new Date();
        const offset = this.weekOffset;

        started.setMonth(this.defaultDate.getMonth());
        started.setDate(this.defaultDate.getDate() - offset);
        started.setHours(0, 0, 0, 0);

        return started;
    }

    /**
     * Returns week end date
     * from current selected week
     */
    get ended() {
        const ended = new Date();
        ended.setHours(0, 0, 0, 0);
        ended.setMonth(this.started.getMonth());
        ended.setDate(this.started.getDate() + 7);

        return ended;
    }

    getWeekdayTotalHours(weekday) {
        if (weekday.hours.length == 0) return 0;

        const hours = weekday.hours;

        let totalStamp = 0;

        hours.forEach((hour, index) => {
            let currentHour = new Date(hour.timed);
            let previousHour = new Date(hour.timed);

            if (index > 0 && (index % 2 == 1))
                previousHour = new Date(hours[index - 1].timed);

            const dif = Math.abs(previousHour - currentHour);

            totalStamp += dif;
        });

        if (totalStamp / 3600 / 1000 > 5)
            totalStamp += (20 * 60 * 1000);

        weekday.total = totalStamp;

        return this.formatHours(totalStamp);
    }

    get weekTotalHours() {
        let total = 0;

        this.weekDays.forEach(weekday => {
            if (weekday.total)
                total += weekday.total;
        });
        return this.formatHours(total);
    }

    formatHours(timestamp) {
        let hour = Math.floor(timestamp / 3600 / 1000);
        let min = Math.floor(timestamp / 60 / 1000 - 60 * hour);

        if (hour < 10) hour = `0${hour}`;
        if (min < 10) min = `0${min}`;

        return `${hour}:${min}`;
    }

    onMoveNext() {
        this.refresh();
    }

    onMovePrevious() {
        this.refresh();
    }

    onSelection($days) {
        this.defaultDate.setMonth($days[0].getMonth());
        this.defaultDate.setDate($days[0].getDate());
        this.refresh();
    }

    showAddTimeDialog(weekday) {
        const timed = new Date(weekday.dated);
        const now = new Date();

        now.setHours(now.getHours(), now.getMinutes(), 0, 0);
        now.setMonth(timed.getMonth());
        now.setDate(timed.getDate());

        this.newTime = now;
        this.selectedWeekday = weekday;
        this.$.addTimeDialog.show();

        const selector = 'vn-dialog[vn-id="addTimeDialog"] input[type="time"]';
        const input = this.$element[0].querySelector(selector);
        input.focus();
    }

    addTime(response) {
        if (response === 'ACCEPT') {
            let data = {workerFk: this.worker.id, timed: this.newTime};
            let query = `/api/WorkerTimeControls/addTime`;
            this.$http.post(query, data).then(() => {
                this.refresh();
            });
        }
    }
}

Controller.$inject = ['$scope', '$http', '$stateParams', '$element'];

ngModule.component('vnWorkerTimeControl', {
    template: require('./index.html'),
    controller: Controller,
    bindings: {
        worker: '<'
    }
});