api.ts 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184
  1. import type { VxeGridInstance } from 'vxe-table';
  2. import type {
  3. BaseFormComponentType,
  4. ExtendedFormApi,
  5. } from '@vben-core/form-ui';
  6. import type { VxeGridProps } from './types';
  7. import type {ViewedRowHelper} from './use-viewed-row';
  8. import { toRaw } from 'vue';
  9. import { Store } from '@vben-core/shared/store';
  10. import {
  11. bindMethods,
  12. isBoolean,
  13. isFunction,
  14. mergeWithArrayOverride,
  15. StateHandler,
  16. } from '@vben-core/shared/utils';
  17. function getDefaultState(): VxeGridProps {
  18. return {
  19. class: '',
  20. gridClass: '',
  21. gridOptions: {},
  22. gridEvents: {},
  23. formOptions: undefined,
  24. showSearchForm: true,
  25. };
  26. }
  27. export class VxeGridApi<
  28. T extends Record<string, any> = any,
  29. D extends BaseFormComponentType = BaseFormComponentType,
  30. P extends Record<string, any> = Record<never, never>,
  31. > {
  32. public formApi = {} as ExtendedFormApi;
  33. // private prevState: null | VxeGridProps = null;
  34. public grid = {} as VxeGridInstance<T>;
  35. public state: null | VxeGridProps<T, D, P> = null;
  36. public store: Store<VxeGridProps<T, D, P>>;
  37. /**
  38. * 已读行 helper(在 mount 中初始化,业务能力全部封装在 useViewedRow 中)
  39. */
  40. public viewedRowHelper: null | ViewedRowHelper<T> = null;
  41. private isMounted = false;
  42. private stateHandler: StateHandler;
  43. constructor(options: VxeGridProps<T, D, P> = {} as VxeGridProps<T, D, P>) {
  44. const storeState = { ...options };
  45. const defaultState = getDefaultState();
  46. this.store = new Store<VxeGridProps<T, D, P>>(
  47. mergeWithArrayOverride(storeState, defaultState) as VxeGridProps<T, D, P>,
  48. );
  49. this.store.subscribe((state) => {
  50. // this.prevState = this.state;
  51. this.state = state;
  52. });
  53. this.state = this.store.state;
  54. this.stateHandler = new StateHandler();
  55. bindMethods(this);
  56. }
  57. /**
  58. * 清除所有已读状态
  59. */
  60. clearViewedRows() {
  61. this.viewedRowHelper?.clearViewed();
  62. }
  63. /**
  64. * 获取所有已读的 key 集合(返回副本,避免外部修改内部状态)
  65. */
  66. getViewedKeys(): Set<number | string> {
  67. const raw = this.viewedRowHelper?.viewedSet.value;
  68. return raw ? new Set(raw) : new Set();
  69. }
  70. /**
  71. * 判断某行是否已读
  72. */
  73. isRowViewed(record: T): boolean {
  74. return this.viewedRowHelper?.isViewed(record) ?? false;
  75. }
  76. /**
  77. * 批量标记行为已读
  78. */
  79. markKeysAsViewed(keys: Array<number | string>) {
  80. this.viewedRowHelper?.markKeysAsViewed(keys);
  81. }
  82. /**
  83. * 标记某行为已读
  84. */
  85. markRowAsViewed(record: T) {
  86. this.viewedRowHelper?.markAsViewed(record);
  87. }
  88. mount(instance: null | VxeGridInstance, formApi: ExtendedFormApi) {
  89. if (!this.isMounted && instance) {
  90. this.grid = instance;
  91. this.formApi = formApi;
  92. this.stateHandler.setConditionTrue();
  93. this.isMounted = true;
  94. }
  95. }
  96. async query(params: Record<string, any> = {}) {
  97. try {
  98. await this.grid.commitProxy('query', toRaw(params));
  99. } catch (error) {
  100. console.error('Error occurred while querying:', error);
  101. }
  102. }
  103. async reload(params: Record<string, any> = {}) {
  104. try {
  105. await this.grid.commitProxy('reload', toRaw(params));
  106. } catch (error) {
  107. console.error('Error occurred while reloading:', error);
  108. }
  109. }
  110. /**
  111. * 移除指定 key 的已读状态
  112. */
  113. removeViewedKeys(keys: Array<number | string>) {
  114. this.viewedRowHelper?.removeKeys(keys);
  115. }
  116. setGridOptions(options: Partial<VxeGridProps<T, D, P>['gridOptions']>) {
  117. this.setState({
  118. gridOptions: options,
  119. });
  120. }
  121. setLoading(isLoading: boolean) {
  122. this.setState({
  123. gridOptions: {
  124. loading: isLoading,
  125. },
  126. });
  127. }
  128. setState(
  129. stateOrFn:
  130. | ((prev: VxeGridProps<T, D, P>) => Partial<VxeGridProps<T, D, P>>)
  131. | Partial<VxeGridProps<T, D, P>>,
  132. ) {
  133. if (isFunction(stateOrFn)) {
  134. this.store.setState((prev) => {
  135. return mergeWithArrayOverride(stateOrFn(prev), prev);
  136. });
  137. } else {
  138. this.store.setState((prev) => mergeWithArrayOverride(stateOrFn, prev));
  139. }
  140. }
  141. toggleSearchForm(show?: boolean) {
  142. this.setState({
  143. showSearchForm: isBoolean(show) ? show : !this.state?.showSearchForm,
  144. });
  145. // nextTick(() => {
  146. // this.grid.recalculate();
  147. // });
  148. return this.state?.showSearchForm;
  149. }
  150. unmount() {
  151. this.isMounted = false;
  152. this.stateHandler.reset();
  153. this.viewedRowHelper = null;
  154. }
  155. }