@maketribe/ms-app 3.0.38 → 3.0.40

package/src/components/data-model/data-table/views/tree/tree.tsx

@@ -1,131 +0,0 @@
-import { Fragment, computed, defineComponent, ref, unref } from "vue";
-import { ElButton, ElTree } from "element-plus";
-import type Node from "element-plus/es/components/tree/src/model/node";
-import { DataTreeNode } from "@maketribe/dm";
-import { treeProps } from "./tree-options";
-
-export default defineComponent({
-  name: "MKTree",
-  props: treeProps,
-  setup(props) {
-    const dataTree = computed(() => props.dataTree);
-
-    const treeRef = ref<{
-      filter: InstanceType<typeof ElTree>["filter"];
-      getNode: InstanceType<typeof ElTree>["getNode"];
-    } | null>(null);
-
-    const rootNodes = computed(() => unref(dataTree).rootNodes);
-
-    const handleAdd = (dataTreeNode?: DataTreeNode) => {
-      unref(dataTree).addRecord(
-        dataTreeNode ? { pid: dataTreeNode.data.id } : {}
-      );
-    };
-
-    const handleEdit = (dataTreeNode: DataTreeNode) => {
-      unref(dataTree).editRecord(dataTreeNode.data);
-    };
-
-    const handleDelete = async (dataTreeNode: DataTreeNode) => {
-      unref(dataTree).deleteRecord(dataTreeNode.data);
-    };
-
-    const handleLoad = async (node: Node, resolve: Function) => {
-      if (node.level === 0) {
-        return;
-      }
-
-      const dataTreeNode = node.data as DataTreeNode;
-
-      await dataTreeNode.load();
-
-      resolve(dataTreeNode.children);
-    };
-
-    const filter = (value: any) => {
-      unref(treeRef)?.filter(value);
-    };
-
-    return {
-      treeRef,
-      innerDataTree: dataTree,
-      rootNodes,
-      handleAdd,
-      handleEdit,
-      handleDelete,
-      handleLoad,
-      filter,
-    };
-  },
-  render() {
-    const {
-      defaultExpandAll,
-      filterNodeMethod,
-      innerDataTree,
-      rootNodes,
-      handleAdd,
-      handleEdit,
-      handleDelete,
-      handleLoad,
-      $slots,
-    } = this;
-
-    return (
-      <ElTree
-        props={{ children: "children", isLeaf: "isLeaf" }}
-        defaultExpandAll={defaultExpandAll}
-        ref="treeRef"
-        class="mk-data-tree"
-        data={rootNodes}
-        filterNodeMethod={filterNodeMethod as any}
-        nodeKey="id"
-        load={handleLoad}
-        v-slots={{
-          default: (scope: any) => {
-            let children = $slots.default?.(scope);
-
-            if (children) {
-              return children;
-            }
-
-            const { data } = scope;
-
-            const label = data.data[innerDataTree.props.label];
-
-            const main = $slots["node-main"]?.(scope) || label;
-
-            const tools = $slots["node-tools"]?.(scope) || (
-              <Fragment>
-                {$slots["node-tools-prefix"]?.(scope)}
-                <ElButton type="primary" link onClick={() => handleAdd(data)}>
-                  添加
-                </ElButton>
-                <ElButton type="primary" link onClick={() => handleEdit(data)}>
-                  编辑
-                </ElButton>
-                <ElButton type="danger" link onClick={() => handleDelete(data)}>
-                  删除
-                </ElButton>
-                {$slots["node-tools-suffix"]?.(scope)}
-              </Fragment>
-            );
-
-            return (
-              <div class="mk-data-tree-node">
-                <div class="mk-data-tree-node_main">{main}</div>
-
-                <div
-                  class="mk-data-tree-node__tools"
-                  onClick={(e) => e.stopPropagation()}
-                >
-                  {tools}
-                </div>
-              </div>
-            );
-          },
-        }}
-      />
-    );
-  },
-});

package/src/components/data-model/data-table/views/tree-view/index.ts

