feat: 添加删除文章功能

This commit is contained in:
539943419 committed 2025-01-17 01:31:42 +08:00
1 parent bfad9be846
commit 78dce18d9c
6 files changed
+147 -12

No files matched your search

+3 -2
View File
@@ -12,6 +12,7 @@
<script lang="ts" setup>
import miaoHeader from './components/miaoHeader.vue';
import miaoContentWrapper from './components/miaoContentWrapper.vue';
import "/style/default.scss";
// @ts-ignore
useHead({
@@ -32,9 +33,9 @@ useHead({
}
</style>
<style lang="scss">
<!-- <style lang="scss">
@use '/style/default.scss';
</style>
</style> -->
<style>
.page-enter-active,
+8 -4
View File
@@ -3,27 +3,31 @@
<!-- editor以后再写 -->
<el-row :gutter="10">
<el-col :span="12">
<el-input v-model:model-value="title" placeholder="title">
<el-input v-model:model-value="title" placeholder="title" :disabled="disabled">
<template #prepend>标题</template>
</el-input>
</el-col>
<el-col :span="12">
<el-input-tag v-model:model-value="tags" placeholder="添加标签" />
<el-input-tag v-model:model-value="tags" placeholder="添加标签" :disabled="disabled"/>
</el-col>
</el-row>
<el-row>
<el-col>
<el-input v-model:model-value="summary" placeholder="summary" >
<el-input v-model:model-value="summary" placeholder="summary" :disabled="disabled">
<template #prepend>摘要</template>
</el-input>
</el-col>
</el-row>
<el-input type="textarea" v-model:model-value="content" placeholder="content" :autosize="{ minRows: 15 }" />
<el-input type="textarea" v-model:model-value="content" placeholder="content" :autosize="{ minRows: 15 }" :disabled="disabled"/>
</div>
</template>
<script setup lang="ts">
const props = defineProps<{
disabled?: boolean
}>()
const title = defineModel<string>('title')
const summary = defineModel<string>('summary')
const tags = defineModel<string[]>('tags')
-1
View File
@@ -20,7 +20,6 @@ export const useUserStore = defineStore("user", () => {
};
const token = computed(() => {
console.log('token')
if (_token.value) {
return _token.value;
}
+71 -5
View File
@@ -7,12 +7,16 @@
返回
</div>
</div>
<editor v-model:title="title" v-model:summary="summary" v-model:tags="tags" v-model:content="content" />
<editor v-model:title="title" v-model:summary="summary" v-model:tags="tags" v-model:content="content"
:disabled="disableEdit" />
<el-row>
<el-col :span="24">
<div class="flex-end">
<el-text v-if="message" :type="message.type" style="user-select: none;">{{ message.message }}</el-text>
<el-button @click="handleSubmit" style="margin-left: 10px;">
<el-text v-if="message" :type="message.type" style="user-select: none;">{{ message.message
}}</el-text>
<el-button @click="handleClickDelete" style="margin-left: 10px;" v-if="!isNewPost">
delete
</el-button><el-button @click="handleSubmit" style="margin-left: 10px;">
upload
</el-button>
</div>
@@ -27,6 +31,7 @@ import useDefaultStore from '~/hooks/pinia/useDefaultStore';
import useFetch from '~/hooks/useMiaoFetch';
import type { postItem } from '~/types/post';
import chevronDown from "~/components/icons/chevronDown.vue";
// import type { Action } from 'element-plus/es/components/index.mjs';
type resType = {
data: string
@@ -38,12 +43,17 @@ const { post: { getPost, updatePost, uploadPost } } = useFetch()
const route = useRoute()
const router = useRouter()
const isNewPost = ref(route.params.id === 'new')
const id = ref<number>(-1)
const title = ref<string>('')
const summary = ref<string>('')
const tags = ref<string[]>([])
const content = ref<string>('')
// 等待加载完成才允许编辑
const disableEdit = ref(true)
const message = ref<{ type: "" | "success" | "warning" | "info" | "primary" | "danger", message: string }>()
const handleSubmit = () => {
@@ -54,6 +64,50 @@ const handleSubmit = () => {
}
}
const handleClickDelete = async () => {
try {
await ElMessageBox.confirm(
'是否确定删除本篇文章?',
'警告',
{
confirmButtonText: '删除',
cancelButtonText: '取消',
type: 'warning',
}
)
await ElMessageBox.confirm(
'再次确认删除本篇文章',
'警告',
{
confirmButtonText: '删除',
cancelButtonText: '取消',
type: 'warning',
}
)
try {
const response = await $fetch('/api/posts/deletePost', {
method: 'POST',
body: {
id: id.value
}
})
ElMessage({
type: 'success',
message: '删除文章完成',
})
const store = useDefaultStore()
store.deleteCache('posts')
router.back()
} catch {
ElMessage({
type: 'error',
message: '删除失败',
})
}
} catch {
}
}
const handleUpload = async () => {
try {
message.value = {
@@ -81,6 +135,7 @@ const handleUpload = async () => {
}
const store = useDefaultStore()
store.deleteCache('posts')
isNewPost.value = false
} catch (error) {
console.error(error)
message.value = {
@@ -129,16 +184,27 @@ const handleBack = () => {
}
onMounted(async () => {
console.log('route', route.params.id, route.params.id === 'new')
if (route.params.id !== 'new') {
message.value = {
type: 'info',
message: '初始化中'
}
id.value = parseInt(route.params.id as string)
const res = await getPost(id.value) as any as resType
console.log(res)
id.value = res.id
title.value = res.title
summary.value = res.summary
tags.value = []
content.value = res.data
disableEdit.value = false
message.value = {
type: 'info',
message: ''
}
} else {
disableEdit.value = false
}
})
</script>
+61
View File
@@ -0,0 +1,61 @@
// miaoBlog/server/api/posts/deletePost.ts
import DB from 'better-sqlite3';
import cacheResult from '~/server/utils/cacheRes';
function prepareDB() {
const db = new DB('./userData/db/posts.db');
const deletePostStmt = db.prepare('DELETE FROM posts WHERE id = ?');
const deleteContentStmt = db.prepare('DELETE FROM postContent WHERE id = ?');
const getTagIdStmt = db.prepare('SELECT tag_id FROM posts WHERE id = ?');
const deleteTagsStmt = db.prepare('DELETE FROM tags WHERE id = ?');
return { db, deletePostStmt, deleteContentStmt, getTagIdStmt, deleteTagsStmt };
}
export default defineEventHandler(async (event) => {
const { db, deletePostStmt, deleteContentStmt, getTagIdStmt, deleteTagsStmt } = cacheResult(prepareDB)();
const body = await readBody(event);
const { id } = body;
// 检查是否提供了有效的id
if (!id || isNaN(Number(id))) {
db.close();
return {
code: 400,
msg: '无效的id'
};
}
try {
// 开启事务
db.transaction(() => {
// 先从posts表中删除文章记录
deletePostStmt.run(Number(id));
// 再从postContent表中删除文章内容记录
deleteContentStmt.run(Number(id));
// 查找该文章对应的tag_id
const tagRow: any = getTagIdStmt.get(Number(id));
if (tagRow && tagRow.tag_id) {
// 如果存在tag_id,从tags表中删除对应的标签记录
deleteTagsStmt.run(tagRow.tag_id);
}
})();
db.close();
return {
code: 200,
msg: '删除成功'
};
} catch (error) {
console.error('删除数据时出错:', error);
db.close();
return {
code: 500,
msg: '服务器内部错误'
};
}
});
+4
View File
@@ -15,4 +15,8 @@ body {
:focus-visible {
outline: #15aa8761 auto 1px;
}
.el-message {
z-index: 70582140 !important;
}