fix(sj_1.3.0-beta1.1): 修复日志查看窗口显示问题

src/components/common/code-mirror.vue

@@ -119,10 +119,10 @@ watch(
 </script>
 
 <template>
-  <div class="w-100% flex-x-center gap-8px">
+  <div class="w-100% flex gap-8px">
     <CodeMirror
       v-model="nodeExpression"
-      class="w-100%"
+      class="snial-code-mirror w-100%"
       :readonly="readonly"
       :disabled="disabled"
       :theme="theme"
@@ -158,3 +158,9 @@ watch(
     </NModal>
   </div>
 </template>
+
+<style scoped>
+:deep(.snial-code-mirror) {
+  max-width: calc(100% - 58px);
+}
+</style>

src/components/common/log-drawer.vue

@@ -7,6 +7,7 @@ import {
   NDivider,
   NDropdown,
   NEmpty,
+  NScrollbar,
   NSpin,
   NVirtualList,
   type VirtualListInst
@@ -282,7 +283,11 @@ const SnailLogComponent = defineComponent({
         return <></>;
       }
       const restOfText = throwable.replace(/^.+(\n|$)/m, '');
-      return <NCollapseItem title={firstLine[0]} name={`throwable-${message.index}`}>{`${restOfText}`}</NCollapseItem>;
+      return (
+        <NCollapseItem title={firstLine[0]} name={`throwable-${message.index}`}>
+          <NScrollbar content-class="p-8px" class="message-scroll-body">{`${restOfText}`}</NScrollbar>
+        </NCollapseItem>
+      );
     };
 
     const messageComponent = (message: Api.JobLog.JobMessage) => {
@@ -297,7 +302,9 @@ const SnailLogComponent = defineComponent({
       const restOfText = msg.replace(/^.+(\n|$)/m, '').replaceAll('\n', '\n - ');
       if (restOfText) {
         return (
-          <NCollapseItem title={firstLine[0]} name={`message-${message.index}`}>{` - ${restOfText}`}</NCollapseItem>
+          <NCollapseItem title={firstLine[0]} name={`message-${message.index}`}>
+            <NScrollbar content-class="p-8px" class="message-scroll-body">{` - ${restOfText}`}</NScrollbar>
+          </NCollapseItem>
         );
       }
       return <div class="pl-6px">- {`${msg}`}</div>;
@@ -322,12 +329,11 @@ const SnailLogComponent = defineComponent({
             ref={virtualListInst}
             class="virtual-list"
             itemSize={85}
-            item-resizable
+            itemResizable
-            ignore-item-resize
+            paddingBottom={16}
-            padding-bottom={16}
             items={logList.value}
-            scrollbar-props={{ xScrollable: true }}
+            scrollbarProps={{ xScrollable: true }}
-            on-resize={handleResize}
+            onResize={handleResize}
           >
             {{
               default: ({ item: message }: { item: Api.JobLog.JobMessage }) => (
@@ -592,4 +598,15 @@ const SnailLogComponent = defineComponent({
   display: inline-block !important;
   min-width: 100%;
 }
+
+:deep(.message-scroll-body) {
+  margin-top: 6px;
+  max-height: 150px;
+  border: 1px solid rgb(239, 239, 245);
+  border-radius: var(--n-border-radius);
+}
+
+:deep(.dark .message-scroll-body) {
+  border: 1px solid rgba(255, 255, 255, 0.09) !important;
+}
 </style>