@farris/cli 2.0.3 → 2.1.0

package/templates/lib/components/common/src/compositions/use-momentum/index.ts

@@ -1,82 +0,0 @@
-type MonmentumOption = {
-  maxOverflowY?: number,
-  TimeThreshold?: number,
-  YThreshold?: number
-}
-
-export const useMonmentum = (options: MonmentumOption) => {
-  const { maxOverflowY = 0, TimeThreshold = 200, YThreshold = 88 } = options;
-  let startTime = 0;
-  let momentumStartY = 0;
-  let deltaY = 0;
-  const start = (y: number) => {
-    startTime = new Date().getTime();
-    momentumStartY = y;
-  };
-  const move = (y: number) => {
-    deltaY = y;
-    const now = new Date().getTime();
-    const duration = now - startTime;
-    if (duration > TimeThreshold) {
-      momentumStartY = deltaY;
-      startTime = now;
-    }
-  };
-  const end = () => {
-    const now = new Date().getTime();
-    const duration = now - startTime;
-    const absDeltaY = Math.abs(deltaY - momentumStartY);
-    if (duration < TimeThreshold && absDeltaY > YThreshold) {
-      return true;
-    }
-    return false;
-  };
-  const get = (current: number, minY: number, maxY: number) => {
-    const durationMap = {
-      noBounce: 2500,
-      weekBounce: 800,
-      strongBounce: 400
-    };
-    const bezierMap = {
-      noBounce: 'cubic-bezier(.17, .89, .45, 1)',
-      weekBounce: 'cubic-bezier(.25, .46, .45, .94)',
-      strongBounce: 'cubic-bezier(.25, .46, .45, .94)'
-    };
-    let type = 'noBounce';
-    // 惯性滑动加速度
-    const deceleration = 0.003;
-    // 回弹阻力
-    const bounceRate = 10;
-    // 强弱回弹的分割值
-    const bounceThreshold = 300;
-
-    let overflowY = 0;
-    const now = new Date().getTime();
-    const duration = now - startTime;
-
-    const distance = current - momentumStartY;
-    const speed = (2 * Math.abs(distance)) / duration;
-    let destination = current + (speed / deceleration) * (distance < 0 ? -1 : 1);
-    if (destination < minY) {
-      overflowY = minY - destination;
-      type = overflowY > bounceThreshold ? 'strongBounce' : 'weekBounce';
-      destination = Math.max(minY - maxOverflowY, minY - overflowY / bounceRate);
-    } else if (destination > maxY) {
-      overflowY = destination - maxY;
-      type = overflowY > bounceThreshold ? 'strongBounce' : 'weekBounce';
-      destination = Math.min(maxY + maxOverflowY, maxY + overflowY / bounceRate);
-    }
-
-    return {
-      destination,
-      duration: durationMap[type],
-      bezier: bezierMap[type]
-    };
-  };
-  return {
-    start,
-    move,
-    end,
-    get
-  };
-};

package/templates/lib/components/common/src/compositions/use-mount-component/index.ts

@@ -1,48 +0,0 @@
-import { useExpose } from "../use-expose";
-import { Component, createApp, nextTick, reactive } from "vue";
-
-export function usePopupState() {
-  const state = reactive({
-    show: false,
-  });
-
-  const toggle = (show: boolean) => {
-    state.show = show;
-  };
-
-  const open = (props: Record<string, any>) => {
-    Object.assign(state, props);
-
-    nextTick(() => {
-      toggle(true);
-    });
-  };
-
-  const close = () => {
-    toggle(false);
-  };
-
-  useExpose({ open, close, toggle });
-
-  return {
-    open,
-    close,
-    state,
-    toggle,
-  };
-}
-
-export function mountComponent(RootComponent: Component) {
-  const app = createApp(RootComponent);
-  const root = document.createElement('div');
-
-  document.body.appendChild(root);
-
-  return {
-    instance: app.mount(root),
-    unmount() {
-      app.unmount();
-      document.body.removeChild(root);
-    },
-  };
-}

package/templates/lib/components/common/src/compositions/use-rect/index.ts

