9 changed files with 4036 additions and 1832 deletions
File diff suppressed because it is too large
@ -1,159 +1,228 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<!-- nav --> |
|||
<navigation>{{ i18n.RechargeRecord }}</navigation> |
|||
<!-- headBtn --> |
|||
<view class="head"> |
|||
<view class="headItem" @click="pageState = 'coinRecharge'" |
|||
:class="{ select: pageState === 'coinRecharge' }"> |
|||
{{ i18n.CoinRecharge }} |
|||
</view> |
|||
<view class="headItem" @click="pageState = 'cashRecharge'" |
|||
:class="{ select: pageState === 'cashRecharge' }"> |
|||
{{ i18n.CashRecharge }} |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="cardList"> |
|||
<view class="card" v-for="(item, index) in 4" :key="index"> |
|||
<!-- 卡片条件渲染 --> |
|||
<!-- balance --> |
|||
<card-header v-if="pageState === 'coinRecharge'" iconName="../../static/recharge/money-recive.png" |
|||
:title="'904.29483230ACTA'" rightName="Succeed" fontColor="#00E8A2"> |
|||
</card-header> |
|||
<view class="dataBody" v-if="pageState === 'coinRecharge'"> |
|||
<view style="padding:20rpx 32rpx;"> |
|||
<key-value-row :keyName="i18n.OrderID" :value="'293829773920223873676'"></key-value-row> |
|||
<key-value-row :keyName="i18n.Fees" :value="'10.0922'"></key-value-row> |
|||
<key-value-row :keyName="i18n.Time" :value="'2022/08/06 14:50:34'"></key-value-row> |
|||
</view> |
|||
<view style="border-top: 2rpx solid #323045;padding:0rpx 32rpx; margin-bottom: 20rpx;"> |
|||
<show-more> |
|||
<key-value-row :keyName="i18n.Address" :value="'dhiukyfdhi8797979870800'"></key-value-row> |
|||
<key-value-row :keyName="i18n.Hash" :value="'dhiukyfdhi8797979870800'"></key-value-row> |
|||
<view class="text">Postscript : ontact customer service on the top-left corner for identity |
|||
verific |
|||
</view> |
|||
</show-more> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<!-- contarct --> |
|||
<card-header v-if="pageState === 'cashRecharge'" iconName="../../static/recharge/money-recive.png" |
|||
:title="'904.29483230ACTA'" rightName="Succeed" fontColor="#00E8A2"> |
|||
</card-header> |
|||
<view class="dataBody" v-if="pageState === 'cashRecharge'"> |
|||
<view style="padding:20rpx 32rpx;"> |
|||
<key-value-row :keyName="i18n.OrderID" :value="'293829773920223873676'"></key-value-row> |
|||
<key-value-row :keyName="i18n.Fees" :value="'10.0922'"></key-value-row> |
|||
<key-value-row :keyName="i18n.Time" :value="'2022/08/06 14:50:34'"></key-value-row> |
|||
</view> |
|||
<view style="border-top: 2rpx solid #323045;padding:0rpx 32rpx; margin-bottom: 20rpx;"> |
|||
<show-more> |
|||
<key-value-row :keyName="i18n.USDTRate" :value="'19298'"></key-value-row> |
|||
<key-value-row :keyName="i18n.USDT" :value="'298237'"></key-value-row> |
|||
<view class="text">Postscript : ontact customer service on the top-left corner for identity |
|||
verific |
|||
</view> |
|||
</show-more> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="main"> |
|||
<!-- nav --> |
|||
<navigation>{{ i18n.RechargeRecord }}</navigation> |
|||
<!-- headBtn --> |
|||
<view class="head"> |
|||
<view class="headItem" @click="form.type = 'crypto',getList()" |
|||
:class="{ select: form.type === 'crypto' }"> |
|||
{{ i18n.CoinRecharge }} |
|||
</view> |
|||
<view class="headItem" @click="form.type = 'online',getList()" |
|||
:class="{ select:form.type === 'online' }"> |
|||
{{ i18n.CashRecharge }} |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="cardList"> |
|||
<view class="card" v-for="(item, index) in userInfoObj" :key="index"> |
|||
<!-- 卡片条件渲染 --> |
|||
<!-- balance --> |
|||
<!-- <card-header v-if="form.type === 'crypto'" iconName="../../static/recharge/money-recive.png" |
|||
:title="'904.29483230ACTA'" rightName="Succeed" fontColor="#00E8A2"> |
|||
</card-header> --> |
|||
<card-header v-if="form.type === 'crypto'" :iconName="baseURL+'/coins/'+item.coinCode+'.png'" |
|||
:title="item.tranAmt+item.coinCode" |
|||
:rightName="item.orderStatus=='pay_unpaid'?'Unpaid':item.orderStatus=='pay_success'?'Success': |
|||
item.orderStatus=='pay_failure'?'Failed':item.orderStatus=='pay_processing'?'Paying':'Closed'" |
|||
:fontColor="item.orderStatus=='pay_unpaid'?'#F2FE8D':item.orderStatus=='pay_success'?'#00E8A2': |
|||
item.orderStatus=='pay_failure'?'#F4506A':item.orderStatus=='pay_processing'?'#00D1FF':'#A1A0A8'"> |
|||
</card-header> |
|||
<view class="dataBody" v-if="form.type === 'crypto'"> |
|||
<view style="padding:20rpx 32rpx;"> |
|||
<key-value-row :keyName="i18n.OrderID" :value="item.orderNo"></key-value-row> |
|||
<key-value-row :keyName="i18n.Fees" :value="(item.tranAmt-(parseInt(item.realAmount,16)))+item.coinCode"></key-value-row> |
|||
<key-value-row :keyName="i18n.Time" :value="item.timestr"></key-value-row> |
|||
</view> |
|||
<view style="border-top: 2rpx solid #323045;padding:0rpx 32rpx; margin-bottom: 20rpx;"> |
|||
<show-more> |
|||
<key-value-row :keyName="i18n.Address" :value="item.toAddress"></key-value-row> |
|||
<key-value-row :keyName="i18n.Hash" :value="item.txid"></key-value-row> |
|||
</show-more> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<!-- contarct --> |
|||
<card-header v-if="form.type === 'online'" iconName="../../static/recharge/money-recive.png" |
|||
:title="item.tranAmt+item.coinCode" |
|||
:rightName="item.orderStatus=='pay_unpaid'?'Unpaid':item.orderStatus=='pay_success'?'Success': |
|||
item.orderStatus=='pay_failure'?'Failed':item.orderStatus=='pay_processing'?'Paying':'Closed'" |
|||
:fontColor="item.orderStatus=='pay_unpaid'?'#F2FE8D':item.orderStatus=='pay_success'?'#00E8A2': |
|||
item.orderStatus=='pay_failure'?'#F4506A':item.orderStatus=='pay_processing'?'#00D1FF':'#A1A0A8'"> |
|||
</card-header> |
|||
<view class="dataBody" v-if="form.type === 'online'"> |
|||
<view style="padding:20rpx 32rpx;"> |
|||
<key-value-row :keyName="i18n.OrderID" :value="item.orderNo"></key-value-row> |
|||
<key-value-row :keyName="i18n.Fees" :value="(item.tranAmt-(parseInt(item.realAmount,16)))+item.coinCode"></key-value-row> |
|||
<key-value-row :keyName="i18n.Time" :value="item.timestr"></key-value-row> |
|||
</view> |
|||
<view style="border-top: 2rpx solid #323045;padding:0rpx 32rpx; margin-bottom: 20rpx;"> |
|||
<show-more> |
|||
<key-value-row :keyName="i18n.USDTRate" :value="item.usdtRate"></key-value-row> |
|||
<key-value-row :keyName="i18n.USDT" :value="item.usdtAmount"></key-value-row> |
|||
</show-more> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
<u-empty :text="i18n.Dataisempty" mode="data" v-if="userInfoObj.length==0"></u-empty> |
|||
<u-loadmore :status="loadStatus" :loading-text="loadingText" :loadmore-text="loadmoreText" |
|||
:nomore-text="nomoreText" v-if="userInfoObj.length" height="80" /> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import KeyValueRow from '../../components/KeyValueRow/KeyValueRow.vue'; |
|||
import CardHeader from '../../components/cardHeader/cardHeader.vue'; |
|||
import ShowMore from '../../components/showMore/showMore.vue'; |
|||
export default { |
|||
components: { KeyValueRow, CardHeader, ShowMore }, |
|||
name: "rechargeRecord", |
|||
data() { |
|||
return { |
|||
pageState: 'coinRecharge', |
|||
}; |
|||
}, |
|||
computed: { |
|||
i18n() { |
|||
return this.$t("recharge"); |
|||
}, |
|||
}, |
|||
onLoad() { |
|||
}, |
|||
onShow() { }, |
|||
methods: { |
|||
change(e) { |
|||
console.log(e); |
|||
} |
|||
|
|||
}, |
|||
} |
|||
import KeyValueRow from '../../components/KeyValueRow/KeyValueRow.vue'; |
|||
import CardHeader from '../../components/cardHeader/cardHeader.vue'; |
|||
import ShowMore from '../../components/showMore/showMore.vue'; |
|||
import constant from '@/utils/constant.js'; |
|||
import api from '@/utils/api' |
|||
export default { |
|||
components: { |
|||
KeyValueRow, |
|||
CardHeader, |
|||
ShowMore |
|||
}, |
|||
name: "rechargeRecord", |
|||
data() { |
|||
return { |
|||
baseURL:'', |
|||
pageState: 'coinRecharge', |
|||
isLoadMore: false, //是否加载中 |
|||
loadStatus: 'loadmore', |
|||
loadingText: this.$t("login").toload, |
|||
loadmoreText: this.$t("login").pullup, |
|||
nomoreText: this.$t("login").Nomore, |
|||
form: { |
|||
pageNumber: 1, |
|||
pageSize: 20, |
|||
type:'crypto', |
|||
}, |
|||
userInfoObj: [], |
|||
}; |
|||
}, |
|||
computed: { |
|||
i18n() { |
|||
return this.$t("recharge"); |
|||
}, |
|||
}, |
|||
onReachBottom() { |
|||
if (!this.isLoadMore) { |
|||
this.form.pageNumber += 1 |
|||
this.getList(); |
|||
} |
|||
}, |
|||
onLoad() { |
|||
this.baseURL = constant.BASE_URL |
|||
this.getList() |
|||
}, |
|||
onShow() {}, |
|||
methods: { |
|||
change(e) { |
|||
console.log(e); |
|||
}, |
|||
getList() { |
|||
this.isLoadMore = true |
|||
api.rechargeList(this.form).then(res => { |
|||
if (res.content.length) { |
|||
if (this.form.pageNumber > 1) { |
|||
this.userInfoObj = this.userInfoObj.concat(res.content) |
|||
for (var i = 0; i < this.userInfoObj.length; i++) { |
|||
if (this.userInfoObj[i].addTime) { |
|||
this.userInfoObj[i].timestr = this.$index.formatyymmddhhmmss(this.userInfoObj[ |
|||
i].addTime) |
|||
} |
|||
} |
|||
} else { |
|||
this.userInfoObj = res.content |
|||
for (var i = 0; i < this.userInfoObj.length; i++) { |
|||
if (this.userInfoObj[i].addTime) { |
|||
this.userInfoObj[i].timestr = this.$index.formatyymmddhhmmss(this.userInfoObj[ |
|||
i].addTime) |
|||
} |
|||
} |
|||
} |
|||
if (this.userInfoObj.length >= Number(res.totalElements)) { // 判断接口返回数据量小于请求数据量,则表示此为最后一页 |
|||
this.isLoadMore = true |
|||
this.loadStatus = 'nomore' |
|||
} else { |
|||
this.isLoadMore = false |
|||
} |
|||
} else { |
|||
this.isLoadMore = true |
|||
this.loadStatus = 'nomore' |
|||
this.userInfoObj = [] |
|||
} |
|||
this.$forceUpdate() |
|||
}) |
|||
}, |
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.main { |
|||
|
|||
.head { |
|||
margin-top: 200rpx; |
|||
margin-left: 60rpx; |
|||
width: 632rpx; |
|||
display: flex; |
|||
justify-content: space-around; |
|||
align-items: center; |
|||
padding: 48rpx 0; |
|||
|
|||
.headItem { |
|||
width: 300rpx; |
|||
height: 68rpx; |
|||
line-height: 68rpx; |
|||
background: #211F32; |
|||
border-radius: 16rpx; |
|||
text-align: center; |
|||
font-size: 32rpx; |
|||
color: #A1A0A8; |
|||
|
|||
&.select { |
|||
background: #00E8A2; |
|||
color: #15141F; |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
.cardList { |
|||
padding-bottom: 40rpx; |
|||
|
|||
.card { |
|||
overflow: hidden; |
|||
background: #211F32; |
|||
border-radius: 32rpx; |
|||
margin: 0 32rpx 32rpx; |
|||
|
|||
|
|||
|
|||
.dataBody { |
|||
box-sizing: border-box; |
|||
|
|||
.text { |
|||
margin-top: 20rpx; |
|||
padding: 10rpx 16rpx; |
|||
background: #323045; |
|||
border-radius: 8rpx; |
|||
font-size: 24rpx; |
|||
color: #A1A0A8; |
|||
} |
|||
|
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
} |
|||
.main { |
|||
|
|||
.head { |
|||
margin-top: 200rpx; |
|||
margin-left: 60rpx; |
|||
width: 632rpx; |
|||
display: flex; |
|||
justify-content: space-around; |
|||
align-items: center; |
|||
padding: 48rpx 0; |
|||
|
|||
.headItem { |
|||
width: 300rpx; |
|||
height: 68rpx; |
|||
line-height: 68rpx; |
|||
background: #211F32; |
|||
border-radius: 16rpx; |
|||
text-align: center; |
|||
font-size: 32rpx; |
|||
color: #A1A0A8; |
|||
|
|||
&.select { |
|||
background: #00E8A2; |
|||
color: #15141F; |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
.cardList { |
|||
padding-bottom: 40rpx; |
|||
|
|||
.card { |
|||
overflow: hidden; |
|||
background: #211F32; |
|||
border-radius: 32rpx; |
|||
margin: 0 32rpx 32rpx; |
|||
|
|||
|
|||
|
|||
.dataBody { |
|||
box-sizing: border-box; |
|||
|
|||
.text { |
|||
margin-top: 20rpx; |
|||
padding: 10rpx 16rpx; |
|||
background: #323045; |
|||
border-radius: 8rpx; |
|||
font-size: 24rpx; |
|||
color: #A1A0A8; |
|||
} |
|||
|
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
} |
|||
</style> |
|||
|
@ -1,289 +1,361 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<!-- nav --> |
|||
<navigation>{{ i18n.ChooseAddress }}<view slot="right" class="right" @click="editFlag = !editFlag;">{{ |
|||
<view class="main"> |
|||
<!-- nav --> |
|||
<navigation>{{ i18n.ChooseAddress }} |
|||
<view slot="right" class="right" @click="editFlag = !editFlag;">{{ |
|||
editFlag ? i18n.OK : i18n.Edit |
|||
}} |
|||
</view> |
|||
</navigation> |
|||
<view class="content"> |
|||
<view class="message-item"> |
|||
{{ i18n.message4 }} |
|||
</view> |
|||
<view class="message-item last"> |
|||
{{ i18n.message5 }} |
|||
</view> |
|||
<view class="card" v-if="coinList.length > 0"> |
|||
<view class="dataBody" v-for="(item, index) in 4" :key="index"> |
|||
<view class="coinTitle">USDT</view> |
|||
<view class="addressItem" v-for="(addressItem, addressIndex) in 2" :key="addressIndex" |
|||
@click="itemClick(index, addressIndex)"> |
|||
<view class="radio" |
|||
:class="{ select: (editCoinIndex === index && editCoinAddressIndex === addressIndex) }" |
|||
v-if="editFlag"></view> |
|||
<view class="addressInfo"> |
|||
<view class="addressTitle">{{ i18n.myOmniAddress }}</view> |
|||
<view class="address">SDIHJSD9809U9ERF9IOU0980970</view> |
|||
<view class="time">2022/08/06 14:50:34</view> |
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
</view> |
|||
<!-- 确认框 --> |
|||
<u-modal :show="modalShow" :confirmText="i18n.OK" :cancelText="i18n.Cancel" :showCancelButton="true" |
|||
:title="i18n.WarmTips" :content='i18n.WarmTipsText' @confirm="deleteAddress" @cancel="modalShow = false" |
|||
confirmColor="#00E8A2"> |
|||
</u-modal> |
|||
<!-- 编辑按钮 --> |
|||
<view class="buttonBg"> |
|||
<u-button class="button" :color="editFlag ? '#F4506A' : '#00E8A2'" throttleTime="500" @click="btnClick" |
|||
:disabled="btnIsCanClick"> |
|||
{{ editFlag ? i18n.DeleteAddress : i18n.AddAddress }} |
|||
</u-button> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
</navigation> |
|||
<view class="content"> |
|||
<view class="message-item"> |
|||
{{ i18n.message4 }} |
|||
</view> |
|||
<view class="message-item last"> |
|||
{{ i18n.message5 }} |
|||
</view> |
|||
<view class="card" v-if="userInfoObj.length > 0"> |
|||
<view class="dataBody" v-for="(item, index) in userInfoObj" :key="index"> |
|||
<view class="coinTitle">{{item.coinEnname}}</view> |
|||
<!-- v-for="(addressItem, addressIndex) in 2" :key="addressIndex" --> |
|||
<view class="addressItem" |
|||
@click="itemClick(index, item)"> |
|||
<view class="radio" |
|||
:class="{ select: (editCoinIndex === index && editCoinAddressIndex === item.id) }" |
|||
v-if="editFlag"></view> |
|||
<view class="addressInfo"> |
|||
<view class="addressTitle">{{ i18n.myOmniAddress }}</view> |
|||
<view class="address">{{item.address}}</view> |
|||
<view class="time">{{item.timestr}}</view> |
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
</view> |
|||
<u-empty :text="i18n.Dataisempty" mode="data" v-if="userInfoObj.length==0"></u-empty> |
|||
<u-loadmore :status="loadStatus" :loading-text="loadingText" :loadmore-text="loadmoreText" |
|||
:nomore-text="nomoreText" v-if="userInfoObj.length" height="80" /> |
|||
<!-- 确认框 --> |
|||
<u-modal :show="modalShow" :confirmText="i18n.OK" :cancelText="i18n.Cancel" :showCancelButton="true" |
|||
:title="i18n.WarmTips" :content='i18n.WarmTipsText' @confirm="deleteAddress" @cancel="modalShow = false" |
|||
confirmColor="#00E8A2" cancelColor="#96959E"> |
|||
</u-modal> |
|||
<!-- 编辑按钮 --> |
|||
<view class="buttonBg"> |
|||
<u-button class="button" :color="editFlag ? '#F4506A' : '#00E8A2'" throttleTime="500" @click="btnClick" |
|||
:disabled="btnIsCanClick"> |
|||
{{ editFlag ? i18n.DeleteAddress : i18n.AddAddress }} |
|||
</u-button> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import KeyValueRow from '../../components/KeyValueRow/KeyValueRow.vue'; |
|||
export default { |
|||
components: { KeyValueRow }, |
|||
name: "chooseAddress", |
|||
data() { |
|||
return { |
|||
coinList: [{}], |
|||
coinAddressList: [{}], |
|||
editFlag: false, // 是否在编辑状态 |
|||
editCoinIndex: '', |
|||
editCoinAddressIndex: '', |
|||
coinAddress: 'SDIHJSD9809U9ERF9IOU0980970', |
|||
currentCoin: 'USDT', |
|||
modalShow: false, |
|||
|
|||
}; |
|||
}, |
|||
computed: { |
|||
i18n() { |
|||
return this.$t("withdrawal"); |
|||
}, |
|||
btnIsCanClick() { // 按钮是否可以点击 |
|||
if (this.editFlag) { |
|||
// console.log(`${this.editCoinIndex}` ? false : true); |
|||
return `${this.editCoinIndex}` ? false : true; // 在编辑模式,有值才能点 |
|||
} else { |
|||
return false; // 不在编辑模式始终可以点 |
|||
} |
|||
} |
|||
}, |
|||
onLoad() { |
|||
|
|||
}, |
|||
onShow() { }, |
|||
methods: { |
|||
itemClick(index, addressIndex) { |
|||
// 编辑模式下 |
|||
if (this.editFlag) { |
|||
// console.log(index, addressIndex); |
|||
if (this.editCoinIndex === index && this.editCoinAddressIndex === addressIndex) { // 取消选择 |
|||
this.editCoinIndex = ''; |
|||
this.editCoinAddressIndex = ''; |
|||
} else { // 选择 |
|||
this.editCoinIndex = index; |
|||
this.editCoinAddressIndex = addressIndex; |
|||
} |
|||
} else { |
|||
// 选择地址情况下 点击地址返回传参有问题 可能要通用vuex解决 |
|||
uni.$emit('coinAddressChang', { |
|||
coinAddress: this.coinAddress, |
|||
}); |
|||
uni.navigateBack() |
|||
|
|||
} |
|||
|
|||
}, |
|||
btnClick() { |
|||
// 在编辑模式弹出确认框 |
|||
if (this.editFlag) { |
|||
this.modalShow = true |
|||
} else { |
|||
// 在非编辑模式下直接跳转 |
|||
uni.navigateTo({ |
|||
url : '/pages/withdrawal/addAddress' |
|||
}); |
|||
} |
|||
}, |
|||
|
|||
deleteAddress() { |
|||
this.modalShow = false; |
|||
console.log('deleteAddress'); |
|||
}, |
|||
|
|||
}, |
|||
} |
|||
import KeyValueRow from '../../components/KeyValueRow/KeyValueRow.vue'; |
|||
import api from '@/utils/api' |
|||
import constant from '@/utils/constant.js'; |
|||
export default { |
|||
components: { |
|||
KeyValueRow |
|||
}, |
|||
name: "chooseAddress", |
|||
data() { |
|||
return { |
|||
coinList: [{}], |
|||
coinAddressList: [{}], |
|||
editFlag: false, // 是否在编辑状态 |
|||
editCoinIndex: '', |
|||
editCoinAddressIndex: '', |
|||
coinAddress: 'SDIHJSD9809U9ERF9IOU0980970', |
|||
currentCoin: 'USDT', |
|||
modalShow: false, |
|||
|
|||
isLoadMore: false, //是否加载中 |
|||
loadStatus: 'loadmore', |
|||
loadingText: this.$t("login").toload, |
|||
loadmoreText: this.$t("login").pullup, |
|||
nomoreText: this.$t("login").Nomore, |
|||
form: { |
|||
pageNumber: 1, |
|||
pageSize: 20, |
|||
type: 'crypto', |
|||
}, |
|||
userInfoObj: [], |
|||
|
|||
}; |
|||
}, |
|||
computed: { |
|||
i18n() { |
|||
return this.$t("withdrawal"); |
|||
}, |
|||
btnIsCanClick() { // 按钮是否可以点击 |
|||
if (this.editFlag) { |
|||
// console.log(`${this.editCoinIndex}` ? false : true); |
|||
return `${this.editCoinIndex}` ? false : true; // 在编辑模式,有值才能点 |
|||
} else { |
|||
return false; // 不在编辑模式始终可以点 |
|||
} |
|||
} |
|||
}, |
|||
onLoad() { |
|||
}, |
|||
onShow() { |
|||
this.getList() |
|||
}, |
|||
methods: { |
|||
getList() { |
|||
this.isLoadMore = true |
|||
api.withdrawAddressList(this.form).then(res => { |
|||
if (res.content.length) { |
|||
if (this.form.pageNumber > 1) { |
|||
this.userInfoObj = this.userInfoObj.concat(res.content) |
|||
for (var i = 0; i < this.userInfoObj.length; i++) { |
|||
if (this.userInfoObj[i].addTime) { |
|||
this.userInfoObj[i].timestr = this.$index.formatyymmddhhmmss(this.userInfoObj[ |
|||
i].addTime) |
|||
} |
|||
} |
|||
} else { |
|||
this.userInfoObj = res.content |
|||
for (var i = 0; i < this.userInfoObj.length; i++) { |
|||
if (this.userInfoObj[i].addTime) { |
|||
this.userInfoObj[i].timestr = this.$index.formatyymmddhhmmss(this.userInfoObj[ |
|||
i].addTime) |
|||
} |
|||
} |
|||
} |
|||
if (this.userInfoObj.length >= Number(res.totalElements)) { // 判断接口返回数据量小于请求数据量,则表示此为最后一页 |
|||
this.isLoadMore = true |
|||
this.loadStatus = 'nomore' |
|||
} else { |
|||
this.isLoadMore = false |
|||
} |
|||
} else { |
|||
this.isLoadMore = true |
|||
this.loadStatus = 'nomore' |
|||
this.userInfoObj = [] |
|||
} |
|||
this.$forceUpdate() |
|||
}) |
|||
}, |
|||
itemClick(index, addressIndex) { |
|||
console.log(index, addressIndex) |
|||
// 编辑模式下 |
|||
if (this.editFlag) { |
|||
// console.log(index, addressIndex); |
|||
if (this.editCoinIndex === index && this.editCoinAddressIndex === addressIndex.id) { // 取消选择 |
|||
this.editCoinIndex = ''; |
|||
this.editCoinAddressIndex = ''; |
|||
} else { // 选择 |
|||
this.editCoinIndex = index; |
|||
this.editCoinAddressIndex = addressIndex.id; |
|||
} |
|||
} else { |
|||
// 选择地址情况下 点击地址返回传参有问题 可能要通用vuex解决 |
|||
uni.$emit('coinAddressChang', { |
|||
coinid: addressIndex.id, |
|||
coinAddress: addressIndex.address, |
|||
}); |
|||
uni.navigateBack() |
|||
|
|||
} |
|||
|
|||
}, |
|||
btnClick() { |
|||
// 在编辑模式弹出确认框 |
|||
if (this.editFlag) { |
|||
this.modalShow = true |
|||
|
|||
} else { |
|||
// 在非编辑模式下直接跳转 |
|||
uni.navigateTo({ |
|||
url: '/pages/withdrawal/addAddress' |
|||
}); |
|||
} |
|||
}, |
|||
|
|||
deleteAddress() { |
|||
this.modalShow = false; |
|||
// 删除地址 |
|||
api.withdrawAddressDel({ |
|||
addressId:this.editCoinAddressIndex, |
|||
}).then(res => { |
|||
uni.$u.toast(this.$t("login").Deletesucceeded) |
|||
setTimeout(()=>{ |
|||
this.getList() |
|||
},600) |
|||
}) |
|||
}, |
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.main { |
|||
|
|||
.right { |
|||
width: 82rpx; |
|||
height: 56rpx; |
|||
line-height: 56rpx; |
|||
position: absolute; |
|||
right: 32rpx; |
|||
font-size: 24rpx; |
|||
background: rgba(246, 166, 9, 0.1); |
|||
border-radius: 8px; |
|||
color: #FFBC1F; |
|||
} |
|||
|
|||
|
|||
.content { |
|||
margin-top: 200rpx; |
|||
padding: 40rpx; |
|||
|
|||
.message-item { |
|||
padding: 0 16rpx; |
|||
font-size: 24rpx; |
|||
color: #A1A0A8; |
|||
line-height: 36rpx; |
|||
|
|||
&.last { |
|||
margin-bottom: 30rpx; |
|||
} |
|||
} |
|||
|
|||
|
|||
.card { |
|||
|
|||
.dataBody { |
|||
margin-bottom: 32rpx; |
|||
padding: 32rpx; |
|||
box-sizing: border-box; |
|||
background: #211F32; |
|||
border-radius: 20rpx; |
|||
|
|||
.coinTitle { |
|||
font-size: 24rpx; |
|||
line-height: 28rpx; |
|||
margin-bottom: 32rpx; |
|||
} |
|||
|
|||
.addressItem { |
|||
height: 180rpx; |
|||
box-sizing: border-box; |
|||
padding: 32rpx 0; |
|||
border-top: 2rpx solid #323045; |
|||
display: flex; |
|||
|
|||
.radio { |
|||
margin-top: 32rpx; |
|||
margin-right: 24rpx; |
|||
box-sizing: border-box; |
|||
width: 48rpx; |
|||
height: 48rpx; |
|||
background: #323045; |
|||
border: 3rpx solid #DCDBE0; |
|||
border-radius: 16rpx; |
|||
|
|||
|
|||
&.select { |
|||
background-image: url(../../static/withdrawal/Checkbox_pr.png); |
|||
background-repeat: no-repeat; |
|||
background-size: 48rpx; |
|||
border: none; |
|||
} |
|||
} |
|||
|
|||
.addressInfo { |
|||
flex: 1; |
|||
|
|||
.addressTitle { |
|||
position: relative; |
|||
font-size: 24rpx; |
|||
margin-bottom: 20rpx; |
|||
|
|||
&::after { |
|||
display: block; |
|||
position: absolute; |
|||
content: ''; |
|||
background-image: url(../../static/charity/ic_ma_arrow_down.png); |
|||
background-repeat: no-repeat; |
|||
background-size: 32rpx; |
|||
width: 32rpx; |
|||
height: 32rpx; |
|||
top: 0rpx; |
|||
right: 0rpx; |
|||
transform: rotate(270deg); |
|||
} |
|||
} |
|||
|
|||
.address { |
|||
font-size: 24rpx; |
|||
line-height: 28rpx; |
|||
color: #A1A0A8; |
|||
} |
|||
|
|||
.time { |
|||
font-size: 24rpx; |
|||
line-height: 28rpx; |
|||
color: #A1A0A8; |
|||
} |
|||
} |
|||
} |
|||
|
|||
|
|||
|
|||
|
|||
/deep/ .u-modal__content__text{ |
|||
color: #96959E; |
|||
} |
|||
.main { |
|||
|
|||
.right { |
|||
width: 82rpx; |
|||
height: 56rpx; |
|||
line-height: 56rpx; |
|||
position: absolute; |
|||
right: 32rpx; |
|||
font-size: 24rpx; |
|||
background: rgba(246, 166, 9, 0.1); |
|||
border-radius: 8px; |
|||
color: #FFBC1F; |
|||
} |
|||
|
|||
|
|||
.content { |
|||
margin-top: 200rpx; |
|||
padding: 40rpx; |
|||
|
|||
.message-item { |
|||
padding: 0 16rpx; |
|||
font-size: 24rpx; |
|||
color: #A1A0A8; |
|||
line-height: 36rpx; |
|||
|
|||
&.last { |
|||
margin-bottom: 30rpx; |
|||
} |
|||
} |
|||
|
|||
|
|||
.card { |
|||
|
|||
.dataBody { |
|||
margin-bottom: 32rpx; |
|||
padding: 32rpx; |
|||
box-sizing: border-box; |
|||
background: #211F32; |
|||
border-radius: 20rpx; |
|||
|
|||
.coinTitle { |
|||
font-size: 24rpx; |
|||
line-height: 28rpx; |
|||
margin-bottom: 32rpx; |
|||
} |
|||
|
|||
.addressItem { |
|||
flex: 0 1 50%; |
|||
height: 180rpx; |
|||
box-sizing: border-box; |
|||
padding: 32rpx 0; |
|||
border-top: 2rpx solid #323045; |
|||
display: flex; |
|||
|
|||
.radio { |
|||
margin-top: 32rpx; |
|||
margin-right: 24rpx; |
|||
box-sizing: border-box; |
|||
width: 48rpx; |
|||
height: 48rpx; |
|||
background: #323045; |
|||
border: 3rpx solid #DCDBE0; |
|||
border-radius: 16rpx; |
|||
|
|||
|
|||
&.select { |
|||
background-image: url(../../static/withdrawal/Checkbox_pr.png); |
|||
background-repeat: no-repeat; |
|||
background-size: 48rpx; |
|||
border: none; |
|||
} |
|||
} |
|||
|
|||
.addressInfo { |
|||
width: 590rpx; |
|||
.addressTitle { |
|||
position: relative; |
|||
font-size: 24rpx; |
|||
margin-bottom: 20rpx; |
|||
|
|||
&::after { |
|||
display: block; |
|||
position: absolute; |
|||
content: ''; |
|||
background-image: url(../../static/charity/ic_ma_arrow_down.png); |
|||
background-repeat: no-repeat; |
|||
background-size: 32rpx; |
|||
width: 32rpx; |
|||
height: 32rpx; |
|||
top: 0rpx; |
|||
right: 0rpx; |
|||
transform: rotate(270deg); |
|||
} |
|||
} |
|||
|
|||
.address { |
|||
font-size: 24rpx; |
|||
line-height: 28rpx; |
|||
color: #A1A0A8; |
|||
word-break: break-all; |
|||
} |
|||
|
|||
.time { |
|||
font-size: 24rpx; |
|||
line-height: 28rpx; |
|||
color: #A1A0A8; |
|||
} |
|||
} |
|||
} |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
&:last-child { |
|||
margin-bottom: 160rpx; |
|||
} |
|||
&:last-child { |
|||
margin-bottom: 160rpx; |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
/deep/.u-popup__content { |
|||
background: #323045; |
|||
|
|||
.u-modal__title { |
|||
color: #fff; |
|||
} |
|||
|
|||
.u-modal__content__text { |
|||
text-align: center; |
|||
} |
|||
} |
|||
|
|||
.buttonBg { |
|||
position: fixed; |
|||
bottom: 0rpx; |
|||
background-color: #15141F; |
|||
|
|||
.button { |
|||
width: 670rpx; |
|||
box-sizing: border-box; |
|||
height: 112rpx; |
|||
margin-bottom: 40rpx; |
|||
border-radius: 32rpx; |
|||
font-weight: 700; |
|||
font-size: 32rpx; |
|||
color: #15141F !important; |
|||
|
|||
} |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
/deep/.u-popup__content { |
|||
background: #323045; |
|||
|
|||
.u-modal__title { |
|||
color: #fff; |
|||
} |
|||
|
|||
.u-modal__content__text { |
|||
text-align: center; |
|||
} |
|||
} |
|||
|
|||
.buttonBg { |
|||
position: fixed; |
|||
bottom: 0rpx; |
|||
background-color: #15141F; |
|||
|
|||
.button { |
|||
width: 670rpx; |
|||
box-sizing: border-box; |
|||
height: 112rpx; |
|||
margin-bottom: 40rpx; |
|||
border-radius: 32rpx; |
|||
font-weight: 700; |
|||
font-size: 32rpx; |
|||
color: #15141F !important; |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
|
|||
|
|||
|
|||
} |
|||
|
|||
|
|||
|
|||
|
|||
} |
|||
} |
|||
</style> |
|||
|
File diff suppressed because it is too large
@ -1,172 +1,245 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<!-- nav --> |
|||
<navigation>{{ i18n.WithdrawalRecord }}</navigation> |
|||
<!-- headBtn --> |
|||
<view class="head"> |
|||
<view class="headItem" @click="pageState = 'digitalCurrency'" |
|||
:class="{ select: pageState === 'digitalCurrency' }"> |
|||
{{ i18n.DigitalCurrency }} |
|||
</view> |
|||
<view class="headItem" @click="pageState = 'onLine'" :class="{ select: pageState === 'onLine' }"> |
|||
{{ i18n.OnLine }} |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="cardList"> |
|||
<view class="card" v-for="(item, index) in 4" :key="index"> |
|||
<!-- 卡片条件渲染 --> |
|||
<!-- balance --> |
|||
<card-header v-if="pageState === 'digitalCurrency'" iconName="../../static/withdrawal/money-send.png" |
|||
:title="'904.29483230ACTA'" rightName="Succeed" fontColor="#00E8A2"> |
|||
</card-header> |
|||
<view class="dataBody" v-if="pageState === 'digitalCurrency'"> |
|||
<view style="padding:20rpx 32rpx;"> |
|||
<key-value-row :keyName="i18n.OrderID" :value="'293829773920223873676'"></key-value-row> |
|||
<key-value-row :keyName="i18n.Fees" :value="'10.0922'"></key-value-row> |
|||
<key-value-row :keyName="i18n.Time" :value="'2022/08/06 14:50:34'"></key-value-row> |
|||
</view> |
|||
<view style="border-top: 2rpx solid #323045;padding:0rpx 32rpx; margin-bottom: 20rpx;"> |
|||
<show-more class="digitalShowMore"> |
|||
<key-value-row :keyName="i18n.Address" :value="'dhiukyfdhi8797979870800'"></key-value-row> |
|||
<key-value-row :keyName="i18n.Hash" :value="'dhiukyfdhi8797979870800'"></key-value-row> |
|||
<view class="text">Postscript : ontact customer service on the top-left corner for identity |
|||
verific |
|||
</view> |
|||
</show-more> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<!-- contarct --> |
|||
<card-header v-if="pageState === 'onLine'" iconName="../../static/withdrawal/money-send.png" |
|||
:title="'904.29483230ACTA'" rightName="Succeed" fontColor="#00E8A2"> |
|||
</card-header> |
|||
<view class="dataBody" v-if="pageState === 'onLine'"> |
|||
<view style="padding:20rpx 32rpx;"> |
|||
<key-value-row :keyName="i18n.OrderID" :value="'293829773920223873676'"></key-value-row> |
|||
<key-value-row :keyName="i18n.Fees" :value="'10.0922'"></key-value-row> |
|||
<key-value-row :keyName="i18n.Time" :value="'2022/08/06 14:50:34'"></key-value-row> |
|||
</view> |
|||
<show-more class="onLineShowMore" style="border-top: 2rpx solid #323045;margin-bottom: 20rpx;"> |
|||
<view style="padding:20rpx 32rpx;"> |
|||
<key-value-row :keyName="i18n.USDTRate" :value="'19298'"></key-value-row> |
|||
<key-value-row :keyName="i18n.USDT" :value="'298237'"></key-value-row> |
|||
</view> |
|||
<view style="border-top: 2rpx solid #323045;padding:20rpx 32rpx;"> |
|||
<key-value-row :keyName="i18n.CardNo" :value="'4349 9545 9893 9854 027'"> |
|||
</key-value-row> |
|||
<key-value-row :keyName="i18n.Bank" :value="'Bank of Melbourne'"></key-value-row> |
|||
<key-value-row :keyName="i18n.Payee" :value="'Zhou jielun'"></key-value-row> |
|||
<view class="text">Postscript :ontact customer service on the top-left corner for identity |
|||
verific |
|||
</view> |
|||
</view> |
|||
</show-more> |
|||
|
|||
</view> |
|||
|
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="main"> |
|||
<!-- nav --> |
|||
<navigation>{{ i18n.WithdrawalRecord }}</navigation> |
|||
<!-- headBtn --> |
|||
<view class="head"> |
|||
<view class="headItem" @click="form.type = 'crypto',getList()" |
|||
:class="{ select: form.type === 'crypto' }"> |
|||
{{ i18n.DigitalCurrency }} |
|||
</view> |
|||
<view class="headItem" @click="form.type = 'online',getList()" :class="{ select:form.type=== 'online' }"> |
|||
{{ i18n.OnLine }} |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="cardList"> |
|||
<view class="card" v-for="(item, index) in userInfoObj" :key="index"> |
|||
<!-- 卡片条件渲染 --> |
|||
<!-- balance --> |
|||
<card-header v-if="form.type === 'crypto'" :iconName="baseURL+'/coins/'+item.coinCode+'.png'" |
|||
:title="item.tranAmt+item.coinCode" |
|||
:rightName="item.orderStatus=='processreview'?'Underreview':item.orderStatus=='processsuccess'?'Success': |
|||
item.orderStatus=='processing'?'Processing':item.orderStatus=='processfailed'?'Failed':'Failed'" |
|||
:fontColor="item.orderStatus=='processreview'?'#F2FE8D':item.orderStatus=='processsuccess'?'#00E8A2': |
|||
item.orderStatus=='processfailed'?'#F4506A':item.orderStatus=='processing'?'#00D1FF':'#A1A0A8'"> |
|||
</card-header> |
|||
<view class="dataBody" v-if="form.type === 'crypto'"> |
|||
<view style="padding:20rpx 32rpx;"> |
|||
<key-value-row :keyName="i18n.OrderID" :value="item.orderNo"></key-value-row> |
|||
<key-value-row :keyName="i18n.Fees" :value="item.tranFee"></key-value-row> |
|||
<key-value-row :keyName="i18n.Time" :value="item.addTimeStr"></key-value-row> |
|||
</view> |
|||
<view style="border-top: 2rpx solid #323045;padding:0rpx 32rpx; margin-bottom: 20rpx;"> |
|||
<show-more class="digitalShowMore"> |
|||
<key-value-row :keyName="i18n.Address" :value="item.toAddress"></key-value-row> |
|||
<key-value-row :keyName="i18n.Hash" :value="item.txid"></key-value-row> |
|||
<!-- <view class="text">Postscript : ontact customer service on the top-left corner for identity |
|||
verific |
|||
</view> --> |
|||
</show-more> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<!-- contarct --> |
|||
<!-- <card-header v-if="form.type === 'online'" iconName="../../static/withdrawal/money-send.png" |
|||
:title="'904.29483230ACTA'" rightName="Succeed" fontColor="#00E8A2"> |
|||
</card-header> --> |
|||
<card-header v-if="form.type === 'crypto'" iconName="../../static/withdrawal/money-send.png" |
|||
:title="item.tranAmt+item.coinCode" |
|||
:rightName="item.orderStatus=='processreview'?'Underreview':item.orderStatus=='processsuccess'?'Success': |
|||
item.orderStatus=='processing'?'Processing':item.orderStatus=='processfailed'?'Failed':'Failed'" |
|||
:fontColor="item.orderStatus=='processreview'?'#F2FE8D':item.orderStatus=='processsuccess'?'#00E8A2': |
|||
item.orderStatus=='processfailed'?'#F4506A':item.orderStatus=='processing'?'#00D1FF':'#A1A0A8'"> |
|||
</card-header> |
|||
<view class="dataBody" v-if="form.type === 'online'"> |
|||
<view style="padding:20rpx 32rpx;"> |
|||
<key-value-row :keyName="i18n.OrderID" :value="item.orderNo"></key-value-row> |
|||
<key-value-row :keyName="i18n.Fees" :value="item.tranFee"></key-value-row> |
|||
<key-value-row :keyName="i18n.Time" :value="item.addTimeStr"></key-value-row> |
|||
</view> |
|||
<show-more class="onLineShowMore" style="border-top: 2rpx solid #323045;margin-bottom: 20rpx;"> |
|||
<view style="padding:20rpx 32rpx;"> |
|||
<key-value-row :keyName="i18n.USDTRate" :value="item.usdtRate"></key-value-row> |
|||
<!-- 问 --> |
|||
<key-value-row :keyName="i18n.USDT" :value="parseInt(item.channelAmount,16)"></key-value-row> |
|||
</view> |
|||
<view style="border-top: 2rpx solid #323045;padding:20rpx 32rpx;"> |
|||
<key-value-row :keyName="i18n.CardNo" :value="item.acctId"> |
|||
</key-value-row> |
|||
<key-value-row :keyName="i18n.Bank" :value="item.bankName"></key-value-row> |
|||
<key-value-row :keyName="i18n.Payee" :value="item.acctName"></key-value-row> |
|||
<!-- <view class="text">Postscript :ontact customer service on the top-left corner for identity |
|||
verific |
|||
</view> --> |
|||
</view> |
|||
</show-more> |
|||
|
|||
</view> |
|||
</view> |
|||
<u-empty :text="i18n.Dataisempty" mode="data" v-if="userInfoObj.length==0"></u-empty> |
|||
<u-loadmore :status="loadStatus" :loading-text="loadingText" :loadmore-text="loadmoreText" |
|||
:nomore-text="nomoreText" v-if="userInfoObj.length" height="80" /> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import KeyValueRow from '../../components/KeyValueRow/KeyValueRow.vue'; |
|||
import CardHeader from '../../components/cardHeader/cardHeader.vue'; |
|||
import ShowMore from '../../components/showMore/showMore.vue'; |
|||
export default { |
|||
components: { KeyValueRow, CardHeader, ShowMore }, |
|||
name: "withdrawalRecord", |
|||
data() { |
|||
return { |
|||
pageState: 'digitalCurrency', |
|||
}; |
|||
}, |
|||
computed: { |
|||
i18n() { |
|||
return this.$t("withdrawal"); |
|||
}, |
|||
}, |
|||
onLoad() { |
|||
}, |
|||
onShow() { }, |
|||
methods: { |
|||
change(e) { |
|||
console.log(e); |
|||
} |
|||
|
|||
}, |
|||
} |
|||
import KeyValueRow from '../../components/KeyValueRow/KeyValueRow.vue'; |
|||
import CardHeader from '../../components/cardHeader/cardHeader.vue'; |
|||
import ShowMore from '../../components/showMore/showMore.vue'; |
|||
import constant from '@/utils/constant.js'; |
|||
import api from '@/utils/api' |
|||
export default { |
|||
components: { |
|||
KeyValueRow, |
|||
CardHeader, |
|||
ShowMore |
|||
}, |
|||
name: "withdrawalRecord", |
|||
data() { |
|||
return { |
|||
pageState: 'digitalCurrency', |
|||
baseURL: '', |
|||
isLoadMore: false, //是否加载中 |
|||
loadStatus: 'loadmore', |
|||
loadingText: this.$t("login").toload, |
|||
loadmoreText: this.$t("login").pullup, |
|||
nomoreText: this.$t("login").Nomore, |
|||
form: { |
|||
pageNumber: 1, |
|||
pageSize: 20, |
|||
type: 'crypto', |
|||
}, |
|||
userInfoObj: [], |
|||
}; |
|||
}, |
|||
computed: { |
|||
i18n() { |
|||
return this.$t("withdrawal"); |
|||
}, |
|||
}, |
|||
onReachBottom() { |
|||
if (!this.isLoadMore) { |
|||
this.form.pageNumber += 1 |
|||
this.getList(); |
|||
} |
|||
}, |
|||
onLoad() { |
|||
this.baseURL = constant.BASE_URL |
|||
this.getList() |
|||
}, |
|||
onShow() {}, |
|||
methods: { |
|||
getList() { |
|||
this.isLoadMore = true |
|||
api.withdrawList(this.form).then(res => { |
|||
if (res.content.length) { |
|||
if (this.form.pageNumber > 1) { |
|||
this.userInfoObj = this.userInfoObj.concat(res.content) |
|||
for (var i = 0; i < this.userInfoObj.length; i++) { |
|||
if (this.userInfoObj[i].addTime) { |
|||
this.userInfoObj[i].timestr = this.$index.formatyymmddhhmmss(this.userInfoObj[ |
|||
i].addTime) |
|||
} |
|||
} |
|||
} else { |
|||
this.userInfoObj = res.content |
|||
for (var i = 0; i < this.userInfoObj.length; i++) { |
|||
if (this.userInfoObj[i].addTime) { |
|||
this.userInfoObj[i].timestr = this.$index.formatyymmddhhmmss(this.userInfoObj[ |
|||
i].addTime) |
|||
} |
|||
} |
|||
} |
|||
if (this.userInfoObj.length >= Number(res.totalElements)) { // 判断接口返回数据量小于请求数据量,则表示此为最后一页 |
|||
this.isLoadMore = true |
|||
this.loadStatus = 'nomore' |
|||
} else { |
|||
this.isLoadMore = false |
|||
} |
|||
} else { |
|||
this.isLoadMore = true |
|||
this.loadStatus = 'nomore' |
|||
this.userInfoObj = [] |
|||
} |
|||
this.$forceUpdate() |
|||
}) |
|||
}, |
|||
change(e) { |
|||
console.log(e); |
|||
} |
|||
|
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.main { |
|||
|
|||
.head { |
|||
margin-top: 200rpx; |
|||
margin-left: 60rpx; |
|||
width: 632rpx; |
|||
display: flex; |
|||
justify-content: space-around; |
|||
align-items: center; |
|||
padding: 48rpx 0; |
|||
|
|||
.headItem { |
|||
width: 300rpx; |
|||
height: 68rpx; |
|||
line-height: 68rpx; |
|||
background: #211F32; |
|||
border-radius: 16rpx; |
|||
text-align: center; |
|||
font-size: 32rpx; |
|||
color: #A1A0A8; |
|||
|
|||
&.select { |
|||
background: #00E8A2; |
|||
color: #15141F; |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
.cardList { |
|||
padding-bottom: 40rpx; |
|||
|
|||
.card { |
|||
overflow: hidden; |
|||
background: #211F32; |
|||
border-radius: 32rpx; |
|||
margin: 0 32rpx 32rpx; |
|||
|
|||
|
|||
|
|||
.dataBody { |
|||
box-sizing: border-box; |
|||
|
|||
.onLineShowMore { |
|||
/deep/.showMoreTool { |
|||
margin: 0 32rpx; |
|||
} |
|||
} |
|||
|
|||
|
|||
.text { |
|||
margin-top: 20rpx; |
|||
padding: 10rpx 16rpx; |
|||
background: #323045; |
|||
border-radius: 8rpx; |
|||
font-size: 24rpx; |
|||
color: #A1A0A8; |
|||
} |
|||
|
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
} |
|||
.main { |
|||
|
|||
.head { |
|||
margin-top: 200rpx; |
|||
margin-left: 60rpx; |
|||
width: 632rpx; |
|||
display: flex; |
|||
justify-content: space-around; |
|||
align-items: center; |
|||
padding: 48rpx 0; |
|||
|
|||
.headItem { |
|||
width: 300rpx; |
|||
height: 68rpx; |
|||
line-height: 68rpx; |
|||
background: #211F32; |
|||
border-radius: 16rpx; |
|||
text-align: center; |
|||
font-size: 32rpx; |
|||
color: #A1A0A8; |
|||
|
|||
&.select { |
|||
background: #00E8A2; |
|||
color: #15141F; |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
.cardList { |
|||
padding-bottom: 40rpx; |
|||
|
|||
.card { |
|||
overflow: hidden; |
|||
background: #211F32; |
|||
border-radius: 32rpx; |
|||
margin: 0 32rpx 32rpx; |
|||
|
|||
|
|||
|
|||
.dataBody { |
|||
box-sizing: border-box; |
|||
|
|||
.onLineShowMore { |
|||
/deep/.showMoreTool { |
|||
margin: 0 32rpx; |
|||
} |
|||
} |
|||
|
|||
|
|||
.text { |
|||
margin-top: 20rpx; |
|||
padding: 10rpx 16rpx; |
|||
background: #323045; |
|||
border-radius: 8rpx; |
|||
font-size: 24rpx; |
|||
color: #A1A0A8; |
|||
} |
|||
|
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
} |
|||
</style> |
|||
|
File diff suppressed because it is too large
Loading…
Reference in new issue