@ibiz-template/vue3-components 0.1.12-dev.0 → 0.1.13

package/es/panel-component/auth-userinfo/auth-userinfo.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, ref, createVNode, resolveComponent, createTextVNode } from 'vue';
+import { defineComponent, ref, inject, computed, createVNode, resolveComponent, createTextVNode } from 'vue';
 import { useRouter } from 'vue-router';
 import { useNamespace } from '@ibiz-template/vue3-util';
 import './auth-userinfo.css';
@@ -18,11 +18,13 @@ const AuthUserinfo = /* @__PURE__ */ defineComponent({
       required: true
     }
   },
-  setup() {
+  setup(prop) {
     var _a;
     const ns = useNamespace("user-info");
+    const c = prop.controller;
     const {
-      srfusername = "\u6E38\u5BA2"
+      srfusername = "\u6E38\u5BA2",
+      srfpersonname
     } = ((_a = ibiz.appData) == null ? void 0 : _a.context) || {};
     const router = useRouter();
     const isDarkTheme = ref(false);
@@ -46,11 +48,21 @@ const AuthUserinfo = /* @__PURE__ */ defineComponent({
         htmlDom.classList.add(addClass);
       }
     };
+    const ctx = inject("ctx", void 0);
+    const menuAlign = computed(() => {
+      if (ctx == null ? void 0 : ctx.view) {
+        return ctx.view.model.mainMenuAlign || "LEFT";
+      }
+      return "LEFT";
+    });
     return {
       ns,
+      c,
       srfusername,
+      srfpersonname,
       router,
       isDarkTheme,
+      menuAlign,
       handleSwitchChange
     };
   },
@@ -64,14 +76,25 @@ const AuthUserinfo = /* @__PURE__ */ defineComponent({
   },
   render() {
     return createVNode("div", {
-      "class": [this.ns.b(), this.ns.m(this.modelData.id), ...this.controller.containerClass]
+      "class": [this.ns.b(), this.ns.m(this.modelData.id), ...this.controller.containerClass, this.ns.is("left", this.menuAlign === "LEFT"), this.ns.is("top", this.menuAlign === "TOP")]
     }, [createVNode(resolveComponent("el-dropdown"), null, {
-      default: () => createVNode("span", {
+      default: () => createVNode("div", {
+        "class": this.ns.b("info")
+      }, [createVNode("div", {
         "class": this.ns.b("label")
       }, [createVNode(resolveComponent("el-avatar"), {
         "class": this.ns.b("avatar"),
         "src": "./assets/images/user-avatar.png"
-      }, null), this.srfusername]),
+      }, null), createVNode("div", {
+        "class": this.ns.b("name")
+      }, [createVNode("div", {
+        "class": this.ns.be("name", "user-name")
+      }, [this.srfusername]), this.menuAlign === "LEFT" && createVNode("div", {
+        "class": this.ns.be("name", "person-name")
+      }, [this.srfpersonname])])]), createVNode("ion-icon", {
+        "class": this.ns.e("down"),
+        "name": "chevron-down-outline"
+      }, null)]),
       dropdown: () => createVNode(resolveComponent("el-dropdown-menu"), null, {
         default: () => [createVNode(resolveComponent("el-dropdown-item"), null, {
           default: () => [createVNode("ion-icon", {

package/es/panel-component/auth-userinfo/index.d.ts

@@ -11,9 +11,12 @@ export declare const IBizAuthUserinfo: import("@ibiz-template/vue3-util").TypeWi
     };
 }, {
     ns: import("@ibiz-template/core").Namespace;
+    c: import("@ibiz-template/runtime").PanelItemController<import("@ibiz/model-core").IPanelItem>;
     srfusername: any;
+    srfpersonname: any;
     router: import("vue-router").Router;
     isDarkTheme: import("vue").Ref<boolean>;
+    menuAlign: import("vue").ComputedRef<string>;
     handleSwitchChange: (newVal: boolean) => void;
 }, unknown, {}, {
     onClick(): Promise<void>;

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

@@ -13,6 +13,7 @@ export * from './panel-rawitem';
 export * from './panel-tab-panel';
 export * from './panel-tab-page';
 export * from './split-container';
+export * from './panel-index-view-search';
 export declare const IBizPanelComponents: {
     install: (v: App) => void;
 };

package/es/panel-component/index.mjs

@@ -18,6 +18,7 @@ import { IBizPanelViewContent } from './panel-view-content/index.mjs';
 import { IBizPanelTabPanel } from './panel-tab-panel/index.mjs';
 import { IBizPanelTabPage } from './panel-tab-page/index.mjs';
 import { IBizSplitContainer } from './split-container/index.mjs';
+import { IBizPanelIndexViewSearch } from './panel-index-view-search/index.mjs';
 export { PanelContainerProvider } from './panel-container/panel-container.provider.mjs';
 export { PanelContainerState } from './panel-container/panel-container.state.mjs';
 export { PanelContainerController } from './panel-container/panel-container.controller.mjs';
@@ -48,6 +49,7 @@ export { PanelTabPanelProvider } from './panel-tab-panel/panel-tab-panel.provide
 export { PanelTabPageProvider } from './panel-tab-page/panel-tab-page.provider.mjs';
 export { SplitContainerProvider } from './split-container/split-container.provider.mjs';
 export { SplitContainerController } from './split-container/split-container.controller.mjs';
+export { PanelIndexViewSearchProvider } from './panel-index-view-search/panel-index-view-search.provider.mjs';
 
 const IBizPanelComponents = {
   install: (v) => {
@@ -71,7 +73,8 @@ const IBizPanelComponents = {
     v.use(IBizPanelTabPanel);
     v.use(IBizPanelTabPage);
     v.use(IBizSplitContainer);
+    v.use(IBizPanelIndexViewSearch);
   }
 };
 
-export { IBizAuthUserinfo, IBizNavPos, IBizNavPosIndex, IBizPanelAppTitle, IBizPanelButton, IBizPanelComponents, IBizPanelContainer, IBizPanelCtrlPos, IBizPanelField, IBizPanelRawItem, IBizPanelTabPage, IBizPanelTabPanel, IBizScrollContainer, IBizSplitContainer, IBizPanelComponents as default };
+export { IBizAuthUserinfo, IBizNavPos, IBizNavPosIndex, IBizPanelAppTitle, IBizPanelButton, IBizPanelComponents, IBizPanelContainer, IBizPanelCtrlPos, IBizPanelField, IBizPanelIndexViewSearch, IBizPanelRawItem, IBizPanelTabPage, IBizPanelTabPanel, IBizScrollContainer, IBizSplitContainer, IBizPanelComponents as default };

package/es/panel-component/nav-tabs/nav-tabs.css

@@ -1 +1 @@
-.ibiz-nav-tabs{--ibiz-nav-tabs-padding:var(--ibiz-spacing-base-tight);--ibiz-nav-tabs-left-width:100%;--ibiz-nav-tabs-right-width:60px;--ibiz-nav-tabs-item-height:40px;--ibiz-nav-tabs-item-padding:0 var(--ibiz-spacing-base-loose);--ibiz-nav-tabs-item-margin:0 var(--ibiz-spacing-base) 0 0;--ibiz-nav-tabs-item-font-size:var(--ibiz-font-size-regular);--ibiz-nav-tabs-item-font-weight:var(--ibiz-font-weight-regular);--ibiz-nav-tabs-item-border-radius:var(--ibiz-border-radius-medium);--ibiz-nav-tabs-item-bg-color:transparent;--ibiz-nav-tabs-item-color:var(--ibiz-color-text-0);--ibiz-nav-tabs-item-hover-color:var(--ibiz-color-primary-hover);--ibiz-nav-tabs-item-active-color:var(--ibiz-color-primary);display:flex;align-items:center;justify-content:flex-start;position:relative;padding:var(--ibiz-nav-tabs-padding)}.ibiz-nav-tabs__left{display:flex;align-items:center;width:var(--ibiz-nav-tabs-left-width)}.ibiz-nav-tabs__left .el-tabs{width:100%;--el-tabs-header-height:40px}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav{border:none}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item{display:flex;align-items:center;height:var(--ibiz-nav-tabs-item-height);padding:var(--ibiz-nav-tabs-item-padding);margin:var(--ibiz-nav-tabs-item-margin);overflow:hidden;font-size:var(--ibiz-nav-tabs-item-font-size);font-weight:var(--ibiz-nav-tabs-item-font-weight);color:var(--ibiz-nav-tabs-item-color);vertical-align:middle;background-color:var(--ibiz-nav-tabs-item-bg-color);border:1px solid var(--ibiz-color-border);border-radius:var(--ibiz-nav-tabs-item-border-radius);box-shadow:0 1px 2px 0 var(--ibiz-color-border);opacity:1}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item:hover{padding:var(--ibiz-nav-tabs-item-padding);color:var(--ibiz-nav-tabs-item-hover-color)}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item:hover .is-icon-close{color:var(--ibiz-nav-tabs-item-hover-color)}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item.is-active{padding:var(--ibiz-nav-tabs-item-padding);color:var(--ibiz-color-white);background-color:var(--ibiz-nav-tabs-item-active-color);box-shadow:none}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item.is-active .is-icon-close{color:var(--ibiz-color-white)}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item.is-closable{padding:var(--ibiz-nav-tabs-item-padding)}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item.is-closable.hover{padding:var(--ibiz-nav-tabs-item-padding)}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item .is-icon-close{position:relative;top:1px}.ibiz-nav-tabs__left .el-tabs .el-tabs__header{margin-bottom:0;border-bottom:none}.ibiz-nav-tabs__right{display:none;width:var(--ibiz-nav-tabs-right-width)}
+.ibiz-nav-tabs{--ibiz-nav-tabs-padding:var(--ibiz-spacing-base-tight);--ibiz-nav-tabs-left-width:calc(100% - 60px);--ibiz-nav-tabs-right-width:60px;--ibiz-nav-tabs-right-height:30px;--ibiz-nav-tabs-item-height:40px;--ibiz-nav-tabs-item-padding:0 var(--ibiz-spacing-base-loose);--ibiz-nav-tabs-item-margin:0 var(--ibiz-spacing-base) 0 0;--ibiz-nav-tabs-item-font-size:var(--ibiz-font-size-regular);--ibiz-nav-tabs-item-font-weight:var(--ibiz-font-weight-regular);--ibiz-nav-tabs-item-border-radius:var(--ibiz-border-radius-medium);--ibiz-nav-tabs-item-bg-color:transparent;--ibiz-nav-tabs-item-color:var(--ibiz-color-text-0);--ibiz-nav-tabs-item-hover-color:var(--ibiz-color-primary-hover);--ibiz-nav-tabs-item-active-color:var(--ibiz-color-primary);display:flex;align-items:center;justify-content:flex-start;position:relative;padding:var(--ibiz-nav-tabs-padding)}.ibiz-nav-tabs__left{display:flex;align-items:center;width:var(--ibiz-nav-tabs-left-width)}.ibiz-nav-tabs__left .el-tabs{width:100%;--el-tabs-header-height:40px}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav{border:none}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item{display:flex;align-items:center;height:var(--ibiz-nav-tabs-item-height);padding:var(--ibiz-nav-tabs-item-padding);margin:var(--ibiz-nav-tabs-item-margin);overflow:hidden;font-size:var(--ibiz-nav-tabs-item-font-size);font-weight:var(--ibiz-nav-tabs-item-font-weight);color:var(--ibiz-nav-tabs-item-color);vertical-align:middle;background-color:var(--ibiz-nav-tabs-item-bg-color);border:1px solid var(--ibiz-color-border);border-radius:var(--ibiz-nav-tabs-item-border-radius);box-shadow:0 1px 2px 0 var(--ibiz-color-border);opacity:1}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item:hover{padding:var(--ibiz-nav-tabs-item-padding);color:var(--ibiz-nav-tabs-item-hover-color)}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item:hover .is-icon-close{color:var(--ibiz-nav-tabs-item-hover-color)}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item.is-active{padding:var(--ibiz-nav-tabs-item-padding);color:var(--ibiz-color-white);background-color:var(--ibiz-nav-tabs-item-active-color);box-shadow:none}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item.is-active .is-icon-close{color:var(--ibiz-color-white)}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item.is-closable{padding:var(--ibiz-nav-tabs-item-padding)}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item.is-closable.hover{padding:var(--ibiz-nav-tabs-item-padding)}.ibiz-nav-tabs__left .el-tabs .el-tabs__nav .el-tabs__item .is-icon-close{position:relative;top:1px}.ibiz-nav-tabs__left .el-tabs .el-tabs__header{margin-bottom:0;border-bottom:none}.ibiz-nav-tabs__right{width:var(--ibiz-nav-tabs-right-width)}.ibiz-nav-tabs__right .el-dropdown button{height:var(--ibiz-nav-tabs-right-height)}

package/es/panel-component/panel-app-header/panel-app-header.css

@@ -1 +1 @@
-.ibiz-panel-app-header{--ibiz-panel-app-header-color:var(--ibiz-color-text-0);--ibiz-panel-app-header-bg-color:var(--ibiz-color-primary);--ibiz-panel-app-header-border-color:var(--ibiz-color-border);width:100%;height:100%;color:var(--ibiz-panel-app-header-color);background-color:var(--ibiz-panel-app-header-bg-color);border-bottom:1px solid var(--ibiz-panel-app-header-border-color)}.ibiz-panel-app-header>.ibiz-row{height:100%}
+.ibiz-panel-app-header{--ibiz-panel-app-header-color:var(--ibiz-color-text-0);--ibiz-panel-app-header-bg-color:var(--ibiz-color-primary);--ibiz-panel-app-header-border-color:var(--ibiz-color-border);width:100%;height:100%;color:var(--ibiz-panel-app-header-color);background-color:var(--ibiz-panel-app-header-bg-color)}.ibiz-panel-app-header>.ibiz-row{height:100%}

package/es/panel-component/panel-app-title/panel-app-title.css

@@ -1 +1 @@
-.ibiz-panel-app-title{--ibiz-panel-app-title-color:var(--ibiz-color-text-0);--ibiz-panel-app-title-font-size:var(--ibiz-font-size-header-2);--ibiz-panel-app-title-font-wight:var(--ibiz-font-weight-bold);display:flex;align-items:center;justify-content:center;height:100%}.ibiz-panel-app-title__title{font-size:var(--ibiz-panel-app-title-font-size);font-weight:700;color:var(--ibiz-panel-app-title-color)}.ibiz-panel-app-title__logo{padding:0 var(--ibiz-spacing-base);font-size:40px;display:flex;align-items:center;justify-content:center}.ibiz-panel-app-title__logo img{display:inline-block;width:20px;height:20px}.ibiz-panel-app-title--hidden_logo{padding-left:var(--ibiz-spacing-base)}
+.ibiz-panel-app-title{--ibiz-panel-app-title-color:var(--ibiz-color-text-0);--ibiz-panel-app-title-font-size:var(--ibiz-font-size-header-3);--ibiz-panel-app-title-font-wight:var(--ibiz-font-weight-bold);--ibiz-panel-app-title-padding:0 var(--ibiz-spacing-loose);display:flex;align-items:center;justify-content:center;height:100%;padding:var(--ibiz-panel-app-title-padding)}.ibiz-panel-app-title__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--ibiz-panel-app-title-font-size);font-weight:700;color:var(--ibiz-panel-app-title-color)}.ibiz-panel-app-title__logo{padding:0 var(--ibiz-spacing-base);font-size:40px;display:flex;align-items:center;justify-content:center}.ibiz-panel-app-title__logo img{display:inline-block;width:20px;height:20px}

package/es/panel-component/panel-button/panel-button.css

@@ -1 +1 @@
-.ibiz-panel-button{--ibiz-panel-button-icon-margin:0 var(--ibiz-spacing-extra-tight) 0 0;--ibiz-panel-button-icon-max-width:var(--ibiz-width-icon-medium);--ibiz-panel-button-icon-max-height:var(--ibiz-width-icon-medium);width:100%;height:100%;overflow:hidden}.ibiz-panel-button i,.ibiz-panel-button img{display:inline-block;max-width:var(--ibiz-panel-button-icon-max-width);max-height:var(--ibiz-panel-button-icon-max-height);margin:var(--ibiz-panel-button-icon-margin)}
+.ibiz-panel-button{--ibiz-panel-button-icon-margin:0 var(--ibiz-spacing-extra-tight) 0 0;--ibiz-panel-button-icon-max-width:var(--ibiz-width-icon-medium);--ibiz-panel-button-icon-max-height:var(--ibiz-width-icon-medium);padding:var(--ibiz-spacing-tight);overflow:hidden}.ibiz-panel-button .el-button{width:100%}.ibiz-panel-button .el-button i,.ibiz-panel-button .el-button img{display:inline-block;max-width:var(--ibiz-panel-button-icon-max-width);max-height:var(--ibiz-panel-button-icon-max-height);margin:var(--ibiz-panel-button-icon-margin)}

package/es/panel-component/panel-button/panel-button.mjs

@@ -85,13 +85,14 @@ const PanelButton = /* @__PURE__ */ defineComponent({
   },
   render() {
     if (this.state.visible && this.buttonState.visible) {
-      return createVNode(resolveComponent("el-button"), {
+      return createVNode("div", {
+        "class": [this.ns.b(), this.ns.m(this.codeName), ...this.controller.containerClass]
+      }, [createVNode(resolveComponent("el-button"), {
         "type": this.buttonType,
         "text": this.isText,
         "disabled": this.state.disabled && this.buttonState.disabled,
         "loading": this.state.loading,
-        "onClick": this.handleButtonClick,
-        "class": [this.ns.b(), this.ns.m(this.codeName), ...this.controller.containerClass]
+        "onClick": this.handleButtonClick
       }, {
         default: () => [createVNode("div", {
           "class": this.ns.b("content")
@@ -101,7 +102,7 @@ const PanelButton = /* @__PURE__ */ defineComponent({
         }, null), createVNode("span", {
           "class": this.ns.bm("content", "caption")
         }, [this.showCaption ? this.captionText : null])])]
-      });
+      })]);
     }
     return null;
   }

package/es/panel-component/panel-exp-header/panel-exp-header.css

@@ -1 +1 @@
-.ibiz-panel-exp-header{width:auto;height:64px;border-bottom:1px solid var(--ibiz-color-border)}.ibiz-panel-exp-header .ibiz-row{height:100%}.ibiz-panel-exp-header .ibiz-panel-container--view_header_right{padding:0 var(--ibiz-spacing-base)}
+.ibiz-panel-exp-header{width:auto;height:64px;padding:0 var(--ibiz-spacing-base);border-bottom:1px solid var(--ibiz-color-border)}.ibiz-panel-exp-header .ibiz-row{height:100%}.ibiz-panel-exp-header .ibiz-panel-container--view_header_right{padding:0 var(--ibiz-spacing-base)}

package/es/panel-component/panel-index-view-search/index.d.ts

@@ -0,0 +1,28 @@
+export * from './panel-index-view-search.provider';
+export declare const IBizPanelIndexViewSearch: import("@ibiz-template/vue3-util").TypeWithInstall<import("vue").DefineComponent<{
+    modelData: {
+        type: import("vue").PropType<import("@ibiz/model-core").IPanelRawItem>;
+        required: true;
+    };
+    controller: {
+        type: typeof import("@ibiz-template/runtime").PanelItemController;
+        required: true;
+    };
+}, {
+    ns: import("@ibiz-template/core").Namespace;
+    classArr: import("vue").ComputedRef<(string | false)[]>;
+    onInput: (value: string) => void;
+    c: import("@ibiz-template/runtime").PanelItemController<import("@ibiz/model-core").IPanelItem>;
+    query: import("vue").Ref<string>;
+    menuAlign: import("vue").ComputedRef<string>;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    modelData: {
+        type: import("vue").PropType<import("@ibiz/model-core").IPanelRawItem>;
+        required: true;
+    };
+    controller: {
+        type: typeof import("@ibiz-template/runtime").PanelItemController;
+        required: true;
+    };
+}>>, {}, {}>>;
+export default IBizPanelIndexViewSearch;

package/es/panel-component/panel-index-view-search/index.mjs

@@ -0,0 +1,17 @@
+import { registerPanelItemProvider } from '@ibiz-template/runtime';
+import { withInstall } from '@ibiz-template/vue3-util';
+import { PanelIndexViewSearch } from './panel-index-view-search.mjs';
+import { PanelIndexViewSearchProvider } from './panel-index-view-search.provider.mjs';
+
+const IBizPanelIndexViewSearch = withInstall(
+  PanelIndexViewSearch,
+  function(v) {
+    v.component(PanelIndexViewSearch.name, PanelIndexViewSearch);
+    registerPanelItemProvider(
+      "RAWITEM_INDEX_VIEW_SEARCH",
+      () => new PanelIndexViewSearchProvider()
+    );
+  }
+);
+
+export { IBizPanelIndexViewSearch, PanelIndexViewSearchProvider, IBizPanelIndexViewSearch as default };

package/es/panel-component/panel-index-view-search/panel-index-view-search.css

@@ -0,0 +1 @@
+.ibiz-panel-index-view-search{--ibiz-panel-index-view-search-text-color:var(--ibiz-color-text-0);--ibiz-panel-index-view-search-placeholder-text-color:var(--ibiz-color-text-2);--ibiz-panel-index-view-search-bg-color:var(--ibiz-color-fill-0);width:100%;height:100%}.ibiz-panel-index-view-search .el-input__wrapper{background-color:var(--ibiz-panel-index-view-search-bg-color)}.ibiz-panel-index-view-search .el-input__wrapper .el-input__prefix{color:var(--ibiz-panel-index-view-search-text-color)}.ibiz-panel-index-view-search .el-input__wrapper .el-input__inner{color:var(--ibiz-panel-index-view-search-text-color)}.ibiz-panel-index-view-search .el-input__wrapper .el-input__inner::-moz-placeholder{color:var(--ibiz-panel-index-view-search-placeholder-text-color)}.ibiz-panel-index-view-search .el-input__wrapper .el-input__inner::placeholder{color:var(--ibiz-panel-index-view-search-placeholder-text-color)}.ibiz-panel-index-view-search-btn{font-size:var(--ibiz-font-size-header-4)}.ibiz-panel-index-view-search-btn:hover{background-color:transparent}

package/es/panel-component/panel-index-view-search/panel-index-view-search.d.ts

@@ -0,0 +1,30 @@
+import { IPanelRawItem } from '@ibiz/model-core';
+import { PropType } from 'vue';
+import { PanelItemController } from '@ibiz-template/runtime';
+import './panel-index-view-search.scss';
+export declare const PanelIndexViewSearch: import("vue").DefineComponent<{
+    modelData: {
+        type: PropType<IPanelRawItem>;
+        required: true;
+    };
+    controller: {
+        type: typeof PanelItemController;
+        required: true;
+    };
+}, {
+    ns: import("@ibiz-template/core").Namespace;
+    classArr: import("vue").ComputedRef<(string | false)[]>;
+    onInput: (value: string) => void;
+    c: PanelItemController<import("@ibiz/model-core").IPanelItem>;
+    query: import("vue").Ref<string>;
+    menuAlign: import("vue").ComputedRef<string>;
+}, 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: typeof PanelItemController;
+        required: true;
+    };
+}>>, {}, {}>;

package/es/panel-component/panel-index-view-search/panel-index-view-search.mjs

@@ -0,0 +1,82 @@
+import { defineComponent, computed, ref, inject, createVNode, resolveComponent } from 'vue';
+import { useNamespace } from '@ibiz-template/vue3-util';
+import { PanelItemController } from '@ibiz-template/runtime';
+import { debounce } from 'lodash-es';
+import './panel-index-view-search.css';
+
+const PanelIndexViewSearch = /* @__PURE__ */ defineComponent({
+  name: "IBizPanelIndexViewSearch",
+  props: {
+    modelData: {
+      type: Object,
+      required: true
+    },
+    controller: {
+      type: PanelItemController,
+      required: true
+    }
+  },
+  setup(props) {
+    const ns = useNamespace("panel-index-view-search");
+    const c = props.controller;
+    const classArr = computed(() => {
+      const {
+        id
+      } = props.modelData;
+      const result = [ns.b(), ns.m(id)];
+      result.push(...props.controller.containerClass);
+      return result;
+    });
+    const query = ref("");
+    const debounceSearch = debounce(() => {
+    }, 500);
+    const onInput = (value) => {
+      query.value = value;
+      debounceSearch();
+    };
+    const ctx = inject("ctx", void 0);
+    const menuAlign = computed(() => {
+      if (ctx == null ? void 0 : ctx.view) {
+        return ctx.view.model.mainMenuAlign || "LEFT";
+      }
+      return "LEFT";
+    });
+    return {
+      ns,
+      classArr,
+      onInput,
+      c,
+      query,
+      menuAlign
+    };
+  },
+  render() {
+    if (!this.controller.state.visible) {
+      return;
+    }
+    return createVNode("div", {
+      "class": this.classArr
+    }, [this.menuAlign === "LEFT" ? createVNode(resolveComponent("el-input"), {
+      "model-value": this.query,
+      "class": this.ns.b("search"),
+      "placeholder": "\u641C\u7D22\u5185\u5BB9",
+      "onInput": this.onInput
+    }, {
+      prefix: () => {
+        return createVNode("ion-icon", {
+          "class": this.ns.e("search-icon"),
+          "name": "search"
+        }, null);
+      }
+    }) : createVNode(resolveComponent("el-button"), {
+      "class": this.ns.b("btn")
+    }, {
+      default: () => [createVNode("ion-icon", {
+        "class": this.ns.e("search-icon"),
+        "name": "search"
+      }, null)]
+    })]);
+  }
+});
+
+export { PanelIndexViewSearch };

package/es/panel-component/panel-index-view-search/panel-index-view-search.provider.d.ts

@@ -0,0 +1,13 @@
+import { IPanelItemProvider, PanelController, PanelItemController } from '@ibiz-template/runtime';
+import { IPanelItem } from '@ibiz/model-core';
+/**
+ * 面板首页搜索适配器
+ *
+ * @export
+ * @class PanelIndexViewSearchProvider
+ * @implements {IPanelItemProvider}
+ */
+export declare class PanelIndexViewSearchProvider implements IPanelItemProvider {
+    component: string;
+    createController(panelItem: IPanelItem, panel: PanelController, parent: PanelItemController | undefined): Promise<PanelItemController>;
+}

package/es/panel-component/panel-index-view-search/panel-index-view-search.provider.mjs

@@ -0,0 +1,20 @@
+import { PanelItemController } from '@ibiz-template/runtime';
+
+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 PanelIndexViewSearchProvider {
+  constructor() {
+    __publicField(this, "component", "IBizPanelIndexViewSearch");
+  }
+  async createController(panelItem, panel, parent) {
+    const c = new PanelItemController(panelItem, panel, parent);
+    await c.init();
+    return c;
+  }
+}
+
+export { PanelIndexViewSearchProvider };

package/es/panel-component/single-data-container/index.d.ts

@@ -14,6 +14,16 @@ export declare const IBizSingleDataContainer: import("@ibiz-template/vue3-util")
 }, {
     ns: import("@ibiz-template/core").Namespace;
     classArr: import("vue").ComputedRef<(string | false)[]>;
+    renderPanelItem: (panelItem: import("@ibiz/model-core").IPanelItem, options?: {
+        providers: {
+            [key: string]: import("@ibiz-template/runtime").IPanelItemProvider;
+        };
+        panelItems: {
+            [key: string]: import("@ibiz-template/runtime").IPanelItemController;
+        };
+    } | undefined) => 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<{
     modelData: {
         type: import("vue").PropType<import("@ibiz/model-core").IPanelContainer>;

package/es/panel-component/single-data-container/single-data-container.controller.d.ts

@@ -1,5 +1,5 @@
-import { IPanelDataContainerController, IViewController, PanelItemController } from '@ibiz-template/runtime';
-import { IPanelContainer } from '@ibiz/model-core';
+import { IPanelDataContainerController, IPanelItemContainerController, IPanelItemController, IPanelItemProvider, IViewController, PanelController, PanelItemController, PanelNotifyState } from '@ibiz-template/runtime';
+import { IPanelContainer, IPanelItem } from '@ibiz/model-core';
 import { SingleDataContainerState } from './single-data-container.state';
 /**
  * 单项数据容器控制器
@@ -11,6 +11,26 @@ import { SingleDataContainerState } from './single-data-container.state';
 export declare class SingleDataContainerController extends PanelItemController<IPanelContainer> implements IPanelDataContainerController {
     state: SingleDataContainerState;
     readonly isDataContainer = true;
+    /**
+     * 所有面板成员的控制器
+     *
+     * @author lxm
+     * @date 2022-08-24 20:08:07
+     * @type {{ [key: string]: IPanelItemController }}
+     */
+    panelItems: {
+        [key: string]: IPanelItemController;
+    };
+    /**
+     * 所有面板成员的适配器
+     *
+     * @author lxm
+     * @date 2022-08-24 20:08:07
+     * @type {{ [key: string]: IPanelItemProvider }}
+     */
+    providers: {
+        [key: string]: IPanelItemProvider;
+    };
     /**
      * 单项数据容器，根据数据模式
      * @author lxm
@@ -21,6 +41,14 @@ export declare class SingleDataContainerController extends PanelItemController<I
     get data(): IData;
     protected createState(): SingleDataContainerState;
     protected onInit(): Promise<void>;
+    /**
+     * 初始化面板成员控制器
+     *
+     * @author lxm
+     * @date 2022-08-24 21:08:48
+     * @protected
+     */
+    protected initPanelItemControllers(panelItems?: IPanelItem[] | undefined, panel?: PanelController, parent?: IPanelItemContainerController | undefined): Promise<void>;
     /**
      * 根据来源类型初始化容器数据
      * @author lxm
@@ -28,6 +56,13 @@ export declare class SingleDataContainerController extends PanelItemController<I
      * @protected
      */
     protected initContainerData(): void;
+    /**
+     * 面板状态变更通知
+     *
+     * @author lxm
+     * @date 2022-09-20 18:09:07
+     */
+    childrenStateNotify(state: PanelNotifyState): void;
     /**
      * 通过实体设置视图逻辑
      * @author lxm

package/es/panel-component/single-data-container/single-data-container.controller.mjs

@@ -1,5 +1,5 @@
 import { ModelError, RuntimeModelError, RuntimeError } from '@ibiz-template/core';
-import { PanelItemController, execDELogicById } from '@ibiz-template/runtime';
+import { PanelItemController, getPanelItemProvider, execDELogicById, PanelNotifyState } from '@ibiz-template/runtime';
 import { SingleDataContainerState } from './single-data-container.state.mjs';
 
 var __defProp = Object.defineProperty;
@@ -12,6 +12,22 @@ class SingleDataContainerController extends PanelItemController {
   constructor() {
     super(...arguments);
     __publicField(this, "isDataContainer", true);
+    /**
+     * 所有面板成员的控制器
+     *
+     * @author lxm
+     * @date 2022-08-24 20:08:07
+     * @type {{ [key: string]: IPanelItemController }}
+     */
+    __publicField(this, "panelItems", {});
+    /**
+     * 所有面板成员的适配器
+     *
+     * @author lxm
+     * @date 2022-08-24 20:08:07
+     * @type {{ [key: string]: IPanelItemProvider }}
+     */
+    __publicField(this, "providers", {});
   }
   /**
    * 单项数据容器，根据数据模式
@@ -29,8 +45,51 @@ class SingleDataContainerController extends PanelItemController {
   }
   async onInit() {
     await super.onInit();
+    await this.initPanelItemControllers();
     this.initContainerData();
   }
+  /**
+   * 初始化面板成员控制器
+   *
+   * @author lxm
+   * @date 2022-08-24 21:08:48
+   * @protected
+   */
+  async initPanelItemControllers(panelItems = this.model.panelItems, panel = this.panel, parent = this) {
+    if (!panelItems) {
+      return;
+    }
+    await Promise.all(
+      panelItems.map(async (panelItem) => {
+        var _a, _b;
+        const panelItemProvider = await getPanelItemProvider(panelItem);
+        if (!panelItemProvider) {
+          return;
+        }
+        this.providers[panelItem.id] = panelItemProvider;
+        const panelItemController = await panelItemProvider.createController(
+          panelItem,
+          panel,
+          parent
+        );
+        this.panelItems[panelItem.id] = panelItemController;
+        if (((_a = panelItem.panelItems) == null ? void 0 : _a.length) && !panelItemController.isDataContainer) {
+          await this.initPanelItemControllers(
+            panelItem.panelItems,
+            panel,
+            panelItemController
+          );
+        }
+        if ((_b = panelItem.panelTabPages) == null ? void 0 : _b.length) {
+          await this.initPanelItemControllers(
+            panelItem.panelTabPages,
+            panel,
+            panelItemController
+          );
+        }
+      })
+    );
+  }
   /**
    * 根据来源类型初始化容器数据
    * @author lxm
@@ -68,6 +127,17 @@ class SingleDataContainerController extends PanelItemController {
         throw new ModelError(this.model, `\u6570\u636E\u6E90\u7C7B\u578B${dataSourceType}\u6682\u672A\u652F\u6301`);
     }
   }
+  /**
+   * 面板状态变更通知
+   *
+   * @author lxm
+   * @date 2022-09-20 18:09:07
+   */
+  childrenStateNotify(state) {
+    Object.values(this.panelItems).forEach((panelItem) => {
+      panelItem.panelStateNotify(state);
+    });
+  }
   /**
    * 通过实体设置视图逻辑
    * @author lxm
@@ -94,6 +164,7 @@ class SingleDataContainerController extends PanelItemController {
       throw new RuntimeError(`\u5B9E\u4F53\u903B\u8F91${appDELogicId}\u6CA1\u6709\u8FD4\u56DE\u503C`);
     }
     this.state.data = data;
+    this.childrenStateNotify(PanelNotifyState.LOAD);
   }
   /**
    * 设置全局变量为当前容器数据
@@ -106,6 +177,7 @@ class SingleDataContainerController extends PanelItemController {
     const originData = dataName ? ibiz.appData[dataName] : ibiz.appData;
     if (originData) {
       this.state.data = originData;
+      this.childrenStateNotify(PanelNotifyState.LOAD);
     } else {
       ibiz.log.error(`\u5168\u5C40\u53D8\u91CF\u91CC\u6CA1\u6709${dataName}\u5C5E\u6027`);
     }
@@ -135,6 +207,7 @@ class SingleDataContainerController extends PanelItemController {
     );
     if (res.ok && res.data) {
       this.state.data = res.data;
+      this.childrenStateNotify(PanelNotifyState.LOAD);
     }
   }
   /**
@@ -152,6 +225,7 @@ class SingleDataContainerController extends PanelItemController {
     }
     const updateData = () => {
       this.state.data = view.state[dataName];
+      this.childrenStateNotify(PanelNotifyState.LOAD);
     };
     updateData();
     view.evt.on("onDataChange", () => {

package/es/panel-component/single-data-container/single-data-container.d.ts

@@ -1,5 +1,6 @@
-import { IPanelContainer } from '@ibiz/model-core';
-import { PropType } from 'vue';
+import { IPanelItemProvider, IPanelItemController } from '@ibiz-template/runtime';
+import { IPanelContainer, IPanelItem } from '@ibiz/model-core';
+import { PropType, VNode } from 'vue';
 import { SingleDataContainerController } from './single-data-container.controller';
 import './single-data-container.scss';
 export declare const SingleDataContainer: import("vue").DefineComponent<{
@@ -14,6 +15,14 @@ export declare const SingleDataContainer: import("vue").DefineComponent<{
 }, {
     ns: import("@ibiz-template/core").Namespace;
     classArr: import("vue").ComputedRef<(string | false)[]>;
+    renderPanelItem: (panelItem: IPanelItem, options?: {
+        providers: {
+            [key: string]: IPanelItemProvider;
+        };
+        panelItems: {
+            [key: string]: IPanelItemController;
+        };
+    } | undefined) => VNode | null;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     modelData: {
         type: PropType<IPanelContainer>;