app/pages/enter/index.vue

<template>
  <s-layout>
    <view class="page-container">
      <view class="header">
        <text class="title">信息录入</text>
        <text class="subtitle">请选择需要录入的信息类型</text>
      </view>

      <view class="card-container">
        <u-card v-for="(item, index) in cardList" :key="index" :title="item.title" :thumb="item.thumb"
          @click="navigateTo(item.path)" class="card-item">
          <template v-slot:body>
            <view class="card-content">
              <text class="card-text">{{ item.description }}</text>
              <u-button @click="navigateTo(item.path)" :type="item.btnType" size="mini" plain>立即录入</u-button>
            </view>
          </template>
        </u-card>
      </view>
    </view>
  </s-layout>
</template>

<script setup>
import sheep from '@/sheep';
const cardList = [
  // {
  //   title: '身份证录入',
  //   thumb: 'https://cdn.uviewui.com/uview/example/card1.png',
  //   path: '/pages/enter/idEnter/list',
  //   description: '点击进入身份证信息录入页面',
  //   btnType: 'primary'
  // },
  {
    title: '营业执照录入',
    thumb: 'https://cdn.uviewui.com/uview/example/card3.png',
    path: '/pages/enter/businessLicenseEnter/list',
    description: '点击进入营业执照信息录入页面',
    btnType: 'success'
  },
  {
    title: '征信录入',
    thumb: 'https://cdn.uviewui.com/uview/example/card2.png',
    path: '/pages/enter/creditEnter/list',
    description: '点击进入征信信息录入页面',
    btnType: 'warning'
  },
];

const navigateTo = (url) => {
  sheep.$router.go(url)
};
</script>

<style lang="scss" scoped>
.page-container {
  background: linear-gradient(180deg, #f6f9ff 0%, #ffffff 100%);
  min-height: 100vh;
  padding: 40rpx;

  .header {
    margin-bottom: 80rpx;
    text-align: center;
    padding: 40rpx 0;
    background: linear-gradient(135deg, #f6f9ff, #e6f0ff);
    border-radius: 24rpx;
    box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.05);

    .title {
      font-size: 48rpx;
      font-weight: bold;
      color: #2979ff;
      display: block;
      margin-bottom: 20rpx;
    }

    .subtitle {
      font-size: 32rpx;
      color: #666;
    }
  }

  .card-container {
    .card-item {
      margin-bottom: 40rpx;
      border-radius: 32rpx;
      overflow: hidden;
      box-shadow: 0 12rpx 32rpx rgba(0, 0, 0, 0.08);
      transition: all 0.3s ease;
      background: #ffffff;
      border: 1rpx solid #f0f0f0;

      &:hover {
        transform: translateY(-8rpx);
        box-shadow: 0 16rpx 40rpx rgba(0, 0, 0, 0.12);
      }
    }

    .card-content {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }

    .card-icon {
      margin-bottom: 30rpx;
      padding: 20rpx;
      background: #f8f8f8;
      border-radius: 50%;
    }

    .card-text {
      font-size: 36rpx;
      color: #333;
      font-weight: 500;
      text-align: center;
      line-height: 1.6;
      margin: 20rpx 0;
    }

    .u-button {
      margin-top: 20rpx;
      width: 200rpx;
    }
  }
}
</style>