69 lines
1.6 KiB
Vue
69 lines
1.6 KiB
Vue
<!-- 关联审批单打印树（递归，最多 3 层由组装器保证） -->
|
||
<template>
|
||
<div class="oa-print-related">
|
||
<div
|
||
v-for="(b, bi) in blocks"
|
||
:key="`blk-${b.indexLabel}-${bi}`"
|
||
class="oa-print-related__block"
|
||
>
|
||
<div class="oa-print-related__title">{{ b.indexLabel }}. {{ b.title }}</div>
|
||
<div
|
||
v-for="(line, li) in b.lines || []"
|
||
:key="`ln-${bi}-${li}`"
|
||
class="oa-print-related__line"
|
||
>
|
||
<span class="oa-print-related__k">{{ line.label }}</span>
|
||
<span class="oa-print-related__v">{{ formatOaPrintAttachmentText(line.value) }}</span>
|
||
</div>
|
||
<div v-if="b.children?.length" class="oa-print-related__children">
|
||
<OaPrintRelatedTree :blocks="b.children" />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import type { RelatedPrintBlock } from '@/utils/oa-approval-print-related'
|
||
import { formatOaPrintAttachmentText } from '@/utils/oa-upload-file-type'
|
||
|
||
defineOptions({ name: 'OaPrintRelatedTree' })
|
||
|
||
defineProps<{
|
||
blocks: RelatedPrintBlock[]
|
||
}>()
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.oa-print-related__block {
|
||
margin: 0 0 8px;
|
||
}
|
||
|
||
.oa-print-related__title {
|
||
margin-bottom: 2px;
|
||
font-weight: 600;
|
||
}
|
||
|
||
.oa-print-related__line {
|
||
display: flex;
|
||
gap: 8px;
|
||
font-size: 12px;
|
||
line-height: 1.5;
|
||
}
|
||
|
||
.oa-print-related__k {
|
||
flex: 0 0 auto;
|
||
color: #64748b;
|
||
}
|
||
|
||
.oa-print-related__v {
|
||
color: #334155;
|
||
word-break: break-all;
|
||
}
|
||
|
||
.oa-print-related__children {
|
||
margin: 4px 0 0 14px;
|
||
padding-left: 8px;
|
||
border-left: 2px solid #cbd5e1;
|
||
}
|
||
</style>
|