style(components): 统一表单组件样式和尺寸配置

- 为 CuteFormDialog、CuteFormDrawer、CuteSearchForm 组件的 el-form 添加 size="mini" 属性
- 将 CuteFormDialog 和 CuteFormDrawer 的默认宽度从 30% 调整为 40%
- 将 CuteScreenShot 按钮的尺寸从 small 调整为 mini 并将文本从"截图并下载"改为"截屏"
- 为 CuteSearchForm 添加前后置插槽的注释说明
- 为 CuteVerticalScrollBar 设置固定宽度和最大高度样式

cutejava-front/src/views/components/dev/CuteFormDialog.vue

@@ -14,7 +14,7 @@
     :modal="false"
   >
     <div class="container-form">
-      <el-form ref="form" :model="model" :rules="rules" :inline="inline">
+      <el-form ref="form" :model="model" :rules="rules" :inline="inline" size="mini">
         <!-- 这里是插槽，用于渲染传入的 el-form-item -->
         <slot />
       </el-form>
@@ -41,7 +41,7 @@ export default {
     width: {
       type: String,
       required: false,
-      default: '30%'
+      default: '40%'
     },
     fullscreen: {
       type: Boolean,

cutejava-front/src/views/components/dev/CuteFormDrawer.vue

@@ -18,7 +18,7 @@
     :modal="false"
   >
     <div class="container-form">
-      <el-form ref="form" :model="model" :rules="rules" :inline="inline">
+      <el-form ref="form" :model="model" :rules="rules" :inline="inline" size="mini">
         <!-- 这里是插槽，用于渲染传入的 el-form-item -->
         <slot />
       </el-form>
@@ -44,7 +44,7 @@ export default {
     width: {
       type: String,
       required: false,
-      default: '30%'
+      default: '40%'
     },
     model: {
       type: Object,

cutejava-front/src/views/components/dev/CuteScreenShot.vue

@@ -11,10 +11,10 @@
         type="primary"
         icon="el-icon-camera"
         :loading="capturing"
-        size="small"
+        size="mini"
         @click="capture"
       >
-        截图并下载
+        截屏
       </el-button>
     </div>
     <div id="elementIdSelector" style="padding: 15px">

cutejava-front/src/views/components/dev/CuteSearchForm.vue

@@ -1,64 +1,67 @@
-<!--
- * 查询组件
- * @author odboy
- * @email tianjun@odboy.cn
- * @created 2025-08-20
- -->
-<template>
-  <el-form
-    ref="searchForm"
-    :inline="true"
-    :model.sync="model"
-    label-position="right"
-    label-width="90px"
-    :disabled="disabled"
-  >
-    <slot name="suffix" />
-    <el-form-item>
-      <el-button type="primary" @click="onFormSubmit('searchForm')">查询</el-button>
-      <el-button @click="onFormReset('searchForm')">重置</el-button>
-    </el-form-item>
-    <slot name="operation" />
-  </el-form>
-</template>
-
-<script>
-
-export default {
-  name: 'CuteSearchForm',
-  components: {},
-  props: {
-    model: {
-      type: Object,
-      required: true
-    },
-    disabled: {
-      type: Boolean,
-      required: false,
-      default: false
-    }
-  },
-  methods: {
-    onFormSubmit(formName) {
-      const that = this
-      that.$refs[formName].validate((valid) => {
-        if (valid) {
-          that.$emit('submit', that.model)
-        } else {
-          return false
-        }
-      })
-    },
-    onFormReset(formName) {
-      try {
-        this.$refs[formName].resetFields()
-        this.onFormSubmit(formName)
-        // this.$emit('reset')
-      } catch (e) {
-        console.error(e)
-      }
-    }
-  }
-}
-</script>
-
+<!--
+ * 查询组件
+ * @author odboy
+ * @email tianjun@odboy.cn
+ * @created 2025-08-20
+ -->
+<template>
+  <el-form
+    ref="searchForm"
+    :inline="true"
+    :model.sync="model"
+    label-position="right"
+    label-width="90px"
+    :disabled="disabled"
+    size="mini"
+  >
+    <!-- 通过  <template v-slot:suffix> 插槽前置查询条件 -->
+    <slot name="suffix" />
+    <el-form-item>
+      <el-button type="primary" @click="onFormSubmit('searchForm')">查询</el-button>
+      <el-button @click="onFormReset('searchForm')">重置</el-button>
+    </el-form-item>
+    <!-- 通过  <template v-slot:operation> 插槽后置操作按钮 -->
+    <slot name="operation" />
+  </el-form>
+</template>
+
+<script>
+
+export default {
+  name: 'CuteSearchForm',
+  components: {},
+  props: {
+    model: {
+      type: Object,
+      required: true
+    },
+    disabled: {
+      type: Boolean,
+      required: false,
+      default: false
+    }
+  },
+  methods: {
+    onFormSubmit(formName) {
+      const that = this
+      that.$refs[formName].validate((valid) => {
+        if (valid) {
+          that.$emit('submit', that.model)
+        } else {
+          return false
+        }
+      })
+    },
+    onFormReset(formName) {
+      try {
+        this.$refs[formName].resetFields()
+        this.onFormSubmit(formName)
+        // this.$emit('reset')
+      } catch (e) {
+        console.error(e)
+      }
+    }
+  }
+}
+</script>
+

cutejava-front/src/views/components/dev/CuteVerticalScrollBar.vue

@@ -5,7 +5,7 @@
  * @created 2025-08-20
  -->
 <template>
-  <div class="overflow-panel" :style="{height: height}">
+  <div class="overflow-panel" :style="{width: '100%', height: height, maxHeight: height}">
     <slot />
   </div>
 </template>