<!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="ibox-title">
<h5>规则列表</h5>
<div class="ibox-tools">
<a class="collapse-link">
<i class="fa fa-chevron-up"></i>
</a>
</div>
</div>
<div class="ibox-content" style="overflow: scroll;">
<table class="table table-bordered">
<thead>
<tr>
<th>#</th>
<th>代码</th>
<th>名称</th>
<th>上限</th>
<th>下限</th>
<th>上限通知</th>
<th>下限通知</th>
<th>振幅档位</th>
<th>时间</th>
<th>操作</th>
</tr>
</thead>
<tbody id="notify_list">
</tbody>
</table>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-4">
<div class="ibox float-e-margins">
<div class="ibox-title">
<h5>新增规则</h5>
<div class="ibox-tools">
<a class="collapse-link">
<i class="fa fa-chevron-up"></i>
</a>
</div>
</div>
<div class="ibox-content">
<form class="form-horizontal m-t" id="addForm" method="post" onsubmit="return false"
action="#" novalidate="novalidate">
<div class="form-group">
<label class="col-sm-3 control-label">代码：</label>
<div class="col-sm-8">
<input id="code" name="code" class="form-control" type="text" maxlength="6">
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">名称：</label>
<div class="col-sm-6">
<input id="name" name="name" class="form-control" type="text" >
</div>
<div class="col-sm-1">
<button type="button" class="fa fa-search btn btn-info" onclick="search()">查询</button>
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">上限：</label>
<div class="col-sm-8">
<input id="max" name="max" class="form-control" type="text">
</div>
</div>
<div class="form-group">
<label class="col-sm-3 control-label">下限：</label>
<div class="col-sm-8">
<input id="min" name="min" class="form-control" type="text">
</div>
</div>
<div class="form-group">
<div class="col-sm-8 col-sm-offset-3">
<button class="btn btn-primary" style="float: left;" type="submit">提交</button>
<button class="btn btn-danger" style="float: left; margin-left: 20px;"
type="reset">清空
</button>
<span id="err_code" style="display: none; margin-left: 10px; margin-top: 5px;"
class="text-danger">未找到匹配名称</span>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="col-lg-8">
<div class="ibox-content" style="overflow: scroll;">
<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="search_list">
</tbody>
</table>
</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>
$(".sidebar-collapse").load("model/left_menu.html")
$(document).ready(function () {
refreshList();
});
// 监听代码input的输入值
$("#code").bind('input propertychange', function (e) {
var code = $(this).val();
if (code.length == 6) {
layer.load()
$.ajax({
type: "post",
url: "/queryNameFromCode",
dataType: "json",
data: {"code": code},
success: function (data) {
layer.closeAll()
console.log(data)
if (data.code == 1) {
if (data.data) {
$("#name").val(data.data.name);
$("#max").val(data.data.price);
$("#min").val(data.data.price);
$("#err_code").css('display', 'none')
} else {
$("#name").val('');
$("#max").val('');
$("#min").val('');
$("#err_code").css('display', 'block')
}
} else {
alert(data.msg);
}
},
error: function (e) {
layer.closeAll();
console.log(e);
}
});
}
});
/**
* 新增规则
*/
$("#addForm").submit(function (d) {
$.ajax({
type: "post",
url: "/addNotify",
dataType: "json",
data: $("#addForm").serialize(),
success: function (data) {
console.log(data)
if (data.code == 1) {
$("#code").val('');
$("#name").val('');
$("#max").val('');
$("#min").val('');
$("#err_code").css('display', 'none');
refreshList();
} else {
alert(data.msg);
}
},
error: function (e) {
console.log(e);
},
beforeSend: function () {
layer.load()
},
complete: function () {
layer.closeAll()
}
});
});
/**
* 请求通知列表
*/
function refreshList() {
$.ajax({
type: "post",
url: "/queryNotifyList",
dataType: "json",
success: function (data) {
console.log(data)
if (data.code == 1) {
refreshNotifyListHtml(data.data);
} else {
alert(data.msg);
}
},
error: function (e) {
console.log(e);
},
beforeSend: function () {
layer.load()
},
complete: function () {
layer.closeAll()
}
});
}
/**
* 刷新列表的html
* @param data
*/
function refreshNotifyListHtml(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 target='_blank' href='http://data.eastmoney.com/stockdata/" + data[i].code + ".html' style='margin-left: 10px'>";
tableHtml += data[i].code;
tableHtml += "</a></td>";
tableHtml += "<td>";
tableHtml += data[i].name;
tableHtml += "</td>";
tableHtml += "<td class='text-danger'>";
tableHtml += data[i].max;
tableHtml += "</td>";
tableHtml += "<td class='text-info'>";
tableHtml += data[i].min;
tableHtml += "</td>";
tableHtml += "<td>";
tableHtml += data[i].maxType;
tableHtml += "</td>";
tableHtml += "<td>";
tableHtml += data[i].minType;
tableHtml += "</td>";
tableHtml += "<td>";
tableHtml += data[i].percent;
tableHtml += "</td>";
tableHtml += "<td>";
tableHtml += data[i].time;
tableHtml += "</td>";
tableHtml += "<td>";
tableHtml += "<a onclick=\"javascript:edit('" + data[i].code + "', '" + data[i].name + "', '" + data[i].max + "', '" + data[i].min + "')\">修改</a>";
tableHtml += " | ";
tableHtml += "<a onclick=\"javascript:del('" + data[i].code + "')\">删除</a>";
tableHtml += "</td>";
}
$("#notify_list").html(tableHtml);
}
/**
* 修改规则
*/
function edit(code, name, max, min) {
$("#code").val(code);
$("#name").val(name);
$("#max").val(max);
$("#min").val(min);
}
/**
* 删除规则
* @param code
*/
function del(code) {
$.ajax({
type: "post",
url: "/deleteNotify",
dataType: "json",
data: {"code": code},
success: function (data) {
console.log(data)
if (data.code == 1) {
refreshList();
} else {
alert(data.msg);
}
},
error: function (e) {
console.log(e);
},
beforeSend: function () {
layer.load()
},
complete: function () {
layer.closeAll()
}
});
}
/**
* 按名称搜索
*/
function search() {
var key = $("#name").val();
if (key){
$.ajax({
type: "post",
url: "/search",
dataType: "json",
data: {"key": key},
success: function(data){
console.log(data)
if (data.code == 1) {
refreshSearchListHtml(data.data);
} else {
alert(data.msg);
}
},
error: function (e) {
console.log(e)
},
beforeSend: function () {
layer.load()
},
complete: function () {
layer.closeAll()
}
});
}
}
/**
* 刷新搜索列表的html
* @param data
*/
function refreshSearchListHtml(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>";
tableHtml += "<a onclick=\"javascript:edit('" + data[i].code + "', '" + data[i].name + "', '" + data[i].zuixinjia + "', '" + data[i].zuixinjia + "')\">" + data[i].code + "</a>";
tableHtml += "</td>";
tableHtml += "<td>";
tableHtml += data[i].name;
tableHtml += "</td>";
if (data[i].percent.indexOf('-')!= -1){
tableHtml += "<td class='text-info'>";
tableHtml += data[i].zuixinjia;
tableHtml += "</td>";
tableHtml += "<td class='text-info'>";
tableHtml += data[i].percent;
tableHtml += "%</td>";
} else {
tableHtml += "<td class='text-danger'>";
tableHtml += data[i].zuixinjia;
tableHtml += "</td>";
tableHtml += "<td class='text-danger'>";
tableHtml += data[i].percent;
tableHtml += "%</td>";
}
tableHtml += "<td>";
tableHtml += data[i].zuigao;
tableHtml += "</td>";
tableHtml += "<td>";
tableHtml += data[i].zuidi;
tableHtml += "</td>";
tableHtml += "<td>";
tableHtml += data[i].shijian;
tableHtml += "</td>";
}
$("#search_list").html(tableHtml);
}
</script>
</body>
</html>
