ngx-axis-appforge 0.0.2 → 0.0.3

package/axis-components/table/table-setter/table-setter.css

@@ -1,55 +0,0 @@
-.container {
-    height: 350px;
-    display: flex;
-    flex-direction: column;
-}
-
-.list {
-    min-height: 60px;
-    border-radius: 4px;
-    overflow-x: hidden;
-    overflow-y: auto;
-    display: block;
-    border: 1px dashed #ccc;
-    flex: 1 1 auto;
-}
-
-.list>.box {
-    cursor: move;
-}
-
-.cdk-drag-preview {
-    box-sizing: border-box;
-    border-radius: 4px;
-    box-shadow:
-        0 5px 5px -3px rgba(0, 0, 0, 0.2),
-        0 8px 10px 1px rgba(0, 0, 0, 0.14),
-        0 3px 14px 2px rgba(0, 0, 0, 0.12);
-}
-
-.cdk-drag-placeholder {
-    opacity: 0;
-}
-
-.cdk-drag-animating {
-    transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
-}
-
-.list.cdk-drop-list-dragging .box:not(.cdk-drag-placeholder) {
-    transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
-}
-
-.box {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    align-items: center;
-    box-sizing: border-box;
-    margin: 4px;
-    padding: 4px 8px;
-    background-color: rgb(0 112 204 / 15%);
-}
-
-.box span {
-    cursor: pointer;
-}

package/axis-components/table/table-setter/table-setter.html

@@ -1,38 +0,0 @@
-<a nz-button nzType="link" nzSize="small" (click)="modalVisible.set(true)" style="margin: 2px;">
-    <nz-icon nzType="setting" nzTheme="outline" />
-</a>
-<nz-modal [(nzVisible)]="modalVisible" nzTitle="表头设置" nzDraggable [nzOkText]="null" nzCancelText="关闭"
-    (nzOnCancel)="modalVisible.set(false)">
-    <ng-container *nzModalContent>
-        <div nz-row [nzGutter]="24">
-            <div nz-col class="gutter-row" [nzSpan]="12">
-                <div class="container">
-                    <p>展示字段<a nz-button nzType="link" (click)="resetDefault()">恢复默认</a></p>
-                    <div cdkDropList #todoList="cdkDropList" [cdkDropListData]="fix()"
-                        [cdkDropListConnectedTo]="[doneList]" class="list" (cdkDropListDropped)="drop($event)">
-                        @for (item of fix(); track item; let i = $index) {
-                        <div class="box" cdkDrag>
-                            {{ item.title() }}
-                            <nz-icon nzType="minus-circle" nzTheme="outline" (click)="deleteCustom(i)" />
-                        </div>
-                        }
-                    </div>
-                </div>
-            </div>
-            <div nz-col class="gutter-row" [nzSpan]="12">
-                <div class="container">
-                    <p>隐藏字段</p>
-                    <div cdkDropList #doneList="cdkDropList" [cdkDropListData]="notFix()"
-                        [cdkDropListConnectedTo]="[todoList]" class="list" (cdkDropListDropped)="drop($event)">
-                        @for (item of notFix(); track item; let i = $index) {
-                        <div class="box" cdkDrag>
-                            {{ item.title() }}
-                            <nz-icon nzType="plus-circle" nzTheme="outline" (click)="addCustom(i)" />
-                        </div>
-                        }
-                    </div>
-                </div>
-            </div>
-        </div>
-    </ng-container>
-</nz-modal>

package/axis-components/table/table-setter/table-setter.ts

