|
@@ -0,0 +1,430 @@
|
|
|
+<%@ page contentType="text/html;charset=UTF-8" %>
|
|
|
+<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
|
|
|
+<html>
|
|
|
+<head>
|
|
|
+ <title>申请付款</title>
|
|
|
+ <meta name="decorator" content="default"/>
|
|
|
+ <style type="text/css">
|
|
|
+ .table th {
|
|
|
+ text-align: center
|
|
|
+ }
|
|
|
+
|
|
|
+ .table td {
|
|
|
+ text-align: center
|
|
|
+ }
|
|
|
+
|
|
|
+ .pay-table th {
|
|
|
+ background: #f9f9f9
|
|
|
+ }
|
|
|
+
|
|
|
+ .pay-table tr:first-child th {
|
|
|
+ background: #eee !important
|
|
|
+ }
|
|
|
+
|
|
|
+ .pay-table td {
|
|
|
+ background: #fff !important
|
|
|
+ }
|
|
|
+
|
|
|
+ input[type="checkbox"]::before {
|
|
|
+ content: '\a0';
|
|
|
+ display: inline-block;
|
|
|
+ vertical-align: .2em;
|
|
|
+ width: .8em;
|
|
|
+ height: .8em;
|
|
|
+ margin-right: .2em;
|
|
|
+ border-radius: .2em;
|
|
|
+ text-indent: .15em;
|
|
|
+ line-height: .65
|
|
|
+ }
|
|
|
+
|
|
|
+ .pay-more-func span:first-child {
|
|
|
+ margin-right: 6px
|
|
|
+ }
|
|
|
+
|
|
|
+ .pay-more-func span:hover {
|
|
|
+ color: #7aa9c3
|
|
|
+ }
|
|
|
+
|
|
|
+ .tips-popup-content p {
|
|
|
+ text-align: center;
|
|
|
+ padding: 80px;
|
|
|
+ font-size: 20px
|
|
|
+ }
|
|
|
+
|
|
|
+ .revise-popup-content h4, .tips-popup-content h4 {
|
|
|
+ padding-left: 10px;
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ border-bottom: 1px solid #eee;
|
|
|
+ margin-bottom: 20px
|
|
|
+ }
|
|
|
+
|
|
|
+ .revise-popup-content div {
|
|
|
+ margin-top: 7px;
|
|
|
+ text-align: center
|
|
|
+ }
|
|
|
+
|
|
|
+ .revise-popup-content label {
|
|
|
+ width: 70px;
|
|
|
+ text-align: right;
|
|
|
+ vertical-align: text-bottom
|
|
|
+ }
|
|
|
+
|
|
|
+ .revise-popup-content button {
|
|
|
+ width: 80px;
|
|
|
+ height: 30px;
|
|
|
+ -webkit-border-radius: 5px;
|
|
|
+ -moz-border-radius: 5px;
|
|
|
+ border-radius: 5px
|
|
|
+ }
|
|
|
+
|
|
|
+ .revise-popup-content > div:nth-of-type(4) > span:first-child {
|
|
|
+ margin-left: -104px
|
|
|
+ }
|
|
|
+
|
|
|
+ .revise-popup-content > div:nth-of-type(4) > span:last-child {
|
|
|
+ margin-left: 30px
|
|
|
+ }
|
|
|
+
|
|
|
+ .revise-popup-content > div:nth-of-type(4) > span span {
|
|
|
+ margin-left: 10px
|
|
|
+ }
|
|
|
+
|
|
|
+ .revise-popup-content > div:last-child {
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 20px
|
|
|
+ }
|
|
|
+
|
|
|
+ .revise-popup-content input {
|
|
|
+ width: 100px;
|
|
|
+ margin-bottom: 0px
|
|
|
+ }
|
|
|
+
|
|
|
+ .form-search label {
|
|
|
+ width: 80px;
|
|
|
+ text-align: left;
|
|
|
+ margin-top: 12px
|
|
|
+ }
|
|
|
+
|
|
|
+ .remark-title span {
|
|
|
+ color: red
|
|
|
+ }
|
|
|
+
|
|
|
+ .ul-form label {
|
|
|
+ width: 90px;
|
|
|
+ text-align: left;
|
|
|
+ margin-top: 15px
|
|
|
+ }
|
|
|
+
|
|
|
+ .pay-status label {
|
|
|
+ margin-left: 0
|
|
|
+ }
|
|
|
+
|
|
|
+ .pay-status label:first-child {
|
|
|
+ margin-left: 10px
|
|
|
+ }
|
|
|
+ .controls{
|
|
|
+ font-size: 0;
|
|
|
+ }
|
|
|
+ .controls .conList{
|
|
|
+ display: inline-block;
|
|
|
+ margin-right: 15px;
|
|
|
+ }
|
|
|
+ .conList .btn:nth-of-type(1){
|
|
|
+ margin-left: 25px;
|
|
|
+ }
|
|
|
+ .upload-content {
|
|
|
+ margin-top: -70px;
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+ .upload-content .conList .btn:nth-of-type(1) {
|
|
|
+ width: 90px;
|
|
|
+ height: 100px;
|
|
|
+ border: 2px solid #eee;
|
|
|
+ background: #fff;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .upload-content .conList .btn:nth-of-type(1)>div {
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 50%;
|
|
|
+ transform: translate(-50%, -50%);
|
|
|
+ color: #666;
|
|
|
+ }
|
|
|
+ .upload-content .conList .btn:nth-of-type(1) span {
|
|
|
+ font-size: 35px;
|
|
|
+ }
|
|
|
+ .upload-content .conList .btn:nth-of-type(1) h5 {
|
|
|
+ color: #666;
|
|
|
+ }
|
|
|
+ .cancel-upload {
|
|
|
+ background: transparent;
|
|
|
+ border: none;
|
|
|
+ box-shadow: none;
|
|
|
+ position: relative;
|
|
|
+ top: -38px;
|
|
|
+ left: -25px;
|
|
|
+ cursor: pointer;
|
|
|
+ z-index: 100;
|
|
|
+ }
|
|
|
+ .upload-content .conList ol li {
|
|
|
+ width: 114px;
|
|
|
+ min-height: 80px;
|
|
|
+ text-align: center;
|
|
|
+ background: #fff;
|
|
|
+ position: relative;
|
|
|
+ top: 120px;
|
|
|
+ margin-left: 2px;
|
|
|
+ }
|
|
|
+ .hide-pic {
|
|
|
+ display: none !important;
|
|
|
+ }
|
|
|
+ .refund-methods{height:auto !important}
|
|
|
+ .refund-methods>div{display:inline-block}
|
|
|
+ .refund-methods label{vertical-align:top;line-height:50px}
|
|
|
+ </style>
|
|
|
+ <script type="text/javascript">
|
|
|
+ $(document).ready(function() {
|
|
|
+ $("#inputForm").validate({
|
|
|
+ ignore:"",
|
|
|
+ submitHandler: function (form) {
|
|
|
+ var type = $("input[name='type']:checked").val();
|
|
|
+ var differencePrice = $("#differencePrice").val();
|
|
|
+ var waitPayShop = ${payShopDifference.waitPayShop};
|
|
|
+ if (type == 2 && differencePrice > waitPayShop) {
|
|
|
+ var refundCheckbox = $('.refund-checkbox:checked');
|
|
|
+ var inputTotalAmount = 0;
|
|
|
+ refundCheckbox.each(function () {
|
|
|
+ var wrapper = $(this).closest('.refund-wrapper'),
|
|
|
+ thisAmount = wrapper.find('.refund-amount');
|
|
|
+ inputTotalAmount += Number(thisAmount.val());
|
|
|
+ console.log('===', inputTotalAmount);
|
|
|
+ });
|
|
|
+ if (Number(inputTotalAmount - differencePrice + waitPayShop) > 0.1) {
|
|
|
+ alertx("退款金额应等于差价与代付金额的差值");
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ /*var shopPostFee = $("#shopPostFee").val();
|
|
|
+ var brokerage = ${brokerage};
|
|
|
+ if (brokerage < shopPostFee) {
|
|
|
+ top.$.jBox.confirm("付第三方的值不合理,导致佣金为负,确认继续吗?", '提示', function (v, h, f) {
|
|
|
+ if (v == true) {
|
|
|
+ loading('正在提交,请稍等...');
|
|
|
+ form.submit();
|
|
|
+ }
|
|
|
+ return;
|
|
|
+ }, {buttons: {'取消': false, '确定': true}});
|
|
|
+ } else {*/
|
|
|
+ loading('正在提交,请稍等...');
|
|
|
+ form.submit();
|
|
|
+ /*}*/
|
|
|
+ },
|
|
|
+ errorContainer: "#messageBox",
|
|
|
+ errorPlacement: function(error, element) {
|
|
|
+ $("#messageBox").text("输入有误,请先更正。");
|
|
|
+ if (element.is(":checkbox")||element.is(":radio")||element.parent().is(".input-append")){
|
|
|
+ error.appendTo(element.parent().parent());
|
|
|
+ } else {
|
|
|
+ error.insertAfter(element);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ </script>
|
|
|
+</head>
|
|
|
+<body>
|
|
|
+<ul class="nav nav-tabs">
|
|
|
+ <li><a href="${ctx}/order/cmPayShop">付款列表</a></li>
|
|
|
+ <li><a href="${ctx}/shopOrder/payOrderList?operatingMode=1">申请付款</a></li>
|
|
|
+ <li class="active"><a href="${ctx}/order/cmPayShop/differencePriceForm?shopOrderId=${payShopDifference.shopOrderId}">供应商差价</a></li>
|
|
|
+</ul>
|
|
|
+<form:form id="inputForm" modelAttribute="payShopDifference" action="${ctx}/order/cmPayShop/saveDifferencePrice" method="post" class="form-horizontal">
|
|
|
+ <form:hidden path="shopOrderId"/>
|
|
|
+ <br>
|
|
|
+ <div class="control-group">
|
|
|
+ <label class="control-label">差价类型:</label>
|
|
|
+ <input type="radio" name="type" value="1" checked="true" onclick="showInfo()">少付
|
|
|
+ <input type="radio" name="type" value="2" onclick="showInfo()">多付
|
|
|
+ <img src="/static/images/info.jpg" style="height: 20px;width: 20px" onclick="alertx('“少付”指成本变高了,按旧成本付款的话相当于会少付供应商,但是线上支付的订单不能修改成本,所以通过补差价的方式来弥补;“多付”指成本变低了,按旧成本付款的话相当于会多付供应商,但是线上支付的订单不能修改成本,所以通过退差价的方式来弥补。')">
|
|
|
+ </div>
|
|
|
+ <div class="control-group">
|
|
|
+ <label class="control-label"><font color='red'>*</font>差价金额:</label>
|
|
|
+ <div class="controls">
|
|
|
+ <input type="number" id="differencePrice" required name="differencePrice" onchange="showInfo()"/>
|
|
|
+ <label> (目前子订单待付金额为¥${payShopDifference.waitPayShop})</label>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="control-group" id="refundShow" hidden>
|
|
|
+ <div class="refund-methods">
|
|
|
+ <label class="control-label">接收退款方式:</label>
|
|
|
+ <div>
|
|
|
+ <div class="refund-wrapper">
|
|
|
+ <input type="checkbox" class="refund-checkbox" name="refundWay" value="1" checked>线下转账 
|
|
|
+ <select name="refundType" id="refundType">
|
|
|
+ <option value="1">建设银行7297</option>
|
|
|
+ <option value="2">中信银行0897</option>
|
|
|
+ <option value="3">中信银行7172</option>
|
|
|
+ <option value="4">广发银行0115</option>
|
|
|
+ <option value="5">广发银行5461</option>
|
|
|
+ <option value="6">虚拟银行0000</option>
|
|
|
+ </select>
|
|
|
+ <input type="number" name="refundAmount" class="refund-amount" value="0.00">
|
|
|
+ </div><br>
|
|
|
+ <div class="refund-wrapper">
|
|
|
+ <input type="checkbox" class="refund-checkbox" name="refundWay" value="2">欠款账簿
|
|
|
+ <input type="number" name="refundBalanceAmount" class="refund-amount" value="0.00">
|
|
|
+ </div><br>
|
|
|
+ <font color="red">注意:两种退款方式金额之和应该等于差价金额与待付金额的差值</font>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="control-group">
|
|
|
+ <label class="control-label"><font color='red'>*</font>备注内容:</label>
|
|
|
+ <div class="controls">
|
|
|
+ <textarea type="text" name="remark" placeholder="请详细说明造成付供应商差价的原因" style="position: relative;height: 100px; width: 450px;" maxlength="500" required ></textarea>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="control-group">
|
|
|
+ <label class="control-label">图片:</label>
|
|
|
+ <div class="controls upload-content" style="margin: -91px 0px 0px 16px;" id="remarkImageBox">
|
|
|
+ <div class="conList">
|
|
|
+ <form:hidden id="remarkImage1" path="remarkImages" htmlEscape="false" maxlength="255" class="input-xlarge"/>
|
|
|
+ <sys:ckfinder input="remarkImage1" type="images" uploadPath="/photo" selectMultiple="false" maxWidth="100" maxHeight="100"/>
|
|
|
+ </div>
|
|
|
+ <div class="conList hide-pic">
|
|
|
+ <form:hidden id="remarkImage2" path="remarkImages" htmlEscape="false" maxlength="255" class="input-xlarge"/>
|
|
|
+ <sys:ckfinder input="remarkImage2" type="images" uploadPath="/photo" selectMultiple="false" maxWidth="100" maxHeight="100"/>
|
|
|
+ </div>
|
|
|
+ <div class="conList hide-pic">
|
|
|
+ <form:hidden id="remarkImage3" path="remarkImages" htmlEscape="false" maxlength="255" class="input-xlarge"/>
|
|
|
+ <sys:ckfinder input="remarkImage3" type="images" uploadPath="/photo" selectMultiple="false" maxWidth="100" maxHeight="100"/>
|
|
|
+ </div>
|
|
|
+ <div class="conList hide-pic">
|
|
|
+ <form:hidden id="remarkImage4" path="" htmlEscape="false" maxlength="255" class="input-xlarge"/>
|
|
|
+ <sys:ckfinder input="remarkImage4" type="images" uploadPath="/photo" selectMultiple="false" maxWidth="100" maxHeight="100"/>
|
|
|
+ </div>
|
|
|
+ <div class="conList hide-pic">
|
|
|
+ <form:hidden id="remarkImage5" path="remarkImages" htmlEscape="false" maxlength="255" class="input-xlarge"/>
|
|
|
+ <sys:ckfinder input="remarkImage5" type="images" uploadPath="/photo" selectMultiple="false" maxWidth="100" maxHeight="100"/>
|
|
|
+ </div>
|
|
|
+ <div class="conList hide-pic">
|
|
|
+ <form:hidden id="remarkImage6" path="remarkImages" htmlEscape="false" maxlength="255" class="input-xlarge"/>
|
|
|
+ <sys:ckfinder input="remarkImage6" type="images" uploadPath="/photo" selectMultiple="false" maxWidth="100" maxHeight="100"/>
|
|
|
+ </div>
|
|
|
+ <div class="conList hide-pic">
|
|
|
+ <form:hidden id="remarkImage7" path="remarkImages" htmlEscape="false" maxlength="255" class="input-xlarge"/>
|
|
|
+ <sys:ckfinder input="remarkImage7" type="images" uploadPath="/photo" selectMultiple="false" maxWidth="100" maxHeight="100"/>
|
|
|
+ </div>
|
|
|
+ <div class="conList hide-pic">
|
|
|
+ <form:hidden id="remarkImage8" path="remarkImages" htmlEscape="false" maxlength="255" class="input-xlarge"/>
|
|
|
+ <sys:ckfinder input="remarkImage8" type="images" uploadPath="/photo" selectMultiple="false" maxWidth="100" maxHeight="100"/>
|
|
|
+ </div>
|
|
|
+ <div class="conList hide-pic">
|
|
|
+ <form:hidden id="remarkImage9" path="remarkImages" htmlEscape="false" maxlength="255" class="input-xlarge"/>
|
|
|
+ <sys:ckfinder input="remarkImage9" type="images" uploadPath="/photo" selectMultiple="false" maxWidth="100" maxHeight="100"/>
|
|
|
+ </div>
|
|
|
+ <div class="conList hide-pic">
|
|
|
+ <form:hidden id="remarkImage10" path="remarkImages" htmlEscape="false" maxlength="255" class="input-xlarge"/>
|
|
|
+ <sys:ckfinder input="remarkImage10" type="images" uploadPath="/photo" selectMultiple="false" maxWidth="100" maxHeight="100"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="form-actions">
|
|
|
+ <input id="btnSubmit" style="margin-left: 150px" class="btn btn-primary" type="submit" value="确认"/>
|
|
|
+ <input id="btnCancel" class="btn" type="button" value="返回" onclick="history.go(-1)"/>
|
|
|
+ </div>
|
|
|
+</form:form>
|
|
|
+<sys:message content="${message}"/>
|
|
|
+<script>
|
|
|
+
|
|
|
+ //图片初始化
|
|
|
+ $(function () {
|
|
|
+ $('.upload-content .conList .btn:nth-of-type(1)').html('<div><span>+</span><h5>选择图片</h5></div>');
|
|
|
+ $('.upload-content .conList .btn:nth-of-type(2)').after('<img class="cancel-upload" src="/static/images/close-btn1.png">').remove();
|
|
|
+ $('.upload-content .conList').find('.cancel-upload').hide();
|
|
|
+ var observeEle = document.getElementsByClassName('upload-content')[0];
|
|
|
+ var MutationObserver = window.MutationObserver || window.WebKitMutationObserver;
|
|
|
+ var MutationObserverConfig={
|
|
|
+ childList: true,
|
|
|
+ subtree: true,
|
|
|
+ characterData: true
|
|
|
+ };
|
|
|
+ var observer = new MutationObserver(function(mutations){
|
|
|
+ $.each(mutations, function(index,item) {
|
|
|
+ if (item.type === 'childList') {
|
|
|
+ // 在创建新的 element 时调用
|
|
|
+ var target = $(item.target),
|
|
|
+ thisWrapper = target.closest('.conList'),
|
|
|
+ nextEle = thisWrapper.next();
|
|
|
+ thisWrapper.find('li').css('z-index',99);
|
|
|
+ thisWrapper.find('.cancel-upload').show();
|
|
|
+ if(nextEle.hasClass('hide-pic')) {
|
|
|
+ nextEle.removeClass('hide-pic');
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ });
|
|
|
+ observer.observe(observeEle,MutationObserverConfig);
|
|
|
+
|
|
|
+ $('body').on('click','.upload-content li',function() {
|
|
|
+ var index = $(this).closest('.conList').index() + 1,
|
|
|
+ str = 'remarkImage'+index+'FinderOpen';
|
|
|
+ eval(str+'()');
|
|
|
+ });
|
|
|
+ $('body').on('click', '.cancel-upload',function() {
|
|
|
+ var wrapper = $(this).closest('.conList');
|
|
|
+ wrapper.find('li').css('z-index','-1');
|
|
|
+ wrapper.find('input').val('');
|
|
|
+ $(this).hide();
|
|
|
+ if ($('.cancel-upload:visible').length < 9) {
|
|
|
+ wrapper.addClass("hide-pic");
|
|
|
+ }else{
|
|
|
+ wrapper.removeClass("hide-pic");
|
|
|
+ }
|
|
|
+ wrapper.parent().append(wrapper.clone());
|
|
|
+ wrapper.remove();
|
|
|
+ $(".conList").each(function(i,ele){
|
|
|
+ if($(ele).find("input.input-xlarge").val()){
|
|
|
+ $(ele).next().removeClass("hide-pic")
|
|
|
+ }
|
|
|
+ })
|
|
|
+ });
|
|
|
+ $(window).on("load", function(){
|
|
|
+ setTimeout(function(){
|
|
|
+ $("#remarkImageBox").find("input.input-xlarge").each(function(i,ele){
|
|
|
+ if($(ele).val()){
|
|
|
+ $(ele).next().find("li").css("z-index","99");
|
|
|
+ $(ele).parents(".conList").find(".cancel-upload").show();
|
|
|
+ $(ele).parents(".conList").next().removeClass("hide-pic")
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },500);
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ /**
|
|
|
+ * @param obj
|
|
|
+ * jquery控制input只能输入数字
|
|
|
+ */
|
|
|
+ function onlynum(obj) {
|
|
|
+ obj.value = obj.value.replace(/[^\d]/g, ""); //清除"数字"以外的字符
|
|
|
+ }
|
|
|
+
|
|
|
+ function showInfo() {
|
|
|
+ var type = $("input[name='type']:checked").val();
|
|
|
+ if (type == 1){
|
|
|
+ $("#refundShow").hide();
|
|
|
+ } else {
|
|
|
+ var differencePrice = $("#differencePrice").val();
|
|
|
+ var waitPayShop = ${payShopDifference.waitPayShop};
|
|
|
+ if (differencePrice > waitPayShop) {
|
|
|
+ $("#refundShow").show();
|
|
|
+ }else {
|
|
|
+ $("#refundShow").hide();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+</body>
|
|
|
+</html>
|