上下班记录

assets/js/config.constant.js

@@ -121,10 +121,11 @@ app.constant('JS_REQUIRES', {
         'jry_open_indexesCtrl':'assets/js/controllers/file/jry_open_indexesCtrl.js',//引入文档
         //任务管理
         'taskFormCtr':'assets/js/controllers/task/taskFormCtr.js',//新建任务
-        'workingFormCtr':'assets/js/controllers/working/workingFormCtr.js',//上下班管理
         'moonTaskCtrl':'assets/js/controllers/task/moonTaskCtrl.js',//月度任务
         'taskListCtrl':'assets/js/controllers/task/taskListCtrl.js',//任务列表
         'taskDetailedCtr':'assets/js/controllers/task/taskDetailedCtrl.js',//任务清单
+        'workingFormCtr':'assets/js/controllers/working/workingFormCtr.js',//上下班管理
+        'workingHistoryFormCtr':'assets/js/controllers/working/workingHistoryFormCtr.js',//每日上下班记录
         //*** outside service
         'dnsmanageCtrl': 'assets/js/controllers/externalservice/dnsmanageCtrl.js',
         'emailhandleCtrl': 'assets/js/controllers/externalservice/emailhandleCtrl.js',

assets/js/config.router.js

@@ -504,6 +504,16 @@ app.config(['$authProvider', '$httpProvider', '$stateProvider', '$urlRouterProvi
                 ncyBreadcrumb: {
                     label: 'incident list'
                 }
+            }).state('app.working.history', {
+                url: '/history',
+                templateUrl: "assets/views/working/list.html",
+                resolve: loadSequence('jquery-sparkline', 'spin', 'ladda', 'angular-ladda', 'ui.grid', 'moment', 'angularPrint', 'angularFileUpload', 'ui.select', 'multi.select.tree', 'angularBootstrapNavTree', 'workingHistoryFormCtr'),
+                title: 'incident.LIST',
+                pdKey: 'bpm_incident',
+                icon: 'ti-list',
+                ncyBreadcrumb: {
+                    label: 'incident list'
+                }
             }).state('app.incident.editor', {
                 url: '/editor/{taskId}/{processInstanceId}/{dataId}',
                 templateUrl: "assets/views/customform/index.html",

assets/js/controllers/working/workingHistoryFormCtr.js

@@ -0,0 +1,209 @@
+'use strict';
+
+app.controller('workingHistoryFormCtr', ["$scope", "moment", "SweetAlert", "api_user_data", function ($scope, moment, SweetAlert, api_user_data) {
+  //上班记录状态
+  $scope.statesOn = [
+    { name: '全部', value: '0' },
+    { name: '实到', value: '1' },
+    { name: '迟到', value: '2' },
+    { name: '未打卡', value: '4' }
+  ];
+  // 下班记录状态
+  $scope.statesOff = [
+    { name: '全部', value: '0' },
+    { name: '早退', value: '3' },
+    { name: '未打卡', value: '4' }
+  ];
+  // 查询条件
+  $scope.searchkeys = {
+    state: $scope.statesOn[0],
+    date: moment().format('YYYY-MM-DD')
+  }
+  // 查询的重置条件
+  $scope.resetSearchkeys = {
+    state: $scope.statesOn[0],
+    date: moment().format('YYYY-MM-DD')
+  }
+  // 最大日期
+  $scope.maxDate = moment();
+  //列表数据
+  $scope.myData = [];
+  $scope.itemsSaveNoOn = [];
+  $scope.itemsSaveNoOff = [];
+  //表格相关
+  $scope.gridOptions = {};
+  $scope.gridOptions.data = 'myData';
+  $scope.gridOptions.enableColumnResizing = true;
+  $scope.gridOptions.enableFiltering = false;
+  $scope.gridOptions.enableGridMenu = true;
+  $scope.gridOptions.enableSelectAll = true;
+  $scope.gridOptions.enableRowSelection = true;
+  $scope.gridOptions.showGridFooter = true;
+  $scope.gridOptions.showColumnFooter = false;
+  $scope.gridOptions.fastWatch = true;
+  $scope.gridOptions.enableSorting = true;
+  $scope.gridOptions.useExternalSorting = true;
+  $scope.gridOptions.useExternalFiltering = false;
+  $scope.gridOptions.useExternalPagination = true;
+  $scope.gridOptions.paginationPageSizes = [10, 20, 50, 100];
+  $scope.gridOptions.paginationPageSize = 10;
+  $scope.gridOptions.multiSelect = true;
+  $scope.gridOptions.columnDefs = [
+    {
+      name: 'item',
+      displayName: '序号',
+      width: '7%',
+      minWidth: '45',
+      cellTemplate: '<div>' +
+        '<div class="ui-grid-cell-contents">{{row.entity.item}}</div>' +
+        '</div>'
+    },
+    {
+      name: 'userName',
+      displayName: '打卡人姓名',
+      width: '15%',
+      minWidth: '70',
+      enableSorting: false
+    },
+    {
+      name: 'extra2',
+      displayName: '状态',
+      width: '15%',
+      minWidth: '70',
+      enableSorting: false,
+      cellTemplate: '<div>' +
+        '<div class="ui-grid-cell-contents" ng-style="{color:(row.entity.extra2 === \'正常\' && row.entity.opValue) ? \'green\' : \'red\'}">{{row.entity.opValue?row.entity.extra2:\'未打卡\'}}</div>' +
+        '</div>'
+    },
+    {
+      name: 'opTime',
+      displayName: '打卡时间',
+      width: '20%',
+      minWidth: '140',
+      enableFiltering: false,
+      cellTemplate: '<div>' +
+        '<div class="ui-grid-cell-contents">{{row.entity.opTime?(row.entity.opTime|date:\'HH:mm\'):\'无\'}}</div>' +
+        '</div>'
+    },
+    {
+      name: 'extra1',
+      displayName: '打卡地址',
+      width: '43%',
+      minWidth: '280',
+      enableFiltering: false,
+      cellTemplate: '<div>' +
+        '<div class="ui-grid-cell-contents">{{row.entity.extra1 || \'无\'}}</div>' +
+        '</div>'
+    }
+  ];
+  //默认选择上班记录
+  $scope.searchstate = 'on';
+  $scope.states = $scope.statesOn;
+  // 切换tab
+  $scope.onChange = function (searchType) {
+    $scope.searchstate = searchType;
+    switch (searchType) {
+      case 'on':
+        $scope.states = $scope.statesOn;
+        $scope.searchkeys.state = $scope.statesOn[0];
+        break;
+      case 'off':
+        $scope.states = $scope.statesOff;
+        $scope.searchkeys.state = $scope.statesOff[0];
+        break;
+    }
+    $scope.refreshData();
+  }
+  // 点击日期框
+  $scope.startOpen = function ($event) {
+    $event.preventDefault();
+    $event.stopPropagation();
+    $scope.startOpened = !$scope.startOpened;
+  };
+  // 选择日期
+  $scope.changeDate = function(){
+    $scope.searchkeys.date = moment($scope.searchkeys.date).format('YYYY-MM-DD');
+  }
+  // 重置
+  $scope.clear = function () {
+    $scope.searchkeys = angular.copy($scope.resetSearchkeys);
+    $scope.refreshData();
+  }
+  //处理过滤数据
+  $scope.stateChange = function(data){
+    var arr = [];
+    //过滤上班记录或下班记录
+    if ($scope.searchstate === "on") {
+      //上班记录
+      arr = data.filter(v => v.opValue === "1");
+    } else if ($scope.searchstate === "off") {
+      //下班记录
+      arr = data.filter(v => v.opValue === "0");
+    }
+    // 过滤状态
+    if ($scope.searchkeys.state.value === "1") {
+      //实到
+      let arr1 = arr.filter(v => v.extra2 == "迟到");
+      let arr2 = arr.filter(v => v.extra2 == "正常");
+      $scope.myData = [...arr1,...arr2];
+    } else if ($scope.searchkeys.state.value === "2") {
+      //迟到
+      $scope.myData = arr.filter(v => v.extra2 == "迟到");
+    } else if ($scope.searchkeys.state.value === "3") {
+      //早退
+      $scope.myData = arr.filter(v => v.extra2 == "早退");
+    } else if ($scope.searchkeys.state.value === "4") {
+      //未打卡
+      if($scope.searchstate === 'on'){
+        // 上班
+        $scope.myData = angular.copy($scope.itemsSaveNoOn);
+      }else if($scope.searchstate === 'off'){
+        // 下班
+        $scope.myData = angular.copy($scope.itemsSaveNoOff);
+      }
+    } else if ($scope.searchkeys.state.value === "0") {
+      //全部
+      if($scope.searchstate === 'on'){
+        // 上班
+        $scope.myData = angular.copy(arr.concat($scope.itemsSaveNoOn));
+      }else if($scope.searchstate === 'off'){
+        // 下班
+        $scope.myData = angular.copy(arr.concat($scope.itemsSaveNoOff));
+      }
+    }
+    //添加序号
+    $scope.myData.forEach((v, i) => {
+      v.item = i + 1;
+    })
+  }
+  //获取列表数据
+  $scope.refreshData = function () {
+    $scope.myData = [];
+    $scope.itemsSaveNoOn = [];
+    $scope.itemsSaveNoOff = [];
+    api_user_data.getOnlineInfo($scope.searchkeys.date).then(function (result) {
+      if (result.data) {
+        if (result.data.length) {
+          $scope.itemsSaveNoOn = result.unOnlineList || [];
+          $scope.itemsSaveNoOff = result.unOfflineList || [];
+          // 处理过滤数据
+          $scope.stateChange(result.data);
+        }
+      } else {
+        SweetAlert.swal({
+          title: "系统错误",
+          text: "请稍后再试!",
+          type: "error"
+        });
+      }
+    }, function () {
+      SweetAlert.swal({
+        title: "系统错误",
+        text: "请稍后再试!",
+        type: "error"
+      });
+    });
+  };
+  //进入页面初次渲染页面
+  $scope.refreshData();
+}]);

assets/js/main.js

@@ -601,6 +601,9 @@ app.factory('api_user_data', ['UserRestangular', function (UserRestangular) {
         },
         getMenu: function (data, model) {
             return userService.customPOST(data, 'getMenu', {});
+        },
+        getOnlineInfo: function (date) {
+            return userService.customPOST({}, 'onlineInfo/' + date, {});
         }
     };
 }]);

assets/views/working/list.html

@@ -0,0 +1,299 @@
+<div ng-controller="workingHistoryFormCtr" class="">
+  <section id="page-title">
+    <div class="row">
+      <div class="col-sm-8">
+        <h1 class="mainTitle">每日上下班记录
+          <i tooltip='每日上下班记录,点击操作处理任务' tooltip-placement="right"
+            class="fa  ti-help-alt margin-left-10 fontcolor-five pointfont"></i>
+        </h1>
+      </div>
+    </div>
+  </section>
+  <div class="listbote">
+    <div class="list-controls clearfix">
+      <div class="btn-group">
+        <button class="btn btn-statebutton statebutton  keepleftbottom wt_btn2" ng-click="onChange('on')"
+          ng-class="{'statecolor':searchstate=='on'}">上班记录</button>
+        <button class="btn btn-statebutton statebutton wt_btn2" ng-class="{'statecolor':searchstate=='off'}"
+          ng-click="onChange('off')">下班记录</button>
+      </div>
+    </div>
+
+    <div style="background: #F9F9F9 !important;padding-left: 16px;padding-right: 0px;">
+      <div class="row wt_searchlistback" id="searchid">
+        <div class="col-xs-10" style="padding-right: 0px !important;padding-bottom: 10px;">
+          <form class="form-inline incidentsearchsize" style='padding-top: 8px'>
+            <div class="form-group incidentsearch wt_width">
+              <div class="">
+                <div class="control-label pull-left margin-top-5">打卡时间:</div>
+                <input type="text" class=" incidentsearchsize wt_width5" datepicker-popuptime="yyyy-MM-dd"
+                  ng-model="searchkeys.date" ng-change="changeDate()" max-date="maxDate" is-open="startOpened" hour-time=true
+                  ng-init="startOpened = false" close-text="关闭" ng-click="startOpen($event)" placeholder="" />
+              </div>
+            </div>
+            <div class="form-group incidentsearch  wt_width">
+              <div class="control-label pull-left margin-top-5">状态:</div>
+              <ui-select class="pull-right selectzise wt_width1 wt_width3" ng-model="searchkeys.state"
+                theme="bootstrap">
+                <ui-select-match placeholder="">
+                  {{$select.selected.name}}
+                </ui-select-match>
+                <ui-select-choices repeat="item in states | filter: $select.search">
+                  <div ng-bind-html="item.name | highlight: $select.search"></div>
+                </ui-select-choices>
+              </ui-select>
+            </div>
+          </form>
+        </div>
+        <div class="col-xs-2 wt_pad">
+          <div class="" style='padding-top: 8px'>
+            <div class="pull-left margin-top-10 searchBtnBox">
+              <div class=" wt_btns">
+                <div class="btn btn_search" ng-click="refreshData()" type="button">搜索</div>
+              </div>
+
+              <div class=" wt_btns">
+                <div class="btn btn_clean" ng-click="clear()" type="button">重置</div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="wt_list">
+      <div ui-i18n="{{lang}}" style="background: #fff;">
+        <div id="grid" style="border-radius: 2px !important;" ui-grid="gridOptions" external-scopes="$scope"
+          ui-grid-resize-columns ui-grid-auto-resize class="grid"></div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<style>
+  @media screen and (max-width: 1750px) {
+    .wt_width {
+      width: 30% !important;
+    }
+
+    .wt_width1 {
+      width: 60% !important;
+    }
+
+    .wt_width4 {
+      width: 27% !important;
+    }
+
+    .wt_width5 {
+      width: 60% !important;
+      border-color: #dedede;
+      float: right;
+    }
+
+  }
+
+  .selectzise {
+    width: 160px;
+  }
+
+  .wt_width {
+    width: 20%;
+    margin-right: 16px;
+    min-width: 275px !important;
+  }
+
+  .wt_width1 {
+    width: 160px;
+  }
+
+  .wt_margin-top {
+    margin-top: 35px !important;
+  }
+
+  .form-inline .form-control {
+    border-radius: 2px;
+  }
+
+  .wt_width3 {
+    width: 160px;
+    height: 28px !important;
+    border-radius: 2px !important;
+  }
+
+  .wt_width4 {
+    width: 20%;
+  }
+
+  .wt_width5 {
+    width: 160px;
+    border-color: #dedede;
+    float: right;
+    height: 28px;
+    border-radius: 2px !important;
+  }
+
+  .wt_width6 {
+    display: inline-block;
+    padding-top: 0px;
+    position: relative;
+    top: 4px;
+    /* left: 10px; */
+    width: 8.2%;
+    text-align: left;
+  }
+
+  .ui-select-bootstrap .ui-select-toggle {
+    height: 28px;
+  }
+
+  /* 
+    .wt_width {
+        width: 20%;
+        margin-right: 1%;
+        padding: 0px;
+    }
+
+    .wt_width1 {
+        width: 100% !important;
+        padding: 0px;
+    } */
+
+  .wt_width2 {
+    width: 50% !important;
+  }
+
+  .wt_pad {
+    padding: 0px;
+  }
+
+  .wt_btns {
+    display: inline-block;
+    margin-right: 8px;
+  }
+
+  .wt_btn1 {
+    width: 60px;
+    height: 28px !important;
+    border-radius: 2px;
+    line-height: 28px;
+    font-size: 14px;
+    padding: 0px !important;
+    font-size: 14px !important;
+  }
+
+  .btn.steelbutton.wt_btn1 {
+    padding: 0px !important;
+  }
+
+  .wt_btnColor {
+    background: #4A90E2 !important;
+  }
+
+  /* .btn{
+        padding: 0px!important;
+    } */
+
+
+  .wt_btnColor:hover {
+    background: #fff !important;
+    color: #2B5EB8 !important;
+    border: 1px solid #2B5EB8;
+  }
+
+  .wt_btnColor2:hover {
+    background: #fff !important;
+    color: #2B5EB8 !important;
+    border: 1px solid #2B5EB8;
+  }
+
+  .wt_btn2 {
+    width: 100px;
+    height: 34px !important;
+    border-radius: 2px !important;
+  }
+
+  .wt_list {
+    padding: 15px;
+    background: #F9F9F9;
+  }
+
+  .ui-grid-render-container:hover {
+    background: #fff !important;
+  }
+
+  .wt_btnColor1 {
+    background: #fff !important;
+    color: #2B5EB8 !important;
+    border: 1px solid #2B5EB8;
+  }
+
+  .wt_btnColor1:hover {
+    background: #4A90E2 !important;
+    color: #fff !important;
+    border: 1px solid #4A90E2 !important;
+  }
+
+  div.ui-grid-row.ng-scope:hover {
+    cursor: pointer;
+    background: #fff !important;
+  }
+
+  .wt_searchlistback {
+    margin-top: 1px;
+    margin-bottom: 8px;
+    border-top-left-radius: 0px !important;
+    border-top-right-radius: 8px !important;
+    border-bottom-left-radius: 8px !important;
+    border-bottom-right-radius: 8px !important;
+  }
+
+  .ui-grid-row:nth-child(even) .ui-grid-cell {
+    background: #fafafa !important;
+  }
+
+  .searchBtnBox>.wt_btns {
+    margin: 0 8px 10px 0;
+  }
+
+  /* 故障地点 */
+  .address-wrap {
+    position: relative;
+    height: 28px;
+  }
+
+  #bx_address {
+    height: 100%;
+  }
+
+  #bx_address_ul {
+    position: absolute;
+    top: 28px;
+    left: 0;
+    width: 100%;
+    max-height: 136px;
+    overflow-y: auto;
+    background-color: #fff;
+    border: 1px solid #d1d1d1;
+    border-top: none;
+    z-index: 9999;
+  }
+
+  #bx_address_ul li {
+    height: 34px;
+    border-bottom: 1px solid #d1d1d1;
+    line-height: 32px;
+    padding: 0 16px;
+    cursor: pointer;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  #bx_address_ul li:hover {
+    /* background-color: #005395; */
+    /* color: #fff; */
+  }
+
+  #bx_address_ul li:last-child {
+    border-bottom: none;
+  }
+</style>