123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139 |
- <template>
- <view class="page">
- <view class="content">
- <view class="list" v-if="list.length">
- <view class="item" v-for="(item,index) in list">
- <view class="left-img">
- <view class="circle">
- <image src="../../../static/theme/default/my/alipay.png" class="left-img-img"></image>
- </view>
- </view>
- <view class="right-text">
- <text class="right-text-name">{{item.bank_name}}</text>
- <text class="right-text-info">{{item.account}}</text>
- </view>
- <view class="right-icon">
- <uni-icons :size="20" class="uni-icon-wrapper" color="white" type="arrowright" />
- </view>
- </view>
- </view>
- <button class="withdraw" type="button" @tap="goPath('../set/add_account')">添加支付宝账号</button>
- </view>
- </view>
- </template>
- <script>
- import uniIcons from '../../../components/uni-ui/uni-icon/uni-icon'
- import _get from '../../../common/_get';
- import _hook from '../../../common/_hook';
- export default {
- data() {
- return {
- list:[]
- }
- },
- components:{
- uniIcons
- },
- onShow(){
- _hook.routeSonHook();
- this.getUserbankList();
- uni.$on("update_bank_list_data",this.updateBankList)
- },
- methods: {
- goPath(path){
- if(path){
- uni.navigateTo({
- url: path
- });
- }
- },
- updateBankList(bank){
- console.log(bank)
- return bank && this.list.concat([{'bank_name':bank.bank_name,'account':bank.account,'id':bank.id}])
- },
- getUserbankList(){
- let _this = this;
- _get.getUserbankList({},function (data) {
- _this.list = data;
- })
- }
- }
- }
- </script>
- <style>
- page{
- background-color: #f2f2f2;
- }
- .right-icon{
- position: absolute;
- right: 20upx;
- }
- .left-img{
- margin-left: 35upx;
- display: flex;
- justify-content: center;
- align-items: center;
- }
- .item .right-text{
- display: flex;
- flex-direction: column;
- color: white;
- font-size: 16px;
- font-weight: 400;
- margin-left: 20upx;
- }
- .left-img-img{
- width: 85upx;
- height: 85upx;
- }
- .left-img .circle{
- height: 100upx;
- width: 100upx;
- border-radius: 10px;
- background-color: white;
- display: flex;
- justify-content: center;
- align-items: center;
- }
- .list{
- padding: 0 30upx;
- }
- .list .item{
- height: 200upx;
- border-radius: 15upx;
- display: flex;
- background-color: #498cc0;
- flex-direction: row;
- position: relative;
- align-items: center;
- margin: 20rpx 0;
- }
- .content .withdraw{
- width: 92%;
- background-color: #5693ee;
- color: white;
- height: 70upx;
- line-height: 70upx !important;
- border-radius: 40upx;
- font-size: 36upx;
- cursor: pointer;
- margin-top: 20upx;
- }
- @font-face {font-family: "eosfont";
- src: url('https://at.alicdn.com/t/font_943490_fdgw8vjcnhp.ttf') format('truetype');
- }
- .eosfont {
- font-family:"eosfont" !important;
- font-size:16px;
- font-style:normal;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
- }
- </style>
|