You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
102 lines
2.2 KiB
102 lines
2.2 KiB
<template>
|
|
<div>
|
|
<el-drawer
|
|
size="44%"
|
|
title="详情"
|
|
:visible.sync="visible"
|
|
direction="rtl">
|
|
<el-descriptions :column="2" border direction="vertical" style="margin: 20px;">
|
|
<el-descriptions-item v-for="(value,key) in showRow" :label="value">
|
|
<template v-if="descriptionItem(key)">
|
|
<template v-if="isHTML(descriptionItem(key))">
|
|
<div v-html="descriptionItem(key)"></div>
|
|
</template>
|
|
<template v-else>
|
|
<div>{{ descriptionItem(key) }}</div>
|
|
</template>
|
|
</template>
|
|
<template v-else>
|
|
<div v-for="(i) in row[key]">
|
|
<a :download="i.url" :href="i.url" target="_blank">{{ i.original_name }}</a>
|
|
</div>
|
|
</template>
|
|
</el-descriptions-item>
|
|
</el-descriptions>
|
|
</el-drawer>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
type: 1,//1通知2制度文档
|
|
visible: false,
|
|
row: {},
|
|
|
|
t1: {
|
|
name: '名称',
|
|
shijian: '时间',
|
|
neirong: '内容',
|
|
},
|
|
t2: {
|
|
name: '名称',
|
|
created_at: '发布时间',
|
|
'system_catalogue_id_system_catalogues_id_relation.name': '目录',
|
|
'id_system_file_files_system_id_relation': '附件'
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
show () {
|
|
this.visible = true;
|
|
},
|
|
hide () {
|
|
this.visible = false;
|
|
},
|
|
setRow (row) {
|
|
this.row = row;
|
|
},
|
|
setType (type) {
|
|
this.type = type
|
|
},
|
|
|
|
isHTML (str) {
|
|
const htmlRegex = /<([A-Za-z][A-Za-z0-9]*)\b[^>]*>(.*?)<\/\1>/;
|
|
return htmlRegex.test(str);
|
|
}
|
|
},
|
|
computed: {
|
|
showRow () {
|
|
return this.type === 1 ? this.t1 : this.t2;
|
|
},
|
|
descriptionItem () {
|
|
return function (key) {
|
|
if (key.includes('files')) return false;
|
|
|
|
let splits = key.split('.');
|
|
let value = this.row;
|
|
for (let i = 0;i < splits.length;i++) {
|
|
value = value[splits[i]]
|
|
}
|
|
|
|
return value;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
a {
|
|
color: red;
|
|
text-decoration: none;
|
|
transition: all 0.2s;
|
|
}
|
|
|
|
a:hover {
|
|
color: red;
|
|
text-decoration: underline;
|
|
}
|
|
</style>
|