商品采购系统（js+jq）

最新推荐文章于 2022-07-05 16:01:12 发布

菜鸟架构

最新推荐文章于 2022-07-05 16:01:12 发布

阅读量838

点赞数

分类专栏：经典案例试题文章标签： javascript jquery 前端

本文链接：https://blog.csdn.net/java103/article/details/122330125

版权

经典案例试题专栏收录该内容

3 篇文章 0 订阅

订阅专栏

题目：采购系统

一、语言和环境

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：打开采购申请，列出商品库存信息。

前端样式自写！！！

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. 点击 “添加到采购”按钮，会在采购详情中添加一行，添加的时候会显示会相对应的小计：

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

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或者非数字给与一定的提示

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

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

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

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

7.确定删除后删除当前，并重新计算合计：

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)
           }