editUserInfo.vue 3.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. <template>
  2. <view>
  3. <u-cell title="头像" :isLink="true" arrow-direction="right">
  4. <div slot="value">
  5. <!-- <u-image src="https://img.yzcdn.cn/vant/cat.jpeg" width="50px" height="50px" shape="circle" /> -->
  6. <u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple :maxCount="10">
  7. <u-image :src="src" width="50px" height="50px" shape="circle" />
  8. </u-upload>
  9. </div>
  10. </u-cell>
  11. <u-cell title="昵称" :isLink="true" url="/components/editUserInfo/editUserName/editUserName" :value="userName" arrow-direction="right" @click="getUserInfo"></u-cell>
  12. <u-cell title="手机号" :isLink="true" url="/components/editUserInfo/editUserPhone/editUserPhone" arrow-direction="right"></u-cell>
  13. <u-cell title="实名认证" :isLink="true" url="/components/editUserInfo/nameAuthentication/nameAuthentication" arrow-direction="right"></u-cell>
  14. <u-cell title="设置支付密码" :isLink="true" url="/components/editUserInfo/editPayPassWord/editPayPassWord" arrow-direction="right"></u-cell>
  15. <u-cell title="性别" @click="setSex" :value="sex" :isLink="true" arrow-direction="right"></u-cell>
  16. <u-cell title="生日" @click="showBirthday = true" :value="time" :isLink="true" arrow-direction="right"></u-cell>
  17. <u-button>退出账户</u-button>
  18. <u-datetime-picker :show="showBirthday" @confirm="confirm" mode="date" @cancel="showBirthday = false"></u-datetime-picker>
  19. </view>
  20. </template>
  21. <script>
  22. export default {
  23. data() {
  24. return {
  25. fileList1: [
  26. ],
  27. src: 'https://img.yzcdn.cn/vant/cat.jpeg',
  28. userName: '',
  29. sex: '男',
  30. showBirthday:false,
  31. time:''
  32. }
  33. },
  34. mounted() {
  35. },
  36. methods: {
  37. getUserInfo() {
  38. console.log('获取用户信息');
  39. // uni.getUserProfile({
  40. // desc: '用于获取您的个人信息',
  41. // success: (res) => {
  42. // console.log(res)
  43. // this.src = res.userInfo.avatarUrl;
  44. // this.userName = res.userInfo.nickName;
  45. // },
  46. // fail:(err)=>{
  47. // console.log(err);
  48. // }
  49. // })
  50. },
  51. setSex() {
  52. uni.showActionSheet({
  53. itemList: ['男', '女'],
  54. success: (res) => {
  55. console.log(res.tapIndex)
  56. this.sex = res.tapIndex == 0 ? '男' : '女';
  57. },
  58. fail: (err) => {
  59. console.log(err.errMsg)
  60. }
  61. });
  62. },
  63. formatter(value) {
  64. if (!value) return ''
  65. const date = new Date(value)
  66. const formattedDate = `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')} ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}`
  67. return formattedDate
  68. },
  69. confirm(value){
  70. console.log('confirm', value);
  71. this.time = this.formatter(value.value);
  72. this.showBirthday = false;
  73. },
  74. afterRead(file) {
  75. console.log(file);
  76. this.src = file[0].url;
  77. },
  78. deletePic(file) {
  79. console.log(file);
  80. this.src = '';
  81. }
  82. }
  83. }
  84. </script>
  85. <style>
  86. </style>