| | |
| | | </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> |
| | | <div class="nav" style="background-color: white;"> |
| | | <div :class="{'active': data_type==0 }" v-on:click="change_data_type(0)">交易数据</div> |
| | | <div :class="{'active': data_type==1 }" v-on:click="change_data_type(1)">L2数据</div> |
| | | </div> |
| | | </div> |
| | | |
| | | <div> |
| | | <div style="margin-top: 70px;" class="scroll-y"> |
| | | |
| | | <!-- H撤单 --> |
| | | <table v-if="trade_data&&trade_data.h_cancel"> |
| | | <caption class="table-name">H撤 <span v-if="trade_data.h_cancel.computed_info">(已撤{{parseFloat(trade_data.h_cancel.computed_info[1])*100}}%/目标{{parseFloat(trade_data.h_cancel.computed_info[0])*100}}%)</span></caption> |
| | | |
| | | <tbody> |
| | | <tr><td style="padding: 0;"> |
| | | <div > |
| | | <table> |
| | | <thead> |
| | | <tr><td>时间</td><td>手数</td><td>金额</td><td>是否撤单</td></tr> |
| | | </thead> |
| | | <tbody> |
| | | <tr v-for="(item,i) in trade_data.h_cancel.datas" > |
| | | <td><span class="red"> {{item[0]}}</span></td> |
| | | <td><span class="red"> {{item[1]}}</span></td> |
| | | <td><span class="red"> {{item[2]}}</span></td> |
| | | <td><span class="red" v-if="item[3]"> 已撤</span></td> |
| | | </tr> |
| | | </tbody> |
| | | |
| | | </table> |
| | | |
| | | </div> |
| | | </td></tr> |
| | | |
| | | </tbody> |
| | | </table> |
| | | |
| | | <div id="trade_data" :style="{'visibility':data_type==0?'visible':'hidden'}"> |
| | | <div v-if="same_reason_codes"> |
| | | |
| | | <table class="half-width"> |
| | | <caption class="table-name">昨日相同板块代码({{same_reason_codes.reason}})</caption> |
| | | <tbody> |
| | |
| | | </div> |
| | | |
| | | |
| | | |
| | | |
| | | <!-- 买前评分 --> |
| | | |
| | | |
| | | |
| | | <div> |
| | | <span> |
| | | |
| | | <table class="half-width"> |
| | | <caption class="table-name">主动买入</caption> |
| | | <tbody> |
| | | <tr> |
| | | <td style="padding: 0;border: none"> |
| | | <div class="code-table-container"> |
| | | <div v-for="(item,i) in initiative_buy_codes" |
| | | :style="{'border-left-style': i%3==0?'solid':'none','border-top-style': i<3?'solid':'none'}"> |
| | | |
| | | <span v-if="item.limit_up"><img src="./images/limit_up.png"></span> |
| | | <span v-else-if="item.open_limit_up"><img |
| | | src="./images/stop_up.png"></span> |
| | | <span v-else> |
| | | <img src="./images/stop_up.png" style="visibility: hidden;"> |
| | | </span> |
| | | |
| | | <span class="num-style">{{item.name}}</span> |
| | | <span class="num-style">{{item.code}}</span> |
| | | <span class="score-card-color yellow">{{item.score}}</span> |
| | | </div> |
| | | </div> |
| | | </td> |
| | | |
| | | </tr> |
| | | |
| | | </tbody> |
| | | </table> |
| | | |
| | | </span> |
| | | <span> |
| | | |
| | | <table class="half-width"> |
| | | <caption class="table-name">被动买入</caption> |
| | | <tbody> |
| | | <tr> |
| | | <td style="padding: 0;border: none"> |
| | | <div class="code-table-container"> |
| | | <div v-for="(item,i) in passive_buy_codes" |
| | | :style="{'border-left-style': i%3==0?'solid':'none','border-top-style': i<3?'solid':'none'}"> |
| | | <span v-if="item.limit_up"><img src="./images/limit_up.png"></span> |
| | | <span v-else-if="item.open_limit_up"><img |
| | | src="./images/stop_up.png"></span> |
| | | <span v-else> |
| | | <img src="./images/stop_up.png" style="visibility: hidden;"> |
| | | </span> |
| | | <span class="num-style">{{item.name}}</span> |
| | | <span class="num-style">{{item.code}}</span> |
| | | <span class="score-card-color yellow">{{item.score}}</span> |
| | | </div> |
| | | </div> |
| | | </td> |
| | | |
| | | </tr> |
| | | </tbody> |
| | | <tfoot></tfoot> |
| | | </table> |
| | | </span> |
| | | </div> |
| | | |
| | | |
| | | |
| | | |
| | | <!-- 交易参数 --> |
| | | <table v-if="trade_data"> |
| | | <caption class="table-name">交易参数</caption> |
| | | <tr> |
| | | <td>买入意愿</td> |
| | | <td> |
| | | |
| | | <span class="bold yellow" |
| | | :class="{'yellow':trade_data.star.count>0}">{{trade_data.star.desc}}</span> |
| | | |
| | | <img v-for="(item,i) in trade_data.star.count" src="./images/star.png" / |
| | | style="margin-left: 3px;"></span> |
| | | </td> |
| | | </tr> |
| | | <tr> |
| | | <td>是否可以买入</td> |
| | | <td v-if="trade_data.can_buy_info"> |
| | |
| | | <span class="bold" >未知</span> |
| | | </td> |
| | | </tr> |
| | | <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> |
| | | <tr v-if="trade_data.m_val"> |
| | | <td>动态M值</td> |
| | | <td>固定M值<span class="num-style ">{{trade_data.m_val.base}}万</span> 动态M值<span |
| | | <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> |
| | | <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>笔 |
| | |
| | | <tr> |
| | | <td>成交进度</td> |
| | | <td><span v-if="trade_data.trade_progress"> |
| | | <span class="num-style ">{{trade_data.trade_progress.time}}</span> |
| | | <span class="num-style ">{{trade_data.trade_progress.num}}手</span> |
| | | <span class="num-style ">{{trade_data.trade_progress.money}}万</span> |
| | | <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.buy_single"> |
| | | <span class="num-style ">{{trade_data.buy_single.time}}</span> |
| | | <span class="num-style ">{{trade_data.buy_single.num}}手</span> |
| | | <span class="num-style ">{{trade_data.buy_single.money}}万</span> |
| | | </span> |
| | | </td> |
| | | </tr> |
| | | <tr> |
| | | <td>买入执行位</td> |
| | | <td> |
| | | <span v-if="trade_data.buy_exec"> |
| | | <span class="num-style ">{{trade_data.buy_exec.time}}</span> |
| | | <span class="num-style ">{{trade_data.buy_exec.num}}手</span> |
| | | <span class="num-style ">{{trade_data.buy_exec.money}}万</span> |
| | | </span> |
| | | |
| | | <span v-else class="num-style red bold">未下单</span> |
| | | </td> |
| | | </tr> |
| | | </table> |
| | |
| | | |
| | | <tr> |
| | | <td> |
| | | <div style="width: 100%;display: flex;justify-content: space-between;flex-wrap: wrap;"> |
| | | <div style="width: 50%;" v-for="(item,index) in trade_record.records"> |
| | | <span v-if="item.type==1">第{{item.index}}次下单:<span class="num-style ">{{item.time}}</span> <span class="score-card-color yellow">{{item.score}}</span></span> |
| | | <span v-else> 撤单:<span class="num-style ">{{item.time}}</span> {{item.desc}} </span> |
| | | <div style="width: 100%;display: flex;justify-content: space-between;flex-wrap: wrap;" |
| | | class="scroll-y"> |
| | | <div style="width: 100%;" v-for="(item,index) in trade_record.records"> |
| | | <span>{{item[0]}} 【{{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></span> |
| | | </div> |
| | | |
| | | </div> |
| | |
| | | </table> |
| | | |
| | | </div> |
| | | <div id="l2" :style="{'visibility':data_type==1?'visible':'hidden'}"> |
| | | <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> |
| | | <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" |
| | | 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" |
| | | v-on:click="hidden_little_money_check($event)" /> <label>隐藏小金额</label> </div> |
| | | </div> |
| | | </div> |
| | | |
| | | </div> |
| | | |
| | | |
| | | <div class="l2-content scroll-x"> |
| | | <div style="width: 700px;"> |
| | | <table style="width: 100%;"> |
| | | <thead> |
| | | <tr> |
| | | <td style="width: 40px;">序号</td> |
| | | <td style="width: 80px;">时间</td> |
| | | <td style="width: 30px;">金额(万)</td> |
| | | <td>价格</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" |
| | | :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':item[2][0]==latest_real_order_index,'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> |
| | | <script> |
| | | |
| | |
| | | body { |
| | | max-width: 520px; |
| | | font-size: 13px; |
| | | color: #FFFFFF; |
| | | background: #000000; |
| | | color: #000000; |
| | | background: #FFFFFF; |
| | | font-family: Microsfot YaHei,微软雅黑; |
| | | } |
| | | |
| | |
| | | /* padding-left: 15px; */ |
| | | line-height: 40px; |
| | | font-size: 20px; |
| | | background: #35353b; |
| | | background: #EEEEEE; |
| | | } |
| | | |
| | | .table-name { |
| | |
| | | margin-top: 12px; |
| | | font-size: 16px; |
| | | font-weight: 600; |
| | | background: #200404; |
| | | background: #EEEEEE; |
| | | /* border: 1px solid #191921; */ |
| | | } |
| | | |
| | |
| | | margin-top: 12px; |
| | | font-size: 16px; |
| | | font-weight: 600; |
| | | background: #200404; |
| | | background: #EEEEEE; |
| | | /* border: 1px solid #191921; */ |
| | | } |
| | | |
| | |
| | | } |
| | | |
| | | table tr td { |
| | | |
| | | font-size: 12px; |
| | | padding: 0px 8px; |
| | | padding: 0px 0px 0px 2px; |
| | | } |
| | | |
| | | table { |
| | |
| | | } |
| | | |
| | | table tr:nth-child(odd) { |
| | | background: #000; |
| | | background: #EEE; |
| | | } |
| | | |
| | | table tr:nth-child(even) { |
| | | background: #000; |
| | | background: #EEE; |
| | | } |
| | | |
| | | table tr:hover { |
| | | background: #222222; |
| | | background: #DDD; |
| | | } |
| | | |
| | | .td-max { |
| | |
| | | line-height: 22px; |
| | | font-size: 12px; |
| | | font-weight: 400; |
| | | background: #2b2b2b; |
| | | background: #DDD; |
| | | border-radius: 5px; |
| | | text-align: center; |
| | | } |
| | |
| | | white-space: nowrap; |
| | | outline: none; |
| | | } |
| | | |
| | | .nav{ |
| | | display: flex; |
| | | margin-left: 2px; |
| | | } |
| | | .nav div{ |
| | | width: 100px; |
| | | text-align: center; |
| | | padding: 5px 10px; |
| | | background-color: #999999; |
| | | border-radius:10px 10px 0 0; |
| | | color: white; |
| | | cursor: pointer; |
| | | margin-right: 5px; |
| | | } |
| | | |
| | | .nav .active{ |
| | | background-color: #009688; |
| | | } |
| | | |
| | | .btn{ |
| | | border-radius:5px; |
| | | background-color: #2059E5; |
| | | padding: 3px 5px; |
| | | color: white; |
| | | } |
| | | td, th { |
| | | border: 1px solid gray; /* 设置边框样式为实线,颜色为黑色 */ |
| | | } |
| | | |
| | | .color-single-start{ |
| | | background-color: #85CAFF; |
| | | } |
| | | |
| | | .color-single-exec{ |
| | | background-color: #159EEC; |
| | | } |
| | | |
| | | .color-l-front{ |
| | | background-color: #FFC606 !important; |
| | | } |
| | | |
| | | .color-l-back{ |
| | | background-color: #FF8020 !important; |
| | | } |
| | | |
| | | .color-h{ |
| | | background-color: #6AFEC1 !important; |
| | | } |
| | | |
| | | .color-real-order{ |
| | | background-color: #FF2A07; |
| | | } |
| | | |
| | | .color-cancel{ |
| | | background-color: #00FF00; |
| | | } |
| | | .color-trade-progress{ |
| | | background-color: #FF2A07 !important; |
| | | } |
| | | |
| | | .color-latest-real-order{ |
| | | background-color: #CC4EE8 !important; |
| | | } |
| | | |
| | | .color-selected{ |
| | | background-color: #2059E5 !important; |
| | | } |
| | | |
| | | .ul-colors{ |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | } |
| | | |
| | | .ul-colors li{ |
| | | align-items: center; |
| | | display: flex; |
| | | margin-right: 10px; |
| | | } |
| | | |
| | | .ul-colors li span{ |
| | | font-size: 12px; |
| | | margin-left: 2px; |
| | | } |
| | | |
| | | .ul-colors li div{ |
| | | width: 20px; |
| | | height: 12px; |
| | | } |
| | | |
| | | .l2-nav{ |
| | | display: flex; |
| | | align-items: center; |
| | | position: fixed; |
| | | top: 67px; |
| | | background-color: white; |
| | | height: 120px; |
| | | z-index: 100; |
| | | } |
| | | .l2-content{ |
| | | position: absolute; |
| | | top: 190px; |
| | | z-index: -1; |
| | | } |
| | | |
| | | /*大单*/ |
| | | .big_num{ |
| | | color: #CE0E5F; |
| | | font-weight: bold; |
| | | } |
| | | |
| | | .order_canceled{ |
| | | color: #888; |
| | | } |
| | | |
| | | .column-space{ |
| | | width: 10px; |
| | | } |
| | | |
| | | .l2-tool-container{ |
| | | bottom: 0px; |
| | | line-height: 30px; |
| | | justify-content: right; |
| | | text-align: right; |
| | | width: 100%; |
| | | right:0px; |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | z-index: 1000; |
| | | background-color: white; |
| | | padding-top: 10px; |
| | | padding-bottom: 10px; |
| | | box-sizing: content-box; |
| | | padding-left: 10px; |
| | | } |
| | | |
| | | .l2-tool-container *{ |
| | | margin-bottom: 5px; |
| | | } |
| | | .btn-operate{ |
| | | position: absolute; |
| | | z-index: 10; |
| | | top:0; |
| | | left:0; |
| | | padding-left: 2px; |
| | | padding-right: 2px; |
| | | background-color: green; |
| | | color: white; |
| | | margin-top: -8px; |
| | | } |
| | | |
| | | |
| | |
| | | <!-- 首板梯队 --> |
| | | <div> |
| | | <!-- 待买池 --> |
| | | |
| | | |
| | | |
| | | <div class="table-name plate-container" |
| | | style="float: left;width: 100%;text-align: center; background: #000;height:90px"> |
| | | 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])"> |
| | |
| | | <div v-if="want_codes" class="want_code_content" style="display: flex;width: 540px;justify-content: space-between;"> |
| | | <div v-for="(item,i) in want_codes" class="item" style="display: flex;width: 220px;margin-bottom: 15px;"> |
| | | |
| | | <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]}} </span><span class="red" v-if="item[4]">*</span> </div> |
| | | <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]}} </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> |
| | |
| | | return false; |
| | | } |
| | | } |
| | | // 定时拉取H撤数据 |
| | | setInterval(function() { |
| | | if (app.code != '000000' && app.trade_data) { |
| | | if (is_trade_time()) { |
| | | http_util.get_h_cancel_data(app.code, function(res) { |
| | | res = JSON.parse(res); |
| | | console.log("结果:", res) |
| | | if (res.code == 0) { |
| | | app.$set(app.trade_data, 'h_cancel', res.data) |
| | | } |
| | | }); |
| | | } |
| | | } |
| | | }, 3000) |
| | | |
| | | new VConsole(); |
| | | app = new Vue({ |
| | |
| | | open_limit_up: "", |
| | | records: [] |
| | | }, |
| | | same_reason_codes: null |
| | | same_reason_codes: null, |
| | | initiative_buy_codes: null, |
| | | passive_buy_codes: null, |
| | | data_type: 0, |
| | | trade_progress_index: -1, |
| | | latest_real_order_index: -1, |
| | | hidden_canceled: false, |
| | | //隐藏撤单 |
| | | hidden_cancel:true, |
| | | hidden_little_money:false, |
| | | l2_datas: [], |
| | | l2_colors_class: ["color-single-start", "color-single-exec", "color-cancel", |
| | | "color-real-order" |
| | | ], |
| | | l_up_cancel_indexes: [], |
| | | l_down_cancel_indexes: [], |
| | | h_cancel_indexes: [], |
| | | buy_single_indexes: [], |
| | | l2_code_name: '', |
| | | operate_index: -1 |
| | | }, |
| | | methods: { |
| | | change_data_type: function(type) { |
| | | if (app.data_type == type) { |
| | | return; |
| | | } |
| | | app.data_type = type; |
| | | window.scrollTo(0,0); |
| | | }, |
| | | refresh_trade_progress: function() { |
| | | if (app.code == "000000") { |
| | | alert("没有获取到代码") |
| | | return; |
| | | } |
| | | http_util.get_trade_progress(app.code, function(res) { |
| | | res = JSON.parse(res); |
| | | if (res.code == 0) { |
| | | console.log("成交进度", res.data); |
| | | if (!res.data.is_default) { |
| | | app.trade_progress_index = res.data.trade_progress; |
| | | } |
| | | } |
| | | }); |
| | | }, |
| | | refresh_l_cancel_data: function(type_) { |
| | | // 刷新L撤 |
| | | if (app.code == "000000") { |
| | | alert("没有获取到代码") |
| | | return; |
| | | } |
| | | http_util.get_l2_l_cancel_datas(app.code, app.operate_index, function(res) { |
| | | console.log("L撤结果",res); |
| | | res = JSON.parse(res); |
| | | if (res.code == 0) { |
| | | if (type_ == 0) { |
| | | app.l_up_cancel_indexes = res.data.up; |
| | | } else { |
| | | app.l_down_cancel_indexes = res.data.down; |
| | | } |
| | | } |
| | | }); |
| | | }, |
| | | refresh_h_cancel_data: function() { |
| | | // 刷新h撤 |
| | | if (app.code == "000000") { |
| | | alert("没有获取到代码") |
| | | return; |
| | | } |
| | | http_util.get_l2_h_cancel_datas(app.code, app.operate_index, function(res) { |
| | | res = JSON.parse(res); |
| | | if (res.code == 0) { |
| | | app.h_cancel_indexes = res.data; |
| | | } |
| | | }); |
| | | }, |
| | | refresh_l2_data: function() { |
| | | if (app.code == "000000") { |
| | | alert("没有获取到代码") |
| | | return; |
| | | } |
| | | http_util.get_l2_datas(app.code, function(res) { |
| | | console.log("获取到数据:",res) |
| | | res = JSON.parse(res); |
| | | if (res.code == 0) { |
| | | var real_order_index = -1; |
| | | var buy_singles = []; |
| | | res.data.forEach(function(e) { |
| | | if (e[1] != null) { |
| | | if (e[1][0] == 3) { |
| | | //真实下单位置 |
| | | real_order_index = e[2][0]; |
| | | } else if (e[1][0] == 0) { |
| | | // 信号位置 |
| | | buy_singles.push(e[2][0]) |
| | | } |
| | | e[1] = app.l2_colors_class[e[1][0]] |
| | | } else { |
| | | e[1] = ''; |
| | | } |
| | | e[2][3] = e[2][3].slice(0, e[2][3].length - 1) |
| | | }); |
| | | console.log("最近真实下单位置:", real_order_index); |
| | | app.latest_real_order_index = real_order_index; |
| | | app.l2_datas = res.data; |
| | | app.l2_code_name = app.code_name.slice(0, app.code_name.indexOf( |
| | | " ")) |
| | | // 清除成交进度,L撤, H撤 |
| | | app.trade_progress_index = -1; |
| | | app.l_up_cancel_indexes = []; |
| | | app.l_down_cancel_indexes = []; |
| | | app.h_cancel_indexes = []; |
| | | app.buy_single_indexes = buy_singles; |
| | | }else{ |
| | | alert(res.msg); |
| | | } |
| | | }); |
| | | |
| | | }, |
| | | clear_cancel_mark: function() { |
| | | //清除撤单标记 |
| | | app.l_up_cancel_indexes = []; |
| | | app.l_down_cancel_indexes = []; |
| | | app.h_cancel_indexes = []; |
| | | }, |
| | | get_last_trade_day_reasons: function(code) { |
| | | http_util.get_last_trade_day_reasons(code, function(res) { |
| | | res= JSON.parse(res); |
| | |
| | | }); |
| | | }, |
| | | |
| | | hidden_canceled_check: function(e) { |
| | | |
| | | app.hidden_canceled = e.currentTarget.checked; |
| | | }, |
| | | |
| | | hidden_cancel_check: function(e) { |
| | | |
| | | app.hidden_cancel = e.currentTarget.checked; |
| | | }, |
| | | |
| | | hidden_little_money_check:function(e){ |
| | | app.hidden_little_money = e.currentTarget.checked; |
| | | }, |
| | | |
| | | select_row: function(index) { |
| | | console.log("点击事件", index); |
| | | if (app.buy_single_indexes.includes(index)) { |
| | | app.operate_index = index; |
| | | } else { |
| | | app.operate_index = -1; |
| | | } |
| | | }, |
| | | show_operate: function(event, index) { |
| | | console.log("位置", event.clientX, event.clientY); |
| | | }, |
| | | set_trade_info: function(code, code_name, trade_data, trade_record, initiative_buy_codes, |
| | | passive_buy_codes) { |
| | | console.log("交易数据", code, code_name, trade_data, trade_record) |
| | | console.log("主动买入", initiative_buy_codes) |
| | | console.log("被动买入", passive_buy_codes) |
| | | try { |
| | | console.log("交易数据", trade_data) |
| | | console.log("交易记录数据", trade_record) |
| | | app.code = code; |
| | | app.get_last_trade_day_reasons(code); |
| | | // app.get_last_trade_day_reasons(code); |
| | | app.code_name = code_name; |
| | | if (trade_data) { |
| | | var trade_data = JSON.parse(trade_data); |
| | | console.log("交易数据类型", typeof trade_data) |
| | | try { |
| | | // trade_data = trade_data.replace("/\n/g", " ") |
| | | // var trade_data = JSON.parse(trade_data); |
| | | app.trade_data = trade_data |
| | | } catch (e) { |
| | | console.log(e) |
| | | } |
| | | console.log("----有交易数据") |
| | | } else { |
| | | app.trade_data = { |
| | | "star": { |
| | |
| | | "base": 0, |
| | | "now": 0 |
| | | }, |
| | | "trade_progress": { |
| | | "trade_progress": [{ |
| | | "time": "00:00:00", |
| | | "num": 0, |
| | | "money": 0 |
| | | }, |
| | | }], |
| | | "trade_state": { |
| | | "order": false, |
| | | "desc": "未交易" |
| | |
| | | }; |
| | | } |
| | | if (trade_record) { |
| | | app.trade_record = JSON.parse(trade_record); |
| | | console.log("----有交易记录") |
| | | app.trade_record = trade_record; |
| | | } else { |
| | | console.log("----无交易记录") |
| | | app.trade_record = null; |
| | | } |
| | | if (initiative_buy_codes) { |
| | | app.initiative_buy_codes = JSON.parse(initiative_buy_codes); |
| | | } else { |
| | | app.initiative_buy_codes = null; |
| | | } catch (ee) { |
| | | console.log("处理出错") |
| | | console.log(e) |
| | | } |
| | | }, |
| | | show_more_records: function(items) { |
| | | var str_ = "" |
| | | items.forEach(function(item) { |
| | | str_ += item; |
| | | str_ += "\n"; |
| | | }); |
| | | alert(str_); |
| | | }, |
| | | test: function() { |
| | | |
| | | }, |
| | | need_show:function(item){ |
| | | if(app.hidden_canceled&&(item[2][6].indexOf('买撤')>=0||(item[2][8]!=null&&item[2][8].indexOf("-")>0))){ |
| | | return false; |
| | | } |
| | | if(app.hidden_cancel&&(item[2][6].indexOf('买撤')>=0)){ |
| | | return false; |
| | | } |
| | | if(app.hidden_little_money&&parseFloat(item[2][3])<50&&item[2][0]!=app.latest_real_order_index){ |
| | | return false; |
| | | } |
| | | |
| | | if (passive_buy_codes) { |
| | | app.passive_buy_codes = JSON.parse(passive_buy_codes); |
| | | } else { |
| | | app.passive_buy_codes = null; |
| | | return true; |
| | | } |
| | | |
| | | |
| | | } |
| | | |
| | | } |
| | | }) |
| | | |
| | |
| | | }, callback); |
| | | }, |
| | | |
| | | //获取L2的数据 |
| | | get_l2_datas:function(code,callback){ |
| | | http_util.http_request("/get_l2_datas", {code:code |
| | | }, callback); |
| | | }, |
| | | //获取L2的数据 |
| | | get_trade_progress:function(code,callback){ |
| | | http_util.http_request("/get_trade_progress", {code:code |
| | | }, callback); |
| | | }, |
| | | //获取L2的数据 |
| | | get_l2_l_cancel_datas:function(code,buy_single_index,callback){ |
| | | var params={code:code} |
| | | if(buy_single_index>=0){ |
| | | params["buy_single_index"] = buy_single_index; |
| | | } |
| | | http_util.http_request("/get_l_cancel_datas", params, callback); |
| | | }, |
| | | get_l2_h_cancel_datas:function(code,buy_single_index,callback){ |
| | | var params={code:code} |
| | | if(buy_single_index>=0){ |
| | | params["buy_single_index"] = buy_single_index; |
| | | } |
| | | http_util.http_request("/get_h_cancel_datas", params, callback); |
| | | }, |
| | | |
| | | }; |
| | |
| | | }, |
| | | kpl_code_info: { |
| | | code_records: [ |
| | | [["原因",''], "2020-01-01", [["板块",'']]], |
| | | [["原因",''], "2020-01-01", [["板块",'']]], |
| | | [["原因",''], "2020-01-01", [["板块",'']]] |
| | | [ |
| | | ["原因", ''], "2020-01-01", [ |
| | | ["板块", ''] |
| | | ] |
| | | ], |
| | | today: [["涨停原因",''], "2023-01-01", [["传媒",'']]], |
| | | [ |
| | | ["原因", ''], "2020-01-01", [ |
| | | ["板块", ''] |
| | | ] |
| | | ], |
| | | [ |
| | | ["原因", ''], "2020-01-01", [ |
| | | ["板块", ''] |
| | | ] |
| | | ] |
| | | ], |
| | | today: [ |
| | | ["涨停原因", ''], "2023-01-01", [ |
| | | ["传媒", ''] |
| | | ] |
| | | ], |
| | | plate: [ |
| | | ["板块1", "1%",''], |
| | | ["板块2", "0.5%",''] |
| | |
| | | open_limit_up_count: 10, |
| | | limit_up_codes: [ |
| | | //(代码,名称,涨停状态(0-无状态 1-涨停 2-炸板),龙几,首板,分值,涨停时间,原因,相同原因代码数量,自由流通,之前的板块) |
| | | ["000333", "美的集团", 1, "龙1", "首板", "200", "10:00:00", "一季度增长", "1", "12.02亿",'12亿','', |
| | | ["000333", "美的集团", 1, "龙1", "首板", "200", "10:00:00", "一季度增长", "1", "12.02亿", |
| | | '12亿', '', |
| | | '' |
| | | ], |
| | | ["000333", "美的集团", 1, "龙1", "首板", "200", "10:00:00", "一季度增长", "1", "12.02亿", |
| | |
| | | |
| | | }, |
| | | want_codes: [], |
| | | want_codes_plate: "", |
| | | choose_code: { |
| | | first: '', |
| | | second: '' |
| | |
| | | industry_data_type: 0, |
| | | jingxuan_data_type: 0, |
| | | |
| | | }, |
| | | watch: { |
| | | want_codes: function() { |
| | | layer.open({ |
| | | title: app.want_codes_plate, |
| | | type: 1, |
| | | content: $("#want_code_dialog"), |
| | | }); |
| | | } |
| | | }, |
| | | methods: { |
| | | refresh: function() { |
| | |
| | | .plate; |
| | | app.$set(app.choose_code_info.code_list_info, index, app |
| | | .choose_code_info.code_list_info[index]); |
| | | if (app.choose_code.second_info) |
| | | { |
| | | if (app.choose_code.second_info) { |
| | | //暂存选中二级代码数据 |
| | | app.choose_code.second_info.code_records = app.kpl_code_info |
| | | .code_records; |
| | |
| | | result = JSON.parse(result); |
| | | console.log("涨停原因成分股返回:",result); |
| | | var datas = result.data; |
| | | app.want_codes_title = plate; |
| | | app.want_codes = datas; |
| | | |
| | | console.log("涨停原因成分股:",datas) |
| | | setTimeout(function() { |
| | | layer.open({ |
| | | title: plate, |
| | | type: 1, |
| | | content: $("#want_code_dialog"), |
| | | }) |
| | | }, 100); |
| | | |
| | | }); |
| | | |
| | | }, |
| | |
| | | |
| | | <!DOCTYPE html> |
| | | <html lang="zh"> |
| | | |
| | | <head> |
| | | <meta charset="UTF-8"> |
| | | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| | | <title>用户登录</title> |
| | | <style> |
| | | body { |
| | | font-family: "宋体", Arial, Helvetica, sans-serif; |
| | | background-color: #FEEFE3; |
| | | background-image: url("https://i.imgur.com/9NyJSkH.jpg"); |
| | | background-size: 800px; |
| | | background-repeat: no-repeat; |
| | | background-position: center top; |
| | | } |
| | | |
| | | * { |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | /* Add padding to container elements */ |
| | | .container { |
| | | padding: 20px; |
| | | background-color: rgba(255, 255, 255, 0.8); |
| | | border-radius: 20px; |
| | | width: 380px; |
| | | margin: auto; |
| | | margin-top: 15vh; |
| | | box-shadow: 10px 10px 40px rgba(0, 0, 0, 0.2); |
| | | } |
| | | |
| | | /* Full-width input fields */ |
| | | input[type=text], |
| | | input[type=password] { |
| | | width: 100%; |
| | | padding: 12px 20px; |
| | | margin: 8px 0; |
| | | display: inline-block; |
| | | border: none; |
| | | background-color: #FEEFE3; |
| | | border-radius: 8px; |
| | | font-size: 18px; |
| | | } |
| | | |
| | | /* Set a style for the submit button */ |
| | | button { |
| | | background-color: #F53A20; |
| | | color: white; |
| | | padding: 16px 20px; |
| | | margin: 20px 0; |
| | | border: none; |
| | | cursor: pointer; |
| | | width: 100%; |
| | | border-radius: 8px; |
| | | font-size: 24px; |
| | | letter-spacing: 2px; |
| | | } |
| | | |
| | | /* Set a hover effect for the submit button */ |
| | | button:hover { |
| | | opacity: 0.8; |
| | | } |
| | | |
| | | /* Center the login form */ |
| | | .login-form { |
| | | text-align: center; |
| | | font-size: 24px; |
| | | margin-bottom: 20px; |
| | | } |
| | | |
| | | /* Add a red border to invalid inputs */ |
| | | input:invalid { |
| | | border-color: #E91E63; |
| | | } |
| | | |
| | | /* Style for the heading */ |
| | | h1 { |
| | | font-size: 48px; |
| | | color: #F53A20; |
| | | text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.2); |
| | | text-align: center; |
| | | margin-top: 80px; |
| | | } |
| | | |
| | | /* Style for the input labels */ |
| | | label { |
| | | font-size: 24px; |
| | | color: #FFC400; |
| | | display: block; |
| | | text-align: left; |
| | | margin-bottom: 8px; |
| | | letter-spacing: 2px; |
| | | } |
| | | |
| | | /* Style for the error message */ |
| | | .error { |
| | | color: #E91E63; |
| | | font-size: 18px; |
| | | text-align: left; |
| | | margin-top: 8px; |
| | | } |
| | | </style> |
| | | </head> |
| | | <html> |
| | | |
| | | <body> |
| | | |
| | | <h1>中国风登录页面</h1> |
| | | |
| | | <form class="login-form" action="" method="post"> |
| | | <div class="container"> |
| | | <label for="username">用户名</label> |
| | | <input type="text" placeholder="请输入用户名" name="username" required> |
| | | |
| | | <label for="password">密码</label> |
| | | <input type="password" placeholder="请输入密码" name="password" required> |
| | | |
| | | <button type="submit">登录</button> |
| | | <div class="error">用户名或密码错误</div> |
| | | </div> |
| | | </form> |
| | | |
| | | <video src="http://www.test.cn"></video> |
| | | <script> |
| | | function parse_play_url() { |
| | | var videos = document.getElementsByTagName('video'); |
| | | if (videos.length <= 0) { |
| | | hxhapi.onVideoUrl('', '没有获取到video标签'); |
| | | return; |
| | | } |
| | | hxhapi.onVideoUrl(videos.item(0).getAttribute('src'), ''); |
| | | } |
| | | parse_play_url(); |
| | | </script> |
| | | </body> |
| | | |
| | | |
| | | |
| | | |
| | | </html> |