@vue-start/pro 0.1.0 → 0.3.1

package/dist/index.js

@@ -7,42 +7,123 @@ var lodash = require('lodash');
 var rxjs = require('rxjs');
 var hooks = require('@vue-start/hooks');
 var request = require('@vue-start/request');
+var vueRouter = require('vue-router');
 
-const createUseRequestActor = filterFun => (actors, callback) => {
-  const {
-    requestSubject$
-  } = request.useRequestProvide();
-  const nameSet = new Set(lodash.map(actors, actor => lodash.isString(actor) ? actor : actor.name));
-  hooks.useEffect(() => {
-    const sub = requestSubject$.pipe(rxjs.filter(filterFun), rxjs.tap(actor => {
-      if (nameSet.has(actor.name)) {
-        callback(actor);
-      }
-    })).subscribe();
-    return () => {
-      sub.unsubscribe();
-    };
-  }, []);
+function ownKeys(object, enumerableOnly) {
+  var keys = Object.keys(object);
+
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    enumerableOnly && (symbols = symbols.filter(function (sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    })), keys.push.apply(keys, symbols);
+  }
+
+  return keys;
+}
+
+function _objectSpread2(target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = null != arguments[i] ? arguments[i] : {};
+    i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
+      _defineProperty(target, key, source[key]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
+      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+    });
+  }
+
+  return target;
+}
+
+function _defineProperty(obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+
+  return obj;
+}
+
+function _toConsumableArray(arr) {
+  return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
+}
+
+function _arrayWithoutHoles(arr) {
+  if (Array.isArray(arr)) return _arrayLikeToArray(arr);
+}
+
+function _iterableToArray(iter) {
+  if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
+}
+
+function _unsupportedIterableToArray(o, minLen) {
+  if (!o) return;
+  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor) n = o.constructor.name;
+  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+
+function _arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length) len = arr.length;
+
+  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+
+  return arr2;
+}
+
+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.");
+}
+
+var createUseRequestActor = function createUseRequestActor(filterFun) {
+  return function (actors, callback) {
+    var _useRequestProvide = request.useRequestProvide(),
+        requestSubject$ = _useRequestProvide.requestSubject$;
+
+    var nameSet = new Set(lodash.map(actors, function (actor) {
+      return lodash.isString(actor) ? actor : actor.name;
+    }));
+    hooks.useEffect(function () {
+      var sub = requestSubject$.pipe(rxjs.filter(filterFun), rxjs.tap(function (actor) {
+        if (nameSet.has(actor.name)) {
+          callback(actor);
+        }
+      })).subscribe();
+      return function () {
+        sub.unsubscribe();
+      };
+    }, []);
+  };
 };
 
