@vue-start/element-pro 0.1.1 → 0.1.2

package/dist/index.es.js

@@ -1,8 +1,8 @@
-import { inject, provide, defineComponent, createVNode, mergeProps, ref, reactive, computed, toRaw, Fragment, createTextVNode, withDirectives, isVNode, resolveDirective } from 'vue';
-import { ElFormItem, ElForm, ElSelect, ElOption, ElButton, ElInput, ElInputNumber, ElDatePicker, ElTimePicker, ElTreeSelect, ElCheckboxGroup, ElRadioGroup, ElSwitch, ElCascader, ElTable, ElTableColumn, ElPagination, ElDescriptions, ElDescriptionsItem } from 'element-plus';
-import { keys, omit, forEach, size, map, debounce, some, get, clone, isBoolean, set, isArray, merge, sortBy, filter, isFunction, isNumber, pick } from 'lodash';
-import { useEffect, useWatch } from '@vue-start/hooks';
-import { getValidValues, getFormItemEl, convertPathToList, getItemEl, useProCurd, CurdAddAction, CurdCurrentMode, useProModule, CurdAction } from '@vue-start/pro';
+import { defineComponent, createVNode, Fragment, mergeProps, isVNode, ref, reactive, toRaw, computed } from 'vue';
+import { ElTableColumn, ElTable, ElPagination, ElRow, ElCol, ElFormItem, ElForm, ElSelect, ElOption, ElInput, ElInputNumber, ElDatePicker, ElTimePicker, ElTreeSelect, ElCheckboxGroup, ElRadioGroup, ElSwitch, ElCascader, ElButton, ElDescriptions, ElDescriptionsItem, ElDialog } from 'element-plus';
+import { map, omit, get, keys, pick, isNumber, merge, size, isUndefined, mergeWith, isArray, concat } from 'lodash';
+import { useProTable, ProTable as ProTable$1, ProForm as ProForm$1, getFormItemEl, getColumnFormItemName, getValidValues, ProSearchForm as ProSearchForm$1, createFormItemCompFn, useProForm, ProFormList as ProFormList$1, useProCurd, CurdAddAction, CurdCurrentMode, useProModule, CurdAction, CurdSubAction } from '@vue-start/pro';
+import { setReactiveValue } from '@vue-start/hooks';
 
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
@@ -78,156 +78,251 @@ function _nonIterableSpread() {
   throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
 
-/**
- * ProForm ctx
- */
-var ProFormKey = Symbol("pro-form");
-var useProForm = function useProForm() {
-  return inject(ProFormKey);
-};
-var provideProForm = function provideProForm(ctx) {
-  provide(ProFormKey, ctx);
-};
-/**
- * ProFormList ctx
- */
+var Content = defineComponent(function () {
+  var _useProTable = useProTable(),
+      columns = _useProTable.columns;
+
+  return function () {
+    return createVNode(Fragment, null, [map(columns.value, function (item) {
+      var formatter = function formatter(record, column, value, index) {
+        if (item.customRender) {
+          return item.customRender({
+            value: value,
+            text: value,
+            record: record,
+            column: column,
+            index: index
+          });
+        }
 
-var ProFormListKey = Symbol("pro-form-list");
-var useProFormList = function useProFormList() {
-  return inject(ProFormListKey);
-};
-var provideProFormList = function provideProFormList(ctx) {
-  provide(ProFormListKey, ctx);
-};
+        return value;
+      };
 
-var proFormItemProps$1 = function proFormItemProps() {
-  return {
-    name: {
-      type: [String, Array]
-    }
+      return createVNode(ElTableColumn, mergeProps({
+        "key": item.dataIndex
+      }, omit(item, "title", "label", "renderHeader", "prop", "dataIndex", "formatter", "customRender"), {
+        "label": isVNode(item.title) ? undefined : item.title || get(item, "label"),
+        "renderHeader": isVNode(item.title) ? function () {
+          return item.title;
+        } : undefined,
+        "prop": item.dataIndex,
+        "formatter": formatter
+      }), null);
+    })]);
   };
-};
-
-var ProFormItem = defineComponent({
-  props: _objectSpread2(_objectSpread2({}, ElFormItem.props), proFormItemProps$1()),
+});
+var ProTable = defineComponent({
+  inheritAttrs: false,
+  props: _objectSpread2(_objectSpread2({}, ElTable.props), ProTable$1.props),
   setup: function setup(props, _ref) {
-    var slots = _ref.slots;
-    var invalidKeys = keys(proFormItemProps$1());
+    var slots = _ref.slots,
+        expose = _ref.expose,
+        attrs = _ref.attrs;
+    var tableRef = ref();
+    var originKeys = keys(ProTable$1.props);
     return function () {
-      return createVNode(ElFormItem, mergeProps(omit.apply(void 0, [props].concat(_toConsumableArray(invalidKeys), ["name", "prop"])), {
-        "prop": props.prop || props.name
-      }), slots);
+      var _slots$default;
+
+      return createVNode(ProTable$1, mergeProps(attrs, pick.apply(void 0, [props].concat(_toConsumableArray(originKeys), ["provideExtra"])), {
+        "provideExtra": _objectSpread2({
+          tableRef: tableRef
+        }, props.provideExtra)
+      }), {
+        "default": function _default() {
+          return [createVNode(ElTable, mergeProps({
+            "ref": function ref(el) {
+              expose(el);
+              tableRef.value = el;
+            }
+          }, omit(props, originKeys)), _objectSpread2({
+            "default": function _default() {
+              return [createVNode(Content, null, null), (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)];
+            }
+          }, omit(slots, "default")))];
+        }
+      });
     };
   }
 });
 
-var proFormProps = function proFormProps() {
+var defaultPage = {
+  page: 1,
+  pageSize: 10
+};
+
+var proListProps = function proListProps() {
   return {
     /**
-     *  子组件是否只读样式
+     * extra 是否放到SearchForm中
      */
-    readonly: {
+    extraInSearch: {
       type: Boolean,
       "default": undefined
     },
-
-    /**
-     *  FormComponent 根据此项来确定组件是否显示
-     *  rules 根据rules中方法生成showState对象
-     */
-    showState: {
+    //search
+    searchProps: {
       type: Object
     },
-    showStateRules: {
+    //table
+    tableProps: {
       type: Object
     },
-
-    /**
-     * 是否只读
-     */
-    readonlyState: {
+    //pagination
+    paginationProps: {
       type: Object
     },
-    readonlyStateRules: {
+    //pageState
+    pageState: {
       type: Object
-    },
+    }
+  };
+};
+
+var ProList = defineComponent({
+  props: _objectSpread2({}, proListProps()),
+  setup: function setup(props, _ref) {
+    var slots = _ref.slots,
+        emit = _ref.emit;
+
+    /******************* search pagination ********************/
+    var pageState = props.pageState || reactive(_objectSpread2({}, defaultPage));
+    var prevValues;
+
+    var handleSearch = function handleSearch() {
+      emit("list", _objectSpread2(_objectSpread2({}, prevValues), pageState));
+    }; //页数重置1 且搜索
+
+
+    var executeSearchWithResetPage = function executeSearchWithResetPage(values) {
+      prevValues = values;
+      pageState.page = 1;
+      handleSearch();
+    };
+
+    return function () {
+      var _slots$divide, _slots$divide2, _slots$footerLeft, _slots$footerRight;
+
+      var searchProps = props.searchProps;
+      var tableProps = props.tableProps;
+      var paginationProps = props.paginationProps; //操作按钮
+
+      var extra = slots.extra ? createVNode("div", {
+        "class": "pro-list-search"
+      }, [slots.extra()]) : null; //分页参数
+
+      var pagination = _objectSpread2(_objectSpread2({}, paginationProps), {}, {
+        currentPage: pageState.page,
+        pageSize: pageState.pageSize,
+        onSizeChange: function onSizeChange(pageSize) {
+          pageState.pageSize = pageSize;
+          handleSearch();
+        },
+        onCurrentChange: function onCurrentChange(current) {
+          pageState.page = current;
+          handleSearch();
+        }
+      });
+
+      return createVNode(Fragment, null, [createVNode(ProSearchForm, mergeProps(searchProps, {
+        "onFinish": executeSearchWithResetPage
+      }), {
+        "default": function _default() {
+          return [props.extraInSearch && extra];
+        }
+      }), (_slots$divide = slots.divide) === null || _slots$divide === void 0 ? void 0 : _slots$divide.call(slots), !props.extraInSearch && extra, slots["default"] ? slots["default"]() : createVNode(ProTable, omit(tableProps, "slots"), tableProps === null || tableProps === void 0 ? void 0 : tableProps.slots), (_slots$divide2 = slots.divide2) === null || _slots$divide2 === void 0 ? void 0 : _slots$divide2.call(slots), createVNode("div", {
+        "class": "pro-list-footer"
+      }, [(_slots$footerLeft = slots.footerLeft) === null || _slots$footerLeft === void 0 ? void 0 : _slots$footerLeft.call(slots), isNumber(paginationProps === null || paginationProps === void 0 ? void 0 : paginationProps.total) && paginationProps.total > 0 && createVNode(Fragment, null, [slots.pagination ? slots.pagination(pagination) : createVNode(ElPagination, pagination, null)]), (_slots$footerRight = slots.footerRight) === null || _slots$footerRight === void 0 ? void 0 : _slots$footerRight.call(slots)])]);
+    };
+  }
+});
 
+function _isSlot$1(s) {
+  return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
+}
+
+var proGridProps = function proGridProps() {
+  return {
     /**
-     * 是否disabled
+     * row属性
      */
-    disableState: {
-      type: Object
-    },
-    disableStateRules: {
-      type: Object
+    row: {
+      type: Object,
+      "default": undefined
     },
 
     /**
-     * 展示控件集合，readonly模式下使用这些组件渲染
+     * 公共col属性
      */
-    elementMap: {
+    col: {
       type: Object
     },
 
     /**
-     * provide传递
+     *
      */
-    provideExtra: {
-      type: Object
+    items: {
+      type: Array
     }
   };
 };
 
+var ProGrid = defineComponent({
+  props: _objectSpread2({}, proGridProps()),
+  setup: function setup(props) {
+    return function () {
+      var _slot;
+
+      return createVNode(ElRow, props.row, _isSlot$1(_slot = map(props.items, function (item) {
+        return createVNode(ElCol, mergeProps({
+          "key": item.rowKey
+        }, merge(props.col, item.col)), {
+          "default": function _default() {
+            return [item.vNode];
+          }
+        });
+      })) ? _slot : {
+        "default": function _default() {
+          return [_slot];
+        }
+      });
+    };
+  }
+});
+
+var proFormItemProps = function proFormItemProps() {
+  return {
+    name: {
+      type: [String, Array]
+    }
+  };
+};
+
+var ProFormItem = defineComponent({
+  props: _objectSpread2(_objectSpread2({}, ElFormItem.props), proFormItemProps()),
+  setup: function setup(props, _ref) {
+    var slots = _ref.slots;
+    var invalidKeys = keys(proFormItemProps());
+    return function () {
+      return createVNode(ElFormItem, mergeProps(omit.apply(void 0, [props].concat(_toConsumableArray(invalidKeys), ["name", "prop"])), {
+        "prop": props.prop || props.name
+      }), slots);
+    };
+  }
+});
 //emit;
 var ProForm = defineComponent({
-  props: _objectSpread2(_objectSpread2({}, ElForm.props), proFormProps()),
+  inheritAttrs: false,
+  props: _objectSpread2(_objectSpread2(_objectSpread2({}, ElForm.props), omit(ProForm$1.props, "model")), omit(ProGrid.props, "items")),
   setup: function setup(props, _ref2) {
     var slots = _ref2.slots,
         expose = _ref2.expose,
-        emit = _ref2.emit;
-    var form = ref();
-    var formState = props.model || reactive({}); //组件状态相关
-
+        emit = _ref2.emit,
+        attrs = _ref2.attrs;
+    var formRef = ref();
+    var formState = props.model || reactive({});
     var showState = props.showState || reactive({});
-    var readonlyState = props.readonlyState || reactive({});
-    var disableState = props.disableState || reactive({}); //formState改变情况下，更新 showState，readonlyState，disableState状态
-
-    useEffect(function () {
-      if (props.showStateRules) {
-        forEach(props.showStateRules, function (fn, key) {
-          showState[key] = fn(formState);
-        });
-      }
-
-      if (props.readonlyStateRules) {
-        forEach(props.readonlyStateRules, function (fn, key) {
-          readonlyState[key] = fn(formState);
-        });
-      }
-
-      if (props.disableStateRules) {
-        forEach(props.disableStateRules, function (fn, key) {
-          disableState[key] = fn(formState);
-        });
-      }
-    }, formState); //转换为ref对象
 
-    var readonly = computed(function () {
-      return props.readonly;
-    });
-    provideProForm(_objectSpread2({
-      formRef: form,
-      formState: formState,
-      showState: showState,
-      readonlyState: readonlyState,
-      disableState: disableState,
-      //
-      elementMap: props.elementMap,
-      //
-      readonly: readonly
-    }, props.provideExtra));
-
-    var formRef = function formRef(el) {
+    var handleRef = function handleRef(el) {
       var nexEl = _objectSpread2(_objectSpread2({}, el), {}, {
         submit: function submit() {
           var _el$validate;
@@ -247,259 +342,90 @@ var ProForm = defineComponent({
       });
 
       expose(nexEl);
-      form.value = nexEl;
+      formRef.value = nexEl;
     };
 
-    var invalidKeys = keys(proFormProps());
-    return function () {
-      return createVNode(ElForm, mergeProps({
-        "ref": formRef
-      }, omit.apply(void 0, [props].concat(_toConsumableArray(invalidKeys), ["model"])), {
-        "model": formState
-      }), slots);
-    };
-  }
-});
-
-var proSchemaFormProps = function proSchemaFormProps() {
-  return {
-    columns: {
-      type: Array
-    },
-
-    /**
-     * 录入控件集合，通过column->valueType 查找对应的录入组件
-     */
-    formElementMap: {
-      type: Object
-    },
-
-    /**
-     * 是否启用rules验证
-     */
-    needRules: {
-      type: Boolean,
-      "default": true
-    }
-  };
-};
-
-var ProSchemaForm = defineComponent({
-  name: "PSchemaForm",
-  props: _objectSpread2(_objectSpread2({}, ProForm.props), proSchemaFormProps()),
-  setup: function setup(props, _ref) {
-    var slots = _ref.slots,
-        expose = _ref.expose;
-    var formItemList = computed(function () {
-      if (!props.formElementMap || size(props.formElementMap) <= 0) {
-        return null;
-      }
-
-      return map(props.columns, function (item) {
-        return getFormItemEl(props.formElementMap, item, props.needRules);
-      });
-    });
-    var invalidKeys = keys(proSchemaFormProps());
+    var originKeys = keys(omit(ProForm$1.props, "model"));
     return function () {
       var _slots$default;
 
-      return createVNode(ProForm, mergeProps({
-        "ref": function ref(el) {
-          return expose(el);
-        }
-      }, omit(props, invalidKeys)), _objectSpread2({
+      return createVNode(ProForm$1, mergeProps(pick.apply(void 0, [props].concat(_toConsumableArray(originKeys), ["provideExtra"])), {
+        "model": formState,
+        "showState": showState,
+        "provideExtra": _objectSpread2({
+          formRef: formRef
+        }, props.provideExtra)
+      }), {
         "default": function _default() {
-          return [formItemList.value, (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)];
+          return [createVNode(ElForm, mergeProps({
+            "ref": handleRef
+          }, attrs, omit.apply(void 0, [props].concat(_toConsumableArray(originKeys), ["model"])), {
+            "model": formState
+          }), {
+            "default": function _default() {
+              return [props.formElementMap && size(props.columns) > 0 && createVNode(Fragment, null, [props.row ? createVNode(ProGrid, {
+                "row": props.row,
+                "col": props.col,
+                "items": map(props.columns, function (item) {
+                  var vNode = getFormItemEl(props.formElementMap, item, props.needRules);
+                  return {
+                    rowKey: getColumnFormItemName(item),
+                    vNode: vNode,
+                    col: get(item, ["extra", "col"])
+                  };
+                })
+              }, null) : createVNode(Fragment, null, [map(props.columns, function (item) {
+                return getFormItemEl(props.formElementMap, item, props.needRules);
+              })])]), (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)];
+            }
+          })];
         }
-      }, omit(slots, "default")));
+      });
     };
   }
 });
 
-var SearchMode;
-
-(function (SearchMode) {
-  SearchMode["AUTO"] = "AUTO";
-  SearchMode["MANUAL"] = "MANUAL";
-})(SearchMode || (SearchMode = {}));
-
-var proSearchFormProps = function proSearchFormProps() {
-  return {
-    /**
-     * 初始化触发 onFinish
-     */
-    initEmit: {
-      type: Boolean,
-      "default": true
-    },
-
-    /**
-     *  模式 自动触发或者手动触发 onFinish
-     */
-    searchMode: {
-      type: String,
-      "default": SearchMode.AUTO
-    },
-
-    /**
-     * 需要debounce处理的字段
-     */
-    debounceKeys: {
-      type: Array
-    },
-    debounceTime: {
-      type: Number,
-      "default": 800
-    },
-    //
+var ProSearchForm = defineComponent({
+  inheritAttrs: false,
+  props: _objectSpread2(_objectSpread2(_objectSpread2({}, omit(ProForm.props, "inline")), omit(ProSearchForm$1.props, "model", "columns")), {}, {
     inline: {
       type: Boolean,
       "default": true
     }
-  };
-};
-
-var ProSearchForm = defineComponent({
-  name: "PSearchForm",
-  props: _objectSpread2(_objectSpread2({}, omit(ProSchemaForm.props, "inline")), proSearchFormProps()),
+  }),
   setup: function setup(props, _ref) {
     var slots = _ref.slots,
-        emit = _ref.emit,
-        expose = _ref.expose;
+        attrs = _ref.attrs;
+    var formRef = ref();
     var formState = props.model || reactive({});
-
-    var handleFinish = function handleFinish() {
-      var values = toRaw(formState);
-      var showValues = getValidValues(values, props.showState, props.showStateRules);
-      emit("finish", showValues, values);
-    };
-
-    var debounceFinish = debounce(function () {
-      handleFinish();
-    }, props.debounceTime); //初始化
-
-    useEffect(function () {
-      if (props.initEmit) {
-        handleFinish();
-      }
-    }, []);
-
-    var isDebounceDataChange = function isDebounceDataChange(state, prevState, debounceKeys) {
-      return some(debounceKeys, function (key) {
-        return get(state, key) !== get(prevState, key);
-      });
-    }; //监听
-
-
-    useEffect(function (state, prevState) {
-      if (props.searchMode !== SearchMode.AUTO) {
-        return;
-      } //如果改变的值中包括debounceKeys中注册的 延时触发
-
-
-      if (props.debounceKeys && size(props.debounceKeys) > 0 && isDebounceDataChange(state, prevState, props.debounceKeys)) {
-        debounceFinish();
-        return;
-      }
-
-      handleFinish();
-    }, function () {
-      return clone(formState);
-    });
-    var invalidKeys = keys(proSearchFormProps());
+    var originKeys = keys(omit(ProSearchForm$1.props, "model", "columns"));
     return function () {
-      return createVNode(ProSchemaForm, mergeProps({
-        "ref": function ref(el) {
-          return expose(el);
-        },
-        "inline": props.inline
-      }, omit.apply(void 0, [props].concat(_toConsumableArray(invalidKeys), ["model"])), {
-        "needRules": false,
-        "model": formState
-      }), slots);
+      return createVNode(Fragment, null, [createVNode(ProForm, mergeProps({
+        "ref": formRef
+      }, attrs, omit.apply(void 0, [props].concat(_toConsumableArray(originKeys), ["needRules", "model"])), {
+        "model": formState,
+        "needRules": false
+      }), slots), createVNode(ProSearchForm$1, mergeProps(pick(props, originKeys), {
+        "model": formState,
+        "columns": props.columns,
+        "onFinish": function onFinish() {
+          var _formRef$value;
+
+          (_formRef$value = formRef.value) === null || _formRef$value === void 0 ? void 0 : _formRef$value.submit();
+        }
+      }), null)]);
     };
   }
 });
 
-var proFormItemProps = function proFormItemProps() {
+var createFormItemComponent = createFormItemCompFn(ProFormItem, function (value, setValue, disabled) {
   return {
-    readonly: {
-      type: Boolean,
-      "default": undefined
-    },
-    fieldProps: {
-      type: Object
-    },
-    showProps: {
-      type: Object
-    }
+    modelValue: value,
+    "onUpdate:modelValue": setValue,
+    clearable: true,
+    disabled: disabled
   };
-};
-
-var createFormItemComponent = function createFormItemComponent(_ref) {
-  var InputComp = _ref.InputComp,
-      valueType = _ref.valueType,
-      name = _ref.name;
-  return defineComponent({
-    name: name,
-    props: _objectSpread2(_objectSpread2({}, ProFormItem.props), proFormItemProps()),
-    setup: function setup(props, _ref2) {
-      var slots = _ref2.slots;
-
-      var _useProForm = useProForm(),
-          formState = _useProForm.formState,
-          showState = _useProForm.showState,
-          readonlyState = _useProForm.readonlyState,
-          disableState = _useProForm.disableState,
-          formReadonly = _useProForm.readonly,
-          elementMap = _useProForm.elementMap;
-
-      var formListCtx = useProFormList(); //优先级 props.readonly > readonlyState > formContext.readonly
-
-      var readonly = computed(function () {
-        if (isBoolean(props.readonly)) {
-          return props.readonly;
-        } else if (isBoolean(readonlyState[props.name])) {
-          return readonlyState[props.name];
-        }
-
-        return formReadonly.value;
-      });
-      var nameList = convertPathToList(props.name);
-      var path = formListCtx !== null && formListCtx !== void 0 && formListCtx.pathList ? [].concat(_toConsumableArray(formListCtx.pathList), _toConsumableArray(nameList)) : nameList;
-      var invalidKeys = keys(proFormItemProps());
-      return function () {
-        var show = get(showState, props.name);
-
-        if (isBoolean(show) && !show) {
-          return null;
-        }
-
-        var value = get(formState, path); //valueType对应的展示组件
-
-        var ShowComp = get(elementMap, valueType);
-        return createVNode(ProFormItem, mergeProps(omit.apply(void 0, [props].concat(_toConsumableArray(invalidKeys), ["name"])), {
-          "name": path
-        }), {
-          "default": function _default() {
-            return [readonly.value ? createVNode(Fragment, null, [ShowComp ? createVNode(ShowComp, mergeProps({
-              "value": value
-            }, props.fieldProps, {
-              "showProps": props.showProps
-            }), slots) : createVNode("span", null, [value])]) : createVNode(InputComp, mergeProps({
-              "modelValue": value,
-              "onUpdate:modelValue": function onUpdateModelValue(v) {
-                set(formState, path, v);
-              },
-              "clearable": true,
-              "disabled": get(disableState, props.name)
-            }, props.fieldProps), slots)];
-          }
-        });
-      };
-    }
-  });
-};
+});
 
 var proSelectProps = function proSelectProps() {
   return {
@@ -608,25 +534,6 @@ var ProSubmitButton = defineComponent({
   }
 });
 
-var FormListProvider = defineComponent({
-  props: {
-    pathList: {
-      type: Array
-    }
-  },
-  setup: function setup(props, _ref) {
-    var slots = _ref.slots;
-    provideProFormList({
-      pathList: props.pathList
-    });
-    return function () {
-      var _slots$default;
-
-      return (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
-    };
-  }
-});
-
 var proFormListProps = function proFormListProps() {
   return {
     addButtonText: {
@@ -636,10 +543,12 @@ var proFormListProps = function proFormListProps() {
     addButtonProps: {
       type: Object
     },
-    //每行默认id
-    rowKey: {
+    minusButtonText: {
       type: String,
-      "default": "id"
+      "default": "删除"
+    },
+    minusButtonProps: {
+      type: Object
     }
   };
 };
@@ -647,352 +556,39 @@ var proFormListProps = function proFormListProps() {
 var ProFormList = defineComponent({
   name: "PFormList",
   props: _objectSpread2(_objectSpread2({}, ProFormItem.props), proFormListProps()),
-  setup: function setup(props, _ref2) {
-    var slots = _ref2.slots;
-
-    var _useProForm = useProForm(),
-        formState = _useProForm.formState,
-        readonly = _useProForm.readonly;
-
-    var formListCtx = useProFormList();
-    var nameList = convertPathToList(props.prop);
-    var path = formListCtx !== null && formListCtx !== void 0 && formListCtx.pathList ? [].concat(_toConsumableArray(formListCtx.pathList), _toConsumableArray(nameList)) : nameList;
-
-    var handleAdd = function handleAdd() {
-      var targetList = get(formState, path);
-
-      if (!isArray(targetList)) {
-        targetList = [];
-      }
-
-      targetList.push(_defineProperty({}, props.rowKey, new Date().valueOf()));
-      set(formState, path, targetList);
-    };
-
-    var handleRemove = function handleRemove(index) {
-      var targetList = get(formState, path);
-
-      if (size(targetList) <= 0) {
-        return;
-      }
-
-      targetList.splice(index, 1);
-    };
-
+  setup: function setup(props, _ref) {
+    var slots = _ref.slots;
+    var originKeys = keys(ProFormList$1.props);
     var invalidKeys = keys(proFormListProps());
     return function () {
-      return createVNode(ProFormItem, omit(props, invalidKeys), {
+      return createVNode(ProFormItem, mergeProps(omit.apply(void 0, [props].concat(_toConsumableArray(originKeys), _toConsumableArray(invalidKeys))), {
+        "name": props.name
+      }), {
         "default": function _default() {
-          return [map(get(formState, path), function (item, index) {
-            var _slots$default2;
-
-            return createVNode(FormListProvider, {
-              "key": index,
-              "pathList": [].concat(_toConsumableArray(path), [index])
-            }, {
-              "default": function _default() {
-                return [createVNode("div", {
-                  "class": "pro-form-list-item"
-                }, [(_slots$default2 = slots["default"]) === null || _slots$default2 === void 0 ? void 0 : _slots$default2.call(slots), !readonly.value && createVNode("div", {
-                  "class": "pro-form-list-item-minus",
-                  "onClick": function onClick() {
-                    return handleRemove(index);
-                  }
-                }, [slots.minus ? slots.minus() : createVNode(ElButton, {
-                  "link": true
-                }, {
-                  "default": function _default() {
-                    return [createTextVNode("\u5220\u9664")];
-                  }
-                })])])];
-              }
-            });
-          }), !readonly.value && createVNode("div", {
-            "class": "pro-form-list-item-add",
-            "onClick": handleAdd
-          }, [slots.add ? slots.add() : createVNode(ElButton, mergeProps({
-            "type": "primary"
-          }, props.addButtonProps), {
-            "default": function _default() {
-              return [props.addButtonText];
-            }
-          })])];
-        }
-      });
-    };
-  }
-});
-
-var proTableProps = function proTableProps() {
-  return {
-    //操作栏
-    operate: {
-      type: Object
-    },
-    //默认空字符串
-    columnEmptyText: {
-      type: String
-    },
-
-    /**
-     * 公共column，会merge到columns item中
-     */
-    column: {
-      type: Object
-    },
-    //
-    columns: {
-      type: Array
-    },
-
-    /**
-     * 展示控件集合，readonly模式下使用这些组件渲染
-     */
-    elementMap: {
-      type: Object
-    },
-
-    /**
-     * loading
-     */
-    loading: {
-      type: Boolean,
-      "default": false
-    }
-  };
-};
-
-var ProTable = defineComponent({
-  props: _objectSpread2(_objectSpread2({}, ElTable.props), proTableProps()),
-  setup: function setup(props, _ref) {
-    var slots = _ref.slots,
-        expose = _ref.expose;
-    var columns = computed(function () {
-      //根据valueType选择对应的展示组件
-      var columns = map(props.columns, function (item) {
-        //merge从共item
-        var nextItem = merge(props.column, item);
-
-        if (!item.customRender || !item.formatter) {
-          nextItem.customRender = function (_ref2) {
-            var text = _ref2.text;
-            return getItemEl(props.elementMap, _objectSpread2(_objectSpread2({}, item), {}, {
-              showProps: _objectSpread2(_objectSpread2({}, item.showProps), {}, {
-                content: props.columnEmptyText
-              })
-            }), text) || text || props.columnEmptyText;
-          };
-        }
-
-        return nextItem;
-      });
-      var operate = props.operate; //处理operate
-
-      if (operate && size(operate.items) > 0) {
-        //将itemState补充的信息拼到item中
-        var completeItems = map(operate.items, function (i) {
-          return _objectSpread2(_objectSpread2({}, i), get(operate.itemState, i.value));
-        }); //排序
-
-        var operateList = sortBy(completeItems, function (item) {
-          return item.sort;
-        });
-        columns.push(_objectSpread2(_objectSpread2({
-          title: "操作",
-          valueType: "option",
-          fixed: "right"
-        }, props.column), {}, {
-          customRender: function customRender(_ref3) {
-            var record = _ref3.record;
-            var validList = filter(operateList, function (item) {
-              if (isFunction(item.show)) {
-                return item.show(record);
-              }
-
-              if (item.show === false) {
-                return false;
-              }
-
-              return true;
-            });
-            return createVNode("div", {
-              "class": "pro-table-operate"
-            }, [map(validList, function (item) {
-              // 自定义
-              if (isFunction(item.element)) {
-                return item.element(record, item);
-              }
-
-              return createVNode(ElButton, {
-                "key": item.value,
-                "type": "primary",
-                "link": true,
-                "disabled": isFunction(item.disabled) ? item.disabled(record) : item.disabled,
-                "onClick": function onClick() {
-                  var _item$onClick;
-
-                  (_item$onClick = item.onClick) === null || _item$onClick === void 0 ? void 0 : _item$onClick.call(item, record);
+          return [createVNode(ProFormList$1, mergeProps(pick(props, originKeys), {
+            "name": props.name
+          }), _objectSpread2({
+            itemMinus: function itemMinus() {
+              return createVNode(ElButton, mergeProps({
+                "link": true
+              }, props.minusButtonProps), {
+                "default": function _default() {
+                  return [props.minusButtonText];
                 }
-              }, {
+              });
+            },
+            add: function add() {
+              return createVNode(ElButton, mergeProps({
+                "type": "primary"
+              }, props.addButtonProps), {
                 "default": function _default() {
-                  return [item.label];
+                  return [props.addButtonText];
                 }
               });
-            })]);
-          }
-        }, operate.column));
-      }
-
-      return columns;
-    });
-    var invalidKeys = keys(proTableProps());
-    return function () {
-      var _slots$default;
-
-      return withDirectives(createVNode(ElTable, mergeProps({
-        "ref": function ref(el) {
-          expose(el);
-        }
-      }, omit(props, invalidKeys)), _objectSpread2({
-        "default": function _default() {
-          return [map(columns.value, function (item) {
-            var formatter = function formatter(record, column, value, index) {
-              if (item.formatter) {
-                return item.formatter(record, column, value, index);
-              }
-
-              if (item.customRender) {
-                return item.customRender({
-                  value: value,
-                  text: value,
-                  record: record,
-                  column: column
-                });
-              }
-
-              return null;
-            };
-
-            return createVNode(ElTableColumn, mergeProps({
-              "key": item.dataIndex || item.prop
-            }, omit(item, "title", "label", "renderHeader", "prop", "dataIndex", "formatter", "customRender"), {
-              "label": isVNode(item.title) ? undefined : item.title || item.label,
-              "renderHeader": isVNode(item.title) ? function () {
-                return item.title;
-              } : undefined,
-              "prop": item.dataIndex || item.prop,
-              "formatter": item.formatter || item.customRender ? formatter : undefined
-            }), null);
-          }), (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)];
-        }
-      }, omit(slots, "default"))), [[resolveDirective("loading"), props.loading]]);
-    };
-  }
-});
-
-var defaultPage = {
-  page: 1,
-  pageSize: 10
-};
-
-var proListProps = function proListProps() {
-  return {
-    /**
-     * extra 是否放到SearchForm中
-     */
-    extraInSearch: {
-      type: Boolean,
-      "default": undefined
-    },
-    //search
-    searchProps: {
-      type: Object
-    },
-    //table
-    tableProps: {
-      type: Object
-    },
-    //pagination
-    paginationProps: {
-      type: Object
-    },
-    //pageState
-    pageState: {
-      type: Object
-    }
-  };
-};
-
-var ProList = defineComponent({
-  props: _objectSpread2({}, proListProps()),
-  setup: function setup(props, _ref) {
-    var _props$searchProps;
-
-    var slots = _ref.slots,
-        emit = _ref.emit;
-
-    /******************* search pagination ********************/
-    var searchState = ((_props$searchProps = props.searchProps) === null || _props$searchProps === void 0 ? void 0 : _props$searchProps.model) || reactive({});
-    var pageState = props.pageState || reactive(_objectSpread2({}, defaultPage));
-
-    var handleSearch = function handleSearch() {
-      emit("list", _objectSpread2(_objectSpread2({}, searchState), pageState));
-    }; //页数重置1 且搜索
-
-
-    var executeSearchWithResetPage = function executeSearchWithResetPage() {
-      pageState.page = 1;
-      handleSearch();
-    }; //无SearchForm组件 初始化 触发
-
-
-    useEffect(function () {
-      var _props$searchProps2, _props$searchProps3;
-
-      if (size((_props$searchProps2 = props.searchProps) === null || _props$searchProps2 === void 0 ? void 0 : _props$searchProps2.columns) <= 0 && ((_props$searchProps3 = props.searchProps) === null || _props$searchProps3 === void 0 ? void 0 : _props$searchProps3.initEmit) !== false) {
-        handleSearch();
-      }
-    }, []); //无SearchForm组件 订阅searchState
-
-    useWatch(function () {
-      var _props$searchProps4;
-
-      if (size((_props$searchProps4 = props.searchProps) === null || _props$searchProps4 === void 0 ? void 0 : _props$searchProps4.columns) <= 0) {
-        executeSearchWithResetPage();
-      }
-    }, searchState);
-    return function () {
-      var _slots$divide, _slots$divide2;
-
-      var searchProps = props.searchProps;
-      var tableProps = props.tableProps;
-      var paginationProps = props.paginationProps; //操作按钮
-
-      var extra = slots.extra ? createVNode("div", {
-        "class": "pro-list-search"
-      }, [slots.extra()]) : null; //分页参数
-
-      var pagination = _objectSpread2(_objectSpread2({}, paginationProps), {}, {
-        currentPage: pageState.page,
-        pageSize: pageState.pageSize,
-        onSizeChange: function onSizeChange(pageSize) {
-          pageState.pageSize = pageSize;
-          handleSearch();
-        },
-        onCurrentChange: function onCurrentChange(current) {
-          pageState.page = current;
-          handleSearch();
+            }
+          }, slots))];
         }
       });
-
-      return createVNode(Fragment, null, [size(searchProps === null || searchProps === void 0 ? void 0 : searchProps.columns) > 0 && createVNode(ProSearchForm, mergeProps(searchProps, {
-        "model": searchState,
-        "onFinish": executeSearchWithResetPage
-      }), {
-        "default": function _default() {
-          return [props.extraInSearch && extra];
-        }
-      }), (_slots$divide = slots.divide) === null || _slots$divide === void 0 ? void 0 : _slots$divide.call(slots), (size(searchProps === null || searchProps === void 0 ? void 0 : searchProps.columns) <= 0 || !props.extraInSearch) && extra, slots["default"] ? slots["default"]() : createVNode(ProTable, omit(tableProps, "slots"), tableProps === null || tableProps === void 0 ? void 0 : tableProps.slots), (_slots$divide2 = slots.divide2) === null || _slots$divide2 === void 0 ? void 0 : _slots$divide2.call(slots), isNumber(paginationProps === null || paginationProps === void 0 ? void 0 : paginationProps.total) && paginationProps.total > 0 && createVNode(Fragment, null, [slots.pagination ? slots.pagination(pagination) : createVNode(ElPagination, pagination, null)])]);
     };
   }
 });
@@ -1114,7 +710,7 @@ var proCurdFormProps = function proCurdFormProps() {
 };
 
 var ProCurdForm = defineComponent({
-  props: _objectSpread2(_objectSpread2({}, ProSchemaForm.props), proCurdFormProps()),
+  props: _objectSpread2(_objectSpread2({}, ProForm.props), proCurdFormProps()),
   setup: function setup(props, _ref4) {
     var slots = _ref4.slots;
 
@@ -1132,14 +728,14 @@ var ProCurdForm = defineComponent({
         //edit
         sendCurdEvent({
           action: CurdAction.EDIT,
-          type: "execute",
+          type: CurdSubAction.EXECUTE,
           values: values
         });
       } else {
         //add
         sendCurdEvent({
           action: CurdAction.ADD,
-          type: "execute",
+          type: CurdSubAction.EXECUTE,
           values: values
         });
       }
@@ -1148,11 +744,10 @@ var ProCurdForm = defineComponent({
     return function () {
       var _slots$default;
 
-      return createVNode(ProSchemaForm, mergeProps({
-        "elementMap": elementMap,
-        "formElementMap": formElementMap
-      }, props, {
-        "columns": formColumns,
+      return createVNode(ProForm, mergeProps(omit(props, "elementMap", "formElementMap"), {
+        "elementMap": props.elementMap || elementMap,
+        "formElementMap": props.formElementMap || formElementMap,
+        "columns": formColumns.value,
         "model": curdState.detailData,
         "readonly": curdState.mode === CurdCurrentMode.DETAIL,
         "hideRequiredAsterisk": curdState.mode === CurdCurrentMode.DETAIL,
@@ -1171,7 +766,7 @@ var ProCurdFormConnect = defineComponent({
         formProps = _useProCurd5.formProps;
 
     return function () {
-      return createVNode(ProCurdForm, omit(formProps, "slots"), get(formProps, "slots"));
+      return createVNode(ProCurdForm, omit(formProps === null || formProps === void 0 ? void 0 : formProps.value, "slots"), get(formProps === null || formProps === void 0 ? void 0 : formProps.value, "slots"));
     };
   }
 });
@@ -1199,7 +794,21 @@ var ProCurdList = defineComponent({
 
 
     var prepareTableItem = function prepareTableItem(action) {
-      return _objectSpread2(_objectSpread2({}, pick(getOperate(action), "label", "element", "show", "disabled", "onClick", "sort")), {}, {
+      var item = getOperate(action);
+      return _objectSpread2(_objectSpread2({}, pick(item, "label", "element", "disabled", "sort")), {}, {
+        show: !isUndefined(item === null || item === void 0 ? void 0 : item.show) ? item === null || item === void 0 ? void 0 : item.show : false,
+        onClick: function onClick(record) {
+          if (item !== null && item !== void 0 && item.onClick) {
+            item.onClick(record);
+            return;
+          }
+
+          sendCurdEvent({
+            action: action,
+            type: CurdSubAction.EMIT,
+            record: record
+          });
+        },
         value: action
       });
     }; //table操作栏 items
@@ -1207,14 +816,14 @@ var ProCurdList = defineComponent({
 
     var tableOperateItems = [prepareTableItem(CurdAction.DETAIL), prepareTableItem(CurdAction.EDIT), prepareTableItem(CurdAction.DELETE)];
     return function () {
-      var _tableProps$operate, _tableProps$operate2, _curdState$listData, _curdState$listData2;
+      var _curdState$listData, _curdState$listData2;
 
       var tableProps = props.tableProps;
       return createVNode(ProList, mergeProps({
         "onList": function onList(values) {
           sendCurdEvent({
             action: CurdAction.LIST,
-            type: "emit",
+            type: CurdSubAction.EMIT,
             values: values
           });
         }
@@ -1227,8 +836,32 @@ var ProCurdList = defineComponent({
         "tableProps": _objectSpread2(_objectSpread2({
           elementMap: elementMap
         }, tableProps), {}, {
-          operate: _objectSpread2(_objectSpread2({}, tableProps === null || tableProps === void 0 ? void 0 : tableProps.operate), {}, {
-            items: tableProps !== null && tableProps !== void 0 && (_tableProps$operate = tableProps.operate) !== null && _tableProps$operate !== void 0 && _tableProps$operate.items ? [].concat(tableOperateItems, _toConsumableArray(tableProps === null || tableProps === void 0 ? void 0 : (_tableProps$operate2 = tableProps.operate) === null || _tableProps$operate2 === void 0 ? void 0 : _tableProps$operate2.items)) : tableOperateItems
+          operate: mergeWith({
+            items: tableOperateItems
+          }, tableProps === null || tableProps === void 0 ? void 0 : tableProps.operate, function (objValue, srcValue) {
+            if (isArray(objValue)) {
+              if (isArray(srcValue)) {
+                //合并
+                return concat(objValue, map(srcValue, function (item) {
+                  var nextItem = _objectSpread2({}, item);
+
+                  if (!item.onClick) {
+                    nextItem.onClick = function (record) {
+                      sendCurdEvent({
+                        action: CurdAction.LIST,
+                        type: "operate-".concat(item.value),
+                        record: record
+                      });
+                    };
+                  }
+
+                  return nextItem;
+                }));
+              } else {
+                //使用curd默认
+                return objValue;
+              }
+            }
           }),
           columns: tableColumns.value,
           loading: curdState.listLoading,
@@ -1247,7 +880,7 @@ var ProCurdListConnect = defineComponent({
         listProps = _useProCurd2.listProps;
 
     return function () {
-      return createVNode(ProCurdList, omit(listProps, "slots"), get(listProps, "slots"));
+      return createVNode(ProCurdList, omit(listProps === null || listProps === void 0 ? void 0 : listProps.value, "slots"), get(listProps === null || listProps === void 0 ? void 0 : listProps.value, "slots"));
     };
   }
 });
@@ -1298,9 +931,66 @@ var ProCurdDescConnect = defineComponent({
         descProps = _useProCurd2.descProps;
 
     return function () {
-      return createVNode(ProCurdList, omit(descProps, "slots"), get(descProps, "slots"));
+      return createVNode(ProCurdList, omit(descProps === null || descProps === void 0 ? void 0 : descProps.value, "slots"), get(descProps === null || descProps === void 0 ? void 0 : descProps.value, "slots"));
+    };
+  }
+});
+
+var ProCurdModal = defineComponent({
+  props: _objectSpread2({}, ElDialog.props),
+  setup: function setup(props, _ref) {
+    var slots = _ref.slots;
+
+    var _useProCurd = useProCurd(),
+        curdState = _useProCurd.curdState,
+        getOperate = _useProCurd.getOperate; //根据当前模式展示不同的Title
+
+
+    var getTitle = function getTitle() {
+      var _getOperate, _getOperate2, _getOperate3;
+
+      switch (curdState.mode) {
+        case CurdAction.ADD:
+          return (_getOperate = getOperate(CurdAction.ADD)) === null || _getOperate === void 0 ? void 0 : _getOperate.label;
+
+        case CurdAction.EDIT:
+          return (_getOperate2 = getOperate(CurdAction.EDIT)) === null || _getOperate2 === void 0 ? void 0 : _getOperate2.label;
+
+        case CurdAction.DETAIL:
+          return (_getOperate3 = getOperate(CurdAction.DETAIL)) === null || _getOperate3 === void 0 ? void 0 : _getOperate3.label;
+      }
+    };
+
+    var handleCancel = function handleCancel() {
+      curdState.mode = undefined;
+      setReactiveValue(curdState.detailData, {});
+      curdState.detailLoading = false;
+      curdState.addAction = undefined;
+    };
+
+    return function () {
+      return createVNode(ElDialog, mergeProps({
+        "destroyOnClose": true,
+        "title": getTitle(),
+        "modelValue": !!curdState.mode,
+        "onClose": handleCancel
+      }, props), slots);
+    };
+  }
+});
+var ProCurdModalConnect = defineComponent({
+  setup: function setup() {
+    var _useProCurd2 = useProCurd(),
+        modalProps = _useProCurd2.modalProps;
+
+    return function () {
+      return createVNode(ProCurdModal, omit(modalProps === null || modalProps === void 0 ? void 0 : modalProps.value, "slots"), _objectSpread2({
+        "default": function _default() {
+          return [createVNode(ProCurdFormConnect, null, null)];
+        }
+      }, get(modalProps === null || modalProps === void 0 ? void 0 : modalProps.value, "slots")));
     };
   }
 });
 
-export { ContinueAddButton, OkButton, ProCurdDesc, ProCurdDescConnect, ProCurdForm, ProCurdFormConnect, ProCurdList, ProCurdListConnect, ProForm, ProFormCascader, ProFormCheckbox, ProFormDatePicker, ProFormItem, ProFormList, ProFormRadio, ProFormSelect, ProFormSwitch, ProFormText, ProFormTextNumber, ProFormTimePicker, ProFormTreeSelect, ProList, ProOperateButton, ProSchemaForm, ProSearchForm, ProSelect, ProSubmitButton, ProTable, SearchMode, createFormItemComponent, defaultPage, provideProForm, provideProFormList, useProForm, useProFormList };
+export { ContinueAddButton, OkButton, ProCurdDesc, ProCurdDescConnect, ProCurdForm, ProCurdFormConnect, ProCurdList, ProCurdListConnect, ProCurdModal, ProCurdModalConnect, ProForm, ProFormCascader, ProFormCheckbox, ProFormDatePicker, ProFormItem, ProFormList, ProFormRadio, ProFormSelect, ProFormSwitch, ProFormText, ProFormTextNumber, ProFormTimePicker, ProFormTreeSelect, ProGrid, ProList, ProOperateButton, ProSearchForm, ProSelect, ProSubmitButton, ProTable, createFormItemComponent, defaultPage };