You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
76 lines
1.7 KiB
76 lines
1.7 KiB
<script lang="ts" setup>
|
|
import { ref } from 'vue';
|
|
import { useConfig } from '@/store/modules/asideConfig'
|
|
|
|
const emit = defineEmits<{
|
|
(e: 'closeCallback', value: any),
|
|
}>()
|
|
|
|
|
|
const show = ref(false)
|
|
|
|
const stys = {
|
|
'width': '424px',
|
|
'height': '232px',
|
|
'--n-padding-bottom': '20px',
|
|
'--n-padding-left': '0px',
|
|
'background': 'linear-gradient(132deg, rgba(255, 255, 255, 0.32) 21%, rgba(152, 172, 255, 0.14) 100%)',
|
|
'border-radius': '4px',
|
|
'box-shadow': '0px 12px 48px 16px rgba(0, 0, 0, 0.03)',
|
|
'backdrop-filter': ' blur(10px)',
|
|
}
|
|
|
|
function showModal() {
|
|
show.value = true
|
|
}
|
|
|
|
function closeModal() {
|
|
show.value = false
|
|
emit('closeCallback', true)
|
|
}
|
|
|
|
function closeOnlyModal() {
|
|
show.value = false
|
|
}
|
|
|
|
defineExpose({
|
|
showModal,
|
|
closeModal,
|
|
closeOnlyModal,
|
|
})
|
|
|
|
const configStore = useConfig()
|
|
const percent = ref(0);
|
|
|
|
configStore.$subscribe(() => {
|
|
percent.value = configStore.getTimeNum;
|
|
});
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<n-modal v-model:show="show" :mask-closable="false" :show-mask="false" transform-origin="center">
|
|
<n-card :style="stys" :bordered="false" role="dialog" aria-modal="true">
|
|
<svg-icon size="15" name="close" @click="closeModal" style="position:absolute; right:6px;top:6px;cursor: pointer;"/>
|
|
<div class="wrapper">
|
|
<svg-icon size="90" name="robot2" />
|
|
<span style="margin-top: 24px;">正在查重中</span>
|
|
</div>
|
|
<div style="padding: 0 20px;">
|
|
<n-progress type="line" :percentage="percent" :show-indicator="false"/>
|
|
</div>
|
|
</n-card>
|
|
</n-modal>
|
|
</template>
|
|
|
|
<style lang="less" scoped>
|
|
.wrapper {
|
|
display: flex;
|
|
height: 100%;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
</style>
|