371 lines
9.8 KiB
Vue
371 lines
9.8 KiB
Vue
<template>
|
||
<view class="content top-view">
|
||
<TopSafe bgColor="rgba(0,0,0,0)"></TopSafe>
|
||
<Header
|
||
bgColor="rgba(0,0,0,0)"
|
||
color="#fff"
|
||
title="数字积分兑换"
|
||
style="min-height: 88rpx"
|
||
/>
|
||
<view class="top-panel">
|
||
<text class="text-24 text-white" style="margin-top: 24rpx">股东行权</text>
|
||
<text class="text-88 text-white text-bold" style="margin-top: 24rpx"
|
||
>{{ curData ? curData.curAmount : 0 }}
|
||
<text class="text-44 text-white">数字积分(TBC)</text>
|
||
</text>
|
||
<view class="btn-view">
|
||
<view class="left-btn" @click="onLeft">
|
||
<up-image
|
||
src="/pages/rwa_package/static/rwa/tx.png"
|
||
style="margin-right: 5rpx; margin-top: 2rpx"
|
||
width="18"
|
||
height="18"
|
||
bgColor="#f1f6ff00"
|
||
/>
|
||
<text
|
||
class="text-zi text-32"
|
||
style="margin-left: 5rpx; line-height: 1.2"
|
||
>兑换</text
|
||
>
|
||
</view>
|
||
<view class="right-btn" @click="onRight">
|
||
<up-image
|
||
src="/pages/rwa_package/static/rwa/jl.png"
|
||
style="margin-right: 5rpx; margin-top: 2rpx"
|
||
width="18"
|
||
height="18"
|
||
bgColor="#f1f6ff00"
|
||
/>
|
||
<text
|
||
class="text-white text-32"
|
||
style="margin-left: 5rpx; line-height: 1.2"
|
||
>记录</text
|
||
>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="bottom-panel">
|
||
<view class="bottom-head-view">
|
||
<text class="text-32 text-bold text-gray">股东账户</text>
|
||
</view>
|
||
<view class="bottom-list">
|
||
<view class="list-box" v-if="dataList.length">
|
||
<AccountItemTwo
|
||
:dataItem="item"
|
||
@jie="onJie"
|
||
@select="onSelect"
|
||
v-for="(item, index) in dataList"
|
||
:key="index"
|
||
></AccountItemTwo>
|
||
</view>
|
||
<view class="add-address" @click="onAdd">
|
||
<up-image
|
||
src="/pages/rwa_package/static/rwa/add.png"
|
||
style="margin-right: 5rpx; margin-top: 2rpx"
|
||
width="12"
|
||
height="12"
|
||
bgColor="#f1f6ff00"
|
||
/>
|
||
<text
|
||
class="text-zi text-32"
|
||
style="margin-left: 5rpx; line-height: 1.2"
|
||
>券商登记地址</text
|
||
>
|
||
</view>
|
||
<!-- <view class="no-box" v-else>
|
||
<up-image src="https://static.tbmall.xin/static/kzt.png" width="100" height="100"
|
||
bgColor="#f1f6ff00"></up-image>
|
||
<text class="text-32 text-fu1" style="margin-top:32rpx">暂无账户数据～</text>
|
||
</view> -->
|
||
</view>
|
||
</view>
|
||
|
||
<ShuTips :itemShow="tipsShow" @close="onClose" @ok="onOk"></ShuTips>
|
||
<up-toast ref="uToastRef"></up-toast>
|
||
|
||
<u-popup :show="addAddressShow" mode="bottom" bgColor="transparent">
|
||
<view class="add-address-item">
|
||
<view class="select-head">
|
||
<view></view>
|
||
<text class="text-28 text-fu1">复制地址</text>
|
||
<u-icon
|
||
name="close"
|
||
color="#333"
|
||
size="16"
|
||
@click="addAddressShow = false"
|
||
></u-icon>
|
||
</view>
|
||
<view class="select-box" @click="copyData(selectAddress.address)">
|
||
<view class="select-box-one"> {{ selectAddress.address }} </view>
|
||
<up-image
|
||
src="/static/common/copy.png"
|
||
width="17"
|
||
height="17"
|
||
bgColor="#f1f6ff00"
|
||
style="margin-top: 8rpx"
|
||
></up-image>
|
||
</view>
|
||
|
||
<view class="add-address-tip">
|
||
<up-image
|
||
src="/pages/rwa_package/static/tips.png"
|
||
width="16"
|
||
height="16"
|
||
bgColor="#f1f6ff00"
|
||
style="margin-right: 8rpx"
|
||
/>
|
||
复制链接到浏览器修改！
|
||
</view>
|
||
</view>
|
||
</u-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
getExchUsers,
|
||
unbindExchUsers,
|
||
getAcctBalance,
|
||
} from "@/api/finance.js";
|
||
import { copyData } from "@/utils/index.js";
|
||
import { TOKEN_NAME, getStorageFun } from "@/utils/auth.js";
|
||
import TopSafe from "@/components/common/top-safe.nvue";
|
||
import Header from "@/components/common/header.vue";
|
||
import ShuTips from "@/pages/rwa_package/account/components/shu-tips.vue";
|
||
import AccountItemTwo from "@/pages/rwa_package/account/components/account-item-two.vue";
|
||
|
||
export default {
|
||
components: { Header, TopSafe, ShuTips, AccountItemTwo },
|
||
data() {
|
||
return {
|
||
dataList: [],
|
||
tipsShow: false,
|
||
curData: null,
|
||
addAddressShow: false,
|
||
selectAddress: {
|
||
address: `https://taddr.alpha-group.top?token=${getStorageFun(
|
||
TOKEN_NAME
|
||
)}`,
|
||
},
|
||
};
|
||
},
|
||
onLoad(option) {},
|
||
onShow() {
|
||
this.acctBalance();
|
||
this.exchUsers();
|
||
},
|
||
methods: {
|
||
copyData,
|
||
exchUsers() {
|
||
getExchUsers({ name: "WALLET" }).then((res) => {
|
||
if (res && res.bizcode === 100) {
|
||
this.dataList = res.data.entitys ? res.data.entitys : [];
|
||
}
|
||
});
|
||
},
|
||
onJie(item) {
|
||
let params = {
|
||
accountId: item.id,
|
||
};
|
||
unbindExchUsers(params).then((resp) => {
|
||
if (resp && resp.bizcode === 100) {
|
||
this.$refs.uToastRef.show({
|
||
type: "success",
|
||
message: "解绑成功",
|
||
});
|
||
|
||
this.exchUsers();
|
||
}
|
||
});
|
||
},
|
||
onRight() {
|
||
uni.navigateTo({
|
||
url: "/pages/rwa_package/rwa_withdrawal_log/rwa_withdrawal_log?back=rwa",
|
||
});
|
||
},
|
||
onLeft() {
|
||
this.tipsShow = true;
|
||
},
|
||
onClose() {
|
||
this.tipsShow = false;
|
||
},
|
||
onOk(index) {
|
||
if (index == 0) {
|
||
uni.navigateTo({
|
||
url: "/pages/rwa_package/account/shu",
|
||
});
|
||
} else if (index == 1) {
|
||
uni.navigateTo({
|
||
url: "/pages/rwa_package/rwa_withdrawal/rwa_withdrawal",
|
||
});
|
||
}
|
||
this.onClose();
|
||
},
|
||
acctBalance() {
|
||
getAcctBalance().then((resp) => {
|
||
if (resp && resp.bizcode === 100) {
|
||
this.curData = null;
|
||
resp.data.forEach((item) => {
|
||
if (item.categoty == "vcoin") {
|
||
this.curData = item;
|
||
}
|
||
});
|
||
}
|
||
});
|
||
},
|
||
onAdd() {
|
||
this.addAddressShow = true;
|
||
},
|
||
onSelect(item) {
|
||
// this.selectAddress = item;
|
||
// this.addAddressShow = true;
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.top-view {
|
||
background: linear-gradient(90deg, $app-zt-color, #ae61fa);
|
||
.bottom-panel {
|
||
width: 100%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
height: calc(100vh - 418rpx - 32rpx - var(--status-bar-height));
|
||
background-color: #fff;
|
||
border-radius: 24rpx 24rpx 0 0;
|
||
padding: 0 32rpx 32rpx;
|
||
margin-top: 32rpx;
|
||
box-sizing: border-box;
|
||
.bottom-head-view {
|
||
width: 100%;
|
||
height: 88rpx;
|
||
min-height: 88rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
}
|
||
.bottom-list {
|
||
width: 100%;
|
||
height: calc(100% - 88rpx);
|
||
overflow-y: auto;
|
||
display: flex;
|
||
flex-direction: column;
|
||
.no-box {
|
||
width: 100%;
|
||
margin-top: 100rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
}
|
||
}
|
||
.add-address {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 12rpx;
|
||
border: 1px solid #e3e3e3;
|
||
color: #7934f6;
|
||
font-size: 28rpx;
|
||
height: 120rpx;
|
||
margin-top: 26rpx;
|
||
}
|
||
}
|
||
|
||
.top-panel {
|
||
width: 100%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
min-height: calc(330rpx + var(--status-bar-height));
|
||
padding: 0 32rpx;
|
||
box-sizing: border-box;
|
||
|
||
.btn-view {
|
||
width: 100%;
|
||
height: 88rpx;
|
||
min-height: 88rpx;
|
||
margin-top: 32rpx;
|
||
display: flex;
|
||
flex-direction: row;
|
||
justify-content: space-between;
|
||
.left-btn {
|
||
width: 48%;
|
||
height: 100%;
|
||
background-color: #fff;
|
||
align-items: center;
|
||
justify-content: center;
|
||
display: flex;
|
||
border-radius: 16rpx;
|
||
}
|
||
.right-btn {
|
||
width: 48%;
|
||
height: 100%;
|
||
background-color: rgba(0, 0, 0, 0);
|
||
border: 2rpx solid #fff;
|
||
box-sizing: border-box;
|
||
align-items: center;
|
||
justify-content: center;
|
||
display: flex;
|
||
border-radius: 16rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.add-address-item {
|
||
width: 100%;
|
||
min-height: 588rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
padding: 0 32rpx 24rpx;
|
||
box-sizing: border-box;
|
||
background-color: #fff;
|
||
border-radius: 24rpx 24rpx 0 0;
|
||
.select-box {
|
||
width: 100%;
|
||
height: 80rpx;
|
||
background: rgba(121, 52, 246, 0.05);
|
||
border-radius: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 0 32rpx;
|
||
box-sizing: border-box;
|
||
margin-top: 32rpx;
|
||
position: relative;
|
||
font-size: 28rpx;
|
||
color: #7934f6;
|
||
|
||
.select-icon {
|
||
position: absolute;
|
||
right: 28rpx;
|
||
}
|
||
|
||
.select-box-one {
|
||
overflow: hidden; /* 1. 超出隐藏 */
|
||
white-space: nowrap; /* 2. 不换行 */
|
||
text-overflow: ellipsis; /* 3. 省略号 */
|
||
width: 590rpx;
|
||
}
|
||
}
|
||
|
||
.add-address-tip {
|
||
width: 100%;
|
||
display: flex;
|
||
font-size: 24rpx;
|
||
color: #666;
|
||
margin-top: 24rpx;
|
||
}
|
||
.select-head {
|
||
width: 100%;
|
||
height: 88rpx;
|
||
min-height: 88rpx;
|
||
display: flex;
|
||
flex-direction: row;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
}
|
||
</style>
|