From c28706d3558e55572e381e4b6804872dad6aa6e3 Mon Sep 17 00:00:00 2001
From: zhf <1204297681@qq.com>
Date: Fri, 19 Sep 2025 18:39:18 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E9=97=A8=E6=88=B7=E9=83=A8=E4=BB=B6?=
 =?UTF-8?q?=E6=94=AF=E6=8C=81=E7=BB=98=E5=88=B6=E5=99=A8=E9=80=BB=E8=BE=91?=
 =?UTF-8?q?=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CHANGELOG.md                                  |   1 +
 .../portlet-layout/portlet-layout.scss        |  20 ++
 .../portlet/portlet-layout/portlet-layout.tsx | 173 +++++++++++++-----
 3 files changed, 151 insertions(+), 43 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 4900e1976..ab85a8fa5 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -11,6 +11,7 @@
 
 - 表单容器类（表单分组、表单分页、表单成员分页、表单关系界面分页），适配状态属性loading（是否显示loading状态）
 - 面板容器类（分页面板、面板容器（视图内容）、面板容器（视图头部）、分割容器），新增状态属性loading（是否显示loading状态），并新增控制器能力startLoading（开始加载中）和endLoading（结束加载中）
+- 门户部件支持绘制器逻辑配置
 
 ### Changed
 
diff --git a/src/control/dashboard/portlet/portlet-layout/portlet-layout.scss b/src/control/dashboard/portlet/portlet-layout/portlet-layout.scss
index 3b74b0817..2905050f3 100644
--- a/src/control/dashboard/portlet/portlet-layout/portlet-layout.scss
+++ b/src/control/dashboard/portlet/portlet-layout/portlet-layout.scss
@@ -77,6 +77,26 @@ $portlet-layout: (
     position: relative;
   }
 
+  @include when(custom) {
+    position: relative;
+
+    @include e(left){
+      z-index: 1;
+    }
+  
+    @include e(right){
+      z-index: 1;
+    }
+  
+    @include e(bg) {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+    }
+  }
+
   height: getCssVar('portlet-layout','header-height');
   padding: getCssVar('portlet-layout','header-padding');
   margin: getCssVar('portlet-layout','header-margin');
diff --git a/src/control/dashboard/portlet/portlet-layout/portlet-layout.tsx b/src/control/dashboard/portlet/portlet-layout/portlet-layout.tsx
index a8c29c316..5e0722584 100644
--- a/src/control/dashboard/portlet/portlet-layout/portlet-layout.tsx
+++ b/src/control/dashboard/portlet/portlet-layout/portlet-layout.tsx
@@ -1,7 +1,8 @@
+// eslint-disable no-unneeded-ternary
 import { useNamespace } from '@ibiz-template/vue3-util';
 import { computed, defineComponent, PropType } from 'vue';
-import { IUIActionGroupDetail } from '@ibiz/model-core';
-import { PortletPartController } from '@ibiz-template/runtime';
+import { IControlRender, IUIActionGroupDetail } from '@ibiz/model-core';
+import { PortletPartController, ScriptFactory } from '@ibiz-template/runtime';
 import { showTitle } from '@ibiz-template/core';
 import './portlet-layout.scss';
 
@@ -64,6 +65,54 @@ export const PortletLayout = defineComponent({
       });
     };
 
