@gct-paas/design 0.1.4-dev.8 → 0.1.5-dev.0

package/es/hooks/design-view/usePage.mjs

@@ -1,171 +0,0 @@
-import { ref, computed, createVNode } from 'vue';
-import { Platform, PanelEnum, FormComponents, t } from '@gct-paas/core';
-import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
-import { useCacheHistory } from '../develop/useCacheHistory.mjs';
-import { Modal } from 'ant-design-vue';
-import { useDesigner } from './useDesigner.mjs';
-import { useToolkit } from './useToolkit.mjs';
-import { isNil, isEmpty } from 'lodash-es';
-import 'qx-util';
-import '../../constant/page-designer.mjs';
-import '../../provider/design-editor-node/design-editor-node.provider.mjs';
-import '../../utils/find-deep-types/find-deep-types.mjs';
-import { PluginPgkUtil } from '../../utils/plugin-pkg-util/plugin-pkg-util.mjs';
-import '../../utils/field-attrs/basicAttrs.mjs';
-
-const newKeyTag = "___new___";
-const pageInfo = ref({});
-const platform = ref(Platform.WEB);
-const pagePermissions = ref([]);
-const unlockAvailable = computed(() => {
-  const { userId, username } = _gct.store.userInfo;
-  return pageInfo.value.lockUserId === userId || username === "admin";
-});
-const currentPanel = ref(PanelEnum.PAGE);
-async function loadPageInfo(app) {
-  const { initToolkitWidgets } = useToolkit();
-  const {
-    setPageJson,
-    loadPageDesignHistoryList,
-    emitCache,
-    pageJson,
-    setPluginConfigs,
-    savePageJsonSnapshot
-  } = useDesigner();
-  const { historyUtils } = useCacheHistory();
-  platform.value = _gct.store.context.platform || Platform.WEB;
-  const pid = _gct.store.context.pid || "";
-  if (pid.startsWith(newKeyTag)) {
-    const key = pid.replace(`${newKeyTag}:`, "");
-    pageInfo.value = {
-      id: newKeyTag,
-      name: "",
-      key,
-      designerJson: ""
-    };
-  } else {
-    const pageInfoRes = platform.value === Platform.WEB ? await _api.apaas.webpage.getInfo({
-      id: _gct.store.context.pid
-    }) : platform.value === Platform.PAD ? await _api.apaas.padPage.getInfo({
-      id: _gct.store.context.pid
-    }) : await _api.apaas.mobilePage.getInfo({
-      id: _gct.store.context.pid
-    });
-    pageInfo.value = pageInfoRes;
-  }
-  const [configs] = await PluginPgkUtil.loadDesignPlugin(
-    app,
-    platform.value,
-    _gct.store.appInfo.suiteKey ? [_gct.store.appInfo.suiteKey] : void 0
-  );
-  setPluginConfigs([configs]);
-  if (!historyUtils.isHistoryInfoExist(_gct.store.context.pid)) {
-    historyUtils.init({ historyId: _gct.store.context.pid ?? "" });
-  }
-  if (pageInfo.value.designerJson && !isNil(pageInfo.value.designerJson) && !isEmpty(pageInfo.value.designerJson)) {
-    const _json = JSON.parse(pageInfo.value.designerJson);
-    if (_json && _json.plugins) {
-      const items = _json.plugins.filter((item) => {
-        return configs.findIndex((config) => config.key === item.key) === -1;
-      });
-      await PluginPgkUtil.loadDesignDeletedPlugins(platform.value, items);
-    }
-    if (!_json.pageConfig) {
-      _json.pageConfig = {
-        title: "",
-        i18n: {},
-        hasFooter: false
-      };
-    }
-    setPageJson({ ..._json, id: pageInfo.value.id });
-  } else {
-    emitCache();
-    if (platform.value === Platform.WEB) {
-      setPageJson({
-        newDesigner: true,
-        style: {
-          paddingAll: "",
-          paddingTop: "",
-          paddingRight: "16",
-          paddingBottom: "16",
-          paddingLeft: "16"
-        }
-      });
-    } else if (platform.value === Platform.PAD) {
-      setPageJson({
-        newDesigner: true,
-        style: {
-          paddingAll: "0",
-          paddingTop: "0",
-          paddingRight: "0",
-          paddingBottom: "0",
-          paddingLeft: "0",
-          backgroundColor: "#fff"
-        }
-      });
-    } else {
-      setPageJson({
-        newDesigner: true,
-        style: {
-          paddingAll: "16",
-          paddingTop: "16",
-          paddingRight: "16",
-          paddingBottom: "16",
-          paddingLeft: "16",
-          backgroundColor: "#fff"
-        }
-      });
-    }
-  }
-  if (!pageJson.widgets.some(
-    (item) => item.type === FormComponents.BottomButtonContainer
-  )) ;
-  initToolkitWidgets();
-  loadPageDesignHistoryList();
-  pagePermissions.value = await _api.apaas.permission.getList({
-    relationId: _gct.store.context.pid
-  }) || [];
-  if (!pid.startsWith(newKeyTag)) ;
-  savePageJsonSnapshot();
-}
-function initLockState() {
-}
-const lockPageWithConfirm = (id) => {
-  Modal.confirm({
-    title: t("sys.sureToLock"),
-    icon: createVNode(ExclamationCircleOutlined),
-    okText: t("sys.ok"),
-    cancelText: t("sys.cancel"),
-    async onOk() {
-      await _api.apaas.webpage.postLockWebPage({
-        id
-      });
-      pageInfo.value.lockUserId = _gct.store.userInfo.userId;
-      pageInfo.value.lockUserName = _gct.store.userInfo.fullname;
-    }
-  });
-};
-async function lockPage(value = true) {
-  const id = _gct.store.context.pid;
-  if (value) {
-    lockPageWithConfirm(id);
-  } else {
-    await _api.apaas.webpage.postUnLockWebPage({
-      id
-    });
-    pageInfo.value.lockUserId = "";
-    pageInfo.value.lockUserName = "";
-  }
-}
-function togglePanel(value) {
-  if (currentPanel.value === value) return;
-  currentPanel.value = value;
-}
-function usePage() {
-  return {
-    togglePanel,
-    initLockState
-  };
-}
-
-export { currentPanel, loadPageInfo, lockPage, newKeyTag, pageInfo, pagePermissions, platform, togglePanel, unlockAvailable, usePage };

