AngualrJs 最新 文件图片上传教程3：Client-Controller-curdtable

womeninformationmanagement-curdtable.client.controller.js

womeninformationmanagement-curdtable.client.controller.js

womeninformationmanagement-curdtable.client.controller.js

(function () {  'use strict';  angular    .module('womenInformationManagement')    .controller('WomenInformationManagementCURDTableController', WomenInformationManagementCURDTableController);  WomenInformationManagementCURDTableController.$inject = ['$scope', 'Notification', '$log', '$window', 'uiGridConstants', 'WomenInformationManagementService', '$uibModal', 'Upload', 'localStorageService'];  function WomenInformationManagementCURDTableController($scope, Notification, $log, $window, uiGridConstants, WomenInformationManagementService, $uibModal, Upload, localStorageService) {    var vm = this;    //表数据    vm.tableData = [];    //ui-grid 当前选择的行    vm.selectedRow = null;//读取本地存储的社区村常量表    var cvsList = localStorageService.getItems('WomensFederationTypeTable');    //打开模态框,返回模态框实例    vm._openModal = function(resarg) {      return $uibModal.open({        templateUrl: '/modules/baseinfomanage/client/views/womeninformationmanagement-modal-form.client.view.html',        controller: 'WomenInformationManagementModalFormController',        controllerAs: 'vm',        backdrop: 'static',        size: 'lg',        resolve: angular.extend({          //列定义          columnDefs: function () {            //去掉前1列：id            return vm.gridOptions.columnDefs.slice(1);          }        }, resarg)      });    };    //增加数据    vm.add = function() {      var modalInstance = vm._openModal({        //womenInformationManagement会传入modal的controller        womenInformationManagementData: function() {          //空数据          return new WomenInformationManagementService();        },        //表明是增加        method: function() {          return '新增';        }      });      // 模态窗口关闭之后返回的值      modalInstance.result.then(function(result) {        // $log.log('新增:', result);        // result.$save()        Upload.upload({          url: '/api/womenInformationManagement',          data: result        })          .then(function(res) {            // vm.gridOptions.data.push(res);            //-----------------分页1：新增后， 刷新记录总数---------------            refreshRecordCount(vm.queryParam);            Notification.success({ message: '<i class="glyphicon glyphicon-ok"></i> 新增成功!' });          })          .catch(function(err) {            $log.error('新增失败:', err.data.message);            Notification.error({ message: err.data.message, title: '<i class="glyphicon glyphicon-remove"></i>' +              ' 新增失败!' });          });      })      .catch(function(reason) {        $log.log('Modal dismissed:', reason);      });    };    //删除数据    vm.remove = function() {      if ($window.confirm('确定删除?')) {        vm.selectedRow.$remove(function() {          //-----------------分页2：删除后， 刷新记录总数---------------          refreshRecordCount(vm.queryParam);          /*var rowindex = vm.tableData.indexOf(vm.selectedRow);          //去掉表格中的数据          vm.tableData.splice(rowindex, 1);          //复位当前行          vm.selectedRow = null;*/          Notification.success({ message: '<i class="glyphicon glyphicon-ok"></i> 删除成功!' });        })        .catch(function(err) {          $log.error('删除失败:', err.data.message);          Notification.error({ message: err.data.message, title: '<i class="glyphicon glyphicon-remove"></i>' +          ' 删除失败!' });        });      }    };    //修改或查看数据    vm._updateorview = function(isupdate) {      var modalInstance = vm._openModal({        womenInformationManagementData: function() {          //复制当前选择的数据, 不要直接修改，否则表格上会直接显示模态框中修改后的内容          return angular.copy(vm.selectedRow);        },        method: function() {          return isupdate ? '修改' : '浏览';        }      });      modalInstance.result.then(function(result) {        // $log.log('修改 浏览:', result);        if (isupdate) {          // result.$update()          Upload.upload({            url: '/api/womenInformationManagement/' + result.id,            data: result          })            .then(function(res) {              //修改表格显示的数据              // angular.extend(vm.selectedRow, res);              //修改表格显示的数据              refreshPageData(vm.gridOptions.paginationCurrentPage, vm.gridOptions.paginationPageSize);              // angular.extend(vm.selectedRow, res.data);              Notification.success({ message: '<i class="glyphicon glyphicon-ok"></i> 修改成功!' });            })            .catch(function(err) {              // $log.error('修改失败:', err.data.message);              Notification.error({ message: err.data.message, title: '<i class="glyphicon glyphicon-remove"></i> ' +              '修改失败!' });            });        }      }).catch(function(reason) {        $log.log('Modal dismissed:', reason);      });    };    //修改    vm.update = function() {      return vm._updateorview(true);    };    //查看    vm.view = function() {      return vm._updateorview(false);    };    //ui-gird 基本配置参数    vm.gridOptions = {      //表数据      data: vm.tableData,      columnDefs: [        // {field: 'id', displayName: '序号'},        {field: 'rid', displayName: '序号'},        {field: 'title', displayName: '标题'},        // {field: 'type', displayName: '类型'},        {field: 'typeName', displayName: '类型'},        {field: 'photo', displayName: '照片'},        {field: 'file_path', displayName: '文件地址'},        {field: 'time_update', displayName: '时间', cellFilter: 'date:"yyyy-MM-dd"'},        {field: 'remark', displayName: '备注'}      ],//-------------分页1.页面操作参数---------------      paginationPageSizes: [20, 30, 40], //每页显示个数可选项      paginationCurrentPage: 1, //当前页码      paginationPageSize: 20,      //使用自定义翻页控制      useExternalPagination: true,      onRegisterApi: function (gridApi) {        //保存api调用对象        vm.gridApi = gridApi;        // ---------分页2.分页按钮事件---------------        gridApi.pagination.on.paginationChanged($scope, function (newPage, pageSize) {          refreshPageData(newPage, pageSize);        });        //监视行改变函数        gridApi.selection.on.rowSelectionChanged($scope, function(row, event) {          // $log.log('row selected ' + row.isSelected, row);          vm.selectedRow = row.isSelected ? row.entity : null;        });      },      //如果不需要在表格左上角菜单显示功能，以下参数可以去掉      //允许表格左上角菜单      enableGridMenu: false    };   /* //取后台WomenInformationManagement表所有数据    WomenInformationManagementService.query().$promise.then(function(data) {      vm.gridOptions.data = vm.tableData = data;    });*/    //分页3参数    vm.queryParam = {      womenInformationManagementId: 0,      limit: 0,      offset: 0    };    //分页4： 刷新记录总数    refreshRecordCount(vm.queryParam);    //刷新页面数据    function refreshPageData(pageNumber, pageSize) {      vm.gridOptions.paginationCurrentPage = pageNumber;//当前页码      //页面，记录数限制参数      var pageParam = {        womenInformationManagementId: 0,        limit: (pageNumber - 1) * pageSize,        offset: pageSize      };      //取后台数据，默认按创建时间降序排序      return WomenInformationManagementService.query(pageParam).$promise        .then(function (data) {          // $log.info('data:', data);          //序号列的处理          if (data.length > 0) {            for (var k = 0; k < data.length; k++) {              data[k].rid = k + 1 + (pageNumber - 1) * pageSize;              //类型名字              for (var m = 0; m < cvsList.length; m++) {                if (cvsList[m].id === data[k].type) {                  data[k].typeName = cvsList[m].name;                }              }            }          }          vm.gridOptions.data = vm.tableData = data;          return data;        })        .catch(function (err) {          $log.error('query error:', err);        });    }    //刷新记录总数    function refreshRecordCount(queryParam) {      WomenInformationManagementService.query(queryParam).$promise        .then(function (result) {          vm.gridOptions.totalItems = result[0].sum;        })        .then(function () {          refreshPageData(1, vm.gridOptions.paginationPageSize);        })        .catch(function (err) {          $log.error('getCount error:', err);        });    }  }}());