Compare commits

...

3 Commits

2 changed files with 56 additions and 18 deletions

View File

@ -1,5 +1,5 @@
<script setup>
import {defineEmits, defineProps, onMounted, ref} from 'vue';
import {onMounted, ref} from 'vue';
import {
ElButton,
ElForm,
@ -87,6 +87,8 @@ const props = defineProps({
const containerStyle = ref('form-container')
const emit = defineEmits(['setNewsDialogInvisible']);
const options = ref([])
const setNewsDialogInvisible = (changed) => {
emit('setNewsDialogInvisible', changed);
};
@ -204,6 +206,18 @@ const fetchNewsDetail = async () => {
fileList.value.push({url: res.data.imagePath});
}
const fetchOptions = async () => {
const params = {
token: token.value,
}
try{
const res = await axios.get('/api/tenant/getTenantOptions',{params});
options.value = res.data.options;
} catch (e) {
await ElMessageBox.alert(e.response.data.message);
}
}
onMounted(() => {
token.value = store.getters['authentication/token'];
form.value.token = token.value;
@ -220,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;
@ -231,6 +251,8 @@ onMounted(() => {
fetchNewsDetail();
}
fetchOptions()
config.value = {
toolbar: {
items: [
@ -425,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
@ -439,6 +461,7 @@ onMounted(() => {
list-type="picture-card"
auto-upload
v-model:file-list="fileList"
:disabled="props.mode === 'show'"
required
>
<template #file="{ file }">
@ -454,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>
@ -476,27 +500,30 @@ 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">
<ElOption label="Option 1" value="option1"></ElOption>
<ElOption label="Option 2" value="option2"></ElOption>
<ElOption label="Option 3" value="option3"></ElOption>
<ElSelect v-model="form.tenant" placeholder="请选择" class="dynamic-width-select" :disabled="props.mode === 'show'">
<ElOption
v-for="option in options"
:key="option"
:label="option"
:value="option"
></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>

View File

@ -168,9 +168,9 @@ const handleSelectionChange = (newSelections) => {
const handleEditInTable = async (index) => {
// router.push({name: 'editNews', query: {mode: 'edit', id: newsData.value[index].id}})
editNewsDialogMode.value = 'edit'
editId.value = newsData.value[index].id
openEditNewsDialog()
editNewsDialogMode.value = 'edit'
editId.value = newsData.value[index].id
openEditNewsDialog()
};
const handleDeleteInTable = async (index) => {
@ -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">