From 2a04e29ae744310ae805b7dfbd1bb3eb617c9dc5 Mon Sep 17 00:00:00 2001 From: panda <7934952@qq.com> Date: Tue, 2 Jul 2024 17:13:47 +0800 Subject: [PATCH] add new --- src/api/admin/index.ts | 28 ++- src/components/admin/MainWrapper.vue | 13 +- src/components/blogs/HomePage.vue | 37 +++- src/components/blogs/ceshi.vue | 139 +++++++----- src/router/admin.ts | 66 +++--- src/stores/index.ts | 131 ++++------- src/views/admin/LabelManageView.vue | 221 +++++++++++++++++++ src/views/admin/TypeManageView.vue | 221 +++++++++++++++++++ src/views/admin/blogmange/BlogFormView.vue | 26 ++- src/views/admin/blogmange/BlogManageView.vue | 151 ++++++++++--- 10 files changed, 817 insertions(+), 216 deletions(-) create mode 100644 src/views/admin/LabelManageView.vue create mode 100644 src/views/admin/TypeManageView.vue diff --git a/src/api/admin/index.ts b/src/api/admin/index.ts index a67f7fc..038e017 100644 --- a/src/api/admin/index.ts +++ b/src/api/admin/index.ts @@ -1,4 +1,16 @@ -// 语录管理 +export interface blogInterface { + key: string, + blogtitle: string, + create_at: Date, + readnum: number, + readminite: number, + wordcount: number, + img: string, + blogcontent: string, + typename: string, + labelnames: string +} + export interface classticInterface { key: string, id?: number, @@ -13,4 +25,18 @@ export interface comLinkInterface { linktext: string, linkurl: string, descr: string +} + +export interface typeInterface { + key: string, + id?: number, + typename: string, + descr: string +} + +export interface labelInterface { + key: string, + id?: number, + labelname: string, + descr: string } \ No newline at end of file diff --git a/src/components/admin/MainWrapper.vue b/src/components/admin/MainWrapper.vue index ed6ea69..b9ff55e 100644 --- a/src/components/admin/MainWrapper.vue +++ b/src/components/admin/MainWrapper.vue @@ -100,27 +100,34 @@ const items = reactive([ }, { key: '7', + icon: () => h(iconComponents.TypeOutLined), + label: '标签管理', + title: '标签管理', + url: '/admin/labelmanage' + }, + { + key: '8', icon: () => h(iconComponents.CommentOutLined), label: '评论管理', title: '评论管理', url: '/admin/commentmanage' }, { - key: '8', + key: '9', icon: () => h(iconComponents.PhotoOutLined), label: '相册管理', title: '相册管理', url: '/admin/imagemanage' }, { - key: '9', + key: '10', icon: () => h(iconComponents.FileOutLined), label: '文件管理', title: '文件管理', url: '/admin/filemanage' }, { - key: '10', + key: '11', icon: () => h(iconComponents.SystemOutLined), label: '系统设置', title: '系统设置', diff --git a/src/components/blogs/HomePage.vue b/src/components/blogs/HomePage.vue index 17b1ae7..e97f281 100644 --- a/src/components/blogs/HomePage.vue +++ b/src/components/blogs/HomePage.vue @@ -2,7 +2,8 @@
- +
{{ author }}
@@ -114,7 +115,7 @@ import { onMounted, watch } from 'vue'; import { CaretRightOutlined } from '@ant-design/icons-vue'; import 'APlayer/dist/APlayer.min.css'; import APlayer from 'APlayer'; -import {get} from "@/tools/request" +import { get } from "@/tools/request" import { createEcharts } from "@/hooks/intex" import { useRouter, useRoute } from 'vue-router'; import iconComponents from "@/assets/index"; @@ -123,7 +124,7 @@ import type { comLinkInterface } from '@/api/admin/index'; const router = useRouter() const route = useRoute() -const author=ref("SunFree.") +const author = ref("SunFree.") /** * 隐藏参数 */ @@ -138,14 +139,14 @@ const { show_menu, show_carousel, show_author, show_anchornDown } = toRefs(idSho const mainCss = reactive({ marginTop: "0px" }) -type MenuProps = any; const current = ref(['home']); const items = ref([ { key: 'home', icon: () => h(HomeOutlined), - label: h('a', { href: '/' }, '首页'), + label: '首页', title: '首页', + url: "/home" }, { @@ -153,12 +154,14 @@ const items = ref([ icon: () => h(HighlightOutlined), label: h('a', { href: "/blog" }, '博客'), title: '博客', + url: "/blog" }, { key: 'diary', icon: () => h(ProfileOutlined), label: h('a', { href: "/diary" }, '日记'), title: '日记', + url: "/diary" }, { key: 'album', @@ -189,14 +192,24 @@ const items = ref([ icon: () => h(UsergroupDeleteOutlined), label: h('a', { href: "/chart" }, '收支图'), title: '收支图', + url: "/chart" }, { key: 'aboutme', icon: () => h(UsergroupDeleteOutlined), label: h('a', { href: "/aboutme" }, '关于sunfree'), title: '关于sunfree', + url: "/aboutme" }, ]); + +const jumpMenu = ({ key }:{key:string}) => { + // 从 `item` 中获取 `key` 和 `url` 信息 + const selectedItem = items.value.find((i:any) => i.key === key); + if (selectedItem && selectedItem.url) { + router.push(selectedItem.url); + } + }; const updateCarouselVisibility = (routeName: any) => { handleScrollEnabled.value = false; if (scrollbar.value) { @@ -255,8 +268,8 @@ const downScroll = () => { * 左侧栏 */ // 折叠面板 -const classticlist=ref([]) -const classticList=async ()=>{ +const classticlist = ref([]) +const classticList = async () => { try { await get("/classtics/list").then(response => { if (response) { @@ -276,11 +289,11 @@ const classticList=async ()=>{ } const comLinkClick = (url: string) => { if (url.startsWith('http://') || url.startsWith('https://')) { - window.open(url, "_blank"); // 使用 window.location.href 打开外部链接 + window.open(url, "_blank"); // 使用 window.location.href 打开外部链接 } else { - router.push(url); // 否则使用 Vue Router 的 push 方法导航 + router.push(url); // 否则使用 Vue Router 的 push 方法导航 } - } +} const comlinklist = ref([]) const comLinkList = async () => { try { @@ -586,10 +599,12 @@ watch( border-style: hidden; transform: translateX(-50%); } -.anchorDown span{ + +.anchorDown span { font-size: 35px; color: aliceblue; } + .mainContainer { display: flex; justify-content: center; diff --git a/src/components/blogs/ceshi.vue b/src/components/blogs/ceshi.vue index d5c37b0..e997e5f 100644 --- a/src/components/blogs/ceshi.vue +++ b/src/components/blogs/ceshi.vue @@ -1,58 +1,95 @@ diff --git a/src/router/admin.ts b/src/router/admin.ts index 60a3fe1..c6c3237 100644 --- a/src/router/admin.ts +++ b/src/router/admin.ts @@ -1,20 +1,20 @@ import type { RouteRecordRaw } from 'vue-router' -const adminRoute:Array=[ +const adminRoute: Array = [ { - path:"/admin", - redirect:"/admin/dashboard", - name:'admin', - component:()=> import("@/components/admin/MainWrapper.vue"), - children:[ - { - path:"dashboard", - name:"dashboard", - component:()=>import("@/views/admin/DashBoardView.vue") + path: "/admin", + redirect: "/admin/dashboard", + name: 'admin', + component: () => import("@/components/admin/MainWrapper.vue"), + children: [ + { + path: "dashboard", + name: "dashboard", + component: () => import("@/views/admin/DashBoardView.vue") }, { - path:"blogmanage", - name:"blogmanage", - component:()=>import("@/views/admin/blogmange/BlogManageView.vue") + path: "blogmanage", + name: "blogmanage", + component: () => import("@/views/admin/blogmange/BlogManageView.vue") }, { path: "blogmanage/add", @@ -22,28 +22,38 @@ const adminRoute:Array=[ meta: { requiresAuth: true } }, { - path: "blogmanage/update/:id", - component: () => import("@/views/admin/blogmange/BlogFormView.vue"), - meta: { requiresAuth: true }, - props:true + path: "blogmanage/update/:id", + component: () => import("@/views/admin/blogmange/BlogFormView.vue"), + meta: { requiresAuth: true }, + props: true + }, + { + path: "classticmanage", + name: "classticmanage", + component: () => import("@/views/admin/ClassticManageView.vue") }, { - path:"classticmanage", - name:"classticmanage", - component:()=>import("@/views/admin/ClassticManageView.vue") + path: "commonlinkmanage", + name: "commonlinkmanage", + component: () => import("@/views/admin/CommonLinkManageView.vue") }, { - path:"commonlinkmanage", - name:"commonlinkmanage", - component:()=>import("@/views/admin/CommonLinkManageView.vue") + path: "typemanage", + name: "typemanage", + component: () => import("@/views/admin/TypeManageView.vue") + }, + { + path: "labelmanage", + name: "labelmanage", + component: () => import("@/views/admin/LabelManageView.vue") } - + ] }, - { - path: "/login", - name: "login", - component: () => import("@/components/admin/SignIn.vue"), + { + path: "/login", + name: "login", + component: () => import("@/components/admin/SignIn.vue"), }, ] export default adminRoute \ No newline at end of file diff --git a/src/stores/index.ts b/src/stores/index.ts index 05304eb..84b1ec4 100644 --- a/src/stores/index.ts +++ b/src/stores/index.ts @@ -1,12 +1,19 @@ import { reactive, ref } from 'vue' import { defineStore } from 'pinia' -import { get } from "@/tools/request" -import dayjs from 'dayjs'; -import type { blogInterface } from '@/api/admin'; export const mainWrapperStore=defineStore("mainWrapper",()=>{ }) + +export const blogStore = defineStore("blog", () => { + + + const delControl = reactive({ + open: false, + ids: "" + }) + return { delControl } +}) export const classticStore = defineStore("classtic", () => { const addControl = reactive({ open: false, @@ -47,19 +54,46 @@ export const comLinkStore = defineStore("comLink", () => { }) return { addControl, delControl,editControl } }) +export const typeStore = defineStore("type", () => { + const addControl = reactive({ + open: false, + title: "", + ids: "" + }) + const delControl = reactive({ + open: false, + ids: "" + }) + const editControl = reactive({ + open: false, + ids: "", + title:"" + }) + return { addControl, delControl,editControl } +}) +export const labelStore = defineStore("label", () => { + const addControl = reactive({ + open: false, + title: "", + ids: "" + }) + const delControl = reactive({ + open: false, + ids: "" + }) + const editControl = reactive({ + open: false, + ids: "", + title:"" + }) + return { addControl, delControl,editControl } +}) - - - - -// 博客列表 -const bloglist = ref([]) - export const useAuthStore = defineStore("auth", () => { const tokenValue = ref("") function setToken(token: string) { @@ -71,82 +105,5 @@ export const useAuthStore = defineStore("auth", () => { return { setToken, removeToken } }) -// 博客列表接口 -export const blogContentStore = defineStore("blog", () => { - const blogList = async () => { - try { - const response = await get("/blogs/list"); - if (response) { - bloglist.value = response.data.data.map((items: any, index: any) => ({ - key: (index + 1).toString(), - blogtitle: items.blogtitle, - create_at: dayjs(items.create_at).format('YYYY-MM-DD HH:mm:ss'), - update_at: dayjs(items.update_at).format('YYYY-MM-DD HH:mm:ss'), - readnum: items.readnum, - readminite: items.readminite, - wordcount: items.wordcount, - img: items.img, - blogcontent: items.blogcontent, - typename: items.typename, - labelnames: items.labelnames - })) - } else { - console.log("bloglist is not exits") - } - } catch (error) { - console.log("bloglist is error") - } - - } - return { blogList, bloglist } -}) -// 博客查询接口 -export const blogSearchStore = defineStore('blogsearch', () => { - const searchValue = reactive({ - blogtitle: '', - typename: '', - start_date: '', - end_date: '' - }); - - const onChange = (date: string, dateString: string[]) => { - if (date && dateString.length === 2) { - searchValue.start_date = dateString[0]; - searchValue.end_date = dateString[1]; - } else { - searchValue.start_date = ''; - searchValue.end_date = ''; - } - console.log(dateString[0]); - }; - - const blogSearch = async () => { - try { - const response = await get("/blogs/list/search", { - blogtitle: searchValue.blogtitle, - typename: searchValue.typename, - start_date: searchValue.start_date, - end_date: searchValue.end_date - }); - if (response && response.data) { - bloglist.value = response.data.data.map((items: any, index: any) => ({ - key: (index + 1).toString(), - blogtitle: items.blogtitle, - typename: items.typename, - blogcontent: items.blogcontent, - create_at: dayjs(items.create_at).format('YYYY-MM-DD HH:mm:ss'), - update_at: dayjs(items.update_at).format('YYYY-MM-DD HH:mm:ss'), - descr: items.descr - })); - console.log(response) - } else { - console.log("request has no data"); - } - } catch (error) { - console.error("request is exception", error); - } - }; - return { searchValue, onChange, blogSearch }; -}); diff --git a/src/views/admin/LabelManageView.vue b/src/views/admin/LabelManageView.vue new file mode 100644 index 0000000..8c7fe92 --- /dev/null +++ b/src/views/admin/LabelManageView.vue @@ -0,0 +1,221 @@ + + + + + \ No newline at end of file diff --git a/src/views/admin/TypeManageView.vue b/src/views/admin/TypeManageView.vue new file mode 100644 index 0000000..e20b342 --- /dev/null +++ b/src/views/admin/TypeManageView.vue @@ -0,0 +1,221 @@ + + + + + \ No newline at end of file diff --git a/src/views/admin/blogmange/BlogFormView.vue b/src/views/admin/blogmange/BlogFormView.vue index 807fab0..08a2e17 100644 --- a/src/views/admin/blogmange/BlogFormView.vue +++ b/src/views/admin/blogmange/BlogFormView.vue @@ -11,6 +11,15 @@ typeItem.typename }} + + + Red + Green + + + + + @@ -34,13 +43,16 @@ import type { UnwrapRef } from 'vue'; import type { Rule } from 'ant-design-vue/es/form'; import { post, get, put } from '@/tools/request'; import { useRouter } from 'vue-router' + const router = useRouter() interface FormState { id?: number; blogtitle: string; typeid: number; blogcontent: string; + labelname: string[]; descr: string; + imglink: string } const formRef = ref(); @@ -48,7 +60,9 @@ const formState: UnwrapRef = reactive({ blogtitle: '', typeid: 1, blogcontent: "", + labelname: [], descr: '', + imglink: "" }); const rules: Record = { blogtitle: [ @@ -61,11 +75,11 @@ const rules: Record = { ], }; const content = ref(); -interface TypeStateData{ - id:number, - key:string, - typename:string, - descr:string +interface TypeStateData { + id: number, + key: string, + typename: string, + descr: string } const typedata = ref([]) onMounted(async () => { @@ -112,7 +126,7 @@ const resetForm = () => { } .items { - width: calc(75vw/2); + width: calc(75vw/4); } #content { diff --git a/src/views/admin/blogmange/BlogManageView.vue b/src/views/admin/blogmange/BlogManageView.vue index 44a1809..f2f9755 100644 --- a/src/views/admin/blogmange/BlogManageView.vue +++ b/src/views/admin/blogmange/BlogManageView.vue @@ -2,25 +2,31 @@
- - - + + + - 查询 + 查询 新增
- +