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); }; } }; } ]);