feat: document preview

Author: wangdan-fit2cloud

ui/src/api/admin/system/shared-resources/model.ts

@@ -13,7 +13,6 @@ const getModelList = (query?: Dict<unknown>) => {
 }
 
 /** 获取 System 共享范围的模型选项，并标记共享来源。 */
-// TODO 资源共享的模型是不是都是共享的
 const getModelListWithShared = (query?: Dict<unknown>): Promise<ModelItem[]> =>
   getModelList(query).then((models) => models.map((model): ModelItem => ({ ...model, source: 'shared' })))
 
@@ -57,7 +56,6 @@ const putPauseModelDownload = (modelId: string) => {
   return put<undefined, boolean>(`${prefix}/${modelId}/pause_download`)
 }
 
-
 /** 使用指定模型流式生成或优化系统提示词。 */
 const postPromptGenerate = (modelId: string, payload: PromptGeneratePayload) => {
   return postStream(ADMIN_API_BASE_PATH, `/system/shared/model/${modelId}/prompt_generate`, { ...payload })

ui/src/components/COMPONENT_README.md

@@ -172,6 +172,9 @@ Admin、Chat 入口调用 `configureMarkdownEditor()` 配置本地高亮、KaTeX
 
 ### MkDialog
 
+Dialog 和 Drawer 的 `show-close` 不根据 loading 或提交状态动态判断，默认保留关闭按钮；
+业务需要固定隐藏关闭按钮时，可继续使用 `:show-close="false"`。
+
 布尔 `v-model` 控制显示，默认宽度 `600`、挂载到 body、显示关闭按钮、关闭后销毁，
 禁止点击遮罩和 Escape 关闭。其余 Dialog 属性、事件通过 `$attrs` 透传。
 提供默认、`header`、`subtitle`、`footer` 插槽；`subtitle` 不替代标题，`header` 透出原生关闭与标题参数。
@@ -682,6 +685,7 @@ Logo 数据统一从 Theme Store 获取。
 多文件选择，拖拽区保持显示。`accept`、`limit` 直接传给上传控件，多文件模式内部也校验文件格式、
 空文件和重复文件；超出数量时提示并发出 `exceed`。`sizeLimit` 为多文件的单文件大小上限（MB），
 默认 100；超限保留 `fail` 卡片和大小错误提示，不允许重试。格式不支持、空文件及重复选择移除；
+重复选择保留列表中最先加入的文件，移除时同步清理上传控件内部列表，避免回写未上传的重复项。
 目录中的 `.DS_Store` 格式不支持时静默移除。
 `dragText`、`selectText`、`tipText` 和 `replaceText` 可替换默认文案，格式或限制说明通过
 `tipText` 展示。文件列表由各模式组件直接展示，多文件模式展示
@@ -773,6 +777,11 @@ JSON 专用输入框，通过 `v-model` 接收并回传解析后的 JSON 值，
 文件夹选择、进度、失败重试、取消和成功文件删除由 `MkDragUpload` 维护，文件值采用
 `DragUploadFile[]`，失败状态为 `fail`。
 
+`LocalFileUpload` 和文档上传页共用 `mk-drag-upload/validation.ts` 的文件状态校验，失败统一
+使用 `MsgWarning`，文件字段不展示行内错误。存在待上传或上传中文件时阻止继续；必填且没有
+成功文件时提示重新上传，非必填字段允许空列表。动态表单保留配置的其他校验规则，文件字段
+仅在调用表单 `validate()` 时校验和提示，其他字段的校验展示方式不变。
+
 `MkDynamicsForm` 根据字段配置渲染动态表单，统一维护字段值、默认值、显隐规则和表单校验；
 `MkDynamicsFormConstructor` 用于新增或编辑单个字段配置。该组件族位于 `components` 直属目录，
 使用方必须从 `@/components/mk-dynamics-form` 手动导入，不安装为 Vue 插件，也不全局注册其内部

ui/src/components/business/folder-tree/MoveToDialog.vue

@@ -38,15 +38,7 @@ defineExpose({ close, open })
 </script>
 
 <template>
-  <MkDialog
-    align-center
-    v-model="visible"
-    class="move-to-dialog"
-    content-class="move-to-dialog__content"
-    title="移动到"
-    :show-close="!loading"
-    @closed="resetData"
-  >
+  <MkDialog align-center v-model="visible" class="move-to-dialog" content-class="move-to-dialog__content" title="移动到" @closed="resetData">
     <FolderTree
       v-model="selectedTargetId"
       class="move-to-dialog__folder-tree"

ui/src/components/business/resource-authorization-drawer/PermissionConfigDialog.vue

@@ -43,7 +43,7 @@ defineExpose({ open, close })
 </script>
 
 <template>
-  <MkDialog v-model="visible" :title="scopeOnly ? '生效资源' : '配置权限'" :show-close="!loading" @closed="resetData">
+  <MkDialog v-model="visible" :title="scopeOnly ? '生效资源' : '配置权限'" @closed="resetData">
     <el-radio-group v-if="!scopeOnly" v-model="permission" class="mk-radio-group-vertical" :disabled="loading">
       <el-radio v-for="option in options" :key="option.value" :value="option.value">
         <p>{{ option.label }}</p>

ui/src/components/business/resource-authorization-drawer/index.vue

@@ -153,7 +153,7 @@ defineExpose({ open })
 </script>
 
 <template>
-  <MkDrawer v-model="drawerVisible" title="资源授权" :size="920" :show-close="!submitting" @closed="handleClosed">
+  <MkDrawer v-model="drawerVisible" title="资源授权" :size="920" @closed="handleClosed">
     <el-tabs v-model="targetType" :before-leave="() => !submitting">
       <el-tab-pane label="按用户组" name="user-group" />
       <el-tab-pane label="按用户" name="user" />

ui/src/components/mk-drag-upload/MultipleFileUpload.vue

@@ -64,14 +64,11 @@ function validateFile(file: DragUploadFile) {
     handleRemove(file)
     return false
   }
+  const fileIndex = fileList.value.findIndex((selected) => selected.uid === file.uid)
   if (
-    fileList.value.some(
-      (selected) =>
-        selected.uid !== file.uid &&
-        selected.name === file.name &&
-        selected.size === file.size &&
-        selected.raw?.lastModified === file.raw?.lastModified,
-    )
+    fileList.value
+      .slice(0, fileIndex)
+      .some((selected) => selected.name === file.name && selected.size === file.size && selected.raw?.lastModified === file.raw?.lastModified)
   ) {
     handleRemove(file)
     return false
@@ -126,7 +123,6 @@ function handleUpload(file: DragUploadFile) {
       return request.then((response) => {
         if (file.status !== 'uploading') return
         const split_path = response.split('/')
-        // TODO
         file.file_id = split_path[split_path.length - 1]
         file.percentage = 100
         file.status = 'success'
@@ -169,6 +165,12 @@ function handleRemove(file: DragUploadFile) {
       // 请求层统一提示删除失败，临时文件仍按有效期清理。
     })
   }
+  // 同步清理 ElUpload 的内部列表，避免后续 change 回写已移除的重复文件。
+  if (file.uid !== undefined) {
+    void Promise.resolve(uploadRef.value?.handleRemove({ ...file, uid: file.uid, status: file.status ?? 'ready' })).catch(() => {
+      // 控件已移除该文件时，仍以调用方列表的清理结果为准。
+    })
+  }
   fileList.value = fileList.value.filter((selected) => selected.uid !== file.uid)
   emit('remove', file)
 }

ui/src/components/mk-drag-upload/validation.ts

@@ -0,0 +1,12 @@
+import type { DragUploadFile } from './types'
+
+/** 文件校验只返回文案，由页面或表单统一使用 MsgWarning 提示。 */
+export function getUploadValidationMessage(files: DragUploadFile[], required = true): string | undefined {
+  if (files.some((file) => file.status === 'ready' || file.status === 'uploading')) {
+    return '文件正在上传，请稍候'
+  }
+  if (!required && !files.length) return
+  if (!files.some((file) => file.status === 'success')) {
+    return '没有上传成功的文件，请重新上传'
+  }
+}

ui/src/components/mk-dynamics-form/FormItem.vue

@@ -4,6 +4,7 @@ import type { FormItemRule } from 'element-plus'
 import { get } from 'lodash'
 import type { Dict } from '@/api/types'
 import bus from '@/utils/bus'
+import { getUploadValidationMessage } from '@/components/mk-drag-upload/validation'
 import FormItemLabel from './FormItemLabel.vue'
 import type { DynamicFormTriggerMap, DynamicFormTriggerSetting, DynamicFormValue, FormField, FormFieldLabel, SerializedFormRule } from './type'
 
@@ -95,7 +96,7 @@ const errorMessage = computed(() => {
     return fieldProps.value.err_msg
   }
   const label = isString(props.formField.label) ? props.formField.label : props.formField.label?.label
-  return `${label || props.formField.field} 不能为空`
+  return `请输入 ${label || props.formField.field}`
 })
 
 function deserializeRule(rule: SerializedFormRule): FormItemRule {
@@ -110,6 +111,20 @@ function deserializeRule(rule: SerializedFormRule): FormItemRule {
 }
 
 const validationRules = computed<FormItemRule | FormItemRule[]>(() => {
+  if (props.formField.input_type === 'LocalFileUpload') {
+    // 文件字段在提交时校验，错误统一由 MkDynamicsForm 使用 MsgWarning 提示。
+    const uploadRules: FormItemRule[] = [
+      {
+        required: props.formField.required !== false,
+        validator: (_rule, value, callback) => {
+          const message = getUploadValidationMessage(Array.isArray(value) ? value : [], props.formField.required !== false)
+          callback(message ? new Error(message) : undefined)
+        },
+      },
+      ...(fieldProps.value.rules?.map(deserializeRule) ?? []),
+    ]
+    return uploadRules.map((rule) => ({ ...rule, trigger: [] }))
+  }
   if (fieldProps.value.rules) {
     return fieldProps.value.rules.map(deserializeRule)
   }
@@ -183,6 +198,7 @@ defineExpose({ validate })
     :style="formItemStyle"
     :prop="formField.field"
     :rules="validationRules"
+    :show-message="formField.input_type !== 'LocalFileUpload'"
     :class="fieldLabel && getFieldComponent(fieldLabel.input_type) ? 'mk-hide-asterisk' : ''"
   >
     <template v-if="formField.label" #label>

ui/src/components/mk-dynamics-form/index.vue

@@ -4,6 +4,7 @@ import type { FormInstance } from 'element-plus'
 import { cloneDeep, isEqual } from 'lodash'
 import { del, get, post, put } from '@/api/admin/core/request'
 import type { Dict } from '@/api/types'
+import { MsgWarning } from '@/utils/message'
 import FormItem from './FormItem.vue'
 import type {
   DynamicFormResponse,
@@ -304,7 +305,18 @@ async function validate() {
     }
   }
 
-  return Promise.all([...formItemRefs.value.map((item) => item.validate()), ruleFormRef.value?.validate() ?? Promise.resolve()])
+  const formValidation = ruleFormRef.value?.validate().catch((error: unknown) => {
+    if (error && typeof error === 'object') {
+      const invalidFields = error as Record<string, { message?: string }[]>
+      const uploadField = formFieldList.value.find(
+        (field) => field.input_type === 'LocalFileUpload' && isFieldVisible(field) && invalidFields[field.field]?.[0]?.message,
+      )
+      const message = uploadField && invalidFields[uploadField.field]?.[0]?.message
+      if (message) MsgWarning(message)
+    }
+    throw error
+  })
+  return Promise.all([...formItemRefs.value.map((item) => item.validate()), formValidation ?? Promise.resolve()])
 }
 
 defineExpose({ initDefaultData: initializeFieldDefault, render, ruleFormRef, validate })

ui/src/components/mk-dynamics-form/items/upload/LocalFileUpload.vue

@@ -39,19 +39,25 @@ const accept = computed(() => fileTypes.value.map((type) => `.${type.toLowerCase
 const formats = computed(() => fileTypes.value.map((type) => type.toUpperCase()).join('、'))
 const fileSizeLimit = computed(() => Number(props.formField.attrs?.file_size_limit ?? attrs.file_size_limit) || 50)
 const fileCountLimit = computed(() => Number(props.formField.attrs?.file_count_limit ?? attrs.file_count_limit) || 100)
-const tipText = computed(
-  () => `单次上传最多 ${fileCountLimit.value} 个文件，每个文件最大 ${fileSizeLimit.value} MB${formats.value ? `；支持格式：${formats.value}` : ''}`,
-)
 </script>
 
 <template>
-  <MkDragUpload
-    v-model="selectedFiles"
-    multiple
-    :disabled="inputDisabled"
-    :accept="accept"
-    :limit="fileCountLimit"
-    :size-limit="fileSizeLimit"
-    :tip-text="tipText"
-  />
+  <div class="w-full">
+    <el-alert type="primary" :closable="false" show-icon class="mb-4!">
+      <template #icon><MkIcon name="icon_info_filled" /></template>
+      <ol class="list-inside list-decimal space-y-1">
+        <li>文件上传前，建议规范文件的分段标识</li>
+        <li>每次最多上传 {{ fileCountLimit }} 个文件，每个文件不超过 {{ fileSizeLimit }} MB</li>
+      </ol>
+    </el-alert>
+    <MkDragUpload
+      v-model="selectedFiles"
+      multiple
+      :disabled="inputDisabled"
+      :accept="accept"
+      :limit="fileCountLimit"
+      :size-limit="fileSizeLimit"
+      :tip-text="formats ? `支持格式：${formats}` : ''"
+    />
+  </div>
 </template>