优化组件

magic-boot-ui/src/components/magic/data/mb-table-column.vue

@@ -19,8 +19,8 @@
         <el-switch
             v-if="col.if === undefined ? true : col.if(scope.row)"
             v-model="scope.row[col.field]"
-            :active-value="col.activeValue || 1"
+            :active-value="(col.activeValue || 1) + ''"
-            :inactive-value="col.inactiveValue || 0"
+            :inactive-value="(col.inactiveValue || 0) + ''"
             @change="col.change(scope.row)"
         />
       </div>
@@ -40,6 +40,7 @@
       <a v-else-if="col.type == 'downloadAll'" @click="$common.downloadMore(scope.row[col.field])" href="javascript:;">下载</a>
       <el-image
         v-else-if="col.type === 'image'"
+        preview-teleported
         :src="scope.row[col.field] && scope.row[col.field].startsWith('http') ? scope.row[col.field] : $global.baseApi + scope.row[col.field]"
         :preview-src-list="[scope.row[col.field] && scope.row[col.field].startsWith('http') ? scope.row[col.field] : $global.baseApi + scope.row[col.field]]"
       />

magic-boot-ui/src/components/magic/form/mb-select.vue

@@ -108,7 +108,7 @@ function setValue(value){
   if(props.multiple && props.join){
     selectValue.value = value ? value.split(',') : []
   }else{
-    selectValue.value = value ? value.toString() : ''
+    selectValue.value = value || value === 0 ? value.toString() : ''
   }
 }
 

magic-boot-ui/src/components/magic/form/mb-switch.vue

@@ -1,31 +1,37 @@
 <template>
   <el-switch
-    v-model="selectValue"
+      v-model="selectValue"
-    :active-value="activeValue"
+      :active-value="activeValue + ''"
-    :inactive-value="inactiveValue"
+      :inactive-value="inactiveValue  + ''"
-    v-bind="props.props"
+      v-bind="props.props"
   />
 </template>
 
 <script setup>
 import {ref, watch} from 'vue'
-  const emit = defineEmits(['update:modelValue'])
+const emit = defineEmits(['update:modelValue'])
-  const selectValue = ref(false)
+const selectValue = ref('')
-  const props = defineProps({
+const props = defineProps({
-    modelValue: {
+  modelValue: Boolean | String | Number,
-      type: Boolean,
+  activeValue: Boolean | String | Number,
-      default: false
+  inactiveValue: Boolean | String | Number,
-    },
+  props: Object
-    activeValue: Boolean | String | Number,
+})
-    inactiveValue: Boolean | String | Number,
-    props: Object
-  })
 
-  selectValue.value = props.modelValue
+dynamicSetValue(props.modelValue)
-  watch(() => props.modelValue, (value) => {
+watch(() => props.modelValue, (value) => {
+  dynamicSetValue(value)
+})
+function dynamicSetValue(value){
+  if(typeof(value) == 'boolean'){
     selectValue.value = value
-  })
+  }else{
-  watch(selectValue, (value) => {
+    if(value || value == 0){
-    emit('update:modelValue', value)
+      selectValue.value = value + ''
-  })
+    }
+  }
+}
+watch(selectValue, (value) => {
+  emit('update:modelValue', value)
+})
 </script>

magic-boot-ui/src/components/magic/form/mb-upload-image.vue

@@ -43,9 +43,12 @@
           :show-file-list="false"
           :multiple="multiple"
           :limit="limit"
-          :on-success="handleAvatarSuccess"
+          :on-success="onSuccess"
+          :on-error="onError"
+          :before-upload="beforeUpload"
           :on-exceed="onExceed"
           :file-list="fileList"
+          :disabled="isUploading"
         >
           <el-icon class="uploadIcon">
             <ElIconPlus />
@@ -238,7 +241,13 @@ export default {
     handleDownload(file) {
       console.log(file)
     },
-    handleAvatarSuccess(res, file, fileList) {
+    beforeUpload(){
+      this.isUploading = true
+    },
+    onError(){
+      this.isUploading = true
+    },
+    onSuccess(res, file, fileList) {
       console.log(res)
       this.fileList = fileList
       if (res.data) {