@aplus-frontend/ui 0.1.26 → 0.1.28

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

@@ -0,0 +1,199 @@
+import { defineComponent as A, ref as L, unref as n, computed as O, watch as $, openBlock as c, createElementBlock as y, normalizeClass as d, createVNode as m, withCtx as v, createElementVNode as g, toDisplayString as k, createTextVNode as q, createBlock as b, createCommentVNode as p } from "vue";
+import { Flex as G, Button as H, Divider as J } from "ant-design-vue";
+import N from "vuedraggable";
+import "../sortable/index.vue.mjs";
+import "../../../../config-provider/index.mjs";
+import "../../style/setting/sorter.css";
+import { useProvideSorterMethods as K } from "./context.mjs";
+import { useNamespace as P } from "../../../../config-provider/hooks/use-namespace.mjs";
+import { useLocale as Q } from "../../../../config-provider/hooks/use-locale.mjs";
+import R from "../sortable/index.vue2.mjs";
+const W = { key: 0 }, X = { key: 1 }, Y = { key: 2 }, ce = /* @__PURE__ */ A({
+  __name: "index",
+  props: {
+    value: {},
+    onReset: { type: Function }
+  },
+  emits: ["update:value"],
+  setup(V, { emit: B }) {
+    const i = L([]), s = L([]), r = L([]), { b: u } = P("column-setting-sorter"), { t: h } = Q(), x = V, S = B;
+    K({
+      fixedToLeft: I,
+      fixedToRight: M,
+      unFixed: U
+    });
+    function F(e, t) {
+      const o = t[0].findIndex(
+        (a) => a.key === e.key
+      );
+      if (~o)
+        t[0].splice(o, 1);
+      else {
+        const a = t[1].findIndex(
+          (l) => l.key === e.key
+        );
+        t[1].splice(a, 1);
+      }
+    }
+    function _(e, t) {
+      const o = [...n(i.value)], a = [...n(r.value)], l = [...n(s.value)], w = {
+        left: {
+          target: o,
+          search: [l, a]
+        },
+        right: {
+          target: a,
+          search: [l, o]
+        },
+        normal: {
+          target: l,
+          search: [o, a]
+        }
+      }[t];
+      return t === "right" ? w.target.unshift(e) : w.target.push(e), F(
+        e,
+        w.search
+      ), [...o, ...l, ...a];
+    }
+    function I(e) {
+      const t = _(e, "left");
+      f(t);
+    }
+    function M(e) {
+      const t = _(e, "right");
+      f(t);
+    }
+    function U(e) {
+      const t = _(e, "normal");
+      f(t);
+    }
+    function C(e) {
+      var t;
+      return (t = e.children) != null && t.length ? e.children.some((o) => o.show) : e.show;
+    }
+    function T(e, t) {
+      e.value ? e.value.push(t) : e.value = [t];
+    }
+    const z = O(() => {
+      let e = 0;
+      function t(o) {
+        var a;
+        for (const l of o)
+          (a = l.children) != null && a.length ? t(l.children) : l.show && (e += 1);
+      }
+      return t(x.value), e;
+    });
+    function D(e) {
+      f([...e, ...n(s), ...n(r)]);
+    }
+    function E(e) {
+      f([...n(i), ...e, ...n(r)]);
+    }
+    function j(e) {
+      f([...n(i), ...n(s), ...e]);
+    }
+    $(
+      () => x.value,
+      (e) => {
+        if (e) {
+          i.value = [], s.value = [], r.value = [];
+          for (const t of e)
+            t.fixed === "left" ? T(i, t) : t.fixed === "right" ? T(r, t) : T(s, t);
+        }
+      },
+      { immediate: !0 }
+    );
+    function f(e) {
+      S("update:value", e);
+    }
+    return (e, t) => (c(), y("div", {
+      class: d(n(u)())
+    }, [
+      m(n(G), {
+        class: d(n(u)("header")),
+        align: "center",
+        justify: "space-between"
+      }, {
+        default: v(() => [
+          g("span", {
+            class: d(n(u)("header-title"))
+          }, k(n(h)("ap.apTable.setting.selectCount", { count: z.value })), 3),
+          m(n(H), {
+            type: "link",
+            size: "small",
+            style: { padding: "0" },
+            onClick: x.onReset
+          }, {
+            default: v(() => [
+              q(k(n(h)("ap.apTable.setting.reset")), 1)
+            ]),
+            _: 1
+          }, 8, ["onClick"])
+        ]),
+        _: 1
+      }, 8, ["class"]),
+      m(n(J), { style: { margin: "0px" } }),
+      g("div", {
+        class: d(n(u)("content"))
+      }, [
+        i.value.length ? (c(), y("div", W, [
+          g("span", {
+            class: d(n(u)("section-title"))
+          }, k(n(h)("ap.apTable.setting.fixToLeft")), 3),
+          m(n(N), {
+            "model-value": i.value,
+            "onUpdate:modelValue": D,
+            "item-key": "key"
+          }, {
+            item: v(({ element: o }) => [
+              C(o) ? (c(), b(R, {
+                key: 0,
+                value: o
+              }, null, 8, ["value"])) : p("", !0)
+            ]),
+            _: 1
+          }, 8, ["model-value"])
+        ])) : p("", !0),
+        s.value.length ? (c(), y("div", X, [
+          g("span", {
+            class: d(n(u)("section-title"))
+          }, k(n(h)("ap.apTable.setting.unFixed")), 3),
+          m(n(N), {
+            "model-value": s.value,
+            "onUpdate:modelValue": E,
+            "item-key": "key"
+          }, {
+            item: v(({ element: o }) => [
+              C(o) ? (c(), b(R, {
+                key: 0,
+                value: o
+              }, null, 8, ["value"])) : p("", !0)
+            ]),
+            _: 1
+          }, 8, ["model-value"])
+        ])) : p("", !0),
+        r.value.length ? (c(), y("div", Y, [
+          g("span", {
+            class: d(n(u)("section-title"))
+          }, k(n(h)("ap.apTable.setting.fixToRight")), 3),
+          m(n(N), {
+            "model-value": r.value,
+            "onUpdate:modelValue": j,
+            "item-key": "key"
+          }, {
+            item: v(({ element: o }) => [
+              C(o) ? (c(), b(R, {
+                key: 0,
+                value: o
+              }, null, 8, ["value"])) : p("", !0)
+            ]),
+            _: 1
+          }, 8, ["model-value"])
+        ])) : p("", !0)
+      ], 2)
+    ], 2));
+  }
+});
+export {
+  ce as default
+};

