fix AI prompt chain

src/components/Preview.vue

@@ -4,6 +4,8 @@
     <n-flex>
       <n-button quaternary @click="download" :disabled="!showDL">下载</n-button>
       <n-button quaternary @click="open">全屏</n-button>
+      <n-button quaternary v-if="props.clearable" @click="clear">清空</n-button>
+      <n-button quaternary v-if="props.showCodeButton" @click="emits('showCode')">查看代码</n-button>
       <n-button quaternary v-if="props.submissionId" @click="copyLink">
         复制链接
       </n-button>
@@ -35,10 +37,12 @@ interface Props {
   css: string
   js: string
   submissionId?: string
+  showCodeButton?: boolean
+  clearable?: boolean
 }
 
 const props = defineProps<Props>()
-const emits = defineEmits(["afterScore", "showCode"])
+const emits = defineEmits(["afterScore", "showCode", "clear"])
 
 const message = useMessage()
 const router = useRouter()
@@ -101,6 +105,10 @@ function open() {
   }
 }
 
+function clear() {
+  emits("clear")
+}
+
 function copyLink() {
   copy(`${document.location.origin}/submission/${props.submissionId}`)
   message.success("该提交的链接已复制")

src/components/PromptPanel.vue

@@ -61,8 +61,7 @@ const renderer = new Renderer()
 renderer.code = function ({ text, lang }: { text: string; lang?: string }) {
   const escape = (s: string) =>
     s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;")
-  const label = lang ? `查看代码（${escape(lang)}）` : "查看代码"
-  return `<details class="code-block"><summary>${label}</summary><pre><code class="hljs${lang ? ` language-${escape(lang)}` : ""}">${escape(text)}</code></pre></details>`
+  return `<pre><code class="hljs${lang ? ` language-${escape(lang)}` : ""}">${text}</code></pre>`
 }
 
 function renderMarkdown(text: string): string {
@@ -137,29 +136,4 @@ watch(
   border-top: 1px solid #e0e0e0;
 }
 
-.message-content :deep(details.code-block) {
-  border: 1px solid #e0e0e0;
-  border-radius: 4px;
-  margin: 6px 0;
-}
-
-.message-content :deep(details.code-block summary) {
-  padding: 4px 10px;
-  cursor: pointer;
-  font-size: 12px;
-  color: #666;
-  user-select: none;
-  background: #f5f5f5;
-  border-radius: 4px;
-}
-
-.message-content :deep(details.code-block[open] summary) {
-  border-bottom: 1px solid #e0e0e0;
-  border-radius: 4px 4px 0 0;
-}
-
-.message-content :deep(details.code-block pre) {
-  margin: 0;
-  border-radius: 0 0 4px 4px;
-}
 </style>