archives/src/views/transfer/move-submit.vue

<template>
    <div class="hc-docs-tabs-box">
        <hc-tabs-simple :cur="tabsKey" :datas="tabsData" @tab-click="tabsChange">
            <template #tab-one>
                <hc-card>
                    <template #extra>
                        <el-button type="primary" @click="reportClick">
                            <span>上报</span>
                        </el-button>
                        <el-button type="warning" class="ml-2" @click="saveClick">
                            <span>保存</span>
                        </el-button>
                    </template>


                    表单填报页内容
                </hc-card>
            </template>
            <template #tab-two>
                <hc-pdf :src="pdfUrl" viewer="" />
            </template>
        </hc-tabs-simple>
    </div>
</template>

<script setup>
import { ref } from 'vue'
//类型处理
const tabsKey = ref('one')
const tabsData = ref([
{ icon: '', label: '电子档案移交接收意记表', key: 'one' },
    { icon: '', label: '电子档案移交清单', key: 'two' },
    
  
])

const tabsChange = (item) => {
    console.log(item)
}
const pdfUrl = ref('')
const saveClick = () => {
    console.log('保存')
}

const reportClick = () => {
 console.log('上报')   
}
</script>

<style>
.hc-docs-tabs-box {
    position: relative;
    height: 100%;
    overflow: auto;
   
}
</style>