feat(image): 添加图片删除功能并优化 Markdown 编辑器
- 在 ImageController 中添加删除图片的接口 - 在 ImageService 中实现删除图片和批量更新图片 ID 的方法 - 在前端集成复制代码插件并优化 Markdown 编辑器配置 - 修复后端分组相关接口的参数类型问题
This commit is contained in:
@@ -49,13 +49,18 @@
|
||||
<h2>{{ selectedFile.title }}</h2>
|
||||
<div class="actions">
|
||||
<el-button v-if="!showEditor" type="primary" @click="selectedFile=null">清空</el-button>
|
||||
<el-button v-if="!showEditor" type="primary" @click="editNote(selectedFile)">编辑</el-button>
|
||||
<el-button v-if="!showEditor" type="primary" @click="editNote(selectedFile);isCollapsed=true">编辑</el-button>
|
||||
<el-button v-if="!showEditor" type="danger" @click="deleteNote(selectedFile)">删除</el-button>
|
||||
<el-button v-if="showEditor" type="primary" @click="showEditor=!showEditor;selectFile(editData)">返回</el-button>
|
||||
<el-button v-if="showEditor" type="success" @click="handleSave(editData.content)">保存</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<v-md-preview v-if="!showEditor" :text="selectedFile.content" class="markdown-preview"></v-md-preview>
|
||||
<v-md-preview
|
||||
v-if="!showEditor"
|
||||
:text="selectedFile.content"
|
||||
class="markdown-preview"
|
||||
@copy-code-success="handleCopyCodeSuccess"
|
||||
></v-md-preview>
|
||||
<!-- Markdown编辑器 -->
|
||||
<v-md-editor
|
||||
v-if="showEditor"
|
||||
@@ -63,6 +68,8 @@
|
||||
height="500px"
|
||||
@upload-image="handleImageUpload"
|
||||
@save="handleSave"
|
||||
:disabled-menus="[]"
|
||||
@copy-code-success="handleCopyCodeSuccess"
|
||||
></v-md-editor>
|
||||
</div>
|
||||
|
||||
@@ -139,6 +146,8 @@ import '@kangc/v-md-editor/lib/theme/style/github.css';
|
||||
import {groupingId, groupingAll, markdownAll, addGroupings, Preview, updateMarkdown} from '@/api/CommonApi.js'
|
||||
import {DArrowRight} from "@element-plus/icons-vue";
|
||||
|
||||
|
||||
|
||||
const markdownFiles = ref([]);
|
||||
const groupings = ref([]);
|
||||
const groupFiles = ref({});
|
||||
@@ -154,6 +163,8 @@ const newNoteForm = ref({ title: '', groupingId: null });
|
||||
const editData=ref(null)
|
||||
|
||||
|
||||
|
||||
|
||||
// 获取所有分组
|
||||
const fetchGroupings = async () => {
|
||||
try {
|
||||
@@ -197,6 +208,10 @@ const fetchGroupings = async () => {
|
||||
}
|
||||
};
|
||||
|
||||
const handleCopyCodeSuccess = () => {
|
||||
ElMessage.success('代码已复制到剪贴板');
|
||||
};
|
||||
|
||||
// 获取所有Markdown文件(确保ID为字符串)
|
||||
const fetchMarkdownFiles = async () => {
|
||||
try {
|
||||
@@ -277,8 +292,17 @@ const editNote = (file) => {
|
||||
showEditor.value = true;
|
||||
};
|
||||
|
||||
const handleImageUpload=()=>{
|
||||
console.log(666)
|
||||
const handleImageUpload=(event,insertImage,files)=>{
|
||||
console.log(files)
|
||||
|
||||
// 插入图片
|
||||
insertImage({
|
||||
// 图片地址
|
||||
url:
|
||||
'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1269952892,3525182336&fm=26&gp=0.jpg'
|
||||
// 图片描述
|
||||
// desc: '七龙珠',
|
||||
});
|
||||
}
|
||||
|
||||
// 在编辑页面,按Ctrl+S保存笔记,或者点击保存,对数据进行保存
|
||||
|
||||
Reference in New Issue
Block a user