8 changed files with 1084 additions and 488 deletions
@ -1,420 +1,446 @@ |
|||||
<template> |
<template> |
||||
<view class="transaction"> |
<view class="transaction"> |
||||
<view class="tab" :class="type == 'buy' ? 'buy' : ''"> |
<view class="tab" :class="type == 'buy' ? 'buy' : ''"> |
||||
<view class="buy" :class="type == 'buy' ? 'select' : ''" @click="onChangeType('buy')">{{ i18n.LONG }}</view> |
<view class="buy" :class="type == 'buy' ? 'select' : ''" @click="onChangeType('buy')">{{ i18n.LONG }}</view> |
||||
<view class="sell" :class="type == 'sell' ? 'select' : ''" @click="onChangeType('sell')">{{ i18n.SHORT }} |
<view class="sell" :class="type == 'sell' ? 'select' : ''" @click="onChangeType('sell')">{{ i18n.SHORT }} |
||||
</view> |
</view> |
||||
</view> |
</view> |
||||
<view class="priceSelectBody"> |
<view class="priceSelectBody"> |
||||
<view class="priceTypeInput" @click="priceSelectListShow = true">{{ priceTypeList[priceTypeValue].text }} |
<view class="priceTypeInput" @click="priceSelectListShow = true">{{ priceTypeList[priceTypeValue].text }} |
||||
</view> |
</view> |
||||
<view class="shade" v-show="priceSelectListShow" @click="priceSelectListShow = false"></view> |
<view class="shade" v-show="priceSelectListShow" @click="priceSelectListShow = false"></view> |
||||
<view class="priceTypeList" v-show="priceSelectListShow"> |
<view class="priceTypeList" v-show="priceSelectListShow"> |
||||
<view class="selectItem" :class="{ select: priceTypeValue === index }" |
<view class="selectItem" :class="{ select: priceTypeValue === index }" |
||||
v-for="(item, index) in priceTypeList" :key="index" @click="selectChange(index)"> |
v-for="(item, index) in priceTypeList" :key="index" @click="selectChange(index)"> |
||||
{{ item.text }} |
{{ item.text }} |
||||
</view> |
</view> |
||||
</view> |
</view> |
||||
</view> |
</view> |
||||
|
|
||||
<view class="coinPrice"> |
<view class="coinPrice"> |
||||
<view class="noInput" v-show="priceTypeValue === 0">{{ i18n.MarketOptimalPrice }}</view> |
<view class="noInput" v-show="priceTypeValue === 0">{{ i18n.MarketOptimalPrice }}</view> |
||||
<u-input class="input" v-show="priceTypeValue !== 0" v-model="coinPrice" color="#A1A0A8" fontSize="20rpx" |
<u-input class="input" v-show="priceTypeValue !== 0" v-model="coinPrice" color="#A1A0A8" fontSize="20rpx" |
||||
border="none" :placeholder="i18n.enterAddressTips"> |
border="none" :placeholder="i18n.enterAddressTips"> |
||||
</u-input> |
</u-input> |
||||
<view class="currencyName">{{ currency }}</view> |
<view class="currencyName">{{ symbol.baseSymbol }}</view> |
||||
</view> |
</view> |
||||
|
|
||||
<view class="twoInput"> |
<view class="twoInput"> |
||||
<view class="leverageSelectBody"> |
<view class="leverageSelectBody"> |
||||
<view class="leverageInput" @click="leverageListShow = true">{{ leverageValue }}</view> |
<view class="leverageInput" @click="leverageListShow = true">{{ leverageValue }}</view> |
||||
<view class="shade" v-show="leverageListShow" @click="leverageListShow = false"></view> |
<view class="shade" v-show="leverageListShow" @click="leverageListShow = false"></view> |
||||
<view class="leverageList" v-show="leverageListShow"> |
<view class="leverageList" v-show="leverageListShow"> |
||||
<view class="selectItem" :class="{ select: leverageValue === item }" |
<view class="selectItem" :class="{ select: leverageValue === item }" |
||||
v-for="(item, index) in leverageList" :key="index" @click="leverageSelectChange(item)"> |
v-for="(item, index) in contractConfig.leverage" :key="index" |
||||
{{ item }} |
@click="leverageSelectChange(item)"> |
||||
</view> |
{{ item }} |
||||
</view> |
</view> |
||||
</view> |
</view> |
||||
|
</view> |
||||
<view class="coinAmount"> |
|
||||
<u-input class="input" v-model="coinAmount" color="#A1A0A8" fontSize="20rpx" border="none" |
<view class="coinAmount"> |
||||
:placeholder="i18n.enterAddressTips"> |
<u-input class="input" v-model="coinAmount" color="#A1A0A8" fontSize="20rpx" border="none" |
||||
</u-input> |
:placeholder="i18n.enterAddressTips"> |
||||
<view class="currencyName">{{ coin }}</view> |
</u-input> |
||||
</view> |
<view class="currencyName">{{ symbol.coinSymbol }}</view> |
||||
</view> |
</view> |
||||
<!-- 可用 Usable--> |
</view> |
||||
<key-value-row class="text" :keyName="i18n.Usable" :value="`${coinPrice * coinAmount}${currency}`" |
<!-- 可用 Usable--> |
||||
lineHeight="30rpx" size="24rpx" rightColor="#A1A0A8"> |
<key-value-row class="text" :keyName="i18n.Usable" :value="`${contractConfig.useCapital}${symbol.baseSymbol}`" |
||||
</key-value-row> |
lineHeight="30rpx" size="24rpx" rightColor="#A1A0A8"> |
||||
<!-- 总计 Total--> |
</key-value-row> |
||||
<key-value-row class="text" :keyName="i18n.Total" :value="`${coinPrice * coinAmount}${currency}`" |
<!-- 总计 Total--> |
||||
lineHeight="30rpx" size="24rpx" rightColor="#A1A0A8"> |
<key-value-row class="text" :keyName="i18n.Total" |
||||
</key-value-row> |
:value="`${(priceTypeValue === 0?marketDetail.close*coinAmount:coinPrice*coinAmount).toFixed(4)}${symbol.baseSymbol}`" |
||||
<!-- 债券 Bond--> |
lineHeight="30rpx" size="24rpx" rightColor="#A1A0A8"> |
||||
<key-value-row class="text" :keyName="i18n.Bond" :value="`${coinPrice * coinAmount}${currency}`" |
</key-value-row> |
||||
lineHeight="30rpx" size="24rpx" rightColor="#A1A0A8"> |
<!-- 债券 Bond--> |
||||
</key-value-row> |
<key-value-row class="text" :keyName="i18n.Bond" |
||||
<!-- 手续费 --> |
:value="`${(priceTypeValue === 0?marketDetail.close/leverageValue:coinPrice/leverageValue).toFixed(4)}${symbol.baseSymbol}`" |
||||
<key-value-row class="text" :keyName="i18n.Fee" :value="`${coinPrice * coinAmount}${currency}`" |
lineHeight="30rpx" size="24rpx" rightColor="#A1A0A8"> |
||||
lineHeight="30rpx" size="24rpx" rightColor="#A1A0A8"> |
</key-value-row> |
||||
</key-value-row> |
<!-- 手续费 --> |
||||
|
<key-value-row class="text" :keyName="i18n.Fee" |
||||
<u-button class="button" :color="type == 'buy' ? '#00E8A2' : '#F4506A'" throttleTime="500" @click="btnClick"> |
:value="`${(priceTypeValue === 0?marketDetail.close/leverageValue*contractConfig.rate:coinPrice/leverageValue*contractConfig.rate).toFixed(4)}${symbol.baseSymbol}`" |
||||
{{ type === 'buy' ? `${i18n.buyLong}${coin}` : `${i18n.sellSHORT}${coin}` }} |
lineHeight="30rpx" size="24rpx" rightColor="#A1A0A8"> |
||||
</u-button> |
</key-value-row> |
||||
</view> |
|
||||
|
<u-button class="button" :color="type == 'buy' ? '#00E8A2' : '#F4506A'" throttleTime="500" @click="contractOrder"> |
||||
|
{{ type === 'buy' ? `${i18n.buyLong}${symbol.coinSymbol}` : `${i18n.sellSHORT}${symbol.coinSymbol}` }} |
||||
|
</u-button> |
||||
|
</view> |
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
import KeyValueRow from '../KeyValueRow/KeyValueRow.vue' |
import KeyValueRow from '../KeyValueRow/KeyValueRow.vue' |
||||
const COMPONENT_NAME = 'transaction' |
const COMPONENT_NAME = 'transaction' |
||||
export default { |
export default { |
||||
components: { KeyValueRow }, |
components: { |
||||
name: COMPONENT_NAME, |
KeyValueRow |
||||
props: { |
|
||||
coin: { // 数字货币名称 |
|
||||
type: String, |
|
||||
default() { |
|
||||
return 'BTC' |
|
||||
} |
|
||||
}, |
|
||||
currency: { // 货币名称 |
|
||||
type: String, |
|
||||
default() { |
|
||||
return 'USDT' |
|
||||
} |
|
||||
}, |
|
||||
type: { // 货币名称 |
|
||||
type: String, |
|
||||
default() { |
|
||||
return 'buy' |
|
||||
} |
|
||||
}, |
}, |
||||
coinPrice: { // 数字货币价格 |
name: COMPONENT_NAME, |
||||
type: Number, |
props: { |
||||
default() { |
|
||||
return 0 |
type: { // 货币名称 |
||||
} |
type: String, |
||||
}, |
default () { |
||||
coinAmount: { // 货币数量 |
return 'buy' |
||||
type: Number, |
} |
||||
default() { |
}, |
||||
return 1 |
contractConfig: { |
||||
} |
type: Object, |
||||
}, |
default: () => { |
||||
bgTransparent: { // 背景是否透明 |
leverage: [10] |
||||
type: Boolean, |
} |
||||
default() { |
}, |
||||
return false |
symbol: { |
||||
} |
type: Object, |
||||
}, |
default () { |
||||
}, |
|
||||
data() { |
} |
||||
return { |
}, |
||||
|
marketDetail: { // 数字货币价格 |
||||
priceSelectListShow: false, |
type: Object, |
||||
priceTypeValue: 0, |
default () { |
||||
priceTypeList: [ |
|
||||
{ value: 0, text: this.$t("markets").MarketPrice }, |
} |
||||
{ value: 1, text: this.$t("markets").LimitPrice }, |
}, |
||||
], |
bgTransparent: { // 背景是否透明 |
||||
leverageListShow: false, |
type: Boolean, |
||||
leverageValue: 10, |
default () { |
||||
leverageList: [ |
return false |
||||
10, |
} |
||||
20, |
}, |
||||
30, |
}, |
||||
50, |
data() { |
||||
100, |
return { |
||||
], |
math:null, |
||||
} |
priceSelectListShow: false, |
||||
}, |
priceTypeValue: 0, |
||||
computed: { |
priceTypeList: [{ |
||||
i18n() { |
value: 0, |
||||
return this.$t("markets"); |
text: this.$t("markets").MarketPrice |
||||
}, |
}, |
||||
}, |
{ |
||||
mounted() { |
value: 1, |
||||
|
text: this.$t("markets").LimitPrice |
||||
}, |
}, |
||||
methods: { |
], |
||||
onChangeType(type = 'buy') { |
leverageListShow: false, |
||||
this.type = type |
leverageValue: 10, |
||||
}, |
coinPrice: 0, |
||||
selectChange(index) { |
coinAmount: 0 |
||||
this.priceTypeValue = index; |
} |
||||
this.priceSelectListShow = false; |
}, |
||||
console.log(e); |
computed: { |
||||
}, |
i18n() { |
||||
leverageSelectChange(item) { |
return this.$t("markets"); |
||||
this.leverageValue = item; |
}, |
||||
this.leverageListShow = false; |
}, |
||||
console.log(e); |
mounted() { |
||||
}, |
this.leverageValue = this.contractConfig.leverage[0]; |
||||
btnClick(){ |
this.coinPrice = this.marketDetail.close |
||||
|
}, |
||||
}, |
methods: { |
||||
} |
|
||||
} |
onChangeType(type) { |
||||
|
this.$emit('onChangeType', type); |
||||
|
}, |
||||
|
selectChange(index) { |
||||
|
this.priceTypeValue = index; |
||||
|
this.priceSelectListShow = false; |
||||
|
this.coinPrice = this.marketDetail.close |
||||
|
}, |
||||
|
leverageSelectChange(item) { |
||||
|
this.leverageValue = item; |
||||
|
this.leverageListShow = false; |
||||
|
}, |
||||
|
contractOrder() { |
||||
|
var data={ |
||||
|
direction:this.type==='buy'?'long':'short', |
||||
|
amount:this.coinAmount, |
||||
|
pair:this.symbol.pair, |
||||
|
leverage:this.leverageValue, |
||||
|
tradeModel:this.priceTypeValue===0?'market':'limit', |
||||
|
price:this.priceTypeValue===0?this.marketDetail.close:this.coinPrice, |
||||
|
remarks:'1' |
||||
|
} |
||||
|
// #ifdef H5 |
||||
|
data.source='H5' |
||||
|
// #endif |
||||
|
// #ifdef APP-PLUS |
||||
|
data.source='android' |
||||
|
// #endif |
||||
|
console.log(data); |
||||
|
const contractOrder = this.$api.contractOrder(data); |
||||
|
contractOrder.then(res => { |
||||
|
|
||||
|
uni.showToast({ |
||||
|
title: res.errMsg, |
||||
|
icon: 'success', |
||||
|
duration: 1500 |
||||
|
}) |
||||
|
}); |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
</script> |
</script> |
||||
|
|
||||
<style scoped lang="scss"> |
<style scoped lang="scss"> |
||||
.transaction { |
.transaction { |
||||
width: 444rpx; |
width: 444rpx; |
||||
|
|
||||
.tab { |
.tab { |
||||
display: flex; |
display: flex; |
||||
border-radius: 16rpx; |
border-radius: 16rpx; |
||||
background-color: rgba($color: #F4506A, $alpha: 0.1); |
background-color: rgba($color: #F4506A, $alpha: 0.1); |
||||
|
|
||||
&.buy { |
&.buy { |
||||
background-color: rgba($color: #00E8A2, $alpha: 0.1); |
background-color: rgba($color: #00E8A2, $alpha: 0.1); |
||||
} |
} |
||||
|
|
||||
.buy { |
.buy { |
||||
flex: 1; |
flex: 1; |
||||
text-align: center; |
text-align: center; |
||||
height: 64rpx; |
height: 64rpx; |
||||
line-height: 64rpx; |
line-height: 64rpx; |
||||
font-size: 24rpx; |
font-size: 24rpx; |
||||
color: #F4506A; |
color: #F4506A; |
||||
border-radius: 16rpx; |
border-radius: 16rpx; |
||||
|
|
||||
&.select { |
&.select { |
||||
color: #15141F; |
color: #15141F; |
||||
background-color: #00E8A2; |
background-color: #00E8A2; |
||||
} |
} |
||||
} |
} |
||||
|
|
||||
.sell { |
.sell { |
||||
flex: 1; |
flex: 1; |
||||
text-align: center; |
text-align: center; |
||||
height: 64rpx; |
height: 64rpx; |
||||
line-height: 64rpx; |
line-height: 64rpx; |
||||
font-size: 24rpx; |
font-size: 24rpx; |
||||
color: #00E8A2; |
color: #00E8A2; |
||||
border-radius: 16rpx; |
border-radius: 16rpx; |
||||
|
|
||||
&.select { |
&.select { |
||||
color: #15141F; |
color: #15141F; |
||||
background: #F4506A; |
background: #F4506A; |
||||
} |
} |
||||
} |
} |
||||
} |
} |
||||
|
|
||||
|
|
||||
.priceSelectBody { |
.priceSelectBody { |
||||
position: relative; |
position: relative; |
||||
height: 64rpx; |
height: 64rpx; |
||||
margin-top: 24rpx; |
margin-top: 24rpx; |
||||
background: #323045; |
background: #323045; |
||||
border-radius: 16rpx; |
border-radius: 16rpx; |
||||
padding: 0 20rpx; |
padding: 0 20rpx; |
||||
|
|
||||
.priceTypeInput { |
.priceTypeInput { |
||||
position: relative; |
position: relative; |
||||
height: 64rpx; |
height: 64rpx; |
||||
line-height: 64rpx; |
line-height: 64rpx; |
||||
font-size: 20rpx; |
font-size: 20rpx; |
||||
color: #A1A0A8; |
color: #A1A0A8; |
||||
|
|
||||
|
|
||||
&::after { |
&::after { |
||||
display: block; |
display: block; |
||||
position: absolute; |
position: absolute; |
||||
content: ''; |
content: ''; |
||||
background-image: url(../../static/maskets/ic_ma_arrow_down.png); |
background-image: url(../../static/maskets/ic_ma_arrow_down.png); |
||||
background-repeat: no-repeat; |
background-repeat: no-repeat; |
||||
background-size: 32rpx; |
background-size: 32rpx; |
||||
width: 32rpx; |
width: 32rpx; |
||||
height: 32rpx; |
height: 32rpx; |
||||
top: 16rpx; |
top: 16rpx; |
||||
right: 0rpx; |
right: 0rpx; |
||||
} |
} |
||||
} |
} |
||||
|
|
||||
.shade { |
.shade { |
||||
position: fixed; |
position: fixed; |
||||
top: 220rpx; |
top: 220rpx; |
||||
left: 0; |
left: 0; |
||||
width: 750rpx; |
width: 750rpx; |
||||
height: 70vh; |
height: 70vh; |
||||
background: transparent; |
background: transparent; |
||||
// background: #fff; |
// background: #fff; |
||||
z-index: 0; |
z-index: 0; |
||||
} |
} |
||||
|
|
||||
.priceTypeList { |
.priceTypeList { |
||||
overflow: hidden; |
overflow: hidden; |
||||
position: absolute; |
position: absolute; |
||||
top: 60rpx; |
top: 60rpx; |
||||
left: 0rpx; |
left: 0rpx; |
||||
z-index: 2; |
z-index: 2; |
||||
background: #15141F; |
background: #15141F; |
||||
border-radius: 10rpx; |
border-radius: 10rpx; |
||||
width: 100%; |
width: 100%; |
||||
|
|
||||
.selectItem { |
.selectItem { |
||||
height: 64rpx; |
height: 64rpx; |
||||
line-height: 64rpx; |
line-height: 64rpx; |
||||
font-size: 28rpx; |
font-size: 28rpx; |
||||
padding-left: 20rpx; |
padding-left: 20rpx; |
||||
|
|
||||
&.select { |
&.select { |
||||
background: #3f3e48; |
background: #3f3e48; |
||||
} |
} |
||||
} |
} |
||||
} |
} |
||||
|
|
||||
} |
} |
||||
|
|
||||
.coinPrice { |
.coinPrice { |
||||
position: relative; |
position: relative; |
||||
margin-top: 20rpx; |
margin-top: 20rpx; |
||||
height: 64rpx; |
height: 64rpx; |
||||
|
|
||||
.noInput { |
.noInput { |
||||
height: 64rpx; |
height: 64rpx; |
||||
background: #323045; |
background: #323045; |
||||
border-radius: 16rpx; |
border-radius: 16rpx; |
||||
color: #A1A0A8; |
color: #A1A0A8; |
||||
line-height: 64rpx; |
line-height: 64rpx; |
||||
font-size: 24rpx; |
font-size: 24rpx; |
||||
padding-left: 20rpx; |
padding-left: 20rpx; |
||||
} |
} |
||||
|
|
||||
.input { |
.input { |
||||
height: 64rpx; |
height: 64rpx; |
||||
background: #323045; |
background: #323045; |
||||
border-radius: 16rpx; |
border-radius: 16rpx; |
||||
color: #A1A0A8; |
color: #A1A0A8; |
||||
line-height: 64rpx; |
line-height: 64rpx; |
||||
font-size: 24rpx; |
font-size: 24rpx; |
||||
padding-left: 20rpx !important; |
padding-left: 20rpx !important; |
||||
} |
} |
||||
|
|
||||
.currencyName { |
.currencyName { |
||||
position: absolute; |
position: absolute; |
||||
height: 32rpx; |
height: 32rpx; |
||||
top: 0rpx; |
top: 0rpx; |
||||
right: 20rpx; |
right: 20rpx; |
||||
color: #A1A0A8; |
color: #A1A0A8; |
||||
line-height: 64rpx; |
line-height: 64rpx; |
||||
font-size: 24rpx; |
font-size: 24rpx; |
||||
} |
} |
||||
} |
} |
||||
|
|
||||
.twoInput { |
.twoInput { |
||||
margin-top: 20rpx; |
margin-top: 20rpx; |
||||
margin-bottom: 10rpx; |
margin-bottom: 10rpx; |
||||
display: flex; |
display: flex; |
||||
|
|
||||
.leverageSelectBody { |
.leverageSelectBody { |
||||
position: relative; |
position: relative; |
||||
width: 212rpx; |
width: 212rpx; |
||||
height: 64rpx; |
height: 64rpx; |
||||
background: #323045; |
background: #323045; |
||||
border-radius: 16rpx; |
border-radius: 16rpx; |
||||
padding: 0 20rpx; |
padding: 0 20rpx; |
||||
|
|
||||
.leverageInput { |
.leverageInput { |
||||
position: relative; |
position: relative; |
||||
height: 64rpx; |
height: 64rpx; |
||||
line-height: 64rpx; |
line-height: 64rpx; |
||||
font-size: 20rpx; |
font-size: 20rpx; |
||||
color: #A1A0A8; |
color: #A1A0A8; |
||||
|
|
||||
|
|
||||
&::after { |
&::after { |
||||
display: block; |
display: block; |
||||
position: absolute; |
position: absolute; |
||||
content: ''; |
content: ''; |
||||
background-image: url(../../static/maskets/ic_ma_arrow_down.png); |
background-image: url(../../static/maskets/ic_ma_arrow_down.png); |
||||
background-repeat: no-repeat; |
background-repeat: no-repeat; |
||||
background-size: 32rpx; |
background-size: 32rpx; |
||||
width: 32rpx; |
width: 32rpx; |
||||
height: 32rpx; |
height: 32rpx; |
||||
top: 16rpx; |
top: 16rpx; |
||||
right: 0rpx; |
right: 0rpx; |
||||
} |
} |
||||
} |
} |
||||
|
|
||||
.shade { |
.shade { |
||||
position: fixed; |
position: fixed; |
||||
top: 220rpx; |
top: 220rpx; |
||||
left: 0; |
left: 0; |
||||
width: 750rpx; |
width: 750rpx; |
||||
height: 70vh; |
height: 70vh; |
||||
background: transparent; |
background: transparent; |
||||
// background: #fff; |
// background: #fff; |
||||
z-index: 0; |
z-index: 0; |
||||
} |
} |
||||
|
|
||||
.leverageList { |
.leverageList { |
||||
overflow: hidden; |
overflow: hidden; |
||||
position: absolute; |
position: absolute; |
||||
top: 60rpx; |
top: 60rpx; |
||||
left: 0rpx; |
left: 0rpx; |
||||
z-index: 2; |
z-index: 2; |
||||
background: #15141F; |
background: #15141F; |
||||
border-radius: 10rpx; |
border-radius: 10rpx; |
||||
width: 100%; |
width: 100%; |
||||
|
|
||||
.selectItem { |
.selectItem { |
||||
height: 64rpx; |
height: 64rpx; |
||||
line-height: 64rpx; |
line-height: 64rpx; |
||||
font-size: 28rpx; |
font-size: 28rpx; |
||||
padding-left: 20rpx; |
padding-left: 20rpx; |
||||
|
|
||||
&.select { |
&.select { |
||||
background: #3f3e48; |
background: #3f3e48; |
||||
} |
} |
||||
} |
} |
||||
} |
} |
||||
|
|
||||
} |
} |
||||
|
|
||||
.coinAmount { |
.coinAmount { |
||||
position: relative; |
position: relative; |
||||
height: 64rpx; |
height: 64rpx; |
||||
margin-left: 20rpx; |
margin-left: 20rpx; |
||||
|
|
||||
.input { |
.input { |
||||
height: 64rpx; |
height: 64rpx; |
||||
background: #323045; |
background: #323045; |
||||
border-radius: 16rpx; |
border-radius: 16rpx; |
||||
color: #A1A0A8; |
color: #A1A0A8; |
||||
line-height: 64rpx; |
line-height: 64rpx; |
||||
font-size: 24rpx; |
font-size: 24rpx; |
||||
padding-left: 20rpx !important; |
padding-left: 20rpx !important; |
||||
} |
} |
||||
|
|
||||
.currencyName { |
.currencyName { |
||||
position: absolute; |
position: absolute; |
||||
height: 32rpx; |
height: 32rpx; |
||||
top: 0rpx; |
top: 0rpx; |
||||
right: 20rpx; |
right: 20rpx; |
||||
color: #A1A0A8; |
color: #A1A0A8; |
||||
line-height: 64rpx; |
line-height: 64rpx; |
||||
font-size: 24rpx; |
font-size: 24rpx; |
||||
} |
} |
||||
} |
} |
||||
} |
} |
||||
|
|
||||
.text { |
.text { |
||||
margin: 0; |
margin: 0; |
||||
} |
} |
||||
|
|
||||
.button { |
.button { |
||||
box-sizing: border-box; |
box-sizing: border-box; |
||||
height: 64rpx; |
height: 64rpx; |
||||
border-radius: 16rpx; |
border-radius: 16rpx; |
||||
font-weight: 700; |
font-weight: 700; |
||||
font-size: 24rpx; |
font-size: 24rpx; |
||||
color: #15141F !important; |
color: #15141F !important; |
||||
|
|
||||
} |
} |
||||
} |
} |
||||
</style> |
</style> |
||||
|
|||||
Loading…
Reference in new issue