单据打印 布局

父级页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>借支单</title>
</head>
<body>
	<iframe src="<%=basePath %>borrow/showPrint" width="100%" height="420px"></iframe>
    
	<script>
		function closeWin(){
			$("#edit_borrow_window").window('close');
			$('#borrow_table').datagrid("reload");   
		}
	</script>
</body>
</html>

子级

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>借支单</title>
    <link rel="stylesheet" type="text/css" href="../static/jquery-easyui-1.7.0/themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="../static/jquery-easyui-1.7.0/themes/icon.css">
	<link rel="stylesheet" type="text/css" href="../static/jquery-easyui-1.7.0/demo/demo.css">
	<script type="text/javascript" src="../static/jquery-easyui-1.7.0/jquery.min.js"></script>
	<script type="text/javascript" src="../static/jquery-easyui-1.7.0/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="../static/jquery-easyui-1.7.0/locale/easyui-lang-zh_CN.js"></script>
    <style>
    table{border-collapse:collapse;border-spacing:0;border-left:1px solid #888;border-top:1px solid #888;background:#fff;}
    th,td{border-right:1px solid #888;border-bottom:1px solid #888;}
    th{font-weight:bold;background:#e9faff;}
    .biaoti{
	font-family: 微软雅黑;
	font-size: 26px;
	font-weight: bold;
	border-bottom:1px dashed #CCCCCC;
	color: #255e95;
	}
	.STYLE2 {font-size: 15px;
			text-align: right;
			margin-right:20px;
	}
    </style>
</head>
<body>
	<form id="borrowForm">
    <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
        <tr>
          <td align="center" class="biaoti" height="60">借支单</td>
		  
        </tr>
		<tr>
		<td>
			<p id="dateBox" class="STYLE2">
			借款日期:
			
            <input  id="borrowDate" name="borrowDate" class="easyui-datebox" 
						type="text" style="width: 150px;border:0;" value="${borrow.borrowDate }"
						data-options="required:true,missingMessage:'借款日期必须输入'">&nbsp;&nbsp;&nbsp;&nbsp;
			</p>
			<p id="realDate" class="STYLE2" hidden="true">
            <input  id="realInput" type="text" style="width: 150px;text-align:right;border:none;" >&nbsp;&nbsp;&nbsp;&nbsp;
			</p>
		  </td>
		</tr>
      </table>  
	<table border="1" width="100%" align="center">
	<tr>
	  <th style="font-size: 15px;">借支人姓名</th>
	  <td colspan="7"><input id="borrowUser1" value = "${user.userName }" readonly="readonly"
							style="width: 100%;height:100%; border:0; padding:10px;" value="${borrow.borrowUser }"></td>
	</tr>
	<tr>
	  <th style="font-size: 15px;">借款事由</th>
	  <td colspan="7"><input id="borrowReason" name="borrowReason" value="${borrow.borrowReason }"
							style="width: 100%;height:100%; border:0; padding:10px;"  ></td>
	</tr>
	<tr>
	  <th style="font-size: 15px;">金额(元)</th>
	  <td colspan="5"><input id="dxje" name="" 	placeholder="无需输入,自动生成" readonly="readonly" style="width: 100%;height:100%; border:0; padding:10px;"></td>
	  <th style="font-size: 15px;">¥</th>
	  <td colspan="2"><input id="borrowAmount" name="borrowAmount" type="text"
							value="${borrow.borrowAmount }" 
							style="width: 100%;height:100%; border:0; padding:10px;" onkeyup="num(this)" size="10" ></td>
	</tr>
	</table>
	<input name="borrowUser" hidden="true" value="${user.userId }">
	<input name="borrowId" hidden="true" value="${borrow.borrowId }">
	</form>
	<div id="notView" hidden="true">
	<table  width="100%" >
		<tr>
		    <th width="13%" height="60" >核准</th>
		    <td width="13%" height="60">&nbsp;</td>
		    <th width="13%" height="60">会计</th>
		    <td width="13%" height="60">&nbsp;</td>
		    <th width="13%" height="60">出纳</th>
		    <td width="13%" height="60" >&nbsp;</td>
		    <th width="13%" height="60">借支人</th>
		    <td height="60">&nbsp;</td>
		</tr>
	</table>
	</div>
	<br>
	<br>
		<div id="btnDiv" align="center">	
			<a id="saveBtn" href="javascript:void(0);" class="easyui-linkbutton"
				data-options="iconCls:'icon-add'" onclick="submitEditForm()">&nbsp; 新&nbsp; 增&nbsp; </a>
			<a id="printBtn" href="javascript:void(0);" class="easyui-linkbutton"
				data-options="iconCls:'icon-print'" onclick="printHtml()">新增并打印</a>
		</div>
<script>
	/* 日期 默认显示今天日期 */
	$(function(){
	   var curr_time = new Date();
	   var str = curr_time.getFullYear()+"-";
	   str += curr_time.getMonth()+1+"-";
	   str += curr_time.getDate()+"-";
	   str += curr_time.getHours()+":";
	   str += curr_time.getMinutes()+":";
	   str += curr_time.getSeconds();
	   //$('#borrowDate').datebox('setValue',str);
	   var flag = $('#borrowDate').val();
	   if(flag.length == 0){
		   $('#borrowDate').datebox('setValue',str);		   
	   }
	});
	/* onchange */
	$("#borrowAmount").change(function(){
		var str = $("#borrowAmount").val();
		str = DX(str);
		$("#dxje").val(str);
	});
	
	/* 保存修改 */
	function submitEditForm(){	
		var flag = checkNotNull();
		if(flag == false){
			return;
		}
		$('#borrowForm').form('submit', {
		    url:"<%=basePath%>borrow/saveInfo",
		    onSubmit: function(){
				return $('#borrowForm').form('enableValidation').form('validate');
		    },
		    success:function(data){
				//alert(data);
				var json = jQuery.parseJSON(data);
				if(json.code==1){
	        		//alert(json.msg);
					
					//调用父级关闭
					window.parent.closeWin();
	                //$("#edit_borrow_window").window('close');
	        	} else{
	        		alert(json.msg);
	        	}	
		    },
		    error: function (data) {
	            alert("网络异常!");
	        }
		});		
	}
	/* 打印 */
	function printHtml(){
		var flag = checkNotNull();
		if(flag == false){
			return;
		}
		$("#btnDiv").attr("hidden","true");
		var date = $("#borrowDate").val();
		$("#notView").attr("hidden",false);
		$("#dateBox").attr("hidden",true);
		$("#realInput").val(date);
		$("#realDate").attr("hidden",false);
		submitEditForm();
		//调用父级关闭
		//window.parent.closeWin();
		window.print();
		$("#btnDiv").attr("hidden",false);
		$("#notView").attr("hidden",true);
		$("#realDate").attr("hidden",true);
		$("#dateBox").attr("hidden",false);
	}
	/* 小写金额转换大写 */
	/* function DX(n) {
		var strOutput = "";
		var strUnit = '千百拾亿千百拾万千百拾元角分';
		n += "00";
		var intPos = n.indexOf('.');
		if (intPos >= 0)
		n = n.substring(0, intPos) + n.substr(intPos + 1, 2);
		strUnit = strUnit.substr(strUnit.length - n.length);
		for (var i=0; i < n.length; i++)
		strOutput += '零壹贰叁肆伍陆柒捌玖'.substr(n.substr(i,1),1) + strUnit.substr(i,1);
		return strOutput;
	} */
	var DX = function(n) {
	    var fraction = ['角', '分'];
	    var digit = [
	        '零', '壹', '贰', '叁', '肆',
	        '伍', '陆', '柒', '捌', '玖'
	    ];
	    var unit = [
	        ['元', '万', '亿'],
	        ['', '拾', '佰', '仟']
	    ];
	    var head = n < 0 ? '欠' : '';
	    n = Math.abs(n);
	    var s = '';
	    for (var i = 0; i < fraction.length; i++) {
	        s += (digit[Math.floor(n * 10 * Math.pow(10, i)) % 10] + fraction[i]).replace(/零./, '');
	    }
	    s = s || '整';
	    n = Math.floor(n);
	    for (var i = 0; i < unit[0].length && n > 0; i++) {
	        var p = '';
	        for (var j = 0; j < unit[1].length && n > 0; j++) {
	            p = digit[n % 10] + unit[1][j] + p;
	            n = Math.floor(n / 10);
	        }
	        s = p.replace(/(零.)*零$/, '').replace(/^$/, '零') + unit[0][i] + s;
	    }
	    return head + s.replace(/(零.)*零元/, '元')
	        .replace(/(零.)+/g, '零')
	        .replace(/^整$/, '零元整');
	}
	/* 校验非空 */
	function checkNotNull(){
		var borrowAmount = $("#borrowAmount").val();
		var	borrowReason = $("#borrowReason").val();
		if(borrowAmount.length <= 0 || borrowReason.length <= 0){
			$.messager.alert("操作提示", "请输入必要内容!");
			return false;
		}
		return true;
	}
	
	function num(obj){
	    obj.value = obj.value.replace(/[^\d.]/g,""); //清除"数字"和"."以外的字符
	    obj.value = obj.value.replace(/^\./g,""); //验证第一个字符是数字
	    obj.value = obj.value.replace(/\.{2,}/g,"."); //只保留第一个, 清除多余的
	    obj.value = obj.value.replace(".","$#$").replace(/\./g,"").replace("$#$",".");
	    obj.value = obj.value.replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3'); //只能输入两个小数
	}
</script>
</body>
</html>

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值