<script lang="ts" setup>
|
import type { DmsFileCenterItem } from '#/api/x/dms/fileCenter';
|
|
import { ref } from 'vue';
|
|
import { useMessage } from '@jnpf/hooks';
|
import { BasicForm, useForm } from '@jnpf/ui/form';
|
import { BasicModal, useModalInner } from '@jnpf/ui/modal';
|
|
import { v4 as uuidv4 } from 'uuid';
|
|
import { createFolder } from '#/api/x/dms/fileCenter';
|
|
const emit = defineEmits<{
|
created: [parent: DmsFileCenterItem, folder: DmsFileCenterItem];
|
}>();
|
|
const parent = ref<DmsFileCenterItem>();
|
const sourceId = ref('');
|
const { createMessage } = useMessage();
|
const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
|
autoFocusFirstItem: true,
|
baseColProps: { span: 24 },
|
layout: 'vertical',
|
schemas: [
|
{
|
component: 'Input',
|
componentProps: { maxlength: 300, placeholder: '请输入目录名称', showCount: true, submitOnPressEnter: true },
|
field: 'name',
|
label: '目录名称',
|
rules: [{ message: '请输入目录名称', required: true, trigger: 'blur', whitespace: true }],
|
},
|
],
|
showActionButtonGroup: false,
|
});
|
const [registerModal, { changeOkLoading, closeModal }] = useModalInner(init);
|
|
async function init(data: { parent: DmsFileCenterItem }) {
|
parent.value = data.parent;
|
sourceId.value = `folder-${uuidv4()}`;
|
await resetFields();
|
await setFieldsValue({ name: '' });
|
}
|
|
async function handleSubmit(submittedValues?: Recordable) {
|
if (!parent.value) return;
|
const values = submittedValues || (await validate());
|
if (!values) return;
|
changeOkLoading(true);
|
try {
|
const response = await createFolder({ name: String(values.name).trim(), parentId: parent.value.id, sourceId: sourceId.value });
|
closeModal();
|
emit('created', parent.value, response.data);
|
} catch {
|
createMessage.error('目录创建失败，请检查目录名称和 CREATE 权限');
|
} finally {
|
changeOkLoading(false);
|
}
|
}
|
</script>
|
|
<template>
|
<BasicModal v-bind="$attrs" title="新建子目录" :width="480" destroy-on-close @register="registerModal" @ok="handleSubmit">
|
<a-alert class="mb-[18px]" type="info" show-icon :message="`父目录：${parent?.name || '-'}`" />
|
<BasicForm @register="registerForm" @submit="handleSubmit" />
|
</BasicModal>
|
</template>
|
