<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.an1{background-color: chartreuse;}
.an2{background-color: chartreuse;}
.an3{background-color:red;}
tbody tr:nth-child(even) {
background-color: aqua;
}
tbody tr:nth-child(odd) {
background-color: gold;
}
</style>
<script type="text/javascript" src="../js/angular.js" ></script>
<script>
var app=angular.module("myapp",[]);
app.controller("mycon",function($scope){
$scope.arr=[1,2,3,4,5,6,7,8,9,10,11,12];
$scope.shang=[
{id:7,
usname:"OppO R9sk",
name:"关羽",
shouji:"15777777777",
jiage:4999,
chengshi:"北京",
xiadan:new Date("2017-05-02"),
tai:"已发货",
state:false
},
{id:12,
usname:"VIVO X20",
name:"赵云",
shouji:"1333333333",
jiage:2998,
chengshi:"上海",
xiadan:new Date("2017-06-02"),
tai:"未发货",
state:false
},
{id:1,
usname:"iphone 8 Plus",
name:"曹操",
shouji:"1511111111",
jiage:7588,
chengshi:"北京",
xiadan:new Date("2017-07-02"),
tai:"已发货",
state:false
},
]
//添加
$scope.jia=false;
$scope.tianjia=function(){
//敏感字
var min=/米/g;
var s={
id:$scope.x_id,
usname:$scope.x_usname,
name:$scope.x_name.replace(min,"*"),
shouji:$scope.x_shouji,
jiage:$scope.x_jiage,
chengshi:$scope.x_chengshi,
xiadan:new Date(),
tai:"未发货"
}
$scope.shang.push(s);
$scope.jia=false;
}
//删除
$scope.sanchu=function($index){
$scope.shang.splice($index,1)
}
//全选
$scope.quan=false;
$scope.xuan=function(){
if($scope.quan){
for(index in $scope.shang){
$scope.shang[index].state = true;
}
}else{
for(index in $scope.shang){
$scope.shang[index].state = false;
}
}
};
//批量删除
$scope.pisan = function() {
if(confirm("确定删除吗")) {
for(var i = 0; i < $scope.shang.length; i++) {
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.an1{background-color: chartreuse;}
.an2{background-color: chartreuse;}
.an3{background-color:red;}
tbody tr:nth-child(even) {
background-color: aqua;
}
tbody tr:nth-child(odd) {
background-color: gold;
}
</style>
<script type="text/javascript" src="../js/angular.js" ></script>
<script>
var app=angular.module("myapp",[]);
app.controller("mycon",function($scope){
$scope.arr=[1,2,3,4,5,6,7,8,9,10,11,12];
$scope.shang=[
{id:7,
usname:"OppO R9sk",
name:"关羽",
shouji:"15777777777",
jiage:4999,
chengshi:"北京",
xiadan:new Date("2017-05-02"),
tai:"已发货",
state:false
},
{id:12,
usname:"VIVO X20",
name:"赵云",
shouji:"1333333333",
jiage:2998,
chengshi:"上海",
xiadan:new Date("2017-06-02"),
tai:"未发货",
state:false
},
{id:1,
usname:"iphone 8 Plus",
name:"曹操",
shouji:"1511111111",
jiage:7588,
chengshi:"北京",
xiadan:new Date("2017-07-02"),
tai:"已发货",
state:false
},
]
//添加
$scope.jia=false;
$scope.tianjia=function(){
//敏感字
var min=/米/g;
var s={
id:$scope.x_id,
usname:$scope.x_usname,
name:$scope.x_name.replace(min,"*"),
shouji:$scope.x_shouji,
jiage:$scope.x_jiage,
chengshi:$scope.x_chengshi,
xiadan:new Date(),
tai:"未发货"
}
$scope.shang.push(s);
$scope.jia=false;
}
//删除
$scope.sanchu=function($index){
$scope.shang.splice($index,1)
}
//全选
$scope.quan=false;
$scope.xuan=function(){
if($scope.quan){
for(index in $scope.shang){
$scope.shang[index].state = true;
}
}else{
for(index in $scope.shang){
$scope.shang[index].state = false;
}
}
};
//批量删除
$scope.pisan = function() {
if(confirm("确定删除吗")) {
for(var i = 0; i < $scope.shang.length; i++) {
if($scope.shang[i].state == true) {
$scope.shang.
i--;
}
}
}
}
//判断日期
$scope.valu = function(m){
var mm = m.getMonth() +1;
var start = $scope.ks;
var end = $scope.js;
if(start==undefined ||start==""){
start=1;
}
if(end == undefined || end == ""){
end=12;
}
if(mm >= start && mm <=end){
return true;
}else{
return false;
}
}
})
</script>
</head>
<body ng-app="myapp" ng-controller="mycon">
<input type="text" placeholder="用户名搜索" ng-model="mohu"/>
<input type="text" placeholder="手机号搜索" ng-model="shou"/>
<select ng-model="cheng" >
<option value="">选择城市</option>
<option value="北京">北京</option>
<option value="上海">上海</option>
<option value="辽宁">辽宁</option>
<option value="深圳">深圳</option>
</select>
<select ng-model="zta">
<option value="">选择状态</option>
<option value="已发货">已发货</option>
<option value="未发货">未发货</option>
</select>
<select ng-model="ks"><option value="">开始时间</option><option ng-repeat="a in arr">{{a}}</option></select>
<select ng-model="js"><option value="">结束时间</option><option ng-repeat="a in arr">{{a}}</option></select>
<select ng-model="pai">
<option value="">ID排序</option>
<option value="id">正序排序</option>
<option value="-id">倒序排序</option>
</select><br /><br>
<button class="an1" ng-click="jia=true">新增订单</button>
<button class="an2">批量发货</button>
<button class="an3" ng-click="pisan()">批量删除</button>敏感字:米(商品名)->替换*<br><br>
<table cellpadding="15" cellspacing="0" border="1">
<thead>
<tr bgcolor="darkgray">
<th><input type="checkbox" ng-model="quan" ng-click="xuan()"></th>
<th>ID</th>
<th>商品名</th>
<th>用户名</th>
<th>手机号</th>
<th>价格</th>
<th>城市</td>
<th>下单时间</th>
<th>状态</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="diao in shang | filter:{name:mohu}|filter:{shouji:shou}|filter:{chengshi:cheng} | orderBy:pai | filter:{tai:zta}" ng-show="valu(diao.xiadan)" align="center">
<td><input type="checkbox" ng-model="diao.state"></td>
<td ng-if="">{{$index}}</td>
<td>{{diao.id}}</td>
<td>{{diao.usname}}</td>
<td>{{diao.name}}</td>
<td>{{diao.shouji}}</td>
<td>{{diao.jiage | currency:'¥'}}</td>
<td>{{diao.chengshi}}</td>
<td>{{diao.xiadan | date:"MM-dd hh:mm"}}</td>
<td>
<span ng-if="diao.tai=='已发货'">已发货</span>
<span ng-if="diao.tai=='未发货'">
<a href="#" ng-click="diao.tai='已发货'">未发货</a>
</span>
</td>
<td><button>修改</button> <button ng-click="sanchu($index)">删除</button></td>
</tr>
</tbody>
</table>
<p ng-show="jia">
ID:<input type="text" ng-model="x_id"/><br>
商品名:<input type="text" ng-model="x_usname"/><br />
用户名:<input type="text" ng-model="x_name"/><br />
手机号:<input type="text" ng-model="x_shouji"/><br />
价格:<input type="text" ng-model="x_jiage"/><br />
城市:<input type="text" ng-model="x_chengshi"/><br />
<button ng-click="tianjia()">OK</button>
</p>
</body>
</html>
$scope.shang.
i--;
}
}
}
}
//判断日期
$scope.valu = function(m){
var mm = m.getMonth() +1;
var start = $scope.ks;
var end = $scope.js;
if(start==undefined ||start==""){
start=1;
}
if(end == undefined || end == ""){
end=12;
}
if(mm >= start && mm <=end){
return true;
}else{
return false;
}
}
})
</script>
</head>
<body ng-app="myapp" ng-controller="mycon">
<input type="text" placeholder="用户名搜索" ng-model="mohu"/>
<input type="text" placeholder="手机号搜索" ng-model="shou"/>
<select ng-model="cheng" >
<option value="">选择城市</option>
<option value="北京">北京</option>
<option value="上海">上海</option>
<option value="辽宁">辽宁</option>
<option value="深圳">深圳</option>
</select>
<select ng-model="zta">
<option value="">选择状态</option>
<option value="已发货">已发货</option>
<option value="未发货">未发货</option>
</select>
<select ng-model="ks"><option value="">开始时间</option><option ng-repeat="a in arr">{{a}}</option></select>
<select ng-model="js"><option value="">结束时间</option><option ng-repeat="a in arr">{{a}}</option></select>
<select ng-model="pai">
<option value="">ID排序</option>
<option value="id">正序排序</option>
<option value="-id">倒序排序</option>
</select><br /><br>
<button class="an1" ng-click="jia=true">新增订单</button>
<button class="an2">批量发货</button>
<button class="an3" ng-click="pisan()">批量删除</button>敏感字:米(商品名)->替换*<br><br>
<table cellpadding="15" cellspacing="0" border="1">
<thead>
<tr bgcolor="darkgray">
<th><input type="checkbox" ng-model="quan" ng-click="xuan()"></th>
<th>ID</th>
<th>商品名</th>
<th>用户名</th>
<th>手机号</th>
<th>价格</th>
<th>城市</td>
<th>下单时间</th>
<th>状态</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="diao in shang | filter:{name:mohu}|filter:{shouji:shou}|filter:{chengshi:cheng} | orderBy:pai | filter:{tai:zta}" ng-show="valu(diao.xiadan)" align="center">
<td><input type="checkbox" ng-model="diao.state"></td>
<td ng-if="">{{$index}}</td>
<td>{{diao.id}}</td>
<td>{{diao.usname}}</td>
<td>{{diao.name}}</td>
<td>{{diao.shouji}}</td>
<td>{{diao.jiage | currency:'¥'}}</td>
<td>{{diao.chengshi}}</td>
<td>{{diao.xiadan | date:"MM-dd hh:mm"}}</td>
<td>
<span ng-if="diao.tai=='已发货'">已发货</span>
<span ng-if="diao.tai=='未发货'">
<a href="#" ng-click="diao.tai='已发货'">未发货</a>
</span>
</td>
<td><button>修改</button> <button ng-click="sanchu($index)">删除</button></td>
</tr>
</tbody>
</table>
<p ng-show="jia">
ID:<input type="text" ng-model="x_id"/><br>
商品名:<input type="text" ng-model="x_usname"/><br />
用户名:<input type="text" ng-model="x_name"/><br />
手机号:<input type="text" ng-model="x_shouji"/><br />
价格:<input type="text" ng-model="x_jiage"/><br />
城市:<input type="text" ng-model="x_chengshi"/><br />
<button ng-click="tianjia()">OK</button>
</p>
</body>
</html>