Cxx0822/sweet-hut-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: 重构博客管理模块

Browse Source
This commit is contained in:
Cxx0822
2025-06-10 23:29:55 +08:00
parent 5bf38c2f1a
commit 2fcc2453cf
15 changed files with 149 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/apis/bill.ts
View File

@@ -5,7 +5,6 @@ import {
IBillPay,
IBillQuery,
IBillRecord,
IBillSummaryStats
} from '@/types/bill'
import { IStatsChart } from 'vue3-common/dist/types'
@@ -69,42 +68,42 @@ export const queryBillCategoryApi = (): Promise<IBillCategory[]> =>
export const addBillPayApi = (billPay: IBillPay): Promise<boolean> =>
cloudService({
url: '/admin-service/bill-manage/pay',
url: '/home-service/bill-manage/pay',
method: 'post',
data: billPay
})
export const updateBillPayApi = (id: number, billPay: IBillPay): Promise<boolean> =>
cloudService({
url: `/admin-service/bill-manage/pay/${id}`,
url: `/home-service/bill-manage/pay/${id}`,
method: 'put',
data: billPay
})
export const addBillBookApi = (billBook: IBillBook): Promise<boolean> =>
cloudService({
url: '/admin-service/bill-manage/book',
url: '/home-service/bill-manage/book',
method: 'post',
data: billBook
})
export const updateBillBookApi = (id: number, billBook: IBillBook): Promise<boolean> =>
cloudService({
url: `/admin-service/bill-manage/book/${id}`,
url: `/home-service/bill-manage/book/${id}`,
method: 'put',
data: billBook
})
export const addBillCategoryApi = (billCategory: IBillCategory): Promise<boolean> =>
cloudService({
url: '/admin-service/bill-manage/category',
url: '/home-service/bill-manage/category',
method: 'post',
data: billCategory
})
export const updateBillCategoryApi = (id: number, billCategory: IBillCategory): Promise<boolean> =>
cloudService({
url: `/admin-service/bill-manage/category/${id}`,
url: `/home-service/bill-manage/category/${id}`,
method: 'put',
data: billCategory
})

20
src/views/admin/bill/book.vue → src/components/Home/Bill/BillBook.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="admin-module">
<div class="bill-setting">
<div class="button-container">
<el-button type="primary" @click="addNewBookClick">新增账本</el-button>
</div>
@@ -10,28 +10,28 @@
:header-cell-style="tableHeaderStyle()"
:cell-style="tableCellStyle()"
:row-style="tableRowStyle()"
style="width: 50%"
style="width: 100%"
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 label="图标" align="center" min-width="10%">
<el-table-column type="index" align="center" width="50"/>
<el-table-column prop="name" label="名称" align="center" width="100"/>
<el-table-column label="图标" align="center" width="80">
<template #default="scope">
<i :class="scope.row.icon" :style="{color: scope.row.color, fontSize: '24px'}"></i>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" align="center" width="200">
<el-table-column label="操作" align="center">
<template #default="scope">
<el-button type="primary" @click="editBookClick(scope.row)">编辑</el-button>
<el-button type="danger" @click="deleteBookClick(scope.row)">删除</el-button>
<el-button type="primary" size="small" @click="editBookClick(scope.row)">编辑</el-button>
<el-button type="danger" size="small" @click="deleteBookClick(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<el-dialog v-model="billInfo.billBookDialog.visible"
:title="billInfo.billBookDialog.title"
center width="500" @open="openDialogEvent">
center width="80%" @open="openDialogEvent">
<el-form ref="formRef" :model="billInfo.billBookDialog.data"
:rules="rules" label-width="100px">
:rules="rules" label-position="top" label-width="100px">
<el-form-item label="账本名称" prop="name">
<el-input v-model="billInfo.billBookDialog.data.name" autocomplete="off"
placeholder="请输入类型名称"

