pythonstock--stock/backend/web/templates/stock_web.html

{% extends "layout/default.html" %}


{% block main_content %}

	<h3 class="header smaller lighter blue">{{ stockWeb.name }}</h3>
	<div class="table-header">{{ stockWeb.name }}</div>

	<div class="row">&nbsp;</div>
	<div class="row">
		{% for index,element in enumerate(stockWeb.columns) %}
		{% if index < 15 %}
			{% if element != 'eastmoney_url' %}
			<div class="col-md-4" id="filter_col{{ index+1 }}" data-column="{{ index }}">
				{{ stockWeb.column_names[index] }} &nbsp;
				<!-- Column - {{ stockWeb.column_names[index] }} - {{ element }} -->

				<input type="text" class="column_filter input-group-sm form-control {% if element == 'date' %}date-picker{% end %}"
					   {% if element == 'date' %} value="{{ date_now }}" {% end %}
					   id="col{{ index }}_filter">
			</div>
			{% end %}
		{% end %}{% end %}
	</div>

	<table cellpadding="3" cellspacing="0" border="0" style="width: 67%; margin: 0 auto 2em auto;">
		<tbody>

		</tbody>
	</table>
	<!-- div.table-responsive -->
	<!-- div.dataTables_borderWrap -->
	<div>
		<div class="pull-right tableTools-container"></div>
		<table id="dynamic-table" class="table table-striped table-bordered table-hover">
			<thead>
				<tr>{% for column_name in stockWeb.column_names %}
					<th>{{ column_name }}</th>
				{% end %}
				</tr>
			</thead>
		</table>
	</div>

	<!-- 定义一个窗口的Div 东方财富股票数据页面 -->
	<div id="dfcf-window-modal" class="modal fade">
		<div class="modal-dialog" style="width:1095px;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<h3 class="smaller lighter blue no-margin">东方财富分析</h3>
				</div>
				<div class="modal-body" id="dfcf-iframe-body" >
				</div>
			</div>
		</div>
	</div>

	<!-- 定义一个窗口的Div 指标分析数据页面 -->
	<div id="indicators-window-modal" class="modal fade">
		<div class="modal-dialog" style="width:1050px;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<h3 class="smaller lighter blue no-margin">股票数据详细指标分析</h3>
				</div>
				<div class="modal-body" id="indicators-window-body" >

				</div>
			</div>
		</div>
	</div>

<!-- inline scripts related to this page -->
<script type="text/javascript">

	//每次动态加载 指标分析窗口
	function showIndicatorsWindow(code) {
		var baseUrl = '/api/v1/data/indicators?code='+code; // 没有跨域问题，直接加载
		$('#indicators-window-body').html( "<h5>数据加载中...请稍候.</h5>" );
		$('#indicators-window-body').context = $("#indicators-window-body").load(baseUrl);
		$('#indicators-window-modal').modal('show');
	}

	//每次动态加载 东方财富窗口
	function showDFCFWindow(code) {

		var iframe = document.createElement('iframe')
		// var baseUrl = 'https://emweb.eastmoney.com/PC_HSF10/ShareholderResearch/Index?type=soft&code='+code;
		var baseUrl = 'https://emweb.eastmoney.com/PC_HSF10/OperationsRequired/Index?type=soft&code='+code;
		iframe.src = baseUrl;
		iframe.width = '1060px';
		iframe.height = '700px';
		iframe.frameborder = '0';
		$('#dfcf-iframe-body').empty(); // 先清空数据
		document.getElementById("dfcf-iframe-body").appendChild(iframe)
		$('#dfcf-window-modal').modal('show');
	}

	jQuery(function($) {


		$( ".date-picker" ).datepicker({
			language: 'zh-CN', //设置语言
            format:"yyyymmdd",
            showOtherMonths: true,
            selectOtherMonths: false,
            autoclose: true,
			todayHighlight: true,
			onSelect: function(selected,evnt) {
				 console.log(selected);
			}
        }).on('changeDate', function(ev){
			$('input.column_filter').click();//触发搜索
		});


		var nameParam = $.getUrlVar('table_name');
		//console.log(nameParam);
		var myTable = $('#dynamic-table').DataTable( {
			"select": true,
			"bFilter": true,
			"ordering": true,
			"processing": true,
			"serverSide": true,
			"lengthMenu": [[20, 30, 50, 100,1000, -1], [20, 30, 50, 100,1000, "All"]],
			"language": {
                "url": "/static/js/datatables.Chinese.json"
            },
			"ajax": "/api/v1/api_data?name="+nameParam,
			"columns": [
				{% for column in stockWeb.columns %}
					{ "data": "{{ column }}" },
				{% end %}
        	]
		} );

		$('input.column_filter').on( 'keyup click', function () {
			var i =  $(this).parents('div').attr('data-column') ;
			//console.log(i,"val:",$(this).val());
			myTable.column(i).search(
				$(this).val()
			).draw();
		});

		$('input.column_filter').click();//第一次点击执行，读取时间信息。

		$.fn.dataTable.Buttons.defaults.dom.container.className = 'dt-buttons btn-overlap btn-group btn-overlap';

		new $.fn.dataTable.Buttons( myTable, {
			buttons: [
			  {
				"extend": "copy",
				"text": "<i class='fa fa-copy bigger-110 pink'></i> <span class='hidden'>Copy to clipboard</span>",
				"className": "btn btn-white btn-primary btn-bold"
			  },
			  {
				"extend": "csv",
				"text": "<i class='fa fa-database bigger-110 orange'></i> <span class='hidden'>Export to CSV</span>",
				"className": "btn btn-white btn-primary btn-bold"
			  },
			  {
				"extend": "print",
				"text": "<i class='fa fa-print bigger-110 grey'></i> <span class='hidden'>Print</span>",
				"className": "btn btn-white btn-primary btn-bold",
				autoPrint: false,
				message: 'This print was produced using the Print button for DataTables'
			  }
			]
		} );
		myTable.buttons().container().appendTo( $('.tableTools-container') );

	})
</script>
{% end %}