package/es/hooks/design-view/usePageOccupy.d.ts

@@ -1,13 +0,0 @@
-import { Ref } from 'vue';
-import { WebPageOccupyResponse } from '@gct-paas/api/apaas';
-export declare const pageOccupyInfo: Ref<WebPageOccupyResponse>;
-export declare function destoryOccupyTimer(): void;
-/**
- * 获取占用信息
- * @returns
- */
-export declare function loadPageOccupyInfo(): Promise<void>;
-/**
- * 页面占用
- */
-export declare function occupyPage(value?: boolean): Promise<void>;

package/es/hooks/design-view/usePageOccupy.mjs

@@ -1,69 +0,0 @@
-import { ref, computed, watch } from 'vue';
-import { throttle } from 'lodash-es';
-
-const pageOccupyInfo = ref({
-  querySpanNum: 120,
-  // 占用查询间隔
-  cacheNum: 500
-  // 占用缓存间隔
-});
-const timeout = computed(() => {
-  return pageOccupyInfo.value.querySpanNum * 1e3;
-});
-const wait = computed(() => {
-  return (pageOccupyInfo.value.cacheNum - 10) / 2 * 1e3;
-});
-let occupyTimer = null;
-function initOccupyTimer() {
-  destoryOccupyTimer();
-  occupyTimer = window.setInterval(() => {
-    console.log("【获取占用】");
-    loadPageOccupyInfo();
-  }, timeout.value);
-}
-function destoryOccupyTimer() {
-  if (!occupyTimer) return;
-  console.log("【销毁占用轮询】");
-  clearInterval(occupyTimer);
-}
-watch(
-  () => pageOccupyInfo.value.occupyId,
-  (value) => {
-    if (value) {
-      destoryOccupyTimer();
-    } else {
-      initOccupyTimer();
-    }
-  }
-);
-async function loadPageOccupyInfo() {
-  const res = await _api.apaas.webpage.postGetWebPageOccupyMsg({
-    id: _gct.store.context.pid
-  });
-  pageOccupyInfo.value = res;
-}
-async function occupyPageTrue(id) {
-  console.log("【页面占用】【节流】", Date.now() / 1e3);
-  await _api.apaas.webpage.postOccupyWebPage({
-    id
-  });
-  pageOccupyInfo.value.occupyId = _gct.store.userInfo.userId;
-  pageOccupyInfo.value.occupyName = _gct.store.userInfo.fullname;
-}
-const throttledOccupyPageTrue = throttle(occupyPageTrue, wait.value);
-async function occupyPage(value = true) {
-  const id = _gct.store.context.pid;
-  if (value) {
-    console.log("【占用】");
-    throttledOccupyPageTrue(id);
-  } else {
-    console.log("【取消占用】");
-    await _api.apaas.webpage.postCancelOccupyWebPage({
-      id
-    });
-    pageOccupyInfo.value.occupyId = "";
-    pageOccupyInfo.value.occupyName = "";
-  }
-}
-
-export { destoryOccupyTimer, loadPageOccupyInfo, occupyPage, pageOccupyInfo };

package/es/hooks/design-view/usePropEditor.mjs