package/es/src/ap-table/components/setting/tree-select/index.vue.d.ts

@@ -0,0 +1,13 @@
+import { ApTableSettingTreeSelectProps } from '../../interface';
+import { DefineComponent, ComponentOptionsMixin, PublicProps, ExtractPropTypes, PropType } from 'vue';
+declare const _default: DefineComponent<__VLS_TypePropsToOption<ApTableSettingTreeSelectProps>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly< ExtractPropTypes<__VLS_TypePropsToOption<ApTableSettingTreeSelectProps>>>, {}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<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/setting/tree-select/index.vue.mjs

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

package/es/src/ap-table/components/setting/tree-select/index.vue2.mjs

@@ -0,0 +1,75 @@
+import { defineComponent as b, computed as x, unref as c, openBlock as l, createElementBlock as s, createVNode as i, withCtx as d, Fragment as m, renderList as w, createBlock as u, mergeProps as B, resolveDynamicComponent as I } from "vue";
+import { Row as L, Col as k, Checkbox as N } from "ant-design-vue";
+import "../select-group/index.vue.mjs";
+import { useInjectApTable as P } from "../../../context.mjs";
+import { cloneLabelNode as U } from "../utils.mjs";
+import j from "../select-group/index.vue2.mjs";
+const $ = /* @__PURE__ */ b({
+  __name: "index",
+  props: {
+    value: {}
+  },
+  setup(_) {
+    const a = _, { columnsBackup: y } = P(), g = x(() => [...c(y) || []].sort((e, n) => {
+      var t, o, p, h;
+      return (t = e.children) != null && t.length && !((o = n.children) != null && o.length) ? 1 : !((p = e.children) != null && p.length) && ((h = n.children) != null && h.length) ? -1 : 0;
+    }));
+    function f(r) {
+      return a.value.find((e) => e.key === r.key);
+    }
+    function C(r) {
+      const e = f(r);
+      return {
+        checked: e == null ? void 0 : e.show,
+        disabled: e == null ? void 0 : e.disabled
+      };
+    }
+    function v(r, e) {
+      const n = a.value, t = n == null ? void 0 : n.find((o) => o.key === r);
+      t && (t.show = e);
+    }
+    return (r, e) => (l(), s("div", null, [
+      i(c(L), { gutter: [24, 16] }, {
+        default: d(() => [
+          (l(!0), s(m, null, w(g.value, (n) => {
+            var t;
+            return l(), s(m, {
+              key: n.key
+            }, [
+              (t = n.children) != null && t.length ? (l(), u(c(k), {
+                key: 1,
+                span: 24
+              }, {
+                default: d(() => [
+                  i(j, {
+                    value: f(n)
+                  }, null, 8, ["value"])
+                ]),
+                _: 2
+              }, 1024)) : (l(), u(c(k), {
+                key: 0,
+                span: 8
+              }, {
+                default: d(() => [
+                  i(c(N), B({ ref_for: !0 }, C(n), {
+                    "onUpdate:checked": (o) => v(n.key, o)
+                  }), {
+                    default: d(() => [
+                      (l(), u(I(c(U)(n.title))))
+                    ]),
+                    _: 2
+                  }, 1040, ["onUpdate:checked"])
+                ]),
+                _: 2
+              }, 1024))
+            ], 64);
+          }), 128))
+        ]),
+        _: 1
+      })
+    ]));
+  }
+});
+export {
+  $ as default
+};

