vue-admin-core/lib/hooks/formily/useFormilyTable.js

A Component Library for Vue 3

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
require('../useRequest/index.js');
var vue$1 = require('@formily/vue');
var core = require('@formily/core');
require('../../components/config-provider/index.js');
require('../../formily/index.js');
var reactive = require('@formily/reactive');
var isService = require('../useRequest/__utils__/isService.js');
var defaultProps = require('element-plus/es/components/table/src/table/defaults');
var lodashEs = require('lodash-es');
var useGlobalConfig = require('../../components/config-provider/src/hooks/use-global-config.js');
var index = require('../../formily/array-table/src/index.js');
var useRequest = require('../useRequest/src/useRequest.js');

function _isSlot(s) {
  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !vue.isVNode(s);
}
const transformTableSchema = (schemas) => {
  const _map = {};
  lodashEs.map(schemas, (schema, key) => {
    if (schema["x-column-props"]) {
      _map[key] = {
        type: "void",
        "x-component": "ArrayTable.Column",
        "x-component-props": schema["x-column-props"],
        ...schema
      };
    } else {
      _map[key] = schema;
    }
    if (schema["properties"]) {
      _map[key]["properties"] = transformTableSchema(schema["properties"]);
    }
  });
  return _map;
};
const useFormilyTable = (request, options, SchemaField) => {
  const form = vue$1.useForm();
  const config = useGlobalConfig.useGlobalConfig();
  const pageSizeKey = config.value.pageSizeKey || "pageSize";
  const currentPageKey = config.value.currentPageKey || "currentPage";
  const totalKey = config.value.totalKey || "totalElements";
  const listKey = config.value.listKey || "content";
  const tableUid = "dataSource";
  const app = vue.getCurrentInstance();
  const SelfSchemaField = (app == null ? void 0 : app.appContext.components.SchemaField) || SchemaField;
  if (!SelfSchemaField) {
    throw new Error(`SchemaField \u627E\u4E0D\u5230\uFF0C\u5728\u5168\u5C40\u8BBE\u7F6Eapp.use(setupFormily)\u6216\u8005\u4F20\u5165SchemaField`);
  }
  const {
    formProps,
    ...others
  } = options || {};
  if (!form.value) {
    form.value = core.createForm(formProps);
  }
  const pagination = index.ArrayTable.createPagination();
  const table = index.ArrayTable.createTable();
  let result = request;
  if (isService.isService(request)) {
    result = useRequest.default(request, {
      manual: true,
      current: 1,
      ...others
    });
  }
  reactive.autorun(() => {
    var _a;
    const params = (_a = vue.toValue(result.params)) == null ? void 0 : _a[0];
    result.run({
      ...params,
      [pageSizeKey]: pagination.pageSize,
      [currentPageKey]: pagination.current
    });
  });
  vue.watch(result.loading, (value) => {
    form.value.query(tableUid).take((field) => {
      field.setComponentProps({
        loading: value
      });
    });
  }, {
    immediate: true
  });
  vue.watch([result.data], ([data]) => {
    if (Array.isArray(data)) {
      form.value.query(tableUid).take((field) => {
        field.setValue(data);
      });
    } else {
      form.value.query(tableUid).take((field) => {
        field.setValue(data[listKey]);
        pagination.setTotal(data[totalKey]);
      });
    }
  });
  const Table = vue.defineComponent({
    name: "UseSearchTableTable",
    props: {
      ...defaultProps,
      schema: {
        type: Object,
        required: true
      },
      components: {
        type: Object
      },
      scope: {
        type: Object
      },
      name: {
        type: [String, Number]
      },
      definitions: {
        type: Object
      }
    },
    setup(props, {
      slots
    }) {
      const {
        schema,
        components,
        scope,
        name,
        ...reset
      } = props;
      const _form = vue$1.useForm();
      if (_form.value)
        form.value = _form.value;
      const _schema = {
        type: "object",
        definitions: props.definitions,
        properties: {
          [tableUid]: {
            type: "array",
            "x-component": "ArrayTable",
            "x-component-props": {
              ...reset,
              pagination,
              table,
              loading: result.loading.value
            },
            items: {
              type: "object",
              properties: transformTableSchema(schema)
            }
          }
        }
      };
      return () => vue.createVNode(vue$1.FormProvider, {
        "form": form.value
      }, {
        default: () => [vue.createVNode(SelfSchemaField, {
          "schema": _schema,
          "components": components,
          "name": name,
          "scope": scope
        }, _isSlot(slots) ? slots : {
          default: () => [slots]
        })]
      });
    }
  });
  return {
    form,
    Table,
    request: result,
    table
  };
};

exports.default = useFormilyTable;
exports.transformTableSchema = transformTableSchema;
exports.useFormilyTable = useFormilyTable;
//# sourceMappingURL=useFormilyTable.js.map