@@ -1,31 +0,0 @@
-import { Ref, unref } from 'vue';
-
-const isWindow = (val: unknown): val is Window => val === window;
-
-const makeDOMRect = (width: number, height: number) =>
-  ({
-    top: 0,
-    left: 0,
-    right: width,
-    bottom: height,
-    width,
-    height,
-  }) as DOMRect;
-
-export const useRect = (
-  elementOrRef: Element | Window | Ref<Element | Window | undefined>,
-) => {
-  const element = unref(elementOrRef);
-
-  if (isWindow(element)) {
-    const width = element.innerWidth;
-    const height = element.innerHeight;
-    return makeDOMRect(width, height);
-  }
-
-  if (element?.getBoundingClientRect) {
-    return element.getBoundingClientRect();
-  }
-
-  return makeDOMRect(0, 0);
-};

package/templates/lib/components/common/src/compositions/use-refs/index.ts

@@ -1,21 +0,0 @@
-import { ref, Ref, onBeforeUpdate } from 'vue';
-
-export function useRefs<T = Element>() {
-  const refs = ref([]) as Ref<T[]>;
-  const cache: Array<(el: unknown) => void> = [];
-
-  onBeforeUpdate(() => {
-    refs.value = [];
-  });
-
-  const setRefs = (index: number) => {
-    if (!cache[index]) {
-      cache[index] = (el: unknown) => {
-        refs.value[index] = el as T;
-      };
-    }
-    return cache[index];
-  };
-
-  return [refs, setRefs] as const;
-}

package/templates/lib/components/common/src/compositions/use-resize-observer/index.ts

@@ -1,85 +0,0 @@
-/* eslint-disable no-use-before-define */
-import { computed, watch } from 'vue';
-import { MaybeComputedElementRef, unrefElement, tryOnScopeDispose, defaultWindow } from './utils';
-
-export interface ResizeObserverSize {
-  readonly inlineSize: number;
-  readonly blockSize: number;
-}
-
-export interface ResizeObserverEntry {
-  readonly target: Element;
-  readonly contentRect: DOMRectReadOnly;
-  readonly borderBoxSize?: ReadonlyArray<ResizeObserverSize>;
-  readonly contentBoxSize?: ReadonlyArray<ResizeObserverSize>;
-  readonly devicePixelContentBoxSize?: ReadonlyArray<ResizeObserverSize>;
-}
-
-export type ResizeObserverCallback = (entries: ReadonlyArray<ResizeObserverEntry>, observer: ResizeObserver) => void;
-
-export interface UseResizeObserverOptions {
-
-  /** 监听的盒模型，默认为`content-box` */
-  box?: ResizeObserverBoxOptions;
-
-  /** 允许指定一个的`window` */
-  window?: Window;
-}
-
-declare class ResizeObserver {
-
-  constructor(callback: ResizeObserverCallback);
-
-  disconnect(): void;
-
-  observe(target: Element, options?: UseResizeObserverOptions): void;
-
-  unobserve(target: Element): void;
-}
-
-/**
- * 监听元素的大小变化
- */
-export function useResizeObserver(
-  target: MaybeComputedElementRef | MaybeComputedElementRef[],
-  callback: ResizeObserverCallback,
-  options: UseResizeObserverOptions = {},
-) {
-  const { window = defaultWindow, ...observerOptions } = options;
-  let observer: ResizeObserver | undefined;
-
-  const cleanup = () => {
-    if (observer) {
-      observer.disconnect();
-      observer = undefined;
-    }
-  };
-
-  const targets = computed(() =>
-    Array.isArray(target)
-      ? target.map(el => unrefElement(el))
-      : [unrefElement(target)]);
-
-  const stopWatch = watch(
-    targets,
-    (elements) => {
-      cleanup();
-      if (window && 'ResizeObserver' in window) {
-        observer = new ResizeObserver(callback);
-        elements.forEach((element) => {
-          element && observer!.observe(element, observerOptions);
-        });
-      }
-    },
-    { immediate: true, flush: 'post' },
-  );
-
-  const stop = () => {
-    cleanup();
-    stopWatch();
-  };
-
-  tryOnScopeDispose(stop);
-
-  return { stop };
-}

package/templates/lib/components/common/src/compositions/use-resize-observer/utils.ts