@@ -1,8 +0,0 @@
-import { withInstall } from "@maketribe/utils";
-import TreeView from "./tree-view";
-
-export const MKTreeView = withInstall(TreeView);
-
-export default MKTreeView;
-
-export * from "./tree-view-options";

package/src/components/data-model/data-table/views/tree-view/tree-view-options.ts

@@ -1,16 +0,0 @@
-import { ExtractPropTypes } from "vue";
-import { DataTree } from "@maketribe/dm";
-import { buildProps } from "@maketribe/utils";
-
-export const treeViewProps = buildProps({
-  dataTree: {
-    type: DataTree<any>,
-    required: true,
-  },
-  filterNodeMethod: {
-    type: Function,
-  },
-  defaultExpandAll: { type: Boolean, default: true },
-} as const);
-
-export type TreeViewProps = ExtractPropTypes<typeof treeViewProps>;

package/src/components/data-model/data-table/views/tree-view/tree-view.tsx

@@ -1,81 +0,0 @@
-import { computed, defineComponent, ref, unref, watch } from "vue";
-import { ElButton, ElCard, ElInput } from "element-plus";
-import { Search } from "@element-plus/icons-vue";
-import { MKTree } from "../tree";
-import { treeViewProps } from "./tree-view-options";
-import { I18n } from "@maketribe/locale";
-
-export default defineComponent({
-  name: "MKTreeView",
-  props: treeViewProps,
-  setup(props, { slots }) {
-    const dataTree = computed(() => props.dataTree);
-
-    const treeRef = ref<InstanceType<typeof MKTree>>();
-
-    const searchInputValue = ref("");
-    watch(searchInputValue, (value) => {
-      unref(treeRef)?.filter(value);
-    });
-
-    const filterNodeMethod = (value: string, data: any) => {
-      if (typeof props.filterNodeMethod === "function") {
-        return props.filterNodeMethod(value, data);
-      }
-
-      if (!searchInputValue.value) return true;
-
-      return data.data[unref(dataTree).props.label].includes(
-        searchInputValue.value
-      );
-    };
-
-    const handleAdd = () => {
-      unref(dataTree).addRecord();
-    };
-
-    return () => {
-      const content = slots.default?.({ dataTree: props.dataTree }) || (
-        <MKTree
-          ref={
-            ((component: InstanceType<typeof MKTree>) =>
-              (treeRef.value = component)) as any
-          }
-          dataTree={unref(dataTree)}
-          filterNodeMethod={filterNodeMethod}
-        />
-      );
-
-      return (
-        <ElCard
-          class="mk-data-tree-page"
-          v-slots={{
-            header: () => {
-              return (
-                <div class="header-box">
-                  <div class="header-box-main">
-                    <ElInput
-                      modelValue={unref(searchInputValue)}
-                      clearable={true}
-                      onUpdate:modelValue={(v: string) =>
-                        (searchInputValue.value = v)
-                      }
-                      prefix-icon={Search}
-                    />
-                  </div>
-                  <div class="header-box-tools">
-                    <ElButton onClick={handleAdd} type="primary">
-                      {I18n.instance.translate("mk.dataTreePage.addButton")}
-                    </ElButton>
-                  </div>
-                </div>
-              );
-            },
-          }}
-        >
-          {content}
-        </ElCard>
-      );
-    };
-  },
-});

package/src/components/data-model/data-table-page/data-table-page-options.ts

@@ -1,11 +0,0 @@
-import { ExtractPropTypes } from "vue";
-import { DataTable } from "@maketribe/dm";
-import { buildProps } from "@maketribe/utils";
-
-export const dataTablePageProps = buildProps({
-  autoLoad: { type: Boolean, default: true },
-  selection: { type: Boolean, default: false },
-  dataTable: { type: DataTable<any> },
-} as const);
-
-export type DataTablePageProps = ExtractPropTypes<typeof dataTablePageProps>;

package/src/components/data-model/data-table-page/data-table-page.tsx

