上个

来源：互联网发布：用友好会计软件编辑：程序博客网时间：2024/04/30 00:29

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title></title>
       <script src="js/angular.min.js"></script>
       <script src="js/jquery-1.11.1.js"></script>
       <style>
           table tr:nth-child(2n){
               background: silver;
           }

       </style>
       <script>
           var myapp=angular.module("srz",[]);
           myapp.controller("demoC",["$scope",function($scope){

               $scope.ss=[
               {

                   id:2001,
                   sj:"iPhoneX",
                   name:"张三",
                   sjh:"13525565588",
                   jg:8699,
                   cs:"北京",
                   rq:new Date("11-23 10:00:00"),
                   fh:false

               },
               {

                   id:3006,
                   sj:"iPhone6",
                   name:"王红",
                   sjh:"18524565588",
                   jg:5635,
                   cs:"郑州",
                   rq:new Date("11-23 11:38:20"),
                   fh:false

               },
               {

                   id:5312,
                   sj:"iPhone7",
                   name:"赵小龙",
                   sjh:"17545585598",
                   jg:6180,
                   cs:"北京",
                   rq:new Date("11-20 09:17:30"),
                   fh:false

               },
               {

                   id:2132,
                   sj:"iPhone9",
                   name:"赵强",
                   sjh:"1762556518",
                   jg:7190,
                   cs:"上海",
                   rq:new Date("11-23 10:40:21"),
                   fh:false

               }
               ]
               $scope.toadd=false;
               $scope.px="";
               $scope.falg=true;

               $scope.ckalll=function(){
                   for(var i in $scope.ss){
                       $scope.ss[i].state=$scope.ckall;
                   }
               }
               $scope.del=function(){
                   for(var i=0;i<$scope.ss.length;i++){
                       if($scope.ss[i].state&&$scope.ss[i].fh){
                           $scope.ss.splice(i,1);
                           i--;
                       }
                   }
               }
               $scope.add=function(){

                   var a=$scope.usj;
                   var b=$scope.uname;
                   var c=$scope.usjh;
                   var d=$scope.ujg;
                   var e=$scope.cheng;
                   $scope.f1=false;
                   $scope.f2=false;
                   $scope.f3=false;
                   $scope.f4=false;
                   $scope.f5=false;
                   if(a==""||a==undefined){
                       $(".usjSpan").text("商品型号不能为空");
                       $(".ua").css("border-color","red");

                       return;
                   }else{
                       $(".usjSpan").text("");
                       $(".ua").css("border-color","black");
                       $scope.f1=true;
                   }



                   if(b==""||b==undefined){
                       $(".unameSpan").text("用户名不能为空");
                       $(".ub").css("border-color","red");
                       return;
                   }else{
                       $(".unameSpan").text("");
                       $(".ub").css("border-color","black");
                       $scope.f2=true;
                   }




                   if(c==""||c==undefined){
                       $(".usjhSpan").text("手机号不能为空");

                       $(".uc").css("border-color","red");
                       return;
                   }else if(c.length!=11){
                       alert("手机号必须是11位");
                       return;
                   }
                   else{
                       $(".usjhSpan").text("");
                       $(".uc").css("border-color","black");
                       $scope.f3=true;
                   }




                   if(d==""||d==undefined){
                       $(".ujgSpan").text("商品价格不能为空");
                       $(".ud").css("border-color","red");
                       return;
                   }else{
                       $(".ujgSpan").text("");
                       $(".uc").css("border-color","black");
                       $scope.f4=true;
                   }
                   if(e==""||e==undefined){
                       $(".chengSpan").text("城市不能为空");
                       $(".ucheng").css("border-color","red");
                       return;
                   }else{
                       $(".chengSpan").text("");
                       $(".ucheng").css("border-color","black");
                       $scope.f5=true;
                   }



                   if($scope.f1&&$scope.f2&$scope.f3&&$scope.f4&&$scope.f5){
                   $scope.toadd=false;
                   $scope.ss.push({
                   id:2132,
                   sj:a,
                   name:b,
                   sjh:c,
                   jg:d,
                   cs:e,
                   rq:new Date("11-23 10:40:21")
                   })
                   }




               }

           }])

       </script>
   </head>
   <body ng-app="srz" ng-controller="demoC">
       <button style="background: aqua;" ng-click="toadd=true">新增订单</button>
       <button style="background: aqua;" ng-click="del()">批量删除</button>
       <input ng-model="sel" placeholder="按商品名称查询"/>
       <input ng-model="sell" placeholder="按手机号查询"/>
       <select ng-model="or">
           <option value="">--按状态查询--</option>
           <option value="false">发货</option>
           <option value="true">已发货</option>
       </select>
       <table border="1px" cellspacing="0" width="60%">
           <tr>
               <td><input type="checkbox" ng-model="ckall" ng-click="ckalll()" /></td>
               <td>id<input type="button" value="排序"style="background: aqua;" ng-click="px='id';falg =!falg" /></td>
               <td>商品名</td>
               <td>用户名</td>
               <td>手机号</td>
               <td>价格<input type="button" value="排序"style="background: aqua;" ng-click="px='jg';falg =!falg" /></td>
               <td>城市</td>
               <td>下单时间<input type="button" value="排序"style="background: aqua;" ng-click="px='rq';falg =!falg" /></td>
               <td>状态</td>
           </tr>
           <tr ng-repeat="u in ss|filter:{sj:sel}|filter:{sjh:sell}|filter:{fh:or}|orderBy: px:falg">
               <td><input type="checkbox" ng-model="u.state"/></td>
               <td>{{u.id}}</td>
               <td>{{u.sj}}</td>
               <td>{{u.name}}</td>
               <td>{{u.sjh}}</td>
               <td>{{u.jg|currency:"￥"}}</td>
               <td>{{u.cs}}</td>
               <td>{{u.rq|date:"MM-dd hh:mm:ss"}}</td>
               <td>
                   <a href="#" ng-click="u.fh=true" ng-show="!u.fh" >发货</a>
                   <span ng-show="u.fh" ng-click="u.fh=false">已发货</span>
               </td>


           </tr>
       </table>
       <form ng-show="toadd">
           商品名:<input ng-model="usj" class="ua" /><span class="usjSpan"></span><br />
           用户名:<input ng-model="uname" class="ub"/><span class="unameSpan"></span><br />
           手机号:<input ng-model="usjh" class="uc"/><span class="usjhSpan"></span><br />
           价格为:<input ng-model="ujg" class="ud"/><span class="ujgSpan"></span><br />
           城市<select ng-model="cheng" class="ucheng">
               <option value="">--请选择城市--</option>
               <option value="北京">北京</option>
               <option value="上海">上海</option>
           </select><span class="chengSpan"></span><br />
           <button ng-click="add()">保存</button>
       </form>
   </body>
</html>

阅读全文

0 0