Commit dfb339c7a07e0b30c1b595db042b0b516f3d00e2

Authored by xp.Huang
2 parents eefa8163 a5fae4a9

Merge branch 'ww' into 'main'

fix: bug DEFECT-402 image upload problem

See merge request huang/yun-teng-iot-front!217
... ... @@ -3,6 +3,7 @@
3 3 <Upload
4 4 name="file"
5 5 multiple
  6 + :beforeUpload="handleBeforeUpload"
6 7 @change="handleChange"
7 8 :action="uploadUrl"
8 9 :showUploadList="false"
... ... @@ -16,9 +17,9 @@
16 17 </div>
17 18 </template>
18 19 <script lang="ts">
19   - import { defineComponent, computed } from 'vue';
  20 + import { defineComponent, computed, ref, unref } from 'vue';
20 21
21   - import { Upload } from 'ant-design-vue';
  22 + import { message, Upload } from 'ant-design-vue';
22 23 import { useDesign } from '/@/hooks/web/useDesign';
23 24 import { useGlobSetting } from '/@/hooks/setting';
24 25 import { useI18n } from '/@/hooks/web/useI18n';
... ... @@ -43,15 +44,18 @@
43 44 const { uploadUrl } = useGlobSetting();
44 45 const { t } = useI18n();
45 46 const { prefixCls } = useDesign('tinymce-img-upload');
  47 + const loading = ref(false);
46 48
47 49 const getButtonProps = computed(() => {
48 50 const { disabled } = props;
49 51 return {
  52 + loading: unref(loading),
50 53 disabled,
51 54 };
52 55 });
53 56
54 57 function handleChange(info: Recordable) {
  58 + console.log(info);
55 59 const file = info.file;
56 60 const status = file?.status;
57 61 const url = file?.response?.fileStaticUri;
... ... @@ -60,17 +64,28 @@
60 64 if (status === 'uploading') {
61 65 if (!uploading) {
62 66 emit('uploading', name);
  67 + loading.value = true;
63 68 uploading = true;
64 69 }
65 70 } else if (status === 'done') {
66 71 emit('done', name, url);
  72 + loading.value = false;
67 73 uploading = false;
68 74 } else if (status === 'error') {
69 75 emit('error');
  76 + loading.value = false;
70 77 uploading = false;
71 78 }
72 79 }
73 80
  81 + function handleBeforeUpload(file: File) {
  82 + if (file.size > 5 * 1024 * 1024) {
  83 + message.error('上传图片的大小不能超过5MB!');
  84 + return false;
  85 + }
  86 + return true;
  87 + }
  88 +
74 89 return {
75 90 prefixCls,
76 91 handleChange,
... ... @@ -78,6 +93,7 @@
78 93 t,
79 94 getButtonProps,
80 95 token,
  96 + handleBeforeUpload,
81 97 };
82 98 },
83 99 });
... ...