@@ -1,26 +0,0 @@
-import { Ref, computed, defineComponent, unref } from "vue";
-import { DataTable } from "@maketribe/dm";
-import { dataTablePageProps } from "./data-table-page-options";
-import MKDataTable from "../data-table";
-
-export default defineComponent({
-  name: "MKDataTablePage",
-  props: dataTablePageProps,
-  setup(props, { slots }) {
-    const dataTable = computed(() => props.dataTable ?? null);
-
-    const loading = computed(() => unref(dataTable)?.loading ?? true);
-
-    return () => {
-      return (
-        <div class="mk-data-table-page" v-loading={unref(loading)}>
-          <MKDataTable
-            {...props}
-            dataTable={unref(dataTable) as DataTable}
-            v-slots={{ ...slots }}
-          />
-        </div>
-      );
-    };
-  },
-});

package/src/components/data-model/data-table-page/index.ts

@@ -1,6 +0,0 @@
-import { withInstall } from "@maketribe/utils";
-import DataTablePage from "./data-table-page";
-
-export const MKDataTablePage = withInstall(DataTablePage);
-
-export default DataTablePage;

package/src/components/data-model/data-table-pagination/data-table-pagination-options.ts

@@ -1,14 +0,0 @@
-import { ExtractPropTypes } from "vue";
-import { buildProps } from "@maketribe/utils";
-import { DataTable } from "@maketribe/dm";
-
-export const dataTablePaginationProps = buildProps({
-  dataTable: {
-    type: DataTable<any>,
-    required: true,
-  },
-} as const);
-
-export type DataTablePaginationProps = ExtractPropTypes<
-  typeof dataTablePaginationProps
->;

package/src/components/data-model/data-table-pagination/data-table-pagination.tsx

@@ -1,22 +0,0 @@
-import { defineComponent } from "vue";
-import { dataTablePaginationProps } from "./data-table-pagination-options";
-import MKPagination from "../../pagination";
-
-export default defineComponent({
-  name: "MKDataTablePagination",
-  props: dataTablePaginationProps,
-  setup(props) {
-    return () => {
-      return (
-        <MKPagination
-          currentPage={props.dataTable.currentPage}
-          pageSize={props.dataTable.pageSize}
-          pageSizes={props.dataTable.pageSizes}
-          total={props.dataTable.totalRecCount}
-          onUpdate:currentPage={(v) => props.dataTable.pageTo(v)}
-          onUpdate:pageSize={(v) => props.dataTable.setPageSize(v)}
-        />
-      );
-    };
-  },
-});

package/src/components/data-model/data-table-pagination/index.ts

@@ -1,7 +0,0 @@
-import { withInstall } from "@maketribe/utils";
-import DataTablePagination from "./data-table-pagination";
-
-export const MKDataTablePagination = withInstall(DataTablePagination);
-export default DataTablePagination;
-
-export * from "./data-table-pagination-options";

package/src/components/data-model/filter-panel/composables/index.ts

@@ -1 +0,0 @@
-export * from "./use-condition";

package/src/components/data-model/filter-panel/composables/use-condition.ts

