feat: CodeMirror6代码编辑器替代textarea,暗色主题+语法高亮

This commit is contained in:
mediabot-pt
2026-07-01 13:38:56 +08:00
parent 621e436eb0
commit e05d337567
3 changed files with 78 additions and 4 deletions

View File

@@ -34,13 +34,14 @@
<!-- 主体:脚本 + 结果 -->
<div style="display:flex;gap:12px;flex:1;min-height:0">
<!-- 左侧:脚本编辑器 -->
<div style="flex:0 0 420px;display:flex;flex-direction:column;min-height:0">
<div style="flex:0 0 440px;display:flex;flex-direction:column;min-height:0">
<div style="font-size:13px;font-weight:500;margin-bottom:4px;display:flex;justify-content:space-between;align-items:center">
<span>Groovy 脚本</span>
<el-button size="small" type="primary" @click="saveScript" :loading="saving" v-if="selectedConfigId">保存</el-button>
</div>
<el-input v-model="scriptContent" type="textarea" :rows="1" style="flex:1;font-family:monospace;font-size:11px;line-height:1.4"
placeholder="// 先选配置版本,再编辑脚本&#10;// 内置变量: content, url, jsoup, json, utils" />
<div style="flex:1;min-height:0;border-radius:4px;overflow:hidden">
<CodeEditor v-model="scriptContent" />
</div>
<div style="font-size:10px;color:#909399;margin-top:2px">
内置: <code>content</code> <code>url</code> <code>jsoup</code> <code>json</code> <code>utils</code>
· 返回 Map{pageName,extracted} 或 List
@@ -111,6 +112,7 @@
<script setup>
import { useRoute } from 'vue-router'
import api from '../api'
import CodeEditor from '../components/CodeEditor.vue'
import { Loading } from '@element-plus/icons-vue'
const route = useRoute()