@tmagic/form 1.0.0-rc.1 → 1.0.0-rc.12

package/dist/types/src/fields/DynamicField.vue.d.ts

@@ -34,10 +34,10 @@ declare const _default: DefineComponent<{
 }, {
     request: Function;
     fieldMap: {
-        [x: string]: any;
+        [key: string]: any;
     };
     fieldLabelMap: {
-        [x: string]: any;
+        [key: string]: any;
     };
     unwatch: WatchStopHandle;
     changeFieldMap: () => Promise<void>;

package/dist/types/src/index.d.ts

@@ -31,6 +31,6 @@ export { default as MSelect } from './fields/Select.vue';
 export { default as MCascader } from './fields/Cascader.vue';
 export { default as MDynamicField } from './fields/DynamicField.vue';
 declare const _default: {
-    install: (app: App<any>, opt: any) => void;
+    install: (app: App, opt: any) => void;
 };
 export default _default;

package/dist/types/src/schema.d.ts

@@ -92,6 +92,7 @@ export interface Rule {
         /** 整个表单的值 */
         formValue: FormValue;
         prop: string;
+        config: any;
     }, mForm: FormState | undefined) => void;
 }
 export interface Input {
@@ -107,12 +108,14 @@ declare type FilterFunction = (mForm: FormState | undefined, data: {
     parent?: Record<any, any>;
     formValue: Record<any, any>;
     prop: string;
+    config: any;
 }) => boolean;
 declare type OnChangeHandler = (mForm: FormState | undefined, value: any, data: {
     model: Record<any, any>;
     values: Record<any, any>;
     parent?: Record<any, any>;
     formValue: Record<any, any>;
+    config: any;
 }) => any;
 declare type DefaultValueFunction = (mForm: FormState | undefined) => any;
 /**
@@ -141,16 +144,19 @@ declare type SelectOptionFunction = (mForm: FormState | undefined, data: {
     prop?: string;
     formValues: any;
     formValue: any;
+    config: any;
 }) => SelectOption[] | SelectGroupOption[];
 declare type RemoteSelectOptionBodyFunction = (mForm: FormState | undefined, data: {
     model: any;
     formValue: any;
     formValues: any;
+    config: any;
 }) => Record<string, any>;
 declare type RemoteSelectOptionRequestFunction = (mForm: FormState | undefined, res: any, data: {
     model: any;
     formValue: any;
     formValues: any;
+    config: any;
 }) => any;
 declare type RemoteSelectOptionItemFunction = (optionsData: Record<string, any>) => SelectOption[];
 declare type SelectOptionValueFunction = (item: Record<string, any>) => any;
@@ -396,6 +402,7 @@ export interface TabPaneConfig {
     lazy?: boolean;
     labelWidth?: string;
     items: FormConfig;
+    [key: string]: any;
 }
 export interface TabConfig extends FormItem, ContainerCommonConfig {
     type: 'tab' | 'dynamic-tab';
@@ -433,6 +440,7 @@ export interface ColumnConfig extends FormItem, ContainerCommonConfig {
     label: string;
     width: string | number;
     sortable: boolean;
+    [key: string]: any;
 }
 /**
  * 表格容器

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.0.0-rc.1",
+  "version": "1.0.0-rc.12",
   "name": "@tmagic/form",
   "sideEffects": [
     "dist/*",
@@ -22,9 +22,7 @@
   },
   "license": "Apache-2.0",
   "scripts": {
-    "build": "vite build",
-    "test": "jest --maxWorkers=8",
-    "test:coverage": "jest --maxWorkers=16 --coverage"
+    "build": "vite build"
   },
   "engines": {
     "node": ">=14"
@@ -35,32 +33,30 @@
   },
   "dependencies": {
     "@element-plus/icons": "0.0.11",
-    "@tmagic/utils": "^1.0.0-rc.1",
+    "@tmagic/utils": "1.0.0-rc.12",
     "element-plus": "^2.2.0",
     "lodash-es": "^4.17.21",
     "moment": "^2.29.2",
     "sortablejs": "^1.14.0",
     "vue": "^3.2.0"
   },
+  "peerDependencies": {
+    "element-plus": "^2.2.0",
+    "vue": "^3.2.0"
+  },
   "devDependencies": {
-    "@types/jest": "^26.0.23",
+    "@babel/core": "^7.18.0",
     "@types/lodash-es": "^4.17.4",
     "@types/node": "^15.12.4",
     "@types/sortablejs": "^1.10.7",
     "@vitejs/plugin-vue": "^1.2.3",
     "@vitejs/plugin-vue-jsx": "^1.1.6",
     "@vue/compiler-sfc": "^3.2.0",
-    "@vue/test-utils": "^2.0.0-rc.20",
-    "@vue/vue3-jest": "^27.0.0-alpha.4",
-    "jest": "^27.5.1",
-    "jest-serializer-vue": "^2.0.2",
-    "jest-transform-stub": "^2.0.0",
+    "@vue/test-utils": "^2.0.0",
     "sass": "^1.35.1",
-    "ts-jest": "^27.1.4",
     "typescript": "^4.3.4",
     "vite": "^2.3.7",
     "vite-plugin-dts": "^0.9.6",
     "vue-tsc": "^0.0.24"
-  },
-  "gitHead": "3b647794d087888bfec9772f54356fa48c0b6d90"
+  }
 }

package/src/containers/Container.vue

@@ -32,7 +32,7 @@
     <template v-else-if="type && display">
       <el-form-item
         :style="config.tip ? 'flex: 1' : ''"
-        :class="{ hidden: itemLabelWidth === 0 || !config.text }"
+        :class="{ hidden: `${itemLabelWidth}` === '0' || !config.text }"
         :prop="itemProp"
         :label-width="itemLabelWidth"
         :rules="rule"
@@ -154,7 +154,18 @@ export default defineComponent({
 
     const items = computed(() => (props.config as ContainerCommonConfig).items);
 
-    const itemProp = computed(() => (name.value ? `${props.prop}${props.prop ? '.' : ''}${name.value}` : props.prop));
+    const itemProp = computed(() => {
+      let n: string | number = '';
+      const { names } = props.config as any;
+      if (names?.[0]) {
+        [n] = names;
+      } else if (name.value) {
+        n = name.value;
+      } else {
+        return props.prop;
+      }
+      return `${props.prop}${props.prop ? '.' : ''}${n}`;
+    });
 
     const tagName = computed(() => {
       const component = resolveComponent(`m-${items.value ? 'form' : 'fields'}-${type.value}`);
@@ -206,6 +217,7 @@ export default defineComponent({
           values: mForm?.initValues,
           formValue: mForm?.values,
           prop: itemProp.value,
+          config: props.config,
         });
       }
 
@@ -223,6 +235,7 @@ export default defineComponent({
           values: mForm?.initValues,
           formValue: mForm?.values,
           prop: itemProp.value,
+          config: props.config,
         });
       }
     };

package/src/containers/Table.vue

@@ -476,7 +476,7 @@ export default defineComponent({
         }
         emit('select', selection, row);
         if (typeof props.config.onSelect === 'function') {
-          props.config.onSelect(mForm, { selection, row });
+          props.config.onSelect(mForm, { selection, row, config: props.config });
         }
       },
 

package/src/containers/Tabs.vue

@@ -59,12 +59,12 @@ const tabClickHandler = (mForm: FormState | undefined, tab: any, props: any) =>
   tab.name = tab.paneName;
 
   if (typeof config.onTabClick === 'function') {
-    config.onTabClick(mForm, tab, { model, formValue: mForm?.values, prop });
+    config.onTabClick(mForm, tab, { model, formValue: mForm?.values, prop, config });
   }
 
   const tabConfig = config.items.find((item: TabPaneConfig) => tab.name === item.status);
   if (tabConfig && typeof tabConfig.onTabClick === 'function') {
-    tabConfig.onTabClick(mForm, tab, { model, formValue: mForm?.values, prop });
+    tabConfig.onTabClick(mForm, tab, { model, formValue: mForm?.values, prop, config });
   }
 };
 
@@ -136,7 +136,11 @@ const Tab = defineComponent({
         if (!props.config.name) throw new Error('dynamic tab 必须配置name');
 
         if (typeof props.config.onTabAdd === 'function') {
-          props.config.onTabAdd(mForm, { model: props.model });
+          props.config.onTabAdd(mForm, {
+            model: props.model,
+            prop: props.prop,
+            config: props.config,
+          });
         } else if (tabs.value.length > 0) {
           const newObj = cloneDeep(tabs.value[0]);
           newObj.title = `标签${tabs.value.length + 1}`;
@@ -150,7 +154,11 @@ const Tab = defineComponent({
         if (!props.config.name) throw new Error('dynamic tab 必须配置name');
 
         if (typeof props.config.onTabRemove === 'function') {
-          props.config.onTabRemove(mForm, tabName, { model: props.model });
+          props.config.onTabRemove(mForm, tabName, {
+            model: props.model,
+            prop: props.prop,
+            config: props.config,
+          });
         } else {
           props.model[props.config.name].splice(+tabName, 1);
 
@@ -169,7 +177,7 @@ const Tab = defineComponent({
       changeHandler: () => {
         emit('change', props.model);
         if (typeof props.config.onChange === 'function') {
-          props.config.onChange(mForm, { model: props.model });
+          props.config.onChange(mForm, { model: props.model, prop: props.prop, config: props.config });
         }
       },
     };

package/src/fields/Daterange.vue

@@ -60,6 +60,14 @@ export default defineComponent({
         });
       } else if (props.model && props.name && v instanceof Date) {
         props.model[props.name] = datetimeFormatter(v.toString(), '');
+      } else if (names?.length) {
+        names.forEach((item) => {
+          if (props.model) {
+            props.model[item] = undefined;
+          }
+        });
+      } else if (props.name) {
+        props.model[props.name] = undefined;
       }
     };
 

package/src/fields/Select.vue

@@ -134,6 +134,7 @@ export default defineComponent({
             model: props.model,
             formValue: mForm?.values,
             formValues: mForm?.values,
+            config: props.config,
           }) as Record<string, any>;
         }
 
@@ -163,6 +164,7 @@ export default defineComponent({
           model: props.model,
           formValue: mForm?.values,
           formValues: mForm?.values,
+          config: props.config,
         });
       }
 
@@ -287,6 +289,7 @@ export default defineComponent({
                 prop: props.prop,
                 formValues: mForm?.values,
                 formValue: mForm?.values,
+                config: props.config,
               }),
             ).then((data) => {
               options.value = data;

package/src/schema.ts

@@ -120,6 +120,7 @@ export interface Rule {
       /** 整个表单的值 */
       formValue: FormValue;
       prop: string;
+      config: any;
     },
     mForm: FormState | undefined,
   ) => void;
