文章管理部分对接
This commit is contained in:
parent
f177373e0e
commit
728b94b5ee
@ -8,20 +8,34 @@ export function add(data) {
|
||||
})
|
||||
}
|
||||
|
||||
export function del(ids) {
|
||||
export function del(id) {
|
||||
return request({
|
||||
url: 'api/article',
|
||||
url: `aerocraftAdminApi/cpArticle/${id}`,
|
||||
method: 'delete',
|
||||
data: ids
|
||||
})
|
||||
}
|
||||
|
||||
export function edit(data) {
|
||||
return request({
|
||||
url: 'api/article',
|
||||
url: 'aerocraftAdminApi/cpArticle',
|
||||
method: 'put',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
export default { add, edit, del }
|
||||
export function single(id) {
|
||||
return request({
|
||||
url: `aerocraftAdminApi/cpArticle/${id}`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
export function text(id) {
|
||||
return request({
|
||||
url: `aerocraftAdminApi/cpText/${id}`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
export default { add, edit, del, single, text }
|
||||
|
@ -1,9 +1,10 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
export function tree(moduleId) {
|
||||
export function list(moduleId) {
|
||||
return request({
|
||||
url: `aerocraftAdminApi/cpLabel/tree/${moduleId}`,
|
||||
url: `aerocraftAdminApi/cpLabel/all`,
|
||||
method: 'get',
|
||||
parems: { moduleId }
|
||||
})
|
||||
}
|
||||
|
||||
@ -30,4 +31,4 @@ export function edit(data) {
|
||||
})
|
||||
}
|
||||
|
||||
export default { tree, add, edit, del }
|
||||
export default { list, add, edit, del }
|
||||
|
@ -7,7 +7,7 @@
|
||||
:default-config="toolbarConfig"
|
||||
:mode="editMode"
|
||||
/>
|
||||
<div v-else class="replace">
|
||||
<div v-else-if="disableShowFullscreen" class="replace">
|
||||
<i class="full el-icon-full-screen" @click="openCurrenFullscreen" />
|
||||
</div>
|
||||
<Editor
|
||||
|
@ -53,13 +53,6 @@ router.beforeEach((to, from, next) => {
|
||||
|
||||
export const loadMenus = (next, to) => {
|
||||
buildMenus().then(res => {
|
||||
// res[0].children.push({
|
||||
// component: 'system/area/index',
|
||||
// hidden: false,
|
||||
// name: 'Area',
|
||||
// path: 'area',
|
||||
// meta: { title: '区域管理', icon: 'tree-table', noCache: true }
|
||||
// })
|
||||
const sdata = JSON.parse(JSON.stringify(res))
|
||||
const rdata = JSON.parse(JSON.stringify(res))
|
||||
const sidebarRoutes = filterAsyncRouter(sdata)
|
||||
|
@ -79,6 +79,11 @@ export const constantRouterMap = [
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '/article/content',
|
||||
component: (resolve) => require(['@/views/platform/article/content'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
]
|
||||
|
||||
export default new Router({
|
||||
|
@ -86,6 +86,7 @@ import { all } from '@/api/platform/module'
|
||||
import { tree } from '@/api/platform/label'
|
||||
import { upload } from '@/utils/upload'
|
||||
import { mapGetters } from 'vuex'
|
||||
import { single } from '@/api/platform/article'
|
||||
export default {
|
||||
name: 'ArticleAdd',
|
||||
name: 'ArticleEdit',
|
||||
@ -134,7 +135,6 @@ export default {
|
||||
text: { required: true, trigger: 'blur', validator: validText },
|
||||
fileArray: { required: true, message: '请上传封面图', trigger: 'change' },
|
||||
},
|
||||
coverFile: {},
|
||||
coverHide: false,
|
||||
dialogImageUrl: '',
|
||||
dialogVisible: false,
|
||||
@ -149,8 +149,8 @@ export default {
|
||||
])
|
||||
},
|
||||
created(){
|
||||
const { moduleName, labelName, id } = this.$route.query;
|
||||
if(moduleName && labelName && !this.isAdd) {
|
||||
const { id } = this.$route.query;
|
||||
if(id && !this.isAdd) {
|
||||
this.getArticleDetailById(id);
|
||||
}
|
||||
this.getModules();
|
||||
@ -159,18 +159,33 @@ export default {
|
||||
// 封面图片更改
|
||||
handleUploadChange(uploadFile, uploadFiles) {
|
||||
if(uploadFile.raw.type.includes('image')){
|
||||
const file = uploadFile.raw;
|
||||
this.coverFile = file;
|
||||
try {
|
||||
this.loading = true;
|
||||
upload(this.imagesUploadApi, uploadFile.raw).then(res => {
|
||||
if(res.status === 200){
|
||||
const data = res.data;
|
||||
const url = '/file/图片/' + data.newFileName;
|
||||
this.form.photo = url;
|
||||
this.form.fileArray = [this.baseApi+url];
|
||||
this.coverHide = true;
|
||||
this.form.fileArray = uploadFiles;
|
||||
}else{
|
||||
this.$message.error('图片上传失败!');
|
||||
return;
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
this.$message.error('图片上传失败!');
|
||||
}finally{
|
||||
this.loading = false;
|
||||
}
|
||||
}else{
|
||||
this.$message.error('请上传图片文件!');
|
||||
uploadFiles.pop();
|
||||
this.$refs['uploadRef'].clearFiles();
|
||||
}
|
||||
},
|
||||
// 封面删除
|
||||
handleRemove(file) {
|
||||
this.coverFile = {};
|
||||
this.form.fileArray = [];
|
||||
this.$refs['uploadRef'].clearFiles();
|
||||
this.coverHide = false;
|
||||
@ -201,37 +216,24 @@ export default {
|
||||
this.form.cplabelId = val ? event.currentTarget.dataset.op : '';
|
||||
},
|
||||
// 获取文章详情-根据id
|
||||
async getArticleDetailById(id){
|
||||
getArticleDetailById(id){
|
||||
try {
|
||||
this.loading = true;
|
||||
// let res = await artApi.getArticleDetail(id);
|
||||
// if(res?.success) {
|
||||
// state.data = res.data;
|
||||
// // 下面这里处理一下,因为后端返回的是0和1,而前端需要的是true和false,到时候提交的时候再转换回来
|
||||
// state.data.top = state.data.top === 1;
|
||||
// state.data.moduleName = moduleName;
|
||||
// state.data.labelName = labelName;
|
||||
// state.data.textid = state.data.id;
|
||||
// if(state.data.photo){
|
||||
// const never = [{name:state.data.title,url:viteUrl+state.data.photo}];
|
||||
// state.fileArray = never;
|
||||
// state.coverHide = true;
|
||||
// }
|
||||
// }
|
||||
const { moduleName, labelName } = this.$route.query;
|
||||
this.form = {
|
||||
moduleName: moduleName,
|
||||
labelName: labelName,
|
||||
title: '测试标题',
|
||||
articleType: 0,
|
||||
photo: 'https://huyun120.cn/fd/health/img/%E7%BB%84%20319@2x.f0767b46.png',
|
||||
text: '测试内容',
|
||||
top: false,
|
||||
fileArray:[{name:'测试标题',url:'https://huyun120.cn/fd/health/img/%E7%BB%84%20319@2x.f0767b46.png'}]
|
||||
};
|
||||
single(id).then(res => {
|
||||
if(res){
|
||||
res.top = res.top ? true : false;
|
||||
this.form = res;
|
||||
if(res.photo) {
|
||||
this.coverHide = true;
|
||||
this.form.photo = res.photo;
|
||||
this.form.fileArray = [{url: this.baseApi+this.form.photo}]
|
||||
}
|
||||
}else{
|
||||
this.$message.error('文章获取失败!');
|
||||
}
|
||||
})
|
||||
} catch (error) {
|
||||
this.$message.error('获取文章详情失败');
|
||||
this.$message.error('文章获取失败!');
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
@ -244,30 +246,24 @@ export default {
|
||||
// 保存
|
||||
onSubmitForm(){
|
||||
console.log(this.form);
|
||||
try {
|
||||
this.$refs['articleFormRef'].validate(async(valid) => {
|
||||
if (valid) {
|
||||
const articleForm = {...this.form};
|
||||
articleForm.top = articleForm.top ? 1 : 0;
|
||||
upload(this.imagesUploadApi, articleForm.fileArray[0].raw).then(res => {
|
||||
if(res.status === 200){
|
||||
const data = res.data;
|
||||
const url = this.baseApi+'/file/图片/' + data.newFileName;
|
||||
articleForm.photo = url;
|
||||
delete articleForm.fileArray;
|
||||
const ft = this.isAdd? add : edit;
|
||||
ft(articleForm).then(res => {
|
||||
this.$message.success(`文章${this.isAdd?'添加':'编辑'}成功!`);
|
||||
this.cancel();
|
||||
})
|
||||
}else{
|
||||
this.$message.error('新增文章失败');
|
||||
return;
|
||||
}
|
||||
});
|
||||
}else{
|
||||
this.$message.error('请完善信息!');
|
||||
}
|
||||
})
|
||||
} catch (error) {
|
||||
this.$message.error('处理失败!');
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
|
37
src/views/platform/article/content.vue
Normal file
37
src/views/platform/article/content.vue
Normal file
@ -0,0 +1,37 @@
|
||||
<template>
|
||||
<div class="article-content">
|
||||
<wang-editor v-loading="loading" v-model="text" disable style="width: 100%;overflow-y: hidden;"
|
||||
:disableShowFullscreen="false" ref="editor" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import WangEditor from '@/components/WangEditor/index'
|
||||
import { text } from '@/api/platform/article'
|
||||
export default {
|
||||
name: 'ArticleContent',
|
||||
components: {WangEditor},
|
||||
data() {
|
||||
return {
|
||||
text: '暂无文章内容',
|
||||
loading: false
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
const { id } = this.$route.query;
|
||||
if(id) this.getArticleContentById(id);
|
||||
},
|
||||
methods:{
|
||||
async getArticleContentById(id){
|
||||
var texts = '暂无文章内容';
|
||||
await text(id).then(res => {
|
||||
if(res){
|
||||
texts = res.text;
|
||||
}else{
|
||||
this.$message.error('文章内容获取失败!');
|
||||
}
|
||||
})
|
||||
this.text = texts;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
@ -7,9 +7,9 @@
|
||||
<el-form-item label="封面:">
|
||||
<el-image
|
||||
style="width: 130px;height: 130px;border-radius: 4px;"
|
||||
:src="data.photo"
|
||||
:src="baseApi+data.photo"
|
||||
:zoom-rate="1.2"
|
||||
:preview-src-list="[data.photo]"
|
||||
:preview-src-list="[baseApi+data.photo]"
|
||||
fit="cover"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@ -29,7 +29,7 @@
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
||||
<el-form-item label="文章类型:" prop="articletype">
|
||||
<el-form-item label="文章类型:" prop="articleType">
|
||||
图文
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@ -41,12 +41,12 @@
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
||||
<el-form-item label="浏览数:">
|
||||
{{ data.view }}
|
||||
{{ data.view || 0 }}
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="4" class="mb20">
|
||||
<el-form-item label="创建日期:">
|
||||
{{ data.createtime }}
|
||||
{{ data.createTime }}
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -67,6 +67,8 @@
|
||||
</template>
|
||||
<script>
|
||||
import WangEditor from '@/components/WangEditor/index'
|
||||
import { single } from '@/api/platform/article'
|
||||
import { mapGetters } from 'vuex'
|
||||
export default {
|
||||
name: 'ArticleDetail',
|
||||
components: {
|
||||
@ -77,24 +79,27 @@ export default {
|
||||
data: {
|
||||
labelName: '',
|
||||
moduleName: '',
|
||||
title: '测试',
|
||||
articletype: 0,
|
||||
createtime: '2025-01-23',
|
||||
photo: 'https://huyun120.cn/fd/health/img/%E7%BB%84%20319@2x.f0767b46.png',
|
||||
text: '测试',
|
||||
top: 1,
|
||||
view: 17,
|
||||
title: '',
|
||||
articleType: '',
|
||||
createTime: '',
|
||||
photo: '',
|
||||
text: '',
|
||||
top: '',
|
||||
view: '',
|
||||
},
|
||||
loading: false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'baseApi'
|
||||
])
|
||||
},
|
||||
created(){
|
||||
const { moduleName, labelName, id } = this.$route.query;
|
||||
// if(moduleName && labelName && this.$route.path == '/platform/article/edit') {
|
||||
// this.getArticleDetailById(id);
|
||||
// }
|
||||
this.data.moduleName = moduleName;
|
||||
this.data.labelName = labelName;
|
||||
const { id } = this.$route.query;
|
||||
if(id) {
|
||||
this.getArticleDetailById(id);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 返回
|
||||
@ -102,6 +107,23 @@ export default {
|
||||
this.$store.dispatch('tagsView/delView', this.$route);
|
||||
this.$router.push('/platform/article');
|
||||
},
|
||||
// 获取文章详情
|
||||
getArticleDetailById(id){
|
||||
try {
|
||||
this.loading = true;
|
||||
single(id).then(res => {
|
||||
if(res){
|
||||
this.data = res;
|
||||
}else{
|
||||
this.$message.error('文章获取失败!');
|
||||
}
|
||||
})
|
||||
} catch (error) {
|
||||
this.$message.error('文章获取失败!');
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
@ -25,7 +25,8 @@
|
||||
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;">
|
||||
<el-table-column type="index" align="center" width="55" label="序号" />
|
||||
<el-table-column :show-overflow-tooltip="true" prop="title" label="标题" align="center" />
|
||||
<el-table-column :show-overflow-tooltip="true" prop="articletype" label="文章类型" align="center" />
|
||||
<el-table-column :show-overflow-tooltip="true" prop="articleType" label="文章类型" align="center"
|
||||
:formatter="(row) => { let dot = dict.article_type.find(item => Number(item.value) === row.articleType); return dot?dot.label:''}" />
|
||||
<el-table-column :show-overflow-tooltip="true" prop="top" label="置顶" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-tag v-if="scope.row.top===1" type="success">是</el-tag>
|
||||
@ -59,12 +60,19 @@ import CRUD, { presenter, header, form, crud } from '@crud/crud'
|
||||
import rrOperation from '@crud/RR.operation'
|
||||
import pagination from '@crud/Pagination'
|
||||
import { all } from '@/api/platform/module'
|
||||
import { tree } from '@/api/platform/label'
|
||||
import { list } from '@/api/platform/label'
|
||||
export default {
|
||||
name: 'Article',
|
||||
components: { rrOperation, pagination },
|
||||
// 数据字典
|
||||
dicts: ['article_type'],
|
||||
cruds() {
|
||||
return CRUD({ title: '文章', url: '/aerocraftAdminApi/cpArticle', crudMethod: { ...crudArticle }, optShow: { reset: true }})
|
||||
return CRUD({ title: '文章', url: '/aerocraftAdminApi/cpArticle', crudMethod: { ...crudArticle }, optShow: { reset: true },
|
||||
// 查询获取data后操作
|
||||
initData:(crud,data)=>{
|
||||
crud.page.total = data.total
|
||||
crud.data = data.records
|
||||
}})
|
||||
},
|
||||
mixins: [presenter(), header(), crud()],
|
||||
data() {
|
||||
@ -86,7 +94,7 @@ export default {
|
||||
copyLink(row){
|
||||
if(row.id == null||row.id == ''){ this.$message.warning('链接为空');return;}
|
||||
var aux = document.createElement("input");
|
||||
aux.setAttribute("value", `${process.env.VUE_APP_BASE_PATH}/#article/content?id=${row.id}`);
|
||||
aux.setAttribute("value", `${process.env.VUE_APP_BASE_PATH}/#/article/content?id=${row.id}`);
|
||||
document.body.appendChild(aux);
|
||||
aux.select();
|
||||
document.execCommand("copy");
|
||||
@ -103,7 +111,7 @@ export default {
|
||||
// 根据模块id查询标签
|
||||
getLabels(){
|
||||
if(this.query.moduleId){
|
||||
tree(this.query.moduleId).then(res => {
|
||||
list(this.query.moduleId).then(res => {
|
||||
this.labels = res;
|
||||
});
|
||||
}else{
|
||||
@ -113,11 +121,11 @@ export default {
|
||||
},
|
||||
// 文章详情
|
||||
toShowDetail(row) {
|
||||
this.$router.push({ path: '/platform/article/detail' , query: { id:row.id, moduleName: row.moduleName, labelName: row.labelName } });
|
||||
this.$router.push({ path: '/platform/article/detail' , query: { id:row.id } });
|
||||
},
|
||||
// 预览
|
||||
toPreview(row) {
|
||||
window.open(`${process.env.VUE_APP_BASE_PATH}/#article/content?id=${row.id}`);
|
||||
window.open(`${process.env.VUE_APP_BASE_PATH}/#/article/content?id=${row.id}`);
|
||||
},
|
||||
// 添加文章
|
||||
toAddArticle() {
|
||||
@ -125,7 +133,7 @@ export default {
|
||||
},
|
||||
// 添加文章
|
||||
toEditArticle(row) {
|
||||
this.$router.push({ path: '/platform/article/edit', query: { id:row.id, moduleName: row.moduleName, labelName: row.labelName } });
|
||||
this.$router.push({ path: '/platform/article/edit', query: { id:row.id } });
|
||||
},
|
||||
// 文章删除
|
||||
deleteArticle(id) {
|
||||
@ -136,16 +144,16 @@ export default {
|
||||
})
|
||||
.then(async() => {
|
||||
try {
|
||||
// state.tableData.loading = true;
|
||||
// let res = await artApi.deleteArticle(id);
|
||||
// if(res?.success){
|
||||
// await getTableData();
|
||||
this.$message.success('文章删除成功!');
|
||||
// } else ElMessage.error('文章删除失败!');
|
||||
this.crud.loading = true;
|
||||
crudArticle.del(id).then(res => {
|
||||
const isSuccess = res.code === 200;
|
||||
this.$message[isSuccess?'success':'error'](`文章删除${isSuccess?'成功':'失败'}!`);
|
||||
isSuccess?this.crud.refresh():'';
|
||||
});
|
||||
} catch(e) {
|
||||
this.$message.error('处理失败!');
|
||||
} finally {
|
||||
// state.tableData.loading = false;
|
||||
this.crud.loading = false;
|
||||
}
|
||||
})
|
||||
},
|
||||
|
Loading…
Reference in New Issue
Block a user