fix:修复新建博客时提示标题和类别为空的问题

src/apis/blog.ts

@@ -23,7 +23,7 @@ export const queryBlogByConditionApi = (query: IQueryBlog): Promise<IBlog[]> =>
 
 export const queryBlogByIdApi = (id: number): Promise<IBlog> =>
   cloudService({
-    url: `/blog-api/blog/content/${id}`,
+    url: `/blog-api/blog/${id}/content`,
     method: 'get'
   })
 
@@ -47,7 +47,7 @@ export const queryLatestBlogApi = (): Promise<IBlog[]> =>
 
 export const queryBlogCommentApi = (blogId: number): Promise<IBlogComment[]> =>
   cloudService({
-    url: `/blog-api/blog/comment/${blogId}`,
+    url: `/blog-api/blog/${blogId}/comment`,
     method: 'get'
   })
 

src/store/blog.ts

@@ -46,7 +46,13 @@ export const useBlogStore = defineStore('blog', {
       createTime: '',
       updateTime: ''
     } as IBlog,
-    newBlog: {} as INewBlog,
+    newBlog: {
+      title: '',
+      topValue: 1,
+      isGreat: false,
+      category: '',
+      content: ''
+    } as INewBlog,
     blogCategoryList: [] as IBlogCategory[],
     blogStats: {} as IBlogStats,
     latestBlogList: [] as IBlogLatest[],

src/views/blog/article.vue

@@ -12,15 +12,15 @@
         :row-style="tableRowStyle()"
         class="card-item">
       <el-table-column type="index" align="center" width="50" />
-      <el-table-column prop="title" label="标题" align="center" min-width="10%"/>
+      <el-table-column prop="title" label="标题" align="center" min-width="15%"/>
       <el-table-column prop="category" label="类别" align="center" min-width="10%" />
-      <el-table-column label="精品" align="center" min-width="10%">
+      <el-table-column label="精品" align="center" min-width="5%">
         <template #default="scope">
           <el-tag type="success" v-if="scope.row.isGreat">是</el-tag>
           <el-tag type="danger" v-else>否</el-tag>
         </template>
       </el-table-column>
-      <el-table-column label="置顶" align="center" min-width="10%">
+      <el-table-column label="置顶" align="center" min-width="5%">
         <template #default="scope">
           <el-tag type="success" v-if="scope.row.topValue > 1">是</el-tag>
           <el-tag type="danger" v-else>否</el-tag>
@@ -28,7 +28,7 @@
       </el-table-column>
       <el-table-column prop="wordCount" label="字数" align="center" min-width="10%" />
       <el-table-column prop="visitCount" label="阅读次数" align="center" min-width="10%" />
-      <el-table-column fixed="right" label="操作" align="center" width="250">
+      <el-table-column fixed="right" label="操作" align="center" width="300">
         <template #default="scope">
           <el-button type="primary" @click="previewBlogClick(scope.row)">预览</el-button>
           <el-button type="primary" @click="editBlogClick(scope.row)">编辑</el-button>

src/views/blog/detail[id].vue

@@ -5,8 +5,8 @@
              class="blog-form">
       <el-form-item label="标题" name="title" prop="title">
         <el-input v-model="blogStore.newBlog.title"
-                  :maxlength="20" show-word-limit clearable
-                  style="width: 300px"/>
+                  :maxlength="30" show-word-limit clearable
+                  style="width: 400px"/>
       </el-form-item>
 
       <el-form-item label="分类" name="category" prop="category">
@@ -40,7 +40,7 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, reactive, onMounted, nextTick } from 'vue'
+import { ref, reactive, onMounted } from 'vue'
 import { useBlogStore } from '@/store/blog.ts'
 import { MdEditor } from 'md-editor-v3'
 import 'md-editor-v3/lib/style.css'
@@ -63,9 +63,7 @@ const focusCategoryEvent = async () => {
 }
 
 onMounted(async () => {
-  await nextTick(() => {
-    formRef.value?.clearValidate()
-  })
+  formRef.value?.clearValidate()
 
   const blogId = route.params.id as number
   if (blogId > 0) {

vite.config.ts

@@ -33,7 +33,7 @@ export default defineConfig({
     }
   },
   server: {
-    port: 5174,
+    port: 5175,
     // 服务器代理 服务器没有部署Nginx的情况下使用
     proxy: {
       '/blog-api': {