feat: 前端全量更新 - 含所有本次需求
- 移除秒合约页面及UI - 合约页Tab改为Position Held/Transaction Record - 存款/提款/转账页增加BTC/ETH - 资产页重构(用户信息+盈亏+多语言) - 注册页改版(匹配新设计稿) - 日文全面翻译+首页菜单多语言 - 代理专属注册链接支持(?code=) - 10个locale文件同步更新
This commit is contained in:
li
@@ -0,0 +1,196 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="listBox" v-for="(item,index) in list" :key="index" :style="'background-color: '+background+';color: '+color">
|
||||
<view class="width-100b height-100 flex align-center justify-between" style="border-bottom: 1px solid rgba(209,209,209,0.3)">
|
||||
<view class="height-90 flex direction-column align-start justify-center">
|
||||
<view class="flex align-center ">
|
||||
<text v-if="currentIndex==4" class="font-28 bold-font margin-r-10">{{item.coinname}}</text>
|
||||
<text class="font-28 bold-font numbold-font">{{item.type=='more'?i18n.cycle.long:i18n.cycle.short}}</text>
|
||||
<text class="font-26 numbold-font" :style="'color:'+fu_color">{{item.coinname}}</text>
|
||||
</view>
|
||||
<text class="font-20 numbold-font" :style="'color:'+fu_color">{{item.createtime}}</text>
|
||||
</view>
|
||||
<text @click="setCheck(item.id,item.zy_price,item.zs_price)" v-if="currentIndex==1"
|
||||
class="font-26 numbold-font weight-bold">{{i18n.cycle.set}}</text>
|
||||
<button v-if="currentIndex==0" @click="revocation(item.id)" class="cu-btn loginBtn"
|
||||
:style="'border: 1rpx solid '+color+';color: '+color">{{i18n.cycle.revoke}}</button>
|
||||
<text v-if="currentIndex==4" class="font-26 color-0165EE">{{statusFilter(item.status)}}</text>
|
||||
</view>
|
||||
<view class="width-100b margin-t-10 flex flex-wrap">
|
||||
<view style="width: 33%;" class="height-70 flex direction-column align-start justify-around">
|
||||
<text class="font-26 nummedium-font">{{Number(item.price).toFixed(price_jd)}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.unit}}</text>
|
||||
</view>
|
||||
<view style="width: 33%;" class="height-70 flex direction-column align-center justify-around">
|
||||
<text class="font-26 nummedium-font">{{parseInt(item.num)}}*{{item.multiple}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.beishu}}</text>
|
||||
</view>
|
||||
<view v-if="item.status==0||item.status==1" style="width: 33%;" class="height-70 flex direction-column align-end justify-around">
|
||||
<text class="font-26 nummedium-font">{{nowPrice.toFixed(price_jd)}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.currPrice}}</text>
|
||||
</view>
|
||||
<view v-if="item.status==2" style="width: 33%;" class="height-70 flex direction-column align-end justify-around">
|
||||
<text class="font-26 nummedium-font">{{Number(item.pc_price).toFixed(price_jd)}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.closing}}</text>
|
||||
</view>
|
||||
<view v-if="item.status==3" style="width: 33%;" class="height-70 flex direction-column align-end justify-around">
|
||||
<text class="font-26 nummedium-font">{{item.updatetime}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.revokeTime}}</text>
|
||||
</view>
|
||||
<view style="width: 33%;" class="margin-t-10 height-70 flex direction-column align-start justify-around">
|
||||
<text class="font-26 nummedium-font">{{item.promise_fee}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.margin}}</text>
|
||||
</view>
|
||||
<view style="width: 33%;" class="margin-t-10 height-70 flex direction-column align-center justify-around">
|
||||
<text class="font-26 nummedium-font">{{item.fee}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.service}}</text>
|
||||
</view>
|
||||
<view v-if="item.status==0||item.status==3" style="width: 33%;" class="margin-t-10 height-70 flex direction-column align-end justify-around">
|
||||
<text class="font-26 nummedium-font">{{item.coinname}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.currency}}</text>
|
||||
</view>
|
||||
<view v-if="item.status==1" style="width: 33%;" class="margin-t-10 height-70 flex direction-column align-end justify-around">
|
||||
<text v-if="item.type=='more'" :class="nowPrice>=item.price?'color-00C481':'color-FF4040'" class="font-24 nummedium-font">{{((nowPrice - item.price)*item.num*shizhi).toFixed(6)}}</text>
|
||||
<text v-if="item.type=='free'" :class="item.price>nowPrice?'color-00C481':'color-FF4040'" class="font-24 nummedium-font">{{((item.price - nowPrice)*item.num*shizhi).toFixed(6)}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.profit}}</text>
|
||||
</view>
|
||||
<view v-if="item.status==2" style="width: 33%;" class="margin-t-10 height-70 flex direction-column align-end justify-around">
|
||||
<text :class="item.income>=0?'color-00C481':'color-FF4040'" class="font-26 nummedium-font">{{item.income||0}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.profit}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="currentIndex==1" class="width-100b height-50 margin-t-10 flex align-center justify-end">
|
||||
<button v-if="currentIndex==1" @click="closeOut(item.id)" class="cu-btn loginBtn1">{{i18n.cycle.close}}</button>
|
||||
</view>
|
||||
<view v-if="currentIndex==4" class="">
|
||||
<view v-if="item.status==0" class="width-100b height-50 margin-t-10 flex align-center justify-end">
|
||||
<button @click="revocation(item.id)" class="cu-btn loginBtn" :style="'color:'+color+';border: 1rpx solid '+color+';'">{{i18n.cycle.revoke}}</button>
|
||||
</view>
|
||||
<view v-if="item.status==1" class="width-100b height-50 margin-t-10 flex align-center justify-between">
|
||||
<text @click="setCheck(item.id,item.zy_price,item.zs_price)" class="font-26 numbold-font weight-bold">{{i18n.cycle.set}}</text>
|
||||
<button @click="closeOut(item.id)" class="cu-btn loginBtn1">{{i18n.cycle.close}}</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="">
|
||||
<view v-if="loading" class="width-100b padding-c-50 flex align-center justify-center">
|
||||
<u-loading show mode="flower" size="40"></u-loading>
|
||||
</view>
|
||||
<view v-if="!loading&&list.length==0" class="width-100b padding-c-50 flex direction-column align-center justify-center">
|
||||
<text class="font-28 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.nodata}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:'contractListItem',
|
||||
props: {
|
||||
//标题
|
||||
list: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
currentIndex: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
loading: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
nowPrice:{//币种当前价格
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
shizhi:{//设备比例
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
price_jd:{
|
||||
type: Number,
|
||||
default: 4
|
||||
},
|
||||
background:{
|
||||
type: String,
|
||||
default: '#ffffff'
|
||||
},
|
||||
color:{
|
||||
type: String,
|
||||
default: '#17181A'
|
||||
},
|
||||
fu_color:{
|
||||
type: String,
|
||||
default: '#B7B7B7'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
i18n() {
|
||||
return this.$t('message');
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
statusFilter(index){
|
||||
return this.i18n.cycle.tablist1State[index]
|
||||
},
|
||||
// 撤销
|
||||
revocation(id) {
|
||||
uni.showLoading({
|
||||
mask:true
|
||||
})
|
||||
setTimeout(()=>{
|
||||
uni.hideLoading()
|
||||
this.$emit('revocation',id)
|
||||
},2500)
|
||||
},
|
||||
// 平仓
|
||||
closeOut(id) {
|
||||
uni.showLoading({
|
||||
mask:true
|
||||
})
|
||||
setTimeout(()=>{
|
||||
uni.hideLoading()
|
||||
this.$emit('closeOut',id)
|
||||
},2500)
|
||||
},
|
||||
// 设置止盈止损
|
||||
setCheck(id,zy_price,zs_price) {
|
||||
this.$emit('setCheck',id,zy_price,zs_price)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.listBox{
|
||||
width: 100%;
|
||||
/* height: 186rpx; */
|
||||
padding: 20rpx 30rpx;
|
||||
margin: 0 auto 20rpx;
|
||||
/* background: #FFFFFF; */
|
||||
}
|
||||
.loginBtn{
|
||||
width: 190rpx;
|
||||
padding: 0 18rpx;
|
||||
height: 48rpx;
|
||||
background: rgba(0,0,0,0) !important;
|
||||
border-radius: 4rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.loginBtn1{
|
||||
width: 190rpx;
|
||||
padding: 0 18rpx;
|
||||
height: 48rpx;
|
||||
border-radius: 4rpx;
|
||||
color: #FFFFFF;
|
||||
background: #3ECEB2 !important;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,103 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<text :class="seconds<10?'warning_w':''" :style="'color:'+color" class="title">{{seconds<0?i18n.cycle.closeing:seconds+' s'}}</text>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'countTime',
|
||||
props: {
|
||||
// 倒计时的时间，秒为单位
|
||||
timestamp: {
|
||||
type: [Number, String],
|
||||
default: 0
|
||||
},
|
||||
// 是否自动开始倒计时
|
||||
autoplay: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
color:{
|
||||
type: String,
|
||||
default: '#fff'
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
// 监听时间戳的变化
|
||||
timestamp(newVal, oldVal) {
|
||||
// 如果倒计时间发生变化，清除定时器，重新开始倒计时
|
||||
this.clearTimer();
|
||||
this.start();
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
i18n() {
|
||||
return this.$t('message');
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
timer: null ,// 定时器
|
||||
seconds: 0, // 记录不停倒计过程中变化的秒数
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
// 如果自动倒计时
|
||||
this.autoplay && this.timestamp && this.start();
|
||||
},
|
||||
methods: {
|
||||
// 倒计时
|
||||
start() {
|
||||
// 避免可能出现的倒计时重叠情况
|
||||
this.clearTimer();
|
||||
if (this.timestamp <= 0) return;
|
||||
this.seconds = Number(this.timestamp);
|
||||
this.timer = setInterval(() => {
|
||||
this.seconds--;
|
||||
// 发出change事件
|
||||
// this.$emit('change', this.seconds);
|
||||
if (this.seconds < 0) {
|
||||
return this.end();
|
||||
}
|
||||
}, 1000);
|
||||
},
|
||||
// 停止倒计时
|
||||
end() {
|
||||
this.clearTimer();
|
||||
// 倒计时结束后等待2秒再刷新订单,因为服务器处理订单数据买卖需要时间
|
||||
setTimeout(()=>{
|
||||
this.$emit('end', {});
|
||||
},2500)
|
||||
},
|
||||
// 清除定时器
|
||||
clearTimer() {
|
||||
if(this.timer) {
|
||||
// 清除定时器
|
||||
clearInterval(this.timer);
|
||||
this.timer = null;
|
||||
}
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
clearInterval(this.timer);
|
||||
this.timer = null;
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.title{
|
||||
font-size: 24rpx;
|
||||
font-family: "NumMedium" !important;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
.normal_w{
|
||||
color: #fff;
|
||||
}
|
||||
.warning_w{
|
||||
color: #FF4040;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,153 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="listBox" v-for="(item,index) in list" :key="index" :style="'background-color: '+background+';color: '+color">
|
||||
<view class="width-100b height-60 flex align-center justify-between" style="border-bottom: 1px solid rgba(209,209,209,0.3)">
|
||||
<view class="height-90 flex direction-column align-start justify-center">
|
||||
<view class="flex align-center ">
|
||||
<text class="font-28 bold-font numbold-font">{{item.rise_or_fall=='rise'?i18n.cycle.up:i18n.cycle.down}}</text>
|
||||
<text class="font-26 numbold-font" :style="'color:'+fu_color">{{item.show_name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="width-100b margin-t-10 flex flex-wrap">
|
||||
<view style="width: 33%;" class="height-70 flex direction-column align-start justify-around">
|
||||
<text class="font-26 nummedium-font">{{Number(item.current_price).toFixed(price_jd)}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.unit}}</text>
|
||||
</view>
|
||||
<view style="width: 33%;" class="height-70 flex direction-column align-center justify-around">
|
||||
<text class="font-26 nummedium-font">{{Number(item.trade_num).toFixed(price_jd)}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.tradeNumber}}</text>
|
||||
</view>
|
||||
<view v-if="currentIndex==0" style="width: 33%;" class="height-70 flex direction-column align-end justify-around">
|
||||
<!-- <text class="font-24 nummedium-font">{{timeCount(item.createtime+item.trade_cycle-item.nowtime)}}s</text> -->
|
||||
<countTime @end="timeCount" :autoplay="true" :timestamp="item.createtime+item.trade_cycle-item.nowtime" ></countTime>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.countTime}}</text>
|
||||
</view>
|
||||
<view v-if="currentIndex==1" style="width: 33%;" class="height-70 flex direction-column align-end justify-around">
|
||||
<text class="font-26 nummedium-font">{{item.trade_cycle}}s</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.tradingCycle}}</text>
|
||||
</view>
|
||||
<view v-if="currentIndex==0" style="width: 33%;" class="margin-t-10 height-70 flex direction-column align-start justify-around">
|
||||
<text class="font-26 nummedium-font">{{Number(nowPrice).toFixed(price_jd)}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.currPrice}}</text>
|
||||
</view>
|
||||
<view v-if="currentIndex==1" style="width: 33%;" class="margin-t-10 height-70 flex direction-column align-start justify-around">
|
||||
<text class="font-26 nummedium-font">{{Number(item.close_price).toFixed(price_jd)}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.closing}}</text>
|
||||
</view>
|
||||
<view style="width: 33%;" class="margin-t-10 height-70 flex direction-column align-center justify-around">
|
||||
<text v-if="currentIndex==0" class="font-26 nummedium-font">{{item.open_time}}</text>
|
||||
<text v-if="currentIndex==1" class="font-26 nummedium-font">{{item.createtime}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.complete}}</text>
|
||||
</view>
|
||||
<view v-if="currentIndex==0" style="width: 33%;" class="margin-t-10 height-70 flex direction-column align-end justify-around">
|
||||
<text v-if="item.rise_or_fall=='rise'" :class="nowPrice>item.current_price?'color-00C481':'color-FF4040'" class="font-24 nummedium-font">{{nowPrice>item.current_price?item.expect_income:'-'+item.trade_num}}</text>
|
||||
<text v-if="item.rise_or_fall=='fall'" :class="item.current_price>nowPrice?'color-00C481':'color-FF4040'" class="font-24 nummedium-font">{{item.current_price>nowPrice?item.expect_income:'-'+item.trade_num}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.profit}}</text>
|
||||
</view>
|
||||
<view v-if="currentIndex==1" style="width: 33%;" class="margin-t-10 height-70 flex direction-column align-end justify-around">
|
||||
<text :class="item.trade_result=='win'?'color-00C481':'color-FF4040'" class="font-26 nummedium-font ">{{Number(item.trade_result_num).toFixed(price_jd)}}</text>
|
||||
<text class="font-24 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.profit}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="">
|
||||
<view v-if="loading" class="width-100b padding-c-50 flex align-center justify-center">
|
||||
<u-loading show mode="flower" size="40"></u-loading>
|
||||
</view>
|
||||
<view v-if="!loading&&list.length==0"
|
||||
class="width-100b padding-c-50 flex direction-column align-center justify-center">
|
||||
<text class="font-28 nummedium-font" :style="'color:'+fu_color">{{i18n.cycle.nodata}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import countTime from './count-time.vue'
|
||||
export default {
|
||||
components: {
|
||||
countTime,
|
||||
},
|
||||
name: 'secondListItem',
|
||||
props: {
|
||||
//标题
|
||||
list: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
currentIndex: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
loading: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
nowPrice: { //币种当前价格
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
price_jd:{
|
||||
type: Number,
|
||||
default: 4
|
||||
},
|
||||
background:{
|
||||
type: String,
|
||||
default: '#ffffff'
|
||||
},
|
||||
color:{
|
||||
type: String,
|
||||
default: '#fff'
|
||||
},
|
||||
fu_color:{
|
||||
type: String,
|
||||
default: '#B7B7B7'
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
i18n() {
|
||||
return this.$t('message');
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
timeCount() {
|
||||
this.$emit('timeOut');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.listBox {
|
||||
width: 100%;
|
||||
/* height: 186rpx; */
|
||||
padding: 20rpx 30rpx;
|
||||
margin: 0 auto 20rpx;
|
||||
/* background: #FFFFFF; */
|
||||
}
|
||||
|
||||
.loginBtn {
|
||||
width: 120rpx;
|
||||
height: 48rpx;
|
||||
background: #FFFFFF !important;
|
||||
border: 1rpx solid #0165EE;
|
||||
border-radius: 4rpx;
|
||||
color: #0165EE;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.loginBtn1 {
|
||||
width: 120rpx;
|
||||
height: 48rpx;
|
||||
border-radius: 4rpx;
|
||||
color: #FFFFFF;
|
||||
background: #0165EE !important;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
</style>
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,606 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<z-paging ref="paging" refresher-only @onRefresh="onRefresh">
|
||||
<!-- 顶部标题 -->
|
||||
<view slot="top" class="width-100b flex align-center justify-between padding-w-30 bj-102030"
|
||||
:style="{height: `calc(${statusBar}px + 100rpx)`,paddingTop:`${statusBar}px`}">
|
||||
<view class="flex align-center">
|
||||
<i @click="router.goBack()" class="cuIcon-back font-40 margin-r-20 color-white"></i>
|
||||
<view @click="leftshow = true" class="width-360 flex align-center">
|
||||
<image class="width-40 height-40" src="/static/imgs/transaction/left6@2x.png" mode=""></image>
|
||||
<text class="font-36 numbold-font margin-w-15 color-white">{{coinInfo.show_name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="relative">
|
||||
<view class="height-140 bj-102030 padding-w-32 flex align-center justify-between">
|
||||
<view class="height-100 flex direction-column align-start justify-between">
|
||||
<text :class="zhangdie>=0?'color-12B886':'color-E27046'" class="font-50 numbold-font">{{Number(lastData.close||0).toFixed(coinInfo.price_jd)}}</text>
|
||||
<text :class="zhangdie>=0?'color-12B886':'color-E27046'" class="font-32 nummedium-font">{{zhangdie}}%</text>
|
||||
</view>
|
||||
<view class="height-90 flex direction-column align-start justify-between">
|
||||
<text class="font-26 color-F2F5FF">{{i18n.line.highprice}} {{Number(dayData.high).toFixed(coinInfo.price_jd)||0}}</text>
|
||||
<text class="font-26 color-F2F5FF">{{i18n.line.lowprice}} {{Number(dayData.low).toFixed(coinInfo.price_jd)||0}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="width: 750rpx; display: block;height: 816rpx; margin-top: 8rpx;">
|
||||
<!-- K线 -->
|
||||
<iframe style="width: 750rpx;height: 816rpx;overflow: hidden" :src="Ksrc"
|
||||
frameborder="0"></iframe>
|
||||
</view>
|
||||
<!-- 秒合约交易tab选择 -->
|
||||
<view class="width-100b bj-102030 height-72 padding-w-40 flex align-center justify-between">
|
||||
<view @click="tabsChange2(index)" class="flex-1 height-46 flex direction-column align-center justify-between" v-for="(item,index) in tablist2" :key="index">
|
||||
<text :class="current2==index?'bold-font color-1881D2':'color-9FBEDC medium-font'" class="font-28">{{item}}</text>
|
||||
<view :style="current2==index?'':'visibility: hidden;'" class="heng"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 秒合约交易列表 -->
|
||||
<swiper :class="contractOrderList_s.length>2?'swiper':'swiper_no'" :current="current2" @animationfinish="animationfinish2"
|
||||
@change="onswiperchange2">
|
||||
<swiper-item v-for="(item,index) in tablist2" class="swiper-item" style="height: 100%;">
|
||||
<scroll-view scroll-y="true" style="height: 100%;" @scrolltolower="pullTorefresh_s">
|
||||
<secondListItem @timeOut="timeOut" :currentIndex="current2" :loading="loading_s"
|
||||
:list="contractOrderList_s" :nowPrice="lastData.close"></secondListItem>
|
||||
<view class="height-140">
|
||||
|
||||
</view>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</z-paging>
|
||||
|
||||
<view class="height-140 fixed width-100b bj-102030 flex align-center justify-between padding-w-32" style="bottom: 0px;">
|
||||
<view @click="riseTimeType=true" class="flex-1 height-100 flex align-center justify-between radiu-8 margin-r-8" style="border: 1px solid #0B1622;">
|
||||
<view class="flex-1 flex direction-column align-center justify-center">
|
||||
<text class="font-24 color-F2F5FF">{{i18n.cycle.num}}</text>
|
||||
<text class="font-24 color-F2F5FF">{{riseNumber}}</text>
|
||||
</view>
|
||||
<view class="flex-1 flex direction-column align-center justify-center">
|
||||
<text class="font-24 color-F2F5FF">{{i18n.fastBuy.text12}}</text>
|
||||
<text class="font-24 color-F2F5FF">{{riseTime}}s</text>
|
||||
</view>
|
||||
<view class="flex-1 flex direction-column align-center justify-center">
|
||||
<text class="font-24 color-F2F5FF">{{i18n.cycle.rate}}</text>
|
||||
<text class="font-24 color-F2F5FF">{{Number(coinInfo.winpl*100).toFixed(2)}} %</text>
|
||||
</view>
|
||||
<i class="cuIcon-unfold font-28 color-1881D2"></i>
|
||||
</view>
|
||||
<view class="flex align-center justify-end">
|
||||
<view @click="buyRise('rise')" class="width-164 height-100 bj-12B886 radiu-8 margin-r-8 text-center line-height-100">
|
||||
<text class="font-36 color-white">{{i18n.cycle.up}}</text>
|
||||
</view>
|
||||
<view @click="buyRise('fall')" class="width-164 height-100 bj-E27046 radiu-8 text-center line-height-100">
|
||||
<text class="font-36 color-white">{{i18n.cycle.down}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 左侧弹出 -->
|
||||
<u-popup v-model="leftshow" mode="left">
|
||||
<view class="width-600 bj-102030" style="padding: 70rpx 0rpx;height:100%;display: flex;flex-direction: column;">
|
||||
<view class="height-110 flex align-center padding-w-30">
|
||||
<text class="font-32 bold-font color-white">{{i18n.newWord.Trading}}</text>
|
||||
</view>
|
||||
<scroll-view scroll-y="true" style="overflow: scroll;flex: 1;">
|
||||
<view class="padding-w-30">
|
||||
<view @click="changeCoin(index,1)" class="width-100b height-78 flex align-center justify-between" v-for="(item,index) in midList" :key="index" style="border-bottom: 1rpx solid #2C364B;">
|
||||
<view class="flex align-center">
|
||||
<image class="width-36 height-36 margin-w-10" :src="item.logo_image" mode=""></image>
|
||||
<text class="font-28 nummedium-font color-white">{{item.name}}<span class="font-26 color-F2F5FF nummedium-font">/USDT</span></text>
|
||||
</view>
|
||||
<text class="font-28 nummedium-font color-white">
|
||||
{{coinInfo.name==item.name&&lastData.close? (Number(lastData.close||0).toFixed(item.price_jd)) : Number(item.close).toFixed(item.price_jd)}}</text>
|
||||
<text v-if="coinInfo.name==item.name&&lastData.close" class="font-28 nummedium-font"
|
||||
:class="zhangdie>=0?'color-12B886':'color-E27046'">{{zhangdie}}%</text>
|
||||
<text v-else class="font-28 nummedium-font"
|
||||
:class="item.increase>0?'color-12B886':'color-E27046'">{{Number(item.increase*100).toFixed(2)}}%</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
<!-- 实名认证弹窗 -->
|
||||
<u-popup style="z-index: 10100;" border-radius="4" mode="center" v-model="TSShow">
|
||||
<view class="width-600 padding-b-20 bj-102030">
|
||||
<view class="width-100b height-220 padding-w-30 padding-c-40 flex direction-column align-center justify-between">
|
||||
<image class="width-64 height-64" src="/static/imgs/quantify/tongzhi@2x.png" mode=""></image>
|
||||
<view class="font-28 bold-font text-center padding-w-20 color-white">{{shimingTitle}}</view>
|
||||
</view>
|
||||
<view class="width-100b height-90 flex align-center justify-center">
|
||||
<view @click="router.push('/pages/my/safety/real')" class="qcbtn3">{{i18n.cycle.shiming}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
<u-popup style="z-index: 999;" mode="bottom" v-model="riseTimeType">
|
||||
<view class="padding-w-30" style="background-color: #202833;">
|
||||
<view class="height-70 line-height-70">
|
||||
<text class="font-28 color-F2F5FF">{{i18n.cycle.moshi}}</text>
|
||||
</view>
|
||||
<view class="height-79 flex align-center">
|
||||
<view class="xuanzhebox">
|
||||
<text>USDT</text>
|
||||
<image class="width-60 height-60 absolute" style="right: 0rpx;" src="/static/imgs/new/gou1.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="height-70 line-height-70">
|
||||
<text class="font-28 color-F2F5FF">{{i18n.cycle.open}}</text>
|
||||
</view>
|
||||
<view class="flex flex-wrap">
|
||||
<view @click="riseNumber=item" class="xuanzhebox margin-c-8 margin-r-10" v-for="(item,index) in numlist" :key="index">
|
||||
<text>{{item}}</text>
|
||||
<image v-if="riseNumber==item" class="width-60 height-60 absolute" style="right: 0rpx;" src="/static/imgs/new/gou1.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="">
|
||||
<input class="xuanzhebox padding-w-20" style="width: 338rpx;" type="number" v-model="riseNumber" :placeholder="i18n.cycle.openInput"/>
|
||||
</view>
|
||||
<view class="height-70 line-height-70">
|
||||
<text class="font-28 color-F2F5FF">{{i18n.cycle.time}}</text>
|
||||
</view>
|
||||
<view class="flex flex-wrap">
|
||||
<view @click="riseTime=item" class="xuanzhebox margin-c-8 margin-r-10" v-for="(item,index) in coinInfo.trade_time" :key="index">
|
||||
<text>{{item}} s</text>
|
||||
<image v-if="riseTime==item" class="width-60 height-60 absolute" style="right: 0rpx;" src="/static/imgs/new/gou1.png" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="height-80 flex align-center justify-between">
|
||||
<text class="font-28 nummedium-font color-F2F5FF">{{i18n.cycle.available}} ：<span class="color-12B886">{{Number(count_xh_usdt||0).toFixed(4)}} USDT</span></text>
|
||||
<text class="font-28 nummedium-font color-F2F5FF">{{i18n.cycle.rate}} ：<span class="color-12B886">{{Number(coinInfo.winpl*100).toFixed(2)}} %</span></text>
|
||||
</view>
|
||||
|
||||
<view class="height-140 flex align-center justify-between">
|
||||
<view @click="buyRise('rise')" class="loginBtn bj-12B886">
|
||||
<text class="font-36 color-white">{{i18n.cycle.up}}</text>
|
||||
</view>
|
||||
<view @click="buyRise('fall')" class="loginBtn bj-E27046">
|
||||
<text class="font-36 color-white">{{i18n.cycle.down}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import secondListItem from './components/second_list_item.vue'
|
||||
export default {
|
||||
components: {
|
||||
secondListItem,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
count_xh_usdt:0, //合约可用剩余usdt
|
||||
second_usdt:0, //秒合约可用剩余usdt
|
||||
midList:[], //左侧币种列表
|
||||
coinInfo:{}, //选中的当前币种信息
|
||||
|
||||
statusBar: uni.getSystemInfoSync().statusBarHeight,
|
||||
topTab:2,//顶部选项 1=合约交易 2=秒合约
|
||||
leftshow:false, //左侧弹窗开关
|
||||
|
||||
// 秒合约
|
||||
tablist2:['交易中','已平仓'],
|
||||
current2:0,
|
||||
|
||||
riseNumber:100, //开仓数量
|
||||
riseTime: 0, //开仓时间
|
||||
riseTimeType:false, //开仓时间弹窗开关
|
||||
numlist:['100','200','300','500','1000','2000'],
|
||||
contractOrderList_s:[], //秒合约交易订单列表
|
||||
state_s:'more',
|
||||
page_s:1,
|
||||
loading_s:true,
|
||||
|
||||
BtnFlag:true, //按钮防重复点击
|
||||
TSShow:false,
|
||||
shimingTitle:'请先完成实名认证',
|
||||
|
||||
// socket
|
||||
lastData:'',
|
||||
tick:"",
|
||||
|
||||
myCoinList:[],
|
||||
Ksrc: '',
|
||||
dayData: {
|
||||
high:0,
|
||||
low:0
|
||||
},
|
||||
timer:null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
i18n() {
|
||||
return this.$t('message');
|
||||
},
|
||||
zhangdie() {
|
||||
if (this.lastData.close) {
|
||||
let increase = Number(this.lastData.close) - Number(this.coinInfo.open)
|
||||
return Number(increase / Number(this.coinInfo.open) * 100).toFixed(2)
|
||||
} else {
|
||||
return 0
|
||||
}
|
||||
},
|
||||
},
|
||||
watch:{
|
||||
current2(oldValue,newValue){
|
||||
if(oldValue != newValue){
|
||||
this.refresh_list()
|
||||
}
|
||||
},
|
||||
leftshow(item){
|
||||
if(item==false){
|
||||
|
||||
}else{
|
||||
this.getMore(this.coinInfo.symbol)
|
||||
}
|
||||
}
|
||||
},
|
||||
filters:{
|
||||
//过滤数字位数
|
||||
numFilter(item){
|
||||
if (item == undefined || item == null) {
|
||||
return 0;
|
||||
} else {
|
||||
if(Number(item) < 10){
|
||||
return Number(item).toFixed(6);
|
||||
}else if (Number(item) >= 10 && Number(item) < 1000) {
|
||||
return Number(item).toFixed(4);
|
||||
} else if (Number(item) >= 1000 && Number(item) < 1000000) {
|
||||
return (Number(item) / 1000).toFixed(4) + ' K';
|
||||
} else if (Number(item) >= 1000000 && Number(item) < 10000000000) {
|
||||
return (Number(item) / 1000000).toFixed(2) + ' M';
|
||||
} else {
|
||||
return (Number(item) / 10000000000).toFixed(2) + ' B';
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
onLoad:function(){
|
||||
this.getMore()
|
||||
},
|
||||
onShow() {
|
||||
if(getApp().globalData.symbol == ''){
|
||||
getApp().globalData.symbol = this.coinInfo.symbol
|
||||
console.log(getApp().globalData.symbol )
|
||||
}
|
||||
this.onSocketMessage()
|
||||
this.linkSocket() //链接socket订阅
|
||||
this.tablist2 = this.i18n.cycle.tablist2
|
||||
|
||||
this.TSShow = false
|
||||
this.getWallet()
|
||||
uni.$on('reConnect', (res) => {
|
||||
console.log("重连WebSocket")
|
||||
this.onSocketMessage()
|
||||
})
|
||||
},
|
||||
onUnload :function(){
|
||||
clearTimeout(this.timer)
|
||||
getApp().globalData.symbol = ""
|
||||
uni.$off('reConnect')
|
||||
this.cancelSocket() //取消socket订阅
|
||||
},
|
||||
methods: {
|
||||
onRefresh() {
|
||||
console.log('下拉刷新');
|
||||
if(this.topTab==2){
|
||||
this.getMore(this.coinInfo.symbol)
|
||||
}
|
||||
this.getWallet()
|
||||
setTimeout(()=>{
|
||||
this.$refs.paging.complete();
|
||||
}, 1500);
|
||||
},
|
||||
getWallet(){
|
||||
this.post('/wallet/wallet_index').then((res) => {
|
||||
// console.log('我的资产',res)
|
||||
if (res.code == 1) {
|
||||
this.count_xh_usdt = res.data.all.usdt_num
|
||||
}
|
||||
})
|
||||
},
|
||||
getDay(){
|
||||
this.post('/market/get_day_kline', {
|
||||
symbol: this.coinInfo.symbol
|
||||
}).then(res => {
|
||||
console.log('获取一天最高最低',res)
|
||||
if (res.code == 1) {
|
||||
this.dayData = res.data
|
||||
this.timer = setTimeout(()=>{
|
||||
this.getDay()
|
||||
},10000)
|
||||
}
|
||||
})
|
||||
},
|
||||
// 下拉加载更多
|
||||
pullTorefresh_s(){
|
||||
if (this.current2 == 0) return
|
||||
console.log('下拉加载更多')
|
||||
if (this.state_s == 'over') return
|
||||
if (this.loading_s == true) return
|
||||
this.page_s++
|
||||
this.get_Second_order()
|
||||
},
|
||||
// 刷新重置订单列表
|
||||
refresh_list(){
|
||||
if(this.topTab==2){
|
||||
this.contractOrderList_s = []
|
||||
this.page_s = 1
|
||||
this.state_s = 'more'
|
||||
this.get_Second_order()
|
||||
}
|
||||
},
|
||||
// 获取秒合约交易订单列表
|
||||
get_Second_order(){
|
||||
if(this.current2 == 0){
|
||||
this.loading_s = true
|
||||
this.post('/cycle/get_order',{
|
||||
symbol:this.coinInfo.symbol,
|
||||
}).then(res => {
|
||||
console.log('秒合约——交易中——订单列表',res)
|
||||
if (res.code == 1) {
|
||||
setTimeout(()=>{
|
||||
this.loading_s = false
|
||||
this.contractOrderList_s = res.data
|
||||
}, 500)
|
||||
}
|
||||
})
|
||||
}
|
||||
if(this.current2 == 1){
|
||||
if (this.state_s == 'over') return
|
||||
this.loading_s = true
|
||||
this.state_s = 'loading'
|
||||
this.post('/cycle/get_all_order', {
|
||||
page: this.page_s,
|
||||
symbol:this.coinInfo.symbol,
|
||||
}).then(res => {
|
||||
console.log('秒合约——已平仓——订单列表',res)
|
||||
if (res.code == 1) {
|
||||
setTimeout(()=>{
|
||||
this.loading_s = false
|
||||
this.contractOrderList_s = this.contractOrderList_s.concat(res.data.data)
|
||||
if (this.page_s >= res.data.last_page) {
|
||||
this.state_s = 'over'
|
||||
}
|
||||
}, 500)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
// 平仓倒计时结束
|
||||
timeOut(){
|
||||
this.current2=1
|
||||
this.getWallet()
|
||||
},
|
||||
// 选择开仓时间
|
||||
selectTime(index){
|
||||
// console.log(index)
|
||||
this.riseTime = this.coinInfo.trade_time[index]
|
||||
},
|
||||
// tabs通知swiper切换
|
||||
tabsChange2(index) {
|
||||
this.current2 = index;
|
||||
},
|
||||
onswiperchange2(e) {
|
||||
// #ifndef APP-PLUS || H5 || MP-WEIXIN || MP-QQ
|
||||
let index = e.target.current || e.detail.current;
|
||||
this.tabsChange2(index);
|
||||
// #endif
|
||||
},
|
||||
animationfinish2(e) {
|
||||
let current = e.detail.current;
|
||||
this.current2 = current;
|
||||
},
|
||||
// 秒合约下单
|
||||
buyRise(type){
|
||||
if(!this.BtnFlag) return
|
||||
if(this.riseNumber==''){
|
||||
this.tos(this.i18n.cycle.openInput)
|
||||
return
|
||||
}
|
||||
if(this.riseTime==0){
|
||||
this.tos(this.i18n.cycle.timeclick)
|
||||
return
|
||||
}
|
||||
this.BtnFlag = false
|
||||
this.post('/cycle/start_order', {
|
||||
position: type,
|
||||
symbol: this.coinInfo.symbol,
|
||||
cycle: this.riseTime,
|
||||
num: this.riseNumber,
|
||||
},true).then(res => {
|
||||
console.log('秒合约下单',res)
|
||||
this.BtnFlag = true
|
||||
this.riseTimeType = false
|
||||
if (res.code == 1) {
|
||||
this.tos(res.msg)
|
||||
this.getWallet()
|
||||
if(this.current2 == 0){
|
||||
this.refresh_list()
|
||||
}else{
|
||||
this.current2 = 0
|
||||
}
|
||||
}else{
|
||||
if(res.data.jump == 1){
|
||||
this.shimingTitle = res.msg
|
||||
this.TSShow = true
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取秒合约币种列表
|
||||
getMore(symbol){
|
||||
this.post('/cycle/get_cycle_coin').then(res => {
|
||||
if (res.code == 1) {
|
||||
console.log('秒合约交易币种列表',res)
|
||||
if(symbol){
|
||||
this.midList = res.data
|
||||
this.refresh_list()
|
||||
}else{
|
||||
this.cancelSocket() //取消socket订阅
|
||||
this.midList = res.data
|
||||
this.coinInfo = this.midList[0]
|
||||
this.Ksrc = 'https://exchange.v5ico-kline.coddex.xyz/index.html?bb_type=' + this.coinInfo.bb_type + '&symbol=' + this.coinInfo.symbol + '&lang=' + uni.getStorageSync('Language')
|
||||
this.getDay()
|
||||
if(this.coinInfo.trade_time){
|
||||
this.riseTime = this.coinInfo.trade_time[0]
|
||||
}
|
||||
if(!this.leftshow){
|
||||
this.refresh_list()
|
||||
}
|
||||
getApp().globalData.symbol = this.coinInfo.symbol
|
||||
this.linkSocket() //链接socket订阅
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 选中币种
|
||||
changeCoin(index){
|
||||
this.cancelSocket() //取消socket订阅
|
||||
this.riseTime = ''
|
||||
this.coinInfo = this.midList[index]
|
||||
this.Ksrc = 'https://exchange.v5ico-kline.coddex.xyz/index.html?bb_type=' + this.coinInfo.bb_type + '&symbol=' + this.coinInfo.symbol + '&lang=' + uni.getStorageSync('Language')
|
||||
clearTimeout(this.timer)
|
||||
this.getDay()
|
||||
this.refresh_list()
|
||||
getApp().globalData.symbol = this.coinInfo.symbol
|
||||
this.linkSocket() //链接socket订阅
|
||||
if(this.lastData.close){
|
||||
this.lastData.close = Number(this.coinInfo.close)
|
||||
}
|
||||
this.leftshow = false
|
||||
},
|
||||
// 取消socket订阅
|
||||
cancelSocket(){
|
||||
this.sendSocketMessage({
|
||||
'subs':'depth',
|
||||
"user_id":uni.getStorageSync("user_id"),
|
||||
"unsub":"market."+this.coinInfo.symbol+".depth.step0",
|
||||
"id":"BTC",
|
||||
})
|
||||
this.sendSocketMessage({
|
||||
'subs':'tradenow',
|
||||
"user_id":uni.getStorageSync("user_id"),
|
||||
"unsub":"market."+this.coinInfo.symbol+".kline.1min",
|
||||
"id":"BTC",
|
||||
})
|
||||
},
|
||||
// 链接socket订阅
|
||||
linkSocket(){
|
||||
this.sendSocketMessage({
|
||||
'subs':'depth',
|
||||
"user_id":uni.getStorageSync("user_id"),
|
||||
"sub":"market."+this.coinInfo.symbol+".depth.step0",
|
||||
"id":"BTC",
|
||||
})
|
||||
this.sendSocketMessage({
|
||||
'subs':'tradenow',
|
||||
"user_id":uni.getStorageSync("user_id"),
|
||||
"sub":"market."+this.coinInfo.symbol+".kline.1min",
|
||||
"id":"BTC",
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.limitBox_up{
|
||||
// width: 116rpx;
|
||||
height: 40rpx;
|
||||
padding: 0 14rpx;
|
||||
background: rgba(18,184,134,0.1);
|
||||
border-radius: 4rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 40rpx;
|
||||
color: #12B886;
|
||||
font-family: "Medium" !important;
|
||||
}
|
||||
.limitBox_down{
|
||||
// width: 116rpx;
|
||||
height: 40rpx;
|
||||
padding: 0 14rpx;
|
||||
background: rgba(226,112,70,0.1);
|
||||
border-radius: 4rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 40rpx;
|
||||
color: #E27046;
|
||||
font-family: "Medium" !important;
|
||||
}
|
||||
.heng{
|
||||
width: 100rpx;
|
||||
height: 2rpx;
|
||||
margin: 0 auto;
|
||||
background: #1881D2;
|
||||
}
|
||||
.swiper {
|
||||
/* #ifndef H5 */
|
||||
// 除了 H5 平台，其它平台均存在的代码
|
||||
height: calc(100vh - 676rpx - var(--status-bar-height));
|
||||
// height: calc(100vh - 882rpx - var(--status-bar-height));
|
||||
/* #endif */
|
||||
|
||||
/* #ifdef H5 */
|
||||
// 只会出现在h5上
|
||||
height: calc(100vh - 676rpx - 104rpx);
|
||||
// height: calc(100vh - 882rpx - 104rpx);
|
||||
/* #endif */
|
||||
}
|
||||
.swiper_no {
|
||||
/* #ifndef H5 */
|
||||
// 除了 H5 平台，其它平台均存在的代码
|
||||
height: calc(100vh - 862rpx - var(--status-bar-height));
|
||||
// height: calc(100vh - 882rpx - var(--status-bar-height));
|
||||
/* #endif */
|
||||
|
||||
/* #ifdef H5 */
|
||||
// 只会出现在h5上
|
||||
height: calc(100vh - 862rpx - 104rpx);
|
||||
// height: calc(100vh - 882rpx - 104rpx);
|
||||
/* #endif */
|
||||
}
|
||||
.loginBtn{
|
||||
width: 337rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
text-align: center;
|
||||
box-shadow: 0rpx 6rpx 10rpx rgba(16, 194, 168, 0.18);
|
||||
border-radius: 4rpx;
|
||||
font-size: 30rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.qcbtn3 {
|
||||
width: 320rpx;
|
||||
height: 86rpx;
|
||||
background: #1881D2;
|
||||
border-radius: 4rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
.xuanzhebox{
|
||||
width: 164rpx;
|
||||
height: 60rpx;
|
||||
background: #202833;
|
||||
border: 1rpx solid #0B1622;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 28rpx;
|
||||
color: #F2F5FF;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user