批量发货

最新推荐文章于 2021-04-26 07:35:01 发布
转载最新推荐文章于 2021-04-26 07:35:01 发布 · 208 阅读
0 ·
CC 4.0 BY-SA版权
原文链接：http://www.cnblogs.com/wsq110/p/7731994.html
文章标签：
#java #javascript #ViewUI
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="js/angular.min.js"></script>
    <style>
        table{
            border-collapse: collapse;
        }
        th,td{
            border: 1px solid #000000;
        }
        ul li{
            color: red;
        }
    </style>
    <script>
        var myapp=angular.module("myapp",[]);
        myapp.controller("myCtrl",function ($scope) {
            $scope.data=[{
            check:false,
                name:"iPhone4",
                names:"张三",
                phop:12321411,
                price:4999,
                addr:"北京",
                xiad:"08-01 10:00",
                zt:"发货"
            },{
                check:false,
                name:"小米6",
                names:"李四",
                phop:56478130366,
                price:2999,
                addr:"北京",
                xiad:"08-02 10:00",
                zt:"发货"
            },{
                check:false,
                name:"华为P9",
                names:"王五",
                phop:68764313,
                price:3999,
                addr:"上海",
                xiad:"09-04 10:00",
                zt:"已发货"
            },{
                check:false,
                name:"OPPO R11",
                names:"赵六",
                phop:346363443,
                price:4999,
                addr:"天津",
                xiad:"09-04 10:00",
                zt:"已发货"
            },{
                check:false,
                name:"VIVO",
                names:"周七",
                phop:145674231,
                price:2999,
                addr:"重庆",
                xiad:"10-04 10:00",
                zt:"已发货"
            }];
            //根据城市查询数据
            $scope.addrsize="选择城市";
            $scope.addrcx=function (item) {
                if($scope.addrsize!="选择城市"){
                    if(item.addr==$scope.addrsize){
                        return true;
                    }else{
                        return false;
                    }
                }else{
                    return true;
                }
            };
            //根据选择状态查询数据
            $scope.ztsize="选择状态";
            $scope.ztcx=function (item) {
              if($scope.ztsize!="选择状态"){
                  if(item.zt==$scope.ztsize){
                      return true;
                  }else{
                      return false;
                  }
              }  else{
                  return true;
              }
            };

            //敏感词
                $scope.yhm="";
                $scope.yhm2="";
           $scope.$watch("yhm",function (value) {
               if(value.indexOf("枪")!=-1){
                   alert("包含敏感词");
                   $scope.yhm="";
               }else{
                   $scope.yhm2=$scope.yhm;
               }
           });
            //新增订单
           $scope.show=false;
           $scope.xzdd=function () {
               $scope.show=true;
           };

           //全选,全不选
            $scope.checkAll=false;
            $scope.qx=function () {
                if($scope.checkAll==true){
                    for(var i=0;i<$scope.data.length;i++){
                        $scope.data[i].check=true;
                    }
                }else{
                    for(var i=0;i<$scope.data.length;i++){
                        $scope.data[i].check=false;
                    }
                }
            };
            //反着选
            $scope.dx=function () {
                var n=0;
                for(var i=0;i<$scope.data.length;i++){
                    if($scope.data[i].check==true){
                       n++;
                    }
                }
                if(n==$scope.data.length){
                    $scope.checkAll=true;
                }else{
                    $scope.checkAll=false;
                }
            };
            //新增订单
            $scope.addaddr="选择城市";
            $scope.addname="";
            $scope.addnames="";
            $scope.addphop="";
            $scope.shangpin=false;
            $scope.weishus=false;
            $scope.weishu=false;
            $scope.yonghu=false;
            $scope.shouji=false;
            $scope.cs=false;
            $scope.shoujigeshi=false;
            $scope.tj=function () {
                if($scope.addname==""){
                    $scope.shangpin=true;
                }else{
                    if($scope.addname.length<6||$scope.addname.length>20){
                        $scope.shangpin=false;
                        $scope.weishu=true;
                    }else{
                        if($scope.addnames==""){
                            $scope.weishu=false;
                            $scope.yonghu=true;
                        }else{
                            if($scope.addnames.length<6||$scope.addnames.length>20){
                                $scope.yonghu=false;
                                $scope.weishus=true;
                            }else{
                                if($scope.addphop==""){
                                    $scope.weishus=false;
                                    $scope.shouji=true;
                                }else{
                                    if($scope.addphop.length!=11){
                                        $scope.shouji=false;
                                        $scope.shoujigeshi=true;
                                    }else{
                                        if($scope.addaddr=="选择城市"){
                                            $scope.shoujigeshi=false;
                                            $scope.cs=true;
                                        }else{
                                            $scope.data.push({
                                                name:$scope.addname,
                                                names:$scope.addnames,
                                                phop:$scope.addphop,
                                                price:5999,
                                                addr:$scope.addaddr,
                                                zt:"待发货"
                                            });
                                            $scope.cs=false;
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            };

            //发货
            $scope.ztgb=function (index) {
                if($scope.data[index].zt=="发货"){
                    $scope.data[index].zt="已发货";
                }
            };
            //批量发货
            $scope.plfh=function () {

                for(var i=0;i<$scope.data.length;i++){
                    if($scope.data[i].check==true){
                        if($scope.data[i].zt=="发货"){
                            $scope.data[i].zt="已发货";

                        }
                    }
                }
               /* if(a==true){
                    alert("请勾选要发货的订单!!");
                }*/
            };
            $scope.del=function () {
                for(var i=0;i<$scope.data.length;i++){
                    if($scope.data[i].check==true){
                        $scope.data.splice(i,1);
                        i--;
                    }
                }
            };
            $scope.sort=function (index) {
                $scope.sor=index;
                if($scope.sor==index){
                    $scope.serve=!$scope.serve
                }

            }
        });
    </script>
</head>
<body ng-app="myapp" ng-controller="myCtrl">
<input type="text" placeholder="用户名搜索" ng-model="yhm"><input type="text" placeholder="手机号搜索" ng-model="sjh">
<select ng-model="addrsize">
    <option>选择城市</option>
    <option>北京</option>
    <option>上海</option>
    <option>重庆</option>
    <option>天津</option>
</select>
<select ng-model="ztsize">
    <option>选择状态</option>
    <option>发货</option>
    <option>待发货</option>
    <option>已发货</option>

</select>
<select>
    <option>开始月份</option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
    <option>7</option>
    <option>8</option>
    <option>9</option>
    <option>10</option>
    <option>11</option>
    <option>12</option>
</select>-<select>
    <option>结束月份</option>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
    <option>6</option>
    <option>7</option>
    <option>8</option>
    <option>9</option>
    <option>10</option>
    <option>11</option>
    <option>12</option>
</select><br><br>
<button ng-click="xzdd()">新增订单</button>   <button ng-click="plfh()">批量发货</button>   <button ng-click="del()">批量删除</button>
<br><br>
<table>
    <thead>
    <tr>
        <th><input type="checkbox" ng-click="qx()" ng-model="checkAll">全选</th>
        <th>ID</th>
        <th>商品名</th>
        <th>用户名</th>
        <th>手机号</th>
        <th ng-click="sort('price')">价格</th>
        <th>城市</th>
        <th ng-click="sort('xiad')">下单时间</th>
        <th>状态</th>
    </tr>
    </thead>
    <tbody>
    <tr ng-repeat="item in data|filter:yhm|filter:sjh|filter:addrcx|filter:ztcx|orderBy:sor:serve">
        <td><input type="checkbox" ng-model="item.check" ng-click="dx()"></td>
        <td>{{$index+1}}</td>
        <td>{{item.name}}</td>
        <td>{{item.names}}</td>
        <td>{{item.phop}}</td>
        <td>{{item.price}}</td>
        <td>{{item.addr}}</td>
        <td>{{item.xiad}}</td>
        <td><button ng-click="ztgb($index)">{{item.zt}}</button></td>
    </tr>
    </tbody>
</table>
<br><br>
<table ng-show="show">
    <tr>
    <th colspan="2">新增订单</th>
    </tr>
    <tr>
    <td>商品名</td>
    <td><input type="text" placeholder="6-20个字符" ng-model="addname"></td>
    </tr>
    <tr>
        <td>用户名</td>
        <td><input type="text" placeholder="4-16个字符" ng-model="addnames"></td>
    </tr>
    <tr>
        <td>手机号</td>
        <td><input type="text" ng-model="addphop"></td>
    </tr>
    <tr>
        <td>城市</td>
        <td><select ng-model="addaddr">
            <option>选择城市</option>
            <option>北京</option>
            <option>上海</option>
            <option>重庆</option>
            <option>天津</option>
        </select></td>
    </tr>
    <tr>
        <td colspan="2">
            <ul>
                <li ng-show="shangpin">商品名不能为空</li>
                <li ng-show="yonghu">用户名不能为空</li>
                <li ng-show="shouji">手机号不能为空</li>
                <li ng-show="shoujigeshi">手机号格式不对</li>
                <li ng-show="weishu">必须是6到20位</li>
                <li ng-show="weishus">必须是6到20位</li>
                <li ng-show="cs">请选择城市</li>
            </ul>
        </td>
    </tr>
    <tr>
        <th colspan="2"><button ng-click="tj()">提交</button></th>
    </tr>
</table>
</body>
</html>
转载于:https://www.cnblogs.com/wsq110/p/7731994.html