<script lang="ts" setup>
|
import { computed, reactive, toRefs } from 'vue';
|
|
import { useMessage } from '@jnpf/hooks';
|
import { BasicModal, useModalInner } from '@jnpf/ui/modal';
|
|
import { synAllOrganizeSysToDing, synAllOrganizeSysToQy, synAllUserSysToDing, synAllUserSysToQy } from '#/api/system/sysConfig';
|
import { $t } from '#/locales';
|
|
interface State {
|
synData: any;
|
upLoading: boolean;
|
downLoading: boolean;
|
}
|
|
const props = defineProps({
|
type: {
|
// 1-企业微信 2-钉钉
|
default: 1,
|
type: Number,
|
},
|
departmentId: {
|
default: '',
|
type: String,
|
},
|
});
|
const emit = defineEmits(['register', 'update']);
|
|
const state = reactive<State>({
|
synData: {},
|
upLoading: false,
|
downLoading: false,
|
});
|
const { upLoading, downLoading } = toRefs(state);
|
const [registerModal, { closeModal }] = useModalInner(init);
|
const { createConfirm, createMessage } = useMessage();
|
|
const getName = computed(() => (props.type === 2 ? '阿里钉钉' : '企业微信'));
|
|
function init(data) {
|
state.synData = data;
|
}
|
// 同步
|
function handleSync(type) {
|
createConfirm({
|
iconType: 'warning',
|
title: $t('common.tipTitle'),
|
content: '同步以后会丢失现有数据，是否继续?',
|
onOk: () => {
|
type == 0 ? (state.upLoading = true) : (state.downLoading = true);
|
let method = state.synData.synType == '组织' ? synAllOrganizeSysToQy : synAllUserSysToQy;
|
if (props.type === 2) {
|
method = state.synData.synType == '组织' ? synAllOrganizeSysToDing : synAllUserSysToDing;
|
}
|
method(type, props.departmentId)
|
.then((res) => {
|
type == 0 ? (state.upLoading = false) : (state.downLoading = false);
|
closeModal();
|
if (res.msg === '正在进行同步,请稍等') return createMessage.success(res.msg);
|
state.synData.recordTotal = res.data.recordTotal;
|
state.synData.synDate = res.data.synDate;
|
state.synData.synFailCount = res.data.synFailCount;
|
state.synData.synSuccessCount = res.data.synSuccessCount;
|
state.synData.synType = res.data.synType;
|
state.synData.unSynCount = res.data.unSynCount;
|
emit('update', state.synData);
|
createMessage.success('同步成功');
|
})
|
.catch(() => {
|
type == 0 ? (state.upLoading = false) : (state.downLoading = false);
|
});
|
},
|
});
|
}
|
</script>
|
|
<template>
|
<BasicModal v-bind="$attrs" @register="registerModal" title="数据同步" :footer="null" :width="470" class="sync-dialog">
|
<div class="add-item">
|
<i class="add-icon syn-icon icon-ym icon-ym-upload"></i>
|
<div class="add-txt">
|
<p class="add-title">同步到{{ getName }}</p>
|
<p class="add-desc">把系统数据同步到{{ getName }}</p>
|
<p class="add-desc">同步后，会将{{ getName }}的原有数据删除</p>
|
</div>
|
<a-button type="primary" @click="handleSync(0)" :loading="upLoading" :disabled="downLoading">同步</a-button>
|
</div>
|
<div class="add-item !mb-[40px]">
|
<i class="add-icons syn-icon icon-ym icon-ym-download"></i>
|
<div class="add-txt">
|
<p class="add-title">同步到系统</p>
|
<p class="add-desc">把{{ getName }}同步到系统</p>
|
<p class="add-desc">同步后，会将系统的原有数据删除</p>
|
</div>
|
<a-button type="primary" @click="handleSync(1)" :loading="downLoading" :disabled="upLoading">同步</a-button>
|
</div>
|
</BasicModal>
|
</template>
|
<style lang="scss" scoped>
|
.sync-dialog {
|
.add-item {
|
display: flex;
|
align-items: center;
|
width: 100%;
|
height: 100px;
|
margin-bottom: 20px;
|
cursor: pointer;
|
|
.add-icon {
|
color: #08c0f8 !important;
|
background: #75d8f791 !important;
|
}
|
|
.syn-icon {
|
flex-shrink: 0;
|
width: 56px;
|
height: 56px;
|
margin-right: 10px;
|
font-size: 30px;
|
line-height: 56px;
|
color: #0eac5c;
|
text-align: center;
|
background: #cefae2;
|
border-radius: 50%;
|
}
|
|
.add-txt {
|
flex: 1;
|
height: 56px;
|
|
p {
|
line-height: 25px;
|
}
|
|
.add-title {
|
margin-bottom: 6px;
|
font-size: 18px;
|
font-weight: bold;
|
}
|
|
.add-desc {
|
width: 220px;
|
font-size: 12px;
|
color: #8d8989;
|
}
|
}
|
}
|
}
|
</style>
|
