92 lines
2.1 KiB
Vue
92 lines
2.1 KiB
Vue
|
|
<template>
|
||
|
|
<div class="system-data-migration">
|
||
|
|
<a-tabs v-model:activeKey="tabActiveKey" class="main-tabs">
|
||
|
|
<a-tab-pane key="import" tab="导出工作区">
|
||
|
|
<Export/>
|
||
|
|
</a-tab-pane>
|
||
|
|
<a-tab-pane key="outport" tab="导入工作区" force-render>
|
||
|
|
<Import/>
|
||
|
|
</a-tab-pane>
|
||
|
|
</a-tabs>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script lang="ts" setup>
|
||
|
|
import { ref, computed, onMounted, onUnmounted, createVNode} from 'vue';
|
||
|
|
import { PageWrapper } from '/@/components/Page';
|
||
|
|
import Export from './components/export/index.vue';
|
||
|
|
import Import from './components/import/index.vue';
|
||
|
|
|
||
|
|
const tabActiveKey = ref('import');
|
||
|
|
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="less" scoped>
|
||
|
|
.system-data-migration{
|
||
|
|
position:absolute;
|
||
|
|
height:100%;
|
||
|
|
width:100%;
|
||
|
|
background-color:white;
|
||
|
|
padding-top:10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.main-tabs {
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
:deep(.ant-tabs-nav){
|
||
|
|
border-bottom:0px;
|
||
|
|
}
|
||
|
|
:deep(.ant-tabs-nav-wrap) {
|
||
|
|
width: 100% !important;
|
||
|
|
display: block !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
:deep(.ant-tabs-tab) {
|
||
|
|
min-width: 200px !important;
|
||
|
|
width:calc(50% - 2px);
|
||
|
|
display: block !important;
|
||
|
|
text-align: center !important;
|
||
|
|
font-size:16px;
|
||
|
|
padding:8px 0px;
|
||
|
|
&.ant-tabs-tab-active{
|
||
|
|
// box-shadow: 10px 10px 100px rgba(#1677ff, 1) inset;
|
||
|
|
.ant-tabs-tab-btn{
|
||
|
|
// color:#fff;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
:deep(.ant-tabs-tab:first-child) {
|
||
|
|
border-radius: 10px 0px 0px 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
:deep(.ant-tabs-tab + .ant-tabs-tab){
|
||
|
|
margin:0px 0px 0px 0px;
|
||
|
|
border-radius: 0px 10px 10px 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
:deep(.ant-tabs-content-holder) {
|
||
|
|
height:100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
:deep(.ant-tabs-content) {
|
||
|
|
height: 100% !important;
|
||
|
|
overflow-y: auto;
|
||
|
|
padding:10px 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
:deep(.ant-tabs-tabpane) {
|
||
|
|
padding: 0 8px;
|
||
|
|
height:100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
:deep(.ant-tabs-nav) {
|
||
|
|
margin-bottom: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
</style>
|