@@ -145,6 +146,7 @@ type FilterFunction = (
     parent?: Record<any, any>;
     formValue: Record<any, any>;
     prop: string;
+    config: any;
   },
 ) => boolean;
 
@@ -156,6 +158,7 @@ type OnChangeHandler = (
     values: Record<any, any>;
     parent?: Record<any, any>;
     formValue: Record<any, any>;
+    config: any;
   },
 ) => any;
 
@@ -191,6 +194,7 @@ type SelectOptionFunction = (
     prop?: string;
     formValues: any;
     formValue: any;
+    config: any;
   },
 ) => SelectOption[] | SelectGroupOption[];
 
@@ -200,6 +204,7 @@ type RemoteSelectOptionBodyFunction = (
     model: any;
     formValue: any;
     formValues: any;
+    config: any;
   },
 ) => Record<string, any>;
 
@@ -210,6 +215,7 @@ type RemoteSelectOptionRequestFunction = (
     model: any;
     formValue: any;
     formValues: any;
+    config: any;
   },
 ) => any;
 
@@ -500,6 +506,7 @@ export interface TabPaneConfig {
   lazy?: boolean;
   labelWidth?: string;
   items: FormConfig;
+  [key: string]: any;
 }
 export interface TabConfig extends FormItem, ContainerCommonConfig {
   type: 'tab' | 'dynamic-tab';
@@ -540,6 +547,7 @@ export interface ColumnConfig extends FormItem, ContainerCommonConfig {
   label: string;
   width: string | number;
   sortable: boolean;
+  [key: string]: any;
 }
 
 /**

package/src/utils/form.ts

@@ -201,6 +201,7 @@ export const filterFunction = (mForm: FormState | undefined, config: any, props:
     parent: mForm?.parentValues || {},
     formValue: mForm?.values || props.model,
     prop: props.prop,
+    config: props.config,
   });
 };
 
@@ -242,6 +243,7 @@ export const getRules = function (mForm: FormState | undefined, rules: Rule[] |
             parent: mForm?.parentValues || {},
             formValue: mForm?.values || props.model,
             prop: props.prop,
+            config: props.config,
           },
           mForm,
         );