@@ -1,37 +0,0 @@
-/* eslint-disable no-use-before-define */
-import { ComponentPublicInstance, Ref, unref, getCurrentScope, onScopeDispose } from 'vue';
-import { inBrowser } from '../../utils';
-
-export const defaultWindow = inBrowser ? window : undefined;
-
-export type MaybeRef<T> = T | Ref<T>;
-export type MaybeRefOrGetter<T> = MaybeRef<T> | (() => T);
-
-export type VueInstance = ComponentPublicInstance;
-export type MaybeElementRef<T extends MaybeElement = MaybeElement> = MaybeRef<T>;
-export type MaybeComputedElementRef<T extends MaybeElement = MaybeElement> = MaybeRefOrGetter<T>;
-export type MaybeElement = HTMLElement | SVGElement | VueInstance | undefined | null;
-
-export type UnRefElementReturn<T extends MaybeElement = MaybeElement> =
-  T extends VueInstance ? Exclude<MaybeElement, VueInstance> : T | undefined;
-
-export type AnyFn = (...args: any[]) => any;
-
-export function toValue<T>(r: MaybeRefOrGetter<T>): T {
-  return typeof r === 'function'
-    ? (r as AnyFn)()
-    : unref(r);
-}
-
-export function unrefElement<T extends MaybeElement>(elRef: MaybeComputedElementRef<T>): UnRefElementReturn<T> {
-  const plain = toValue(elRef);
-  return (plain as VueInstance)?.$el ?? plain;
-}
-
-export function tryOnScopeDispose(fn: (() => void)) {
-  if (getCurrentScope()) {
-    onScopeDispose(fn);
-    return true;
-  }
-  return false;
-}

package/templates/lib/components/common/src/compositions/use-scroll-parent/index.ts

@@ -1,42 +0,0 @@
-import { ref, Ref, onMounted } from 'vue';
-import { inBrowser } from '../../utils';
-
-type ScrollElement = HTMLElement | Window;
-
-const overflowScrollReg = /scroll|auto|overlay/i;
-const defaultRoot = inBrowser ? window : undefined;
-
-function isElement(node: Element) {
-  const ELEMENT_NODE_TYPE = 1;
-  return (
-    node.tagName !== 'HTML' &&
-    node.tagName !== 'BODY' &&
-    node.nodeType === ELEMENT_NODE_TYPE
-  );
-}
-
-export function getScrollParent(el: Element, root: ScrollElement | undefined = defaultRoot) {
-  let node = el;
-
-  while (node && node !== root && isElement(node)) {
-    const { overflowY } = window.getComputedStyle(node);
-    if (overflowScrollReg.test(overflowY)) {
-      return node;
-    }
-    node = node.parentNode as Element;
-  }
-
-  return root;
-}
-
-export function useScrollParent(el: Ref<Element | undefined>, root: ScrollElement | undefined = defaultRoot) {
-  const scrollParent = ref<Element | Window>();
-
-  onMounted(() => {
-    if (el.value) {
-      scrollParent.value = getScrollParent(el.value, root);
-    }
-  });
-
-  return scrollParent;
-}

package/templates/lib/components/common/src/compositions/use-touch/index.ts

@@ -1,82 +0,0 @@
-import { ref } from 'vue';
-
-export const TAP_OFFSET = 5;
-
-type Direction = '' | 'vertical' | 'horizontal';
-
-function getDirection(x: number, y: number) {
-  if (x > y) {
-    return 'horizontal';
-  }
-  if (y > x) {
-    return 'vertical';
-  }
-  return '';
-}
-
-export function useTouch() {
-  const startX = ref(0);
-  const startY = ref(0);
-  const deltaX = ref(0);
-  const deltaY = ref(0);
-  const offsetX = ref(0);
-  const offsetY = ref(0);
-  const direction = ref<Direction>('');
-  const isTap = ref(true);
-
-  const isVertical = () => direction.value === 'vertical';
-  const isHorizontal = () => direction.value === 'horizontal';
-
-  const reset = () => {
-    deltaX.value = 0;
-    deltaY.value = 0;
-    offsetX.value = 0;
-    offsetY.value = 0;
-    direction.value = '';
-    isTap.value = true;
-  };
-
-  const start = ((event: TouchEvent) => {
-    reset();
-    startX.value = event.touches[0].clientX;
-    startY.value = event.touches[0].clientY;
-  }) as EventListener;
-
-  const move = ((event: TouchEvent) => {
-    const touch = event.touches[0];
-    // safari back will set clientX to negative number
-    deltaX.value = (touch.clientX < 0 ? 0 : touch.clientX) - startX.value;
-    deltaY.value = touch.clientY - startY.value;
-    offsetX.value = Math.abs(deltaX.value);
-    offsetY.value = Math.abs(deltaY.value);
-
-    // lock direction when distance is greater than a certain value
-    const LOCK_DIRECTION_DISTANCE = 10;
-    if (
-      !direction.value ||
-      (offsetX.value < LOCK_DIRECTION_DISTANCE && offsetY.value < LOCK_DIRECTION_DISTANCE)
-    ) {
-      direction.value = getDirection(offsetX.value, offsetY.value);
-    }
-
-    if (isTap.value && (offsetX.value > TAP_OFFSET || offsetY.value > TAP_OFFSET)) {
-      isTap.value = false;
-    }
-  }) as EventListener;
-
-  return {
-    move,
-    start,
-    reset,
-    startX,
-    startY,
-    deltaX,
-    deltaY,
-    offsetX,
-    offsetY,
-    direction,
-    isVertical,
-    isHorizontal,
-    isTap
-  };
-}

