优化

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "front-next",
-	"version": "6.3.2",
+	"version": "6.3.3",
 	"scripts": {
 		"dev": "vite --host",
 		"build": "vite build",
@@ -9,7 +9,7 @@
 		"lint:eslint": "eslint \"{src}/**/*.{vue,ts,tsx}\" --fix"
 	},
 	"dependencies": {
-		"@cool-vue/crud": "^6.3.1",
+		"@cool-vue/crud": "^6.3.2",
 		"@element-plus/icons-vue": "^2.0.10",
 		"@vueuse/core": "^9.1.0",
 		"@wangeditor/editor": "^5.1.23",

packages/crud/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@cool-vue/crud",
-	"version": "6.3.1",
+	"version": "6.3.2",
 	"private": false,
 	"main": "./dist/index.umd.min.js",
 	"typings": "types/index.d.ts",

packages/crud/src/static/index.scss

@@ -6,7 +6,7 @@
 	background-color: #fff;
 
 	&.is-border {
-		border: 1px solid #eee;
+		border: 1px solid var(--el-border-color);
 	}
 
 	.el-input-number {
@@ -141,7 +141,7 @@
 			span {
 				display: inline-block;
 				padding: 0 15px;
-				border-right: 1px solid #ddd;
+				border-right: 1px solid var(--el-border-color);
 			}
 
 			&:last-child {
@@ -258,7 +258,7 @@
 		align-items: center;
 		justify-content: flex-end;
 		height: 60px;
-		border-top: 1px solid #ebeef5;
+		border-top: 1px solid var(--el-border-color);
 		padding: 0 10px;
 		box-sizing: border-box;
 	}
@@ -365,7 +365,7 @@
 }
 
 .cl-form-tabs {
-	border-bottom: 1px solid #dcdfe6;
+	border-bottom: 1px solid var(--el-border-color);
 	overflow: hidden;
 	width: calc(100% - 10px);
 	margin: 0 5px 20px 5px;
@@ -422,15 +422,15 @@
 		}
 
 		ul {
-			border: 1px solid #dcdfe6;
+			border: 1px solid var(--el-border-color);
 			border-top-left-radius: 5px;
 			border-top-right-radius: 5px;
 
 			li {
-				border-left: 1px solid #dcdfe6;
+				border-left: 1px solid var(--el-border-color);
 
 				&:first-child {
-					border-left-color: transparent;
+					border-left-width: 0;
 				}
 			}
 		}

src/modules/base/views/param.vue

@@ -22,7 +22,7 @@
 </template>
 
 <script lang="ts" name="sys-param" setup>
-import { useCrud, useTable, useUpsert } from "@cool-vue/crud";
+import { setFocus, useCrud, useTable, useUpsert } from "@cool-vue/crud";
 import { Document } from "@element-plus/icons-vue";
 import { reactive } from "vue";
 import { useCool } from "/@/cool";
@@ -199,6 +199,8 @@ const Upsert = useUpsert({
 			data_1: undefined,
 			data_2: undefined
 		});
-	}
+	},
+
+	plugins: [setFocus()]
 });
 </script>

src/modules/cloud/views/func/info.vue

@@ -36,7 +36,7 @@
 </template>
 
 <script lang="ts" name="cloud-func-info" setup>
-import { useCrud, useTable, useUpsert } from "@cool-vue/crud";
+import { setFocus, useCrud, useTable, useUpsert } from "@cool-vue/crud";
 import { useCool } from "/@/cool";
 import { Status, CodeSnippets } from "../../dict";
 import FuncLogs from "../../components/func-logs.vue";
@@ -89,7 +89,8 @@ const Upsert = useUpsert({
 			...data,
 			content
 		});
-	}
+	},
+	plugins: [setFocus("name")]
 });
 
 // cl-table

src/modules/demo/views/crud.vue

@@ -1,5 +1,5 @@
 <template>
-	<cl-crud ref="Crud">
+	<cl-crud ref="Crud" border>
 		<cl-row>
 			<!-- 刷新按钮 -->
 			<cl-refresh-btn />

