666

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <style>
            tr:nth-of-type(odd){
                background: darkcyan;
            }
            tr:nth-of-type(even){
                background:tomato;
            }
            span{
                color: red;
            }
        </style>
        <script type="text/javascript" src="js/angular.min.js" ></script>
        <script>
            var app = angular.module("myApp",[]);
            app.controller("ctrl",function($scope,$http){
                $http.get("http://result.eolinker.com/lKgJQ8Zec38423e5603b8e055d1193a8127c0c060bb1b55?uri=goodstest")
                .success(function(datas){
                    $scope.datas = datas;
                });
                $scope.pd = false;
                $scope.xg = false;
                $scope.ck_all = function(){
                    for(var i = 0; i < $scope.datas.length;i++){
                        $scope.datas[i].c=$scope.flag;
                    }
                };
                $scope.del_all = function(){
                    for(var i = 0 ; i<$scope.datas.length;i++){
                        if($scope.datas[i].c){
                            $scope.datas.splice(i,1);
                            i--;
                        }
                    }
                }
                $scope.dele_a = function(id){
                    for(var i=0;i<$scope.datas.length;i++){
                        if($scope.datas[i].id==id){
                            $scope.datas.splice(i,1);
                        }
                    }
                }
                $scope.add = function(){
                    var id = $scope.add_id;
                    var gname = $scope.add_gname;
                    var uname = $scope.add_uname;
                    var tel = $scope.add_tel;
                    var price = $scope.add_price;
                    var city = $scope.add_price;
                    var regdate = $scope.add_regdate;
                    $scope.errors=null;
                    if(id==undefined||id==""){
                        if($scope.errors==null){
                            $scope.errors= {};
                        }
                        $scope.errors.id="编号不合法"
                    }
                    if(gname==undefined||gname==""){
                        if($scope.errors==null){
                            $scope.errors={};
                        }
                        $scope.errors.gname="用户名不合法"
                    }
                    
                    
                    
                    
                    if($scope.errors==null){
                        $scope.datas.push({
                            id:id,
                            gname:gname,
                            uname:uname,
                            tel:tel,
                            price:price,
                            city:city,
                            regdate:regdate,
                            state:'未发货'
                        });
                        $scope.pd=false;
                    }
                }
            });
        </script>
    </head>
    <body ng-app="myApp" ng-controller="ctrl">
        <center>
            <input type = "text" placeholder="输入内容查找" ng-model="namecx" />
            <select ng-model="statecx">
                <option value="">--请选择--</option>
                <option>未发货</option>
                <option>已发货</option>
            </select>
            <button ng-click="del_all()">批量删除</button>
            <button ng-click="pd=!pd">新增订单</button>
            <table border="1px">
                <tr>
                    <td><input type = "checkbox" ng-click="ck_all()" ng-model="flag"/></td>
                    <td>商品编号<button ng-click="namepx='id';f=!f">排序</button></td>
                    <td>商品名称</td>
                    <td>用户名</td>
                    <td>电话</td>
                    <td>价格<button ng-click="namepx='price';f=!f">排序</button></td>
                    <td>地址</td>
                    <td>日期</td>
                    <td>状态</td>
                    <td>操作</td>
                </tr>
                <tr ng-repeat="d in datas | filter:namecx | filter:{state:statecx}|orderBy:namepx:f">
                    <td><input type = "checkbox" ng-model="d.c"/></td>
                    <td>{{d.id}}</td>
                    <td>{{d.gname}}</td>
                    <td>{{d.uname}}</td>
                    <td>{{d.tel}}</td>
                    <td>
                        <span ng-show="!xg">{{d.price |currency:'¥:'}}</span>
                        <input type="number" ng-show="xg" ng-model="d.price" >
                    </td>
                    <td>{{d.city}}</td>
                    <td>{{d.regdate | date:'yyyy-MM-dd hh:mm:ss'}}</td>
                    <td>
                        <span style="background: yellow;" ng-show="d.state=='未发货'">
                            <a href="#"ng-click="d.state='已发货'">未发货</a>
                        </span>
                        <span style="background: green;" ng-show="d.state=='已发货'">已发货</span>
                    </td>
                    <td>
                        <button style="background: yellow;" ng-click="xg=!xg">修改</button>
                        <button style="background: red;" ng-click="dele_a(d.id)">删除</button>
                    </td>
                </tr>
            </table>
            <div ng-show="pd">
                <table>
                    <tr>
                        <td>商品编号</td>
                        <td><input type="number" ng-model="add_id"/>
                            <span>{{errors.id}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td>商品名称</td>
                        <td><input type="text" ng-model="add_gname"/>
                            <span>{{errors.gname}}</span>
                        </td>
                    </tr>
                    <tr>
                        <td>用户名称</td>
                        <td><input type="text" ng-model="add_uname"/></td>
                    </tr>
                    <tr>
                        <td>电话号码</td>
                        <td><input type="text" ng-model="add_tel"/></td>
                    </tr>
                    <tr>
                        <td>商品价格</td>
                        <td><input type="text" ng-model="add_price"/></td>
                    </tr>
                    <tr>
                        <td>发货地址</td>
                        <td><input type="text" ng-model="add_city"/></td>
                    </tr>
                    <tr>
                        <td>订单日期</td>
                        <td><input type="text" ng-model="add_regdate"/></td>
                    </tr>
                </table>
                    <button style="background: green;" ng-click="add()">保存订单</button>
            </div>
        </center>
    </body>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值