|
@@ -1,16 +1,24 @@
|
|
|
<template>
|
|
|
<view class="myWallet">
|
|
|
<view class="wallet-bg">
|
|
|
- <u--image src="/static/pageMine/wallet-bj.png" width="100%" height="550rpx"></u--image>
|
|
|
+ <u--image
|
|
|
+ src="/static/pageMine/wallet-bj.png"
|
|
|
+ width="100%"
|
|
|
+ height="550rpx"
|
|
|
+ ></u--image>
|
|
|
</view>
|
|
|
<page-navbar :hasBack="true" bgColor="transparent" title="我的钱包"></page-navbar>
|
|
|
|
|
|
<view class="wallet-main">
|
|
|
- <view class="wallet-card">
|
|
|
+ <view class="wallet-card" :style="'background-image: url(' + bgBase64 + ')'">
|
|
|
<view class="fl-flex-item wallet-secure">
|
|
|
<view class="fl-text-title">*烊的钱包</view>
|
|
|
<view class="fl-flex">
|
|
|
- <u--image src="/static/pageMine/secure.png" width="32rpx" height="32rpx"></u--image>
|
|
|
+ <u--image
|
|
|
+ src="/static/pageMine/secure.png"
|
|
|
+ width="32rpx"
|
|
|
+ height="32rpx"
|
|
|
+ ></u--image>
|
|
|
<view class="f-s-24 text-33 u-m-l-4">安全保障中</view>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -47,9 +55,21 @@
|
|
|
|
|
|
<script>
|
|
|
import WalletItem from './walletItem.vue';
|
|
|
+import { getBase64Image } from '@/utils/index.js';
|
|
|
export default {
|
|
|
name: 'myWallet',
|
|
|
components: { WalletItem },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ bgBase64: '',
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ // 将背景图转为base64格式
|
|
|
+ getBase64Image('/static/pageMine/wallet-card-bj.png', data => {
|
|
|
+ this.bgBase64 = data;
|
|
|
+ });
|
|
|
+ },
|
|
|
};
|
|
|
</script>
|
|
|
|
|
@@ -74,6 +94,9 @@ export default {
|
|
|
box-sizing: border-box;
|
|
|
border-radius: 16rpx;
|
|
|
position: relative;
|
|
|
+ background-size: cover;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-position: center;
|
|
|
.wallet-secure {
|
|
|
padding-bottom: 32rpx;
|
|
|
border-bottom: 1px solid #eaebeb;
|