商品库存管理

<!DOCTYPE html>
<html>


<head>
<meta charset="UTF-8">
<title></title>
<style>
table tr:nth-child(odd){background-color:azure;}
table tr:nth-child(even){background-color:antiquewhite;}
</style>
<script type="text/javascript" src="../angular/angular.js"></script>
<script>
var date1=new Date("2017-12-22 10:10:10");
var app=angular.module("myApp",[]);
app.controller("myCon",function($scope){
//创建数据
$scope.goods=[{
name:"云南白药",
num:100,
chandi:"云南",
price:19.9,
dates:"2017-11-20 09:32:21"
},{
name:"999感冒灵",
num:30,
chandi:"北京",
price:12.5,
dates:"2017-11-20 10:32:21"
},{
name:"感康",
num:20,
chandi:"河北",
price:16.6,
dates:"2017-11-20 11:32:21"
}];


//输入关键字搜索
$scope.$watch("selecter",function(value){
$scope.search=$scope.selecter;
});

//删除
// $scope.del=function(delName){
// alert("是否确定删除");
// for(index in $scope.goods){
// //判断删除的数据是否是表中的数据
// if(delName==$scope.goods[index].name){
// $scope.goods.splice(index,1);
// }else{
//
// }
// }
// }

$scope.del=function(name){
var arr=[];
if(window.confirm("确定要删除吗")){
for(index in $scope.goods){
if(name==$scope.goods[index].name){
arr.push(name);
}
}
for(index1 in arr){
var name=arr[index1];
for(index2 in $scope.goods){
if(name==$scope.goods[index2].name){
$scope.goods.splice(index2,1);
alert("删除成功");
}
}
}
}
}

$scope.upDate=function(price){
for(index in $scope.goods){
if(price==$scope.goods[index].price){
var result=parseInt(window.prompt("请输入要修改的价格",price));
if(result<0){
alert("输入有误");
}else{
if(window.confirm("确定将"+$scope.goods[index].price+"改为"+result)){
$scope.goods[index].price=result;
}
}
}else{

}
}
}

$scope.ifShow=false;
$scope.addShow=function(){
if($scope.ifShow){
$scope.ifShow=false;
}else{
$scope.ifShow=true;
}
}
$scope.addName="";
$scope.addNum="";
$scope.addRess="";
$scope.addPrice="";
$scope.addClick=function(){
var newGoods={
name:$scope.addName,
num:parseInt($scope.addNum),
chandi:$scope.addRess,
price:$scope.addPrice,
dates:new Date()
};
$scope.goods.push(newGoods);
}

$scope.selector="";
});
</script>
</head>


<body ng-app="myApp" ng-controller="myCon">
<center>
<h4>商品库存管理系统</h4><br /><br />
<form>
<input ng-model="selecter" type="text" placeholder="输入关键字搜索..." />
<select style="margin-left: 150px;" ng-model="selector">
<option value="">--请选择--</option>
<option value="num">按货物数量正序排序</option>
<option value="-num">按货物数量逆序排序</option>
<option value="dates">按货物时间正序排序</option>
<option value="-dates">按货物时间逆序排序</option>
</select>
<button style="background-color: aquamarine; margin-left: 40px;" ng-click="addShow()">入库</button>
</form><br />
<table border="1px solid" cellpadding="10" cellspacing="0">
<thead>
<tr>
<th>货物名称</th>
<th>货物数量</th>
<th>货物产地</th>
<th>货物单价</th>
<th>货物入库日期</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="good in goods | filter:search | orderBy:-num | orderBy:selector">
<td>{{good.name}}</td>
<td>{{good.num}}</td>
<td>{{good.chandi}}</td>
<td>{{good.price | currency:"¥:"}}</td>
<td>{{good.dates | date:"yyyy-MM-dd hh:mm:ss"}}</td>
<td><button ng-click="del(good.name)">删除</button></td>
</tr>
</tbody>
</table><br /><br />
<div style="width: 300px;" ng-show="ifShow">
<h4>入库操作</h4>
商品名称:<input type="text" placeholder="输入商品名称" ng-model="addName"/><br />
商品数量:<input type="text" placeholder="输入商品数量" ng-model="addNum"/><br />
商品产地:<input type="text" placeholder="输入商品产地" ng-model="addRess"/><br />
商品单价:<input type="text" placeholder="输入商品单价" ng-model="addPrice"/><br />
<input type="button" value="添加" ng-click="addClick()"/>
</div>
</center>
</body>
</html>

猜你喜欢

转载自blog.csdn.net/qq_40056429/article/details/78845976
今日推荐