|
@ -28,7 +28,7 @@ |
|
|
<!-- 主要内容区域 --> |
|
|
<!-- 主要内容区域 --> |
|
|
<div class="mainContainer" :style="mainCss"> |
|
|
<div class="mainContainer" :style="mainCss"> |
|
|
<div class="leftBar"> |
|
|
<div class="leftBar"> |
|
|
<a-card hoverable> |
|
|
<!-- <a-card hoverable> |
|
|
<template #cover> |
|
|
<template #cover> |
|
|
<img alt="example" src="/src/assets/images/头像.jpg" /> |
|
|
<img alt="example" src="/src/assets/images/头像.jpg" /> |
|
|
</template> |
|
|
</template> |
|
@ -51,15 +51,9 @@ |
|
|
</a-collapse-panel> |
|
|
</a-collapse-panel> |
|
|
</a-collapse> |
|
|
</a-collapse> |
|
|
</div> |
|
|
</div> |
|
|
</a-card> |
|
|
</a-card> --> |
|
|
<a-card hoverable title="常用链接"> |
|
|
<LeftSiteInfo/> |
|
|
<div class="button-group"> |
|
|
<ComLink /> |
|
|
<a-button type="dashed" v-for="comlink in comlinklist" :key="comlink.id" |
|
|
|
|
|
@click="comLinkClick(comlink.linkurl)">{{ |
|
|
|
|
|
comlink.linktext |
|
|
|
|
|
}}</a-button> |
|
|
|
|
|
</div> |
|
|
|
|
|
</a-card> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
<RouterView /> |
|
|
<RouterView /> |
|
|
<div class="rightBar"> |
|
|
<div class="rightBar"> |
|
@ -176,8 +170,10 @@ import { get } from "@/tools/request" |
|
|
import { createEcharts } from "@/hooks/intex" |
|
|
import { createEcharts } from "@/hooks/intex" |
|
|
import { useRouter, useRoute } from 'vue-router'; |
|
|
import { useRouter, useRoute } from 'vue-router'; |
|
|
import iconComponents from "@/assets/index"; |
|
|
import iconComponents from "@/assets/index"; |
|
|
import type { classticInterface, comLinkInterface, labelInterface } from '@/api/admin'; |
|
|
import type { classticInterface, labelInterface } from '@/api/admin'; |
|
|
import type { homePageInterface } from '@/api'; |
|
|
import type { homePageInterface } from '@/api'; |
|
|
|
|
|
import ComLink from './ComLink.vue'; |
|
|
|
|
|
import LeftSiteInfo from "./LeftSiteInfo.vue" |
|
|
const router = useRouter() |
|
|
const router = useRouter() |
|
|
const route = useRoute() |
|
|
const route = useRoute() |
|
|
const author = ref("SunFree.") |
|
|
const author = ref("SunFree.") |
|
@ -315,65 +311,65 @@ const downScroll = () => { |
|
|
* 左侧栏 |
|
|
* 左侧栏 |
|
|
*/ |
|
|
*/ |
|
|
// 折叠面板 |
|
|
// 折叠面板 |
|
|
const classticlist = ref<classticInterface[]>([]) |
|
|
// const classticlist = ref<classticInterface[]>([]) |
|
|
const classticList = async () => { |
|
|
// const classticList = async () => { |
|
|
try { |
|
|
// try { |
|
|
await get("/classtics/list").then(response => { |
|
|
// await get("/classtics/list").then(response => { |
|
|
if (response) { |
|
|
// if (response) { |
|
|
classticlist.value = response.data.data.map((item: any, index: any) => ({ |
|
|
// classticlist.value = response.data.data.map((item: any, index: any) => ({ |
|
|
key: (index + 1).toString(), |
|
|
// key: (index + 1).toString(), |
|
|
header: item.header, |
|
|
// header: item.header, |
|
|
text: item.text, |
|
|
// text: item.text, |
|
|
descr: item.descr |
|
|
// descr: item.descr |
|
|
})); |
|
|
// })); |
|
|
} else { |
|
|
// } else { |
|
|
console.log("the interface request data does not exist!") |
|
|
// console.log("the interface request data does not exist!") |
|
|
} |
|
|
// } |
|
|
}) |
|
|
// }) |
|
|
} catch (error) { |
|
|
// } catch (error) { |
|
|
console.error("Failed to fetch data", error); |
|
|
// console.error("Failed to fetch data", error); |
|
|
} |
|
|
// } |
|
|
} |
|
|
// } |
|
|
const comLinkClick = (url: string) => { |
|
|
// const comLinkClick = (url: string) => { |
|
|
if (url.startsWith('http://') || url.startsWith('https://')) { |
|
|
// if (url.startsWith('http://') || url.startsWith('https://')) { |
|
|
window.open(url, "_blank"); // 使用 window.location.href 打开外部链接 |
|
|
// window.open(url, "_blank"); // 使用 window.location.href 打开外部链接 |
|
|
} else { |
|
|
// } else { |
|
|
router.push(url); // 否则使用 Vue Router 的 push 方法导航 |
|
|
// router.push(url); // 否则使用 Vue Router 的 push 方法导航 |
|
|
} |
|
|
// } |
|
|
} |
|
|
// } |
|
|
const comlinklist = ref<comLinkInterface[]>([]) |
|
|
// const comlinklist = ref<comLinkInterface[]>([]) |
|
|
const comLinkList = async () => { |
|
|
// const comLinkList = async () => { |
|
|
try { |
|
|
// try { |
|
|
await get("/comlinks/list").then(response => { |
|
|
// await get("/comlinks/list").then(response => { |
|
|
if (response) { |
|
|
// if (response) { |
|
|
comlinklist.value = response.data.data.map((item: any, index: any) => ({ |
|
|
// comlinklist.value = response.data.data.map((item: any, index: any) => ({ |
|
|
key: (index + 1).toString(), |
|
|
// key: (index + 1).toString(), |
|
|
id: item.id, |
|
|
// id: item.id, |
|
|
linktext: item.linktext, |
|
|
// linktext: item.linktext, |
|
|
linkurl: item.linkurl, |
|
|
// linkurl: item.linkurl, |
|
|
descr: item.descr |
|
|
// descr: item.descr |
|
|
})); |
|
|
// })); |
|
|
} else { |
|
|
// } else { |
|
|
console.log("the interface request data does not exist!") |
|
|
// console.log("the interface request data does not exist!") |
|
|
} |
|
|
// } |
|
|
}) |
|
|
// }) |
|
|
} catch (error) { |
|
|
// } catch (error) { |
|
|
console.error("Failed to fetch data", error); |
|
|
// console.error("Failed to fetch data", error); |
|
|
} |
|
|
// } |
|
|
} |
|
|
// } |
|
|
const activeKey = ref(['']); |
|
|
// 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 buttons = ref([ |
|
|
const buttons = ref([ |
|
|
// { icon: iconComponents.CravatarLined, url: 'https://cravatar.cn/' }, |
|
|
{ icon: iconComponents.CravatarLined, url: 'https://cravatar.cn/' }, |
|
|
// { icon: iconComponents.QQLined, url: '/qqcode' }, |
|
|
{ icon: iconComponents.QQLined, url: '/qqcode' }, |
|
|
// { icon: iconComponents.WechatLined, url: '/wechatcode' }, |
|
|
{ icon: iconComponents.WechatLined, url: '/wechatcode' }, |
|
|
// { icon: iconComponents.MusicLined, url: 'https://music.163.com/#/playlist?id=160266689' }, |
|
|
{ icon: iconComponents.MusicLined, url: 'https://music.163.com/#/playlist?id=160266689' }, |
|
|
// { icon: iconComponents.GitHubLined, url: 'https://gitee.com/c_panda' }, |
|
|
{ icon: iconComponents.GitHubLined, url: 'https://gitee.com/c_panda' }, |
|
|
// ]); |
|
|
]); |
|
|
// const handleClick = (url: string) => { |
|
|
const handleClick = (url: string) => { |
|
|
// window.open(url) |
|
|
window.open(url) |
|
|
// } |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
/** |
|
|
* 右侧栏 |
|
|
* 右侧栏 |
|
@ -580,11 +576,11 @@ const labelList = async () => { |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
onMounted(() => { |
|
|
onMounted(() => { |
|
|
classticList() |
|
|
// classticList() |
|
|
blogList() |
|
|
blogList() |
|
|
labelList() |
|
|
labelList() |
|
|
diaryList() |
|
|
diaryList() |
|
|
comLinkList() |
|
|
// comLinkList() |
|
|
statisticList() |
|
|
statisticList() |
|
|
updateCurrentDate(); |
|
|
updateCurrentDate(); |
|
|
homePageList() |
|
|
homePageList() |
|
@ -789,18 +785,6 @@ watch( |
|
|
justify-content: space-between; |
|
|
justify-content: space-between; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.leftBar>:nth-child(2) .button-group { |
|
|
|
|
|
display: flex; |
|
|
|
|
|
flex-wrap: wrap; |
|
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.leftBar>:nth-child(2) .button-group>* { |
|
|
|
|
|
width: 40%; |
|
|
|
|
|
margin: 12px; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.rightBar { |
|
|
.rightBar { |
|
|
width: 15%; |
|
|
width: 15%; |
|
|
} |
|
|
} |
|
@ -809,10 +793,11 @@ watch( |
|
|
margin-bottom: 24px; |
|
|
margin-bottom: 24px; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.rightBar .article-text{ |
|
|
.rightBar .article-text { |
|
|
margin: 12px 0; |
|
|
margin: 12px 0; |
|
|
} |
|
|
} |
|
|
.rightBar .article-text span{ |
|
|
.rightBar .article-text span { |
|
|
margin-right: 12px; |
|
|
margin-right: 12px; |
|
|
font-family: "Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif"; |
|
|
font-family: "Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif"; |
|
|
} |
|
|
} |
|
|
xxxxxxxxxx