wangys/schoolNews
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

web-资源修改

Browse Source
This commit is contained in:
wangys
2025-10-20 15:08:41 +08:00
parent 16824537d1
commit 6f9244eade
6 changed files with 171 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

99
schoolNewsWeb/src/views/admin/manage/resource/ArticleManagementView.vue
View File

@@ -15,7 +15,7 @@
<el-table-column prop="title" label="文章标题" min-width="200" />
<el-table-column prop="category" label="分类" width="120" />
<el-table-column prop="author" label="作者" width="120" />
<el-table-column prop="publishDate" label="发布日期" width="120" />
<el-table-column prop="publishTime" label="发布日期" width="120" />
<el-table-column prop="views" label="阅读量" width="100" />
<el-table-column prop="status" label="状态" width="100">
<template #default="{ row }">
@@ -26,20 +26,34 @@
</el-table-column>
<el-table-column label="操作" width="200" fixed="right">
<template #default="{ row }">
<el-button size="small" @click="viewArticle(row)">查看</el-button>
<el-button size="small" @click="editArticle(row)">编辑</el-button>
<el-button size="small" type="danger" @click="deleteArticle(row)">删除</el-button>
<el-button size="small" type="danger" @click="deleteArticle()">删除</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
v-model:current-page="currentPage"
v-model:page-size="pageSize"
v-model:current-page="pageParam.page"
v-model:page-size="pageParam.size"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
<!-- 文章查看弹窗 -->
<ArticleShowView
v-model="showViewDialog"
:as-dialog="true"
title="文章详情"
width="900px"
:article-data="currentArticle"
:category-list="categoryList"
:show-edit-button="true"
@edit="handleEditFromView"
@close="showViewDialog = false"
/>
</div>
</template>
@@ -47,20 +61,47 @@
import { ref, onMounted } from 'vue';
import { ElButton, ElInput, ElTable, ElTableColumn, ElTag, ElPagination, ElMessage } from 'element-plus';
import { useRouter } from 'vue-router';
import { resourceApi, resourceCategoryApi } from '@/apis/resource'
import type { PageParam, ResourceSearchParams, Resource, ResourceCategory } from '@/types';
import { ArticleShowView } from '@/views/article';
const router = useRouter();
const searchKeyword = ref('');
const currentPage = ref(1);
const pageSize = ref(10);
const total = ref(0);
const articles = ref<any[]>([]);
const pageParam = ref<PageParam>({
page: 1,
size: 10
});
const filter = ref<ResourceSearchParams>({
keyword: searchKeyword.value
});
const total = ref<number>(0);
const articles = ref<Resource[]>([]);
const showViewDialog = ref(false);
const currentArticle = ref<any>(null);
const categoryList = ref<ResourceCategory[]>([]);
onMounted(() => {
loadArticles();
loadCategories();
});
function loadArticles() {
// TODO: 加载文章数据
async function loadCategories() {
try {
const res = await resourceCategoryApi.getCategoryList();
if (res.success && res.dataList) {
categoryList.value = res.dataList;
}
} catch (error) {
console.error('加载分类列表失败:', error);
}
}
async function loadArticles() {
const res = await resourceApi.getResourcePage(pageParam.value, filter.value);
if (res.success) {
articles.value = res.pageDomain?.dataList || [];
total.value = res.pageDomain?.total || 0;
}
}
function showCreateDialog() {
@@ -80,12 +121,40 @@ function handleDataCollection() {
ElMessage.info('数据采集功能开发中');
}
function editArticle(row: any) {
// TODO: 编辑文章
async function viewArticle(row: any) {
try {
const res = await resourceApi.getResourceById(row.resourceID);
if (res.success && res.data) {
// 将 ResourceVO 转换为 ArticleShowView 期望的格式
const resourceVO = res.data;
currentArticle.value = {
...resourceVO.resource,
tags: resourceVO.tags || []
};
showViewDialog.value = true;
} else {
ElMessage.error('获取文章详情失败');
}
} catch (error) {
ElMessage.error('获取文章详情失败');
console.error(error);
}
}
function deleteArticle(row: any) {
function editArticle(row: any) {
router.push('/article/add?id=' + row.resourceID);
}
function handleEditFromView() {
if (currentArticle.value?.resourceID) {
showViewDialog.value = false;
router.push('/article/add?id=' + currentArticle.value.resourceID);
}
}
function deleteArticle() {
// TODO: 删除文章
ElMessage.info('删除功能开发中');
}
function getStatusType(status: string) {
@@ -107,12 +176,12 @@ function getStatusText(status: string) {
}
function handleSizeChange(val: number) {
pageSize.value = val;
pageParam.value.size = val;
loadArticles();
}
function handleCurrentChange(val: number) {
currentPage.value = val;
pageParam.value.page = val;
loadArticles();
}
</script>

84
schoolNewsWeb/src/views/article/ArticleAddView.vue
View File

@@ -8,21 +8,21 @@
<div class="article-form">
<el-form ref="formRef" :model="articleForm" :rules="rules" label-width="100px" label-position="top">
<!-- 标题 -->
<el-form-item label="文章标题" prop="title">
<el-input v-model="articleForm.title" placeholder="请输入文章标题" maxlength="100" show-word-limit />
<el-form-item label="文章标题" prop="resource.title">
<el-input v-model="articleForm.resource.title" placeholder="请输入文章标题" maxlength="100" show-word-limit />
</el-form-item>
<!-- 分类和标签 -->
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="文章分类" prop="categoryID">
<el-select v-model="articleForm.categoryID" placeholder="请选择分类" style="width: 100%" :loading="categoryLoading">
<el-option
v-for="category in categoryList"
:key="category.categoryID || category.id"
:label="category.name"
:value="category.categoryID || category.id || ''"
/>
<el-form-item label="文章分类" prop="resource.categoryID">
<el-select v-model="articleForm.resource.categoryID" placeholder="请选择分类" style="width: 100%" :loading="categoryLoading">
<el-option
v-for="category in categoryList"
:key="category.categoryID || category.id"
:label="category.name"
:value="category.categoryID || category.id || ''"
/>
</el-select>
</el-form-item>
</el-col>
@@ -44,7 +44,7 @@
<el-form-item label="封面图片">
<!-- 上传区域 - 只在没有封面图片时显示 -->
<FileUpload
v-if="!articleForm.coverImage"
v-if="!articleForm.resource.coverImage"
:as-dialog="false"
accept="image/*"
:max-size="2"
@@ -53,15 +53,15 @@
@success="handleCoverUploadSuccess"
/>
<!-- 封面预览 - 只在有封面图片时显示 -->
<div v-if="articleForm.coverImage" class="cover-preview">
<img :src="articleForm.coverImage" class="cover" />
<div v-if="articleForm.resource.coverImage" class="cover-preview">
<img :src="FILE_DOWNLOAD_URL + articleForm.resource.coverImage" class="cover" />
<el-button type="danger" size="small" @click="removeCover">删除封面</el-button>
</div>
</el-form-item>
<!-- 文章内容 -->
<el-form-item label="文章内容" prop="content">
<RichTextComponent ref="editorRef" v-model="articleForm.content" height="500px"
<el-form-item label="文章内容" prop="resource.content">
<RichTextComponent ref="editorRef" v-model="articleForm.resource.content" height="500px"
placeholder="请输入文章内容..." />
</el-form-item>
@@ -69,13 +69,13 @@
<el-form-item label="发布设置">
<el-row :gutter="20">
<el-col :span="8">
<el-checkbox v-model="articleForm.allowComment">允许评论</el-checkbox>
<el-checkbox v-model="articleForm.resource.allowComment">允许评论</el-checkbox>
</el-col>
<el-col :span="8">
<el-checkbox v-model="articleForm.isTop">置顶文章</el-checkbox>
<el-checkbox v-model="articleForm.resource.isTop">置顶文章</el-checkbox>
</el-col>
<el-col :span="8">
<el-checkbox v-model="articleForm.isRecommend">推荐文章</el-checkbox>
<el-checkbox v-model="articleForm.resource.isRecommend">推荐文章</el-checkbox>
</el-col>
</el-row>
</el-form-item>
@@ -104,7 +104,7 @@
:as-dialog="true"
title="文章预览"
width="900px"
:article-data="articleForm"
:article-data="articleForm.resource"
:category-list="categoryList"
:show-edit-button="false"
@close="previewVisible = false"
@@ -132,7 +132,8 @@ import { RichTextComponent } from '@/components/text';
import { FileUpload } from '@/components/file';
import { ArticleShowView } from './index';
import { resourceCategoryApi, resourceTagApi, resourceApi } from '@/apis/resource';
import { Resource, ResourceCategory, Tag } from '@/types/resource';
import { ResourceVO, ResourceCategory, Tag } from '@/types/resource';
import { FILE_DOWNLOAD_URL } from '@/config';
const router = useRouter();
const route = useRoute();
@@ -153,30 +154,23 @@ const categoryLoading = ref(false);
const tagLoading = ref(false);
// 表单数据
const articleForm = ref<Resource>({
title: '',
content: '',
categoryID: '',
author: '',
source: '',
sourceUrl: '',
viewCount: 0,
coverImage: '',
tags: [] as Tag[],
allowComment: true,
isTop: false,
const articleForm = ref<ResourceVO>({
resource: {
},
category: {},
tags: [],
});
// 表单验证规则
const rules = {
title: [
'resource.title': [
{ required: true, message: '请输入文章标题', trigger: 'blur' },
{ min: 5, max: 100, message: '标题长度在 5 到 100 个字符', trigger: 'blur' }
],
categoryID: [
'resource.categoryID': [
{ required: true, message: '请选择文章分类', trigger: 'change' }
],
content: [
'resource.content': [
{ required: true, message: '请输入文章内容', trigger: 'blur' }
]
};
@@ -234,11 +228,13 @@ async function handlePublish() {
// TODO: 调用API发布文章
console.log('发布文章:', articleForm);
await new Promise(resolve => setTimeout(resolve, 1000));
ElMessage.success(isEdit.value ? '修改成功' : '发布成功');
router.push('/admin/manage/resource/articles');
resourceApi.createResource(articleForm.value).then(res => {
if (res.success) {
ElMessage.success('发布成功');
} else {
ElMessage.error(res.message || '发布失败');
}
});
} catch (error) {
console.error('发布失败:', error);
} finally {
@@ -267,8 +263,8 @@ async function handleSaveDraft() {
// 预览
function handlePreview() {
console.log(articleForm.value.content);
if (!articleForm.value.title) {
console.log(articleForm.value.resource.content);
if (!articleForm.value.resource.title) {
ElMessage.warning('请先输入文章标题');
return;
}
@@ -281,14 +277,14 @@ function handleCoverUploadSuccess(files: any[]) {
const file = files[0];
// 使用文件下载URL构建完整路径
import('@/config').then(config => {
articleForm.value.coverImage = config.FILE_DOWNLOAD_URL + file.id;
articleForm.value.resource.coverImage = config.FILE_DOWNLOAD_URL + file.id;
});
}
}
// 删除封面
function removeCover() {
articleForm.value.coverImage = '';
articleForm.value.resource.coverImage = '';
}

8
schoolNewsWeb/src/views/article/ArticleShowView.vue
View File

@@ -30,7 +30,7 @@
<!-- 封面图片 -->
<div v-if="articleData.coverImage" class="article-cover">
<img :src="articleData.coverImage" class="cover-image" />
<img :src="FILE_DOWNLOAD_URL + articleData.coverImage" class="cover-image" />
</div>
<!-- 文章内容 -->
@@ -66,7 +66,7 @@
<!-- 封面图片 -->
<div v-if="articleData.coverImage" class="article-cover">
<img :src="articleData.coverImage" class="cover-image" />
<img :src="FILE_DOWNLOAD_URL + articleData.coverImage" class="cover-image" />
</div>
<!-- 文章内容 -->
@@ -77,6 +77,8 @@
<script setup lang="ts">
import { computed } from 'vue';
import { ElDialog, ElButton } from 'element-plus';
import { FILE_DOWNLOAD_URL } from '@/config';
import { ResourceCategory } from '@/types/resource';
interface ArticleData {
title?: string;
@@ -94,7 +96,7 @@ interface Props {
title?: string; // Dialog 标题
width?: string; // Dialog 宽度
articleData?: ArticleData; // 文章数据
categoryList?: Array<{ id?: string; categoryID?: string; name?: string }>; // 分类列表
categoryList?: Array<ResourceCategory>; // 分类列表
showEditButton?: boolean; // 是否显示编辑按钮
}