src/modules/dict/views/list.vue

@@ -44,7 +44,7 @@
 </template>
 
 <script lang="ts" name="dict-list" setup>
-import { useCrud, useTable, useUpsert } from "@cool-vue/crud";
+import { setFocus, useCrud, useTable, useUpsert } from "@cool-vue/crud";
 import { useCool } from "/@/cool";
 import { computed } from "vue";
 import { deepTree } from "/@/cool/utils";
@@ -171,7 +171,8 @@ const Upsert = useUpsert({
 			...data,
 			typeId: ViewGroup.value?.selected?.id
 		});
-	}
+	},
+	plugins: [setFocus("name")]
 });
 
 // cl-table

src/modules/task/views/list.vue

@@ -91,7 +91,7 @@
 import { onActivated, ref } from "vue";
 import { useBrowser, useCool } from "/@/cool";
 import { VideoPlay, VideoPause, Plus, Tickets, Delete } from "@element-plus/icons-vue";
-import { ContextMenu, useForm } from "@cool-vue/crud";
+import { ContextMenu, setFocus, useForm } from "@cool-vue/crud";
 import { ElMessage, ElMessageBox } from "element-plus";
 import TaskLogs from "../components/logs.vue";
 
@@ -179,132 +179,135 @@ async function edit(item?: Eps.TaskInfoEntity) {
 		return false;
 	}
 