@@ -1,66 +0,0 @@
-import { Operator } from "@maketribe/dm";
-import { computed, inject, unref, watch } from "vue";
-
-import { BETWEEN_OPTION, OperatorOption } from "../operator-options";
-import { FILTER_PANEL_ITEM_CONTEXT, FilterPanelItem } from "../token";
-import { buildProps } from "@maketribe/utils";
-
-export const conditionProps = buildProps({
-  defaultValue: {
-    default: null,
-  },
-} as const);
-
-export type ConditionOptions = {
-  operator: Operator;
-  operatorOptions: OperatorOption[];
-  defaultValue: any;
-};
-
-export function useCondition(options: ConditionOptions) {
-  const filterPanelItemContext = inject(FILTER_PANEL_ITEM_CONTEXT) as any;
-  const filterPanelItem =
-    filterPanelItemContext.filterPanelItem as FilterPanelItem;
-
-  filterPanelItem.setOperatorOptions(options.operatorOptions);
-
-  filterPanelItem.setOperator(options.operator);
-  // if (options.defaultValue !== void 0) {
-  //   filterPanelItem.column.defaultValue = options.defaultValue;
-  // }
-
-  const value = computed({
-    get: () => filterPanelItem.getValue(),
-    set: (v: any) => filterPanelItem.setValue(v === "" ? null : v),
-  });
-
-  const isBetween = computed(
-    () => unref(currentOperator.value) === BETWEEN_OPTION.value
-  );
-
-  const currentOperator = computed(() => filterPanelItem.currentOperator);
-
-  watch(
-    currentOperator,
-    () => {
-      const defalutValue = options.defaultValue;
-
-      if (unref(isBetween)) {
-        filterPanelItem.column.defaultValue = [defalutValue, defalutValue];
-        value.value = [defalutValue, defalutValue];
-        return;
-      }
-
-      filterPanelItem.column.defaultValue = defalutValue;
-      value.value = defalutValue;
-    },
-    { immediate: true }
-  );
-
-  return {
-    isBetween,
-    filterPanelItem,
-    currentOperator,
-    value,
-  };
-}

package/src/components/data-model/filter-panel/filter-panel-item/filter-panel-item-options.ts

@@ -1,11 +0,0 @@
-import { ExtractPropTypes } from "vue";
-import { buildProps } from "@maketribe/utils";
-
-export const filterPanelItemOptions = buildProps({
-  name: { type: String, required: true },
-  label: { type: String },
-} as const);
-
-export type FilterPanelItemOptions = ExtractPropTypes<
-  typeof filterPanelItemOptions
->;

package/src/components/data-model/filter-panel/filter-panel-item/filter-panel-item.tsx