19
src/views/admin/bill/category.vue → src/components/Home/Bill/BillCategory.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="admin-module">
<div class="bill-setting">
<div class="button-container">
<el-select
v-model="billInfo.bookName"
@@ -24,32 +24,31 @@
:row-style="tableRowStyle()"
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="bookName" label="账本" align="center" min-width="10%"/>
<el-table-column label="类型" align="center" min-width="10%">
<el-table-column prop="name" label="名称" align="center" width="80"/>
<el-table-column label="类型" align="center" width="80">
<template #default="scope">
<el-tag v-if="scope.row.type === 'expensive'" effect="dark" color="#CA6C65">支出</el-tag>
<el-tag v-else effect="dark" color="#6FBB69">收入</el-tag>
</template>
</el-table-column>
<el-table-column label="图标" align="center" min-width="10%">
<el-table-column label="图标" align="center" width="80">
<template #default="scope">
<i :class="scope.row.icon" :style="{color: scope.row.color, fontSize: '24px'}"></i>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" align="center" width="200">
<el-table-column label="操作" align="center" width="150">
<template #default="scope">
<el-button type="primary" @click="editCategoryClick(scope.row)">编辑</el-button>
<el-button type="danger" @click="deleteCategoryClick(scope.row)">删除</el-button>
<el-button type="primary" size="small" @click="editCategoryClick(scope.row)">编辑</el-button>
<el-button type="danger" size="small" @click="deleteCategoryClick(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<el-dialog v-model="billInfo.billCategoryDialog.visible"
:title="billInfo.billCategoryDialog.title"
center width="500" @open="openDialogEvent">
center width="80%" @open="openDialogEvent">
<el-form ref="formRef" :model="billInfo.billCategoryDialog.data"
:rules="rules" label-width="100px">
:rules="rules" label-position="top" label-width="100px">
<el-form-item label="账本名称" prop="bookName">
<el-select
v-model="billInfo.billCategoryDialog.data.bookName"

18
src/views/admin/bill/pay.vue → src/components/Home/Bill/BillPay.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="admin-module">
<div class="bill-setting">
<div class="button-container">
<el-button type="primary" @click="addNewPayClick">新增账户</el-button>
</div>
@@ -10,28 +10,28 @@
:header-cell-style="tableHeaderStyle()"
:cell-style="tableCellStyle()"
:row-style="tableRowStyle()"
style="width: 50%"
style="width: 100%"
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 label="图标" align="center" min-width="10%">
<el-table-column prop="name" label="名称" align="center" width="100"/>
<el-table-column label="图标" align="center" width="80">
<template #default="scope">
<i :class="scope.row.icon" :style="{color: scope.row.color, fontSize: '24px'}"></i>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" align="center" width="200">
<el-table-column label="操作" align="center">
<template #default="scope">
<el-button type="primary" @click="editPayClick(scope.row)">编辑</el-button>
<el-button type="danger" @click="deletePayClick(scope.row)">删除</el-button>
<el-button type="primary" size="small" @click="editPayClick(scope.row)">编辑</el-button>
<el-button type="danger" size="small" @click="deletePayClick(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<el-dialog v-model="billInfo.billPayDialog.visible"
:title="billInfo.billPayDialog.title"
center width="500" @open="openDialogEvent">
center width="80%" @open="openDialogEvent">
<el-form ref="formRef" :model="billInfo.billPayDialog.data"
:rules="rules" label-width="100px">
:rules="rules" label-position="top" label-width="100px">
<el-form-item label="账户名称" prop="name">
<el-input v-model="billInfo.billPayDialog.data.name" autocomplete="off"
placeholder="请输入类型名称"

18
src/components/Home/Login/CommonLogin.vue
View File

