pay-video-applet-uniapp-24-8-22/pages/mine/authPerson.vue

<template>
  <view class="auth-person">
    <!--顶部导航栏-->
    <navbar leftClick @leftClick="$utils.navigateBack" title="认证个人"/>

    <!--身份信息页面-->
    <view class="container">
      <view class="form-item">
        <view class="label">姓名</view>
        <view class="input">{{ name }}</view>
      </view>

      <uv-divider :hairline="false" lineColor="#c0c0c0" dot></uv-divider>

      <view class="form-item">
        <view class="label">身份证号</view>
        <view class="input">{{ idCard }}</view>
      </view>

      <uv-divider :hairline="false" lineColor="#c0c0c0" dot></uv-divider>
    </view>

    <!--下一步按钮-->
    <button @click="onNextClick" class="bottomBtn">
      立即认证
    </button>
  </view>
</template>

<script>
import '../../common.css'; // 引入公共 CSS 文件

export default {
  data() {
    return {
      name: 'xiaohua',
      idCard: '2101472154874512'
    }
  },
  methods: {
    onCameraClick() {
      // 添加拍照或选择图片的逻辑
    },
    onNextClick() {
      this.$utils.navigateTo("/mine/purse");
    }
  }
}
</script>

<style scoped lang="scss">
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.auth-person {
  .container {
    padding: 100rpx 50rpx 50rpx 50rpx;
    //border: 1px solid red;

    .header {
      margin-bottom: 40rpx;
      font-size: 28rpx;
      color: #666;
    }

    .form-item {
      margin-bottom: 40rpx;

      .label {
        font-size: 36rpx;
        margin-bottom: 10px;
        display: block;
      }

      .input {
        width: 100vw;
        font-size: 38rpx;
        margin-top: 40rpx;
      }
    }
  }

}

</style>