feat: 添加删除文章功能
This commit is contained in:
1 parent
bfad9be846
commit
78dce18d9c
6 files changed
+147
-12
No files matched your search
@@ -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,
|
||||
|
||||
@@ -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')
|
||||
|
||||
@@ -20,7 +20,6 @@ export const useUserStore = defineStore("user", () => {
|
||||
};
|
||||
|
||||
const token = computed(() => {
|
||||
console.log('token')
|
||||
if (_token.value) {
|
||||
return _token.value;
|
||||
}
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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: '服务器内部错误'
|
||||
};
|
||||
}
|
||||
});
|
||||
@@ -16,3 +16,7 @@ body {
|
||||
:focus-visible {
|
||||
outline: #15aa8761 auto 1px;
|
||||
}
|
||||
|
||||
.el-message {
|
||||
z-index: 70582140 !important;
|
||||
}
|
||||
Reference in new issue
Block a user