<!DOCTYPE html>
|
<html>
|
<head>
|
<meta charset="utf-8">
|
<title>看盘端</title>
|
<link rel="stylesheet" type="text/css" href="./css/index23-05-04.css?_=1" />
|
<link rel="stylesheet" type="text/css" href="layui/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/qwebchannel.js"></script>
|
<script src="js/http.js"></script>
|
<script src="layui/layui.js"></script>
|
<script src="js/kpl.js"></script>
|
<script src="js/vconsole.min.js"></script>
|
<script src="js/chart.js"></script>
|
<script src="js/chartjs-plugin-datalabels.min.js"></script>
|
<style>
|
|
</style>
|
</head>
|
<body>
|
<div id="body">
|
<div class="top">
|
<span>
|
<h2 class="bold-content" style="margin-left: 18px; font-size: 20px;">{{code_name}}<span><a
|
class="button-blue" style="margin-top: -34px;margin-left: 280px;" href="#"
|
:class="{'btn-invalid':!trade_data.order}" @click="cancel_order">已撤单</a></span><span><a
|
class="button-blue" style="margin-top: -28px;margin-left: 920px;" href="#"
|
@click="refresh">刷新</a></span>
|
</h2>
|
</span>
|
</div>
|
<div class="xgb_info scroll-y" >
|
<div v-if="xgb_limit_up_reasons" style="height: auto;">
|
<p>板块：<span class="label-style" v-for="item in xgb_limit_up_reasons.blocks">{{item}}</span></p>
|
<p v-if="xgb_limit_up_reasons.zylt">自由流通市值：{{xgb_limit_up_reasons.zylt}}</p>
|
|
<table class="xgb_limit_up">
|
<thead>
|
<tr>
|
<td>板块</td>
|
<td>原因</td>
|
<td>成分股</td>
|
</tr>
|
</thead>
|
<tbody>
|
<tr v-for="item in xgb_limit_up_reasons.reasons" >
|
<td><div class="red">{{item[0]}}<div></td>
|
<td>
|
<div >
|
<p>{{item[1]}}</p>
|
</div>
|
</td>
|
<td>
|
<div style="display: flex-block;">
|
<span class="label-style" v-for="item1 in item[2]">{{item1}} </span>
|
</div>
|
|
</td>
|
</tr>
|
</tbody>
|
|
</table>
|
<p>解读：<span>{{xgb_limit_up_reasons.description}}</span></p>
|
|
</div>
|
</div>
|
|
<!-- 文档流 第一块 -->
|
<div>
|
<!-- 右侧板块 -->
|
<div style="display: flex;">
|
|
|
|
<table v-if="kpl_code_info">
|
<caption class="table-name">板块</caption>
|
<thead></thead>
|
<tbody class="buding">
|
<tr>
|
<td><span class="bold">今天</span></td>
|
<td>
|
<span v-if="kpl_code_info.today">
|
<span class="red">【{{kpl_code_info.today[0][0]}}】</span><span
|
v-if="kpl_code_info.today[0][1]">({{kpl_code_info.today[0][1]}})</span> |
|
|
<span v-for="(item,index) in kpl_code_info.today[2]">
|
<span class="num-style">{{item[0]}}</span><span
|
v-if="item[1]">({{item[1]}})</span><span
|
v-if="index!=kpl_code_info.today[2].length-1">、</span>
|
</span>
|
|
</span>
|
<br>
|
二级：
|
<span class="num-style" v-if="kpl_code_info.industry">
|
{{kpl_code_info.industry[0]}}
|
<span
|
v-if="kpl_code_info.industry[1]">({{kpl_code_info.industry[1]}})</span>
|
</span>
|
</td>
|
</tr>
|
<tr>
|
<td style="min-width: 35px;"><span class="bold">历史</span></td>
|
<td>
|
<span v-for="(item,i) in kpl_code_info.code_records">
|
<span class="num-style red">【{{item[0][0]}}】</span> <span
|
v-if="item[0][1]">({{item[0][1]}})</span>|
|
<span v-for="(item1,i1) in item[2]">
|
<span class="num-style">{{item1[0]}}</span><span
|
v-if="item1[1]">({{item1[1]}})</span> <span
|
v-if="i1!=item[2].length-1">、</span>
|
</span>
|
|
<br>
|
</span>
|
|
</td>
|
|
|
</tr>
|
<tr>
|
<td><span class="bold">板块</span></td>
|
<td class="budinggundong">
|
<div class="scroll-y" style="height: 93px;;">
|
<span v-for="(item,i) in kpl_code_info.plate"
|
class="label-style" :class="{'red':item[4]}">{{item[1]}}</span>
|
</div>
|
</td>
|
</tr>
|
|
<tr v-if="yesterday_block_info">
|
<td><span class="bold">昨日涨停原因</span></td>
|
<td>
|
<span class="red">{{yesterday_block_info.reason}}</span>
|
<span :class="{'red': yesterday_block_info.reason_rate>0,'green':yesterday_block_info.reason_rate<0,'white':yesterday_block_info.reason_rate==0}">（{{yesterday_block_info.reason_rate}}%）</span>
|
</td>
|
</tr>
|
|
<tr v-if="yesterday_block_info">
|
<td><span class="bold">同原因昨日涨停</span></td>
|
<td class="budinggundong">
|
<div style="height: 80px;" class="scroll-y">
|
<span v-for="(item,i) in yesterday_block_info.data.yesterday"
|
class="label-style" >{{item[1]}}({{item[0]}})(<span :class="{'red': item[2]>0,'green':item[2]<0,'white':item[2]==0}">{{item[2]}}%</span>)
|
</span>
|
</div>
|
</td>
|
</tr>
|
|
<tr v-if="yesterday_block_info">
|
<td><span class="bold">同原因今日涨停</span></td>
|
<td class="budinggundong">
|
<div style="height: 80px;" class="scroll-y">
|
<span v-for="(item,i) in yesterday_block_info.data.current"
|
class="label-style">{{item[1]}}({{item[0]}})</span>
|
</div>
|
</td>
|
</tr>
|
|
</tbody>
|
<tfoot></tfoot>
|
</table>
|
|
|
<div>
|
<table style="width: 520px;">
|
<caption class="table-name">
|
<div class="child-title" :class="{'child-title-active':jingxuan_data_type==0}"
|
@click="get_jingxuan_data(0)">精选流入</div>
|
<div class="child-title" :class="{'child-title-active':jingxuan_data_type==1}"
|
@click="get_jingxuan_data(1)">精选流出</div>
|
|
<div class="child-title" :class="{'child-title-active':industry_data_type==0}"
|
@click="get_industry_data(0)">行业流入</div>
|
<div class="child-title" :class="{'child-title-active':industry_data_type==1}"
|
@click="get_industry_data(1)">行业流出</div>
|
|
</caption>
|
<thead>
|
</thead>
|
<tbody>
|
<tr style="padding:0px;">
|
<td style="padding:0px;">
|
<div class="market-container">
|
|
<div class="item" v-for="(item,index) in jingxuan_datas">
|
<span :class="{'green':item[4]==1}">{{item[1]}}</span>
|
<span :class="{'green':item[4]==1}">{{money_desc(item[3])}}</span>
|
<span class='delete'
|
:style="{'visibility':item[4]==1?'hidden':'visible' }"><img
|
src="images/delete.png"
|
v-on:click="forbidden_plate(item[1],1)"></span>
|
</div>
|
</div>
|
|
</td>
|
</tr>
|
|
</tbody>
|
</table>
|
|
<table style="width: 520px;height: 180px;">
|
<caption class="table-name">
|
市场情绪
|
</caption>
|
<thead>
|
</thead>
|
<tbody>
|
<tr style="padding:0px;">
|
<td style="padding:0px;">
|
<canvas id="market_feeling_chart" width="100%" height="25"></canvas>
|
<div style="padding-left: 10px;">
|
<p> <span class="red"><span class="red">涨停：【{{market_feeling_info.SJZT}}】家</span> <span class="green">跌停：【{{market_feeling_info.SJDT}}】家</span> </p>
|
<p> <span class="red">涨：【{{market_feeling_info.SZJS}}】家</span> <span class="green">跌：【{{market_feeling_info.XDJS}}】家</span> </p>
|
|
</div>
|
</td>
|
</tr>
|
</tbody>
|
</table>
|
</div>
|
</div>
|
</div>
|
|
<!-- 文档流 第二块 -->
|
<!-- 首板梯队 -->
|
<div>
|
<!-- 待买池 -->
|
<div class="table-name plate-container scroll-y"
|
style="float: left;width: 100%;text-align: center; background: #000;height:150px">
|
<span v-for="(item,i) in first_info.limit_up_reason_statistic"
|
v-on:click="show_want_codes(item[0])">
|
<span class="num-style red" :class="{'orange': kpl_limit_up_reason == item[0]}">{{item[0]}}({{item[1]}}&{{item[2]}})</span>
|
</span>
|
</div>
|
<!-- 左侧 -->
|
<div style="float: left;width: 27.5%;margin-right: 0.4%;" class="scroll-y">
|
|
<table style="width: 100%; background: #cecece;" class="shoubanzuogundong">
|
<thead>
|
<tr style="height: 40px;padding-right: 0;">
|
<td style="padding-right: 0;">
|
<div style="display: flex;justify-content: space-between;">
|
<input type="text" placeholder="请输入名称搜索" style="width:70%"
|
id="limit_up_search_key" />
|
<button class="layui-btn" v-on:click="limit_up_search">搜索</button>
|
</div>
|
|
</td>
|
</tr>
|
</thead>
|
<tbody>
|
<tr v-for="(item,index) in first_info.limit_up_codes"
|
@click="select_code_level_1($event,index)"
|
:class="{'active':choose_code.first==item[0]}"
|
v-if="item[0].indexOf(limit_up_search_key)>=0">
|
<td>
|
<div style="display:flex;justify-content:space-between;align-items:center">
|
|
<div>
|
<span v-if="item[2]==1"><img src="./images/limit_up.png"></span>
|
<span v-else-if="item[2]==2">(炸板)</span>
|
<span class="num-style"
|
:class="{'green': item[0].indexOf('00')!=0&&item[0].indexOf('60')!=0 }">{{item[1]}}</span>
|
|
<span class="num-card-red" v-if="item[3]">{{item[3]}}</span><span
|
class="num-card-bule" v-if="item[4]">{{item[4]}}</span><span
|
class="score-card-color yellow" v-if="item[5]">{{item[5]}}</span>
|
</div>
|
<div>
|
<span class="num-style red">{{item[6]}}</span>
|
</div>
|
|
|
</div>
|
<img class="delete" src="./images/delete.png" alt=""
|
style="float: right;margin-top: 12px;margin-right: -8px;"
|
@click="del_code_level_1(index)">
|
<div style="display:flex;justify-content:space-between;align-items:center">
|
<div>
|
<span class="bule">{{item[7]}}</span>(<span
|
class="num-style red">{{item[8]}}</span>)
|
<!-- 净流入 -->
|
<span v-if="item[11]">
|
& <span class="num-style red">{{item[11]}}</span>
|
</span>
|
<span v-if="item[10]">&{{item[10]}}</span>
|
</div>
|
|
|
</div>
|
<div>代码：<span class="num-style">{{item[0]}}</span> 自由市值：<span
|
class="num-style">{{item[9]}}</span></div>
|
<!-- 交易信息 -->
|
<div class="num-style" style="font-size:12px;overflow: hidden;width:260px;"
|
v-html="item[12]"></div>
|
|
</td>
|
</tr>
|
|
|
</tbody>
|
<tfoot></tfoot>
|
</table>
|
</div>
|
|
<!-- 右侧 -->
|
|
<div style="float: right; width:72%;" v-if="choose_code_info">
|
<!-- 右侧固定位 -->
|
<div>
|
<table
|
style="float: right; width:100%; background: #EEE;height: 130px; max-height: 130px;min-height: 130px; overflow: hidden;">
|
<thead></thead>
|
<tbody>
|
<tr style="display: none;">
|
<td style="width: 10%;"><span class="bold">强度</span></td>
|
<td colspan="3">
|
<div class="scroll-x" style="width: 670px;">
|
<div style="display: inline-block; margin-right: 16px;"
|
v-for="(item,index) in choose_code_info.plat_strength"><span
|
class="num-style">{{item[1]}}</span><br><span
|
class="num-style">{{item[2]}}</span>
|
</div>
|
</div>
|
</td>
|
</tr>
|
|
|
|
<tr>
|
<td><span class="bold">今天</span></td>
|
<td><span v-if="choose_code_info.today">
|
<span class="red">【{{choose_code_info.today[0]}}】</span>| <span
|
class="num-style">{{choose_code_info.today[2]}}</span>
|
|
二级：
|
<span class="num-style">
|
{{choose_code_info.industry}}
|
</span>
|
|
</td>
|
</tr>
|
|
|
|
|
<tr>
|
<td><span class="bold">历史</span></td>
|
<td>
|
|
|
<span v-for="(item1,i1) in choose_code_info.code_records">
|
<span class="num-style red">【{{item1[0]}}】</span>| <span
|
class="num-style">{{item1[2]}}</span><span
|
class="num-style">({{item1[1]}})</span>
|
|
</span>
|
</td>
|
|
|
</tr>
|
<tr>
|
<td><span class="bold">板块</span></td>
|
<td>
|
<div class="scroll-x" style="width: 670px;">
|
<div v-for="(item,i) in choose_code_info.plate" class="item">
|
<span class="num-style line">{{item[1]}}</span>
|
<span class="num-style line">{{item[2]}}%</span>
|
</div>
|
|
</div>
|
</td>
|
</tr>
|
</tbody>
|
<tfoot></tfoot>
|
</table>
|
<div style="float: right; width:100%;background: #cecece;height: 10px;"></div>
|
</div>
|
<!-- 右侧滚动表格 -->
|
<div class="outer-container scroll-y" style="float: right;">
|
|
<div class="daixuan" v-for="(item,i) in choose_code_info.code_list_info"
|
@click="select_code_level_2($event,i)">
|
<!-- 一条信息 -->
|
<table :class="{'active':choose_code.second==item.code_info[0]}">
|
<thead></thead>
|
<tbody>
|
<div>
|
<tr>
|
<td style="width: 10%;"><span class="bold"
|
:class="{'purple':item.code_info[11]>8}">{{item.code_info[11]}}%</span>
|
</td>
|
<td colspan="3">
|
|
<div>
|
<span v-if="item.code_info[2]==1"><img
|
src="./images/limit_up.png"></span>
|
<span v-if="item.code_info[2]==2"><img
|
src="./images/stop_up.png"></span>
|
<span class="num-style bold"
|
:class="{'green': item.code_info[0].indexOf('00')!=0&&item.code_info[0].indexOf('60')!=0 }">{{item.code_info[1]}}</span><span
|
class="num-card-red"
|
v-if="item.code_info[3]">{{item.code_info[3]}}</span><span
|
class="num-card-bule"
|
v-if="item.code_info[4]">{{item.code_info[4]}}</span>
|
<span v-if="item.code_info[5]"
|
class="score-card-color yellow">{{item.code_info[5]}}</span><span
|
class="num-card-black"
|
v-if="item.code_info[13]">{{item.code_info[13]}}</span>
|
<span class="num-card-pink"
|
v-if="item.code_info[14]">{{item.code_info[14]}}</span>
|
|
</div>
|
<img src="./images/delete.png" alt=""
|
style="float: right;margin-right: -2px;"
|
@click="del_code_level_2(i)">
|
<div><span
|
v-if="item.code_info[6]&& item.code_info[6]!='00:00:00'">涨停时间：<span
|
class="num-style red">{{item.code_info[6]}} </span></span>代码：<span
|
class="num-style">{{item.code_info[0]}}</span> 现价：<span
|
class="num-style red">{{item.code_info[12]}}元</span> 自由市值：<span
|
class="num-style red">{{item.code_info[9]}}</span></div>
|
<div>主力净值：<span
|
class="num-style">{{item.code_info[15]}}</span> 300W：<span
|
class="num-style">{{item.code_info[16]}}</span> 第一季度机构增仓：<span
|
class="num-style">{{item.code_info[17]}}</span></div>
|
</td>
|
|
</tr>
|
<tr
|
v-if="item.code_info[0].indexOf('00')==0||item.code_info[0].indexOf('60')==0">
|
<td><span class="bold">今天</span></td>
|
<td>
|
<span v-if="item.today">
|
<span class="red">【{{item.today[0]}}】</span>| <span
|
class="num-style">{{item.today[2]}}</span>
|
|
</span>
|
|
二级：
|
<span class="num-style">
|
{{item.industry}}
|
</span>
|
|
</td>
|
|
|
</tr>
|
<tr
|
v-if="item.code_info[0].indexOf('00')==0||item.code_info[0].indexOf('60')==0">
|
<td><span class="bold">历史</span></td>
|
<td style="max-width: 650px;">
|
<div style="display: flex;flex-wrap: wrap;border-width: 1px;">
|
<span v-for="(item1,i1) in item.code_records">
|
<span class="num-style red">【{{item1[0][0]}}】</span>|
|
<span v-for="(item2,i2) in item1[2]">
|
<span>{{item2[0]}}</span><span
|
v-if="i2!=item1[2].length -1">、</span>
|
</span>
|
|
<span class="num-style">({{item1[1]}})</span>
|
|
</span>
|
</div>
|
</td>
|
|
|
</tr>
|
<tr
|
v-if="item.code_info[0].indexOf('00')==0||item.code_info[0].indexOf('60')==0">
|
<td><span class="bold">板块</span></td>
|
<td>
|
<div class="scroll-x" style="width: 650px;">
|
<div v-for="(item1,i1) in item.plate" class="item">
|
<span class="num-style line"
|
style="display: block;">{{item1[1]}}</span>
|
<span class="num-style line"
|
style="display: block;">{{item1[2]}}%</span>
|
</div>
|
|
</div>
|
</td>
|
|
|
</tr>
|
</div>
|
</tbody>
|
<tfoot></tfoot>
|
</table>
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
<div style="position: fixed;bottom: 10px;right: 10px;display: none;">
|
<div style="display: flex;">
|
<span id="" class="button-normal" style="display: inline-block;"
|
@click="do_action_for_code(0)">加入黑名单
|
</span>
|
<span id="" class="button-normal" style="display: inline-block;float: right;"
|
@click="do_action_for_code(1)">移出黑名单
|
</span>
|
|
<span id="" class="button-normal" style="display: inline-block;" @click="do_action_for_code(2)">加入自选
|
</span>
|
<span id="" class="button-normal" style="display: inline-block;float: right;"
|
@click="do_action_for_code(3)">移出自选
|
</span>
|
|
<span id="" class="button-normal" style="display: inline-block;"
|
@click="do_action_for_code(4)">加入想买单
|
</span>
|
<span id="" class="button-normal" style="display: inline-block;float: right;"
|
@click="do_action_for_code(5)">移出想买单
|
</span>
|
<span id="" class="button-normal" style="display: inline-block;"
|
@click="do_action_for_code(6)">加入暂不买
|
</span>
|
<span id="" class="button-normal" style="display: inline-block;float: right;"
|
@click="do_action_for_code(7)">移出暂不买
|
</span>
|
</div>
|
|
</div>
|
|
<!-- 弹出框 -->
|
<div id="want_code_dialog" style="display: none;">
|
<div v-if="want_codes" class="want_code_content"
|
style="display: flex;width: 676px;justify-content: space-between;">
|
<div v-for="(item,i) in want_codes" class="item"
|
style="display: flex;width: 335px;margin-bottom: 15px;" v-if="item[8]==1">
|
|
<div><img :style="{'visibility':item[3]==1?'visiable':'hidden'}" style="margin-right:5px;"
|
src="./images/stop_up.png"><span
|
:class="{'red': item[5],'green': item[0].indexOf('00')!=0&&item[0].indexOf('60')!=0 }">{{item[1]}}({{item[0]}})-{{item[2]}}-{{item[6]}}-{{item[7]}}
|
</span><span v-if="item[3]==1">(炸)</span> <span class="red" v-if="item[4]">*</span> </div>
|
<img v-if="item[2]==1" class="delete" src="./images/delete.png"
|
@click="delete_from_want_codes(i)">
|
</div>
|
<div style="width: 100%; height: 1px;background-color: #000;margin-bottom: 5px;"></div>
|
<div v-for="(item,i) in want_codes" class="item"
|
style="display: flex;width: 335px;margin-bottom: 15px;" v-if="item[8]==0">
|
|
<div><img :style="{'visibility':item[3]==1?'visiable':'hidden'}" style="margin-right:5px;"
|
src="./images/stop_up.png"><span
|
:class="{'red': item[5]}">{{item[1]}}({{item[0]}})-{{item[2]}}-{{item[6]}}-{{item[7]}}
|
</span><span v-if="item[3]==1">(炸)</span> <span class="red" v-if="item[4]">*</span> </div>
|
<img v-if="item[2]==1" class="delete" src="./images/delete.png"
|
@click="delete_from_want_codes(i)">
|
</div>
|
</div>
|
|
</div>
|
</div>
|
<script src="js/page.js?_=1"></script>
|
|
</body>
|
</html>
|
