integrated_traffic_vue/src/views/occupational_hazards/components/view.vue

71 lines
1.8 KiB
Vue

<template>
<el-dialog v-model="visible" title="查看">
<el-descriptions :column="1" border>
<el-descriptions-item label="告知书名称">
{{ info.OCCUPATIONALNAME }}
</el-descriptions-item>
<el-descriptions-item label="上传人">
{{ info.CREATORNAME }}
</el-descriptions-item>
<el-descriptions-item label="上传时间">
{{ info.CREATETIME }}
</el-descriptions-item>
<el-descriptions-item label="文件">
<div @click="previewPdf(info.ATTACHMENT_ROUTE)">
{{ getFileName(info.ATTACHMENT_ROUTE) }}
<el-button type="primary" class="ml-10">预览</el-button>
</div>
</el-descriptions-item>
</el-descriptions>
<template #footer>
<el-button @click="visible = false">关闭</el-button>
</template>
</el-dialog>
<layout-pdf
v-if="pdfVisible"
:src="pdfSrc"
:visible="pdfVisible"
@update:visible="pdfVisible = $event"
></layout-pdf>
</template>
<script setup>
import { ref } from "vue"; // 导入ref
import { useVModel } from "@vueuse/core";
import LayoutPdf from "@/components/pdf/index.vue";
const props = defineProps({
visible: {
type: Boolean,
required: true,
default: false,
},
info: {
type: Object,
required: true,
default: () => ({}),
},
labelName: {
type: String,
required: true,
default: "",
},
});
const pdfVisible = ref(false); // 定义pdfVisible为响应式引用
const pdfSrc = ref(""); // 定义pdfSrc为响应式引用
const getFileName = (path) => {
return path.split("/").pop();
};
const previewPdf = (src) => {
pdfSrc.value = src; // 设置PDF源地址
pdfVisible.value = true; // 显示PDF预览对话框
};
const emits = defineEmits(["update:visible"]);
const visible = useVModel(props, "visible", emits);
</script>
<style scoped lang="scss"></style>