ngx-axis-appforge 0.0.2 → 0.0.3

package/axis-components/badge/design/setting/setting.html

@@ -1,181 +0,0 @@
-<form [formGroup]="fg" nz-form>
-    <nz-collapse [nzBordered]="false">
-        <nz-collapse-panel nzHeader="基本设置" nzActive>
-            <nz-form-item>
-                <nz-form-label nzSpan="8" nzRequired>
-                    类型
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="type">
-                        <nz-select ngModel [ngModelOptions]="{standalone:true}">
-                            <nz-option nzValue="badge" nzLabel="徽标"></nz-option>
-                            <nz-option nzValue="status" nzLabel="状态"></nz-option>
-                            <nz-option nzValue="ribbon" nzLabel="缎带"></nz-option>
-                        </nz-select>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            <nz-form-item>
-                <nz-form-label nzSpan="8">
-                    颜色
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field [(ngModel)]="color" [ngModelOptions]="{standalone:true}"
-                        (ngModelChange)="setColorFormValue()">
-                        <nz-color-picker nzDefaultValue="#00000000" ngModel [ngModelOptions]="{standalone:true}"
-                            nzAllowClear></nz-color-picker>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-        </nz-collapse-panel>
-        @if (formValue()?.type.funMode || formValue()?.type.originValue === 'badge') {
-        <nz-collapse-panel nzHeader="徽标">
-            <nz-form-item>
-                <nz-form-label nzSpan="8" nzRequired>
-                    小红点
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="dot">
-                        <nz-switch ngModel [ngModelOptions]="{standalone:true}"></nz-switch>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            @if (formValue()?.dot.funMode || !formValue()?.dot.originValue) {
-            <nz-form-item>
-                <nz-form-label nzSpan="8" nzRequired>
-                    大小
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="size">
-                        <nz-radio-group ngModel [ngModelOptions]="{standalone:true}">
-                            <label nz-radio-button nzValue="small">小</label>
-                            <label nz-radio-button nzValue="default">大</label>
-                        </nz-radio-group>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            }
-            <nz-form-item>
-                <nz-form-label nzSpan="8">
-                    数值
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="count">
-                        <nz-input-number style="width: 100%;" [nzMin]="0" ngModel
-                            [ngModelOptions]="{standalone:true}"></nz-input-number>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            @if (formValue()?.dot.funMode || !formValue()?.dot.originValue) {
-            <nz-form-item>
-                <nz-form-label nzSpan="8">
-                    最大数值
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="overflowCount">
-                        <nz-input-number style="width: 100%;" [nzMin]="0" ngModel
-                            [ngModelOptions]="{standalone:true}"></nz-input-number>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            <nz-form-item>
-                <nz-form-label nzSpan="8" nzRequired>
-                    零值显示
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="showZero">
-                        <nz-switch ngModel [ngModelOptions]="{standalone:true}"></nz-switch>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            }
-            <nz-form-item>
-                <nz-form-label nzSpan="8">
-                    位置偏移
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <nz-space-compact nzBlock>
-                        <nz-input-number [(ngModel)]="offsetX" [ngModelOptions]="{standalone:true}"
-                            (ngModelChange)="setOffsetFormValue()">
-                            <span nzInputPrefix>x:</span>
-                        </nz-input-number>
-                        <nz-input-number [(ngModel)]="offsetY" [ngModelOptions]="{standalone:true}"
-                            (ngModelChange)="setOffsetFormValue()">
-                            <span nzInputPrefix>y:</span>
-                        </nz-input-number>
-                        <button nz-button nzSize="small" nzType="link" nzDanger (click)="resetOffset()">
-                            <nz-icon nzType="delete"></nz-icon>
-                        </button>
-                    </nz-space-compact>
-                </nz-form-control>
-            </nz-form-item>
-            <nz-form-item>
-                <nz-form-label nzSpan="8">
-                    提示
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="title">
-                        <input nz-input ngModel [ngModelOptions]="{standalone:true}" />
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-        </nz-collapse-panel>
-        }@else if (formValue()?.type.funMode || formValue()?.type.originValue === "status") {
-        <nz-collapse-panel nzHeader="状态">
-            <nz-form-item>
-                <nz-form-label nzSpan="8" nzRequired>
-                    状态
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="status">
-                        <nz-select ngModel [ngModelOptions]="{standalone:true}">
-                            <nz-option nzValue="success" nzLabel="成功"></nz-option>
-                            <nz-option nzValue="processing" nzLabel="处理中"></nz-option>
-                            <nz-option nzValue="default" nzLabel="默认"></nz-option>
-                            <nz-option nzValue="error" nzLabel="错误"></nz-option>
-                            <nz-option nzValue="warning" nzLabel="警告"></nz-option>
-                        </nz-select>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            <nz-form-item>
-                <nz-form-label nzSpan="8">
-                    文本
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="text">
-                        <input nz-input ngModel [ngModelOptions]="{standalone:true}" />
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-        </nz-collapse-panel>
-        }@else if (formValue()?.type.funMode || formValue()?.type.originValue === "ribbon") {
-        <nz-collapse-panel nzHeader="缎带">
-            <nz-form-item>
-                <nz-form-label nzSpan="8" nzRequired>
-                    位置
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="placement">
-                        <nz-radio-group ngModel [ngModelOptions]="{standalone:true}">
-                            <label nz-radio-button nzValue="start">头部</label>
-                            <label nz-radio-button nzValue="end">尾部</label>
-                        </nz-radio-group>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            <nz-form-item>
-                <nz-form-label nzSpan="8">
-                    文本
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="text">
-                        <input nz-input ngModel [ngModelOptions]="{standalone:true}" />
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-        </nz-collapse-panel>
-        }
-        <axis-base-design-setting [fg]="fg"></axis-base-design-setting>
-    </nz-collapse>
-</form>

