@skyfox2000/webui 1.0.2 → 1.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skyfox2000/webui",
3
- "version": "1.0.2",
3
+ "version": "1.0.4",
4
4
  "description": "后台前端通用组件定义",
5
5
  "type": "module",
6
6
  "keywords": [],
@@ -34,7 +34,7 @@
34
34
  "peerDependencies": {
35
35
  "@skyfox2000/fapi": "^1.1.17",
36
36
  "@skyfox2000/microbase": "^1.0.15",
37
- "@skyfox2000/webbase": "^1.1.2",
37
+ "@skyfox2000/webbase": "^1.1.7",
38
38
  "ant-design-vue": "^4.2.6",
39
39
  "dayjs": "^1.11.13",
40
40
  "pinia": "^2.3.0",
@@ -1,8 +1,8 @@
1
1
  <script setup lang="ts">
2
- import { EditorControl, ProviderKeys, useFormItemFactory } from '@skyfox2000/webbase';
3
- import { FormItem } from 'ant-design-vue';
2
+ import { EditorControl, ProviderKeys, useFormItemFactory, ValidateRuleItem } from '@skyfox2000/webbase';
3
+ import { FormItem, message } from 'ant-design-vue';
4
4
  import { Helper } from '../../common';
5
- import { inject, ref, useAttrs } from 'vue';
5
+ import { computed, inject, ref, useAttrs } from 'vue';
6
6
  import { AnyData } from '@skyfox2000/fapi';
7
7
 
8
8
  const props = defineProps<{
@@ -39,6 +39,41 @@ setTimeout(() => {
39
39
  visible.value = true;
40
40
  }, 30);
41
41
 
42
+ /**
43
+ * 递归获取规则
44
+ * - async-validator的语法规范
45
+ */
46
+ const getRule = (rule: Array<string>, ruleObj: Record<string, any> | undefined): ValidateRuleItem | undefined => {
47
+ if (!ruleObj) {
48
+ return undefined;
49
+ }
50
+ const [key, ...rest] = rule;
51
+ if (rule.length === 1) {
52
+ return ruleObj[key];
53
+ }
54
+ return getRule(rest, ruleObj[key].fields as Record<string, any>);
55
+ };
56
+ /**
57
+ * 是否必填
58
+ * - 如果rule为空,则不显示必填标记
59
+ * - 如果rule不为空,则根据formRules中的required属性判断是否必填
60
+ */
61
+ const required = computed(() => {
62
+ if (!props.rule) {
63
+ // 如果rule为空,则不显示必填标记
64
+ return false;
65
+ }
66
+ // 如果rule包含.,则表示是对象属性
67
+ const rule = getRule(props.rule.split('.'), editorCtrl?.formRules?.value);
68
+ if (!rule) {
69
+ message.error(`"${props.label}" 的验证规则 \`${props.rule}\` 不存在`);
70
+ errInfo.value.errClass = 'text-[#ff4d4f]';
71
+ errInfo.value.msg = `规则 \`${props.rule}\` 不存在,请检查代码!`;
72
+ return true;
73
+ }
74
+ return rule.required ?? true;
75
+ });
76
+
42
77
  // 参考代码
43
78
  // this.$parent.$el.scrollIntoView({
44
79
  // //滚动到指定节点
@@ -50,7 +85,7 @@ setTimeout(() => {
50
85
  <div :class="['w-full relative mb-1', width]">
51
86
  <FormItem
52
87
  v-if="visible"
53
- :required="!!rule && editorCtrl?.formRules?.value?.[rule]?.required"
88
+ :required="required"
54
89
  class="!w-[95%] relative"
55
90
  v-bind="attrs"
56
91
  :class="[rule ? '' : 'mb-3']"