<template>
|
<div class="track-page">
|
<el-card shadow="never">
|
|
<div class="content">
|
<div class="iframe-wrap" v-if="iframeUrl">
|
<iframe :src="iframeUrl" class="workflow-iframe" referrerpolicy="no-referrer"></iframe>
|
</div>
|
<div v-else class="empty">暂无流程实例ID</div>
|
</div>
|
</el-card>
|
<div class="action-buttons">
|
<el-button @click="goBack">返回</el-button>
|
</div>
|
</div>
|
</template>
|
|
<script setup lang="ts">
|
import { ref, computed } from 'vue'
|
import { useRoute, useRouter } from 'vue-router'
|
|
const route = useRoute()
|
const router = useRouter()
|
|
const processId = computed(() => {
|
return route.query.processinstId || route.params.id || ''
|
})
|
|
const hostUrl = import.meta.env.VITE_AXIOS_BASE_URL
|
|
const iframeUrl = computed(() => {
|
const pid = processId.value
|
if (pid && pid.toString().trim()) {
|
return `${hostUrl}/activity/history?processinstId=${encodeURIComponent(pid.toString().trim())}`
|
}
|
return ''
|
})
|
|
const goBack = () => router.back()
|
</script>
|
|
<style scoped>
|
.track-page {
|
padding: 20px;
|
}
|
.title {
|
font-weight: 600;
|
margin-bottom: 10px;
|
}
|
.content {
|
margin-top: 10px;
|
}
|
.iframe-wrap {
|
margin-top: 10px;
|
}
|
.workflow-iframe {
|
width: 100%;
|
height: 600px;
|
border: none;
|
border-radius: 6px;
|
}
|
.action-buttons {
|
display: flex;
|
justify-content: center;
|
margin-top: 15px;
|
}
|
.empty {
|
text-align: center;
|
color: #909399;
|
padding: 40px 0;
|
}
|
</style>
|
