@aplus-frontend/ui 0.0.3 → 0.0.4

package/es/src/ap-table/ap-table.vue.mjs

@@ -1,19 +1,19 @@
-import { defineComponent as U, computed as u, createVNode as d, mergeProps as f, unref as n, watch as J, openBlock as i, createElementBlock as m, normalizeClass as b, normalizeStyle as T, withCtx as y, Fragment as X, renderList as B, createBlock as Y, resolveDynamicComponent as Z, createCommentVNode as I, createElementVNode as v, renderSlot as P, createSlots as ee, toDisplayString as ae, normalizeProps as te, guardReactiveProps as oe } from "vue";
-import { Typography as ne, Table as le, Tooltip as re } from "ant-design-vue";
-import { ApForm as de } from "../ap-form/index.mjs";
-import { apTableRenderItemMap as se, noRenderAsFormItemValueList as k, apTableFormItemMap as ue } from "./constants.mjs";
+import { defineComponent as K, computed as u, createVNode as d, mergeProps as m, unref as n, watch as $, openBlock as p, createElementBlock as c, normalizeClass as b, normalizeStyle as T, withCtx as f, Fragment as H, renderList as x, createBlock as G, resolveDynamicComponent as Q, createCommentVNode as B, createElementVNode as P, renderSlot as I, createSlots as U, toDisplayString as J, normalizeProps as X, guardReactiveProps as Y } from "vue";
+import { Typography as Z, Table as ee, Tooltip as ae } from "ant-design-vue";
+import { ApForm as te } from "../ap-form/index.mjs";
+import { apTableRenderItemMap as oe, noRenderAsFormItemValueList as v, apTableFormItemMap as ne } from "./constants.mjs";
 import "../config-provider/index.mjs";
-import { useTablePaging as ie } from "./hooks/use-table-paging.mjs";
-import { omit as O, isUndefined as pe } from "lodash-unified";
+import { useTablePaging as le } from "./hooks/use-table-paging.mjs";
+import { isUndefined as re, omit as de } from "lodash-unified";
 import "./style/ap-table.css";
-import { QuestionCircleOutlined as ce } from "@ant-design/icons-vue";
-import { getFieldProps as z, getColumnOrder as E, getPlaceholder as fe } from "./utils.mjs";
-import { useLocale as me } from "../config-provider/hooks/use-locale.mjs";
+import { QuestionCircleOutlined as se } from "@ant-design/icons-vue";
+import { apColumnToColumn as ue, getTableRenderType as pe, getTableRenderProps as ie, getColumnOrder as k, updateFormProps as me, getFieldProps as ce, getPlaceholder as fe } from "./utils.mjs";
+import { useLocale as ge } from "../config-provider/hooks/use-locale.mjs";
 import { useNamespace as ye } from "../config-provider/hooks/use-namespace.mjs";
