商品采购系统(js+jq)

题目:采购系统

一、语言和环境

A 实现语言

  JavaScript/Jquery + HTML

二、要求

通过提供给的js对象数组,该数组内的信息是商品的库存信息。

var goods= [

{"goodid":"1000100","goodname":"水杯","goodprice":50,"goodstore":100,"goodtype":"日用品"},

{"goodid":"1000101","goodname":"毛巾","goodprice":10,"goodstore":10,"goodtype":"日用品"},

{"goodid":"1000102","goodname":"牙膏","goodprice":10,"goodstore":100,"goodtype":"日用品"},

{"goodid":"1000103","goodname":"耳机","goodprice":100,"goodstore":10,"goodtype":"电子产品"},

{"goodid":"1000104","goodname":"手机","goodprice":5000,"goodstore":100,"goodtype":"电子产品"},

{"goodid":"1000105","goodname":"笔记本电脑","goodprice":5000,"goodstore":10,"goodtype":"电子产品"},

{"goodid":"1000106","goodname":"鼠标","goodprice":50,"goodstore":10,"goodtype":"电子产品"}

]

实现一个采购申请功能,包含商品库存列表的展示,加入到采购单,合计,小计,从采购单中移除,商品数量、商品进价的校验,如下:

1:打开采购申请,列出商品库存信息。

商品采购系统(js+jq)

       前端 样式自写!!!

  for (var i = 0; i < goods.length; i++) {
                let onegod = goods[i]
                let trs = "";
                trs += "<td class='name'>" + onegod.goodid + "</td>"
                trs += "<td>" + onegod.goodname + "</td>"
                trs += "<td>" + onegod.goodprice + "</td>"
                trs += "<td>" + onegod.goodtype + "</td>"
                trs += "<td>" + onegod.goodstore + "</td>"
                trs += "<td><input type='button' value='添加到购物车' οnclick='tianjia(this)'></td>"
                var tr = document.createElement("tr");
                tr.innerHTML = trs
                ac.appendChild(tr)
            }

2. 点击 “添加到采购”按钮,会在采购详情中添加一行,添加的时候会显示会相对应的小计:

商品采购系统(js+jq)

 3.点击不同的商品,会在购物车中添加不同的商品,点击相同的商品会在原来的基础上数量加1,小计合计同步更改:

商品采购系统(js+jq)

function tianjia(obj) {
                var num = 1
                let number;
                let a = document.getElementsByClassName("gname");
                if (ab.children.length == 0) {
                    var str = ""
                    str += "<td class='gname'>" + obj.parentNode.parentNode.children[0].innerText + "</td>"
                    str += "<td>" + obj.parentNode.parentNode.children[1].innerText + "</td>"
                    str += "<td><input type=text></td>"
                    str += "<td><input type='text' class='jin' value='" + Number(obj.parentNode.parentNode.children[2]
                        .innerText) * 0.7 + "'></td>"
                    str += "<td><input type='number' class='shu' value='" + num + "'></td>"
                    str += "<td>" + Number(obj.parentNode.parentNode.children[2].innerText) * 0.7 * num + "</td>"
                    str += "<td><input type='button' value='删除' οnclick='del(this)'></td>"
                    var tr = document.createElement("tr")
                    tr.innerHTML = str
                    ab.appendChild(tr)
                    --obj.parentNode.parentNode.children[4].innerText
                } else {

                    var flag = false;
                    for (var i = 0; i < a.length; i++) {
                        if (obj.parentNode.parentNode.children[0].innerText == a[i].innerText) {
                            flag = true
                            number = i
                            break
                        }
                    }

                    if (flag == true) {
                        if (obj.parentNode.parentNode.children[4].innerText >0) {
                                obj.parentNode.parentNode.children[4].innerText--
                            a[number].parentNode.children[4].children[0].value++
                            a[number].parentNode.children[5].innerText = a[number].parentNode.children[4].children[0].value * a[
                                number].parentNode.children[3].children[0].value
                        }else{
                            obj.parentNode.parentNode.children[4].innerText=0
                            alert("不能再减了")
                        }

                    } else {

                        var str = ""
                        str += "<td class='gname'>" + obj.parentNode.parentNode.children[0].innerText + "</td>"
                        str += "<td>" + obj.parentNode.parentNode.children[1].innerText + "</td>"
                        str += "<td><input type=text></td>"
                        str += "<td><input type='text' class='jin' value='" + Number(obj.parentNode.parentNode.children[2]
                            .innerText) * 0.7 + "'></td>"
                        str += "<td><input type='number' class='shu' value='" + num + "'></td>"
                        str += "<td>" + Number(obj.parentNode.parentNode.children[2].innerText) * 0.7 * num + "</td>"
                        str += "<td><input type='button' value='删除' οnclick='del(this)'></td>"
                        var tr = document.createElement("tr")
                        tr.innerHTML = str
                        ab.appendChild(tr)
                        --obj.parentNode.parentNode.children[4].innerText
                    }
                }
                jisuan()
            }

 4. 如果录入的数字<0或者非数字给与一定的提示

商品采购系统(js+jq)

 

 5.录入进价>售价,进价太高不可用

    function butprice(obj) {
                let goods = $(".goodsnames")
                let price00 = $(".price0")
                let a = 0;
                for (var i = 0; i < goods.length; i++) {
                    if (goods[i].innerText == obj.parentNode.parentNode.children[1].innerText) {
                        a = price00[i].innerText;
                        // alert(a)
                    }
                }
                if (obj.value > a) {
                    alert("进价太高")
                } else {
                    obj.parentNode.parentNode.children[5].innerText = obj.parentNode.parentNode.children[3].children[0].value *
                        obj.parentNode.parentNode.children[4].children[0].value;
                }
                total();
            }

6. 点击采购详情中的删除按钮,删除当前行之前会进行提示,确认删除当前行的时候删除当前行

    function delall(obj) {
                let delcon = confirm("确定?")
                if (delcon) {

                    obj.parentNode.parentNode.remove()
                }
                total();
            }
         

7.确定删除后删除当前,并重新计算合计:

商品采购系统(js+jq)

 function total(){
                let alltoprice = $(".totalprice")
                let num = 0;
                for (var i = 0; i < alltoprice.length; i++) {
                    num += Number(alltoprice[i].innerText)
                }
                alert(num)
                $("#heji").text(num)
            }

上一篇:【学习笔记】权值线段树&线段树合并&线段树分裂


下一篇:Scrapy爬取色花堂磁力和图片