vat-layout.js 2.64 KB

vatModule.directive('vatLayout', ['$log', 'region', 'enums',
function ($log, region, enums) {
    'use strict';

    $log.debug('vatLayout.ctor()...');

    return {
        restrict: 'E',
        templateUrl: '/app/vat/vat-layout/vat-layout.html' + '?_=' + Math.random(),
        replace: true,
        scope: {},
        controller: 'VatLayoutController',
        link: function ($scope, $element, $attr) {

            var ele = $("#vatDatepicker");
            ele.datepicker({
                startDate: $scope.startDate,
                endDate: $scope.endDate,
                language: region,
                viewMode: 1,
                minViewMode: 1,
                autoclose: true,//选中之后自动隐藏日期选择框
                clearBtn: false,//清除按钮
                todayBtn: false,//今日按钮
                format: $scope.dateFormat//日期格式,详见 http://bootstrap-datepicker.readthedocs.org/en/release/options.html#format
            }).on('changeDate', function (e) {
                $scope.changeDate(e);
            });
            ele.datepicker("setDate", $scope.selectedDate);
            $scope.elePicker = ele;

            $scope.menuStates = enums.vatMenuStates;
            $scope.menuState = enums.vatMenuStates.expanded;

            // Click to collapse the top menu
            // Param collapseMenu should be 1 to collapse, and 2 to expand.
            // 0: Expanded; 1: Collapsing, 2: Expanding, 3: Collapsed
            $scope.collapseMenu = function (collapseMenu) {
                $scope.menuState = collapseMenu;
            };

            // Handle css for top menu while collapse animation ended
            $scope.headerAnimationEnd = function ($event) {
                // Here we have to add class `collapsed` with JQuery grammar, because we want
                // it work immediately.
                if ($scope.menuState === enums.vatMenuStates.collapsing) {
                    angular.element('.vat-header').addClass('collapsed');
                }

                $scope.$apply(function () {
                    if ($scope.menuState === enums.vatMenuStates.collapsing) {
                        $scope.menuState = enums.vatMenuStates.collapsed;
                    }
                    else if ($scope.menuState === enums.vatMenuStates.expanding) {
                        $scope.menuState = enums.vatMenuStates.expanded;
                    }
                });
            }

            // Repaint spreadJS while spreadJS control expanded already
            $scope.contentAnimationEnd = function ($event) {
                $scope.$broadcast(enums.vatEvent.layoutChanged);
            };
        }
    };
}
]);