package/templates/lib/components/common/src/compositions/use-touch-move/index.ts

@@ -1,120 +0,0 @@
-import { reactive, ref, Ref } from 'vue';
-import { throttle } from '../../utils';
-import { useEventListener } from '../use-event-listener';
-
-const MIN_DISTANCE = 10;
-
-type TouchDirection = 'horizontal' | 'vertical' | '';
-
-export type TouchOffset = {
-  startX: number;
-  startY: number;
-  endX: number;
-  endY: number;
-  offsetX: number;
-  offsetY: number;
-  direction: TouchDirection;
-};
-
-type TouchListener = {
-  onTouchStart?: (event: Event) => void;
-  onTouchMove?: (event: Event) => void;
-  onTouchEnd?: (event: Event) => void;
-  onTouchCancel?: (event: Event) => void;
-};
-
-function getDirection(x: number, y: number): TouchDirection {
-  if (x > y && x > MIN_DISTANCE) {
-    return 'horizontal';
-  }
-
-  if (y > x && y > MIN_DISTANCE) {
-    return 'vertical';
-  }
-  return '';
-}
-
-const defaultTouchOffset: () => TouchOffset = () => {
-  return {
-    startX: 0,
-    startY: 0,
-    endX: 0,
-    endY: 0,
-    offsetX: 0,
-    offsetY: 0,
-    direction: ''
-  };
-};
-
-export enum DragStatus {
-  NotStarted,
-  Started,
-  Dragging,
-  End
-}
-
-export function useTouchMove(
-  target: Ref<EventTarget | undefined>,
-  listener?: TouchListener,
-  wait = 0
-) {
-  let beginOffset = { offsetX: 0, offsetY: 0 };
-  const offset: TouchOffset = reactive(defaultTouchOffset());
-  const dragStatus = ref(DragStatus.NotStarted);
-
-  const touchStart = (event: any) => {
-    if (!event.touches || !event.touches[0]) {
-      return;
-    }
-    offset.startX = event.touches[0].clientX;
-    offset.startY = event.touches[0].clientY;
-    listener?.onTouchStart && listener.onTouchStart(event);
-    dragStatus.value = DragStatus.Started;
-  };
-
-  const touchMove = (event: any) => {
-    if (!event.touches || !event.touches[0]) {
-      return;
-    }
-    const touch = event.touches[0];
-    offset.offsetX = touch.clientX - offset.startX + beginOffset.offsetX;
-    offset.offsetY = touch.clientY - offset.startY + beginOffset.offsetY;
-    offset.endX = event.touches[0].clientX;
-    offset.endY = event.touches[0].clientY;
-    offset.direction = getDirection(offset.offsetX, offset.offsetY);
-    listener?.onTouchMove && listener.onTouchMove(event);
-    dragStatus.value = DragStatus.Dragging;
-  };
-
-  const touchEnd = (event: Event) => {
-    beginOffset = { offsetX: offset.offsetX, offsetY: offset.offsetY };
-    listener?.onTouchEnd && listener.onTouchEnd(event);
-    listener?.onTouchCancel && listener.onTouchCancel(event);
-    dragStatus.value = DragStatus.End;
-  };
-
-  const resetTouchStatus = () => {
-    offset.endX = 0;
-    offset.endY = 0;
-    offset.offsetX = 0;
-    offset.offsetY = 0;
-    offset.direction = '';
-    beginOffset = { offsetX: 0, offsetY: 0 };
-    dragStatus.value = DragStatus.NotStarted;
-  };
-
-  if (target) {
-    useEventListener('touchstart', touchStart, { target });
-    useEventListener('touchmove', wait > 0 ? throttle(touchMove, wait) : touchMove, {
-      target,
-      passive: false
-    });
-    useEventListener('touchend', touchEnd, { target });
-  }
-
-  return {
-    offset,
-    dragStatus,
-    resetTouchStatus
-  };
-}

