photo.vue 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
  1. <template>
  2. <view>
  3. <view class="main">
  4. <avatar
  5. selWidth="600upx"
  6. selHeight="600upx"
  7. @upload="upload"
  8. :avatarSrc="myPhoto"
  9. avatarStyle="width: 600upx; height: 600upx; border-radius: 15upx;">
  10. </avatar>
  11. </view>
  12. </view>
  13. </template>
  14. <script>
  15. import avatar from "../../components/yq-avatar/yq-avatar.vue";
  16. import _hook from '../../common/_hook';
  17. import _get from '../../common/_get';
  18. import _action from '../../common/_action';
  19. import _data from '../../common/_data';
  20. export default {
  21. components: {
  22. avatar,
  23. },
  24. data() {
  25. return {
  26. show_path: '',
  27. my_data: {},
  28. }
  29. },
  30. onShow(){
  31. _hook.routeSonHook();
  32. let _this = this;
  33. _this.my_data = _data.data('user_info');
  34. _this.show_path = _data.staticPhoto() + _this.my_data.photo;
  35. /** 监听新的个人数据 */
  36. uni.$on('data_user_info',function(data){
  37. _this.my_data = data;
  38. });
  39. },
  40. onLoad(option) {
  41. },
  42. onUnload(){
  43. uni.$off('data_user_info');
  44. },
  45. computed: {
  46. myPhoto(){
  47. return this.show_path.replace('70.jpg','300.jpg');
  48. }
  49. },
  50. methods: {
  51. upload(e){
  52. this.show_path = e.path;
  53. this.send();
  54. },
  55. send(){
  56. let _this = this;
  57. uni.showLoading();
  58. _this.$httpSendFile({
  59. local_url: _this.show_path,
  60. type: 1,
  61. success(data){
  62. /** 更新头像上传状态 */
  63. _this.$httpSend({
  64. path: '/im/action/upPhoto',
  65. success(data) {
  66. /** 更改头像后,更新下头像 */
  67. let user_info = _data.data('user_info');
  68. user_info.photo = user_info.photo.replace(/(\?_=)[\d\.]+$/,'$1' + Math.random());
  69. _data.data('user_info',user_info);
  70. uni.$emit('data_user_info',user_info);
  71. uni.hideLoading();
  72. uni.showToast({
  73. title: '更换成功',
  74. duration: 1000,
  75. });
  76. /** 重新缓存自己本地头像 */
  77. _action.downloadPhoto();
  78. }
  79. });
  80. _action.downloadPhoto();
  81. },
  82. });
  83. }
  84. },
  85. watch: {
  86. },
  87. }
  88. </script>
  89. <style>
  90. .main {
  91. text-align: center;
  92. padding-top: 70upx;
  93. }
  94. </style>