From 02029764d7e75b298538521808e4e0e6a3264d51 Mon Sep 17 00:00:00 2001
From: Wenjie Zhang <xerrors@163.com>
Date: Sun, 7 Jun 2026 03:15:42 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=20model=5Fprovider=20?=
 =?UTF-8?q?=E7=9A=84=E5=8D=A1=E7=89=87=E7=82=B9=E5=87=BB=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/components/AgentFilePreview.vue       | 27 +++++++++++++++++--
 .../ModelProviderManagePanel.vue              | 20 +++++++++-----
 2 files changed, 38 insertions(+), 9 deletions(-)

diff --git a/web/src/components/AgentFilePreview.vue b/web/src/components/AgentFilePreview.vue
index a7fa9bcb..aa1b79d3 100644
--- a/web/src/components/AgentFilePreview.vue
+++ b/web/src/components/AgentFilePreview.vue
@@ -134,7 +134,7 @@
         <iframe
           :key="`embedded-${htmlPreviewRenderKey}`"
           class="html-preview"
-          :srcdoc="formatContent(file?.content)"
+          :srcdoc="htmlPreviewSrcdoc"
           :title="filePath"
           sandbox="allow-scripts"
         />
@@ -217,7 +217,7 @@
               <iframe
                 :key="`fullscreen-${htmlPreviewRenderKey}`"
                 class="html-preview fullscreen-embed-preview"
-                :srcdoc="formatContent(file?.content)"
+                :srcdoc="htmlPreviewSrcdoc"
                 :title="filePath"
                 sandbox="allow-scripts"
               />
@@ -276,6 +276,8 @@ import {
 } from '@/utils/file_preview'
 
 const EDITABLE_EXTENSIONS = new Set(['.md', '.markdown', '.mdx', '.txt'])
+const HTML_PREVIEW_SCALE = 0.75
+const HTML_PREVIEW_SCALE_CSS = `html { zoom: ${HTML_PREVIEW_SCALE} !important; }`
 
 const props = defineProps({
   file: {
@@ -380,6 +382,7 @@ const isHtmlFile = computed(
     typeof props.file?.content === 'string' &&
     isHtmlPreview(props.filePath)
 )
+const htmlPreviewSrcdoc = computed(() => buildHtmlPreviewSrcdoc(props.file?.content))
 const codeThemeClass = computed(() => (themeStore.isDark ? 'hljs-theme-dark' : 'hljs-theme-light'))
 const codeLanguage = computed(() => getCodeLanguageByPath(props.filePath))
 const isCodePreview = computed(
@@ -413,6 +416,26 @@ const formatContent = (content) => {
   return String(content)
 }
 
+const serializeDoctype = (doctype) => {
+  if (!doctype) return ''
+  const publicId = doctype.publicId ? ` PUBLIC "${doctype.publicId}"` : ''
+  const systemId = doctype.systemId ? ` "${doctype.systemId}"` : ''
+  return `<!DOCTYPE ${doctype.name}${publicId}${systemId}>`
+}
+
+const buildHtmlPreviewSrcdoc = (content) => {
+  const html = formatContent(content)
+  if (!html.trim() || typeof DOMParser === 'undefined') return html
+
+  const doc = new DOMParser().parseFromString(html, 'text/html')
+  const style = doc.createElement('style')
+  style.setAttribute('data-yuxi-html-preview-scale', String(HTML_PREVIEW_SCALE))
+  style.textContent = HTML_PREVIEW_SCALE_CSS
+  doc.head.append(style)
+
+  return `${serializeDoctype(doc.doctype)}${doc.documentElement.outerHTML}`
+}
+
 const syncDraftContent = () => {
   draftContent.value = savedContent.value
   editMode.value = 'preview'
diff --git a/web/src/components/model-management/ModelProviderManagePanel.vue b/web/src/components/model-management/ModelProviderManagePanel.vue
index 1fd3ee23..8924d2c4 100644
--- a/web/src/components/model-management/ModelProviderManagePanel.vue
+++ b/web/src/components/model-management/ModelProviderManagePanel.vue
@@ -670,13 +670,14 @@ defineExpose({
               >（已启用 {{ provider.enabled_models.length }} 个）</span
             >
           </button>
-          <a-switch
-            size="small"
-            :checked="provider.is_enabled"
-            :loading="togglingProviderId === provider.provider_id"
-            @click.stop
-            @change="(checked) => toggleProviderEnabled(provider, checked)"
-          />
+          <span class="provider-enable-switch" @click.stop>
+            <a-switch
+              size="small"
+              :checked="provider.is_enabled"
+              :loading="togglingProviderId === provider.provider_id"
+              @change="(checked) => toggleProviderEnabled(provider, checked)"
+            />
+          </span>
         </template>
       </InfoCard>
     </ExtensionCardGrid>
@@ -1116,6 +1117,11 @@ defineExpose({
   }
 }
 
+.provider-enable-switch {
+  display: inline-flex;
+  align-items: center;
+}
+
 .enabled-count {
   color: var(--gray-500);
   font-size: 12px;