package/axis-components/badge/design/setting/setting.ts

@@ -1,126 +0,0 @@
-import { ChangeDetectionStrategy, Component, model } from '@angular/core';
-import { FormsModule, ReactiveFormsModule, UntypedFormGroup } from '@angular/forms';
-import { NzButtonModule } from 'ng-zorro-antd/button';
-import { NzCollapseModule } from 'ng-zorro-antd/collapse';
-import { NzColorPickerModule } from 'ng-zorro-antd/color-picker';
-import { NzFormModule } from 'ng-zorro-antd/form';
-import { NzIconModule } from 'ng-zorro-antd/icon';
-import { NzInputModule } from 'ng-zorro-antd/input';
-import { NzInputNumberModule } from 'ng-zorro-antd/input-number';
-import { NzRadioModule } from 'ng-zorro-antd/radio';
-import { NzSelectModule } from 'ng-zorro-antd/select';
-import { NzSpaceModule } from 'ng-zorro-antd/space';
-import { NzSwitchModule } from 'ng-zorro-antd/switch';
-import { BaseDesignSetting, baseFbConfig, baseFunField, FormValidators, FunField, FunFieldOptions, FunFieldValueBase } from 'ngx-axis-appforge/core';
-
-@Component({
-  selector: 'axis-design-text-setting',
-  imports: [FormsModule, NzFormModule, ReactiveFormsModule, NzCollapseModule, BaseDesignSetting, FunField, NzSwitchModule, NzInputModule, NzInputNumberModule, NzColorPickerModule, NzRadioModule, NzSelectModule, NzSpaceModule, NzButtonModule, NzIconModule],
-  templateUrl: './setting.html',
-  styleUrl: './setting.css',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class Setting extends FunFieldValueBase {
-
-  override fg: UntypedFormGroup = this.fb.group({
-    ...baseFbConfig,
-    type: [undefined, FormValidators.requiredFun],
-    color: [],
-    count: [],
-    showDot: [undefined, FormValidators.requiredFun],
-    dot: [undefined, FormValidators.requiredFun],
-    overflowCount: [],
-    showZero: [undefined, FormValidators.requiredFun],
-    size: [undefined, FormValidators.requiredFun],
-    status: [undefined, FormValidators.requiredFun],
-    text: [],
-    title: [],
-    offset: [],
-    placement: [undefined, FormValidators.requiredFun],
-  });
-
-  protected override funFields: FunFieldOptions = {
-    ...baseFunField,
-    type: {
-      defaultValue: "badge"
-    },
-    color: {
-      defaultValue: undefined
-    },
-    count: {
-      defaultValue: null
-    },
-    showDot: {
-      defaultValue: true
-    },
-    dot: {
-      defaultValue: false
-    },
-    overflowCount: {
-      defaultValue: undefined
-    },
-    showZero: {
-      defaultValue: false
-    },
-    size: {
-      defaultValue: "default"
-    },
-    status: {
-      defaultValue: "default"
-    },
-    text: {
-      defaultValue: ""
-    },
-    title: {
-      defaultValue: ""
-    },
-    placement: {
-      defaultValue: "end"
-    },
-  };
-
-  override reset(value?: any): void {
-    super.reset(value);
-    if (this.formValue()?.color) {
-      this.color.set(this.formValue().color);
-    }
-    if (this.formValue()?.offset) {
-      this.offsetX.set(this.formValue().offset[0]);
-      this.offsetY.set(this.formValue().offset[1]);
-    }
-  }
-
-  readonly offsetX = model<number | null>(null);
-  readonly offsetY = model<number | null>(null);
-  readonly color = model<any>({ funMode: false });
-
-  setColorFormValue() {
-    if (!this.color().funMode && this.color().originValue?.endsWith("00")) {
-      this.fg.patchValue({
-        color: { ...this.color(), originValue: null }
-      });
-    } else {
-      this.fg.patchValue({
-        color: this.color()
-      });
-    }
-  }
-
-  resetOffset() {
-    this.offsetX.set(null);
-    this.offsetY.set(null);
-    this.setOffsetFormValue();
-  }
-
-  setOffsetFormValue() {
-    if (this.offsetX() != null || this.offsetY() != null) {
-      this.fg.patchValue({
-        offset: [this.offsetX() ?? 0, this.offsetY() ?? 0]
-      });
-    } else {
-      this.fg.patchValue({
-        offset: null
-      });
-    }
-  }
-}

package/axis-components/badge/ng-package.json

@@ -1,5 +0,0 @@
-{
-    "lib": {
-        "entryFile": "badge.ts"
-    }
-}

package/axis-components/button/button.css

@@ -1,3 +0,0 @@
-:host {
-    display: block;
-}

package/axis-components/button/button.html

@@ -1,13 +0,0 @@
-<button [nzLoading]="loading()" nz-button [nzSize]="options.size()" [nzType]="options.styleType()" nz-popconfirm
-    [nzPopconfirmTitle]="options.confirmText()"
-    [nzCondition]="!(options.confirm() && options.confirmType() == 'pop' && !loading())" (nzOnConfirm)="popConfirm()"
-    (click)="buttonClick()" [disabled]="options.disabledBtn()" [nzGhost]="options.ghost()" [nzBlock]="options.block()"
-    [nzDanger]="options.danger()" [nzShape]="options.shape()">
-    @if (options.icon()) {
-    <ng-container [axisDynamic]="options.icon()"></ng-container>
-    @if (options.title()) {
-    <span style="margin-right: 10px;"></span>
-    }
-    }
-    {{options.title()}}
-</button>

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

@@ -1,17 +0,0 @@
-import { signal } from "@angular/core";
-import { BaseOptions } from "ngx-axis-appforge/core";
-
-export class ButtonOptions extends BaseOptions {
-    readonly title = signal<string>("");
-    readonly icon = signal<any>(undefined);
-    readonly confirm = signal<boolean>(false);
-    readonly confirmType = signal<"modal" | "pop">("modal");
-    readonly confirmText = signal<string>("是否确认？");
-    readonly disabledBtn = signal<boolean>(false);
-    readonly styleType = signal<"default" | "primary" | "dashed" | "link" | "text">("default");
-    readonly ghost = signal<boolean>(false);
-    readonly size = signal<"large" | "small" | "default">("default");
-    readonly block = signal<boolean>(false);
-    readonly danger = signal<boolean>(false);
-    readonly shape = signal<null | "circle" | "round">(null);
-}

package/axis-components/button/button.ts

@@ -1,56 +0,0 @@
-import { ChangeDetectionStrategy, Component, signal } from '@angular/core';
-import { ButtonOptions } from './button.options';
-import { NzButtonModule } from 'ng-zorro-antd/button';
-import { CommonModule } from '@angular/common';
-import { NzPopconfirmModule } from 'ng-zorro-antd/popconfirm';
-import { DynamicDirective, Base } from 'ngx-axis-appforge/core';
-import { finalize } from 'rxjs';
-import { NzModalModule, NzModalService } from 'ng-zorro-antd/modal';
-
-@Component({
-  selector: 'axis-button',
-  imports: [CommonModule, DynamicDirective, NzButtonModule, NzPopconfirmModule, NzModalModule],
-  templateUrl: './button.html',
-  styleUrl: './button.css',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class Button extends Base<ButtonOptions> {
-
-  constructor(private modal: NzModalService) {
-    super();
-  }
-
-  protected override options: ButtonOptions = new ButtonOptions();
-
-  loading = signal(false);
-
-  buttonClick() {
-    if (this.loading()) {
-      return;
-    }
-    if (this.options.confirm() && this.options.confirmType() == "modal") {
-      this.modal.confirm({
-        nzContent: this.options.confirmText(),
-        nzOnOk: () => {
-          this.doSomething();
-        }
-      })
-    } else if (!this.options.confirm()) {
-      this.doSomething();
-    }
-  }
-
-  popConfirm() {
-    if (this.options.confirm() && this.options.confirmType() == "pop") {
-      this.doSomething();
-    }
-  }
-
-  doSomething() {
-    this.loading.set(true);
-    this.triggeEvents("buttonClick")
-      .pipe(finalize(() => this.loading.set(false)))
-      .subscribe();
-  }
-
-}

package/axis-components/button/design/config.ts

@@ -1,30 +0,0 @@
-import { Setting } from "./setting/setting";
-import { DesignConfig, NextInfo, DesignBuildResult, OptionsNode, DesignBindElementsResult, nameCode, SimpleMenu } from 'ngx-axis-appforge/core';
-
-export const Config: DesignConfig = {
-
-    componentName: "按钮",
-    buildOptionsNodes(nextInfo: NextInfo): DesignBuildResult {
-        return {
-            treeNode: new OptionsNode({
-                parentId: nextInfo.parentId,
-                scopeId: nextInfo.scopeId,
-                name: nameCode("按钮", nextInfo.currentObject.title),
-                canSetting: true,
-                canDrag: true,
-                dragType: "component",
-                parentObj: nextInfo.parentObject,
-                indexOfParentObj: nextInfo.indexOfParent,
-                rootOptions: nextInfo.currentObject,
-                settingType: Setting,
-                contextMenu: SimpleMenu,
-                icon: "border-outer"
-            })
-        };
-    },
-    bindElementsOptionsNode(element: HTMLElement, options: any): DesignBindElementsResult {
-        return {
-            [options.id]: { element }
-        }
-    },
-};

package/axis-components/button/design/ng-package.json

@@ -1,5 +0,0 @@
-{
-    "lib": {
-        "entryFile": "config.ts"
-    }
-}

package/axis-components/button/design/setting/setting.html

@@ -1,151 +0,0 @@
-<form [formGroup]="fg" nz-form>
-    <nz-collapse [nzBordered]="false">
-        <nz-collapse-panel nzHeader="外观设置" nzActive>
-            <nz-form-item>
-                <nz-form-label nzSpan="8">
-                    按钮文本
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="title">
-                        <input nz-input ngModel [ngModelOptions]="{standalone:true}" />
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            <nz-form-item>
-                <nz-form-label nzSpan="8">
-                    按钮图标
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="icon">
-                        <ng-container [axisDynamic]="{component:'axis-components/input-icon',inuse:true}"
-                            [standalone]="true" ngModel [ngModelOptions]="{standalone:true}"></ng-container>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            <nz-form-item>
-                <nz-form-label nzSpan="8" nzRequired>
-                    是否禁用
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="disabledBtn">
-                        <nz-switch ngModel [ngModelOptions]="{standalone:true}"></nz-switch>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            <nz-form-item>
-                <nz-form-label nzSpan="8" nzRequired>
-                    按钮类型
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="styleType">
-                        <nz-select ngModel [ngModelOptions]="{standalone:true}">
-                            <nz-option nzLabel="默认" nzValue="default"></nz-option>
-                            <nz-option nzLabel="主要" nzValue="primary"></nz-option>
-                            <nz-option nzLabel="虚线" nzValue="dashed"></nz-option>
-                            <nz-option nzLabel="链接" nzValue="link"></nz-option>
-                            <nz-option nzLabel="文本" nzValue="text"></nz-option>
-                        </nz-select>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            <nz-form-item>
-                <nz-form-label nzSpan="8" nzRequired>
-                    背景透明
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="ghost">
-                        <nz-switch ngModel [ngModelOptions]="{standalone:true}"></nz-switch>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            <nz-form-item>
-                <nz-form-label nzSpan="8" nzRequired>
-                    按钮大小
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="size">
-                        <nz-radio-group ngModel [ngModelOptions]="{standalone:true}">
-                            <label nz-radio-button nzValue="large">大</label>
-                            <label nz-radio-button nzValue="default">中</label>
-                            <label nz-radio-button nzValue="small">小</label>
-                        </nz-radio-group>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            <nz-form-item>
-                <nz-form-label nzSpan="8" nzRequired>
-                    宽度尽量大
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="block">
-                        <nz-switch ngModel [ngModelOptions]="{standalone:true}"></nz-switch>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            <nz-form-item>
-                <nz-form-label nzSpan="8" nzRequired>
-                    危险按钮
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="danger">
-                        <nz-switch ngModel [ngModelOptions]="{standalone:true}"></nz-switch>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            <nz-form-item>
-                <nz-form-label nzSpan="8" nzRequired>
-                    按钮形状
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <axis-fun-field formControlName="shape">
-                        <nz-select ngModel [ngModelOptions]="{standalone:true}">
-                            <nz-option nzLabel="默认" nzValue=""></nz-option>
-                            <nz-option nzLabel="圆形" nzValue="circle"></nz-option>
-                            <nz-option nzLabel="胶囊" nzValue="round"></nz-option>
-                        </nz-select>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-        </nz-collapse-panel>
-        <nz-collapse-panel nzHeader="确认提示">
-            <nz-form-item>
-                <nz-form-label nzSpan="10" nzRequired>
-                    开启确认提示
-                </nz-form-label>
-                <nz-form-control nzSpan="14">
-                    <axis-fun-field formControlName="confirm">
-                        <nz-switch ngModel [ngModelOptions]="{standalone:true}"></nz-switch>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            @if (formValue().confirm?.funMode || formValue().confirm?.originValue) {
-            <nz-form-item>
-                <nz-form-label nzSpan="10" nzRequired>
-                    确认框类型
-                </nz-form-label>
-                <nz-form-control nzSpan="14">
-                    <axis-fun-field formControlName="confirmType">
-                        <nz-radio-group ngModel [ngModelOptions]="{standalone:true}">
-                            <label nz-radio-button nzValue="modal">弹窗</label>
-                            <label nz-radio-button nzValue="pop">气泡</label>
-                        </nz-radio-group>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            <nz-form-item>
-                <nz-form-label nzSpan="10">
-                    确认文本
-                </nz-form-label>
-                <nz-form-control nzSpan="14">
-                    <axis-fun-field formControlName="confirmText">
-                        <input nz-input ngModel [ngModelOptions]="{standalone:true}" />
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-            }
-        </nz-collapse-panel>
-        <axis-base-design-setting [fg]="fg"></axis-base-design-setting>
-        <axis-input-trigger formControlName="triggeEvents"
-            [eventDesc]="[{name:'buttonClick',title:'点击按钮'}]"></axis-input-trigger>
-    </nz-collapse>
-</form>