shudao-main/shudao-vue-frontend/replace_layout2.py

import re

with open('src/views/ExamWorkshop.vue', 'r', encoding='utf-8') as f:
    content = f.read()

pattern = re.compile(r'(<!-- 考试工坊主界面 -->\s*<div v-if="!showExamDetail" class="exam-workshop-card">)(.*?)(^\s*<!-- 考试详情页 -->)', re.DOTALL | re.MULTILINE)

new_content = """
        <div v-if="!showExamDetail" class="flex-1 flex flex-row w-full h-full relative overflow-hidden" style="background-color: #f7f9fb; margin: -20px;">
          <-5 中间主要工作区 -->
          <div class="flex-1 flex flex-col h-full relative min-w-0">
            <div class="flex-1 overflow-y-auto p-10 pb-32">
              <div class="max-w-4xl mx-auto w-full space-y-8">
                <-5 试卷名称 -->
                <section class="space-y-3">
                  <label class="block text-[15px] font-bold text-gray-800">试卷名称</label>
                  <div class="relative">
                    <input v-model="examName" class="w-full bg-white border border-gray-100 shadow-sm rounded-2xl px-5 py-4 text-[15px] focus:border-blue-500 focus:ring-2 focus:ring-blue-100 transition-all outline-none text-gray-800 placeholder-gray-400" maxlength="32" placeholder="请输入试卷名称..." type="text" :disabled="isGenerating"/>
                    <span class="absolute right-5 bottom-4 text-xs text-gray-400">{{ examName?.length || 0 }}/32</span>
                  </div>
                </section>

                <-5 出题依据内容 -->
                <section class="space-y-3">
                  <label class="block text-[15px] font-bold text-gray-800">出题依据内容</label>
                  <textarea v-model="questionBasis" class="w-full h-48 bg-white border border-gray-100 shadow-sm rounded-2xl px-5 py-4 text-[15px] focus:border-blue-500 focus:ring-2 focus:ring-blue-100 transition-all outline-none resize-none text-gray-800 placeholder-gray-400 leading-relaxed" placeholder="在此输入知识点、章节或培训内容..." :disabled="isGenerating || selectedFile"></textarea>

                  <-5 从PPT生成考题 -->
                  <div class="w-full bg-white border border-gray-100 shadow-sm rounded-2xl p-5 flex items-center gap-5 cursor-pointer hover:shadow-md transition-all group mt-6" @click="!isGenerating && !selectedFile ? triggerFileUpload() : null">
                    <div class="w-14 h-14 rounded-2xl bg-[#f3f4f6] flex items-center justify-center text-gray-500 group-hover:text-blue-600 transition-colors">
                      <span class="material-symbols-outlined text-3xl">cloud_upload</span>
                    </div>
                    <div class="flex-1">
                      <div class="flex items-center gap-2 mb-1">
                        <h3 class="text-base font-bold text-gray-900">从PPT生成考题</h3>
                      </div>
                      <p class="text-[13px] text-gray-500">上传培训PPT，智能提取关键内容生成考题(单个文件可上传20M内)</p>
                      <div v-if="selectedFile" class="mt-3 p-2.5 bg-blue-50/80 rounded-xl text-blue-600 text-sm flex justify-between items-center border border-blue-100">
                        <span class="font-medium truncate mr-4">已上传: {{ selectedFile.name }}</span>
                        <span @click.stop="removeSelectedFile" class="cursor-pointer text-red-400 hover:text-red-600 font-bold px-2 py-1 bg-red-50 hover:bg-red-100 rounded-lg transition-colors">×</span>
                      </div>
                    </div>
                    <span class="material-symbols-outlined text-gray-300">chevron_right</span>
                  </div>
                </section>

                <-5 题型配置 -->
                <section class="space-y-4 pt-4">
                  <div class="flex items-center justify-between w-full mb-6">
                    <span class="text-[15px] font-bold text-gray-800">题型配置</span>
                    <div class="flex items-center gap-3">
                      <span class="text-[13px] text-gray-500">试卷总分</span>
                      <div class="bg-white border border-gray-100 shadow-sm rounded-xl px-6 py-2.5 text-lg font-bold text-gray-900 min-w-[80px] text-center">
                        {{ calculatedTotalScore }}
                      </div>
                    </div>
                  </div>

                  <div class="grid grid-cols-2 gap-5">
                    <div v-for="(type, index) in questionTypes" :key="index" class="bg-white rounded-2xl border border-gray-100 shadow-sm p-6 hover:shadow-md transition-shadow">
                      <div class="flex justify-between items-center mb-8">
                        <span class="text-[15px] font-bold text-gray-900">{{ type.name }}</span>
                        <span class="text-[13px] font-medium bg-[#ebf3ff] text-blue-600 px-3.5 py-1.5 rounded-full">每题 {{ type.scorePerQuestion }} 分</span>
                      </div>
                      <div class="space-y-4">
                        <div class="flex justify-between items-center text-[13px] font-bold mb-2">
                          <span class="text-gray-500">数量</span>
                          <span class="text-blue-600 text-base">{{ type.questionCount }}</span>
                        </div>
                        <div class="relative w-full h-1.5 bg-gray-100 rounded-full mt-2">
                          <input type="range" v-model.number="type.questionCount" min="0" :max="type.max || 50" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer z-10" :disabled="isGenerating">
                          <div class="absolute top-0 left-0 h-full bg-blue-600 rounded-full pointer-events-none" :style="{ width: (type.questionCount / (type.max || 50) * 100) + '%' }"></div>
                          <div class="absolute top-1/2 -translate-y-1/2 w-4 h-4 bg-white border-[3px] border-blue-600 rounded-full shadow-sm pointer-events-none transition-all" :style="{ left: (type.questionCount / (type.max || 50) * 100) + '%', transform: 'translate(-50%, -50%)' }"></div>
                        </div>
                      </div>
                    </div>
                  </div>
                </section>
              </div>
            </div>

            <-5 底部悬浮操作栏 -->
            <footer class="absolute bottom-0 left-0 w-full bg-white/95 backdrop-blur-xl border-t border-gray-100 px-8 py-5 flex items-center justify-between z-40">
              <div class="flex items-center gap-4">
                <button class="flex items-center gap-2.5 text-gray-500 hover:text-red-500 transition-colors px-2" @click="clearSettings" :disabled="isGenerating">
                  <span class="material-symbols-outlined text-[20px]">delete</span>
                  <span class="text-[14px] font-medium">清空当前配置</span>
                </button>
              </div>
              
              <button v-if="!isGenerating" class="bg-blue-600 hover:bg-blue-700 text-white px-8 py-3 rounded-xl text-[15px] font-bold shadow-lg shadow-blue-600/20 flex items-center justify-center transition-all active:scale-[0.98]" @click="generateExam">
                开始智能生成试卷
              </button>
              <button v-else class="bg-blue-400 text-white px-8 py-3 rounded-xl text-[15px] font-bold shadow-md flex items-center justify-center cursor-not-allowed">
                <span class="flex items-center gap-2">
                  <span class="material-symbols-outlined animate-spin text-lg">autorenew</span>
                  生成中...
                </span>
              </button>
            </footer>
          </div>

          <-5 右侧边栏 (实时预览) -->
          <aside class="w-[280px] bg-[#f7f9fb] border-l border-gray-200 flex flex-col h-full flex-shrink-0 z-30">
            <div class="p-7">
              <h2 class="text-gray-900 font-bold text-[17px] mb-7">实时预览</h2>
              
              <div class="space-y-8">
                <-5 试卷名称 -->
                <div class="bg-white p-5 rounded-2xl shadow-sm border border-gray-100">
                  <h3 class="text-[13px] font-bold text-gray-500 mb-3.5">试卷名称</h3>
                  <p class="text-gray-800 font-medium text-[15px] italic leading-relaxed" :class="{'opacity-40': !examName}">{{ examName || '未命名试卷...' }}</p>
                </div>
                
                <-5 结构大纲 -->
                <div class="space-y-5">
                  <h3 class="text-[13px] font-bold text-gray-500">结构大纲</h3>
                  <ul class="space-y-5">
                    <li v-for="(type, index) in questionTypes" :key="index" class="flex flex-col gap-1.5 group">
                      <div class="flex items-center justify-between">
                        <div class="flex items-center gap-2.5">
                          <div class="w-1.5 h-1.5 rounded-full" :style="{ backgroundColor: ['#2563eb', '#60a5fa', '#93c5fd', '#dbeafe'][index % 4] }"></div>
                          <span class="text-[14px] font-medium text-gray-800">{{ type.name }}</span>
                        </div>
                        <span class="text-[14px] font-bold text-gray-800">{{ type.questionCount }}题</span>
                      </div>
                      <span class="text-[12px] text-gray-400 ml-4">{{ type.questionCount * type.scorePerQuestion }} 分</span>
                    </li>
                  </ul>
                </div>
                
                <-5 总分统计 -->
                <div class="pt-8 border-t border-gray-200 space-y-4">
                  <div class="flex justify-between items-center">
                    <span class="text-[13px] text-gray-500 font-medium">配置总分</span>
                    <span class="text-[15px] font-bold text-gray-900">{{ totalScore }}</span>
                  </div>
                  <div class="flex justify-between items-center">
                    <span class="text-[13px] text-gray-500 font-medium">试卷总分</span>
                    <span class="text-[15px] font-bold text-gray-900">{{ calculatedTotalScore }}</span>
                  </div>
                </div>
              </div>
            </div>
          </aside>
        </div>
"""

replaced = pattern.sub(r'\1\n' + new_content + r'\n\3', content)

# 隐藏原来的 work-header 并修改 work-content 的样式
replaced = replaced.replace('<div class="work-header">', '<div class="work-header" v-if="showExamDetail">')
replaced = replaced.replace('<div class="work-content" :class="{ \'exam-detail-mode\': showExamDetail }">', '<div class="work-content" :class="{ \'exam-detail-mode\': showExamDetail }" :style="showExamDetail ? {} : { padding: 0, height: \'100%\', display: \'flex\', flexDirection: \'column\' }">')

with open('src/views/ExamWorkshop.vue', 'w', encoding='utf-8') as f:
    f.write(replaced)

print("Replacement complete.")