3

来源：互联网发布：moto 860联通网络编辑：程序博客网时间：2024/05/01 09:41

<!DOCTYPE html>
<html>
   <head>
       <meta charset="utf-8" />
       <title></title>
       <script src="lib/js/ionic.bundle.js" type="text/javascript" charset="utf-8"></script>
       <script src="js/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script>
       <script type="text/javascript">
           angular.module("jun",[])
           .controller("dd",function($scope,$filter){
               //隐藏
               $scope.isshow=false;
               //数据
               $scope.good=[{
                   "id":0,
                   "name":"云南白药",
                   "num":100,
                   "address":"云南",
                   "price":19.9,
                   "regDate":new Date('2017-11-20 09:32:21')
               },{
                   "id":1,
                   "name":"999感冒灵",
                   "num":30,
                   "address":"北京",
                   "price":12.5,
                   "regDate":new Date('2017-11-20 10:32:21')
               },{
                   "id":2,
                   "name":"感康",
                   "num":20,
                   "address":"河北",
                   "price":16.6,
                   "regDate":new Date('2017-11-20 11:11:11')
               }]

               $scope.goods=$scope.good;
               //删除
               $scope.del=function(id){
                   for(var i=0;i<$scope.goods.length;i++){
                       if($scope.goods[i].id==id){
                           $scope.goods.splice(i,1);
                           return;
                       }
                   }
               }

               $scope.ruku=function(){
                   $scope.isshow=true;
               }
               $scope.save=function(){
                   $scope.good.push({
                       "name":$scope.name,
                       "num":$scope.num,
                       "address":$scope.address,
                       "price":$scope.price,
                       "regDate":$scope.regDate
                   })
                   $scope.goods=$scope.good;
                   $scope.ishow=false;
               }
               $scope.sel=function(){
                   $scope.goods=[];
                   var $f=$filter("filter");
                   $scope.goods=$f($scope.good,{"name":val});
                   if($scope.goods.length==0){
                       $scope.goods=$f($scope.good,{"address":val})
                   }
                   $scope.goods=$f($scope.good,{"address":val,"name":val})
               }
           })
           $(function(){
               window.setInterval(function(){
                   $("tbody tr:odd").css("background-color", "red");
                   $("tbody tr:even").css("background-color", "green");
               },0);
           })
       </script>
   </head>
   <body ng-app="jun" ng-controller="dd">
       <input ng-model="selname" ng-change="sel()"/>
       <select ng-model="selectOrder">
           <option value="">-----请选择------</option>
           <option value="num">根据数量升序排列</option>
           <option value="-num">根据数量降序排列</option>
           <option value="regDate">根据日期升序排列</option>
           <option value="-regDate">根据日期降序排列</option>
       </select>
       <button ng-click="ruku()">入库</button>
       <table border="1px" cellspacing="1px" cellpadding="1px">
           <tr>
               <th>
                   货物名称
               </th>
               <th>
                   货物数量
               </th>
               <th>
                   货物产地
               </th>
               <th>
                   货物单价
               </th>
               <th>
                   货物入库日期
               </th>
               <th>
                   操作
               </th>
           </tr>
           <tr ng-repeat="good in goods|orderBy:selectOrder">
               <td>
                   {{good.name}}
               </td>
               <td>
                   {{good.num}}
               </td>
               <td>
                   {{good.address}}
               </td>
               <td>
                   {{good.price|currency:"￥："}}
               </td>
               <td>
                   {{good.regDate|date:"yyyy年MM月dd日 hh时mm分ss秒"}}
               </td>
               <td>
                   <button ng-click="del(good.id)">删除</button>
               </td>
           </tr>
       </table>
       <form action="" method="post" ng-show="isshow">
           货物名称：
           <input ng-model="name"/>
           货物数量:
           <input ng-model="num" type="number"/>
           货物产地
           <input ng-model="address"/>
           货物单价：
           <input ng-model="price" type="number"/>
           货物入库日期
           <input ng-model="regDate" type="date"/>
           <input type="button" value="保存" ng-click="save()"/>
       </form>
   </body>
</html>