@aplus-frontend/ui 0.0.33 → 0.0.34

package/es/src/ap-table/hooks/use-table-paging.mjs

@@ -1,4 +1,4 @@
-import { ref as v, nextTick as N, unref as r, onMounted as U, computed as $ } from "vue";
+import { ref as v, nextTick as N, unref as o, onMounted as U, computed as S } from "vue";
 import { parseFieldValue as W, dataIndexToStr as X } from "../utils.mjs";
 import { isArray as Y } from "lodash-unified";
 import "../../config-provider/index.mjs";
@@ -6,23 +6,23 @@ import { useLocale as Z } from "../../config-provider/hooks/use-locale.mjs";
 const oe = ({
   manual: j = !1,
   defaultCurrent: y = 1,
-  defaultPageSize: S = 10,
+  defaultPageSize: T = 10,
   request: D,
   defaultParams: R = {},
   defaultData: A = [],
-  formatParams: T,
-  paramsValueTypeMap: z,
-  resetFieldsIgnores: P,
+  formatParams: z,
+  paramsValueTypeMap: P,
+  resetFieldsIgnores: V,
   filterFields: B = [],
   sortFields: E = []
 }) => {
   let F = 0, f = {};
-  const L = (e) => T ? T(e) : e, l = v(), i = v(y), g = v(S), { t: V } = Z(), n = v({
+  const L = (e) => z ? z(e) : e, l = v(), i = v(y), g = v(T), { t: b } = Z(), n = v({
     total: 0,
     records: A,
     loading: !1
-  }), b = async (e) => {
-    var o;
+  }), w = async (e) => {
+    var r;
     const a = L(e), t = Date.now();
     F = t, n.value.loading = !0;
     try {
@@ -30,57 +30,57 @@ const oe = ({
         ...R,
         ...a
       });
-      F === t && (n.value.total = s.total || ((o = s.data) == null ? void 0 : o.length) || 0, n.value.records = [...s.data || []]);
+      F === t && (n.value.total = s.total || ((r = s.data) == null ? void 0 : r.length) || 0, n.value.records = [...s.data || []]);
     } catch {
       F === t && (n.value.records = [], n.value.total = 0);
     } finally {
       n.value.loading = !1;
     }
-  }, w = (e) => {
+  }, C = (e) => {
     const a = {};
-    return Object.entries(e).forEach(([t, o]) => {
-      if (a[t] = o, z && o) {
-        const s = z[t];
-        s && (a[t] = W(s, o));
+    return Object.entries(e).forEach(([t, r]) => {
+      if (a[t] = r, P && r) {
+        const s = P[t];
+        s && (a[t] = W(s, r));
       }
     }), a;
   }, M = (e) => {
-    var o, s, d, p, m, u, c;
-    const a = ((s = (o = l.value) == null ? void 0 : o.apForm) == null ? void 0 : s.getFieldsValue()) || {}, t = {};
-    Object.entries(a).forEach(([O, K]) => {
-      P && P.indexOf(O) > -1 && (t[O] = K);
+    var r, s, d, p, m, u, c;
+    const a = ((s = (r = l.value) == null ? void 0 : r.apForm) == null ? void 0 : s.getFieldsValue()) || {}, t = {};
+    Object.entries(a).forEach(([$, K]) => {
+      V && V.indexOf($) > -1 && (t[$] = K);
     }), (p = (d = l.value) == null ? void 0 : d.apForm) == null || p.resetFields(), (c = (u = (m = l.value) == null ? void 0 : m.apForm) == null ? void 0 : u.setFieldsValue) == null || c.call(u, t), N(() => {
       e == null || e();
     });
   }, h = (e) => {
     f = e;
-    const a = w(e);
-    b(a);
+    const a = C(e);
+    w(a);
   }, q = (e) => {
     h({
       ...f,
       ...e
     });
-  }, C = () => {
+  }, x = () => {
     var a, t;
     const e = ((t = (a = l.value) == null ? void 0 : a.apForm) == null ? void 0 : t.getFieldsValue(!0)) || {};
     i.value = 1, h({
       ...e,
       current: 1,
-      pageSize: f.pageSize || S
+      pageSize: f.pageSize || T
     });
   }, J = () => {
-    M(C);
+    M(x);
   }, Q = () => {
     h(f);
   }, G = (e) => {
-    const a = r(n).total - e, t = Math.ceil(a / r(g)), o = r(i) > t ? t : r(i);
+    const a = o(n).total - e, t = Math.ceil(a / o(g)), r = o(i) > t ? t : o(i);
     q({
-      current: o > 0 ? o : 1
+      current: r > 0 ? r : 1
     });
-  }, x = (e, a, t) => {
+  }, O = (e, a, t) => {
     var m, u;
-    const o = ((u = (m = l.value) == null ? void 0 : m.apForm) == null ? void 0 : u.getFieldsValue(!0)) || {};
+    const r = ((u = (m = l.value) == null ? void 0 : m.apForm) == null ? void 0 : u.getFieldsValue(!0)) || {};
     i.value = e.current, g.value = e.pageSize;
     const s = Y(t) ? [...t] : [t], d = {};
     for (const c of s)
@@ -89,7 +89,7 @@ const oe = ({
     for (const c of Object.keys(a))
       B.includes(c) && (p[c] = a[c]);
     h({
-      ...o,
+      ...r,
       filter: p,
       sort: d,
       current: e.current,
@@ -100,43 +100,44 @@ const oe = ({
     var a, t;
     const e = ((t = (a = l.value) == null ? void 0 : a.apForm) == null ? void 0 : t.getFieldsValue(!0)) || {};
     if (f = {
-      current: r(i),
-      pageSize: r(g),
+      current: o(i),
+      pageSize: o(g),
       ...e
     }, !j) {
-      const o = w(f);
-      b(o);
+      const r = C(f);
+      w(r);
     }
   });
-  const H = $(() => r(n).total === 0 ? "-" : `${r(i.value)}/${Math.ceil(
-    r(n).total / r(g)
-  )}`), I = $(() => ({
-    loading: r(n).loading,
+  const H = S(() => o(n).total === 0 ? "-" : `${o(i.value)}/${Math.ceil(
+    o(n).total / o(g)
+  )}`), I = S(() => ({
+    loading: o(n).loading,
     pagination: {
-      current: r(i),
-      pageSize: r(g),
-      total: r(n).total,
+      current: o(i),
+      pageSize: o(g),
+      total: o(n).total,
       showSizeChanger: !0,
       showQuickJumper: !0,
-      showTotal: (e) => `${V("ap.apTable.pagination.totalLeft", { total: e })} ${V(
+      showTotal: (e) => `${b("ap.apTable.pagination.totalLeft", { total: e })} ${b(
         "ap.apTable.pagination.totalRight",
-        { page: r(H) }
+        { page: o(H) }
       )}`
     },
-    onChange: x,
-    dataSource: r(n).records
+    onChange: O,
+    dataSource: o(n).records
   }));
   return {
     formRef: l,
-    submit: C,
+    submit: x,
     reset: J,
     refresh: Q,
     refreshByDelete: G,
     data: n,
     current: i,
     pageSize: g,
-    handleTableChange: x,
-    tableProps: I
+    handleTableChange: O,
+    tableProps: I,
+    dataSource: S(() => o(n).records)
   };
 };
 export {

package/es/src/ap-table/hooks/use-table-row-selection.d.ts

@@ -0,0 +1,60 @@
+import { TableRowSelection } from 'ant-design-vue/lib/table/interface';
+import { ComputedRef, Ref } from 'vue';
+import { ApTableProps, ApTableRowSelection } from '../interface';
+import { Recordable } from '../../type';
+
+export interface RowSelectionReturnType<RecordType = any> {
+    rowSelection: ComputedRef<TableRowSelection<RecordType>>;
+    selectedRows: Ref<RecordType[]>;
+    /**
+     * 选中某行
+     * @param item
+     * @returns
+     */
+    select: (item: RecordType) => void;
+    /**
+     * 取消选中某行
+     * @param item
+     * @returns
+     */
+    unSelect: (item: RecordType) => void;
+    /**
+     * 某行是否被选中
+     * @param item
+     * @returns
+     */
+    isSelected: (item: RecordType) => boolean;
+    /**
+     * 选中当前所有数据
+     * @returns
+     */
+    selectAll: () => void;
+    /**
+     * 取消选中当前所有数据
+     * @returns
+     */
+    unSelectAll: () => void;
+    /**
+     * 清空所有选中
+     * @returns
+     */
+    clearAll: () => void;
+    /**
+     * 切换某行的选中状态
+     * @param item
+     * @returns
+     */
+    toggleSelect: (item: RecordType) => void;
+}
+type RowSelectionParams<T> = ApTableRowSelection<T> & {
+    /**
+     * 数据源（如果是后端分页，则表示当页数据，否则是全量数据）
+     */
+    dataSource: Ref<T[]>;
+    /**
+     * 同Table的rowkey
+     */
+    rowKey: ApTableProps['rowKey'];
+};
+declare const useTableRowSelection: <RecordType = Recordable>(props: RowSelectionParams<RecordType>) => RowSelectionReturnType<RecordType>;
+export default useTableRowSelection;

package/es/src/ap-table/hooks/use-table-row-selection.mjs

@@ -0,0 +1,62 @@
+import { ref as h, computed as s, unref as c } from "vue";
+import { isFunction as x } from "lodash-unified";
+const g = (o) => {
+  const n = h([]);
+  function r(e, t) {
+    n.value = t;
+  }
+  const l = (e) => x(o.rowKey) ? o.rowKey(e) : e[o.rowKey], a = s(() => {
+    const e = /* @__PURE__ */ new Map();
+    return c(n).forEach((t) => {
+      e.set(l(t), t);
+    }), e;
+  });
+  function f(e) {
+    return c(a).has(l(e));
+  }
+  function d(e) {
+    const t = c(a);
+    t.set(l(e), e), n.value = [...t.values()];
+  }
+  function S(e) {
+    const t = c(a);
+    t.delete(l(e)), n.value = [...t.values()];
+  }
+  function i() {
+    const e = c(a);
+    c(o.dataSource).forEach((t) => {
+      e.set(l(t), t);
+    }), n.value = [...e.values()];
+  }
+  function v(e) {
+    const t = c(a), u = l(e);
+    t.has(u) ? t.delete(u) : t.set(u, e), n.value = [...t.values()];
+  }
+  function w() {
+    const e = c(a);
+    c(o.dataSource).forEach((t) => {
+      e.delete(l(t));
+    }), n.value = [...e.values()];
+  }
+  function M() {
+    n.value = [];
+  }
+  return {
+    select: d,
+    unSelect: S,
+    isSelected: f,
+    selectAll: i,
+    unSelectAll: w,
+    clearAll: M,
+    toggleSelect: v,
+    selectedRows: n,
+    rowSelection: s(() => ({
+      ...o,
+      onChange: r,
+      selectedRowKeys: c(n).map((e) => l(e))
+    }))
+  };
+};
+export {
+  g as default
+};

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

@@ -1,5 +1,5 @@
 import { ColumnType, TableProps } from 'ant-design-vue/es/table';
-import { CompareFn, SortOrder } from 'ant-design-vue/es/table/interface';
+import { CompareFn, SortOrder, TableRowSelection } from 'ant-design-vue/es/table/interface';
 import { ApFormSearchFormProps } from '../ap-form';
 import { ApFormItemCheckboxProps, ApFormItemDateProps, ApFormItemDateRangeProps, ApFormItemNumberProps, ApFormItemRadioProps, ApFormItemSelectProps, ApFormItemSwitchProps, ApFormItemTextAreaProps, ApFormItemTextPasswordProps, ApFormItemTextProps } from '../ap-form/items/interface';
 import { Recordable } from '../type';
@@ -7,6 +7,7 @@ import { ComputedRef, CSSProperties, VNode } from 'vue';
 import { ApActionGroupProps } from '../ap-action';
 import { ApTableIndexProps } from './components/interface';
 import { EllipsisConfig } from 'ant-design-vue/es/typography/Base';
+import { RowSelectionReturnType } from './hooks/use-table-row-selection';
 
 export type ValueEnumType = {
     text: string;
@@ -64,6 +65,7 @@ export type ExtraProColumnType<T> = Omit<ColumnType<T>, 'children' | 'filters' |
         multiple?: number;
     };
 };
+export type ApTableRowSelection<RecordType = any> = Omit<TableRowSelection<RecordType>, 'selectedRowKeys' | 'onChange' | 'onSelect' | 'onSelectAll' | 'onSelectInvert' | 'onSelectNone'>;
 export type ApColumnType<RecordType = any, ValueType extends ApTableValueTypes = ApTableValueTypes> = ValueType extends ApTableValueTypes ? ExtraProColumnType<RecordType> & {
     children?: ApColumnType<RecordType, ValueType>[];
     /**
@@ -141,11 +143,15 @@ export type RequestData<T> = {
     data: T[] | undefined;
     total: number;
 } & Record<string, any>;
-export type ApTableProps<RecordType = any, ParamsType = any> = Omit<TableProps<RecordType>, 'columns' | 'pagination' | 'dataSource' | 'size'> & {
+export type ApTableProps<RecordType = any, ParamsType = any> = Omit<TableProps<RecordType>, 'columns' | 'pagination' | 'dataSource' | 'size' | 'rowSelection'> & {
     /**
      * 列配置
      */
     columns?: ApColumnType<RecordType, any>[];
+    /**
+     * 行选中配置
+     */
+    rowSelection?: true | ApTableRowSelection<RecordType>;
     /**
      * 是否启用卡片样式
      */
@@ -252,4 +258,10 @@ export type ApTableExpose<SearchParamsType = Recordable, RecordType = any> = {
      * 表格数据源
      */
     dataSource: ComputedRef<RecordType>;
+    /**
+     * 行选中相关的数据和API
+     */
+    rowSelection?: Omit<RowSelectionReturnType<RecordType>, 'rowSelection'> & {
+        selectedRows: ComputedRef<RecordType[]>;
+    };
 };

package/es/src/ap-table/style/ap-table.css

@@ -90,12 +90,14 @@
 }
 .aplus-ap-table .ant-table-column-sorters {
   justify-content: unset;
+  display: inline-flex;
 }
 .aplus-ap-table .ant-table-column-sorters .ant-table-column-title {
   flex: unset;
 }
 .aplus-ap-table .ant-table-filter-column {
   justify-content: unset;
+  display: inline-flex;
 }
 .aplus-ap-table .ant-table-filter-column .ant-table-column-title {
   flex: unset;

package/es/src/ap-upload/apUpload.vue.d.ts

@@ -1,6 +1,6 @@
 import { PropType, VNode, DefineComponent, ComputedRef, ComponentOptionsMixin, PublicProps, ExtractPropTypes, RendererNode, RendererElement } from 'vue';
 import { FileUploadType, BeforeUpload, CustomRequest } from './apUploadTypes';
-import { accessCreate } from '@aplus-frontend/oss';
+import { GetOssAccess } from './hooks/useOss';
 
 declare function clear(): void;
 declare const _default: DefineComponent<{
@@ -42,7 +42,7 @@ declare const _default: DefineComponent<{
         type: PropType<CustomRequest>;
     };
     getOssAccess: {
-        type: PropType<() => Promise< accessCreate>>;
+        type: PropType<GetOssAccess>;
     };
 }, {
     done: ComputedRef<boolean>;
@@ -88,7 +88,7 @@ declare const _default: DefineComponent<{
         type: PropType<CustomRequest>;
     };
     getOssAccess: {
-        type: PropType<() => Promise< accessCreate>>;
+        type: PropType<GetOssAccess>;
     };
 }>> & {
     "onUpdate:value"?: ((...args: any[]) => any) | undefined;

package/es/src/ap-upload/hooks/useOss.d.ts

@@ -1,9 +1,9 @@
-import { client, Oss } from '@aplus-frontend/oss';
+import { accessCreate, Oss } from '@aplus-frontend/oss';
 import { Translator } from '../../config-provider';
 import { Ref } from 'vue';
 
 export type { Oss } from '@aplus-frontend/oss';
-export type GetOssAccess = Parameters<typeof client.initOssClient>[0]['getOssAccess'];
+export type GetOssAccess = () => Promise<accessCreate>;
 export declare function injectLocaleToOss(tValue: Translator, langValue: Ref<string>): void;
 declare function put({ file, dirName, oss, successCallBack, errorCallBack, progressCallBack }: {
     file: File;
@@ -21,4 +21,4 @@ export declare function useOssInit(getOssAccess: GetOssAccess): Promise<{
     client: Oss;
     put: typeof put;
 }>;
-export declare function getOssInstance(getOssAccess: Parameters<typeof client.initOssClient>[0]['getOssAccess']): Promise<Oss>;
+export declare function getOssInstance(getOssAccess: GetOssAccess): Promise<Oss>;

package/es/src/business/ap-select-layout/index.css

@@ -0,0 +1,117 @@
+.aplus-ap-select-layout {
+  display: flex;
+  height: 100%;
+  width: 100%;
+}
+.aplus-ap-select-layout .v-enter-active,
+.aplus-ap-select-layout .v-leave-active {
+  transition: all 0.2s, background 0s;
+}
+.aplus-ap-select-layout .v-enter-from,
+.aplus-ap-select-layout .v-leave-to {
+  width: 0;
+  min-width: 0;
+  max-width: 0;
+  margin-right: 0;
+}
+.aplus-ap-select-layout-side {
+  display: flex;
+  flex-direction: column;
+  width: 214px;
+  min-width: 214px;
+  max-width: 214px;
+  margin-right: 16px;
+  overflow: hidden;
+  background-color: #fff;
+}
+.aplus-ap-select-layout-side__header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12px 16px;
+  border-bottom: 1px solid #e9e9e9;
+  overflow: hidden;
+  white-space: nowrap;
+}
+.aplus-ap-select-layout-side__header > h3 {
+  margin: 0;
+  color: #333;
+  font-size: 16px;
+  font-weight: bold;
+  line-height: 18px;
+}
+.aplus-ap-select-layout-side__header--imgWrap {
+  border-radius: 2px;
+  cursor: pointer;
+  font-size: 24px;
+}
+.aplus-ap-select-layout-side__header--imgWrap:hover {
+  background: #f5f5f5;
+}
+.aplus-ap-select-layout-side__header--imgWrap > img {
+  width: 24px;
+  height: 24px;
+}
+.aplus-ap-select-layout-side__body {
+  position: relative;
+  flex: 1;
+}
+.aplus-ap-select-layout-side__body--search {
+  margin: 10px 0;
+  padding: 0 16px;
+}
+.aplus-ap-select-layout-side__body--scroll {
+  position: absolute;
+  inset: 52px 0 0;
+  overflow-y: auto;
+  padding: 0 16px;
+}
+.aplus-ap-select-layout-side__body--scroll-item {
+  margin-bottom: 8px;
+  padding: 8px 12px;
+  overflow: hidden;
+  color: #333;
+  line-height: 22px;
+  width: calc(214px - 32px);
+  text-overflow: ellipsis;
+  text-wrap: nowrap;
+  cursor: pointer;
+  border-radius: 4px;
+}
+.aplus-ap-select-layout-side__body--scroll-item:hover {
+  background: #f5f5f5;
+}
+.aplus-ap-select-layout-side__body--scroll-item.active {
+  background-color: #e4faf1;
+  color: #34b77c;
+  font-weight: bold;
+}
+.aplus-ap-select-layout-content {
+  flex: 1;
+  overflow-x: hidden;
+  display: flex;
+  flex-direction: column;
+}
+.aplus-ap-select-layout-content__header {
+  display: flex;
+  align-items: center;
+  height: 32px;
+  padding: 16px 16px 0;
+  box-sizing: content-box;
+  background: #fff;
+}
+.aplus-ap-select-layout-content__header--imgWrap {
+  margin-right: 10px;
+  border-radius: 2px;
+  cursor: pointer;
+  font-size: 24px;
+}
+.aplus-ap-select-layout-content__header--imgWrap:hover {
+  background: #f5f5f5;
+}
+.aplus-ap-select-layout-content__header--title {
+  margin: 0;
+  font-size: 16px;
+  font-weight: bold;
+  line-height: 32px;
+}

package/es/src/business/ap-select-layout/index.d.ts

@@ -0,0 +1,4 @@
+import { default as SelectLayout } from './select-layout.vue';
+
+export * from './interface';
+export { SelectLayout };

package/es/src/business/ap-select-layout/interface.d.ts

@@ -0,0 +1,9 @@
+export interface ApSelectItem {
+    name: string;
+    value: string;
+}
+export interface ApSelectLayoutProps<T extends ApSelectItem> {
+    title: string;
+    request: () => Promise<T[]>;
+    defaultFold?: boolean;
+}

package/es/src/business/ap-select-layout/select-layout.vue.d.ts

@@ -0,0 +1,76 @@
+import { ApSelectItem } from './interface';
+import { VNodeProps, AllowedComponentProps, ComponentCustomProps, ShallowUnwrapRef, VNode, RendererNode, RendererElement } from 'vue';
+
+declare const _default: <T extends ApSelectItem>(__VLS_props: {
+    onAfterEnter?: ((el: Element) => any) | undefined;
+    onAfterLeave?: ((el: Element) => any) | undefined;
+    title: string;
+    request: () => Promise<T[]>;
+    onOnSelect?: ((value: T) => any) | undefined;
+    defaultFold?: boolean | undefined;
+} & VNodeProps & AllowedComponentProps & ComponentCustomProps, __VLS_ctx?: {
+    attrs: any;
+    slots: {
+        itemRender?(_: {
+            item: T;
+        }): any;
+        default?(_: {}): any;
+    };
+    emit: {
+        (event: 'onSelect', value: T): void;
+        (event: 'afterEnter', el: Element): void;
+        (event: 'afterLeave', el: Element): void;
+    };
+} | undefined, __VLS_expose?: ((exposed: ShallowUnwrapRef<{}>) => void) | undefined, __VLS_setup?: Promise<{
+    props: {
+        onAfterEnter?: ((el: Element) => any) | undefined;
+        onAfterLeave?: ((el: Element) => any) | undefined;
+        title: string;
+        request: () => Promise<T[]>;
+        onOnSelect?: ((value: T) => any) | undefined;
+        defaultFold?: boolean | undefined;
+    } & VNodeProps & AllowedComponentProps & ComponentCustomProps;
+    expose(exposed: ShallowUnwrapRef<{}>): void;
+    attrs: any;
+    slots: {
+        itemRender?(_: {
+            item: T;
+        }): any;
+        default?(_: {}): any;
+    };
+    emit: {
+        (event: 'onSelect', value: T): void;
+        (event: 'afterEnter', el: Element): void;
+        (event: 'afterLeave', el: Element): void;
+    };
+}>) => VNode<RendererNode, RendererElement, {
+    [key: string]: any;
+}> & {
+    __ctx?: {
+        props: {
+            onAfterEnter?: ((el: Element) => any) | undefined;
+            onAfterLeave?: ((el: Element) => any) | undefined;
+            title: string;
+            request: () => Promise<T[]>;
+            onOnSelect?: ((value: T) => any) | undefined;
+            defaultFold?: boolean | undefined;
+        } & VNodeProps & AllowedComponentProps & ComponentCustomProps;
+        expose(exposed: ShallowUnwrapRef<{}>): void;
+        attrs: any;
+        slots: {
+            itemRender?(_: {
+                item: T;
+            }): any;
+            default?(_: {}): any;
+        };
+        emit: {
+            (event: 'onSelect', value: T): void;
+            (event: 'afterEnter', el: Element): void;
+            (event: 'afterLeave', el: Element): void;
+        };
+    } | undefined;
+};
+export default _default;
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/es/src/business/ap-select-layout/select-layout.vue.mjs

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