240 lines
7.8 KiB
Vue
240 lines
7.8 KiB
Vue
<template>
|
|
<BasicModal @register="registerModal" v-bind="$attrs" wrapClassName="data-migration-modal" >
|
|
<template #title>
|
|
<a-steps :current="current">
|
|
<a-step
|
|
v-for="step in steps"
|
|
:title="t(step.name)"
|
|
/>
|
|
</a-steps>
|
|
<div class="btn-box">
|
|
<a-button type="primary" @click="handleStepPrev" :disabled="current == 0">{{t('上一步')}}</a-button>
|
|
<a-button type="primary" @click="handleStepNext" :disabled="current>=steps.length-1">{{t('下一步')}}</a-button>
|
|
<a-button type="primary" @click="handleExport" :disabled="current<steps.length-1">{{t('导出')}}</a-button>
|
|
<a-button type="primary" danger @click="handleClose">{{ t('关闭') }}</a-button>
|
|
</div>
|
|
</template>
|
|
<div class="step-container">
|
|
<Tenant ref="tenantRef" v-show="showIf('租户')"/>
|
|
<Role ref="roleRef" v-show="showIf('角色')"/>
|
|
<Post ref="postRef" v-show="showIf('岗位')"/>
|
|
<UserGroup ref="userGroupRef" v-show="showIf('用户组')"/>
|
|
<Menu ref="menuRef" v-show="showIf('菜单')"/>
|
|
<Form ref="formRef" v-show="showIf('表单')"/>
|
|
<Workflow ref="workflowRef" v-show="showIf('流程定义')"/>
|
|
<SystemConfig ref="systemConfigRef" v-show="showIf('系统配置')"/>
|
|
<Dictionary ref="dictionaryRef" v-show="showIf('数据字典')"/>
|
|
<CodeRule ref="codeRuleRef" v-show="showIf('自动编码')"/>
|
|
<Desktop ref="desktopRef" v-show="showIf('桌面设计')"/>
|
|
<!-- <span ref="roleMenuAuthRef" v-show="showIf('角色-菜单授权')" >角色-菜单授权 选择列表</span> -->
|
|
<RoleMenuAuth ref="roleMenuAuthRef" v-show="showIf('角色-菜单授权')"/>
|
|
<InterfaceAuth ref="roleInterfaceAuthRef" v-show="showIf('角色-自定义接口授权')"/>
|
|
<TenantAuthorize ref="tenantMenuAuthRef" v-show="showIf('租户-菜单授权')"/>
|
|
</div>
|
|
</BasicModal>
|
|
</template>
|
|
<script lang="ts" setup>
|
|
import { ref,unref,provide,Ref,onMounted} from 'vue';
|
|
import { useI18n } from '/@/hooks/web/useI18n';
|
|
import {isFunction } from 'lodash-es';
|
|
import { isNumber } from '/@/utils/is';
|
|
import { downloadByData } from '/@/utils/file/download';
|
|
import { dateUtil } from '/@/utils/dateUtil';
|
|
import { BasicModal, useModalInner } from '/@/components/Modal';
|
|
import { exportDatas,downloadDatas} from '/@/api/system/dataMigration';
|
|
import Tenant from './components/Tenant.vue';
|
|
import Role from './components/Role.vue';
|
|
import Post from './components/Post.vue';
|
|
import Menu from './components/Menu.vue';
|
|
import Form from './components/Form.vue';
|
|
import Workflow from './components/Workflow.vue';
|
|
import SystemConfig from './components/SystemConfig.vue';
|
|
import Dictionary from './components/Dictionary.vue';
|
|
import CodeRule from './components/CodeRule.vue';
|
|
import Desktop from './components/Desktop.vue';
|
|
import UserGroup from './components/UserGroup.vue';
|
|
import RoleMenuAuth from './components/RoleMenuAuth.vue';
|
|
import InterfaceAuth from './components/InterfaceAuth.vue';
|
|
import TenantAuthorize from './components/TenantAuthorize.vue';
|
|
|
|
|
|
const { t } = useI18n();
|
|
const current = ref(0);
|
|
const steps=ref([]);
|
|
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
|
steps.value=data.items;
|
|
current.value=0;
|
|
selectedModel.value={};
|
|
initStep(0);
|
|
setModalProps({
|
|
confirmLoading: false,
|
|
canFullscreen: false,
|
|
defaultFullscreen: true,
|
|
destroyOnClose: true,
|
|
draggable: false,
|
|
showOkBtn: false,
|
|
showCancelBtn: false,
|
|
footer: null,
|
|
closable: false,
|
|
});
|
|
});
|
|
|
|
const tenantRef=ref();
|
|
const roleRef=ref();
|
|
const postRef= ref();
|
|
const userGroupRef= ref();
|
|
const menuRef = ref();
|
|
const formRef=ref();
|
|
const workflowRef=ref();
|
|
const systemConfigRef= ref();
|
|
const dictionaryRef= ref();
|
|
const codeRuleRef= ref();
|
|
const desktopRef= ref();
|
|
const roleMenuAuthRef= ref();
|
|
const roleInterfaceAuthRef= ref();
|
|
const tenantMenuAuthRef= ref();
|
|
|
|
const refs = {
|
|
tenantRef,
|
|
roleRef,
|
|
postRef,
|
|
userGroupRef,
|
|
menuRef,
|
|
formRef,
|
|
workflowRef,
|
|
systemConfigRef,
|
|
dictionaryRef,
|
|
codeRuleRef,
|
|
desktopRef,
|
|
roleMenuAuthRef,
|
|
roleInterfaceAuthRef,
|
|
tenantMenuAuthRef
|
|
};
|
|
|
|
const selectedModel: Ref<{
|
|
menu?:{
|
|
menuIds: number[],
|
|
buttonIds: number[],
|
|
columnIds:number[],
|
|
formIds:number[]
|
|
},
|
|
tenant?:{
|
|
tenantIds:number[]
|
|
}
|
|
}> = ref({});
|
|
|
|
provide('selectedModel', selectedModel);
|
|
|
|
function handleClose() {
|
|
closeModal();
|
|
}
|
|
|
|
function showIf(itemType:string){
|
|
let currentStep=getStep('current');
|
|
if(currentStep==null){
|
|
return false;
|
|
}
|
|
return currentStep.code==itemType;
|
|
}
|
|
|
|
//上一步
|
|
function handleStepPrev() {
|
|
completeStep(current.value);
|
|
current.value--;
|
|
initStep(current.value);
|
|
|
|
}
|
|
//下一步
|
|
async function handleStepNext() {
|
|
completeStep(current.value);
|
|
current.value++;
|
|
initStep(current.value);
|
|
}
|
|
|
|
//导出
|
|
async function handleExport(){
|
|
completeStep(current.value);
|
|
let result= await exportDatas({
|
|
exportType:'exportSelected',
|
|
...unref(selectedModel)
|
|
});
|
|
|
|
if(result){
|
|
const fileName='data-mg-'+dateUtil(new Date()).format('YYYY-MM-DD_HH_mm_ss');
|
|
const res = await downloadDatas({uuid:result});
|
|
downloadByData(
|
|
res.data,
|
|
fileName+".zip"
|
|
);
|
|
}
|
|
handleClose();
|
|
}
|
|
|
|
function getStep(key:string|number){
|
|
let stepList=unref(steps);
|
|
if(!stepList||stepList.length==0){
|
|
return null;
|
|
}
|
|
let step=null;
|
|
if(key=='current'){
|
|
step=unref(stepList[current.value]);
|
|
}else if(key=='prev'){
|
|
step=unref(stepList[current.value-1]);
|
|
}else if(key=='next'){
|
|
step=unref(stepList[current.value+1]);
|
|
}else if(isNumber(key)&&key>=0&&key<stepList.length){
|
|
step=unref(stepList[key]);
|
|
}
|
|
return step;
|
|
}
|
|
|
|
function initStep(key:string|number){
|
|
let stepRef = refs[getStep(key).ref].value;
|
|
stepRef.initStep&& stepRef.initStep();
|
|
|
|
};
|
|
|
|
function completeStep(key:string|number){
|
|
let stepRef = refs[getStep(key).ref].value;
|
|
stepRef.completeStep&& stepRef.completeStep();
|
|
};
|
|
|
|
|
|
</script>
|
|
|
|
<style lang="less">
|
|
.data-migration-modal{
|
|
.step-container {
|
|
max-height: 90vh;
|
|
overflow-y: auto;
|
|
padding-bottom: 16px;
|
|
}
|
|
.ant-modal-header{
|
|
height: 100px;
|
|
}
|
|
.ant-steps{
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
.ant-steps-horizontal:not(.ant-steps-label-vertical) .ant-steps-item {
|
|
padding-left:16px!important;
|
|
margin-bottom: 10px;
|
|
flex: 1 1 auto;
|
|
}
|
|
|
|
}
|
|
|
|
</style>
|
|
<style lang="less" scoped>
|
|
.btn-box {
|
|
height: 100px;
|
|
position: absolute;
|
|
right: 10px;
|
|
top:60px;
|
|
:deep(.ant-btn) {
|
|
margin-right: 10px;
|
|
}
|
|
}
|
|
|
|
</style>
|