edit.vue 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. <template>
  2. <view class="edit">
  3. <view class="head-box">
  4. <image @click="chooseHead" class="head" :src="headImg||defaultImg" mode=""></image>
  5. <image class="icon" src="../../static/take_photo.png" mode=""></image>
  6. </view>
  7. <view class="">
  8. <u-cell size="large" title="修改昵称" :isLink="true" url="/my/edit/editName"></u-cell>
  9. <u-cell size="large" title="关于" :isLink="true"></u-cell>
  10. </view>
  11. <button class="login-out" @click="loginOut">退出当前账号</button>
  12. </view>
  13. </template>
  14. <script>
  15. import {uploadImg} from '@/api/common.js'
  16. export default {
  17. data() {
  18. return {
  19. headImg:'',
  20. defaultImg:'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fci.xiaohongshu.com%2Fc34b7b74-ba38-0456-982a-43c0f97522fe%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fci.xiaohongshu.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1693532127&t=a2e186c12aecaab7723611cb52a6778f',
  21. userId:'',
  22. userInfo:null
  23. }
  24. },
  25. methods: {
  26. chooseHead() {
  27. let that = this
  28. uni.chooseImage({
  29. count:1,
  30. success(r) {
  31. that.headImg = r.tempFilePaths[0]
  32. uploadImg({imgPath:r.tempFilePaths[0],userId:that.userId}).then(res=>{
  33. uni.showToast({
  34. title: '上传成功',
  35. });
  36. that.userInfo.imgPath = r.tempFilePaths[0]
  37. uni.setStorageSync('userInfo',JSON.stringify(this.userInfo))
  38. })
  39. }
  40. })
  41. },
  42. loginOut(){
  43. uni.clearStorageSync()
  44. uni.switchTab({
  45. url:'/pages/index/index'
  46. })
  47. }
  48. },
  49. created() {
  50. this.userInfo = JSON.parse(uni.getStorageSync('userInfo'))
  51. this.headImg = this.userInfo.imgPath||''
  52. this.userId = this.userInfo.userId||''
  53. console.log(this.userId);
  54. }
  55. }
  56. </script>
  57. <style lang="scss" scoped>
  58. .edit{
  59. .head-box{
  60. margin: 80rpx auto 50rpx;
  61. width: 150rpx;
  62. height: 150rpx;
  63. position: relative;
  64. .head{
  65. width: 150rpx;
  66. height: 150rpx;
  67. border-radius: 50%;
  68. }
  69. .icon{
  70. position: absolute;
  71. width: 44rpx;
  72. height: 44rpx;
  73. bottom: 0%;
  74. right: 0;
  75. }
  76. }
  77. .login-out{
  78. position: fixed;
  79. bottom: 150rpx;
  80. left: 50%;
  81. width: 400rpx;
  82. line-height: 110rpx;
  83. text-align: center;
  84. color: #fff;
  85. background: rgb(164, 173, 179);
  86. border-radius: 55rpx;
  87. transform: translateX(-50%);
  88. font-size: 30rpx;
  89. }
  90. }
  91. </style>