+    // 部件绘制器
+    const controlRenders = c.dashboard.model.controlRenders;
+
+    // 头部绘制器
+    const header = controlRenders?.find(
+      item => `dashboard_${item.id}` === `${c.model.name}_header`,
+    );
+
+    // 头部标题绘制器
+    const headerCaption = controlRenders?.find(
+      item => `dashboard_${item.id}` === `${c.model.name}_header_caption`,
+    );
+
+    // 头部背景绘制器
+    const headerBg = controlRenders?.find(
+      item => `dashboard_${item.id}` === `${c.model.name}_header_bg`,
+    );
+
+    // 头部行为组绘制器
+    const headerAction = controlRenders?.find(
+      item => `dashboard_${item.id}` === `${c.model.name}_header_action`,
+    );
+
+    // 渲染绘制器内容
+    const renderContent = (model: IControlRender) => {
+      if (model.renderType === 'LAYOUTPANEL_MODEL' && model.layoutPanelModel) {
+        const htmlCode = ScriptFactory.execScriptFn(
+          {
+            params: c.params,
+            context: c.context,
+          },
+          model.layoutPanelModel,
+          { isAsync: false },
+        ) as string;
+        return <div class={ns.b('header-render')} v-html={htmlCode}></div>;
+      }
+      if (model.renderType === 'LAYOUTPANEL' && model.layoutPanel) {
+        return (
+          <iBizControlShell
+            class={ns.b('header-render')}
+            params={c.params}
+            context={c.context}
+            modelData={model.layoutPanel}
+          ></iBizControlShell>
+        );
+      }
+    };
+
     return {
       c,
       ns,
@@ -71,6 +120,11 @@ export const PortletLayout = defineComponent({
       popperClass,
       portletType,
       isShowHeader,
+      header,
+      headerCaption,
+      headerBg,
+      headerAction,
+      renderContent,
       openLink,
       clickPorlet,
       onActionClick,
@@ -78,6 +132,12 @@ export const PortletLayout = defineComponent({
   },
   render() {
     const { model, state } = this.controller;
+    const isCustom = !!(
+      this.header ||
+      this.headerCaption ||
+      this.headerBg ||
+      this.headerAction
+    );
     return (
       <div
         class={[
@@ -86,52 +146,79 @@ export const PortletLayout = defineComponent({
           this.ns.is('hight-light', state.hightLight),
         ]}
       >
-        {this.isShowHeader && (
-          <div key='header' class={this.ns.b('header')}>
+        {this.isShowHeader ? (
+          this.header ? (
             <div
-              class={this.ns.be('header', 'left')}
-              onClick={(event: MouseEvent) => this.clickPorlet(event, 'title')}
+              key='header'
+              class={[this.ns.b('header'), this.ns.is('custom', isCustom)]}
             >
-              {model.showTitleBar && (
-                <div
-                  class={[
-                    this.ns.e('caption'),
-                    this.ns.is('link', !!this.linkAction),
-                  ]}
-                  onClick={this.openLink}
-                >
-                  <iBizIcon
-                    class={this.ns.e('caption-icon')}
-                    icon={model.sysImage}
-                  ></iBizIcon>
-                  <span
-                    class={this.ns.e('caption-text')}
-                    title={showTitle(state.title)}
-                  >
-                    {state.title}
-                  </span>
-                </div>
-              )}
+              {this.renderContent(this.header)}
             </div>
-            <div class={this.ns.be('header', 'right')}>
-              {model.portletType !== 'ACTIONBAR' && model.uiactionGroup && (
-                <iBizActionToolbar
-                  zIndex={this.zIndex}
-                  class={this.ns.e('toolbar')}
-                  action-details={model.uiactionGroup.uiactionGroupDetails}
-                  actions-state={state.actionGroupState}
-                  mode={
-                    model.actionGroupExtractMode === 'ITEMS'
-                      ? 'dropdown'
-                      : 'buttons'
-                  }
-                  popperClass={this.popperClass}
-                  onActionClick={this.onActionClick}
-                ></iBizActionToolbar>
+          ) : (
+            <div
+              key='header'
+              class={[this.ns.b('header'), this.ns.is('custom', isCustom)]}
+            >
+              {this.headerBg && (
+                <div class={this.ns.be('header', 'bg')}>
+                  {this.renderContent(this.headerBg)}
+                </div>
               )}
+              <div
+                class={this.ns.be('header', 'left')}
+                onClick={(event: MouseEvent) =>
+                  this.clickPorlet(event, 'title')
+                }
+              >
+                {model.showTitleBar &&
+                  (this.headerCaption ? (
+                    this.renderContent(this.headerCaption)
+                  ) : (
+                    <div
+                      class={[
+                        this.ns.e('caption'),
+                        this.ns.is('link', !!this.linkAction),
+                      ]}
+                      onClick={this.openLink}
+                    >
+                      <iBizIcon
+                        class={this.ns.e('caption-icon')}
+                        icon={model.sysImage}
+                      ></iBizIcon>
+                      <span
+                        class={this.ns.e('caption-text')}
+                        title={showTitle(state.title)}
+                      >
+                        {state.title}
+                      </span>
+                    </div>
+                  ))}
+              </div>
+              <div class={this.ns.be('header', 'right')}>
+                {this.headerAction
+                  ? this.renderContent(this.headerAction)
+                  : model.portletType !== 'ACTIONBAR' &&
+                    model.uiactionGroup && (
+                      <iBizActionToolbar
+                        zIndex={this.zIndex}
+                        class={this.ns.e('toolbar')}
+                        action-details={
+                          model.uiactionGroup.uiactionGroupDetails
+                        }
+                        actions-state={state.actionGroupState}
+                        mode={
+                          model.actionGroupExtractMode === 'ITEMS'
+                            ? 'dropdown'
+                            : 'buttons'
+                        }
+                        popperClass={this.popperClass}
+                        onActionClick={this.onActionClick}
+                      ></iBizActionToolbar>
+                    )}
+              </div>
             </div>
-          </div>
-        )}
+          )
+        ) : null}
         <div
           key='content'
           class={this.ns.b('content')}
-- 
Gitee