first commit
This commit is contained in:
@@ -0,0 +1,208 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 硫酸纸吊牌 -->
|
||||
<style>
|
||||
.layui-form-checkbox[lay-skin=primary] i{
|
||||
border-radius: 50px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
margin-top:3px;
|
||||
}
|
||||
.layui-form-checkbox[lay-skin=primary] span{
|
||||
color:black;
|
||||
margin-top:3px;
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">硫酸纸吊牌</h1>
|
||||
<span style="color: red; font-weight: 700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="硫酸纸吊牌">
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size: 14px; color: red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<span style="font-size: 14px; color: red">135克硫酸纸尺寸</span>
|
||||
<input type="text" name="size" placeholder="135克硫酸纸尺寸" id="size" lay-verify="required" class="layui-input" autocomplete="off">
|
||||
<span style="font-size: 14px; color: red">350克铜版纸尺寸</span>
|
||||
<input type="text" name="size1" placeholder="350克铜版纸尺寸" id="size1" lay-verify="required" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量(套)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count">
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off"
|
||||
name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="craftQie" lay-filter="craftQie" value="直角裁切" title="直角裁切" checked>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size: 20px; color: red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use([ 'table', 'form' ], function() {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var craftQie = [$('input[name="craftQie"]:checked').val()];
|
||||
var size = $("#size").val();
|
||||
var size1 = $("#size1").val();
|
||||
var number = $("#number").val();
|
||||
var count = $("#count option:selected").text();
|
||||
if ((size.split("*")[0] < 5 || size.split("*")[1] < 5) && (size.split("*")[0] < 3 || size.split("*")[1] < 3)) {
|
||||
layer.msg("尺寸不能小于5*3 cm",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if ((size1.split("*")[0] < 5 || size1.split("*")[1] < 5) && (size1.split("*")[0] < 3 || size1.split("*")[1] < 3)) {
|
||||
layer.msg("尺寸不能小于5*3 cm",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if ((size.split("*")[0] > 9 || size.split("*")[1] > 5.4) && (size.split("*")[0] > 5.4 || size.split("*")[1] > 9)) {
|
||||
layer.msg("尺寸不能大于9*5.4 cm",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if ((size1.split("*")[0] > 9 || size1.split("*")[1] > 5.4) && (size1.split("*")[0] > 5.4 || size1.split("*")[1] > 9)) {
|
||||
layer.msg("尺寸不能大于9*5.4 cm",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset : [ '300px', '300px' ]}, function() {});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result = '硫酸纸吊牌 - ' + '135克硫酸纸尺寸' + size + 'cm - ' + '350克铜版纸尺寸' + size1 + 'cm\n' + "工艺： " + craftQie + "\n";
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "套，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "套，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
getRemark($("#proTypeValue").val(), size, count+"套", "单色", number, craftQie, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [ {
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
}, {
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
}, {
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},/* {
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
}, {
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
}, */{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
} ] ],
|
||||
done : function() {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,277 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- 挂布 -->
|
||||
<style>
|
||||
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">挂布</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select">
|
||||
<option value="半透纱幔">半透纱幔</option>
|
||||
</select>
|
||||
</div>
|
||||
<input type="hidden" name="proTypeValue" class="layui-input" value="挂布">
|
||||
<input type="hidden" id="proTypeValue" value="挂布">
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽 </span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" id="count" class="layui-input"
|
||||
lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
配件：<span
|
||||
style="font-size:14px;color:red"></span>
|
||||
</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="checkbox" name="craftys" lay-filter="switch" value="木棍（长度50厘米）" title="木棍（长度50厘米）">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="净裁" title="净裁">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="打孔" title="打孔">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="缝筒" title="缝筒">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
function getProductImage(craft) {
|
||||
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
let data = {proTypeValue: "挂布"}
|
||||
let remark = "";
|
||||
let html = "";
|
||||
if (craft != '' && craft == '定制') {
|
||||
data.craftValue = craft;
|
||||
}
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data,
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[0].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
form.on("radio(switch)", (data) => {
|
||||
getProductImage(data.elem.checked ? data.value : '');
|
||||
})
|
||||
form.on("checkbox(switch)", (data) => {
|
||||
let arr = []
|
||||
|
||||
if ($("input[name='craft']:checked").length > 1) {
|
||||
$(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg('工艺不能同时选择！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
getProductImage(data.elem.checked ? data.value : '');
|
||||
})
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
|
||||
let size = $("#size").val();
|
||||
let count = $("#count").val();
|
||||
let craftys = $("input[name='craftys']:checked").val();
|
||||
if (!size) {
|
||||
layer.msg('请输入尺寸！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!count) {
|
||||
layer.msg('请输入数量！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (size.split("*")[0] < 20 || size.split("*")[1] < 20) {
|
||||
layer.msg('挂布最小尺寸20*20cm！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (size.split("*")[0] > 150 || size.split("*")[1] > 150) {
|
||||
layer.msg('挂布宽度超过150cm需要拼接！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
}
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
let arr = [];
|
||||
let data = result.data.proList;
|
||||
let kind = $("select[name='kindValue'] option:selected").val();
|
||||
let number = $("#number").val();
|
||||
let craftys = $("input[name='craftys']:checked").val();
|
||||
$("input[name='craft']:checked").each(function () {
|
||||
if (!$(this).is("disabled")) {
|
||||
arr.push($(this).val())
|
||||
}
|
||||
})
|
||||
|
||||
let span_result = kind + ' - ' + size + ' 厘米 -(同款内容)\n' + "工艺 :" + arr.join(",") + "\n";
|
||||
if (craftys) {
|
||||
span_result += "配件:" + craftys
|
||||
span_result += "\n"
|
||||
}
|
||||
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
getRemark($("#proTypeValue").val(), size, count, kind, number, arr, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,271 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">班旗</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="班旗" />
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="ui_bq_name" id="ui_bq_name" lay-filter="ui_fb_name" class="select" lay-search>
|
||||
<option value="1">旗帜布</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米)
|
||||
</p>
|
||||
<div class="layui-form-item ui_size">
|
||||
<select name="size" id="ui_size" class="select">
|
||||
<option value="96*64">96*64</option>
|
||||
<option value="192*128">192*128</option>
|
||||
<option value="144*96">144*96</option>
|
||||
<option value="240*160">240*160</option>
|
||||
<option value="288*180">288*180</option>
|
||||
<option value="120*80">120*80</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" class="layui-input" id="count">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺 <span style="font-size:14px;color:red">旗杆长度是2.5米</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="craftShua" value="单面印刷" title="单面印刷" lay-filter="craftShua" checked="checked">
|
||||
<input type="radio" name="craftShua" value="双喷" title="双喷" lay-filter="craftShua">
|
||||
<br />
|
||||
<input type="checkbox" name="craft" value="旗杆" title="旗杆" lay-filter="craft" checked="checked">
|
||||
<input type="checkbox" name="craft" value="缝筒" title="缝筒" lay-filter="craft" checked="checked">
|
||||
<div class="layui-inline ui_feb" style="display:none">
|
||||
<select name="fb" class="select fb" lay-filter="fb">
|
||||
<option value="1" selected>左缝筒</option>
|
||||
<option value="2">右缝筒</option>
|
||||
</select>
|
||||
</div>
|
||||
<%-- <input type="checkbox" name="craft" value="手绘" title="手绘" lay-filter="craft">--%>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$(".ui_feb").show();
|
||||
$(".ui_feb select").attr("disabled", false);
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
proTypeValue : $("#proTypeValue").val(),
|
||||
kindValue : $('input[name="kindValue"]').val()
|
||||
},
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if(remark.indexOf("null") < 0){
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if(result.length == 0){
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
}else{
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
form.on('checkbox(craft)', function(data){
|
||||
var craft = [];
|
||||
$("input:checkbox[name='craft']:checked").each(function(i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if(!$(this).is(':disabled')){
|
||||
craft.push($(this).val());
|
||||
}
|
||||
});
|
||||
if(craft.indexOf("缝筒") > -1){
|
||||
$(".ui_feb").show();
|
||||
$(".ui_feb select").attr("disabled", false);
|
||||
}else{
|
||||
$(".ui_feb").hide();
|
||||
$(".ui_feb select").attr("disabled", true);
|
||||
}
|
||||
form.render();
|
||||
});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var number= $("#number").val();
|
||||
var size = $("#size").val();
|
||||
var count = $("#count").val();
|
||||
var kind = $("#kindValue option:selected").text();
|
||||
var craftShua = $("input[name='craftShua']:checked").val();
|
||||
var craft = [];
|
||||
$("input:checkbox[name='craft']:checked").each(function(i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if(!$(this).is(':disabled')){
|
||||
craft.push($(this).val());
|
||||
}
|
||||
});
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
if($("input[name='switchSize']:checked").val() == "on"){
|
||||
size = $("#ui_zdy_size").val();
|
||||
}else{
|
||||
size = $("#ui_size option:selected").val();
|
||||
}
|
||||
var bq_name = $("#ui_bq_name option:selected").text();
|
||||
if(craft != ""){
|
||||
craftShua += ',' + craft;
|
||||
}
|
||||
var span_result = '班旗 - ' + bq_name + '-' + craftShua + '-' + size +' CM (同款内容)\n';
|
||||
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "条，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "条，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,311 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- 黑卡 -->
|
||||
<style>
|
||||
.edge .layui-edge {
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.layui-form-checkbox[lay-skin=primary] i {
|
||||
border-radius: 50px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
.layui-form-checkbox[lay-skin=primary] span {
|
||||
color: black;
|
||||
margin-top: 3px;
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">黑卡</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select">
|
||||
<option value="500克带金边">500克带金边</option>
|
||||
<option value="500克带蓝边">500克带蓝边</option>
|
||||
<option value="500克带绿边">500克带绿边</option>
|
||||
<option value="500克黑卡">500克黑卡</option>
|
||||
</select>
|
||||
</div>
|
||||
<input type="hidden" name="proTypeValue" class="layui-input" value="66">
|
||||
<input type="hidden" id="proTypeValue" value="黑卡">
|
||||
<p>
|
||||
规格(CM/厘米)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kind2Value" id="kind2Value" lay-filter="kind2Value" class="select">
|
||||
<option value="0">9*5.4</option>
|
||||
</select>
|
||||
</div>
|
||||
<!-- <p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" lay-verify="required" autocomplete="off">
|
||||
</div> -->
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" id="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="craftTang" lay-filter="switch" value="双面烫金" title="双面烫金" checked>
|
||||
<input type="radio" name="craftTang" lay-filter="switch" value="双面烫金带凹凸" title="双面烫金带凹凸">
|
||||
<input type="radio" name="craftTang" lay-filter="switch" value="双面烫银" title="双面烫银">
|
||||
<input type="radio" name="craftTang" lay-filter="switch" value="双面烫银带凹凸" title="双面烫银带凹凸">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="圆角" title="圆角" lay-skin="primary">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
function getProductImage() {
|
||||
|
||||
let craft = $("input[name='craft']:checked").val();
|
||||
let craftTang = $("input[name='craftTang']:checked").val();
|
||||
let kindValue = $("select[name='kindValue'] option:checked").val();
|
||||
|
||||
$("#carousel").empty();
|
||||
let data = {proTypeValue: "黑卡"}
|
||||
let remark = "";
|
||||
let html = "";
|
||||
if (kindValue == '500克带金边' || kindValue == "500克带蓝边") {
|
||||
data.kindValue = kindValue;
|
||||
}
|
||||
if (craftTang) {
|
||||
delete data.kindValue
|
||||
data.craftValue = craftTang
|
||||
}
|
||||
if (craft) {
|
||||
delete data.kindValue
|
||||
data.craftValue = craft
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data,
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
form.on('select(kindValue)', function (data) {
|
||||
getProductImage()
|
||||
})
|
||||
form.on('radio(switch)', function (data) {
|
||||
getProductImage()
|
||||
})
|
||||
form.on('checkbox(switch)', function (data) {
|
||||
getProductImage()
|
||||
})
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var kind2Data = {
|
||||
0: "9*5.4"
|
||||
};
|
||||
var kind = $("#kindValue").val();
|
||||
var kind2 = kind2Data[$("#kind2Value").val()];
|
||||
var number = $("#number").val();
|
||||
var count = $("#count option:selected").text();
|
||||
var arr = [];
|
||||
arr.push($('input[name="craftTang"]:checked').val());
|
||||
$("input:checkbox[name='craft']:checked").each(function (i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if (!$(this).is(':disabled')) {
|
||||
arr.push($(this).val());
|
||||
}
|
||||
});
|
||||
//console.log('-----选中的值-----', arr);
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result = kind + ' - ' + kind2 + ' 厘米 -(同款内容)\n' + "工艺 :" + arr + "\n";
|
||||
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
getRemark($("#proTypeValue").val(), kind2, count, kind, number, arr, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
},/* {
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价',
|
||||
templet : function(d) {
|
||||
return Math.ceil(d.price * 0.98)
|
||||
}
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价',
|
||||
templet : function(d) {
|
||||
return Math.ceil(d.price * 0.96)
|
||||
}
|
||||
}, */{
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,332 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- 黑卡 -->
|
||||
<style>
|
||||
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">天幕</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select">
|
||||
<option value=""></option>
|
||||
<option value="银胶涤纶布">银胶涤纶布</option>
|
||||
<option value="黑胶涤纶布">黑胶涤纶布</option>
|
||||
</select>
|
||||
</div>
|
||||
<input type="hidden" name="proTypeValue" class="layui-input" value="天幕">
|
||||
<input type="hidden" id="proTypeValue" value="天幕">
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽 推荐尺寸：2.9m*3.9m、4.2m*3.9m、4.2m*4.9m</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" id="count" class="layui-input"
|
||||
lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
配件(五件套)<span
|
||||
style="font-size:14px;color:red">伸缩杆：直径2.5厘米2根 （2.4米/根）、防风绳： 4米固定8条、地钉： 8颗、D扣：（车间车在各个吊耳上面）、安装包</span>
|
||||
</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="checkbox" name="craftys" lay-filter="switch" value="直径4mm麻绳" title="直径4mm麻绳">
|
||||
<input type="checkbox" name="craftys" lay-filter="switch" value="五件套" title="五件套">
|
||||
<span id="shuliang" style="display: none">
|
||||
<input type="text" placeholder="请输入整数" name="shuliang" value="0"
|
||||
style="width: 50px;height: 20px;"><span>套</span>
|
||||
</span>
|
||||
</div>
|
||||
<p>
|
||||
印刷<span
|
||||
style="font-size:14px;color:red">印刷内容空白 工艺是模切的话 文件名要备注定制</span>
|
||||
</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="craftShua" lay-filter="switch" value="空白" title="空白" lay-skin="primary">
|
||||
<input type="radio" name="craftShua" lay-filter="switch" value="定制" title="定制" lay-skin="primary"
|
||||
checked>
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="checkbox" name="craftQie" lay-filter="switch" value="裁切" title="裁切">
|
||||
<input type="checkbox" name="craftQie" lay-filter="switch" value="模切" title="模切">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="吊耳" title="吊耳">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
function getProductImage(craft) {
|
||||
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
let data = {proTypeValue: "天幕"}
|
||||
let remark = "";
|
||||
let html = "";
|
||||
if (craft != '' && craft == '定制') {
|
||||
data.craftValue = craft;
|
||||
}
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data,
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[0].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
form.on("radio(switch)", (data) => {
|
||||
getProductImage(data.elem.checked ? data.value : '');
|
||||
})
|
||||
form.on("checkbox(switch)", (data) => {
|
||||
let arr = []
|
||||
$("input[name='craft']:checked").each(function () {
|
||||
if (!$(this).is("disabled")) {
|
||||
arr.push($(this).val())
|
||||
}
|
||||
})
|
||||
if ($("input[name='craftQie']:checked").length > 1) {
|
||||
$(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg('裁切-模切不能同时选择！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if ($("input[name='craftys']:checked").length > 1) {
|
||||
$(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg('麻绳-五件套不能同时选择！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (data.value == '五件套') {
|
||||
if (data.elem.checked) {
|
||||
$("#shuliang").show()
|
||||
} else {
|
||||
$("input[name='shuliang']").val(0)
|
||||
$("#shuliang").hide()
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
getProductImage(data.elem.checked ? data.value : '');
|
||||
})
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
|
||||
let size = $("#size").val();
|
||||
let count = $("#count").val();
|
||||
let craftys = $("input[name='craftys']:checked").val();
|
||||
let shuliang = $("input[name='shuliang']").val();
|
||||
if (craftys == '五件套' && shuliang == 0) {
|
||||
layer.msg('请输入五件套数量！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!size) {
|
||||
layer.msg('请输入尺寸！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!count) {
|
||||
layer.msg('请输入数量！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (size.split("*")[0] < 50 || size.split("*")[1] < 50) {
|
||||
layer.msg('天幕最小尺寸50*50cm！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (size.split("*")[0] > 170 || size.split("*")[1] > 170) {
|
||||
layer.msg('天幕尺寸超过170cm需要拼接！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
}
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
let arr = [];
|
||||
let data = result.data.proList;
|
||||
let kind = $("select[name='kindValue'] option:selected").val();
|
||||
let number = $("#number").val();
|
||||
let craftQie = $("input[name='craftQie']:checked").val();
|
||||
let craftShua = $("input[name='craftShua']:checked").val();
|
||||
let shuliang = $("input[name='shuliang']").val() || 0;
|
||||
let craftys = $("input[name='craftys']:checked").val();
|
||||
$("input[name='craft']:checked").each(function () {
|
||||
if (!$(this).is("disabled")) {
|
||||
arr.push($(this).val())
|
||||
}
|
||||
})
|
||||
if (craftQie) {
|
||||
arr.push(craftQie);
|
||||
}
|
||||
if (craftShua) {
|
||||
arr.push(craftShua);
|
||||
}
|
||||
|
||||
let span_result = kind + ' - ' + size + ' 厘米 -(同款内容)\n' + "工艺 :" + arr.join(",") + "\n";
|
||||
if (craftys) {
|
||||
span_result += "配件:" + craftys
|
||||
if (shuliang > 0) {
|
||||
span_result += shuliang + "套";
|
||||
}
|
||||
span_result += "\n"
|
||||
}
|
||||
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
getRemark($("#proTypeValue").val(), size, count, kind, number, arr, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,330 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">帆布</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="帆布" />
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" lay-filter="stickerKind" name="stickerKind" value="常规" title="常规" checked="checked">
|
||||
<input type="radio" lay-filter="stickerKind" name="stickerKind" value="套餐" title="套餐">
|
||||
</div>
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="ui_fb_name" id="ui_fb_name" lay-filter="ui_fb_name" class="select" lay-search>
|
||||
<option value="1">露营布</option>
|
||||
<option value="2">摆摊布</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="ui_normal">
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽 </span>
|
||||
<input type="checkbox" name="switchSize" class="switchSizeCoupon" lay-filter="switchSizeCoupon" title="自定义尺寸" lay-skin="primary">
|
||||
</p>
|
||||
<div class="layui-form-item ui_size">
|
||||
<select name="size" id="ui_size" class="select">
|
||||
<option value="100*45">100*45</option>
|
||||
<option value="45*45">45*45</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="ui_zdy_size" style="display:none">
|
||||
<input type="text" id="ui_zdy_size" placeholder="格式:长*宽" class="layui-input" autocomplete="off">
|
||||
</span>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" class="layui-input" id="count">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺<span style="font-size:14px;color:red">木棍长度50cm</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="checkbox" name="craft" value="封边" title="封边" lay-filter="craft">
|
||||
<div class="layui-inline ui_feb" style="width:100px;display:none">
|
||||
<select name="fb" class="select fb" lay-filter="fb">
|
||||
<option value="1" selected>上封边</option>
|
||||
<option value="2">下封边</option>
|
||||
<option value="3">左封边</option>
|
||||
<option value="4">右封边</option>
|
||||
<option value="5">上下封边</option>
|
||||
<option value="6">左右封边</option>
|
||||
</select>
|
||||
</div>
|
||||
<input type="checkbox" name="craft" value="四角打孔" title="四角打孔" lay-filter="craft">
|
||||
<input type="checkbox" name="craft" value="净裁" title="净裁" lay-filter="craft">
|
||||
<input type="checkbox" name="craft" value="吊耳" title="吊耳" lay-filter="craft">
|
||||
<span class="ui_normal">
|
||||
<input type="checkbox" name="craft" value="缝兜" title="缝兜" lay-filter="craft">
|
||||
</span>
|
||||
<input type="checkbox" name="craft" value="木棍" title="木棍" lay-filter="craft">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
proTypeValue : $("#proTypeValue").val(),
|
||||
kindValue : $('input[name="kindValue"]').val()
|
||||
},
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if(remark.indexOf("null") < 0){
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if(result.length == 0){
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
}else{
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// 自定义尺寸
|
||||
form.on('checkbox(switchSizeCoupon)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$('.switchSizeCoupon').val("on")
|
||||
$(".ui_zdy_size").show();
|
||||
$("#ui_zdy_size").attr("name","size");
|
||||
$(".ui_size").hide();
|
||||
$("#ui_size").attr("name","");
|
||||
$(".ui_zdy_size").find(":input").attr("disabled", false);
|
||||
$(".ui_size").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$('.switchSizeCoupon').val("off")
|
||||
$(".ui_size").show();
|
||||
$("#ui_size").attr("name","size");
|
||||
$(".ui_zdy_size").hide();
|
||||
$("#ui_zdy_size").attr("name","");
|
||||
$(".ui_size").find(":input").attr("disabled", false);
|
||||
$(".ui_zdy_size").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
});
|
||||
|
||||
form.on('checkbox(craft)', function(data){
|
||||
if($("input[name='craft']:checked").val() == "封边"){
|
||||
$(".ui_feb").show();
|
||||
$(".ui_feb select").attr("disabled", false);
|
||||
}else{
|
||||
$(".ui_feb").hide();
|
||||
$(".ui_feb select").attr("disabled", true);
|
||||
}
|
||||
form.render();
|
||||
});
|
||||
|
||||
form.on('radio(stickerKind)', function(data) {
|
||||
if(data.value == "常规"){
|
||||
$(".ui_normal").show();
|
||||
$(".ui_normal").find(":input").attr("disabled", false);
|
||||
}else{
|
||||
$(".ui_normal").hide();
|
||||
$(".ui_normal").find(":input").attr("disabled", true);
|
||||
}
|
||||
form.render('radio');
|
||||
});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var number= $("#number").val();
|
||||
var size = $("#size").val();
|
||||
var count = $("#count").val();
|
||||
var kind = $("#kindValue option:selected").text();
|
||||
var craft = $("input[name='craft']:checked").val();
|
||||
var stickerKind = $("input[name='stickerKind']:checked").val();
|
||||
if($("input[name='switchSize']:checked").val() == "on"){
|
||||
if($("#ui_zdy_size").val().split("*")[0] < 25 || $("#ui_zdy_size").val().split("*")[1] < 25){
|
||||
layer.msg('帆布最小尺寸25*25cm！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if($("#ui_zdy_size").val().split("*")[0] > 140 && $("#ui_zdy_size").val().split("*")[1] > 140){
|
||||
layer.msg('帆布尺寸超过140cm需要拼接！',{offset:['300px','300px']},function(){});
|
||||
}
|
||||
}
|
||||
var craft = [];
|
||||
$("input:checkbox[name='craft']:checked").each(function(i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if(!$(this).is(':disabled')){
|
||||
craft.push($(this).val());
|
||||
}
|
||||
});
|
||||
if(stickerKind == "常规"){
|
||||
if(!count){
|
||||
layer.msg('请填写数量！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
if($("input[name='switchSize']:checked").val() == "on"){
|
||||
size = $("#ui_zdy_size").val();
|
||||
}else{
|
||||
size = $("#ui_size option:selected").val();
|
||||
}
|
||||
var fb_name = $("#ui_fb_name option:selected").text();
|
||||
|
||||
if(craft == "封边" || craft == "打孔"){
|
||||
craft = craft + "绳子";
|
||||
}
|
||||
|
||||
var span_result = '帆布 - ' + fb_name + '-' + craft + '-' ;
|
||||
|
||||
if(stickerKind == "套餐"){
|
||||
span_result += "套餐"+ data[0].price + "元\n150*60cm 2条\n130*60cm 2条\n";
|
||||
}else{
|
||||
span_result += size +' CM (同款内容)\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "条，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "条，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,445 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- PVC名片21/会员卡24 -->
|
||||
<style>
|
||||
.edge .layui-edge {
|
||||
right: 20px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">PVC名片</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input">
|
||||
<p>种类</p>
|
||||
<div class="kind">
|
||||
<input type="radio" lay-filter="kind" name="kind" value="21" title="PVC名片">
|
||||
<input type="radio" lay-filter="kind" name="kind" value="24" title="会员卡">
|
||||
</div>
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select">
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kind2Value" id="kind2Value" lay-filter="kind2Value" class="select"></select>
|
||||
</div>
|
||||
<p>
|
||||
数量（张） <input type="checkbox" name="switchCount" lay-filter="switchCount" title="自定义数量"></span>
|
||||
</p>
|
||||
<div class="count">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="diyCount" style="display: none">
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" id="count" placeholder="请输入整数" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>印刷</p>
|
||||
<input type="radio" lay-filter="craftMo" name="craftMo" value="单面印刷" title="单面印刷" class="danmian"
|
||||
checked="checked">
|
||||
<input type="radio" lay-filter="craftMo" name="craftMo" value="双面印刷" title="双面印刷" class="shuangmian">
|
||||
|
||||
<div class="craftDiv">
|
||||
<p>工艺</p>
|
||||
<span>形状 : </span><input type="radio" lay-filter="craftJiao" name="craftJiao" value="圆角" title="圆角"
|
||||
checked="checked">
|
||||
<div class="layui-input-block craft">
|
||||
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="号码" title="号码">
|
||||
<div class="layui-inline edge haomaHide" style="width:120px; display:none">
|
||||
<select name="haoma" class="select" lay-filter="haoma">
|
||||
<option value="喷码" selected>喷码</option>
|
||||
<option value="激光码">激光码</option>
|
||||
<option value="小凸金码">小凸金码</option>
|
||||
</select>
|
||||
</div>
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="签名条" title="签名条">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="磁条" title="磁条">
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn" id="queryCondBtn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
// 监听回车键，如果敲了回车，调用点击‘计算’
|
||||
$(document).keydown(function (e) {
|
||||
if (e.keyCode === 13) {
|
||||
$("#queryCondBtn").trigger("click");
|
||||
}
|
||||
});
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
function getProductImage(option) {
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
let crafts = []
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
let kindValue = $('select[name="kindValue"] option:checked').val();
|
||||
let craftMo = $('input[name="craftMo"]:checked').val();
|
||||
$('input[name="craft"]:checked').each(function () {
|
||||
crafts.push($(this).val())
|
||||
})
|
||||
let data = {
|
||||
proTypeValue: $('input[name="kind"]:checked').val()
|
||||
}
|
||||
if (!!kindValue) {
|
||||
data.kindValue = kindValue;
|
||||
}
|
||||
if (kindValue) {
|
||||
data.craftValue = craftMo
|
||||
}
|
||||
if (data.proTypeValue == 24) {
|
||||
delete data.craftValue;
|
||||
}
|
||||
if (crafts.length > 0 && option != "") {
|
||||
delete data.kindValue;
|
||||
data.craftValue = option
|
||||
}
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data,
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
form.on('radio(craftMo)', function (data) {
|
||||
getProductImage()
|
||||
})
|
||||
// 监听种类--PVC名片/会员卡
|
||||
form.on('radio(kind)', function (data) {
|
||||
// 选择会员卡的时候禁用单面印刷，切换成双面印刷
|
||||
if (data.value == 24) {
|
||||
$(".danmian").attr("disabled", true);
|
||||
$('input[class = shuangmian]').prop('checked', true);
|
||||
$(".shuangmian").attr("disabled", false);// 加这个让按钮取消禁用模式
|
||||
|
||||
$(".craftDiv").show();
|
||||
$(".craftDiv").find(":input").attr("disabled", false);
|
||||
} else {
|
||||
$(".danmian").attr("disabled", false);
|
||||
$(".craftDiv").hide();
|
||||
$(".craftDiv").find(":input").attr("disabled", true);
|
||||
}
|
||||
form.render('radio');
|
||||
// 切换按钮清空下拉框(防止一直重复加)
|
||||
$("#kindValue").empty();
|
||||
// 下拉框第一列添加空的option
|
||||
$('#kindValue').append(new Option("", ""));
|
||||
// 一访问页面就获取材质
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getKindsByPro",
|
||||
type: "GET",
|
||||
dataType: "json",
|
||||
data: {
|
||||
proTypeValue: $('input[name="kind"]:checked').val()
|
||||
},
|
||||
success: function (result) {
|
||||
$.each(result, function (index, item) {
|
||||
$('#kindValue').append(new Option(item, index));//往下拉菜单里添加元素
|
||||
});
|
||||
layui.form.render("select");
|
||||
}
|
||||
});
|
||||
getProductImage()
|
||||
|
||||
});
|
||||
// 根据材质选择获取产品尺寸
|
||||
form.on('select(kindValue)', function (data) {
|
||||
// 透明材质的时候禁用双面印刷，切换成单面印刷
|
||||
if (data.value == 3 || data.value == 4) {
|
||||
if ($('input[name="kind"]:checked').val() == 21) {
|
||||
$(".shuangmian").attr("disabled", true);
|
||||
$('input[class = danmian]').prop('checked', true);
|
||||
}
|
||||
} else {
|
||||
$(".shuangmian").attr("disabled", false);
|
||||
}
|
||||
form.render('radio');
|
||||
// 获取产品名称
|
||||
$("#kind2Value").empty();
|
||||
form.render("select");
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getKind2sByKind",
|
||||
type: "GET",
|
||||
dataType: "json",
|
||||
data: {
|
||||
proTypeValue: $('input[name="kind"]:checked').val(),
|
||||
kindValue: data.value
|
||||
},
|
||||
success: function (result) {
|
||||
$.each(result, function (index, item) {
|
||||
$('#kind2Value').append(new Option(item, index));//往下拉菜单里添加元素
|
||||
});
|
||||
layui.form.render("select");
|
||||
}
|
||||
});
|
||||
getProductImage();
|
||||
});
|
||||
|
||||
// 自定义数量
|
||||
form.on('checkbox(switchCount)', function (data) {
|
||||
if (data.elem.checked) {
|
||||
$(".diyCount").show();
|
||||
$(".count").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", false);
|
||||
$(".count").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".count").show();
|
||||
$(".diyCount").hide();
|
||||
$(".count").find(":input").attr("disabled", false);
|
||||
$(".diyCount").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
|
||||
// 选中工艺‘号码’的时候，才显示出对应下拉框
|
||||
form.on('checkbox(switch)', function (data) {
|
||||
// 打码选中的时候，显示下拉框
|
||||
if (data.value == '号码') {
|
||||
if (data.elem.checked) {
|
||||
$(".haomaHide").show();
|
||||
} else {
|
||||
$(".haomaHide").hide();
|
||||
}
|
||||
}
|
||||
getProductImage(data.elem.checked ? data.value : "")
|
||||
});
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var proTypeValue = $('input[name="kind"]:checked').val();
|
||||
if (!proTypeValue) {
|
||||
layer.msg("请选择产品种类！", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
// 赋值proTypeValue
|
||||
$("#proTypeValue").val(proTypeValue);
|
||||
var proTypeValue = $('input[name="kind"]:checked').val();
|
||||
|
||||
// 选中‘自定义数量’
|
||||
if ($('input[name="switchCount"]:checked').length != 0) {
|
||||
if ($("#count").val() < 10000 || $("#count").val() % 1000 != 0) {
|
||||
layer.msg("自定义数量需要大于10000 且是1000的整数倍", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
var kindValue = $("#kindValue option:checked").text();
|
||||
if (kindValue == "") {
|
||||
layer.msg("请选择材质！", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var kind2Value = $("#kind2Value option:checked").text();
|
||||
var craftMo = [$('input[name="craftMo"]:checked').val()];
|
||||
var craftJiao = [$('input[name="craftJiao"]:checked').val()];
|
||||
var number = $("#number").val();
|
||||
var count = $("select[name='count'] option:selected").text();
|
||||
var proTypeValueData = {
|
||||
21: "PVC名片",
|
||||
24: "会员卡"
|
||||
};
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
var span_result = proTypeValueData[proTypeValue] + ' - ' + kindValue + ' - ' + kind2Value + ' - ' + craftMo + ' - ' + craftJiao + ' -(同款内容)\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var size = kind2Value.replace("MM", "");
|
||||
var craft = craftMo + craftJiao;
|
||||
if ($(".haomaHide").css("display") != "none") {
|
||||
craft += $("select[name='haoma'] option:selected").val();
|
||||
}
|
||||
var other = [];
|
||||
$("input:checkbox[name='craft']:checked").each(function (i) {
|
||||
if (!$(this).is(':disabled')) {
|
||||
if ($(this).val() != "号码")
|
||||
other.push($(this).val());
|
||||
}
|
||||
});
|
||||
console.log(size);
|
||||
if (other != "") {
|
||||
craft += other;
|
||||
}
|
||||
getRemark(proTypeValueData[proTypeValue], size + "mm", count + "张", kindValue, number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,192 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">串旗</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="串旗" />
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select" lay-search>
|
||||
<option value="0">夹黑布</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="checkbox" name="craft" value="缝筒" title="缝筒" lay-filter="craft">
|
||||
<input type="checkbox" name="craft" value="打孔" title="打孔" lay-filter="craft">
|
||||
<input type="checkbox" name="craft" value="串绳" title="串绳" lay-filter="craft">
|
||||
<input type="checkbox" name="craft" value="净裁" title="净裁" lay-filter="craft">
|
||||
<input type="checkbox" name="craft" value="木棍" title="木棍" lay-filter="craft">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var number= $("#number").val();
|
||||
var size = $("#size").val();
|
||||
var count = $("#count").val();
|
||||
var kind = $("#kindValue option:selected").text();
|
||||
var arr = [];
|
||||
$("input:checkbox[name='craft']:checked").each(function(i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if(!$(this).is(':disabled')){
|
||||
arr.push($(this).val());
|
||||
}
|
||||
});
|
||||
if(!size){
|
||||
layer.msg('请填写尺寸！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
var span_result = '串旗 - ' + kind + '-' + size +' CM (同款内容)' + "工艺 :" + arr +'\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
getRemark("串旗", size, count+"个", kind, number, "", "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,603 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
|
||||
<style>
|
||||
#craft_draw .layui-form-select .layui-edge {
|
||||
right: 17%;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">定制衫</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" class="layui-input" value="定制衫">
|
||||
<input type="hidden" id="proTypeValue" value="定制衫">
|
||||
<p>
|
||||
型号
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="YP" title="YP 1902"
|
||||
lay-skin="primary" checked>
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="XW" title="XW 601#"
|
||||
lay-skin="primary">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="EP" title="EP 2803"
|
||||
lay-skin="primary">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="ZT" title="ZT 901#"
|
||||
lay-skin="primary">
|
||||
</div>
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kind1Value" id="kind1Value" lay-filter="kind1Value" class="select">
|
||||
<option value="圆领速干">圆领速干</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款式
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="styles" lay-filter="styles" value="成人款" title="成人款"
|
||||
lay-skin="primary" checked>
|
||||
<input type="radio" name="styles" lay-filter="styles" value="儿童款" title="儿童款"
|
||||
lay-skin="primary">
|
||||
</div>
|
||||
<p>
|
||||
尺码
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select id="size" lay-filter="size" class="select">
|
||||
<option value="S" selected>S</option>
|
||||
<option value="M">M</option>
|
||||
<option value="L">L</option>
|
||||
<option value="XL">XL</option>
|
||||
<option value="2XL">2XL</option>
|
||||
<option value="3XL">3XL</option>
|
||||
<option value="4XL">4XL</option>
|
||||
<option value="5XL">5XL</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
颜色
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select id="color" lay-filter="color" class="select">
|
||||
<option value="宝蓝" selected>宝蓝</option>
|
||||
<option value="黑色">黑色</option>
|
||||
<option value="白色">白色</option>
|
||||
<option value="湖蓝">湖蓝</option>
|
||||
<option value="银光绿">银光绿</option>
|
||||
<option value="黄色">黄色</option>
|
||||
<option value="橙色">橙色</option>
|
||||
<option value="天蓝">天蓝</option>
|
||||
<option value="红色">红色</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
数量（件）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" id="count" class="layui-input"
|
||||
lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
|
||||
<p>
|
||||
工艺<span style="font-size:14px;color:red">印花最大尺寸32*40CM</span>
|
||||
</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="烫画" title="烫画">
|
||||
<span id="craft_draw" style="display: none;align-items: center">
|
||||
<div class="layui-form-item" style="align-items: center;display: flex">
|
||||
<span style="flex-shrink: 0">位置：</span>
|
||||
<select name="po_number" class="select" lay-verify="po_number" lay-filter="po_number">
|
||||
<option value="1">1</option>
|
||||
<option value="2">2</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="layui-form-item" style="align-items: center;display: flex">
|
||||
<span>尺寸1：</span>
|
||||
<select name="size" class="select">
|
||||
<option value="10*10">10*10CM内</option>
|
||||
<option value="15*15">15*15CM内</option>
|
||||
<option value="15*20">15*20CM内</option>
|
||||
<option value="25*15">25*15CM内</option>
|
||||
<option value="20*20">20*20CM内</option>
|
||||
<option value="25*25">25*25CM内</option>
|
||||
<option value="30*30">30*30CM内</option>
|
||||
<option value="30*40">30*40CM内</option>
|
||||
</select>
|
||||
</div>
|
||||
<div id="po_num_item"></div>
|
||||
</span>
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="丝印" title="丝印">
|
||||
<span id="craft_print" style="display: none;align-items: center">
|
||||
|
||||
<div style="width: 150px;align-items: center;display: flex">
|
||||
<span style="flex-shrink: 0">位置：</span>
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="po_number" class="layui-input"
|
||||
lay-verify="number" value="1" disabled></div>
|
||||
<div style="width: 150px;align-items: center;display: flex">
|
||||
<span style="flex-shrink: 0">颜色：</span>
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="co_number" class="layui-input"
|
||||
lay-verify="number" value="1" disabled></div>
|
||||
</span>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
function getProductImage(craft) {
|
||||
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
let data = {proTypeValue: "定制衫"}
|
||||
let remark = "";
|
||||
let html = "";
|
||||
let kindValue = $("input[name='kindValue']:checked").val();
|
||||
let styles = $("input[name='styles']:checked").val();
|
||||
data.kindValue = kindValue;
|
||||
data.kind2Value = styles;
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data,
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[0].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
form.on("select(po_number)", (data) => {
|
||||
let html = ``
|
||||
if (data.value > 1) {
|
||||
for (let i = 1; i < data.value; i++) {
|
||||
html += `<div class="layui-form-item" style="align-items: center;display: flex">
|
||||
<span>尺寸` + parseInt(i + 1) + `：</span>
|
||||
<select name="size" class="select">
|
||||
<option value="10*10">10*10CM内</option>
|
||||
<option value="15*15">15*15CM内</option>
|
||||
<option value="15*20">15*20CM内</option>
|
||||
<option value="25*15">25*15CM内</option>
|
||||
<option value="20*20">20*20CM内</option>
|
||||
<option value="25*25">25*25CM内</option>
|
||||
<option value="30*30">30*30CM内</option>
|
||||
<option value="30*40">30*40CM内</option>
|
||||
</select>
|
||||
</div>`
|
||||
}
|
||||
$("#po_num_item").empty().append(html);
|
||||
}
|
||||
form.render();
|
||||
})
|
||||
form.on("radio(styles)", (data) => {
|
||||
let kindValue = $("input[name='kindValue']:checked").val();
|
||||
setHtml(kindValue, data.value)
|
||||
form.render();
|
||||
getProductImage()
|
||||
});
|
||||
form.on("radio(kindValue)", (data) => {
|
||||
$("input[name='styles'][value='成人款']").prop("checked", true);
|
||||
$("input[name='styles'][value='儿童款']").prop("disabled", false);
|
||||
setHtml(data.value, '成人款')
|
||||
if (data.value == "EP") {
|
||||
$("input[name='styles'][value='儿童款']").prop("disabled", true);
|
||||
}
|
||||
if (data.value == "ZT") {
|
||||
$("input[name='styles'][value='儿童款']").prop("disabled", true);
|
||||
}
|
||||
form.render();
|
||||
getProductImage()
|
||||
})
|
||||
|
||||
function setHtml(kind, styles) {
|
||||
if (kind == 'XW') {
|
||||
if (styles == '成人款') {
|
||||
$("#kind1Value").empty();
|
||||
$("#kind1Value").append(`<option value="圆领棉质">圆领棉质</option>`);
|
||||
$("#size").empty();
|
||||
$("#size").append(`<option value="S" selected>S</option>
|
||||
<option value="M">M</option>
|
||||
<option value="L">L</option>
|
||||
<option value="XL">XL</option>
|
||||
<option value="2XL">2XL</option>
|
||||
<option value="3XL">3XL</option>
|
||||
<option value="4XL">4XL</option>
|
||||
<option value="5XL">5XL</option>`
|
||||
);
|
||||
$("#color").empty();
|
||||
$("#color").append(`<option value="砖红" selected>砖红</option>
|
||||
<option value="墨绿色">墨绿色</option>
|
||||
<option value="白色">白色</option>
|
||||
<option value="紫色">紫色</option>
|
||||
<option value="雾霾蓝">雾霾蓝</option>
|
||||
<option value="克莱因蓝">克莱因蓝</option>
|
||||
<option value="米杏">米杏</option>
|
||||
<option value="姜黄">姜黄</option>
|
||||
<option value="玫红">玫红</option>
|
||||
<option value="豆绿">豆绿</option>
|
||||
<option value="酒红">酒红</option>
|
||||
<option value="卡其色">卡其色</option>
|
||||
<option value="天蓝色">天蓝色</option>
|
||||
<option value="铁灰">铁灰</option>
|
||||
<option value="红色">红色</option>
|
||||
<option value="黑色">黑色</option>
|
||||
<option value="浅灰色">浅灰色</option>
|
||||
<option value="绿色">绿色</option>`
|
||||
);
|
||||
}
|
||||
if (styles == '儿童款') {
|
||||
$("#size").empty();
|
||||
$("#size").append(`<option value="100" selected>100</option>
|
||||
<option value="110">110</option>
|
||||
<option value="120">120</option>
|
||||
<option value="130">130</option>
|
||||
<option value="140">140</option>
|
||||
<option value="150">150</option>`
|
||||
);
|
||||
$("#color").empty();
|
||||
$("#color").append(`<option value="黑色" selected>黑色</option>
|
||||
<option value="白色">白色</option>
|
||||
<option value="粉色">粉色</option>
|
||||
<option value="大红色">大红色</option>`
|
||||
);
|
||||
}
|
||||
}
|
||||
if (kind == 'YP') {
|
||||
if (styles == '成人款') {
|
||||
$("#kind1Value").empty();
|
||||
$("#kind1Value").append(`<option value="圆领速干">圆领速干</option>`);
|
||||
$("#size").empty();
|
||||
$("#size").append(`<option value="S" selected>S</option>
|
||||
<option value="M">M</option>
|
||||
<option value="L">L</option>
|
||||
<option value="XL">XL</option>
|
||||
<option value="2XL">2XL</option>
|
||||
<option value="3XL">3XL</option>
|
||||
<option value="4XL">4XL</option>
|
||||
<option value="5XL">5XL</option>`);
|
||||
$("#color").empty();
|
||||
$("#color").append(`<option value="宝蓝" selected>宝蓝</option>
|
||||
<option value="黑色">黑色</option>
|
||||
<option value="白色">白色</option>
|
||||
<option value="湖蓝">湖蓝</option>
|
||||
<option value="银光绿">银光绿</option>
|
||||
<option value="黄色">黄色</option>
|
||||
<option value="橙色">橙色</option>
|
||||
<option value="天蓝">天蓝</option>
|
||||
<option value="红色">红色</option>`);
|
||||
}
|
||||
if (styles == '儿童款') {
|
||||
$("#size").empty();
|
||||
$("#size").append(`<option value="100" selected>100</option>
|
||||
<option value="110">110</option>
|
||||
<option value="120">120</option>
|
||||
<option value="130">130</option>
|
||||
<option value="140">140</option>
|
||||
<option value="150">150</option>`
|
||||
);
|
||||
$("#color").empty();
|
||||
$("#color").append(`<option value="砖红" selected>砖红</option>
|
||||
<option value="墨绿色">墨绿色</option>
|
||||
<option value="白色">白色</option>
|
||||
<option value="紫色">紫色</option>
|
||||
<option value="雾霾蓝">雾霾蓝</option>
|
||||
<option value="克莱因蓝">克莱因蓝</option>
|
||||
<option value="米杏">米杏</option>
|
||||
<option value="姜黄">姜黄</option>
|
||||
<option value="玫红">玫红</option>
|
||||
<option value="豆绿">豆绿</option>
|
||||
<option value="酒红">酒红</option>
|
||||
<option value="卡其色">卡其色</option>
|
||||
<option value="天蓝色">天蓝色</option>
|
||||
<option value="铁灰">铁灰</option>
|
||||
<option value="红色">红色</option>
|
||||
<option value="黑色">黑色</option>
|
||||
<option value="浅灰色">浅灰色</option>
|
||||
<option value="绿色">绿色</option>`);
|
||||
}
|
||||
}
|
||||
if (kind == 'EP') {
|
||||
if (styles == '成人款') {
|
||||
$("#kind1Value").empty();
|
||||
$("#kind1Value").append(`<option value="polo速干">polo速干</option>`);
|
||||
$("#size").empty();
|
||||
$("#size").append(`<option value="S" selected>S</option>
|
||||
<option value="M">M</option>
|
||||
<option value="L">L</option>
|
||||
<option value="XL">XL</option>
|
||||
<option value="2XL">2XL</option>
|
||||
<option value="3XL">3XL</option>
|
||||
<option value="4XL">4XL</option>
|
||||
<option value="5XL">5XL</option>`);
|
||||
$("#color").empty();
|
||||
$("#color").append(`<option value="孔蓝色" selected>孔蓝色</option>
|
||||
<option value="灰色">灰色</option>
|
||||
<option value="天蓝色">天蓝色</option>
|
||||
<option value="彩蓝色">彩蓝色</option>
|
||||
<option value="白色">白色</option>
|
||||
<option value="草绿色">草绿色</option>
|
||||
<option value="藏青色">藏青色</option>
|
||||
<option value="橙色">橙色</option>
|
||||
<option value="黑色">黑色</option>
|
||||
<option value="红色">红色</option>
|
||||
<option value="黄色">黄色</option>`);
|
||||
}
|
||||
if (styles == '儿童款') {
|
||||
|
||||
}
|
||||
}
|
||||
if (kind == 'ZT') {
|
||||
if (styles == '成人款') {
|
||||
$("#kind1Value").empty();
|
||||
$("#kind1Value").append(`<option value="popl棉质">popl棉质</option>`);
|
||||
$("#size").empty();
|
||||
$("#size").append(`<option value="S" selected>S</option>
|
||||
<option value="M">M</option>
|
||||
<option value="L">L</option>
|
||||
<option value="XL">XL</option>
|
||||
<option value="2XL">2XL</option>
|
||||
<option value="3XL">3XL</option>
|
||||
<option value="4XL">4XL</option>`);
|
||||
$("#color").empty();
|
||||
$("#color").append(`<option value="黑色" selected>黑色</option>
|
||||
<option value="白色">白色</option>
|
||||
<option value="橘色">橘色</option>
|
||||
<option value="天蓝色">天蓝色</option>
|
||||
<option value="果绿色">果绿色</option>
|
||||
<option value="孔蓝色">孔蓝色</option>
|
||||
<option value="红色">红色</option>
|
||||
<option value="藏青色">藏青色</option>
|
||||
<option value="玫红色">玫红色</option>
|
||||
<option value="紫色">紫色</option>
|
||||
<option value="黄色">黄色</option>
|
||||
<option value="草绿色">草绿色</option>`);
|
||||
}
|
||||
if (styles == '儿童款') {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
form.on("checkbox(switch)", (data) => {
|
||||
let arr = []
|
||||
if ($("input[name='craft']:checked").length > 1) {
|
||||
$(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg('烫画-丝印不能同时选择！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (data.value == '烫画') {
|
||||
if (data.elem.checked) {
|
||||
$("#craft_draw").css("display", "flex");
|
||||
$("#craft_draw input").prop("disabled", false);
|
||||
$("#craft_draw select").prop("disabled", false);
|
||||
} else {
|
||||
$("#craft_draw").css("display", "none");
|
||||
$("#craft_draw input").prop("disabled", true);
|
||||
$("#craft_draw select").prop("disabled", true);
|
||||
}
|
||||
}
|
||||
if (data.value == '丝印') {
|
||||
if (data.elem.checked) {
|
||||
$("#craft_print").css("display", "flex");
|
||||
$("#craft_print input").prop("disabled", false);
|
||||
} else {
|
||||
$("#craft_print").css("display", "none");
|
||||
$("#craft_print input").prop("disabled", true);
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
|
||||
let size = $("select[name='size'] option:selected").val();
|
||||
let count = $("#count").val();
|
||||
let craft = $("input[name='craft']:checked").val();
|
||||
|
||||
if (!craft) {
|
||||
layer.msg('工艺必须选择！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!count) {
|
||||
layer.msg('请输入数量！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (craft?.indexOf("烫画") > -1) {
|
||||
let t_po_number = $("#craft_draw select[name='po_number'] option:selected").val();
|
||||
if (!size) {
|
||||
layer.msg('请输入尺寸！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!t_po_number) {
|
||||
layer.msg('请输入位置数量！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
|
||||
}
|
||||
}
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
let kind_value = {
|
||||
"YP": "YP 1902",
|
||||
"XW": "XW 601#",
|
||||
"EP": "EP 2803",
|
||||
"ZT": "ZT 901#",
|
||||
}
|
||||
let arr = [];
|
||||
let data = result.data.proList;
|
||||
let kind = $("input[name='kindValue']:checked").val();
|
||||
let styles = $("input[name='styles']:checked").val();
|
||||
let po_number = $("input[name='po_number']").val();
|
||||
let co_number = $("input[name='co_number']").val();
|
||||
let kind1Value = $("select[name='kind1Value'] option:selected").val();
|
||||
let cSize = $("#size").val();
|
||||
let cColor = $("#color").val();
|
||||
let number = $("#number").val();
|
||||
if (craft?.indexOf("烫画") > -1) {
|
||||
po_number = $("select[name='po_number'] option:selected").val();
|
||||
}
|
||||
if (craft?.indexOf("丝印") > -1) {
|
||||
po_number = $("input[name='po_number']").val();
|
||||
}
|
||||
$("input[name='craft']:checked").each(function () {
|
||||
if (!$(this).is("disabled")) {
|
||||
arr.push($(this).val())
|
||||
}
|
||||
})
|
||||
let span_result = kind_value[kind] + styles + '-' + kind1Value + '-' + cSize + '-' + cColor + '-(同款内容)\n工艺 :' + arr.join(",") + '\n'
|
||||
if (craft?.indexOf("烫画") > -1) {
|
||||
span_result += "烫画规格:" + size + "CM" + ",位置：" + po_number + "\n"
|
||||
}
|
||||
if (craft?.indexOf("丝印") > -1) {
|
||||
span_result += "位置：" + po_number + "，" + "颜色：" + co_number + "\n"
|
||||
}
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "件，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "件，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
getRemark($("#proTypeValue").val(), size, count, kind, number, arr, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,314 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- 杯垫 -->
|
||||
<style>
|
||||
.layui-form-checkbox[lay-skin=primary] i {
|
||||
border-radius: 50px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
.layui-form-checkbox[lay-skin=primary] span {
|
||||
color: black;
|
||||
margin-top: 3px;
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">杯垫</h1>
|
||||
<span style="color: red; font-weight: 700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="杯垫">
|
||||
<p>材质</p>
|
||||
<div>
|
||||
<!--<input type="radio" name="kindValue" lay-filter="kindValue" value="3" title="350克铜版纸" checked>-->
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="6" title="600克铜版纸" checked>
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="4" title="900克双胶纸" checked>
|
||||
</div>
|
||||
<div class="tagOther">
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size: 14px; color: red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="size" placeholder="格式:长*宽" id="size" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量(张)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select">
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off"
|
||||
name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="craftQie" lay-filter="craftQie" value="异形模切" title="异形模切" checked>
|
||||
|
|
||||
<span>
|
||||
<input type="radio" id="non" name="craftMo" lay-filter="craftMo" la value="不覆膜" title="不覆膜"
|
||||
checked>
|
||||
</span>
|
||||
<span style="display: none">
|
||||
<input type="radio" id="double" name="craftMo" lay-filter="craftMo" la value="双面覆哑膜"
|
||||
title="双面覆哑膜">
|
||||
</span>
|
||||
|
|
||||
<!--<span class="ui_gy_1">
|
||||
<input type="radio" name="craftTang" lay-filter="switch" value="无" title="无">
|
||||
<input type="radio" name="craftTang" lay-filter="switch" value="单面烫金" title="单面烫金">
|
||||
<input type="radio" name="craftTang" lay-filter="switch" value="双面烫金" title="双面烫金">
|
||||
</span>-->
|
||||
<input type="radio" name="kind2Value" value="无" title="无" checked>
|
||||
<input type="radio" name="kind2Value" value="单面烫黄金" title="单面烫黄金">
|
||||
<input type="radio" name="kind2Value" value="单面凹凸" title="单面凹凸">
|
||||
<input type="radio" name="kind2Value" value="单面烫黄金+凹凸" title="单面烫黄金+凹凸">
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size: 20px; color: red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
/*form.on('checkbox(switch)', function(data) {
|
||||
// 压痕压点线只能选一个
|
||||
var tangLen = $(".tang:checked").length;
|
||||
if (tangLen > 1) {
|
||||
$(data.elem).next().attr("class","layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg('[单面 - 双面]不能同时选择！', {offset : [ '300px', '300px' ]}, {icon : 5});
|
||||
return false;
|
||||
}
|
||||
}) */
|
||||
|
||||
form.on('radio(kindValue)', function (kindValueData) {
|
||||
if (kindValueData.value == '3') {
|
||||
$(".ui_gy_1").show();
|
||||
$(".ui_gy_2").hide();
|
||||
} else {
|
||||
$(".ui_gy_1").hide();
|
||||
$(".ui_gy_2").show();
|
||||
|
||||
if (kindValueData.value == '4') {
|
||||
$('#double').prop('checked', false);
|
||||
$('#non').prop('checked', true);
|
||||
$("#double").parent('span').hide();
|
||||
$('#non').parent('span').show();
|
||||
}
|
||||
if (kindValueData.value == '6') {
|
||||
$('#double').prop('checked', true);
|
||||
$('#non').prop('checked', false);
|
||||
$('#non').parent('span').hide();
|
||||
$("#double").parent('span').show();
|
||||
}
|
||||
}
|
||||
form.render();
|
||||
})
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
/* var wangwang = $("#wangwang").val();
|
||||
if(wangwang == ""){
|
||||
layer.msg("请填写客户旺旺号！",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
} */
|
||||
// 选中‘自定义数量’
|
||||
var kindValue = $('input[name="kindValue"]:checked').val();
|
||||
var craftQie = $('input[name="craftQie"]:checked').val();
|
||||
var craftMo = $('input[name="craftMo"]:checked').val();
|
||||
var size = $("#size").val();
|
||||
var count = $("select[name='count'] option:selected").text();
|
||||
var craftTang = $('input[name="craftTang"]:checked').val();
|
||||
var arr = [];
|
||||
arr.push(craftMo);
|
||||
if (!kindValue) {
|
||||
layer.msg("请选择材质", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (kindValue == 4) {
|
||||
if ((size.split("*")[0] < 4 || size.split("*")[1] < 4)) {
|
||||
layer.msg("【杯垫900克】尺寸不能低于4*4 cm!", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
$("#proTypeValue").val("杯垫");
|
||||
if ((kindValue == 3)) {
|
||||
if (craftQie == "异形模切") {
|
||||
if ((size.split("*")[0] > 21 || size.split("*")[1] > 21)) {
|
||||
layer.msg("【900克双胶纸】尺寸不能小于21*21 cm!", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if ((size.split("*")[0] <= 9 && size.split("*")[1] <= 5.4) || (size.split("*")[0] <= 5.4 && size.split("*")[1] <= 9)) {
|
||||
if (craftTang) {
|
||||
if (craftTang == "单面烫金") {
|
||||
$("#proTypeValue").val(3);
|
||||
}
|
||||
} else {
|
||||
if ((size.split("*")[0] < 3 || size.split("*")[1] < 3)) {
|
||||
$("#proTypeValue").val(3);
|
||||
$("input[name='kindValue']:checked").val(0);
|
||||
} else {
|
||||
$("#proTypeValue").val("杯垫");
|
||||
}
|
||||
}
|
||||
form.render();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var number = $("#number").val();
|
||||
kindValueData = {
|
||||
3: "350克铜版纸",
|
||||
6: "600克铜版纸",
|
||||
4: "900克双胶纸"
|
||||
};
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result = '杯垫 - ' + kindValueData[kindValue] + ' - ' + size + '厘米\n' + "工艺： " + craftQie + ', ' + arr + "\n";
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
|
||||
$("#span_result").val(span_result);
|
||||
var craft = craftQie + arr;
|
||||
getRemark("杯垫", size, count + "张", kindValueData[kindValue], number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,466 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 彩色信封 -->
|
||||
<style>
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">彩色信封</h1>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="9" >
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item" style="display:none;">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="kindValue" lay-filter="k" class="kindValue" value="0" title="120克双胶纸">
|
||||
<input type="radio" name="kindValue" lay-filter="k" class="kindValue" value="10" title="120克牛皮纸">
|
||||
<input type="radio" name="kindValue" lay-filter="k" class="kindValue" value="1" title="100克双胶纸">
|
||||
<input type="radio" name="kindValue" lay-filter="k" class="kindValue" value="11" title="100克牛皮纸">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item" style="display:none;">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="kindValue" lay-filter="k" class="kindValue" value="2" title="140克珠光冰白彩色信封">
|
||||
<input type="radio" name="kindValue" lay-filter="k" class="kindValue" value="3" title="200克珠光冰白彩色信封">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="kindValue" lay-filter="k" class="kindValue" value="4" title="250克高端珠光冰白烫金信封">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item first">
|
||||
<select name="kind2Value" class="select kind2Value firstKind2Value">
|
||||
<option value="0">3号（中/西封）--成品17.6*12.5CM</option>
|
||||
<option value="1">5号（中/西封）--成品22*11CM</option>
|
||||
<option value="2">6号（中/西封）--成品23*12CM</option>
|
||||
<option value="3">7号（中/西封）--成品22.9*16.2CM</option>
|
||||
<option value="4">8号（中/西封）--成品25*16.2CM</option>
|
||||
<option value="5">9号（中式） --成品32.4*22.9CM</option>
|
||||
<option value="6">9号（西式） --成品32.4*22.9CM</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="layui-form-item second" style="display:none;">
|
||||
<select name="kind2Value" class="select kind2Value secondKind2Value">
|
||||
<option value="0">1号信封 (16.5*10cm)</option>
|
||||
<option value="1">2号信封 (17.5*11cm)</option>
|
||||
<option value="2">3号信封 (B6号 17.6*12.5cm)</option>
|
||||
<option value="3">5号信封 (DL号 22*11cm)</option>
|
||||
<option value="4">6号信封 (ZL号 23*12cm)</option>
|
||||
<option value="5">7号信封 (C5号 22.9*16.2cm)</option>
|
||||
<option value="6">8号信封 (增值税票专用 25*16.2cm)</option>
|
||||
<option value="7">9号信封 (C4号 32.4*22.9cm)</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="layui-form-item third" style="display:none;">
|
||||
<select name="kind2Value" class="select kind2Value thirdKind2Value" lay-filter="testId" >
|
||||
<option value="0">9*6cm</option>
|
||||
<option value="1">10*7cm</option>
|
||||
<option value="2">12*8cm</option>
|
||||
<option value="3">15*8cm</option>
|
||||
<option value="4">17*9cm</option>
|
||||
<option value="5">19*9cm</option>
|
||||
<option value="6">21*11cm</option>
|
||||
<option value="7">22*12cm</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="pageColor" style="display:none;">
|
||||
<p>
|
||||
纸张颜色
|
||||
</p>
|
||||
<div class="layui-form-item color1">
|
||||
<select class="select color11">
|
||||
<option value="白金">白金</option>
|
||||
<option value="米金">米金</option>
|
||||
<option value="湖蓝">湖蓝</option>
|
||||
<option value="紫红">紫红</option>
|
||||
<option value="金黄">金黄</option>
|
||||
<option value="金铜">金铜</option>
|
||||
<option value="炭黑">炭黑</option>
|
||||
<option value="墨绿">墨绿</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="layui-form-item color2">
|
||||
<select class="select color22">
|
||||
<option value="红色">红色</option>
|
||||
<option value="宝蓝">宝蓝</option>
|
||||
<option value="金色">金色</option>
|
||||
<option value="黑卡">黑卡</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item" id="otherCount" style="display:none;">
|
||||
<select name="count" class="select" id="count">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="layui-form-item" id="thirdCount">
|
||||
<select name="count" class="select" id="count1">
|
||||
<option value="100">100</option>
|
||||
<option value="200">200</option>
|
||||
<option value="300">300</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn" id="queryCondBtn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
// 监听回车键，如果敲了回车，调用点击‘计算’
|
||||
$(document).keydown(function (e) {
|
||||
if (e.keyCode === 13) {
|
||||
$("#queryCondBtn").trigger("click");
|
||||
}
|
||||
});
|
||||
|
||||
// 隐藏的默认禁用
|
||||
$(".color2").hide();
|
||||
$(".second").find(":input").attr("disabled", true);
|
||||
form.on('radio(k)', function(data){
|
||||
var level = data.value;//被点击的radio的value值
|
||||
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
proTypeValue : $("#proTypeValue").val(),
|
||||
kindValue : level
|
||||
},
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if(remark.indexOf("null") < 0){
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
if(result.length == 0){
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
}else{
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
if(level == 2 || level == 3){
|
||||
$(".first").hide();
|
||||
$(".first").find(":input").attr("disabled", true);
|
||||
$(".third").hide();
|
||||
$(".third").find(":input").attr("disabled", true);
|
||||
$(".second").show();
|
||||
$(".second").find(":input").attr("disabled", false);
|
||||
$("#otherCount").show();
|
||||
$("#thirdCount").find(":input").attr("disabled", false);
|
||||
}else if(level == 4){
|
||||
$(".first").hide();
|
||||
$(".first").find(":input").attr("disabled", true);
|
||||
$(".second").hide();
|
||||
$(".second").find(":input").attr("disabled", true);
|
||||
$(".third").show();
|
||||
$(".third").find(":input").attr("disabled", false);
|
||||
}else{
|
||||
$(".second").hide();
|
||||
$(".second").find(":input").attr("disabled", true);
|
||||
$(".third").hide();
|
||||
$(".third").find(":input").attr("disabled", true);
|
||||
$(".first").show();
|
||||
$(".first").find(":input").attr("disabled", false);
|
||||
}
|
||||
// 高端珠白冰白烫金信封
|
||||
if(level == 4){
|
||||
// 数量
|
||||
$("#thirdCount").show();
|
||||
$("#thirdCount").find(":input").attr("disabled", false);
|
||||
$("#otherCount").hide();
|
||||
$("#otherCount").find(":input").attr("disabled", true);
|
||||
$(".pageColor").show();
|
||||
$(".pageColor").find(":input").attr("disabled", false);
|
||||
$(".color2").find(":input").attr("disabled", true);
|
||||
form.on('select(testId)', function(data){
|
||||
if(data.value == 0){
|
||||
$(".color1").show();
|
||||
$(".color1").find(":input").attr("disabled", false);
|
||||
$(".color2").hide();
|
||||
$(".color2").find(":input").attr("disabled", true);
|
||||
}else{
|
||||
// $(".color2").show();
|
||||
// $(".color2").find(":input").attr("disabled", false);
|
||||
// $(".color1").hide();
|
||||
// $(".color1").find(":input").attr("disabled", true);
|
||||
}
|
||||
})
|
||||
}else{
|
||||
// 数量
|
||||
$("#otherCount").show();
|
||||
$("#otherCount").find(":input").attr("disabled", false);
|
||||
$("#thirdCount").hide();
|
||||
$("#thirdCount").find(":input").attr("disabled", true);
|
||||
$(".pageColor").hide();
|
||||
$(".pageColor").find(":input").attr("disabled", true);
|
||||
}
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
var kindData={
|
||||
0 : "120克双胶纸",
|
||||
10 : "120克牛皮纸",
|
||||
1 : "100克双胶纸",
|
||||
11 : "100克牛皮纸",
|
||||
2 : "140克珠光冰白彩色信封",
|
||||
3 : "200克珠光冰白彩色信封",
|
||||
4 : "250克高端珠光冰白烫金信封"
|
||||
};
|
||||
// 第二排
|
||||
if(level == 2 || level == 3){
|
||||
var kind2Data={
|
||||
0 :"1号封",
|
||||
1 :"2号封",
|
||||
2 :"3号封",
|
||||
3 :"5号封",
|
||||
4 :"6号封",
|
||||
5 :"7号封",
|
||||
6 :"8号（增票专用）",
|
||||
7 :"9号封"
|
||||
};
|
||||
var kind2 = kind2Data[$(".secondKind2Value").val()];
|
||||
}
|
||||
// 第三排
|
||||
else if(level == 4){
|
||||
var kind2Data={
|
||||
0 :"5号西式信封22*11cm",
|
||||
1 :"卡套定制款 9.4*6.4cm"
|
||||
};
|
||||
var kind2 = $(".thirdKind2Value").val();
|
||||
// 判断规格选颜色
|
||||
if(kind2 == 0){
|
||||
var color = $(".color11").val()
|
||||
}else{
|
||||
var color = $(".color22").val()
|
||||
}
|
||||
kind2 = $(".thirdKind2Value option:selected").text();
|
||||
}
|
||||
// 第一排
|
||||
else{
|
||||
var kind2Data={
|
||||
0 :"3号（中/西封）成品17.6*12.5CM",
|
||||
1 :"5号（中/西封）成品22*11CM",
|
||||
2 :"6号（中/西封）成品23*12CM",
|
||||
3 :"7号（中/西封）成品22.9*16.2CM",
|
||||
4 :"8号（中/西封）成品25*16.2CM",
|
||||
5 :"9号（中式）成品32.4*22.9CM",
|
||||
6 :"9号（西式）成品32.4*22.9CM"
|
||||
};
|
||||
var kind2 = kind2Data[$(".firstKind2Value").val()];
|
||||
}
|
||||
var kind = kindData[$('input[name="kindValue"]:checked').val()];
|
||||
var number= $("#number").val();
|
||||
if(color == null) color = ""
|
||||
var span_result = kind +'\n'+ kind2 + ' - ' + color +' (同款内容)\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = "";
|
||||
if($("#otherCount").css("display") == "none"){
|
||||
count = $("#count1 option:selected").val();
|
||||
}else{
|
||||
count = $("#count option:selected").val();
|
||||
}
|
||||
var size = "";
|
||||
if(level == 2 || level == 3){
|
||||
var secondKind2Value = $(".secondKind2Value option:selected").val();
|
||||
console.log(secondKind2Value);
|
||||
if(secondKind2Value == "0"){
|
||||
size = "16.5*10";
|
||||
}else if(secondKind2Value == "1"){
|
||||
size = "17.5*11";
|
||||
}else if(secondKind2Value == "2"){
|
||||
size = "17.6*12.5";
|
||||
}else if(secondKind2Value == "3"){
|
||||
size = "22*11";
|
||||
}else if(secondKind2Value == "4"){
|
||||
size = "23*12";
|
||||
}else if(secondKind2Value == "5"){
|
||||
size = "22.9*16.2";
|
||||
}else if(secondKind2Value == "6"){
|
||||
size = "25*16.2";
|
||||
}else{
|
||||
size = "32.4*22.9";
|
||||
}
|
||||
kind += "-" + kind2;
|
||||
}else if(level == 4){
|
||||
var thirdKind2Value = $(".thirdKind2Value option:selected").val();
|
||||
size = $(".thirdKind2Value option:selected").text()
|
||||
|
||||
}else{
|
||||
var sizeIndex = kind2.indexOf("品");
|
||||
size = kind2.substring(sizeIndex+1, kind2.length);
|
||||
size = size.replace("CM","");
|
||||
kind += "-" + kind2.substring(0, sizeIndex-1);
|
||||
}
|
||||
|
||||
getRemark("彩色信封", size, count+"个", kind, number, "", "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,279 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 复印纸 -->
|
||||
<style>
|
||||
.p{
|
||||
color:green;font-weight:400;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">复印纸<span style="color:red;font-weight:700;"> -自来稿件</span></h1>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="复印纸" >
|
||||
<p>
|
||||
印色
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="黑白" title="黑白" checked="checked">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="彩色" title="彩色">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
材料
|
||||
</p>
|
||||
<div class="layui-form-item heibai">
|
||||
<select name="kind2Value" id="kind2ValueHeibai" class="select kind2Value">
|
||||
<option value="60克双胶纸">60克双胶纸</option>
|
||||
<option value="80克双胶纸">80克双胶纸</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="layui-form-item color" style="display:none;">
|
||||
<select name="kind2Value" id="kind2ValueColor" class="select kind2Value">
|
||||
<option value="80克双胶纸">80克双胶纸</option>
|
||||
<!-- <option value="157克铜版纸">157克铜版纸</option>
|
||||
<option value="200克铜版纸">200克铜版纸</option>
|
||||
<option value="250克铜版纸">250克铜版纸</option>
|
||||
<option value="300克铜版纸">300克铜版纸</option> -->
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item sizeHeibai">
|
||||
<select name="size" id="sizeHeibai" class="select">
|
||||
<option value="19*13">19 * 13 cm</option>
|
||||
<option value="28.5*21">28.5 * 21 cm</option>
|
||||
<!-- <option value="42*28.5">42 * 28.5 cm</option> -->
|
||||
</select>
|
||||
</div>
|
||||
<div class="layui-form-item sizeColor" style="display:none;">
|
||||
<select name="size" id="sizeColor" class="select">
|
||||
<option value="19*13">19 * 13 cm</option>
|
||||
<option value="28.5*21">28.5 * 21 cm</option>
|
||||
<!-- <option value="42*28.5">42 * 28.5 cm</option> -->
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
数量（本）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<!-- <input type="text" placeholder="请输入整数" autocomplete="off" name="count" class="layui-input"> -->
|
||||
<select name="count" id="count" class="select">
|
||||
<option value="10">10</option>
|
||||
<option value="20">20</option>
|
||||
<option value="50">50</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
印面
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="kind3Value" class="danmian" value="单面" title="单面" checked="checked">
|
||||
<input type="radio" name="kind3Value" class="shuangmian" value="双面" title="双面">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<!-- <p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<span style="float:left;margin-top:12px">装订 ： </span>
|
||||
<input type="radio" name="craftMo" lay-filter="craftMo" value="订书机" title="订书机" checked="checked">
|
||||
<input type="radio" name="craftMo" lay-filter="craftMo" value="皮纹纸不印字胶装" title="皮纹纸不印字胶装">
|
||||
<input type="radio" name="craftMo" lay-filter="craftMo" value="钢圈装订" title="钢圈装订">
|
||||
<input type="radio" name="craftMo" lay-filter="craftMo" value="铜版纸装订" title="铜版纸装订">
|
||||
<input type="radio" name="craftMo" lay-filter="craftMo" value="无线精装" title="无线精装">
|
||||
</div> -->
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFeeTooWeight.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
$(".color").find(":input").attr("disabled", true);
|
||||
$(".sizeColor").find(":input").attr("disabled", true);
|
||||
var kindValueData;
|
||||
form.on('radio(kindValue)', function(data){
|
||||
kindValueData = data.value;
|
||||
if(kindValueData == "彩色"){
|
||||
$(".color").show();
|
||||
$(".color").find(":input").attr("disabled", false);
|
||||
$(".heibai").hide();
|
||||
$(".heibai").find(":input").attr("disabled", true);
|
||||
$(".sizeColor").show();
|
||||
$(".sizeColor").find(":input").attr("disabled", false);
|
||||
$(".sizeHeibai").hide();
|
||||
$(".sizeHeibai").find(":input").attr("disabled", true);
|
||||
|
||||
$(".shuangmian").attr("disabled", true);
|
||||
$('input[class = danmian]').prop('checked', true);
|
||||
$(".danmian").attr("disabled", false);// 加这个让按钮取消禁用模式
|
||||
}else if(kindValueData == "黑白"){
|
||||
$(".heibai").show();
|
||||
$(".heibai").find(":input").attr("disabled", false);
|
||||
$(".color").hide();
|
||||
$(".color").find(":input").attr("disabled", true);
|
||||
$(".sizeHeibai").show();
|
||||
$(".sizeHeibai").find(":input").attr("disabled", false);
|
||||
$(".sizeColor").hide();
|
||||
$(".sizeColor").find(":input").attr("disabled", true);
|
||||
|
||||
$(".shuangmian").attr("disabled", false);
|
||||
}
|
||||
form.render('radio');
|
||||
})
|
||||
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var kind = [$('input[name="kindValue"]:checked').val()];
|
||||
var kind2 = $("#kind2ValueHeibai").val();
|
||||
var kind3 = [$('input[name="kind3Value"]:checked').val()];
|
||||
var size = $("#sizeHeibai").val();
|
||||
if(kindValueData == "彩色"){
|
||||
var kind2 = $("#kind2ValueColor").val();
|
||||
var size = $("#sizeColor").val();
|
||||
}
|
||||
var number= $("#number").val();
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result = '复印纸 - ' + kind2 + ' - ' + size + 'cm - '+ kind +' - '+ kind3 + '(同款内容)\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "本，共" + data[i].price + "元" + '\n';
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "本，共" + data[i].price + "元" + '\n';
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = $("#count").val() + "本";
|
||||
var craft = $("input[name='kind3Value']:checked").val() + $("input[name='kindValue']:checked").val() + "印刷";
|
||||
getRemark($("#proTypeValue").val(), size, count, kind2, number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,112 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
<style>
|
||||
.fixedSizeCoupon,.fixedCountCoupon{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
#diySizeCoupon,#diyCountCoupon{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
.fixedSizeCoupon .layui-input,.fixedCountCoupon .layui-input{
|
||||
width:100%
|
||||
}
|
||||
.fixedSizeCoupon .layui-edge,.fixedCountCoupon .layui-edge{
|
||||
right:0px
|
||||
}
|
||||
</style>
|
||||
<input type="hidden" name="proTypeValue" class="layui-input" value="优惠券">
|
||||
<p>材质</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="2" title="300克铜版纸" checked="checked">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="0" title="157克铜版纸">
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item fixedSizeCoupon">
|
||||
<select name="size" id="fixedSizeCoupon" class="select">
|
||||
<option value="18*5.4">18*5.4 cm</option>
|
||||
<option value="15*5.4">15*5.4 cm</option>
|
||||
<option value="9*5.4">9*5.4 cm</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diySizeCoupon" style="display:none">
|
||||
<input type="text" name="size" id="diySizeCoupon" placeholder="格式:长*宽" class="layui-input" autocomplete="off">
|
||||
</span>
|
||||
<input type="checkbox" name="switchSize" class="switchSizeCoupon" lay-filter="switchSizeCoupon" title="自定义尺寸" lay-skin="primary">
|
||||
<span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item fixedCountCoupon">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diyCountCoupon" style="display:none">
|
||||
<input type="text" name="count" id="diyCountCoupon" placeholder="请输入整数" autocomplete="off"
|
||||
class="layui-input" lay-verify="number">
|
||||
</span>
|
||||
<input type="checkbox" name="switchCount" lay-filter="switchCountCoupon" title="自定义数量" lay-skin="primary">
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number"
|
||||
id="numberCoupon" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<script>
|
||||
layui.use(['form'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
|
||||
|
||||
// 默认没有选中复选框
|
||||
$('.switchSizeCoupon').val("off")
|
||||
// 自定义尺寸
|
||||
form.on('checkbox(switchSizeCoupon)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$('.switchSizeCoupon').val("on")
|
||||
$(".diySizeCoupon").show();
|
||||
$(".fixedSizeCoupon").hide();
|
||||
$(".diySizeCoupon").find(":input").attr("disabled", false);
|
||||
$(".fixedSizeCoupon").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$('.switchSizeCoupon').val("off")
|
||||
$(".fixedSizeCoupon").show();
|
||||
$(".diySizeCoupon").hide();
|
||||
$(".fixedSizeCoupon").find(":input").attr("disabled", false);
|
||||
$(".diySizeCoupon").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
// 自定义數量
|
||||
form.on('checkbox(switchCountCoupon)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$(".diyCountCoupon").show();
|
||||
$(".fixedCountCoupon").hide();
|
||||
$(".diyCountCoupon").find(":input").attr("disabled", false);
|
||||
$(".fixedCountCoupon").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".fixedCountCoupon").show();
|
||||
$(".diyCountCoupon").hide();
|
||||
$(".fixedCountCoupon").find(":input").attr("disabled", false);
|
||||
$(".diyCountCoupon").find(":input").attr("disabled", true);
|
||||
}
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
})
|
||||
})
|
||||
</script>
|
||||
@@ -0,0 +1,334 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- PVC证件21/会员卡24 -->
|
||||
<style>
|
||||
.edge .layui-edge {
|
||||
right: 20px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">PVC证件</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" value="PVC证件" class="layui-input">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select">
|
||||
<option value="1">0.84mm亮光</option>
|
||||
<option value="2">0.84mm磨砂</option>
|
||||
<option value="3">0.84mm哑光</option>
|
||||
<option value="4">1mm亮光</option>
|
||||
<option value="5">1mm磨砂</option>
|
||||
<option value="6">1mm哑光</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="size" id="size" lay-filter="size" class="select">
|
||||
<option value="85.5*54">85.5*54mm</option>
|
||||
<option value="100*69">100*69mm</option>
|
||||
<option value="120*80">120*80mm</option>
|
||||
<option value="130*90">130*90mm</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="count">
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" id="count" placeholder="请输入整数" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<div class="craftDiv">
|
||||
<p>工艺</p>
|
||||
<div class="layui-input-block craft">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="圆角矩形" title="圆角矩形">
|
||||
<input type="checkbox" name="craftSheng" lay-filter="switch" value="绳子" title="绳子">
|
||||
<div class="layui-inline edge ui_color" style="width:60px;display:none">
|
||||
<select name="color" class="select" lay-filter="color" id="color">
|
||||
<option value="蓝" selected>蓝</option>
|
||||
<option value="红">红</option>
|
||||
</select>
|
||||
</div>
|
||||
<input type="checkbox" name="ui_dk" lay-filter="switch" value="打孔" title="打孔">
|
||||
<span style="font-size:12px;color:red">打孔尺寸15*3mm</span>
|
||||
</div>
|
||||
<div>
|
||||
<input type="radio" name="craftShua" value="单面" title="单面" checked="checked">
|
||||
<input type="radio" name="craftShua" value="双面" title="双面">
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn" id="queryCondBtn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!-- <h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div> -->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
// 监听回车键，如果敲了回车，调用点击‘计算’
|
||||
$(document).keydown(function (e) {
|
||||
if (e.keyCode === 13) {
|
||||
$("#queryCondBtn").trigger("click");
|
||||
}
|
||||
});
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: {
|
||||
proTypeValue: $('#proTypeValue').val(),
|
||||
kindValue: $("#kindValue option:selected").val()
|
||||
},
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
form.on('select(kindValue)', (data) => {
|
||||
var html = " ";
|
||||
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: {
|
||||
proTypeValue: $("#proTypeValue").val(),
|
||||
kindValue: data.value
|
||||
},
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
|
||||
form.on('checkbox(switch)', function (data) {
|
||||
if (data.value == '绳子') {
|
||||
if (data.elem.checked) {
|
||||
$(".ui_color").show();
|
||||
} else {
|
||||
$(".ui_color").hide();
|
||||
}
|
||||
}
|
||||
});
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var kindValue = $("#kindValue option:checked").text();
|
||||
if (kindValue == "") {
|
||||
layer.msg("请选择材质！", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var kind2Value = $("#kind2Value option:checked").text();
|
||||
var number = $("#number").val();
|
||||
var count = $("#count").val();
|
||||
var size = $("#size").val();
|
||||
var shua = $("input[name='craftShua']:checked").val();
|
||||
var craft = $("input[name='craft']:checked").val();
|
||||
var dk = $("input[name='ui_dk']:checked").val();
|
||||
var sheng = $("input[name='craftSheng']:checked").val();
|
||||
var kindValueData = {
|
||||
1: "0.84mm亮光",
|
||||
2: "0.84mm磨砂",
|
||||
3: "0.84mm哑光",
|
||||
4: "1mm亮光",
|
||||
5: "1mm磨砂",
|
||||
6: "1mm哑光"
|
||||
};
|
||||
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
if (craft != null) {
|
||||
shua += craft;
|
||||
}
|
||||
if (sheng != null) {
|
||||
shua += $("#color option:checked").text() + sheng;
|
||||
}
|
||||
if (dk != null) {
|
||||
shua += dk;
|
||||
}
|
||||
|
||||
var span_result = "PVC证件" + ' - ' + kindValue + '-' + size + 'mm' + '-' + shua + ' -(同款内容)\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
getRemark("PVC证件", size + "mm", count + "张", kindValue, number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,313 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<style>
|
||||
.edge .layui-edge {
|
||||
right: 20px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<form class="layui-form">
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" lay-filter="kindValue" name="kindValue" value="0" title="奶茶手提杯托" checked>
|
||||
<input type="radio" lay-filter="kindValue" name="kindValue" value="1" title="蛋糕盒腰封">
|
||||
</div>
|
||||
</form>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="手提杯托">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" lay-filter="kind" name="kind" value="250克白卡纸" title="250克白卡纸" checked/>
|
||||
<input class="tea_type" type="radio" lay-filter="kind" name="kind" value="0.18mm哑白PVC"
|
||||
title="0.18mm哑白PVC"/>
|
||||
<input class="tea_type" type="radio" lay-filter="kind" name="kind" value="0.32mm哑白PVC"
|
||||
title="0.32mm哑白PVC"/>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米)<span style="font-size:14px;color:red">尺寸推荐:异形款30*60cm/常规款 单杯：14.4*38.6cm双杯：24*38.6cm</span>
|
||||
</p>
|
||||
<input type="text" name="size" placeholder="格式:长*宽" id="size" class="layui-input" autocomplete="off">
|
||||
<div class="select_size" style="display: none">
|
||||
<div class="layui-form-item">
|
||||
<select class="select" id="select_size" lay-filter="select_size">
|
||||
<option value="14*44">14*44cm(单杯)</option>
|
||||
<option value="27.8*44">27.8*44cm(双杯)</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
数量（张）
|
||||
<div class="count">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="8000">8000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="diyCount" style="display: none">
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" id="count" placeholder="请输入整数" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>工艺</p>
|
||||
<div class="layui-input-block" style="display:inline-block;">
|
||||
<input type="radio" name="craftMo" value="模切" title="模切" checked>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn" id="queryCondBtn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
getImage();
|
||||
// 监听回车键，如果敲了回车，调用点击‘计算’
|
||||
$(document).keydown(function (e) {
|
||||
if (e.keyCode === 13) {
|
||||
$("#queryCondBtn").trigger("click");
|
||||
}
|
||||
});
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
form.on("select(select_size)", function (data) {
|
||||
let value = $("#select_size option:selected").val();
|
||||
$("#size").val(value)
|
||||
})
|
||||
form.on("radio(kind)", function (data) {
|
||||
let html = ` <option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="8000">8000</option>
|
||||
<option value="10000">10000</option>`;
|
||||
$(".select_size").hide();
|
||||
$("#size").val("").show();
|
||||
if (data.value != "250克白卡纸") {
|
||||
html = `<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>`;
|
||||
$(".select_size").show();
|
||||
$("#size").hide();
|
||||
let value = $("#select_size option:selected").val();
|
||||
$("#size").val(value)
|
||||
}
|
||||
$("select[name='count']").empty().append(html)
|
||||
form.render();
|
||||
getImage();
|
||||
})
|
||||
form.on('radio(kindValue)', function (data) {
|
||||
$("input[name='kind'][value='250克白卡纸']").prop("checked", true);
|
||||
$(".tea_type").prop("disabled", true);
|
||||
if (data.value == "0") {
|
||||
$(".tea_type").prop("disabled", false);
|
||||
}
|
||||
$(".select_size").hide();
|
||||
$("#size").val("").show();
|
||||
let html = ` <option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="8000">8000</option>
|
||||
<option value="10000">10000</option>`;
|
||||
$("select[name='count']").empty().append(html)
|
||||
|
||||
form.render();
|
||||
|
||||
getImage();
|
||||
});
|
||||
|
||||
function getImage() {
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
let data = {
|
||||
proTypeValue: "手提杯托",
|
||||
kindValue: $("input[name='kindValue']:checked").val()
|
||||
}
|
||||
if ($("input[name='kindValue']:checked").val() == "0") {
|
||||
if ($("input[name='kind']:checked").val() == "250克白卡纸") {
|
||||
data.kind2Value = $("input[name='kind']:checked").val();
|
||||
} else {
|
||||
data.kind2Value = "PVC";
|
||||
}
|
||||
}
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: data,
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
form.render();
|
||||
}
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
// 选中‘自定义数量’
|
||||
var number = $("#number").val();
|
||||
var count = $("select[name='count'] option:selected").text();
|
||||
let size = $("#size").val();
|
||||
if (!size) {
|
||||
layer.msg('请输入正确尺寸！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
var span_result = size + "cm-" + $("input[name='kind']:checked").val() + $("input[name='kindValue']:checked").attr("title") + ' - 模切 (同款内容)\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,569 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- 杯套 -->
|
||||
<style>
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">杯套</h1>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="10">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" lay-filter="kindValue" name="kindValue" class="kindValue" value="0"
|
||||
title="白卡纸卡扣杯套300克(90-95口径通用)">
|
||||
<!--<input type="radio" lay-filter="kindValue" name="kindValue" class="kindValue" value="1" title="瓦楞纸杯套">-->
|
||||
<input type="radio" lay-filter="kindValue" name="kindValue" class="kindValue" value="3"
|
||||
title="300克手柄杯套(90-95口径通用)">
|
||||
<input type="radio" lay-filter="kindValue" name="kindValue" class="kindValue" value="4"
|
||||
title="300克异形手柄杯套(不限形状)">
|
||||
<!--<input type="radio" lay-filter="kindValue" name="kindValue" class="kindValue" value="2" title="异形杯套(不限形状)">-->
|
||||
<input type="radio" lay-filter="kindValue" name="kindValue" class="kindValue" value="5"
|
||||
title="铜版纸杯套300克">
|
||||
<input type="radio" lay-filter="kindValue" name="kindValue" class="kindValue" value="6"
|
||||
title="300克盲盒杯套">
|
||||
<input type="radio" lay-filter="kindValue" name="kindValue" class="kindValue" value="7"
|
||||
title="300克白卡三层瓦楞杯套">
|
||||
<input type="radio" lay-filter="kindValue" name="kindValue" class="kindValue" value="8"
|
||||
title="300克单层白卡杯套(90-96口径通用)">
|
||||
</div>
|
||||
</div>
|
||||
<div id="normal">
|
||||
<p>
|
||||
尺寸（mm）
|
||||
</p>
|
||||
<%-- <input type="radio" name="bkz_size" value="262*75mm" title="262*75mm" checked>--%>
|
||||
<%-- <input type="radio" name="bkz_size" value="270*75mm" title="270*75mm">--%>
|
||||
<input type="radio" name="bkz_size" value="272*78mm" title="272x78mm （高度6CM）" checked>
|
||||
<input type="radio" name="bkz_size" value="270*68mm" title="270x68mm （高度5CM）">
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div id="normal1">
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count1">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
<option value="20000">20000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div id="normal3">
|
||||
<p>
|
||||
尺寸（cm）
|
||||
</p>
|
||||
<input type="radio" name="s" class="size" value="29*7cm" title="29*7cm" checked id="sSize">
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count2">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div id="ui_kind5">
|
||||
<p>
|
||||
尺寸（cm）<span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="size" id="ui_size" placeholder="格式:长*宽" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count4">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="checkbox" name="craft" value="异形模切" title="异形模切" checked/>
|
||||
<input type="checkbox" name="craft" value="单面覆膜" title="双面覆哑膜" checked/>
|
||||
<input type="checkbox" name="craftTang" value="粘成品" title="粘成品" checked/>
|
||||
</div>
|
||||
</div>
|
||||
<div id="alien">
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" class="layui-input"
|
||||
id="count3">
|
||||
</div>
|
||||
</div>
|
||||
<div id="ui_kind6">
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="mh_size" value="290*70" title="290*70mm(盲盒手柄杯套)" checked>
|
||||
<input type="radio" name="mh_size" value="262*75" title="262*75mm(盲盒卡扣)" checked>
|
||||
</div>
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count4">
|
||||
<option value="5000">5000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div id="ui_kind7">
|
||||
<p>
|
||||
尺寸
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="mh_size" value="277*70" title="277*70mm" checked>
|
||||
</div>
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count5">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="4000">4000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="6000">6000</option>
|
||||
<option value="7000">7000</option>
|
||||
<option value="8000">8000</option>
|
||||
<option value="9000">9000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div id="ui_kind8">
|
||||
<p>
|
||||
尺寸
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<%-- <input type="radio" name="dc_size" value="262*76" title="262*76mm" checked>--%>
|
||||
<input type="radio" name="dc_size" value="247*71" title="247*71（90口径500-700ml）" checked>
|
||||
<input type="radio" name="dc_size" value="261*73" title="261*73（95口径500-700ml）">
|
||||
<input type="radio" name="dc_size" value="262*76" title="262*76（98口径500-700ml）">
|
||||
</div>
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count6">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
// 默认禁用异形杯套
|
||||
$("#alien").hide()
|
||||
$("#alien").find(":input").attr("disabled", true);
|
||||
$("#normal1").hide()
|
||||
$("#normal1").find(":input").attr("disabled", true);
|
||||
$("#normal3").hide()
|
||||
$("#normal3").find(":input").attr("disabled", true);
|
||||
$("#ui_kind5").hide();
|
||||
$("#ui_kind5").find(":input").attr("disabled", true);
|
||||
$("#ui_kind6").hide();
|
||||
$("#ui_kind6").find(":input").attr("disabled", true);
|
||||
$("#ui_kind7").hide();
|
||||
$("#ui_kind7").find(":input").attr("disabled", true);
|
||||
$("#ui_kind8").hide();
|
||||
$("#ui_kind8").find(":input").attr("disabled", true);
|
||||
/* form.on('checkbox(switchSizeCoupon)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$('.switchSizeCoupon').val("on")
|
||||
$(".ui_zdy_size").show();
|
||||
$(".ui_size").hide();
|
||||
$(".ui_zdy_size").find(":input").attr("disabled", false);
|
||||
$(".ui_size").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$('.switchSizeCoupon').val("off")
|
||||
$(".ui_size").show();
|
||||
$(".ui_zdy_size").hide();
|
||||
$(".ui_size").find(":input").attr("disabled", false);
|
||||
$(".ui_zdy_size").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
}); */
|
||||
form.on('radio(kindValue)', function (data) {
|
||||
if (data.value == 0 || data.value == 2) {
|
||||
$("#normal").show()
|
||||
$("#normal").find(":input").attr("disabled", false);
|
||||
} else {
|
||||
$("#normal").hide()
|
||||
$("#normal").find(":input").attr("disabled", true);
|
||||
}
|
||||
|
||||
if (data.value == 1) {
|
||||
$("#normal1").show()
|
||||
$("#normal1").find(":input").attr("disabled", false);
|
||||
} else {
|
||||
$("#normal1").hide()
|
||||
$("#normal1").find(":input").attr("disabled", true);
|
||||
}
|
||||
|
||||
if (data.value == 3 || data.value == 4) {
|
||||
$("#normal3").show()
|
||||
$("#normal3").find(":input").attr("disabled", false);
|
||||
} else {
|
||||
$("#normal3").hide()
|
||||
$("#normal3").find(":input").attr("disabled", true);
|
||||
}
|
||||
|
||||
if (data.value == 5) {
|
||||
$("#ui_kind5").show();
|
||||
$("#ui_kind5").find(":input").attr("disabled", false);
|
||||
} else {
|
||||
$("#ui_kind5").hide();
|
||||
$("#ui_kind5").find(":input").attr("disabled", true);
|
||||
}
|
||||
|
||||
if (data.value == 6) {
|
||||
$("#ui_kind6").show();
|
||||
$("#ui_kind6").find(":input").attr("disabled", false);
|
||||
} else {
|
||||
$("#ui_kind6").hide();
|
||||
$("#ui_kind6").find(":input").attr("disabled", true);
|
||||
}
|
||||
|
||||
if (data.value == 7) {
|
||||
$("#ui_kind7").show();
|
||||
$("#ui_kind7").find(":input").attr("disabled", false);
|
||||
} else {
|
||||
$("#ui_kind7").hide();
|
||||
$("#ui_kind7").find(":input").attr("disabled", true);
|
||||
}
|
||||
|
||||
if (data.value == 8) {
|
||||
$("#ui_kind8").show();
|
||||
$("#ui_kind8").find(":input").attr("disabled", false);
|
||||
} else {
|
||||
$("#ui_kind8").hide();
|
||||
$("#ui_kind8").find(":input").attr("disabled", true);
|
||||
}
|
||||
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
if (1) {
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: {
|
||||
proTypeValue: $("#proTypeValue").val(),
|
||||
kindValue: $('input[name="kindValue"]:checked').val()
|
||||
},
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var kindData = {
|
||||
0: "白卡纸杯套300克(90-95口径通用)",
|
||||
1: "300克瓦楞纸杯套",
|
||||
2: "300克异形杯套(不限形状)",
|
||||
3: "300克手柄杯套(90-95口径通用)",
|
||||
4: "300克异形手柄杯套(不限形状)",
|
||||
5: "铜版纸杯套300克",
|
||||
6: "300克盲盒杯套",
|
||||
7: "300克白卡三层瓦楞杯套",
|
||||
8: "300克单层白卡杯套(90-98口径通用)"
|
||||
};
|
||||
var kind = kindData[$('input[name="kindValue"]:checked').val()];
|
||||
var number = $("#number").val();
|
||||
var size = "";
|
||||
if (kind == "300克手柄杯套(90-98口径通用)" || kind == "300克异形手柄杯套(不限形状)") {
|
||||
size = $(".size").val();
|
||||
} else if (kind == "铜版纸杯套300克") {
|
||||
size = $("#ui_size").val();
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
if (kind == "300克异形杯套(不限形状)") {
|
||||
var span_result = '杯套 - ' + kind + ' - ' + size + 'cm\n';
|
||||
} else if (kind == "白卡纸杯套300克(90-95口径通用)") {
|
||||
size = $("input[name='bkz_size']:checked").val();
|
||||
var span_result = '杯套 - ' + kind + ' - ' + size + '\n';
|
||||
} else if (kind == "300克白卡三层瓦楞杯套") {
|
||||
var span_result = '杯套 - ' + kind + ' - 277*70 mm\n';
|
||||
} else if (kind == "300克单层白卡杯套(90-98口径通用)") {
|
||||
size = $("input[name='dc_size']:checked").attr("title");
|
||||
var span_result = '杯套 - ' + kind + ' - ' + size + ' \n';
|
||||
} else if (kind == "300克盲盒杯套") {
|
||||
var k = "";
|
||||
if ($("input[name='mh_size']:checked").val() == "290*70") {
|
||||
k = kind + '(300克盲盒手柄杯套)';
|
||||
} else {
|
||||
k = kind + '(300克盲盒卡扣)';
|
||||
}
|
||||
var span_result = '杯套 - ' + k + ' - ' + $("input[name='mh_size']:checked").val() + 'mm\n';
|
||||
} else if (kind == "铜版纸杯套300克") {
|
||||
var arr = [];
|
||||
$("input:checkbox[name='craft']:checked").each(function (i) {
|
||||
if (!$(this).is(':disabled')) {
|
||||
if ($(this).val() == "单面覆膜") {
|
||||
arr.push("双面覆哑膜");
|
||||
} else {
|
||||
arr.push($(this).val());
|
||||
}
|
||||
}
|
||||
});
|
||||
if ($("input[name='craftTang']:checked").val() != null) {
|
||||
arr.push($("input[name='craftTang']:checked").val());
|
||||
}
|
||||
var span_result = '杯套 - ' + kind + '-' + arr + ' - ' + $("#ui_size").val() + 'cm\n';
|
||||
} else {
|
||||
var span_result = '杯套 - ' + kind + ' - ' + [size] + '\n';
|
||||
//var span_result ='杯套 - ' + kind +'\n';
|
||||
}
|
||||
if (kind == "盲盒杯套") {
|
||||
if (number > 1) {
|
||||
span_result += number + '款 各5个内容' + data[0].count + "个，共" + data[0].price + "元" + '\n';
|
||||
} else {
|
||||
span_result += number + '款5个内容' + data[0].count + "个，共" + data[0].price + "元" + '\n';
|
||||
}
|
||||
} else {
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n';
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n';
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = $("select[name='count'] option:selected").val();
|
||||
var size = "";
|
||||
var type = $('input[name="kindValue"]:checked').val();
|
||||
if (type == 0) {
|
||||
size = $("input[name='bkz_size']").val();
|
||||
count = $("#count").val();
|
||||
} else if (type == 1) {
|
||||
size = "125*55mm";
|
||||
count = $("#count1 option:selected").val();
|
||||
} else if (type == 5) {
|
||||
size = $("#ui_size").val();
|
||||
count = $("#count4 option:selected").val();
|
||||
} else if (type == 7) {
|
||||
size = $("input[mh_size]").val();
|
||||
count = $("#count5 option:selected").val();
|
||||
} else if (type == 8) {
|
||||
size = $("input[dc_size]").val();
|
||||
count = $("#count6 option:selected").val();
|
||||
} else {
|
||||
size = $("#sSize").val();
|
||||
size = size.replace("cm", "");
|
||||
count = $("#count2 option:selected").val();
|
||||
}
|
||||
|
||||
//getRemark("杯套", size, count+"个", kind, number, "", "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '25%',
|
||||
align: "center",
|
||||
title: '重量约（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,311 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!--桌贴 -->
|
||||
<style>
|
||||
.edge .layui-edge{
|
||||
right:10px;
|
||||
}
|
||||
.layui-form-checkbox[lay-skin=primary] i{
|
||||
border-radius: 50px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
margin-top:3px;
|
||||
}
|
||||
.layui-form-checkbox[lay-skin=primary] span{
|
||||
color:black;
|
||||
margin-top:3px;
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">桌贴</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="22" >
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="kindValue" class="kindValue" value="0" title="0.38磨砂背胶" lay-filter="kindValue" checked="checked">
|
||||
<input type="radio" name="kindValue" class="kindValue" value="10" title="0.38亮光" lay-filter="kindValue">
|
||||
<input type="radio" name="kindValue" class="kindValue" value="1" title="0.84磨砂背胶" lay-filter="kindValue" class="thanHide">
|
||||
<!-- <input type="radio" name="kindValue" class="kindValue" value="2" title="0.38PVC亮光异型卡片" lay-filter="kindValue"> -->
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<!-- <div class="other"> -->
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" id="count" class="layui-input">
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
<!-- <div class="kindValue2">
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div> -->
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>工艺</p>
|
||||
<input type="radio" class="craftKkind" name="craftJiao" value="圆角矩形" title="圆角矩形" checked="checked">
|
||||
<span id="craftKkind">
|
||||
<input type="radio" name="craftJiao" value="直角矩形" title="直角矩形" >
|
||||
<input type="radio" name="craftJiao" value="异形" title="异形">
|
||||
</span>
|
||||
<div><!-- class="kindValue2" -->
|
||||
<input type="radio" name="craftShua" value="单面" title="单面" checked="checked">
|
||||
<input type="radio" name="craftShua" value="双面" title="双面">
|
||||
<!-- <input type="checkbox" name="craft" value="背胶" title="背胶"> -->
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
// 监听count输入框
|
||||
$(function(){
|
||||
//输入框的值改变时触发
|
||||
$("#count").on("input",function(e){
|
||||
//获取input输入的值
|
||||
if(e.delegateTarget.value > 100 && $('input[name="kindValue"]:checked').val() == "1"){
|
||||
layer.msg('超过100张请选择0.38磨砂背胶!',{offset:['300px','300px']},function(){});
|
||||
}
|
||||
});
|
||||
//输入框的值改变时触发
|
||||
$("#size").on("input",function(e){
|
||||
//获取input输入的值
|
||||
if($('input[name="kindValue"]:checked').val() == "2"){
|
||||
if(e.delegateTarget.value.indexOf(".") != -1){
|
||||
layer.msg('0.38PVC亮光异型卡片请输入整数尺寸!',{offset:['300px','300px']},function(){});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// 默认隐藏0.38PVC异形卡工艺
|
||||
$(".kindValue2").hide();
|
||||
$(".kindValue2").find(":input").attr("disabled", true);
|
||||
document.getElementById("craftKkind").style.display = "none"; //隐藏
|
||||
form.on('radio(kindValue)', function (data){
|
||||
if($("#count").val() > 100 && data.value == "1"){
|
||||
layer.msg('超过100张请选择0.38磨砂背胶!',{offset:['300px','300px']},function(){});
|
||||
}else if($("#size").val().indexOf(".") != -1 && data.value == "2"){
|
||||
layer.msg('0.38PVC亮光异型卡片请输入整数尺寸!',{offset:['300px','300px']},function(){});
|
||||
}
|
||||
|
||||
if(data.value == "2"){
|
||||
$(".kindValue2").show();
|
||||
$(".other").hide();
|
||||
$(".other").find(":input").attr("disabled", true);
|
||||
$(".kindValue2").find(":input").attr("disabled", false);
|
||||
document.getElementById("craftKkind").style.display = "inline-block"; //显示
|
||||
}else{
|
||||
$(".other").show();
|
||||
$(".kindValue2").hide();
|
||||
$(".kindValue2").find(":input").attr("disabled", true);
|
||||
$(".other").find(":input").attr("disabled", false);
|
||||
document.getElementById("craftKkind").style.display = "none"; //隐藏
|
||||
}
|
||||
// 切换的时候，选中【圆角矩形】
|
||||
$('input[class = craftKkind]').prop('checked', true);
|
||||
form.render('radio');
|
||||
})
|
||||
});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var kindData={
|
||||
0 :"0.38磨砂背胶",
|
||||
10 :"0.38亮光",
|
||||
1 :"0.84磨砂背胶",
|
||||
2 :"0.38PVC亮光异型卡片"
|
||||
};
|
||||
/* var craft = $('input[name="craft"]:checked').val() */
|
||||
var craftShua = $('input[name="craftShua"]:checked').val()
|
||||
var craftJiao = [$('input[name="craftJiao"]:checked').val()]
|
||||
var kind = kindData[$('input[name="kindValue"]:checked').val()];
|
||||
var number= $("#number").val();
|
||||
var size = $("#size").val();
|
||||
var count = $("#count").val();
|
||||
var length = size.split("*")[0];
|
||||
var width = size.split("*")[1];
|
||||
if(!size){
|
||||
layer.msg('请填写尺寸！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}else{
|
||||
if ((length > 43.5 || width > 43.5 && length > 30.1 || width > 30.1)) {
|
||||
layer.msg("尺寸不能大于43.5*30.1 cm",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
if(kind == '0.84磨砂背胶' && count >100){
|
||||
layer.msg('超过 100 张请选择0.38磨砂背胶!',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}else if(kind == '0.38PVC亮光异型卡片'){
|
||||
if (size.split("*")[0] < 3 || size.split("*")[1] < 3) {
|
||||
layer.msg("【0.38PVC亮光异型卡片】尺寸不能小于3*3 cm",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if(size.indexOf(".") != -1){
|
||||
layer.msg('【0.38PVC亮光异型卡片】请输入整数尺寸!',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
if ((size.split("*")[0] > 40 || size.split("*")[1] > 45) && (size.split("*")[0] > 45 || size.split("*")[1] > 40)) {
|
||||
layer.msg("【桌贴】尺寸不能超过43.5*38.5 cm",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result = '桌贴 - ' + kind +' - '+ size +' CM' + ' - ' + craftShua + ' - ' + craftJiao +'\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
craftShua += craftJiao;
|
||||
getRemark("桌贴", size, count+"张", kind, number, craftShua, "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,178 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 证书 -->
|
||||
<style>
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">证书</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="26" >
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" value="230克白卡纸" title="230克白卡纸" checked>
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="size1" value="28.5*21cm" title="28.5*21cm" checked>
|
||||
</div>
|
||||
<p>数量</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" id="count" placeholder="请输入整数" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var number = $("#number").val();
|
||||
var kindValue = $('input[name="kindValue"]:checked').val();
|
||||
var size = $('input[name="size1"]:checked').val();
|
||||
if ($("#count").val() > 1000) {
|
||||
layer.msg("数量大于1000 请单独报价！",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result ='证书 - ' + kindValue + ' - ' + size +'\n' + "工艺： " + "正面覆亮膜 + 中间压痕\n";
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = $("#count").val();
|
||||
size = size.replace("cm", "");
|
||||
getRemark("宣传单", size, count+"个", kindValue, number, "正面覆亮膜中间压痕", "（证书）");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,261 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!--滴塑 -->
|
||||
<style>
|
||||
.p {
|
||||
color: green;
|
||||
font-weight: 400;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">滴塑</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="23">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select">
|
||||
<option value="">请选择</option>
|
||||
<!--<option value="0">铜版纸滴塑</option>-->
|
||||
<option value="1">透明滴塑</option>
|
||||
<option value="2">PVC滴塑</option>
|
||||
<option value="3">亮银滴塑</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" id="count" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="checkbox" name="craft" lay-filter="craft" value="3m胶" title="3m胶">
|
||||
<input type="checkbox" name="craft" lay-filter="craft" class="yingbai" value="印白" title="印白">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
var carousel = layui.carousel;
|
||||
|
||||
ins = carousel.render({});
|
||||
|
||||
|
||||
function getProductImage(craft) {
|
||||
$("#carousel").empty();
|
||||
$(".layui-carousel-ind").remove();
|
||||
let kindvalue = $("select[name='kindValue'] option:selected").val();
|
||||
let data = {proTypeValue: '23', kindValue: kindvalue}
|
||||
if (craft != '' && craft == '印白') {
|
||||
delete data.kindValue;
|
||||
data.craftValue = craft;
|
||||
}
|
||||
let html = "";
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data,
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
form.on('checkbox(craft)', (data) => {
|
||||
getProductImage(data.elem.checked ? data.value : '')
|
||||
})
|
||||
|
||||
form.on('select(kindValue)', (data) => {
|
||||
let kindvalue = data.value;
|
||||
$('input[name="craft"]').prop("checked", false);
|
||||
$('input[name="craft"]').attr("disabled", false);
|
||||
if (kindvalue == '2') {
|
||||
$(".yingbai").attr("disabled", true);
|
||||
}
|
||||
form.render();
|
||||
getProductImage()
|
||||
})
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var number = $("#number").val();
|
||||
var size = $("#size").val();
|
||||
var count = $("#count").val();
|
||||
var kind = $("#kindValue option:selected").text();
|
||||
if (!size) {
|
||||
layer.msg('请填写尺寸！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if ((size.split("*")[0] > 35 || size.split("*")[1] > 50) && (size.split("*")[0] > 50 || size.split("*")[1] > 35)) {
|
||||
layer.msg("【滴塑】尺寸不能超过35*50 cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result = '滴塑 - ' + kind + '-' + size + ' CM (同款内容)\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
getRemark("滴塑", size, count + "个", kind, number, "", "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,45 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValueDoorList" class="layui-input" value="25">
|
||||
<p>材质</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" value="2" title="300克铜版纸" checked="checked">
|
||||
</div>
|
||||
<p>规格</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="size" id="sizeDoorList" class="select">
|
||||
<option value="21*9">21*9 cm</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>数量（个）</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="doorCount">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
<option value="20000">20000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number"
|
||||
id="numberDoorList" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-input-block doublefumo">
|
||||
<input type="checkbox" class="ui_door_fm" name="craft" lay-filter="switch" value="双面覆哑膜" title="双面覆哑膜">
|
||||
</div>
|
||||
@@ -0,0 +1,314 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 合版封套 -->
|
||||
<style>
|
||||
.layui-input{
|
||||
display:inline-block;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">合版封套</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr class="layui-bg-red">
|
||||
<form class="layui-form">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="k" class="k" lay-filter="k" value="0" title="常规封套">
|
||||
<!--<input type="radio" name="k" class="k" lay-filter="k" value="1" title="自定义封套">-->
|
||||
</div>
|
||||
</form>
|
||||
<form class="layui-form" id="envelopeForm">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="6" >
|
||||
<div class="cg" style="display: none">
|
||||
<%@include file="envelopeCG.jsp"%>
|
||||
</div>
|
||||
<div class="zdy" style="display: none">
|
||||
<%@include file="envelopeZDY.jsp"%>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<input type="checkbox" name="craft" class="tangjin" lay-filter="switch" value="单面局部烫金" title="单面局部烫金">
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn" id="queryCondBtn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFeeTooWeight.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
// 监听回车键，如果敲了回车，调用点击‘计算’
|
||||
$(document).keydown(function (e) {
|
||||
if (e.keyCode === 13) {
|
||||
$("#queryCondBtn").trigger("click");
|
||||
}
|
||||
});
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
// 选择是常规还是自定义
|
||||
form.on('radio(k)', function(data){
|
||||
//$("#envelopeForm")[0].reset();
|
||||
var level = data.value;//被点击的radio的value值
|
||||
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
// 常规
|
||||
if(level == 0){
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
proTypeValue : $("#proTypeValue").val(),
|
||||
},
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if(remark.indexOf("null") < 0){
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
if(result.length == 0){
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
}else{
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
$(".cg").show();
|
||||
$(".zdy").hide();
|
||||
$(".zdy").find(":input").attr("disabled", true);
|
||||
$(".cg").find(":input").attr("disabled", false);
|
||||
}else{
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
proTypeValue : $("#proTypeValue").val(),
|
||||
kindValue : $('input[name="kindValue"]:checked').val()
|
||||
},
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if(remark.indexOf("null") < 0){
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
if(result.length == 0){
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
}else{
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
$(".cg").hide();
|
||||
$(".zdy").show();
|
||||
$(".zdy").find(":input").attr("disabled", false);
|
||||
$(".cg").find(":input").attr("disabled", true);
|
||||
}
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var number= $("#number").val();
|
||||
// 自定义尺寸
|
||||
if(level == 1){
|
||||
var lengthSize = $(".lengthSize").val();
|
||||
var widthSize = $(".widthSize").val();
|
||||
var heightSize = $(".heightSize").val();
|
||||
if(lengthSize == "" || widthSize == "" || heightSize == ""){
|
||||
layer.msg("请填写正确的长宽高！",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
var arr = [];
|
||||
$("input:checkbox[name='craft']:checked").each(function(i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if(!$(this).is(':disabled')){
|
||||
arr.push($(this).val());
|
||||
}
|
||||
});
|
||||
var kindData={
|
||||
0 :"双面加膜",
|
||||
1 :"不加膜",
|
||||
},kind2Data={
|
||||
0 :"通用A4封套CY001#21.5*30*7",
|
||||
1 :"起墙5MM封套CY006#21.5*30.5*8",
|
||||
2 :"A5封套21.5*15*7",
|
||||
3 :"双舌头封套21.5*30.5*7"
|
||||
};
|
||||
var kind = kindData[$('input[name="kindValue"]:checked').val()];
|
||||
var kind2 = kind2Data[$("#kind2Value").val()];
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
// 常规
|
||||
if(level == 0){
|
||||
var span_result = '合版封套 - 300克铜版纸 - ' + kind +'\n'+ kind2 +' CM -(同款内容)\n' + '工艺： ' + arr + '\n';
|
||||
}else{
|
||||
var size = "长" + lengthSize+ " 宽" + widthSize+ " 舌头" + heightSize
|
||||
var span_result = '合版封套 - 300克铜版纸 - ' + kind +'\n'+ size +' CM -(同款内容)\n' + '工艺： ' + arr + '\n';
|
||||
}
|
||||
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var size = "";
|
||||
var count = "";
|
||||
if(level == 0){
|
||||
var sizeList = kind2.split("#");
|
||||
size = sizeList[1];
|
||||
count = $("#count option:selected").val();
|
||||
}else{
|
||||
size = lengthSize + "*" + widthSize + "*" + heightSize;
|
||||
count = $("#count1 option:selected").val();
|
||||
}
|
||||
|
||||
var craft = kind + arr;
|
||||
getRemark("封套", size, count+"个", "300克铜板纸", number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,36 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<p>材质</p>
|
||||
<input type="radio" title="300克铜版纸" checked="checked">
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="kindValue" class="kindValue" value="0" title="双面加膜" checked="checked">
|
||||
<input type="radio" name="kindValue" class="kindValue" value="1" title="不加膜">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kind2Value" id="kind2Value" class="select">
|
||||
<option value="0">通用A4封套--CY001#--21.5*30*7CM</option>
|
||||
<option value="1">起墙5MM--封套CY006#--21.9*30.5*8CM</option>
|
||||
<option value="2">A5封套--21.5*15*7CM</option>
|
||||
<option value="3">双舌头封套--21.5*30.5*7CM</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
</select>
|
||||
</div>
|
||||
@@ -0,0 +1,34 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
|
||||
<p>材质</p>
|
||||
<input type="radio" title="300克铜版纸" checked="checked">
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="kindValue" class="kindValue" value="0" title="双面加膜">
|
||||
<input type="radio" name="kindValue" class="kindValue" value="1" title="不加膜">
|
||||
</div>
|
||||
</div>
|
||||
<p>尺寸 <span style="font-size:14px;color:red">输入格式: 长 * 宽 * 舌头</span></p>
|
||||
<span>
|
||||
<input type="text" name="lengthSize" placeholder="长 cm" class="layui-input lengthSize" autocomplete="off" style="width:100px;">
|
||||
x
|
||||
<input type="text" name="widthSize" placeholder="宽 cm" class="layui-input widthSize" autocomplete="off" style="width:100px;">
|
||||
x
|
||||
<input type="text" name="heightSize" placeholder="舌头 cm" class="layui-input heightSize" autocomplete="off" style="width:100px;">
|
||||
</span>
|
||||
<p>数量（个）</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count1">
|
||||
<option value="200" selected="selected">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
@@ -0,0 +1,379 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- 扇子 -->
|
||||
<style>
|
||||
.p {
|
||||
color: green;
|
||||
font-weight: 400;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">扇子</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="18">
|
||||
<p>
|
||||
款式
|
||||
</p>
|
||||
<%-- <input type="radio" name="kindValue" lay-filter="kindValue" value="0" title="短铆钉">--%>
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="1" title="长铆钉" checked="checked">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="2" title="普通中柄（卡扣）">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="3" title="筷子柄">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="4" title="团扇">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="5" title="o柄">
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item kind1">
|
||||
<select name="kind2Value" id="kind2Value" lay-filter="kind2Value" class="select">
|
||||
<option value="0">15*16</option>
|
||||
<option value="1">16*17</option>
|
||||
<option value="2">17*18</option>
|
||||
<option value="3">17*19</option>
|
||||
<option value="4">18*19</option>
|
||||
<option value="5">19*20</option>
|
||||
<option value="6">19*21</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="layui-form-item kind2" style="display:none">
|
||||
<select name="kind2Value" id="kind3Value" lay-filter="kind2Value" class="select">
|
||||
<option value="0">15*15</option>
|
||||
<option value="1">16*16</option>
|
||||
<option value="2">17*17</option>
|
||||
<option value="3">18*18</option>
|
||||
<option value="4">19*19</option>
|
||||
<option value="5">20*20</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="layui-form-item kind3" style="display:none">
|
||||
<select name="kind2Value" id="kind4Value" lay-filter="kind2Value" class="select">
|
||||
<option value="0">20*28</option>
|
||||
<option value="1">24*33</option>
|
||||
<option value="2">21.5*34</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item" id="normal">
|
||||
<select name="count" id="count" lay-filter="count" class="select">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<div id="tsCount" style="display: none;">
|
||||
<select name="count1" id="count1" lay-filter="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>工艺</p>
|
||||
<div class="normalCraft"><input type="checkbox" name="craft" lay-filter="switch" value="异形" title="异形">
|
||||
</div>
|
||||
<div class="tsCraft" style="display: none;"><input type="checkbox" name="craft" lay-filter="switch"
|
||||
value="双面一样" title="双面一样"></div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
$(".kind2").find(":input").attr("disabled", true);
|
||||
$(".kind3").find(":input").attr("disabled", true);
|
||||
// 没切换款式的时候默认禁用其它的下拉框,（防止提交表单）
|
||||
$(".kind2").find(":input").attr("disabled", true);
|
||||
form.on('radio(kindValue)', function (data) {
|
||||
if (data.value == '3') {
|
||||
$(".kind2").show();
|
||||
$(".kind2").find(":input").attr("disabled", false);
|
||||
$(".kind1").hide();
|
||||
$(".kind1").find(":input").attr("disabled", true);
|
||||
$(".kind3").hide();
|
||||
$(".kind3").find(":input").attr("disabled", true);
|
||||
$("#tsCount").hide();
|
||||
$("#normal").show();
|
||||
$(".tsCraft").hide();
|
||||
$(".normalCraft").show();
|
||||
} else if (data.value == '4') {
|
||||
$("#tsCount").show();
|
||||
$("#normal").hide();
|
||||
//20240727隐藏
|
||||
$(".tsCraft").hide();
|
||||
$(".normalCraft").hide();
|
||||
$(".kind3").show();
|
||||
$(".kind3").find(":input").attr("disabled", false);
|
||||
$(".kind1").hide();
|
||||
$(".kind1").find(":input").attr("disabled", true);
|
||||
$(".kind2").hide();
|
||||
$(".kind2").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".kind1").show();
|
||||
$(".kind1").find(":input").attr("disabled", false);
|
||||
$(".kind2").hide();
|
||||
$(".kind2").find(":input").attr("disabled", true);
|
||||
$(".kind3").hide();
|
||||
$(".kind3").find(":input").attr("disabled", true);
|
||||
$("#tsCount").hide();
|
||||
$("#normal").show();
|
||||
$(".tsCraft").hide();
|
||||
$(".normalCraft").show();
|
||||
}
|
||||
getProductImage()
|
||||
});
|
||||
|
||||
function getProductImage() {
|
||||
|
||||
let kindValue = $("input[name='kindValue']:checked").val();
|
||||
|
||||
$("#carousel").empty();
|
||||
let data = {proTypeValue: "18", kindValue}
|
||||
let remark = "";
|
||||
let html = "";
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data,
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var fanKind = $('input[name="kindValue"]:checked').val();
|
||||
var kindData = {
|
||||
0: "短铆钉",
|
||||
1: "长铆钉",
|
||||
2: "普通中柄（卡扣）",
|
||||
3: "筷子柄",
|
||||
4: "团扇",
|
||||
5: "o柄"
|
||||
};
|
||||
if (fanKind == 3) {
|
||||
var kind2Data = {
|
||||
0: "15*15",
|
||||
1: "16*16",
|
||||
2: "17*17",
|
||||
3: "18*18",
|
||||
4: "19*19",
|
||||
5: "20*20"
|
||||
};
|
||||
} else if (fanKind == 4) {
|
||||
var kind2Data = {
|
||||
0: "20*28",
|
||||
1: "24*33",
|
||||
2: "21.5*34"
|
||||
}
|
||||
} else {
|
||||
var kind2Data = {
|
||||
0: "15*16",
|
||||
1: "16*17",
|
||||
2: "17*18",
|
||||
3: "17*19",
|
||||
4: "18*19",
|
||||
5: "19*20",
|
||||
6: "19*21"
|
||||
};
|
||||
}
|
||||
|
||||
var kind = kindData[$('input[name="kindValue"]:checked').val()];
|
||||
var kind2 = "";
|
||||
if (fanKind == 3) {
|
||||
kind2 = kind2Data[$("#kind3Value option:selected").val()];
|
||||
} else if (fanKind == 4) {
|
||||
kind2 = kind2Data[$("#kind4Value option:selected").val()];
|
||||
} else {
|
||||
kind2 = kind2Data[$("#kind2Value option:selected").val()];
|
||||
}
|
||||
var count = "";
|
||||
if ($('input[name="kindValue"]:checked').val() == 4) {
|
||||
count = $("#count1 option:selected").val();
|
||||
} else {
|
||||
count = $("#count option:selected").val();
|
||||
}
|
||||
var number = $("#number").val();
|
||||
var craft = [$('input[name="craft"]:checked').val()];
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
// 失败提示
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
var data = result.data.proList;
|
||||
if (kind2 == "20*28") {
|
||||
kind = "小团扇";
|
||||
} else if (kind2 == "24*33") {
|
||||
kind = "大团扇"
|
||||
} else if (kind2 == "21.5*34") {
|
||||
kind = "芭蕉扇";
|
||||
}
|
||||
var span_result = '扇子 - ' + kind + "-" + kind2 + 'cm - ' + craft + '(同款内容)\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
|
||||
getRemark("扇子", kind2, count + "个", kind, number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,231 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">仿古旗</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="仿古旗" />
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select" lay-search>
|
||||
<option value="1">春亚布</option>
|
||||
<option value="2">贡缎布</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" class="layui-input" id="count">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="craft" value="单面" title="单面" lay-filter="craft" checked>
|
||||
<input type="radio" name="craft" value="双面" title="双面" lay-filter="craft">
|
||||
<br>
|
||||
<input type="radio" name="craftShua" value="狼边" title="狼边" lay-filter="craft" checked>
|
||||
<input type="radio" name="craftShua" value="飘带" title="飘带" lay-filter="craft">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
proTypeValue : $("#proTypeValue").val(),
|
||||
},
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if(remark.indexOf("null") < 0){
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if(result.length == 0){
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
}else{
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var number= $("#number").val();
|
||||
var size = $("#size").val();
|
||||
var count = $("#count").val();
|
||||
var kind = $("#kindValue option:selected").text();
|
||||
var craft = $("input[name='craft']:checked").val();
|
||||
var craftShua = $("input[name='craftShua']:checked").val();
|
||||
if(!size){
|
||||
layer.msg('请填写尺寸！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}else if((size.split("*")[0] < 60 && size.split("*")[1] < 40) || (size.split("*")[0] < 40 && size.split("*")[1] <= 60)){
|
||||
layer.msg('最小尺寸60*40cm！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if(!count){
|
||||
layer.msg('请填写数量！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result = '仿古旗 - ' + kind + '-' + craft + '-' + craftShua + '-' + size +' CM (同款内容)\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,271 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 档案袋 -->
|
||||
<style>
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">档案袋</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="8" >
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select">
|
||||
<option value="0">150克白牛皮纸四色印刷</option>
|
||||
<option value="1">150克黄牛皮纸单色印刷</option>
|
||||
<option value="2">200克白牛皮纸四色印刷</option>
|
||||
<option value="3">140克双胶纸彩色印刷</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kind2Value" id="kind2Value" lay-filter="kind2Value" class="select">
|
||||
<option value="0">330*230*30*舌头50</option>
|
||||
<option value="1">340*240*30*舌头60</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" id="count" class="select">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
form.on('select(kindValue)', function (data){
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
proTypeValue : $("#proTypeValue").val(),
|
||||
kindValue : $("#kindValue").val(),
|
||||
kind2Value : $("#kind2Value").val()
|
||||
},
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
$("#remark").append(remark);
|
||||
if(result.length == 0){
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
}else{
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: '700px', //设置容器宽度
|
||||
height: '700px'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
form.on('select(kind2Value)', function (data){
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
proTypeValue : $("#proTypeValue").val(),
|
||||
kindValue : $("#kindValue").val(),
|
||||
kind2Value : $("#kind2Value").val()
|
||||
},
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
$("#remark").append(remark);
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: '700px', //设置容器宽度
|
||||
height: '700px'
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
var kindData={
|
||||
0 :"150克白牛皮纸四色印刷",
|
||||
1 :"150克黄牛皮纸单色印刷",
|
||||
2 :"200克白牛皮纸四色印刷",
|
||||
3 :"140克双胶纸彩色印刷"
|
||||
};
|
||||
var kind2Data={
|
||||
0 :"330*230*30*舌头50",
|
||||
1 :"340*240*30*舌头60"
|
||||
};
|
||||
var kind = kindData[$("#kindValue").val()];
|
||||
var kind2 = kind2Data[$("#kind2Value").val()];
|
||||
var number= $("#number").val();
|
||||
|
||||
var span_result ='档案袋 - ' + kind +'\n'+ kind2 +' -(同款内容)\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var size = kind2.replace("舌头50", "");
|
||||
var count = $("#count option:selected").val();
|
||||
getRemark("档案袋", size+"mm", count+"个", kind, number, "", "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,333 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 吊旗 -->
|
||||
<style>
|
||||
.p{
|
||||
color:green;font-weight:400;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">吊旗</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="13" >
|
||||
<p>材质</p>
|
||||
<div class="kindValue">
|
||||
<input type="radio" lay-filter="kindValue" name="kindValue" value="2" title="300克铜版纸" checked="checked">
|
||||
<input type="radio" lay-filter="kindValue" name="kindValue" value="1" title="200克铜版纸">
|
||||
<input type="radio" lay-filter="kindValue" name="kindValue" value="0" title="157克铜版纸">
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
<!--<span class="ui_normal_size"><input type="checkbox" name="normalSize" lay-filter="ui_normal_size" title="通用款"></span>-->
|
||||
</p>
|
||||
<div class="layui-form-item ui_cg">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<div class="ui_normal">
|
||||
<input type="radio" name="size" value="28.5*21" title="28.5*21cm" checked="checked">
|
||||
<input type="radio" name="size" value="28.5*42" title="28.5*42cm">
|
||||
<input type="hidden" name="kind1Label" id="kind1Label" value="">
|
||||
</div>
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item ui_cg">
|
||||
<select name="count" id="count" class="select">
|
||||
<option value="10">10</option>
|
||||
<option value="20">20</option>
|
||||
<option value="30">30</option>
|
||||
<option value="50">50</option>
|
||||
<option value="100">100</option>
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="ui_normal">
|
||||
<select name="count" id="count1" class="select">
|
||||
<option value="100">100</option>
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
</select>
|
||||
</div>
|
||||
<p><span style="font-size:14px;color:red">提示:数量超过500个请以 [ 宣传单 - 商务200克铜版纸 - 异形模切 ] 报价</span></p>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
形状 <span style="font-size:14px;color:red">(吊旗 - 数量50个以内不限形状;50个及以上默认[ U型 ])</span>
|
||||
</p>
|
||||
<div>
|
||||
<input type="checkbox" lay-filter="craftU" class="craftU" name="craftU" value="U型" title="U型">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div>
|
||||
<input type="checkbox" lay-filter="craft" class="craft" name="craft" value="绳子" title="绳子">
|
||||
<span class="ui_sz">
|
||||
<input type="text" placeholder="请输入绳子长度" name="ui_sz_size" style="width: 100px"/>米
|
||||
</span>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFeeTooWeight.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
$(".ui_normal").hide();
|
||||
$(".ui_normal").find(":input").attr("disabled", true);
|
||||
$(".ui_sz").hide();
|
||||
$(".ui_sz").find(":input").attr("disabled", true);
|
||||
|
||||
// 监听数量--50个以上勾选复选框 [U型]
|
||||
form.on('select(count)', function(data) {
|
||||
if(data.value >= 50){
|
||||
$('input[class = craftU]').prop('checked', true);
|
||||
// $(".craftU").attr("disabled", true);
|
||||
}else{
|
||||
$('input[class = craftU]').prop('checked', false);
|
||||
}
|
||||
form.render();
|
||||
});
|
||||
|
||||
//监听材质
|
||||
form.on('radio(kindValue)', function(data){
|
||||
if(data.value == 2){
|
||||
$(".ui_normal_size").show();
|
||||
}else{
|
||||
$(".ui_normal_size").hide();
|
||||
}
|
||||
});
|
||||
|
||||
// 监听U型按钮，50个以上取消提示做其他产品
|
||||
form.on('checkbox(craftU)', function(data) {
|
||||
var kindValue = $('input[name="kindValue"]:checked').val();
|
||||
var count = $("#count option:checked").val();
|
||||
if(count >= 50){
|
||||
if(!data.elem.checked){
|
||||
if(kindValue == 2){
|
||||
layer.msg("[ 吊旗 - 300克铜版纸 ] 50个以上，取消[ U型 ]请以 [ 卡片 - 名片 ] 报价",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}else if(kindValue == 1){
|
||||
layer.msg("[ 吊旗 - 200克铜版纸 ] 50个及以上，取消[ U型 ]请以 [ 宣传单 - 商务200克铜版纸 ] 报价",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}else if(kindValue == 0){
|
||||
layer.msg("[ 吊旗 - 157克铜版纸 ] 50个及以上，取消[ U型 ]请以 [ 宣传单 - 商务157克铜版纸 ] 报价",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
form.on('checkbox(ui_normal_size)', function(data){
|
||||
if(data.elem.checked){
|
||||
$(".ui_normal").show();
|
||||
$(".ui_normal").find(":input").attr("disabled", false);
|
||||
$(".ui_cg").hide();
|
||||
$(".ui_cg").find(":input").attr("disabled", true);
|
||||
$("#kind1Label").attr("value", 2);
|
||||
$('input[class = craftU]').prop('checked', true);
|
||||
}else{
|
||||
$(".ui_cg").show();
|
||||
$(".ui_cg").find(":input").attr("disabled", false);
|
||||
$(".ui_normal").hide();
|
||||
$(".ui_normal").find(":input").attr("disabled", true);
|
||||
$('input[class = craftU]').prop('checked', false);
|
||||
$("#kind1Label").attr("value", "");
|
||||
}
|
||||
form.render('checkbox');
|
||||
});
|
||||
|
||||
form.on('checkbox(craft)', function(data){
|
||||
if(data.elem.checked){
|
||||
$(".ui_sz").show();
|
||||
$(".ui_sz").find(":input").attr("disabled", false);
|
||||
}else{
|
||||
$(".ui_sz").hide();
|
||||
$(".ui_sz").find(":input").attr("disabled", true);
|
||||
}
|
||||
form.render('checkbox');
|
||||
});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var kindValue = $('input[name="kindValue"]:checked').val()
|
||||
var count = $("#count option:checked").val();
|
||||
if (!$(".craftU").is(':checked') && kindValue == 2 && count >= 50) {
|
||||
layer.msg("[ 吊旗 - 300克铜版纸 ] 50个及以上，取消[ U型 ]请以 [ 卡片 - 名片 ] 报价",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}else if (!$(".craftU").is(':checked') && kindValue == 1 && count >= 50) {
|
||||
layer.msg("[ 吊旗 - 200克铜版纸 ] 50个及以上，取消[ U型 ]请以 [ 宣传单 - 商务200克铜版纸 ] 报价",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}else if (!$(".craftU").is(':checked') && kindValue == 0 && count >= 50) {
|
||||
layer.msg("[ 吊旗 - 157克铜版纸 ] 50个及以上，取消[ U型 ]请以 [ 宣传单 - 商务157克铜版纸 ] 报价",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var kindData={
|
||||
2 :"300克铜版纸",
|
||||
1 :"200克铜版纸",
|
||||
0 :"157克铜版纸"
|
||||
};
|
||||
var kind = kindData[kindValue];
|
||||
var size = $("#size").val();
|
||||
var number= $("#number").val();
|
||||
var kind1Label = $("#kind1Label").val();
|
||||
if ((size.split("*")[0] > 73 || size.split("*")[1] > 56) && (size.split("*")[0] > 56 || size.split("*")[1] > 73)) {
|
||||
layer.msg("[ 吊旗 ] 尺寸超过 73*56 cm的请以 [ 卡片 - 名片 ] 报价",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if(size.indexOf("*") < 0 && kind1Label != 2){
|
||||
layer.msg('请填写尺寸！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var sz_size = $("input[name='ui_sz_size']").val();
|
||||
if($("input[name='craft']:checked").val() == "绳子"){
|
||||
if(sz_size == ""){
|
||||
layer.msg('请输入绳子长度！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
var arr = [];
|
||||
$("input:checkbox[name='craftU']:checked").each(function(i) {
|
||||
if(!$(this).is(':disabled')){
|
||||
arr.push($(this).val());
|
||||
}
|
||||
});
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
if(kind1Label == "2"){
|
||||
size = $("input[name='size']:checked").val();
|
||||
kind += "(通用款)";
|
||||
}
|
||||
if($("input[name='craft']:checked").val() == "绳子"){
|
||||
arr += ",绳子" + sz_size +"米";
|
||||
}
|
||||
var span_result = '吊旗 - ' + kind +' - '+ size +' CM -' + arr +' -(同款内容)\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = $("#count option:selected").val();
|
||||
getRemark("吊旗", size, count+"个", kind, number, arr, "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,382 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- 宣传单 -->
|
||||
<style>
|
||||
.edge .layui-edge {
|
||||
right: 10px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">宣传单</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select">
|
||||
<option value="0">双胶80克彩色印刷</option>
|
||||
<option value="1">商务250克铜版纸</option>
|
||||
<option value="2">商务200克铜版纸</option>
|
||||
<option value="3" selected="selected">商务157克铜版纸</option>
|
||||
</select>
|
||||
</div>
|
||||
</form>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="14">
|
||||
<!-- <p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kind2Value" id="kind2Value" lay-filter="kind2Value" class="select">
|
||||
<option value="0">42*28.5 CM</option>
|
||||
<option value="1" selected="selected">28.5*21 CM</option>
|
||||
<option value="2">21*14 CM</option>
|
||||
</select>
|
||||
</div> -->
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" lay-verify="required"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" id="count" class="select">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-input-block craft">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="折页" title="折页">
|
||||
<div class="layui-inline edge zheyeHide" style="width: 60px; display:none">
|
||||
<select name="zheye" class="select zheye" lay-filter="zheye">
|
||||
<option value="1" selected>1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
<option value="6">6</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="layui-inline edge zheyeHide" style="width: 120px; display:none">
|
||||
<select name="ui_type" id="ui_type">
|
||||
<option value="1">对折</option>
|
||||
<option value="2">荷包折</option>
|
||||
<option value="3">对对折</option>
|
||||
<option value="4">外三折</option>
|
||||
<option value="5">四联风琴折</option>
|
||||
<option value="6">五联风琴折</option>
|
||||
</select>
|
||||
</div>
|
||||
<input type="checkbox" name="craft" class="disab yh" lay-filter="switch" value="压痕" title="压痕" disabled>
|
||||
<div class="layui-inline edge yahenHide" style="width: 60px; display:none">
|
||||
<select name="yahen" class="select yahen" lay-filter="yahen">
|
||||
<option value="1" selected>1</option>
|
||||
<option value="2">2</option>
|
||||
<option value="3">3</option>
|
||||
<option value="4">4</option>
|
||||
<option value="5">5</option>
|
||||
<option value="6">6</option>
|
||||
</select>
|
||||
</div>
|
||||
<input type="checkbox" name="craft" class="disab fm" lay-filter="switch" value="单面覆膜" title="单面覆膜"
|
||||
disabled>
|
||||
<input type="checkbox" name="craft" class="disab fm" lay-filter="switch" value="双面覆膜" title="双面覆膜"
|
||||
disabled>
|
||||
<input type="checkbox" name="craft" class="disab mq" lay-filter="switch" value="模切" title="异形模切">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
var checkZheye = 0;
|
||||
form.on('checkbox(switch)', function (data) {
|
||||
// 覆膜只能选一个
|
||||
var fumoLen = $(".fm:checked").length;
|
||||
if (fumoLen > 1) {
|
||||
$(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg('[ 单面覆膜 - 双面覆膜 ]不能同时选择！', {
|
||||
offset: ['300px', '300px']
|
||||
}, {icon: 5});
|
||||
return false;
|
||||
}
|
||||
if (data.value == '折页') {
|
||||
if (data.elem.checked) {
|
||||
$(".zheyeHide").show();
|
||||
checkZheye = 1;
|
||||
} else {
|
||||
$(".zheyeHide").hide();
|
||||
checkZheye = 0;
|
||||
}
|
||||
}
|
||||
if (data.value == '压痕') {
|
||||
if (data.elem.checked) {
|
||||
$(".yahenHide").show();
|
||||
} else {
|
||||
$(".yahenHide").hide();
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
function setRemark() {
|
||||
let kindValue = $("select[name='kindValue'] option:checked").val();
|
||||
$("#remark").empty();
|
||||
let html = '';
|
||||
if(kindValue == 3){
|
||||
html = '预计发货时间：<br>福建：直角裁切 (2-3天发货) 圆通 顺丰 <br>江苏：直角裁切 (2-3天发货) 韵达 顺丰<br>福建：直角折页 (3-4天发货) 圆通 顺丰 <br>江苏：直角折页 (3-4天发货) 韵达 顺丰<br>福建：异形模切 (4-5天发货) 圆通 顺丰'
|
||||
}
|
||||
if(kindValue == 2){
|
||||
html = '预计发货时间：<br>江苏：直角裁切 (2-3天发货) 韵达 顺丰<br>江苏：直角折页/压痕 (3-4天发货) 韵达 顺丰<br>江苏：异形模切 (4-5天发货) 韵达 顺丰'
|
||||
}
|
||||
if(kindValue == 1){
|
||||
html = '预计发货时间：<br>江苏：直角裁切 (2-3天发货) 韵达 顺丰<br>江苏：直角折页/压痕 (3-4天发货) 韵达 顺丰<br>江苏：异形模切 (4-5天发货) 韵达 顺丰'
|
||||
}
|
||||
if(kindValue == 0){
|
||||
html = '预计发货时间：<br>江苏：直角裁切 (2-3天发货) 韵达 顺丰<br>江苏：直角折页/压痕 (3-4天发货) 韵达 顺丰<br>福建：异形模切 (4-5天发货) 圆通 顺丰'
|
||||
}
|
||||
|
||||
$("#remark").append('<div><span>' + html + '<span/></div>');
|
||||
|
||||
}
|
||||
|
||||
form.on('select(kindValue)', function (data) {
|
||||
// 80克、157克纸张的时候无覆膜
|
||||
if (data.value == "0" || data.value == "3") {
|
||||
$(".disab").attr("disabled", true);
|
||||
} else {
|
||||
$(".disab").attr("disabled", false);
|
||||
}
|
||||
|
||||
// 157克铜版纸的时候可以选择模切
|
||||
if (data.value == "3") {
|
||||
$(".mq").attr("disabled", false);
|
||||
}
|
||||
form.render('checkbox');
|
||||
setRemark()
|
||||
});
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var kindData = {
|
||||
0: "双胶80克彩色印刷",
|
||||
1: "250克铜版纸",
|
||||
2: "200克铜版纸",
|
||||
3: "157克铜版纸"
|
||||
};
|
||||
var kind2Data = {
|
||||
0: "42*28.5 CM",
|
||||
1: "28.5*21 CM",
|
||||
2: "21*14 CM"
|
||||
};
|
||||
var kind = kindData[$("#kindValue").val()];
|
||||
var kind2 = kind2Data[$("#kind2Value").val()];
|
||||
var number = $("#number").val();
|
||||
var size = $("#size").val();
|
||||
if ((size.split("*")[0] > 140 || size.split("*")[1] > 110) && (size.split("*")[0] > 110 || size.split("*")[1] > 140)) {
|
||||
layer.msg("宣传单尺寸不能超过140*110 cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (((size.split("*")[0] < 10 || size.split("*")[1] < 14) && (size.split("*")[0] < 14 || size.split("*")[1] < 10)) && checkZheye == 1) {
|
||||
layer.msg("14*10 cm 以下无法‘折’", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
// 判断能否折
|
||||
var bigSize = parseInt(size.split("*")[0] / 9) > parseInt(size.split("*")[1] / 9) ? parseInt(size.split("*")[0] / 9) : parseInt(size.split("*")[1] / 9)
|
||||
if (bigSize < $(".zheye").val() && checkZheye == 1) {
|
||||
layer.msg("该尺寸无法" + $(".zheye").val() + " 折！！每一页的成品不能小于9 cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var arr = [];
|
||||
$("input:checkbox[name='craft']:checked").each(function (i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if (!$(this).is(':disabled')) {
|
||||
arr.push($(this).val());
|
||||
}
|
||||
});
|
||||
console.log('-----选中的值-----', arr);
|
||||
if ($("#kindValue").val() == 1 || $("#kindValue").val() == 2) {
|
||||
if (arr[0] == '折页' && arr[1] != '压痕') {
|
||||
layer.msg("200克以上材质折页必须选压痕", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result = "宣传单 - " + kind + ' - ' + size + ' 厘米 -(同款内容)\n' + "工艺 :" + arr + "\n";
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = $("#count option:selected").val();
|
||||
var craft = "";
|
||||
for (let i = 0; i < arr.length; i++) {
|
||||
if (arr[i].indexOf("折页") >= 0) {
|
||||
console.log(arr[i]);
|
||||
craft = $("#ui_type option:selected").text();
|
||||
} else {
|
||||
craft += arr[i];
|
||||
}
|
||||
}
|
||||
console.log(craft);
|
||||
getRemark("宣传单", size, count + "个", kind, number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
},/* {
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价',
|
||||
templet : function(d) {
|
||||
return Math.ceil(d.price * 0.98)
|
||||
}
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价',
|
||||
templet : function(d) {
|
||||
return Math.ceil(d.price * 0.96)
|
||||
}
|
||||
}, */{
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,268 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!--手绘 -->
|
||||
<style>
|
||||
.p {
|
||||
color: green;
|
||||
font-weight: 400;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">手绘</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="手绘">
|
||||
<p>
|
||||
类型
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="1" title="餐饮（烘焙/饮品/菜品）" checked>
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="2" title="宠物">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="3" title="原创（客户只提供文案 设计手绘）">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="4" title="地图">
|
||||
<%-- <input type="radio" name="kindValue" lay-filter="kindValue" value="5" title="风裳旗舰店">--%>
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="6" title="人物">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="7" title="人物+背景">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="8" title="婚礼">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="9" title="班旗">
|
||||
</div>
|
||||
<p>
|
||||
难度
|
||||
</p>
|
||||
<div class="layui-form-item" id="difficulty">
|
||||
|
||||
</div>
|
||||
<p>
|
||||
数量（个） <span style="font-size:14px;color:red">默认一个无法修改</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" id="count" class="layui-input"
|
||||
value="1" readonly>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
var carousel = layui.carousel;
|
||||
|
||||
ins = carousel.render({});
|
||||
|
||||
|
||||
function getProductImage() {
|
||||
$("#carousel").empty();
|
||||
$(".layui-carousel-ind").remove();
|
||||
let kindvalue = $("input[name='kindValue']:checked").val();
|
||||
let data = {proTypeValue: '手绘', kindValue: kindvalue}
|
||||
let html = "";
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data,
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
form.on('radio(kindValue)', (data) => {
|
||||
let kindvalue = data.value;
|
||||
$("#difficulty").empty();
|
||||
let html = ``;
|
||||
if (kindvalue == 4 || kindvalue == 5) {
|
||||
html = `<input type="radio" name="kind1Value" lay-filter="kind1Value" value="1" title="简易" checked/>
|
||||
<input type="radio" name="kind1Value" lay-filter="kind1Value" value="2" title="复杂"/>`;
|
||||
}
|
||||
if (kindvalue == 6 || kindvalue == 8) {
|
||||
html = `<input type="radio" name="kind1Value" lay-filter="kind1Value" value="1" title="半身" checked/>
|
||||
<input type="radio" name="kind1Value" lay-filter="kind1Value" value="2" title="全身"/>`;
|
||||
}
|
||||
$("#difficulty").append(html);
|
||||
form.render();
|
||||
getProductImage()
|
||||
})
|
||||
let kind_name = [
|
||||
"",
|
||||
"餐饮（烘焙/饮品/菜品）",
|
||||
"宠物",
|
||||
"原创（客户只提供文案 设计手绘）",
|
||||
"地图",
|
||||
"风裳旗舰店",
|
||||
"人物",
|
||||
"人物+背景",
|
||||
"婚礼",
|
||||
"班旗",
|
||||
]
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var number = $("#number").val();
|
||||
var size = $("#size").val();
|
||||
var count = $("#count").val();
|
||||
var kind = $("input[name='kindValue']:checked").val();
|
||||
var kind1Value = $("input[name='kind1Value']:checked").val();
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
let type = "";
|
||||
if (kind1Value) {
|
||||
type = "-"
|
||||
if (kind == 4 || kind == 5) {
|
||||
type += kind1Value == 1 ? "简易" : "复杂"
|
||||
}
|
||||
if (kind == 6 || kind == 8) {
|
||||
type += kind1Value == 1 ? "半身" : "全身"
|
||||
}
|
||||
}
|
||||
|
||||
var span_result = '手绘 - ' + kind_name[kind] + type + ' (同款内容)\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
getRemark("手绘", size, count + "个", kind, number, "", "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,58 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="15">
|
||||
<p>材质</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="2" title="300克铜版纸" checked="checked">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="1" title="200克铜版纸">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="0" title="157克铜版纸">
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="size" id="sizeGirdle" placeholder="格式:长*宽" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量（张）<input type="checkbox" name="switchCount" lay-filter="switchCount" title="自定义数量">
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number"
|
||||
id="numberGirdle" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-input-block" style="display:inline-block;">
|
||||
<input type="checkbox" name="craft" class="fm" lay-filter="switch" value="单面亮膜" title="单面亮膜">
|
||||
</div>
|
||||
<div class="layui-input-block" style="display:inline-block;">
|
||||
<input type="checkbox" name="craft" class="fm" lay-filter="switch" value="单面哑膜" title="单面哑膜">
|
||||
</div>
|
||||
<div class="layui-input-block" style="display:inline-block;">
|
||||
<input type="checkbox" name="craft" class="mq" lay-filter="switchMQ" value="模切" title="异形模切">
|
||||
</div>
|
||||
<div class="layui-input-block" style="display:inline-block;">
|
||||
<input type="checkbox" name="craft" value="粘盒" title="粘盒">
|
||||
</div>
|
||||
<div class="layui-input-block" style="display:inline-block;">
|
||||
<input type="checkbox" name="craft" value="烫金" title="烫金">
|
||||
</div>
|
||||
@@ -0,0 +1,115 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
<style>
|
||||
.fixedSizeGreetCard,.fixedCountGreetCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
#diySizeGreetCard,#diyCountGreetCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
.fixedSizeGreetCard .layui-input,.fixedCountGreetCard .layui-input{
|
||||
width:100%
|
||||
}
|
||||
.fixedSizeGreetCard .layui-edge,.fixedCountGreetCard .layui-edge{
|
||||
right:0px
|
||||
}
|
||||
</style>
|
||||
<input type="hidden" name="proTypeValue" class="layui-input" value="贺卡">
|
||||
<p>材质</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="2" title="300克铜版纸">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="3" title="300克珠光纸">
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<span class="layui-form-item fixedSizeGreetCard">
|
||||
<select name="size" id="fixedSizeGreetCard" class="select">
|
||||
<option value="15*10">15*10 cm</option>
|
||||
<option value="14*9">14*9 cm</option>
|
||||
<option value="11*9">11*9 cm</option>
|
||||
</select>
|
||||
</span>
|
||||
<span class="diySizeGreetCard" style="display:none">
|
||||
<input type="text" name="size" id="diySizeGreetCard" placeholder="格式:长*宽" class="layui-input" autocomplete="off">
|
||||
</span>
|
||||
<input type="checkbox" name="switchSize" class="switchSizeGreetCard" lay-filter="switchSizeGreetCard" title="自定义尺寸" lay-skin="primary">
|
||||
<span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item fixedCountGreetCard">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diyCountGreetCard" style="display:none">
|
||||
<input type="text" name="count" id="diyCountGreetCard" placeholder="请输入整数" autocomplete="off"
|
||||
class="layui-input" lay-verify="number">
|
||||
</span>
|
||||
<input type="checkbox" name="switchCount" lay-filter="switchCountGreetCard" title="自定义数量" lay-skin="primary">
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number"
|
||||
id="numberGreetCard" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
|
||||
<script>
|
||||
layui.use(['table','form'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
|
||||
// 默认没有选中复选框
|
||||
$('.switchSizeGreetCard').val("off")
|
||||
// 自定义尺寸
|
||||
form.on('checkbox(switchSizeGreetCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$('.switchSizeGreetCard').val("on")
|
||||
$(".diySizeGreetCard").show();
|
||||
$(".fixedSizeGreetCard").hide();
|
||||
$(".diySizeGreetCard").find(":input").attr("disabled", false);
|
||||
$(".fixedSizeGreetCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$('.switchSizeGreetCard').val("off")
|
||||
$(".fixedSizeGreetCard").show();
|
||||
$(".diySizeGreetCard").hide();
|
||||
$(".fixedSizeGreetCard").find(":input").attr("disabled", false);
|
||||
$(".diySizeGreetCard").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
|
||||
// 自定义數量
|
||||
form.on('checkbox(switchCountGreetCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$(".diyCountGreetCard").show();
|
||||
$(".fixedCountGreetCard").hide();
|
||||
$(".diyCountGreetCard").find(":input").attr("disabled", false);
|
||||
$(".fixedCountGreetCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".fixedCountGreetCard").show();
|
||||
$(".diyCountGreetCard").hide();
|
||||
$(".fixedCountGreetCard").find(":input").attr("disabled", false);
|
||||
$(".diyCountGreetCard").find(":input").attr("disabled", true);
|
||||
}
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
})
|
||||
})
|
||||
</script>
|
||||
@@ -0,0 +1,754 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- 牛皮纸手提袋 -->
|
||||
<style>
|
||||
.layui-form-select .layui-input {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.expressFee + .layui-form-select .layui-edge {
|
||||
right: 30px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">手提袋</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr class="layui-bg-red">
|
||||
<form class="layui-form">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="k" class="k" lay-filter="k" value="0" title="常规牛皮纸">
|
||||
<input type="radio" name="k" class="k" lay-filter="k" value="1" title="自定义尺寸">
|
||||
<input type="radio" name="k" class="k" lay-filter="k" value="2" title="礼品袋 / 福袋">
|
||||
<!-- <input type="radio" name="k" class="k" lay-filter="k" value="3" title="特价白卡手提袋"> -->
|
||||
<input type="radio" name="k" class="k" lay-filter="k" value="4" title="牛皮纸手提袋">
|
||||
</div>
|
||||
</form>
|
||||
<form class="layui-form" id="bagForm">
|
||||
<input type="hidden" id="proTypeValue" name="proTypeValue" class="layui-input" value="11">
|
||||
<div class="cg" style="display: none">
|
||||
<%@include file="handBagCG.jsp" %>
|
||||
</div>
|
||||
<div class="zdy" style="display: none">
|
||||
<%@include file="handBagZDY.jsp" %>
|
||||
</div>
|
||||
<div class="tj" style="display: none">
|
||||
<%@include file="handBagTJ.jsp" %>
|
||||
</div>
|
||||
<div class="npzd" style="display: none">
|
||||
<p>使用场景</p>
|
||||
<div class="npzd">
|
||||
<input type="radio" name="typeValue" lay-filter="typeValue" value="0" title="烘焙">
|
||||
<input type="radio" name="typeValue" lay-filter="typeValue" value="1" title="外卖送餐">
|
||||
<input type="radio" name="typeValue" lay-filter="typeValue" value="2" title="饮品外卖">
|
||||
<input type="radio" name="typeValue" lay-filter="typeValue" value="3" title="礼品购物">
|
||||
</div>
|
||||
<p>材质</p>
|
||||
<div class="npzd">
|
||||
<select name="kindValue" class="select kindValueCG" lay-filter="kindValue">
|
||||
<option value="0">120克白牛皮</option>
|
||||
<option value="1">120克进口牛卡</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>规格(CM/厘米) <span style="font-size:14px;color:red">格式: 长 * 宽 * 高</span></p>
|
||||
<div class="layui-form-item npzd">
|
||||
<select name="kind2Value" id="spec" class="select kind2Value" lay-filter="kind2Value">
|
||||
<option value="1" selected>1号袋（宽250*高240*厚130）</option>
|
||||
<option value="3">3号袋（宽280*高265*厚150）</option>
|
||||
<option value="6">6号袋（宽160*高230*厚80）</option>
|
||||
<option value="7">7号袋（宽210*高270*厚110）</option>
|
||||
<option value="12">12号袋（宽250*高320*厚130）</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item npzd count">
|
||||
<select name="count" class="select countCG" id="npzd_count">
|
||||
<option value=""></option>
|
||||
<option value="100">100</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
绳子
|
||||
</p>
|
||||
<div class="layui-form-item npzd">
|
||||
<input type="radio" name="shen_type" lay-filter="shen_type" value="0" title="圆绳子" checked>
|
||||
<input type="radio" name="shen_type" lay-filter="shen_type" value="1" title="扁绳子">
|
||||
<select name="shen_color" class="select countCG" id="shen_color">
|
||||
<option value="" selected></option>
|
||||
<option value="白色">白色</option>
|
||||
<option value="黄牛皮本色">黄牛皮本色</option>
|
||||
<option value="黑色">黑色</option>
|
||||
<option value="大红色">大红色</option>
|
||||
<option value="深蓝色">深蓝色</option>
|
||||
<option value="浅蓝色">浅蓝色</option>
|
||||
<option value="米黄色">米黄色</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
杯托
|
||||
</p>
|
||||
<div class="layui-form-item npzd">
|
||||
<input type="checkbox" name="zheye" lay-filter="zheye" value="2" title="单杯杯托">
|
||||
<input type="checkbox" name="zheye" lay-filter="zheye" value="0" title="双杯杯托">
|
||||
<input type="checkbox" name="zheye" lay-filter="zheye" value="1" title="四杯托">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn" id="queryCondBtn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<%-- <%@include file="../acountExpressFeeTooWeight.jsp"%> --%>
|
||||
<div class="layui-collapse"
|
||||
style="width: 200px; display: inline-block; float: right">
|
||||
<div class="layui-colla-item">
|
||||
<h2 class="layui-colla-title">快递费计算</h2>
|
||||
<div class="layui-colla-content layui-show">
|
||||
快递公司:
|
||||
<select name="changeExpress" lay-filter="changeExpress" class="select expressFee">
|
||||
<option value=""></option>
|
||||
<option value="普通快递">普通快递（偏远地）</option>
|
||||
<option value="顺丰快递">顺丰快递</option>
|
||||
</select>
|
||||
收货地:
|
||||
<select name="expressFee" id="expressFee" lay-filter="expressFee" class="select expressFee"
|
||||
lay-search>
|
||||
</select>
|
||||
重量(kg):<input type="text" id="weight" class="layui-input" autocomplete="off">
|
||||
价格(元):<input type="text" id="price" class="layui-input" value="0" readonly>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
// 监听回车键，如果敲了回车，调用点击‘计算’
|
||||
$(document).keydown(function (e) {
|
||||
if (e.keyCode === 13) {
|
||||
$("#queryCondBtn").trigger("click");
|
||||
}
|
||||
});
|
||||
|
||||
// 选择的快递方式
|
||||
var changeExpress;
|
||||
// 首重
|
||||
var firstPrice = 0;
|
||||
// 续重
|
||||
var continuedPrice = 0;
|
||||
// 价格
|
||||
var expressPrice = 0;
|
||||
// 监听选择的快递
|
||||
form.on('select(changeExpress)', function (data) {
|
||||
changeExpress = data.value
|
||||
|
||||
// 清空省份下拉框
|
||||
$('#expressFee').empty()
|
||||
// 下拉框第一列添加空的option
|
||||
$('#expressFee').append(new Option("", ""));
|
||||
// 获取省份下拉框列表
|
||||
$.ajax({
|
||||
url: "../../getExpressFees",
|
||||
type: 'GET',
|
||||
success: function (data) {
|
||||
if (changeExpress == '普通快递') {
|
||||
var datas = data.data.handBag
|
||||
} else {
|
||||
var datas = data.data.allProvinces
|
||||
}
|
||||
$.each(datas, function (index, item) {
|
||||
$('#expressFee').append(
|
||||
new Option(item.province, item.firstWeightPrice + ',' + item.continuedWeightPrice + ',' + item.province));// 下拉菜单里添加元素
|
||||
});
|
||||
form.render("select");
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
// 监听重量输入框
|
||||
$(function () {
|
||||
// 输入框的值改变时触发
|
||||
$("#weight").on("input", function (e) {
|
||||
// 价格
|
||||
expressPrice = (firstPrice + continuedPrice * ($("#weight").val() - 1 > 0 ? Math.ceil($("#weight").val()) - 1 : 0)).toFixed(1)
|
||||
if (changeExpress == '普通快递') {
|
||||
// 最低收费60
|
||||
$("#price").val(expressPrice > 60 ? expressPrice : 60)
|
||||
} else {
|
||||
// 顺丰无最低收费
|
||||
$("#price").val(expressPrice)
|
||||
}
|
||||
});
|
||||
form.on("select(expressFee)", function (selectedData) {
|
||||
// 获取选中下拉框的价格（格式：首重,续重）
|
||||
price = selectedData.value
|
||||
// 首重价格
|
||||
firstPrice = parseFloat(price.split(",")[0])
|
||||
// 续重价格
|
||||
continuedPrice = price.split(",")[1]
|
||||
// 价格
|
||||
expressPrice = (firstPrice + continuedPrice * ($("#weight").val() - 1 > 0 ? Math.ceil($("#weight").val()) - 1 : 0)).toFixed(1)
|
||||
if (changeExpress == '普通快递') {
|
||||
// 最低收费60
|
||||
$("#price").val(expressPrice > 60 ? expressPrice : 60)
|
||||
} else {
|
||||
// 顺丰无最低收费
|
||||
$("#price").val(expressPrice)
|
||||
}
|
||||
})
|
||||
});
|
||||
form.on("checkbox(zheye)", function (data) {
|
||||
if ($("input[name='zheye']:checked").length > 1) {
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg("只能选择一个");
|
||||
}
|
||||
form.render();
|
||||
})
|
||||
form.on("radio(shen_type)", function (data) {
|
||||
let html = ``;
|
||||
if (data.value == 0) {
|
||||
html = `<option value="" selected></option>
|
||||
<option value="白色" >白色</option>
|
||||
<option value="黄牛皮本色">黄牛皮本色</option>
|
||||
<option value="黑色">黑色</option>
|
||||
<option value="大红色">大红色</option>
|
||||
<option value="深蓝色">深蓝色</option>
|
||||
<option value="浅蓝色">浅蓝色</option>
|
||||
<option value="米黄色">米黄色</option>`
|
||||
}
|
||||
if (data.value == 1) {
|
||||
html = ` <option value="" selected></option>
|
||||
<option value="白色" >白色</option>
|
||||
<option value="黄牛皮本色">黄牛皮本色</option>
|
||||
<option value="黑色">黑色</option>
|
||||
<option value="大红色">大红色</option>
|
||||
<option value="深蓝色">深蓝色</option>
|
||||
<option value="黄色">黄色</option>`
|
||||
}
|
||||
$("#shen_color").empty().append(html);
|
||||
form.render();
|
||||
})
|
||||
form.on("select(kindValue)", function (data) {
|
||||
setCountHtml();
|
||||
})
|
||||
form.on("select(kind2Value)", function (data) {
|
||||
|
||||
setCountHtml();
|
||||
})
|
||||
form.on("radio(typeValue)", function (data) {
|
||||
let html = ``;
|
||||
$("#spec").empty();
|
||||
if (data.value == 0) {
|
||||
html = `<option value="1" selected>1号袋（宽250*高240*厚130）</option>
|
||||
<option value="3">3号袋（宽280*高265*厚150）</option>
|
||||
<option value="6">6号袋（宽160*高230*厚80）</option>
|
||||
<option value="7">7号袋（宽210*高270*厚110）</option>
|
||||
<option value="10">10号袋（宽320*高270*厚110）</option>
|
||||
<option value="12">12号袋（宽250*高320*厚130）</option>`;
|
||||
$("#spec").append(html);
|
||||
|
||||
}
|
||||
if (data.value == 1) {
|
||||
html = `<option value="2" selected>2号袋（宽250*高270*厚130）</option>
|
||||
<option value="3">3号袋（宽280*高265*厚150）</option>
|
||||
<option value="4">4号袋（宽230*高250*厚150）</option>
|
||||
<option value="7">7号袋（宽210*高270*厚110）</option>
|
||||
<option value="8">8号袋（宽210*高265*厚140）</option>
|
||||
<option value="9">9号袋（宽250*高270*厚170）</option>`;
|
||||
$("#spec").append(html);
|
||||
}
|
||||
if (data.value == 2) {
|
||||
html = `<option value="5" selected>5号袋（宽110*高250*厚100）</option>
|
||||
<option value="7">7号袋（宽210*高270*厚110）</option>
|
||||
<option value="9">9号袋（宽250*高270*厚170）</option>`;
|
||||
$("#spec").append(html);
|
||||
}
|
||||
if (data.value == 3) {
|
||||
html = `<option value="7" selected>7号袋（宽210*高270*厚110）</option>
|
||||
<option value="10">10号袋（宽320*高270*厚110）</option>
|
||||
<option value="11">11号袋（宽320*高390*厚110）</option>`;
|
||||
$("#spec").append(html);
|
||||
}
|
||||
form.render();
|
||||
setCountHtml();
|
||||
})
|
||||
|
||||
function setCountHtml() {
|
||||
let spec = $("#spec").val();
|
||||
let kindValue = $(".npzd select[name='kindValue']").val();
|
||||
let count_html = `<option value=""></option>`;
|
||||
if (spec <= 10 && kindValue == 0) {
|
||||
count_html +=
|
||||
`<option value="100">100</option>`;
|
||||
}
|
||||
count_html += `
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>`;
|
||||
$("#npzd_count").empty().append(count_html);
|
||||
form.render();
|
||||
$("input[name='shen_type']").attr("disabled", false);
|
||||
if (spec == 5 || spec == 6) {
|
||||
$("input[name='shen_type'][value='1']").attr("disabled", true);
|
||||
}
|
||||
let html = ` <option value="" selected></option>
|
||||
<option value="白色" >白色</option>
|
||||
<option value="黄牛皮本色">黄牛皮本色</option>
|
||||
<option value="黑色">黑色</option>
|
||||
<option value="大红色">大红色</option>
|
||||
<option value="深蓝色">深蓝色</option>
|
||||
<option value="浅蓝色">浅蓝色</option>
|
||||
<option value="米黄色">米黄色</option>`;
|
||||
$("#shen_color").empty().append(html);
|
||||
form.render();
|
||||
}
|
||||
|
||||
// 自定义数量
|
||||
form.on('checkbox(diyCount)', function (data) {
|
||||
//判断当前多选框是选中还是取消选中
|
||||
if (data.elem.checked) {
|
||||
$(".diyCount").show();
|
||||
$(".count").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", false);
|
||||
$(".count").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
// 恢复标准数量的时候会被禁用，需要重置一下表单
|
||||
//$("#kindValueForm")[0].reset();
|
||||
$(".count").show();
|
||||
$(".diyCount").hide();
|
||||
$(".count").find(":input").attr("disabled", false);
|
||||
$(".diyCount").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
});
|
||||
// 选择是常规还是自定义
|
||||
form.on('radio(k)', function (data) {
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: {
|
||||
proTypeValue: $("#proTypeValue").val(),
|
||||
kindValue: $('input[name="k"]:checked').val()
|
||||
//kind2Value : $("#kind2Value").val()
|
||||
},
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$("#bagForm")[0].reset();
|
||||
var level = data.value;//被点击的radio的value值
|
||||
if (level == 0) {
|
||||
$(".cg").show();
|
||||
$(".zdy").hide();
|
||||
$(".tj").hide();
|
||||
$(".npzd").hide();
|
||||
$(".cg").find(":input").attr("disabled", false);
|
||||
$(".zdy").find(":input").attr("disabled", true);
|
||||
$(".tj").find(":input").attr("disabled", true);
|
||||
$(".npzd").find(":input").attr("disabled", true);
|
||||
} else if (level == 1) {
|
||||
$(".cg").hide();
|
||||
$(".tj").hide();
|
||||
/* $(".dz").hide(); */
|
||||
$(".zdy").show();
|
||||
$(".npzd").hide();
|
||||
$(".zdy").find(":input").attr("disabled", false);
|
||||
$(".cg").find(":input").attr("disabled", true);
|
||||
$(".tj").find(":input").attr("disabled", true);
|
||||
$(".dz").find(":input").attr("disabled", true);
|
||||
$(".npzd").find(":input").attr("disabled", true);
|
||||
} else if (level == 2) {
|
||||
$(".cg").hide();
|
||||
$(".tj").hide();
|
||||
$(".zdy").show();
|
||||
$(".aaa").hide();
|
||||
$(".npzd").hide();
|
||||
/* $(".dz").show(); */
|
||||
$(".zdy").find(":input").attr("disabled", false);
|
||||
$(".cg").find(":input").attr("disabled", true);
|
||||
$(".tj").find(":input").attr("disabled", true);
|
||||
$(".aaa").find(":input").attr("disabled", true);
|
||||
$(".npzd").find(":input").attr("disabled", true);
|
||||
} else if (level == 4) {
|
||||
$(".cg").hide();
|
||||
$(".tj").hide();
|
||||
$(".zdy").hide();
|
||||
$(".aaa").hide();
|
||||
$(".npzd").show();
|
||||
/* $(".dz").show(); */
|
||||
$(".zdy").find(":input").attr("disabled", true);
|
||||
$(".cg").find(":input").attr("disabled", true);
|
||||
$(".tj").find(":input").attr("disabled", true);
|
||||
$(".aaa").find(":input").attr("disabled", true);
|
||||
$(".npzd").find(":input").attr("disabled", false);
|
||||
} else {
|
||||
$(".cg").hide();
|
||||
$(".zdy").hide();
|
||||
$(".npzd").hide();
|
||||
/* $(".dz").hide(); */
|
||||
$(".tj").show();
|
||||
$(".tj").find(":input").attr("disabled", false);
|
||||
$(".cg").find(":input").attr("disabled", true);
|
||||
$(".zdy").find(":input").attr("disabled", true);
|
||||
$(".dz").find(":input").attr("disabled", true);
|
||||
$(".npzd").find(":input").attr("disabled", true);
|
||||
}
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var diyCount = $('input[name="diyCount"]:checked').val();
|
||||
// 勾了少数量
|
||||
if (diyCount) {
|
||||
if ($(".countDIY").val() % 1000 != 0) {
|
||||
layer.msg('自定义数量需为 1000 的整数倍！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
if (level != 0 && level != 3) {
|
||||
if (level != 4) {
|
||||
var size = $("#size").val();
|
||||
if (!size) {
|
||||
layer.msg('请填写尺寸！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (size.indexOf("*") != -1 && size.indexOf(("*"), size.indexOf("*") + 1) == -1) {
|
||||
layer.msg('请填写正确的尺寸格式！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if ($("#count").val() < 100) {
|
||||
layer.msg('数量不少于100个！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
} else {
|
||||
if ($("#npzd_count").val() < 100) {
|
||||
layer.msg('数量不少于100个！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
let shen_color = $('.npzd select[name="shen_color"] option:selected').val()
|
||||
if (shen_color == "") {
|
||||
layer.msg('请选择颜色！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
if (level == 1) {
|
||||
var size = $("#size").val();
|
||||
let d_size = size.split("*");
|
||||
if (d_size[0] < 10 || d_size[1] < 0 || d_size[2] < 10) {
|
||||
layer.msg('尺寸格式不能小于10CM！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
// 现货白卡纸只能选择250克
|
||||
if (level == 3) {
|
||||
$("#proTypeValue").val(12)
|
||||
} else {
|
||||
$("#proTypeValue").val(11)
|
||||
}
|
||||
form.render();
|
||||
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code != 200) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, {icon: 5, time: 1000});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
var number = $("#number").val();
|
||||
if (level == 0) {
|
||||
var kindData = {
|
||||
0: "130克进口白牛皮",
|
||||
1: "130克国产黄牛皮",
|
||||
2: "130克进口黄牛皮"
|
||||
}, kind2Data = {
|
||||
0: "20*11*27CM",
|
||||
1: "21*14*27CM",
|
||||
2: "23*15*25CM"
|
||||
}
|
||||
var kind = kindData[$(".kindValueCG").val()];
|
||||
var kind2 = kind2Data[$(".kind2Value").val()];
|
||||
var count = $(".countCG").val();
|
||||
|
||||
// textarea
|
||||
var span_result = "手提袋- " + kind + ' - ' + kind2 + '\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
} else if (level == 3) {
|
||||
// 特价白卡纸手提袋
|
||||
var kindData = {
|
||||
0: "竖款26*8*36CM",
|
||||
1: "竖款25*8*33CM",
|
||||
2: "竖款28*8*40CM",
|
||||
3: "竖款30*10*40CM",
|
||||
4: "竖款23*13*25CM",
|
||||
5: "横款26*8*25CM",
|
||||
6: "横款26*13*35CM",
|
||||
7: "横款32*14*35CM"
|
||||
};
|
||||
var kind = kindData[$(".kindValueTJ").val()];
|
||||
// var count = $(".countTJ").val();
|
||||
|
||||
// textarea
|
||||
var span_result = "手提袋 - 250克白卡纸手提袋 - " + kind + '--' + '\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
data[i].kindLabel = '特价白卡纸手提袋'
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
data[i].kindLabel = '特价白卡纸手提袋'
|
||||
}
|
||||
}
|
||||
} else if (level == 1) {
|
||||
var kindData = {
|
||||
5: "250克白卡纸手提袋"
|
||||
}
|
||||
var kind = kindData[$(".kindValueZDY").val()];
|
||||
var size = $(".size").val();
|
||||
var count = $(".countZDY").val();
|
||||
// textarea
|
||||
var span_result = "手提袋--" + kind + '--' + size + 'CM\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
} else if (level == 4) {
|
||||
let shen = ['圆绳', '扁绳'];
|
||||
let zheye_list = ['双杯杯托', '四杯托', '单杯托']
|
||||
let kindValue = $(".npzd select[name='kindValue'] option:selected").text();
|
||||
let spec = $("#spec option:selected").text();
|
||||
let zheye = $('.npzd input[name="zheye"]:checked').val()
|
||||
let shen_type = $('.npzd input[name="shen_type"]:checked').val()
|
||||
let shen_color = $('.npzd select[name="shen_color"] option:selected').text()
|
||||
|
||||
var span_result = "手提袋-" + kindValue + '-' + spec + '-' + shen_color + shen[shen_type];
|
||||
if (zheye) {
|
||||
span_result += '-' + zheye_list[zheye];
|
||||
|
||||
}
|
||||
span_result += '\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
var size = $(".size").val();
|
||||
var count = $(".countZDY").val();
|
||||
// textarea
|
||||
var span_result = "手提袋-250克白卡纸手提袋" + '--' + size + 'CM\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var size = "";
|
||||
if (level == 0) {
|
||||
size = $(".kind2Value option:selected").text();
|
||||
count = $(".countCG option:selected").val();
|
||||
size = size.replace("CM", "");
|
||||
} else {
|
||||
size = $("#size").val();
|
||||
count = $("#count").val();
|
||||
kind = $(".kindValueZDY option:selected").text();
|
||||
}
|
||||
|
||||
getRemark("手提袋", size, count + "个", kind + "-四面彩印", number, "", "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 550,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '11%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '13%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '14%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '14%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '19%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '24%',
|
||||
align: "center",
|
||||
title: '单个重量（kg）',
|
||||
templet: function (d) {
|
||||
return (d.weight / d.count).toFixed(2)
|
||||
}
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,53 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<p>材质</p>
|
||||
<div class="cg">
|
||||
<select name="kindValue" class="select kindValueCG" lay-filter="kindValue">
|
||||
<option value="0">130克进口白牛皮</option>
|
||||
<!--<option value="1">130克国产黄牛皮</option>-->
|
||||
<option value="2">130克进口黄牛皮</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>规格(CM/厘米) <span style="font-size:14px;color:red">格式: 长 * 宽 * 高</span></p>
|
||||
<div class="layui-form-item cg">
|
||||
<select name="kind2Value" class="select kind2Value"
|
||||
lay-filter="kind2Value">
|
||||
<option value="0">20*11*27CM</option>
|
||||
<option value="1">21*14*27CM</option>
|
||||
<option value="2">23*15*25CM</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
数量(个)
|
||||
<span style="font-size:10px;color:green">自定义数量</span>
|
||||
<input type="checkbox" name="diyCount" lay-filter="diyCount">
|
||||
</p>
|
||||
<div class="layui-form-item cg count" id="100qi">
|
||||
<select name="count" class="select countCG">
|
||||
<option value=""></option>
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="diyCount" style="display: none">
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" placeholder="请输入整数" class="layui-input countDIY" autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="layui-form-item cg" id="300qi">
|
||||
<select name="count" class="select countCG">
|
||||
<option value=""></option>
|
||||
<option value="300">300</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div> -->
|
||||
@@ -0,0 +1,38 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
<p>材质</p>
|
||||
<div class="tj">
|
||||
<select class="select">
|
||||
<option value="1">250克白卡纸手提袋</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<p>规格(CM/厘米) <span style="font-size:14px;color:red">格式: 长 * 宽 * 高</span></p>
|
||||
<div class="tj">
|
||||
<select name="kindValue" class="select kindValueTJ" lay-filter="kindValue">
|
||||
<option value="0">竖款26*8*36CM</option>
|
||||
<option value="1">竖款25*8*33CM</option>
|
||||
<option value="2">竖款28*8*40CM</option>
|
||||
<option value="3">竖款30*10*40CM</option>
|
||||
<option value="4">竖款23*13*25CM</option>
|
||||
<option value="5">横款26*8*25CM</option>
|
||||
<option value="6">横款26*13*35CM</option>
|
||||
<option value="7">横款32*14*35CM</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>数量(个)</p>
|
||||
<div class="layui-form-item tj">
|
||||
<select name="count" class="select countTJ">
|
||||
<option value=""></option>
|
||||
<option value="50">50</option>
|
||||
<option value="100">100</option>
|
||||
<option value="200">200</option>
|
||||
<option value="300">300</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
</select>
|
||||
</div>
|
||||
@@ -0,0 +1,25 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<p>材质</p>
|
||||
<!-- <div class="zdy aaa">
|
||||
<select name="kindValue" class="select kindValueZDY" lay-filter="kind">
|
||||
<option value="3">140克牛皮纸手提袋</option>
|
||||
<option value="4">250克白卡纸手提袋</option>
|
||||
</select>
|
||||
</div> -->
|
||||
<div class="zdy">
|
||||
<select name="kindValue" class="select kindValueZDY" lay-filter="kind">
|
||||
<option value="5">250克白卡纸手提袋</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>规格(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽 * 高</span><span style="font-size:8px;color:green">（请按格式输入）</span></p>
|
||||
<div class="layui-form-item zdy">
|
||||
<input name="size" id="size" class="layui-input size" placeholder="格式:长*宽*高"
|
||||
autocomplete="off"/>
|
||||
</div>
|
||||
<p>
|
||||
<p>数量(个)</p>
|
||||
<div class="layui-form-item zdy">
|
||||
<input name="count" id="count" placeholder="请输入整数个" class="layui-input countZDY"
|
||||
autocomplete="off"/>
|
||||
</div>
|
||||
@@ -0,0 +1,291 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">会员卡卡套</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="会员卡卡套">
|
||||
<div>
|
||||
<input type="radio" name="kindValue" value="1" title="250克珠光纸" checked="checked" lay-filter="kindValue">
|
||||
<input type="radio" name="kindValue" value="2" title="0.76pvc浮雕卡" lay-filter="kindValue">
|
||||
</div>
|
||||
<p>
|
||||
尺寸
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="ui_size">
|
||||
<select name="size" id="size">
|
||||
<option value="19.5*9.5">19.5*9.5cm</option>
|
||||
<option value="15.5*8">15.5*8cm</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="ui_fd_size" style="display: none;">
|
||||
<select name="size" id="size1">
|
||||
<option value="8.55*5.4">8.55*5.4cm</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" id="count" class="select">
|
||||
<option value="100">100</option>
|
||||
<option value="200">200</option>
|
||||
<option value="300">300</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<!-- <div class="layui-form-item" id="ui_des" style="display:none;">
|
||||
<p>
|
||||
设计内容
|
||||
</p>
|
||||
<select name="desType" lay-filter="desType" id="desType" class="select" lay-search>
|
||||
<option value=""></option>
|
||||
<option value="1">改序号</option>
|
||||
<option value="2">改名字或二维码</option>
|
||||
<option value="3">改全部内容</option>
|
||||
</select>
|
||||
</div> -->
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>工艺</p>
|
||||
<div class="ui_normal">
|
||||
<input type="radio" name="craftTang" lay-filter="craftTang" value="烫金" title="烫金" checked/>
|
||||
<input type="radio" name="craftTang" lay-filter="craftTang" value="烫银" title="烫银"/>
|
||||
<input type="radio" name="craftTang" lay-filter="craftTang" value="烫黑金" title="烫黑金"/>
|
||||
<input type="radio" name="craftTang" lay-filter="craftTang" value="烫红金" title="烫红金"/>
|
||||
<input type="radio" name="craftTang" lay-filter="craftTang" value="烫蓝金" title="烫蓝金"/>
|
||||
<input type="radio" name="craftTang" lay-filter="craftTang" value="烫绿金" title="烫绿金"/>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
$(".ui_fd_size").find(":input").attr("disabled", true);
|
||||
form.on('radio(kindValue)', function (data) {
|
||||
if (data.value == 1) {
|
||||
$(".ui_size").show();
|
||||
$(".ui_size").find(":input").attr("disabled", false);
|
||||
$(".ui_fd_size").hide();
|
||||
$(".ui_fd_size").find(":input").attr("disabled", true);
|
||||
$(".ui_normal").show();
|
||||
$(".ui_normal").find(":input").attr("disabled", false);
|
||||
} else {
|
||||
$(".ui_fd_size").show();
|
||||
$(".ui_fd_size").find(":input").attr("disabled", false);
|
||||
$(".ui_size").hide();
|
||||
$(".ui_size").find(":input").attr("disabled", true);
|
||||
$(".ui_normal").hide();
|
||||
$(".ui_normal").find(":input").attr("disabled", true);
|
||||
}
|
||||
form.render();
|
||||
});
|
||||
|
||||
function getProductImage() {
|
||||
$("#carousel").empty();
|
||||
$(".layui-carousel-ind").remove();
|
||||
let craftTang = $("input[name='craftTang']:checked").val();
|
||||
let data = {proTypeValue: '会员卡卡套'}
|
||||
data.craftValue = craftTang;
|
||||
let html = "";
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data,
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
form.on('radio(craftTang)', function (data) {
|
||||
getProductImage()
|
||||
});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var kind = [$('input[name="kind"]:checked').val()];
|
||||
var tangjin = [$('input[name="craftTang"]:checked').val()];
|
||||
var number = $("#number").val();
|
||||
var size = $("#size").val();
|
||||
var kindValue = $("input[name='kindValue']:checked").val();
|
||||
var count = $("#count").val();
|
||||
if (!size) {
|
||||
layer.msg('请填写尺寸！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var length = size.split("*")[0];
|
||||
var width = size.split("*")[1];
|
||||
|
||||
var kindData = {
|
||||
1: "250克珠光纸",
|
||||
2: "0.76pvc浮雕卡"
|
||||
}
|
||||
if (kindValue == "2") {
|
||||
size = $("#size1").val();
|
||||
}
|
||||
kindValue = kindData[kindValue];
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result = '会员卡卡套 - ' + kindValue + '-' + size + 'cm - ' + tangjin;
|
||||
span_result += '\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价',
|
||||
templet: function (d) {
|
||||
return Math.ceil(d.price)
|
||||
}
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价',
|
||||
templet: function (d) {
|
||||
return Math.ceil(d.price)
|
||||
}
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,360 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 插卡 -->
|
||||
<style>
|
||||
.select{
|
||||
width:100px;
|
||||
margin-top:5px;
|
||||
display:inline-block;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">插卡</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="3" >
|
||||
<p>
|
||||
品种
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" class="select" lay-filter="setKind" lay-verify="required" >
|
||||
<option></option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸（厘米）<span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
|
||||
<div class="layui-form-item size2">
|
||||
<input type="text" name="size" placeholder="格式:长*宽" autocomplete="off" class="layui-input size22 size">
|
||||
</div>
|
||||
|
||||
<div class="layui-form-item size1" style="display:none">
|
||||
<select name="size" class="select size11">
|
||||
<option value="3*3">3*3（厘米）</option>
|
||||
<option value="3.5*3.5">3.5*3.5（厘米）</option>
|
||||
<option value="4*4">4*4（厘米）</option>
|
||||
<option value="4.5*4.5">4.5*4.5（厘米）</option>
|
||||
<option value="5*5">5*5（厘米）</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="layui-form-item ui_size" style="display:none">
|
||||
<select name="size" class="size">
|
||||
<option value="3.5*3.5">3.5*3.5（厘米）</option>
|
||||
<option value="4*4">4*4（厘米）</option>
|
||||
<option value="5*5">5*5（厘米）</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item ui_normal">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
<option value="20000">20000</option>
|
||||
<option value="30000">30000</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="layui-form-item ui_wq" style="display: none;">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<!-- <option value="4000">4000</option> -->
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>工艺</p>
|
||||
<div class="layui-form-item ui_normal">
|
||||
<input type="radio" name="craftQie" class="moqie" value="模切" lay-skin="primary" title="模切" checked="checked">
|
||||
</div>
|
||||
<div class="ui_wq" style="display: none;">
|
||||
<input type="radio" name="craftQie" class="moqie" value="模切" lay-skin="primary" title="模切" checked="checked">
|
||||
<input type="radio" name="craftTang" value="单面烫金" lay-skin="primary" title="单面烫金" checked="checked">
|
||||
<br />
|
||||
<input type="radio" name="craftShua" value="无" lay-skin="primary" title="无" checked="checked">
|
||||
<input type="radio" name="craftShua" value="银铝箔纸" lay-skin="primary" title="银铝箔纸">
|
||||
<input type="radio" name="craftShua" value="金铝箔纸" lay-skin="primary" title="金铝箔纸">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="13" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
//一访问页面就调用
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getKindsByPro",
|
||||
type : "GET",
|
||||
data:{
|
||||
proTypeValue:3
|
||||
},
|
||||
dataType : "json",
|
||||
success : function(result) {
|
||||
$.each(result,function(index,item){
|
||||
$('#kindValue').append(new Option(item,index));//往下拉菜单里添加元素
|
||||
});
|
||||
layui.form.render("select");
|
||||
}
|
||||
});
|
||||
|
||||
form.on('select(setKind)', function(data) {
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
proTypeValue : $("#proTypeValue").val(),
|
||||
kindValue : $("#kindValue").val()
|
||||
},
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if(remark.indexOf("null") < 0){
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if(result.length == 0){
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
}else{
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
if(data.value == 7){
|
||||
$(".ui_wq").find(":input").attr("disabled", false);
|
||||
$(".ui_wq").show();
|
||||
$(".ui_normal").find(":input").attr("disabled", true);
|
||||
$(".ui_normal").hide();
|
||||
}else{
|
||||
$(".ui_normal").find(":input").attr("disabled", false);
|
||||
$(".ui_normal").show();
|
||||
$(".ui_wq").find(":input").attr("disabled", true);
|
||||
$(".ui_wq").hide();
|
||||
}
|
||||
if(data.value == 1){
|
||||
$(".size1").find(":input").attr("disabled", false);
|
||||
$(".size1").show();
|
||||
$(".size2").hide();
|
||||
$(".size2").find(":input").attr("disabled", true);
|
||||
$(".ui_size").hide();
|
||||
$(".ui_size").find(":input").attr("disabled", true);
|
||||
}else if(data.value == 12){//400克旋转插卡
|
||||
$(".ui_size").show();
|
||||
$(".ui_size").find(":input").attr("disabled", false);
|
||||
$(".size2").hide();
|
||||
$(".size2").find(":input").attr("disabled", true);
|
||||
$(".size1").hide();
|
||||
$(".size1").find(":input").attr("disabled", true);
|
||||
}else{
|
||||
$(".size2").show();
|
||||
$(".size2").find(":input").attr("disabled", false);
|
||||
$(".size1").hide();
|
||||
$(".size1").find(":input").attr("disabled", true);
|
||||
$(".ui_size").hide();
|
||||
$(".ui_size").find(":input").attr("disabled", true);
|
||||
}
|
||||
});
|
||||
|
||||
//点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var kind = $("#kindValue").val();
|
||||
var size =$(".size").val();
|
||||
if(kind == 1){
|
||||
size = $(".size11 :checked").val();
|
||||
}else if(kind == 12){
|
||||
size = $(".ui_size :checked").val();
|
||||
}else{
|
||||
if(!size){
|
||||
layer.msg('请填写尺寸！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if ((size.split("*")[0] > 9 || size.split("*")[1] > 5.4) && (size.split("*")[0] > 5.4 || size.split("*")[1] > 9)) {
|
||||
layer.msg("[ 插卡 ]尺寸不能超过9*5.4 cm !",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
var craftQie = $("input[name='craftQie']:checked").val();
|
||||
var number= $("#number").val();
|
||||
var kindData={
|
||||
0 :"异形插牌",
|
||||
1 :"菱形单面直角插卡",
|
||||
2 :"400g卡纸单面烫金",
|
||||
3 :"400g铜板印刷+单面烫金效果",
|
||||
4 :"哑金烫金单面插卡",
|
||||
5 :"透明烫金插牌",
|
||||
7 :"弯曲插卡",
|
||||
8 :"400g卡纸双面烫金",
|
||||
9 :"哑金哑银凹凸插卡",
|
||||
10 :"亮金亮银凹凸插卡",
|
||||
11 :"镭射银插卡",
|
||||
12 :"400克旋转插卡单面烫金（烫银）",
|
||||
13 :"350克铜版纸印刷+凹凸"
|
||||
};
|
||||
var kindValue = kindData[kind];
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getThanSum",
|
||||
type:"GET",
|
||||
data:$(".big_box form").serialize(),
|
||||
success:function(result){
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
|
||||
var data = result.data.proList;
|
||||
if(kind == 7){
|
||||
craftQie += "," + $("input[name='craftTang']:checked").val();
|
||||
if($("input[name='craftShua']:checked").val() != "无"){
|
||||
craftQie += "," + $("input[name='craftShua']:checked").val();
|
||||
}
|
||||
}
|
||||
var span_result ='插卡 - ' + kindValue + ' - ' + size + "厘米 -" + craftQie + "(同款内容) "+'\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = $("#count option:selected").val();
|
||||
getRemark("插卡", size, count+"个", kindValue, number, craftQie, "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,290 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<style>
|
||||
.edge .layui-edge {
|
||||
right: 20px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">卡贴</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="卡贴">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" lay-filter="kind" name="kind" value="300克铜版纸" title="300克铜版纸" checked/>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米)
|
||||
</p>
|
||||
<input type="text" name="size" placeholder="格式:长*宽" id="size" class="layui-input" autocomplete="off">
|
||||
<p>
|
||||
数量（张） <input type="checkbox" name="switchCount" lay-filter="switchCount" title="自定义数量"></span>
|
||||
</p>
|
||||
<div class="count">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="diyCount" style="display: none">
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" id="count" placeholder="请输入整数" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>工艺</p>
|
||||
<div class="layui-input-block" style="display:inline-block;">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="双面覆哑膜" title="双面覆哑膜">
|
||||
<input type="checkbox" name="craft" lay-filter="switchMQ" value="模切" title="异形模切">
|
||||
<input type="radio" name="craftSMJ" value="配双面胶" title="配双面胶" checked>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn" id="queryCondBtn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<h2>下单备注-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">
|
||||
点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
let remark_html = ''
|
||||
|
||||
// 监听回车键，如果敲了回车，调用点击‘计算’
|
||||
$(document).keydown(function (e) {
|
||||
if (e.keyCode === 13) {
|
||||
$("#queryCondBtn").trigger("click");
|
||||
}
|
||||
});
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: {
|
||||
proTypeValue: $('input[name="kind"]:checked').val()
|
||||
},
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
remark_html = remark;
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
function setRemark() {
|
||||
let craft_list = [];
|
||||
$("input[name='craft']:checked").each(function () {
|
||||
craft_list.push($(this).val());
|
||||
}
|
||||
);
|
||||
$("#remark").empty();
|
||||
let html = '';
|
||||
|
||||
if (craft_list.indexOf('模切') == -1) {
|
||||
html = remark_html
|
||||
} else {
|
||||
html = '预计发货时间：<br>广东：模切（3-4天发货）中通 顺丰'
|
||||
}
|
||||
|
||||
$("#remark").append('<div><span>' + html + '<span/></div>');
|
||||
|
||||
}
|
||||
|
||||
form.on('checkbox(switchMQ)', () => {
|
||||
setRemark();
|
||||
})
|
||||
|
||||
// 自定义数量
|
||||
form.on('checkbox(switchCount)', function (data) {
|
||||
if (data.elem.checked) {
|
||||
$(".diyCount").show();
|
||||
$(".count").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", false);
|
||||
$(".count").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".count").show();
|
||||
$(".diyCount").hide();
|
||||
$(".count").find(":input").attr("disabled", false);
|
||||
$(".diyCount").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
// 选中‘自定义数量’
|
||||
if ($('input[name="switchCount"]:checked').length != 0) {
|
||||
if ($("#count").val() < 10000 || $("#count").val() % 1000 != 0) {
|
||||
layer.msg("自定义数量需要大于10000 且是1000的整数倍", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
var number = $("#number").val();
|
||||
var count = $("select[name='count'] option:selected").text();
|
||||
var arr = []
|
||||
$("input:checkbox[name='craft']:checked").each(function (i) {
|
||||
if (!$(this).is(':disabled')) {
|
||||
arr.push($(this).val());
|
||||
}
|
||||
});
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
var span_result = '卡贴 - 300克铜版纸 - 配双面胶 -' + arr + ' -(同款内容)\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,200 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 筷子套 -->
|
||||
<style>
|
||||
.edge .layui-edge{
|
||||
right:10px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">筷子套</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kind1Value" id="kind1Value" class="select">
|
||||
<option value="0">157克铜版纸</option>
|
||||
</select>
|
||||
</div>
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="筷子套" >
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="size" id="size" class="select">
|
||||
<option value="15*3">15*3</option>
|
||||
<option value="18*3">18*3</option>
|
||||
<option value="19*3">19*3</option>
|
||||
<option value="20*3">20*3</option>
|
||||
<option value="24*3">24*3</option>
|
||||
<option value="25*3">25*3</option>
|
||||
<option value="26*3">26*3</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count">
|
||||
<!--<option value="5000">5000</option>-->
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var number= $("#number").val();
|
||||
var size = $("#size").val();
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result ="筷子套- 157克铜版纸 - " + size + "cm- (同款内容)\n";
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = $("#count option:selected").val();
|
||||
getRemark("筷子套", size+"cm", count+"张", "157克铜版纸", number, "", "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},/* {
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价',
|
||||
templet : function(d) {
|
||||
return Math.ceil(d.price * 0.98)
|
||||
}
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价',
|
||||
templet : function(d) {
|
||||
return Math.ceil(d.price * 0.96)
|
||||
}
|
||||
}, */{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,111 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
<style>
|
||||
.fixedSizeLotteryCard,.fixedCountLotteryCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
#diySizeLotteryCard,#diyCountLotteryCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
.fixedSizeLotteryCard .layui-input,.fixedCountLotteryCard .layui-input{
|
||||
width:100%
|
||||
}
|
||||
.fixedSizeLotteryCard .layui-edge,.fixedCountLotteryCard .layui-edge{
|
||||
right:0px
|
||||
}
|
||||
</style>
|
||||
<input type="hidden" name="proTypeValue" class="layui-input" value="抽奖券">
|
||||
<p>材质</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="2" title="300克铜版纸" checked="checked">
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item fixedSizeLotteryCard">
|
||||
<select name="size" id="fixedSizeLotteryCard" class="select">
|
||||
<option value="18*5.4">18*5.4 cm</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diySizeLotteryCard" style="display:none">
|
||||
<input type="text" name="size" id="diySizeLotteryCard" placeholder="格式:长*宽" class="layui-input" autocomplete="off">
|
||||
</span>
|
||||
<input type="checkbox" name="switchSize" class="switchSizeLotteryCard" lay-filter="switchSizeLotteryCard" title="自定义尺寸" lay-skin="primary">
|
||||
<span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item fixedCountLotteryCard">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diyCountLotteryCard" style="display:none">
|
||||
<input type="text" name="count" id="diyCountLotteryCard" placeholder="请输入整数" autocomplete="off"
|
||||
class="layui-input" lay-verify="number">
|
||||
</span>
|
||||
<input type="checkbox" name="switchCount" lay-filter="switchCountLotteryCard" title="自定义数量" lay-skin="primary">
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number"
|
||||
id="numberLotteryCard" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
|
||||
<script>
|
||||
layui.use(['table','form'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
// 默认没有选中复选框
|
||||
$('.switchSizeLotteryCard').val("off")
|
||||
// 自定义尺寸
|
||||
form.on('checkbox(switchSizeLotteryCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$('.switchSizeLotteryCard').val("on")
|
||||
$(".diySizeLotteryCard").show();
|
||||
$(".fixedSizeLotteryCard").hide();
|
||||
$(".diySizeLotteryCard").find(":input").attr("disabled", false);
|
||||
$(".fixedSizeLotteryCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$('.switchSizeLotteryCard').val("off")
|
||||
$(".fixedSizeLotteryCard").show();
|
||||
$(".diySizeLotteryCard").hide();
|
||||
$(".fixedSizeLotteryCard").find(":input").attr("disabled", false);
|
||||
$(".diySizeLotteryCard").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
|
||||
// 自定义數量
|
||||
form.on('checkbox(switchCountLotteryCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$(".diyCountLotteryCard").show();
|
||||
$(".fixedCountLotteryCard").hide();
|
||||
$(".diyCountLotteryCard").find(":input").attr("disabled", false);
|
||||
$(".fixedCountLotteryCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".fixedCountLotteryCard").show();
|
||||
$(".diyCountLotteryCard").hide();
|
||||
$(".fixedCountLotteryCard").find(":input").attr("disabled", false);
|
||||
$(".diyCountLotteryCard").find(":input").attr("disabled", true);
|
||||
}
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
})
|
||||
})
|
||||
</script>
|
||||
@@ -0,0 +1,381 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">硫酸纸</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" lay-filter="stickerKind" name="stickerKind" value="常用" title="常用">
|
||||
<%-- <input type="radio" lay-filter="stickerKind" name="stickerKind" value="专版打印" title="专版打印">--%>
|
||||
</div>
|
||||
</form>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="硫酸纸">
|
||||
<div class="ui_normal">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select" lay-search>
|
||||
<option value="1">80克硫酸纸</option>
|
||||
<option value="2">135克硫酸纸</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item ui_normal">
|
||||
<select name="count" id="count" class="select">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
<option value="20000">20000</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="layui-form-item ui_print">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" id="printCount"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<div class="layui-form-item" id="ui_des" style="display:none;">
|
||||
<p>
|
||||
设计内容
|
||||
</p>
|
||||
<select name="desType" lay-filter="desType" id="desType" class="select" lay-search>
|
||||
<option value=""></option>
|
||||
<option value="1">改序号</option>
|
||||
<option value="2">改名字或二维码</option>
|
||||
<option value="3">改全部内容</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>工艺 <span style="font-size:14px;color:red">专版打印不能模切</span></p>
|
||||
<div class="ui_normal">
|
||||
<div class="ui_kind1">
|
||||
<input type="radio" name="craftQie" value="裁切" title="裁切" checked="checked"/>
|
||||
</div>
|
||||
<div class="ui_kind2" style="display: none;">
|
||||
<input type="radio" name="craft" value="直角" title="直角" checked="checked"/>
|
||||
<input type="radio" name="craft" value="异形" title="异形"/>
|
||||
|
|
||||
<input type="checkbox" name="craftTang" value="烫金" title="烫金" disabled="disabled"/>
|
||||
|
|
||||
<input type="checkbox" name="kind" value="彩色" title="彩色"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ui_print" style="display: none;">
|
||||
<input type="radio" name="craftMo" value="直角" title="直角" checked="checked">
|
||||
|
|
||||
<input type="radio" name="yinbai" value="黑白" title="黑白" checked="checked"/>
|
||||
<input type="radio" name="yinbai" value="彩色" title="彩色"/>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
// 监听count输入框
|
||||
$(function () {
|
||||
//输入框的值改变时触发
|
||||
/*$("#size").on("input",function(e){
|
||||
//获取input输入的值
|
||||
if($('input[name="kindValue"]:checked').val() == "2"){
|
||||
if(e.delegateTarget.value.indexOf(".") != -1){
|
||||
layer.msg('请输入整数尺寸!',{offset:['300px','300px']},function(){});
|
||||
}
|
||||
}
|
||||
});*/
|
||||
});
|
||||
|
||||
form.on('radio(stickerKind)', function (stickerKindData) {
|
||||
stickerKind = stickerKindData.value;
|
||||
if (stickerKind == "常用") {
|
||||
$(".ui_normal").show();
|
||||
$(".ui_normal").find(":input").attr("disabled", false);
|
||||
$(".ui_print").hide();
|
||||
$(".ui_print").find(":input").attr("disabled", false);
|
||||
} else {
|
||||
$(".ui_normal").hide();
|
||||
$(".ui_normal").find(":input").attr("disabled", true);
|
||||
$(".ui_print").show();
|
||||
$(".ui_print").find(":input").attr("disabled", false);
|
||||
$("input[name='craftTang']").prop("checked", false);
|
||||
$("input[name='kind']").prop("checked", false);
|
||||
$("input[name='craft']").prop("checked", false);
|
||||
}
|
||||
});
|
||||
|
||||
$("#number").on("input", function (e) {
|
||||
var number = e.delegateTarget.value;
|
||||
if (number > 1 && $("input[name='stickerKind']:checked").val() == "专版打印") {
|
||||
$("#ui_des").show();
|
||||
} else {
|
||||
$("#ui_des").hide();
|
||||
}
|
||||
});
|
||||
|
||||
form.on('select(kindValue)', function (data) {
|
||||
if (data.value == 1) {
|
||||
$(".ui_kind1").show();
|
||||
$(".ui_kind1").find(":input").attr("disabled", false);
|
||||
$(".ui_kind2").hide();
|
||||
$(".ui_kind2").find(":input").attr("disabled", true);
|
||||
$("input[name='craft']").prop("checked", false);
|
||||
} else {
|
||||
$(".ui_kind2").show();
|
||||
$(".ui_kind2").find(":input").attr("disabled", false);
|
||||
$(".ui_kind1").hide();
|
||||
$(".ui_kind1").find(":input").attr("disabled", true);
|
||||
}
|
||||
form.render();
|
||||
});
|
||||
|
||||
form.on('checkbox(switch)', function (data) {
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: {
|
||||
proTypeValue: $("#proTypeValue").val(),
|
||||
//kindValue : $("#kindValue1").val()
|
||||
},
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
}
|
||||
remark += '<div><span>' + content + '<span/></div>';
|
||||
$("#carousel").append(html);
|
||||
$("#remark").append(remark);
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var craft = $('input[name="craft"]:checked').val()
|
||||
var kind = [$('input[name="kind"]:checked').val()];
|
||||
var tangjin = [$('input[name="craftTang"]:checked').val()];
|
||||
var number = $("#number").val();
|
||||
var size = $("#size").val();
|
||||
var stickerKind = [$('input[name="stickerKind"]:checked').val()];
|
||||
var kindValue = $("#kindValue").val();
|
||||
var count = "";
|
||||
if (stickerKind == "常用") {
|
||||
count = $("#count").val();
|
||||
} else {
|
||||
count = $("#printCount").val();
|
||||
}
|
||||
if (!size) {
|
||||
layer.msg('请填写尺寸！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var length = size.split("*")[0];
|
||||
var width = size.split("*")[1];
|
||||
if ((length < 5 || width < 5 && length < 3 || width < 3)) {
|
||||
layer.msg("尺寸不能小于5*3cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if ((length > 42 || width > 42 && length > 28.5 || width > 28.5)) {
|
||||
layer.msg("尺寸不能大于42*28.5 cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (number > 1 && stickerKind == "专版打印") {
|
||||
if ($("#desType option:selected").val() == "" || $("#desType option:selected").val() == null) {
|
||||
layer.msg('请选择设计内容！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
var kindData = {
|
||||
1: "80克硫酸纸",
|
||||
2: "135克硫酸纸"
|
||||
}
|
||||
kindValue = kindData[kindValue];
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
var span_result = '硫酸纸 - ' + kindValue + '-' + size + ' CM';
|
||||
if (stickerKind == "专版打印") {
|
||||
kindValue = "135克硫酸纸";
|
||||
span_result += " - 直角 - " + $("input[name='yinbai']:checked").val();
|
||||
} else {
|
||||
if (kindValue != "80克硫酸纸") {
|
||||
span_result += craft;
|
||||
if (tangjin != "") {
|
||||
span_result += ' - ' + tangjin;
|
||||
}
|
||||
if (kind != "") {
|
||||
span_result += " - " + kind;
|
||||
}
|
||||
} else {
|
||||
span_result += " - 裁切";
|
||||
}
|
||||
}
|
||||
span_result += '\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
craft += tangjin;
|
||||
if (kind == "") {
|
||||
kind = "单色";
|
||||
}
|
||||
getRemark($("#proTypeValue").val(), size, count + "张", kind, number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,591 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">奖牌</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="奖牌"/>
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select" lay-search>
|
||||
<option value=""></option>
|
||||
<option value="水晶">水晶</option>
|
||||
<option value="金箔木托">金箔木托</option>
|
||||
<option value="银箔木托">银箔木托</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
名称
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kind1Value" id="kind1Value" lay-filter="kind1Value" class="select" lay-search>
|
||||
<option value=""></option>
|
||||
<option value="水晶">水晶</option>
|
||||
<option value="金箔木托">金箔木托</option>
|
||||
<option value="银箔木托">银箔木托</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米)<span id="size_tip" style="font-size:14px;color:red"></span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="size" id="size" lay-filter="size" class="select" lay-search>
|
||||
<option value=""></option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" class="layui-input" id="count">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<div class="medal">
|
||||
<p>
|
||||
颜色
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="colors" lay-filter="colors" value="金箔" title="金箔" checked>
|
||||
<input type="radio" name="colors" lay-filter="colors" value="银箔" title="银箔">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<span class="medal">
|
||||
<input type="radio" name="inkjet" lay-filter="inkjet" value="彩色喷印" title="彩色喷印" checked>
|
||||
<input type="radio" name="craft" lay-filter="switch" value="蝶边" title="蝶边">
|
||||
<input type="radio" name="craft" lay-filter="switch" value="直边" title="直边" checked>
|
||||
</span>
|
||||
<span class="crystal">
|
||||
<input type="radio" name="engrave" lay-filter="engrave" value="雕刻" title="雕刻" checked>
|
||||
<input type="radio" name="color" lay-filter="colors" value="白色" title="白色" checked>
|
||||
<input type="radio" name="color" lay-filter="colors" value="黑色" title="黑色">
|
||||
<input type="radio" name="color" lay-filter="colors" value="蓝色" title="蓝色">
|
||||
<input type="radio" name="color" lay-filter="colors" value="黄色" title="黄色">
|
||||
<input type="radio" name="color" lay-filter="colors" value="红色" title="红色">
|
||||
<input type="radio" name="color" lay-filter="colors" value="金色" title="金色">
|
||||
</span>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
function getImages() {
|
||||
let kind1 = $("#kind1Value option:selected").val();
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: {
|
||||
proTypeValue: $("#proTypeValue").val(),
|
||||
kindValue: kind1,
|
||||
},
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
form.on('checkbox(switch)', function (data) {
|
||||
|
||||
})
|
||||
form.on('select(kindValue)', function (data) {
|
||||
let text = data.value;
|
||||
$("#size_tip").show()
|
||||
$(".medal").show();
|
||||
$(".medal input").attr("disabled", false);
|
||||
$(".crystal").hide();
|
||||
$(".crystal input").attr("disabled", true);
|
||||
let html = `<option value=""></option>
|
||||
<option value="树藤">树藤</option>
|
||||
<option value="角花">角花</option>
|
||||
<option value="镭射">镭射</option>
|
||||
<option value="孚雕新树藤">孚雕新树藤</option>
|
||||
<option value="万里长城">万里长城</option>
|
||||
<option value="皇冠">皇冠</option>
|
||||
<!-- <option value="纯金/银箔">纯金/银箔</option>-->
|
||||
`;
|
||||
if (text == '水晶') {
|
||||
$("#size_tip").hide()
|
||||
$(".crystal").show();
|
||||
$(".crystal input").attr("disabled", false);
|
||||
$(".medal").hide();
|
||||
$(".medal input").attr("disabled", true);
|
||||
html = `<option value=""></option>
|
||||
<option value="酸洗五角星">酸洗五角星</option>
|
||||
<option value="炫彩刀片">炫彩刀片</option>
|
||||
<option value="金色刀片">金色刀片</option>
|
||||
<option value="尖角">尖角</option>
|
||||
<option value="斜面6角星">斜面6角星</option>
|
||||
<option value="八角">八角</option>
|
||||
<option value="蓝色梦想">蓝色梦想</option>
|
||||
<option value="蓝色三条线">蓝色三条线</option>
|
||||
<option value="蓝色弯弯">蓝色弯弯</option>
|
||||
<option value="斜面5角星">斜面5角星</option>
|
||||
<option value="麦穗圆型">麦穗圆型</option>
|
||||
<option value="酸洗凹面">酸洗凹面</option>
|
||||
<option value="月牙">月牙</option>
|
||||
<option value="大拇指">大拇指</option>
|
||||
<option value="宝剑">宝剑</option>
|
||||
<option value="蓝色五角星">蓝色五角星</option>
|
||||
`;
|
||||
}
|
||||
$("#kind1Value").empty().append(html);
|
||||
form.render();
|
||||
});
|
||||
|
||||
form.on('select(kind1Value)', function (data) {
|
||||
getImages();
|
||||
let text = data.value;
|
||||
let kind = $("#kindValue option:selected").val();
|
||||
let html = `
|
||||
<option value=""></option>
|
||||
<option value="20*25">20*25cm</option>
|
||||
<option value="24*31">24*31cm</option>
|
||||
<option value="25*35">25*35cm</option>
|
||||
<option value="30*40">30*40cm</option>
|
||||
<option value="35*50">35*50cm</option>
|
||||
<option value="40*60">40*60cm</option>
|
||||
`;
|
||||
if (kind == "水晶") {
|
||||
if (text == "酸洗五角星") {
|
||||
html = `<option value="280*10*80">280*10*80mm</option>`;
|
||||
}
|
||||
if (text == "炫彩刀片") {
|
||||
html = `<option value="270*80*60">270*80*60mm</option>`;
|
||||
}
|
||||
if (text == "金色刀片") {
|
||||
html = `<option value="280*10*80">280*10*80mm</option>`;
|
||||
}
|
||||
if (text == "尖角") {
|
||||
html = `<option value="200*115*60">200*115*60mm</option>`;
|
||||
}
|
||||
if (text == "斜面6角星") {
|
||||
html = `<option value="270*70*70">270*70*70mm</option>`;
|
||||
}
|
||||
if (text == "八角") {
|
||||
html = `<option value="200*180*45">200*180*45mm</option>`;
|
||||
}
|
||||
if (text == "蓝色梦想") {
|
||||
html = `<option value="280*110*80">280*110*80mm</option>`;
|
||||
}
|
||||
if (text == "蓝色三条线") {
|
||||
html = `<option value="260*120*45">260*120*45mm</option>`;
|
||||
}
|
||||
if (text == "蓝色弯弯") {
|
||||
html = `<option value="230*120*45">230*120*45mm</option>`;
|
||||
}
|
||||
if (text == "斜面5角星") {
|
||||
html = `<option value="280*70*70">280*70*70mm</option>`;
|
||||
}
|
||||
if (text == "麦穗圆型") {
|
||||
html = `<option value="180*150*40">180*150*40mm</option>`;
|
||||
}
|
||||
if (text == "酸洗凹面") {
|
||||
html = `<option value="280*10*80">280*10*80mm</option>`;
|
||||
}
|
||||
if (text == "月牙") {
|
||||
html = `<option value="180*170*45">180*170*45mm</option>`;
|
||||
}
|
||||
if (text == "大拇指") {
|
||||
html = `<option value="280*70*70">280*70*70mm</option>`;
|
||||
}
|
||||
if (text == "宝剑") {
|
||||
html = `<option value="255*80*60">255*80*60mm</option>`;
|
||||
}
|
||||
|
||||
if (text == "蓝色五角星") {
|
||||
html = `<option value="210*195*40">210*195*40mm</option>`;
|
||||
}
|
||||
} else {
|
||||
|
||||
if (text == "孚雕新树藤") {
|
||||
html = `
|
||||
<option value=""></option>
|
||||
<option value="24*31">24*31cm</option>
|
||||
<option value="25*35">25*35cm</option>
|
||||
<option value="30*40">30*40cm</option>
|
||||
<option value="35*50">35*50cm</option>
|
||||
`;
|
||||
}
|
||||
if (text == "万里长城") {
|
||||
html = `
|
||||
<option value=""></option>
|
||||
<option value="25*35">25*35cm</option>
|
||||
<option value="30*40">30*40cm</option>
|
||||
`;
|
||||
}
|
||||
}
|
||||
$("#size").empty().append(html);
|
||||
form.render();
|
||||
});
|
||||
|
||||
form.on('select(size)', function (data) {
|
||||
let kind = $("#kindValue option:selected").val();
|
||||
let name = $("#kind1Value option:selected").val();
|
||||
let size = data.value;
|
||||
let text = "";
|
||||
if (kind == "水晶") {
|
||||
|
||||
} else {
|
||||
if (name == "树藤") {
|
||||
if (size == '20*25') {
|
||||
text = "木托尺寸:20*25cm、金箔尺寸:15*20cm、内容排版尺寸:11*16cm";
|
||||
}
|
||||
if (size == '24*31') {
|
||||
text = "木托尺寸:24*31cm、金箔尺寸:20*27cm、内容排版尺寸:15*22cm";
|
||||
}
|
||||
if (size == '25*35') {
|
||||
text = "木托尺寸:25*35cm、金箔尺寸:20*30cm、内容排版尺寸:14.5*24.5cm";
|
||||
}
|
||||
if (size == '30*40') {
|
||||
text = "木托尺寸:30*40cm、金箔尺寸:25*35cm、内容排版尺寸:18.5*28.5cm";
|
||||
}
|
||||
if (size == '35*50') {
|
||||
text = "木托尺寸:35*50cm、金箔尺寸:30*45cm、内容排版尺寸:24*39.5cm";
|
||||
}
|
||||
if (size == '40*60') {
|
||||
text = "木托尺寸:40*60cm、金箔尺寸:35*55cm、内容排版尺寸:28*48cm";
|
||||
}
|
||||
}
|
||||
if (name == "角花") {
|
||||
if (size == '20*25') {
|
||||
text = "木托尺寸:20*25cm、金箔尺寸:15*20cm、内容排版尺寸:11.5*16.5cm";
|
||||
}
|
||||
if (size == '24*31') {
|
||||
text = "木托尺寸:24*31cm、金箔尺寸:20*27cm、内容排版尺寸:15*22cm";
|
||||
}
|
||||
if (size == '25*35') {
|
||||
text = "木托尺寸:25*35cm、金箔尺寸:20*30cm、内容排版尺寸:15*25cm";
|
||||
}
|
||||
if (size == '30*40') {
|
||||
text = "木托尺寸:30*40cm、金箔尺寸:25*35cm、内容排版尺寸:19*29cm";
|
||||
}
|
||||
if (size == '35*50') {
|
||||
text = "木托尺寸:35*50cm、金箔尺寸:30*45cm、内容排版尺寸:24*39.5cm";
|
||||
}
|
||||
if (size == '40*60') {
|
||||
text = "木托尺寸:40*60cm、金箔尺寸:35*55cm、内容排版尺寸:28*47cm";
|
||||
}
|
||||
}
|
||||
if (name == "镭射") {
|
||||
if (size == '20*25') {
|
||||
text = "木托尺寸:20*25cm、金箔尺寸:15*20cm、内容排版尺寸:12*17cm";
|
||||
}
|
||||
if (size == '24*31') {
|
||||
text = "木托尺寸:24*31cm、金箔尺寸:20*27cm、内容排版尺寸:16.5*23.5cm";
|
||||
}
|
||||
if (size == '25*35') {
|
||||
text = "木托尺寸:25*35cm、金箔尺寸:20*30cm、内容排版尺寸:16.5*26cm";
|
||||
}
|
||||
if (size == '30*40') {
|
||||
text = "木托尺寸:30*40cm、金箔尺寸:25*35cm、内容排版尺寸:20.5*30.5cm";
|
||||
}
|
||||
if (size == '35*50') {
|
||||
text = "木托尺寸:35*50cm、金箔尺寸:30*45cm、内容排版尺寸:24.5*40cm";
|
||||
}
|
||||
if (size == '40*60') {
|
||||
text = "木托尺寸:40*60cm、金箔尺寸:35*55cm、内容排版尺寸:28.5*48cm";
|
||||
}
|
||||
}
|
||||
if (name == "孚雕新树藤") {
|
||||
if (size == '20*25') {
|
||||
text = "木托尺寸:20*25cm、金箔尺寸:15*20cm、内容排版尺寸:12*17cm";
|
||||
}
|
||||
if (size == '24*31') {
|
||||
text = "木托尺寸:24*31cm、金箔尺寸:20*27cm、内容排版尺寸:13*20cm";
|
||||
}
|
||||
if (size == '25*35') {
|
||||
text = "木托尺寸:25*35cm、金箔尺寸:20*30cm、内容排版尺寸:13*22.5cm";
|
||||
}
|
||||
if (size == '30*40') {
|
||||
text = "木托尺寸:30*40cm、金箔尺寸:25*35cm、内容排版尺寸:16.5*26.5cm";
|
||||
}
|
||||
if (size == '35*50') {
|
||||
text = "木托尺寸:35*50cm、金箔尺寸:30*45cm、内容排版尺寸:20.5*34.5cm";
|
||||
}
|
||||
if (size == '40*60') {
|
||||
text = "木托尺寸:40*60cm、金箔尺寸:35*55cm、内容排版尺寸:28.5*48cm";
|
||||
}
|
||||
}
|
||||
if (name == "万里长城") {
|
||||
if (size == '20*25') {
|
||||
text = "木托尺寸:20*25cm、金箔尺寸:15*20cm、内容排版尺寸:12*17cm";
|
||||
}
|
||||
if (size == '24*31') {
|
||||
text = "木托尺寸:24*31cm、金箔尺寸:20*27cm、内容排版尺寸:13*20cm";
|
||||
}
|
||||
if (size == '25*35') {
|
||||
text = "木托尺寸:25*35cm、金箔尺寸:20*30cm、内容排版尺寸:16*26cm";
|
||||
}
|
||||
if (size == '30*40') {
|
||||
text = "木托尺寸:30*40cm、金箔尺寸:25*35cm、内容排版尺寸:20*30cm";
|
||||
}
|
||||
if (size == '35*50') {
|
||||
text = "木托尺寸:35*50cm、金箔尺寸:30*45cm、内容排版尺寸:20.5*34.5cm";
|
||||
}
|
||||
if (size == '40*60') {
|
||||
text = "木托尺寸:40*60cm、金箔尺寸:35*55cm、内容排版尺寸:28.5*48cm";
|
||||
}
|
||||
}
|
||||
if (name == "皇冠") {
|
||||
if (size == '20*25') {
|
||||
text = "木托尺寸:20*25cm、金箔尺寸:15*20cm、内容排版尺寸:12.5*18cm";
|
||||
}
|
||||
if (size == '24*31') {
|
||||
text = "木托尺寸:24*31cm、金箔尺寸:20*27cm、内容排版尺寸:17*24cm";
|
||||
}
|
||||
if (size == '25*35') {
|
||||
text = "木托尺寸:25*35cm、金箔尺寸:20*30cm、内容排版尺寸:17*27cm";
|
||||
}
|
||||
if (size == '30*40') {
|
||||
text = "木托尺寸:30*40cm、金箔尺寸:25*35cm、内容排版尺寸:22*32cm";
|
||||
}
|
||||
if (size == '35*50') {
|
||||
text = "木托尺寸:35*50cm、金箔尺寸:30*45cm、内容排版尺寸:26.5*41cm";
|
||||
}
|
||||
if (size == '40*60') {
|
||||
text = "木托尺寸:40*60cm、金箔尺寸:35*55cm、内容排版尺寸:30*50cm";
|
||||
}
|
||||
}
|
||||
if (name == "纯金/银箔") {
|
||||
if (size == '20*25') {
|
||||
text = "木托尺寸:20*25cm、金箔尺寸:15*20cm、内容排版尺寸:15*20cm";
|
||||
}
|
||||
if (size == '24*31') {
|
||||
text = "木托尺寸:24*31cm、金箔尺寸:20*27cm、内容排版尺寸:20*27cm";
|
||||
}
|
||||
if (size == '25*35') {
|
||||
text = "木托尺寸:25*35cm、金箔尺寸:20*30cm、内容排版尺寸:20*30cm";
|
||||
}
|
||||
if (size == '30*40') {
|
||||
text = "木托尺寸:30*40cm、金箔尺寸:25*35cm、内容排版尺寸:25*35cm";
|
||||
}
|
||||
if (size == '35*50') {
|
||||
text = "木托尺寸:35*50cm、金箔尺寸:30*45cm、内容排版尺寸:30*45cm";
|
||||
}
|
||||
if (size == '40*60') {
|
||||
text = "木托尺寸:40*60cm、金箔尺寸:35*55cm、内容排版尺寸:35*55cm";
|
||||
}
|
||||
}
|
||||
$("#size_tip").text(text);
|
||||
}
|
||||
})
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var number = $("#number").val();
|
||||
var length = $("#size").val();
|
||||
var width = $("#width option:selected").val();
|
||||
var count = $("#count").val();
|
||||
var kind = $("#kindValue option:selected").text();
|
||||
var kind1 = $("#kind1Value option:selected").text();
|
||||
var craft = $("input[name='craft']:checked").val();
|
||||
var size = $("#size option:selected").text();
|
||||
if (!count) {
|
||||
layer.msg('请填写数量！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
let craftList = [];
|
||||
$("input:radio[name='craft']:checked").each(function (i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if (!$(this).is(':disabled')) {
|
||||
craftList.push($(this).val());
|
||||
}
|
||||
});
|
||||
$("input:radio[name='inkjet']:checked").each(function (i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if (!$(this).is(':disabled')) {
|
||||
craftList.push($(this).val());
|
||||
}
|
||||
});
|
||||
$("input:radio[name='engrave']:checked").each(function (i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if (!$(this).is(':disabled')) {
|
||||
craftList.push($(this).val());
|
||||
}
|
||||
});
|
||||
$("input:radio[name='color']:checked").each(function (i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if (!$(this).is(':disabled')) {
|
||||
craftList.push($(this).val());
|
||||
}
|
||||
});
|
||||
$("input:radio[name='colors']:checked").each(function (i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if (!$(this).is(':disabled')) {
|
||||
craftList.push($(this).val());
|
||||
}
|
||||
});
|
||||
if (size.indexOf("cm") == -1) {
|
||||
size += "mm";
|
||||
}
|
||||
var span_result = '奖牌 - ' + kind + '-' + kind1 + '-' + size + ' (同款内容)\n' + "工艺 :" + craftList.join('、') + "\n";
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,405 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 金属标 -->
|
||||
<style>
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">金属标</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="金属标" >
|
||||
<p>
|
||||
产品种类
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" lay-filter="kind" name="kind" value="金属标" title="金属标">
|
||||
<input type="radio" lay-filter="kind" name="kind" value="UV转印贴" title="UV转印贴">
|
||||
</div>
|
||||
<div class="metal">
|
||||
<p>
|
||||
颜色
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select id="color" lay-filter="color" class="select">
|
||||
<option value="金色">金色</option>
|
||||
<option value="银色">银色</option>
|
||||
<option value="蓝色">蓝色</option>
|
||||
<option value="绿色">绿色</option>
|
||||
<option value="红色">红色</option>
|
||||
<option value="黑色">黑色</option>
|
||||
<option value="橙色">橙色</option>
|
||||
<option value="紫色">紫色</option>
|
||||
<option value="玫红色">玫红色</option>
|
||||
<option value="玫瑰金色">玫瑰金色</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
印色
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="craftMo" value="单色" title="单色" checked="checked">
|
||||
<input type="radio" name="craftMo" value="双色" title="双色">
|
||||
<input type="radio" name="craftMo" value="彩色(三色)" title="彩色(三色)">
|
||||
<input type="radio" name="craftMo" value="彩色(四色)" title="彩色(四色)">
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<span style="color:red;font-weight:700;">金属标尺寸不能超过29*19 cm</span>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" class="layui-input" id="count1">
|
||||
</div>
|
||||
</div>
|
||||
<div class="UVSticker" style="display:none" id="UVSticker">
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="UVSize" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<span style="color:red;font-weight:700;">UV转印贴尺寸不能超过500*50cm</span>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<!-- <div class="count">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select">
|
||||
<option value="10">10</option>
|
||||
<option value="20">20</option>
|
||||
<option value="30">30</option>
|
||||
<option value="50">50</option>
|
||||
<option value="100">100</option>
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" id="count" placeholder="请输入整数" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<div class="UVSticker" style="display:none">
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="专金" title="专金" class="craftZhuan">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="专银" title="专银" class="craftZhuan">
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="craftQie" calss="moqie" value="模切" lay-skin="primary" title="模切" checked="checked">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
form.on('radio(kind)', function(kindData) {
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
//proTypeValue : $("#proTypeValue").val(),
|
||||
proTypeValue : $('input[name="kind"]:checked').val()
|
||||
//kindValue : $("#kindValue").val(),
|
||||
//kind2Value : $("#kind2Value").val()
|
||||
},
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if(remark.indexOf("null") < 0){
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if(result.length == 0){
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
}else{
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
if(kindData.value == "金属标"){
|
||||
// 切换为品种单选框
|
||||
$(".metal").show();
|
||||
$(".metal").find(":input").attr("disabled", false);
|
||||
$(".UVSticker").hide();
|
||||
$(".UVSticker").find(":input").attr("disabled", true);
|
||||
$(".diyCount").hide();
|
||||
$(".count").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", true);
|
||||
$(".count").find(":input").attr("disabled", true);
|
||||
}else{
|
||||
// UV专用贴没有轮播图，隐藏
|
||||
document.getElementById("test1").style.display = "none";
|
||||
// 少数量、专版打印的时候，切换为品种下拉框
|
||||
$(".UVSticker").show();
|
||||
$(".UVSticker").find(":input").attr("disabled", false);
|
||||
$(".count").show();
|
||||
$(".count").find(":input").attr("disabled", false);
|
||||
$(".metal").hide();
|
||||
$(".metal").find(":input").attr("disabled", true);
|
||||
}
|
||||
form.render();//必须写
|
||||
})
|
||||
|
||||
// 自定义数量
|
||||
/* form.on('checkbox(switchCount)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$(".diyCount").show();
|
||||
$(".count").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", false);
|
||||
$(".count").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".count").show();
|
||||
$(".diyCount").hide();
|
||||
$(".count").find(":input").attr("disabled", false);
|
||||
$(".diyCount").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
}) */
|
||||
|
||||
form.on('checkbox(craftZhuan)',function(data){
|
||||
// 专金专银只能选一个
|
||||
var craftZhuan = $(".craftZhuan:checked").length;
|
||||
if (craftZhuan > 1) {
|
||||
$(data.elem).next().attr("class","layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg('[专金 - 专银]不能同时选择！', {offset : [ '300px', '300px' ]}, {icon : 5});
|
||||
return false;
|
||||
}
|
||||
})
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var kind = $('input[name="kind"]:checked').val()
|
||||
var number= $("#number").val();
|
||||
var craftMo = $("input[name='craftMo']:checked").val();
|
||||
if(kind == '金属标'){
|
||||
var size = $("#size").val();
|
||||
var color = $("#color").val();
|
||||
}else{
|
||||
var size = $("#UVSize").val();
|
||||
var craftMo = $('input[name="craftMo"]:checked').val();
|
||||
var craftShua = [$('input[name="craft"]:checked').val()];
|
||||
}
|
||||
if(!kind){
|
||||
layer.msg("请选择产品种类！",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if(!size){
|
||||
layer.msg("请填写尺寸！",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
// 选中‘自定义数量’
|
||||
/* if($('input[name="switchCount"]:checked').length != 0){
|
||||
if ($("#count").val() > 10) {
|
||||
layer.msg("自定义数量只能填写十以内的整数",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
} */
|
||||
if(kind == '金属标'){
|
||||
if ((size.split("*")[0] > 29 || size.split("*")[1] > 19) && (size.split("*")[0] > 19 || size.split("*")[1] > 29)) {
|
||||
layer.msg("【金属标】尺寸不能超过29*19 cm",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}else{
|
||||
if ((size.split("*")[0] > 500 || size.split("*")[1] > 50) && (size.split("*")[0] > 50 || size.split("*")[1] > 500)) {
|
||||
layer.msg("【UV转印贴】尺寸不能超过500*50 cm",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if(craftShua != "" && $("#count").val() < 25){
|
||||
layer.msg("【UV转印贴】专金/专银25个起做",{offset:['300px','300px']},function(){});
|
||||
}
|
||||
}
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
if(kind == '金属标'){
|
||||
var span_result ='金属标 - ' + color +' - '+ size +'厘米 -' + craftMo + '-(同款内容)\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
}else{
|
||||
var span_result ='UV转印贴 - ' + craftShua +' - '+ size +'厘米 -(同款内容) - ' + [data[0].msg] + '\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
data[i].kindLabel = 'UV转印贴'
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
data[i].kindLabel = 'UV转印贴'
|
||||
}
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var craft = "";
|
||||
var count = "";
|
||||
var kindValue = "";
|
||||
if($("#UVSticker").css("display") == "none"){
|
||||
count = $("#count1").val();
|
||||
kindValue = color;
|
||||
}else{
|
||||
count = $("#count").val();
|
||||
craft = "模切";
|
||||
craft += craftShua;
|
||||
}
|
||||
|
||||
getRemark(kind, size, count+"张", kindValue, number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,461 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- 金属标 -->
|
||||
<style>
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">金属标</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="金属标">
|
||||
<p>
|
||||
产品种类
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" lay-filter="kind" name="kind" value="金属标" title="金属标">
|
||||
<input type="radio" lay-filter="kind" name="kind" value="UV转印贴" title="UV转印贴">
|
||||
</div>
|
||||
<div class="metal">
|
||||
<p>
|
||||
颜色
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select id="color" lay-filter="color" class="select">
|
||||
<option value="金色">金色</option>
|
||||
<option value="银色">银色</option>
|
||||
<option value="蓝色">蓝色</option>
|
||||
<option value="绿色">绿色</option>
|
||||
<option value="红色">红色</option>
|
||||
<option value="黑色">黑色</option>
|
||||
<option value="橙色">橙色</option>
|
||||
<option value="紫色">紫色</option>
|
||||
<option value="玫红色">玫红色</option>
|
||||
<option value="玫瑰金色">玫瑰金色</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
印色
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="craftMo" lay-filter="craftMo" value="单色" title="单色" checked="checked">
|
||||
<input type="radio" name="craftMo" lay-filter="craftMo" value="双色" title="双色">
|
||||
<input type="radio" name="craftMo" lay-filter="craftMo" value="彩色(三色)" title="彩色(三色)">
|
||||
<input type="radio" name="craftMo" lay-filter="craftMo" value="彩色(四色)" title="彩色(四色)">
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<span style="color:red;font-weight:700;">金属标尺寸不能超过29*19 cm</span>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" class="layui-input"
|
||||
id="count1">
|
||||
</div>
|
||||
</div>
|
||||
<div class="UVSticker" style="display:none" id="UVSticker">
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="UVSize" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<%-- <span style="color:red;font-weight:700;">UV转印贴尺寸不能超过500*58cm,加工艺不能超过42*28.5cm</span>--%>
|
||||
<span style="color:red;font-weight:700;">UV转印贴尺寸不能超过500*58cm</span>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<!-- <div class="count">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select">
|
||||
<option value="10">10</option>
|
||||
<option value="20">20</option>
|
||||
<option value="30">30</option>
|
||||
<option value="50">50</option>
|
||||
<option value="100">100</option>
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" id="count" placeholder="请输入整数" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<div class="UVSticker" style="display:none">
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="专金" title="专金"
|
||||
class="craftZhuan">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="专银" title="专银"
|
||||
class="craftZhuan">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="烫金" title="烫金"
|
||||
class="craftZhuan">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="烫银" title="烫银"
|
||||
class="craftZhuan">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="烫蓝" title="烫蓝"
|
||||
class="craftZhuan">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="烫红" title="烫红"
|
||||
class="craftZhuan">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="烫黑" title="烫黑"
|
||||
class="craftZhuan">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="镭射银" title="镭射银"
|
||||
class="craftZhuan">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="镭射金" title="镭射金"
|
||||
class="craftZhuan">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="玫瑰金" title="玫瑰金"
|
||||
class="craftZhuan">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="印刷+烫金" title="印刷+烫金"
|
||||
class="craftZhuan">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="印刷+烫银" title="印刷+烫银"
|
||||
class="craftZhuan">
|
||||
<input type="checkbox" name="craft" lay-filter="craftZhuan" value="双面贴" title="双面贴"
|
||||
class="craftZhuan">
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="craftQie" calss="moqie" value="模切" lay-skin="primary" title="模切"
|
||||
checked="checked">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
function getProductImage() {
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
let craft = $("input[name='craft']:checked").val();
|
||||
let craftMo = $("input[name='craftMo']:checked").val();
|
||||
let data = {
|
||||
proTypeValue: $('input[name="kind"]:checked').val()
|
||||
}
|
||||
if (data.proTypeValue == '金属标' && (craftMo == '双色' || craftMo == '彩色(三色)')) {
|
||||
data.craftValue = craftMo;
|
||||
}
|
||||
if (data.proTypeValue == 'UV转印贴') {
|
||||
data.craftValue = craft;
|
||||
}
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data,
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
form.on("radio(craftMo)", function (data) {
|
||||
getProductImage()
|
||||
})
|
||||
form.on('radio(kind)', function (kindData) {
|
||||
getProductImage()
|
||||
if (kindData.value == "金属标") {
|
||||
// 切换为品种单选框
|
||||
$(".metal").show();
|
||||
$(".metal").find(":input").attr("disabled", false);
|
||||
$(".UVSticker").hide();
|
||||
$(".UVSticker").find(":input").attr("disabled", true);
|
||||
$(".diyCount").hide();
|
||||
$(".count").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", true);
|
||||
$(".count").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
// 少数量、专版打印的时候，切换为品种下拉框
|
||||
$(".UVSticker").show();
|
||||
$(".UVSticker").find(":input").attr("disabled", false);
|
||||
$(".count").show();
|
||||
$(".count").find(":input").attr("disabled", false);
|
||||
$(".metal").hide();
|
||||
$(".metal").find(":input").attr("disabled", true);
|
||||
}
|
||||
form.render();//必须写
|
||||
})
|
||||
|
||||
// 自定义数量
|
||||
/* form.on('checkbox(switchCount)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$(".diyCount").show();
|
||||
$(".count").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", false);
|
||||
$(".count").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".count").show();
|
||||
$(".diyCount").hide();
|
||||
$(".count").find(":input").attr("disabled", false);
|
||||
$(".diyCount").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
}) */
|
||||
|
||||
form.on('checkbox(craftZhuan)', function (data) {
|
||||
// 专金专银只能选一个
|
||||
var craftZhuan = $(".craftZhuan:checked").length;
|
||||
if (craftZhuan > 1) {
|
||||
$(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg('[专金 - 专银]不能同时选择！', {offset: ['300px', '300px']}, {icon: 5});
|
||||
return false;
|
||||
}
|
||||
getProductImage()
|
||||
})
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var kind = $('input[name="kind"]:checked').val()
|
||||
var number = $("#number").val();
|
||||
var craftMo = $("input[name='craftMo']:checked").val();
|
||||
if (kind == '金属标') {
|
||||
var size = $("#size").val();
|
||||
var color = $("#color").val();
|
||||
} else {
|
||||
var size = $("#UVSize").val();
|
||||
var craftMo = $('input[name="craftMo"]:checked').val();
|
||||
var craftShua = [$('input[name="craft"]:checked').val()];
|
||||
}
|
||||
if (!kind) {
|
||||
layer.msg("请选择产品种类！", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!size) {
|
||||
layer.msg("请填写尺寸！", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
// 选中‘自定义数量’
|
||||
/* if($('input[name="switchCount"]:checked').length != 0){
|
||||
if ($("#count").val() > 10) {
|
||||
layer.msg("自定义数量只能填写十以内的整数",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
} */
|
||||
if (kind == '金属标') {
|
||||
if ((size.split("*")[0] > 29 || size.split("*")[1] > 19) && (size.split("*")[0] > 19 || size.split("*")[1] > 29)) {
|
||||
layer.msg("【金属标】尺寸不能超过29*19 cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
} else {
|
||||
if ((size.split("*")[0] > 500 || size.split("*")[1] > 58) && (size.split("*")[0] > 58 || size.split("*")[1] > 500)) {
|
||||
layer.msg("【UV转印贴】尺寸不能超过500*58 cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (craftShua != "" && craftShua != "双面贴" && (size.split("*")[0] > 42 || size.split("*")[1] > 28.5) && (size.split("*")[0] > 28.5 || size.split("*")[1] > 42)) {
|
||||
layer.msg("【UV转印贴】带工艺尺寸不能超过42*28.5 cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
if (kind == '金属标') {
|
||||
var span_result = '金属标 - ' + color + ' - ' + size + '厘米 -' + craftMo + '-(同款内容)\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
var span_result = 'UV转印贴 - ' + craftShua + ' - ' + size + '厘米 -(同款内容) - ' + [data[0].msg] + '\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
data[i].kindLabel = 'UV转印贴'
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
data[i].kindLabel = 'UV转印贴'
|
||||
}
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var craft = "";
|
||||
var count = "";
|
||||
var kindValue = "";
|
||||
if ($("#UVSticker").css("display") == "none") {
|
||||
count = $("#count1").val();
|
||||
kindValue = color;
|
||||
} else {
|
||||
count = $("#count").val();
|
||||
craft = "模切";
|
||||
craft += craftShua;
|
||||
}
|
||||
|
||||
getRemark(kind, size, count + "张", kindValue, number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,260 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<style>
|
||||
.select {
|
||||
width: 100px;
|
||||
margin-top: 5px;
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">慕斯垫</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="29">
|
||||
<p>
|
||||
品种
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" class="select" lay-filter="setKind" lay-verify="required">
|
||||
<option value="0">9*9cm直角</option>
|
||||
<option value="1">9.5*9.5cm圆角</option>
|
||||
<option value="2">12*8cm白色三角异形</option>
|
||||
<option value="3">12*8cm黑色三角异形</option>
|
||||
<option value="4">9*9cm金色圆角</option>
|
||||
<option value="5">9*9cm银色圆角</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" id="count" class="select">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>工艺</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="craftTang" lay-filter="craftTang" value="烫金" title="烫金" checked>
|
||||
<input type="radio" name="craftTang" lay-filter="craftTang" value="凹凸" title="凹凸">
|
||||
<input type="radio" name="craftTang" lay-filter="craftTang" value="烫金带凹凸" title="烫金带凹凸">
|
||||
|
|
||||
<input type="radio" name="craftQie" value="模切" title="模切" checked>
|
||||
<input type="checkbox" name="craft" class="ui_zh" lay-filter="switch" value="折痕" title="折痕">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="13" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
function getProductImage() {
|
||||
|
||||
let craftTang = $("input[name='craftTang']:checked").val();
|
||||
let craft = $("input[name='craft']:checked").val();
|
||||
|
||||
$("#carousel").empty();
|
||||
let data = {proTypeValue: "29", craftValue: craftTang}
|
||||
let remark = "";
|
||||
let html = "";
|
||||
if (craft) {
|
||||
data.craftValue = craft
|
||||
}
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data,
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
form.on("radio(craftTang)", function () {
|
||||
getProductImage()
|
||||
})
|
||||
form.on("radio(switch)", function () {
|
||||
getProductImage()
|
||||
})
|
||||
//点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var kind = $("#kindValue option:selected").text();
|
||||
var craft = $("input[name='craftTang']:checked").val();
|
||||
var craftQie = $("input[name='craftQie']:checked").val();
|
||||
var number = $("#number").val();
|
||||
var arr = [];
|
||||
arr.push($('input[name="craft"]:checked').val());
|
||||
craft += craftQie;
|
||||
craft += arr;
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
var data = result.data.proList;
|
||||
var span_result = '900克慕斯垫 - ' + kind + "-" + craft + "(同款内容) " + '\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = $("#count option:selected").val();
|
||||
var size = "";
|
||||
size = kind.split("cm")[0];
|
||||
getRemark("慕斯垫", size, count + "个", kind, number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,533 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 便签纸 -->
|
||||
<style>
|
||||
.select{
|
||||
width:100px;
|
||||
margin-top:5px;
|
||||
display:inline-block;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">便签本/联单</h1>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" lay-filter="kind" name="notePaperKind" value="联单" title="联单" checked="checked">
|
||||
<input type="radio" lay-filter="kind" name="notePaperKind" value="稿纸/便签本/票本(每本100张)" title="稿纸 / 便签本 / 票本(每本100张)">
|
||||
<!-- <input type="radio" lay-filter="kind" name="notePaperKind" value="彩胶纸" title="彩胶纸"> -->
|
||||
<input type="radio" lay-filter="kind" name="notePaperKind" value="红头文件" title="红头文件(每本100张)">
|
||||
<input type="radio" lay-filter="kind" name="notePaperKind" value="彩色信纸(单面彩色印刷)" title="彩色信纸(单面彩色印刷)">
|
||||
</div>
|
||||
</form>
|
||||
<form class="layui-form" id="kindValueForm">
|
||||
<p>材质</p>
|
||||
<div class="kind1">
|
||||
<input type="radio" lay-filter="kindValue" name="kind2Value" value="0" title="二联单（50份100张）">
|
||||
<input type="radio" lay-filter="kindValue" name="kind2Value" value="1" title="三联单（30份90张）">
|
||||
<input type="radio" lay-filter="kindValue" name="kind2Value" value="2" title="四联单（25份100张）">
|
||||
</div>
|
||||
<div class="kind2" style="display:none">
|
||||
<input type="radio" name="kind2Value" value="3" title="60克双胶">
|
||||
<input type="radio" name="kind2Value" value="4" title="70克双胶">
|
||||
<input type="radio" name="kind2Value" value="5" title="80克双胶">
|
||||
</div>
|
||||
<div class="kind3" style="display:none">
|
||||
<input type="radio" name="70克彩胶" value="6" title="70克彩胶" checked="checked">
|
||||
<div>
|
||||
<input type="radio" name="craftMo" value="单面" title="单面" checked="checked">
|
||||
<input type="radio" name="craftMo" value="双面" title="双面">
|
||||
</div>
|
||||
<p>
|
||||
颜色
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select id="color" class="select">
|
||||
<option value="粉红色">粉红色</option>
|
||||
<option value="浅黄">浅黄</option>
|
||||
<option value="浅蓝">浅蓝</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="size" class="select">
|
||||
<option value="28.5*21">28.5 x 21 cm</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="kind4" style="display:none">
|
||||
<input type="radio" name="80克双胶" value="7" title="80克双胶" checked="checked">
|
||||
<p>
|
||||
尺寸(CM/厘米)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="size" class="select">
|
||||
<option value="29.7*21">29.7 x 21 cm</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="kind5" style="display:none">
|
||||
<input type="radio" name="kind2Value" class="noFifty" value="4" title="70克双胶">
|
||||
<input type="radio" name="kind2Value" class="hundred" value="5" title="80克双胶">
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<input type="radio" name="kind1Value" lay-filter="kind1Value" value="0" title="每本50张">
|
||||
<input type="radio" name="kind1Value" lay-filter="kind1Value" value="1" title="每本100张">
|
||||
</div>
|
||||
</form>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="16">
|
||||
<div class="size">
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<p>数量(本)</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="count" autocomplete="off" class="layui-input" placeholder="数量">
|
||||
</div>
|
||||
</div>
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="number" id="number" autocomplete="off" class="layui-input" value="1">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<div class="kind1">
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<input type="checkbox" name="craft" class="craft" lay-filter="switch" value="垫板" title="垫板">
|
||||
<input type="checkbox" name="craft" class="craft" lay-filter="switch" value="封皮" title="封皮">
|
||||
<input type="checkbox" name="craft" class="craft" lay-filter="switch" value="彩色" title="彩色">
|
||||
</div>
|
||||
<div class="kind2" style="display: none;">
|
||||
<p>工艺</p>
|
||||
<input type="checkbox" name="craft" class="craft" lay-filter="switch" value="垫板" title="垫板">
|
||||
<input type="checkbox" name="craft" class="craft" lay-filter="switch" value="封皮" title="封皮">
|
||||
</div>
|
||||
<hr>
|
||||
<hr class="layui-bg-orange">
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
// 没切换“联单”的时候默认禁用其它的下拉框,（防止提交表单）
|
||||
$(".kind2").find(":input").attr("disabled", true);
|
||||
$(".kind3").find(":input").attr("disabled", true);
|
||||
$(".kind4").find(":input").attr("disabled", true);
|
||||
// 选择材质种类--默认联单
|
||||
form.on('radio(kind)', function(kindData) {
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
proTypeValue : $("#proTypeValue").val(),
|
||||
kindValue : kindData.value
|
||||
},
|
||||
//dataType : "json",
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if(remark.indexOf("null") < 0){
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
if(result.length == 0){
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
}else{
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
$("#kindValueForm")[0].reset();
|
||||
// 产品种类的值
|
||||
kind = kindData.value
|
||||
|
||||
if(kind == "联单"){
|
||||
$("#proTypeValue").val("16");
|
||||
$(".size").show();
|
||||
$(".size").find(":input").attr("disabled", false);
|
||||
$(".kind1").show();
|
||||
$(".kind1").find(":input").attr("disabled", false);
|
||||
$(".kind2").hide();
|
||||
$(".kind2").find(":input").attr("disabled", true);
|
||||
$(".kind3").hide();
|
||||
$(".kind3").find(":input").attr("disabled", true);
|
||||
$(".kind4").hide();
|
||||
$(".kind4").find(":input").attr("disabled", true);
|
||||
$(".kind5").hide();
|
||||
$(".kind5").find(":input").attr("disabled", true);
|
||||
$('input[class = craft]').eq(0).prop('checked', true);
|
||||
$('input[class = craft]').eq(1).prop('checked', true);
|
||||
}else if(kind == "稿纸/便签本/票本(每本100张)"){
|
||||
$("#proTypeValue").val("16");
|
||||
$(".size").show();
|
||||
$(".size").find(":input").attr("disabled", false);
|
||||
$(".kind2").show();
|
||||
$(".kind2").find(":input").attr("disabled", false);
|
||||
$(".kind1").hide();
|
||||
$(".kind1").find(":input").attr("disabled", true);
|
||||
$(".kind3").hide();
|
||||
$(".kind3").find(":input").attr("disabled", true);
|
||||
$(".kind4").hide();
|
||||
$(".kind4").find(":input").attr("disabled", true);
|
||||
$(".kind5").hide();
|
||||
$(".kind5").find(":input").attr("disabled", true);
|
||||
}else if(kind == "彩胶纸"){
|
||||
$("#proTypeValue").val("16");
|
||||
$(".size").hide();
|
||||
$(".size").find(":input").attr("disabled", true);
|
||||
$(".kind3").show();
|
||||
$(".kind3").find(":input").attr("disabled", false);
|
||||
$(".kind1").hide();
|
||||
$(".kind1").find(":input").attr("disabled", true);
|
||||
$(".kind2").hide();
|
||||
$(".kind2").find(":input").attr("disabled", true);
|
||||
$(".kind4").hide();
|
||||
$(".kind4").find(":input").attr("disabled", true);
|
||||
$(".kind5").hide();
|
||||
$(".kind5").find(":input").attr("disabled", true);
|
||||
}else if(kind == "红头文件"){
|
||||
$("#proTypeValue").val("16");
|
||||
$(".size").hide();
|
||||
$(".size").find(":input").attr("disabled", true);
|
||||
$(".kind4").show();
|
||||
$(".kind4").find(":input").attr("disabled", false);
|
||||
$(".kind1").hide();
|
||||
$(".kind1").find(":input").attr("disabled", true);
|
||||
$(".kind2").hide();
|
||||
$(".kind2").find(":input").attr("disabled", true);
|
||||
$(".kind3").hide();
|
||||
$(".kind3").find(":input").attr("disabled", true);
|
||||
$(".kind5").hide();
|
||||
$(".kind5").find(":input").attr("disabled", true);
|
||||
}else if(kind == "彩色信纸(单面彩色印刷)"){
|
||||
$("#proTypeValue").val("彩色信纸");
|
||||
$(".size").show();
|
||||
$(".size").find(":input").attr("disabled", false);
|
||||
$(".kind5").show();
|
||||
$(".kind5").find(":input").attr("disabled", false);
|
||||
$(".kind1").hide();
|
||||
$(".kind1").find(":input").attr("disabled", true);
|
||||
$(".kind2").hide();
|
||||
$(".kind2").find(":input").attr("disabled", true);
|
||||
$(".kind3").hide();
|
||||
$(".kind3").find(":input").attr("disabled", true);
|
||||
$(".kind4").hide();
|
||||
$(".kind4").find(":input").attr("disabled", true);
|
||||
}
|
||||
form.render();//必须写
|
||||
});
|
||||
|
||||
// 判断是否有 【70克双胶】
|
||||
form.on('radio(kind1Value)', function(kind1ValueData) {
|
||||
// 选择【每本50张】的时候禁用70克双胶，切换成80克双胶
|
||||
if(kind1ValueData.value == "0"){
|
||||
$(".noFifty").attr("disabled", true);
|
||||
$('input[class = hundred]').prop('checked', true);
|
||||
$(".hundred").attr("disabled", false);// 加这个让按钮取消禁用模式
|
||||
}else{
|
||||
var size = $("#size").val();
|
||||
if ((size.split("*")[0] > 21 || size.split("*")[1] > 14) && (size.split("*")[0] > 14 || size.split("*")[1] > 21)) {
|
||||
$(".noFifty").attr("disabled", true);
|
||||
$('input[class = hundred]').prop('checked', true);
|
||||
$(".hundred").attr("disabled", false);// 加这个让按钮取消禁用模式
|
||||
}else{
|
||||
$(".noFifty").attr("disabled", false);
|
||||
}
|
||||
}
|
||||
form.render('radio');
|
||||
})
|
||||
|
||||
//输入框的值改变时触发
|
||||
$("#size").on("input",function(e){
|
||||
var size = e.delegateTarget.value;
|
||||
kind1Value = $('input[name="kind1Value"]:checked').val()
|
||||
//获取input输入的值
|
||||
if(kind1Value == "1"){
|
||||
// 输入尺寸大于21
|
||||
if(size > 21){
|
||||
$(".noFifty").attr("disabled", true);
|
||||
$('input[class = hundred]').prop('checked', true);
|
||||
$(".hundred").attr("disabled", false);// 加这个让按钮取消禁用模式
|
||||
}else{
|
||||
$(".noFifty").attr("disabled", false);
|
||||
}
|
||||
// 尺寸第一位小于21，第二位不符合
|
||||
if(size.indexOf("*") != -1){
|
||||
if ((size.split("*")[0] > 21 || size.split("*")[1] > 14) && (size.split("*")[0] > 14 || size.split("*")[1] > 21)) {
|
||||
$(".noFifty").attr("disabled", true);
|
||||
$('input[class = hundred]').prop('checked', true);
|
||||
$(".hundred").attr("disabled", false);// 加这个让按钮取消禁用模式
|
||||
}else{
|
||||
$(".noFifty").attr("disabled", false);
|
||||
}
|
||||
}
|
||||
form.render('radio');
|
||||
}
|
||||
});
|
||||
//工艺选择 -- 增加皮的种类
|
||||
form.on('checkbox(switch)', function(data) {
|
||||
if(data.value==='封皮'){
|
||||
$('input[class = craft]').eq(0).prop('checked', true);
|
||||
form.render();
|
||||
}
|
||||
|
||||
});
|
||||
//点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var notePaperKind = $('input[name="notePaperKind"]:checked').val();
|
||||
var kindData={
|
||||
0 :"二联单（50份100张）",1 :"三联单（30份90张）",2 :"四联单（25份100张）",
|
||||
3 :"60克双胶",4 :"70克双胶",5 :"80克双胶",
|
||||
6 :"70克彩胶",7 :"80克双胶"
|
||||
},kind1Data={
|
||||
0 :"每本50张",1 :"每本100张",
|
||||
};
|
||||
if(notePaperKind == "彩胶纸"){
|
||||
var kindValue = 6
|
||||
var craft = $('input[name="craftMo"]:checked').val();
|
||||
var size = "28.5 x 21"
|
||||
var color = $("#color").val();
|
||||
}else if(notePaperKind == "红头文件"){
|
||||
var kindValue = 7
|
||||
var size = "29.7 x 21"
|
||||
var craft = ""
|
||||
var color = ""
|
||||
}else if(notePaperKind == "联单"){
|
||||
var kindValue = $('input[name="kind2Value"]:checked').val();
|
||||
var size = $("#size").val();
|
||||
var craft = [];
|
||||
$("input:checkbox[name='craft']:checked").each(function(i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if(!$(this).is(':disabled')){
|
||||
craft.push($(this).val());
|
||||
}
|
||||
});
|
||||
var color = ""
|
||||
if ((size.split("*")[0] > 42 || size.split("*")[1] > 28.5) && (size.split("*")[0] > 28.5 || size.split("*")[1] > 42)) {
|
||||
layer.msg("联单尺寸超过42*28.5 cm请单独报价",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}else if(notePaperKind == "稿纸/便签本/票本(每本100张)"){
|
||||
var kindValue = $('input[name="kind2Value"]:checked').val();
|
||||
var size = $("#size").val();
|
||||
var craft = [];
|
||||
$("input:checkbox[name='craft']:checked").each(function(i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if(!$(this).is(':disabled')){
|
||||
craft.push($(this).val());
|
||||
}
|
||||
});
|
||||
var color = ""
|
||||
if ((size.split("*")[0] > 28.5 || size.split("*")[1] > 21) && (size.split("*")[0] > 21 || size.split("*")[1] > 28.5)) {
|
||||
layer.msg("稿纸/便签本/票本尺寸超过28.5 * 21 cm请单独报价",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}else if(notePaperKind == "彩色信纸(单面彩色印刷)"){
|
||||
var kind1Value = $('input[name="kind1Value"]:checked').val();
|
||||
var kindValue = $('input[name="kind2Value"]:checked').val();
|
||||
var size = $("#size").val();
|
||||
var craft = ""
|
||||
var color = ""
|
||||
if ((size.split("*")[0] < 10 || size.split("*")[1] < 7) && (size.split("*")[0] < 7 || size.split("*")[1] < 10)) {
|
||||
layer.msg("联单尺寸不能小于10*7 cm",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if ((size.split("*")[0] > 42 || size.split("*")[1] > 28.5) && (size.split("*")[0] > 28.5 || size.split("*")[1] > 42)) {
|
||||
layer.msg("联单尺寸超过42*28.5 cm请单独报价",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
var number = $("#number").val();
|
||||
var kind = [kindData[kindValue]];
|
||||
if(!size){
|
||||
layer.msg('请填写尺寸！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if (!kindValue) {
|
||||
layer.msg('请选择材料！', {
|
||||
offset : [ '300px', '300px' ]
|
||||
}, function() {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
console.log(craft);
|
||||
var span_result = notePaperKind + ' - ' + kind +'-' + [kind1Data[kind1Value]] +' -' + craft +'- ' + color + size +' 厘米 -(同款内容)\n' + '款数 : ' + number + '\n';
|
||||
if(notePaperKind == "红头文件" || notePaperKind == "彩胶纸"){
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
}else{
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "本，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "本，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
kind[0] = kind[0].replace("（","");
|
||||
kind[0] = kind[0].replace("）","");
|
||||
var count = $("input[name='count']").val();
|
||||
if(notePaperKind.indexOf("稿纸/便签本/票本") >= 0){
|
||||
notePaperKind = "便签本";
|
||||
}else if(notePaperKind.indexOf("红头文件") >= 0){
|
||||
size = "29.7*21";
|
||||
}
|
||||
getRemark(notePaperKind, size, count+"本", kind, number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,37 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValueOther" class="layui-input" value="4">
|
||||
<p>材质</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" value="2" title="300克铜版纸" checked="checked">
|
||||
</div>
|
||||
<p>规格</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="diySizeSpecialCard">
|
||||
<input type="text" name="size" id="sizeOtherCard" placeholder="格式:长*宽" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<p>数量（个）</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number"
|
||||
id="numberOtherCard" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
@@ -0,0 +1,244 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 包装盒 -->
|
||||
<style>
|
||||
.p{
|
||||
color:green;font-weight:400;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">包装盒</h1> <span style="color:red;font-weight:700;">(500个起做)</span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="20" >
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kind" class="kind" title="350克白卡纸" checked="checked" value="350克白卡纸">
|
||||
</div>
|
||||
<p>
|
||||
种类
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="kindValue" class="kindValue" lay-filter="kindValue" value="0" title="双插盒">
|
||||
<input type="radio" name="kindValue" class="kindValue" lay-filter="kindValue" value="1" title="飞机盒">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽 * 高 </span><span style="font-size:8px;color:green">（请按格式输入）</span></p>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽*高" name="size" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" id="count" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
form.on('radio(kindValue)', function (data){
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
proTypeValue : $("#proTypeValue").val(),
|
||||
kindValue : $('input[name="kindValue"]:checked').val(),
|
||||
//kind2Value : $("#kind2Value").val()
|
||||
},
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if(remark.indexOf("null") < 0){
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
if(result.length == 0){
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
}else{
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var kindData={
|
||||
0 :"双插盒",
|
||||
1 :"飞机盒",
|
||||
};
|
||||
var kind = kindData[$('input[name="kindValue"]:checked').val()];
|
||||
var number= $("#number").val();
|
||||
var size= $("#size").val();
|
||||
if(!kind){
|
||||
layer.msg('请选择种类！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if(!size){
|
||||
layer.msg('请填写尺寸！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if(size.indexOf("*") != -1 && size.indexOf(("*"), size.indexOf("*") + 1) == -1){
|
||||
layer.msg('请填写正确的尺寸格式！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result = '包装盒 - 350克白卡纸 - ' + kind + ' - ' + size +' CM -(同款内容)\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = $("#count").val();
|
||||
kind += $("input[name='kind']:checked").val();
|
||||
getRemark("包装盒", size, count+"个", kind, number, "", "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,205 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 一次性纸杯 -->
|
||||
<style>
|
||||
.edge .layui-edge{
|
||||
right:10px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">一次性纸杯</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kind1Value" id="kind1Value" class="select">
|
||||
<option value="280克">280克(260克原纸+20克淋膜)</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="size" id="size" class="select">
|
||||
<option value="7.5*5.2*7.5">7蛊司(上口75mm/下口52mm/高度75mm )</option>
|
||||
<option value="7.5*5.2*8.6">9蛊司(上口75mm/下口52mm/高度86mm)</option>
|
||||
</select>
|
||||
</div>
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="一次性纸杯" >
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count">
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
<option value="20000">20000</option>
|
||||
<option value="30000">30000</option>
|
||||
<option value="50000">50000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var number= $("#number").val();
|
||||
var size = $("#size").val();
|
||||
var kind = $("#size").find("option:selected").text();
|
||||
var index = kind.indexOf("(");
|
||||
kind = kind.substring(0, index);
|
||||
var kindValue = $("#kind1Value").val();
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result ="一次性纸杯 - " + kind + " - " + kindValue + " - (同款内容)\n";
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = $("#count option:selected").val();
|
||||
getRemark("一次性纸杯", size+"cm", count+"张", kind, number, "", "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},/* {
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价',
|
||||
templet : function(d) {
|
||||
return Math.ceil(d.price * 0.98)
|
||||
}
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价',
|
||||
templet : function(d) {
|
||||
return Math.ceil(d.price * 0.96)
|
||||
}
|
||||
}, */{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,111 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
<style>
|
||||
.fixedSizeParkingCard,.fixedCountParkingCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
#diySizeParkingCard,#diyCountParkingCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
.fixedSizeParkingCard .layui-input,.fixedCountParkingCard .layui-input{
|
||||
width:100%
|
||||
}
|
||||
.fixedSizeParkingCard .layui-edge,.fixedCountParkingCard .layui-edge{
|
||||
right:0px
|
||||
}
|
||||
</style>
|
||||
<input type="hidden" name="proTypeValue" class="layui-input" value="停车卡">
|
||||
<p>材质</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="2" title="300克铜版纸" checked="checked">
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item fixedSizeParkingCard">
|
||||
<select name="size" id="fixedSizeParkingCard" class="select">
|
||||
<option value="21*9">21*9 cm</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diySizeParkingCard" style="display:none">
|
||||
<input type="text" name="size" id="diySizeParkingCard" placeholder="格式:长*宽" class="layui-input" autocomplete="off">
|
||||
</span>
|
||||
<input type="checkbox" name="switchSize" class="switchSizeParkingCard" lay-filter="switchSizeParkingCard" title="自定义尺寸" lay-skin="primary">
|
||||
<span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item fixedCountParkingCard">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diyCountParkingCard" style="display:none">
|
||||
<input type="text" name="count" id="diyCountParkingCard" placeholder="请输入整数" autocomplete="off"
|
||||
class="layui-input" lay-verify="number">
|
||||
</span>
|
||||
<input type="checkbox" name="switchCount"lay-filter="switchCountParkingCard" title="自定义数量" lay-skin="primary">
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number"
|
||||
id="numberParkingCard" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
|
||||
<script>
|
||||
layui.use(['table','form'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
// 默认没有选中复选框
|
||||
$('.switchSizeParkingCard').val("off")
|
||||
// 自定义尺寸
|
||||
form.on('checkbox(switchSizeParkingCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$('.switchSizeParkingCard').val("on")
|
||||
$(".diySizeParkingCard").show();
|
||||
$(".fixedSizeParkingCard").hide();
|
||||
$(".diySizeParkingCard").find(":input").attr("disabled", false);
|
||||
$(".fixedSizeParkingCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$('.switchSizeParkingCard').val("off")
|
||||
$(".fixedSizeParkingCard").show();
|
||||
$(".diySizeParkingCard").hide();
|
||||
$(".fixedSizeParkingCard").find(":input").attr("disabled", false);
|
||||
$(".diySizeParkingCard").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
|
||||
// 自定义數量
|
||||
form.on('checkbox(switchCountParkingCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$(".diyCountParkingCard").show();
|
||||
$(".fixedCountParkingCard").hide();
|
||||
$(".diyCountParkingCard").find(":input").attr("disabled", false);
|
||||
$(".fixedCountParkingCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".fixedCountParkingCard").show();
|
||||
$(".diyCountParkingCard").hide();
|
||||
$(".fixedCountParkingCard").find(":input").attr("disabled", false);
|
||||
$(".diyCountParkingCard").find(":input").attr("disabled", true);
|
||||
}
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
})
|
||||
})
|
||||
</script>
|
||||
@@ -0,0 +1,412 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 画册 -->
|
||||
<style>
|
||||
.p{
|
||||
color:green;font-weight:400;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">画册</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form" id="kindForm">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="19" >
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" lay-filter="kind" name="kind" value="常用种类" title="常规" checked="checked">
|
||||
<input type="radio" lay-filter="kind" name="kind" value="少数量" title="少数量（自来稿件）">
|
||||
</div>
|
||||
<div class="normal">
|
||||
<p>
|
||||
封面
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" class="kindValue" value="0" title="250克哑膜" checked="checked">
|
||||
</div>
|
||||
<p>
|
||||
内页
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="kind2Value" class="kind2Value" value="0" title="157克合板" checked="checked">
|
||||
<input type="radio" name="kind2Value" class="kind2Value" value="1" title="160克合板">
|
||||
<input type="radio" name="kind2Value" class="kind2Value" value="2" title="200克合板">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
装订
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kind3Value" class="kind3Value" value="0" title="骑马钉" checked="checked">
|
||||
<!-- <input type="radio" name="kind3Value" class="kind3Value" value="1" title="胶装"> -->
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
<input type="checkbox" name="craft" class="craft" value="设计" title="含设计">
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
封面P数 <span style="font-size:14px;color:green">（固定P数）</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" value="4" readonly class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
内页P数 <span style="font-size:14px;color:red">请输入4的整数倍</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入4的整数倍" autocomplete="off" name="pcount" id="pcount" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
数量(本)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="less" style="display:none">
|
||||
<p>
|
||||
封面
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" value="1" title="250克铜版纸">
|
||||
<input type="radio" name="kindValue" value="2" title="皮纹纸">
|
||||
</div>
|
||||
<p>
|
||||
内页
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="kind2Value2" value="3" title="157克铜版纸" checked>
|
||||
<input type="radio" name="kind2Value2" value="4" title="70克双胶纸">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
装订
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kind3Value3" value="0" title="骑马钉" checked>
|
||||
<input type="radio" name="kind3Value3" value="1" title="胶装">
|
||||
</div>
|
||||
<p>
|
||||
印色
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="craftShua" value="0" title="彩色" checked>
|
||||
<input type="radio" name="craftShua" value="1" title="单色">
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米)
|
||||
<!-- <span class="switchSize">
|
||||
<input type="checkbox" name="switchSize" class="Size" lay-filter="switchSize" title="自定义尺寸">
|
||||
</span>
|
||||
<span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
<div class="diySize" style="display:none">
|
||||
<input type="text" name="size" placeholder="格式:长*宽" class="layui-input" autocomplete="off">
|
||||
</div>-->
|
||||
</p>
|
||||
<div class="size">
|
||||
<select name="size" id="sizeLess" class="select">
|
||||
<option value="28.5*21">28.5 * 21 cm</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
封面P数 <span style="font-size:14px;color:green">（固定P数）</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" value="4" readonly class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
内页P数 <span style="font-size:14px;color:red"></span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入内页P数" autocomplete="off" name="pcount" id="lessPcount" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
数量(本)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" class="layui-input" id="count1">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
|
||||
//输入框的值改变时触发
|
||||
$("#lessPcount").on("input",function(e){
|
||||
//获取input输入的值
|
||||
if(e.delegateTarget.value > 36 && $('input[name="kind3Value3"]:checked').val() != "1"){
|
||||
layer.msg('内页超过36P装订方式请选择【胶装】!',{offset:['300px','300px']},function(){});
|
||||
}
|
||||
});
|
||||
|
||||
var kind ;
|
||||
// 没选按钮时候默认禁用少数量（防止提交表单）
|
||||
$(".less").find(":input").attr("disabled", true);
|
||||
form.on('radio(kind)', function(kindData) {
|
||||
kind = kindData.value;
|
||||
if(kindData.value == "常用种类"){
|
||||
// 切换按钮的时候,重置kind品种
|
||||
$("#kindForm")[0].reset();
|
||||
// 切换为品种单选框
|
||||
$(".normal").show();
|
||||
$(".normal").find(":input").attr("disabled", false);
|
||||
$(".less").hide();
|
||||
$(".less").find(":input").attr("disabled", true);
|
||||
}else{
|
||||
// 少数量、专版打印的时候，切换为品种下拉框
|
||||
$(".less").show();
|
||||
$(".less").find(":input").attr("disabled", false);
|
||||
$(".normal").hide();
|
||||
$(".normal").find(":input").attr("disabled", true);
|
||||
$('input[class = craft]').prop('checked', false);
|
||||
}
|
||||
form.render();//必须写
|
||||
})
|
||||
|
||||
// 自定义少数量
|
||||
/* form.on('checkbox(switchSize)', function(data) {
|
||||
if (data.elem.checked) {
|
||||
$(".diySize").show();
|
||||
$(".size").hide();
|
||||
$(".diySize").find(":input").attr("disabled", false);
|
||||
$(".size").find(":input").attr("disabled", true);
|
||||
}else{
|
||||
$(".size").show();
|
||||
$(".diySize").hide();
|
||||
$(".size").find(":input").attr("disabled", false);
|
||||
$(".diySize").find(":input").attr("disabled", true);
|
||||
// 恢复标准的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
}) */
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var kindValue = $('input[name="kindValue"]:checked').val();
|
||||
var kind2Value = $('input[name="kind2Value"]:checked').val();
|
||||
var kind3Value = $('input[name="kind3Value"]:checked').val();
|
||||
var kindData={
|
||||
0 :"250克哑膜",
|
||||
1 :"250克铜版纸",
|
||||
2 :"皮纹纸"
|
||||
},kind2Data={
|
||||
0 :"157克合板",
|
||||
1 :"160克合板",
|
||||
2 :"200克合板",
|
||||
3 :"157克铜版纸",
|
||||
4 :"70克双胶纸"
|
||||
},kind3Data={
|
||||
0 :"骑马钉",
|
||||
1 :"胶装"
|
||||
},caratShuaData={
|
||||
0 :"彩色",
|
||||
1 :"单色"
|
||||
};
|
||||
var size = $("#size").val();
|
||||
var pcount = $("#pcount").val();
|
||||
var number = $("#number").val();
|
||||
if(kind == "少数量"){
|
||||
var pcount = $("#lessPcount").val();
|
||||
var size = $("#sizeLess option:checked").val();
|
||||
var kind2Value = $('input[name="kind2Value2"]:checked').val();
|
||||
var kind3Value = $('input[name="kind3Value3"]:checked').val();
|
||||
var craftShua = $('input[name="craftShua"]:checked').val();
|
||||
//获取input输入的值
|
||||
if(pcount > 36 && $('input[name="kind3Value3"]:checked').val() != "1"){
|
||||
layer.msg('内页超过36P装订方式请选择【胶装】!',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if(kindValue == 0){
|
||||
layer.msg('请选择封面!',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if($('input[name="kind"]:checked').val() == "常用种类"){
|
||||
if(!size){
|
||||
layer.msg('请填写尺寸！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if ((size.split("*")[0] > 21 || size.split("*")[1] > 28.5) && (size.split("*")[0] > 28.5 || size.split("*")[1] > 21)) {
|
||||
layer.msg("尺寸超过 28.5*21 cm 请单独报价",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
if(kind != "少数量"){
|
||||
if(pcount%4 != 0){
|
||||
layer.msg('内页P数需为 4 的整数倍！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
// 200克合板只有36P价格（含封面4P）
|
||||
if(kind2Value == 2){
|
||||
if (pcount > 32){
|
||||
layer.msg('200克合板内页P数大于 32P 请单独报价！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}else{
|
||||
if (pcount > 48){
|
||||
layer.msg('157、160克内页P数大于 48P 请单独报价！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
var kind = kindData[kindValue];
|
||||
var kind2 = kind2Data[kind2Value];
|
||||
var kind3 = kind3Data[kind3Value];
|
||||
var craft = caratShuaData[craftShua];
|
||||
if($('input[name="kind"]:checked').val() == "少数量"){
|
||||
var span_result = '画册（自来稿件） - 封面:' + kind +' - 内页:'+ kind2 +' - '+ kind3 + ' - '+ [craft] + ' - ' + size + ' CM -(同款内容)\n' + "封面P数 :4\n" + "内页P数 :" + pcount + '\n';
|
||||
}else{
|
||||
var span_result = '画册 - 封面:' + kind +' - 内页:'+ kind2 +' - '+ kind3 + ' - ' + size + ' CM -(同款内容)\n' + "封面P数 :4\n" + "内页P数 :" + pcount + '\n';
|
||||
}
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "本，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "本，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮（偏远地区需补邮费）';
|
||||
if($("input[name='craft']:checked").val() == "设计"){
|
||||
span_result += "，（包含设计费）";
|
||||
}
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = "";
|
||||
if($(".less").css("display") == "none"){
|
||||
count = $("input[name='count']").val();
|
||||
}else{
|
||||
count = $("#count1").val();
|
||||
}
|
||||
var medol = $("input[name='kind2Value']:checked").attr("title");
|
||||
medol = medol.replace("合版", "");
|
||||
kind = "250克铜版纸-"+pcount+"P封面覆哑膜" + medol + "内页骑马钉";
|
||||
getRemark("画册", size, count+"本", kind, number, "", "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,220 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 餐垫纸 -->
|
||||
<style>
|
||||
.edge .layui-edge{
|
||||
right:10px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">餐垫纸</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="餐垫纸">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select">
|
||||
<option value="0">80克双胶纸</option>
|
||||
<option value="1">60克双胶纸</option>
|
||||
</select>
|
||||
</div>
|
||||
<!-- <p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kind2Value" id="kind2Value" lay-filter="kind2Value" class="select">
|
||||
<option value="0">42*28.5 CM</option>
|
||||
<option value="1" selected="selected">28.5*21 CM</option>
|
||||
<option value="2">21*14 CM</option>
|
||||
</select>
|
||||
</div> -->
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" lay-verify="required" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量（个）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var kindData = {
|
||||
0 :"80克双胶纸",
|
||||
1 :"60克双胶纸"
|
||||
};
|
||||
var kind = kindData[$("#kindValue").val()];
|
||||
var number = $("#number").val();
|
||||
var size = $("#size").val();
|
||||
if (size.split("*")[0] < 20 || size.split("*")[1] < 20) {
|
||||
layer.msg("餐垫纸尺寸不能小于20 cm",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if ((size.split("*")[0] > 115 || size.split("*")[1] > 85) && (size.split("*")[0] > 85 || size.split("*")[1] > 115)) {
|
||||
layer.msg("餐垫纸尺寸不能超过115*85 cm",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result ="餐垫纸 - " + kind +' - '+ size +' 厘米 -(同款内容)\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = $("#count option:selected").val();
|
||||
getRemark($("#proTypeValue").val(), size, count+"张", kind, number, "", "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},/* {
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价',
|
||||
templet : function(d) {
|
||||
return Math.ceil(d.price * 0.98)
|
||||
}
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价',
|
||||
templet : function(d) {
|
||||
return Math.ceil(d.price * 0.96)
|
||||
}
|
||||
}, */{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,111 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
<style>
|
||||
.fixedSizePointCard,.fixedCountPointCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
#diySizePointCard,#diyCountPointCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
.fixedSizePointCard .layui-input,.fixedCountPointCard .layui-input{
|
||||
width:100%
|
||||
}
|
||||
.fixedSizePointCard .layui-edge,.fixedCountPointCard .layui-edge{
|
||||
right:0px
|
||||
}
|
||||
</style>
|
||||
<input type="hidden" name="proTypeValue" class="layui-input" value="积分卡">
|
||||
<p>材质</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="2" title="300克铜版纸">
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item fixedSizePointCard">
|
||||
<select name="size" id="fixedSizePointCard" class="select">
|
||||
<option value="11*9">11*9 cm</option>
|
||||
<option value="9*5.4">9*5.4 cm</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diySizePointCard" style="display:none">
|
||||
<input type="text" name="size" id="diySizePointCard" placeholder="格式:长*宽" class="layui-input" autocomplete="off">
|
||||
</span>
|
||||
<input type="checkbox" name="switchSize" class="switchSizePointCard" lay-filter="switchSizePointCard" title="自定义尺寸" lay-skin="primary">
|
||||
<span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item fixedCountPointCard">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diyCountPointCard" style="display:none">
|
||||
<input type="text" name="count" id="diyCountPointCard" placeholder="请输入整数" autocomplete="off"
|
||||
class="layui-input" lay-verify="number">
|
||||
</span>
|
||||
<input type="checkbox" name="switchCount" lay-filter="switchCountPointCard" title="自定义数量" lay-skin="primary">
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number"
|
||||
id="numberPointCard" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<script>
|
||||
layui.use(['table','form'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
|
||||
$('.switchSizePointCard').val("off")
|
||||
// 自定义尺寸
|
||||
form.on('checkbox(switchSizePointCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$('.switchSizePointCard').val("on")
|
||||
$(".diySizePointCard").show();
|
||||
$(".fixedSizePointCard").hide();
|
||||
$(".diySizePointCard").find(":input").attr("disabled", false);
|
||||
$(".fixedSizePointCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$('.switchSizePointCard').val("off")
|
||||
$(".fixedSizePointCard").show();
|
||||
$(".diySizePointCard").hide();
|
||||
$(".fixedSizePointCard").find(":input").attr("disabled", false);
|
||||
$(".diySizePointCard").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
|
||||
// 自定义數量
|
||||
form.on('checkbox(switchCountPointCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$(".diyCountPointCard").show();
|
||||
$(".fixedCountPointCard").hide();
|
||||
$(".diyCountPointCard").find(":input").attr("disabled", false);
|
||||
$(".fixedCountPointCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".fixedCountPointCard").show();
|
||||
$(".diyCountPointCard").hide();
|
||||
$(".fixedCountPointCard").find(":input").attr("disabled", false);
|
||||
$(".diyCountPointCard").find(":input").attr("disabled", true);
|
||||
}
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
})
|
||||
})
|
||||
</script>
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,111 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
<style>
|
||||
.fixedSizePraiseCard,.fixedCountPraiseCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
#diySizePraiseCard,#diyCountPraiseCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
.fixedSizePraiseCard .layui-input,.fixedCountPraiseCard .layui-input{
|
||||
width:100%
|
||||
}
|
||||
.fixedSizePraiseCard .layui-edge,.fixedCountPraiseCard .layui-edge{
|
||||
right:0px
|
||||
}
|
||||
</style>
|
||||
<input type="hidden" name="proTypeValue" class="layui-input" value="好评卡">
|
||||
<p>材质</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="2" title="300克铜版纸">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="0" title="157克铜版纸">
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item fixedSizePraiseCard">
|
||||
<select name="size" id="fixedSizePraiseCard" class="select">
|
||||
<option value="14*6.8">14*6.8 cm</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diySizePraiseCard" style="display:none">
|
||||
<input type="text" name="size" id="diySizePraiseCard" placeholder="格式:长*宽" class="layui-input" autocomplete="off">
|
||||
</span>
|
||||
<input type="checkbox" name="switchSize" class="switchSizePraiseCard" lay-filter="switchSizePraiseCard" title="自定义尺寸" lay-skin="primary">
|
||||
<span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item fixedCountPraiseCard">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diyCountPraiseCard" style="display:none">
|
||||
<input type="text" name="count"id="diyCountPraiseCard" placeholder="请输入整数" autocomplete="off"
|
||||
class="layui-input" lay-verify="number">
|
||||
</span>
|
||||
<input type="checkbox" name="switchCount" lay-filter="switchCountPraiseCard" title="自定义数量" lay-skin="primary">
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number"
|
||||
id="numberPraiseCard" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<script>
|
||||
layui.use(['table','form'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
|
||||
$('.switchSizePraiseCard').val("off")
|
||||
// 自定义尺寸
|
||||
form.on('checkbox(switchSizePraiseCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$('.switchSizePraiseCard').val("on")
|
||||
$(".diySizePraiseCard").show();
|
||||
$(".fixedSizePraiseCard").hide();
|
||||
$(".diySizePraiseCard").find(":input").attr("disabled", false);
|
||||
$(".fixedSizePraiseCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$('.switchSizePraiseCard').val("off")
|
||||
$(".fixedSizePraiseCard").show();
|
||||
$(".diySizePraiseCard").hide();
|
||||
$(".fixedSizePraiseCard").find(":input").attr("disabled", false);
|
||||
$(".diySizePraiseCard").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
|
||||
// 自定义數量
|
||||
form.on('checkbox(switchCountPraiseCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$(".diyCountPraiseCard").show();
|
||||
$(".fixedCountPraiseCard").hide();
|
||||
$(".diyCountPraiseCard").find(":input").attr("disabled", false);
|
||||
$(".fixedCountPraiseCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".fixedCountPraiseCard").show();
|
||||
$(".diyCountPraiseCard").hide();
|
||||
$(".fixedCountPraiseCard").find(":input").attr("disabled", false);
|
||||
$(".diyCountPraiseCard").find(":input").attr("disabled", true);
|
||||
}
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
})
|
||||
})
|
||||
</script>
|
||||
@@ -0,0 +1,235 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 节目单 -->
|
||||
<style>
|
||||
.edge .layui-edge{
|
||||
right:10px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">节目单</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kind1Value" id="kind1Value" class="select">
|
||||
<option value="0">300克铜版纸</option>
|
||||
</select>
|
||||
</div>
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="节目单" >
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" class="select">
|
||||
<option value="0">A4（297*210mm）</option>
|
||||
<option value="1">A3（420*297mm）</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kind2Value" id="kind2Value" class="select">
|
||||
<option value="0">对折</option>
|
||||
<option value="1">三折</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count">
|
||||
<option value="50">50</option>
|
||||
<option value="100">100</option>
|
||||
<option value="200">200</option>
|
||||
<option value="300">300</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="双面覆哑膜" title="双面覆哑膜" checked>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var kindData={
|
||||
0 :"A4（297*210mm）",
|
||||
1 :"A3（420*297mm）"
|
||||
},kind1Data={
|
||||
0 :"300克铜版纸"
|
||||
},kind2Data={
|
||||
0 :"对折",
|
||||
1 :"三折"
|
||||
};
|
||||
var kind = kindData[$("#kindValue").val()];
|
||||
var kind1 = kind1Data[$("#kind1Value").val()];
|
||||
var kind2 = kind2Data[$("#kind2Value").val()];
|
||||
var number= $("#number").val();
|
||||
var arr = [];
|
||||
$("input:checkbox[name='craft']:checked").each(function(i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if(!$(this).is(':disabled')){
|
||||
arr.push($(this).val());
|
||||
}
|
||||
});
|
||||
console.log('-----选中的值-----', arr);
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result ="节目单- " + kind1 +' - '+ kind + " - " + kind2 +' -(同款内容)\n' + "工艺 :"+ arr + "\n";
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
size = kind.substring(3,10);
|
||||
console.log(size);
|
||||
var count = $("#count option:selected").val();
|
||||
getRemark("节目单", size+"mm", count+"张", kind1, number, arr, "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},/* {
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价',
|
||||
templet : function(d) {
|
||||
return Math.ceil(d.price * 0.98)
|
||||
}
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价',
|
||||
templet : function(d) {
|
||||
return Math.ceil(d.price * 0.96)
|
||||
}
|
||||
}, */{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,375 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!--PVC异型卡片 -->
|
||||
<style>
|
||||
.edge .layui-edge {
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.layui-form-checkbox[lay-skin=primary] i {
|
||||
border-radius: 50px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
.layui-form-checkbox[lay-skin=primary] span {
|
||||
color: black;
|
||||
margin-top: 3px;
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">PVC异型卡片</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="PVC异型卡片">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="kindValue" class="kindValue" lay-filter="kindValue" value="1"
|
||||
title="0.38PVC哑光异型卡片" checked="checked">
|
||||
<input type="radio" name="kindValue" class="kindValue" lay-filter="kindValue" value="2"
|
||||
title="0.38PVC亮光异型卡片">
|
||||
<input type="radio" name="kindValue" class="kindValue" lay-filter="kindValue" value="3"
|
||||
title="0.76PVC亮光异型卡片">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽 </span>
|
||||
<input type="checkbox" name="switchSize" class="switchSizeCoupon" lay-filter="switchSizeCoupon"
|
||||
title="自定义尺寸" lay-skin="primary">
|
||||
</p>
|
||||
<div class="layui-form-item fixedSizeCoupon">
|
||||
<select name="size" id="fixedSizeCoupon" class="select">
|
||||
<!-- <option value="16*3">16*3</option> -->
|
||||
<option value="20*4">20*4</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diySizeCoupon" style="display:none">
|
||||
<input type="text" id="diySizeCoupon" placeholder="格式:长*宽" class="layui-input" autocomplete="off">
|
||||
</span>
|
||||
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" id="count" class="select">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>工艺</p>
|
||||
<input type="radio" name="craft" value="圆角矩形" title="圆角矩形" checked="checked">
|
||||
<input type="radio" name="craft" value="直角矩形" title="直角矩形">
|
||||
<input type="radio" name="craft" value="异形" title="异形">
|
||||
<div>
|
||||
<input type="radio" name="craftShua" value="单面" title="单面" checked="checked">
|
||||
<input type="radio" name="craftShua" value="双面" title="双面">
|
||||
<input type="checkbox" name="craftJiao" lay-filter="switch" value="背胶" title="背胶" lay-skin="primary">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
// 监听count输入框
|
||||
$(function () {
|
||||
//输入框的值改变时触发
|
||||
$("#size").on("input", function (e) {
|
||||
//获取input输入的值
|
||||
/* if($('input[name="kindValue"]:checked').val() == "2"){
|
||||
if(e.delegateTarget.value.indexOf(".") != -1){
|
||||
layer.msg('请输入整数尺寸!',{offset:['300px','300px']},function(){});
|
||||
}
|
||||
} */
|
||||
});
|
||||
});
|
||||
|
||||
$('.switchSizeCoupon').val("off")
|
||||
// 自定义尺寸
|
||||
form.on('checkbox(switchSizeCoupon)', function (data) {
|
||||
if (data.elem.checked) {
|
||||
$('.switchSizeCoupon').val("on")
|
||||
$(".diySizeCoupon").show();
|
||||
$("#diySizeCoupon").attr("name", "size");
|
||||
$(".fixedSizeCoupon").hide();
|
||||
$("#fixedSizeCoupon").attr("name", "");
|
||||
$(".diySizeCoupon").find(":input").attr("disabled", false);
|
||||
$(".fixedSizeCoupon").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$('.switchSizeCoupon').val("off")
|
||||
$(".fixedSizeCoupon").show();
|
||||
$("#fixedSizeCoupon").attr("name", "size");
|
||||
$(".diySizeCoupon").hide();
|
||||
$("#diySizeCoupon").attr("name", "");
|
||||
$(".fixedSizeCoupon").find(":input").attr("disabled", false);
|
||||
$(".diySizeCoupon").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
form.on('radio(kindValue)', (data) => {
|
||||
var html = " ";
|
||||
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: {
|
||||
proTypeValue: $("#proTypeValue").val(),
|
||||
kindValue: data.value
|
||||
},
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
form.on('checkbox(switch)', function (data) {
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: {
|
||||
proTypeValue: $("#proTypeValue").val(),
|
||||
kindValue: $("#kindValue1").val()
|
||||
},
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
}
|
||||
remark += '<div><span>' + content + '<span/></div>';
|
||||
$("#carousel").append(html);
|
||||
$("#remark").append(remark);
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
layer.msg("温馨提示：因工艺产品问题某些小尺寸可能报价会超过大尺寸，属于正常现象！", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
var kindData = {
|
||||
1: "0.38PVC哑光异形卡片",
|
||||
2: "0.38PVC亮光异型卡片",
|
||||
3: "0.76PVC亮光异性卡片"
|
||||
};
|
||||
var craft = $('input[name="craft"]:checked').val()
|
||||
var craftShua = $('input[name="craftShua"]:checked').val()
|
||||
var craftJiao = [$('input[name="craftJiao"]:checked').val()]
|
||||
var kind = kindData[$('input[name="kindValue"]:checked').val()];
|
||||
var number = $("#number").val();
|
||||
var switchSize = [$('input[name="switchSize"]:checked').val()];
|
||||
var size = "";
|
||||
console.log(switchSize);
|
||||
if (switchSize == "") {
|
||||
size = $("#fixedSizeCoupon").val();
|
||||
} else {
|
||||
size = $("#diySizeCoupon").val();
|
||||
}
|
||||
var count = $("#count").val();
|
||||
if (!size) {
|
||||
layer.msg('请填写尺寸！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
/* if(size.indexOf(".") != -1){
|
||||
layer.msg('请输入整数尺寸!',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
} */
|
||||
|
||||
if (size.split("*")[0] < 4 || size.split("*")[1] < 4) {
|
||||
layer.msg("尺寸不能小于4*4cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
if ((size.split("*")[0] > 42 || size.split("*")[1] > 42 && size.split("*")[0] > 28.5 || size.split("*")[1] > 28.5)) {
|
||||
layer.msg("尺寸不能大于42*28.5 cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result = 'PVC异形卡片 - ' + kind + ' - ' + size + ' CM' + ' - ' + craft + ' - ' + craftShua + ' - ' + craftJiao + '\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
craft += craftShua + craftJiao;
|
||||
var count = $("#count option:selected").val();
|
||||
getRemark($("#proTypeValue").val(), size, count, kind, number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,335 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<style>
|
||||
.edge .layui-edge {
|
||||
right: 20px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">数码PVC</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" value="数码PVC" class="layui-input">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select">
|
||||
<option value="1">0.38mm亮光</option>
|
||||
<option value="2">0.38mm磨砂</option>
|
||||
<option value="3">0.38mm哑光</option>
|
||||
<option value="10">0.38mm透明窗口PVC</option>
|
||||
<option value="4">0.84mm亮光</option>
|
||||
<option value="5">0.84mm磨砂</option>
|
||||
<option value="6">0.84mm哑光</option>
|
||||
<option value="7">1mm亮光</option>
|
||||
<option value="8">1mm磨砂</option>
|
||||
<option value="9">1mm哑光</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="size" placeholder="格式:长*宽" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="count">
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" id="count" placeholder="请输入整数" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<div class="craftDiv">
|
||||
<p>工艺</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="ui_jx" value="圆角矩形" title="圆角矩形" checked="checked">
|
||||
<input type="radio" name="ui_jx" value="直角矩形" title="直角矩形">
|
||||
<input type="radio" name="ui_jx" value="异形" title="异形">
|
||||
<br/>
|
||||
<input type="radio" name="craftShua" value="单面" title="单面" checked="checked">
|
||||
<input type="radio" name="craftShua" value="双面" title="双面">
|
||||
<br/>
|
||||
<input type="checkbox" name="ui_dk" lay-filter="switch" value="打孔" title="打孔">
|
||||
<input type="checkbox" name="craft" value="背胶" title="背胶">
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn" id="queryCondBtn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!-- <h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div> -->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
// 监听回车键，如果敲了回车，调用点击‘计算’
|
||||
$(document).keydown(function (e) {
|
||||
if (e.keyCode === 13) {
|
||||
$("#queryCondBtn").trigger("click");
|
||||
}
|
||||
});
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: {
|
||||
proTypeValue: $('#proTypeValue').val(),
|
||||
kindValue: $("#kindValue option:selected").val()
|
||||
},
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
form.on('select(kindValue)', (data) => {
|
||||
var html = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: {
|
||||
proTypeValue: $('#proTypeValue').val(),
|
||||
kindValue: data.value
|
||||
},
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var kindValue = $("#kindValue option:checked").text();
|
||||
if (kindValue == "") {
|
||||
layer.msg("请选择材质！", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var kind2Value = $("#kind2Value option:checked").text();
|
||||
var number = $("#number").val();
|
||||
var count = $("#count").val();
|
||||
var size = $("#size").val();
|
||||
var jx = $("input[name='ui_jx']:checked").val();
|
||||
var shua = $("input[name='craftShua']:checked").val();
|
||||
var craft = $("input[name='craft']:checked").val();
|
||||
var dk = $("input[name='ui_dk']:checked").val();
|
||||
var length = size.split("*")[0];
|
||||
var width = size.split("*")[1];
|
||||
if (!size) {
|
||||
layer.msg('请填写尺寸！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
} else {
|
||||
if ((length > 43.5 || width > 43.5 && length > 30.1 || width > 30.1)) {
|
||||
layer.msg("尺寸不能大于43.5*30.1 cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
var kindValueData = {
|
||||
1: "0.38mm亮光",
|
||||
2: "0.38mm磨砂",
|
||||
3: "0.38mm哑光",
|
||||
4: "0.84mm亮光",
|
||||
5: "0.84mm磨砂",
|
||||
6: "0.84mm哑光",
|
||||
7: "1mm亮光",
|
||||
8: "1mm磨砂",
|
||||
9: "1mm哑光",
|
||||
10: "0.38mm透明窗口PVC"
|
||||
};
|
||||
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
shua = jx + shua;
|
||||
if (craft != null) {
|
||||
shua += craft;
|
||||
}
|
||||
if (dk != null) {
|
||||
shua += dk;
|
||||
}
|
||||
|
||||
var span_result = "数码PVC" + ' - ' + kindValue + '-' + size + 'cm' + '-' + shua + ' -(同款内容)\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
getRemark("PVC证件", size + "mm", count + "张", kindValue, number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,320 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- 卷装标签 -->
|
||||
<style>
|
||||
.select {
|
||||
width: 100px;
|
||||
margin-top: 5px;
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">卷装标签</h1> <span style="color:red;font-weight:700;">一卷起做（每卷最少500张）</span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="2">
|
||||
<p>
|
||||
材料
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select">
|
||||
<option value=""></option>
|
||||
<option value="0">格底铜板纸卷标</option>
|
||||
<option value="1">格底PP合成纸</option>
|
||||
<option value="2">8丝光白PVC</option>
|
||||
<option value="3">5丝格底透明</option>
|
||||
<option value="4">格底哑银 / 亮银</option>
|
||||
<option value="5">格底银平光</option>
|
||||
<option value="6">单防热敏纸（底纸白色）</option>
|
||||
<option value="7">三防热敏纸（底纸蓝色）</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" lay-verify="required"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<p>数量(个)</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="count" autocomplete="off" class="layui-input" placeholder="数量">
|
||||
</div>
|
||||
</div>
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="number" id="number" autocomplete="off" class="layui-input" value="1">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<!-- <p>规格</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" class="ui_zz" name="shuliang" lay-filter="switch" value="500" title="每卷500张" checked="checked"/>
|
||||
<input type="radio" class="ui_zz" name="shuliang" lay-filter="switch" value="1000" title="每卷1000张" />
|
||||
<input type="radio" class="ui_zz" name="shuliang" lay-filter="switch" value="2000" title="每卷2000张" />
|
||||
</div> -->
|
||||
<p>工艺</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block check">
|
||||
<span style="float:left;margin-top:10px">覆膜 ： </span>
|
||||
<input type="checkbox" name="craft" class="fm" lay-filter="switch" value="覆膜" title="覆膜">
|
||||
<!-- <input type="checkbox" name="craft" class="fm" lay-filter="switch" value="覆哑膜" title="覆哑膜" > -->
|
||||
<input type="checkbox" name="craft" class="fm" lay-filter="switch" value="大雪花镭射膜" title="大雪花镭射膜">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<span style="float:left;margin-top:10px">白墨 ： </span>
|
||||
<input type="checkbox" class="yb" name="yinbai" lay-filter="switch" value="印白" title="印白">
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<span style="float:left;margin-top:10px">卷芯 ： </span>
|
||||
<input type="radio" class="jc" name="jx" lay-filter="switch" value="7.5cm" title="7.5cm"
|
||||
checked="checked"/>
|
||||
<input type="radio" class="jc" name="jx" lay-filter="switch" value="4cm" title="4cm"/>
|
||||
<input type="radio" class="jc" name="jx" lay-filter="switch" value="3cm" title="3cm"/>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
<span style="float:left;margin-top:10px">出标方向 ： </span>
|
||||
<input type="radio" class="cb" name="cb" lay-filter="switch" value="上出标" title="上出标" checked="checked"/>
|
||||
<input type="radio" class="cb" name="cb" lay-filter="switch" value="下出标" title="下出标"/>
|
||||
<input type="radio" class="cb" name="cb" lay-filter="switch" value="左出标" title="左出标"/>
|
||||
<input type="radio" class="cb" name="cb" lay-filter="switch" value="右出标" title="右出标"/>
|
||||
</div>
|
||||
<hr>
|
||||
<hr class="layui-bg-orange">
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
form.on('select(kindValue)', function (data) {
|
||||
// 中间三个可以印白
|
||||
if (data.value == 3 || data.value == 4 || data.value == 5) {
|
||||
$('.yb').removeAttr('disabled');
|
||||
} else {
|
||||
$('.yb').prop('disabled', 'disabled');
|
||||
}
|
||||
form.render();
|
||||
|
||||
var html = " ";
|
||||
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: {
|
||||
proTypeValue: $("#proTypeValue").val(),
|
||||
kindValue: data.value
|
||||
},
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
|
||||
form.on('checkbox(switch)', function (data) {
|
||||
// 亮膜哑膜只能选一个
|
||||
var moLen = $(".fm:checked").length;
|
||||
if (moLen > 1) {
|
||||
$(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg('[覆膜 - 镭射膜]不能同时选择！', {offset: ['300px', '300px']}, {icon: 5});
|
||||
return false;
|
||||
}
|
||||
})
|
||||
//点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var kindData = {
|
||||
0: "格底铜板纸卷标", 1: "格底PP合成纸", 2: "8丝光白PVC",
|
||||
3: "5丝格底透明", 4: "格底哑银 / 亮银", 5: "格底银平光",
|
||||
6: "单防热敏纸（底纸白色）", 7: "三防热敏纸（底纸蓝色）"
|
||||
};
|
||||
var kind = kindData[$("#kindValue").val()];
|
||||
var size = $("#size").val();
|
||||
var number = $("#number").val();
|
||||
var count = $("input[name='count']").val();
|
||||
var craft = [];
|
||||
$("input:checkbox[name='craft']:checked").each(function (i) {
|
||||
if (!$(this).is(':disabled')) {
|
||||
craft.push($(this).val());
|
||||
}
|
||||
});
|
||||
var yinbai = [];
|
||||
$("input:checkbox[name='yinbai']:checked").each(function (i) {
|
||||
if (!$(this).is(':disabled')) {
|
||||
yinbai.push($(this).val());
|
||||
}
|
||||
});
|
||||
if ((size.split("*")[0] > 42 || size.split("*")[1] > 38) && (size.split("*")[0] > 38 || size.split("*")[1] > 42)) {
|
||||
layer.msg("卷装标签尺寸不能超过42*38 cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if ((size.split("*")[0] < 2 || size.split("*")[1] < 2)) {
|
||||
layer.msg("卷装标签尺寸小于2*2 cm 请单独报价！", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
var span_result = "";
|
||||
if ($("#kindValue").val() == 0) {
|
||||
jx = $("input[name='jx']:checked").val();
|
||||
span_result = kind + ' - ' + size + ' 厘米 -卷芯直径' + $("input[name='jx']:checked").val() + '出标方向' + $("input[name='cb']:checked").val() + '(同款内容)\n' + '款数 : ' + number + '\n';
|
||||
} else {
|
||||
span_result = kind + ' - ' + size + ' 厘米 -(同款内容)\n' + '款数 : ' + number + '\n';
|
||||
}
|
||||
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
if (yinbai != "") {
|
||||
craft += yinbai;
|
||||
}
|
||||
if (craft != "") {
|
||||
craft += "-";
|
||||
}
|
||||
craft += "卷芯直径" + $("input[name='jx']:checked").val() + "出标方向" + $("input[name='cb']:checked").val();
|
||||
getRemark("卷装标签", size, count + "个", kind, number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,294 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 房卡套 -->
|
||||
<style>
|
||||
.layui-input{
|
||||
display:inline-block;
|
||||
}
|
||||
</style>
|
||||
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">房卡套</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr class="layui-bg-red">
|
||||
<form class="layui-form">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="k" class="k" lay-filter="k" value="0" title="常规卡套">
|
||||
<!--<input type="radio" name="k" class="k" lay-filter="k" value="1" title="自定义卡套">-->
|
||||
</div>
|
||||
</form>
|
||||
<form class="layui-form" id="roomCardForm">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="7" >
|
||||
<div class="cg" style="display: none">
|
||||
<%@include file="roomCardCG.jsp"%>
|
||||
</div>
|
||||
<div class="zdy" style="display: none">
|
||||
<%@include file="roomCardZDY.jsp"%>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<input type="checkbox" name="craft" class="tangjin" lay-filter="switch" value="单面局部烫金" title="单面局部烫金">
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn" id="queryCondBtn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFeeTooWeight.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
// 监听回车键，如果敲了回车，调用点击‘计算’
|
||||
$(document).keydown(function (e) {
|
||||
if (e.keyCode === 13) {
|
||||
$("#queryCondBtn").trigger("click");
|
||||
}
|
||||
});
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
// 选择是常规还是自定义
|
||||
form.on('radio(k)', function(data){
|
||||
// $("#roomCardForm")[0].reset();
|
||||
var level = data.value;//被点击的radio的value值
|
||||
// 常规
|
||||
if(level == 0){
|
||||
form.on('select(kindValue)', function (data){
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
proTypeValue : $("#proTypeValue").val(),
|
||||
kindValue : $("#kindValue").val()
|
||||
//$(".big_box form").serialize(),
|
||||
},
|
||||
//dataType : "json",
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if(remark.indexOf("null") < 0){
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
if(result.length == 0){
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
}else{
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
$(".cg").show();
|
||||
$(".zdy").hide();
|
||||
$(".zdy").find(":input").attr("disabled", true);
|
||||
$(".cg").find(":input").attr("disabled", false);
|
||||
}else{
|
||||
$(".cg").hide();
|
||||
$(".zdy").show();
|
||||
$(".zdy").find(":input").attr("disabled", false);
|
||||
$(".cg").find(":input").attr("disabled", true);
|
||||
}
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var number= $("#number").val();
|
||||
// 自定义尺寸
|
||||
if(level == 1){
|
||||
var lengthSize = $(".lengthSize").val();
|
||||
var widthSize = $(".widthSize").val();
|
||||
var heightSize = $(".heightSize").val();
|
||||
if(lengthSize == "" || widthSize == "" || heightSize == ""){
|
||||
layer.msg("请填写正确的长宽高！",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var count =$("#count").val();
|
||||
if(!count){
|
||||
layer.msg('请输入数量！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
var arr = [];
|
||||
$("input:checkbox[name='craft']:checked").each(function(i) {
|
||||
// 没有被禁用的工艺加到arr中
|
||||
if(!$(this).is(':disabled')){
|
||||
arr.push($(this).val());
|
||||
}
|
||||
});
|
||||
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
// 常规
|
||||
if(level == 0){
|
||||
var kindData={
|
||||
0 :"对折式成品6.2*9.7CM",
|
||||
1 :"直角口袋式成品6.2*9.5CM",
|
||||
2 :"异形口袋式成品6.2*9.5CM"
|
||||
};
|
||||
var kind = kindData[$("#kindValue").val()];
|
||||
var span_result ='房卡套 - ' + "250克白卡纸 - 单面覆哑膜" +'\n规格 :'+ kind +' -(同款内容)\n' + '工艺： ' + arr + '\n';
|
||||
}else{
|
||||
var kindData={
|
||||
0 :"双面覆膜",
|
||||
1 :"不覆膜"
|
||||
};
|
||||
var kind = kindData[$('input[name="kind2Value"]:checked').val()];
|
||||
var size = "长" + lengthSize+ " 宽" + widthSize+ " 舌头" + heightSize
|
||||
var span_result ='房卡套 - ' + "300克铜版纸 - " + kind +'\n规格 :'+ size +' CM -(同款内容)\n' + '工艺： ' + arr + '\n';
|
||||
}
|
||||
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var size = "";
|
||||
var count = "";
|
||||
if(level == 0){
|
||||
var index = kind.indexOf("品");
|
||||
size = kind.substring(index+1, kind.length);
|
||||
size = size.replace("CM", "");
|
||||
count = $("#count1 option:selected").val();
|
||||
}else{
|
||||
size = lengthSize + "*" + widthSize + "*" + heightSize;
|
||||
count = $("#count").val();
|
||||
}
|
||||
|
||||
var craft = "单面覆哑膜" + arr;
|
||||
getRemark("房卡套", size, count+"个", "250克白卡纸", number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,30 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<p>材质</p>
|
||||
<input type="radio" title="250克白卡纸" checked="checked">
|
||||
<p>工艺</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" value="0" title="单面覆哑膜" checked="checked">
|
||||
</div>
|
||||
</div>
|
||||
<p>规格</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" class="select" lay-filter="kindValue">
|
||||
<option value=""></option>
|
||||
<option value="0">对折式成品6.2*9.7CM</option>
|
||||
<option value="1">直角口袋式成品6.2*9.5CM</option>
|
||||
<option value="2">异形口袋式成品6.2*9.5CM</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>数量（个）</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count1">
|
||||
<option value="200" selected="selected">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
@@ -0,0 +1,25 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
|
||||
<p>材质</p>
|
||||
<input type="radio" title="300克铜版纸" checked="checked">
|
||||
<p>工艺</p>
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="kind2Value" value="0" title="双面覆膜" checked="checked">
|
||||
</div>
|
||||
</div>
|
||||
<p>尺寸 <span style="font-size:14px;color:red">输入格式: 长 * 宽 * 舌头</span></p>
|
||||
<span>
|
||||
<input type="text" name="lengthSize" placeholder="长 cm" class="layui-input lengthSize" autocomplete="off" style="width:100px;">
|
||||
x
|
||||
<input type="text" name="widthSize" placeholder="宽 cm" class="layui-input widthSize" autocomplete="off" style="width:100px;">
|
||||
x
|
||||
<input type="text" name="heightSize" placeholder="舌头 cm" class="layui-input heightSize" autocomplete="off" style="width:100px;">
|
||||
</span>
|
||||
<p>数量（个）</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count"
|
||||
id="count" class="layui-input">
|
||||
</div>
|
||||
@@ -0,0 +1,116 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
<style>
|
||||
.fixedSizeScratchCard,.fixedCountScratchCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
#diySizeScratchCard,#diyCountScratchCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
.fixedSizeScratchCard .layui-input,.fixedCountScratchCard .layui-input{
|
||||
width:100%
|
||||
}
|
||||
.fixedSizeScratchCard .layui-edge,.fixedCountScratchCard .layui-edge{
|
||||
right:0px
|
||||
}
|
||||
</style>
|
||||
<input type="hidden" name="proTypeValue" class="layui-input" value="刮刮卡">
|
||||
<p>材质</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="2" title="300克铜版纸">
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<span class="layui-form-item fixedSizeScratchCard" style="width:400px;display:inline-block;">
|
||||
<select name="size" id="fixedSizeScratchCard" class="select">
|
||||
<option value="21*9">21*9 cm</option>
|
||||
<option value="16*9">16*9 cm</option>
|
||||
<option value="10.8*9">10.8*9 cm</option>
|
||||
<option value="10*6">10*6 cm</option>
|
||||
<option value="9*5.4">9*5.4 cm</option>
|
||||
</select>
|
||||
</span>
|
||||
<span class="diySizeScratchCard" style="display:none">
|
||||
<input type="text" name="size" id="diySizeScratchCard" placeholder="格式:长*宽" class="layui-input" autocomplete="off" style="width:400px;display:inline-block;">
|
||||
</span>
|
||||
<input type="checkbox" name="switchSize" class="switchSizeScratchCard" lay-filter="switchSizeScratchCard" style="font-size:10px" title="自定义尺寸" lay-skin="primary">
|
||||
<span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item fixedCountScratchCard">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diyCountScratchCard" style="display:none">
|
||||
<input type="text" name="count" id="diyCountScratchCard" placeholder="请输入整数" autocomplete="off"
|
||||
class="layui-input" lay-verify="number">
|
||||
</span>
|
||||
<input type="checkbox" name="switchCount" lay-filter="switchCountScratchCard" title="自定义数量" lay-skin="primary">
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number"
|
||||
id="numberScratchCard" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
|
||||
<script>
|
||||
layui.use(['table','form'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
|
||||
// 默认没有选中复选框
|
||||
$('.switchSizeScratchCard').val("off")
|
||||
// 自定义尺寸
|
||||
form.on('checkbox(switchSizeScratchCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$('.switchSizeScratchCard').val("on")
|
||||
$(".diySizeScratchCard").show();
|
||||
$(".fixedSizeScratchCard").hide();
|
||||
$(".diySizeScratchCard").find(":input").attr("disabled", false);
|
||||
$(".fixedSizeScratchCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$('.switchSizeScratchCard').val("off")
|
||||
$(".fixedSizeScratchCard").show();
|
||||
$(".diySizeScratchCard").hide();
|
||||
$(".fixedSizeScratchCard").find(":input").attr("disabled", false);
|
||||
$(".diySizeScratchCard").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
|
||||
// 自定义數量
|
||||
form.on('checkbox(switchCountScratchCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$(".diyCountScratchCard").show();
|
||||
$(".fixedCountScratchCard").hide();
|
||||
$(".diyCountScratchCard").find(":input").attr("disabled", false);
|
||||
$(".fixedCountScratchCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".fixedCountScratchCard").show();
|
||||
$(".diyCountScratchCard").hide();
|
||||
$(".fixedCountScratchCard").find(":input").attr("disabled", false);
|
||||
$(".diyCountScratchCard").find(":input").attr("disabled", true);
|
||||
}
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
})
|
||||
})
|
||||
</script>
|
||||
@@ -0,0 +1,234 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">手拉旗</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="手拉旗" />
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select" lay-search>
|
||||
<option value=""></option>
|
||||
<option value="1">春亚布</option>
|
||||
<option value="2">贡缎布</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
宽度
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="width" id="width" class="select">
|
||||
<option value="17">17cm</option>
|
||||
<option value="24">24cm</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
长度(CM/厘米)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入长度" name="size" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" class="layui-input" id="count">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
proTypeValue : $("#proTypeValue").val(),
|
||||
},
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if(remark.indexOf("null") < 0){
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if(result.length == 0){
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
}else{
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var number= $("#number").val();
|
||||
var length = $("#size").val();
|
||||
var width = $("#width option:selected").val();
|
||||
var count = $("#count").val();
|
||||
var kind = $("#kindValue option:selected").text();
|
||||
var craft = $("input[name='craft']:checked").val();
|
||||
if(!length){
|
||||
layer.msg('请填写长度！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if(length > 100){
|
||||
layer.msg('最大长度100cm！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
if(!count){
|
||||
layer.msg('请填写数量！',{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
if((length == 70 && width == 24)||(length == 50 && width == 17)){
|
||||
kind += "(特价)";
|
||||
}
|
||||
var span_result = '手拉旗 - ' + kind + '-' + length + '*' + width +' CM (同款内容)\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,90 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<!-- 特种纸名片 -->
|
||||
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValueSpecialCard"
|
||||
class="layui-input" value="特种纸名片">
|
||||
<!-- <p>种类</p>
|
||||
<div>
|
||||
<input type="radio" name="craftKind" lay-filter="craftKind" value="无工艺名片" title="无工艺名片">
|
||||
<input type="radio" name="craftKind" lay-filter="craftKind" value="工艺名片" title="工艺名片">
|
||||
</div> -->
|
||||
<p>材料</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" lay-filter="kindValueSelect" class="select kindValueSelect">
|
||||
<option value=""></option>
|
||||
<option value="安格纸">300克安格纸</option>
|
||||
<option value="白卡纸">300克白卡纸</option>
|
||||
<option value="刚古纸">300克刚古纸</option>
|
||||
<option value="莱妮卡">300克莱妮卡</option>
|
||||
<option value="珠光纸">300克珠光纸</option>
|
||||
<option value="布纹纸">300克布纹纸</option>
|
||||
<option value="蛋壳纸">300克蛋壳纸</option>
|
||||
<option value="牛皮纸">300克牛皮卡</option>
|
||||
<option value="米黄漂金">300克米黄漂金</option>
|
||||
<option value="500克黑卡双面印金/银">500克黑卡双面印金/银</option>
|
||||
<option value="300克冰白纸彩色印刷">300克冰白纸彩色印刷</option>
|
||||
<option value="触感咖啡330克印金/银">触感咖啡330克印金/银</option>
|
||||
<option value="采石白色600克彩色印刷">采石白色600克彩色印刷</option>
|
||||
<option value="优质绵米色600克">优质绵米色600克</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size: 14px; color: red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="size" placeholder="格式:长*宽"
|
||||
class="layui-input sizeSpecialCard" autocomplete="off">
|
||||
</div>
|
||||
<div id="noCraft">
|
||||
<p>数量（张）
|
||||
<span class="cardCount" style="display:none"><input type="checkbox" class="switchCardCount" name="switchCardCount" lay-filter="switchCardCount" title="自定义数量"></span>
|
||||
</p>
|
||||
<div class="diyCardCount" style="display: none">
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" id="cardCount" placeholder="请输入整数" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<div class="notDiyCardCount">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="hasCraft">
|
||||
<p>数量（张）</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select">
|
||||
<option value="100">100</option>
|
||||
<option value="200">200</option>
|
||||
<option value="400">400</option>
|
||||
<option value="600">600</option>
|
||||
<option value="800">800</option>
|
||||
<option value="1000">1000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off"
|
||||
name="number" value="1" class="layui-input numberSpecialCard"
|
||||
lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>工艺</p>
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="倒圆角" title="倒圆角" class="noCraft">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="打孔" title="打孔">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="烫金/" title="烫金" class="hasCraft">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="击凸" title="击凸" class="hasCraft">
|
||||
@@ -0,0 +1,704 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- 特种纸名片 -->
|
||||
<style>
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">特种纸名片</h1>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="特种纸名片">
|
||||
<p>材料</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" lay-filter="kindValueSelect" class="select kindValueSelect">
|
||||
<option value=""></option>
|
||||
<option value="岚蝶">岚蝶</option>
|
||||
<option value="皙贝">皙贝</option>
|
||||
<option value="琮纹">琮纹</option>
|
||||
<option value="睿狐">睿狐</option>
|
||||
<option value="溪雪">溪雪(珠光)</option>
|
||||
<%-- <option value="300克布纹纸">300克布纹纸</option>--%>
|
||||
<option value="玉蕊">玉蕊</option>
|
||||
<option value="金绒">金绒</option>
|
||||
<%-- <option value="300克灵感纸">300克灵感纸</option>--%>
|
||||
<option value="芳怡">芳怡(草香)</option>
|
||||
<%-- <option value="300克米黄漂金">300克米黄漂金</option>--%>
|
||||
<!--<option value="500克黑卡双面印金/银">500克黑卡双面印金/银</option>-->
|
||||
<%-- <option value="300克冰白纸彩色印刷">300克冰白纸彩色印刷</option>--%>
|
||||
<%-- <option value="触感咖啡330克印金/银">触感咖啡330克印金/银</option>--%>
|
||||
<%-- <option value="采石白色600克彩色印刷">采石白色600克彩色印刷</option>--%>
|
||||
<!--<option value="优质绵米色600克">优质绵米色600克</option>-->
|
||||
<option value="萱姿">萱姿(雅柔)</option>
|
||||
<%-- <option value="500克拉丝闪银">500克拉丝闪银卡</option>--%>
|
||||
<%-- <option value="500克拉丝闪金">500克拉丝闪金卡</option>--%>
|
||||
<option value="素芸">素芸</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size: 14px; color: red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item" id="ui_size">
|
||||
<input type="text" name="size" placeholder="格式:长*宽"
|
||||
class="layui-input sizeSpecialCard" autocomplete="off">
|
||||
</div>
|
||||
<div id="ui_ls" style="display:none;">
|
||||
<input type="radio" name="ls_size" value="9*5.4" title="9*5.4cm" checked="checked">
|
||||
</div>
|
||||
<p>数量（张）
|
||||
<span class="cardCount" style="display:none"><input type="checkbox" class="switchCardCount"
|
||||
name="switchCardCount" lay-filter="switchCardCount"
|
||||
title="自定义数量"></span>
|
||||
</p>
|
||||
<div id="noCraft">
|
||||
<div class="diyCardCount" style="display: none">
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" id="cardCount" placeholder="请输入整数" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<div class="notDiyCardCount">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count1">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="hasCraft" style="display: none;">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count2">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="600">600</option>
|
||||
<option value="800">800</option>
|
||||
<option value="1000">1000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div id="ui_ls_count" style="display: none;">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count3">
|
||||
<option value="100">100</option>
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div id="ui_mk_count" style="display: none;">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select" id="count4">
|
||||
<option value="100">100</option>
|
||||
<option value="200">200</option>
|
||||
<option value="400">400</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off"
|
||||
name="number" value="1" id="number" class="layui-input"
|
||||
lay-verify="number">
|
||||
</div>
|
||||
<div class="layui-form-item" id="ui_des" style="display:none;">
|
||||
<p>
|
||||
设计内容
|
||||
</p>
|
||||
<select name="p" lay-filter="desType" id="desType" class="select" lay-search>
|
||||
<option value=""></option>
|
||||
<option value="1">改序号</option>
|
||||
<option value="2">改名字</option>
|
||||
<option value="3">改二维码</option>
|
||||
<option value="4">改图片</option>
|
||||
<option value="5">改内容模板相同</option>
|
||||
<option value="6" selected>改内容模板完全不同</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>工艺</p>
|
||||
<div id="craft_layout">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" id="dakong" value="打孔" title="打孔"
|
||||
class="niupikaNoMQCraft">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" id="craft_mo" value="异形模切" title="异形模切"
|
||||
class="niupikaCraft ">
|
||||
<span class="newCraft">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" id="craft_yuanjiao" value="圆角" title="圆角"
|
||||
class="noCraft">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" id="craft_dianxian" value="打点线" title="打点线"
|
||||
class="">
|
||||
|
||||
</span>
|
||||
|
||||
</div>
|
||||
<div id="mianka" style="display: none">
|
||||
<input type="checkbox" name="craft" lay-filter="mianka" value="圆角" title="圆角" disabled>
|
||||
<input type="checkbox" name="craft" lay-filter="mianka" value="击凸" title="击凸" disabled>
|
||||
<input type="checkbox" name="craft" lay-filter="mianka" value="压凹" title="压凹" disabled>
|
||||
<input type="checkbox" name="craft" lay-filter="mianka" value="异形模切" title="异形模切" disabled>
|
||||
<div id="color_type" class="layui-inline" style="display: none;width: 200px">
|
||||
<select name="craft" class="select" disabled>
|
||||
<option value="无色" selected>无色</option>
|
||||
<option value="有色">有色</option>
|
||||
<option value="有色加凹凸">有色加凹凸</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!--<input type="checkbox" name="craft" lay-filter="switch" value="烫金/" title="烫金" class="hasCraft ui_ls_craft">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="击凸" title="击凸" class="hasCraft">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="凹凸" title="凹凸" class="ui_ls_craft" disabled="disabled">
|
||||
<input type="checkbox" name="craft" lay-filter="switch" value="双面" title="双面" class="ui_ls_craft" disabled="disabled">-->
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
let remark_html = ''
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
$("#number").on("input", function (e) {
|
||||
var number = e.delegateTarget.value;
|
||||
var kind = $("input[name='kind']:checked").val();
|
||||
if (number > 1) {
|
||||
$("#ui_des").show();
|
||||
} else {
|
||||
$("#ui_des").hide();
|
||||
}
|
||||
});
|
||||
|
||||
form.on('select(kindValueSelect)', function (data) {
|
||||
// 轮播图
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: {
|
||||
proTypeValue: "4",
|
||||
kindValue: "6",
|
||||
kind2Value: data.value
|
||||
},
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
remark_html = remark;
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$("#mianka").hide()
|
||||
$("#mianka input").attr("disabled", true);
|
||||
$("#craft_layout").show()
|
||||
$("#craft_layout input").attr("disabled", false);
|
||||
if (data.value.length <= 4) {
|
||||
$("#noCraft").show();
|
||||
$("#hasCraft").hide();
|
||||
$("#noCraft").find(":input").attr("disabled", false);
|
||||
$("#hasCraft").find(":input").attr("disabled", true);
|
||||
$('.noCraft').removeAttr('disabled');
|
||||
$('.hasCraft').prop('disabled', 'disabled');
|
||||
|
||||
if (data.value == '珠光纸') {
|
||||
$('input[class = switchCardCount]').prop('checked', false);
|
||||
// 默认禁用自定义的数量
|
||||
$(".diyCardCount").find(":input").attr("disabled", true);
|
||||
//【自定义数量】复选框
|
||||
$(".cardCount").show();
|
||||
$("#ui_ls").hide();
|
||||
$("#ui_size").show();
|
||||
$("#ui_ls").find(":input").attr("disabled", true);
|
||||
$("#ui_size").find(":input").attr("disabled", false);
|
||||
$('.ui_ls_craft').prop('disabled', 'disabled');
|
||||
$('.hasCraft').prop('disabled', 'disabled');
|
||||
$('.noCraft').removeAttr('disabled');
|
||||
$('.niupikaNoMQCraft').removeAttr('disabled');
|
||||
$("#ui_ls_count").hide();
|
||||
$("#ui_ls_count").find(":input").attr("disabled", true);
|
||||
$("#ui_mk_count").hide()
|
||||
$("#ui_mk_count").find(":input").attr("disabled", true);
|
||||
// 自定义少数量
|
||||
form.on('checkbox(switchCardCount)', function (data) {
|
||||
if (data.elem.checked) {
|
||||
$(".diyCardCount").show();
|
||||
$(".notDiyCardCount").hide();
|
||||
$(".diyCardCount").find(":input").attr("disabled", false);
|
||||
$(".notDiyCardCount").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".notDiyCardCount").show();
|
||||
$(".diyCardCount").hide();
|
||||
$(".notDiyCardCount").find(":input").attr("disabled", false);
|
||||
$(".diyCardCount").find(":input").attr("disabled", true);
|
||||
}
|
||||
form.render();
|
||||
})
|
||||
} else if (data.value == '拉丝闪银' || data.value == '拉丝闪金') {
|
||||
$("#ui_ls").show();
|
||||
$("#ui_size").hide();
|
||||
$("#ui_ls").find(":input").attr("disabled", false);
|
||||
$("#ui_size").find(":input").attr("disabled", true);
|
||||
$('.hasCraft').prop('disabled', 'disabled');
|
||||
$('.noCraft').prop('disabled', 'disabled');
|
||||
$(".niupikaNoMQCraft").prop('disabled', 'disabled');
|
||||
$('.ui_ls_craft').removeAttr('disabled');
|
||||
$("#ui_ls_count").show();
|
||||
$("#ui_ls_count").find(":input").attr("disabled", false);
|
||||
$("#ui_mk_count").hide()
|
||||
$("#ui_mk_count").find(":input").attr("disabled", true);
|
||||
$(".cardCount").hide();
|
||||
$(".notDiyCardCount").hide();
|
||||
$(".diyCardCount").hide();
|
||||
$(".notDiyCardCount").find(":input").attr("disabled", true);
|
||||
$(".diyCardCount").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
//【自定义数量】复选框
|
||||
$(".cardCount").hide();
|
||||
|
||||
$(".notDiyCardCount").show();
|
||||
$(".diyCardCount").hide();
|
||||
$(".notDiyCardCount").find(":input").attr("disabled", false);
|
||||
$(".diyCardCount").find(":input").attr("disabled", true);
|
||||
$("#ui_ls").hide();
|
||||
$("#ui_size").show();
|
||||
$("#ui_ls").find(":input").attr("disabled", true);
|
||||
$("#ui_size").find(":input").attr("disabled", false);
|
||||
$('.ui_ls_craft').prop('disabled', 'disabled');
|
||||
$('.hasCraft').prop('disabled', 'disabled');
|
||||
$('.noCraft').removeAttr('disabled');
|
||||
$('.niupikaNoMQCraft').removeAttr('disabled');
|
||||
$("#ui_ls_count").hide();
|
||||
$("#ui_ls_count").find(":input").attr("disabled", true);
|
||||
$("#ui_mk_count").hide()
|
||||
$("#ui_mk_count").find(":input").attr("disabled", true);
|
||||
}
|
||||
|
||||
// 选中300克牛皮纸的时候，展示【异形模切】工艺，禁用【打孔】工艺
|
||||
// if (data.value == '金绒') {
|
||||
// $('.niupikaCraft').removeAttr('disabled');
|
||||
// } else {
|
||||
// $('.niupikaCraft').prop('disabled', 'disabled');
|
||||
// }
|
||||
form.render();
|
||||
} else {
|
||||
$("#hasCraft").show();
|
||||
$("#noCraft").hide();
|
||||
$("#hasCraft").find(":input").attr("disabled", false);
|
||||
$("#noCraft").find(":input").attr("disabled", true);
|
||||
$('.ui_ls_craft').prop('disabled', 'disabled');
|
||||
$('.hasCraft').removeAttr('disabled');
|
||||
$('.noCraft').prop('disabled', 'disabled');
|
||||
$('.niupikaNoMQCraft').removeAttr('disabled');
|
||||
$('.newCraft').removeAttr('disabled');
|
||||
$("#ui_ls").hide();
|
||||
$("#ui_size").show();
|
||||
$("#ui_ls").find(":input").attr("disabled", true);
|
||||
$("#ui_size").find(":input").attr("disabled", false);
|
||||
$("#ui_ls_count").hide();
|
||||
$("#ui_ls_count").find(":input").attr("disabled", true);
|
||||
$("#ui_mk_count").hide()
|
||||
$("#ui_mk_count").find(":input").attr("disabled", true);
|
||||
$(".newCraft").show();
|
||||
if (data.value == '金绒' || data.value == '500克拉丝闪银' || data.value == '500克拉丝闪金') {
|
||||
$(".newCraft").hide()
|
||||
$(".newCraft input[name='craft']").prop('checked', false);
|
||||
}
|
||||
}
|
||||
|
||||
if (data.value == "素芸") {
|
||||
$("#craft_layout").hide()
|
||||
$("#craft_layout input").attr("disabled", true);
|
||||
$("#mianka").show()
|
||||
$("#mianka input").attr("disabled", false);
|
||||
$("#ui_mk_count").show()
|
||||
$("#ui_mk_count").find(":input").attr("disabled", false);
|
||||
$("#noCraft").hide()
|
||||
$("#noCraft").find(":input").attr("disabled", true);
|
||||
$("#hasCraft").hide()
|
||||
$("#hasCraft").find(":input").attr("disabled", true);
|
||||
$("#ui_ls_count").hide()
|
||||
$("#ui_ls_count").find(":input").attr("disabled", true);
|
||||
}
|
||||
form.render();
|
||||
})
|
||||
form.on("checkbox(mianka)", function (data) {
|
||||
let craft_list = [];
|
||||
$("input[name='craft']:checked").each(function () {
|
||||
if (!$(this).is(':disabled')) {
|
||||
craft_list.push($(this).val());
|
||||
}
|
||||
}
|
||||
);
|
||||
if (craft_list.indexOf("击凸") > -1 && craft_list.indexOf("压凹") > -1) {
|
||||
$(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg("击凸 - 压凹不能同时选择", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (craft_list.indexOf("圆角") > -1 && craft_list.indexOf("异形模切") > -1) {
|
||||
$(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg("圆角 - 异形模切不能同时选择", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (craft_list.indexOf("击凸") > -1 || craft_list.indexOf("压凹") > -1) {
|
||||
$("#color_type").show();
|
||||
$("#color_type").find("select").attr("disabled", false);
|
||||
} else {
|
||||
$("#color_type").hide();
|
||||
$("#color_type").find("select").attr("disabled", true);
|
||||
}
|
||||
console.log(craft_list)
|
||||
form.render();
|
||||
})
|
||||
// 监听工艺
|
||||
form.on('checkbox(switch)', function (data) {
|
||||
// if (data.value == '异形模切') {
|
||||
// // 选中【异形模切】的时候，把【打孔】工艺禁用
|
||||
// if (data.elem.checked) {
|
||||
// $('.niupikaNoMQCraft').prop('disabled', 'disabled');
|
||||
// } else {
|
||||
// $('.niupikaNoMQCraft').removeAttr('disabled');
|
||||
// }
|
||||
// }
|
||||
$("#dakong").removeAttr('disabled');
|
||||
$("#craft_mo").removeAttr('disabled');
|
||||
$(".newCraft").children().removeAttr('disabled');
|
||||
if ($("#dakong")[0].checked || $("#craft_yuanjiao")[0].checked) {
|
||||
$("#craft_dianxian").prop('disabled', 'disabled');
|
||||
$("#craft_mo").prop('disabled', 'disabled');
|
||||
}
|
||||
if ($("#craft_dianxian")[0].checked) {
|
||||
$("#dakong").prop('disabled', 'disabled');
|
||||
$("#craft_yuanjiao").prop('disabled', 'disabled');
|
||||
$("#craft_mo").prop('disabled', 'disabled');
|
||||
}
|
||||
if ($("#craft_mo")[0].checked) {
|
||||
$("#dakong").prop('disabled', 'disabled');
|
||||
$("#craft_yuanjiao").prop('disabled', 'disabled');
|
||||
$("#craft_dianxian").prop('disabled', 'disabled');
|
||||
}
|
||||
|
||||
form.render();
|
||||
setRemark()
|
||||
})
|
||||
|
||||
function setRemark() {
|
||||
let craft_list = [];
|
||||
$("input[name='craft']:checked").not("disabled").each(function () {
|
||||
craft_list.push($(this).val());
|
||||
}
|
||||
);
|
||||
$("#remark").empty();
|
||||
let html = '';
|
||||
|
||||
if (craft_list.indexOf('异形模切') == -1) {
|
||||
html = remark_html
|
||||
} else {
|
||||
html = remark_html
|
||||
html = html.replaceAll('2-3', '3-4');
|
||||
}
|
||||
|
||||
$("#remark").append('<div><span>' + html + '<span/></div>');
|
||||
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
let data = {
|
||||
proTypeValue: "4",
|
||||
kindValue: "6"
|
||||
}
|
||||
if (craft_list.indexOf('异形模切') > -1) {
|
||||
data.craftValue = "异形模切"
|
||||
}
|
||||
if (craft_list.indexOf('打点线') > -1) {
|
||||
data.craftValue = "打点线"
|
||||
}
|
||||
if (craft_list.indexOf('圆角') > -1) {
|
||||
data.craftValue = "圆角"
|
||||
}
|
||||
if (craft_list.indexOf('打孔') > -1) {
|
||||
data.craftValue = "打孔"
|
||||
}
|
||||
html = ''
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data,
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
if ($('input[name="switchCardCount"]:checked').length != 0) {
|
||||
if ($("#cardCount").val() > 200) {
|
||||
layer.msg("特种纸名片 - 珠光纸自定义数量最大不超过200", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
// 特种纸名片材料
|
||||
var kindValueSelect = $(".kindValueSelect option:checked").text();
|
||||
var size = $(".sizeSpecialCard").val();
|
||||
var number = $("#number").val();
|
||||
if (kindValueSelect != "500克拉丝闪银卡" && kindValueSelect != "500克拉丝闪金卡" && kindValueSelect != '素芸') {
|
||||
if ((size.split("*")[0] < 5 || size.split("*")[1] < 4.5) && (size.split("*")[0] < 4.5 || size.split("*")[1] < 5)) {
|
||||
layer.msg("【特种纸名片】尺寸不能小于5*4.5 cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
} else {
|
||||
size = $("input[name='ls_size']").val();
|
||||
}
|
||||
if (kindValueSelect == '素芸') {
|
||||
size = $("input[name='size']").val();
|
||||
}
|
||||
if ((size.split("*")[0] > 42 || size.split("*")[1] > 28.5) && (size.split("*")[0] > 28.5 || size.split("*")[1] > 42)) {
|
||||
layer.msg("【特种纸名片-素芸】尺寸不能大于42*28.5 cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (kindValueSelect == '素芸') {
|
||||
if ((size.split("*")[0] < 3.5 || size.split("*")[1] < 3.5)) {
|
||||
layer.msg("【特种纸名片-素芸】尺寸不能小于3.5*3.5 cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if ((size.split("*")[0] > 17 || size.split("*")[1] > 15) && (size.split("*")[0] > 15 || size.split("*")[1] > 17)) {
|
||||
layer.msg("【特种纸名片-素芸】尺寸不能大于17*15 cm", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
var arr = []
|
||||
$("input:checkbox[name='craft']:checked").each(function (i) {
|
||||
if (!$(this).is(':disabled')) {
|
||||
if ($(this).val() != "双面覆哑膜") {
|
||||
arr.push($(this).val());
|
||||
}
|
||||
}
|
||||
});
|
||||
if (kindValueSelect == '素芸') {
|
||||
let color = $("select[name='craft']:not(:disabled) option:selected").val()
|
||||
if (color) {
|
||||
arr.push(color);
|
||||
}
|
||||
}
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result = '特种纸名片（不配绳子）' + "-不覆膜-" + kindValueSelect + "-" + size
|
||||
+ "厘米-(同款内容) \n" + "工艺 :" + arr + "\n"
|
||||
if (number > 1) {
|
||||
let numberType = $("#desType option:selected").text();
|
||||
span_result += "款数：" + number + "-" +numberType+ "\n";
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = "";
|
||||
var display = $("#noCraft").css("display");
|
||||
var cardCount = [];
|
||||
$("input:checkbox[name='switchCardCount']:checked").each(function (i) {
|
||||
if (!$(this).is(':disabled')) {
|
||||
cardCount.push($(this).val());
|
||||
}
|
||||
});
|
||||
|
||||
if (display != "none") {
|
||||
count = $("#count1 option:selected").text();
|
||||
if ($('.cardCount').css('display') != 'none') {
|
||||
if (cardCount[0] == "on") {
|
||||
count = $("#cardCount").val();
|
||||
}
|
||||
}
|
||||
} else {
|
||||
count = $("#count2 option:selected").text();
|
||||
}
|
||||
|
||||
getRemark($("#proTypeValue").val(), size, count + "张", kindValueSelect, number, arr, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '25%',
|
||||
align: "center",
|
||||
title: '重量约（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,35 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" lay-filter="kindValue1" id="kindValue4" class="select" lay-search>
|
||||
<option value=""></option>
|
||||
<option value="合成纸不干胶">合成纸不干胶</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="ui_doubleSize" class="layui-input" lay-verify="required" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量(张)
|
||||
</p>
|
||||
<div class="count">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" id="selectCount" class="select">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
<option value="20000">20000</option>
|
||||
<%-- <option value="30000">30000</option>--%>
|
||||
<%-- <option value="40000">40000</option>--%>
|
||||
<%-- <option value="50000">50000</option>--%>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,250 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">桌布</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="桌布"/>
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kindValue" id="kindValue" lay-filter="kindValue" class="select" lay-search>
|
||||
<option value="0">蓝底</option>
|
||||
<option value="1">白底</option>
|
||||
<option value="2">红底</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" class="layui-input" id="count">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="craft" value="" title="无" lay-filter="craft" checked>
|
||||
<input type="radio" name="craft" value="花边" title="花边" lay-filter="craft">
|
||||
<input type="radio" name="craft" value="直角" title="直角" lay-filter="craft">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data: {
|
||||
proTypeValue: $("#proTypeValue").val(),
|
||||
},
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var number = $("#number").val();
|
||||
var size = $("#size").val();
|
||||
var count = $("#count").val();
|
||||
var kind = $("#kindValue option:selected").text();
|
||||
var craft = $("input[name='craft']:checked").val();
|
||||
console.log(craft);
|
||||
if (!size) {
|
||||
layer.msg('请填写尺寸！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!count) {
|
||||
layer.msg('请填写数量！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (size.split("*")[0] < 80 && size.split("*")[1] < 80) {
|
||||
layer.msg('最小尺寸80*80cm', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (size.split("*")[0] > 200 || size.split("*")[1] > 200) {
|
||||
layer.msg('最大尺寸超过200*200cm需要拼接', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
}
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result = '桌布 - ' + kind + '-' + size + ' CM (同款内容)\n';
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
getRemark("桌布", size, count + "个", kind, number, "", "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,84 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!-- 吊牌 -->
|
||||
<!-- <input type="hidden" name="proTypeValue" id="proTypeValueTag"
|
||||
class="layui-input" value="吊牌"> -->
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
<!-- <span class="addOrCut"> -->
|
||||
<button type="button" title="点击添加尺寸" class="layui-btn layui-btn-primary layui-btn-sm button" onclick="AddInput()"><i
|
||||
class="layui-icon">组合</i></button>
|
||||
<button type="button" title="点击移除尺寸" class="layui-btn layui-btn-primary layui-btn-sm button" onclick="CutInput()"><i
|
||||
class="layui-icon">单张</i></button>
|
||||
<!-- </span> -->
|
||||
</p>
|
||||
<div class="diySize">
|
||||
<div class="layui-form-item" id="fatherDiv">
|
||||
<input type="text" name="size" id="diySize" placeholder="格式:长*宽"
|
||||
class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<p>数量</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" id="countTag" placeholder="请输入整数" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number"
|
||||
id="numberTag" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>工艺</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kind2Value" lay-filter="kind2Value" value="无" title="无" checked="checked">
|
||||
<input type="radio" name="kind2Value" lay-filter="kind2Value" value="单面烫黄金" title="单面烫黄金">
|
||||
<input type="radio" name="kind2Value" lay-filter="kind2Value" value="单面凹凸" title="单面凹凸">
|
||||
<input type="radio" name="kind2Value" lay-filter="kind2Value" value="单面烫黄金+凹凸" title="单面烫黄金+凹凸">
|
||||
</div>
|
||||
<span class="craftSheng">
|
||||
<input type="checkbox" class="craftSheng2" name="craftSheng" lay-filter="switch" value="棉绳" title="棉绳"
|
||||
lay-skin="primary">
|
||||
</span>
|
||||
|
||||
<script>
|
||||
//新增/删除尺寸
|
||||
//用来判断是删除 还是增加按钮 以便count值进行计算
|
||||
var count = 0;
|
||||
|
||||
function AddInput() {
|
||||
if (count > 0) {
|
||||
return false;
|
||||
}
|
||||
count++;
|
||||
var fatherDiv = document.getElementById("fatherDiv");
|
||||
|
||||
//创建input
|
||||
var input = document.createElement("input");
|
||||
input.type = "text";
|
||||
input.setAttribute('class', 'layui-input');
|
||||
input.name = "size" + count;
|
||||
input.placeholder = "格式:长*宽";
|
||||
input.autocomplete = "off";
|
||||
input.setAttribute('class', 'layui-input size1');
|
||||
fatherDiv.appendChild(input);
|
||||
/* var br = document.createElement("br");
|
||||
fatherDiv.appendChild(br); */
|
||||
}
|
||||
|
||||
/* $("body").on("click", ".size1", function (e) {
|
||||
$(this).remove();
|
||||
return false;
|
||||
}) */
|
||||
function CutInput() {
|
||||
count = 0;
|
||||
$(".size1").remove();
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,845 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- 服装吊牌 -->
|
||||
<style>
|
||||
.layui-form-checkbox[lay-skin=primary] i {
|
||||
border-radius: 50px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
.layui-form-checkbox[lay-skin=primary] span {
|
||||
color: black;
|
||||
margin-top: 3px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.shengz .layui-edge {
|
||||
right: 40px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">服装吊牌</h1>
|
||||
<span style="color: red; font-weight: 700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" lay-filter="stickerKind" name="stickerKind" value="常规" title="常规" checked="checked">
|
||||
<!--<input type="radio" lay-filter="stickerKind" name="stickerKind" value="少数量" title="少数量">-->
|
||||
</div>
|
||||
</form>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="服装吊牌">
|
||||
<p>材质</p>
|
||||
<div class="ui_normal">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="3" title="350克铜版纸">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="6" title="600克铜版纸">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="4" title="900克双胶纸">
|
||||
</div>
|
||||
<div class="ui_less" style="display: none;">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="3" title="350克铜版纸">
|
||||
</div>
|
||||
<div class="tagOther">
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size: 14px; color: red">输入格式: 长 * 宽</span>
|
||||
<span class="addOrCutClothes">
|
||||
<%-- <button type="button" title="点击添加尺寸" class="layui-btn layui-btn-primary layui-btn-sm button"--%>
|
||||
<%-- onclick="AddInputClothes()"><i class="layui-icon">组合</i></button>--%>
|
||||
<button type="button" title="点击移除尺寸" class="layui-btn layui-btn-primary layui-btn-sm button"
|
||||
onclick="CutInputClothes()"><i class="layui-icon">单张</i></button>
|
||||
</span>
|
||||
</p>
|
||||
<div class="qt">
|
||||
<div class="layui-form-item" id="fatherDivClothes">
|
||||
<input type="text" name="size" placeholder="格式:长*宽" id="size" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>
|
||||
数量(张) <span class="switchCount">
|
||||
<input type="checkbox" name="switchCount" class="Count" lay-filter="switchCount" title="自定义数量"></span>
|
||||
</p>
|
||||
<div class="count">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" id="zjCount" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="4000">4000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mqCount" style="display:none">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" id="mqCount" class="select">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
<option value="20000">20000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="diyCount" style="display: none">
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" id="count" placeholder="请输入整数" class="layui-input"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off"
|
||||
name="number" id="number" value="1" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<div class="ui_normal">
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="craftQie" lay-filter="craftQie" la value="直角打孔" title="直角打孔" checked>
|
||||
<input type="radio" name="craftQie" lay-filter="craftQie" value="异形模切" title="异形模切">
|
||||
|
|
||||
<input type="radio" name="craftMo" lay-filter="craftMo" la value="双面覆哑膜" title="双面覆哑膜" checked>
|
||||
<input type="radio" name="craftMo" lay-filter="craftMo" value="不覆膜" title="不覆膜">
|
||||
|
|
||||
<!-- <input type="checkbox" class="craftSheng" name="craftSheng" lay-filter="switch" value="棉绳" title="棉绳" lay-skin="primary">
|
||||
| --><input type="checkbox" name="aotu" lay-filter="switch" value="凹凸"
|
||||
title="凹凸" lay-skin="primary">
|
||||
|
|
||||
<div>
|
||||
<input type="checkbox" class="tang" name="craftTang" lay-filter="switch" value="单面烫金"
|
||||
title="单面烫金" lay-skin="primary">
|
||||
<input type="checkbox" class="tang" name="craftTang" lay-filter="switch" value="双面烫金"
|
||||
title="双面烫金" lay-skin="primary">
|
||||
<span class="sizeTang">
|
||||
<div class="layui-inline">
|
||||
<input type="text" placeholder="长边" autocomplete="off" name="lengthTang"
|
||||
id="lengthTang" disabled class="layui-input" style="width:50px;height:35px;">
|
||||
</div>x
|
||||
<div class="layui-inline">
|
||||
<input type="text" placeholder="短边" autocomplete="off" name="widthTang"
|
||||
id="widthTang" disabled class="layui-input" style="width:50px;height:35px;">
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
<div class="craft_lius">
|
||||
<input type="checkbox" class="lius" name="craft" lay-filter="ui_lius" value="流苏" title="流苏">
|
||||
<input type="checkbox" class="biez" name="craft" lay-filter="ui_lius" value="别针" title="别针">
|
||||
<input type="checkbox" class="shengz" name="craft" lay-filter="ui_lius" value="绳子"
|
||||
title="绳子">
|
||||
<div class="shengz scolor" style="width: 150px;display: none">
|
||||
<select class="select">
|
||||
<option value="白色绳子">白色绳子</option>
|
||||
<option value="黑色绳子">黑色绳子</option>
|
||||
<option value="红色绳子">红色绳子</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div id="tag" style="display: none">
|
||||
<%@include file="tag.jsp" %>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size: 20px; color: red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
//用来判断是删除 还是增加按钮 以便count值进行计算
|
||||
var countClothes = 0;
|
||||
|
||||
function AddInputClothes() {
|
||||
if (countClothes > 0) {
|
||||
return false;
|
||||
}
|
||||
countClothes++;
|
||||
var fatherDivClothes = document.getElementById("fatherDivClothes");
|
||||
|
||||
//创建input
|
||||
var input = document.createElement("input");
|
||||
input.type = "text";
|
||||
input.setAttribute('class', 'layui-input');
|
||||
input.name = "size" + countClothes;
|
||||
input.placeholder = "格式:长*宽";
|
||||
input.autocomplete = "off";
|
||||
input.setAttribute('class', 'layui-input size2');
|
||||
fatherDivClothes.appendChild(input);
|
||||
}
|
||||
|
||||
function CutInputClothes() {
|
||||
countClothes = 0;
|
||||
$(".size2").remove();
|
||||
}
|
||||
|
||||
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
var carousel = layui.carousel;
|
||||
//建造实例
|
||||
getRemoker()
|
||||
ins = carousel.render({});
|
||||
|
||||
function getRemoker() {
|
||||
let kindValue = $("input[name='kindValue']:checked").val();
|
||||
let kind2Value = $("input[name='kind2Value']:checked").val();
|
||||
let craftQie = $("input[name='craftQie']:checked").val();
|
||||
let craftTang = $("input[name='craftTang']:checked").val();
|
||||
let auto = $("input[name='aotu']:checked").val();
|
||||
|
||||
$("#remark").empty();
|
||||
let html = "预计发货时间:<br>";
|
||||
if (kindValue == "3") {
|
||||
if (craftQie == "直角打孔" && !craftTang && !auto) {
|
||||
html += "福建：(2天发货) 圆通 顺丰<br>"
|
||||
html += "广东：(2天发货) 中通 顺丰<br>"
|
||||
}
|
||||
if (craftQie == "直角打孔" && craftTang == "单面烫金") {
|
||||
html += "福建：直角打孔、单面烫金(3-4天发货) 圆通 顺丰<br>"
|
||||
html += "广东：直角打孔、单面烫金(3-4天发货) 中通 顺丰<br>"
|
||||
}
|
||||
if (craftQie == "直角打孔" && craftTang == "双面烫金") {
|
||||
html += "福建：直角打孔、双面烫金(3-4天发货) 圆通 顺丰<br>"
|
||||
html += "广东：直角打孔、双面烫金(3-4天发货) 中通 顺丰<br>"
|
||||
}
|
||||
if (craftQie == "异形模切" && !craftTang && !auto) {
|
||||
html += "福建：异形模切(3-4天发货) 圆通 顺丰<br>"
|
||||
html += "广东：异形模切(3-4天发货) 中通 顺丰"
|
||||
}
|
||||
if (craftQie == "异形模切" && craftTang == "单面烫金") {
|
||||
html += "福建：异形模切、单面烫金(4-5天发货) 圆通 顺丰<br>"
|
||||
html += "广东：异形模切、单面烫金(4-5天发货) 中通 顺丰<br>"
|
||||
}
|
||||
if (craftQie == "异形模切" && craftTang == "双面烫金") {
|
||||
html += "福建：异形模切、双面烫金(4-5天发货) 圆通 顺丰<br>"
|
||||
html += "广东：异形模切、双面烫金(4-5天发货) 中通 顺丰<br>"
|
||||
}
|
||||
if (craftQie == "直角打孔" && auto == "凹凸") {
|
||||
html += "福建：直角打孔、凹凸(3-4天发货) 圆通 顺丰<br>"
|
||||
html += "广东：直角打孔、凹凸(3-4天发货) 中通 顺丰<br>"
|
||||
}
|
||||
if (craftQie == "异形模切" && auto == "凹凸") {
|
||||
html += "福建：异形模切、凹凸(4-5天发货) 圆通 顺丰<br>"
|
||||
html += "广东：异形模切、凹凸(4-5天发货) 中通 顺丰<br>"
|
||||
}
|
||||
}
|
||||
|
||||
if (kindValue == 6) {
|
||||
if (kind2Value == "无") {
|
||||
html += "福建：(5-7天发货) 圆通 顺丰<br>"
|
||||
} else {
|
||||
html += "福建：(5-7天发货) 圆通 顺丰<br>"
|
||||
}
|
||||
}
|
||||
if (kindValue == 4) {
|
||||
if (kind2Value == "无") {
|
||||
html += "福建：(5-7天发货) 圆通 顺丰<br>"
|
||||
} else {
|
||||
html += "福建：(5-7天发货) 圆通 顺丰<br>"
|
||||
}
|
||||
}
|
||||
let remark = '<div><span>' + html + '<span/></div>';
|
||||
$("#remark").append(remark);
|
||||
getProductImage()
|
||||
}
|
||||
|
||||
function getProductImage() {
|
||||
$("#carousel").empty();
|
||||
$(".layui-carousel-ind").remove();
|
||||
let kindValue = $("input[name='kindValue']:checked").val();
|
||||
let craftQie = $("input[name='craftQie']:checked").val();
|
||||
let kind2Value = $("input[name='kind2Value']:checked").val();
|
||||
let craftMo = $("input[name='craftMo']:checked").val();
|
||||
let craftTang = $("input[name='craftTang']:checked").val();
|
||||
let auto = $("input[name='aotu']:checked").val();
|
||||
let craft = $("input[name='craft']:checked").val();
|
||||
let data = {proTypeValue: '服装吊牌'}
|
||||
if (kindValue == 3) {
|
||||
if (craftMo == '双面覆哑膜' && !craftTang && !auto) {
|
||||
data.craftValue = 0;
|
||||
if (craftQie == '异形模切') {
|
||||
data.craftValue = 5;
|
||||
}
|
||||
}
|
||||
if (craftMo == '不覆膜' && !craftTang && !auto) {
|
||||
data.craftValue = 1;
|
||||
if (craftQie == '异形模切') {
|
||||
data.craftValue = 5;
|
||||
}
|
||||
}
|
||||
if (craftTang && !auto) {
|
||||
data.craftValue = 2;
|
||||
}
|
||||
if (!craftTang && auto) {
|
||||
data.craftValue = 3;
|
||||
}
|
||||
if (craftTang && auto) {
|
||||
data.craftValue = 4;
|
||||
}
|
||||
if (craft == '流苏') {
|
||||
data.craftValue = '流苏';
|
||||
}
|
||||
|
||||
} else {
|
||||
if (kind2Value != '无') {
|
||||
data.craftValue = kind2Value;
|
||||
}
|
||||
}
|
||||
|
||||
let html = "";
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data,
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
form.on('radio(craftMo)', function () {
|
||||
getProductImage()
|
||||
})
|
||||
form.on('checkbox(ui_lius)', function (option) {
|
||||
getProductImage()
|
||||
let shengz = $(".shengz:checked").length;
|
||||
if (shengz == 1) {
|
||||
$(".scolor").css("display", "inline-block")
|
||||
} else {
|
||||
$(".scolor").hide()
|
||||
}
|
||||
})
|
||||
form.on('radio(stickerKind)', function (stickerKindData) {
|
||||
if (stickerKindData.value == "常规") {
|
||||
$(".ui_normal").show();
|
||||
$(".ui_less").hide();
|
||||
$(".ui_normal").find(":input").attr("disabled", false);
|
||||
} else {
|
||||
$(".ui_less").show();
|
||||
$(".ui_normal").hide();
|
||||
$(".ui_normal").find(":input").attr("disabled", true);
|
||||
}
|
||||
form.render();
|
||||
});
|
||||
form.on('radio(kind2Value)', () => {
|
||||
getRemoker()
|
||||
})
|
||||
form.on('checkbox(switch)', function (data) {
|
||||
// 压痕压点线只能选一个
|
||||
var tangLen = $(".tang:checked").length;
|
||||
if (tangLen > 1) {
|
||||
$(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg('[单面 - 双面]不能同时选择！', {offset: ['300px', '300px']}, {icon: 5});
|
||||
return false;
|
||||
}
|
||||
if (tangLen == 0) {
|
||||
$(".sizeTang input").attr("disabled", true)
|
||||
}
|
||||
if (tangLen > 0) {
|
||||
$(".sizeTang input").attr("disabled", false)
|
||||
}
|
||||
var at = $("input[name='aotu']:checked").val();
|
||||
if (tangLen == 1 && at != null) {
|
||||
$(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg('烫金和凹凸不能同时选择！', {offset: ['300px', '300px']}, {icon: 5});
|
||||
return false;
|
||||
}
|
||||
getRemoker()
|
||||
})
|
||||
|
||||
// 默认禁用600克
|
||||
$("#tag").find(":input").attr("disabled", true);
|
||||
form.on('radio(kindValue)', function (kindValueData) {
|
||||
$('input[class = craftSheng]').prop('checked', false);
|
||||
$('input[class = craftSheng2]').prop('checked', false);
|
||||
var stickerKind = $("input[name='stickerKind']:checked").val();
|
||||
$(".craft_lius").hide();
|
||||
$(".craft_lius input").prop("disabled", true);
|
||||
$(".craft_lius input").prop("checked", false);
|
||||
$(".scolor").hide()
|
||||
form.render();
|
||||
|
||||
if (stickerKind == "常规") {
|
||||
if (kindValueData.value == '3') {
|
||||
$(".switchCount").show();
|
||||
if (craftQie == "直角打孔") {
|
||||
$(".count").show();
|
||||
$(".count").find(":input").attr("disabled", false);
|
||||
}
|
||||
$(".diyCount").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", true);
|
||||
$("#selectCount").attr("disabled", false);
|
||||
|
||||
$(".tagOther").show();
|
||||
$(".tagOther").find(":input").attr("disabled", false);
|
||||
$("#tag").hide();
|
||||
$("#tag").find(":input").attr("disabled", true);
|
||||
$(".craft_lius").show();
|
||||
$(".craft_lius checkbox[name='craft']").attr("disabled", false);
|
||||
form.render();
|
||||
} else {
|
||||
$(".addOrCut").show();
|
||||
$('input[class = Count]').prop('checked', false);
|
||||
$(".switchCount").hide();
|
||||
$(".diyCount").show();
|
||||
$(".count").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", false);
|
||||
$(".count").find(":input").attr("disabled", true);
|
||||
$("#selectCount").attr("disabled", true);
|
||||
|
||||
$(".tagOther").hide();
|
||||
$(".tagOther").find(":input").attr("disabled", true);
|
||||
$("#tag").show();
|
||||
$("#tag").find(":input").attr("disabled", false);
|
||||
|
||||
|
||||
form.render();
|
||||
}
|
||||
} else {
|
||||
$('input[class = Count]').prop('checked', false);
|
||||
$(".switchCount").hide();
|
||||
$(".diyCount").show();
|
||||
$(".count").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", false);
|
||||
$(".count").find(":input").attr("disabled", true);
|
||||
$("#selectCount").attr("disabled", true);
|
||||
$("#mqCount").attr("disabled", true);
|
||||
form.render();
|
||||
}
|
||||
if (kindValueData.value == 3) {
|
||||
$(".sizeTang").show()
|
||||
} else {
|
||||
$(".sizeTang").hide()
|
||||
}
|
||||
$(".sizeTang input").attr("disabled", true)
|
||||
getRemoker()
|
||||
})
|
||||
|
||||
$("#mqCount").attr("disabled", true);
|
||||
// 默认直角打孔，禁用第二尺寸
|
||||
// $(".addOrCutClothes").hide();
|
||||
var craftQie = "直角打孔";
|
||||
form.on('radio(craftQie)', function (data) {
|
||||
// 选中工艺标识
|
||||
craftQie = data.value;
|
||||
// 自定义数量没选中
|
||||
if (data.value == "直角打孔") {
|
||||
// 禁用第二尺寸
|
||||
// $(".addOrCutClothes").hide();
|
||||
countClothes = 0;
|
||||
// $(".size2").remove();
|
||||
if (!choose) {
|
||||
$(".mqCount").hide();
|
||||
$(".count").show();
|
||||
$("#mqCount").attr("disabled", true);
|
||||
$("#zjCount").attr("disabled", false);
|
||||
}
|
||||
} else {
|
||||
// $(".addOrCutClothes").show();
|
||||
if (!choose) {
|
||||
$(".count").hide();
|
||||
$(".mqCount").show();
|
||||
$("#zjCount").attr("disabled", true);
|
||||
$("#mqCount").attr("disabled", false);
|
||||
}
|
||||
}
|
||||
|
||||
form.render();
|
||||
getRemoker()
|
||||
})
|
||||
|
||||
// 自定义数量是否选中标识
|
||||
var choose;
|
||||
// 自定义少数量
|
||||
form.on('checkbox(switchCount)', function (data) {
|
||||
if (data.elem.checked) {
|
||||
choose = true;
|
||||
$(".diyCount").show();
|
||||
$(".count").hide();
|
||||
$(".mqCount").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", false);
|
||||
$("#mqCount").attr("disabled", true);
|
||||
$("#zjCount").attr("disabled", true);
|
||||
} else {
|
||||
choose = false;
|
||||
if (craftQie == "直角打孔") {
|
||||
$(".count").show();
|
||||
$("#zjCount").attr("disabled", false);
|
||||
} else {
|
||||
$(".mqCount").show();
|
||||
$("#mqCount").attr("disabled", false);
|
||||
}
|
||||
$(".diyCount").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
/* var wangwang = $("#wangwang").val();
|
||||
if(wangwang == ""){
|
||||
layer.msg("请填写客户旺旺号！",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
} */
|
||||
// 选中‘自定义数量’
|
||||
if ($('input[name="switchCount"]:checked').length != 0) {
|
||||
if ($("#count").val() < 10000 || $("#count").val() % 1000 != 0) {
|
||||
layer.msg("自定义数量需要大于10000 且是1000的整数倍", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
var stickerKind = $("input[name='stickerKind']:checked").val();
|
||||
var kindValue = $('input[name="kindValue"]:checked').val();
|
||||
var craftQie = $('input[name="craftQie"]:checked').val();
|
||||
var craftMo = $('input[name="craftMo"]:checked').val();
|
||||
var craftTang = $('input[name="craftTang"]:checked').val();
|
||||
var craftSheng = $('input[name="craftSheng"]:checked').val();
|
||||
var craftAotu = $("input[name='aotu']:checked").val();
|
||||
var size = $("#size").val();
|
||||
var arr = [];
|
||||
arr.push(craftMo);
|
||||
if (craftTang) {
|
||||
arr.push(craftTang);
|
||||
}
|
||||
if (!kindValue) {
|
||||
layer.msg("请选择材质", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (kindValue == 4) {
|
||||
size = $("#diySize").val();
|
||||
if (size.split("*")[0] < 4 || size.split("*")[1] < 4) {
|
||||
layer.msg("【服装吊牌900克双胶纸】尺寸不能小于4*4 cm!", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
if (kindValue == 6) {
|
||||
size = $("#diySize").val();
|
||||
if (size.split("*")[0] < 4 || size.split("*")[1] < 4) {
|
||||
layer.msg("【服装吊牌600克铜版纸】尺寸不能小于4*4 cm!", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
if ((kindValue == 3 || kindValue == 0)) {
|
||||
if (craftQie == "异形模切") {
|
||||
if ((size.split("*")[0] > 21 || size.split("*")[1] > 21)) {
|
||||
layer.msg("【服装吊牌350克】尺寸不能超过21*21 cm!", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
$("#proTypeValue").val("服装吊牌");
|
||||
$("input[name='kindValue']:checked").val(3);
|
||||
if ((size.split("*")[0] <= 9 && size.split("*")[1] <= 5.4) || (size.split("*")[0] <= 5.4 && size.split("*")[1] <= 9)) {
|
||||
if (craftTang) {
|
||||
if (craftTang == "单面烫金") {
|
||||
$("#proTypeValue").val(3);
|
||||
}
|
||||
} else {
|
||||
if ((size.split("*")[0] < 3 || size.split("*")[1] < 3)) {
|
||||
$("#proTypeValue").val(3);
|
||||
$("input[name='kindValue']:checked").val(0);
|
||||
}
|
||||
}
|
||||
form.render();
|
||||
}
|
||||
} else if (craftQie == "直角打孔") {
|
||||
$("#proTypeValue").val("服装吊牌");
|
||||
$("input[name='kindValue']:checked").val(3);
|
||||
}
|
||||
}
|
||||
if (kindValue == 3 && (craftTang === '单面烫金' || craftTang === '双面烫金')) {
|
||||
$(".sizeTang").find(":input").attr("disabled", false);
|
||||
if ($("#lengthTang").val() == '' || $("#widthTang").val() == '') {
|
||||
layer.msg('请填写烫金版尺寸！', {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
var number = $("#number").val();
|
||||
kindValueData = {
|
||||
3: "350克铜版纸",
|
||||
4: "900克双胶纸",
|
||||
6: "600克铜版纸",
|
||||
};
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
if ($('input[name="kindValue"]:checked').val() == "4") {
|
||||
craftQie = ""
|
||||
var size1 = $(".size1").val();
|
||||
size = $("#diySize").val();
|
||||
if ((size.split("*")[0] < 3 || size.split("*")[1] < 3)) {
|
||||
layer.msg("[ 服装吊牌900克双胶纸 ] 尺寸小于 3cm 请单独报价", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (size1) {
|
||||
if ((size1.split("*")[0] < 3 || size1.split("*")[1] < 3)) {
|
||||
layer.msg("[ 服装吊牌900克双胶纸 ] 尺寸小于 3cm 请单独报价", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
size = size + '厘米，' + size1
|
||||
}
|
||||
number = $("#numberTag").val();
|
||||
arr = []
|
||||
//arr = $('input[name="kind2Value"]:checked').val();
|
||||
// arr.push("双面哑膜");
|
||||
arr.push($('input[name="kind2Value"]:checked').val());
|
||||
} else if ($('input[name="kindValue"]:checked').val() == "6") {
|
||||
craftQie = ""
|
||||
var size1 = $(".size1").val();
|
||||
size = $("#diySize").val();
|
||||
if ((size.split("*")[0] < 3 || size.split("*")[1] < 3)) {
|
||||
layer.msg("[ 服装吊牌600克铜版纸 ] 尺寸小于 3cm 请单独报价", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (size1) {
|
||||
if ((size1.split("*")[0] < 3 || size1.split("*")[1] < 3)) {
|
||||
layer.msg("[ 服装吊牌600克铜版纸 ] 尺寸小于 3cm 请单独报价", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
size = size + '厘米，' + size1
|
||||
}
|
||||
number = $("#numberTag").val();
|
||||
arr = []
|
||||
//arr = $('input[name="kind2Value"]:checked').val();
|
||||
// arr.push("双面哑膜");
|
||||
arr.push($('input[name="kind2Value"]:checked').val());
|
||||
} else if ($('input[name="kindValue"]:checked').val() == "3") { // && craftQie == "异形模切"
|
||||
var size2 = $(".size2").val();
|
||||
size = $("#size").val();
|
||||
if (size2) {
|
||||
size = size + '厘米，' + size2
|
||||
}
|
||||
$("input:checkbox[name='craft']:checked").each(function (i) {
|
||||
if (!$(this).is(':disabled')) {
|
||||
if ($(this).val() != "双面覆哑膜") {
|
||||
arr.push($(this).val());
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
if (craftQie == "异形模切") {
|
||||
craftQie = "不限形状";
|
||||
}
|
||||
var span_result = '服装吊牌 - ' + kindValueData[kindValue] + ' - ' + size + '厘米\n';
|
||||
if (stickerKind == "常规") {
|
||||
let shengz = $(".shengz:checked").length;
|
||||
if (shengz == 1) {
|
||||
let select = $(".scolor select option:selected").val();
|
||||
let index = arr.findIndex((e) => {
|
||||
return e == "绳子"
|
||||
});
|
||||
if (index >= 0) {
|
||||
arr[index] = select;
|
||||
}
|
||||
}
|
||||
if (craftAotu == null) {
|
||||
span_result += "工艺： " + craftQie + ', ' + arr + "\n";
|
||||
} else {
|
||||
span_result += "工艺： " + craftQie + ', ' + arr + "," + craftAotu + "\n";
|
||||
}
|
||||
}
|
||||
|
||||
if (kindValue == 3) {
|
||||
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += data[i].count + "张" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '免费设计，全国包邮（偏远地区除外）\n'
|
||||
if (!craftSheng) {
|
||||
span_result += '送通用吊绳'
|
||||
} else {
|
||||
span_result += '配棉绳'
|
||||
}
|
||||
} else {
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "张，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
if (!craftSheng) {
|
||||
span_result += '配送普通吊绳'
|
||||
} else {
|
||||
span_result += '配棉绳'
|
||||
}
|
||||
span_result += "\n9*5.4CM以内 （不限形状）\n";
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
}
|
||||
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = "";
|
||||
if (kindValue == "3") {
|
||||
if ($("input[name='switchCount']:checked").val() == undefined) {
|
||||
count = $("#zjCount option:selected").val();
|
||||
} else {
|
||||
count = $("#count").val();
|
||||
}
|
||||
} else {
|
||||
count = $("#mqCount option:selected").val();
|
||||
}
|
||||
|
||||
var craft = craftQie + arr;
|
||||
getRemark($("#proTypeValue").val(), size, count + "张", kindValueData[kindValue], number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '16%',
|
||||
title: '折扣价'
|
||||
}, {
|
||||
field: 'wangwang',
|
||||
align: "center",
|
||||
width: '19%',
|
||||
title: '跳楼价'
|
||||
}, {
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,444 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 吊牌 -->
|
||||
<style>
|
||||
.layui-form-checkbox[lay-skin=primary] i{
|
||||
border-radius: 50px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
line-height: 18px;
|
||||
margin-top:3px;
|
||||
}
|
||||
.layui-form-checkbox[lay-skin=primary] span{
|
||||
color:black;
|
||||
margin-top:3px;
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">吊牌</h1>
|
||||
<span style="color: red; font-weight: 700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="吊牌">
|
||||
<p>材质</p>
|
||||
<div>
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="3" title="300克铜版纸" checked>
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="4" title="600克铜版纸">
|
||||
<!-- <input type="radio" name="kind3Value" lay-filter="kindValue3" value="5" title="800克铜版纸"> -->
|
||||
</div>
|
||||
<div class="tagOther">
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size: 14px; color: red">输入格式: 长 * 宽</span>
|
||||
<span class="addOrCutTags">
|
||||
<button type="button" title="点击添加尺寸" class="layui-btn layui-btn-primary layui-btn-sm button" onclick="AddInputTags()"><i class="layui-icon">组合</i></button>
|
||||
<button type="button" title="点击移除尺寸" class="layui-btn layui-btn-primary layui-btn-sm button" onclick="CutInputTags()"><i class="layui-icon">单张</i></button>
|
||||
</span>
|
||||
</p>
|
||||
<div class="qt">
|
||||
<div class="layui-form-item" id="fatherDivTags">
|
||||
<input type="text" name="size" placeholder="格式:长*宽" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<p>
|
||||
数量(张) <span class="switchCount">
|
||||
<input type="checkbox" name="switchCount" class="Count" lay-filter="switchCount" title="自定义数量"></span>
|
||||
</p>
|
||||
<div class="count">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" id="zjCount" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="4000">4000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mqCount" style="display:none">
|
||||
<div class="layui-form-item">
|
||||
<select name="count" id="mqCount" class="select">
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="3000">3000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="diyCount" style="display: none">
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" id="count" placeholder="请输入整数" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
</div>
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off"
|
||||
name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="craftQie" lay-filter="craftQie" la value="直角打孔" title="直角打孔" checked>
|
||||
<input type="radio" name="craftQie" lay-filter="craftQie" value="异形模切" title="异形模切">
|
||||
|
|
||||
<input type="radio" name="craftMo" lay-filter="craftMo" la value="双面覆哑膜" title="双面覆哑膜" checked>
|
||||
<input type="radio" name="craftMo" lay-filter="craftMo" value="不覆膜" title="不覆膜">
|
||||
|
|
||||
<input type="checkbox" class="tang" name="craftTang" lay-filter="switch" value="单面烫金" title="单面烫金" lay-skin="primary">
|
||||
<input type="checkbox" class="tang" name="craftTang" lay-filter="switch" value="双面烫金" title="双面烫金" lay-skin="primary">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="tag" style="display: none">
|
||||
<%@include file="tag.jsp"%>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size: 20px; color: red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
//用来判断是删除 还是增加按钮 以便count值进行计算
|
||||
var countTags = 0;
|
||||
function AddInputTags() {
|
||||
if(countTags > 0){
|
||||
return false;
|
||||
}
|
||||
countTags++;
|
||||
var fatherDivTags = document.getElementById("fatherDivTags");
|
||||
|
||||
//创建input
|
||||
var input = document.createElement("input");
|
||||
input.type = "text";
|
||||
input.setAttribute('class','layui-input');
|
||||
input.name = "size" + countTags;
|
||||
input.placeholder ="格式:长*宽";
|
||||
input.autocomplete="off";
|
||||
input.setAttribute('class','layui-input size2');
|
||||
fatherDivTags.appendChild(input);
|
||||
}
|
||||
function CutInputTags() {
|
||||
countTags = 0;
|
||||
$(".size2").remove();
|
||||
}
|
||||
|
||||
layui.use([ 'table', 'form' ], function() {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
form.on('checkbox(switch)', function(data) {
|
||||
// 压痕压点线只能选一个
|
||||
var tangLen = $(".tang:checked").length;
|
||||
if (tangLen > 1) {
|
||||
$(data.elem).next().attr("class","layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg('[单面 - 双面]不能同时选择！', {offset : [ '300px', '300px' ]}, {icon : 5});
|
||||
return false;
|
||||
}
|
||||
})
|
||||
|
||||
// 默认禁用600克
|
||||
$("#tag").find(":input").attr("disabled", true);
|
||||
form.on('radio(kindValue)', function(kindValueData) {
|
||||
if (kindValueData.value == '3') {
|
||||
$(".switchCount").show();
|
||||
$(".count").show();
|
||||
$(".diyCount").hide();
|
||||
$(".count").find(":input").attr("disabled", false);
|
||||
$(".diyCount").find(":input").attr("disabled", true);
|
||||
$("#selectCount").attr("disabled", false);
|
||||
|
||||
$(".tagOther").show();
|
||||
$(".tagOther").find(":input").attr("disabled", false);
|
||||
$("#tag").hide();
|
||||
$("#tag").find(":input").attr("disabled", true);
|
||||
|
||||
form.render();
|
||||
} else {
|
||||
$('input[class = Count]').prop('checked', false);
|
||||
$(".switchCount").hide();
|
||||
$(".diyCount").show();
|
||||
$(".count").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", false);
|
||||
$(".count").find(":input").attr("disabled", true);
|
||||
$("#selectCount").attr("disabled", true);
|
||||
|
||||
$(".tagOther").hide();
|
||||
$(".tagOther").find(":input").attr("disabled", true);
|
||||
$("#tag").show();
|
||||
$("#tag").find(":input").attr("disabled", false);
|
||||
|
||||
$(".craftSheng").hide();
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
|
||||
$("#mqCount").attr("disabled", true);
|
||||
var craftQie ;
|
||||
form.on('radio(craftQie)', function(data) {
|
||||
// 选中工艺标识
|
||||
craftQie = data.value;
|
||||
// 自定义数量没选中
|
||||
if(data.value == "直角打孔"){
|
||||
if(!choose){
|
||||
$(".mqCount").hide();
|
||||
$(".count").show();
|
||||
$("#mqCount").attr("disabled", true);
|
||||
$("#zjCount").attr("disabled", false);
|
||||
}
|
||||
}else{
|
||||
if(!choose){
|
||||
$(".count").hide();
|
||||
$(".mqCount").show();
|
||||
$("#zjCount").attr("disabled", true);
|
||||
$("#mqCount").attr("disabled", false);
|
||||
}
|
||||
}
|
||||
|
||||
form.render();
|
||||
})
|
||||
|
||||
// 自定义数量是否选中标识
|
||||
var choose ;
|
||||
// 自定义少数量
|
||||
form.on('checkbox(switchCount)', function(data) {
|
||||
if (data.elem.checked) {
|
||||
choose = true;
|
||||
$(".diyCount").show();
|
||||
$(".count").hide();
|
||||
$(".mqCount").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", false);
|
||||
$("#mqCount").attr("disabled", true);
|
||||
$("#zjCount").attr("disabled", true);
|
||||
} else {
|
||||
choose = false;
|
||||
if(craftQie == "直角打孔"){
|
||||
$(".count").show();
|
||||
$("#zjCount").attr("disabled", false);
|
||||
}else{
|
||||
$(".mqCount").show();
|
||||
$("#mqCount").attr("disabled", false);
|
||||
}
|
||||
$(".diyCount").hide();
|
||||
$(".diyCount").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
/* var wangwang = $("#wangwang").val();
|
||||
if(wangwang == ""){
|
||||
layer.msg("请填写客户旺旺号！",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
} */
|
||||
// 选中‘自定义数量’
|
||||
if($('input[name="switchCount"]:checked').length != 0){
|
||||
if ($("#count").val() < 10000 || $("#count").val()%1000 != 0) {
|
||||
layer.msg("自定义数量需要大于10000 且是1000的整数倍",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
}
|
||||
var kindValue = $('input[name="kindValue"]:checked').val();
|
||||
var craftQie = $('input[name="craftQie"]:checked').val();
|
||||
var craftMo = $('input[name="craftMo"]:checked').val();
|
||||
var craftTang = $('input[name="craftTang"]:checked').val();
|
||||
var size = $("#size").val();
|
||||
var arr = [];
|
||||
arr.push(craftMo);
|
||||
if(craftTang){
|
||||
arr.push(craftTang);
|
||||
}
|
||||
if((kindValue == 3 || kindValue == 0)){
|
||||
if(craftQie == "异形模切"){
|
||||
if ((size.split("*")[0] > 21 || size.split("*")[1] > 21)) {
|
||||
layer.msg("【吊牌300克】尺寸不能超过21*21 cm",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
$("#proTypeValue").val("吊牌");
|
||||
$("input[name='kindValue']:checked").val(3);
|
||||
if ((size.split("*")[0] <= 9 && size.split("*")[1] <= 5.4) || (size.split("*")[0] <= 5.4 && size.split("*")[1] <= 9)) {
|
||||
if(craftTang){
|
||||
if(craftTang == "单面烫金"){
|
||||
$("#proTypeValue").val(3);
|
||||
}
|
||||
}else{
|
||||
if ((size.split("*")[0] < 3 || size.split("*")[1] < 3)) {
|
||||
$("#proTypeValue").val(3);
|
||||
$("input[name='kindValue']:checked").val(0);
|
||||
}
|
||||
}
|
||||
form.render();
|
||||
}
|
||||
}else if(craftQie == "直角打孔"){
|
||||
$("#proTypeValue").val("吊牌");
|
||||
$("input[name='kindValue']:checked").val(3);
|
||||
}
|
||||
}
|
||||
var number = $("#number").val();
|
||||
kindValueData = {
|
||||
0 : "300克铜版纸",
|
||||
3 : "300克铜版纸",
|
||||
4 : "600克铜版纸"
|
||||
};
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset : [ '300px', '300px' ]}, function() {});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
var craftList = "";
|
||||
if($('input[name="kindValue"]:checked').val() == "4"){
|
||||
craftQie = ""
|
||||
var size1 = $(".size1").val();
|
||||
size = $("#diySize").val();
|
||||
if(size1){
|
||||
size = size + '厘米，' + size1
|
||||
}
|
||||
if ((size.split("*")[0] < 3 || size.split("*")[1] < 3)) {
|
||||
layer.msg("[ 吊牌600克 ] 尺寸小于 3cm 请单独报价", {offset : [ '300px', '300px' ]}, function() {});
|
||||
return false;
|
||||
}
|
||||
number = $("#numberTag").val();
|
||||
arr = []
|
||||
arr = $('input[name="kind2Value"]:checked').val();
|
||||
} else if($('input[name="kindValue"]:checked').val() == "3"){ // && craftQie == "异形模切"
|
||||
var size2 = $(".size2").val();
|
||||
size = $("#size").val();
|
||||
if(size2){
|
||||
size = size + '厘米，' + size2
|
||||
}
|
||||
}
|
||||
var span_result = '吊牌 - ' + kindValueData[kindValue] + ' - ' + size + '厘米\n' + "工艺： " + craftQie + ', ' + arr + "\n";
|
||||
craftList += craftQie;
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '配送吊绳\n包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = "";
|
||||
if($("input[name='switchCount']:checked").val() == undefined){
|
||||
count = $("#zjCount option:selected").val();
|
||||
}else{
|
||||
count = $("#count").val();
|
||||
}
|
||||
craftList += arr;
|
||||
if($("input[name='size1']").css("display") == "block"){
|
||||
size = size.replace("厘米，");
|
||||
}
|
||||
getRemark($("#proTypeValue").val(), size, count+"个", kindValueData[kindValue], number, craftList, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [ {
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
}, {
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
}, {
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
}, {
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
}, {
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
}, {
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
} ] ],
|
||||
done : function() {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,113 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
<style>
|
||||
.fixedSizeTimeCard,.fixedCountTimeCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
#diySizeTimeCard,#diyCountTimeCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
.fixedSizeTimeCard .layui-input,.fixedCountTimeCard .layui-input{
|
||||
width:100%
|
||||
}
|
||||
.fixedSizeTimeCard .layui-edge,.fixedCountTimeCard .layui-edge{
|
||||
right:0px
|
||||
}
|
||||
</style>
|
||||
<input type="hidden" name="proTypeValue" class="layui-input" value="课时卡">
|
||||
<p>材质</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="2" title="300克铜版纸">
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item fixedSizeTimeCard">
|
||||
<select name="size" id="fixedSizeTimeCard" class="select">
|
||||
<option value="21*9">21*9 cm</option>
|
||||
<option value="16*9">16*9 cm</option>
|
||||
<option value="10*6">10*6 cm</option>
|
||||
<option value="9*5.4">9*5.4 cm</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diySizeTimeCard" style="display:none">
|
||||
<input type="text" name="size" id="diySizeTimeCard" placeholder="格式:长*宽" class="layui-input" autocomplete="off">
|
||||
</span>
|
||||
<input type="checkbox" name="switchSize" class="switchSizeTimeCard" lay-filter="switchSizeTimeCard" title="自定义尺寸" lay-skin="primary">
|
||||
<span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item fixedCountTimeCard">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diyCountTimeCard" style="display:none">
|
||||
<input type="text" name="count" id="diyCountTimeCard" placeholder="请输入整数" autocomplete="off"
|
||||
class="layui-input" lay-verify="number">
|
||||
</span>
|
||||
<input type="checkbox" name="switchCount" lay-filter="switchCountTimeCard" title="自定义数量" lay-skin="primary">
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number"
|
||||
id="numberTimeCard" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<script>
|
||||
layui.use(['table','form'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
|
||||
$('.switchSizeTimeCard').val("off")
|
||||
// 自定义尺寸
|
||||
form.on('checkbox(switchSizeTimeCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$('.switchSizeTimeCard').val("on")
|
||||
$(".diySizeTimeCard").show();
|
||||
$(".fixedSizeTimeCard").hide();
|
||||
$(".diySizeTimeCard").find(":input").attr("disabled", false);
|
||||
$(".fixedSizeTimeCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$('.switchSizeTimeCard').val("off")
|
||||
$(".fixedSizeTimeCard").show();
|
||||
$(".diySizeTimeCard").hide();
|
||||
$(".fixedSizeTimeCard").find(":input").attr("disabled", false);
|
||||
$(".diySizeTimeCard").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
|
||||
// 自定义數量
|
||||
form.on('checkbox(switchCountTimeCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$(".diyCountTimeCard").show();
|
||||
$(".fixedCountTimeCard").hide();
|
||||
$(".diyCountTimeCard").find(":input").attr("disabled", false);
|
||||
$(".fixedCountTimeCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".fixedCountTimeCard").show();
|
||||
$(".diyCountTimeCard").hide();
|
||||
$(".fixedCountTimeCard").find(":input").attr("disabled", false);
|
||||
$(".diyCountTimeCard").find(":input").attr("disabled", true);
|
||||
}
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
})
|
||||
})
|
||||
</script>
|
||||
@@ -0,0 +1,232 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 暖心贴 -->
|
||||
<style>
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">暖心贴</h1>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" lay-filter="stickerKind" name="stickerKind" value="方形" title="方形" checked="checked">
|
||||
<input type="radio" lay-filter="stickerKind" name="stickerKind" value="心形" title="心形">
|
||||
</div>
|
||||
</form>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="27" >
|
||||
<p>
|
||||
规格(CM/厘米)
|
||||
</p>
|
||||
<div class="layui-form-item ui_fx">
|
||||
<select name="kindValue" class="select ui_fx_size">
|
||||
<option value="0">7.5 * 7.5 cm</option>
|
||||
<option value="1">10 * 10 cm</option>
|
||||
<option value="2">7.5 * 10 cm</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="layui-form-item ui_xx">
|
||||
<select name="kindValue" class="select ui_xx_size">
|
||||
<option value="3">7 * 7 cm</option>
|
||||
<option value="4">9.5 * 9.5 cm</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kind2Value" id="kind2Value" class="select">
|
||||
<%-- <option value="单色">单色</option>--%>
|
||||
<option value="彩色">彩色</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
数量（本）<span style="font-size:16px;color:red">（每本50张）</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="count" class="select">
|
||||
<option value="50">50</option>
|
||||
<option value="100">100</option>
|
||||
<option value="200">200</option>
|
||||
<!-- <option value="300">300</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option> -->
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
$(".ui_xx").hide();
|
||||
$(".ui_xx").find(":input").attr("disabled", true);
|
||||
form.on('radio(stickerKind)', function(stickerKindData) {
|
||||
if(stickerKindData.value == "方形"){
|
||||
$(".ui_fx").show();
|
||||
$(".ui_fx").find(":input").attr("disabled", false);
|
||||
$(".ui_xx").hide();
|
||||
$(".ui_xx").find(":input").attr("disabled", true);
|
||||
}else{
|
||||
$(".ui_xx").show();
|
||||
$(".ui_xx").find(":input").attr("disabled", false);
|
||||
$(".ui_fx").hide();
|
||||
$(".ui_fx").find(":input").attr("disabled", true);
|
||||
}
|
||||
form.render();//必须写
|
||||
});
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
kindValueData = {
|
||||
0 : "7.5*7.5 cm",
|
||||
1 : "10*10 cm",
|
||||
2 : "7.5*10 cm",
|
||||
3 : "7*7 cm",
|
||||
4 : "9.5*9.5 cm"
|
||||
};
|
||||
var stickerKind = $("input[name='stickerKind']:checked").val();
|
||||
var kindValue = "";
|
||||
if(stickerKind == "方形"){
|
||||
kindValue = $(".ui_fx_size").val();
|
||||
}else{
|
||||
kindValue = $(".ui_xx_size").val();
|
||||
}
|
||||
var kind2Value = $("#kind2Value").val();
|
||||
var number = $("#number").val();
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result ='暖心贴 - ' + kindValueData[kindValue] + ' - ' + kind2Value + '（每本50张）\n';
|
||||
if(number > 1){
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "本，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}else{
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "本，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）\n 单色3-4天发出，彩色5-6天发出'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var size = kindValueData[kindValue];
|
||||
size = size.replace(" cm", "");
|
||||
var count = $("select[name='count'] option:selected").val();
|
||||
count = count * 50;
|
||||
getRemark("暖心贴", size, count+"张", "每本50张", number, "", "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,302 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8" %>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Insert title here</title>
|
||||
<%@include file="/views/common.jsp" %>
|
||||
</head>
|
||||
<!-- 婚礼卡 -->
|
||||
<style>
|
||||
.edge .layui-edge {
|
||||
right: 10px;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h2">婚礼卡</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="婚礼卡">
|
||||
<p>
|
||||
材质
|
||||
</p>
|
||||
<input type="radio" name="kindValue" value="0" title="300克铜版纸" checked="checked">
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" lay-verify="required"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" name="count" id="count" placeholder="请输入整数" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1"
|
||||
class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang"
|
||||
class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-input-block">
|
||||
<input type="radio" name="craftShua" lay-filter="switch" value="单面印刷" title="单面印刷" checked>
|
||||
<input type="radio" name="craftShua" lay-filter="switch" value="双面印刷" title="双面印刷">
|
||||
|
|
||||
<input type="radio" name="craftMo" lay-filter="switch" value="直角" title="直角" checked>
|
||||
<input type="radio" name="craftMo" lay-filter="switch" value="异形" title="异形">
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-
|
||||
<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult"
|
||||
onclick="copyResult()">点击复制
|
||||
</button>
|
||||
</h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp" %>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div>
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1">
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../../js/carousel.js" charset="utf-8"></script>
|
||||
<%@include file="/views/copyResult.jsp" %>
|
||||
<script>
|
||||
layui.use(['table', 'form', 'carousel'], function () {
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
|
||||
function getProductImage() {
|
||||
|
||||
let craftShua = $("input[name='craftShua']:checked").val();
|
||||
let craftMo = $("input[name='craftMo']:checked").val();
|
||||
|
||||
$("#carousel").empty();
|
||||
let data = {proTypeValue: "婚礼卡"}
|
||||
let remark = "";
|
||||
let html = "";
|
||||
if (craftShua == "单面印刷" && craftMo == "直角") {
|
||||
data.craftValue = 0;
|
||||
}
|
||||
if (craftShua == "单面印刷" && craftMo == "异形") {
|
||||
data.craftValue = 1;
|
||||
}
|
||||
if (craftShua == "双面印刷" && craftMo == "直角") {
|
||||
data.craftValue = 2;
|
||||
}
|
||||
if (craftShua == "双面印刷" && craftMo == "异形") {
|
||||
data.craftValue = 3;
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
url: "${pageContext.request.contextPath}/getImgs",
|
||||
type: "GET",
|
||||
data,
|
||||
//dataType : "json",
|
||||
success: function (result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
html += '<div><img style="width:' + result[0].imgWidth + 'px" src="' + result[i].imgUrl + '"></div>';
|
||||
remark += '<div><span>' + result[i].remark + '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if (remark.indexOf("null") < 0) {
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if (result.length == 0) {
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
} else {
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
form.on("radio(switch)", function (data) {
|
||||
getProductImage()
|
||||
})
|
||||
var checkZheye = 0;
|
||||
form.on('checkbox(switch)', function (data) {
|
||||
// 覆膜只能选一个
|
||||
var fumoLen = $(".fm:checked").length;
|
||||
if (fumoLen > 1) {
|
||||
$(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
|
||||
$(data.elem).prop("checked", false);
|
||||
layer.msg('[ 单面覆膜 - 双面覆膜 ]不能同时选择！', {
|
||||
offset: ['300px', '300px']
|
||||
}, {icon: 5});
|
||||
return false;
|
||||
}
|
||||
if (data.value == '折页') {
|
||||
if (data.elem.checked) {
|
||||
$(".zheyeHide").show();
|
||||
checkZheye = 1;
|
||||
} else {
|
||||
$(".zheyeHide").hide();
|
||||
checkZheye = 0;
|
||||
}
|
||||
}
|
||||
if (data.value == '压痕') {
|
||||
if (data.elem.checked) {
|
||||
$(".yahenHide").show();
|
||||
} else {
|
||||
$(".yahenHide").hide();
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function (data) {
|
||||
var kindData = {
|
||||
0: "300克铜版纸"
|
||||
};
|
||||
var kindValue = [$('input[name="kindValue"]:checked').val()];
|
||||
var craftShua = [$('input[name="craftShua"]:checked').val()];
|
||||
var craftMo = [$('input[name="craftMo"]:checked').val()];
|
||||
var number = $("#number").val();
|
||||
var size = $("#size").val();
|
||||
var craft = "";
|
||||
if ((size.split("*")[0] > 18 || size.split("*")[1] > 5.4) && (size.split("*")[0] > 5.4 || size.split("*")[1] > 18)) {
|
||||
layer.msg("婚礼卡尺寸超过18*5.4 cm请单独报价！", {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
$.ajax({
|
||||
url: "${path}/getThanSum",
|
||||
type: "GET",
|
||||
data: $(".big_box form").serialize(),
|
||||
success: function (result) {
|
||||
if (result.code == 100) {
|
||||
layer.msg(result.msg, {offset: ['300px', '300px']}, function () {
|
||||
});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
|
||||
var span_result = "婚礼卡 - " + kindData[kindValue] + ' - ' + size + ' 厘米(同款内容)\n' + "工艺 : " + craftShua + '，' + craftMo + "\n";
|
||||
craft += craftShua + craftMo;
|
||||
if (number > 1) {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 各' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
} else {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
span_result += number + '款 ' + data[i].count + "个，共" + data[i].price + "元" + '\n'
|
||||
data[i].number = number;
|
||||
}
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
var count = $("#count").val();
|
||||
getRemark($("#proTypeValue").val(), size, count + "张", kindData[kindValue], number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e = document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem: '#priceTable',
|
||||
even: true, //隔行变色
|
||||
data: data, // 赋值已知数据
|
||||
width: 500,
|
||||
cols: [[
|
||||
{
|
||||
field: 'number',
|
||||
width: '12%',
|
||||
align: "center",
|
||||
title: '款数'
|
||||
}, {
|
||||
field: 'count',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '数量'
|
||||
}, {
|
||||
field: 'price',
|
||||
width: '16%',
|
||||
align: "center",
|
||||
title: '报价'
|
||||
},/* {
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价',
|
||||
templet : function(d) {
|
||||
return Math.ceil(d.price * 0.98)
|
||||
}
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价',
|
||||
templet : function(d) {
|
||||
return Math.ceil(d.price * 0.96)
|
||||
}
|
||||
}, */{
|
||||
field: 'weight',
|
||||
width: '21%',
|
||||
align: "center",
|
||||
title: '重量（kg）'
|
||||
}
|
||||
]],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
@@ -0,0 +1,110 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
|
||||
<style>
|
||||
.fixedSizeWineCard,.fixedCountWineCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
#diySizeWineCard,#diyCountWineCard{
|
||||
width:400px;
|
||||
display:inline-block;
|
||||
}
|
||||
.fixedSizeWineCard .layui-input,.fixedCountWineCard .layui-input{
|
||||
width:100%
|
||||
}
|
||||
.fixedSizeWineCard .layui-edge,.fixedCountWineCard .layui-edge{
|
||||
right:0px
|
||||
}
|
||||
</style>
|
||||
<input type="hidden" name="proTypeValue" class="layui-input" value="存酒卡">
|
||||
<p>材质</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="kindValue" lay-filter="kindValue" value="2" title="300克铜版纸">
|
||||
</div>
|
||||
<p>
|
||||
规格
|
||||
</p>
|
||||
<div class="layui-form-item fixedSizeWineCard">
|
||||
<select name="size" id="fixedSizeWineCard" class="select">
|
||||
<option value="18*5.4">18*5.4 cm</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diySizeWineCard" style="display:none">
|
||||
<input type="text" name="size" id="diySizeWineCard" placeholder="格式:长*宽" class="layui-input" autocomplete="off">
|
||||
</span>
|
||||
<input type="checkbox" name="switchSize" class="switchSizeWineCard" lay-filter="switchSizeWineCard" title="自定义尺寸" lay-skin="primary">
|
||||
<span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
<p>
|
||||
数量（张）
|
||||
</p>
|
||||
<div class="layui-form-item fixedCountWineCard">
|
||||
<select name="count" class="select">
|
||||
<option value="200">200</option>
|
||||
<option value="500">500</option>
|
||||
<option value="1000">1000</option>
|
||||
<option value="2000">2000</option>
|
||||
<option value="5000">5000</option>
|
||||
<option value="10000">10000</option>
|
||||
</select>
|
||||
</div>
|
||||
<span class="diyCountWineCard" style="display:none">
|
||||
<input type="text" name="count" id="diyCountWineCard" placeholder="请输入整数" autocomplete="off"
|
||||
class="layui-input" lay-verify="number">
|
||||
</span>
|
||||
<input type="checkbox" name="switchCount" lay-filter="switchCountWineCard" title="自定义数量" lay-skin="primary">
|
||||
<p>款数</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number"
|
||||
id="numberWineCard" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<script>
|
||||
layui.use(['table','form'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var table = layui.table;
|
||||
|
||||
|
||||
$('.switchSizeWineCard').val("off")
|
||||
// 自定义尺寸
|
||||
form.on('checkbox(switchSizeWineCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$('.switchSizeWineCard').val("on")
|
||||
$(".diySizeWineCard").show();
|
||||
$(".fixedSizeWineCard").hide();
|
||||
$(".diySizeWineCard").find(":input").attr("disabled", false);
|
||||
$(".fixedSizeWineCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$('.switchSizeWineCard').val("off")
|
||||
$(".fixedSizeWineCard").show();
|
||||
$(".diySizeWineCard").hide();
|
||||
$(".fixedSizeWineCard").find(":input").attr("disabled", false);
|
||||
$(".diySizeWineCard").find(":input").attr("disabled", true);
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
}
|
||||
})
|
||||
|
||||
// 自定义數量
|
||||
form.on('checkbox(switchCountWineCard)', function(data) {
|
||||
if(data.elem.checked){
|
||||
$(".diyCountWineCard").show();
|
||||
$(".fixedCountWineCard").hide();
|
||||
$(".diyCountWineCard").find(":input").attr("disabled", false);
|
||||
$(".fixedCountWineCard").find(":input").attr("disabled", true);
|
||||
} else {
|
||||
$(".fixedCountWineCard").show();
|
||||
$(".diyCountWineCard").hide();
|
||||
$(".fixedCountWineCard").find(":input").attr("disabled", false);
|
||||
$(".diyCountWineCard").find(":input").attr("disabled", true);
|
||||
}
|
||||
// 恢复标准数量的时候会被禁用，加这个解决
|
||||
form.render();
|
||||
})
|
||||
})
|
||||
</script>
|
||||
@@ -0,0 +1,261 @@
|
||||
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
||||
pageEncoding="UTF-8"%>
|
||||
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<%@include file="/views/common.jsp"%>
|
||||
</head>
|
||||
<!-- 亚克力 -->
|
||||
<body>
|
||||
<div class="big_box">
|
||||
<div class="left_div">
|
||||
<h1 class="h1">亚克力</h1> <span style="color:red;font-weight:700;"></span>
|
||||
<hr>
|
||||
<form class="layui-form">
|
||||
<input type="hidden" name="proTypeValue" id="proTypeValue" class="layui-input" value="亚克力" >
|
||||
<p>
|
||||
产品名称
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<select name="kind2Value" id="kind2Value" lay-filter="kind2Value" class="select" lay-search>
|
||||
<option value="1">2mm透明亚克力</option>
|
||||
<option value="2">3mm透明亚克力</option>
|
||||
<option value="3">5mm透明亚克力</option>
|
||||
<option value="4">2mm瓷白亚克力</option>
|
||||
<option value="5">3mm瓷白亚克力</option>
|
||||
</select>
|
||||
</div>
|
||||
<p>
|
||||
尺寸(CM/厘米) <span style="font-size:14px;color:red">输入格式: 长 * 宽</span>
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="格式:长*宽" name="size" id="size" class="layui-input" autocomplete="off">
|
||||
</div>
|
||||
<p>
|
||||
数量(个)
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="count" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
款数
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入整数" autocomplete="off" name="number" id="number" value="1" class="layui-input" lay-verify="number">
|
||||
</div>
|
||||
<p>
|
||||
客户旺旺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="text" placeholder="请输入客户旺旺号" autocomplete="off" name="wangwang" id="wangwang" class="layui-input">
|
||||
</div>
|
||||
<p>
|
||||
工艺
|
||||
</p>
|
||||
<div class="layui-form-item">
|
||||
<input type="radio" name="craft" value="四角打孔" title="四角打孔" checked="checked">
|
||||
<span class="ui_split" style="display: none;">
|
||||
<input type="radio" name="craft" class="ui_craft" value="背胶" title="背胶"><br>
|
||||
<input type="radio" name="craftShua" value="单面印刷" title="单面印刷" checked>
|
||||
<input type="radio" name="craftShua" value="双面印刷" title="双面印刷">
|
||||
</span>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="layui-form-item">
|
||||
<button class="layui-btn" lay-submit="" lay-filter="acount_btn">计算</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
<h2>计算结果-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyResult()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="11" cols="75" id="span_result" readonly="readonly"></textarea>
|
||||
<%@include file="../acountExpressFee.jsp"%>
|
||||
</div>
|
||||
<!--<h2>下单备注-<button type="button" class="layui-btn layui-btn-primary layui-btn-sm copyResult" onclick="copyBz()">点击复制</button></h2>
|
||||
<div>
|
||||
<textarea rows="5" cols="75" id="bz_result" readonly="readonly"></textarea>
|
||||
</div>-->
|
||||
<div >
|
||||
<table class="layui-hide" id="priceTable" lay-filter="priceTable"></table>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="right_div" style="margin-left:50px;">
|
||||
<div class="layui-carousel" id="test1" >
|
||||
<div carousel-item id="carousel"></div>
|
||||
<br>
|
||||
<div id="remark" style="font-size:20px;color:red"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<%@include file="/views/copyResult.jsp"%>
|
||||
<script>
|
||||
layui.use(['table','form','carousel'], function(){
|
||||
var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
|
||||
var carousel = layui.carousel;
|
||||
var table = layui.table;
|
||||
|
||||
//建造实例
|
||||
ins = carousel.render({});
|
||||
var html = " ";
|
||||
var remark = " ";
|
||||
$("input[class='ui_craft']").attr("disabled", true);
|
||||
// 清空轮播图
|
||||
$("#carousel").empty();
|
||||
$("#remark").empty();
|
||||
$.ajax({
|
||||
url:"${pageContext.request.contextPath}/getImgs",
|
||||
type:"GET",
|
||||
data:{
|
||||
proTypeValue : $("#proTypeValue").val(),
|
||||
},
|
||||
success : function(result) {
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
// 只留一个remark
|
||||
remark = "";
|
||||
html += '<div><img style="width:'+result[0].imgWidth+'px" src="' +result[i].imgUrl+ '"></div>';
|
||||
remark += '<div><span>' +result[i].remark+ '<span/></div>';
|
||||
}
|
||||
$("#carousel").append(html);
|
||||
// 如果没有说明，就不显示null
|
||||
if(remark.indexOf("null") < 0){
|
||||
$("#remark").append(remark);
|
||||
}
|
||||
// 如果没有轮播图就隐藏
|
||||
if(result.length == 0){
|
||||
document.getElementById("test1").style.display = "none"; //隐藏
|
||||
}else{
|
||||
document.getElementById("test1").style.display = "block"; //显示
|
||||
ins.reload({
|
||||
elem: '#test1',
|
||||
width: result[0].imgWidth, //设置容器宽度
|
||||
height: result[0].imgHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
form.on('select(kind2Value)', function(data) {
|
||||
if(data.value < 4){
|
||||
$(".ui_split").hide();
|
||||
$(".ui_split").find(":input").attr("disabled", true);
|
||||
}else{
|
||||
$(".ui_split").show();
|
||||
$(".ui_split").find(":input").attr("disabled", false);
|
||||
}
|
||||
form.render();
|
||||
});
|
||||
|
||||
// 点击计算，计算价格
|
||||
form.on('submit(acount_btn)', function(data) {
|
||||
var number= $("#number").val();
|
||||
var kindlabel = $("#kind2Value option:checked").text();
|
||||
var craft = $("input[name='craft']:checked").val();
|
||||
var count = $("input[name='count']").val();
|
||||
var shua = $("input[name='craftShua']:checked").val();
|
||||
|
||||
var size = $("#size").val();
|
||||
|
||||
if(!size){
|
||||
layer.msg("请填写尺寸！",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
|
||||
if(size.split("*")[0] < 3 || size.split("*")[1] < 3){
|
||||
layer.msg("最小尺寸3*3！",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
|
||||
if((size.split("*")[0] > 118 || size.split("*")[1] > 238)&&(size.split("*")[0] > 118 && size.split("*")[1] > 238)){
|
||||
layer.msg("最大尺寸118*238cm！",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
|
||||
if(craft == undefined){
|
||||
layer.msg("请选择工艺!",{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
|
||||
$.ajax({
|
||||
url : "${path}/getThanSum",
|
||||
type : "GET",
|
||||
data : $(".big_box form").serialize(),
|
||||
success : function(result) {
|
||||
if(result.code == 100){
|
||||
layer.msg(result.msg,{offset:['300px','300px']},function(){});
|
||||
return false;
|
||||
}
|
||||
var data = result.data.proList;
|
||||
if(kindlabel.indexOf("透明") < 0){
|
||||
craft += shua;
|
||||
}
|
||||
var span_result =kindlabel + ' - ' + craft +' - '+ size +'厘米 -(同款内容)' + [data[0].msg] + '\n';
|
||||
if(number > 1){
|
||||
span_result += number + '款 各' + count + "个，共" + data[0].price + "元" + '\n'
|
||||
}else{
|
||||
span_result += number + '款 ' + count + "个，共" + data[0].price + "元" + '\n'
|
||||
}
|
||||
span_result += '包邮，免费设计呢~（偏远地区需补邮费）'
|
||||
$("#span_result").val(span_result);
|
||||
|
||||
kindlabel = kindlabel.substring(0, 3);
|
||||
getRemark($("#proTypeValue").val(), size, count+"张", kindlabel, number, craft, "");
|
||||
//计算完自动复制文本
|
||||
var e=document.getElementById("span_result");//对象是content
|
||||
if (e.value != "") {
|
||||
e.select();//选择对象
|
||||
document.execCommand("Copy");//执行浏览器复制命令
|
||||
}
|
||||
|
||||
//生成表格
|
||||
table.render({
|
||||
elem : '#priceTable',
|
||||
even : true, //隔行变色
|
||||
data : data, // 赋值已知数据
|
||||
width : 500,
|
||||
cols : [ [
|
||||
{
|
||||
field : 'number',
|
||||
width : '12%',
|
||||
align : "center",
|
||||
title : '款数'
|
||||
},{
|
||||
field : 'count',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '数量'
|
||||
},{
|
||||
field : 'price',
|
||||
width : '16%',
|
||||
align : "center",
|
||||
title : '报价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '16%',
|
||||
title : '折扣价'
|
||||
},{
|
||||
field : 'wangwang',
|
||||
align : "center",
|
||||
width : '19%',
|
||||
title : '跳楼价'
|
||||
},{
|
||||
field : 'weight',
|
||||
width : '21%',
|
||||
align : "center",
|
||||
title : '重量（kg）'
|
||||
}
|
||||
] ],
|
||||
done: function () {
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
</html>
|
||||
Reference in New Issue
Block a user