发货

<!DOCTYPE html>
<html>

    <head>
        <meta charset="utf-8" />
        <title></title>
        <style>
            body tr:nth-child(even) {
                background-color: lightgray;
            }
            
            body tr:nth-child(odd) {
                background-color: lightsteelblue;
            }
        </style>
        <script type="text/javascript" src="js/angularjs-1.55/angular.js"></script>
        <script>
            //拿去数据
            angular.module("tian", [])
                .controller("ctrl", function($scope, $http) {
                    $http.get("http://result.eolinker.com/lKgJQ8Zec38423e5603b8e055d1193a8127c0c060bb1b55?uri=goodstest")
                        .success(function(dates) {
                            $scope.dates = dates;
                        })
                    //全选        
                    $scope.qx = function() {
                        for(var i = 0; i < $scope.dates.length; i++) {
                            if($scope.dates[i].ck = true) {
                                $scope.dates[i].ck = $scope.qx1;
                            }
                        }
                    }
                    //批量删除
                    $scope.delect = function() {
                        for(var i = 0; i < $scope.dates.length; i++) {
                            if($scope.dates[i].ck) {
                                $scope.dates.splice(i, 1);
                                i--;
                            }
                        }
                    }
                    //删除
                    $scope.del = function($index) {
                        if(confirm('确定删除?')) {
                            $scope.dates.splice($index, 1);
                            alert('删除成功');
                        }
                    }
                    //删除全部
                    $scope.alldelect = function(){
                        $scope.dates.length = 0;
                    }
                    
                    //添加
                    $scope.save = function() {

                        var g1 = {
                            ck: false,
                            id: $scope.add_id,
                            gname: $scope.add_gname,
                            uname: $scope.add_uname,
                            tel: $scope.add_tel,
                            price: $scope.add_price,
                            city: $scope.add_city,
                            regdate: new Date(),
                            state: '未发货'
                        };
                        $scope.dates.push(g1)
                        $scope.f = false;
                    }
                    //修改
                    $scope.xg = function(info){
                        var aa = prompt("请修改价格",info.price);
                        if(aa!= undefined){
                            info.price=aa;
                        }
                    }

                })
        </script>
    </head>

    <body ng-app="tian" ng-controller="ctrl">
        <button ng-click="f=true" style="background: cornflowerblue;">新增订单</button>
        <button ng-click="delect()" style="background: cornflowerblue;">批量删除</button>
        <input type="text" ng-model="name1" placeholder="根据商品名查询" />
        <input type="text" ng-model="tel1" placeholder="根据手机号名查询" />
        <input type="text" ng-model="uoname" placeholder="根据姓名查询" />
        <select ng-model="sstate">
            <option value="">选择状态</option>-
            <option>已发货</option>
            <option>未发货</option>
        </select>
        <button ng-click="alldelect()">删除全部</button>
        <table border="1px">
            <tr>
                <td> <input type="checkbox" ng-click="qx()" ng-model="qx1"></td>
                <td>id <button ng-click="px='id';x=!x" style="background: cornflowerblue;">排序</button> </td>
                <td>商品名</td>
                <td>用户名</td>
                <td>手机号</td>
                <td>价格 <button ng-click="px='price';x=!x" style="background: cornflowerblue;">排序</button></td>
                <td>城市</td>
                <td>下单时间<button ng-click="px='udate';x=!x" style="background: cornflowerblue;">排序</button>
                </td>
                <td>状态</td>
                <td>操作</td>
            </tr>

            <tr ng-repeat="d in dates | filter:{gname:name1,tel:tel1,state:sstate,uname:uoname} | orderBy:px:x">
                <td> <input type="checkbox" ng-model="d.ck"></td>
                <td>{{d.id}}</td>
                <td>{{d.gname}}</td>
                <td>{{d.uname}}</td>
                <td>{{d.tel}}</td>
                <td>{{d.price |currency:'¥:'}} <!--<input type="text" ng-show="f1" ng-model="d.price" /> <button ng-show="f1" ng-click="f1=false">保存</button>--> </td>
                <td>{{d.city}}</td>
                <td>{{d.regdate |date:'MM-dd hh:mm:ss'}}</td>
                <td>
                    <span style="background-color: red;" ng-if="d.state=='未发货'">
                            
                        <a href="#" ng-click="d.state='已发货'">{{d.state}} </a>    
                        </span>
                    <span style="background-color: green;" ng-if="d.state=='已发货'">
                            已发货
                        </span>
                </td>
                <td> <button ng-click="del($index)">删除</button> <button ng-click="xg(d)">修改</button></td>
            </tr>
        </table>
        <div ng-show="f" id="container">
            <h1>新增订单</h1> I  D
            <input ng-model="add_id" placeholder="请输入id" /><br /> 商品名
            <input ng-model="add_gname" placeholder="请输入商品名" /><br /> 用户名
            <input ng-model="add_uname" placeholder="请输入用户名" /><br /> 手机号
            <input ng-model="add_tel" placeholder="请输入电话" type="tel" /><br /> 价 格
            <input ng-model="add_price" placeholder="请输入价格" type="number" /><br /> 城 市
            <select ng-model="add_city">
                <option value="">请输入城市</option>
                <option>北京</option>
                <option>上海</option>
                <option>郑州</option>
            </select><br />
            <button ng-click="save()">保存</button>
        </div>

    </body>

</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯智能台灯

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值