<template>
|
<div class="app-container financial-reconciliation-page">
|
<el-alert
|
v-if="runtimeError"
|
title="财务对账页面加载失败"
|
type="error"
|
:description="runtimeError"
|
show-icon
|
:closable="false"
|
/>
|
<ReconciliationWorkspace v-else :key="workspaceKey" />
|
<el-button v-if="runtimeError" type="primary" class="retry-button" @click="retry">
|
重新加载
|
</el-button>
|
</div>
|
</template>
|
|
<script setup>
|
import { nextTick, onErrorCaptured, ref } from "vue";
|
import ReconciliationWorkspace from "./ReconciliationWorkspace.vue";
|
|
const runtimeError = ref("");
|
const workspaceKey = ref(0);
|
|
onErrorCaptured((error) => {
|
console.error("财务对账页面运行异常：", error);
|
runtimeError.value = error?.stack || error?.message || String(error);
|
return false;
|
});
|
|
const retry = async () => {
|
runtimeError.value = "";
|
await nextTick();
|
workspaceKey.value += 1;
|
};
|
</script>
|
|
<style scoped>
|
.financial-reconciliation-page {
|
min-height: calc(100vh - 84px);
|
background: #fff;
|
}
|
.retry-button {
|
margin-top: 16px;
|
}
|
</style>
|