package/es/src/ap-table/components/setting/utils.d.ts

@@ -0,0 +1,17 @@
+import { ColumnsType } from 'ant-design-vue/es/table';
+import { ApColumnState } from '../../interface';
+/**
+ * 根据列状态重新生成表格列配置
+ * @param columns 表格列数组
+ * @param columnStateList 表格列状态数组
+ * @returns
+ */
+export default function generateColumnsByColumnState(columns: ColumnsType, columnStateList: ApColumnState[]): ColumnsType;
+export declare function customCloneColumnStates<T extends ApColumnState | ApColumnState[]>(columnStates: T): T;
+/**
+ * 克隆列设置用的label，并为其添加额外的props
+ * @param node
+ * @param overrideProps
+ * @returns
+ */
+export declare function cloneLabelNode(node: any): any;

package/es/src/ap-table/components/setting/utils.mjs

@@ -0,0 +1,48 @@
+import { cloneDeepWith as s } from "lodash-unified";
+import { isVNode as u, cloneVNode as c } from "vue";
+function f(e, i) {
+  var r;
+  const n = [];
+  for (const t of i) {
+    const l = e.find((o) => o.key === t.key);
+    if ((r = t.children) != null && r.length) {
+      const o = f(
+        l.children,
+        t.children
+      );
+      o.length && n.push({
+        ...l,
+        fixed: t.fixed,
+        children: o
+      });
+    } else {
+      if (!t.show)
+        continue;
+      n.push({ ...l, fixed: t.fixed });
+    }
+  }
+  return n;
+}
+function h(e) {
+  return s(e, (i, n) => {
+    if (n === "label")
+      return i;
+  });
+}
+const a = {
+  display: "inline",
+  "-webkit-line-clamp": "unset",
+  "-webkit-box-orient": "unset",
+  overflow: "unset",
+  "text-overflow": "unset",
+  "white-space": "unset",
+  wordBreak: "unset"
+};
+function p(e) {
+  return u(e) ? c(e, { style: a }) : e;
+}
+export {
+  p as cloneLabelNode,
+  h as customCloneColumnStates,
+  f as default
+};

package/es/src/ap-table/components/style/setting/modal.css