@@ -1,99 +0,0 @@
-import { computed, nextTick } from 'vue';
-import { useSelectedWidget } from './useSelectedWidget.mjs';
-import { isString, isObject } from 'lodash-es';
-import { useDesigner } from './useDesigner.mjs';
-
-const props = {
-  propName: {
-    type: [String, Object],
-    default: ""
-  },
-  propConfig: {
-    type: Object,
-    default: {}
-  },
-  changeCallback: {
-    type: Function
-  },
-  required: {
-    type: Boolean,
-    default: false
-  },
-  validate: {
-    type: Promise
-  },
-  widget: {
-    type: Object
-  }
-};
-const regRoot = /^root:/;
-const { selectedProps, selectedRef } = useSelectedWidget();
-const { emitCache } = useDesigner();
-function usePropEditor(propName, changeCallback, globData = {}) {
-  const propValue = computed({
-    get() {
-      const baseValue = getValue(propName);
-      return baseValue ?? (isString(propName) ? globData[propName] : baseValue);
-    },
-    set(val) {
-      setValue(val, propName);
-      if (!!changeCallback && typeof changeCallback === "function") {
-        nextTick().then(() => {
-          changeCallback(selectedRef.value, val);
-        });
-      }
-      emitCache();
-    }
-  });
-  return {
-    propValue
-  };
-}
-function setValue(value, name) {
-  if (isString(name)) {
-    const widget = regRoot.test(name) ? selectedRef : selectedProps;
-    const keyslist = name.replace(regRoot, "").split(".");
-    const len = keyslist.length - 1;
-    keyslist.reduce(
-      (memo, cur, index) => {
-        if (index === len) {
-          memo[cur] = value;
-        }
-        return memo[cur];
-      },
-      widget.value
-    );
-  }
-  if (isObject(name)) {
-    const valueMap = value;
-    for (const key in name) {
-      const valKey = name[key];
-      setValue(valueMap[key], valKey);
-    }
-  }
-}
-function getValue(name) {
-  if (isString(name)) {
-    const widget = regRoot.test(name) ? selectedRef : selectedProps;
-    if (!widget?.value) return;
-    const keyslist = name.replace(regRoot, "").split(".");
-    try {
-      return keyslist.reduce(
-        (memo, cur) => memo[cur],
-        widget.value
-      );
-    } catch (err) {
-      console.warn(err);
-    }
-  }
-  if (isObject(name)) {
-    const valueMap = {};
-    for (const key in name) {
-      const valKey = name[key];
-      valueMap[key] = getValue(valKey);
-    }
-    return valueMap;
-  }
-}
-
-export { props, usePropEditor };

package/es/hooks/design-view/useScope.mjs

@@ -1,92 +0,0 @@
-import { ref, computed, toRef } from 'vue';
-import { SCOPE } from '@gct-paas/core';
-import { useDesigner } from './useDesigner.mjs';
-
-const scope = ref(SCOPE.PAGE);
-function useScope() {
-  const { modalBody, modalFooter, modalBottomBtn, pageJson, modalInfo } = useDesigner();
-  const scopeData = computed(() => {
-    switch (scope.value) {
-      case SCOPE.PAGE:
-        return pageJson.widgets;
-      case SCOPE.MODAL: {
-        const data = [
-          ...modalBody.value?.children ?? []
-        ];
-        if (modalFooter.value?.children) {
-          data.push(...modalFooter.value.children);
-        }
-        if (modalBottomBtn.value?.children) {
-          data.push(...modalBottomBtn.value.children);
-        }
-        return data;
-      }
-      default:
-        return pageJson.widgets;
-    }
-  });
-  const scopeId = toRef(() => {
-    if (scope.value === SCOPE.PAGE) {
-      return pageJson.id || "id";
-    } else {
-      return modalInfo.value.id;
-    }
-  });
-  const navTagScopeData = computed(() => {
-    if (scope.value === SCOPE.PAGE) {
-      return pageJson.widgets;
-    } else if (scope.value === SCOPE.MODAL) {
-      return [modalInfo.value];
-    }
-    return pageJson.widgets;
-  });
-  const scopeJs = computed({
-    get() {
-      if (scope.value === SCOPE.PAGE) {
-        return pageJson.js;
-      } else {
-        return modalInfo.value.js;
-      }
-    },
-    set(val) {
-      if (scope.value === SCOPE.PAGE) {
-        pageJson.js = val;
-      } else {
-        modalInfo.value.js = val;
-      }
-    }
-  });
-  const scopeCss = computed({
-    get() {
-      if (scope.value === SCOPE.PAGE) {
-        return pageJson.css;
-      } else {
-        return modalInfo.value.css;
-      }
-    },
-    set(val) {
-      if (scope.value === SCOPE.PAGE) {
-        pageJson.css = val;
-      } else {
-        modalInfo.value.css = val;
-      }
-    }
-  });
-  function setScope(scopeDef) {
-    scope.value = scopeDef;
-  }
-  function getScope() {
-    return scope.value;
-  }
-  return {
-    scopeData,
-    navTagScopeData,
-    scopeJs,
-    scopeCss,
-    setScope,
-    getScope,
-    scopeId
-  };
-}
-
-export { useScope };

