@funcho/ui 1.1.0 → 1.1.2

package/dist/esm/business/DataTable/DataTable.vue.mjs

@@ -0,0 +1,348 @@
+import { defineComponent, ref, computed, onMounted, resolveDirective, createElementBlock, openBlock, normalizeClass, unref, createCommentVNode, withDirectives, normalizeStyle, createVNode, createElementVNode, createBlock, withCtx, createTextVNode, toDisplayString, Fragment, renderList, mergeProps, createSlots, resolveDynamicComponent } from 'vue';
+import { useNamespace } from '../../hooks/use-namespace.mjs';
+import { FcButton, FcDangerButton, FcLinkButton } from '../../components/Button/index.mjs';
+import '../../components/Dialog/index.mjs';
+import '../../components/ConfigProvider/index.mjs';
+import '../../components/Input/index.mjs';
+import '../../components/Tree/index.mjs';
+import '../../components/Tabs/index.mjs';
+import '../../components/TabPane/index.mjs';
+import '../../components/Steps/index.mjs';
+import '../../components/Step/index.mjs';
+import '../../components/InputNumber/index.mjs';
+import '../../components/Select/index.mjs';
+import '../../components/Option/index.mjs';
+import '../../components/DatePicker/index.mjs';
+import '../../components/DatePickerPanel/index.mjs';
+import '../../components/Tooltip/index.mjs';
+import '../../components/Icon/index.mjs';
+import '../../components/Notification/index.mjs';
+import '../../components/Link/index.mjs';
+import '../../components/Text/index.mjs';
+import '../../components/Scrollbar/index.mjs';
+import '../../components/Splitter/index.mjs';
+import '../../components/SplitterPanel/index.mjs';
+import '../../components/Autocomplete/index.mjs';
+import '../../components/Cascader/index.mjs';
+import '../../components/CascaderPanel/index.mjs';
+import '../../components/Checkbox/index.mjs';
+import '../../components/CheckboxGroup/index.mjs';
+import '../../components/CheckboxButton/index.mjs';
+import '../../components/Form/index.mjs';
+import '../../components/FormItem/index.mjs';
+import '../../components/InputTag/index.mjs';
+import '../../components/Radio/index.mjs';
+import '../../components/RadioGroup/index.mjs';
+import '../../components/SelectV2/index.mjs';
+import '../../components/Switch/index.mjs';
+import '../../components/TimePicker/index.mjs';
+import '../../components/TimeSelect/index.mjs';
+import '../../components/TreeSelect/index.mjs';
+import '../../components/Upload/index.mjs';
+import '../../components/Avatar/index.mjs';
+import '../../components/AvatarGroup/index.mjs';
+import '../../components/Badge/index.mjs';
+import '../../components/Card/index.mjs';
+import '../../components/Descriptions/index.mjs';
+import '../../components/DescriptionsItem/index.mjs';
+import '../../components/Empty/index.mjs';
+import '../../components/Image/index.mjs';
+import '../../components/ImageViewer/index.mjs';
+import { FcPagination } from '../../components/Pagination/index.mjs';
+import { FcTable } from '../../components/Table/index.mjs';
+import { FcTableColumn } from '../../components/TableColumn/index.mjs';
+import '../../components/TableV2/index.mjs';
+import '../../components/Tag/index.mjs';
+import '../../components/Breadcrumb/index.mjs';
+import '../../components/BreadcrumbItem/index.mjs';
+import '../../components/Drawer/index.mjs';
+import '../../components/Popconfirm/index.mjs';
+import { FcIconComponent } from '../../components/IconComponent/index.mjs';
+import '../../components/Popover/index.mjs';
+import '../../components/Result/index.mjs';
+import '../../components/Progress/index.mjs';
+import '../../components/Divider/index.mjs';
+import '../../components/Dropdown/index.mjs';
+import '../../components/DropdownMenu/index.mjs';
+import '../../components/DropdownItem/index.mjs';
+import '../../components/Menu/index.mjs';
+import '../../components/SubMenu/index.mjs';
+import '../../components/MenuItem/index.mjs';
+import '../../components/RadioButton/index.mjs';
+import '../../components/MenuItemGroup/index.mjs';
+import '../../components/Collapse/index.mjs';
+import '../../components/CollapseItem/index.mjs';
+import '../../components/ContextMenu/index.mjs';
+import '../../components/CodeEditor/index.mjs';
+import '../../components/RichEditor/index.mjs';
+import _sfc_main$1 from '../ProForm/ProForm.vue.mjs';
+/* empty css                       */
+import { useElementSize } from '@vueuse/core';
+
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "FcProDataTable",
+    inheritAttrs: false
+  },
+  __name: "DataTable",
+  props: {
+    hasIndex: { type: Boolean, default: true },
+    height: { default: 0 },
+    columns: { default: () => [] },
+    isPagination: { type: Boolean, default: true },
+    fields: { default: () => [] },
+    request: { type: Function, default: () => Promise.resolve({ data: { list: [], total: 0 } }) },
+    actions: { default: () => [] },
+    tools: { default: () => [] }
+  },
+  setup(__props) {
+    const ns = useNamespace("data-table");
+    const formRef = ref();
+    const { height: formHeight } = useElementSize(formRef);
+    const hasMoreContent = computed(() => {
+      return formHeight.value > 28;
+    });
+    const isExpanded = ref(false);
+    const props = __props;
+    const queryBoxRef = ref(null);
+    const { height: queryBoxHeight } = useElementSize(queryBoxRef, void 0, {
+      box: "border-box"
+    });
+    const paginationBoxRef = ref(null);
+    const { height: paginationBoxHeight } = useElementSize(paginationBoxRef, void 0, {
+      box: "border-box"
+    });
+    const containerRef = ref(null);
+    const { height: containerHeight } = useElementSize(containerRef);
+    const maxTableHeight = computed(() => {
+      return (props.height || containerHeight.value) - ((queryBoxHeight.value > 0 ? queryBoxHeight.value + 8 : 0) + paginationBoxHeight.value);
+    });
+    const searchFormFields = computed(() => {
+      return props.fields.map((field) => {
+        const { type, attrs = {} } = field;
+        if (!type || type === "" || type.includes("Input")) {
+          attrs.onClear = handleSearchClick;
+        }
+        if (type?.includes("Select") || type?.includes("Cascader") || type?.includes("DatePicker")) {
+          attrs.onClear = handleSearchClick;
+          attrs.onChange = handleSearchClick;
+        }
+        if (type?.includes("Radio") || type?.includes("Checkbox")) {
+          attrs.onChange = handleSearchClick;
+        }
+        return {
+          ...field,
+          attrs
+        };
+      });
+    });
+    const pagination = ref({
+      currentPage: 1,
+      pageSize: 20,
+      total: 0
+    });
+    const getIndex = (i) => {
+      return (pagination.value.currentPage - 1) * pagination.value.pageSize + i + 1;
+    };
+    const tableData = ref([]);
+    const tableLoading = ref(false);
+    const loadData = async () => {
+      if (props.request) {
+        if (tableLoading.value) {
+          return;
+        }
+        const params = formRef.value?.model || {};
+        try {
+          tableLoading.value = true;
+          const { data } = await props.request(params);
+          tableData.value = Array.isArray(data) ? data : data.list || [];
+          pagination.value.total = Array.isArray(data) ? data.length : data.total || 0;
+        } catch (error) {
+          console.log("获取数据失败", error);
+        } finally {
+          tableLoading.value = false;
+        }
+      }
+    };
+    onMounted(() => {
+      loadData();
+    });
+    const handleResetClick = () => {
+      formRef.value?.resetFields();
+      pagination.value.currentPage = 1;
+      loadData();
+    };
+    const handleSearchClick = () => {
+      pagination.value.currentPage = 1;
+      loadData();
+    };
+    const handlePaginationChange = (currentPage, pageSize) => {
+      pagination.value.currentPage = currentPage;
+      pagination.value.pageSize = pageSize;
+      loadData();
+    };
+    return (_ctx, _cache) => {
+      const _directive_loading = resolveDirective("loading");
+      return openBlock(), createElementBlock("div", {
+        ref_key: "containerRef",
+        ref: containerRef,
+        class: normalizeClass(unref(ns).b())
+      }, [
+        __props.fields && __props.fields.length > 0 ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          ref_key: "queryBoxRef",
+          ref: queryBoxRef,
+          class: normalizeClass({ [unref(ns).e("query-box")]: true, [unref(ns).is("expanded")]: isExpanded.value }),
+          style: normalizeStyle({ "--query-box-max-height": unref(formHeight) + 16 + "px" })
+        }, [
+          createVNode(_sfc_main$1, {
+            ref_key: "formRef",
+            ref: formRef,
+            inline: "",
+            fields: searchFormFields.value,
+            class: normalizeClass(unref(ns).e("query-form")),
+            "label-position": "right",
+            "label-width": hasMoreContent.value && !isExpanded.value ? "fit-content" : "auto"
+          }, null, 8, ["fields", "class", "label-width"]),
+          createElementVNode("div", {
+            class: normalizeClass(unref(ns).e("tools"))
+          }, [
+            hasMoreContent.value ? (openBlock(), createBlock(unref(FcButton), {
+              key: 0,
+              link: "",
+              type: "primary",
+              onClick: _cache[0] || (_cache[0] = ($event) => isExpanded.value = !isExpanded.value)
+            }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(isExpanded.value ? "收起" : "展开"), 1),
+                createVNode(unref(FcIconComponent), {
+                  name: isExpanded.value ? "ArrowUp" : "ArrowDown",
+                  size: 14
+                }, null, 8, ["name"])
+              ]),
+              _: 1
+            })) : createCommentVNode("", true),
+            __props.fields && __props.fields.length > 2 ? (openBlock(), createBlock(unref(FcButton), {
+              key: 1,
+              disabled: tableLoading.value,
+              onClick: handleResetClick
+            }, {
+              default: withCtx(() => [..._cache[3] || (_cache[3] = [
+                createTextVNode(" 重置 ", -1)
+              ])]),
+              _: 1
+            }, 8, ["disabled"])) : createCommentVNode("", true),
+            createVNode(unref(FcButton), {
+              type: "primary",
+              disabled: tableLoading.value,
+              onClick: handleSearchClick
+            }, {
+              default: withCtx(() => [..._cache[4] || (_cache[4] = [
+                createTextVNode("查询", -1)
+              ])]),
+              _: 1
+            }, 8, ["disabled"]),
+            (openBlock(true), createElementBlock(Fragment, null, renderList(props.tools, (tool, i) => {
+              return openBlock(), createElementBlock(Fragment, { key: i }, [
+                (typeof tool.hidden === "function" ? !tool.hidden() : !tool.hidden) ? (openBlock(), createBlock(unref(FcButton), {
+                  key: 0,
+                  type: tool.type || "primary",
+                  disabled: typeof tool.disabled === "function" ? tool.disabled() : tool.disabled,
+                  onClick: tool.onClick
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(toDisplayString(tool.label), 1)
+                  ]),
+                  _: 2
+                }, 1032, ["type", "disabled", "onClick"])) : createCommentVNode("", true)
+              ], 64);
+            }), 128))
+          ], 2)
+        ], 6)) : createCommentVNode("", true),
+        withDirectives((openBlock(), createBlock(unref(FcTable), mergeProps(_ctx.$attrs, {
+          data: tableData.value,
+          border: "",
+          "max-height": maxTableHeight.value
+        }), {
+          default: withCtx(() => [
+            __props.hasIndex ? (openBlock(), createBlock(unref(FcTableColumn), {
+              key: "index",
+              label: "序号",
+              align: "center",
+              fixed: "left",
+              type: "index",
+              width: 60,
+              index: getIndex,
+              "show-overflow-tooltip": false
+            })) : createCommentVNode("", true),
+            (openBlock(true), createElementBlock(Fragment, null, renderList(__props.columns, (item) => {
+              return openBlock(), createBlock(unref(FcTableColumn), mergeProps({
+                key: item.prop
+              }, { ref_for: true }, item, {
+                "show-overflow-tooltip": item.showOverflowTooltip || true
+              }), createSlots({ _: 2 }, [
+                item.render ? {
+                  name: "default",
+                  fn: withCtx(({ row, $index }) => [
+                    (openBlock(), createBlock(resolveDynamicComponent(item.render(row, $index))))
+                  ]),
+                  key: "0"
+                } : void 0
+              ]), 1040, ["show-overflow-tooltip"]);
+            }), 128)),
+            props.actions && props.actions.length > 0 ? (openBlock(), createBlock(unref(FcTableColumn), {
+              key: "actions",
+              label: "操作",
+              align: "right",
+              fixed: "right"
+            }, {
+              default: withCtx(({ row, $index }) => [
+                createElementVNode("div", {
+                  class: normalizeClass(unref(ns).e("actions"))
+                }, [
+                  (openBlock(true), createElementBlock(Fragment, null, renderList(props.actions, (action, i) => {
+                    return openBlock(), createElementBlock(Fragment, { key: i }, [
+                      (typeof action.hidden === "function" ? !action.hidden(row) : !action.hidden) ? (openBlock(), createBlock(resolveDynamicComponent(action.label.includes("删除") ? unref(FcDangerButton) : unref(FcLinkButton)), {
+                        key: 0,
+                        type: action.type || "primary",
+                        disabled: typeof action.disabled === "function" ? action.disabled(row) : action.disabled,
+                        onClick: ($event) => action.label.includes("删除") ? void 0 : action.onClick(row, $index),
+                        onConfirm: ($event) => action.label.includes("删除") ? action.onClick(row, $index) : void 0
+                      }, {
+                        default: withCtx(() => [
+                          createTextVNode(toDisplayString(action.label), 1)
+                        ]),
+                        _: 2
+                      }, 1064, ["type", "disabled", "onClick", "onConfirm"])) : createCommentVNode("", true)
+                    ], 64);
+                  }), 128))
+                ], 2)
+              ]),
+              _: 1
+            })) : createCommentVNode("", true)
+          ]),
+          _: 1
+        }, 16, ["data", "max-height"])), [
+          [_directive_loading, tableLoading.value]
+        ]),
+        __props.isPagination ? (openBlock(), createElementBlock("div", {
+          key: 1,
+          ref_key: "paginationBoxRef",
+          ref: paginationBoxRef,
+          class: normalizeClass(unref(ns).e("pagination-box"))
+        }, [
+          createVNode(unref(FcPagination), {
+            "page-size": pagination.value.pageSize,
+            "onUpdate:pageSize": _cache[1] || (_cache[1] = ($event) => pagination.value.pageSize = $event),
+            "current-page": pagination.value.currentPage,
+            "onUpdate:currentPage": _cache[2] || (_cache[2] = ($event) => pagination.value.currentPage = $event),
+            total: pagination.value.total,
+            onChange: handlePaginationChange
+          }, null, 8, ["page-size", "current-page", "total"])
+        ], 2)) : createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/dist/esm/business/DataTable/DataTable.vue3.mjs

