<template>
|
<div class="contentBox">
|
<div class="crumbs">
|
<el-breadcrumb separator-class="el-icon-arrow-right">
|
<div v-if="this.$route.query.type == 'aboutUs'">
|
<el-breadcrumb-item
|
:to="{
|
name: 'aboutUs-index',
|
}"
|
>关于我们</el-breadcrumb-item
|
>
|
<el-breadcrumb-item
|
:to="{
|
name: 'aboutUs-index',
|
query: { aboutUs: 3 },
|
}"
|
>大事记</el-breadcrumb-item
|
>
|
<el-breadcrumb-item>{{ data.name }}</el-breadcrumb-item>
|
</div>
|
<div v-else>
|
<el-breadcrumb-item :to="{ name: 'informationCenter-index' }"
|
>本社资讯</el-breadcrumb-item
|
>
|
<el-breadcrumb-item
|
:to="{
|
name: 'informationCenter-index',
|
query: { tabsSelected: this.$route.query.tabsSelected },
|
}"
|
>{{
|
this.$route.query.tabsSelected == 0 ? "本社资讯" : "本社通知"
|
}}</el-breadcrumb-item
|
>
|
</div>
|
</el-breadcrumb>
|
</div>
|
<div class="bgcfff" v-loading="reLoading">
|
<el-empty
|
description="暂无数据"
|
class="empty"
|
:image-size="200"
|
v-if="data.length == 0"
|
></el-empty>
|
<div v-else>
|
<div :title="data.name" class="tabs">
|
<div>
|
{{ data.name }}
|
</div>
|
</div>
|
<div class="borderButtom"></div>
|
<div class="wrap">
|
<div class="author">
|
<span v-if="data.caupress_publishDate">{{
|
moment(data.caupress_publishDate).format("YYYY-MM-DD")
|
}}</span>
|
<span v-if="data.caupress_author"
|
>作者：{{ data.caupress_author }}</span
|
>
|
</div>
|
<div class="richTextBox" v-html="data.caupress_content"></div>
|
<div class="attaText" v-if="fileList.length > 0">附件：</div>
|
<div class="attachment" v-if="fileList.length > 0">
|
<div
|
class="itemBox"
|
v-for="(item, index) in fileList"
|
:key="index"
|
@click="download(item)"
|
>
|
<div class="fileName">{{ item.FileList[0].FileName }}</div>
|
<i class="el-icon-download"></i>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
export default {
|
name: "home",
|
data() {
|
return {
|
data: [],
|
reLoading: true,
|
fileList: [],
|
};
|
},
|
created() {
|
scrollTo(0, 0);
|
this.getData();
|
},
|
methods: {
|
getData() {
|
this.reLoading = true;
|
|
let query = {
|
path: this.$route.query.path,
|
fields: {
|
caupress_publishDate: [],
|
caupress_author: [],
|
caupress_content: [],
|
},
|
filterList: {
|
caupress_file: [],
|
},
|
itemId: this.$route.query.id,
|
};
|
|
this.MG.resource.getItem(query).then((res) => {
|
this.data = res.datas[0];
|
console.log(JSON.parse(this.data.datas.caupress_file));
|
if (this.data.datas.caupress_file) {
|
this.fileList = JSON.parse(this.data.datas.caupress_file);
|
}
|
this.reLoading = false;
|
});
|
},
|
download(item) {
|
let url =
|
this.config.requestCtx + "/file/api/ApiDownload?md5=" + item.Value;
|
window.open(url, "_blank");
|
},
|
},
|
};
|
</script>
|
|
<style lang="less" scoped>
|
.attaText {
|
margin-top: 50px;
|
}
|
.attachment {
|
display: flex;
|
align-items: center;
|
margin-top: 10px;
|
flex-flow: wrap;
|
.itemBox {
|
margin-left: 20px;
|
margin-top: 20px;
|
border: 2px solid #d8d8d8;
|
padding: 10px;
|
border-radius: 10px;
|
display: flex;
|
cursor: pointer;
|
.fileName {
|
width: 200px;
|
white-space: nowrap;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
}
|
}
|
}
|
.contentBox {
|
padding-bottom: 120px;
|
.crumbs {
|
padding: 35px 0;
|
line-height: 70px;
|
}
|
.bgcfff {
|
background-color: #fff;
|
.tabs {
|
font-size: 30px;
|
padding-top: 50px;
|
padding-bottom: 30px;
|
line-height: 50px;
|
padding-left: 20px;
|
padding-right: 20px;
|
align-items: center;
|
font-weight: 700;
|
color: #999999;
|
border-bottom: 2px solid #e6e6e6;
|
text-align: center;
|
color: #333333;
|
}
|
.borderButtom {
|
width: 300px;
|
margin: 0 auto;
|
margin-top: -2px;
|
border-bottom: 2px solid #00873c;
|
}
|
.wrap {
|
min-height: 300px;
|
padding: 0 20px 20px 20px;
|
.author {
|
text-align: right;
|
line-height: 60px;
|
color: #999999;
|
font-size: 18px;
|
letter-spacing: 0.45px;
|
span {
|
margin-left: 40px;
|
}
|
}
|
}
|
}
|
}
|
</style>
|