-const useDoneRequestActor = createUseRequestActor(request.isDoneRequestActor);
-const useFailedRequestActor = createUseRequestActor(request.isFailedRequestActor);
-const useComposeRequestActor = (actors, options, cancelWhileUnmount) => {
-  const {
-    requestSubject$,
-    dispatchRequest
-  } = request.useRequestProvide();
-  const nameSet = new Set(lodash.map(actors, actor => lodash.isString(actor) ? actor : actor.name));
-  const lastRequestActors = {};
-  hooks.useEffect(() => {
-    const sub = rxjs.merge(requestSubject$.pipe(rxjs.filter(request.isPreRequestActor), rxjs.tap(actor => {
+var useDoneRequestActor = createUseRequestActor(request.isDoneRequestActor);
+var useFailedRequestActor = createUseRequestActor(request.isFailedRequestActor);
+var useComposeRequestActor = function useComposeRequestActor(actors, options, cancelWhileUnmount) {
+  var _useRequestProvide2 = request.useRequestProvide(),
+      requestSubject$ = _useRequestProvide2.requestSubject$,
+      dispatchRequest = _useRequestProvide2.dispatchRequest;
+
+  var nameSet = new Set(lodash.map(actors, function (actor) {
+    return lodash.isString(actor) ? actor : actor.name;
+  }));
+  var lastRequestActors = {};
+  hooks.useEffect(function () {
+    var sub = rxjs.merge(requestSubject$.pipe(rxjs.filter(request.isPreRequestActor), rxjs.tap(function (actor) {
       if (nameSet.has(actor.name)) {
         var _options$onStart;
 
         (_options$onStart = options.onStart) === null || _options$onStart === void 0 ? void 0 : _options$onStart.call(options, actor);
         lastRequestActors[actor.name] = actor;
       }
-    })), requestSubject$.pipe(rxjs.filter(request.isDoneRequestActor), rxjs.tap(actor => {
+    })), requestSubject$.pipe(rxjs.filter(request.isDoneRequestActor), rxjs.tap(function (actor) {
       if (nameSet.has(actor.name)) {
         var _options$onSuccess, _options$onFinish;
 
@@ -50,7 +131,7 @@ const useComposeRequestActor = (actors, options, cancelWhileUnmount) => {
         (_options$onFinish = options.onFinish) === null || _options$onFinish === void 0 ? void 0 : _options$onFinish.call(options, actor);
         lastRequestActors[actor.name] = undefined;
       }
-    })), requestSubject$.pipe(rxjs.filter(request.isFailedRequestActor), rxjs.tap(actor => {
+    })), requestSubject$.pipe(rxjs.filter(request.isFailedRequestActor), rxjs.tap(function (actor) {
       if (nameSet.has(actor.name)) {
         var _options$onFailed, _options$onFinish2;
 
@@ -59,197 +140,273 @@ const useComposeRequestActor = (actors, options, cancelWhileUnmount) => {
         lastRequestActors[actor.name] = undefined;
       }
     }))).subscribe();
-    return () => {
+    return function () {
       sub.unsubscribe();
 
       if (cancelWhileUnmount) {
         //组件销毁的时候cancel请求
-        lodash.forEach(lastRequestActors, actor => {
-          actor && dispatchRequest({ ...actor,
+        lodash.forEach(lastRequestActors, function (actor) {
+          actor && dispatchRequest(_objectSpread2(_objectSpread2({}, actor), {}, {
             stage: "CANCEL"
-          });
+          }));
         });
       }
     };
   }, []);
 };
 
-/**
- * 获取Column的valueType，默认"text"
- * @param column
+/**
+ * 剔除showState或showStateRules规则为!true的值
+ * @param values
+ * @param showState
+ * @param showStateRules
  */
+var getValidValues = function getValidValues(values, showState, showStateRules) {
+  if (showState) {
+    var invalidKeys = lodash.filter(lodash.keys(showState), function (key) {
+      return !showState[key];
+    });
+    return lodash.omit(values, invalidKeys);
+  }
+
+  if (showStateRules) {
+    var _invalidKeys = lodash.filter(lodash.keys(showStateRules), function (key) {
+      return !showStateRules[key](values);
+    });
+
+    return lodash.omit(values, _invalidKeys);
+  }
+
+  return values;
+};
+/**
+ * string类型的path转为arr
+ * @param path
+ */
+
+var convertPathToList = function convertPathToList(path) {
+  if (!path) {
+    return undefined;
+  }
+
+  if (lodash.isArray(path)) {
+    return path;
+  }
+
+  if (path && lodash.isString(path) && path.indexOf(".") > 0) {
+    return lodash.split(path, ".");
+  }
+
+  return [path];
+};
+/**
+ * 唯一id
+ */
+
+var generateId = function generateId() {
+  return Number(Math.random().toString().substr(3, 3) + Date.now()).toString(36);
+};
+/**
+ * 将listState 中的数据通过id merge到 list item中
+ * ps：数组会替换
+ * @param list
+ * @param listState
+ * @param id
+ */
+
+var mergeStateToList = function mergeStateToList(list, listState, id) {
+  if (!listState || !id) {
+    return list;
+  }
+
+  return lodash.map(list, function (item) {
+    var idName = lodash.isFunction(id) ? id(item) : id; //如果listState中有值，merge处理
 
-const getColumnValueType = column => {
+    var stateData = lodash.get(listState, idName);
+
+    if (!stateData || lodash.isEmpty(stateData) || lodash.isFunction(stateData) || !lodash.isObject(stateData)) {
+      return item;
+    } //只有是对象（键值对）才合并
+
+
+    return lodash.mergeWith(item, stateData, function (objValue, srcValue) {
+      //如果是数组，替换
+      if (lodash.isArray(objValue) || lodash.isArray(srcValue)) {
+        return srcValue;
+      }
+    });
+  });
+};
+
+/**
+ * 获取Column的valueType，默认"text"
+ * @param column
+ */
+
+var getColumnValueType = function getColumnValueType(column) {
   return column.formValueType || column.valueType || "text";
 };
-/**
- *获取Column的FormItem name
- * @param column
+/**
+ *获取Column的FormItem name
+ * @param column
  */
 
-const getColumnFormItemName = column => {
+var getColumnFormItemName = function getColumnFormItemName(column) {
   var _column$formItemProps;
 
   return ((_column$formItemProps = column.formItemProps) === null || _column$formItemProps === void 0 ? void 0 : _column$formItemProps.name) || column.dataIndex;
 };
-/**
- * 根据Column生成FormItem VNode
- * formFieldProps中的slots参数会以v-slots的形式传递到FormItem的录入组件（子组件）中
- * @param formElementMap
- * @param column
- * @param needRules
+/**
+ * 根据Column生成FormItem VNode
+ * formFieldProps中的slots参数会以v-slots的形式传递到FormItem的录入组件（子组件）中
+ * @param formElementMap
+ * @param column
+ * @param needRules
  */
 
-const getFormItemEl = (formElementMap, column, needRules = true) => {
+var getFormItemEl = function getFormItemEl(formElementMap, column) {
   var _column$formFieldProp;
 
-  const valueType = getColumnValueType(column);
-  const Comp = lodash.get(formElementMap, valueType);
+  var needRules = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+  var valueType = getColumnValueType(column);
+  var Comp = lodash.get(formElementMap, valueType);
 
   if (!Comp) {
     return null;
   }
 
-  const name = getColumnFormItemName(column);
-  const itemProps = needRules ? column.formItemProps : lodash.omit(column.formItemProps, "rules");
-  return vue.h(Comp, {
+  var name = getColumnFormItemName(column);
+  var itemProps = needRules ? column.formItemProps : lodash.omit(column.formItemProps, "rules");
+  return vue.h(Comp, _objectSpread2(_objectSpread2({
     key: name,
-    name,
-    label: column.title,
-    ...itemProps,
+    name: name,
+    label: column.title
+  }, itemProps), {}, {
     fieldProps: lodash.omit(column.formFieldProps, "slots"),
     showProps: column.showProps
-  }, (_column$formFieldProp = column.formFieldProps) === null || _column$formFieldProp === void 0 ? void 0 : _column$formFieldProp.slots);
+  }), (_column$formFieldProp = column.formFieldProps) === null || _column$formFieldProp === void 0 ? void 0 : _column$formFieldProp.slots);
 };
-/**
- *  根据Column生成Item VNode
- * @param elementMap
- * @param column
- * @param value
+/**
+ *  根据Column生成Item VNode
+ * @param elementMap
+ * @param column
+ * @param value
  */
 
-const getItemEl = (elementMap, column, value) => {
+var getItemEl = function getItemEl(elementMap, column, value) {
   var _column$formFieldProp2;
 
-  const valueType = column.valueType || "text";
-  const Comp = lodash.get(elementMap, valueType);
+  var valueType = column.valueType || "text";
+  var Comp = lodash.get(elementMap, valueType);
 
   if (!Comp) {
     return null;
   }
 
-  return vue.h(Comp, { ...lodash.omit(column.formFieldProps, "slots"),
+  return vue.h(Comp, _objectSpread2(_objectSpread2({}, lodash.omit(column.formFieldProps, "slots")), {}, {
     showProps: column.showProps,
-    value
-  }, (_column$formFieldProp2 = column.formFieldProps) === null || _column$formFieldProp2 === void 0 ? void 0 : _column$formFieldProp2.slots);
+    value: value
+  }), (_column$formFieldProp2 = column.formFieldProps) === null || _column$formFieldProp2 === void 0 ? void 0 : _column$formFieldProp2.slots);
+};
+var ProModuleKey = Symbol("pro-module");
+var useProModule = function useProModule() {
+  return vue.inject(ProModuleKey);
 };
-const ProModuleKey = Symbol("pro-module");
-const useProModule = () => vue.inject(ProModuleKey);
-const provideProModule = ctx => {
+var provideProModule = function provideProModule(ctx) {
   vue.provide(ProModuleKey, ctx);
 };
-const RequestAction = {
+var RequestAction = {
   Success: "request-success$",
   Fail: "request-fail$"
 };
 
-const proModuleProps = () => ({
-  /**
-   * module状态
-   */
-  state: {
-    type: Object
-  },
+var proModuleProps = function proModuleProps() {
+  return {
+    /**
+     * module状态
+     */
+    state: {
+      type: Object
+    },
 
-  /**
-   * 配置（静态）
-   */
-  columns: {
-    type: Array
-  },
+    /**
+     * 配置（静态）
+     */
+    columns: {
+      type: Array
+    },
 
-  /**
-   * 配置（动态）
-   * columns动态属性兼容
-   */
-  columnState: {
-    type: Object
-  },
+    /**
+     * 配置（动态）
+     * columns动态属性兼容
+     */
+    columnState: {
+      type: Object
+    },
 
-  /**
-   * 展示组件集
-   */
-  elementMap: {
-    type: Object
-  },
+    /**
+     * 展示组件集
+     */
+    elementMap: {
+      type: Object
+    },
 
-  /**
-   * 录入组件集
-   */
-  formElementMap: {
-    type: Object
-  },
+    /**
+     * 录入组件集
+     */
+    formElementMap: {
+      type: Object
+    },
 
-  /**
-   * requests
-   */
-  requests: {
-    type: Array
-  }
-});
+    /**
+     * requests
+     */
+    requests: {
+      type: Array
+    }
+  };
+};
 
-const ProModule = vue.defineComponent({
-  props: { ...proModuleProps()
-  },
-  setup: (props, {
-    slots
-  }) => {
-    /**
-     * columns columnState 合并
-     */
-    const columns = vue.computed(() => {
-      return lodash.map(props.columns, item => {
-        //如果columnState中有值，merge处理
-        const mapData = lodash.get(props.columnState, getColumnFormItemName(item));
-
-        if (lodash.isObject(mapData) && !lodash.isEmpty(mapData) && !lodash.isArray(mapData) && !lodash.isFunction(mapData)) {
-          //合并
-          return lodash.mergeWith(item, mapData, (objValue, srcValue) => {
-            //如果是数组，替换
-            if (lodash.isArray(objValue) || lodash.isArray(srcValue)) {
-              return srcValue;
-            }
-          });
-        }
+var ProModule = vue.defineComponent({
+  props: _objectSpread2({}, proModuleProps()),
+  setup: function setup(props, _ref) {
+    var slots = _ref.slots,
+        expose = _ref.expose;
 
-        return item;
+    /**
+     * columns columnState 合并
+     */
+    var columns = vue.computed(function () {
+      return mergeStateToList(props.columns, props.columnState, function (item) {
+        return getColumnFormItemName(item);
       });
     });
     /*********************************** 渲染组件 ***************************************/
     // 获取FormItem VNode
 
-    const getFormItemVNode = (column, needRules = true) => {
+    var getFormItemVNode = function getFormItemVNode(column) {
+      var needRules = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
       return getFormItemEl(props.formElementMap, column, needRules);
     }; // 获取Item VNode
 
 
-    const getItemVNode = (column, value) => {
+    var getItemVNode = function getItemVNode(column, value) {
       return getItemEl(props.elementMap, column, value);
     };
     /*********************************** 事件处理 ***************************************/
 
 
-    const subject$ = new rxjs.Subject(); //发送Module事件
+    var subject$ = new rxjs.Subject(); //发送Module事件
 
-    const sendEvent = action => {
+    var sendEvent = function sendEvent(action) {
       subject$.next(action);
     };
     /*********************************** 页面状态 ***************************************/
 
 
-    const state = props.state || vue.reactive({});
+    var state = props.state || vue.reactive({});
 
-    const dispatch = action => {
+    var dispatch = function dispatch(action) {
       //如果要更新的属性值是 object ，执行覆盖操作
       if (lodash.isObject(state[action.type])) {
         hooks.setReactiveValue(state[action.type], action.payload);
@@ -261,27 +418,33 @@ const ProModule = vue.defineComponent({
     /*********************************** request ***************************************/
 
 
-    const {
-      dispatchRequest
-    } = request.useRequestProvide();
-    const requestMap = lodash.reduce(props.requests, (pair, item) => ({ ...pair,
-      [item.actor.name]: item
-    }), {});
-    const actionMap = lodash.reduce(props.requests, (pair, item) => ({ ...pair,
-      [item.action]: item
-    }), {}); //发送请求
+    var _useRequestProvide = request.useRequestProvide(),
+        dispatchRequest = _useRequestProvide.dispatchRequest;
+
+    var requestMap = lodash.reduce(props.requests, function (pair, item) {
+      var _item$actor;
 
-    const sendRequest = (requestNameOrAction, ...params) => {
-      const requestOpts = lodash.get(requestMap, requestNameOrAction) || lodash.get(actionMap, requestNameOrAction);
+      return _objectSpread2(_objectSpread2({}, pair), {}, _defineProperty({}, (_item$actor = item.actor) === null || _item$actor === void 0 ? void 0 : _item$actor.name, item));
+    }, {});
+    var actionMap = lodash.reduce(props.requests, function (pair, item) {
+      return _objectSpread2(_objectSpread2({}, pair), {}, _defineProperty({}, item.action, item));
+    }, {}); //发送请求
+
+    var sendRequest = function sendRequest(requestNameOrAction) {
+      var requestOpts = lodash.get(requestMap, requestNameOrAction) || lodash.get(actionMap, requestNameOrAction);
 
       if (!requestOpts) {
         return;
       }
 
-      let nextParams;
+      var nextParams;
+
+      for (var _len = arguments.length, params = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+        params[_key - 1] = arguments[_key];
+      }
 
       if (requestOpts.convertParams) {
-        nextParams = requestOpts.convertParams(...params);
+        nextParams = requestOpts.convertParams.apply(requestOpts, params);
       } else {
         nextParams = lodash.get(params, 0);
       }
@@ -290,9 +453,9 @@ const ProModule = vue.defineComponent({
     };
 
     useComposeRequestActor(lodash.keys(requestMap), {
-      onStart: actor => {
+      onStart: function onStart(actor) {
         //如果设置了loading，将请求状态维护到state中
-        const loadingName = lodash.get(requestMap, [actor.name, "loadingName"]);
+        var loadingName = lodash.get(requestMap, [actor.name, "loadingName"]);
 
         if (loadingName) {
           dispatch({
@@ -301,15 +464,15 @@ const ProModule = vue.defineComponent({
           });
         }
       },
-      onSuccess: actor => {
+      onSuccess: function onSuccess(actor) {
         var _requestOpts$onSucces;
 
-        const requestOpts = lodash.get(requestMap, actor.name); //如果设置了stateName，将结果维护到state中
+        var requestOpts = lodash.get(requestMap, actor.name); //如果设置了stateName，将结果维护到state中
 
         if (requestOpts !== null && requestOpts !== void 0 && requestOpts.stateName) {
           var _actor$res;
 
-          const data = requestOpts.convertData ? requestOpts.convertData(actor) : (_actor$res = actor.res) === null || _actor$res === void 0 ? void 0 : _actor$res.data;
+          var data = requestOpts.convertData ? requestOpts.convertData(actor) : (_actor$res = actor.res) === null || _actor$res === void 0 ? void 0 : _actor$res.data;
           dispatch({
             type: requestOpts.stateName,
             payload: data
@@ -320,28 +483,30 @@ const ProModule = vue.defineComponent({
         sendEvent({
           type: RequestAction.Success,
           payload: {
-            actor
+            actor: actor,
+            requestOpts: requestOpts
           }
         }); //回调事件
 
         (_requestOpts$onSucces = requestOpts.onSuccess) === null || _requestOpts$onSucces === void 0 ? void 0 : _requestOpts$onSucces.call(requestOpts, actor);
       },
-      onFailed: actor => {
+      onFailed: function onFailed(actor) {
         var _requestOpts$onFailed;
 
-        const requestOpts = lodash.get(requestMap, actor.name); //发送失败事件
+        var requestOpts = lodash.get(requestMap, actor.name); //发送失败事件
 
         sendEvent({
           type: RequestAction.Fail,
           payload: {
-            actor
+            actor: actor,
+            requestOpts: requestOpts
           }
         }); //回调事件
 
         (_requestOpts$onFailed = requestOpts.onFailed) === null || _requestOpts$onFailed === void 0 ? void 0 : _requestOpts$onFailed.call(requestOpts, actor);
       },
-      onFinish: actor => {
-        const loadingName = lodash.get(requestMap, [actor.name, "loadingName"]);
+      onFinish: function onFinish(actor) {
+        var loadingName = lodash.get(requestMap, [actor.name, "loadingName"]);
 
         if (loadingName) {
           dispatch({
@@ -352,53 +517,61 @@ const ProModule = vue.defineComponent({
       }
     }, true);
     provideProModule({
-      columns,
-      getFormItemVNode,
-      getItemVNode,
+      columns: columns,
+      getFormItemVNode: getFormItemVNode,
+      getItemVNode: getItemVNode,
       elementMap: props.elementMap,
       formElementMap: props.formElementMap,
       //
-      subject$,
-      sendEvent,
+      subject$: subject$,
+      sendEvent: sendEvent,
       //
-      state,
-      dispatch,
+      state: state,
+      dispatch: dispatch,
       //
       requests: props.requests,
-      sendRequest
+      sendRequest: sendRequest
+    });
+    expose({
+      sendEvent: sendEvent,
+      sendRequest: sendRequest
     });
-    return () => {
+    return function () {
       var _slots$default;
 
-      return (_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
+      return (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
     };
   }
 });
 
 //订阅module事件
-const useModuleEvent = cb => {
-  const {
-    subject$
-  } = useProModule();
-  hooks.useEffect(() => {
-    const sub = subject$.subscribe({
-      next: action => {
+var useModuleEvent = function useModuleEvent(cb) {
+  var _useProModule = useProModule(),
+      subject$ = _useProModule.subject$;
+
+  hooks.useEffect(function () {
+    var sub = subject$.subscribe({
+      next: function next(action) {
         cb(action);
       }
     });
-    return () => {
+    return function () {
       return sub.unsubscribe();
     };
   }, []);
 };
 
-const ProCurdKey = Symbol("pro-curd");
-const useProCurd = () => vue.inject(ProCurdKey);
-const provideProCurd = ctx => vue.provide(ProCurdKey, ctx);
+var ProCurdKey = Symbol("pro-curd");
+var useProCurd = function useProCurd() {
+  return vue.inject(ProCurdKey);
+};
+var provideProCurd = function provideProCurd(ctx) {
+  return vue.provide(ProCurdKey, ctx);
+};
 /************************************ 常量 *************************************/
 
 /**
- * curd 5种action
+ * curd 5种Action
  */
 
 exports.CurdAction = void 0;
@@ -411,6 +584,19 @@ exports.CurdAction = void 0;
   CurdAction["DELETE"] = "DELETE";
 })(exports.CurdAction || (exports.CurdAction = {}));
 
+/**
+ * 5种Action 的子事件
+ */
+exports.CurdSubAction = void 0;
+
+(function (CurdSubAction) {
+  CurdSubAction["EMIT"] = "EMIT";
+  CurdSubAction["EXECUTE"] = "EXECUTE";
+  CurdSubAction["PAGE"] = "PAGE";
+  CurdSubAction["SUCCESS"] = "SUCCESS";
+  CurdSubAction["FAIL"] = "FAIL";
+})(exports.CurdSubAction || (exports.CurdSubAction = {}));
+
 /**
  * curd 操作模式
  */
@@ -432,124 +618,138 @@ exports.CurdAddAction = void 0;
   CurdAddAction["CONTINUE"] = "CONTINUE";
 })(exports.CurdAddAction || (exports.CurdAddAction = {}));
 
-const proCurdProps = () => ({
-  /**
-   * 列表 或 详情 的唯一标识
-   */
-  rowKey: {
-    type: String,
-    default: "id"
-  },
+var defaultPage = {
+  page: 1,
+  pageSize: 10
+};
 
-  /**
-   * operates
-   */
-  operates: {
-    type: Array
-  },
+var proCurdProps = function proCurdProps() {
+  return {
+    /**
+     * 列表 或 详情 的唯一标识
+     */
+    rowKey: {
+      type: String,
+      "default": "id"
+    },
 
-  /************************* 子组件props *******************************/
-  listProps: {
-    type: Object
-  },
-  formProps: {
-    type: Object
-  },
-  descProps: {
-    type: Object
-  },
-  modalProps: {
-    type: Object
-  }
-});
+    /**
+     * operates
+     */
+    operates: {
+      type: Array
+    },
+
+    /************************* 子组件props *******************************/
+    listProps: {
+      type: Object
+    },
+    formProps: {
+      type: Object
+    },
+    descProps: {
+      type: Object
+    },
+    modalProps: {
+      type: Object
+    }
+  };
+};
 
-const Curd = vue.defineComponent({
-  props: { ...proCurdProps()
-  },
-  setup: (props, {
-    slots
-  }) => {
-    const {
-      columns,
-      state,
-      sendEvent,
-      sendRequest
-    } = useProModule();
+var Curd = vue.defineComponent({
+  props: _objectSpread2({}, proCurdProps()),
+  setup: function setup(props, _ref) {
+    var slots = _ref.slots,
+        expose = _ref.expose;
+
+    var _ref2 = useProModule(),
+        columns = _ref2.columns,
+        state = _ref2.state,
+        sendEvent = _ref2.sendEvent,
+        sendRequest = _ref2.sendRequest;
     /**
      * 排序
      * @param list
      * @param propName
      */
 
-    const dealSort = (list, propName) => {
-      return lodash.sortBy(list, item => lodash.get(item, propName));
+
+    var dealSort = function dealSort(list, propName) {
+      return lodash.sortBy(list, function (item) {
+        return lodash.get(item, propName);
+      });
     };
     /**
      * 非 hideInForm columns
      */
 
 
-    const formColumns = vue.computed(() => {
-      return dealSort(lodash.filter(columns.value, item => !item.hideInForm), "formSort");
+    var formColumns = vue.computed(function () {
+      return dealSort(lodash.filter(columns.value, function (item) {
+        return !item.hideInForm;
+      }), "formSort");
     });
     /**
      * 非 hideInDetail columns
      */
 
-    const descColumns = vue.computed(() => {
-      return dealSort(lodash.filter(columns.value, item => !item.hideInDetail), "descSort");
+    var descColumns = vue.computed(function () {
+      return dealSort(lodash.filter(columns.value, function (item) {
+        return !item.hideInDetail;
+      }), "descSort");
     });
     /**
      *  非 hideInTable columns
      */
 
-    const tableColumns = vue.computed(() => {
-      return dealSort(lodash.filter(columns.value, item => !item.hideInTable), "tableSort");
+    var tableColumns = vue.computed(function () {
+      return dealSort(lodash.filter(columns.value, function (item) {
+        return !item.hideInTable;
+      }), "tableSort");
     });
     /**
      * search columns
      */
 
-    const searchColumns = vue.computed(() => {
-      return dealSort(lodash.filter(columns.value, item => !!item.search), "searchSort");
+    var searchColumns = vue.computed(function () {
+      return dealSort(lodash.filter(columns.value, function (item) {
+        return !!item.search;
+      }), "searchSort");
     });
     /******************************** 逻辑 *************************************/
     //上一次发起列表请求的参数
 
-    let prevListParams; //刷新列表
+    var prevListParams; //刷新列表
 
-    const handleSearch = extra => {
-      sendRequest(exports.CurdAction.LIST, { ...prevListParams,
-        ...extra
-      });
+    var handleSearch = function handleSearch(extra) {
+      sendRequest(exports.CurdAction.LIST, _objectSpread2(_objectSpread2({}, prevListParams), extra));
     }; //发送事件
 
 
-    const sendCurdEvent = event => {
+    var sendCurdEvent = function sendCurdEvent(event) {
       sendEvent({
         type: event.action,
-        payload: lodash.omit(event, "action")
+        payload: lodash.omit(event, "action", "source"),
+        source: event.source
       });
     }; //事件订阅
 
 
-    useModuleEvent(event => {
-      if (event.type === RequestAction.Success) {
-        return;
-      } else if (event.type === RequestAction.Fail) {
+    useModuleEvent(function (event) {
+      //如果当前event存在source 不处理
+      if (event.source) {
         return;
       }
 
-      const action = event.type;
-      const {
-        type,
-        values,
-        record
-      } = event.payload;
+      var action = event.type;
+      var _ref3 = event.payload,
+          type = _ref3.type,
+          values = _ref3.values,
+          record = _ref3.record;
 
       switch (action) {
         case exports.CurdAction.LIST:
-          if (type === "emit") {
+          if (type === exports.CurdSubAction.EMIT) {
             prevListParams = values;
             handleSearch();
           }
@@ -557,187 +757,1198 @@ const Curd = vue.defineComponent({
           return;
 
         case exports.CurdAction.ADD:
-          if (type === "execute") {
+          if (type === exports.CurdSubAction.EXECUTE) {
             sendRequest(exports.CurdAction.ADD, values, state.detailData);
           }
 
           return;
 
         case exports.CurdAction.EDIT:
-          if (type === "execute") {
+          if (type === exports.CurdSubAction.EXECUTE) {
             sendRequest(exports.CurdAction.EDIT, values, state.detailData);
           }
 
           return;
 
         case exports.CurdAction.DELETE:
-          if (type === "emit") {
+          if (type === exports.CurdSubAction.EMIT) {
             sendRequest(exports.CurdAction.DELETE, record, props.rowKey);
           }
 
           return;
       }
     });
-    const operateMap = lodash.reduce(props.operates, (pair, item) => ({ ...pair,
-      [item.action]: item
-    }), {}); //根据Action获取ICurdOperateOpts
+    var operateMap = lodash.reduce(props.operates, function (pair, item) {
+      return _objectSpread2(_objectSpread2({}, pair), {}, _defineProperty({}, item.action, item));
+    }, {}); //根据Action获取ICurdOperateOpts
 
-    const getOperate = action => {
+    var getOperate = function getOperate(action) {
       return lodash.get(operateMap, action);
     };
 
+    var listProps = vue.computed(function () {
+      return props.listProps;
+    });
+    var formProps = vue.computed(function () {
+      return props.formProps;
+    });
+    var descProps = vue.computed(function () {
+      return props.descProps;
+    });
+    var modalProps = vue.computed(function () {
+      return props.modalProps;
+    });
     provideProCurd({
       rowKey: props.rowKey,
       curdState: state,
-      formColumns,
-      descColumns,
-      tableColumns,
-      searchColumns,
+      formColumns: formColumns,
+      descColumns: descColumns,
+      tableColumns: tableColumns,
+      searchColumns: searchColumns,
+      //
+      sendCurdEvent: sendCurdEvent,
       //
-      sendCurdEvent,
+      getOperate: getOperate,
       //
-      getOperate,
+      refreshList: handleSearch,
       //
-      listProps: props.listProps,
-      formProps: props.formProps,
-      descProps: props.descProps,
-      modalProps: props.modalProps
+      listProps: listProps,
+      formProps: formProps,
+      descProps: descProps,
+      modalProps: modalProps
     });
-    return () => {
+    expose({
+      sendCurdEvent: sendCurdEvent,
+      getOperate: getOperate,
+      refreshList: handleSearch
+    });
+    return function () {
       var _slots$default;
 
-      return (_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
+      return (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
     };
   }
 });
-const ProCurd = vue.defineComponent({
-  props: { ...ProModule.props,
-    ...Curd.props
-  },
-  setup: (props, {
-    slots
-  }) => {
-    const curdState = props.curdState || vue.reactive({
+var ProCurd = vue.defineComponent({
+  props: _objectSpread2(_objectSpread2(_objectSpread2({}, lodash.omit(ProModule.props, "state", "requests")), Curd.props), {}, {
+    curdState: {
+      type: Object
+    }
+  }),
+  setup: function setup(props, _ref4) {
+    var _curdOperateOpts;
+
+    var slots = _ref4.slots,
+        expose = _ref4.expose;
+    var moduleRef = vue.ref();
+    var curdRef = vue.ref();
+    var curdState = props.curdState || vue.reactive({
       detailData: {}
     });
     /****************** 请求处理 **********************/
     //curd默认网络属性
 
-    const curdOperateOpts = {
-      [exports.CurdAction.LIST]: {
-        convertParams: values => values,
-        convertData: actor => {
-          var _actor$res;
+    var curdOperateOpts = (_curdOperateOpts = {}, _defineProperty(_curdOperateOpts, exports.CurdAction.LIST, {
+      convertParams: function convertParams(values) {
+        return values;
+      },
+      convertData: function convertData(actor) {
+        var _actor$res;
 
-          return (_actor$res = actor.res) === null || _actor$res === void 0 ? void 0 : _actor$res.data;
-        },
-        loadingName: "listLoading",
-        stateName: "listData"
+        return (_actor$res = actor.res) === null || _actor$res === void 0 ? void 0 : _actor$res.data;
       },
-      [exports.CurdAction.DETAIL]: {
-        convertParams: (record, rowKey) => lodash.pick(record, rowKey),
-        convertData: actor => {
-          var _actor$res2;
-
-          return (_actor$res2 = actor.res) === null || _actor$res2 === void 0 ? void 0 : _actor$res2.data;
-        },
-        loadingName: "detailLoading",
-        stateName: "detailData",
-        label: "详情"
+      loadingName: "listLoading",
+      stateName: "listData"
+    }), _defineProperty(_curdOperateOpts, exports.CurdAction.DETAIL, {
+      convertParams: function convertParams(record, rowKey) {
+        return lodash.pick(record, rowKey);
       },
-      [exports.CurdAction.ADD]: {
-        convertParams: (values, record) => ({
-          body: { ...record,
-            ...values
-          }
-        }),
-        loadingName: "operateLoading",
-        label: "添加"
+      convertData: function convertData(actor) {
+        var _actor$res2;
+
+        return (_actor$res2 = actor.res) === null || _actor$res2 === void 0 ? void 0 : _actor$res2.data;
       },
-      [exports.CurdAction.EDIT]: {
-        convertParams: (values, record) => ({
-          body: { ...record,
-            ...values
-          }
-        }),
-        loadingName: "operateLoading",
-        label: "编辑"
+      loadingName: "detailLoading",
+      stateName: "detailData",
+      label: "详情"
+    }), _defineProperty(_curdOperateOpts, exports.CurdAction.ADD, {
+      convertParams: function convertParams(values, record) {
+        return {
+          body: _objectSpread2(_objectSpread2({}, record), values)
+        };
       },
-      [exports.CurdAction.DELETE]: {
-        convertParams: (values, record) => ({
-          body: { ...record,
-            ...values
-          }
-        }),
-        label: "删除"
+      loadingName: "operateLoading",
+      label: "添加"
+    }), _defineProperty(_curdOperateOpts, exports.CurdAction.EDIT, {
+      convertParams: function convertParams(values, record) {
+        return {
+          body: _objectSpread2(_objectSpread2({}, record), values)
+        };
+      },
+      loadingName: "operateLoading",
+      label: "编辑"
+    }), _defineProperty(_curdOperateOpts, exports.CurdAction.DELETE, {
+      convertParams: function convertParams(record, rowKey) {
+        return lodash.pick(record, rowKey);
+      },
+      label: "删除"
+    }), _curdOperateOpts);
+    /****************************** columns分类 *************************************/
+
+    var requests = lodash.map(props.operates, function (item) {
+      var curdOpts = lodash.get(curdOperateOpts, item.action);
+      return _objectSpread2(_objectSpread2({}, curdOpts), item);
+    });
+    var moduleKeys = lodash.keys(lodash.omit(ProModule.props, "state", "requests"));
+    expose({
+      moduleRef: moduleRef,
+      curdRef: curdRef
+    });
+    return function () {
+      return vue.createVNode(ProModule, vue.mergeProps({
+        "ref": moduleRef
+      }, lodash.pick(props, moduleKeys), {
+        "state": curdState,
+        "requests": requests
+      }), {
+        "default": function _default() {
+          return [vue.createVNode(Curd, vue.mergeProps({
+            "ref": curdRef
+          }, lodash.omit.apply(void 0, [props].concat(_toConsumableArray(moduleKeys), ["curdState", "operates"])), {
+            "operates": requests
+          }), slots)];
+        }
+      });
+    };
+  }
+});
+
+var modalCurdProps = function modalCurdProps() {
+  return {
+    defaultAddRecord: {
+      type: Object
+    }
+  };
+};
+
+/**
+ * 事件处理
+ */
+var ModalCurd = vue.defineComponent({
+  props: _objectSpread2({}, modalCurdProps()),
+  setup: function setup(props) {
+    var _listProps$value;
+
+    var _useProModule = useProModule(),
+        dispatch = _useProModule.dispatch,
+        sendRequest = _useProModule.sendRequest;
+
+    var _useProCurd = useProCurd(),
+        rowKey = _useProCurd.rowKey,
+        curdState = _useProCurd.curdState,
+        listProps = _useProCurd.listProps,
+        getOperate = _useProCurd.getOperate,
+        refreshList = _useProCurd.refreshList;
+
+    var pageState = (listProps === null || listProps === void 0 ? void 0 : (_listProps$value = listProps.value) === null || _listProps$value === void 0 ? void 0 : _listProps$value.pageState) || vue.reactive(_objectSpread2({}, defaultPage)); //发送详情接口
+
+    var sendDetailRequest = function sendDetailRequest(record) {
+      var operateOpts = getOperate(exports.CurdAction.DETAIL);
+
+      if (operateOpts !== null && operateOpts !== void 0 && operateOpts.actor) {
+        //如果注册了详情接口 发起请求
+        sendRequest(exports.CurdAction.DETAIL, record, rowKey);
+      } else {
+        //直接使用当前record作为详情数据
+        dispatch({
+          type: "detailData",
+          payload: record
+        });
       }
     };
-    const requests = lodash.map(props.operates, item => {
-      const curdOpts = lodash.get(curdOperateOpts, item.action);
-      return { ...curdOpts,
-        ...item
-      };
+
+    var dealDetail = function dealDetail(subAction, _ref) {
+      var record = _ref.record;
+
+      if (subAction === exports.CurdSubAction.EMIT) {
+        dispatch({
+          type: "mode",
+          payload: exports.CurdCurrentMode.DETAIL
+        });
+        sendDetailRequest(record);
+      }
+    };
+
+    var dealAdd = function dealAdd(subAction) {
+      if (subAction === exports.CurdSubAction.EMIT) {
+        dispatch({
+          type: "mode",
+          payload: exports.CurdCurrentMode.ADD
+        });
+        dispatch({
+          type: "detailData",
+          payload: props.defaultAddRecord || {}
+        });
+      } else if (subAction === exports.CurdSubAction.SUCCESS) {
+        //添加成功
+        pageState.page = 1; //重置当前页数
+        //刷新List
+
+        refreshList({
+          page: 1
+        });
+
+        if (curdState.addAction === exports.CurdAddAction.CONTINUE) {
+          dispatch({
+            type: "detailData",
+            payload: props.defaultAddRecord || {}
+          });
+        } else {
+          dispatch({
+            type: "mode",
+            payload: undefined
+          });
+        }
+      }
+    };
+
+    var dealEdit = function dealEdit(subAction, _ref2) {
+      var record = _ref2.record;
+
+      if (subAction === exports.CurdSubAction.EMIT) {
+        dispatch({
+          type: "mode",
+          payload: exports.CurdCurrentMode.EDIT
+        });
+        sendDetailRequest(record);
+      } else if (subAction === exports.CurdSubAction.SUCCESS) {
+        // 编辑成功
+        dispatch({
+          type: "mode",
+          payload: undefined
+        }); //刷新列表
+
+        refreshList();
+      }
+    };
+
+    var dealDelete = function dealDelete(subAction) {
+      if (subAction === exports.CurdSubAction.SUCCESS) {
+        //刷新列表
+        refreshList();
+      }
+    };
+
+    useModuleEvent(function (_ref3) {
+      var type = _ref3.type,
+          payload = _ref3.payload,
+          source = _ref3.source;
+
+      if (source) {
+        return;
+      }
+
+      var action = type;
+      var subAction = payload === null || payload === void 0 ? void 0 : payload.type;
+      var record = payload === null || payload === void 0 ? void 0 : payload.record;
+
+      if (action === RequestAction.Success) {
+        //覆盖
+        action = lodash.get(payload, ["requestOpts", "action"]);
+        subAction = exports.CurdSubAction.SUCCESS;
+      }
+
+      switch (action) {
+        case exports.CurdAction.DETAIL:
+          dealDetail(subAction, {
+            record: record
+          });
+          break;
+
+        case exports.CurdAction.ADD:
+          dealAdd(subAction);
+          break;
+
+        case exports.CurdAction.EDIT:
+          dealEdit(subAction, {
+            record: record
+          });
+          break;
+
+        case exports.CurdAction.DELETE:
+          dealDelete(subAction);
+          break;
+      }
     });
-    const moduleKeys = lodash.keys(ProModule.props);
-    return () => {
-      return vue.h(ProModule, { ...lodash.pick(props, moduleKeys),
-        state: curdState,
-        requests
-      }, vue.h(Curd, { ...lodash.omit(props, ...moduleKeys, "curdState")
-      }, slots));
+    return function () {
+      return null;
     };
   }
 });
+var ProModalCurd = vue.defineComponent({
+  props: _objectSpread2(_objectSpread2({}, ProCurd.props), ModalCurd.props),
+  setup: function setup(props, _ref4) {
+    var slots = _ref4.slots;
+    var invalidKeys = lodash.keys(ModalCurd.props);
+    return function () {
+      var _slots$default;
 
-/**
- * 剔除showState或showStateRules规则为!true的值
- * @param values
- * @param showState
- * @param showStateRules
- */
-const getValidValues = (values, showState, showStateRules) => {
-  if (showState) {
-    const invalidKeys = lodash.filter(lodash.keys(showState), key => !showState[key]);
-    return lodash.omit(values, invalidKeys);
+      return vue.createVNode(ProCurd, lodash.omit(props, invalidKeys), {
+        "default": function _default() {
+          return [vue.createVNode(ModalCurd, lodash.pick(props, invalidKeys), null), (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)];
+        }
+      });
+    };
   }
+});
 
-  if (showStateRules) {
-    const invalidKeys = lodash.filter(lodash.keys(showStateRules), key => !showStateRules[key](values));
-    return lodash.omit(values, invalidKeys);
+var pageCurdProps = function pageCurdProps() {
+  return {
+    defaultAddRecord: {
+      type: Object
+    },
+    routeBack: {
+      type: Function
+    }
+  };
+};
+
+var PageCurd = vue.defineComponent({
+  props: _objectSpread2({}, pageCurdProps()),
+  setup: function setup(props) {
+    var router = vueRouter.useRouter();
+    var route = vueRouter.useRoute();
+
+    var _useProModule = useProModule(),
+        dispatch = _useProModule.dispatch,
+        sendRequest = _useProModule.sendRequest;
+
+    var _useProCurd = useProCurd(),
+        rowKey = _useProCurd.rowKey,
+        curdState = _useProCurd.curdState;
+
+    var dealList = function dealList(subAction) {
+      if (subAction === exports.CurdSubAction.PAGE) {
+        //其实就是个重置过程
+        dispatch({
+          type: "mode",
+          payload: undefined
+        });
+        dispatch({
+          type: "detailData",
+          payload: {}
+        });
+        dispatch({
+          type: "detailLoading",
+          payload: false
+        });
+        dispatch({
+          type: "addAction",
+          payload: undefined
+        });
+      }
+    };
+
+    var dealDetail = function dealDetail(subAction, _ref) {
+      var record = _ref.record;
+
+      if (subAction === exports.CurdSubAction.EMIT) {
+        router.push({
+          path: "".concat(route.path, "/detail"),
+          query: lodash.pick(record, rowKey)
+        });
+      } else if (subAction === exports.CurdSubAction.PAGE) {
+        dispatch({
+          type: "mode",
+          payload: exports.CurdCurrentMode.DETAIL
+        });
+        sendRequest(exports.CurdAction.DETAIL, route.query, rowKey);
+      }
+    };
+
+    var dealAdd = function dealAdd(subAction) {
+      if (subAction === exports.CurdSubAction.EMIT) {
+        router.push({
+          path: "".concat(route.path, "/add")
+        });
+      } else if (subAction === exports.CurdSubAction.PAGE) {
+        dispatch({
+          type: "mode",
+          payload: exports.CurdCurrentMode.ADD
+        });
+        dispatch({
+          type: "detailData",
+          payload: props.defaultAddRecord || {}
+        });
+      } else if (subAction === exports.CurdSubAction.SUCCESS) {
+        if (curdState.addAction === exports.CurdAddAction.CONTINUE) {
+          dispatch({
+            type: "detailData",
+            payload: props.defaultAddRecord || {}
+          });
+        } else {
+          props.routeBack ? props.routeBack(exports.CurdAction.ADD) : router.go(-1);
+        }
+      }
+    };
+
+    var dealEdit = function dealEdit(subAction, _ref2) {
+      var record = _ref2.record;
+
+      if (subAction === exports.CurdSubAction.EMIT) {
+        router.push({
+          path: "".concat(route.path, "/edit"),
+          query: lodash.pick(record, rowKey)
+        });
+      } else if (subAction === exports.CurdSubAction.PAGE) {
+        dispatch({
+          type: "mode",
+          payload: exports.CurdCurrentMode.EDIT
+        });
+        sendRequest(exports.CurdAction.DETAIL, route.query, rowKey);
+      } else if (subAction === exports.CurdSubAction.SUCCESS) {
+        props.routeBack ? props.routeBack(exports.CurdAction.EDIT) : router.go(-1);
+      }
+    };
+
+    useModuleEvent(function (_ref3) {
+      var type = _ref3.type,
+          payload = _ref3.payload,
+          source = _ref3.source;
+
+      if (source) {
+        return;
+      }
+
+      var action = type;
+      var subAction = payload === null || payload === void 0 ? void 0 : payload.type;
+      var record = payload === null || payload === void 0 ? void 0 : payload.record;
+
+      if (action === RequestAction.Success) {
+        //覆盖
+        action = lodash.get(payload, ["requestOpts", "action"]);
+        subAction = exports.CurdSubAction.SUCCESS;
+      }
+
+      switch (action) {
+        case exports.CurdAction.LIST:
+          dealList(subAction);
+          break;
+
+        case exports.CurdAction.DETAIL:
+          dealDetail(subAction, {
+            record: record
+          });
+          break;
+
+        case exports.CurdAction.ADD:
+          dealAdd(subAction);
+          break;
+
+        case exports.CurdAction.EDIT:
+          dealEdit(subAction, {
+            record: record
+          });
+          break;
+      }
+    });
+    return function () {
+      return null;
+    };
   }
+});
+var ProPageCurd = vue.defineComponent({
+  props: _objectSpread2(_objectSpread2({}, ProCurd.props), PageCurd.props),
+  setup: function setup(props, _ref4) {
+    var slots = _ref4.slots;
+    var invalidKeys = lodash.keys(PageCurd.props);
+    return function () {
+      var _slots$default;
 
-  return values;
+      return vue.createVNode(ProCurd, lodash.omit(props, invalidKeys), {
+        "default": function _default() {
+          return [vue.createVNode(PageCurd, lodash.pick(props, invalidKeys), null), (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)];
+        }
+      });
+    };
+  }
+});
+
+var ProFormKey = Symbol("pro-form");
+var useProForm = function useProForm() {
+  return vue.inject(ProFormKey);
 };
-/**
- * string类型的path转为arr
- * @param path
+
+var provideProForm = function provideProForm(ctx) {
+  vue.provide(ProFormKey, ctx);
+};
+
+var proFormProps = function proFormProps() {
+  return {
+    /**
+     * 同 antd 或 element  form中的model
+     */
+    model: {
+      type: Object
+    },
+
+    /**
+     *  子组件是否只读样式
+     */
+    readonly: {
+      type: Boolean,
+      "default": undefined
+    },
+
+    /**
+     *  FormComponent 根据此项来确定组件是否显示
+     *  rules 根据rules中方法生成showState对象
+     */
+    showState: {
+      type: Object
+    },
+    showStateRules: {
+      type: Object
+    },
+
+    /**
+     * 是否只读
+     */
+    readonlyState: {
+      type: Object
+    },
+    readonlyStateRules: {
+      type: Object
+    },
+
+    /**
+     * 是否disabled
+     */
+    disableState: {
+      type: Object
+    },
+    disableStateRules: {
+      type: Object
+    },
+
+    /**
+     *
+     */
+    columns: {
+      type: Array
+    },
+    columnState: {
+      type: Object
+    },
+
+    /**
+     * 展示控件集合，readonly模式下使用这些组件渲染
+     */
+    elementMap: {
+      type: Object
+    },
+
+    /**
+     * 录入控件集合
+     */
+    formElementMap: {
+      type: Object
+    },
+
+    /**
+     * 是否启用rules验证
+     */
+    needRules: {
+      type: Boolean,
+      "default": true
+    },
+
+    /**
+     * provide传递
+     */
+    provideExtra: {
+      type: Object
+    }
+  };
+};
+
+var ProForm = vue.defineComponent({
+  props: _objectSpread2({}, proFormProps()),
+  setup: function setup(props, _ref) {
+    var slots = _ref.slots;
+    var formState = props.model || vue.reactive({}); //组件状态相关
+
+    var showState = props.showState || vue.reactive({});
+    var readonlyState = props.readonlyState || vue.reactive({});
+    var disableState = props.disableState || vue.reactive({}); //formState改变情况下，更新 showState，readonlyState，disableState状态
+
+    hooks.useEffect(function () {
+      if (props.showStateRules) {
+        lodash.forEach(props.showStateRules, function (fn, key) {
+          showState[key] = fn(formState);
+        });
+      }
+
+      if (props.readonlyStateRules) {
+        lodash.forEach(props.readonlyStateRules, function (fn, key) {
+          readonlyState[key] = fn(formState);
+        });
+      }
+
+      if (props.disableStateRules) {
+        lodash.forEach(props.disableStateRules, function (fn, key) {
+          disableState[key] = fn(formState);
+        });
+      }
+    }, formState); //转换为ref对象
+
+    var readonly = vue.computed(function () {
+      return props.readonly;
+    });
+    var columns = vue.computed(function () {
+      return mergeStateToList(props.columns, props.columnState, function (item) {
+        return getColumnFormItemName(item);
+      });
+    });
+    provideProForm(_objectSpread2({
+      formState: formState,
+      showState: showState,
+      readonlyState: readonlyState,
+      disableState: disableState,
+      //
+      elementMap: props.elementMap,
+      formElementMap: props.formElementMap,
+      //
+      readonly: readonly,
+      //
+      columns: columns
+    }, props.provideExtra));
+    return function () {
+      var _slots$default;
+
+      // console.log("########", columns.value, props.columns, props.columnState);
+      return (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
+    };
+  }
+});
+
+exports.SearchMode = void 0;
+
+(function (SearchMode) {
+  SearchMode["AUTO"] = "AUTO";
+  SearchMode["MANUAL"] = "MANUAL";
+})(exports.SearchMode || (exports.SearchMode = {}));
+
+var proSearchFormProps = function proSearchFormProps() {
+  return {
+    /**
+     * 需要监听的对象
+     */
+    model: {
+      type: Object,
+      required: true
+    },
+
+    /**
+     * 初始化触发 onFinish
+     */
+    initEmit: {
+      type: Boolean,
+      "default": true
+    },
+
+    /**
+     *  模式 自动触发或者手动触发 onFinish
+     */
+    searchMode: {
+      type: String,
+      "default": exports.SearchMode.AUTO
+    },
+
+    /**
+     * 配置 同ProForm中的columns
+     * 可以根据column中valueType计算出默认的debounceKeys
+     */
+    columns: {
+      type: Array
+    },
+
+    /**
+     * 需要debounce处理的字段
+     */
+    debounceKeys: {
+      type: Array
+    },
+    debounceTime: {
+      type: Number,
+      "default": 800
+    }
+  };
+};
+
+/**
+ * 该组件只是个模式，最终返回null，不做任何渲染，应配合着ProForm的包装类一起使用
+ * 针对传入的model（监听对象）做相应的finish（回调）处理
  */
+var ProSearchForm = vue.defineComponent({
+  props: _objectSpread2({}, proSearchFormProps()),
+  setup: function setup(props, _ref) {
+    var emit = _ref.emit;
+    //根据column valueType 算出默认需要debounce处理的属性集合
+    var defaultDebounceKeys = lodash.map(lodash.filter(props.columns, function (column) {
+      var valueType = getColumnValueType(column); //默认input组件的触发事件需要debounce处理
+
+      return valueType === "text";
+    }), function (column) {
+      return getColumnFormItemName(column);
+    });
 
-const convertPathToList = path => {
-  if (!path) {
-    return undefined;
+    var handleFinish = function handleFinish() {
+      emit("finish");
+    };
+
+    var debounceFinish = lodash.debounce(function () {
+      handleFinish();
+    }, props.debounceTime); //初始化
+
+    hooks.useEffect(function () {
+      if (props.initEmit) {
+        handleFinish();
+      }
+    }, []);
+
+    var isDebounceDataChange = function isDebounceDataChange(state, prevState, debounceKeys) {
+      return lodash.some(debounceKeys, function (key) {
+        return lodash.get(state, key) !== lodash.get(prevState, key);
+      });
+    }; //监听
+
+
+    hooks.useWatch(function (state, prevState) {
+      if (props.searchMode !== exports.SearchMode.AUTO) {
+        return;
+      } //如果改变的值中包括debounceKeys中注册的 延时触发
+
+
+      var debounceKeys = lodash.size(props.debounceKeys) > 0 ? props.debounceKeys : defaultDebounceKeys;
+
+      if (lodash.size(debounceKeys) > 0 && isDebounceDataChange(state, prevState, debounceKeys)) {
+        debounceFinish();
+        return;
+      }
+
+      handleFinish();
+    }, function () {
+      return lodash.clone(props.model);
+    });
+    return function () {
+      return null;
+    };
   }
+});
 
-  if (lodash.isArray(path)) {
-    return path;
+/**
+ * ProFormList ctx
+ */
+
+var ProFormListKey = Symbol("pro-form-list");
+var useProFormList = function useProFormList() {
+  return vue.inject(ProFormListKey);
+};
+
+var provideProFormList = function provideProFormList(ctx) {
+  vue.provide(ProFormListKey, ctx);
+};
+
+var FormListProvider = vue.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);
+    };
   }
+});
 
-  if (path && lodash.isString(path) && path.indexOf(".") > 0) {
-    return lodash.split(path, ".");
+var proFormListProps = function proFormListProps() {
+  return {
+    //每行默认id
+    rowKey: {
+      type: String,
+      "default": "id"
+    },
+    //name
+    name: {
+      type: [String, Number, Array],
+      required: true
+    }
+  };
+};
+
+var ProFormList = vue.defineComponent({
+  props: _objectSpread2({}, 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.name);
+    var path = formListCtx !== null && formListCtx !== void 0 && formListCtx.pathList ? [].concat(_toConsumableArray(formListCtx.pathList), _toConsumableArray(nameList)) : nameList;
+
+    var handleAdd = function handleAdd() {
+      var targetList = lodash.get(formState, path);
+
+      if (!lodash.isArray(targetList)) {
+        targetList = [];
+      }
+
+      targetList.push(_defineProperty({}, props.rowKey, new Date().valueOf()));
+      lodash.set(formState, path, targetList);
+    };
+
+    var handleRemove = function handleRemove(index) {
+      var targetList = lodash.get(formState, path);
+
+      if (lodash.size(targetList) <= 0) {
+        return;
+      }
+
+      targetList.splice(index, 1);
+    };
+
+    return function () {
+      var _slots$add;
+
+      return vue.createVNode(vue.Fragment, null, [lodash.map(lodash.get(formState, path), function (item, index) {
+        var _slots$default2, _slots$itemAdd, _slots$itemMinus;
+
+        return vue.createVNode(FormListProvider, {
+          "key": index,
+          "pathList": [].concat(_toConsumableArray(path), [index])
+        }, {
+          "default": function _default() {
+            return [vue.createVNode("div", {
+              "class": "pro-form-list-item"
+            }, [(_slots$default2 = slots["default"]) === null || _slots$default2 === void 0 ? void 0 : _slots$default2.call(slots), !readonly.value && vue.createVNode(vue.Fragment, null, [vue.createVNode("div", {
+              "class": "pro-form-list-item-add",
+              "onClick": handleAdd
+            }, [(_slots$itemAdd = slots.itemAdd) === null || _slots$itemAdd === void 0 ? void 0 : _slots$itemAdd.call(slots)]), vue.createVNode("div", {
+              "class": "pro-form-list-item-minus",
+              "onClick": function onClick() {
+                return handleRemove(index);
+              }
+            }, [(_slots$itemMinus = slots.itemMinus) === null || _slots$itemMinus === void 0 ? void 0 : _slots$itemMinus.call(slots)])])])];
+          }
+        });
+      }), !readonly.value && vue.createVNode("div", {
+        "class": "pro-form-list-add",
+        "onClick": handleAdd
+      }, [(_slots$add = slots.add) === null || _slots$add === void 0 ? void 0 : _slots$add.call(slots)])]);
+    };
   }
+});
 
-  return [path];
+var proFormItemProps = function proFormItemProps() {
+  return {
+    readonly: {
+      type: Boolean,
+      "default": undefined
+    },
+    fieldProps: {
+      type: Object
+    },
+    showProps: {
+      type: Object
+    },
+    slots: {
+      type: Object
+    }
+  };
 };
 
+var createFormItemCompFn = function createFormItemCompFn(FormItem, convertInputCompProps) {
+  return function (_ref) {
+    var InputComp = _ref.InputComp,
+        valueType = _ref.valueType,
+        name = _ref.name;
+    return vue.defineComponent({
+      name: name,
+      props: _objectSpread2(_objectSpread2({}, FormItem.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 = vue.computed(function () {
+          if (lodash.isBoolean(props.readonly)) {
+            return props.readonly;
+          } else if (lodash.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 setValue = function setValue(v) {
+          lodash.set(formState, path, v);
+        };
+
+        var invalidKeys = lodash.keys(proFormItemProps());
+        return function () {
+          var show = lodash.get(showState, path);
+
+          if (lodash.isBoolean(show) && !show) {
+            return null;
+          }
+
+          var value = lodash.get(formState, path); //valueType对应的展示组件
+
+          var ShowComp = lodash.get(elementMap, valueType);
+          return vue.createVNode(FormItem, vue.mergeProps(lodash.omit.apply(void 0, [props].concat(_toConsumableArray(invalidKeys), ["name", "slots"])), {
+            "name": path
+          }), _objectSpread2({
+            "default": function _default() {
+              return [readonly.value ? vue.createVNode(vue.Fragment, null, [ShowComp ? vue.createVNode(ShowComp, vue.mergeProps({
+                "value": value
+              }, props.fieldProps, {
+                "showProps": props.showProps
+              }), slots) : vue.createVNode("span", null, [value])]) : vue.createVNode(InputComp, vue.mergeProps(convertInputCompProps(value, setValue, lodash.get(disableState, path)), props.fieldProps), slots)];
+            }
+          }, props.slots));
+        };
+      }
+    });
+  };
+};
+
+var ProTableKey = Symbol("pro-table");
+var useProTable = function useProTable() {
+  return vue.inject(ProTableKey);
+};
+
+var provideProTable = function provideProTable(ctx) {
+  vue.provide(ProTableKey, ctx);
+};
+
+var proTableProps = function proTableProps() {
+  return {
+    //操作栏
+    operate: {
+      type: Object
+    },
+    //默认空字符串
+    columnEmptyText: {
+      type: String
+    },
+
+    /**
+     * 公共column，会merge到columns item中
+     */
+    column: {
+      type: Object
+    },
+    //
+    columns: {
+      type: Array
+    },
+    columnState: {
+      type: Object
+    },
+
+    /**
+     * 展示控件集合，readonly模式下使用这些组件渲染
+     */
+    elementMap: {
+      type: Object
+    },
+
+    /**
+     * loading
+     */
+    loading: {
+      type: Boolean
+    },
+
+    /**
+     * 序号
+     */
+    serialNumber: {
+      type: Boolean
+    },
+
+    /**
+     * 分页
+     */
+    pagination: {
+      type: Object
+    },
+
+    /**
+     * provide传递
+     */
+    provideExtra: {
+      type: Object
+    }
+  };
+};
+
+var ProTable = vue.defineComponent({
+  props: _objectSpread2({}, proTableProps()),
+  setup: function setup(props, _ref) {
+    var slots = _ref.slots;
+    var columns = vue.computed(function () {
+      var mergeColumns = mergeStateToList(props.columns, props.columnState, function (item) {
+        return item.dataIndex;
+      }); //根据valueType选择对应的展示组件
+
+      var columns = lodash.map(mergeColumns, function (item) {
+        //merge公共item
+        var nextItem = _objectSpread2(_objectSpread2({}, props.column), item);
+
+        if (!item.customRender) {
+          nextItem.customRender = function (_ref2) {
+            var text = _ref2.text;
+            var vn = getItemEl(props.elementMap, _objectSpread2(_objectSpread2({}, item), {}, {
+              showProps: _objectSpread2(_objectSpread2({}, item.showProps), {}, {
+                content: props.columnEmptyText
+              })
+            }), text); //如果找不到注册的组件，使用当前值 及 columnEmptyText
+
+            return vn || text || props.columnEmptyText;
+          };
+        }
+
+        return nextItem;
+      }); //处理序号
+
+      if (props.serialNumber) {
+        columns.unshift(_objectSpread2(_objectSpread2({
+          title: "序号",
+          dataIndex: "serialNumber",
+          width: 80
+        }, props.column), {}, {
+          // @ts-ignore
+          customRender: function customRender(_ref3) {
+            var _props$pagination, _props$pagination2;
+
+            var index = _ref3.index;
+
+            if ((_props$pagination = props.pagination) !== null && _props$pagination !== void 0 && _props$pagination.page && (_props$pagination2 = props.pagination) !== null && _props$pagination2 !== void 0 && _props$pagination2.pageSize) {
+              return props.pagination.pageSize * (props.pagination.page - 1) + index + 1;
+            }
+
+            return index + 1;
+          }
+        }));
+      }
+
+      var operate = props.operate; //处理operate
+
+      if (operate && operate.items && lodash.some(operate.items, function (item) {
+        return item.show;
+      })) {
+        //将itemState补充的信息拼到item中
+        var items = lodash.map(operate.items, function (i) {
+          return _objectSpread2(_objectSpread2({}, i), lodash.get(operate.itemState, i.value));
+        }); //排序
+
+        var sortedItems = lodash.sortBy(items, function (item) {
+          return item.sort;
+        });
+        columns.push(_objectSpread2(_objectSpread2({
+          title: "操作",
+          dataIndex: "operate",
+          fixed: "right"
+        }, props.column), {}, {
+          customRender: function customRender(_ref4) {
+            var record = _ref4.record;
+            var validItems = lodash.filter(sortedItems, function (item) {
+              if (item.show && lodash.isFunction(item.show)) {
+                return item.show(record);
+              }
+
+              if (item.show === false) {
+                return false;
+              }
+
+              return true;
+            });
+            return vue.createVNode("div", {
+              "class": "pro-table-operate"
+            }, [lodash.map(validItems, function (item) {
+              //自定义
+              if (lodash.isFunction(item.element)) {
+                return item.element(record, item);
+              }
+
+              return vue.createVNode("div", {
+                "class": "pro-table-operate-item",
+                "key": item.value,
+                "onClick": function onClick() {
+                  var _item$onClick;
+
+                  (_item$onClick = item.onClick) === null || _item$onClick === void 0 ? void 0 : _item$onClick.call(item, record);
+                }
+              }, [item.label]);
+            })]);
+          }
+        }, operate.column));
+      }
+
+      return columns;
+    });
+    provideProTable(_objectSpread2({
+      columns: columns
+    }, props.provideExtra));
+    return function () {
+      var _slots$default;
+
+      return (_slots$default = slots["default"]) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots);
+    };
+  }
+});
+
 exports.ProCurd = ProCurd;
+exports.ProForm = ProForm;
+exports.ProFormList = ProFormList;
+exports.ProModalCurd = ProModalCurd;
 exports.ProModule = ProModule;
+exports.ProPageCurd = ProPageCurd;
+exports.ProSearchForm = ProSearchForm;
+exports.ProTable = ProTable;
 exports.RequestAction = RequestAction;
 exports.convertPathToList = convertPathToList;
+exports.createFormItemCompFn = createFormItemCompFn;
+exports.defaultPage = defaultPage;
+exports.generateId = generateId;
 exports.getColumnFormItemName = getColumnFormItemName;
 exports.getColumnValueType = getColumnValueType;
 exports.getFormItemEl = getFormItemEl;
 exports.getItemEl = getItemEl;
 exports.getValidValues = getValidValues;
+exports.mergeStateToList = mergeStateToList;
 exports.provideProCurd = provideProCurd;
 exports.provideProModule = provideProModule;
 exports.useComposeRequestActor = useComposeRequestActor;
@@ -745,4 +1956,7 @@ exports.useDoneRequestActor = useDoneRequestActor;
 exports.useFailedRequestActor = useFailedRequestActor;
 exports.useModuleEvent = useModuleEvent;
 exports.useProCurd = useProCurd;
+exports.useProForm = useProForm;
+exports.useProFormList = useProFormList;
 exports.useProModule = useProModule;
+exports.useProTable = useProTable;