@@ -1,187 +0,0 @@
-import {
-  computed,
-  defineComponent,
-  inject,
-  onBeforeUnmount,
-  provide,
-  reactive,
-  toRaw,
-  unref,
-  useSlots,
-} from "vue";
-import { ElOption, ElSelect, ElTooltip } from "element-plus";
-import { FilterColumn, isWhereFilter, DataFilter } from "@maketribe/dm";
-
-import {
-  FILTER_PANEL_CONTEXT,
-  FILTER_PANEL_ITEM_CONTEXT,
-  FilterPanelItem,
-} from "../token";
-
-import { useI18n, useFilterColumnComponent } from "../../../../composables";
-import { OperatorOption } from "../operator-options";
-import { filterPanelItemOptions } from "./filter-panel-item-options";
-
-export default defineComponent({
-  name: "MKFilterPanelItem",
-  props: filterPanelItemOptions,
-  setup(props) {
-    const slots = useSlots();
-
-    const i18n = useI18n()!;
-
-    const filterPanelContext: any = inject(FILTER_PANEL_CONTEXT);
-
-    const dataFilter = computed(
-      () => filterPanelContext.dataFilter as DataFilter
-    );
-
-    let _filterColumn: FilterColumn | null = null;
-
-    const createFilterColumn = () => {
-      _filterColumn = reactive(
-        new FilterColumn({
-          name: props.name!,
-          label: props.label!,
-        })
-      );
-
-      unref(dataFilter).addColumn(_filterColumn);
-
-      return _filterColumn;
-    };
-
-    const filterColumn = computed(() => {
-      const existingColumn = unref(dataFilter).getColumn(props.name) ?? null;
-
-      if (existingColumn) {
-        return existingColumn;
-      }
-
-      if (!_filterColumn) {
-        _filterColumn = createFilterColumn();
-      }
-
-      return _filterColumn;
-    });
-
-    const { component, componentProps } = useFilterColumnComponent(
-      filterColumn,
-      dataFilter
-    );
-
-    const createFilterPanelItem = (
-      dataFilter: DataFilter,
-      column: FilterColumn
-    ) => {
-      function setOperator(
-        this: FilterPanelItem,
-        operator: OperatorOption["value"]
-      ) {
-        const _dataFilter = unref(dataFilter);
-        if (isWhereFilter(_dataFilter)) {
-          this.currentOperator = operator;
-          _dataFilter.setParamOperator(unref(column).name, operator);
-        }
-      }
-
-      function setOperatorOptions(
-        this: FilterPanelItem,
-        options: OperatorOption[]
-      ) {
-        if (isWhereFilter(unref(dataFilter))) {
-          this.operatorOptions = options;
-        }
-      }
-
-      function setValue(this: FilterPanelItem, value: any) {
-        this.dataFilter.setParam(this.column.name, value);
-      }
-
-      function getValue(this: FilterPanelItem): any {
-        return this.dataFilter.getParam(this.column.name);
-      }
-
-      const filterPanelItem: FilterPanelItem = {
-        dataFilter,
-        column,
-        currentOperator: null,
-        operatorOptions: [],
-        setOperator,
-        setOperatorOptions,
-        setValue,
-        getValue,
-      };
-
-      return filterPanelItem;
-    };
-
-    const filterPanelItem = reactive(
-      createFilterPanelItem(unref(dataFilter), unref(filterColumn))
-    );
-
-    provide(
-      FILTER_PANEL_ITEM_CONTEXT,
-      reactive({
-        dataFilter,
-        filterPanelItem,
-      })
-    );
-
-    onBeforeUnmount(() => {
-      const _filterPanel = unref(dataFilter);
-
-      if (isWhereFilter(_filterPanel)) {
-        _filterPanel.deleteParamOperator(unref(filterColumn).name);
-      }
-
-      _filterPanel.deleteParam(unref(filterColumn).name);
-    });
-
-    return () => {
-      const _filterPanel = unref(dataFilter);
-
-      const _filterColumn = unref(filterColumn);
-
-      if (!_filterColumn) {
-        return null;
-      }
-
-      let children: any = slots.default?.();
-
-      if (!children && unref(component)) {
-        const FilterColumnComponent = toRaw(unref(component));
-
-        children = <FilterColumnComponent {...unref(componentProps)} />;
-      }
-
-      const options = filterPanelItem.operatorOptions.map((option) => (
-        <ElOption
-          key={option.value}
-          value={option.value}
-          label={i18n.translate(option.label)}
-        />
-      ));
-
-      const operatorSelect = isWhereFilter(_filterPanel) ? (
-        <ElSelect
-          modelValue={filterPanelItem.currentOperator as any}
-          onUpdate:modelValue={(v) => filterPanelItem.setOperator(v)}
-          class="mk-filter-panel-item__operator"
-        >
-          {options}
-        </ElSelect>
-      ) : null;
-
-      return (
-        <div class="mk-filter-panel-item">
-          <ElTooltip content={_filterColumn.label} placement="top">
-            <div class="mk-filter-panel-item__label">{_filterColumn.label}</div>
-          </ElTooltip>
-          {operatorSelect}
-          <div class="mk-filter-panel-item__content">{children}</div>
-        </div>
-      );
-    };
-  },
-});

package/src/components/data-model/filter-panel/filter-panel-item/index.ts

@@ -1,7 +0,0 @@
-import { withInstall } from "@maketribe/utils";
-import FilterPanelItem from "./filter-panel-item";
-
-export const MKFilterPanelItem = withInstall(FilterPanelItem);
-export default MKFilterPanelItem;
-
-export * from "./filter-panel-item-options";

package/src/components/data-model/filter-panel/filter-panel-options.ts

@@ -1,15 +0,0 @@
-import { ExtractPropTypes } from "vue";
-import { DataFilter } from "@maketribe/dm";
-import { buildProps } from "@maketribe/utils";
-
-export const filterPanelProps = buildProps({
-  dataFilter: { type: DataFilter, required: true },
-} as const);
-
-export type FilterPanelProps = ExtractPropTypes<typeof filterPanelProps>;
-
-export const filterPanelEmits = {
-  search: () => true,
-};
-
-export type FilterPanelEmits = typeof filterPanelEmits;