diff --git a/package.json b/package.json
index 46add27..412a649 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "front-next",
- "version": "0.2.5",
+ "version": "0.2.6",
"scripts": {
"dev": "vite",
"build": "vue-tsc --noEmit --skipLibCheck && vite build",
diff --git a/src/cool/modules/crud/components/form-tabs.tsx b/src/cool/modules/crud/components/form-tabs.tsx
index 7bbd39c..9316e82 100644
--- a/src/cool/modules/crud/components/form-tabs.tsx
+++ b/src/cool/modules/crud/components/form-tabs.tsx
@@ -1,4 +1,4 @@
-import { defineComponent, nextTick, onMounted, reactive, ref } from "vue";
+import { defineComponent, nextTick, onMounted, reactive, ref, watch } from "vue";
import { useRefs } from "../hooks/core";
import { isArray, isEmpty } from "../utils";
@@ -43,20 +43,22 @@ export default defineComponent({
const index = list.value.findIndex((e) => e.value === val);
const item = refs.value[`tab-${index}`];
- // 下划线位置
- line.width = item.clientWidth + "px";
- line.transform = `translateX(${item.offsetLeft}px)`;
- line.backgroundColor = props.color;
+ if (item) {
+ // 下划线位置
+ line.width = item.clientWidth + "px";
+ line.transform = `translateX(${item.offsetLeft}px)`;
+ line.backgroundColor = props.color;
- // 靠左位置
- let left: number = item.offsetLeft + item.clientWidth / 2 - 414 / 2 + 15;
+ // 靠左位置
+ let left: number = item.offsetLeft + item.clientWidth / 2 - 414 / 2 + 15;
- if (left < 0) {
- left = 0;
+ if (left < 0) {
+ left = 0;
+ }
+
+ // 设置滚动距离
+ refs.value.tabs.scrollLeft = left;
}
-
- // 设置滚动距离
- refs.value.tabs.scrollLeft = left;
});
active.value = val;
@@ -64,6 +66,14 @@ export default defineComponent({
emit("change", val);
}
+ // 监听绑定值变化
+ watch(
+ () => props.modelValue,
+ (val: any) => {
+ update(val);
+ }
+ );
+
onMounted(function () {
if (isArray(props.labels) && props.labels.length > 0) {
list.value = props.labels;
diff --git a/src/cool/modules/crud/components/form/index.tsx b/src/cool/modules/crud/components/form/index.tsx
index 7b9bea8..e29b5b6 100644
--- a/src/cool/modules/crud/components/form/index.tsx
+++ b/src/cool/modules/crud/components/form/index.tsx
@@ -128,30 +128,44 @@ export default defineComponent({
}
// 表单提交
- function submit() {
+ function submit(callback?: Function) {
// 验证表单
- refs.value.form.validate(async (valid: boolean) => {
+ refs.value.form.validate(async (valid: boolean, error: any) => {
+ console.log(valid, error);
if (valid) {
saving.value = true;
- // 表单提交钩子
- if (conf.on?.submit) {
- // 拷贝表单值
- const d = cloneDeep(form);
+ // 拷贝表单值
+ const d = cloneDeep(form);
- // 过滤隐藏的表单项
- conf.items.forEach((e: any) => {
- if (e._hidden) {
- delete d[e.prop];
- }
- });
+ // 过滤隐藏的表单项
+ conf.items.forEach((e: any) => {
+ if (e._hidden) {
+ delete d[e.prop];
+ }
+ });
- conf.on.submit(d, {
+ const submit = callback || conf.on?.submit;
+
+ // 提交事件
+ if (submit) {
+ submit(d, {
done,
close
});
} else {
- console.error("Submit is not found");
+ console.error("Not found callback function");
+ }
+ } else {
+ // 判断是否使用form-tabs,切换到对应的选项卡
+ const keys = Object.keys(error);
+
+ if (tabActive.value) {
+ const item = conf.items.find((e) => e.prop === keys[0]);
+
+ if (item) {
+ tabActive.value = item.group;
+ }
}
}
});
@@ -275,14 +289,7 @@ export default defineComponent({
// 表单项列表
const children = ctx.conf.items.map((e: any) => {
if (e.type == "tabs") {
- return (
- {
- ctx.clearValidate();
- }}>
- );
+ return ;
}
// 隐藏处理
@@ -302,12 +309,11 @@ export default defineComponent({
}
return (
- e._group &&
!e._hidden && (
{e.component &&
h(
- ,
+ ,
{
prop: e.prop,
rules: e.rules,