package/templates/lib/components/common/src/entity/base-property.ts

@@ -1,129 +0,0 @@
-import { DesignerComponentInstance, DgControl } from "@/components/designer-canvas";
-import { cloneDeep } from "lodash-es";
-
-/**
- * 控件属性基类
- */
-export class BaseControlProperty {
-    public componentId: string;
-
-    public viewModelId: string;
-
-    public eventsEditorUtils: any;
-
-    public formSchemaUtils: any;
-    public formMetadataConverter: any;
-    public designViewModelUtils: any;
-    public designViewModelField: any;
-    public controlCreatorUtils: any;
-    public designerHostService: any;
-
-    schemaService: any = null;
-
-    metadataService: any = null;
-
-    protected propertyConfig = {
-        type: 'object',
-        categories: {}
-    };
-
-    constructor(componentId: string, designerHostService: any) {
-        this.componentId = componentId;
-        this.designerHostService = designerHostService;
-        this.eventsEditorUtils = designerHostService['eventsEditorUtils'];
-        this.formSchemaUtils = designerHostService['formSchemaUtils'];
-        this.formMetadataConverter = designerHostService['formMetadataConverter'];
-        this.viewModelId = this.formSchemaUtils?.getViewModelIdByComponentId(componentId) || '';
-        this.designViewModelUtils = designerHostService['designViewModelUtils'];
-        this.controlCreatorUtils = designerHostService['controlCreatorUtils'];
-        this.metadataService = designerHostService['metadataService'];
-        this.schemaService = designerHostService['schemaService'];
-    }
-
-    getTableInfo() {
-        return this.schemaService?.getTableInfoByViewModelId(this.viewModelId);
-    }
-
-    setDesignViewModelField(propertyData: any) {
-        const bindingFieldId = propertyData.binding && propertyData.binding.type === 'Form' && propertyData.binding.field;
-        // 视图模型中[字段更新时机]属性现在要在控件上维护，所以在控件上复制一份属性值
-        if (bindingFieldId) {
-            if (!this.designViewModelField) {
-                const dgViewModel = this.designViewModelUtils.getDgViewModel(this.viewModelId);
-                this.designViewModelField = dgViewModel.fields.find(f => f.id === bindingFieldId);
-            }
-            propertyData.updateOn = this.designViewModelField?.updateOn;
-        }
-    }
-
-    getBasicPropConfig(propertyData: any): any {
-        return {
-            description: 'Basic Information',
-            title: '基本信息',
-            properties: {
-                id: {
-                    description: '组件标识',
-                    title: '标识',
-                    type: 'string',
-                    readonly: true
-                },
-                type: {
-                    description: '组件类型',
-                    title: '控件类型',
-                    type: 'select',
-                    editor: {
-                        type: 'combo-list',
-                        textField: 'name',
-                        valueField: 'value',
-                        editable: false,
-                        data: [{ value: propertyData.type, name: DgControl[propertyData.type] && DgControl[propertyData.type].name }]
-                    }
-                }
-            }
-        };
-
-    }
-
-
-    protected getAppearanceConfig(propertyData = null): any {
-        return {
-            title: "外观",
-            description: "Appearance",
-            properties: {
-                class: {
-                    title: "class样式",
-                    type: "string",
-                    description: "组件的CSS样式",
-                    $converter: "/converter/appearance.converter"
-                },
-                style: {
-                    title: "style样式",
-                    type: "string",
-                    description: "组件的样式",
-                    $converter: "/converter/appearance.converter"
-                }
-            }
-        };
-    }
-
-    /**
-     * 
-     * @param propertyId 
-     * @param componentInstance 
-     * @returns 
-     */
-    public updateElementByParentContainer(propertyId: string, componentInstance: DesignerComponentInstance) {
-        // 1、定位控件父容器
-        const parentContainer = componentInstance && componentInstance.parent && componentInstance.parent['schema'];
-        if (!parentContainer) {
-            return;
-        }
-        const index = parentContainer.contents.findIndex(c => c.id === propertyId);
-        // 通过cloneDeep方式的触发更新
-        const controlSchema = cloneDeep(parentContainer.contents[index]);
-        // 5、替换控件
-        parentContainer.contents.splice(index, 1);
-        parentContainer.contents.splice(index, 0, controlSchema);
-    }
-
-}