754 lines
17 KiB
Vue
754 lines
17 KiB
Vue
|
<template>
|
|||
|
<view class="container">
|
|||
|
<view class="wollet">
|
|||
|
<view class="wollet_top">
|
|||
|
<view class="top_left">
|
|||
|
<!-- @click="oneshow = true" -->
|
|||
|
<u-icon name="list" color="#9e9cba" size="28" @click="showMoneyList"></u-icon>
|
|||
|
</view>
|
|||
|
<view class=" top_right">
|
|||
|
<view class="top_wollet" @click="tocreatewallet">
|
|||
|
<image src="/static/wallet.png" mode=""></image>
|
|||
|
</view>
|
|||
|
<view class="top_code" @click="scanCode">
|
|||
|
<image src="/static/wallet2.png" mode=""></image>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<!-- 錢包餘額 -->
|
|||
|
<view class="balance">
|
|||
|
<view class="balance_left">
|
|||
|
<view class="num" v-if="showbalance">
|
|||
|
$0
|
|||
|
</view>
|
|||
|
<view class="num" v-else>
|
|||
|
****
|
|||
|
</view>
|
|||
|
<view class="eye" @click="changebalance">
|
|||
|
<image :src="!showbalance ? showbalanceimg : hidebalanceimg" mode=""></image>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="balance_right">
|
|||
|
<view class="money" style="font-size: 40rpx;">
|
|||
|
$
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<!-- thr -->
|
|||
|
<view class="codelist">
|
|||
|
<view class="codeitem" @click="accountsshowdialog">
|
|||
|
<view class="item_image">
|
|||
|
<image src="/static/wallet6.png" mode="widthFix"></image>
|
|||
|
</view>
|
|||
|
<view class="item_tit">
|
|||
|
轉賬
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="codeitem" @click="topaymentcode">
|
|||
|
<view class="item_image">
|
|||
|
<image src="/static/wallet5.png" mode="widthFix"></image>
|
|||
|
</view>
|
|||
|
<view class="item_tit">
|
|||
|
收款
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="codeitem" @click="flashexchange">
|
|||
|
<view class="item_image">
|
|||
|
<image src="/static/wallet4.png" mode="widthFix"></image>
|
|||
|
</view>
|
|||
|
<view class="item_tit">
|
|||
|
閃兌
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="codeitem" @click="flashexchange">
|
|||
|
<view class="item_image">
|
|||
|
<image src="/static/wallet3.png" mode="widthFix"></image>
|
|||
|
</view>
|
|||
|
<view class="item_tit">
|
|||
|
更多工具
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<!-- cont -->
|
|||
|
<view class="tabs">
|
|||
|
<view class="tabs_left">
|
|||
|
<u-tabs :list="tabslist" @click="tabs" lineColor="#4c56d6" :activeStyle="{
|
|||
|
color: '#fff'
|
|||
|
}"></u-tabs>
|
|||
|
</view>
|
|||
|
<view class="tabs_right">
|
|||
|
<view class="search" style="width: 220rpx;">
|
|||
|
<u-search placeholder="搜索" v-model="searchvalue" :showAction="false" height="60rpx"
|
|||
|
bgColor="#3f3a63"></u-search>
|
|||
|
</view>
|
|||
|
<view class="add">
|
|||
|
<u-icon name="plus" color="#FFF" size="14" @click="toassets"></u-icon>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<!-- moneybi -->
|
|||
|
<view class="moneylist">
|
|||
|
<view class="moneyitem" @click="biDetail" v-for="item in 4">
|
|||
|
<view class="item_le">
|
|||
|
<image src="/static/wallet7.png" mode="heightFix"></image>
|
|||
|
</view>
|
|||
|
<view class="item_ri">
|
|||
|
<view class="name">
|
|||
|
<view class="">
|
|||
|
BNB
|
|||
|
</view>
|
|||
|
<view style="margin-top: 12rpx; font-size: 25rpx;">
|
|||
|
<text style="color: #908baf;">$0</text><text
|
|||
|
style="color: limegreen;">+0%</text>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="number">
|
|||
|
<view class="" style="color:#fff">
|
|||
|
0
|
|||
|
</view>
|
|||
|
<view style="margin-top: 12rpx; font-size: 25rpx;">
|
|||
|
<text style="color: #908baf;">$0</text>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<!-- 弹出 -->
|
|||
|
<u-popup :show="oneshow" mode="bottom" @close="oneclose" round="10" :closeable="true"
|
|||
|
:closeOnClickOverlay="false">
|
|||
|
<view style="height: 950rpx;">
|
|||
|
<view class="search">
|
|||
|
<template v-if="!showsearch">
|
|||
|
<u-icon name="search" color="black" size="28" @click="showsearch = true"></u-icon>
|
|||
|
<view class="tit">
|
|||
|
錢包列表
|
|||
|
</view>
|
|||
|
</template>
|
|||
|
<template v-else>
|
|||
|
<view class="" style="width: 500rpx;">
|
|||
|
<u-search placeholder="請輸入錢包名稱" v-model="onesearchvalue" :showAction="false" height="60rpx"
|
|||
|
bgColor="#f6f6f6"></u-search>
|
|||
|
</view>
|
|||
|
<view style="margin-left: 20rpx;" @click="showsearch = false">
|
|||
|
取消
|
|||
|
</view>
|
|||
|
</template>
|
|||
|
</view>
|
|||
|
<!-- cont -->
|
|||
|
<view class="onecontent">
|
|||
|
<!-- 左邊 -->
|
|||
|
<view class="onecont-left">
|
|||
|
<scroll-view scroll-y="true" class="scroll-Y" style="height: 860rpx;">
|
|||
|
<view :class="[{'onecont-leftitem':true},{'oneactive':oneactive == index}]"
|
|||
|
v-for="(index,item) in 6" :key="index" @click="Oneclassification(index)">
|
|||
|
<view class="oneleftimg">
|
|||
|
<image src="/static/wallet7.png" mode="heightFix"></image>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</scroll-view>
|
|||
|
</view>
|
|||
|
<!-- 右邊 -->
|
|||
|
<view class="onecont-right">
|
|||
|
<view class="rig-top">
|
|||
|
<view class="rig-tit">
|
|||
|
幣安智能鏈
|
|||
|
</view>
|
|||
|
<view class="rig-add" @click="show = true">
|
|||
|
<u-icon name="plus" color="#050419" :bold="true" size="10"></u-icon>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<!-- item -->
|
|||
|
<view class="rig-cont">
|
|||
|
<scroll-view scroll-y="true" style="height: 760rpx;">
|
|||
|
<view class="onecont-rightitem" v-for="(item,index) in 6" :key="index"
|
|||
|
@click="pitchon(index)">
|
|||
|
<view class="item_ri">
|
|||
|
<view class="name">
|
|||
|
<view class="" style="color: #6975FF;">
|
|||
|
hi-2
|
|||
|
</view>
|
|||
|
<view style="margin-top: 12rpx; font-size: 25rpx;">
|
|||
|
<text
|
|||
|
style="color: #172463;">️{{userMoneyAdressOptions(userMoneyAdress)}}</text>
|
|||
|
<image @tap="copyAdress(userMoneyAdress)" src="/static/copy1.png"
|
|||
|
style="width: 30rpx;height: 30rpx;margin-left: 10px;"></image>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="number">
|
|||
|
<view class="">
|
|||
|
<!-- v-show="correctval == index" -->
|
|||
|
<u-icon name="checkmark" color="#6975FF" size="24"
|
|||
|
:class="{'hide':true,'show':correctval == index}"></u-icon>
|
|||
|
</view>
|
|||
|
<view style="margin-top: 12rpx; font-size: 25rpx; color:#6975FF">
|
|||
|
1.5588 <text style="margin-left: 10rpx;">BNB</text>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</scroll-view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="botmore">
|
|||
|
<u-icon name="grid" color="#2979ff" size="28"></u-icon>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</u-popup>
|
|||
|
<!-- 二层弹框 -->
|
|||
|
<u-popup :show="show" mode="bottom" @close="close" :closeable="true">
|
|||
|
<view style="height: 600rpx; padding: 30rpx;">
|
|||
|
<view style="margin-bottom: 65rpx;">選擇添加方式</view>
|
|||
|
<view class="createwa" @click="towallet">
|
|||
|
創建錢包
|
|||
|
</view>
|
|||
|
<view class="createwa" style="margin-bottom: 120rpx;">
|
|||
|
導入錢包
|
|||
|
</view>
|
|||
|
<view class="createwa" @click="show = false">
|
|||
|
關閉
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</u-popup>
|
|||
|
<!-- 轉賬弹框 -->
|
|||
|
<u-popup :show="accountsshow" mode="bottom" @close="accountsclose" round="10" :closeable="true">
|
|||
|
<view style="height: 800rpx; padding: 30rpx;">
|
|||
|
<view class="accounts">選擇轉賬代幣</view>
|
|||
|
<view class="search" style="width: 655rpx;">
|
|||
|
<u-search placeholder="請輸入代幣名稱進行搜索" v-model="accountsvalue" :showAction="false" height="80rpx"
|
|||
|
bgColor="#f6f6f6"></u-search>
|
|||
|
</view>
|
|||
|
<view class="accountslist">
|
|||
|
<scroll-view scroll-y="true" style="height: 600rpx;">
|
|||
|
<view class="accountsitem" v-for="(item,index) in 5" :key="index" @click="totransfer">
|
|||
|
<view class="item_le">
|
|||
|
<image src="/static/wallet7.png" mode="heightFix"></image>
|
|||
|
</view>
|
|||
|
<view class="item_ri">
|
|||
|
<view class="name">
|
|||
|
<view class="">
|
|||
|
ETH
|
|||
|
</view>
|
|||
|
<view style="margin-top: 12rpx; font-size: 25rpx;">
|
|||
|
<text style="color: #908baf;">$2,158.98</text><text
|
|||
|
style="color: limegreen;">+5.17%</text>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="number">
|
|||
|
<view class="">
|
|||
|
0
|
|||
|
</view>
|
|||
|
<view style="margin-top: 12rpx; font-size: 25rpx;">
|
|||
|
<text style="color: #908baf;">= $0</text>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</scroll-view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</u-popup>
|
|||
|
</view>
|
|||
|
</template>
|
|||
|
|
|||
|
<script>
|
|||
|
export default {
|
|||
|
data() {
|
|||
|
return {
|
|||
|
tabslist: [{
|
|||
|
name: '資產',
|
|||
|
}, {
|
|||
|
name: 'DeFi',
|
|||
|
}, {
|
|||
|
name: 'NFT'
|
|||
|
}],
|
|||
|
searchvalue: '',
|
|||
|
onesearchvalue: '',
|
|||
|
showbalanceimg: "/static/eye_on.png",
|
|||
|
hidebalanceimg: "/static/eye_off.png",
|
|||
|
showbalance: false,
|
|||
|
oneshow: false, // 一层
|
|||
|
show: false, //二层
|
|||
|
accountsshow: false,
|
|||
|
userMoneyAdress: '0x8622572752752752752727527527FDc3675',
|
|||
|
oneactive: 1,
|
|||
|
correctval: 0,
|
|||
|
showsearch: false,
|
|||
|
accountsvalue: '' // 轉賬
|
|||
|
};
|
|||
|
},
|
|||
|
methods: {
|
|||
|
accountsshowdialog(){
|
|||
|
uni.showToast({
|
|||
|
icon: 'none',
|
|||
|
title: '功能暫未開放',
|
|||
|
duration: 2000
|
|||
|
});
|
|||
|
return
|
|||
|
this.accountsshow = true;
|
|||
|
},
|
|||
|
showMoneyList(){
|
|||
|
uni.showToast({
|
|||
|
icon: 'none',
|
|||
|
title: '功能暫未開放',
|
|||
|
duration: 2000
|
|||
|
});
|
|||
|
return
|
|||
|
this.oneshow = true;
|
|||
|
},
|
|||
|
biDetail(){
|
|||
|
uni.showToast({
|
|||
|
icon: 'none',
|
|||
|
title: '功能暫未開放',
|
|||
|
duration: 2000
|
|||
|
});
|
|||
|
return
|
|||
|
},
|
|||
|
tabs(item) {
|
|||
|
uni.showToast({
|
|||
|
icon: 'none',
|
|||
|
title: '功能暫未開放',
|
|||
|
duration: 2000
|
|||
|
});
|
|||
|
return
|
|||
|
console.log('item', item);
|
|||
|
},
|
|||
|
towallet() {
|
|||
|
uni.navigateTo({
|
|||
|
url: '/pages/wallet/createmethod'
|
|||
|
})
|
|||
|
this.show = false
|
|||
|
this.oneshow = false
|
|||
|
},
|
|||
|
// 餘額
|
|||
|
changebalance() {
|
|||
|
this.showbalance = !this.showbalance
|
|||
|
},
|
|||
|
// 一层彈窗
|
|||
|
oneclose() {
|
|||
|
this.oneshow = false
|
|||
|
},
|
|||
|
close() {
|
|||
|
this.show = false
|
|||
|
},
|
|||
|
accountsclose() {
|
|||
|
this.accountsshow = false
|
|||
|
},
|
|||
|
Oneclassification(i) {
|
|||
|
console.log("iiiiii", i)
|
|||
|
this.oneactive = i
|
|||
|
},
|
|||
|
// 弹框列表
|
|||
|
pitchon(i) {
|
|||
|
this.correctval = i
|
|||
|
},
|
|||
|
userMoneyAdressOptions(data) {
|
|||
|
let start = data.substring(0, 14);
|
|||
|
let end = data.substring(data.length - 4);
|
|||
|
let middle = "…";
|
|||
|
let finalString = start + middle + end;
|
|||
|
return finalString
|
|||
|
},
|
|||
|
tocreatewallet() {
|
|||
|
uni.showToast({
|
|||
|
icon: 'none',
|
|||
|
title: '功能暫未開放',
|
|||
|
duration: 2000
|
|||
|
});
|
|||
|
return
|
|||
|
uni.navigateTo({
|
|||
|
url: '/pages/wallet/choosewallet'
|
|||
|
})
|
|||
|
},
|
|||
|
// 掃碼
|
|||
|
scanCode() {
|
|||
|
uni.showToast({
|
|||
|
icon: 'none',
|
|||
|
title: '功能暫未開放',
|
|||
|
duration: 2000
|
|||
|
});
|
|||
|
return
|
|||
|
uni.scanCode({
|
|||
|
success: function(res) {
|
|||
|
console.log('条码类型:' + res.scanType);
|
|||
|
console.log('条码内容:' + res.result);
|
|||
|
}
|
|||
|
});
|
|||
|
},
|
|||
|
//暫未開放
|
|||
|
flashexchange() {
|
|||
|
uni.showToast({
|
|||
|
icon: 'none',
|
|||
|
title: '功能暫未開放',
|
|||
|
duration: 2000
|
|||
|
});
|
|||
|
return
|
|||
|
},
|
|||
|
// 收款碼
|
|||
|
topaymentcode() {
|
|||
|
uni.showToast({
|
|||
|
icon: 'none',
|
|||
|
title: '功能暫未開放',
|
|||
|
duration: 2000
|
|||
|
});
|
|||
|
return
|
|||
|
uni.navigateTo({
|
|||
|
url: '/pages/wallet/paymentcode'
|
|||
|
})
|
|||
|
},
|
|||
|
// 資產
|
|||
|
toassets() {
|
|||
|
uni.showToast({
|
|||
|
icon: 'none',
|
|||
|
title: '功能暫未開放',
|
|||
|
duration: 2000
|
|||
|
});
|
|||
|
return
|
|||
|
uni.navigateTo({
|
|||
|
url: '/pages/wallet/assets'
|
|||
|
})
|
|||
|
},
|
|||
|
// 轉賬
|
|||
|
totransfer() {
|
|||
|
uni.navigateTo({
|
|||
|
url: '/pages/wallet/transfer'
|
|||
|
})
|
|||
|
this.accountsshow = false
|
|||
|
},
|
|||
|
copyAdress(adress) {
|
|||
|
uni.setClipboardData({
|
|||
|
data: adress,
|
|||
|
success: () => {
|
|||
|
uni.showToast({
|
|||
|
title: '複製成功',
|
|||
|
icon: 'success'
|
|||
|
})
|
|||
|
}
|
|||
|
})
|
|||
|
},
|
|||
|
}
|
|||
|
}
|
|||
|
</script>
|
|||
|
|
|||
|
<style lang="scss">
|
|||
|
.container {
|
|||
|
border-top: 1px solid dimgrey;
|
|||
|
width: 100vw;
|
|||
|
min-height: 100vh;
|
|||
|
padding: 20px;
|
|||
|
box-sizing: border-box;
|
|||
|
background: linear-gradient(to bottom, #000033, #51599b);
|
|||
|
|
|||
|
image {
|
|||
|
width: 100%;
|
|||
|
height: 100%;
|
|||
|
}
|
|||
|
|
|||
|
.wollet {
|
|||
|
.wollet_top {
|
|||
|
display: flex;
|
|||
|
justify-content: space-between;
|
|||
|
align-items: center;
|
|||
|
|
|||
|
.top_left {}
|
|||
|
|
|||
|
.top_right {
|
|||
|
display: flex;
|
|||
|
|
|||
|
.top_wollet {
|
|||
|
width: 45rpx;
|
|||
|
height: 45rpx;
|
|||
|
}
|
|||
|
|
|||
|
.top_code {
|
|||
|
width: 45rpx;
|
|||
|
height: 45rpx;
|
|||
|
margin-left: 40rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.balance {
|
|||
|
width: 100%;
|
|||
|
height: 180rpx;
|
|||
|
background: linear-gradient(to bottom, #392a94, #7c7dd5);
|
|||
|
margin: 30rpx 0;
|
|||
|
border-radius: 20rpx;
|
|||
|
color: #fff;
|
|||
|
display: flex;
|
|||
|
justify-content: space-between;
|
|||
|
align-items: center;
|
|||
|
padding: 30rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
|
|||
|
.balance_left {
|
|||
|
display: flex;
|
|||
|
align-items: center;
|
|||
|
|
|||
|
.num {
|
|||
|
font-size: 40rpx;
|
|||
|
}
|
|||
|
|
|||
|
.eye {
|
|||
|
width: 40rpx;
|
|||
|
height: 40rpx;
|
|||
|
margin-left: 20rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
}
|
|||
|
|
|||
|
.codelist {
|
|||
|
display: flex;
|
|||
|
justify-content: space-between;
|
|||
|
margin-bottom: 30rpx;
|
|||
|
|
|||
|
.codeitem {
|
|||
|
width: 145rpx;
|
|||
|
height: 120rpx;
|
|||
|
background-color: #392e7f;
|
|||
|
color: #fff;
|
|||
|
font-size: 20rpx;
|
|||
|
border-radius: 20rpx;
|
|||
|
display: flex;
|
|||
|
justify-content: center;
|
|||
|
align-items: center;
|
|||
|
flex-direction: column;
|
|||
|
|
|||
|
.item_image {
|
|||
|
width: 40rpx;
|
|||
|
height: 40rpx;
|
|||
|
margin-bottom: 5rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.tabs {
|
|||
|
display: flex;
|
|||
|
justify-content: space-between;
|
|||
|
align-items: center;
|
|||
|
|
|||
|
.tabs_right {
|
|||
|
display: flex;
|
|||
|
justify-content: center;
|
|||
|
align-items: center;
|
|||
|
|
|||
|
.add {
|
|||
|
width: 60rpx;
|
|||
|
height: 60rpx;
|
|||
|
background-color: #3f3a63;
|
|||
|
border-radius: 50%;
|
|||
|
display: flex;
|
|||
|
justify-content: center;
|
|||
|
align-items: center;
|
|||
|
margin-left: 20rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.moneylist {
|
|||
|
margin-top: 30rpx;
|
|||
|
|
|||
|
.moneyitem {
|
|||
|
display: flex;
|
|||
|
justify-content: space-between;
|
|||
|
margin-bottom: 50rpx;
|
|||
|
align-items: center;
|
|||
|
|
|||
|
.item_le {
|
|||
|
width: 100rpx;
|
|||
|
height: 100rpx;
|
|||
|
border-radius: 50%;
|
|||
|
}
|
|||
|
|
|||
|
.item_ri {
|
|||
|
width: 540rpx;
|
|||
|
height: 100rpx;
|
|||
|
display: flex;
|
|||
|
justify-content: space-between;
|
|||
|
border-bottom: 2rpx solid #534a84;
|
|||
|
|
|||
|
.name {
|
|||
|
color: #fff;
|
|||
|
display: flex;
|
|||
|
flex-direction: column;
|
|||
|
padding-bottom: 10rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.search {
|
|||
|
display: flex;
|
|||
|
align-items: center;
|
|||
|
padding: 25rpx;
|
|||
|
|
|||
|
.tit {
|
|||
|
margin-left: 240rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.onecontent {
|
|||
|
display: flex;
|
|||
|
position: relative;
|
|||
|
|
|||
|
.botmore {
|
|||
|
width: 160rpx;
|
|||
|
height: 160rpx;
|
|||
|
display: flex;
|
|||
|
justify-content: center;
|
|||
|
align-content: center;
|
|||
|
position: absolute;
|
|||
|
left: 0;
|
|||
|
bottom: 0;
|
|||
|
background-color: #fff;
|
|||
|
}
|
|||
|
|
|||
|
.onecont-left {
|
|||
|
width: 160rpx;
|
|||
|
background-color: #f6f6f6;
|
|||
|
height: 860rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
display: flex;
|
|||
|
flex-wrap: wrap;
|
|||
|
|
|||
|
.onecont-leftitem {
|
|||
|
width: 160rpx;
|
|||
|
height: 160rpx;
|
|||
|
display: flex;
|
|||
|
justify-content: center;
|
|||
|
align-items: center;
|
|||
|
margin-bottom: 10rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.onecont-right {
|
|||
|
height: 760rpx;
|
|||
|
padding: 25rpx;
|
|||
|
flex: 1;
|
|||
|
|
|||
|
.rig-top {
|
|||
|
display: flex;
|
|||
|
justify-content: space-between;
|
|||
|
margin-bottom: 25rpx;
|
|||
|
|
|||
|
.rig-add {
|
|||
|
width: 30rpx;
|
|||
|
height: 30rpx;
|
|||
|
display: flex;
|
|||
|
justify-content: center;
|
|||
|
align-items: center;
|
|||
|
border-radius: 50%;
|
|||
|
border: 4rpx solid #323232;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.rig-cont {
|
|||
|
.onecont-rightitem {
|
|||
|
margin-bottom: 30rpx;
|
|||
|
|
|||
|
.item_ri {
|
|||
|
display: flex;
|
|||
|
width: 100%;
|
|||
|
height: 140rpx;
|
|||
|
display: flex;
|
|||
|
justify-content: space-between;
|
|||
|
background-color: #07052f;
|
|||
|
padding: 20rpx;
|
|||
|
box-sizing: border-box;
|
|||
|
border-radius: 15rpx;
|
|||
|
|
|||
|
.number {
|
|||
|
display: flex;
|
|||
|
flex-direction: column;
|
|||
|
align-items: end;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.oneleftimg {
|
|||
|
width: 90rpx;
|
|||
|
height: 90rpx;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.oneactive {
|
|||
|
background-color: #fff;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.createwa {
|
|||
|
width: 100%;
|
|||
|
height: 116rpx;
|
|||
|
border-radius: 20rpx;
|
|||
|
background-color: #f6f6f6;
|
|||
|
display: flex;
|
|||
|
justify-content: center;
|
|||
|
align-items: center;
|
|||
|
margin-bottom: 10rpx;
|
|||
|
}
|
|||
|
|
|||
|
.hide {
|
|||
|
visibility: hidden;
|
|||
|
}
|
|||
|
|
|||
|
.show {
|
|||
|
visibility: visible;
|
|||
|
}
|
|||
|
|
|||
|
.accounts {
|
|||
|
width: 100%;
|
|||
|
display: flex;
|
|||
|
justify-content: center;
|
|||
|
align-items: center;
|
|||
|
font-size: 34rpx;
|
|||
|
font-weight: 600;
|
|||
|
border-bottom: 2rpx solid #f6f6f6;
|
|||
|
padding-bottom: 15rpx;
|
|||
|
}
|
|||
|
|
|||
|
.accountslist {
|
|||
|
margin-top: 30rpx;
|
|||
|
|
|||
|
.accountsitem {
|
|||
|
display: flex;
|
|||
|
justify-content: space-between;
|
|||
|
margin-bottom: 50rpx;
|
|||
|
align-items: center;
|
|||
|
border-bottom: 2rpx solid #f6f6f6;
|
|||
|
padding-bottom: 20rpx;
|
|||
|
|
|||
|
|
|||
|
.item_le {
|
|||
|
width: 80rpx;
|
|||
|
height: 80rpx;
|
|||
|
border-radius: 50%;
|
|||
|
}
|
|||
|
|
|||
|
.item_ri {
|
|||
|
width: 590rpx;
|
|||
|
height: 75rpx;
|
|||
|
display: flex;
|
|||
|
justify-content: space-between;
|
|||
|
|
|||
|
.name {
|
|||
|
display: flex;
|
|||
|
flex-direction: column;
|
|||
|
justify-content: space-between;
|
|||
|
}
|
|||
|
|
|||
|
.number {
|
|||
|
display: flex;
|
|||
|
flex-direction: column;
|
|||
|
align-items: end;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
}
|
|||
|
}
|
|||
|
</style>
|