// src/app/piying/page/component/extension/table/example/base/content.ts
import * as v from 'valibot';
import { actions, hideWhen, NFCSchema, setAlias } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
import {
  CheckboxService,
  SortService,
  TableExpandService,
  tableInputDefine,
  TableResourceService,
} from '@piying-lib/angular-daisyui/extension';
import { computed } from '@angular/core';
import { map, startWith } from 'rxjs';
export default v.pipe(
  v.tuple([
    v.pipe(
      v.object({
        table: v.pipe(
          NFCSchema,
          actions.providers.patch([CheckboxService, TableExpandService, SortService]),
          actions.hooks.merge({
            allFieldsResolved: (field) => {
              const sort = field.injector.get(SortService);
              sort.sortList.set(['title1', 'badge1']);
              sort.setInitValue({
                badge1: 1,
              });
              sort.value$$.subscribe((value) => {
                field.injector.get(TableResourceService).setParams('sort', value);
              });
              field.injector.get(CheckboxService).init();
              field.injector.get(TableExpandService).init({ _multiple: true });
            },
          }),
          safeDefine.setComponent('table', (actions) => {
            return [
              actions.inputs.patchAsync({
                define: (field) => {
                  const pageFiled = field.get(['..', 'page']);
                  return tableInputDefine({
                    expand: {
                      head: ' ',
                      body: v.pipe(
                        NFCSchema,
                        safeDefine.setComponent('table-expand-cell', (actions) => {
                          return [actions.wrappers.set(['td'])];
                        }),
                      ),
                    },
                    checkbox: {
                      head: v.pipe(
                        v.boolean(),
                        safeDefine.setComponent('checkbox', (actions) => {
                          return [actions.wrappers.set(['td', 'table-checkbox-all'])];
                        }),
                      ),
                      body: v.pipe(
                        v.boolean(),
                        safeDefine.setComponent('checkbox', (actions) => {
                          return [actions.wrappers.set(['td', 'table-checkbox-body'])];
                        }),
                      ),
                    },
                    index: {
                      head: '索引',
                      body: (node: any, index: number) => {
                        const { pageQueryParams } = pageFiled!.props();
                        return `${index + 1 + pageQueryParams.index * pageQueryParams.size}`;
                      },
                    },
                    '0': {
                      head: '测试',
                      body: (data: any) => {
                        return data.title1;
                      },
                    },
                    '1': {
                      head: 'badge',
                      body: v.pipe(
                        NFCSchema,
                        safeDefine.setComponent('badge', (actions) => {
                          return [
                            actions.wrappers.set(['td']),
                            actions.inputs.patchAsync({
                              content: ({ context }) => {
                                return computed(() => context.item$().badge1);
                              },
                            }),
                          ];
                        }),
                      ),
                    },
                    '2': {
                      head: v.pipe(
                        NFCSchema,
                        safeDefine.setComponent('button', (actions) => {
                          return [
                            actions.inputs.patch({ content: '1234' }),
                            actions.wrappers.set(['td', 'sort-header']),
                            actions.props.patch({
                              key: 'title1',
                            }),
                          ];
                        }),
                      ),
                    },
                    '3': {
                      head: v.pipe(
                        NFCSchema,
                        safeDefine.setComponent('button', (actions) => {
                          return [
                            actions.inputs.patch({ content: '666' }),
                            actions.wrappers.set(['td', 'sort-header']),
                            actions.props.patch({
                              key: 'badge1',
                            }),
                          ];
                        }),
                      ),
                    },
                    extra: {
                      body: v.pipe(
                        NFCSchema,
                        safeDefine.setComponent('button', (actions) => {
                          return [
                            actions.wrappers.set(['td']),
                            hideWhen({
                              listen(fn, field) {
                                const sm = field.injector.get(TableExpandService).selectionModel$$;
                                return sm.pipe(
                                  map((value) => {
                                    return !value.isSelected(field.context.item$());
                                  }),
                                  startWith(true),
                                );
                              },
                            }),
                          ];
                        }),
                      ),
                    },
                  })(() => {
                    return {
                      head: [{ columns: ['expand', 'checkbox', 'index', '1', '2', '3'] }],
                      body: [
                        {
                          define: v.pipe(v.tuple([]), safeDefine.setComponent('tr')),
                          columns: ['expand', 'checkbox', 'index', '1'],
                        },
                        {
                          define: v.pipe(v.tuple([]), safeDefine.setComponent('tr')),
                          columns: ['extra'],
                        },
                      ],
                    };
                  });
                },
                data: (field) => {
                  return field.injector.get(TableResourceService).list$$;
                },
              }),
            ];
          }),
        ),
        page: v.pipe(
          NFCSchema,
          safeDefine.setComponent('pagination', (actions) => {
            return [
              actions.inputs.patch({
                value: {
                  size: 2,
                  index: 0,
                },
              }),
              actions.inputs.patchAsync({
                count: (field) => {
                  return field.injector.get(TableResourceService).count$$;
                },
              }),
            ];
          }),
          actions.outputs.patchAsync({
            valueChange: (field) => {
              return (data) => {
                field.injector.get(TableResourceService).setParams('page', data);
              };
            },
          }),
        ),
      }),
      setAlias('table-page'),
      actions.wrappers.set([{ type: 'loading-wrapper' }]),
      actions.props.patchAsync({
        isLoading: (field) => field.injector.get(TableResourceService).isLoading$$,
      }),
      actions.providers.patch([TableResourceService]),
      actions.hooks.merge({
        allFieldsResolved: (field) => {
          field.injector.get(TableResourceService).setRequest(async (inputs, needUpdate) => {
            await new Promise<void>((res) => {
              setTimeout(() => {
                res();
              }, 1000);
            });
            return [
              3,
              [
                {
                  title1: '测试内容1',
                  badge1: 'data1',
                },
                {
                  title1: '测试内容2',
                  badge1: 'data2',
                },
                {
                  title1: '测试内容3',
                  badge1: 'data3',
                },
              ],
            ];
          });
        },
      }),
    ),
  ]),
  actions.wrappers.patch(['div']),
  actions.class.top('flex gap-4'),
);