-import { useGlobalConfig as ge } from "../config-provider/hooks/use-global-config.mjs";
+import { useGlobalConfig as be } from "../config-provider/hooks/use-global-config.mjs";
 const he = {
   key: 0
-}, Oe = /* @__PURE__ */ U({
+}, ze = /* @__PURE__ */ K({
   name: "ApTable",
   __name: "ap-table",
   props: {
@@ -122,19 +122,19 @@ const he = {
       default: "middle"
     }
   },
-  setup(L, {
-    expose: N
+  setup(O, {
+    expose: z
   }) {
-    const l = L, {
-      t: D
-    } = me(), {
-      e: C,
+    const l = O, {
+      t: E
+    } = ge(), {
+      e: h,
       b: g
-    } = ye("ap-table"), V = ge("uiMode"), h = u(() => {
+    } = ye("ap-table"), L = be("uiMode"), y = u(() => {
       var o;
       let e = ((o = l.columns) == null ? void 0 : o.filter((a) => !a.hideInTable)) || [];
       return e = e.map((a) => ({
-        ...a,
+        ...ue(a),
         customRender({
           value: t,
           ...r
@@ -147,47 +147,43 @@ const he = {
               column: a
             });
           else {
-            const R = se[a.valueType || "text"], c = z(a.fieldProps, {
+            const w = pe(a), _ = oe[w], q = ie(a, {
               value: t,
               ...r
-            }), $ = (c == null ? void 0 : c.field) || c || {}, H = a.valueType === "switch", G = a.valueType === "index", Q = H ? {
-              checked: t
-            } : {
-              value: G ? r.index + 1 : t
-            };
-            s = d(R, f(O($, ["request"]), Q, {
+            });
+            s = d(_, m(q, {
               mode: "read"
             }), null);
           }
-          return _(a, t, s);
+          return A(a, t, s);
         }
       })), e;
-    }), S = u(() => {
+    }), C = u(() => {
       var e, o, a;
-      return ((a = (o = (e = l.columns) == null ? void 0 : e.filter((t) => !t.hideInSearch && t.dataIndex && (t.valueType || t.customRenderFormItem) && !k.includes(t.valueType))) == null ? void 0 : o.sort((t, r) => {
-        let s = E(t.order);
-        return E(r.order) - s;
+      return ((a = (o = (e = l.columns) == null ? void 0 : e.filter((t) => !t.hideInSearch && t.dataIndex && (t.valueType || t.customRenderFormItem) && !v.includes(t.valueType))) == null ? void 0 : o.sort((t, r) => {
+        let s = k(t.order);
+        return k(r.order) - s;
       })) == null ? void 0 : a.map((t) => {
-        const r = z(t.fieldProps);
+        const r = me(t, ce(t.fieldProps));
         return {
           ...t,
           fieldProps: {
-            ...r || {},
             label: t.title,
             name: t.dataIndex,
+            ...r || {},
             // 格式化placeholder
-            placeholder: fe(D, t.valueType, r == null ? void 0 : r.placeholder)
+            placeholder: fe(E, t.valueType, r == null ? void 0 : r.placeholder)
           }
         };
       })) || [];
-    }), j = u(() => n(h).filter((e) => e.sorter === !0).map((e) => e.dataIndex)), W = u(() => n(h).filter((e) => e.filters && !e.onFilter).map((e) => e.dataIndex)), {
-      formRef: w,
-      submit: x,
-      reset: F,
-      tableProps: p,
-      handleTableChange: q,
-      data: A
-    } = ie({
+    }), N = u(() => n(y).filter((e) => e.sorter === !0).map((e) => e.dataIndex)), D = u(() => n(y).filter((e) => e.filters && !e.onFilter).map((e) => e.dataIndex)), {
+      formRef: F,
+      submit: R,
+      reset: S,
+      tableProps: i,
+      handleTableChange: V,
+      data: j
+    } = le({
       async request(e) {
         var a, t;
         const o = await ((a = l.request) == null ? void 0 : a.call(l, e));
@@ -196,22 +192,22 @@ const he = {
           total: (o == null ? void 0 : o.total) || 0
         };
       },
-      filterFields: n(W),
-      sortFields: n(j),
+      filterFields: n(D),
+      sortFields: n(N),
       defaultParams: l.params,
       defaultData: l.defaultData,
       manual: l.manual,
       defaultCurrent: l.pagination ? l.pagination.defaultCurrent : void 0,
       defaultPageSize: l.pagination ? l.pagination.defaultPageSize : void 0,
       formatParams: l.beforeSearchSubmit
-    }), M = u(() => ({
+    }), W = u(() => ({
       ...l,
-      ...n(p),
-      loading: pe(l.loading) ? n(p).loading : l.loading,
-      pagination: l.pagination === !1 ? !1 : n(p).pagination
+      ...n(i),
+      loading: re(l.loading) ? n(i).loading : l.loading,
+      pagination: l.pagination === !1 ? !1 : n(i).pagination
     }));
-    function _(e, o, a) {
-      return k.includes(e.valueType) ? a : e.copyable || e.ellipsis ? d(ne.Text, {
+    function A(e, o, a) {
+      return v.includes(e.valueType) ? a : e.copyable || e.ellipsis ? d(Z.Text, {
         copyable: e.copyable ? {
           text: o,
           tooltip: !1
@@ -222,70 +218,70 @@ const he = {
         content: a
       }, null) : a;
     }
-    J(() => n(A).loading, (e) => {
+    $(() => n(j).loading, (e) => {
       var o;
       (o = l.onLoadingChange) == null || o.call(l, e);
     });
-    function K(e) {
+    function M(e) {
       var o, a, t;
-      (t = (a = (o = w.value) == null ? void 0 : o.apForm) == null ? void 0 : a.setFieldsValue) == null || t.call(a, e);
+      (t = (a = (o = F.value) == null ? void 0 : o.apForm) == null ? void 0 : a.setFieldsValue) == null || t.call(a, e);
     }
-    return N({
-      submit: () => x(),
-      reset: () => F(),
-      setSearchFormValues: K
-    }), (e, o) => (i(), m("div", {
+    return z({
+      submit: () => R(),
+      reset: () => S(),
+      setSearchFormValues: M
+    }), (e, o) => (p(), c("div", {
       class: b(e.card ? null : n(g)("wrapper"))
-    }, [e.searchForm !== !1 && S.value.length > 0 ? (i(), m("div", {
+    }, [e.searchForm !== !1 && C.value.length > 0 ? (p(), c("div", {
       key: 0,
-      class: b(e.card ? n(C)("search-wrapper") : null),
+      class: b(e.card ? n(h)("search-wrapper") : null),
       style: T(e.searchFormWrapperStyle)
-    }, [d(n(de).SearchForm, f(e.searchForm || {}, {
+    }, [d(n(te).SearchForm, m(e.searchForm || {}, {
       ref_key: "formRef",
-      ref: w,
+      ref: F,
       "custom-reset": "",
-      onSubmit: n(x),
-      onReset: n(F),
-      "submit-loading": n(p).loading
+      onSubmit: n(R),
+      onReset: n(S),
+      "submit-loading": n(i).loading
     }), {
-      default: y(() => [(i(!0), m(X, null, B(S.value, (a) => (i(), Y(Z(a.customRenderFormItem ? a.customRenderFormItem(a) : n(ue)[a.valueType || "text"]), f({
+      default: f(() => [(p(!0), c(H, null, x(C.value, (a) => (p(), G(Q(a.customRenderFormItem ? a.customRenderFormItem(a) : n(ne)[a.valueType || "text"]), m({
         key: a.dataIndex,
         ref_for: !0
       }, a.fieldProps || {}, {
         span: a.span
       }), null, 16, ["span"]))), 128))]),
       _: 1
-    }, 16, ["onSubmit", "onReset", "submit-loading"])], 6)) : I("", !0), v("div", {
-      class: b(e.card ? n(C)("table-wrapper") : null),
+    }, 16, ["onSubmit", "onReset", "submit-loading"])], 6)) : B("", !0), P("div", {
+      class: b(e.card ? n(h)("table-wrapper") : null),
       style: T(e.tableWrapperStyle)
-    }, [P(e.$slots, "title"), d(n(le), f({
-      class: n(V) === "admin" ? n(g)("table-admin") : n(g)("table")
-    }, M.value, {
-      onChange: n(q),
-      columns: h.value
-    }), ee({
-      headerCell: y(({
+    }, [I(e.$slots, "title"), d(n(ee), m({
+      class: n(L) === "admin" ? n(g)("table-admin") : n(g)("table")
+    }, W.value, {
+      onChange: n(V),
+      columns: y.value
+    }), U({
+      headerCell: f(({
         column: a,
         title: t
-      }) => [a.tooltip ? (i(), m("span", he, [v("span", null, ae(t), 1), d(n(re), {
+      }) => [a.tooltip ? (p(), c("span", he, [P("span", null, J(t), 1), d(n(ae), {
         title: a.tooltip,
         placement: "bottom"
       }, {
-        default: y(() => [d(n(ce), {
+        default: f(() => [d(n(se), {
           style: {
             color: "#0070ff",
             "padding-left": "4px"
           }
         })]),
         _: 2
-      }, 1032, ["title"])])) : I("", !0)]),
+      }, 1032, ["title"])])) : B("", !0)]),
       _: 2
-    }, [B(n(O)(e.$slots, "title"), (a, t) => ({
+    }, [x(n(de)(e.$slots, "title"), (a, t) => ({
       name: t,
-      fn: y((r) => [P(e.$slots, t, te(oe(r || {})))])
+      fn: f((r) => [I(e.$slots, t, X(Y(r || {})))])
     }))]), 1040, ["class", "onChange", "columns"])], 6)], 2));
   }
 });
 export {
-  Oe as default
+  ze as default
 };

package/es/src/ap-table/components/interface.d.ts

@@ -1,3 +1,5 @@
+import { ValueEnum } from '../interface';
+
 export type ApTablePaginationProps = {
     /** dataSource的总数量 */
     total?: number;
@@ -18,3 +20,13 @@ export type ApTableIndexProps = {
      */
     value?: any;
 };
+export type ApTableStatusProps = {
+    /**
+     * 配置的值到配置的枚举值
+     */
+    valueEnum: ValueEnum;
+    /**
+     * 当前的值
+     */
+    value?: any;
+};

package/es/src/ap-table/components/status/index.vue.d.ts

@@ -0,0 +1,14 @@
+import { ApTableStatusProps } from '../interface';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ExtractPropTypes, PropType } from 'vue';
+
+declare const _default: DefineComponent<__VLS_TypePropsToRuntimeProps<ApTableStatusProps>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly< ExtractPropTypes<__VLS_TypePropsToRuntimeProps<ApTableStatusProps>>>, {}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: PropType<T[K]>;
+        required: true;
+    };
+};

package/es/src/ap-table/components/status/index.vue.mjs

@@ -0,0 +1,4 @@
+import f from "./index.vue2.mjs";
+export {
+  f as default
+};

package/es/src/ap-table/components/status/index.vue2.mjs

@@ -0,0 +1,17 @@
+import { defineComponent as n, computed as o, openBlock as u, createBlock as a, unref as m, normalizeProps as p, mergeProps as l, createCommentVNode as c } from "vue";
+import { Badge as s } from "ant-design-vue";
+const v = /* @__PURE__ */ n({
+  name: "_ApTableStatus",
+  __name: "index",
+  props: {
+    valueEnum: {},
+    value: {}
+  },
+  setup(t) {
+    const e = t, r = o(() => e.valueEnum[e.value]);
+    return (_, d) => r.value ? (u(), a(m(s), p(l({ key: 0 }, r.value)), null, 16)) : c("", !0);
+  }
+});
+export {
+  v as default
+};

package/es/src/ap-table/constants.d.ts

@@ -1,4 +1,4 @@
-import { ApTableValueFields } from './interface';
+import { ApTableValueFields, ValueEnum } from './interface';
 import { CreateComponentPublicInstance, ExtractPropTypes, PropType, HTMLAttributes, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ComponentOptionsBase, DefineComponent, PublicProps, VNode, RendererNode, RendererElement, CSSProperties, ComputedRef } from 'vue';
 import { ColSize } from 'ant-design-vue/es/grid';
 import { ApFieldDateProps, ApFieldDateRangeProps, ApFieldNumberProps, ApFieldRadioProps, ApFieldSelectProps, ApFieldSwitchProps, ApFieldTextProps, ApFieldTextAreaProps, ApFieldCheckboxProps, FieldMode } from '../ap-field';
@@ -2482,9 +2482,6 @@ export declare const apTableFormItemMap: {
             addonAfter?: any;
             prefix?: any;
             default?: any;
-            /**
-             * 表格到查询表单的映射
-             */
             upIcon?: any;
             downIcon?: any;
         }> & {
@@ -2492,9 +2489,6 @@ export declare const apTableFormItemMap: {
             addonAfter?: any;
             prefix?: any;
             default?: any;
-            /**
-             * 表格到查询表单的映射
-             */
             upIcon?: any;
             downIcon?: any;
         };
@@ -5305,17 +5299,13 @@ export declare const apTableFormItemMap: {
         validateFirst: boolean;
     }, {}, string, {}> & VNodeProps & AllowedComponentProps & ComponentCustomProps & (new () => {
         $slots: Readonly<{
-            addonAfter: any; /**
-             * 表格到查询表单的映射
-             */
+            addonAfter: any;
             addonBefore: any;
             prefix: any;
             suffix: any;
             clearIcon: any;
         }> & {
-            addonAfter: any; /**
-             * 表格到查询表单的映射
-             */
+            addonAfter: any;
             addonBefore: any;
             prefix: any;
             suffix: any;
@@ -9820,9 +9810,6 @@ export declare const apTableRenderItemMap: {
                         default: any;
                         type: PropType<any>;
                     };
-                    /**
-                     * 表格自定义渲染
-                     */
                     icon: {
                         default: any;
                         type: PropType<any>;
@@ -10193,9 +10180,6 @@ export declare const apTableRenderItemMap: {
                         default: any;
                         type: PropType<any>;
                     };
-                    /**
-                     * 表格自定义渲染
-                     */
                     icon: {
                         default: any;
                         type: PropType<any>;
@@ -10577,9 +10561,6 @@ export declare const apTableRenderItemMap: {
                         default: any;
                         type: PropType<any>;
                     };
-                    /**
-                     * 表格自定义渲染
-                     */
                     icon: {
                         default: any;
                         type: PropType<any>;
@@ -10958,9 +10939,6 @@ export declare const apTableRenderItemMap: {
                     default: any;
                     type: PropType<any>;
                 };
-                /**
-                 * 表格自定义渲染
-                 */
                 icon: {
                     default: any;
                     type: PropType<any>;
@@ -12333,6 +12311,23 @@ export declare const apTableRenderItemMap: {
     }>>, {
         bordered: boolean;
     }, {}>;
+    status: DefineComponent<{
+        valueEnum: {
+            type: PropType<ValueEnum>;
+            required: true;
+        };
+        value: {
+            type: PropType<any>;
+        };
+    }, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly< ExtractPropTypes<{
+        valueEnum: {
+            type: PropType<ValueEnum>;
+            required: true;
+        };
+        value: {
+            type: PropType<any>;
+        };
+    }>>, {}, {}>;
 };
 /**
  * 不需要渲染到Form表单的valueType字段

package/es/src/ap-table/constants.mjs

@@ -2,6 +2,7 @@ import "../ap-action/index.mjs";
 import "../ap-field/index.mjs";
 import "../ap-form/index.mjs";
 import "./components/index/index.vue.mjs";
+import "./components/status/index.vue.mjs";
 import m from "../ap-form/items/date/index.vue.mjs";
 import o from "../ap-form/items/date-range/index.vue.mjs";
 import r from "../ap-form/items/number/index.vue.mjs";
@@ -11,18 +12,19 @@ import f from "../ap-form/items/switch/index.vue.mjs";
 import a from "../ap-form/items/text/index.vue.mjs";
 import _ from "../ap-form/items/text-area/index.vue.mjs";
 import c from "../ap-form/items/checkbox/index.vue.mjs";
-import e from "../ap-field/date/index.vue.mjs";
-import n from "../ap-field/date-range/index.vue.mjs";
-import p from "../ap-field/number/index.vue.mjs";
-import s from "../ap-field/radio/index.vue.mjs";
+import n from "../ap-field/date/index.vue.mjs";
+import e from "../ap-field/date-range/index.vue.mjs";
+import s from "../ap-field/number/index.vue.mjs";
+import p from "../ap-field/radio/index.vue.mjs";
 import $ from "../ap-field/select/index.vue.mjs";
 import d from "../ap-field/switch/index.vue.mjs";
 import x from "../ap-field/text/index.vue.mjs";
 import b from "../ap-field/text-area/index.vue.mjs";
 import h from "../ap-field/checkbox/index.vue.mjs";
 import l from "../ap-action/group/index.vue.mjs";
-import R from "./components/index/index.vue2.mjs";
-const N = {
+import u from "./components/index/index.vue2.mjs";
+import R from "./components/status/index.vue2.mjs";
+const Q = {
   date: m,
   dateRange: o,
   number: r,
@@ -32,24 +34,25 @@ const N = {
   text: a,
   textArea: _,
   checkbox: c
-}, O = {
-  date: e,
-  dateRange: n,
-  number: p,
-  radio: s,
+}, S = {
+  date: n,
+  dateRange: e,
+  number: s,
+  radio: p,
   select: $,
   switch: d,
   text: x,
   textArea: b,
   checkbox: h,
   action: l,
-  index: R
-}, P = [
+  index: u,
+  status: R
+}, U = [
   "action",
   "index"
 ];
 export {
-  N as apTableFormItemMap,
-  O as apTableRenderItemMap,
-  P as noRenderAsFormItemValueList
+  Q as apTableFormItemMap,
+  S as apTableRenderItemMap,
+  U as noRenderAsFormItemValueList
 };

package/es/src/ap-table/interface.d.ts

@@ -1,7 +1,7 @@
 import { ColumnType, TableProps } from 'ant-design-vue/es/table';
 import { CompareFn, SortOrder } from 'ant-design-vue/es/table/interface';
 import { ApFormSearchFormProps } from '../ap-form';
-import { ApFormItemCheckboxProps, ApFormItemDateProps, ApFormItemDateRangeProps, ApFormItemNumberProps, ApFormItemRadioProps, ApFormItemSelectProps, ApFormItemSwitchProps, ApFormItemTextAreaProps, ApFormItemTextProps } from 'src/ap-form/items/interface';
+import { ApFormItemCheckboxProps, ApFormItemDateProps, ApFormItemDateRangeProps, ApFormItemNumberProps, ApFormItemRadioProps, ApFormItemSelectProps, ApFormItemSwitchProps, ApFormItemTextAreaProps, ApFormItemTextProps } from '../ap-form/items/interface';
 import { Recordable } from '../type';
 import { CSSProperties } from 'vue';
 import { ApActionGroupProps } from '../ap-action';
@@ -9,7 +9,13 @@ import { ApTableIndexProps } from './components/interface';
 
 export type ValueEnumType = {
     text: string;
-    status?: string;
+    /**
+     * 当前枚举值与定义的状态，等同于Badge的status
+     */
+    status?: 'success' | 'error' | 'processing' | 'warning' | 'default';
+    /**
+     * 如果status预定义的颜色无法满足需求，你可以自定义徽标的颜色，注意`color`比`status`的优先级更高
+     */
     color?: string;
     disabled?: boolean;
 };
@@ -45,7 +51,7 @@ export type ApTableValueFields = {
     index: ApTableIndexProps;
 };
 export type ValueEnum = Record<string, ValueEnumType>;
-export type ExtraProColumnType<T> = Omit<ColumnType<T>, 'children'> & {
+export type ExtraProColumnType<T> = Omit<ColumnType<T>, 'children' | 'filters'> & {
     sorter?: string | boolean | CompareFn<T> | {
         compare?: CompareFn<T>;
         /** Config multiple sorter order priority */
@@ -102,6 +108,10 @@ export type ApColumnType<ValueType extends keyof ApTableValueFields = 'text', Re
      * @description 值越大，越排在前面，请设置正整数，设置为0或负数将会无效
      */
     order?: number;
+    /**
+     * 表头的菜单筛选项，设置为true后会尝试使用valueEnum生成filters
+     */
+    filters?: ColumnType<RecordType>['filters'] | true;
 };
 export type RequestData<T> = {
     data: T[] | undefined;
@@ -190,3 +200,6 @@ export type ApTableExpose = {
     submit: () => void;
     reset: () => void;
 };
+export type FixedApColumnType<ValueType extends keyof ApTableValueFields = 'text', RecordType = any> = Omit<ApColumnType<ValueType, RecordType>, 'filters'> & {
+    filters?: ColumnType<RecordType>['filters'];
+};