my_user_detail.vue 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. <template>
  2. <view class="modifyWrapper">
  3. <form>
  4. <view class="uni-forms-item">
  5. <button class="avatar-wrapper" open-type="chooseAvatar" disabled="true" @chooseavatar="onChooseAvatar">
  6. <image class="avatar" :src="userinfo.avatar"></image>
  7. </button>
  8. </view>
  9. <view class="uni-forms-item">
  10. <input type="text" class="alias-input" disabled="true" v-model="userinfo.alias" />
  11. </view>
  12. <!-- <view class="uni-forms-item">
  13. <button form-type="submit" class="alias-submit" type="primary" @click="formSubmit">确认修改</button>
  14. </view> -->
  15. <view class="uni-forms-item">
  16. <button class="alias-submit" type="primary" @click="forExit">退出登录</button>
  17. </view>
  18. </form>
  19. </view>
  20. </template>
  21. <script>
  22. import {
  23. mapMutations,
  24. mapState
  25. } from 'vuex'
  26. export default {
  27. computed: {
  28. ...mapState('m_user', ['userinfo'])
  29. },
  30. methods: {
  31. ...mapMutations('m_user', ['updateUserInfo', 'updateToken']),
  32. // 选择头像
  33. // onChooseAvatar(e) {
  34. // const {
  35. // avatarUrl
  36. // } = e.detail
  37. // this.url = avatarUrl
  38. // },
  39. // formSubmit() {
  40. // console.log(this.userinfo.avatar.substr(0, 26))
  41. // // 上传头像
  42. // wx.uploadFile({
  43. // url: uni.$http.baseUrl + '/file/uploading',
  44. // filePath: this.userinfo.avatar,
  45. // name: 'file',
  46. // header: {
  47. // 'token': uni.getStorageSync('token')
  48. // },
  49. // success: res => {
  50. // const result = JSON.parse(res.data)
  51. // this.userinfo.avatar = result.data.url
  52. // console.log(this.userinfo.avatar)
  53. // // 表单提交
  54. // this.sendFormData()
  55. // },
  56. // fail: res => {
  57. // // 表单提交
  58. // this.sendFormData()
  59. // }
  60. // })
  61. // },
  62. // // 表单提交
  63. // sendFormData() {
  64. // wx.request({
  65. // url: uni.$http.baseUrl + '/ucenter/mini-program-openid-uid/wxAlias',
  66. // method: 'GET',
  67. // data: {
  68. // alias: this.userinfo.alias,
  69. // avatar: this.userinfo.avatar
  70. // },
  71. // header: {
  72. // 'token': uni.getStorageSync('token') // 默认值
  73. // },
  74. // success: res1 => {
  75. // uni.$showMsg('修改成功!', 3000)
  76. // // 更新成功
  77. // // 将数据更新到vuex中
  78. // this.updateUserInfo(this.userinfo)
  79. // }
  80. // })
  81. // },
  82. forExit() {
  83. this.updateToken("")
  84. uni.$SocketTask.close()
  85. // 退出小程序
  86. wx.exitMiniProgram()
  87. }
  88. }
  89. }
  90. </script>
  91. <!-- 设置页面背景 -->
  92. <style lang="scss">
  93. page{
  94. height: 100%;
  95. padding: 0 20rpx;
  96. // background-color: #FFF;
  97. }
  98. </style>
  99. <style lang="scss" scoped>
  100. .modifyWrapper{
  101. width: 95%;
  102. height: 100%;
  103. }
  104. .alias-input {
  105. height: 100rpx;
  106. font-size: 40rpx;
  107. // border: 1px solid #aaa;
  108. border-radius: 30rpx;
  109. padding-left: 10rpx;
  110. margin-top: 20rpx;
  111. background-color: white;
  112. }
  113. .alias-submit {
  114. margin-top: 50rpx;
  115. width: 300rpx;
  116. border-radius: 50rpx;
  117. background-color: #35b882;
  118. }
  119. </style>