Kaynağa Gözat

fix(bugs): 修改文件头像控件

tangning 4 yıl önce
ebeveyn
işleme
49e61e92c2

+ 11 - 2
src/components/Cropper/src/CopperModal.vue

@@ -2,7 +2,7 @@
   <BasicModal
     v-bind="$attrs"
     @register="register"
-    :title="t('component.cropper.modalTitle')"
+    :title="title || t('component.cropper.modalTitle')"
     width="800px"
     :canFullscreen="false"
     @ok="handleOk"
@@ -121,13 +121,15 @@
   import { dataURLtoBlob } from '/@/utils/file/base64Conver';
   import { isFunction } from '/@/utils/is';
   import { useI18n } from '/@/hooks/web/useI18n';
+  import { useMessage } from '/@/hooks/web/useMessage';
 
   type apiFunParams = { file: Blob; name: string; filename: string };
 
   const props = {
     circled: { type: Boolean, default: true },
     src: { type: String, default: '' },
-
+    title: { type: String },
+    maxSize: { type: Number, default: 5 },
     uploadApi: {
       type: Function as PropType<(params: apiFunParams) => Promise<any>>,
     },
@@ -142,6 +144,7 @@
       let filename = '';
       const src = ref('');
       const previewSource = ref('');
+      const { createMessage } = useMessage();
       const cropper = ref<Cropper>();
       let scaleX = 1;
       let scaleY = 1;
@@ -158,6 +161,12 @@
 
       // Block upload
       function handleBeforeUpload(file: File) {
+        const { size } = file;
+        const { maxSize } = props;
+        if (maxSize && size / 1024 / 1024 >= maxSize) {
+          createMessage.error(t('component.upload.maxSizeMultiple', [maxSize]));
+          return false;
+        }
         const reader = new FileReader();
         reader.readAsDataURL(file);
         src.value = '';

+ 4 - 0
src/components/Cropper/src/CropperAvatar.vue

@@ -25,6 +25,8 @@
       @register="register"
       @uploadSuccess="handleUploadSuccess"
       :uploadApi="uploadApi"
+      :title="title"
+      :maxSize="5"
       :circled="circled"
       :src="sourceValue"
     />
@@ -53,6 +55,8 @@
   const props = {
     width: { type: [String, Number], default: '200px' },
     value: { type: String },
+    maxSize: { type: Number, default: 5 },
+    title: { type: String },
     showBtn: { type: Boolean, default: true },
     btnProps: { type: Object as PropType<ButtonProps> },
     btnText: { type: String, default: '' },

+ 5 - 1
src/views/corporation/cameraModal.vue

@@ -4,6 +4,7 @@
     @register="register"
     :title="t('routes.devices.browserDevice')"
     @ok="submitModal"
+    @cancel="listUpload"
     width="700px"
     @visible-change="handleVisibleChange"
   >
@@ -171,7 +172,9 @@
         emit('ok');
         closeModal();
       }
-
+      function listUpload() {
+        emit('ok');
+      }
       function handleVisibleChange() {}
       async function handleUnbindDevice(record: Recordable) {
         console.log('record');
@@ -195,6 +198,7 @@
         registerDeviceTable,
         searchInfo,
         handleUnbindDevice,
+        listUpload,
       };
     },
   });

+ 6 - 3
src/views/corporation/deviceModal.vue

@@ -81,7 +81,7 @@
       userData: { type: Object },
     },
     emits: ['register', 'update'],
-    setup(props, emit) {
+    setup(props, { emit }) {
       const modelRef = ref({
         mappingLength: 0,
       });
@@ -213,7 +213,7 @@
         } catch (error) {}
       }
 
-      function onDataReceive(data) {
+      async function onDataReceive(data) {
         // 方式1;
         console.log('userName', data.record);
         let { subNum } = data.record;
@@ -222,10 +222,12 @@
           maxLength.value = 999 - subNum;
         }
         resetFields();
-        setFieldsValue({
+        await setFieldsValue({
           ...data.record,
           subNum: 0,
+          deviceNumber: 0,
         });
+        deviceMapping();
       }
 
       function handleVisibleChange(v) {
@@ -236,6 +238,7 @@
         // numOnChange(0);
         await setFieldsValue({
           subNum: 0,
+          deviceNumber: 0,
         });
         deviceMapping();
       }

+ 2 - 0
src/views/corporation/index.vue

@@ -8,6 +8,7 @@
           :width="80"
           :uploadApi="uploadLogoApi"
           :value="record.sceneLogo"
+          :title="t('routes.corporation.sceneLogo')"
           @change="
             (_, data) => {
               updateSceneLogo(record, data);
@@ -21,6 +22,7 @@
           :width="80"
           :uploadApi="uploadLogoApi"
           :value="record.floorLogo"
+          :title="t('routes.corporation.floorLogo')"
           @change="
             (_, data) => {
               updateFloorLogo(record, data);