@@ -1,121 +0,0 @@
-import { ChangeDetectionStrategy, Component, effect, input, model, OnDestroy, output, signal } from '@angular/core';
-import { NzButtonModule } from 'ng-zorro-antd/button';
-import { NzGridModule } from 'ng-zorro-antd/grid';
-import { NzIconModule } from 'ng-zorro-antd/icon';
-import { NzModalModule } from 'ng-zorro-antd/modal';
-import { CdkDrag, CdkDragDrop, CdkDropList, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';
-import { TableFieldOptions } from '../table.options';
-import { NzResizeEvent } from 'ng-zorro-antd/resizable';
-import { debounceTime, Subject, Subscription } from 'rxjs';
-
-
-@Component({
-  selector: 'axis-table-setter',
-  imports: [NzIconModule, NzButtonModule, NzModalModule, NzGridModule, CdkDrag, CdkDropList],
-  templateUrl: './table-setter.html',
-  styleUrl: './table-setter.css',
-  changeDetection: ChangeDetectionStrategy.OnPush
-})
-export class TableSetter implements OnDestroy {
-
-  constructor() {
-    effect(() => this.buildFixAndNotFixColumn());
-    effect(() => this.onChange.emit(this.fix()));
-    this.sub = this.saveCacheSubject.pipe(debounceTime(200)).subscribe(v => this.saveCache());
-  }
-
-  readonly fields = input.required<TableFieldOptions[]>();
-  readonly cacheKey = input<string>();
-  readonly onChange = output<TableFieldOptions[]>();
-
-  readonly modalVisible = model(false);
-  readonly fix = signal<TableFieldOptions[]>([]);
-  readonly notFix = signal<TableFieldOptions[]>([]);
-
-  saveCacheSubject = new Subject<void>();
-  cache: { fix: string[], notFix: string[], widths: { [field: string]: number } } = { fix: [], notFix: [], widths: {} };
-  sub?: Subscription;
-
-  private buildFixAndNotFixColumn(): void {
-    this.loadCache();
-    if (this.cache) {
-      const fieldMap = new Map<string, TableFieldOptions>();
-      for (const f of this.fields()) {
-        fieldMap.set(f.field(), f);
-        if (this.cache.widths.hasOwnProperty(f.field())) {
-          f.width.set(this.cache.widths[f.field()]);
-        }
-      }
-      this.fix.set(this.cache.fix.filter(f => fieldMap.has(f)).map(f => fieldMap.get(f)!)
-        .concat(this.fields().filter(f => !this.cache!.fix.includes(f.field()) && !this.cache!.notFix.includes(f.field()))));
-      this.notFix.set(this.cache.notFix.filter(f => fieldMap.has(f)).map(f => fieldMap.get(f)!));
-    } else {
-      this.fix.set(this.fields());
-    }
-  }
-
-  private loadCache() {
-    if (this.cacheKey()) {
-      const cacheStr = localStorage.getItem(this.cacheKey()!);
-      if (cacheStr) {
-        try {
-          this.cache = JSON.parse(cacheStr);
-        } catch (_) { }
-      }
-    }
-  }
-
-  private saveCache() {
-    if (this.cacheKey()) {
-      localStorage.setItem(this.cacheKey()!, JSON.stringify(this.cache));
-    }
-  }
-
-  private updateFix(): void {
-    this.fix.set([...this.fix()]);
-    this.notFix.set([...this.notFix()]);
-    if (this.cacheKey()) {
-      this.cache.fix = this.fix().map(f => f.field());
-      this.cache.notFix = this.notFix().map(f => f.field());
-      this.saveCache();
-    }
-  }
-
-  drop(event: CdkDragDrop<TableFieldOptions[], any, any>): void {
-    if (event.previousContainer === event.container) {
-      moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
-    } else {
-      transferArrayItem(event.previousContainer.data, event.container.data, event.previousIndex, event.currentIndex);
-    }
-    this.updateFix();
-  }
-
-  deleteCustom(index: number): void {
-    transferArrayItem(this.fix(), this.notFix(), index, this.notFix().length);
-    this.updateFix();
-  }
-
-  addCustom(index: number): void {
-    transferArrayItem(this.notFix(), this.fix(), index, this.fix().length);
-    this.updateFix();
-  }
-
-  onResize(field: TableFieldOptions, event: NzResizeEvent) {
-    field.width.set(event.width ?? null);
-    this.cache.widths[field.field()] = event.width!;
-    this.saveCacheSubject.next();
-  }
-
-  resetDefault() {
-    this.fix.set(this.fields());
-    this.notFix.set([]);
-    if (this.cacheKey()) {
-      localStorage.removeItem(this.cacheKey()!);
-    }
-  }
-
-  ngOnDestroy(): void {
-    this.sub?.unsubscribe();
-    this.saveCacheSubject.unsubscribe();
-  }
-}

package/axis-components/table/table.css

@@ -1,5 +0,0 @@
-:host {
-    display: block;
-    width: 100%;
-    overflow: hidden;
-}

package/axis-components/table/table.html

@@ -1,191 +0,0 @@
-@if (options.showTableTitleSet()) {
-<axis-table-setter [fields]="fields()" [cacheKey]="options.tableSetCacheKey()"
-    (onChange)="fixFields.set($event)"></axis-table-setter>
-}
-<nz-table #table [nzSize]="options.size()" [nzData]="displayData()??[]" [nzLoading]="!displayData()"
-    [nzBordered]="options.bordered()" [nzOuterBordered]="options.outerBordered()"
-    [nzShowPagination]="options.showPagination()"
-    [nzFrontPagination]="options.showPagination() && !options.useBackEndPaging()" [nzTotal]="rowtotal()"
-    [nzPageSize]="options.pageSize()" [nzShowSizeChanger]="options.showSizeChanger()"
-    [nzPageSizeOptions]="pageSizeOptions()" [nzShowTotal]="options.showDataSize()?totalRange:null" [nzScroll]="scroll()"
-    (nzCurrentPageDataChange)="currentPageDataChange()" (nzPageIndexChange)="onPageChange()"
-    (nzPageSizeChange)="onPageChange()" [(nzPageIndex)]="pageIndex" [nzVirtualItemSize]="options.virtualItemSize()"
-    [nzVirtualForTrackBy]="trackByKeyField">
-    <thead>
-        <tr>
-            @if (options.showCheckbox()) {
-            @if (!options.checkboxLinkageForExpand() && !options.singleCheck()) {
-            <th nzLeft [nzChecked]="select.headerChecked()!='none'"
-                [nzIndeterminate]="select.headerChecked()=='indeterminate'"
-                (nzCheckedChange)="select.onAllChecked($event)" nzAlign="center" [nzWidth]="leaderFieldWidth()-10+'px'">
-            </th>
-            }@else {
-            <th nzLeft [nzWidth]="leaderFieldWidth()-10+'px'"></th>
-            }
-            }
-            @if (options.showExpand()) {
-            <th nzLeft nzAlign="center" [nzWidth]="leaderFieldWidth()-15+'px'"></th>
-            }
-            @if (options.showOrder()) {
-            <th nzAlign="center" [nzWidth]="leaderFieldWidth()+'px'">序号</th>
-            }
-            @for (f of displayFields(); track f.field()) {
-            <th [attr.data-field]="f.field()" nz-resizable nzBounds="window"
-                [nzDisabled]="!options.showTableTitleSet() || !f.width()"
-                [nzWidth]="f.width() == null ?null:f.width()+'px'" (nzResize)="tableSetter?.onResize(f,$event)"
-                [nzShowSort]="f.sortAble()" [nzSortFn]="fieldsControlsMap()[f.field()]?.sortFn"
-                [nzSortOrder]="f.sortOrder()" [nzSortPriority]="f.sortPriority()??false"
-                [nzShowFilter]="f.filterAble() && !options.useBackEndPaging()"
-                [nzFilters]="fieldsControlsMap()[f.field()]?.filterItems ?? []"
-                [nzFilterFn]="fieldsControlsMap()[f.field()]?.filterFn"
-                (nzFilterChange)="filterChange(f.field(),$event)" [nzFilterMultiple]="f.filterMultiple()"
-                [nzAlign]="f.align()" [nzLeft]="f.freezeMode()=='left'" [nzRight]="f.freezeMode()=='right'"
-                (nzSortOrderChange)="sortChange(f.field(),$event)">
-                <span>
-                    {{f.title()}}
-                    @if(options.showTableTitleSet()){
-                    <nz-resize-handle [style.transform]="`translateX(${resizeHandleOffsetX(f)}px)`" nzDirection="right"
-                        (click)="$event.stopPropagation()">
-                        <div class="resize-trigger"></div>
-                    </nz-resize-handle>
-                    }
-                </span>
-            </th>
-            }
-            @if (rowActions().length)
-            {
-            <th nzRight nzAlign="center" [nzWidth]="actionsFieldWidth()+'px'" data-rowactions>操作</th>
-            }
-        </tr>
-    </thead>
-    <tbody>
-        @if (!options.showPagination() && options.virtualScroll()) {
-        <ng-template nz-virtual-scroll let-data let-i="index">
-        </ng-template>
-        }@else {
-        @for (data of table.data; track $index;let i=$index) {
-        <tr [axisScope]="options.id+'.row'" [attr.data-appid]="data.appid" scopeName="表格行"
-            [dataSources]="[{name:'row',type:'local',data:data}]" (dblclick)="select.toggleChecked(data)">
-            @if (options.showCheckbox()) {
-            <td nzLeft [nzChecked]="select.setOfCheckedId.has(data[options.keyField()])"
-                [nzIndeterminate]="select.setOfIndeterminateId.has(data[options.keyField()])"
-                [nzDisabled]="select.setOfDisabledId().has(data[options.keyField()])"
-                (nzCheckedChange)="select.onItemChecked(data, $event)" nzAlign="center"></td>
-            }
-            @if (options.showExpand()) {
-            <td nzLeft [nzExpand]="expand.expandedSet.has(data[options.keyField()])"
-                (nzExpandChange)="expand.onExpandChange(data[options.keyField()],$event)"></td>
-            }
-            @if (options.showOrder()) {
-            <td nzAlign="center">{{(table.nzPageIndex-1) * table.nzPageSize + i+1}}</td>
-            }
-            @for (f of displayFields(); track f.field()) {
-            @if (rowspan(f.field(),i)) {
-            <td [attr.rowspan]="rowspan(f.field(),i)" [nzLeft]="f.freezeMode()=='left'" [attr.data-field]="f.field()"
-                [nzRight]="f.freezeMode()=='right'" [nzAlign]="f.align()">
-                @if (f.child()) {
-                <ng-container [axisDynamic]="f.child()"></ng-container>
-                }@else {
-                {{data[f.field()]}}
-                }
-            </td>
-            }
-            }
-            @if (rowActions().length) {
-            <td nzRight>
-                <div nz-flex nzJustify="space-evenly" data-rowactions>
-                    @for (a of rowActions(); track a.id) {
-                    <ng-container [axisDynamic]="a"></ng-container>
-                    }
-                </div>
-            </td>
-            }
-        </tr>
-        @if (options.showExpand()) {
-        <tr [axisScope]="options.id+'.row'" scopeName="表格行" [dataSources]="[{name:'row',type:'local',data:data}]"
-            [nzExpand]="expand.expandedSet.has(data[options.keyField()])" data-expandrow>
-            <ng-container [axisDynamic]="options.expandRow()"></ng-container>
-        </tr>
-        }
-        <!-- @if (showSubTotal() && subTotalGroupField() && subTotalMap[i]) {
-        <tr>
-            @if (options.showCheckbox()) {
-            <td nzLeft></td>
-            }
-            @if (options.showExpand()) {
-            <td nzLeft></td>
-            }
-            @if (options.showOrder()) {
-            <td></td>
-            }
-            @for (f of displayFields(); track f.field()) {
-            @if (f.groupLevel && f.groupLevel! == subTotalGroupField.groupLevel!) {
-            <td nzAlign="right" [nzLeft]="f.freezeMode=='left'" [nzRight]="f.freezeMode=='right'">
-                <b>{{options.subTotalTitle() || "小计"}}</b>
-            </td>
-            }
-            @if(!f.groupLevel || f.groupLevel! > subTotalGroupField.groupLevel!) {
-            <td [nzLeft]="f.freezeMode=='left'" [nzRight]="f.freezeMode=='right'">
-                @if (f.totalAble) {
-                <div [class]="'td-box-'+(f.align || 'center')">
-                    <b>
-                        @if (f.child()) {
-                        @if (f.injectBy() == "data") {
-                        <ng-container [axisDynamic]="f.child()"></ng-container>
-                        }@else{
-                        <ng-container [axisDynamic]="f.child()" [ngModel]="subTotalMap[i][f.field]"></ng-container>
-                        }
-                        }@else {
-                        {{subTotalMap[i][f.field]}}
-                        }
-                    </b>
-                </div>
-                }
-            </td>
-            }
-            }
-            <td *ngIf="rowActions?.length" nzRight></td>
-        </tr>
-        } -->
-        }
-        }
-        <!-- @if (showTotal && displayData?.length) {
-        <tr class="total-row">
-            @if (options.showCheckbox()) {
-            <td nzLeft></td>
-            }
-            @if (options.showExpand()) {
-            <td nzLeft></td>
-            }
-            <td nzAlign="right" [nzLeft]="!options.showOrder() && displayFields[0].freezeMode=='left'"
-                [nzRight]="!options.showOrder() && displayFields[0].freezeMode=='right'"><b>{{options.totalTitle() ||
-                    "合计"}}</b></td>
-            @for (f of displayFields()|slice:(options.showOrder()?0:1); track f.field()) {
-            <td [nzLeft]="f.freezeMode=='left'" [nzRight]="f.freezeMode=='right'">
-                @if (f.totalAble()) {
-                <div [class]="'td-box-'+(f.align || 'center')">
-                    <b>
-                        @if (f.child()) {
-                        @if (f.injectBy() == "data") {
-                        <ng-container [axisDynamic]="f.child()"></ng-container>
-                        }@else{
-                        <ng-container [axisDynamic]="f.child()" [ngModel]="totalMap[f.field]"></ng-container>
-                        }
-                        }@else {
-                        {{totalMap[f.field]}}
-                        }
-                    </b>
-                </div>
-                }
-            </td>
-            }
-            @if (rowActions()?.length) {
-            <td nzRight></td>
-            }
-        </tr>
-        } -->
-    </tbody>
-    <ng-template #totalRange let-range="range" let-total>
-        共{{ total }}条数据，第{{ range[0] }}-{{ range[1] }}条
-    </ng-template>
-</nz-table>

package/axis-components/table/table.options.ts

@@ -1,72 +0,0 @@
-import { signal } from "@angular/core";
-import { DataOptions } from "ngx-axis-appforge/core";
-
-export class TableOptions extends DataOptions {
-    readonly keyField = signal("");
-    readonly showExpand = signal(false);
-    readonly showTableTitleSet = signal(false);
-    readonly tableSetCacheKey = signal("");
-    readonly size = signal<'middle' | 'small' | 'default'>("middle");
-    readonly showOrder = signal(true);
-    readonly heightExpanded = signal(false);
-    readonly showDataSize = signal(true);
-    readonly bordered = signal(false);
-    readonly outerBordered = signal(false);
-    readonly width = signal<string | undefined>(undefined);
-    readonly actionsFieldWidth = signal<number | null>(null);
-    readonly showCheckbox = signal(false);
-    readonly singleCheck = signal(false);
-    readonly checkboxLinkageForExpand = signal(false);
-    readonly disableCheckboxFn = signal<string | undefined>(undefined);
-    readonly enableRowClick = signal(false);
-    readonly defaultSelectFirstRow = signal(false);
-    readonly showTotal = signal(false);
-    readonly totalTitle = signal("合计");
-    readonly showSubTotal = signal(false);
-    readonly subTotalTitle = signal("小计");
-    readonly subTotalGroupLevel = signal(1);
-    readonly showPagination = signal(true);
-    readonly virtualScroll = signal(false);
-    readonly virtualItemSize = signal(32);
-    readonly pageSize = signal(10);
-    readonly showSizeChanger = signal(true);
-    readonly pageSizeOptions = signal("10,20,50,100");
-    readonly useBackEndPaging = signal(false);
-    readonly pageParamsDataSourceName = signal("pageParams");
-    readonly exportParamsDataSourceName = signal("exportParams");
-    readonly exportFileName = signal("数据导出");
-    readonly exportBookType = signal("xlsx");
-    readonly importLimitLength = signal<number | null>(null);
-    readonly importStartLine = signal(2);
-    readonly importTemplateFileName = signal("数据导入模版");
-    readonly importExampleData = signal<any>([]);
-    readonly fields = signal<any[]>([]);
-    readonly rowActions = signal<any[]>([]);
-    readonly expandRow = signal<any>(undefined);
-}
-
-export class TableFieldOptions {
-    readonly inuse = signal(true);
-    readonly field = signal("unknown");
-    readonly title = signal("未命名");
-    readonly export = signal(false);
-    readonly exportFlowChild = signal(true);
-    readonly exportFn = signal<string | undefined>(undefined);
-    readonly import = signal(false);
-    readonly importRequired = signal(false);
-    readonly importCellType = signal<"text" | "number">("text");
-    readonly importHelp = signal<string | undefined>(undefined);
-    readonly sortAble = signal(false);
-    readonly sortOrder = signal<"descend" | "ascend" | null>(null);
-    readonly sortPriority = signal<number | null>(null);
-    readonly filterAble = signal(false);
-    readonly filterMultiple = signal(false);
-    readonly width = signal<number | null>(null);
-    readonly align = signal<'left' | 'right' | 'center'>("left");
-    readonly freezeMode = signal<'none' | 'left' | 'right'>("none");
-    readonly groupLevel = signal<number | null>(null);
-    readonly totalAble = signal(false);
-    readonly totalFn = signal<string | undefined>(undefined);
-    readonly titleGroup = signal<string | undefined>(undefined);
-    readonly child = signal<any>(undefined);
-}