<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
table tr:nth-child(odd){
background-color: antiquewhite;
}
table tr:nth-child(even){
background-color: cornsilk;
}
.tip{
color: red;
}
.add{
margin-left: 100px;
background-color: green;
}
.del{
margin-left: 200px;
background-color: red;
}
table{
margin-top: 20px;
}
</style>
</head>
<body ng-app="myapp" ng-controller="mycon">
<input type="text" ng-model="searchKey" placeholder="按商品名称查询" name="" id="" value="" />
<input type="button" class="add" value="添加商品" ng-click="isShow=!isShow" name="" id="a" value="" />
<input type="button" class="del" value="批量删除订单" ng-click="delgoods()" name="" id="" value="" />
<table border="1" cellspacing="0" cellpadding="0">
<thead>
<th><input type="checkbox" ng-model="selectall" name="" id="" value="" /></th>
<th>商品名称</th>
<th>商品价格</th>
<th>购买数量</th>
<th>商品总计</th>
<th>下单时间</th>
<th>商品状态</th>
<th>商品会员</th>
<th>收货地址</th>
<th>修改状态</th>
</thead>
<tbody>
<tr ng-repeat="x in goods|filter:searchKey">
<td><input type="checkbox" ng-checked="selectall" name="" id="" value="{{x.name}}" /></td>
<td>{{x.name}}</td>
<td>{{x.price|currency:"￥:"}}</td>
<td>{{x.number}}</td>
<td>{{x.price*x.number|currency:"￥:"}}</td>
<td>{{x.orderTime|date:"yyyy-MM-dd HH:mm:ss"}}</td>
<td>{{x.status}}</td>
<td>{{x.username}}</td>
<td>{{x.address[0]+"-"+x.address[1]}}</td>
<td><input type="button" ng-model="b" name="" id="" ng-click="addchange()" value="发货" style="background-color: aqua;" /></td>
</tr>
</tbody>
</table>
<fieldset ng-show="isShow">
<legend>添加商品</legend>
<table border="1" cellspacing="0" cellpadding="0">
<tr>
<td>商品名称:</td>
<td><input type="text" ng-model="aname" name="" id="" value="" /></td>
<td><span id="s_name" class="tip">
</span></td>
</tr>
<tr>
<td>商品价格:</td>
<td><input type="text" ng-model="aprice" name="" id="" value="" /></td>
<td><span id="s_price" class="tip">
</span></td>
</tr>
<tr>
<td>下单时间:</td>
<td><input type="date" ng-model="aorderTime" name="" id="" value="" /></td>
<td><span id="s_orderTime" class="tip">
</span></td>
</tr>
<tr>
<td>商品状态:</td>
<td><input type="number" ng-model="astatus" name="" id="" value="" /></td>
<td><span id="s_status" class="tip">
</span></td>
</tr>
<tr>
<td>商品数量:</td>
<td><input type="text" ng-model="anumber" name="" id="" value="" /></td>
<td><span id="s_number" class="tip">
</span></td>
</tr>
<tr>
<td>会员名称:</td>
<td><input type="text" ng-model="ausername" name="" id="" value="" /></td>
<td><span id="s_username" class="tip">
</span></td>
</tr>
<tr>
<td>收货地址:</td>
<td>
<select ng-init="select_maintype=filmsType[0]" ng-model="select_maintype" ng-options="x.mainType for x in filmsType"
ng-click="changeType()">
</select>
<select ng-init="select_child=select_maintype.childType[0]" ng-model="select_child" ng-options="y for y in select_maintype.childType">
</select>
</td>
</tr>
<tr align="center">
<td colspan="2"><input type="button" ng-click="addgoods()" name="" id="" value="确认添加" /></td>
</tr>
</table>
</fieldset>
<script type="text/javascript">
var app=angular.module("myapp",[]);
app.controller("mycon",function($scope){
$scope.addchange=function(){
alert("已发货");
$scope.b="已发货";
}
$scope.delgoods=function(){
var ches=$("input:checked");
for (var i = 0; i < ches.length; i++) {
var check=ches[i].value;
for (var j = 0; j <$scope.goods.length; j++) {
if($scope.goods[j].name==check){
$scope.goods.splice(j,1);
break;
}
}
}
}
$scope.filmsType=[
{"mainType":"北京","childType":["西二旗","东北旺"]},
{"mainType":"上海","childType":["浦东","哈哈","呵呵"]},
{"mainType":"黑龙江","childType":["大庆"]}];
$scope.changeType=function(){
$scope.select_child=$scope.select_maintype.childType[0];
}
$scope.addgoods=function(){
var aname=$scope.aname;
var astatus=$scope.astatus;
var aprice=$scope.aprice;
var anumber=$scope.anumber;
var aaddress=$scope.aaddress;
var ausername=$scope.ausername;
$(".tip").html("");
if(aname==null){
$("#s_name").html("*非空");
return;
}
if(aprice==null){
$("#s_price").html("*必须为数字并且大于0");
return;
}
if(anumber==null){
$("#s_number").html("*必须为数字并且大于0");
return;
}
if(ausername==null){
$("#s_username").html("*非空");
return;
}
var newdata={};
newdata.name=aname;
newdata.price=$scope.aprice;
newdata.number=$scope.anumber;
newdata.username=ausername;
newdata.address=aaddress;
newdata.orderTime=$scope.aorderTime;
newdata.status=$scope.astatus;
// 得到类型
var types=[];
types.push($scope.select_maintype.mainType);
types.push($scope.select_child);
newdata.address=types;
$scope.goods.push(newdata);
isShow=!isShow;
}
$scope.goods=[ {"id":"001","name":"西湖龙井","price":100.0,"number":10,"orderTime":"1522412543225","status":0,"username":"飞过风潇雨霁","address":"河南-驻马店"}, {"id":"002","name":"中国茗茶","price":50.0,"number":10,"orderTime":"1522412543125","status":1,"username":"飞过风潇雨霁","address":"河南-驻马店"}, {"id":"003","name":"安吉白茶","price":200.0,"number":10,"orderTime":"1522412544225","status":0,"username":"飞过风潇雨霁","address":"河南-驻马店"}, {"id":"004","name":"云南普洱","price":200.0,"number":2,"orderTime":"1522412546225","status":1,"username":"飞过风潇雨霁","address":"河南-驻马店"} ]
});
</script>
</body>
</html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
table tr:nth-child(odd){
background-color: antiquewhite;
}
table tr:nth-child(even){
background-color: cornsilk;
}
.tip{
color: red;
}
.add{
margin-left: 100px;
background-color: green;
}
.del{
margin-left: 200px;
background-color: red;
}
table{
margin-top: 20px;
}
</style>
</head>
<body ng-app="myapp" ng-controller="mycon">
<input type="text" ng-model="searchKey" placeholder="按商品名称查询" name="" id="" value="" />
<input type="button" class="add" value="添加商品" ng-click="isShow=!isShow" name="" id="a" value="" />
<input type="button" class="del" value="批量删除订单" ng-click="delgoods()" name="" id="" value="" />
<table border="1" cellspacing="0" cellpadding="0">
<thead>
<th><input type="checkbox" ng-model="selectall" name="" id="" value="" /></th>
<th>商品名称</th>
<th>商品价格</th>
<th>购买数量</th>
<th>商品总计</th>
<th>下单时间</th>
<th>商品状态</th>
<th>商品会员</th>
<th>收货地址</th>
<th>修改状态</th>
</thead>
<tbody>
<tr ng-repeat="x in goods|filter:searchKey">
<td><input type="checkbox" ng-checked="selectall" name="" id="" value="{{x.name}}" /></td>
<td>{{x.name}}</td>
<td>{{x.price|currency:"￥:"}}</td>
<td>{{x.number}}</td>
<td>{{x.price*x.number|currency:"￥:"}}</td>
<td>{{x.orderTime|date:"yyyy-MM-dd HH:mm:ss"}}</td>
<td>{{x.status}}</td>
<td>{{x.username}}</td>
<td>{{x.address[0]+"-"+x.address[1]}}</td>
<td><input type="button" ng-model="b" name="" id="" ng-click="addchange()" value="发货" style="background-color: aqua;" /></td>
</tr>
</tbody>
</table>
<fieldset ng-show="isShow">
<legend>添加商品</legend>
<table border="1" cellspacing="0" cellpadding="0">
<tr>
<td>商品名称:</td>
<td><input type="text" ng-model="aname" name="" id="" value="" /></td>
<td><span id="s_name" class="tip">
</span></td>
</tr>
<tr>
<td>商品价格:</td>
<td><input type="text" ng-model="aprice" name="" id="" value="" /></td>
<td><span id="s_price" class="tip">
</span></td>
</tr>
<tr>
<td>下单时间:</td>
<td><input type="date" ng-model="aorderTime" name="" id="" value="" /></td>
<td><span id="s_orderTime" class="tip">
</span></td>
</tr>
<tr>
<td>商品状态:</td>
<td><input type="number" ng-model="astatus" name="" id="" value="" /></td>
<td><span id="s_status" class="tip">
</span></td>
</tr>
<tr>
<td>商品数量:</td>
<td><input type="text" ng-model="anumber" name="" id="" value="" /></td>
<td><span id="s_number" class="tip">
</span></td>
</tr>
<tr>
<td>会员名称:</td>
<td><input type="text" ng-model="ausername" name="" id="" value="" /></td>
<td><span id="s_username" class="tip">
</span></td>
</tr>
<tr>
<td>收货地址:</td>
<td>
<select ng-init="select_maintype=filmsType[0]" ng-model="select_maintype" ng-options="x.mainType for x in filmsType"
ng-click="changeType()">
</select>
<select ng-init="select_child=select_maintype.childType[0]" ng-model="select_child" ng-options="y for y in select_maintype.childType">
</select>
</td>
</tr>
<tr align="center">
<td colspan="2"><input type="button" ng-click="addgoods()" name="" id="" value="确认添加" /></td>
</tr>
</table>
</fieldset>
<script type="text/javascript">
var app=angular.module("myapp",[]);
app.controller("mycon",function($scope){
$scope.addchange=function(){
alert("已发货");
$scope.b="已发货";
}
$scope.delgoods=function(){
var ches=$("input:checked");
for (var i = 0; i < ches.length; i++) {
var check=ches[i].value;
for (var j = 0; j <$scope.goods.length; j++) {
if($scope.goods[j].name==check){
$scope.goods.splice(j,1);
break;
}
}
}
}
$scope.filmsType=[
{"mainType":"北京","childType":["西二旗","东北旺"]},
{"mainType":"上海","childType":["浦东","哈哈","呵呵"]},
{"mainType":"黑龙江","childType":["大庆"]}];
$scope.changeType=function(){
$scope.select_child=$scope.select_maintype.childType[0];
}
$scope.addgoods=function(){
var aname=$scope.aname;
var astatus=$scope.astatus;
var aprice=$scope.aprice;
var anumber=$scope.anumber;
var aaddress=$scope.aaddress;
var ausername=$scope.ausername;
$(".tip").html("");
if(aname==null){
$("#s_name").html("*非空");
return;
}
if(aprice==null){
$("#s_price").html("*必须为数字并且大于0");
return;
}
if(anumber==null){
$("#s_number").html("*必须为数字并且大于0");
return;
}
if(ausername==null){
$("#s_username").html("*非空");
return;
}
var newdata={};
newdata.name=aname;
newdata.price=$scope.aprice;
newdata.number=$scope.anumber;
newdata.username=ausername;
newdata.address=aaddress;
newdata.orderTime=$scope.aorderTime;
newdata.status=$scope.astatus;
// 得到类型
var types=[];
types.push($scope.select_maintype.mainType);
types.push($scope.select_child);
newdata.address=types;
$scope.goods.push(newdata);
isShow=!isShow;
}
$scope.goods=[ {"id":"001","name":"西湖龙井","price":100.0,"number":10,"orderTime":"1522412543225","status":0,"username":"飞过风潇雨霁","address":"河南-驻马店"}, {"id":"002","name":"中国茗茶","price":50.0,"number":10,"orderTime":"1522412543125","status":1,"username":"飞过风潇雨霁","address":"河南-驻马店"}, {"id":"003","name":"安吉白茶","price":200.0,"number":10,"orderTime":"1522412544225","status":0,"username":"飞过风潇雨霁","address":"河南-驻马店"}, {"id":"004","name":"云南普洱","price":200.0,"number":2,"orderTime":"1522412546225","status":1,"username":"飞过风潇雨霁","address":"河南-驻马店"} ]
});
</script>
</body>
</html>
2130
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
