<meta charset="UTF-8">
<title></title>
<style>
tbody tr:nth-child(even){
background-color: paleturquoise;
}
tbody tr:nth-child(odd){
background-color: palegreen;
}
</style>
<script type="text/javascript" src="../js/angular.js" ></script>
<script>
var app=angular.module("myApp",[]);
app.controller("myCtrl",function($scope,$http){
$http.get("http://result.eolinker.com/TucCTQueffdc1d1aaa3be05d8c62e9bb5d3e8b495f97cca?uri=hybrid")
.then(function(pro){
$scope.products=pro.data;
});
$scope.getage=function(bir){
var q=new Date(bir).getYear();
var w=new Date().getYear();
return w-q;
}
//删除
$scope.delProduct=function(clumn){
if(confirm("你确定删除吗")){
for (index in $scope.products) {
if($scope.products[index].id==clumn){
$scope.products.splice(index,1);
}
}
}
}
//批量删除
$scope.delete=function(){
for (var i=0;i<$scope.products.length;i++) {
if($scope.products[i].state==true){
$scope.products.splice(i,1);
i--;
}
}
}
//全选
$scope.select=function(){
for (var i in $scope.products) {
$scope.products[i].state=$scope.selectAll;
}
}
//搜索
$scope.search="";
//部门查询
$scope.getbname=function(dname){
if($scope.bmcx=="" || $scope.bmcx==undefined){
return true;
}
if(dname.indexOf($scope.bmcx)>-1){
return true;
}
return false;
}
});
</script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<input type="text" placeholder="请输入姓名" ng-model="search"/>
<input type="text" placeholder="请输入部门名" ng-model="bmcx"/>
<select ng-model="xzpx">
<option value="">薪资排序</option>
<option value="+salary">升序</option>
<option value="-salary">降序</option>
</select>
<br />
<button ng-click="delete()">批量删除</button>
<table border="" cellpadding="10" cellspacing="0">
<thead>
<tr>
<th><input type="checkbox" ng-click="select()" ng-model="selectAll"></th>
<th>姓名</th>
<th>年龄</th>
<th>薪资</th>
<th>性别</th>
<th>日期</th>
<th>部门</th>
<th>操作</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="pro in products | filter:{name:search} | orderBy:xzpx" ng-show="getbname(pro.department.name)">
<td><input type="checkbox" ng-model="pro.state"></td>
<td>{{pro.name}}</td>
<td>{{getage(pro.birthday)}}</td>
<td><span ng-hide="xg">{{pro.salary}}</span><span ng-show="xg"><input type="text" ng-model="pro.salary"><button ng-click="xg=false">保存</button></span></td>
<td>{{pro.gender}}</td>
<td>{{pro.birthday}}</td>
<td>{{pro.department.name}}</td>
<td><button ng-click="delProduct(pro.id)">删除</button></td>
<td><button ng-click="xg=true">修改</button></td>
</tr>
</tbody>
</table>
</body>
<title></title>
<style>
tbody tr:nth-child(even){
background-color: paleturquoise;
}
tbody tr:nth-child(odd){
background-color: palegreen;
}
</style>
<script type="text/javascript" src="../js/angular.js" ></script>
<script>
var app=angular.module("myApp",[]);
app.controller("myCtrl",function($scope,$http){
$http.get("http://result.eolinker.com/TucCTQueffdc1d1aaa3be05d8c62e9bb5d3e8b495f97cca?uri=hybrid")
.then(function(pro){
$scope.products=pro.data;
});
$scope.getage=function(bir){
var q=new Date(bir).getYear();
var w=new Date().getYear();
return w-q;
}
//删除
$scope.delProduct=function(clumn){
if(confirm("你确定删除吗")){
for (index in $scope.products) {
if($scope.products[index].id==clumn){
$scope.products.splice(index,1);
}
}
}
}
//批量删除
$scope.delete=function(){
for (var i=0;i<$scope.products.length;i++) {
if($scope.products[i].state==true){
$scope.products.splice(i,1);
i--;
}
}
}
//全选
$scope.select=function(){
for (var i in $scope.products) {
$scope.products[i].state=$scope.selectAll;
}
}
//搜索
$scope.search="";
//部门查询
$scope.getbname=function(dname){
if($scope.bmcx=="" || $scope.bmcx==undefined){
return true;
}
if(dname.indexOf($scope.bmcx)>-1){
return true;
}
return false;
}
});
</script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<input type="text" placeholder="请输入姓名" ng-model="search"/>
<input type="text" placeholder="请输入部门名" ng-model="bmcx"/>
<select ng-model="xzpx">
<option value="">薪资排序</option>
<option value="+salary">升序</option>
<option value="-salary">降序</option>
</select>
<br />
<button ng-click="delete()">批量删除</button>
<table border="" cellpadding="10" cellspacing="0">
<thead>
<tr>
<th><input type="checkbox" ng-click="select()" ng-model="selectAll"></th>
<th>姓名</th>
<th>年龄</th>
<th>薪资</th>
<th>性别</th>
<th>日期</th>
<th>部门</th>
<th>操作</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="pro in products | filter:{name:search} | orderBy:xzpx" ng-show="getbname(pro.department.name)">
<td><input type="checkbox" ng-model="pro.state"></td>
<td>{{pro.name}}</td>
<td>{{getage(pro.birthday)}}</td>
<td><span ng-hide="xg">{{pro.salary}}</span><span ng-show="xg"><input type="text" ng-model="pro.salary"><button ng-click="xg=false">保存</button></span></td>
<td>{{pro.gender}}</td>
<td>{{pro.birthday}}</td>
<td>{{pro.department.name}}</td>
<td><button ng-click="delProduct(pro.id)">删除</button></td>
<td><button ng-click="xg=true">修改</button></td>
</tr>
</tbody>
</table>
</body>