修改测试bug 优化页面

src/views/setting/dictionary/component/add.vue

@@ -47,7 +47,7 @@
                     </el-checkbox-group>
                 </el-form-item>
                 <el-form-item class="top" label="组件排序" prop="sort">
-                    <el-input v-model="form.sort" placeholder="请输入组件排序"></el-input>
+                    <el-input v-model.number="form.sort" placeholder="请输入组件排序"></el-input>
                 </el-form-item>
             </el-form>
             <div style="width: 600px; height: 390px; overflow: hidden">
@@ -70,7 +70,7 @@
         <template #footer>
             <span class="dialog-footer">
                 <el-button @click="cancel">取消</el-button>
-                <el-button type="primary" @click="submit">确认</el-button>
+                <el-button type="primary" @click="submit">保存</el-button>
             </span>
         </template>
     </el-dialog>
@@ -112,7 +112,7 @@ onMounted(() => {
     customDeptOption.value = dictData.getBasicData('System_Type')
     customDeptOption.value.forEach((item: any) => {
         getFatherComponent({ systemType: item.id }).then(res => {
-            item.children = res.data
+            item.children = res.data.filter(item => item.name != '无')
         })
     })
 })
@@ -133,36 +133,47 @@ const submit = () => {
     formRef.value.validate(async (valid: boolean) => {
         if (valid) {
             let url = ''
-
-            await html2canvas(document.querySelector('.GridLayout'), {
-                scale: 2
-            }).then(canvas => {
-                url = canvas.toDataURL('image/png')
-            })
-            if (title.value == '新增组件') {
-                await componentAdd({
-                    ...form.value,
-                    systemType: form.value.system[0],
-                    pid: form.value.system[1],
-                    image: url
-                   
-                }).then(res => {
-                    ElMessage.success('新增成功!')
-                    emit('submit')
-                    cancel()
+            ElMessage.info('正在保存请稍等!')
+            setTimeout(async () => {
+                await html2canvas(document.querySelector('.GridLayout'), {
+                    // scale: 2
+                    scale: 1, // 降低缩放比例（2倍会让像素量翻倍，优先降到1）
+                    useCORS: false, // 非跨域图片关闭CORS检测（减少网络请求）
+                    logging: false, // 关闭日志输出（减少控制台开销）
+                    letterRendering: true, // 优化文字渲染性能
+                    allowTaint: true, // 允许跨域图片污染画布（避免额外校验）
+                    removeContainer: true, // 自动清理生成的临时容器
+                    ignoreElements: el => {
+                        // 忽略不可见/非关键元素（比如隐藏的弹窗、装饰性元素）
+                        return el.style.display === 'none' || el.classList.contains('ignore-screenshot')
+                    }
+                }).then(canvas => {
+                    url = canvas.toDataURL('image/png')
                 })
-            } else {
-                await componentEdit({
-                    ...form.value,
-                    systemType: form.value.system[0],
-                    pid: form.value.system[1],
-                    image: url
-                }).then(res => {
-                    ElMessage.success('修改成功!')
-                    emit('submit')
-                    cancel()
-                })
-            }
+                if (title.value == '新增组件') {
+                    await componentAdd({
+                        ...form.value,
+                        systemType: form.value.system[0],
+                        pid: form.value.system[1],
+                        image: url
+                    }).then(res => {
+                        ElMessage.success('新增成功!')
+                        emit('submit')
+                        cancel()
+                    })
+                } else {
+                    await componentEdit({
+                        ...form.value,
+                        systemType: form.value.system[0],
+                        pid: form.value.system[1],
+                        image: url
+                    }).then(res => {
+                        ElMessage.success('修改成功!')
+                        emit('submit')
+                        cancel()
+                    })
+                }
+            }, 500)
         }
     })
 }