整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
tml5实现全选按钮，及统计所选择商品的总价并输出
现有一个商品选择列表（复选框），HTML代码及效果如下：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<div>商品列表</div>
<input type="checkbox" name="item" value="3000" />笔记本电脑<br/>
<input type="checkbox" name="item" value="3000" />笔记本电脑<br/>
<input type="checkbox" name="item" value="3000" />笔记本电脑<br/>
<input type="checkbox" name="all" οnclick="checkAll(this)" />全选<br/>
<input type="button" value="总金额:" οnclick="getSum()" /><span id="sumid"></span>
</body>
</html>要求1：实现checkAll(this)函数。作用：通过选择/取消选择全选项目能够实现对所有项目的选择/取消。
提示：checked 属性规定在页面加载时应该被预先选定的 input 元素。
checked 属性 与 <input type="checkbox"> 或 <input type="radio"> 配合使用。
checked 属性也可以在页面加载后，通过 JavaScript 代码进行设置。
要求2：实现getSum()函数。作用：统计所选择商品的总价并输出在span区域。
js简单实现商品数量的选购、小计的计算以及总的价钱数、总的商品数量等一系列操作。代码如下：
题设的主体HTML代码如下：（以作事例）
反思：上述代码添加点击事件获取商品的总价钱数以及总的商品数量，可能增加了用户负担。需要改进
此时总的商品件数和商品总计会随用户的商品选择进行实时改变。
，走进报价系统的缤纷世界
1，什么是报价系统
在 “新零售”，“智能制造”，“大数据分析”等概念不断的演进下，已经广泛的应用于商业，制造等领域。本文提到的报价系统，就属于“新零售”的一个重要组成部份。以前，很多传统企业都是先做市场调研，然后量产一批商品进行售卖，由于市场调研的不准备性，容易造成库存积压。针对这样的问题，经过市场的实践，提出了一种按需生产的理论，即需要什么就生产什么。
企业若要按需生产，就会面临着更多的挑战。
例如：一个快销品公司需要一批包装盒，联系几家印刷包装厂，提出了自己包装盒的个性化需求，然要求印刷包装厂商进行报价。而这些印刷包装厂，报价时会面临如下的问题：
a，报价涉及到产品设计，采购物料，工序工艺等多个环节，等多个部门协调后再报出一个价格，时效性 跟不上。
b，多家工厂在竞争这个订单，价格因素 至关重要。
c，报价前需弄清楚产品的设计，用料，工艺，结构才能进行报价。对报价人员的专业知识要求高。
d，报价会涉及到一个产品的方方面面，当量为1个产品时误差较小，当量为10万个产品，100万个产品时，误差就会被无限放大。
e，报价人员很难跨行业，跨产品进行报价。
面临着如此多的风险与问题，稍有不慎就很难有利润和惹上法律风险。
2，报价系统适用于什么领域
a，家具行业：业主订制的家具大小，颜色，材质，工艺都不一样，销售人员通过软件报价是一件非常愉悦的事。
b，按需生产的工厂：一个制衣厂接到某网店1万件工服的订单，制衣厂能在一分钟内报出价格，从时效性来讲具有很大的竞争力。
c，高端汽车订制：如某个客户订制一台房车，动力，内饰等因素直接影响到房车的价格，如果有一款专业软件为客户报价，体现了汽车厂商的专业性。
d，印刷包装行业：印刷包装行业覆盖的知识面广，专业性强，利用报价软件可以降低专业技能门槛。
如此多的领域，行业都需要一个报价软件，我们是否可以用IT信息化来解决这一痛点呢？答案当然是肯定的！
二，分解一个产品BOM
1，如何分解一个实体
对一个产品进行报价，就不得不提产品BOM，产品BOM与生产BOM有相似性也有差异性。能否正解分解一个产品BOM，是报价的关键因素。现在以一个盒子为例进行分解：
我们可以看到这个盒子，是由5个部份组成，它们分别是 天盒，地盒，内托1，内托2，说明书组成。
2， 把实体BOM转换为产品BOM
这个产品是由5个部份组成，每一个部份我都都称之为部件，每个部件又可能由多个子部件组成。 本文以"天盒部件"为例进行说明。
天盒：包括了天盒面纸，天盒灰板两个子部件。天盒面纸，又需要不同的物料，不同的工序进行生产。就像一颗树一样，层次越深枝叶就越多。称这种结构叫BOM树，详见图列：
三，根据产品BOM进行计价
1，产品的总价
产品价格 = 天盒部件价格 + 地盒部件价格 + 内托1价格 + 内托2价格 + 说明书价格 + 装配工序费 + 包装费 + 运输费。
以这个盒子为例，这个盒子的价格，是由5个部件的价格相加成成，这儿不考虑装配，包装，运输费用等因素。
2，部件价格
要计算产品的总价，就需要计算每个部件的价格。现在以天盒为例进行部件分解：
天盒部件，包含天盒面板，天盒灰板两个子部件，这儿就涉及到部件嵌套部件了，子部件还可以嵌套孙部件，以此类推，无限嵌套。
3，部件物料（品牌规格）
“巧妇难为无米之炊”，生产一个天盒需要原纸，油墨等物料（不考虑挂件的情况）。
采购什么样的原纸呢，“理文原纸”，“玖龙原纸”，在用户没有要求品牌的情况下，必须有一个品牌的选择。原纸又采用什么克重，什么颜色的纸呢？又有一个纸张规格的选择。
油墨也是如此，品牌，规格不同，都直接决定了生产成本。
4，部件工序（生产方式选择）
1，工厂能印刷这种天盒的机器有多种，比如：胶印，UV印刷，数码印刷。选择那种机器生产，仅凭经验来决定面临着具大的风险。选择了生产机器，又对物料的上机规格有一定的约束。
2，又比如烫金：选择满版烫金，还是选择局部烫金（局部烫金的面积），那种更省钱？如此多的选择，如此多的组合，确实让报价员头痛。
从的情况来看， 生产天盒部件，不管是在物料上，还是在工序上都有相当多的选择。这些不同的选择就开有成了不同的价格组合。
理论上，只要找到最低的价格组合，报出来的价格就具有绝对的竞争优势。
5，报价组合
以一个产品为例：报一个“主盒”部件的价格，物料的选择，印刷机的选择，工序的选择，形成了N种方案可以生产这个部件，每种方案就是一个组合，并且可以看到每个组合的明细信息。
理论上只要选出最低报价组合，就是最优方案。
四，报价受外围因素的影响
1，物料拼版的影响
在生产盒子，家具，或者衣服的时候，展开尺寸一般都是不规则图形。在裁剪物料的时候，拼版算法的差异会直接影响到价格。如下图，在相同的物料面积下，左边的矩形拼版只能拼接9个产品，右边的不规则图形拼版，可以拼接12个产品。显然右边的拼版算法更省料更省钱。
2，损耗影响
生产一个产品，在工序上，物料上都会产生损耗，如何控制到最低损耗，也是降低成本的一个关键。
3，阶梯价
因为现在都是工业化的量产，受到打模成本原因等影响，数量越大，折扣率会越高。
4，包装运输的影响
对产品对行包装运输时，采用何种包装方式，何种运输方式可以节约成本，都是报价系统应该考虑的问题。这儿不详细展开描述，可以联系作者进行私下交流。
五，技术实现
1，技术栈介绍
在开发这个软件前，我想了很久，是用.net技术栈来开发，还是用java技术栈来开发。考虑到这个.net版本更新大，开发社区不完善等问题。最后我选择了java来进行开发。
现在已经过了炫技术的年龄了，我采用了比较简单而稳定的技术栈来进行，如下：
数据库：mysql
服务端：spring boot + mybatis + alibabacloud + redis 技术栈
客服端：html5 + css3 + vue.js + element ui 前端框架
2，功能演示(产品BOM维护，计算公式设定)
1，后端主要分为【物料管理】，【工序管理】，【产品分类】，【产品BOM】管理四个模块
产品BOM，是可以支持无限级配置：
每种物料，工序计价公式的定义（公式的定义：支持Javascript语法公式）
3，功能演示(报价前端)
用户只需要输入产品的尺寸，工序，参数等相关属性，报价系统即时计算出产品价格（计算时间控件在0.2秒左右）。
具体的技术实现，另开博客分享。需了解技术实现的，可联系作者（v信：xichji）
六：对报价行业有需要深入了解的，可以私信。
*请认真填写需求信息，我们会在24小时内与您取得联系。
