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.
137 lines
2.5 KiB
137 lines
2.5 KiB
<template>
|
|
<div>
|
|
<Drawer title="查看详情" :closable="false" :width="54" v-model="isShow" class-name="upload-drawer__container">
|
|
<div class="item">
|
|
<div class="item__title">
|
|
所属年份
|
|
</div>
|
|
<div class="item__value">
|
|
{{ detail.year }}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="item">
|
|
<div class="item__title">
|
|
相关部门
|
|
</div>
|
|
<div class="item__value">
|
|
{{ detail.department ? detail.department.name : '无' }}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="item">
|
|
<div class="item__title">
|
|
上传时间
|
|
</div>
|
|
<div class="item__value">
|
|
{{ detail.created_at }}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="item">
|
|
<div class="item__title">备注</div>
|
|
<div class="item__value">{{ detail.remark }}</div>
|
|
</div>
|
|
|
|
<div class="item">
|
|
<div class="item__title">附件</div>
|
|
<div v-for="i in detail.files">
|
|
<a @click="open(i)">{{ i.original_name }}</a>
|
|
</div>
|
|
</div>
|
|
</Drawer>
|
|
|
|
<Modal
|
|
:width="76"
|
|
transfer
|
|
v-model="showModal"
|
|
:footer-hide="true"
|
|
title="预览"
|
|
>
|
|
<template>
|
|
<iframe
|
|
style="width: 100%; height: 57vh"
|
|
:src="codeUri"
|
|
border="0"
|
|
></iframe>
|
|
</template>
|
|
</Modal>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { show } from "@/api/budget/prePlan";
|
|
export default {
|
|
data() {
|
|
return {
|
|
showModal: false,
|
|
codeUri: '',
|
|
|
|
id: '',
|
|
isShow: false,
|
|
detail: {},
|
|
}
|
|
},
|
|
methods: {
|
|
setId (id) {
|
|
this.id = id
|
|
},
|
|
show () {
|
|
this.isShow = true
|
|
},
|
|
hide () {
|
|
this.isShow = false
|
|
},
|
|
async getDetail () {
|
|
const res = await show({
|
|
id: this.id
|
|
})
|
|
this.detail = res
|
|
console.log(this.detail)
|
|
},
|
|
|
|
open(e) {
|
|
this.codeUri = `http://view.ali251.langye.net:8012/onlinePreview?url=${encodeURIComponent(
|
|
new Buffer(e.url).toString("base64")
|
|
)}`;
|
|
|
|
this.showModal = true;
|
|
}
|
|
},
|
|
computed: {},
|
|
watch: {
|
|
isShow (newVal) {
|
|
if (newVal) {
|
|
this.getDetail()
|
|
} else {
|
|
this.id = ''
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
::v-deep .ivu-drawer {
|
|
top: 51px!important;
|
|
}
|
|
|
|
.item {
|
|
|
|
&__title {
|
|
font-weight: 600;
|
|
font-size: 15px;
|
|
|
|
padding: 20px 0;
|
|
}
|
|
a {
|
|
color: red;
|
|
|
|
&:hover {
|
|
text-decoration: underline;
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
|