ngx-axis-appforge 0.0.2 → 0.0.3

package/core/share/base-design-setting/base-design-setting.html

@@ -1,50 +0,0 @@
-<form [formGroup]="fg()" nz-form>
-    <nz-collapse [nzBordered]="false">
-        <nz-collapse-panel nzHeader="通用设置">
-            <nz-form-item>
-                <nz-form-label nzSpan="8" nzRequired>
-                    组件ID
-                </nz-form-label>
-                <nz-form-control nzSpan="16">
-                    <input nz-input formControlName="id" />
-                </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="inuse" [exclude]="exclude()" [scopeId]="scopeId()">
-                        <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-select nzMode="multiple" nzAllowClear formControlName="requiredPermissions">
-                        @for (en of allPermissions; track en[0]) {
-                        <nz-option [nzLabel]="en[1]" [nzValue]="en[0]"></nz-option>
-                        }
-                    </nz-select>
-                </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="style" [exclude]="exclude()" [scopeId]="scopeId()">
-                        <ng-container [axisDynamic]="{component:'axis-components/input-json',inuse:true}"
-                            [standalone]="true" ngModel [ngModelOptions]="{standalone:true}"></ng-container>
-                    </axis-fun-field>
-                </nz-form-control>
-            </nz-form-item>
-        </nz-collapse-panel>
-        @if (showLine()) {
-        <div></div>
-        }
-    </nz-collapse>
-</form>

package/core/share/base-design-setting/base-design-setting.ts

