<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="renderer" content="webkit">
<title>换手率</title>
<link href="css/bootstrap.min.css?v=3.4.0" rel="stylesheet">
<link href="font-awesome/css/font-awesome.css?v=4.3.0" rel="stylesheet">
<link href="css/plugins/iCheck/custom.css" rel="stylesheet">
<link href="css/animate.css" rel="stylesheet">
<link href="css/style.css?v=2.2.0" rel="stylesheet">
</head>
<body>
<div id="wrapper">
<nav class="navbar-default navbar-static-side" role="navigation">
<div class="sidebar-collapse">
</div>
</nav>
<div id="page-wrapper" class="gray-bg dashbard-1">
<div class="row border-bottom">
<nav class="navbar navbar-static-top" role="navigation" style="margin-bottom: 0">
<div class="navbar-header">
<a class="navbar-minimalize minimalize-styl-2 btn btn-primary " href="#"><i class="fa fa-bars"></i>
</a>
</div>
</nav>
</div>
<div class="row wrapper border-bottom white-bg page-heading">
<div class="col-lg-10">
<h2>换手率</h2>
<ol class="breadcrumb">
<li>
<a href="index.html">主页</a>
</li>
<li>
<a>换手率</a>
</li>
</ol>
</div>
<div class="col-lg-2">
</div>
</div>
<div class="wrapper wrapper-content animated fadeInRight">
<div class="row">
<div class="col-lg-12">
<div class="ibox float-e-margins">
<div class="col-sm-12">
<input id="myDate" class="laydate-icon form-control layer-date">
<button id="myDateBtn" onclick="getHuanShouLv();" class="btn btn-white btn-sm" title=""><i
class="fa fa-refresh"></i> 切换
</button>
</div>
<div class="ibox-content" style="overflow: scroll; max-height: 400px;">
<table class="table table-bordered">
<thead>
<tr>
<th>#</th>
<th>代码</th>
<th>名称</th>
<th>时间</th>
<th>涨幅</th>
<th>换手率</th>
<th>一倍</th>
<th>两倍</th>
</tr>
</thead>
<tbody id="hsl_list">
</tbody>
</table>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<div class="ibox float-e-margins">
<div class="ibox-title">
<h5 id="result_txt">个股</h5>
<div class="ibox-tools">
<a class="collapse-link">
<i class="fa fa-chevron-up"></i>
</a>
</div>
</div>
<div class="bg-f col-lg-12">
<table class="table table-bordered">
<thead>
<tr>
<th>#</th>
<th>代码</th>
<th>时间</th>
<th>收盘</th>
<th>涨幅</th>
<th>换手率</th>
</tr>
</thead>
<tbody id="gegu_hsl_list">
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="loadingModal" backdrop="static" keyboard="false">
<div style="width: 200px;height:100px; z-index: 20000; position: absolute; text-align: center; left: 50%; top: 50%;margin-left:-100px;margin-top:-10px">
<div class="progress progress-striped active"
style="margin-bottom: 0;height:50px; text-align:center;line-height: 50px;font-size:small;">
数据加载中,请稍候......
</div>
</div>
</div>
</div>
<!-- Mainly scripts -->
<script src="js/jquery-2.1.1.min.js"></script>
<script src="js/bootstrap.min.js?v=3.4.0"></script>
<script src="js/plugins/metisMenu/jquery.metisMenu.js"></script>
<script src="js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<!-- Peity -->
<script src="js/plugins/peity/jquery.peity.min.js"></script>
<!-- Custom and plugin javascript -->
<script src="js/hplus.js?v=2.2.0"></script>
<script src="js/plugins/pace/pace.min.js"></script>
<!-- iCheck -->
<script src="js/plugins/iCheck/icheck.min.js"></script>
<!-- Peity -->
<script src="js/demo/peity-demo.js"></script>
<!-- layer javascript -->
<script src="js/plugins/layer/layer.min.js"></script>
<script src="js/url.js"></script>
<!-- layerDate plugin javascript -->
<script src="js/plugins/layer/laydate/laydate.js"></script>
<script>
//外部js调用
laydate({
elem: '#myDate', //目标元素。由于laydate.js封装了一个轻量级的选择器引擎，因此elem还允许你传入class、tag但必须按照这种方式 '#id .class'
event: 'focus' //响应事件。如果没有传入event，则按照默认的click
});
</script>
<script>
$(".sidebar-collapse").load("model/left_menu.html");
$(document).ready(function () {
getHuanShouLv();
});
/**
* 获取最新换手率预警
*/
function getHuanShouLv() {
var day = $('#myDate').val()
$.ajax({
type: "post",
url: "/queryHuanShouLvNotifyList",
dataType: "json",
data: {"day": day},
success: function (data) {
// console.log(data)
if (data.code == 1) {
refreshHotListHtml(data.data);
} else {
alert(data.msg);
}
},
error: function (e) {
console.log(e);
},
beforeSend: function () {
layer.load()
},
complete: function () {
layer.closeAll()
}
});
}
/**
* 刷新板块列表的html
* @param data
*/
function refreshHotListHtml(data) {
var tableHtml = "";
for (var i = 0; i < data.length; i++) {
// console.log(data[i]);
tableHtml += "<tr>";
tableHtml += "<td>";
tableHtml += (i + 1);
tableHtml += "</td>";
tableHtml += "<td><a href='./code.html?code=" + data[i].code + "' target='_blank'>";
tableHtml += data[i].code;
tableHtml += "</a></td>";
tableHtml += "<td><a class='text-danger' onclick='openCode(\"" + data[i].code + "\"); return false' href=\"javascript:void(0)\" >";
tableHtml += data[i].name;
tableHtml += "</td>";
tableHtml += "<td>";
tableHtml += data[i].shijian;
tableHtml += "</td>";
if (data[i].percent > 0) {
tableHtml += "<td class='text-danger'>";
} else {
tableHtml += "<td class='text-info'>";
}
tableHtml += data[i].percent;
tableHtml += "</td>";
tableHtml += "<td>";
tableHtml += data[i].huanshoulv;
tableHtml += "</td>";
if (data[i].tag1 > 0) {
tableHtml += "<td class='text-info'>";
} else {
tableHtml += "<td>";
}
tableHtml += data[i].tag1;
tableHtml += "</td>";
if (data[i].tag2 > 0) {
tableHtml += "<td class='text-info'>";
} else {
tableHtml += "<td>";
}
tableHtml += data[i].tag2;
tableHtml += "</td>";
tableHtml += "</tr>";
}
$("#hsl_list").html(tableHtml);
}
/**
* 查个股换手率
* @param code
*/
function openCode(code) {
$.ajax({
type: "post",
url: "/queryHuanShouLvFromCode",
dataType: "json",
data: {"code": code},
success: function (data) {
// console.log(data)
if (data.code == 1) {
refreshCodeDetail(data.data);
} else {
alert(data.msg);
}
},
error: function (e) {
console.log(e);
},
beforeSend: function () {
layer.load()
},
complete: function () {
layer.closeAll()
}
});
}
/**
* 个股换手率列表
* @param data
*/
function refreshCodeDetail(data) {
var count = 0;
var count1 = 0;
var count2 = 0;
var tableHtml = "";
for (var i = 0; i < data.length; i++) {
var zijin = data[i]
tableHtml += "<tr>";
tableHtml += "<td>";
tableHtml += (i + 1);
tableHtml += "</td>";
tableHtml += "<td>";
tableHtml += "<a href='./code.html?code=" + zijin.code + "' target='_blank'>";
tableHtml += zijin.code;
tableHtml += "</a>";
tableHtml += "</td>";
tableHtml += "<td>";
tableHtml += zijin.riqi;
tableHtml += "</td>";
tableHtml += "<td>";
tableHtml += zijin.shoupan;
tableHtml += "</td>";
if (zijin.percent > 0) {
tableHtml += "<td class='text-danger'>";
} else {
tableHtml += "<td class='text-info'>";
}
tableHtml += zijin.percent;
tableHtml += "</td>";
if (zijin.biu > 0) {
tableHtml += "<td class='text-danger'><span class='badge badge-info'>";
tableHtml += zijin.hsl ? zijin.hsl : '';
tableHtml += "</span></td>";
count += 1;
if (i != 0) {
if(data[i-1].percent >= 0){
count1 += 1;
} else {
count2 += 1;
}
}
} else {
tableHtml += "<td>";
tableHtml += zijin.hsl ? zijin.hsl : '';
tableHtml += "</td>";
}
tableHtml += "</tr>";
}
$("#gegu_hsl_list").html(tableHtml);
$("#result_txt").html("命中 <span class='badge badge-info'>" + count + "</span> 条，涨 <span class='badge badge-danger'>" + count1 + "</span> 条，跌<span class='badge badge-inverse'>" + count2 + "</span> 条 ");
}
</script>
</body>
</html>