// src/app/piying/page/component/extension/table/example/category/content.ts
import * as v from 'valibot';
import { hideWhen, NFCSchema } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
import { actions as DActions } from '@piying/view-angular';
import {
  ExpandRowDirective,
  TableExpandService,
  TableResourceService,
} from '@piying-lib/angular-daisyui/extension';
import { map, startWith } from 'rxjs';
import { range } from 'es-toolkit';
export default v.object({
  table: v.pipe(
    NFCSchema,
    safeDefine.setComponent('table', (actions) => {
      return [
        actions.inputs.patch({ type: 'category', pin: { rows: true } }),
        actions.inputs.patchAsync({
          define: (field) => {
            return {
              row: {
                head: [{ columns: ['0'] }],
                body: [
                  {
                    columns: ['0'],
                  },
                  {
                    columns: ['extra'],
                    define: v.pipe(
                      v.tuple([]),
                      safeDefine.setComponent('tr', (actions) => {
                        return [
                          DActions.directives.set([
                            {
                              type: ExpandRowDirective,
                            },
                          ]),
                          hideWhen({
                            listen(fn, field) {
                              const sm = field.injector.get(TableExpandService).selectionModel$$;
                              return sm.pipe(
                                map((value) => value.isSelected(field.context.item$())),
                                startWith(true),
                              );
                            },
                          }),
                        ];
                      }),
                    ),
                  },
                ],
              },
              columns: {
                '0': {
                  head: (data: any) => {
                    return data;
                  },
                  body: (node: any, index: number) => {
                    return node;
                  },
                },
                extra: {
                  head: (data: any) => {
                    return data;
                  },
                  body: (node: any, index: number) => {
                    return `extra-${node}`;
                  },
                },
              },
            };
          },
        }),
        actions.inputs.patchAsync({
          data: (field) => {
            return field.injector.get(TableResourceService).list$$;
          },
        }),
        actions.class.component('h-100'),
        actions.providers.patch([TableExpandService, TableResourceService]),
        actions.hooks.merge({
          allFieldsResolved: (field) => {
            field.injector.get(TableExpandService).init();
            field.injector.get(TableResourceService).setRequest(() => {
              const list = range(1, 100).map((index) => {
                return [`k${index}`, range(4).map((i) => `k${index}v${i}`)];
              });
              return [list.length, list];
            });
          },
        }),
      ];
    }),
  ),
});

