feat: 添加页脚组件并更新多个功能
- 新增Footer组件显示版权信息和备案号 - 替换favicon为blogicon.jpg - 更新API基础URL为生产环境 - 重命名nonsenseService方法为createNonsense - 在文章编辑页添加返回列表按钮 - 优化分类和标签创建后的页面跳转逻辑 - 移除home.vue中不必要的height样式
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
<html lang="">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="icon" href="/favicon.ico">
|
||||
<link rel="icon" href="/blogicon.jpg">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>清疯不颠</title>
|
||||
</head>
|
||||
|
||||
BIN
public/blogicon.jpg
Normal file
BIN
public/blogicon.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB |
@@ -72,6 +72,8 @@
|
||||
|
||||
<!-- 分页区域 -->
|
||||
<Establish class="establish-container" v-if="Login" />
|
||||
<!-- 页脚 -->
|
||||
<Footer class="footer-container" v-if="windowwidth" />
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
@@ -79,6 +81,7 @@ import { ref, onMounted, onUnmounted, watch, computed } from 'vue';
|
||||
import { useRouter, useRoute } from 'vue-router';
|
||||
import LeftModule from '@/components/LeftModule.vue';
|
||||
import Establish from '@/layouts/establish.vue';
|
||||
import Footer from '@/views/Footer.vue';
|
||||
|
||||
// ========== 组件初始化 ==========
|
||||
|
||||
@@ -511,7 +514,9 @@ watch(
|
||||
.close-btn:hover {
|
||||
color: #409eff;
|
||||
}
|
||||
|
||||
.footer-container {
|
||||
margin-top: 20px;
|
||||
}
|
||||
/* 防止搜索框在小屏幕上重叠 */
|
||||
@media screen and (max-width: 1200px) {
|
||||
.search-box-container.open {
|
||||
|
||||
@@ -287,12 +287,15 @@ const saveNonsense = (content) => {
|
||||
}
|
||||
|
||||
// 调用服务保存疯言疯语
|
||||
nonsenseService.saveNonsense({
|
||||
nonsenseService.createNonsense({
|
||||
content: content.trim(),
|
||||
time: new Date()
|
||||
time: new Date(),
|
||||
status: 1
|
||||
}).then(response => {
|
||||
if (response.code === 200) {
|
||||
ElMessage.success('疯言疯语发布成功')
|
||||
// 刷新页面
|
||||
router.push({ path: `/nonsense`});
|
||||
} else {
|
||||
ElMessage.error(response.message || '发布失败')
|
||||
}
|
||||
@@ -332,14 +335,14 @@ const createCategory = () => {
|
||||
* @param {string} typename - 分类名称
|
||||
*/
|
||||
const saveCategory = (typename) => {
|
||||
categoryService.saveCategory({
|
||||
console.log('保存分类')
|
||||
categoryService.createCategory({
|
||||
typename: typename
|
||||
}).then(response => {
|
||||
if (response.code === 200) {
|
||||
ElMessage.success('分类创建成功');
|
||||
// 刷新页面以显示新分类
|
||||
const timestamp = new Date().getTime();
|
||||
router.push({ path: `/home/aericlelist`, query: { t: timestamp } });
|
||||
// 刷新页面
|
||||
router.push({ path: `/aericlelist`});
|
||||
} else {
|
||||
ElMessage.error(response.message || '创建分类失败');
|
||||
}
|
||||
@@ -383,8 +386,8 @@ const saveAttribute = (dto) => {
|
||||
if (response.code === 200) {
|
||||
closeAttributeModal()
|
||||
ElMessage.success('标签创建成功');
|
||||
// 刷新页面以显示新标签
|
||||
router.push({ path: `/home/aericlelist`});
|
||||
// 刷新页面
|
||||
router.push({ path: `/aericlelist`});
|
||||
} else {
|
||||
ElMessage.error(response.message || '创建标签失败');
|
||||
}
|
||||
|
||||
@@ -4,7 +4,7 @@ import { ElMessage } from 'element-plus'
|
||||
|
||||
// 创建axios实例
|
||||
const api = axios.create({
|
||||
baseURL:'http://localhost:8080/api', // API基础URL
|
||||
baseURL: 'http://qf1121.top/api', // API基础URL
|
||||
timeout: 10000, // 请求超时时间
|
||||
withCredentials: true // 允许跨域请求携带凭证(如cookies)
|
||||
})
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
// 留言相关API服务
|
||||
// 疯言疯语相关API服务
|
||||
import apiService from './apiService'
|
||||
|
||||
class NonsenseService {
|
||||
@@ -22,7 +22,7 @@ class NonsenseService {
|
||||
* @param {import('../types').Nonsense} nonsense - 疯言疯语内容对象
|
||||
* @returns {Promise<import('../types').ApiResponse<import('../types').Nonsense>>}
|
||||
*/
|
||||
saveNonsense(nonsense){
|
||||
createNonsense(nonsense){
|
||||
return apiService.post('/nonsense', nonsense)
|
||||
}
|
||||
/**
|
||||
|
||||
30
src/views/Footer.vue
Normal file
30
src/views/Footer.vue
Normal file
@@ -0,0 +1,30 @@
|
||||
<!-- 页脚 -->
|
||||
<template>
|
||||
|
||||
<div class="footer">
|
||||
<div class="footer-content">
|
||||
<p>© 2023 我的网站. 所有权利保留.</p>
|
||||
<p>联系我们:<a href="mailto:xxxx@exxxx.com">xxxx@exxxx.com</a></p>
|
||||
<!-- 备案 -->
|
||||
<p>
|
||||
备案号:<a href="https://beian.miit.gov.cn/" target="_blank">
|
||||
皖ICP备2025105428号-1
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.footer {
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
.footer-content {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
background-color: #f5f5f5;
|
||||
border-radius: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -44,7 +44,9 @@
|
||||
<!-- 编辑区域 -->
|
||||
<MdEditor v-model="Articleform.markdownscontent" class="markdown-editor" @on-save="handleSave" noImgZoomIn
|
||||
noKatex />
|
||||
<!-- 预览 -->
|
||||
<!-- 返回列表 -->
|
||||
<el-button type="primary" @click="handleReturn">返回列表</el-button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -253,6 +255,18 @@ const handleSave = (markdown) => {
|
||||
}
|
||||
})
|
||||
};
|
||||
|
||||
/**
|
||||
* 返回列表页
|
||||
*/
|
||||
const handleReturn = () => {
|
||||
// 确定是否返回列表页
|
||||
if (window.confirm('确定要返回列表页吗?所有未保存的更改将丢失。')) {
|
||||
// 清除全局存储中的article
|
||||
globalStore.removeValue('updatearticle');
|
||||
router.push('/home');
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
@@ -360,7 +360,6 @@ watch(
|
||||
.article-list-content {
|
||||
position: relative;
|
||||
padding: 0 0 30px 0;
|
||||
height: 100%;
|
||||
}
|
||||
.pagination-container {
|
||||
position: absolute;
|
||||
|
||||
Reference in New Issue
Block a user