🎨 修改细节问题

src/components/dynamicf/Editor/QuillEditorWrapper.vue

@@ -2,7 +2,7 @@
   <div class="quill-editor-wrapper">
     <QuillEditor
       :modules="modules" 
-      :toolbar="toolbarOptions" 
+      :toolbar="disabled ? disabledToolbarOptions : toolbarOptions" 
       theme="snow"
       contentType="html"
       v-bind="$attrs"
@@ -19,6 +19,7 @@ import { QuillEditor, Quill } from '@vueup/vue-quill'
 import '@vueup/vue-quill/dist/vue-quill.snow.css'
 import ImageUploader from 'quill-image-uploader';
 import CommonContent from '@/api/CommonContent';
+import { onMounted } from 'vue';
 
 const Size   = Quill.import('attributors/style/size')
 const Font   = Quill.import('attributors/style/font')
@@ -73,7 +74,27 @@ const props = defineProps({
   }
 })
 
+onMounted(() => {
+  setTimeout(() => {
+    document.querySelectorAll('button.ql-text').forEach((item: any) => {
+      item.innerHTML = item.getAttribute('value');
+      item.setAttribute('style', 'width: 100px;text-align:left');
+    })
+  }, 100)
+})
 
+const disabledToolbarOptions = {
+  container: [
+    [{ 'text': '只读模式' }]
+  ],
+  
+  // 处理自定义静态文字的渲染
+  handlers: {
+    'text': function(value: any) {
+      // 静态文字不需要交互，这里留空即可
+    }
+  },
+}
 const toolbarOptions = [
   ['bold', 'italic', 'underline', 'strike'],        // toggled buttons
   ['blockquote'],
@@ -145,7 +166,7 @@ $fontList: (
 
 .ql-snow {
   
-  .ql-tooltip{ 
+  .ql-tooltip { 
     &::before {
       content: "访问超链接:";
     }
@@ -201,6 +222,25 @@ $fontList: (
         }
       }
     }
+    &.ql-custom-label {
+      width: auto;
+      cursor: default;
+
+      .ql-picker-label {
+        border: none;
+        padding: 0 6px;
+        font-size: 13px;
+        color: #666;
+
+        &::before {
+          content: attr(data-label);
+        }
+      }
+
+      .ql-picker-options {
+        display: none;
+      }
+    }
 
   }
 }

src/components/dynamicf/UploadImageFormItem.vue

@@ -12,10 +12,10 @@
     @reject="handleUploadSubImgReject"
     @change="handleUploadSubImgChange"
   >
-    <template v-if="single && !disabled">
+    <template v-if="single">
       
       <div v-if="Boolean(value)" class="ant-upload-image">
-        <span>点击替换图片</span>
+        <span v-if="!disabled">点击替换图片</span>
         <a-image
           :src="(value as string)"
           alt="avatar"
@@ -199,7 +199,7 @@ function handleUploadSubImgChange(info: FileInfo) {
 <style lang="scss">
 .ant-upload-image {
   position: relative;
-  border: 1px solid #666666;
+  border: 1px solid #dddddd;
   overflow: hidden;
   border-radius: 8px;
   text-align: center;

src/pages/forms/form.vue

@@ -61,22 +61,27 @@
       v-model:open="showHistory"
       title="历史版本"
       placement="right"
-      :width="showHistoryModel ? '95%' : '80%'"
+      :width="showHistoryModel ? (isMobile ? '100%' : '60%') : (isMobile ? '80%' : '50%')"
     >
       <div v-if="showHistoryModel">
         <div class="d-flex flex-row justify-content-between">
           <a-button :icon="h(ArrowLeftOutlined)" @click="showHistoryModel = null">返回</a-button>
           <span>您正在查看 {{ showHistoryModel.desc }} 保存的版本</span>
         </div>
-        <a-spin v-if="showHistoryLoading" class="w-100 h-100" />
-        <DynamicForm
-          v-else
-          :model="(showHistoryModel as any)" 
-          :options="{
-            ...formOptions,
-            disabled: true,
-          }"
-        />
+        
+        <div class="main-section small-h">
+          <div class="content">
+              <a-spin v-if="showHistoryLoading" class="w-100 h-100" />
+              <DynamicForm
+                v-else
+                :model="(showHistoryModel as any)" 
+                :options="{
+                  ...formOptions,
+                  disabled: true,
+                }"
+              />
+          </div>
+        </div>
       </div>
       <CommonListBlock 
         v-else
@@ -96,7 +101,7 @@
 </template>
 
 <script setup lang="ts" generic="T extends DataModel, U extends DataModel">
-import { onMounted, ref, toRefs, type PropType, h, watch } from 'vue';
+import { onMounted, ref, toRefs, type PropType, h, watch, computed } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 import { useWindowOnUnLoadConfirm } from '@/composeable/WindowOnUnLoad';
 import { DynamicForm, type IDynamicFormOptions, type IDynamicFormRef } from '@imengyu/vue-dynamic-form';
@@ -108,6 +113,9 @@ import InheritorContent, { InheritorWorkInfo } from '@/api/inheritor/InheritorCo
 import CommonListBlock from '@/components/content/CommonListBlock.vue';
 import { waitTimeOut } from '@imengyu/imengyu-utils';
 
+const isMobile = computed(() => {
+  return window.innerWidth < 768;
+});
 const props = defineProps({
   title: {
     type: String,