// src/app/piying/page/component/extension/table/example/form/content.ts
import * as v from 'valibot';
import { actions } from '@piying/view-angular-core';
import { safeDefine } from '@@piying-define';
import { computed } from '@angular/core';

export default v.pipe(
  v.tuple([
    v.pipe(
      v.object({
        table: v.pipe(
          v.array(
            v.object({
              k1: v.pipe(v.string(), v.title('k1-title'), actions.wrappers.set(['td'])),
              k2: v.pipe(v.number(), v.title('k2-title'), actions.wrappers.set(['td'])),
            }),
          ),
          safeDefine.setComponent('table-group', (actions) => {
            return [
              actions.inputs.patch({ zebra: true, range: [0, 2], disableAdd: false }),
              actions.class.component('rounded-box border border-base-content/5 bg-base-100'),
            ];
          }),
          actions.hooks.merge({
            allFieldsResolved: (field) => {
              setTimeout(() => {
                field.form.control!.updateValue([
                  { k1: '11', k2: 66 },
                  { k1: '22', k2: 77 },
                  { k1: '33', k2: 88 },
                  { k1: '44', k2: 99 },
                ]);
              }, 0);
            },
          }),
        ),
        page: safeDefine.nfcComponent('pagination', (actions) => {
          return [
            actions.class.top('mt-4 flex justify-end'),
            actions.inputs.patch({
              value: {
                size: 2,
                index: 0,
              },
            }),
            actions.inputs.patchAsync({
              count: (field) => {
                const tableField = field.get(['..', 'table'])!;
                return computed(() => {
                  return tableField.children!().length;
                });
              },
            }),
            actions.outputs.patchAsync({
              valueChange: (field) => {
                return (data) => {
                  const control = field.get(['..', 'table'])!;
                  const start = data.index * data.size;
                  control.inputs.update((inputs) => {
                    return {
                      ...inputs,
                      range: [start, start + data.size],
                    };
                  });
                };
              },
            }),
          ];
        }),
      }),
      actions.wrappers.patch(['div']),
    ),
    v.pipe(
      v.object({
        table: v.pipe(
          v.array(
            v.object({
              k1: v.pipe(v.string(), v.title('k1-title'), actions.wrappers.set(['td'])),
              k2: v.pipe(v.number(), v.title('k2-title'), actions.wrappers.set(['td'])),
            }),
          ),
          safeDefine.setComponent('table-group', (actions) => {
            return [
              actions.inputs.patch({ zebra: true }),
              actions.class.component('rounded-box border border-base-content/5 bg-base-100'),
            ];
          }),
          actions.hooks.merge({
            allFieldsResolved: (field) => {
              setTimeout(() => {
                field.form.control!.updateValue([
                  { k1: '11', k2: 66 },
                  { k1: '22', k2: 77 },
                  { k1: '33', k2: 88 },
                  { k1: '44', k2: 99 },
                ]);
              }, 0);
            },
          }),
        ),
      }),
      actions.wrappers.patch(['div']),
    ),
  ]),
  actions.wrappers.patch(['div']),
  actions.class.top('grid gap-4'),
);