<template>
  <view>
    <view class="container">
      <u-form :model="form" ref="uForm" label-width="140">
        <u-form-item label="姓名">
          <u-input v-model="form.name" />
        </u-form-item>
        <u-form-item label="身份证号">
          <u-input v-model="form.name" />
        </u-form-item>
        <u-form-item label="手机号">
          <u-input v-model="form.name" />
        </u-form-item>
        <u-form-item label="行动能力">
          <u-input type="select" readonly v-model="form.name" />
        </u-form-item>
        <u-form-item label="邮寄地址">
          <u-input v-model="form.name" />
        </u-form-item>
        <u-form-item label="其他备注">
          <u-input v-model="form.name" />
        </u-form-item>
      </u-form>
    </view>

    <u-button shape="circle" ripple :custom-style="btnStyle">确认</u-button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      btnStyle: {
        'background-image': 'linear-gradient(-90deg, #e26165 0%, #c10d12 94%, #c10d12 100%)',
        'font-weight': '500',
        'font-size': '28rpx',
        'color': '#fff',
        'width': '436rpx',
        'margin': '0 auto',
        'letter-spacing': '2rpx'
      },
      form: {
        name: ''
      },
      rules: {

      }
    };
  }
}
</script>

<style lang="scss">
page {
  background: #fff;
}
</style>

<style lang="scss" scoped>
.container {
  padding: 34rpx 44rpx;
  margin: 34rpx 25rpx 95rpx;
  border-radius: 10rpx;
  filter: drop-shadow(0 0 10rpx rgba(211,211,214,0.3));
  background-color: #ffffff;

  ::v-deep .u-input__input {
    text-align: right;
  }
}
</style>
