headImg.vue 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150
  1. <template>
  2. <view class="ezy-my-page">
  3. <view class="icon-title-navBar-box">
  4. <view @click="handleBack" class="nav-bar-icon"></view>
  5. <text class="nav-bar-title">更换头像</text>
  6. </view>
  7. <img style="height: 200px;width: 200px;;" :src="userImg" alt="">
  8. <view @click="chooseImage">相册</view>
  9. <view @click="handleBack">取消</view>
  10. </view>
  11. </template>
  12. <script setup>
  13. import agreeContentDialog from '@/pages/login/agreeContentDialog.vue';
  14. import {
  15. toast,
  16. getUserIdentity
  17. } from "@/utils/common";
  18. import cacheManager from '@/utils/cacheManager.js';
  19. import {
  20. getFilePolicy
  21. } from '@/api/my.js'
  22. import {
  23. onLoad
  24. } from '@dcloudio/uni-app';
  25. import axios from 'axios';
  26. import {
  27. reactive,
  28. ref
  29. } from "vue";
  30. import {
  31. onShow
  32. } from '@dcloudio/uni-app';
  33. let userImg = ref(null);
  34. let currentPlatform = ref(null);
  35. const tempPath = ref('')
  36. const checkAlbumPermission = async () => {
  37. const status = await uni.getSetting()
  38. if (!status.authSetting['scope.album']) {
  39. await uni.authorize({
  40. scope: 'scope.album'
  41. })
  42. }
  43. }
  44. const chooseImage = async () => {
  45. try {
  46. //await checkAlbumPermission()
  47. uni.chooseImage({
  48. count: 1,
  49. sizeType: ['compressed'],
  50. sourceType: ['album'], // 仅限相册选择‌:ml-citation{ref="1" data="citationList"}
  51. success: (res) => {
  52. uploadFile(res.tempFilePaths[0])
  53. },
  54. fail: (err) => {
  55. console.error('选择失败:', err)
  56. }
  57. })
  58. } catch (err) {
  59. uni.showModal({
  60. title: '权限申请失败',
  61. content: '请前往设置开启相册权限'
  62. })
  63. }
  64. }
  65. function uploadFile(filePath) {
  66. const suffix = filePath.split('.').pop();
  67. let req = {
  68. prefix: 'resource/',
  69. suffix: suffix
  70. }
  71. getFilePolicy(req).then(res => {
  72. if (res.code === 0) {
  73. const policyData = res.data;
  74. console.log('policyData', policyData);
  75. uni.uploadFile({
  76. url: policyData.uploadUrl,
  77. filePath: filePath,
  78. name: 'file',
  79. formData: {
  80. key: policyData.key,
  81. policy: policyData.policy,
  82. OSSAccessKeyId: policyData.accessid,
  83. signature: policyData.signature,
  84. success_action_status: '200'
  85. },
  86. header: {
  87. 'Content-Type': 'multipart/form-data'
  88. },
  89. success(uploadRes) {
  90. console.log('uploadRes', uploadRes);
  91. if (uploadRes.statusCode === 200) {
  92. userImg.value = `${policyData.downloadUrl}/${policyData.key}`;
  93. uni.showToast({
  94. title: '上传成功',
  95. icon: 'success'
  96. });
  97. } else {
  98. uni.showToast({
  99. title: '上传失败',
  100. });
  101. }
  102. },
  103. fail(err) {
  104. console.log('err', err);
  105. }
  106. });
  107. }
  108. })
  109. }
  110. function handleBack() {
  111. uni.redirectTo({
  112. url: '/pages/my/yingyongshezhi'
  113. })
  114. }
  115. function openXiangce2() {
  116. }
  117. function openXiangce() {
  118. }
  119. function isIOSorAndroid() {
  120. const systemInfo = uni.getSystemInfoSync();
  121. console.log('systemInfo', systemInfo);
  122. if (systemInfo.platform == 'ios') {
  123. return currentPlatform.value = 'ios'
  124. } else {
  125. return currentPlatform.value = 'android'
  126. }
  127. }
  128. onLoad((options) => {
  129. isIOSorAndroid()
  130. })
  131. </script>