@ibiz-template/vue3-components 0.7.38-alpha.56 → 0.7.40-alpha.9

package/es/panel-component/coop-pos/index.d.ts

@@ -13,8 +13,8 @@ export declare const IBizCoopPos: import("@ibiz-template/vue3-util").TypeWithIns
 }, {
     ns: import("@ibiz-template/core").Namespace;
     c: CoopPosController;
-    messages: import("vue").ComputedRef<IData[]>;
-    renderItem: (message: IData) => string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    messages: import("vue").ComputedRef<import("@ibiz-template/core").IApiData[]>;
+    renderItem: (message: import("@ibiz-template/core").IApiData) => string | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
         [key: string]: any;
     }> | null;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{

package/es/panel-component/global-search/global-search.controller.d.ts

@@ -0,0 +1,113 @@
+import { IModalData, PanelItemController } from '@ibiz-template/runtime';
+import { IPanelContainer } from '@ibiz/model-core';
+import { GlobalSearchState, ISearchItem } from './global-search.state';
+/**
+ * 全局搜索控制器
+ *
+ * @export
+ * @class GlobalSearchController
+ * @extends {PanelItemController<IPanelContainer>}
+ */
+export declare class GlobalSearchController extends PanelItemController<IPanelContainer> {
+    state: GlobalSearchState;
+    /**
+     * 主键属性名称
+     *
+     * @type {string}
+     * @memberof GlobalSearchController
+     */
+    keyName: string;
+    /**
+     * 主文本属性名称
+     *
+     * @type {string}
+     * @memberof GlobalSearchController
+     */
+    textName: string;
+    /**
+     * 搜索历史缓存标识
+     *
+     * @protected
+     * @type {string}
+     * @memberof GlobalSearchController
+     */
+    protected historyCache: string;
+    /**
+     * 创建全局搜索状态对象
+     *
+     * @protected
+     * @return {*}  {GlobalSearchState}
+     * @memberof GlobalSearchController
+     */
+    protected createState(): GlobalSearchState;
+    /**
+     * 初始化
+     *
+     * @protected
+     * @return {*}  {Promise<void>}
+     * @memberof GlobalSearchController
+     */
+    protected onInit(): Promise<void>;
+    /**
+     * 初始化全局搜索项
+     *
+     * @protected
+     * @memberof GlobalSearchController
+     */
+    protected initGlobalSearchItem(): Promise<void>;
+    /**
+     * 初始化历史记录
+     *
+     * @private
+     * @memberof GlobalSearchController
+     */
+    private initHistory;
+    /**
+     * 添加历史
+     * - 最多5条记录
+     * @private
+     * @param {string} query
+     * @memberof GlobalSearchController
+     */
+    private addToHistory;
+    /**
+     * 清除历史
+     *
+     * @memberof GlobalSearchController
+     */
+    clearHistory(): void;
+    /**
+     * 搜索
+     *
+     * @param {string} query
+     * @return {*}  {Promise<IData[]>}
+     * @memberof GlobalSearchController
+     */
+    search(query: string): Promise<IData[]>;
+    /**
+     * 通过AC模式加载数据
+     *
+     * @param {ISearchItem} item
+     * @param {string} [query]
+     * @return {*}  {Promise<void>}
+     * @memberof GlobalSearchController
+     */
+    loadByACMode(item: ISearchItem, query?: string): Promise<IData[]>;
+    /**
+     * 打开链接视图
+     *
+     * @param {IData} data
+     * @param {ISearchItem} [item]
+     * @return {*}  {(Promise<IModalData | undefined>)}
+     * @memberof GlobalSearchController
+     */
+    openLinkView(data: IData, item?: ISearchItem): Promise<IModalData | undefined>;
+    /**
+     * 根据实体获取搜索项
+     *
+     * @param {string} appDataEntityId 实体标识
+     * @return {*}  {(ISearchItem | undefined)}
+     * @memberof GlobalSearchController
+     */
+    getSearchItemByEntity(appDataEntityId: string): ISearchItem | undefined;
+}

package/es/panel-component/global-search/global-search.controller.mjs

@@ -0,0 +1,221 @@
+import { PanelItemController, getDeACMode, getAcItemProvider, calcDeCodeNameById, OpenAppViewCommand } from '@ibiz-template/runtime';
+import { GlobalSearchState } from './global-search.state.mjs';
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class GlobalSearchController extends PanelItemController {
+  constructor() {
+    super(...arguments);
+    /**
+     * 主键属性名称
+     *
+     * @type {string}
+     * @memberof GlobalSearchController
+     */
+    __publicField(this, "keyName", "srfkey");
+    /**
+     * 主文本属性名称
+     *
+     * @type {string}
+     * @memberof GlobalSearchController
+     */
+    __publicField(this, "textName", "srfmajortext");
+    /**
+     * 搜索历史缓存标识
+     *
+     * @protected
+     * @type {string}
+     * @memberof GlobalSearchController
+     */
+    __publicField(this, "historyCache", "global-search-history");
+  }
+  /**
+   * 创建全局搜索状态对象
+   *
+   * @protected
+   * @return {*}  {GlobalSearchState}
+   * @memberof GlobalSearchController
+   */
+  createState() {
+    var _a;
+    return new GlobalSearchState((_a = this.parent) == null ? void 0 : _a.state);
+  }
+  /**
+   * 初始化
+   *
+   * @protected
+   * @return {*}  {Promise<void>}
+   * @memberof GlobalSearchController
+   */
+  async onInit() {
+    await super.onInit();
+    this.initHistory();
+    await this.initGlobalSearchItem();
+  }
+  /**
+   * 初始化全局搜索项
+   *
+   * @protected
+   * @memberof GlobalSearchController
+   */
+  async initGlobalSearchItem() {
+    var _a;
+    const appFuncs = ((_a = ibiz.hub.getApp(this.model.appId).model.appFuncs) == null ? void 0 : _a.filter(
+      (func) => func.appFuncType === "SEARCH" && func.appDEACModeId && func.appDataEntityId
+    )) || [];
+    await Promise.all(
+      appFuncs.map(async (func) => {
+        const deACMode = await getDeACMode(
+          func.appDEACModeId,
+          func.appDataEntityId,
+          func.appId
+        );
+        if (deACMode) {
+          let acItemProvider;
+          if (deACMode.itemSysPFPluginId) {
+            acItemProvider = await getAcItemProvider(deACMode);
+          }
+          this.state.items.push({
+            deACMode,
+            acItemProvider,
+            appDataEntityId: func.appDataEntityId
+          });
+        }
+      })
+    );
+  }
+  /**
+   * 初始化历史记录
+   *
+   * @private
+   * @memberof GlobalSearchController
+   */
+  initHistory() {
+    const cache = localStorage.getItem(this.historyCache);
+    if (cache)
+      this.state.histories = JSON.parse(cache);
+  }
+  /**
+   * 添加历史
+   * - 最多5条记录
+   * @private
+   * @param {string} query
+   * @memberof GlobalSearchController
+   */
+  addToHistory(query) {
+    const histories = this.state.histories.filter((history) => history !== query);
+    histories.push(query);
+    if (histories.length > 5)
+      histories.shift();
+    this.state.histories = histories;
+    localStorage.setItem(
+      this.historyCache,
+      JSON.stringify(this.state.histories)
+    );
+  }
+  /**
+   * 清除历史
+   *
+   * @memberof GlobalSearchController
+   */
+  clearHistory() {
+    this.state.histories = [];
+    localStorage.setItem(
+      this.historyCache,
+      JSON.stringify(this.state.histories)
+    );
+  }
+  /**
+   * 搜索
+   *
+   * @param {string} query
+   * @return {*}  {Promise<IData[]>}
+   * @memberof GlobalSearchController
+   */
+  async search(query) {
+    const result = [];
+    await Promise.all(
+      this.state.items.map(async (item) => {
+        const list = await this.loadByACMode(item, query);
+        result.push(...list);
+      })
+    );
+    this.addToHistory(query);
+    return result;
+  }
+  /**
+   * 通过AC模式加载数据
+   *
+   * @param {ISearchItem} item
+   * @param {string} [query]
+   * @return {*}  {Promise<void>}
+   * @memberof GlobalSearchController
+   */
+  async loadByACMode(item, query) {
+    const { appDataEntityId, deACMode } = item;
+    const { minorSortDir, minorSortAppDEFieldId, appDEDataSetId } = deACMode;
+    if (!appDEDataSetId)
+      return [];
+    const params = {};
+    if (minorSortDir && minorSortAppDEFieldId)
+      Object.assign(params, {
+        sort: "".concat(minorSortAppDEFieldId.toLowerCase(), ",").concat(minorSortDir.toLowerCase())
+      });
+    if (query)
+      Object.assign(params, { query });
+    const app = ibiz.hub.getApp(deACMode.appId);
+    const response = await app.deService.exec(
+      appDataEntityId,
+      appDEDataSetId,
+      this.panel.context,
+      params
+    );
+    if (response.ok && response.data)
+      return response.data;
+    return [];
+  }
+  /**
+   * 打开链接视图
+   *
+   * @param {IData} data
+   * @param {ISearchItem} [item]
+   * @return {*}  {(Promise<IModalData | undefined>)}
+   * @memberof GlobalSearchController
+   */
+  async openLinkView(data, item) {
+    if (!item)
+      return;
+    const { appDataEntityId, deACMode } = item;
+    const { linkAppViewId } = deACMode;
+    if (!linkAppViewId)
+      return;
+    const context = this.panel.context.clone();
+    const deName = calcDeCodeNameById(appDataEntityId);
+    Object.assign(context, { [deName]: data[this.keyName] });
+    return ibiz.commands.execute(
+      OpenAppViewCommand.TAG,
+      linkAppViewId,
+      context,
+      {}
+    );
+  }
+  /**
+   * 根据实体获取搜索项
+   *
+   * @param {string} appDataEntityId 实体标识
+   * @return {*}  {(ISearchItem | undefined)}
+   * @memberof GlobalSearchController
+   */
+  getSearchItemByEntity(appDataEntityId) {
+    return this.state.items.find(
+      (item) => calcDeCodeNameById(item.appDataEntityId) === appDataEntityId.toLowerCase()
+    );
+  }
+}
+
+export { GlobalSearchController };

package/es/panel-component/global-search/global-search.css

@@ -0,0 +1 @@
+.ibiz-global-search{width:100%}.ibiz-global-search__search .el-input__wrapper{width:240px}.ibiz-global-search__search .el-input__wrapper.is-focus{width:320px}.ibiz-global-search__search.is-search .el-input__wrapper{width:320px}.ibiz-global-search__content{display:flex;align-items:center;flex-direction:column}.ibiz-global-search__content--action-item{width:100%}.ibiz-global-search__content--action-item .el-button{width:100%}.ibiz-global-search__list{width:100%;max-height:280px;display:flex;overflow-y:auto;align-items:center;flex-direction:column}.ibiz-global-search__list--item{margin:0;width:100%;padding:0 20px;cursor:pointer;text-align:left;overflow:hidden;min-height:34px;line-height:34px;white-space:nowrap;text-overflow:ellipsis;color:var(--ibiz-color-text-0);font-size:var(--ibiz-font-size-regular)}.ibiz-global-search__list--item:hover{background-color:var(--ibiz-color-fill-1)}.ibiz-global-search__popper{min-width:320px!important;max-width:700px}

package/es/panel-component/global-search/global-search.d.ts

@@ -0,0 +1,36 @@
+import { PropType } from 'vue';
+import { IPanelRawItem } from '@ibiz/model-core';
+import { GlobalSearchController } from './global-search.controller';
+import './global-search.scss';
+export declare const GlobalSearch: import("vue").DefineComponent<{
+    modelData: {
+        type: PropType<IPanelRawItem>;
+        required: true;
+    };
+    controller: {
+        type: PropType<GlobalSearchController>;
+        required: true;
+    };
+}, {
+    c: GlobalSearchController;
+    ns: import("@ibiz-template/core").Namespace;
+    list: import("vue").Ref<import("@ibiz-template/core").IApiData[]>;
+    visible: import("vue").Ref<boolean>;
+    editorRef: import("vue").Ref<any>;
+    handleClear: () => void;
+    handleEnter: (event: KeyboardEvent) => void;
+    renderAction: () => JSX.Element | undefined;
+    renderSearchList: () => JSX.Element;
+    renderHistoryList: () => JSX.Element;
+    handleInputClick: (event: MouseEvent) => void;
+    renderBlankPlaceholder: () => JSX.Element | undefined;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    modelData: {
+        type: PropType<IPanelRawItem>;
+        required: true;
+    };
+    controller: {
+        type: PropType<GlobalSearchController>;
+        required: true;
+    };
+}>>, {}, {}>;

package/es/panel-component/global-search/global-search.mjs

@@ -0,0 +1,194 @@
+import { isVNode, defineComponent, ref, onMounted, onUnmounted, withDirectives, createVNode, resolveDirective, resolveComponent, h } from 'vue';
+import { showTitle } from '@ibiz-template/core';
+import { useNamespace } from '@ibiz-template/vue3-util';
+import './global-search.css';
+
+"use strict";
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const GlobalSearch = /* @__PURE__ */ defineComponent({
+  name: "IBizGlobalSearch",
+  props: {
+    modelData: {
+      type: Object,
+      required: true
+    },
+    controller: {
+      type: Object,
+      required: true
+    }
+  },
+  setup(props) {
+    const c = props.controller;
+    const ns = useNamespace("global-search");
+    const loading = ref(false);
+    const list = ref([]);
+    const visible = ref(false);
+    const editorRef = ref();
+    const onSearch = async () => {
+      visible.value = true;
+      loading.value = true;
+      try {
+        list.value = c.state.query ? await c.search(c.state.query) : [];
+      } catch (error) {
+        ibiz.log.error(error);
+      } finally {
+        loading.value = false;
+      }
+    };
+    const handleEnter = (event) => {
+      if (event.key === "Enter")
+        onSearch();
+    };
+    const handleClear = () => {
+      list.value = [];
+    };
+    const handleHistoryItemClick = async (event, value) => {
+      event.stopPropagation();
+      c.state.query = value;
+      await onSearch();
+    };
+    const handleSearchItemClick = async (event, data, item) => {
+      event.stopPropagation();
+      c.state.query = data[c.textName];
+      visible.value = false;
+      handleClear();
+      await c.openLinkView(data, item);
+    };
+    const handleClickOutside = (event) => {
+      if (!event.target.closest(".".concat(ns.b())) && !event.target.closest(".el-input__suffix")) {
+        visible.value = false;
+      }
+    };
+    const handleInputClick = (event) => {
+      event.stopPropagation();
+      visible.value = true;
+    };
+    const handleClearHistory = (event) => {
+      event.stopPropagation();
+      visible.value = false;
+      handleClear();
+      c.clearHistory();
+    };
+    const handleKeyup = (event) => {
+      var _a;
+      if (event.key === "\\")
+        (_a = editorRef.value) == null ? void 0 : _a.focus();
+    };
+    onMounted(() => {
+      document.addEventListener("click", handleClickOutside);
+      document.addEventListener("keyup", handleKeyup);
+    });
+    onUnmounted(() => {
+      document.removeEventListener("click", handleClickOutside);
+      document.removeEventListener("keyup", handleKeyup);
+    });
+    const renderBlankPlaceholder = () => {
+      if (!c.state.query && !c.state.histories.length || c.state.query && !list.value.length)
+        return withDirectives(createVNode("div", {
+          "class": ns.e("empty")
+        }, [loading.value ? ibiz.i18n.t("panelComponent.globalSearch.loading") : ibiz.i18n.t("panelComponent.globalSearch.empty")]), [[resolveDirective("loading"), loading.value]]);
+    };
+    const renderAction = () => {
+      let _slot;
+      if (!c.state.query && c.state.histories.length)
+        return createVNode("div", {
+          "class": ns.em("content", "action-item")
+        }, [createVNode(resolveComponent("el-button"), {
+          "text": true,
+          "onClick": handleClearHistory
+        }, _isSlot(_slot = ibiz.i18n.t("panelComponent.globalSearch.clearHistory")) ? _slot : {
+          default: () => [_slot]
+        })]);
+    };
+    const renderHistoryList = () => {
+      return createVNode("div", {
+        "class": ns.e("list")
+      }, [c.state.histories.map((history) => {
+        return createVNode("div", {
+          "onClick": (event) => handleHistoryItemClick(event, history),
+          "class": [ns.em("list", "item"), ns.em("list", "history-item")]
+        }, [history]);
+      })]);
+    };
+    const renderSearchList = () => {
+      return createVNode("div", {
+        "class": ns.e("list")
+      }, [list.value.map((item) => {
+        const searchItem = c.getSearchItemByEntity(item.srfdecodename);
+        let content = item[c.textName];
+        if (searchItem == null ? void 0 : searchItem.acItemProvider) {
+          content = h(resolveComponent(searchItem.acItemProvider.component), {
+            item,
+            controller: c
+          });
+        } else if (searchItem == null ? void 0 : searchItem.deACMode.itemLayoutPanel) {
+          content = createVNode(resolveComponent("iBizControlShell"), {
+            "data": item,
+            "modelData": searchItem.deACMode.itemLayoutPanel,
+            "context": c.panel.context,
+            "params": c.panel.params
+          }, null);
+        }
+        return createVNode("div", {
+          "class": [ns.em("list", "item"), ns.em("list", "srearch-item")],
+          "onClick": (event) => handleSearchItemClick(event, item, searchItem),
+          "title": showTitle(item[c.textName])
+        }, [content]);
+      })]);
+    };
+    return {
+      c,
+      ns,
+      list,
+      visible,
+      editorRef,
+      handleClear,
+      handleEnter,
+      renderAction,
+      renderSearchList,
+      renderHistoryList,
+      handleInputClick,
+      renderBlankPlaceholder
+    };
+  },
+  render() {
+    return createVNode("div", {
+      "class": this.ns.b()
+    }, [createVNode(resolveComponent("el-popover"), {
+      "width": "auto",
+      "visible": this.visible,
+      "placement": "bottom-start",
+      "popper-class": this.ns.e("popper")
+    }, {
+      reference: () => {
+        return createVNode(resolveComponent("el-input"), {
+          "clearable": true,
+          "ref": "editorRef",
+          "onKeyup": this.handleEnter,
+          "modelValue": this.c.state.query,
+          "onUpdate:modelValue": ($event) => this.c.state.query = $event,
+          "placeholder": ibiz.i18n.t("panelComponent.globalSearch.placeholder"),
+          "class": [this.ns.e("search"), this.ns.is("search", this.visible)],
+          "onClick": this.handleInputClick,
+          "onClear": this.handleClear
+        }, {
+          prefix: () => {
+            return createVNode("ion-icon", {
+              "name": "search",
+              "class": this.ns.em("search", "icon")
+            }, null);
+          }
+        });
+      },
+      default: () => {
+        return createVNode("div", {
+          "class": this.ns.e("content")
+        }, [this.c.state.query ? this.renderSearchList() : this.renderHistoryList(), this.renderBlankPlaceholder(), this.renderAction()]);
+      }
+    })]);
+  }
+});
+
+export { GlobalSearch };

package/es/panel-component/global-search/global-search.provider.d.ts

@@ -0,0 +1,14 @@
+import { IPanelItem } from '@ibiz/model-core';
+import { PanelController, IPanelItemProvider, PanelItemController } from '@ibiz-template/runtime';
+import { GlobalSearchController } from './global-search.controller';
+/**
+ * 全局搜索适配器
+ *
+ * @export
+ * @class GlobalSearchProvider
+ * @implements {IPanelItemProvider}
+ */
+export declare class GlobalSearchProvider implements IPanelItemProvider {
+    component: string;
+    createController(panelItem: IPanelItem, panel: PanelController, parent: PanelItemController | undefined): Promise<GlobalSearchController>;
+}

package/es/panel-component/global-search/global-search.provider.mjs

@@ -0,0 +1,21 @@
+import { GlobalSearchController } from './global-search.controller.mjs';
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class GlobalSearchProvider {
+  constructor() {
+    __publicField(this, "component", "IBizGlobalSearch");
+  }
+  async createController(panelItem, panel, parent) {
+    const c = new GlobalSearchController(panelItem, panel, parent);
+    await c.init();
+    return c;
+  }
+}
+
+export { GlobalSearchProvider };

package/es/panel-component/global-search/global-search.state.d.ts

@@ -0,0 +1,61 @@
+import { IAcItemProvider, PanelItemState } from '@ibiz-template/runtime';
+import { IAppDEACMode } from '@ibiz/model-core';
+/**
+ * 全局搜索项
+ *
+ * @export
+ * @interface ISearchItem
+ */
+export interface ISearchItem {
+    /**
+     * 实体标识
+     *
+     * @type {string}
+     * @memberof ISearchItem
+     */
+    appDataEntityId: string;
+    /**
+     * 实体自填模式
+     *
+     * @type {IAppDEACMode}
+     * @memberof ISearchItem
+     */
+    deACMode: IAppDEACMode;
+    /**
+     * 自填列表项适配器
+     *
+     * @type {IAcItemProvider}
+     * @memberof ISearchItem
+     */
+    acItemProvider?: IAcItemProvider;
+}
+/**
+ * 全局搜索状态
+ *
+ * @export
+ * @class GlobalSearchState
+ * @extends {PanelItemState}
+ */
+export declare class GlobalSearchState extends PanelItemState {
+    /**
+     * 当前快速搜索值
+     *
+     * @type {string}
+     * @memberof GlobalSearchState
+     */
+    query: string;
+    /**
+     * 自填模式全局搜索项
+     *
+     * @type {ISearchItem[]}
+     * @memberof GlobalSearchState
+     */
+    items: ISearchItem[];
+    /**
+     * 搜索历史记录
+     *
+     * @type {string[]}
+     * @memberof GlobalSearchState
+     */
+    histories: string[];
+}