package/es/hooks/design-view/useSelectedWidget.d.ts

@@ -1,53 +0,0 @@
-import { IVue3DndItemOptions } from '../../interface';
-import { SCOPE } from '@gct-paas/core';
-import { LowCodeModal, LowCodeWidget } from '@gct-paas/schema';
-import { Ref } from 'vue';
-export declare function useSelectedWidget(): {
-    setSelectedModal: (modal: Partial<LowCodeModal.Modal>) => void;
-    resetSelectedModal: () => void;
-    setSelectedWidget: (widget: Partial<LowCodeWidget.BasicSchema>, scope?: SCOPE) => void;
-    resetSelectedWidget: (scope?: SCOPE) => void;
-    selectedAllPropEditors: import('vue').ComputedRef<any>;
-    selectedAllStyleEditors: import('vue').ComputedRef<any>;
-    selectedAllEvents: import('vue').ComputedRef<any>;
-    selectedEvents: import('vue').WritableComputedRef<import('node_modules/@gct-paas/schema/es/interface/widget/i-events').IBasicEvents, import('node_modules/@gct-paas/schema/es/interface/widget/i-events').IBasicEvents>;
-    selectedProps: import('vue').ComputedRef<import('node_modules/@gct-paas/schema/es/interface/widget/i-props').ICommonProps & import('node_modules/@gct-paas/schema/es/interface/widget/i-props').IDisplayProps>;
-    selectedStyle: import('vue').ComputedRef<Partial<import('node_modules/@gct-paas/schema/es/interface/widget/i-styles').IBasicStyle>>;
-    selectedWidget: Ref<Partial<import('node_modules/@gct-paas/schema/es/interface/widget/i-schemas').IBasicSchema>, Partial<import('node_modules/@gct-paas/schema/es/interface/widget/i-schemas').IBasicSchema>>;
-    selectedRef: import('vue').ComputedRef<import('node_modules/@gct-paas/schema/es/interface/widget/i-schemas').IBasicSchema>;
-    selectModalRef: import('vue').ComputedRef<import('node_modules/@gct-paas/schema/es/interface/widget/i-schemas').IBasicSchema>;
-    focusFormContainer: import('vue').ComputedRef<{
-        isFocus: boolean;
-        formModelKey?: undefined;
-        formId?: undefined;
-        nodeType?: undefined;
-        /**子表关联父模型 */
-        refParentModelkey?: undefined;
-    } | {
-        isFocus: boolean;
-        formModelKey: any;
-        formId: string | undefined;
-        nodeType: any;
-        /**子表关联父模型 */
-        refParentModelkey: any;
-    } | {
-        isFocus: boolean;
-        formModelKey: string;
-        formId: string;
-        nodeType: string;
-        /**子表关联父模型 */
-        refParentModelkey?: undefined;
-    }>;
-    selectedAllDesingerConfig: import('vue').ComputedRef<any>;
-    setFocusFormContainer: (formId: string) => void;
-    focusFormRef: import('vue').ComputedRef<Partial<import('node_modules/@gct-paas/schema/es/interface/widget/i-schemas').IBasicSchema>>;
-    hoverRef: import('vue').ComputedRef<Partial<import('node_modules/@gct-paas/schema/es/interface/widget/i-schemas').IBasicSchema>>;
-    setHoverWidget: (widget?: Partial<LowCodeWidget.BasicSchema>) => void;
-    selectedParentRef: import('vue').ComputedRef<import('node_modules/@gct-paas/schema/es/interface/widget/i-schemas').IBasicSchema | undefined>;
-    setSelectedParentWidgets: (widgets: LowCodeWidget.BasicSchema[]) => void;
-    selectedParentsRef: import('vue').ComputedRef<import('node_modules/@gct-paas/schema/es/interface/widget/i-schemas').IBasicSchema[]>;
-    selectedParentChildrenRef: import('vue').ComputedRef<import('node_modules/@gct-paas/schema/es/interface/widget/i-schemas').IBasicSchema[]>;
-    setSelectedParentChildrenRef: (widgets: LowCodeWidget.BasicSchema[]) => void;
-    selectedConfigRef: import('vue').ComputedRef<IVue3DndItemOptions<import('node_modules/@gct-paas/schema/es/interface/widget/i-schemas').IBasicSchema>>;
-    setSelectedConfig: (config: IVue3DndItemOptions) => void;
-};