完善添加银行卡功能

pages/my-index/wallet/index.vue

@@ -0,0 +1,125 @@
+<script setup>
+  import { navigateTo } from '@/utils/router'
+
+  const itemList = [
+    {
+      title: '提现卡',
+      key: '1',
+      url: '/pages/my-index/wallet/bank-card/index'
+    },
+    { title: '交易记录', key: '2', url: '' },
+    {
+      title: '修改支付密码',
+      key: '3',
+      url: '/pages/my-index/wallet/edit-password'
+    },
+    { title: '实名认证', key: '4', url: '' }
+  ]
+</script>
+
+<template>
+  <view class="wallet">
+    <!-- 顶部样式 -->
+    <view class="top-card">
+      <view class="left-box">
+        <text>我的资产</text>
+        <text>2222</text>
+      </view>
+      <view class="right-box">
+        <button>充值</button>
+        <button>提现</button>
+      </view>
+    </view>
+
+    <view
+      v-for="(item, index) in itemList"
+      :key="index"
+      class="public-card"
+      @click="item.url && navigateTo(item.url)"
+    >
+      <view class="left-box">
+        <text>{{ item.title }}</text>
+      </view>
+      <view class="right-box">
+        <uni-icons type="right" size="16" color="#999999"></uni-icons>
+      </view>
+    </view>
+  </view>
+</template>
+
+<style lang="scss" scoped>
+  @import '../styles/index.scss';
+  .wallet {
+    padding: 32rpx 24rpx;
+  }
+
+  .top-card {
+    padding: 36rpx;
+    margin-bottom: 48rpx;
+    background: #ff4c54;
+    border-radius: 32rpx;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    position: relative;
+    font-family: PingFang SC, PingFang SC;
+    font-style: normal;
+    text-transform: none;
+    &::after {
+      width: 100%;
+      height: 100%;
+      right: 54rpx;
+      content: '';
+      position: absolute;
+      background: url('/static/images/my-index/wallet-bg.png');
+      background-size: 30%;
+      background-position: center;
+      background-repeat: no-repeat;
+      z-index: 1;
+      pointer-events: none;
+    }
+    .left-box {
+      display: flex;
+      flex-direction: column;
+      text {
+        font-weight: 500;
+        font-size: 28rpx;
+        color: #ffffff;
+        margin-bottom: 8rpx;
+        &:last-child {
+          font-weight: bold;
+          font-size: 64rpx;
+          text-align: left;
+        }
+      }
+    }
+    .right-box {
+      display: flex;
+      align-items: center;
+      button {
+        width: 128rpx;
+        height: 64rpx;
+        line-height: 64rpx;
+        border-radius: 100rpx 100rpx 100rpx 100rpx;
+        font-family: PingFang SC, PingFang SC;
+        font-weight: 500;
+        font-size: 28rpx;
+        color: #ffffff;
+        text-align: center;
+        font-style: normal;
+        text-transform: none;
+        background: transparent;
+        border: 2rpx solid #ffffff;
+        &::after {
+          border: none;
+        }
+        &:last-child {
+          margin-left: 16rpx;
+          background: #ffffff;
+          color: #eb1c26;
+          border: none;
+        }
+      }
+    }
+  }
+</style>