@@ -1,55 +0,0 @@
-import { AfterViewInit, ChangeDetectionStrategy, Component, ElementRef, inject, input, signal } from '@angular/core';
-import { NzCollapseModule } from 'ng-zorro-antd/collapse';
-import { NzFormModule } from 'ng-zorro-antd/form';
-import { FunField } from '../fun-field/fun-field';
-import { NzSwitchModule } from 'ng-zorro-antd/switch';
-import { FormsModule, ReactiveFormsModule, UntypedFormGroup } from '@angular/forms';
-import { NzInputModule } from 'ng-zorro-antd/input';
-import { DynamicDirective } from '../../directives/dynamic';
-import { FormValidators } from '../../utils/form-validators';
-import { NzSelectModule } from 'ng-zorro-antd/select';
-import { AXIS_DESIGN_ALL_PERMISSIONS_TOKEN } from '../tokens';
-import { FunFieldOptions } from '../../models/fun-field.options';
-
-@Component({
-  selector: 'axis-base-design-setting',
-  imports: [NzCollapseModule, NzFormModule, FunField, NzSwitchModule, FormsModule, NzInputModule, ReactiveFormsModule, DynamicDirective, NzSelectModule],
-  templateUrl: './base-design-setting.html',
-  styleUrl: './base-design-setting.css',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class BaseDesignSetting implements AfterViewInit {
-
-  constructor(private element: ElementRef) { }
-
-  readonly showLine = signal(false);
-  readonly scopeId = input<string>();
-  readonly exclude = input<string[]>([]);
-  readonly allPermissions = Object.entries(inject(AXIS_DESIGN_ALL_PERMISSIONS_TOKEN));
-
-  fg = input.required<UntypedFormGroup>();
-
-  ngAfterViewInit(): void {
-    if (this.element.nativeElement.nextElementSibling) {
-      this.showLine.set(true);
-    }
-  }
-
-}
-
-export const baseFbConfig = {
-  id: [undefined, [FormValidators.required]],
-  inuse: [undefined, [FormValidators.requiredFun]],
-  requiredPermissions: [],
-  style: [],
-  triggeEvents: []
-};
-
-export const baseFunField: FunFieldOptions = {
-  inuse: {
-    defaultValue: true
-  },
-  style: {
-    defaultValue: undefined
-  }
-}

package/core/share/base-event-handler-descs.ts

@@ -1,100 +0,0 @@
-import { EventHandlerDesc, EventHandlerDescGroup } from "../models/event-desc";
-import { ApiHandler } from "./api-handler/api-handler";
-import { ArrayFilterHandler } from "./array-filter-handler/array-filter-handler";
-import { DataHandler } from "./data-handler/data-handler";
-import { MsgTipHandler } from "./msg-tip-handler/msg-tip-handler";
-import { RefreshDataSourceHandler } from "./refresh-data-source-handler/refresh-data-source-handler";
-import { RouteHandler } from "./route-handler/route-handler";
-import { SetDataSourceHandler } from "./set-data-source-handler/set-data-source-handler";
-
-export const baseEventHandlerDescs: { [name: string]: EventHandlerDesc } = {
-    api: {
-        name: "api",
-        icon: "api",
-        title: "调用接口",
-        target: "service",
-        dataComponent: ApiHandler,
-        events: [
-            {
-                name: "apiResponse",
-                title: "接口响应",
-                ds: {
-                    apiResponse: {
-                        tip: "示例数据"
-                    }
-                },
-            }
-        ]
-    },
-    setDataSource: {
-        name: "setDataSource",
-        title: "设置数据源",
-        icon: "database",
-        dataComponent: SetDataSourceHandler,
-        target: "scope",
-    },
-    refreshDataSource: {
-        name: "refreshDataSource",
-        title: "刷新数据源",
-        icon: "reload",
-        dataComponent: RefreshDataSourceHandler,
-        target: "scope",
-    },
-    setValue: {
-        name: "setValue",
-        title: "设置值",
-        icon: "flag",
-        dataComponent: DataHandler,
-        target: "component",
-    },
-    arrayFilter: {
-        name: "arrayFilter",
-        icon: "filter",
-        title: "数组过滤",
-        target: "service",
-        dataComponent: ArrayFilterHandler,
-        events: [
-            {
-                name: "output",
-                title: "数据输出",
-                ds: {
-                    outputArray: [{
-                        tip: "示例数据"
-                    }]
-                },
-            }
-        ]
-    },
-    msgTip: {
-        name: "msgTip",
-        icon: "bell",
-        title: "消息提醒",
-        target: "service",
-        dataComponent: MsgTipHandler
-    },
-    route: {
-        name: "route",
-        icon: "right-square",
-        title: "路由",
-        target: "service",
-        formStyle: {
-            labelSpan: 8
-        },
-        dataComponent: RouteHandler
-    },
-};
-
-export const baseEventHandlerDescGroups: EventHandlerDescGroup[] = [
-    {
-        groupName: "基础",
-        handlerDescs: [
-            baseEventHandlerDescs["api"],
-            baseEventHandlerDescs["setDataSource"],
-            baseEventHandlerDescs["refreshDataSource"],
-            baseEventHandlerDescs["setValue"],
-            baseEventHandlerDescs["arrayFilter"],
-            baseEventHandlerDescs["msgTip"],
-            baseEventHandlerDescs["route"],
-        ]
-    }
-];

package/core/share/common-menu/common-menu.html

@@ -1,21 +0,0 @@
-@if (canAddParent) {
-<li nz-menu-item (click)="addParent()">
-    <i nz-icon nzType="pic-center" nzTheme="outline"></i>
-    <nz-divider nzType="vertical"></nz-divider>
-    <span>添加父组件</span>
-</li>
-}
-@if (canAddChild) {
-<li nz-menu-item (click)="addChild()">
-    <i nz-icon nzType="plus" nzTheme="outline"></i>
-    <nz-divider nzType="vertical"></nz-divider>
-    <span>添加子组件</span>
-</li>
-}
-@if (canRemove) {
-<li nz-menu-item style="color: #f81d22" (click)="remove()">
-    <i nz-icon nzType="delete" nzTheme="outline"></i>
-    <nz-divider nzType="vertical"></nz-divider>
-    <span>删除</span>
-</li>
-}

package/core/share/common-menu/common-menu.ts

@@ -1,73 +0,0 @@
-import { ChangeDetectionStrategy, Component, inject, input } from '@angular/core';
-import { BaseMenu } from '../../base/base-menu';
-import { NzDividerModule } from 'ng-zorro-antd/divider';
-import { NzDropDownModule } from 'ng-zorro-antd/dropdown';
-import { NzIconModule } from 'ng-zorro-antd/icon';
-import { AXIS_DESIGN_CHOOSE_COMPONENT_FUNC_TOKEN } from '../tokens';
-
-@Component({
-  selector: 'axis-common-menu',
-  imports: [NzDividerModule, NzDropDownModule, NzIconModule],
-  templateUrl: './common-menu.html',
-  styleUrl: './common-menu.css',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class CommonMenu {
-
-  readonly baseMenu = input.required<BaseMenu>();
-  readonly chooseComponentFunc = inject(AXIS_DESIGN_CHOOSE_COMPONENT_FUNC_TOKEN);
-
-  get canAddParent(): boolean {
-    const { optionsNodes } = this.baseMenu();
-    return !optionsNodes.current.isRoot && (!!optionsNodes.parent?.canDrop && optionsNodes.parent?.dropType == "component");
-  }
-
-  get canAddChild(): boolean {
-    const { optionsNodes } = this.baseMenu();
-    return optionsNodes.current.dropType == "component" && (Array.isArray(optionsNodes.current.dropObj) || !optionsNodes.current.dropObj[optionsNodes.current.defaultDropIndex!])
-  }
-
-  get canRemove(): boolean {
-    return this.baseMenu().optionsNodes.current.canSetting;
-  }
-
-  addParent() {
-    this.chooseComponentFunc("wrap").subscribe(res => {
-      const { options, config } = res;
-      if (options && config) {
-        const { optionsNodes } = this.baseMenu();
-        const node = config.buildOptionsNodes?.({ currentObject: options });
-        if (node) {
-          const { treeNode } = node;
-          treeNode.dropObj[treeNode.defaultDropIndex!] = optionsNodes.current.options;
-          optionsNodes.parent!.dropObj[optionsNodes.current.indexOfParentObj!] = treeNode.options;
-          this.baseMenu().onChange();
-        }
-      }
-    });
-  }
-
-  addChild() {
-    this.chooseComponentFunc().subscribe(res => {
-      if (res.options) {
-        const { optionsNodes } = this.baseMenu();
-        optionsNodes.current.dropObj[optionsNodes.current.defaultDropIndex!] = res.options;
-        this.baseMenu().onChange();
-      }
-    });
-  }
-
-  remove() {
-    if (this.baseMenu().optionsNodes.current.isRoot) {
-      this.baseMenu().onChange(null);
-    } else {
-      if (Array.isArray(this.baseMenu().optionsNodes.current.parentObj)) {
-        this.baseMenu().optionsNodes.current.parentObj.splice(this.baseMenu().optionsNodes.current.indexOfParentObj as number, 1);
-      } else {
-        this.baseMenu().optionsNodes.current.parentObj[this.baseMenu().optionsNodes.current.indexOfParentObj!] = null;
-      }
-      this.baseMenu().onChange();
-    }
-  }
-
-}

package/core/share/data-handler/data-handler.html

@@ -1,13 +0,0 @@
-<form nz-form [formGroup]="fg">
-    <nz-form-item>
-        <nz-form-label nzSpan="6">
-            数据
-        </nz-form-label>
-        <nz-form-control nzSpan="18">
-            <axis-fun-field formControlName="data" [noListen]="noListen()">
-                <ng-container [axisDynamic]="{component:'axis-components/input-json',inuse:true}" [standalone]="true"
-                    ngModel [ngModelOptions]="{standalone:true}"></ng-container>
-            </axis-fun-field>
-        </nz-form-control>
-    </nz-form-item>
-</form>

package/core/share/data-handler/data-handler.ts

@@ -1,39 +0,0 @@
-import { ChangeDetectionStrategy, Component, forwardRef, inject, signal } from '@angular/core';
-import { FormsModule, NG_VALUE_ACCESSOR, ReactiveFormsModule, UntypedFormGroup } from '@angular/forms';
-import { NzFormModule } from 'ng-zorro-antd/form';
-import { FunField } from '../fun-field/fun-field';
-import { NzSelectModule } from 'ng-zorro-antd/select';
-import { DynamicDirective } from '../../directives/dynamic';
-import { NzInputModule } from 'ng-zorro-antd/input';
-import { NzSwitchModule } from 'ng-zorro-antd/switch';
-import { NzRadioModule } from 'ng-zorro-antd/radio';
-import { FunFieldValueBase } from '../../base/funfield-value-base';
-import { FunFieldOptions } from '../../models/fun-field.options';
-import { InputTrigger } from '../input-trigger/input-trigger';
-
-@Component({
-  selector: 'axis-data-handler',
-  imports: [NzFormModule, ReactiveFormsModule, FunField, FormsModule, NzSelectModule, DynamicDirective, NzInputModule, NzSwitchModule, NzRadioModule],
-  templateUrl: './data-handler.html',
-  styleUrl: './data-handler.css',
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  providers: [
-    {
-      provide: NG_VALUE_ACCESSOR,
-      useExisting: forwardRef(() => DataHandler),
-      multi: true
-    }
-  ]
-})
-export class DataHandler extends FunFieldValueBase {
-  readonly noListen = inject(InputTrigger).noListen;
-  override fg: UntypedFormGroup = this.fb.group({
-    data: [],
-  });
-
-  protected override funFields: FunFieldOptions = {
-    data: {
-      defaultValue: null,
-    },
-  };
-}

package/core/share/events-handler.service.ts

@@ -1,185 +0,0 @@
-import { HttpClient, HttpRequest } from '@angular/common/http';
-import { Inject, Injectable, Optional } from '@angular/core';
-import { catchError, from, map, mergeMap, Observable, of } from 'rxjs';
-import { ApiOptions } from '../models/api.options';
-import { EventHandlerOptions } from '../models/event.options';
-import { NzMessageService } from 'ng-zorro-antd/message';
-import { NzModalService } from 'ng-zorro-antd/modal';
-import { ActivatedRoute, Router } from '@angular/router';
-import { EventsHandler } from '../models/event-handler';
-import { AXIS_EVENT_HANDLERS_TOKEN } from './tokens';
-
-@Injectable({
-  providedIn: 'root'
-})
-export class EventsHandlerService implements EventsHandler {
-
-  constructor(private http: HttpClient, private msg: NzMessageService, private modal: NzModalService, private router: Router, @Optional() @Inject(AXIS_EVENT_HANDLERS_TOKEN) private otherHandlers?: EventsHandler[]) { }
-
-  onEvents(e: EventHandlerOptions<any>): Observable<boolean> | undefined {
-    switch (e.name) {
-      case "api":
-        return this.apiEventHandler(e);
-      case "msgTip":
-        return this.msgTipEventHandler(e);
-      case "arrayFilter":
-        return this.arrayFilterEventHandler(e);
-      case "route":
-        return this.routeEventHandler(e);
-      default:
-        if (this.otherHandlers) {
-          for (const h of this.otherHandlers) {
-            const r = h.onEvents(e);
-            if (r != undefined) {
-              return r;
-            }
-          }
-        }
-        return undefined;
-    }
-  }
-
-  private apiEventHandler(e: EventHandlerOptions<ApiOptions>): Observable<boolean> {
-    const opt = e.data as ApiOptions;
-    return this.http.request(new HttpRequest(opt.method?.toUpperCase() as any || "GET", opt.url, opt.body))
-      .pipe(map((h: any) => h.body), catchError(e => of(undefined)), mergeMap(res => {
-        if (e.ref) {
-          return e.ref.triggeEvents("apiResponse", { ...e.tempDataSource, apiResponse: res }, e.triggeEvents);
-        } else {
-          return of(true);
-        }
-      }));
-  }
-
-  private msgTipEventHandler(e: EventHandlerOptions<any>): Observable<boolean> {
-    switch (e.data?.tipWay) {
-      case "modal":
-        switch (e.data?.type) {
-          case "info":
-            this.modal.info({
-              nzTitle: "提醒",
-              nzContent: e.data.content
-            });
-            break;
-          case "success":
-            this.modal.success({
-              nzTitle: "成功",
-              nzContent: e.data.content
-            });
-            break;
-          case "warning":
-            this.modal.warning({
-              nzTitle: "警告",
-              nzContent: e.data.content
-            });
-            break;
-          case "error":
-            this.modal.error({
-              nzTitle: "失败",
-              nzContent: e.data.content
-            });
-            break;
-        }
-        break;
-      case "message":
-        switch (e.data?.type) {
-          case "info":
-            this.msg.info(e.data.content);
-            break;
-          case "success":
-            this.msg.success(e.data.content);
-            break;
-          case "warning":
-            this.msg.warning(e.data.content);
-            break;
-          case "error":
-            this.msg.error(e.data.content);
-            break;
-        }
-        break;
-    }
-    return of(true);
-  }
-
-  private arrayFilterEventHandler(e: EventHandlerOptions<{ inputArray?: any[], filterData?: any, filterOptions?: { field: string, mode: string, effectFields: string[] }[] }>): Observable<boolean> {
-    const { inputArray, filterData, filterOptions } = e.data ?? {};
-    let outputArray: any[] | undefined | null;
-    if (!inputArray?.length || !filterOptions?.length || !filterData || !Object.keys(filterData).length) {
-      outputArray = inputArray;
-    } else {
-      outputArray = inputArray.filter((r: any) => {
-        return filterOptions!
-          .every(e => {
-            if (filterData[e.field] == undefined || (e.mode == "between" && filterData[e.field].length < 2)) {
-              return true;
-            }
-            const effectFields = e.effectFields || [e.field];
-            return effectFields.some(field => {
-              const rowData = r[field];
-              switch (e.mode) {
-                case "startsWith":
-                  return rowData?.startsWith(filterData[e.field]);
-                case "endsWith":
-                  return rowData?.endsWith(filterData[e.field]);
-                case "like":
-                  return rowData != null && String(rowData).toUpperCase().includes(filterData[e.field].toUpperCase());
-                case "equalGreater":
-                  return rowData != undefined && r[field] >= filterData[e.field];
-                case "equalLess":
-                  return rowData != undefined && r[field] <= filterData[e.field];
-                case "between":
-                  return rowData != undefined && r[field] >= filterData[e.field][0] && r[field] <= filterData[e.field][1];
-                case "containAll":
-                  return rowData != undefined && (!filterData[e.field].length || filterData[e.field].every((r: any) => rowData.includes(r)));
-                case "containAny":
-                  return rowData != undefined && (!filterData[e.field].length || filterData[e.field].some((r: any) => rowData.includes(r)));
-                default:
-                  return rowData == filterData[e.field];
-              }
-            });
-          });
-      });
-    }
-    return e.ref?.triggeEvents("output", { ...e.tempDataSource, outputArray }, e.triggeEvents) ?? of(true);;
-  }
-
-  private routeEventHandler(e: EventHandlerOptions<{ type: "web", newtab?: boolean, path: string | string[], params?: any }>): Observable<boolean> {
-    let { type, newtab, path } = e.data!;
-    switch (type) {
-      case "web":
-        if (newtab) {
-          let url: string | undefined;
-          if (typeof path == "string") {
-            url = path;
-          } else if (Array.isArray(path)) {
-            url = path.join("/");
-          }
-          if (url) {
-            window.open(url, "_blank");
-            return of(true);
-          }
-        } else {
-          let url: string[] | undefined;
-          if (typeof path == "string") {
-            if (path.startsWith("http")) {
-              window.open(path, "_self");
-              return of(true);
-            }
-            url = [path];
-          } else if (Array.isArray(path)) {
-            url = path;
-          }
-          if (url?.[0]) {
-            if (e.ref?.isDesign) {
-              this.msg.info("设计模式下禁止路由跳转");
-            } else {
-              const route = e.ref?.injector.get(ActivatedRoute);
-              return from(this.router.navigate(url, { relativeTo: route, queryParams: e.data?.params }));
-            }
-          }
-        }
-        break;
-    }
-    return of(false);
-  }
-}

package/core/share/fun-field/fun-field.css

@@ -1,55 +0,0 @@
-.black {
-  width: 100%;
-  height: 500px;
-  padding-left: 42px;
-}
-
-.modal .ant-modal-body {
-  padding: 0 !important;
-}
-
-nz-list {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-}
-
-nz-list ::ng-deep nz-spin {
-  overflow: auto;
-}
-
-.code-row {
-  padding-left: 50px;
-}
-
-.success::placeholder {
-  color: #52c41a;
-}
-
-.warn::placeholder {
-  color: #faad14;
-}
-
-.error::placeholder {
-  color: #ff4d4f;
-}
-
-.scope-tag {
-  padding: 0px 20px;
-  font-size: 12px;
-  background: rgba(125, 125, 125, 0.1);
-  color: rgba(0, 0, 0, 0.54);
-}
-
-.scope-tag:not(:first-child) {
-  margin-top: 8px;
-}
-
-nz-splitter ::ng-deep .ant-splitter-panel {
-  overflow-y: visible;
-}
-
-.scope-item-container {
-  width: 100%;
-  overflow: auto;
-}