| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010 |
- <%@ 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>
- #tang_type .layui-form-select .layui-edge {
- right: 20px;
- }
- #dama .layui-form-select .layui-edge {
- right: 20px;
- }
- #ccolor_type .layui-form-select .layui-edge {
- right: 20px;
- }
- #leishe_type .layui-form-select .layui-edge {
- right: 20px;
- }
- </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>
- <div class="suyun" style="display: none">
- <p>材质</p>
- <div class="layui-form-item">
- <input type="radio" name="kind" lay-filter="kindSelect" title="500克" value="500克" checked/>
- <input type="radio" name="kind" lay-filter="kindSelect" title="300克" value="300克"/>
- </div>
- </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>
- <input type="checkbox" name="craft" lay-filter="switch" value="压痕" title="压痕">
- </div>
- <div id="mianka" style="display: none">
- <div id="ccolor_type" class="layui-inline" style="width: 180px;display: flex;align-items: center">
- <div style="flex-shrink: 0">纸张颜色:</div>
- <select name="craft" class="select">
- <option value="黑色" selected>黑色</option>
- <option value="军绿色">军绿色</option>
- <option value="砖红色">砖红色</option>
- <option value="深咖">深咖</option>
- <option value="浅棕色">浅棕色</option>
- <option value="白色">白色</option>
- </select>
- </div>
- <div class="layui-inline">
- 裁切方式:
- <input type="checkbox" name="craft" lay-filter="mianka" value="直角裁切" title="直角裁切" checked disabled>
- <input type="checkbox" name="craft" lay-filter="mianka" value="圆角" title="圆角" disabled>
- <input type="checkbox" name="craft" lay-filter="mianka" value="异形模切" title="异形模切" disabled>
- </div>
- <div class="layui-inline-block">
- 印面:
- <input type="checkbox" name="craft" lay-filter="mianka" value="单面" title="单面" checked disabled>
- <input type="checkbox" name="craft" lay-filter="mianka" value="双面" title="双面" disabled>
- </div>
- <div class="layui-inline">
- 特殊工艺:
- <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>
- <input type="checkbox" name="craft" lay-filter="mianka" value="烫镭射银" title="烫镭射银" disabled>
- <div id="leishe_type" class="layui-inline" style="display: none;width: 200px">
- <select name="craft" class="select" disabled>
- <option value="单面烫镭射银" selected>单面烫镭射银</option>
- <option value="双面烫镭射银">双面烫镭射银
- <option>
- </select>
- </div>
- </div>
- </div>
- <br/>
- <input type="checkbox" name="craft" lay-filter="mianka" value="单面烫金" title="单面烫金">
- <input type="checkbox" name="craft" lay-filter="mianka" value="双面烫金" title="双面烫金">
- <div id="tang_type" class="layui-inline" style="display: none;width: 90px">
- <select name="craft" class="select" disabled>
- <option value="烫金" selected>烫金</option>
- <option value="烫银">烫银</option>
- <option value="烫蓝">烫蓝</option>
- <option value="烫绿">烫绿</option>
- <option value="烫紫">烫紫</option>
- <option value="烫玫瑰">烫玫瑰</option>
- </select>
- </div>
- <div class="layui-inline-block">
- 常见工艺:
- <input type="checkbox" name="craft" lay-filter="switch" value="打码" title="打码">
- <div id="dama" class="layui-inline" style="display: none;width: 90px">
- <select name="maxian" class="select">
- <option value="1" selected>1</option>
- <option value="2">2</option>
- </select>
- </div>
- <div id="baimo" class="layui-inline" style="display: none;width: 90px">
- <input type="checkbox" name="craft" lay-filter="mianka" value="白墨" title="白墨">
- </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>
- setNumberOptions();
- function setNumberOptions() {
- let html = '';
- if (window.parent.system_isPdd) {
- html = `<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>`;
- } else {
- html = `<option value=""></option>
- <option value="1">改序号</option>
- <option value="6" selected>改内容模板完全不同</option>`;
- }
- $("#desType").empty().append(html);
- }
- 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);
- $(".suyun").hide();
- $(".suyun").find(":input").attr("disabled", true);
- 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);
- $(".suyun").show();
- $(".suyun").find(":input").attr("disabled", false);
- }
- $("#baimo").find(":input").attr("disabled", true);
- $("#baimo").hide();
- if (data.value == "金绒") {
- $("#baimo").find(":input").attr("disabled", false);
- $("#baimo").show();
- }
- form.render();
- })
- form.on("radio(kindSelect)", function (data) {
- let colorHtml = `<option value="黑色" selected>黑色</option>
- <option value="军绿色">军绿色</option>
- <option value="砖红色">砖红色</option>
- <option value="深咖">深咖</option>
- <option value="浅棕色">浅棕色</option>
- <option value="白色">白色</option>`;
- $("input[name='craft'][value='压凹']").prop("checked", false);
- $("#color_type").hide();
- $("#color_type").find("select").attr("disabled", true);
- if (data.value == "300克") {
- colorHtml = `<option value="白色">白色</option>`;
- }
- $("#ccolor_type select[name='craft']").empty();
- $("#ccolor_type select[name='craft']").append(colorHtml);
- form.render();
- })
- form.on("checkbox(mianka)", function (data) {
- let craft_list = [];
- let size = $(".sizeSpecialCard").val();
- let kindValueSelect = $(".kindValueSelect option:checked").text();
- let kindValue = $("input[name='kind']:checked").val();
- if (kindValueSelect != "500克拉丝闪银卡" && kindValueSelect != "500克拉丝闪金卡" && kindValueSelect != '素芸') {
- } else {
- size = $("input[name='ls_size']").val();
- }
- if (kindValueSelect == '素芸') {
- size = $("input[name='size']").val();
- }
- $("input[name='craft']:checked").each(function () {
- if (!$(this).is(':disabled')) {
- craft_list.push($(this).val());
- }
- }
- );
- const requiredCrafts = ["击凸", "压凹", "单面烫金", "双面烫金", "烫镭射银"];
- const allExist = requiredCrafts.filter(craft => craft_list.includes(craft));
- if (allExist.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;
- }
- const baimoCrafts = ["白墨", "单面烫金", "双面烫金"];
- const baimoExist = baimoCrafts.filter(craft => craft_list.includes(craft));
- if (baimoExist.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;
- }
- const caiqie = ["圆角", "异形模切", "直角裁切"];
- const caiqieExist = caiqie.filter(craft => craft_list.includes(craft));
- if (caiqieExist.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;
- }
- const yinmian = ["单面", "双面"];
- const yinmianExist = yinmian.filter(craft => craft_list.includes(craft));
- if (yinmianExist.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 (craft_list.indexOf("打码") > -1 && craft_list.indexOf("异形模切") > -1) {
- if ((size.split("*")[0] < 9 || size.split("*")[1] < 5.4) && (size.split("*")[0] < 5.4 || size.split("*")[1] < 9)) {
- $(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
- $(data.elem).prop("checked", false);
- layer.msg("9*5.4 打码 - 异形模切不能同时选择", {offset: ['300px', '300px']}, function () {
- });
- return false;
- }
- }
- // if (kindValue == "300克" && craft_list.indexOf("压凹") > -1) {
- // $(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
- // $(data.elem).prop("checked", false);
- // layer.msg("素芸300克无法选择压凹工艺", {offset: ['300px', '300px']}, function () {
- // });
- // return false;
- // }
- if (craft_list.indexOf("击凸") > -1 || craft_list.indexOf("压凹") > -1) {
- if (craft_list.indexOf("击凸") > -1) {
- $("#color_type select").empty().append(` <option value="无色" selected>无色</option>
- <option value="有色">有色</option>
- <option value="有色加激凸">有色加激凸</option>`)
- }
- if (craft_list.indexOf("压凹") > -1) {
- $("#color_type select").empty().append(` <option value="无色" selected>无色</option>
- <option value="有色">有色</option>
- <option value="有色加压凹">有色加压凹</option>`)
- }
- $("#color_type").show();
- $("#color_type").find("select").attr("disabled", false);
- } else {
- $("#color_type").hide();
- $("#color_type").find("select").attr("disabled", true);
- }
- if (craft_list.indexOf("双面烫金") > -1 || craft_list.indexOf("单面烫金") > -1) {
- $("#tang_type").show();
- $("#tang_type").find("select").attr("disabled", false);
- } else {
- $("#tang_type").hide();
- $("#tang_type").find("select").attr("disabled", true);
- }
- if (craft_list.indexOf("烫镭射银") > -1) {
- $("#leishe_type").show();
- $("#leishe_type").find("select").attr("disabled", false);
- } else {
- $("#leishe_type").hide();
- $("#leishe_type").find("select").attr("disabled", true);
- }
- form.render();
- })
- // 监听工艺
- form.on('checkbox(switch)', function (data) {
- // if (data.value == '异形模切') {
- // // 选中【异形模切】的时候,把【打孔】工艺禁用
- // if (data.elem.checked) {
- // $('.niupikaNoMQCraft').prop('disabled', 'disabled');
- // } else {
- // $('.niupikaNoMQCraft').removeAttr('disabled');
- // }
- // }
- let size = $(".sizeSpecialCard").val();
- let kindValueSelect = $(".kindValueSelect option:checked").text();
- if (kindValueSelect != "500克拉丝闪银卡" && kindValueSelect != "500克拉丝闪金卡" && kindValueSelect != '素芸') {
- } else {
- size = $("input[name='ls_size']").val();
- }
- if (kindValueSelect == '素芸') {
- size = $("input[name='size']").val();
- }
- let craft_list = [];
- $("input[name='craft']:checked").each(function () {
- if (!$(this).is(':disabled')) {
- craft_list.push($(this).val());
- }
- }
- );
- let kindValue = $("select[name='kindValue'] option:selected").val();
- if (craft_list.indexOf("打码") > -1 && craft_list.indexOf("异形模切") > -1) {
- if ((size.split("*")[0] < 9 || size.split("*")[1] < 5.4) && (size.split("*")[0] < 5.4 || size.split("*")[1] < 9)) {
- $(data.elem).next().attr("class", "layui-unselect layui-form-checkbox");
- $(data.elem).prop("checked", false);
- layer.msg("9*5.4 打码 - 异形模切不能同时选择", {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 (kindValue != "素芸") {
- $("#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');
- }
- if (craft_list.indexOf("打码") > -1) {
- $("#dama").show();
- $("#dama").find("select").attr("disabled", false);
- } else {
- $("#dama").hide();
- // $("#dama").find("select").attr("disabled", true);
- }
- 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();
- let kindValue = $("input[name='kind']:checked").val();
- 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 (kindValue == '500克') {
- if ((size.split("*")[0] > 21 || size.split("*")[1] > 15) && (size.split("*")[0] > 15 || size.split("*")[1] > 21)) {
- layer.msg("【特种纸名片-500克素芸】尺寸不能大于21*15 cm", {offset: ['300px', '300px']}, function () {
- });
- return false;
- }
- }
- if (kindValue == '300克') {
- if ((size.split("*")[0] > 10 || size.split("*")[1] > 15) && (size.split("*")[0] > 15 || size.split("*")[1] > 10)) {
- layer.msg("【特种纸名片-300克素芸】尺寸不能大于10*15 cm", {offset: ['300px', '300px']}, function () {
- });
- return false;
- }
- }
- }
- var arr = []
- let ma_num = $("select[name='maxian'] option:selected").val();
- let is_dama = false;
- let arrs = [];
- $("input:checkbox[name='craft']:checked").each(function (i) {
- if (!$(this).is(':disabled')) {
- arr.push($(this).val());
- if ($(this).val() != "双面覆哑膜") {
- if ($(this).val() == "单面烫金" || $(this).val() == "双面烫金") {
- let tangColor = $("#tang_type select[name='craft'] option:selected").val();
- arrs.push($(this).val().replace("烫金", "") + tangColor);
- } else if ($(this).val() == "烫镭射银") {
- let tangColor = $("#leishe_type select[name='craft'] option:selected").val();
- arrs.push(tangColor);
- } else if ($(this).val() == "打码") {
- is_dama = true;
- arrs.push($(this).val() + ma_num + "个");
- } else if ($(this).val() == "单面" || $(this).val() == "双面") {
- arrs.push($(this).val() + "印刷");
- } else if ($(this).val() == "压凹" || $(this).val() == "击凸") {
- arrs.push($("#color_type select option:selected").val() + $(this).val());
- } else {
- arrs.push($(this).val());
- }
- }
- }
- });
- if (is_dama) {
- 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 (ma_num > 1) {
- if ((size.split("*")[0] < 13 || size.split("*")[1] < 4.5) && (size.split("*")[0] < 4.5 || size.split("*")[1] < 13)) {
- layer.msg("打码尺寸小于13*4.5 cm不能打多个码", {offset: ['300px', '300px']}, function () {
- });
- return false;
- }
- }
- }
- if (kindValueSelect == '素芸') {
- const caiqie = ["圆角", "异形模切", "直角裁切"];
- const caiqieExist = caiqie.filter(craft => arr.includes(craft));
- if (caiqieExist.length == 0) {
- layer.msg("素芸-请选择裁切工艺", {offset: ['300px', '300px']}, function () {
- });
- return false;
- }
- const yinmian = ["单面", "双面"];
- const yinmianExist = yinmian.filter(craft => arr.includes(craft));
- if (yinmianExist.length == 0) {
- layer.msg("素芸-请选择印面工艺", {offset: ['300px', '300px']}, function () {
- });
- return false;
- }
- 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;
- arr = arrs;
- let kindValueSelectText = kindValueSelect;
- if (kindValueSelectText == "素芸") {
- kindValueSelectText = kindValue + kindValueSelectText;
- }
- var span_result = '特种纸名片' + "-" + kindValueSelectText + "-" + size
- + "厘米-(同款内容) \n" + "工艺 :" + arr + "\n"
- if (number > 1) {
- if (window.parent.system_isPdd) {
- 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>
|