<!DOCTYPE html>
|
<html>
|
<head>
|
<meta charset="utf-8">
|
<title>看盘端</title>
|
<link rel="stylesheet" type="text/css" href="./css/banshuping.css" />
|
<!-- <link rel="stylesheet" type="text/css" href="layui/css/layui.css" /> -->
|
<link rel="stylesheet" href="//unpkg.com/layui@2.6.8/dist/css/layui.css">
|
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
|
<script src="http://cdn.yeshitv.com/js/vue.min.js"></script>
|
<script src="js/vconsole.min.js"></script>
|
<script src="js/code_list.js"></script>
|
<script src="js/qwebchannel.js"></script>
|
<script src="js/kpl.js"></script>
|
<script src="js/http.js"></script>
|
<script src="js/jquery-ui.min.js"></script>
|
<script src="layui/layui.js"></script>
|
<style>
|
|
</style>
|
</head>
|
<body>
|
<div id="app">
|
<div style="position: fixed;top: 0;width: 100%;">
|
<div class="top">
|
<span>
|
<h2 style="margin-left: 18px; font-size: 20px;">
|
{{code_name}}
|
</h2>
|
</span>
|
<div>
|
<input type="text" id="date" placeholder="请输入日期" style="height: 20px;width: 80px;font-size: 12px;"/>
|
<button class="btn" style="font-size: 15px;margin: 5px;" v-on:click="load_data">加载数据</button>
|
</div>
|
</div>
|
</div>
|
|
<!-- 交易参数 -->
|
|
<!-- 交易参数 -->
|
|
<table style="position: relative;margin-top: 40px;">
|
<caption class="table-name">
|
<span>
|
买入预期(可用：¥{{account_available_money}})
|
</span>
|
<button style="position: absolute;right: 5px;top: 16px;font-size: 14px;" class="btn"
|
v-on:click="get_delegated_buy_code_infos">刷新</button>
|
</caption>
|
|
<thead>
|
<tr v-if="delegated_buy_code_infos.length>0">
|
<td>
|
<div class="delegated_codes_info">
|
<div v-for="(item,index) in delegated_buy_code_infos" class="delegate_item">
|
<div>
|
<div>{{item.code_info[0]}}</div>
|
<div>{{item.code_info[1]}}</div>
|
</div>
|
<div>
|
<div style="display: flex;justify-content: space-between;align-items: center;">
|
<div style="color: red;"
|
:style="{'visibility': item.pay_attention?'visible':'hidden' }">***
|
</div>
|
|
<span :style="{'visibility': item.is_near_big_order?'visible':'hidden' }" style="color: green;">△</span>
|
|
|
<div class="layui-progress"
|
style="background-color: #BBB; width: 75%; visibility: hidden;"
|
:id="'progress_'+item.code_info[0]">
|
<div class="layui-progress-bar" lay-percent="{{item.percent+'%'}}">
|
</div>
|
</div>
|
<div>
|
<button class="layui-btn layui-btn-xs layui-btn-danger"
|
v-on:click="cancel_order(item.code_info[0])">撤单</button>
|
<button class="layui-btn layui-btn-xs"
|
v-on:click="view_details(item.code_info[0],true)">查看</button>
|
</div>
|
|
</div>
|
|
|
<div>
|
剩<span
|
:class="{'red':item.left_count <=4}">{{item.left_count}}</span>笔<span>{{item.left_money}}/封单<span
|
:class="{'red':item.buy1_money_warning}">{{item.buy1_money}}</span>【比例：{{item.trade_progress_percent+'%'}}】</span>，已成大单
|
{{item.big_num_count}}笔{{item.big_num_money}}
|
待成前大单{{item.not_deal_big_num_count[0]}}笔{{item.not_deal_big_num_money[0]}}
|
待成后大单{{item.not_deal_big_num_count[1]}}笔{{item.not_deal_big_num_money[1]}}，涨停价：{{item.limit_up_price}}元
|
</div>
|
</div>
|
|
</div>
|
</div>
|
</td>
|
</tr>
|
</thead>
|
|
</table>
|
|
<table style="position: relative;margin-top: 40px;">
|
<caption class="table-name">
|
<span>
|
最近撤单
|
</span>
|
<button style="position: absolute;right: 5px;top: 16px;font-size: 14px;" class="btn"
|
v-on:click="get_latest_cancel_orders">刷新</button>
|
</caption>
|
|
<thead>
|
<tr style="padding: 2px 0px;">
|
<td>代码</td>
|
<td>撤单时间</td>
|
<td>下单时间</td>
|
<td>价格</td>
|
<td>委托量</td>
|
<td>操作</td>
|
</tr>
|
</thead>
|
<tbody style="max-height: 50px;" class="scroll-y">
|
<tr v-for="item in latest_cancel_orders">
|
<td>{{item.securityID}}({{item.securityName}})</td>
|
<td>{{item.cancelTime}}</td>
|
<td>{{item.acceptTime}}</td>
|
<td>{{item.limitPrice}}</td>
|
<td>{{item.volume}}</td>
|
<td><button class="layui-btn layui-btn-xs layui-btn-primary"
|
v-on:click="view_details(item.securityID,false)">查看</button></td>
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
|
<div class="layui-tab layui-tab-card" lay-filter="test-handle">
|
<ul class="layui-tab-title">
|
<li class="layui-this" lay-id="0">交易数据</li>
|
<li lay-id="1">L2数据(买大单：{{big_buy_order_count}}笔)</li>
|
<li lay-id="2">大单卖数据(卖大单：{{big_sell_order_count}}笔)</li>
|
|
</ul>
|
<div class="layui-tab-content">
|
<div class="layui-tab-item layui-show">
|
<div id="trade_data" class="scroll-y">
|
<div v-if="same_reason_codes">
|
<table class="half-width">
|
<caption class="table-name">昨日相同板块代码（{{same_reason_codes.reason}}）</caption>
|
<tbody>
|
<tr>
|
<td style="padding: 0;border: none">
|
<div class="code-table-container">
|
<div v-for="(item,i) in same_reason_codes.data"
|
:style="{'border-left-style': i%3==0?'solid':'none','border-top-style': i<3?'solid':'none'}">
|
<span class="num-style">{{item[1]}}</span>
|
<span class="num-style">{{item[0]}}</span>
|
</div>
|
</div>
|
</td>
|
</tr>
|
</tbody>
|
</table>
|
</div>
|
|
<div class="layui-tab layui-tab-brief">
|
|
<ul class="layui-tab-title">
|
<li class="layui-this">栏板排行</li>
|
<li>交易参数</li>
|
</ul>
|
|
<div class="layui-tab-content">
|
<div class="layui-tab-item" style="max-height: 200px;" class="scroll-y">
|
<div class="scroll-y" style="height: 200px;">
|
|
<table>
|
<thead>
|
<tr>
|
<td>代码</td>
|
<td>名称</td>
|
<td>开板次数</td>
|
<td>操作</td>
|
</tr>
|
|
|
</thead>
|
<tbody>
|
<tr v-for="item in kpl_open_limit_up_count_rank">
|
<td>{{item[0]}}</td>
|
<td>{{item[1]}}</td>
|
<td>{{item[2]}}次({{item[3]}})</td>
|
<td><button class="layui-btn layui-btn-xs layui-btn-primary"
|
v-on:click="view_details(item[0],true)">查看</button><button
|
class="layui-btn layui-btn-xs layui-btn-primary"
|
v-on:click="fordbidden_buy(item[0])">加入黑名单</button></td>
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
</div>
|
</div>
|
<div class="layui-tab-item">
|
<table v-if="trade_data">
|
<tr>
|
<td>是否可以买入</td>
|
<td v-if="trade_data.can_buy_info">
|
|
<span class="bold" v-if="trade_data.can_buy_info[0]">可以买入</span>
|
<span class="bold red"
|
v-else>不可以买入：{{trade_data.can_buy_info[2]}}</span>
|
|
|
</td>
|
<td v-else>
|
<span class="bold">未知</span>
|
</td>
|
</tr>
|
<tr v-if="trade_data.safe_count">
|
<td>安全笔数</td>
|
<td>固定安全笔数<span
|
class="num-style ">{{trade_data.safe_count.base}}</span>笔,衰减后安全笔数<span
|
class="num-style ">{{trade_data.safe_count.now}}</span>笔
|
</td>
|
</tr>
|
<tr v-if="trade_data.m_val">
|
<td>动态M值</td>
|
<td>固定M值<span
|
class="num-style ">{{trade_data.m_val.base}}万</span> 动态M值<span
|
class="num-style ">{{trade_data.m_val.now}}万</span></td>
|
</tr>
|
<tr v-if="trade_data.big_num">
|
<td>买前大单</td>
|
<td>固定买前大单<span
|
class="num-style ">{{trade_data.big_num.base}}</span>笔，衰减后买前大单<span
|
class="num-style ">{{trade_data.big_num.now}}</span>笔
|
</td>
|
</tr>
|
<tr>
|
<td>成交进度</td>
|
<td><span v-if="trade_data.trade_progress">
|
<div v-for="trade_progress in trade_data.trade_progress">
|
<span
|
class="num-style ">{{trade_progress.time}}</span>
|
<span
|
class="num-style ">{{trade_progress.num}}手</span>
|
<span class="num-style ">{{trade_progress.money}}</span>
|
<br>
|
</div>
|
</span>
|
</td>
|
</tr>
|
<tr>
|
<td>量参考日期</td>
|
<td><span v-if="trade_data.volume_refer_date">
|
|
<span class="num-style ">{{trade_data.volume_refer_date}}</span>
|
|
</span>
|
</td>
|
</tr>
|
<tr>
|
<td>辨识度信息</td>
|
<td><span v-if="trade_data.special_info">
|
|
<span class="num-style ">{{trade_data.special_info[1]}}</span>
|
|
</span>
|
</td>
|
</tr>
|
<tr>
|
<td>真实下单位设置</td>
|
<td>
|
<div style="padding: 3px 1px;">
|
<button class="layui-btn layui-btn-xs layui-btn-normal"
|
v-on:click="set_real_place_order_index">点击设置</button>
|
</div>
|
</td>
|
</tr>
|
</table>
|
</div>
|
</div>
|
|
</div>
|
|
|
<div class="layui-tab layui-tab-brief">
|
<ul class="layui-tab-title">
|
<li class="layui-this">今日挂撤记录</li>
|
<li>L2不下单原因</li>
|
|
</ul>
|
<div class="layui-tab-content">
|
<div class="layui-tab-item layui-show">
|
|
<!-- 今日挂撤记录 -->
|
<table v-if="trade_record">
|
|
<thead>
|
<tr>
|
<td>是否炸板：<span v-if="trade_record.open_limit_up"> <span><img
|
src="./images/stop_up.png"> </span>炸板
|
<span
|
class="num-style ">{{trade_record.open_limit_up}}</span></span>
|
<span v-else class="num-style ">未炸板</span>
|
</td>
|
</tr>
|
</thead>
|
|
<tr>
|
<td>
|
<div style="width: 100%;display: flex;justify-content: space-between;flex-wrap: wrap;"
|
class="scroll-y">
|
|
<div class="record-item" style="width: 520px; "
|
v-for="(item,index) in trade_record.records">
|
<div>{{item[0]}}</div>
|
<div>【{{item[1]}}】{{item[2]}} <a href="javascript:void()"
|
style='color:red' v-if="item[3]&&item[3].length>0"
|
@click="show_more_records(item[3])">更多</a></div>
|
</div>
|
|
</div>
|
</td>
|
</tr>
|
|
</table>
|
|
|
|
</div>
|
<div class="layui-tab-item">
|
<table>
|
<tr v-for="item in l2_cant_buy_reasons">
|
<td>{{item[0]}}</td>
|
<td>{{item[1]}}</td>
|
</tr>
|
</table>
|
|
|
</div>
|
</div>
|
</div>
|
|
|
</div>
|
|
|
</div>
|
<div class="layui-tab-item">
|
<div style="position: relative;">
|
<div class="l2-nav">
|
<div>
|
<ul class="ul-colors">
|
<li>
|
<div class="color-single-start"></div><span>信号起始位置</span>
|
</li>
|
<li>
|
<div class="color-single-exec"></div><span>信号执行位置</span>
|
</li>
|
<li>
|
<div class="color-l-front"></div><span>L前</span>
|
</li>
|
<li>
|
<div class="color-l-back"></div><span>L后</span>
|
</li>
|
<li>
|
<div class="color-h"></div><span>H撤</span>
|
</li>
|
<li>
|
<div class="color-real-order"></div><span>真实下单</span>
|
</li>
|
<li>
|
<div class="color-cancel"></div><span>撤单</span>
|
</li>
|
<li>
|
<div class="color-trade-progress"></div><span>成交进度</span>
|
</li>
|
<li>
|
<div class="color-latest-real-order"></div><span>最新真实下单</span>
|
</li>
|
<li>
|
<div class="color-selected"></div><span>选中行</span>
|
</li>
|
|
|
</ul>
|
<div class="l2-tool-container">
|
<div class="column-space"></div>
|
<span style="width: 120px;">{{l2_code_name}}</span>
|
<div class="column-space"></div>
|
|
<button class="btn" v-on:click="refresh_h_cancel_data">H撤</button>
|
<div class="column-space"></div>
|
<button class="btn" v-on:click="refresh_l_cancel_data(0)">L前撤</button>
|
<div class="column-space"></div>
|
<button class="btn" v-on:click="refresh_l_cancel_data(1)">L后撤</button>
|
<div class="column-space"></div>
|
<button class="btn" v-on:click="clear_cancel_mark">清除标记</button>
|
<div class="column-space"></div>
|
<button class="btn" v-on:click="refresh_l2_data">刷新L2</button>
|
<div class="column-space"></div>
|
<button class="btn" v-on:click="refresh_trade_progress">成交进度</button>
|
<div class="column-space"></div>
|
<button class="btn" v-on:click="screen_l2_data">筛选</button>
|
<div class="column-space"></div>
|
<div style="line-height: 20px;margin-top: 5px;"><input type="checkbox" value="1"
|
checked v-on:click="hidden_cancel_check($event)" /> <label>隐藏撤单</label>
|
</div>
|
<div class="column-space"></div>
|
<div style="line-height: 20px;margin-top: 5px;"><input type="checkbox" value="1"
|
checked v-on:click="hidden_sell_check($event)" /> <label>隐藏卖</label>
|
</div>
|
<div class="column-space"></div>
|
<div style="line-height: 20px;margin-top: 5px;"><input type="checkbox" value="1"
|
checked v-on:click="hidden_canceled_check($event)" />
|
<label>隐藏已撤</label>
|
</div>
|
<div style="line-height: 20px;margin-top: 5px;margin-left: 5px;"><input
|
type="checkbox" value="1" checked
|
v-on:click="hidden_little_money_check($event)" /> <label>隐藏小金额</label>
|
</div>
|
<div style="line-height: 20px;margin-top: 5px;margin-left: 5px;"><input
|
type="checkbox" value="1" checked
|
v-on:click="hidden_canceled_big_money_check($event)" />
|
<label>不隐藏已撤大单</label>
|
</div>
|
</div>
|
</div>
|
|
</div>
|
|
|
<div class="l2-content scroll-x scroll-y" style="width: 100%;" :key='l2_min_volume'
|
:key1='l2_max_volume'>
|
<div style="width: 700px;">
|
<table>
|
<thead>
|
<tr>
|
<td style="width: 40px;">序号</td>
|
<td style="width: 80px;">时间</td>
|
<td style="width: 30px;">金额(万)</td>
|
<td style="width: 30px;">价格</td>
|
<td style="width: 45px;">手数</td>
|
<td style="width: 40px;">类型</td>
|
<td style="width: 80px;">撤单/成交时间</td>
|
<td>备注</td>
|
<td>订单号</td>
|
</tr>
|
</thead>
|
<tbody>
|
<!-- !hidden_canceled||(hidden_canceled&&(item[2][8]==null&&item[2][6].indexOf('买撤')<0) -->
|
<tr v-if="need_show(item)" v-for="item in l2_datas.delegates"
|
:style="{'background-color': item[0]>0?'#FFFFCC':'white'}"
|
:class="{'color-trade-progress':trade_progress_index==item[2][0],'order_canceled':item[2][8]!=null&&item[2][8].indexOf('-')>=0,'color-latest-real-order':real_order_indexes.includes(item[2][0]),'color-l-front':l_up_cancel_indexes.includes(item[2][0]),'color-l-back':l_down_cancel_indexes.includes(item[2][0]),'color-h':h_cancel_indexes.includes(item[2][0]),'color-selected':operate_index==item[2][0]}"
|
v-on:click="select_row(item[2][0])">
|
<td :class="[item[1]]">{{item[2][0]}}</td>
|
<td>{{item[2][1]}}</td>
|
<td :class="{'big_num':parseFloat(item[2][3])>=299}">{{item[2][3]}}</td>
|
<td>{{item[2][4]}}</td>
|
<td>{{item[2][5]}}</td>
|
<td>{{item[2][6]}}</td>
|
<td>
|
<span v-if="trade_progress_index == item[2][0]">成交进度:{{trade_progress_percent}}%</span>
|
<span v-else>{{item[2][8]}}</span>
|
|
</td>
|
<td>{{item[2][9]}}</td>
|
<td>{{item[2][10]}}</td>
|
</tr>
|
</tbody>
|
|
|
</table>
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="layui-tab-item">
|
<div style="position: relative;">
|
<div class="l2-content scroll-x scroll-y" style="width: 100%;" :key='l2_min_volume'
|
:key1='l2_max_volume'>
|
<div style="width: 700px;">
|
<table>
|
<thead>
|
<tr>
|
<td style="width: 40px;">序号</td>
|
<td style="width: 80px;">时间</td>
|
<td style="width: 30px;">金额(万)</td>
|
<td style="width: 30px;">价格</td>
|
<td style="width: 45px;">手数</td>
|
<td style="width: 40px;">类型</td>
|
<td style="width: 80px;">撤单/成交时间</td>
|
<td>备注</td>
|
<td>订单号</td>
|
</tr>
|
</thead>
|
<tbody>
|
<!-- !hidden_canceled||(hidden_canceled&&(item[2][8]==null&&item[2][6].indexOf('买撤')<0) -->
|
<tr v-for="item in l2_datas.transactions"
|
:style="{'background-color': item[0]>0?'#FFFFCC':'white'}"
|
:class="{'color-trade-progress':trade_progress_index==item[2][0],'order_canceled':item[2][8]!=null&&item[2][8].indexOf('-')>=0,'color-latest-real-order':real_order_indexes.includes(item[2][0]),'color-l-front':l_up_cancel_indexes.includes(item[2][0]),'color-l-back':l_down_cancel_indexes.includes(item[2][0]),'color-h':h_cancel_indexes.includes(item[2][0]),'color-selected':operate_index==item[2][0]}"
|
v-on:click="select_row(item[2][0])">
|
<td :class="[item[1]]">{{item[2][0]}}</td>
|
<td>{{item[2][1]}}</td>
|
<td :class="{'big_num':parseFloat(item[2][3])>=299}">{{item[2][3]}}</td>
|
<td>{{item[2][4]}}</td>
|
<td>{{item[2][5]}}</td>
|
<td>{{item[2][6]}}</td>
|
<td>
|
{{item[2][8]}}
|
</td>
|
<td>{{item[2][9]}}</td>
|
<td>{{item[2][10]}}</td>
|
</tr>
|
</tbody>
|
|
|
</table>
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
</div>
|
<div id="l2_screen">
|
<table style="width: auto;">
|
<tr>
|
<td>量：</td>
|
<td> <input id="min-volume" /> - <input id="max-volume" /></td>
|
</tr>
|
<tr>
|
<td>索引：</td>
|
<td><textarea id="watch_indexes" style="border: #BBB solid 1px;" placeholder="索引用逗号分隔"></textarea></td>
|
</tr>
|
|
</table>
|
|
<div> <button class="btn" @click="l2_screen_click">确定</button> </div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
|
|
</script>
|
|
</body>
|
</html>
|
