快递单子

来源：互联网发布：淘宝商品图片编辑：程序博客网时间：2024/04/25 22:19
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><script type="text/javascript" src="../AngularJS/angular.js" ></script><script type="text/javascript" src="../AngularJS/angular-route.js" ></script><script>var app = angular.module("myApp",['ngRoute']);//配置路由app.config(["$routeProvider",function($routeProvider){$routeProvider.when("/",{}).when("/addOrder",{controller:"addOrderCtrl",templateUrl:"addOrder.html"}).otherwise({redirectTo:"/addOrder"});}]);app.controller("myCtrl",function($scope,$location){//数据源$scope.orders = [{id:1,goodName:"iPone4",userName:"张三",num:15555555555555,price:4999.00,city:"北京",time:"08-01 10:00",state:"发货"},{id:2,goodName:"小米6",userName:"李四",num:155666666666666,price:2999.00,city:"上海",time:"09-01 10:00",state:"已发货"},{id:3,goodName:"华为P9",userName:"王五",num:15577777777777,price:3999.00,city:"天津",time:"10-01 10:00",state:"已收货"},{id:4,goodName:"OPPO R11",userName:"赵六",num:155888888888,price:4999.00,city:"重庆",time:"11-11 10:00",state:"发货"}];//定义跳转方法$scope.goToPath = function(){$location.path("/addOrder");}$scope.startTime = "开始月份";$scope.endTime = "结束月份";//过滤时间$scope.filterTime = function(index){//获得开始和结束月份//获取当前订单的时间月份var time = $scope.orders[index].time;var month = parseInt(time.split("-")[0]);if($scope.startTime == "开始月份" || $scope.endTime == "结束月份"){return true;}else{var start = parseInt($scope.startTime);var end = parseInt($scope.endTime);if(month >=start && month<=end ){return true;}else{return false;}}}//更改状态$scope.changeState = function(index){$scope.orders[index].state = "已发货";}});//添加订单控制器app.controller("addOrderCtrl",function($scope){$scope.goodName = "";$scope.userName = "";$scope.num = "";$scope.city = "选择城市";$scope.li1 = false; $scope.li2 = false; $scope.li3 = false; $scope.li4 = false; $scope.li5 = false; $scope.li6 = false; $scope.li7 = false; $scope.sub = function(){//判断商品名是否为空if($scope.goodName == null || $scope.goodName == ""){$scope.li1 = true;}else{$scope.li1 = false;//判断商品名是否符合格式if($scope.goodName.length <= 6 || $scope.goodName.length >= 20){alert("asf")$scope.li2 = true; }else{$scope.li2 = false;}}//判断用户名是否为空if($scope.userName == null || $scope.userName == ""){$scope.li3 = true;}else{$scope.li3 = false;//判断用户名是否符合格式if($scope.userName.length <= 4 || $scope.userName.length >= 16){$scope.li4 = true; }else{$scope.li4 = false;}}//判断手机号是否为空if($scope.num == null || $scope.num == ""){$scope.li5 = true;}else{$scope.li5 = false;//判断手机号是否符合格式alert($scope.num.length);if($scope.num.length == 11){if(isNaN($scope.num)){$scope.li6 = true;}else{$scope.li6 = false;}}else{$scope.li6 = true; }}//判断手机号是否符合格式if($scope.city == "选择城市"){$scope.li7 = true; }else{$scope.li7 = false;}if(!$scope.li1 && !$scope.li2 && !$scope.li3 && !$scope.li4 && !$scope.li5 && !$scope.li6 && !$scope.li7){//全显示，格式全不正确，才能进来//获得IDvar idMax = 0;for(index in $scope.orders){if($scope.orders[index].id>idMax){idMax = $scope.orders[index].id;}}//alert("添加");var date = new Date();var month = date.getMonth()+1;var day = date.getDate();var hours = date.getHours();var minute = date.getMinutes();var myTime = month+"-"+day+" "+hours+":"+minute;var order = {id:idMax+1,goodName:$scope.goodName,userName:$scope.userName,num:$scope.num,price:2999.00,city:$scope.city,time:myTime,state:"发货"};//将订单添加到数据源$scope.orders.push(order);}else{//}}});</script></head><body ng-app="myApp" ng-controller="myCtrl"><center><h3>订单页面</h3><input  type="text" placeholder="用户名搜索" size="8" /><input  type="text" placeholder="手机号搜索" size="8" /><select><option>选择城市</option><option>北京</option><option>上海</option><option>天津</option><option>重庆</option></select><select><option>选择状态</option><option>发货</option><option>已发货</option><option>已收货</option></select><select ng-model="startTime"><option>开始月份</option><option>01</option><option>02</option><option>03</option><option>04</option><option>05</option><option>06</option><option>07</option><option>08</option><option>09</option><option>10</option><option>11</option><option>12</option></select>-<select ng-model="endTime"><option>结束月份</option><option>01</option><option>02</option><option>03</option><option>04</option><option>05</option><option>06</option><option>07</option><option>08</option><option>09</option><option>10</option><option>11</option><option>12</option></select><br /><br /><button ng-click="goToPath()">新增订单</button><button>批量发货</button><br /><br /><table border="1 solid blue" cellpadding="10" cellspacing="0"><thead><tr><th><input type="checkbox" /> </th><th>ID　排序</th><th>商品名</th><th>用户名</th><th>手机号</th><th>价格　排序</th><th>城市</th><th>下单时间　排序</th><th>状态</th></tr></thead><tbody><tr ng-repeat="order in orders" ng-if="filterTime($index)"><td><input type="checkbox" /> </td><td>{{order.id}}</td><td>{{order.goodName}}</td><td>{{order.userName}}</td><td>{{order.num}}</td><td>{{order.price}}</td><td>{{order.city}}</td><td>{{order.time}}</td><td><span ng-if="order.state == '发货'"><a ng-click="changeState($index)" href="#">{{order.state}}</a></span><span ng-if="order.state == '已发货'">{{order.state}}</span><span ng-if="order.state == '已收货'">{{order.state}}</span></td></tr></tbody></table></center><!-- 添加定点页面 --><script type="text/ng-template" id="addOrder.html"><center><h3>新增订单</h3>商品名：<input type="text" ng-model="goodName" placeholder="6-20个字符"/><br /><br />用户名：<input type="text" ng-model="userName" placeholder="4-16个字符"/><br /><br />手机号：<input type="text" ng-model="num" placeholder="4-16个字符"/><br /><br />城市：<select ng-model="city"><option>选择城市</option><option>北京</option><option>上海</option><option>天津</option><option>重庆</option></select><br /><ul><li ng-show="li1">商品不能为空</li><li ng-show="li2">商品名必须是6-20个字符</li><li ng-show="li3">用户名不能为空</li><li ng-show="li4">用户名必须是4-16个字符</li><li ng-show="li5">手机号不能为空</li><li ng-show="li6">手机号格式不正确</li><li ng-show="li7">请选择城市</li></ul><input ng-click="sub()" type="button" value="提交"/><br /></center></script><div ng-view></div></body></html>
阅读全文
0 0