RyanGoodwill/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

行业动态模块：为editNews添加了show模式，为NewsList添加了点标题就show详情的功能

Browse Source
This commit is contained in:
高子兴 2024-07-06 02:26:45 +08:00
parent 2fb294878f
commit 7a11813958
2 changed files with 33 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/views/news-management/EditNews.vue
View File

@ -234,6 +234,12 @@ onMounted(() => {
modeTitle.value = '修改资讯';
fetchNewsDetail();
}
else if (props.mode === 'show'){
createMode.value = false;
id.value = props.id;
modeTitle.value = '资讯详情';
fetchNewsDetail();
}
}
else if (route.query.mode === 'create' || route.params.mode === 'create') {
createMode.value = true;
@ -441,7 +447,7 @@ onMounted(() => {
<ElForm :model="form" label-width="120px" @submit.prevent="handleCommit">
<h2>{{ modeTitle }}</h2>
<ElFormItem label="新闻标题" required>
<ElInput v-model="form.title" placeholder="请输入新闻标题" required></ElInput>
<ElInput v-model="form.title" placeholder="请输入新闻标题" :disabled="props.mode === 'show'" required></ElInput>
</ElFormItem>
<ElFormItem label="新闻图片路径" required>
<el-upload
@ -455,6 +461,7 @@ onMounted(() => {
list-type="picture-card"
auto-upload
v-model:file-list="fileList"
:disabled="props.mode === 'show'"
required
>
<template #file="{ file }">
@ -470,6 +477,7 @@ onMounted(() => {
<span
class="el-upload-list__item-delete"
@click="handleRemove(file)"
v-if="props.mode !== 'show'"
>
<el-icon><Delete/></el-icon>
</span>
@ -492,19 +500,19 @@ onMounted(() => {
ref="editorContainerElement">
<div class="editor-container__editor">
<div ref="editorElement">
<ckeditor v-if="isLayoutReady" v-model="form.content" :editor="editor" :config="config"/>
<ckeditor v-if="isLayoutReady" v-model="form.content" :editor="editor" :config="config" :disabled="props.mode === 'show'"/>
</div>
</div>
</div>
</ElFormItem>
<ElFormItem label="作者" required>
<ElInput v-model="form.author" placeholder="请输入作者" required></ElInput>
<ElInput v-model="form.author" placeholder="请输入作者" :disabled="props.mode === 'show'" required></ElInput>
</ElFormItem>
<ElFormItem label="新闻简介" required>
<ElInput v-model="form.summary" placeholder="请输入新闻简介" required></ElInput>
<ElInput v-model="form.summary" placeholder="请输入新闻简介" :disabled="props.mode === 'show'" required></ElInput>
</ElFormItem>
<ElFormItem label="选择租户" required>
<ElSelect v-model="form.tenant" placeholder="请选择" class="dynamic-width-select">
<ElSelect v-model="form.tenant" placeholder="请选择" class="dynamic-width-select" :disabled="props.mode === 'show'">
<ElOption
v-for="option in options"
:key="option"
@ -513,9 +521,9 @@ onMounted(() => {
></ElOption>
</ElSelect>
</ElFormItem>
<ElFormItem>
<ElFormItem v-if="props.mode !== 'show'">
<ElButton type="primary" native-type="submit">确定</ElButton>
<ElButton @click="handleCancel">取消</ElButton>
<ElButton @click="handleCancel">{{ props.mode === 'show' ? '返回' : '取消' }}</ElButton>
</ElFormItem>
</ElForm>
</div>

19
src/views/news-management/NewsList.vue
View File

@ -199,10 +199,16 @@ const openEditNewsDialog = () => {
const setNewsDialogInvisible = (changed) => {
editNewsDialogVisible.value = false;
if (changed){
if (changed) {
refreshNewsList();
}
}
const handleShowDetail = (index) => {
editNewsDialogMode.value = 'show'
editId.value = newsData.value[index].id
openEditNewsDialog()
}
</script>
<template>
@ -239,10 +245,15 @@ const setNewsDialogInvisible = (changed) => {
<el-button type="danger" @click="handleDeleteButton">删除</el-button>
</div>
<el-table :data="newsData" style="width: 100%;"
@selection-change="handleSelectionChange">
<el-table :data="newsData" style="width: 100%;" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column prop="title" label="新闻标题" align="center"></el-table-column>
<el-table-column prop="title" label="新闻标题" align="center">
<template #default="scope">
<div @click="handleShowDetail(scope.$index)" style="cursor: pointer;">
{{ scope.row.title }}
</div>
</template>
</el-table-column>
<el-table-column prop="author" label="作者" align="center"></el-table-column>
<el-table-column prop="summary" label="新闻简介" align="center"></el-table-column>
<el-table-column label="操作" align="center">