混合练习

最新推荐文章于 2023-05-30 10:00:00 发布

笑颜888

最新推荐文章于 2023-05-30 10:00:00 发布

阅读量147

点赞数

本文链接：https://blog.csdn.net/wangdan209/article/details/79840075

版权

<body ng-app="myapp" ng-controller="mycon">
<input type="text" placeholder="按商品名称搜索" ng-model="sname"/>
<input type="button" value="添加商品" ng-click="isShow=!isShow"/>
<input type="button" value="批量删除订单" ng-click="alldel()"/>
<table border="1px" cellpadding="0px" cellspacing="0px">
<thead>
<tr>
<td><input type="checkbox" ng-click="allquan()"/> </td>
<td>商品名称</td>
<td>商品价格</td>
<td>购买数量</td>
<td>商品总计</td>
<td>下单时间</td>
<td>商品状态</td>
<td>商品会员</td>
<td>收获地址</td>
<td>修改状态</td>
</tr>
</thead>
<tbody>
<tr ng-repeat="x in shops|filter:{name:sname}">
<td><input type="checkbox" class="cbs" 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}}</td>
<td><button ng-show="isfa" ng-click="xiugai(x.id)">发货</button> <span ng-show="iswei">发货</span> </td>
</tr>
</tbody>
</table>

<fieldset id="" ng-show="isShow">
<legend>添加</legend>
商品名称：<input type="text" ng-model="hname" id="hname"/><span id="tip_name" class="tip"></span><br />
商品价格：<input type="text" ng-model="hprice" id="hprice"/><span id="tip_price" class="tip"></span><br />
商品数量：<input type="text" ng-model="hnumber" id="hnumber"/><span id="tip_number" class="tip"></span><br />
会员名称：<input type="text" ng-model="husername" id="husername"/><span id="tip_username" class="tip"></span><br />
收货地址：<select ng-init="select_pro=provs[0]" ng-model="select_pro" ng-options="x.pro for x in provs" ng-change="selectchangepro()"></select>
<select ng-init="select_city=select_pro.city[0]" ng-model="select_city" ng-options="y for y in select_pro.city"></select><br />
<button ng-click="queadd()">确定添加</button>

</fieldset>

<script type="text/javascript">
var app = angular.module("myapp",[]);
app.controller("mycon",function($scope,$http){
$scope.isfa=false;
$scope.iswei=false;
var isclick=false;

/*$http({
method:"GET",
url:"shuju.json"
}).then(function success(response){
$scope.shops = response.data;
},function error(response){
});
*/

$scope.shops=[{"id":"001","name":"西湖龙井","price":100.0,"number":10,"orderTime":"1522412543225","status":"未发货","username":"飞过风潇雨霁","address":"河南-驻马店"},
{"id":"002","name":"中国茗茶","price":50.0,"number":10,"orderTime":"1522412543125","status":"已发货","username":"飞过风潇雨霁","address":"河南-驻马店"},
{"id":"003","name":"安吉白茶","price":200.0,"number":10,"orderTime":"1522412544225","status":"未发货","username":"飞过风潇雨霁","address":"河南-驻马店"},
{"id":"004","name":"云南普洱","price":200.0,"number":2,"orderTime":"1522412546225","status":"已发货","username":"飞过风潇雨霁","address":"河南-驻马店"}];

for (var i = 0; i < $scope.shops.length; i++) {
//alert($scope.shops[i].status);
if($scope.shops[i].status=="未发货"){
$scope.isfa=true;
break;
}else{
$scope.iswei=true;
break;
}
}
//修改
$scope.xiugai = function(sid){
for (var i = 0; i < $scope.shops.length; i++) {
if($scope.shops[i].id==sid){
//$("span").html("发货");
$scope.shops[i].status="已发货";
}
}
}

//全选
$scope.allquan = function(){

if(!isclick){
for (var i = 0; i < $scope.shops.length; i++) {
if($scope.shops[i].status=="已发货"){
$(".cbs").attr("checked",true);

}else{
$(".cbs").attr("checked",false);

}

}
$(".cbs").attr("checked",true);
isclick=true;
}else{
$(".cbs").attr("checked",false);
isclick=false;
}

}
//批量删除
$scope.alldel = function(){
var cbs = $(".cbs:checked");
//alert(cbs.length);
for (var i = 0; i < cbs.length; i++) {
var gname = cbs[i].value;
//alert(gname);
for (var j = 0; j < $scope.shops.length; j++) {
if($scope.shops[j].name==gname){
$scope.shops.splice(j,1);
break;
}
}
}
}

//二级联动
$scope.provs=[{pro:"北京",city:["东城","西城","西二城"]},
{pro:"河南",city:["郑州","洛阳","驻马店"]}];

$scope.selectchangepro = function(){
$scope.select_city=$scope.select_pro.city[0];

}

//添加
$scope.queadd = function(){
$(".tip").html("");
var gname = $("#hname").val();
var gprice = $("#hprice").val();
var gnumber = $("#hnumber").val();
var gusername = $("#husername").val();
var s = $scope.select_pro.pro;
var c = $scope.select_city;

if(gname==""){
$("#tip_name").html("*商品名称不能为空");
return;
}
if(gprice<0){
$("#tip_price").html("*必须为数字且不能小于0");
return;
}
if(gnumber<0){
$("#tip_number").html("*必须为数字且不能小于0");
return;
}
if(gusername==""){
$("#tip_username").html("**会员名称不能为空");
return;
}

var newobj={};
newobj.name=gname;
newobj.price=parseInt(gprice);
newobj.number=parseInt(gnumber);
newobj.username=gusername;
newobj.address = s+"-"+c;
newobj.orderTime=12314434;
newobj.status ="已发货";
$scope.shops.push(newobj);
//alert(s+c);
}

});
</script>

</body>