li
5f40e4e1b5
- 移除秒合约页面及UI - 合约页Tab改为Position Held/Transaction Record - 存款/提款/转账页增加BTC/ETH - 资产页重构(用户信息+盈亏+多语言) - 注册页改版(匹配新设计稿) - 日文全面翻译+首页菜单多语言 - 代理专属注册链接支持(?code=) - 10个locale文件同步更新
290 lines
9.3 KiB
HTML
290 lines
9.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title></title>
|
|
<!-- Fix for iOS Safari zooming bug -->
|
|
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
|
|
<meta charset="utf-8" />
|
|
|
|
<script src="pako.js"></script>
|
|
<!--封装了一个发布订阅模式-->
|
|
<script src="event.js"></script>
|
|
<!--图表库js-->
|
|
<script src="charting_library/charting_library.min.js"></script>
|
|
</head>
|
|
<style scoped>
|
|
* {
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
body {
|
|
background-color: #0E1421;
|
|
}
|
|
|
|
/* 这个下面的css是 产品周期按钮的 */
|
|
.header {
|
|
position: relative;
|
|
/* height: 150px; */
|
|
/*box-shadow: 0px 10px 8px #FFFFFF;*/
|
|
}
|
|
.times {
|
|
position: absolute;
|
|
bottom: 0;
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
.times span {
|
|
width: 16.66%;
|
|
height: 30px;
|
|
line-height: 30px;
|
|
color: #7c8bac;
|
|
font-size: 12px;
|
|
text-align: center;
|
|
}
|
|
.times span.active {
|
|
position: relative;
|
|
color: #157fd5;
|
|
font-weight: 500;
|
|
}
|
|
.times span.active:before {
|
|
content: " ";
|
|
position: absolute;
|
|
bottom: -2px;
|
|
left: 10%;
|
|
z-index: 1;
|
|
width: 80%;
|
|
height: 3px;
|
|
background-color: #157fd5;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
/* #tv_chart_container:before {
|
|
content: " ";
|
|
position: fixed;
|
|
bottom: 22%;
|
|
left: 5%;
|
|
z-index: 999;
|
|
width: 9vw;
|
|
height: 9vw;
|
|
background-color: #fff;
|
|
} */
|
|
/* 这个下面的css重点关注，和k线图与关 */
|
|
|
|
#tv_chart_container {
|
|
width: 100%;
|
|
height: 250px;
|
|
}
|
|
|
|
iframe {
|
|
width: 100%;
|
|
height: calc(100vh - 30px) !important;
|
|
}
|
|
/* 定义模态对话框外面的覆盖层样式 */
|
|
#modal-overlay {
|
|
visibility: hidden;
|
|
position: absolute; /* 使用绝对定位或固定定位 */
|
|
left: 0px;
|
|
top: 200px;
|
|
width:100%;
|
|
height:100%;
|
|
text-align:center;
|
|
z-index: 1000;
|
|
/* background-color: #333; */
|
|
/* opacity: 0.5; /* 背景半透明 */ */
|
|
}
|
|
/* 模态框样式 */
|
|
.modal-data{
|
|
width:300px;
|
|
margin: 100px auto;
|
|
background-color: #fff;
|
|
border:1px solid #CCCCCC;
|
|
box-shadow: 1px 1px 1px 1px #DDDDDD;
|
|
padding:15px;
|
|
text-align:center;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.chart{
|
|
width: 100vw;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
.tuikuan-showModal{
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: rgba(25,25,26,1);
|
|
position: absolute;
|
|
top: 0rpx;
|
|
z-index: 100100;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.donut{
|
|
display: inline-block;
|
|
border: 4px solid rgba(0,0,0,0.1);
|
|
border-left-color: #59a782;
|
|
border-right-color: #CC3131;
|
|
border-radius: 50%;
|
|
width: 30px;
|
|
height: 30px;
|
|
animation: donut-spin 1.0s linear infinite;
|
|
}
|
|
|
|
@keyframes donut-spin {
|
|
0% {
|
|
transform: rotate(0deg);
|
|
}
|
|
|
|
100% {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
</style>
|
|
<body>
|
|
<div id="app" class="root">
|
|
<div id="" style="">
|
|
<div class="header" style="margin-top: 30px;">
|
|
<div class="times" id="interval">
|
|
<span @click="change('1')" :class="tab=='1'?'active':''" data-value="1" id="1minute">1Min</span>
|
|
<span @click="change('5')" :class="tab=='5'?'active':''" data-value="5" id="5minute">5Min</span>
|
|
<span @click="change('15')" :class="tab=='15'?'active':''" data-value="15" id="15minute">15Min</span>
|
|
<span @click="change('30')" :class="tab=='30'?'active':''" data-value="30" id="30minute">30Min</span>
|
|
<span @click="change('60')" :class="tab=='60'?'active':''" data-value="60" id="1hour">1Hour</span>
|
|
<span @click="change('1D')" :class="tab=='1D'?'active':''" data-value="1D" id="day">Day</span>
|
|
</div>
|
|
</div>
|
|
<div class="chart">
|
|
<div v-if="zhezhaoceng==1" class="tuikuan-showModal">
|
|
<div class="donut"></div>
|
|
</div>
|
|
<div id="tv_chart_container_PC"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--页面总统js 初始化图表库 绑定点击事件等-->
|
|
<!-- <script src="./index.js"></script> -->
|
|
<!-- 拦截点击logo跳转 -->
|
|
<script type="text/javascript">
|
|
function plusReady() {
|
|
var ws = plus.webview.currentWebview();
|
|
ws.overrideUrlLoading({
|
|
mode: 'reject'
|
|
}, function(e) {
|
|
console.log('拦截跳转 url: ' + e.url);
|
|
})
|
|
show1()
|
|
}
|
|
document.addEventListener('plusready', plusReady, false);
|
|
|
|
// 截取地址后参数转为对象
|
|
function getUrlParams(){
|
|
// url = '?symbol=btcusdt&title=BTC/USDT&lang=zh-cn'
|
|
let tempurl = window.location.href.split('?')[1];//?room=1
|
|
// console.log(tempurl)
|
|
let url = ''
|
|
// console.log(url.split('%')[0])
|
|
if(tempurl.indexOf('#') != '-1'){
|
|
url = tempurl.split('#')[0]
|
|
// console.log(tempurl.split('#')[0])
|
|
}else{
|
|
url = tempurl
|
|
}
|
|
// console.log(url)
|
|
let obj = {}
|
|
if (url) {
|
|
let arr = url.split('&')
|
|
for (let i = 0; i < arr.length; i++) {
|
|
obj[arr[i].split('=')[0]] = arr[i].split('=')[1]
|
|
}
|
|
}
|
|
return obj//{room: "1"}
|
|
}
|
|
function show1(){
|
|
var lang = getUrlParams().lang;
|
|
if(lang == undefined){
|
|
lang = 'en-us'
|
|
}
|
|
if(lang=="zh-cn"){
|
|
document.getElementById('1minute').innerText='1分';
|
|
document.getElementById('5minute').innerText='5分';
|
|
document.getElementById('15minute').innerText='15分';
|
|
document.getElementById('30minute').innerText='30分';
|
|
document.getElementById('1hour').innerText='1时';
|
|
document.getElementById('day').innerText='日线';
|
|
}else if(lang == 'mn'){
|
|
document.getElementById('1minute').innerText='1минут';
|
|
document.getElementById('5minute').innerText='5минут';
|
|
document.getElementById('15minute').innerText='15минут';
|
|
document.getElementById('30minute').innerText='30минут';
|
|
document.getElementById('1hour').innerText='1Цаг';
|
|
document.getElementById('day').innerText='тэнгэр';
|
|
}else if(lang == 'ms'){
|
|
document.getElementById('1minute').innerText='1minit';
|
|
document.getElementById('5minute').innerText='5minit';
|
|
document.getElementById('15minute').innerText='15minit';
|
|
document.getElementById('30minute').innerText='30minit';
|
|
document.getElementById('1hour').innerText='1Jam';
|
|
document.getElementById('day').innerText='langit';
|
|
}else if(lang=="kr"){
|
|
document.getElementById('1minute').innerText='1 분.';
|
|
document.getElementById('5minute').innerText='5 분.';
|
|
document.getElementById('15minute').innerText='15 분.';
|
|
document.getElementById('30minute').innerText='30 분.';
|
|
document.getElementById('1hour').innerText='1 시.';
|
|
document.getElementById('day').innerText='일 선';
|
|
}else if(lang=="fre"){
|
|
document.getElementById('1minute').innerText='1 point';
|
|
document.getElementById('5minute').innerText='5 points';
|
|
document.getElementById('15minute').innerText='15 points';
|
|
document.getElementById('30minute').innerText='30 points';
|
|
document.getElementById('1hour').innerText='1 Heure';
|
|
document.getElementById('day').innerText='ciel';
|
|
}else if(lang=="ger"){
|
|
document.getElementById('1minute').innerText='1 Punkt';
|
|
document.getElementById('5minute').innerText='5 Punkte';
|
|
document.getElementById('15minute').innerText='15 Punkte';
|
|
document.getElementById('30minute').innerText='30 Punkte';
|
|
document.getElementById('1hour').innerText='1 Stunde';
|
|
document.getElementById('day').innerText='Himmel';
|
|
}else if(lang=="ily"){
|
|
document.getElementById('1minute').innerText='1 punto';
|
|
document.getElementById('5minute').innerText='5 punti';
|
|
document.getElementById('15minute').innerText='15 punti';
|
|
document.getElementById('30minute').innerText='30 punti';
|
|
document.getElementById('1hour').innerText='1 Ora';
|
|
document.getElementById('day').innerText='Linea giornaliera';
|
|
}else if(lang=="jp"){
|
|
document.getElementById('1minute').innerText='1分';
|
|
document.getElementById('5minute').innerText='5分';
|
|
document.getElementById('15minute').innerText='15分';
|
|
document.getElementById('30minute').innerText='30分';
|
|
document.getElementById('1hour').innerText='1時';
|
|
document.getElementById('day').innerText='日線';
|
|
}else{
|
|
document.getElementById('1minute').innerText='1Min';
|
|
document.getElementById('5minute').innerText='5Min';
|
|
document.getElementById('15minute').innerText='15Min';
|
|
document.getElementById('30minute').innerText='30Min';
|
|
document.getElementById('1hour').innerText='1Hour';
|
|
document.getElementById('day').innerText='Day';
|
|
}
|
|
}
|
|
show1()
|
|
</script>
|
|
<script type="text/javascript" src="qs.js"></script>
|
|
<script type="text/javascript" src="vue.js"></script>
|
|
<script type="text/javascript" src="axios.js"></script>
|
|
<script type="text/javascript" src="kline.js?v=1.9"></script>
|
|
<!--websocket-->
|
|
<script src="websocket.js?v=2.2"></script>
|
|
<!--图表数据获取-->
|
|
<script src="datafeed.js?v=3.0"></script>
|
|
<!--图表配置-->
|
|
<script src="chartConfig_PC.js"></script>
|
|
</body>
|
|
</html>
|