@@ -0,0 +1,39 @@
+.aplus-ap-column-setting-wrapper {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  height: 100%;
+}
+.aplus-ap-column-setting-left {
+  flex: 1;
+  flex-shrink: 1;
+  min-width: 0;
+  padding-inline: 20px;
+  display: flex;
+  flex-direction: column;
+}
+.aplus-ap-column-setting-left__header {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  justify-content: space-between;
+  align-items: center;
+  padding: 12px;
+}
+.aplus-ap-column-setting-left__content {
+  flex: 1;
+  padding-inline: 12px;
+  padding-block: 16px;
+  overflow-y: auto;
+}
+.aplus-ap-column-setting-left__content .ant-checkbox-wrapper {
+  max-width: 100%;
+}
+.aplus-ap-column-setting-left__content .ant-checkbox-wrapper > span:last-child {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.aplus-ap-column-setting-right {
+  width: 240px;
+}

package/es/src/ap-table/components/style/setting/select-group.css

@@ -0,0 +1,7 @@
+.aplus-select-group-header {
+  background-color: #F2F6F9;
+  padding: 4px 12px;
+  border-radius: 4px;
+  margin-bottom: 16px;
+  margin-inline: -12px;
+}

package/es/src/ap-table/components/style/setting/sortable-item-meta.css

@@ -0,0 +1,50 @@
+.aplus-sortable-item-meta {
+  padding: 6px 8px;
+  margin-top: 4px;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  justify-content: space-between;
+  align-items: center;
+}
+.aplus-sortable-item-meta:hover {
+  background-color: #F1F7FF;
+  border-radius: 2px;
+  cursor: pointer;
+}
+.aplus-sortable-item-meta:hover .aplus-sortable-item-meta-right {
+  display: block;
+}
+.aplus-sortable-item-meta:hover .aplus-sortable-item-meta-left__holder {
+  color: var(--basic-color-primary, #0070ff) !important;
+}
+.aplus-sortable-item-meta-left {
+  flex: 1;
+  display: inline-flex;
+  align-items: center;
+  min-width: 0;
+}
+.aplus-sortable-item-meta-left__indicator {
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  width: 16px;
+  height: 16px;
+  margin-right: 4px;
+  flex-shrink: 0;
+}
+.aplus-sortable-item-meta-left__label-wrapper {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.aplus-sortable-item-meta-right {
+  display: none;
+  padding-left: 12px;
+}
+.aplus-sortable-item-meta .is-level2 {
+  margin-left: 16px;
+}
+.aplus-sortable-item-meta-action-icon:hover {
+  color: var(--basic-color-primary, #0070ff);
+}

package/es/src/ap-table/components/style/setting/sortable-item.css

@@ -0,0 +1,3 @@
+.aplus-sortable-item .is-hidden {
+  display: none;
+}

package/es/src/ap-table/components/style/setting/sorter.css

@@ -0,0 +1,26 @@
+.aplus-column-setting-sorter {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+.aplus-column-setting-sorter-section-title {
+  font-size: 12px;
+  line-height: 20px;
+  color: #8896b0;
+  padding: 2px 8px;
+  margin: 4px;
+}
+.aplus-column-setting-sorter-header {
+  padding: 16px 20px;
+}
+.aplus-column-setting-sorter-header-title {
+  font-size: 14px;
+  line-height: 22px;
+  font-weight: bold;
+  color: #182948;
+}
+.aplus-column-setting-sorter-content {
+  flex: 1;
+  overflow-y: auto;
+  padding: 8px 12px 12px 8px;
+}

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

@@ -1,6 +1,6 @@
 import { ApFieldPassword } from '../ap-field';
 import { ApTableValueFields, ValueEnum } from './interface';
-import { CSSProperties, CreateComponentPublicInstance, ExtractPropTypes, PropType, HTMLAttributes, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ComponentOptionsBase, VNode, RendererNode, RendererElement, DefineComponent, PublicProps, ComputedRef } from 'vue';
+import { CreateComponentPublicInstance, ExtractPropTypes, PropType, HTMLAttributes, ComponentOptionsMixin, VNodeProps, AllowedComponentProps, ComponentCustomProps, ComponentOptionsBase, VNode, RendererNode, RendererElement, CSSProperties, DefineComponent, PublicProps, ComputedRef } from 'vue';
 import { ColSize } from 'ant-design-vue/es/grid';
 import { ApFieldDateProps, ApFormItemSlots, ApFieldDateRangeProps, ApFieldNumberProps, ApFieldRadioProps, ApFieldSelectProps, ApFieldSwitchProps, ApFieldTextProps, ApFormItemTextPassword, ApFieldTextAreaProps, ApFieldCheckboxProps, ApFieldTextPasswordProps, FieldMode, GroupActionTypes } from '..';
 import { RuleObject } from 'ant-design-vue/es/form';
@@ -5242,7 +5242,11 @@ export declare const apTableFormItemMap: {
             focus: (options?: InputFocusOptions) => void;
             blur: () => void;
             input: any;
-            setSelectionRange: (start: number, end: number, direction?: "forward" | "backward" | "none") => void;
+            setSelectionRange: (start: number, end: number, direction
+            /**
+             * 不需要渲染到Form表单的valueType字段
+             */
+            ?: "forward" | "backward" | "none") => void;
             select: () => void;
         }, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, VNodeProps & AllowedComponentProps & ComponentCustomProps & Readonly< ExtractPropTypes<{
             label: {
@@ -5653,7 +5657,11 @@ export declare const apTableFormItemMap: {
             focus: (options?: InputFocusOptions) => void;
             blur: () => void;
             input: any;
-            setSelectionRange: (start: number, end: number, direction?: "forward" | "backward" | "none") => void;
+            setSelectionRange: (start: number, end: number, direction
+            /**
+             * 不需要渲染到Form表单的valueType字段
+             */
+            ?: "forward" | "backward" | "none") => void;
             select: () => void;
         }, {}, {}, {}, {
             disabled: boolean;
@@ -5866,7 +5874,11 @@ export declare const apTableFormItemMap: {
         focus: (options?: InputFocusOptions) => void;
         blur: () => void;
         input: any;
-        setSelectionRange: (start: number, end: number, direction?: "forward" | "backward" | "none") => void;
+        setSelectionRange: (start: number, end: number, direction
+        /**
+         * 不需要渲染到Form表单的valueType字段
+         */
+        ?: "forward" | "backward" | "none") => void;
         select: () => void;
     }, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, {
         disabled: boolean;
@@ -13919,7 +13931,11 @@ export declare const apTableRenderItemMap: {
             focus: (options?: InputFocusOptions) => void;
             blur: () => void;
             input: any;
-            setSelectionRange: (start: number, end: number, direction?: "forward" | "backward" | "none") => void;
+            setSelectionRange: (start: number, end: number, direction
+            /**
+             * 不需要渲染到Form表单的valueType字段
+             */
+            ?: "forward" | "backward" | "none") => void;
             select: () => void;
         }, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
             "update:value": (...args: any[]) => void;
@@ -14229,7 +14245,11 @@ export declare const apTableRenderItemMap: {
             focus: (options?: InputFocusOptions) => void;
             blur: () => void;
             input: any;
-            setSelectionRange: (start: number, end: number, direction?: "forward" | "backward" | "none") => void;
+            setSelectionRange: (start: number, end: number, direction
+            /**
+             * 不需要渲染到Form表单的valueType字段
+             */
+            ?: "forward" | "backward" | "none") => void;
             select: () => void;
         }, {}, {}, {}, {
             type: "number" | "reset" | "submit" | "button" | "search" | "time" | "month" | "date" | "week" | "hidden" | "checkbox" | "radio" | "color" | "text" | "range" | "image" | "tel" | "url" | "email" | "datetime-local" | "file" | "password";
@@ -14390,7 +14410,11 @@ export declare const apTableRenderItemMap: {
         focus: (options?: InputFocusOptions) => void;
         blur: () => void;
         input: any;
-        setSelectionRange: (start: number, end: number, direction?: "forward" | "backward" | "none") => void;
+        setSelectionRange: (start: number, end: number, direction
+        /**
+         * 不需要渲染到Form表单的valueType字段
+         */
+        ?: "forward" | "backward" | "none") => void;
         select: () => void;
     }, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
         "update:value": (...args: any[]) => void;
@@ -15632,4 +15656,3 @@ export declare const apTableRenderItemMap: {
  * 不需要渲染到Form表单的valueType字段
  */
 export declare const noRenderAsFormItemValueList: (keyof ApTableValueFields)[];
-export declare const ellipsisTitleStyle: CSSProperties;