{% extends "base.html" %}

{% block head %}
	<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jeditable.js/1.7.3/jeditable.min.js"></script>

	<script type="text/javascript">
		$(document).ready(function() {
  			$('.editable_select').editable('/registry/op_edit/', { 
	     		loadurl : '/registry/op_category/',
	     		type   : 'select',
	     		submit : 'OK',
		     	style: 'display: inline',
		 	});
  			$('.editable_text').editable('/registry/op_edit/', {
  				select : true,
  			});
  			
	      	$("#monthpicker").datepicker( {
	    		format: "mm/yyyy",
	    		viewMode: "months", 
	    		minViewMode: "months"
			});
  			
	 	});
	 	
		function showUrlInDialogx(url, options){
		  options = options || {};
		  var tag = $("<div></div>"); //This tag will the hold the dialog content.
		  $.ajax({
		    url: url,
		    type: (options.type || 'GET'),
		    beforeSend: options.beforeSend,
		    error: options.error,
		    complete: options.complete,
		    success: function(data, textStatus, jqXHR) {
		      if(typeof data == "object" && data.html) { //response is assumed to be JSON
		        tag.html(data.html).dialog({modal: options.modal, title: data.title}).dialog('open');
		      } else { //response is assumed to be HTML
		        tag.html(data).dialog({modal: options.modal, title: options.title}).dialog('open');
		      }
		      $.isFunction(options.success) && (options.success)(data, textStatus, jqXHR);
		    }
		  });
		}	 	
	 	
		function showUrlInDialog(url){
		  var tag = $("<div></div>");
		  $.ajax({
		    url: url,
		    success: function(data) {
		      tag.html(data).dialog({
				dialogClass: "alert",
				modal: true,
				show: "slide",
				width: 640,
			    open: function(){
			        $("body").css("overflow", "hidden");
			    },
			    close: function(){
			        $("body").css("overflow", "auto");
			    },				
			}).dialog('open');
		    }
		  });
		}	 	
	 	
	</script>
	
    <style>
        .editable_select {
            white-space: nowrap;
        }
        .alert {
        	
/*		     visibility: hidden;*/
		    position: absolute;
		    left: 0px;
		    top: 0px;
		    width:100%;
		    height:100%;
		    text-align:center;
		    z-index: 1000;
		     
		    background-color: #000000;
		    }
		     
		.reportQuery{
		 	overflow-y: auto;
		 	height: 480px;
		 	}
		 	 
    </style>
 	
{% endblock %}

{% block logo %}
	<h2><a href="#">臺大醫院 外科 部 {{year}} 年 {{month}} 月份主治醫師緊急到院處理費請領清冊</a></h2>
{% endblock %}

{% block search %}
			<form method="post" action="">{% csrf_token %}
				<fieldset>
					Month: <input type="text" id="monthpicker" name="month" size="1" /> 
<!-- 					<input type="text" name="q" id="search-text" size="15" value="{{q}}" /> -->
					<input type="submit" id="submit" value="GO" />
				</fieldset>
			</form>
{% endblock %}

{% block content %}
{% if data %}
<a href = '.?xls=1&month={{month}}%2F{{year}}'>匯出 Excel 97-2003 XLS 工作簿</a>
<table class="table">
	<thead>
		<tr style="background-color:#C0C0FF;">
			<td><nobr>員工代號</nobr></td>
			<td><nobr>醫師姓名</nobr></td>
			<td><nobr>緊急到院處理事由</nobr></td>
			<td><nobr>日期</nobr></td>
			<td><nobr>起/迄時間</nobr></td>
			<td><nobr>時數</nobr></td>
			<td><nobr>病歷號(PDF)</nobr></td>
			<td><nobr>應領金額</nobr></td>
			<td><nobr>蓋 章</nobr></td>
		</tr>
	</thead>
	<tbody>
	{% for row in data %}
	    <tr>
		{% for col in row %}
			{% if forloop.counter == 7 %}
			<td><a href='/registry/op_note/{{row.6}}/{{row.3}}/?pdf=1' target='_blank'><nobr>{{col}}</nobr></a></td>
			{% else %}
			<td><a href='/registry/op_note/{{row.6}}/{{row.3}}/?display=1' target='_blank'><nobr>{{col}}</nobr></a></td>
			{% endif %}
		{% endfor %}
	    </tr>
	{% endfor %}
	</tbody>
</table>
{% endif %}
{% endblock %}