feat:增加查询类别分页博客功能

src/apis/blog.ts

@@ -15,11 +15,12 @@ export const uploadBlogImageApi = (md5: string, form: FormData): Promise<string>
     data: form
   })
 
-export const queryBlogApi = (currentPage: number, pageSize: number): Promise<IPageRecord<IBlog>> =>
+export const queryBlogApi = (currentPage: number, pageSize: number,
+  category: string): Promise<IPageRecord<IBlog>> =>
   cloudService({
-    url: '/blog-api/blog/all/page',
+    url: '/blog-api/blog/condition/page',
     method: 'get',
-    params: { currentPage, pageSize }
+    params: { currentPage, pageSize, category }
   })
 
 export const queryUnapprovedBlogApi = (): Promise<IBlog[]> =>

src/store/blog.ts

@@ -68,7 +68,9 @@ export const useBlogStore = defineStore('blog', {
     blogCategoryList: [] as IBlogCategory[],
     blogStats: {} as IBlogStats,
     latestBlogList: [] as IBlogLatest[],
-    queryBlog: {} as IQueryBlog,
+    queryBlog: {
+      category: ''
+    } as IQueryBlog,
     blogImagePath: ImagePathEnum.BLOG,
     blogApiType: 'ADD' as IHandleApi,
     pageInfo: {
@@ -83,7 +85,7 @@ export const useBlogStore = defineStore('blog', {
   actions: {
     async queryBlogList() {
       const { currentPage, pageSize } = this.pageInfo
-      const result = await queryBlogApi(currentPage, pageSize)
+      const result = await queryBlogApi(currentPage, pageSize, this.queryBlog.category)
       this.blogList = result.records
       this.pageInfo.totalSize = result.total
     },

src/views/blog/article.vue

@@ -4,6 +4,14 @@
       <el-button type="primary" @click="addNewBlogClick">新增文章</el-button>
     </div>
 
+    <el-form :inline="true" :model="blogStore.queryBlog">
+      <el-form-item label="类别" style="margin-bottom: 0;">
+        <el-input v-model="blogStore.queryBlog.category"
+                  placeholder="请输入博客类别" clearable
+                  @input="changeCategoryClick"/>
+      </el-form-item>
+    </el-form>
+
     <el-table
         :data="blogStore.blogList"
         border stripe
@@ -78,6 +86,10 @@ const changePageClick = async (page: number, pageSize: number) => {
   await blogStore.queryBlogList()
 }
 
+const changeCategoryClick = async () => {
+  await blogStore.queryBlogList()
+}
+
 /**
  * 点击新增博客按钮
  */

src/views/blog/category.vue

@@ -1,82 +0,0 @@
-<template>
-  <div class="admin-module">
-    <div class="button-container">
-      <el-button type="primary" @click="addNewCategoryClick">新增类别</el-button>
-    </div>
-
-    <el-table
-        :data="blogStore.blogCategoryList"
-        border stripe
-        :header-cell-style="tableHeaderStyle()"
-        :cell-style="tableCellStyle()"
-        :row-style="tableRowStyle()"
-        style="width: 50%"
-        class="card-item">
-      <el-table-column type="index" align="center" width="50" />
-      <el-table-column prop="name" label="名称" align="center" min-width="10%"/>
-      <el-table-column prop="count" label="数量" align="center" min-width="10%" />
-      <el-table-column fixed="right" label="操作" align="center" width="200">
-        <template #default="scope">
-          <el-button type="primary" @click="editCategoryClick(scope.row)">编辑</el-button>
-          <el-button type="danger" @click="deleteCategoryClick(scope.row)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { onMounted } from 'vue'
-import { useBlogStore } from '@/store/blog.ts'
-import { IBlogCategory } from '@/types/blog.ts'
-import { ElMessageBox } from 'element-plus'
-import { tableCellStyle, tableHeaderStyle, tableRowStyle } from 'vue3-common/utils/elUtil'
-
-const blogStore = useBlogStore()
-
-onMounted(async () => {
-  await blogStore.queryBlogCategory()
-})
-
-/**
- * 点击新增类别按钮
- */
-const addNewCategoryClick = () => {
-  ElMessageBox.prompt('请输入类别名称', '新增类别', {
-    confirmButtonText: '确认',
-    cancelButtonText: '取消',
-    inputPlaceholder: '请输入类别名称',
-    inputPattern: /^.{0,10}$/,
-    inputErrorMessage: '请输入10字以内的类别名称'
-  })
-    .then(({ value }) => {
-      console.log(value)
-    })
-}
-
-/**
- * 点击编辑类别按钮
- * @param category 类别
- */
-const editCategoryClick = async (category: IBlogCategory) => {
-  ElMessageBox.prompt('请输入类别名称', '编辑类别', {
-    confirmButtonText: '确认',
-    cancelButtonText: '取消',
-    inputValue: category.name,
-    inputPlaceholder: '请输入类别名称',
-    inputPattern: /^.{0,10}$/,
-    inputErrorMessage: '请输入10字以内的类别名称'
-  })
-    .then(({ value }) => {
-      console.log(value)
-    })
-}
-
-/**
- * 点击删除类别按钮
- * @param category 类别
- */
-const deleteCategoryClick = (category: IBlogCategory) => {
-
-}
-</script>

src/views/meta.ts

@@ -21,10 +21,6 @@ export const metaList: IRouteMetaConfig = {
     title: '文章管理',
     icon: 'admin-blogArticle'
   },
-  '/blog/category': {
-    title: '类别管理',
-    icon: 'admin-blogCategory'
-  },
   '/blog/unapproved': {
     title: '草稿箱',
     icon: 'admin-blogUnapproved'