Browse Source

add news

master
sunfree 9 months ago
parent
commit
621c835c05
  1. 19
      src/components/admin/MainWrapper.vue
  2. 13
      src/components/blogs/HomePage.vue
  3. 4
      src/router/blog.ts
  4. 2
      src/tools/request.ts
  5. 9
      src/types/custom.d.ts

19
src/components/admin/MainWrapper.vue

@ -3,7 +3,7 @@
<div id="container"> <div id="container">
<div class="leftSidebar" :style="{ width: state.menuWidth }"> <div class="leftSidebar" :style="{ width: state.menuWidth }">
<a-flex justify="center" align="center" style="height: 48px;"> <a-flex justify="center" align="center" style="height: 48px;">
<TitleOutLined :class="collapsed ? 'small' : 'large'" />
<component :is=iconComponents.TitleOutLined :class="collapsed ? 'small' : 'large'" />
<span v-if="!collapsed">{{ state.name }}</span> <span v-if="!collapsed">{{ state.name }}</span>
</a-flex> </a-flex>
<a-menu v-model:openKeys="state.openKeys" v-model:selectedKeys="state.selectedKeys" mode="inline" theme="light" <a-menu v-model:openKeys="state.openKeys" v-model:selectedKeys="state.selectedKeys" mode="inline" theme="light"
@ -41,13 +41,12 @@
<script setup lang='ts'> <script setup lang='ts'>
import { computed, ref, onMounted, h, reactive } from 'vue'; import { computed, ref, onMounted, h, reactive } from 'vue';
import { TitleOutLined } from "@/assets/index"
import iconComponents from "@/assets/index"
import { RouterView, useRouter } from 'vue-router' import { RouterView, useRouter } from 'vue-router'
import { MenuFoldOutlined, MenuUnfoldOutlined, LogoutOutlined, DashboardOutlined } from '@ant-design/icons-vue'; import { MenuFoldOutlined, MenuUnfoldOutlined, LogoutOutlined, DashboardOutlined } from '@ant-design/icons-vue';
import { get } from "@/tools/request" import { get } from "@/tools/request"
import { message } from 'ant-design-vue'; import { message } from 'ant-design-vue';
import { useAuthStore } from '@/store/index' import { useAuthStore } from '@/store/index'
import { BlogOutLined, SystemOutLined, PhotoOutLined, FileOutLined, DiaryOutLined, CommentOutLined, TypeOutLined } from "@/assets"
const state = reactive({ const state = reactive({
collapsed: false, collapsed: false,
@ -66,49 +65,49 @@ const items = reactive([
}, },
{ {
key: '2', key: '2',
icon: () => h(BlogOutLined),
icon: () => h(iconComponents.BlogOutLined),
label: '博客管理', label: '博客管理',
title: '博客管理', title: '博客管理',
url: '/admin/blogmanage' url: '/admin/blogmanage'
}, },
{ {
key: '3', key: '3',
icon: () => h(DiaryOutLined),
icon: () => h(iconComponents.DiaryOutLined),
label: '日记管理', label: '日记管理',
title: '日记管理', title: '日记管理',
url: '/admin/diarymanage' url: '/admin/diarymanage'
}, },
{ {
key: '4', key: '4',
icon: () => h(TypeOutLined),
icon: () => h(iconComponents.TypeOutLined),
label: '分类管理', label: '分类管理',
title: '分类管理', title: '分类管理',
url: '/admin/typemanage' url: '/admin/typemanage'
}, },
{ {
key: '5', key: '5',
icon: () => h(CommentOutLined),
icon: () => h(iconComponents.CommentOutLined),
label: '评论管理', label: '评论管理',
title: '评论管理', title: '评论管理',
url: '/admin/commentmanage' url: '/admin/commentmanage'
}, },
{ {
key: '6', key: '6',
icon: () => h(PhotoOutLined),
icon: () => h(iconComponents.PhotoOutLined),
label: '相册管理', label: '相册管理',
title: '相册管理', title: '相册管理',
url: '/admin/imagemanage' url: '/admin/imagemanage'
}, },
{ {
key: '7', key: '7',
icon: () => h(FileOutLined),
icon: () => h(iconComponents.FileOutLined),
label: '文件管理', label: '文件管理',
title: '文件管理', title: '文件管理',
url: '/admin/filemanage' url: '/admin/filemanage'
}, },
{ {
key: '8', key: '8',
icon: () => h(SystemOutLined),
icon: () => h(iconComponents.SystemOutLined),
label: '系统设置', label: '系统设置',
title: '系统设置', title: '系统设置',
url: '/admin/systemmanage' url: '/admin/systemmanage'

13
src/components/blogs/HomePage.vue

@ -44,7 +44,7 @@
<template #expandIcon="{ isActive }"> <template #expandIcon="{ isActive }">
<caret-right-outlined :rotate="isActive ? 90 : 0" /> <caret-right-outlined :rotate="isActive ? 90 : 0" />
</template> </template>
<a-collapse-panel v-for="panel in panels" :key=panel.num :header=panel.header
<a-collapse-panel v-for="panel in panels" :key=panel.id :header=panel.header
:style="customStyle"> :style="customStyle">
<p>{{ panel.text }}</p> <p>{{ panel.text }}</p>
</a-collapse-panel> </a-collapse-panel>
@ -131,6 +131,7 @@ const show_anchornDown = ref(true)
const mainCss = reactive({ const mainCss = reactive({
marginTop: "0px" marginTop: "0px"
}) })
type MenuProps = any;
const current = ref<string[]>(['home']); const current = ref<string[]>(['home']);
const items = ref<MenuProps['items']>([ const items = ref<MenuProps['items']>([
{ {
@ -190,7 +191,7 @@ const items = ref<MenuProps['items']>([
title: '关于sunfree', title: '关于sunfree',
}, },
]); ]);
const updateCarouselVisibility = (routeName) => {
const updateCarouselVisibility = (routeName:any) => {
handleScrollEnabled.value = false; handleScrollEnabled.value = false;
if (scrollbar.value) { if (scrollbar.value) {
scrollbar.value.scrollTop = 0; scrollbar.value.scrollTop = 0;
@ -253,17 +254,17 @@ const activeKey = ref(['']);
const customStyle = 'background: #F5F5F5;border-radius: 4px;margin-bottom: 12px;border: 0;overflow: hidden'; const customStyle = 'background: #F5F5F5;border-radius: 4px;margin-bottom: 12px;border: 0;overflow: hidden';
const panels = reactive([ const panels = reactive([
{ {
num: "1",
id: "1",
header: "内容1", header: "内容1",
text: "内容1" text: "内容1"
}, },
{ {
num: "2",
id: "2",
header: "内容2", header: "内容2",
text: "内容2" text: "内容2"
}, },
{ {
num: "3",
id: "3",
header: "内容3", header: "内容3",
text: "内容3" text: "内容3"
} }
@ -350,7 +351,7 @@ const writList=[5,4,3,2,1,0]
writList.forEach((item,index)=>{ writList.forEach((item,index)=>{
data[index].writCount = item; data[index].writCount = item;
}) })
const formattedData = newData.map((value, index) => [index % 15, Math.floor(index / 15), value.writCount]);
const formattedData = newData.map((value:any, index:number) => [index % 15, Math.floor(index / 15), value.writCount]);
const heatMapData = { const heatMapData = {
tooltip: { tooltip: {
position: 'top', position: 'top',

4
src/router/blog.ts

@ -42,12 +42,12 @@ const blogRoute:Array<RouteRecordRaw>=[
{ {
path:"/qqcode", path:"/qqcode",
name:"qqcode", name:"qqcode",
component:()=>import("@/components/blogs/QqCode.vue"),
component:()=>import("@/components/blogs/QQCode.vue"),
}, },
{ {
path:"/wechatcode", path:"/wechatcode",
name:"wechatcode", name:"wechatcode",
component:()=>import("@/components/blogs/WeChatCode.vue"),
component:()=>import("@/components/blogs/WechatCode.vue"),
}, },
] ]
export default blogRoute export default blogRoute

2
src/tools/request.ts

@ -3,7 +3,7 @@ import { type AxiosRequestConfig } from 'axios';
import router from '@/router'; import router from '@/router';
const instance = axios.create({ const instance = axios.create({
// 添加url // 添加url
baseURL: 'http://www.wuruilin.cn:8000/',
baseURL: 'http://localhost:8000/',
timeout: 5000, timeout: 5000,
}); });

9
src/types/custom.d.ts

@ -1,4 +1,5 @@
// declare module 'ant-design-vue';
// declare module 'echarts';
// declare module 'ant-design-vue/es/menu'
// declare module 'animejs/lib/anime.es.js'
declare module 'ant-design-vue';
declare module 'echarts';
declare module 'ant-design-vue/es/menu'
declare module 'animejs/lib/anime.es.js'
declare module 'APlayer'
Loading…
Cancel
Save