profile.vue 2.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. <template>
  2. <view>
  3. <Navbar :hideBtn="false" bgColor="#f3f4f6"></Navbar>
  4. <view style="background-color: #2b85e4; padding: 40rpx;">
  5. <!-- <view style="width: 140rpx; height: 140rpx; border: 1px solid #fff; border-radius: 50%; margin: 0 auto;"> -->
  6. <!-- <u-avatar src="/static/img/avatar.png" size="120rpx" style="margin: 10rpx;"></u-avatar> -->
  7. <!-- </view> -->
  8. </view>
  9. <view style="padding: 40rpx;">
  10. <u--form :model="userInfo" ref="uForm" labelWidth="160rpx" labelAlign="left">
  11. <u-form-item label="姓名" prop="nickName" class="u-border-bottom">
  12. <u--input
  13. placeholder="请输入内容"
  14. border="none"
  15. v-model="userInfo.nickName"
  16. ></u--input>
  17. </u-form-item>
  18. <u-form-item label="性别" prop="sex" class="u-border-bottom">
  19. <u-radio-group v-model="userInfo.sex" size="36rpx">
  20. <u-radio shape="circle" label="男" name="1" labelSize="32rpx"></u-radio>
  21. <u-radio shape="circle" label="女" name="2" labelSize="32rpx" style="margin-left: 36rpx;"></u-radio>
  22. </u-radio-group>
  23. </u-form-item>
  24. <u-form-item label="手机号码" prop="phonenumber" class="u-border-bottom">
  25. <u--input
  26. placeholder="请输入内容"
  27. border="none"
  28. v-model="userInfo.phonenumber"
  29. ></u--input>
  30. </u-form-item>
  31. <u-form-item label="邮箱" prop="email" class="u-border-bottom">
  32. <u--input
  33. placeholder="请输入内容"
  34. border="none"
  35. v-model="userInfo.email"
  36. ></u--input>
  37. </u-form-item>
  38. </u--form>
  39. </view>
  40. <view style="padding: 40rpx;">
  41. <u-row gutter="32">
  42. <u-col span="6">
  43. <u-button icon="arrow-left" text="返回" plain @click="goBack()"></u-button>
  44. </u-col>
  45. <u-col span="6">
  46. <u-button icon="checkmark-circle" text="保存" type="primary"></u-button>
  47. </u-col>
  48. </u-row>
  49. </view>
  50. </view>
  51. </template>
  52. <script>
  53. import Navbar from '@/components/navbar/Navbar'
  54. export default {
  55. components: {
  56. Navbar,
  57. },
  58. data () {
  59. return {
  60. userInfo: {
  61. nickName: '若依',
  62. sex: '1',
  63. email: 'fastbuild@163.com',
  64. phonenumber: '18888888888'
  65. }
  66. }
  67. },
  68. methods: {
  69. goBack () {
  70. uni.navigateBack({ delta: 1});
  71. }
  72. }
  73. }
  74. </script>
  75. <style lang="sass" scoped>
  76. </style>