<template>
	<a-modal
		title="还原文件"
		v-model:visible="visible"
		:maskClosable="false"
		width="550px"
		@afterVisibleChange="handleVisibleChange"
		@cancel="handleDialogClose"
	>
		<div class="restore-text">
			<a-spin />
			正在还原文件，请稍等片刻...
		</div>
	</a-modal>
</template>

<script setup>
	import { ref } from 'vue'
	import { message } from 'ant-design-vue'
	import { restoreRecoveryFile } from '@/api/myResource/file'

	const props = defineProps({
		deleteBatchNum: String,
		filePath: String,
		callback: Function
	})

	const visible = ref(false)

	const handleVisibleChange = async (val) => {
		if (val) {
			try {
				const res = await restoreRecoveryFile({
					deleteBatchNum: props.deleteBatchNum,
					filePath: props.filePath
				})

				if (res.success) {
					message.success('文件已还原')
					visible.value = false
					props.callback('confirm')
				} else {
					message.error(res.message)
				}
			} catch (error) {
				console.error(error)
			}
		}
	}

	const handleDialogClose = () => {
		visible.value = false
		props.callback('cancel')
	}

	defineExpose({
		visible
	})
</script>

<style lang="less" scoped>
	@import '@/style/myResource/varibles.less';

	.restore-text {
		padding: 40px 0 64px 0;
		text-align: center;

		.ant-spin {
			margin-right: 8px;
		}
	}
</style>
