组件优化

magic-boot-ui/src/components/magic/basic/mb-icon.vue

@@ -10,18 +10,17 @@ const props = defineProps({
 		type: String,
 		default: 'mb-icon'
 	},
-	icon: String,
+	icon: String
-	size: String,
 });
 const symbolId = computed(() => props.icon&&props.icon.startsWith('#') ? props.icon : `#${props.prefix}-${props.icon}`)
 const className = computed(() => props.icon&&props.icon.startsWith('#') ? props.icon.substring(1) : `${props.prefix}-${props.icon}`)
 </script>
 <style scoped>
 svg {
-	width: 1.3em; 
+	width: 1.3em;
 	height: 1.3em;
 	vertical-align: -0.25em;
 	overflow: hidden;
 	fill: var(--mb-main-icon-color)
 }
-</style>
+</style>

magic-boot-ui/src/components/magic/data/mb-tree.vue

@@ -29,7 +29,7 @@ import { watch, ref, reactive, defineExpose, nextTick, getCurrentInstance, onBef
 
 const { proxy } = getCurrentInstance()
 
-const emit = defineEmits(['update:modelValue', 'check-change', 'node-click', 'mounted'])
+const emit = defineEmits(['update:modelValue', 'check-change', 'node-click'])
 
 const props = defineProps({
   url: {

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

@@ -85,6 +85,10 @@ export default {
     showRemoveTip: {
       type: Boolean,
       default: () => true
+    },
+    join: {
+      type: Boolean,
+      default: true
     }
   },
   data() {
@@ -172,8 +176,13 @@ export default {
         }
       })
       if (this.multiple) {
-        this.$emit('update:modelValue', this.urls)
+        if(this.join){
-        this.$emit('change', this.urls)
+          this.$emit('update:modelValue', this.urls.join(','))
+          this.$emit('change', this.urls.join(','))
+        }else{
+          this.$emit('update:modelValue', this.urls)
+          this.$emit('change', this.urls)
+        }
       } else {
         document.getElementById(this.uploadDomId).getElementsByClassName('el-upload__input')[0].removeAttribute('disabled')
         this.$emit('update:modelValue', '')
@@ -196,10 +205,15 @@ export default {
     handleAvatarSuccess(res, file, fileList) {
       this.uploadLoading = false
       if (res.data) {
+        this.urls.push(res.data.url)
         if (this.multiple) {
-          this.urls.push(res.data.url)
+          if(this.join){
-          this.$emit('update:modelValue', this.urls)
+            this.$emit('update:modelValue', this.urls.join(','))
-          this.$emit('change', this.urls)
+            this.$emit('change', this.urls.join(','))
+          }else{
+            this.$emit('update:modelValue', this.urls)
+            this.$emit('change', this.urls)
+          }
         } else {
           document.getElementById(this.uploadDomId).getElementsByClassName('el-upload__input')[0].setAttribute('disabled', '')
           this.$emit('update:modelValue', res.data.url)

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

@@ -133,6 +133,10 @@ export default {
     tipColor: {
       type: String,
       default: ''
+    },
+    join: {
+      type: Boolean,
+      default: true
     }
   },
   data() {
@@ -200,8 +204,13 @@ export default {
       })
       this.$delete('/system/file/delete', { url: encodeURI(url) })
       if (this.multiple) {
-        this.$emit('update:modelValue', this.urls)
+        if(this.join){
-        this.$emit('change', this.urls)
+          this.$emit('update:modelValue', this.urls.join(','))
+          this.$emit('change', this.urls.join(','))
+        }else{
+          this.$emit('update:modelValue', this.urls)
+          this.$emit('change', this.urls)
+        }
       } else {
         this.$emit('update:modelValue', '')
         this.$emit('change', '')
@@ -221,8 +230,13 @@ export default {
         this.urls.push(res.data.url)
         // console.log(this.urls)
         if (this.multiple) {
-          this.$emit('update:modelValue', this.urls)
+          if(this.join){
-          this.$emit('change', this.urls)
+            this.$emit('update:modelValue', this.urls.join(','))
+            this.$emit('change', this.urls.join(','))
+          }else{
+            this.$emit('update:modelValue', this.urls)
+            this.$emit('change', this.urls)
+          }
         } else {
           this.$emit('update:modelValue', res.data.url)
           this.$emit('change', res.data.url)

magic-boot-ui/src/components/magic/template/mb-list.vue

@@ -8,7 +8,10 @@
         <el-button v-if="it.type == 'add'" v-permission="it.permission" class="filter-item" type="primary" icon="ElIconPlus" @click="it.click">
           {{ it.label || '添加' }}
         </el-button>
-        <mb-button v-if="it.type == 'delete'" v-permission="it.permission" :plain="true" :request-url="it.url" :btn-type="'delete'" :request-data="{ id: ids }" :after-handler="reload" />
+        <mb-button v-else-if="it.type == 'delete'" v-permission="it.permission" :plain="true" :request-url="it.url" :btn-type="'delete'" :request-data="{ id: ids }" :after-handler="reload" />
+        <el-button v-else :icon="it.icon" :key="it.label" v-permission="it.permission" :type="it.type" :size="it.size" :class="it.class" @click="it.click(ids)">
+          {{ it.label }}
+        </el-button>
       </div>
     </el-row>
 

magic-boot-ui/src/views/examples/test-mb-form.vue

@@ -123,11 +123,20 @@ const formOptions = reactive({
         component: 'upload-image',
         label: '头像',
         rules: [{ required: true, message: '请选择头像', trigger: 'change' }]
+      },{
+        span: 12,
+        name: 'heads',
+        component: 'upload-image',
+        label: '多头像',
+        props: {
+          multiple: true
+        },
+        rules: [{ required: true, message: '请选择头像', trigger: 'change' }]
       }]
     }]
   }
 })
 function getFormData(){
-  console.log(magicForm.value.getFormData().select)
+  console.log(magicForm.value.getFormData())
 }
 </script>

magic-boot-ui/src/views/examples/upload-file.vue

@@ -3,7 +3,7 @@
     <h2>上传文件（单文件）</h2>
     <mb-upload-file v-model="fileUrl" @change="fileChange" />
     <h2>上传文件（多文件）</h2>
-    <mb-upload-file v-model="fileUrls" @change="fileChange" multiple />
+    <mb-upload-file v-model="fileUrls" @change="multipleFileChange" multiple />
     <h2>上传图片（id）</h2>
     <mb-upload-image :external-id="externalId" multiple :external-type="externalType" />
     <h2>上传图片（url、单图）</h2>
@@ -22,7 +22,7 @@ export default {
       externalId: this.$common.uuid(),
       externalType: '营业执照',
       imgUrl: '',
-      multipleImgUrl: ['userfiles/2022-05-13/6be62f3203904410a92530f8e300e233/QQ图片20220505165410.jpg'],
+      multipleImgUrl: '',
       fileUrl: '',
       fileUrls: ''
     }
@@ -31,11 +31,14 @@ export default {
     fileChange() {
       console.log(this.fileUrl)
     },
+    multipleFileChange() {
+      console.log(this.fileUrls)
+    },
     imgChange() {
       console.log(this.imgUrl)
     },
     multipleImgChange() {
-      // console.log(this.multipleImgUrl)
+      console.log(this.multipleImgUrl)
     }
   }
 }

magic-boot-ui/src/views/system/menu/menu-list.vue

@@ -202,13 +202,13 @@ function reloadTable(){
 
 function expand(){
   refreshTable.value = false
-  tableOptions.el["default-expand-all"] = !tableOptions.el["default-expand-all"]
+  tableOptions.props["default-expand-all"] = !tableOptions.props["default-expand-all"]
   nextTick(() => refreshTable.value = true)
 }
 
 function searchMenu() {
   refreshTable.value = false
-  tableOptions.el["default-expand-all"] = true
+  tableOptions.props["default-expand-all"] = true
   nextTick(() => refreshTable.value = true)
   clearTimeout(searchTimeout)
   searchTimeout = setTimeout(() => {

magic-boot-ui/src/views/system/office/office-list.vue

@@ -234,7 +234,7 @@ watch(officeData, () => {
 
 function expand(){
   refreshTable.value = false
-  tableOptions.el["default-expand-all"] = !tableOptions.el["default-expand-all"]
+  tableOptions.props["default-expand-all"] = !tableOptions.props["default-expand-all"]
   nextTick(() => refreshTable.value = true)
 }
 

magic-boot/src/main/java/org/ssssssss/magicboot/model/Global.java

@@ -19,7 +19,7 @@ public class Global {
         return dir;
     }
 
-    @Value("${upload.dir:D:/psyduck/}")
+    @Value("${upload.dir:D:/mb/}")
     public void setDir(String dir) {
         this.dir = dir;
     }

magic-boot/src/main/resources/application.yml

@@ -59,19 +59,11 @@ spring:
         url-pattern: /*
         # 忽略过滤格式
         exclusions: "*.js,*.gif,*.jpg,*.png,*.css,*.ico,/druid/*"
-
+# 上传路径
 upload:
-  # oss,disk（磁盘）
-  type: disk
   dir: D:/mb/
-  oss:
-    endpoint:
-    access-key-id:
-    access-key-secret:
-    bucket-name:
-    # https,http
-    transport-protocol:
 
+# 是否开启“验证码”验证
 verification-code:
   enable: true