parent
85b451b420
commit
656baa7bb1
@ -0,0 +1,171 @@
|
||||
<!--
|
||||
* @Author: zhangjiabao
|
||||
* @Date: 2024-02-03 00:03:50
|
||||
* @LastEditors: zhangjiabao
|
||||
* @LastEditTime: 2024-02-03 00:54:34
|
||||
* @FilePath: \luoo_manage_fe\src\views\article\articleDetailPage.vue
|
||||
-->
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-card class="box-card" style="overflow:auto">
|
||||
<div slot="header" class="card-header clearfix">
|
||||
<span class="card-header-text">期刊详情</span>
|
||||
</div>
|
||||
<ArticleDetail
|
||||
style="margin-left: -300px"
|
||||
:data="data"
|
||||
:remoteTagList="remoteData.tags"
|
||||
:publisher="remoteData.publisher"
|
||||
></ArticleDetail>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ArticleDetail from "./articleDetail.vue";
|
||||
import articleApi from "@/api/article";
|
||||
import tagApi from "@/api/tag";
|
||||
export default {
|
||||
name: "",
|
||||
components: { ArticleDetail },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
remoteData: { tags: [], publisher: [] },
|
||||
data: {
|
||||
id: null,
|
||||
title: null,
|
||||
tag: [],
|
||||
journalNo: null,
|
||||
userId: null,
|
||||
image: null,
|
||||
songs: [],
|
||||
size: 0,
|
||||
content: "",
|
||||
duration: 0
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {
|
||||
this.fetchDetail(this.$route.query.id);
|
||||
this.fetchSuperFilterTags();
|
||||
this.fetchCreaterList();
|
||||
},
|
||||
mounted() {},
|
||||
methods: {
|
||||
fetchDetail(id) {
|
||||
articleApi.getDetail(id).then(res => {
|
||||
if (res.code === 200) {
|
||||
this.data = JSON.parse(JSON.stringify(res.data));
|
||||
this.type = 1;
|
||||
this.contentShow = true;
|
||||
} else {
|
||||
this.type = 0;
|
||||
this.$message.error(res.message);
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 创建人下拉框
|
||||
*/
|
||||
fetchCreaterList() {
|
||||
tagApi.createrList().then(res => {
|
||||
if (res.code === 200) {
|
||||
this.remoteData.publisher = res.data;
|
||||
} else {
|
||||
this.remoteData.publisher = [];
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 高级筛选tag
|
||||
*/
|
||||
fetchSuperFilterTags() {
|
||||
tagApi.queryHierarchical().then(res => {
|
||||
let newList = [];
|
||||
for (let index in res.data) {
|
||||
let item = res.data[index];
|
||||
let newItem = { value: item.id, label: item.nameCh, children: [] };
|
||||
for (let childrenIndex in item.children) {
|
||||
let childrenItem = item.children[childrenIndex];
|
||||
newItem.children.push({
|
||||
value: childrenItem.id,
|
||||
label: childrenItem.nameCh
|
||||
});
|
||||
}
|
||||
newList.push(newItem);
|
||||
}
|
||||
this.remoteData.tags = newList;
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.pagination-right {
|
||||
text-align: right;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.box-card {
|
||||
min-height: 300px;
|
||||
height: calc(100vh - 140px);
|
||||
border-radius: 10px;
|
||||
.el-card__header {
|
||||
background-color: rgba(249, 249, 249, 1);
|
||||
}
|
||||
}
|
||||
/deep/ .el-dialog {
|
||||
border-radius: 5px;
|
||||
}
|
||||
.popup-dialog {
|
||||
.el-dialog__header {
|
||||
border-top-left-radius: 5px;
|
||||
border-top-right-radius: 5px;
|
||||
height: 50px;
|
||||
background-color: #f5f5f5f5;
|
||||
}
|
||||
.el-dialog__title {
|
||||
font-size: 15px;
|
||||
font-weight: bolder;
|
||||
}
|
||||
.el-dialog__footer {
|
||||
border-top: solid;
|
||||
border-top-width: thin;
|
||||
border-top-color: rgb(233, 233, 233);
|
||||
padding: 10px 20px 10px;
|
||||
}
|
||||
}
|
||||
.in-card-form {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
}
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
display: table;
|
||||
content: "";
|
||||
}
|
||||
.clearfix:after {
|
||||
clear: both;
|
||||
}
|
||||
.card-header {
|
||||
height: 23px;
|
||||
}
|
||||
.app-container {
|
||||
font-family: "Microsoft YaHei Bold", "Microsoft YaHei Regular",
|
||||
"Microsoft YaHei", sans-serif;
|
||||
}
|
||||
.card-header-text {
|
||||
font-family: "Microsoft YaHei Bold", "Microsoft YaHei Regular",
|
||||
"Microsoft YaHei", sans-serif;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-size: 16px;
|
||||
text-align: left;
|
||||
line-height: 20px;
|
||||
letter-spacing: normal;
|
||||
color: #333333;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in new issue