mengjie
/
FuWaiCallCenter_UI


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258
							<!doctype html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>开票</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link href="../css/mui.min.css" rel="stylesheet" />
		
		<link href="../css/mui.picker.css" rel="stylesheet" />
		<link href="../css/mui.poppicker.css" rel="stylesheet" />
		<link href="../css/iconfont.css"  rel="stylesheet"/>
		<link href="css/AddInvoice.css"  rel="stylesheet"/>
		<link rel="stylesheet" type="text/css" href="../css/mui.picker.min.css" />
	</head>
	<body>
		<!--<div class="mui-nav">
			<a class="mui-icon mui-icon-arrowleft" href="personal.html"></a>
			开票
		</div>-->
		  <!--style="margin-top: 44px;"--> 
		<div class="mui-content">
			<ul class="mui-table-view" style="margin-bottom: 10px;">
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label tital" style="">开票填写发票内容</label>
					</div>
				</li>
				<li class="mui-table-view-cell" id="invoiceType">
                	<div class="mui-input-row">
	                    <label class="label">发票类型：</label>
	                    <input type="text" placeholder="请选择发票类型" id='invoiceResult' class="ui-alert type_con" data-index="" readonly="readonly" />
	                    <a href="javascript:void(0)"><span class="type_down mui-icon mui-icon-arrowdown mui-pull-right"></span></a>
	                </div>
	           </li>
			</ul>
			<ul class="mui-table-view" style="margin-bottom: 10px;">
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label tital" style="">发票抬头</label>
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">客户名称：</label>
						<input type="text" id="cusName" placeholder="请输入客户姓名" class="size-14">
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">识别号：</label>
						<input type="number" id="taxidNum" placeholder="请输入识别号" class="size-14">
					</div>
				</li>
				<li class="mui-table-view-cell" id="showZhuTiPicker">
					<div class="mui-input-row">
						<label class="label">地址：</label>
						<input type="text" id='address' class="size-14"  placeholder="请输入地址">
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">电话：</label>
						<input type="number" id="phone" placeholder="请输入电话" class="size-14">
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">开户行：</label>
						<input type="text" id="bank" placeholder="请输入开户行" class="size-14">
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">开户行账号：</label>
						<input type="number"  id="bankAccount" placeholder="请输入开户行账号" class="size-14">
					</div>
				</li>
				
			</ul>
			<ul class="mui-table-view" style="margin-bottom: 44px;">
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label tital" style="">开票内容</label>
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">项目名称：</label>
						<input type="text" id="proName" placeholder="请输入项目名称" class="size-14">
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">型号：</label>
						<input type="text" id="models" placeholder="请输入型号" class="size-14">
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">单位：</label>
						<input type="text" id="unit" placeholder="请输入单位" class="size-14">
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">数量：</label>
						<input type="number" id="amount" placeholder="请输入数量" class="size-14">
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">单价：</label>
						<input type="number" id="unitPrice" placeholder="请输入单价" class="size-14">
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">金额：</label>
						<input type="number" id="sumPrice" placeholder="请输入金额" class="size-14">
					</div>
				</li>
				<li class="mui-table-view-cell" id="rateType">
                	<div class="mui-input-row">
	                    <label class="label">税率：</label>
	                    <input type="text" placeholder="请选择税率" id='rateResult' class="ui-alert type_con" data-index="" readonly="readonly" />
	                    <a href="javascript:void(0)"><span class="type_down mui-icon mui-icon-arrowdown mui-pull-right"></span></a>
	                </div>
	           </li>
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">税额：</label>
						<input type="number" id="taxAmount" placeholder="请输入税额" class="size-14">
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">开票方式：</label>
						<input type="text" id="billingMethod" placeholder="自取/邮寄" class="size-14">
					</div>
				</li>
				<li class="mui-table-view-cell btn" data-options='{"type":"date","beginYear":2010,"endYear":2023}'>
					<div class="mui-input-row">
						<label class="label">开票日期：</label>
						<input type="text" placeholder="请选择日期" id='start_data' class="ui-alert type_con size-14" data-index="" readonly="readonly" />
						<a href=""><span class="type_down mui-icon mui-icon-arrowdown mui-pull-right"></span></a>
					</div>
				</li>
				<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">备注：</label>
						<textarea class="ztext content size-14" placeholder="请输入备注" name="" id="remark" rows="3" cols="" placeholder="请详细描述您的问题和建议..."></textarea>
					</div>
				</li>
				<!--<li class="mui-table-view-cell">
					<div class="mui-input-row">
						<label class="label">合计：</label>
						<input type="number" id="order_tel" placeholder="自动计算" class="size-14">
					</div>
				</li>-->
			</ul>
			<div class="submit-btn">
				<button type="button" data-loading-text="提交中" class="mui-btn mui-btn-primary mui-btn-block block_button submit" id="submit">确认开票</button>
			</div>
		</div>
		<script src="../js/mui.js"></script>
		<script src="../js/mui.picker.js"></script>
		<script src="../js/mui.poppicker.js"></script>
		<script src="../js/jquery.min.js"></script>
		<script src="../js/zepto.js"></script>
		<script src="../js/huayi.http.js"></script>
		<script src="../Script/Common/huayi.config.js"></script>
		<script src="../js/mui.picker.min.js"></script>
		<script src="js/AddInvoice.js"></script>
		<script>
			invoice();
			rate();
			function invoice(){
				invoiceList=[];
				$.ajax({
					type:"get",
					url:huayi.config.callcenter_url+'Dictionary/GetDicValueListByFlagWx',
					async:false,
					data:{
						flag:'FPLX'
					},
					dataType:"json",
					success:function(data){
						var invoice_data= data.data;
						$(invoice_data).each(function(i,n){
							var obj={};
							obj.text=n.F_Name;
							obj.value =n.F_DictionaryValueId;
							invoiceList.push(obj);
						})
					}
				});
			}
			function rate(){
				rateList=[];
				$.ajax({
					type:"get",
					url:huayi.config.callcenter_url+'Dictionary/GetDicValueListByFlagWx',
					async:false,
					data:{
						flag:'KPSL'
					},
					dataType:"json",
					success:function(data){
						var invoice_data= data.data;
						$(invoice_data).each(function(i,n){
							var obj={};
							obj.text=n.F_Name;
							obj.value =n.F_DictionaryValueId;
							rateList.push(obj);
						})
					}
				});
			}
			
			(function($,doc){
				$.init();
				$.ready(function(){
			        //发票类型 
			        var invoicePicker = new $.PopPicker();
			        invoicePicker.setData(invoiceList);
			        var invoicePickerButton=doc.getElementById("invoiceType");
			        var invoiceResult = doc.getElementById("invoiceResult");
			        invoicePickerButton.addEventListener('tap',function(event){
			        	
			        	if(invoiceList.length>0){
			        		invoicePicker.show(function(items){
			        			invoiceResult.value = items[0].text;
			        			invoiceResult.setAttribute('data-index',items[0].value);
			        		})
			        		
			        	}
			        })
			        var ratePicker = new $.PopPicker();
			        ratePicker.setData(rateList);
			        var invoicePickerButton=doc.getElementById("rateType");
			        var rateResult = doc.getElementById("rateResult");
			        invoicePickerButton.addEventListener('tap',function(event){
			        	if(rateList.length>0){
			        		ratePicker.show(function(items){
			        			rateResult.value = items[0].text;
			        			rateResult.setAttribute('data-index',items[0].value);
			        		})
			        	}
			        })
				})
			})(mui, document)
		</script>
		
	</body>

</html>