@@ -83,9 +83,9 @@ import { useUserStore } from '@/store/user'
import { ElMessage, FormRules } from 'element-plus'
import { onMounted, reactive, ref } from 'vue'
import { loginRules } from '@/utils/element/elRules'
import { isMobile } from 'vue3-common/utils/layoutUtil'
import { getLocalStorage, setLocalStorage } from 'vue3-common/utils/storageUtil'
import { ILoginType } from '@/types/auth'
import {isMobile} from "vue3-common/utils/layoutUtil";
const rules = reactive<FormRules>(loginRules)
const authStore = useAuthStore()
@@ -106,6 +106,18 @@ const handleLogin = async (type: ILoginType) => {
if (valid) {
authStore.loginLoading = true
if (type === 'common' && !isMobile()) {
ElMessage.error("目前只支持移动端")
authStore.loginLoading = false
return
}
if (type === 'admin' && isMobile()) {
ElMessage.error("目前只支持PC端")
authStore.loginLoading = false
return
}
try {
await authStore.handleLogin(type)
userStore.handleSession(authStore.homeSession)
@@ -115,10 +127,8 @@ const handleLogin = async (type: ILoginType) => {
setLocalStorage('loginForm', JSON.stringify(authStore.loginForm))
}
if (isMobile()) {
if (type === 'common') {
await router.push('/mobile-home')
} else if (type === 'common') {
await router.push('/home')
} else {
await router.push('/admin')
}

5
src/layout/mobile-home/TabBar.vue
View File

@@ -15,6 +15,11 @@
<i class="fa-solid fa-chart-pie"></i>
<span>统计</span>
</router-link>
<router-link v-if="path.includes('bill')" to="/mobile-home/bill/setting"
@click="routerClick()" class="item">
<i class="fa-solid fa-gear"></i>
<span>设置</span>
</router-link>
<router-link v-if="path.includes('food')" to="/mobile-home/food/recipe"
@click="routerClick()" class="item">

7
src/router/home.ts
View File

@@ -1,12 +1,7 @@
import HomeLayout from '@/layout/home/index.vue'
import MobileHomeLayout from '@/layout/mobile-home/index.vue'
import { getRoutersByModules, sortRoutesByOrder } from 'vue3-common/utils/routerUtil'
import { homeMeta } from '@/views/home/meta'
import { mobileHomeMeta } from '@/views/mobile-home/meta.ts'
import { isMobile } from 'vue3-common/utils/layoutUtil'
const homeRoutes = isMobile()
? getRoutersByModules(import.meta.glob('@/views/mobile-home/**/*.vue'), MobileHomeLayout, mobileHomeMeta)
: getRoutersByModules(import.meta.glob('@/views/home/**/*.vue'), HomeLayout, homeMeta)
const homeRoutes = getRoutersByModules(import.meta.glob('@/views/mobile-home/**/*.vue'), MobileHomeLayout, mobileHomeMeta)
export default sortRoutesByOrder(homeRoutes)

5
src/styles/admin.layout.module.scss
View File

@@ -190,11 +190,6 @@ $transition-time: 0.28s;
flex-direction: column;
align-items: center;
gap: 1vh;
.button-container {
display: flex;
gap: 1vw;
}
}
.card-item {

13
src/styles/home/bill.mobile.module.scss
View File

@@ -73,4 +73,17 @@
width: 80px;
}
}
.bill-setting {
display: flex;
flex-direction: column;
gap: 10px;
.button-container {
align-self: center;
display: flex;
gap: 10px;
}
}
}

11
src/views/admin/blog/article.vue
View File

@@ -28,8 +28,9 @@
</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="200">
<el-table-column fixed="right" label="操作" align="center" width="250">
<template #default="scope">
<el-button type="primary" @click="previewBlogClick(scope.row)">预览</el-button>
<el-button type="primary" @click="editBlogClick(scope.row)">编辑</el-button>
<el-button type="danger" @click="deleteBlogClick(scope.row)">删除</el-button>
</template>
@@ -78,6 +79,14 @@ const addNewBlogClick = () => {
router.push({ name: 'AdminBlogDetailId', params: { id: 0 } })
}
/**
* 点击预览博客按钮
* @param blog 博客
*/
const previewBlogClick = async (blog: IBlog) => {
await router.push({ name: 'AdminBlogPreviewId', params: { id: blog.id } })
}
/**
* 点击编辑博客按钮
* @param blog 博客

11
src/views/admin/blog/detail[id].vue
View File

@@ -33,11 +33,8 @@
<MdEditor v-model="blogStore.newBlog.content" @onUploadImg="onUploadImg"/>
<div class="button-container">
<el-button type="primary" @click="submitFormEvent">保存</el-button>
</div>
<div class="back-button">
<el-button type="primary" @click="backClick">返回</el-button>
<el-button type="primary" @click="submitFormEvent">保存</el-button>
</div>
</div>
</template>
@@ -148,11 +145,5 @@ const backClick = () => {
.md-editor {
height: 80vh;
}
.back-button {
position: absolute;
top: 10px;
left: 10px;
}
}
</style>

34
src/views/admin/blog/preview[id].vue Normal file
View File

@@ -0,0 +1,34 @@
<template>
<div class="admin-module">
<h3>{{ blogStore.currentBlog.title }}</h3>
<MdPreview editorId="blog-id" v-model="blogStore.currentBlog.content"/>
<div class="button-container">
<el-button type="primary" @click="backClick">返回</el-button>
</div>
</div>
</template>
<script lang="ts" setup>
import { onMounted } from 'vue'
import { useBlogStore } from '@/store/blog.ts'
import { MdPreview } from 'md-editor-v3'
import 'md-editor-v3/lib/style.css'
import { useRouter, useRoute } from 'vue-router'
const route = useRoute()
const router = useRouter()
const blogStore = useBlogStore()
onMounted(async () => {
const blogId = route.params.id as number
await blogStore.queryAdminBlogById(blogId)
blogStore.newBlog = blogStore.currentBlog
})
const backClick = () => {
router.push('/admin/blog/article')
}
</script>

30
src/views/admin/meta.ts
View File

@@ -20,49 +20,29 @@ export const adminMeta: IRouteMetaConfig = {
'/admin/blog/article': {
title: '文章管理',
icon: '',
order: 1
},
'/admin/blog/category': {
title: '类别管理',
icon: '',
order: 2
},
'/admin/blog/visit': {
title: '访问记录',
icon: '',
order: 3
},
'/admin/blog/detail/:id': {
title: '详细',
icon: '',
order: 4,
hidden: true
},
'/admin/bill': {
title: '账单管理',
icon: 'admin-bill',
order: 3,
redirect: '/admin/bill/book'
},
'/admin/bill/book': {
title: '账本管理',
'/admin/blog/preview/:id': {
title: '详细',
icon: '',
order: 1
},
'/admin/bill/pay': {
title: '账户管理',
icon: '',
order: 2
},
'/admin/bill/category': {
title: '类别管理',
icon: '',
order: 3
hidden: true
},
'/admin/quartz': {
title: '定时任务',
icon: 'admin-quartz',
order: 4,
order: 3,
redirect: '/admin/quartz/index'
},
'/admin/quartz/index': {
@@ -72,7 +52,7 @@ export const adminMeta: IRouteMetaConfig = {
'/admin/account': {
title: '账号管理',
icon: 'admin-account',
order: 5,
order: 4,
redirect: '/admin/account/index'
},
'/admin/account/index': {

28
src/views/mobile-home/bill/setting.vue Normal file
View File

@@ -0,0 +1,28 @@
<template>
<div class="mobile-bill-view common-mobile-view">
<el-tabs v-model="activeName" type="card">
<el-tab-pane label="账本" name="book">
<bill-book />
</el-tab-pane>
<el-tab-pane label="账户" name="pay">
<bill-pay />
</el-tab-pane>
<el-tab-pane label="类别" name="category">
<bill-category />
</el-tab-pane>
</el-tabs>
</div>
</template>
<script lang="ts" setup>
import BillBook from '@/components/Home/Bill/BillBook.vue'
import BillPay from '@/components/Home/Bill/BillPay.vue'
import BillCategory from '@/components/Home/Bill/BillCategory.vue'
import { ref } from 'vue'
const activeName = ref('book')
</script>
<style lang="scss">
@use "@/styles/home/bill.mobile.module.scss";
</style>

4
src/views/mobile-home/meta.ts
View File

@@ -45,6 +45,10 @@ export const mobileHomeMeta: IRouteMetaConfig = {
title: '账单内容',
icon: ''
},
'/mobile-home/bill/setting': {
title: '账单设置',
icon: ''
},
'/mobile-home/food': {
title: '美食记录',
icon: 'home-food',