453530270@qq.com
3 years ago
101 changed files with 18920 additions and 15593 deletions
@ -0,0 +1,2 @@ |
|||
# jiaoyi |
|||
|
|||
File diff suppressed because it is too large
|
After Width: | Height: | Size: 1.3 KiB |
|
After Width: | Height: | Size: 61 KiB |
|
After Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 36 KiB After Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 36 KiB |
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 288 B After Width: | Height: | Size: 234 B |
|
Before Width: | Height: | Size: 2.2 KiB After Width: | Height: | Size: 2.2 KiB |
|
Before Width: | Height: | Size: 978 B After Width: | Height: | Size: 978 B |
|
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 7.8 KiB After Width: | Height: | Size: 7.8 KiB |
|
After Width: | Height: | Size: 754 B |
|
Before Width: | Height: | Size: 2.9 KiB After Width: | Height: | Size: 2.9 KiB |
|
Before Width: | Height: | Size: 3.5 KiB After Width: | Height: | Size: 3.5 KiB |
|
After Width: | Height: | Size: 2.3 KiB |
|
Before Width: | Height: | Size: 2.8 KiB After Width: | Height: | Size: 2.8 KiB |
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 92 KiB |
@ -1,276 +1,333 @@ |
|||
<template> |
|||
<!-- colto-section --> |
|||
<footer class="footer mt-5"> |
|||
<div class="footer-upper-section"> |
|||
<div class="item_left" style="width:33%"> |
|||
<div class="logo"> |
|||
<!-- <img src="../assets/img/logo1.png" alt="logo" style="width:208px;height:68px" /> --> |
|||
<div style="width:200px;height:100px"> |
|||
<img :src="appConfig.head_logo" alt="logo" style="width:100%;height:100%;object-fit: contain;"/> |
|||
</div> |
|||
<!-- colto-section --> |
|||
<footer class="footer"> |
|||
<div class="footer-upper-section"> |
|||
<div class="item_left" style="width:40%;"> |
|||
<div class="logo"> |
|||
<!-- <img src="../assets/img/logo1.png" alt="logo" style="width:208px;height:68px" /> --> |
|||
<div style="width:300px;height:150px"> |
|||
<img :src="appConfig.head_logo" alt="logo" style="width:100%;height:100%;object-fit: contain;"/> |
|||
</div> |
|||
|
|||
<!-- <span>{{$t('common.footerTips1')}}</span> --> |
|||
</div> |
|||
<!-- <p class="foot_p">{{$t('common.footerTips2',{name:appConfig.name})}}</p> --> |
|||
<!-- <p class="foot_p">{{$t('common.footerTips3')}}</p> --> |
|||
</div> |
|||
<div class="item_right" style="width:66%"> |
|||
<div class="item"> |
|||
<p class="item_p">{{ $t("common.college") }}</p> |
|||
<p class="foot_p"> |
|||
<router-link :to="college[0].url">{{ college[0].label }}</router-link> |
|||
<br /> |
|||
<router-link :to="college[1].url">{{ college[1].label }}</router-link> |
|||
</p> |
|||
<p class="foot_p"> |
|||
<router-link :to="college[2].url">{{ college[2].label }}</router-link> |
|||
<br /> |
|||
<router-link :to="college[3].url">{{ college[3].label }}</router-link> |
|||
</p> |
|||
</div> |
|||
<div class="item"> |
|||
<p class="item_p">{{ $t("common.service") }}</p> |
|||
<p class="foot_p"> |
|||
<router-link :to="service[0].url">{{ service[0].label }}</router-link> |
|||
<br /> |
|||
<router-link :to="service[1].url">{{ service[1].label }}</router-link> |
|||
</p> |
|||
<p class="foot_p"> |
|||
<router-link :to="service[2].url">{{ service[2].label }}</router-link> |
|||
<br /> |
|||
<router-link :to="service[3].url">{{ service[3].label }}</router-link> |
|||
</p> |
|||
</div> |
|||
<!-- <span>{{$t('common.footerTips1')}}</span> --> |
|||
</div> |
|||
<span>{{ $t('common.footerTips1') }}</span> |
|||
<p class="foot_p">{{ $t('common.footerTips2', {name: appConfig.name}) }}</p> |
|||
<!-- <p class="foot_p">{{$t('appConfig.name')}}</p> --> |
|||
|
|||
<div class="item item2"> |
|||
<p class="item_p" style="width:100%">{{ $t("common.contactUs") }}</p> |
|||
<p class="foot_p" style="width:100%"> |
|||
{{ $t("common.email") }}: |
|||
</p> |
|||
<p class="foot_p" style="width:100%"> |
|||
{{email}} |
|||
</p> |
|||
<p class="foot_p" style="width:100%"> |
|||
<br /><br /> |
|||
</p> |
|||
</div> |
|||
</div> |
|||
<div class="container" v-if="0"> |
|||
<div class="row"> |
|||
<!-- <div class="col-lg-2 col-md-3 mb-4"> |
|||
<div class="footer-logo"> |
|||
<a href="#"> |
|||
<img :src="logo.imgurl" alt="img" class="img-responsive" /> |
|||
<img :src="appConfig.foot_logo" alt="logo" /> |
|||
</a> |
|||
</div> |
|||
</div> --> |
|||
<!-- 服务列表 --> |
|||
<div class="col-lg-1 col-md-3 mb-4"> |
|||
<div class="footer-info-list"> |
|||
<h4>{{ $t("common.service") }}</h4> |
|||
<ul> |
|||
<li v-for="(item, index) in service" :key="index"> |
|||
<router-link :to="item.url">{{ item.label }}</router-link> |
|||
</li> |
|||
</ul> |
|||
<p class="foot_p">{{ $t('common.footerTips3') }}</p> |
|||
</div> |
|||
</div> |
|||
<!-- 学院列表 --> |
|||
<div class="col-lg-1 col-md-3 mb-4"> |
|||
<div class="footer-info-list"> |
|||
<h4>{{ $t("common.college") }}</h4> |
|||
<ul> |
|||
<li v-for="item in college" :key="item.id"> |
|||
<router-link :to="item.url">{{ item.label}}</router-link> |
|||
</li> |
|||
</ul> |
|||
<div class="item" style="width:30%"> |
|||
<p class="item_p" style="text-align: center; font-size:16px">{{ $t("common.service") }}</p> |
|||
<p class="foot_p" style="text-align: center;"> |
|||
<router-link :to="service[0].url">{{ service[0].label }}</router-link> |
|||
</p> |
|||
<p class="foot_p" style="text-align: center;"> |
|||
|
|||
<router-link :to="service[1].url">{{ service[1].label }}</router-link> |
|||
</p> |
|||
<p class="foot_p" style="text-align: center;"> |
|||
<router-link :to="service[2].url">{{ service[2].label }}</router-link> |
|||
|
|||
<!-- <router-link :to="service[3].url">{{ service[3].label }}</router-link>--> |
|||
</p> |
|||
<p class="foot_p" style="text-align: center;"> |
|||
<router-link :to="service[3].url">{{ service[3].label }}</router-link> |
|||
</p> |
|||
</div> |
|||
</div> |
|||
<!-- <div class="item item1"> |
|||
<p class="item_p">{{ $t("common.college") }}</p> |
|||
<p class="foot_p" > |
|||
<router-link :to="college[0].url">{{ college[0].label }}</router-link>  |
|||
<router-link :to="college[1].url">{{ college[1].label }}</router-link> |
|||
</p> |
|||
<p class="foot_p"> |
|||
<router-link :to="college[2].url">{{ college[2].label }}</router-link>  |
|||
<router-link :to="college[3].url">{{ college[3].label }}</router-link> |
|||
</p> |
|||
</div> --> |
|||
<div class="item" style="width:30%;margin-top: 74px;"> |
|||
|
|||
|
|||
<p class="item_p" style="text-align: start; font-size:16px;">{{ $t("common.contactUs") }}</p> |
|||
<p class="foot_p" style="text-align: start; font-size:16px;"> |
|||
{{ $t("common.email") }}:{{ email }} |
|||
</p> |
|||
<div class="icon_foot"> |
|||
<img src="../assets/img/chat.png"> |
|||
<!--<div class="icon_img" v-for="(item,index) in list" :key="item">--> |
|||
<!-- <img :src="item.src"/>--> |
|||
<!--</div>--> |
|||
</div> |
|||
<!-- <p class="foot_p" style="width:100%"> |
|||
{{email}} |
|||
</p> --> |
|||
|
|||
<!-- 联系我们 --> |
|||
<div class="col-lg-2 col-md-6"> |
|||
<div class="footer-info-list"> |
|||
<h4>{{$t('common.contactUs')}}</h4> |
|||
<ul class="contact-info"> |
|||
<li> |
|||
{{ $t("common.email") }}: |
|||
<span>{{email}}</span> |
|||
</li> |
|||
<!-- <li> |
|||
Phone: <span>{{contactinfo.mobile}}</span> |
|||
</li> --> |
|||
</ul> |
|||
<ul class="social-style-two"> |
|||
<li> |
|||
<a href="#"> |
|||
<i class="fab fa-facebook-f"></i> |
|||
</a> |
|||
</li> |
|||
<li> |
|||
<a href="#"> |
|||
<i class="fab fa-twitter"></i> |
|||
</a> |
|||
</li> |
|||
<li> |
|||
<a href="#"> |
|||
<i class="fab fa-google-plus-g"></i> |
|||
</a> |
|||
</li> |
|||
<li> |
|||
<a href="#"> |
|||
<i class="fab fa-github"></i> |
|||
</a> |
|||
</li> |
|||
<li> |
|||
<a href="#"> |
|||
<i class="fab fa-linkedin-in"></i> |
|||
</a> |
|||
</li> |
|||
</ul> |
|||
</div> |
|||
</div> |
|||
<div class="col-lg-4 col-md-6 border-left" v-if="0"> |
|||
<div class="pl-2 "> |
|||
<div class="mb-2"> |
|||
{{$t('common.footerTips1')}} |
|||
|
|||
<!-- <div class="container"> |
|||
<div class="row"> --> |
|||
<!-- <div class="col-lg-2 col-md-3 mb-4"> |
|||
<div class="footer-logo"> |
|||
<a href="#"> |
|||
<img :src="logo.imgurl" alt="img" class="img-responsive" /> |
|||
<img :src="appConfig.foot_logo" alt="logo" /> |
|||
</a> |
|||
</div> |
|||
</div> --> |
|||
<!-- 服务列表 --> |
|||
<!-- <div class="col-lg-1 col-md-3 mb-4"> |
|||
<div class="footer-info-list"> |
|||
<h4>{{ $t("common.service") }}</h4> |
|||
<ul> |
|||
<li v-for="(item, index) in service" :key="index"> |
|||
<router-link :to="item.url">{{ item.label }}</router-link> |
|||
</li> |
|||
</ul> |
|||
</div> |
|||
</div> --> |
|||
<!-- 学院列表 --> |
|||
<!-- <div class="col-lg-1 col-md-3 mb-4"> |
|||
<div class="footer-info-list"> |
|||
<h4>{{ $t("common.college") }}</h4> |
|||
<ul> |
|||
<li v-for="item in college" :key="item.id"> |
|||
<router-link :to="item.url">{{ item.label}}</router-link> |
|||
</li> |
|||
</ul> |
|||
</div> |
|||
<div class="mb-2"> {{$t('common.footerTips2',{name:appConfig.name})}}</div> |
|||
<div class="mb-2">{{$t('common.footerTips3')}}</div> |
|||
</div> --> |
|||
|
|||
</div> |
|||
</div> |
|||
<!-- 联系我们 --> |
|||
<!-- <div class="col-lg-2 col-md-6"> |
|||
<div class="footer-info-list"> |
|||
<h4>{{$t('common.contactUs')}}</h4> |
|||
<ul class="contact-info"> |
|||
<li> |
|||
{{ $t("common.email") }}: |
|||
<span>{{email}}</span> |
|||
</li> |
|||
<li> |
|||
Phone: <span>{{contactinfo.mobile}}</span> |
|||
</li> |
|||
</ul> |
|||
<ul class="social-style-two"> |
|||
<li> |
|||
<a href="#"> |
|||
<i class="fab fa-facebook-f"></i> |
|||
</a> |
|||
</li> |
|||
<li> |
|||
<a href="#"> |
|||
<i class="fab fa-twitter"></i> |
|||
</a> |
|||
</li> |
|||
<li> |
|||
<a href="#"> |
|||
<i class="fab fa-google-plus-g"></i> |
|||
</a> |
|||
</li> |
|||
<li> |
|||
<a href="#"> |
|||
<i class="fab fa-github"></i> |
|||
</a> |
|||
</li> |
|||
<li> |
|||
<a href="#"> |
|||
<i class="fab fa-linkedin-in"></i> |
|||
</a> |
|||
</li> |
|||
</ul> |
|||
</div> |
|||
</div> --> |
|||
<!-- <div class="col-lg-4 col-md-6 border-left"> |
|||
<div class="pl-2 "> |
|||
<div class="mb-2"> |
|||
{{$t('common.footerTips1')}} |
|||
</div> |
|||
<div class="mb-2"> {{$t('common.footerTips2',{name:appConfig.name})}}</div> |
|||
<div class="mb-2">{{$t('common.footerTips3')}}</div> |
|||
|
|||
</div> |
|||
</div> --> |
|||
<!-- </div> --> |
|||
<!-- </div> --> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="footer-bottom"> |
|||
<!-- 版权信息 --> |
|||
<div class="container"> |
|||
<div class="footer-bottom-wrap"> |
|||
<!-- © --> |
|||
<div class="copyright-text text-center">{{appConfig.copyright}}</div> |
|||
<div class="footer-bottom"> |
|||
<!-- 版权信息 --> |
|||
<div class="container"> |
|||
<div class="footer-bottom-wrap"> |
|||
<!-- © --> |
|||
<div class="copyright-text text-center">{{ appConfig.copyright }}</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</footer> |
|||
</footer> |
|||
</template> |
|||
|
|||
<script> |
|||
import College from "@/api/college"; |
|||
import ContactUs from "@/api/contactUs"; |
|||
import {mapState} from 'vuex' |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
service: [], |
|||
college: [], |
|||
email: "" |
|||
}; |
|||
}, |
|||
computed:{ |
|||
...mapState({ |
|||
appConfig:'appConfig' |
|||
}) |
|||
}, |
|||
methods: { |
|||
getCollegeLinks() { |
|||
College.getCategoryList() |
|||
.then(list => { |
|||
list.forEach(item => { |
|||
this.college.push({ |
|||
url: `/college/list/${item.id}`, |
|||
label: item.name |
|||
}); |
|||
}); |
|||
data() { |
|||
return { |
|||
service: [], |
|||
college: [], |
|||
email: "", |
|||
list: [ |
|||
{src: 'https://www.rsncoin.com/static/flag/discord.png'}, |
|||
{src: 'https://www.rsncoin.com/static/flag/telegram.png'}, |
|||
{src: 'https://www.rsncoin.com/static/flag/tiktok.png'}, |
|||
{src: 'https://www.rsncoin.com/static/flag/twitter.png'}, |
|||
{src: 'https://www.rsncoin.com/static/flag/reddit.png'}, |
|||
{src: 'https://www.rsncoin.com/static/flag/ins.png'}, |
|||
{src: 'https://www.rsncoin.com/static/flag/cap.jpg'}, |
|||
{src: 'https://www.rsncoin.com/static/flag/vk.png'}, |
|||
{src: 'https://www.rsncoin.com/static/flag/youtube.jpg'}, |
|||
] |
|||
}; |
|||
}, |
|||
computed: { |
|||
...mapState({ |
|||
appConfig: 'appConfig' |
|||
}) |
|||
.catch(err => {}); |
|||
}, |
|||
methods: { |
|||
getCollegeLinks() { |
|||
College.getCategoryList() |
|||
.then(list => { |
|||
list.forEach(item => { |
|||
this.college.push({ |
|||
url: `/college/list/${item.id}`, |
|||
label: item.name |
|||
}); |
|||
}); |
|||
}) |
|||
.catch(err => { |
|||
}); |
|||
}, |
|||
|
|||
getServiceLink() { |
|||
College.getServiceList() |
|||
.then(list => { |
|||
list.forEach(item => { |
|||
this.service.push({ |
|||
url: `/service/${item.id}`, |
|||
label: item.name |
|||
}); |
|||
}); |
|||
}) |
|||
.catch(err => {}); |
|||
getServiceLink() { |
|||
College.getServiceList() |
|||
.then(list => { |
|||
list.forEach(item => { |
|||
this.service.push({ |
|||
url: `/service/${item.id}`, |
|||
label: item.name |
|||
}); |
|||
}); |
|||
}) |
|||
.catch(err => { |
|||
}); |
|||
}, |
|||
getEmial() { |
|||
ContactUs.contact() |
|||
.then(data => { |
|||
this.email = data.contact; |
|||
}) |
|||
.catch(err => { |
|||
}); |
|||
} |
|||
}, |
|||
getEmial() { |
|||
ContactUs.contact() |
|||
.then(data => { |
|||
this.email = data.contact; |
|||
}) |
|||
.catch(err => {}); |
|||
created() { |
|||
this.getCollegeLinks(); |
|||
this.getServiceLink(); |
|||
this.getEmial(); |
|||
} |
|||
}, |
|||
created() { |
|||
this.getCollegeLinks(); |
|||
this.getServiceLink(); |
|||
this.getEmial(); |
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped lang="scss"> |
|||
.footer-upper-section{ |
|||
.footer-upper-section { |
|||
padding: 0; |
|||
display: flex; |
|||
align-items: center; |
|||
height: 324px; |
|||
// margin-left: 233px; |
|||
justify-content: space-between; |
|||
padding:0 133px; |
|||
.item_left{ |
|||
width: 454px; |
|||
// margin-right: 300px; |
|||
.logo{ |
|||
display: flex; |
|||
align-items: center; |
|||
color: #172636; |
|||
justify-content: space-between; |
|||
width: 100%; |
|||
font-size: 16px; |
|||
margin-bottom: 17px; |
|||
} |
|||
padding: 0 133px; |
|||
|
|||
.item_left { |
|||
width: 454px; |
|||
// margin-right: 300px; |
|||
.logo { |
|||
display: flex; |
|||
align-items: center; |
|||
color: #172636; |
|||
justify-content: space-between; |
|||
width: 100%; |
|||
font-size: 16px; |
|||
} |
|||
} |
|||
|
|||
.item_right{ |
|||
.item_right { |
|||
display: flex; |
|||
height: 99px; |
|||
|
|||
.item{ |
|||
min-width: 250px; |
|||
// border-right: 1px solid #303D4B; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
padding: 0 15px; |
|||
.item_p{ |
|||
font-size: 16px; |
|||
color: #172636; |
|||
.item { |
|||
min-width: 250px; |
|||
// border-right: 1px solid #303D4B; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
padding: 0 15px; |
|||
|
|||
.item_p { |
|||
font-size: 16px; |
|||
color: #172636; |
|||
} |
|||
} |
|||
|
|||
.item1 { |
|||
text-align: center; |
|||
} |
|||
|
|||
.item2 { |
|||
padding-left: 64px; |
|||
} |
|||
|
|||
.item:last-child { |
|||
border: none; |
|||
} |
|||
} |
|||
.item2{ |
|||
padding-left: 64px; |
|||
} |
|||
.item:last-child{ |
|||
border: none; |
|||
} |
|||
} |
|||
|
|||
} |
|||
.foot_p{ |
|||
} |
|||
|
|||
.foot_p { |
|||
color: #797979; |
|||
font-size: 14px; |
|||
margin: 0; |
|||
a:hover{ |
|||
color: #326AEB; |
|||
|
|||
a:hover { |
|||
color: #797979; |
|||
} |
|||
|
|||
a:visited { |
|||
color: #797979; |
|||
} |
|||
} |
|||
|
|||
.icon_foot { |
|||
margin-top: 5px; |
|||
height: 130px; |
|||
width: 180px; |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
|
|||
.icon_img { |
|||
height: 30px; |
|||
width: 30px; |
|||
margin: 0px 5px; |
|||
|
|||
|
|||
img { |
|||
height: 100%; |
|||
width: 100%; |
|||
border-radius: 50%; |
|||
|
|||
} |
|||
} |
|||
// a:visited{ |
|||
// color: #326AEB; |
|||
// } |
|||
} |
|||
} |
|||
</style> |
|||
|
|||
File diff suppressed because it is too large
File diff suppressed because it is too large
File diff suppressed because it is too large
File diff suppressed because it is too large
File diff suppressed because it is too large
File diff suppressed because it is too large
File diff suppressed because it is too large
@ -0,0 +1,874 @@ |
|||
<template> |
|||
<div class="col-md-6"> |
|||
<div class="px-4 py-2 heading"> |
|||
<!--<div class="coin-change d-flex align-items-center py-2 pl-4 heading justify-content-between" style="width:100%;float: right">--> |
|||
<!-- <div class="d-flex align-items-center">--> |
|||
<!-- <div class="coin d-flex align-items-center">--> |
|||
<!-- <el-popover--> |
|||
<!-- placement="bottom"--> |
|||
<!-- ref="popover"--> |
|||
<!-- width="400"--> |
|||
<!-- trigger="click">--> |
|||
<!-- <div slot="reference">--> |
|||
<!-- {{ activeContract.pair_name }}11111111--> |
|||
<!-- <!– <el-button size="mini">--> |
|||
<!-- <i class="el-icon-arrow-down"></i>--> |
|||
<!-- </el-button> –>--> |
|||
<!-- </div>--> |
|||
<!-- </el-popover>--> |
|||
<!-- </div>--> |
|||
<!-- <div--> |
|||
<!-- class="price px-3 border-right"--> |
|||
<!-- :class="{--> |
|||
<!-- decreace: activeContract.increase < 0,--> |
|||
<!-- increace: activeContract.increase >= 0--> |
|||
<!-- }"--> |
|||
<!-- >--> |
|||
<!-- <span class="current">{{ activeContract.price }}$</span>--> |
|||
<!-- --> |
|||
<!-- <span class="zf">{{ activeContract.increaseStr }}</span>--> |
|||
<!-- </div>--> |
|||
<!-- <!– 币种价值数据 –>--> |
|||
<!-- <div class="d-flex fn-12">--> |
|||
<!-- <div class="item px-2">--> |
|||
<!-- <div class="title mb-1 text-secondary">--> |
|||
<!-- 24h {{ $t("contract.h7") }}--> |
|||
<!-- </div>--> |
|||
<!-- <div>--> |
|||
<!-- {{ activeContract.high }}--> |
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
<!-- <div class="item px-2">--> |
|||
<!-- <div class="title mb-1 text-secondary">--> |
|||
<!-- 24h {{ $t("contract.h8") }}--> |
|||
<!-- </div>--> |
|||
<!-- <div>--> |
|||
<!-- {{ activeContract.low }}--> |
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
<!-- <div class="item px-2">--> |
|||
<!-- <div class="title mb-1 text-secondary">--> |
|||
<!-- 24h {{ $t("contract.h9") }}--> |
|||
<!-- <!– （{{ $t("contract.e2") }}） –>--> |
|||
<!-- (USDT)--> |
|||
<!-- </div>--> |
|||
<!-- <div>--> |
|||
<!-- {{ activeContract.vol }}--> |
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
<!-- </div>--> |
|||
<!-- <div><theme-change /></div> --> |
|||
<!--</div>--> |
|||
<!-- <theme-change/> --> |
|||
<el-tooltip placement="bottom" effect="light"> |
|||
<div slot="content" class="market"> |
|||
<div class="coin p-md color-light fn-20"> |
|||
<img :src="detail.coin_icon" width="20" height="20" alt=""> |
|||
{{detail.full_name}} |
|||
</div> |
|||
<div class="list"> |
|||
<div class="d-flex justify-between p-x-md p-y-xs"> |
|||
<div>{{$t('nav.c3')}}：</div> |
|||
<div class="color-light"> |
|||
{{detail.total_issuance}} |
|||
</div> |
|||
</div> |
|||
<div class="d-flex justify-between p-x-md p-y-xs"> |
|||
<div>{{$t('nav.c4')}}：</div> |
|||
<div class="color-light"> |
|||
{{detail.total_circulation}} |
|||
</div> |
|||
</div> |
|||
<div class="d-flex justify-between p-x-md p-y-xs"> |
|||
<div>{{$t('nav.c5')}}：</div> |
|||
<div class="color-light"> |
|||
{{detail.crowdfunding_price}} |
|||
</div> |
|||
</div> |
|||
<div class="d-flex justify-between p-x-md p-y-xs"> |
|||
<div>{{$t('nav.c6')}}：</div> |
|||
<div class="color-light"> |
|||
{{detail.publish_time}} |
|||
</div> |
|||
</div> |
|||
<div class=" p-x-md p-y-xs"> |
|||
<div>{{$t('nav.c7')}}：</div> |
|||
<div class="color-light ov"> |
|||
{{detail.white_paper_link}} |
|||
</div> |
|||
</div> |
|||
<div class=" p-x-md p-y-xs"> |
|||
<div>{{$t('nav.c8')}}：</div> |
|||
<div class="color-light ov"> |
|||
{{detail.official_website_link}} |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="p-md"> |
|||
<div class="fn-20 color-light"> |
|||
{{$t('nav.c9')}} |
|||
</div> |
|||
<div class="p-y-md edit-content" v-html="detail.coin_content"> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- <el-button><img src="../../assets/img/shuoming.png" width="20" height="20" alt=""></el-button> --> |
|||
</el-tooltip> |
|||
|
|||
</div> |
|||
<!-- 生成K线图 --> |
|||
<k-line :symbol="symbol" :socket="socket" :priceDecimals="priceDecimals"></k-line> |
|||
|
|||
<!-- 交易处理 --> |
|||
<div class="market-trade "> |
|||
<ul class="nav nav-pills"> |
|||
<li class="nav-item"> |
|||
<a href :class="[`nav-link`, {active:!isCondition&&isMarket}]" @click.prevent="isCondition=false;isMarket=true;"> |
|||
{{ $t("common.market") }} |
|||
</a> |
|||
</li> |
|||
<li class="nav-item"> |
|||
<a href :class="[`nav-link`, {active:!isCondition&&!isMarket}]" @click.prevent="isCondition=false;isMarket=false;"> |
|||
{{ $t("common.limit") }}</a> |
|||
</li> |
|||
|
|||
<!-- <li class="nav-item"> |
|||
<a href :class="[`nav-link`, {active:isCondition&&!isMarket}]" @click.prevent="isCondition=true;isMarket=false;"> |
|||
{{ $t("common.stop-limit") }}</a> |
|||
</li> |
|||
<li class="nav-item"> |
|||
<a href :class="[`nav-link`, {active:isCondition&&isMarket}]" @click.prevent="isCondition=true;isMarket=true;"> |
|||
{{ $t("common.stop-market") }}</a> |
|||
</li> --> |
|||
</ul> |
|||
<div class="tab-content"> |
|||
<div class="tab-pane fade show active"> |
|||
<div class="d-flex justify-content-between"> |
|||
<!------------- Buy Order --------------> |
|||
<div class="market-trade-buy"> |
|||
|
|||
<!-- Trigger Price --> |
|||
<el-popover popper-class='popover-tips' placement="top-start" trigger="manual" v-model="visibles.buy.trigger"> |
|||
<span class="content"> |
|||
<i class="el-icon-warning-outline"></i> |
|||
{{ msgList.buy[0] }} |
|||
</span> |
|||
<div class="input-group" v-if="isCondition" slot="reference"> |
|||
<input type="number" v-model="buyorder.trigger_price" class="form-control" :placeholder="$t('exchange.trigger-price')"> |
|||
<div class="input-group-append"> |
|||
<span class="input-group-text">{{pair.from}}</span> |
|||
</div> |
|||
</div> |
|||
</el-popover> |
|||
|
|||
<template v-if="isMarket"> |
|||
<div class="input-group"> |
|||
<!-- Market Price --> |
|||
<input type="text" class="form-control" disabled :placeholder="$t('exchange.at-best-price')"> |
|||
</div> |
|||
</template> |
|||
<template v-else> |
|||
<el-popover popper-class='popover-tips' placement="top-start" trigger="manual" v-model="visibles.buy.limitPrice"> |
|||
<span class="content"> |
|||
<i class="el-icon-warning-outline"></i> |
|||
{{ msgList.buy[1] }} |
|||
</span> |
|||
<div class="input-group" slot="reference"> |
|||
<!-- Entrust Price --> |
|||
<input type="number" v-model="buyorder.entrust_price" class="form-control" :placeholder="$t('exchange.enter-price')"> |
|||
<div class="input-group-append"> |
|||
<span class="input-group-text">{{pair.from}}</span> |
|||
</div> |
|||
</div> |
|||
</el-popover> |
|||
</template> |
|||
|
|||
<!-- Amount/Total --> |
|||
<template v-if="isMarket"> |
|||
<el-popover popper-class='popover-tips' placement="top-start" trigger="manual" v-model="visibles.buy.marketTotal"> |
|||
<span class="content"> |
|||
<i class="el-icon-warning-outline"></i> |
|||
{{ msgList.buy[3] }} |
|||
</span> |
|||
<div class="input-group" slot="reference"> |
|||
<input type="number" v-model="buyTotal" class="form-control" min=0 :placeholder="$t('exchange.enter-total')"> |
|||
<div class="input-group-append"> |
|||
<span class="input-group-text">{{pair.from}}</span> |
|||
</div> |
|||
</div> |
|||
</el-popover> |
|||
</template> |
|||
<template v-else> |
|||
<el-popover popper-class='popover-tips' placement="top-start" trigger="manual" v-model="visibles.buy.limitAmount"> |
|||
<!-- 提示框的内容 --> |
|||
<span class="content"> |
|||
<!-- 图标 --> |
|||
<i class="el-icon-warning-outline"></i> |
|||
<!-- 提示 --> |
|||
{{ msgList.buy[2] }} |
|||
</span> |
|||
<div class="input-group" slot="reference"> |
|||
<input type="number" v-model="buyorder.amount" class="form-control" min=0 :placeholder="$t('exchange.enter-amount')"> |
|||
<div class="input-group-append"> |
|||
<span class="input-group-text">{{pair.to}}</span> |
|||
</div> |
|||
</div> |
|||
</el-popover> |
|||
</template> |
|||
|
|||
<!-- Percent --> |
|||
<ul class="market-trade-list"> |
|||
<li v-for="(item,index) in percentage" :key="index" :class="{buyPercentActive:index == buyPercentIndex}" @click="renderBuyAmount(item.value, index)"> |
|||
<a href="javascript:void 0">{{ item.label }}</a> |
|||
</li> |
|||
</ul> |
|||
|
|||
<!-- Total --> |
|||
<el-popover popper-class='popover-tips' placement="top-start" trigger="manual" v-model="visibles.buy.orderTotal"> |
|||
<span class="content"> |
|||
<i class="el-icon-warning-outline"></i> |
|||
{{ msgList.buy[5] }} |
|||
</span> |
|||
<p slot="reference"> |
|||
{{$t('exchange.order-total')}} |
|||
<span> <b>{{buyTotal}}</b> {{pair.from}} </span> |
|||
</p> |
|||
</el-popover> |
|||
|
|||
<!-- Available --> |
|||
<p> |
|||
{{ $t('exchange.amount') }} |
|||
<span> {{toBalance}} {{pair.to}}</span><br /> |
|||
{{ $t('exchange.balance') }} |
|||
<span> {{fromBalance}} {{pair.from}}</span> |
|||
</p> |
|||
<button class="btn buy" @click="handleBuyOrder">{{ $t("common.buy") }} {{pair.to}}</button> |
|||
</div> |
|||
|
|||
<!------------ Sell Order -----------> |
|||
<div class="market-trade-sell"> |
|||
<el-popover popper-class='popover-tips' placement="top-start" trigger="manual" v-model="visibles.sell.trigger"> |
|||
<span class="content"> |
|||
<i class="el-icon-warning-outline"></i> |
|||
{{ msgList.sell[0] }} |
|||
</span> |
|||
<!-- Trigger Price --> |
|||
<div class="input-group" v-if="isCondition" slot="reference"> |
|||
<input type="number" v-model="sellorder.trigger_price" class="form-control" min=0 :placeholder="$t('exchange.trigger-price')"> |
|||
<div class="input-group-append"> |
|||
<span class="input-group-text">{{pair.from}}</span> |
|||
</div> |
|||
</div> |
|||
</el-popover> |
|||
|
|||
<template v-if="isMarket"> |
|||
<div class="input-group"> |
|||
<!-- Market Price --> |
|||
<input type="text" class="form-control" disabled :placeholder="$t('exchange.at-best-price')"> |
|||
</div> |
|||
</template> |
|||
<template v-else> |
|||
<el-popover popper-class='popover-tips' placement="top-start" trigger="manual" v-model="visibles.sell.limitPrice"> |
|||
<span class="content"> |
|||
<i class="el-icon-warning-outline"></i> |
|||
{{ msgList.sell[1] }} |
|||
</span> |
|||
<div class="input-group" slot="reference"> |
|||
<!-- Entrust Price --> |
|||
<input type="number" v-model="sellorder.entrust_price" class="form-control" min=0 :placeholder="$t('exchange.enter-price')"> |
|||
<div class="input-group-append"> |
|||
<span class="input-group-text">{{pair.from}}</span> |
|||
</div> |
|||
</div> |
|||
</el-popover> |
|||
</template> |
|||
|
|||
<!-- Amount --> |
|||
<el-popover popper-class='popover-tips' placement="top-start" trigger="manual" v-model="visibles.sell.limitAmount"> |
|||
<span class="content"> |
|||
<i class="el-icon-warning-outline"></i> |
|||
{{ msgList.sell[2] }} |
|||
</span> |
|||
<div class="input-group" slot="reference"> |
|||
<input type="number" v-model="sellorder.amount" class="form-control" min=0 :placeholder="$t('exchange.enter-amount')"> |
|||
<div class="input-group-append"> |
|||
<span class="input-group-text">{{pair.to}}</span> |
|||
</div> |
|||
</div> |
|||
</el-popover> |
|||
|
|||
<ul class="market-trade-list"> |
|||
<li v-for="(item,index) in percentage" :key="index" :class="{sellPercentActive:index == sellPercentIndex}" @click="renderSellAmount(item.value, index)"> |
|||
<a href="javascript:void 0">{{ item.label }}</a> |
|||
</li> |
|||
</ul> |
|||
|
|||
<!-- Total --> |
|||
<el-popover popper-class='popover-tips' placement="top-start" trigger="manual" v-model="visibles.sell.orderTotal"> |
|||
<span class="content"> |
|||
<i class="el-icon-warning-outline"></i> |
|||
{{ msgList.sell[5] }} |
|||
</span> |
|||
<p slot="reference"> |
|||
{{ $t('exchange.order-total') }} |
|||
<span> |
|||
<b>{{sellTotal}}</b> {{pair.from}} </span> |
|||
</p> |
|||
</el-popover> |
|||
|
|||
<p> |
|||
{{$t('exchange.amount')}} |
|||
<span> {{toBalance}} {{pair.to}} </span><br /> |
|||
{{ $t('exchange.balance') }} |
|||
<span> {{fromBalance}} {{pair.from}}</span> |
|||
</p> |
|||
<button class="btn sell" @click="handleSellOrder">{{ $t("common.sell") }} {{pair.to}}</button> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import Exchange from "@/api/exchange"; |
|||
import Market from "@/api/market"; |
|||
import Contract from "@/api/contract"; |
|||
export default { |
|||
|
|||
props: ["isLogin", "socket", "symbol", "pair", "buyorder", "sellorder", "fromBalance", "toBalance", "newTrade", "minQty", "minTotal", "priceDecimals", "qtyDecimals"], |
|||
|
|||
data() { |
|||
return { |
|||
contractList: [], |
|||
detail:[], |
|||
isMarket: true, |
|||
isCondition: false, |
|||
userBanlance: null, |
|||
|
|||
cacheTotal: 0, // 存放市价单输入的总值 |
|||
cachePrice: null, // 存放最新价格 |
|||
|
|||
activeContract:[], |
|||
// 气泡弹框内容和触发 |
|||
visibles: { |
|||
"buy": { |
|||
limitPrice: false, // 限制价格 |
|||
limitAmount: false, // 限制数量 |
|||
marketTotal: false, // 限制总额 |
|||
marketAmount: false, // 市价数量 |
|||
trigger: false, // 触发价格 |
|||
orderTotal: false, // 订单总额 |
|||
}, |
|||
"sell": { |
|||
limitPrice: false, |
|||
limitAmount: false, |
|||
marketTotal: false, |
|||
marketAmount: false, |
|||
trigger: false, |
|||
orderTotal: false, |
|||
}, |
|||
}, |
|||
msgList: { |
|||
"buy": Array(6).fill(''), // 5个空字符串的数组 |
|||
"sell": Array(6).fill('') |
|||
}, |
|||
// 百分比集合 |
|||
percentage: [{ |
|||
label: "25%", |
|||
value: 0.25 |
|||
}, |
|||
{ |
|||
label: "50%", |
|||
value: 0.5 |
|||
}, |
|||
{ |
|||
label: "75%", |
|||
value: 0.75 |
|||
}, |
|||
{ |
|||
label: "100%", |
|||
value: 1 |
|||
}, |
|||
], |
|||
// |
|||
buyPercentIndex: null, |
|||
sellPercentIndex: null, |
|||
} |
|||
}, |
|||
|
|||
computed: { |
|||
|
|||
|
|||
_activeContract(val) { |
|||
Market.getMarketList().then(data => { |
|||
|
|||
let contractList = data[0] |
|||
.map(item => item.marketInfoList) |
|||
.flat() |
|||
.find(item => item.symbol == this.activeSymbol) || {} |
|||
|
|||
}).catch(err => {}); |
|||
|
|||
|
|||
// console.log("market detail") |
|||
// console.log(val) |
|||
// let contractList = this.contractList |
|||
// .map(item => item.marketInfoList) |
|||
// .flat() |
|||
// .find(item => item.symbol == this.activeSymbol) || {} |
|||
// if (val.price) { |
|||
// delete contractList.price |
|||
// } |
|||
// console.log(contractList) |
|||
return contractList; |
|||
}, |
|||
|
|||
// 获取type类型值 |
|||
type() { |
|||
if (!this.isCondition) { |
|||
return this.isMarket ? 2 : 1; |
|||
} else { |
|||
return this.isMarket ? 4 : 3; |
|||
} |
|||
}, |
|||
|
|||
theme() { |
|||
return localStorage.theme ? localStorage.theme : "light"; |
|||
}, |
|||
|
|||
buyTotal: { |
|||
get() { |
|||
if (!this.isMarket) { |
|||
return Math.multiple(this.buyorder.entrust_price, this.buyorder.amount); |
|||
} else { |
|||
return this.cacheTotal; |
|||
} |
|||
}, |
|||
set(val) { |
|||
// 根据总值 计算数量 |
|||
if (!this.isMarket) { |
|||
this.buyorder.amount = Math.division(val, this.buyorder.entrust_price); |
|||
} else { // 市价单 缓存总值 |
|||
this.cacheTotal = val; |
|||
} |
|||
} |
|||
}, |
|||
|
|||
sellTotal: { |
|||
get() { |
|||
return Math.multiple(this.sellorder.entrust_price, this.sellorder.amount); |
|||
} |
|||
}, |
|||
|
|||
// 当前语言 |
|||
lang() { |
|||
let browser_Lang = navigator.language.includes('zh') ? 'zh' : 'en'; |
|||
return localStorage.lang || browser_Lang; |
|||
}, |
|||
|
|||
}, |
|||
|
|||
watch: { |
|||
custom(newVal) { |
|||
console.log(newVal) |
|||
}, |
|||
|
|||
type() { |
|||
// 切换订单类型时 清空价格和数量 |
|||
// 数量改变时 触发percentage更新 |
|||
this.reset(); |
|||
}, |
|||
|
|||
// 有新交易时触发 给限价单设定初始价格 |
|||
newTrade(newVal, oldVal) { |
|||
// if (!this.isMarket ) { |
|||
|
|||
// 新交易对有trade数据 |
|||
if (!oldVal && newVal) { // 没值到初始化值 |
|||
// 修改order里面price的值 |
|||
this.cachePrice = newVal.price; |
|||
this.reset(); |
|||
} |
|||
|
|||
// 切换交易对时 清空了数据 |
|||
if (oldVal && !newVal) { // 有值到没值的过程 |
|||
this.cachePrice = null; |
|||
this.reset(); |
|||
} |
|||
// } |
|||
}, |
|||
symbol(){ |
|||
this.getCoinInfo() |
|||
} |
|||
}, |
|||
|
|||
methods: { |
|||
// 获取合约市场 |
|||
getMarketList() { |
|||
|
|||
Contract.getMarketList().then(res => { |
|||
this.contractList = res[0]; |
|||
//console.log("%c%s","color:green","market res") |
|||
let tmpList = res[0].marketInfoList; |
|||
for(i=0;i<tmpList.length;i++){ |
|||
let tcurCoin = tmpList[i] |
|||
if(tcurCoin.symbol.toLowerCase()+"usdt" === this.symbol){ |
|||
this.activeContract = tcurCoin |
|||
} |
|||
} |
|||
|
|||
// |
|||
this.activeContract = filterList |
|||
// 默认值 |
|||
let firstParent = res[0]; |
|||
if (firstParent) { |
|||
let first = firstParent.marketInfoList[0]; |
|||
if (first) this.activeSymbol = first.symbol; |
|||
} |
|||
}); |
|||
}, |
|||
getCoinInfo(){ |
|||
// console.log(this.symbol.indexOf('usdt')!=-1) |
|||
if(this.symbol.indexOf('usdt')!=-1){ |
|||
var market=this.symbol.substring(0,this.symbol.length-4); |
|||
}else{ |
|||
var market=this.symbol.substring(0,this.symbol.length-3); |
|||
} |
|||
console.log("%c%s","#ccff00","currnet market") |
|||
console.log(market) |
|||
let data = { |
|||
coin_name:market, |
|||
lang:this.lang |
|||
} |
|||
|
|||
//点击会跟随变化 |
|||
let tmpList = this.contractList.marketInfoList; |
|||
for(i=0;i<tmpList.length;i++){ |
|||
let tcurCoin = tmpList[i] |
|||
if(tcurCoin.symbol.toLowerCase()+"usdt" === this.symbol){ |
|||
this.activeContract = tcurCoin |
|||
} |
|||
} |
|||
|
|||
Market.getCoinInfo(data).then(res => { |
|||
this.detail = res |
|||
}).catch(err => { |
|||
}); |
|||
}, |
|||
renderBuyAmount(val, index) { |
|||
console.info(val) |
|||
console.info(this.buyorder) |
|||
if (!this.buyorder.entrust_price) { |
|||
this.visibles.buy.limitPrice = true; |
|||
this.msgList.buy[1] = this.$t('nav.set'); |
|||
this.clearAll(); |
|||
return; |
|||
} |
|||
this.buyPercentIndex = index; |
|||
this.buyTotal = Math.multiple(this.fromBalance, val); |
|||
}, |
|||
|
|||
renderSellAmount(val, index) { |
|||
if (!this.sellorder.entrust_price) { |
|||
this.visibles.sell.limitPrice = true; |
|||
this.msgList.sell[1] = this.$t('nav.set'); |
|||
this.clearAll(); |
|||
return; |
|||
} |
|||
this.sellPercentIndex = index; |
|||
this.sellorder.amount = Math.multiple(this.toBalance, val); |
|||
}, |
|||
|
|||
handleBuyOrder() { |
|||
|
|||
// 执行前端的有效性验证 |
|||
if (!this.chkValidate(this.buyorder, this.buyTotal, "buy")) return; |
|||
|
|||
const baseArgs = { |
|||
symbol: this.pair.to.concat('/', this.pair.from), |
|||
type: this.type, |
|||
}; |
|||
|
|||
// 区分限价、市价和条件委托单 |
|||
// 1、限价单买入时 需要的参数：价格、数量、 |
|||
// 2、市价单买入时 需要的参数：总值 |
|||
// 3、条件单买入时 需要的参数：触发价、价格数量或者总值 |
|||
// 4、卖出时 需要价格和数量 |
|||
Exchange.storeEntrust(Object.assign(this.buyorder, { |
|||
total: this.buyTotal, |
|||
}, baseArgs)).then(data => { |
|||
// 触发父组件的方法 更新余额和订单 |
|||
this.$emit('update'); |
|||
// 清空表单 |
|||
this.reset(); |
|||
}).catch(err => { |
|||
|
|||
}); |
|||
}, |
|||
|
|||
|
|||
handleSellOrder() { |
|||
// 执行前端的有效性验证 |
|||
if (!this.chkValidate(this.sellorder, this.sellTotal, "sell")) return; |
|||
// console.info(this.sellTotal) |
|||
const baseArgs = { |
|||
symbol: this.pair.to.concat('/', this.pair.from), |
|||
type: this.type, |
|||
}; |
|||
Exchange.storeEntrust(Object.assign(this.sellorder, { |
|||
total: this.sellTotal |
|||
}, baseArgs)).then(data => { |
|||
// 触发父组件的方法 更新余额和订单 |
|||
this.$emit('update'); |
|||
// 清空表单 |
|||
this.reset(); |
|||
}).catch(err => { |
|||
|
|||
}); |
|||
}, |
|||
|
|||
reset() { |
|||
|
|||
// 如果没有newTrade时 则没有缓存价格 重置为最小值0 |
|||
// 由于输入框去除了精度空值 这里还需要手动设置精度值 |
|||
let price = this.cachePrice || 0; |
|||
// console.info(price) |
|||
// console.info(this.priceDecimals) |
|||
this.buyorder.entrust_price = Math.omitTo(price, this.priceDecimals); |
|||
this.buyorder.trigger_price = Math.omitTo(price, this.priceDecimals); |
|||
|
|||
this.sellorder.entrust_price = Math.omitTo(price, this.priceDecimals); |
|||
// console.info(this.sellorder.entrust_price) |
|||
this.sellorder.trigger_price = Math.omitTo(price, this.priceDecimals); |
|||
|
|||
// 清空数量 |
|||
this.buyorder.amount = 0; |
|||
this.sellorder.amount = 0; |
|||
|
|||
// total赋值会触发set方法 |
|||
// this.buyTotal = 0; |
|||
// this.cacheTotal = 0; |
|||
|
|||
// 去除百分比样式 |
|||
this.buyPercentIndex = -1; |
|||
this.sellPercentIndex = -1; |
|||
}, |
|||
|
|||
clearAll() { |
|||
// 5s后统一清除提示框 |
|||
setTimeout(function () { |
|||
Object.keys(this.visibles.buy).forEach(key => this.visibles.buy[key] = false); |
|||
Object.keys(this.visibles.sell).forEach(key => this.visibles.sell[key] = false); |
|||
}.bind(this), 5000); |
|||
}, |
|||
|
|||
empty(val) { |
|||
let ret; |
|||
switch (typeof val) { |
|||
case "number": |
|||
ret = val == 0; |
|||
break; |
|||
case "string": |
|||
ret = val == "0" || /^\s?$/.test(val); |
|||
break; |
|||
case "boolean": |
|||
ret = val; |
|||
break; |
|||
default: |
|||
ret = Boolean(val); |
|||
break; |
|||
} |
|||
return ret; |
|||
}, |
|||
|
|||
chkValidate(order, total, orderType) { |
|||
// |
|||
// 验证登录 |
|||
if (!this.isLogin) { |
|||
this.$confirm(this.$t('nav.login'), { |
|||
confirmButtonText:this.$t('common.confirmBtn'), |
|||
cancelButtonText: this.$t('common.cancelBtn'), |
|||
type: 'warning' |
|||
}).then(() => { |
|||
this.$router.push(`/sign-in`); |
|||
}).catch(); |
|||
return; |
|||
} |
|||
|
|||
let flag = true; |
|||
|
|||
switch (this.type) { |
|||
|
|||
case 1: // limit |
|||
if (this.empty(order.entrust_price)) { |
|||
flag = false; |
|||
this.visibles[orderType].limitPrice = true; |
|||
this.msgList[orderType][1] = this.$t('nav.a1'); |
|||
} else if (this.empty(order.amount)) { |
|||
flag = false; |
|||
this.visibles[orderType].limitAmount = true; |
|||
this.msgList[orderType][2] = this.$t('nav.a2'); |
|||
} else { |
|||
if (order.amount < this.minQty) { |
|||
flag = false; |
|||
this.visibles[orderType].limitAmount = true; |
|||
this.msgList[orderType][2] = this.$t('nav.a3')+`${this.minQty}`; |
|||
} |
|||
|
|||
if (total < this.minTotal) { |
|||
flag = false; |
|||
this.visibles[orderType].orderTotal = true; |
|||
this.msgList[orderType][5] = this.$t('exchange.total')+`${this.minTotal}`; |
|||
} |
|||
} |
|||
break; |
|||
|
|||
case 2: // market |
|||
if (order.direction == "buy") { // 买 |
|||
if (this.empty(total)) { |
|||
flag = false; |
|||
this.visibles[orderType].marketTotal = true; |
|||
this.msgList[orderType][3] = this.$t('nav.a4'); |
|||
} else if (this.total < this.minTotal) { |
|||
flag = false; |
|||
this.visibles.marketTotal = true; |
|||
this.msgList[3] = this.$t('nav.a5')+` ${this.minTotal}`; |
|||
} |
|||
} |
|||
|
|||
if (order.direction == "sell") { // 卖 |
|||
if (this.empty(order.amount)) { |
|||
flag = false; |
|||
this.visibles[orderType].marketAmount = true; |
|||
this.msgList[orderType][4] = this.$t('nav.a6'); |
|||
} else if (order.amount < this.minQty) { |
|||
flag = false; |
|||
this.visibles[orderType].marketAmount = true; |
|||
this.msgList[orderType][4] = this.$t('nav.a7')+` ${this.minQty}`; |
|||
} |
|||
} |
|||
break; |
|||
|
|||
case 3: // stop-limit |
|||
|
|||
if (this.empty(order.trigger_price)) { |
|||
flag = false; |
|||
this.visibles[orderType].trigger = true; |
|||
this.msgList[orderType][0] = this.$t('nav.a8') |
|||
} else if (this.empty(order.entrust_price)) { |
|||
flag = false; |
|||
this.visibles[orderType].limitPrice = true; |
|||
this.msgList[orderType][1] = this.$t('nav.a9') |
|||
} else if (this.empty(order.amount)) { |
|||
flag = false; |
|||
this.visibles[orderType].limitAmount = true; |
|||
this.msgList[orderType][2] = this.$t('nav.b1') |
|||
} |
|||
break; |
|||
|
|||
case 4: // stop-market |
|||
if (this.empty(order.trigger_price)) { |
|||
flag = false; |
|||
this.visibles[orderType].trigger = true; |
|||
this.msgList[orderType][0] = this.$t('nav.b2') |
|||
} else { |
|||
|
|||
if (order.direction == "buy") { |
|||
if (this.empty(total)) { |
|||
flag = false; |
|||
this.visibles[orderType].marketTotal = true; |
|||
this.msgList[orderType][3] = this.$t('nav.b3') |
|||
} else if (total < this.minTotal) { |
|||
flag = false; |
|||
this.visibles[orderType].marketTotal = true; |
|||
this.msgList[orderType][3] = this.$t('nav.b5')+` ${this.minTotal}` |
|||
} |
|||
} |
|||
|
|||
if (order.direction == "sell") { |
|||
if (this.empty(order.amount)) { |
|||
flag = false; |
|||
this.visibles[orderType].marketAmount = true; |
|||
this.msgList[orderType][4] = this.$t('nav.b6') |
|||
} else if (order.amount < this.minQty) { |
|||
flag = false; |
|||
this.visibles[orderType].marketAmount = true; |
|||
this.msgList[orderType][4] =this.$t('nav.b7')+ ` ${this.minQty}` |
|||
} |
|||
} |
|||
|
|||
} |
|||
break; |
|||
} |
|||
|
|||
// 清除所有样式 |
|||
this.clearAll(); |
|||
|
|||
// 返回验证结果 |
|||
return flag; |
|||
}, |
|||
|
|||
}, |
|||
|
|||
created() { |
|||
this.getMarketList(); |
|||
this.getCoinInfo() |
|||
this.reset(); |
|||
}, |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.buyPercentActive { |
|||
a:link { |
|||
font-weight: bold; |
|||
background: #26a69a; |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
.sellPercentActive { |
|||
a:link { |
|||
font-weight: bold; |
|||
background: #ef5350; |
|||
color: #fff; |
|||
} |
|||
} |
|||
|
|||
.input-group-text { |
|||
width: 68px; |
|||
@include flexible(row, center, center); |
|||
} |
|||
|
|||
.market-trade { |
|||
border: none; |
|||
border-color: transparent; |
|||
} |
|||
.market{ |
|||
width: 300px; |
|||
height: 500px; |
|||
overflow: scroll; |
|||
display: flex; |
|||
flex-wrap: wrap; |
|||
padding: 10px; |
|||
display: -webkit-box; |
|||
color: black; |
|||
.ov{ |
|||
width: 100%; |
|||
table-layout:fixed; |
|||
word-break:break-all; |
|||
overflow:hidden; |
|||
} |
|||
} |
|||
.p-y-xs{ |
|||
padding: 5px 0; |
|||
} |
|||
.el-button{ |
|||
padding: 0!important; |
|||
background: transparent!important; |
|||
} |
|||
</style> |
|||
File diff suppressed because it is too large
|
Before Width: | Height: | Size: 3.7 KiB |
|
Before Width: | Height: | Size: 4.8 KiB |
|
Before Width: | Height: | Size: 5.1 KiB |
|
Before Width: | Height: | Size: 2.1 KiB |
|
Before Width: | Height: | Size: 4.5 KiB |
|
Before Width: | Height: | Size: 8.3 KiB |
|
Before Width: | Height: | Size: 5.8 KiB |
|
Before Width: | Height: | Size: 2.7 KiB |
|
Before Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 22 KiB |
|
Before Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 720 KiB |
|
Before Width: | Height: | Size: 36 KiB |
|
Before Width: | Height: | Size: 35 KiB |
Some files were not shown because too many files changed in this diff
Loading…
Reference in new issue