@@ -0,0 +1,6 @@
+import _sfc_main from './DataTable.vue.mjs';
+/* empty css                */
+
+
+
+export { _sfc_main as default };

package/dist/esm/business/DataTable/index.mjs

@@ -0,0 +1,7 @@
+import _sfc_main from './DataTable.vue.mjs';
+/* empty css                */
+import { withInstall } from '../../_utils/with-install.mjs';
+
+const FcProDataTable = withInstall(_sfc_main);
+
+export { FcProDataTable, FcProDataTable as default };

package/dist/esm/business/ProForm/ProForm.vue.mjs

@@ -0,0 +1,181 @@
+import { defineComponent, ref, createBlock, openBlock, unref, mergeProps, withCtx, createElementBlock, Fragment, renderList, normalizeStyle, resolveDynamicComponent } from 'vue';
+import { useNamespace } from '../../hooks/use-namespace.mjs';
+import '../../components/Button/index.mjs';
+import '../../components/Dialog/index.mjs';
+import '../../components/ConfigProvider/index.mjs';
+import '../../components/Input/index.mjs';
+import '../../components/Tree/index.mjs';
+import '../../components/Tabs/index.mjs';
+import '../../components/TabPane/index.mjs';
+import '../../components/Steps/index.mjs';
+import '../../components/Step/index.mjs';
+import '../../components/InputNumber/index.mjs';
+import '../../components/Select/index.mjs';
+import '../../components/Option/index.mjs';
+import '../../components/DatePicker/index.mjs';
+import '../../components/DatePickerPanel/index.mjs';
+import '../../components/Tooltip/index.mjs';
+import '../../components/Icon/index.mjs';
+import '../../components/Notification/index.mjs';
+import '../../components/Link/index.mjs';
+import '../../components/Text/index.mjs';
+import '../../components/Scrollbar/index.mjs';
+import '../../components/Splitter/index.mjs';
+import '../../components/SplitterPanel/index.mjs';
+import '../../components/Autocomplete/index.mjs';
+import '../../components/Cascader/index.mjs';
+import '../../components/CascaderPanel/index.mjs';
+import '../../components/Checkbox/index.mjs';
+import '../../components/CheckboxGroup/index.mjs';
+import '../../components/CheckboxButton/index.mjs';
+import { FcForm } from '../../components/Form/index.mjs';
+import { FcFormItem } from '../../components/FormItem/index.mjs';
+import '../../components/InputTag/index.mjs';
+import '../../components/Radio/index.mjs';
+import '../../components/RadioGroup/index.mjs';
+import '../../components/SelectV2/index.mjs';
+import '../../components/Switch/index.mjs';
+import '../../components/TimePicker/index.mjs';
+import '../../components/TimeSelect/index.mjs';
+import '../../components/TreeSelect/index.mjs';
+import '../../components/Upload/index.mjs';
+import '../../components/Avatar/index.mjs';
+import '../../components/AvatarGroup/index.mjs';
+import '../../components/Badge/index.mjs';
+import '../../components/Card/index.mjs';
+import '../../components/Descriptions/index.mjs';
+import '../../components/DescriptionsItem/index.mjs';
+import '../../components/Empty/index.mjs';
+import '../../components/Image/index.mjs';
+import '../../components/ImageViewer/index.mjs';
+import '../../components/Pagination/index.mjs';
+import '../../components/Table/index.mjs';
+import '../../components/TableColumn/index.mjs';
+import '../../components/TableV2/index.mjs';
+import '../../components/Tag/index.mjs';
+import '../../components/Breadcrumb/index.mjs';
+import '../../components/BreadcrumbItem/index.mjs';
+import '../../components/Drawer/index.mjs';
+import '../../components/Popconfirm/index.mjs';
+import '../../components/IconComponent/index.mjs';
+import '../../components/Popover/index.mjs';
+import '../../components/Result/index.mjs';
+import '../../components/Progress/index.mjs';
+import '../../components/Divider/index.mjs';
+import '../../components/Dropdown/index.mjs';
+import '../../components/DropdownMenu/index.mjs';
+import '../../components/DropdownItem/index.mjs';
+import '../../components/Menu/index.mjs';
+import '../../components/SubMenu/index.mjs';
+import '../../components/MenuItem/index.mjs';
+import '../../components/RadioButton/index.mjs';
+import '../../components/MenuItemGroup/index.mjs';
+import '../../components/Collapse/index.mjs';
+import '../../components/CollapseItem/index.mjs';
+import '../../components/ContextMenu/index.mjs';
+import '../../components/CodeEditor/index.mjs';
+import '../../components/RichEditor/index.mjs';
+import { ComponentsMap } from './componentsMap.mjs';
+
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "FcProForm"
+  },
+  __name: "ProForm",
+  props: {
+    inline: { type: Boolean, default: false },
+    labelPosition: { default: "top" },
+    fields: { default: () => [] }
+  },
+  setup(__props, { expose: __expose }) {
+    const ns = useNamespace("pro-form");
+    const formModel = ref({});
+    const setValues = (data) => {
+      formModel.value = Object.assign({}, formModel.value, data);
+    };
+    const getGridItemStyle = (item) => {
+      if (item.span === "full") {
+        return { gridColumn: "1 / -1" };
+      }
+      if (typeof item.span === "number") {
+        return { gridColumn: `span ${item.span}` };
+      }
+      return { gridColumn: "span 1" };
+    };
+    const getPlaceholder = (item, type) => {
+      if (item.attrs?.placeholder) {
+        return item.attrs.placeholder;
+      }
+      if (type?.includes("Select") || type?.includes("Cascader") || type?.includes("DatePicker")) {
+        return `请选择${item.label}`;
+      }
+      return `请输入${item.label}`;
+    };
+    const formRef = ref();
+    __expose(
+      new Proxy(
+        {},
+        {
+          get(_, key) {
+            if (key === "setValues") {
+              return setValues;
+            }
+            if (key === "model") {
+              return formModel.value;
+            }
+            return formRef.value?.[key];
+          },
+          has(_, key) {
+            if (key === "setValues" || key === "model") {
+              return true;
+            }
+            return key in formRef.value;
+          }
+        }
+      )
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(FcForm), mergeProps({
+        ref_key: "formRef",
+        ref: formRef
+      }, _ctx.$attrs, {
+        model: formModel.value,
+        class: { [unref(ns).e("container")]: true, [unref(ns).is("inline")]: __props.inline },
+        inline: __props.inline,
+        "label-position": __props.labelPosition
+      }), {
+        default: withCtx(() => [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(__props.fields, (item) => {
+            return openBlock(), createBlock(unref(FcFormItem), {
+              key: item.prop,
+              label: item.label,
+              prop: item.prop,
+              style: normalizeStyle(getGridItemStyle(item))
+            }, {
+              default: withCtx(() => [
+                item.render ? (openBlock(), createBlock(resolveDynamicComponent(item.render(formModel.value, item.prop, item.label)), mergeProps({
+                  key: 0,
+                  ref_for: true
+                }, item.attrs, {
+                  placeholder: getPlaceholder(item, item.type),
+                  style: { "width": "100%" }
+                }), null, 16, ["placeholder"])) : (openBlock(), createBlock(resolveDynamicComponent(unref(ComponentsMap)[item.type || "FcInput"]), mergeProps({
+                  key: 1,
+                  modelValue: formModel.value[item.prop],
+                  "onUpdate:modelValue": ($event) => formModel.value[item.prop] = $event
+                }, { ref_for: true }, item.attrs, {
+                  placeholder: getPlaceholder(item, item.type),
+                  style: { "width": "100%" }
+                }), null, 16, ["modelValue", "onUpdate:modelValue", "placeholder"]))
+              ]),
+              _: 2
+            }, 1032, ["label", "prop", "style"]);
+          }), 128))
+        ]),
+        _: 1
+      }, 16, ["model", "class", "inline", "label-position"]);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/dist/esm/business/ProForm/ProForm.vue3.mjs

@@ -0,0 +1,6 @@
+import _sfc_main from './ProForm.vue.mjs';
+/* empty css              */
+
+
+
+export { _sfc_main as default };

package/dist/esm/business/ProForm/componentsMap.mjs

@@ -0,0 +1,11 @@
+import * as index from '../../components/index.mjs';
+
+const ComponentsMap = {};
+Object.keys(index).map((key) => {
+  const component = index[key];
+  if (typeof component === "object" && component.name && typeof component.install === "function") {
+    ComponentsMap[component.name] = component;
+  }
+});
+
+export { ComponentsMap };

package/dist/esm/business/ProForm/index.mjs

@@ -0,0 +1,7 @@
+import _sfc_main from './ProForm.vue.mjs';
+/* empty css              */
+import { withInstall } from '../../_utils/with-install.mjs';
+
+const FcProForm = withInstall(_sfc_main);
+
+export { FcProForm, FcProForm as default };