From be3c9399554a14253a82280901e3707a0a24c6f0 Mon Sep 17 00:00:00 2001 From: yumoqing Date: Mon, 1 Jun 2026 13:44:20 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E6=A8=A1=E5=9E=8B=E5=B9=BF=E5=9C=BA?= =?UTF-8?q?=E5=BD=BB=E5=BA=95=E9=87=8D=E6=9E=84=20=E2=80=94=20=E7=A7=BB?= =?UTF-8?q?=E9=99=A4TabPanel=EF=BC=8C=E7=94=A8VBox+script=E5=88=87?= =?UTF-8?q?=E6=8D=A2=E8=A7=86=E5=9B=BE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 根因链： 1. TabPanel内部容器结构导致getWidgetById找不到tab content中的widget 2. urlwidget渲染后替换自身DOM，id丢失 修复： - model_plaza.ui: 移除TabPanel，用两个VBox(按分类/按供应商)+script切换display - plaza_cards_panel/plaza_provider_panel改为VBox容器(urlwidget作子组件)，id不丢失 - CSS用#plaza_view_provider{display:none}初始隐藏供应商视图 - 切换按钮用getElementById直接操作display，不依赖bricks widget寻址 - 全链路filler确保VScrollPanel获得确定高度可滚动 --- wwwroot/model_plaza.css | 32 ++-- wwwroot/model_plaza.ui | 261 ++++++++++-------------------- wwwroot/show_llms.ui | 72 +++++---- wwwroot/show_llms_by_providers.ui | 72 +++++---- 4 files changed, 175 insertions(+), 262 deletions(-) diff --git a/wwwroot/model_plaza.css b/wwwroot/model_plaza.css index 9d089ec..27da119 100644 --- a/wwwroot/model_plaza.css +++ b/wwwroot/model_plaza.css @@ -1,20 +1,27 @@ /* Model Plaza — 模型广场 */ +/* Hide provider view initially */ +#plaza_view_provider { + display: none; +} + .plaza-header { padding: 8px 16px 4px 16px; } -.plaza-tabs .tab-bar { - border-bottom: 2px solid var(--sage-border, #e2e8f0); +/* View switcher buttons */ +.plaza-view-switcher { + gap: 8px; + padding: 8px 0 4px 0; } -.plaza-tabs .tab-item { - font-weight: 500; - transition: color 0.2s ease; +.plaza-view-btn { + border-radius: 6px !important; + transition: all 0.2s ease; } -.plaza-tabs .tab-item:hover { - color: var(--sage-brand, #6366f1); +.plaza-view-btn.plaza-view-active { + border: 2px solid var(--sage-brand, #6366f1) !important; } /* Left sidebar */ @@ -69,17 +76,6 @@ padding: 4px 8px; } -/* Right panel: ensure scrollable area fills available space */ -.plaza-tabs .tabpanel-content { - display: flex; - flex-direction: column; -} -.plaza-tabs .tabpanel-content > .scrollpanel { - flex: 1; - min-height: 0; - overflow-y: auto; -} - /* Model icon area */ .plaza-card .model-icon-row { gap: 8px; diff --git a/wwwroot/model_plaza.ui b/wwwroot/model_plaza.ui index 184b9b0..fe2d225 100644 --- a/wwwroot/model_plaza.ui +++ b/wwwroot/model_plaza.ui @@ -30,192 +30,93 @@ "halign": "left", "wrap": true } + }, + { + "widgettype": "HBox", + "options": { + "css": "plaza-view-switcher", + "cheight": 3 + }, + "subwidgets": [ + { + "widgettype": "Button", + "id": "btn_by_catelog", + "options": { + "label": "按分类", + "css": "plaza-view-btn plaza-view-active", + "cwidth": 15 + }, + "binds": [ + { + "wid": "self", + "event": "click", + "actiontype": "script", + "target": "self", + "script": "document.getElementById('plaza_view_provider').style.display='none'; document.getElementById('plaza_view_catelog').style.display='flex'; var a=bricks.getWidgetById('btn_by_catelog',bricks.app); var b=bricks.getWidgetById('btn_by_provider',bricks.app); if(a)a.dom_element.classList.add('plaza-view-active'); if(b)b.dom_element.classList.remove('plaza-view-active');" + } + ] + }, + { + "widgettype": "Button", + "id": "btn_by_provider", + "options": { + "label": "按供应商", + "css": "plaza-view-btn", + "cwidth": 15 + }, + "binds": [ + { + "wid": "self", + "event": "click", + "actiontype": "script", + "target": "self", + "script": "document.getElementById('plaza_view_catelog').style.display='none'; document.getElementById('plaza_view_provider').style.display='flex'; var a=bricks.getWidgetById('btn_by_catelog',bricks.app); var b=bricks.getWidgetById('btn_by_provider',bricks.app); if(a)a.dom_element.classList.remove('plaza-view-active'); if(b)b.dom_element.classList.add('plaza-view-active');" + } + ] + } + ] } ] }, { - "widgettype": "TabPanel", - "id": "plaza_tabs", + "widgettype": "VBox", + "id": "plaza_view_catelog", "options": { - "css": "filler plaza-tabs", - "tab_pos": "top", - "items": [ - { - "name": "by_catelog", - "label": "按分类", - "content": { - "widgettype": "HBox", - "options": { - "css": "filler", - "width": "100%", - "height": "100%" - }, - "subwidgets": [ - { - "widgettype": "VScrollPanel", - "options": { - "cwidth": 18, - "height": "100%", - "css": "plaza-sidebar" - }, - "subwidgets": [ - { - "widgettype": "Button", - "options": { - "label": "全部", - "css": "plaza-nav-btn", - "width": "100%" - }, - "binds": [ - { - "wid": "self", - "event": "click", - "actiontype": "urlwidget", - "target": "app.plaza_cards_panel", - "mode": "replace", - "options": { - "url": "{{entire_url('show_llms_cards.ui')}}" - } - } - ] - }{% for cat in catelogs %}, - { - "widgettype": "Button", - "options": { - "label": "{{cat.name}}", - "css": "plaza-nav-btn", - "width": "100%" - }, - "binds": [ - { - "wid": "self", - "event": "click", - "actiontype": "urlwidget", - "target": "app.plaza_cards_panel", - "mode": "replace", - "options": { - "url": "{{entire_url('show_llms_cards.ui')}}", - "params": { - "catelogid": "{{cat.id}}" - } - } - } - ] - }{% endfor %} - ] - }, - { - "widgettype": "VBox", - "id": "plaza_cards_panel", - "options": { - "css": "filler", - "cwidth": 82, - "height": "100%" - }, - "subwidgets": [ - { - "widgettype": "urlwidget", - "options": { - "css": "filler", - "width": "100%", - "height": "100%", - "url": "{{entire_url('show_llms_cards.ui')}}" - } - } - ] - } - ] - } - }, - { - "name": "by_provider", - "label": "按供应商", - "content": { - "widgettype": "HBox", - "options": { - "css": "filler", - "width": "100%", - "height": "100%" - }, - "subwidgets": [ - { - "widgettype": "VScrollPanel", - "options": { - "cwidth": 18, - "height": "100%", - "css": "plaza-sidebar" - }, - "subwidgets": [ - { - "widgettype": "Button", - "options": { - "label": "全部", - "css": "plaza-nav-btn", - "width": "100%" - }, - "binds": [ - { - "wid": "self", - "event": "click", - "actiontype": "urlwidget", - "target": "app.plaza_provider_panel", - "mode": "replace", - "options": { - "url": "{{entire_url('show_llms_cards_by_provider.ui')}}" - } - } - ] - }{% for p in providers %}, - { - "widgettype": "Button", - "options": { - "label": "{{p.orgname}}", - "css": "plaza-nav-btn", - "width": "100%" - }, - "binds": [ - { - "wid": "self", - "event": "click", - "actiontype": "urlwidget", - "target": "app.plaza_provider_panel", - "mode": "replace", - "options": { - "url": "{{entire_url('show_llms_cards_by_provider.ui')}}", - "params": { - "providerid": "{{p.id}}" - } - } - } - ] - }{% endfor %} - ] - }, - { - "widgettype": "VBox", - "id": "plaza_provider_panel", - "options": { - "css": "filler", - "cwidth": 82, - "height": "100%" - }, - "subwidgets": [ - { - "widgettype": "urlwidget", - "options": { - "css": "filler", - "width": "100%", - "height": "100%", - "url": "{{entire_url('show_llms_cards_by_provider.ui')}}" - } - } - ] - } - ] - } + "css": "filler", + "width": "100%", + "height": "100%" + }, + "subwidgets": [ + { + "widgettype": "urlwidget", + "options": { + "css": "filler", + "width": "100%", + "height": "100%", + "url": "{{entire_url('show_llms.ui')}}" } - ] - } + } + ] + }, + { + "widgettype": "VBox", + "id": "plaza_view_provider", + "options": { + "css": "filler", + "width": "100%", + "height": "100%" + }, + "subwidgets": [ + { + "widgettype": "urlwidget", + "options": { + "css": "filler", + "width": "100%", + "height": "100%", + "url": "{{entire_url('show_llms_by_providers.ui')}}" + } + } + ] } ] } diff --git a/wwwroot/show_llms.ui b/wwwroot/show_llms.ui index dc34bdf..366c22d 100644 --- a/wwwroot/show_llms.ui +++ b/wwwroot/show_llms.ui @@ -22,20 +22,19 @@ "css":"plaza-nav-btn", "width":"100%" }, - "binds":[ - { - "wid":"self", - "event":"click", - "actiontype":"urlwidget", - "target":"app.plaza_cards_panel", - "mode":"replace", - "options":{ - "url":"{{entire_url('show_llms_cards.ui')}}" + "binds":[ + { + "wid":"self", + "event":"click", + "actiontype":"urlwidget", + "target":"app.plaza_cards_panel", + "mode":"replace", + "options":{ + "url":"{{entire_url('show_llms_cards.ui')}}" + } } - } - ] - }, -{% for cat in catelogs %} + ] + }{% for cat in catelogs %}, { "widgettype":"Button", "options":{ @@ -43,34 +42,43 @@ "css":"plaza-nav-btn", "width":"100%" }, - "binds":[ - { - "wid":"self", - "event":"click", - "actiontype":"urlwidget", - "target":"app.plaza_cards_panel", - "mode":"replace", - "options":{ - "url":"{{entire_url('show_llms_cards.ui')}}", - "params":{ - "catelogid":"{{cat.id}}" + "binds":[ + { + "wid":"self", + "event":"click", + "actiontype":"urlwidget", + "target":"app.plaza_cards_panel", + "mode":"replace", + "options":{ + "url":"{{entire_url('show_llms_cards.ui')}}", + "params":{ + "catelogid":"{{cat.id}}" + } } } - } - ] - }{% if not loop.last %},{% endif %} -{% endfor %} + ] + }{% endfor %} ] }, { - "widgettype":"urlwidget", + "widgettype":"VBox", "id":"plaza_cards_panel", "options":{ "css":"filler", "cwidth":82, - "height":"100%", - "url":"{{entire_url('show_llms_cards.ui')}}" - } + "height":"100%" + }, + "subwidgets":[ + { + "widgettype":"urlwidget", + "options":{ + "css":"filler", + "width":"100%", + "height":"100%", + "url":"{{entire_url('show_llms_cards.ui')}}" + } + } + ] } ] } diff --git a/wwwroot/show_llms_by_providers.ui b/wwwroot/show_llms_by_providers.ui index e18ea70..2452b10 100644 --- a/wwwroot/show_llms_by_providers.ui +++ b/wwwroot/show_llms_by_providers.ui @@ -22,20 +22,19 @@ "css":"plaza-nav-btn", "width":"100%" }, - "binds":[ - { - "wid":"self", - "event":"click", - "actiontype":"urlwidget", - "target":"app.plaza_provider_panel", - "mode":"replace", - "options":{ - "url":"{{entire_url('show_llms_cards_by_provider.ui')}}" + "binds":[ + { + "wid":"self", + "event":"click", + "actiontype":"urlwidget", + "target":"app.plaza_provider_panel", + "mode":"replace", + "options":{ + "url":"{{entire_url('show_llms_cards_by_provider.ui')}}" + } } - } - ] - }, -{% for p in providers %} + ] + }{% for p in providers %}, { "widgettype":"Button", "options":{ @@ -43,34 +42,43 @@ "css":"plaza-nav-btn", "width":"100%" }, - "binds":[ - { - "wid":"self", - "event":"click", - "actiontype":"urlwidget", - "target":"app.plaza_provider_panel", - "mode":"replace", - "options":{ - "url":"{{entire_url('show_llms_cards_by_provider.ui')}}", - "params":{ - "providerid":"{{p.id}}" + "binds":[ + { + "wid":"self", + "event":"click", + "actiontype":"urlwidget", + "target":"app.plaza_provider_panel", + "mode":"replace", + "options":{ + "url":"{{entire_url('show_llms_cards_by_provider.ui')}}", + "params":{ + "providerid":"{{p.id}}" + } } } - } - ] - }{% if not loop.last %},{% endif %} -{% endfor %} + ] + }{% endfor %} ] }, { - "widgettype":"urlwidget", + "widgettype":"VBox", "id":"plaza_provider_panel", "options":{ "css":"filler", "cwidth":82, - "height":"100%", - "url":"{{entire_url('show_llms_cards_by_provider.ui')}}" - } + "height":"100%" + }, + "subwidgets":[ + { + "widgettype":"urlwidget", + "options":{ + "css":"filler", + "width":"100%", + "height":"100%", + "url":"{{entire_url('show_llms_cards_by_provider.ui')}}" + } + } + ] } ] }