-	Form.value?.open({
+	Form.value?.open(
-		title: "编辑计划任务",
+		{
-		width: "600px",
+			title: "编辑计划任务",
-		props: {
+			width: "600px",
-			labelWidth: "80px"
+			props: {
-		},
+				labelWidth: "80px"
-		items: [
-			{
-				label: "名称",
-				prop: "name",
-				component: {
-					name: "el-input",
-					props: {
-						placeholder: "请输入名称"
-					}
-				},
-				required: true
 			},
-			{
+			items: [
-				label: "类型",
+				{
-				prop: "taskType",
+					label: "名称",
-				value: 0,
+					prop: "name",
-				component: {
+					component: {
-					name: "el-radio-group",
+						name: "el-input",
-					options: [
+						props: {
-						{
+							placeholder: "请输入名称"
-							label: "cron",
-							value: 0
-						},
-						{
-							label: "时间间隔",
-							value: 1
 						}
-					]
-				},
-				required: true
-			},
-			{
-				label: "cron",
-				prop: "cron",
-				hidden: ({ scope }) => scope.taskType == 1,
-				component: {
-					name: "el-input",
-					props: {
-						placeholder: "* * * * * *"
-					}
-				},
-				required: true
-			},
-			{
-				label: "间隔(秒)",
-				prop: "every",
-				hidden: ({ scope }) => scope.taskType == 0,
-				hook: {
-					bind(value) {
-						return value / 1000;
 					},
-					submit(value) {
+					required: true
-						return value * 1000;
+				},
+				{
+					label: "类型",
+					prop: "taskType",
+					value: 0,
+					component: {
+						name: "el-radio-group",
+						options: [
+							{
+								label: "cron",
+								value: 0
+							},
+							{
+								label: "时间间隔",
+								value: 1
+							}
+						]
+					},
+					required: true
+				},
+				{
+					label: "cron",
+					prop: "cron",
+					hidden: ({ scope }) => scope.taskType == 1,
+					component: {
+						name: "el-input",
+						props: {
+							placeholder: "* * * * * *"
+						}
+					},
+					required: true
+				},
+				{
+					label: "间隔(秒)",
+					prop: "every",
+					hidden: ({ scope }) => scope.taskType == 0,
+					hook: {
+						bind(value) {
+							return value / 1000;
+						},
+						submit(value) {
+							return value * 1000;
+						}
+					},
+					component: {
+						name: "el-input-number",
+						props: {
+							min: 1,
+							max: 100000000
+						}
+					},
+					required: true
+				},
+				{
+					label: "service",
+					prop: "service",
+					component: {
+						name: "el-input",
+						props: {
+							placeholder: "taskDemoService.test([1, 2])"
+						}
 					}
 				},
-				component: {
+				{
-					name: "el-input-number",
+					label: "开始时间",
-					props: {
+					prop: "startDate",
-						min: 1,
+					hidden: ({ scope }) => scope.taskType == 1,
-						max: 100000000
+					component: {
+						name: "el-date-picker",
+						props: {
+							type: "datetime",
+							"value-format": "YYYY-MM-DD HH:mm:ss"
+						}
 					}
 				},
-				required: true
+				{
-			},
+					label: "备注",
-			{
+					prop: "remark",
-				label: "service",
+					component: {
-				prop: "service",
+						name: "el-input",
-				component: {
+						props: {
-					name: "el-input",
+							type: "textarea",
-					props: {
+							rows: 3
-						placeholder: "taskDemoService.test([1, 2])"
+						}
 					}
 				}
+			],
+			form: {
+				...item
 			},
-			{
+			on: {
-				label: "开始时间",
+				submit: (data, { close, done }) => {
-				prop: "startDate",
+					if (!data.limit) {
-				hidden: ({ scope }) => scope.taskType == 1,
+						data.limit = null;
-				component: {
-					name: "el-date-picker",
-					props: {
-						type: "datetime",
-						"value-format": "YYYY-MM-DD HH:mm:ss"
 					}
-				}
-			},
-			{
-				label: "备注",
-				prop: "remark",
-				component: {
-					name: "el-input",
-					props: {
-						type: "textarea",
-						rows: 3
-					}
-				}
-			}
-		],
-		form: {
-			...item
-		},
-		on: {
-			submit: (data, { close, done }) => {
-				if (!data.limit) {
-					data.limit = null;
-				}
 
-				service.task.info[item?.id ? "update" : "add"](data)
+					service.task.info[item?.id ? "update" : "add"](data)
-					.then(() => {
+						.then(() => {
-						refresh();
+							refresh();
-						ElMessage.success("保存成功");
+							ElMessage.success("保存成功");
-						close();
+							close();
-					})
+						})
-					.catch((err) => {
+						.catch((err) => {
-						ElMessage.error(err.message);
+							ElMessage.error(err.message);
-						done();
+							done();
-					});
+						});
+				}
 			}
-		}
+		},
-	});
+		[setFocus()]
+	);
 }
 
 // 执行一次

src/modules/theme/static/css/index.scss

@@ -6,6 +6,10 @@ html.dark {
 		.cl-form-tabs {
 			border-bottom: 1px solid #222;
 		}
+
+		.cl-form-tabs * {
+			border-color: #222;
+		}
 	}
 
 	.cl-crud {

yarn.lock

@@ -280,10 +280,10 @@
     "@babel/helper-validator-identifier" "^7.19.1"
     to-fast-properties "^2.0.0"
 
-"@cool-vue/crud@^6.3.1":
+"@cool-vue/crud@^6.3.2":
-  version "6.3.1"
+  version "6.3.2"
-  resolved "https://registry.yarnpkg.com/@cool-vue/crud/-/crud-6.3.1.tgz#871d9788d43576337af92ebae5b770dd16ee7826"
+  resolved "https://registry.yarnpkg.com/@cool-vue/crud/-/crud-6.3.2.tgz#211caf2f1400d3fbddcacb0f90644f321c6cf440"
-  integrity sha512-mbAaumXavoVW4wtShZpQb0lKG9VHGfvrsUgnVt78zi7TVB32+9duasMjf2Y3gz6HM1p1FODMPhfkCOXGbpOHyA==
+  integrity sha512-aX00vWLrrr4SRc/52HxtEjrmyoqbbjPh/UQ+xip1VUiflNvgdCZ9Zq0PBScPTEE0gZK2G/EoWXMsFtdb5B+lLw==
   dependencies:
     array.prototype.flat "^1.2.4"
     core-js "^3.21.1"