优化抽屉

This commit is contained in:
陈红丽 2024-12-16 13:44:31 +08:00
parent 8896ad533a
commit 10fe408391
6 changed files with 92 additions and 95 deletions

View File

@ -1,5 +1,5 @@
<template>
<n-drawer v-model:show="props.visible" :width="800" @update:show="handleUpdate">
<n-drawer v-model:show="isDrawer" width="800">
<n-drawer-content :title="props.layoutId ? '编辑' : '新增'" closable>
<template #default>
<n-form
@ -97,11 +97,12 @@
/**
* 定义参数
*/
const emit = defineEmits(['success', 'update:visible']);
const emit = defineEmits(['success']);
const formRef = ref();
const articleRef = ref();
const message = useMessage();
const chooseVisible = ref(false);
const isDrawer = ref(false);
const layoutList = ref([]);
/**
@ -121,18 +122,12 @@
* 定义接收的参数
*/
const props = defineProps({
visible: {
type: Boolean,
required: true,
default: false,
},
layoutId: {
type: Number,
required: true,
default: 0,
},
});
/**
* 定义数据
*/
@ -171,18 +166,34 @@
.then(async () => {
props.layoutId ? await layoutUpdate(formData) : await layoutAdd(formData);
message.success('操作成功');
emit('update:visible', false);
isDrawer.value = false;
emit('success');
})
.catch((error) => {});
};
const { isLock: subLoading, lockFn: submit } = useLockFn(handleSubmit);
/**
* 打开窗体
*/
const openDrawer = async (layoutId) => {
isDrawer.value = true;
getAllDict();
for (const key in formData) {
formData[key] = '';
}
formData.layoutId = null;
formData.type = null;
formData.sort = 0;
if (layoutId) {
setFormData(layoutId);
}
};
/**
* 关闭窗体
*/
const handleClose = () => {
emit('update:visible', false);
isDrawer.value = false;
};
/**
@ -197,8 +208,8 @@
/**
* 设置表单数据
*/
const setFormData = async () => {
const data = await getLayoutDetail(props.layoutId);
const setFormData = async (layoutId) => {
const data = await getLayoutDetail(layoutId);
for (const key in formData) {
if (data[key] != null && data[key] != undefined) {
//@ts-ignore
@ -231,13 +242,7 @@
layoutList.value = list ? list : [];
};
/**
* 钩子函数
*/
onMounted(() => {
getAllDict();
if (props.layoutId) {
setFormData();
}
defineExpose({
openDrawer,
});
</script>

View File

@ -44,13 +44,7 @@
</template>
</BasicTable>
</n-card>
<editDialog
ref="createModalRef"
:layoutId="layoutId"
v-if="editVisible"
v-model:visible="editVisible"
@success="reloadTable('noRefresh')"
/>
<editDialog ref="createModalRef" :layoutId="layoutId" @success="reloadTable('noRefresh')" />
</div>
</template>
@ -185,8 +179,8 @@
*/
const handleAdd = async () => {
layoutId.value = 0;
await nextTick();
editVisible.value = true;
const { openDrawer } = createModalRef.value;
openDrawer();
};
/**
@ -194,8 +188,8 @@
*/
async function handleEdit(record: Recordable) {
layoutId.value = record.id;
await nextTick();
editVisible.value = true;
const { openDrawer } = createModalRef.value;
openDrawer(layoutId.value);
}
/**

View File

@ -1,5 +1,5 @@
<template>
<n-drawer v-model:show="props.visible" :width="size" @update:show="handleUpdate">
<n-drawer v-model:show="isDrawer" :width="size">
<n-drawer-content :title="props.noticeId ? '编辑公告' : '新增公告'" closable>
<template #default>
<n-form
@ -78,9 +78,20 @@
import Editor from '@/components/Editor/tinymce.vue';
import { useLockFn } from '@/utils/useLockFn';
const emit = defineEmits(['success', 'update:visible']);
const emit = defineEmits(['success']);
const formRef = ref();
/**
* 定义接收的参数
*/
const props = defineProps({
noticeId: {
type: Number,
required: true,
default: 0,
},
});
/**
* 定义表单参数
*/
@ -100,22 +111,7 @@
});
const editorRef = ref();
const fwbHeight = document.body.clientHeight - 400;
/**
* 定义接收的参数
*/
const props = defineProps({
visible: {
type: Boolean,
required: true,
default: false,
},
noticeId: {
type: Number,
required: true,
default: 0,
},
});
const isDrawer = ref(false);
/**
* 定义通知类型
@ -137,22 +133,32 @@
ruleForm.content = editorRef.value.myValue;
props.noticeId ? await noticeUpdate(ruleForm) : await noticeAdd(ruleForm);
message.success('操作成功');
emit('update:visible', false);
isDrawer.value = false;
emit('success');
})
.catch((error) => {});
};
/**
* 打开窗体
*/
const openDrawer = async (noticeId) => {
isDrawer.value = true;
for (const key in formData) {
formData[key] = '';
}
formData.status = 1;
formData.type = 1;
if (noticeId) {
setFormData(noticeId);
}
};
/**
* 关闭窗体
*/
const handleClose = () => {
emit('update:visible', false);
};
const handleUpdate = (show) => {
if (!show) {
handleClose();
}
isDrawer.value = false;
};
const { isLock: subLoading, lockFn: submit } = useLockFn(handleSubmit);
@ -160,8 +166,8 @@
/**
* 设置表单数据
*/
const setFormData = async () => {
const data = await getNoticeDetail(props.noticeId);
const setFormData = async (noticeId) => {
const data = await getNoticeDetail(noticeId);
for (const key in formData) {
if (data[key] != null && data[key] != undefined) {
//@ts-ignore
@ -171,12 +177,7 @@
editorRef.value.myValue = formData.content;
};
/**
* 钩子函数
*/
onMounted(() => {
if (props.noticeId) {
setFormData();
}
defineExpose({
openDrawer,
});
</script>

View File

@ -44,13 +44,7 @@
</template>
</BasicTable>
</n-card>
<editDialog
ref="createModalRef"
:noticeId="noticeId"
v-if="editVisible"
v-model:visible="editVisible"
@success="reloadTable('noRefresh')"
/>
<editDialog ref="createModalRef" @success="reloadTable('noRefresh')" :noticeId="noticeId" />
</div>
</template>
@ -186,8 +180,8 @@
*/
const handleAdd = async () => {
noticeId.value = 0;
await nextTick();
editVisible.value = true;
const { openDrawer } = createModalRef.value;
openDrawer();
};
/**
@ -195,8 +189,8 @@
*/
async function handleEdit(record: Recordable) {
noticeId.value = record.id;
await nextTick();
editVisible.value = true;
const { openDrawer } = createModalRef.value;
openDrawer(noticeId.value);
}
/**

View File

@ -51,7 +51,7 @@
v-model:visible="editVisible"
@success="reloadTable('noRefresh')"
/>
<jobLog v-if="editLogVisible" :jobId="jobId" v-model:visible="editLogVisible" />
<jobLog :jobId="jobId" ref="jobModalRef" />
</div>
</template>
@ -83,6 +83,7 @@
const dialog = useDialog();
const basicTableRef = ref();
const createModalRef = ref();
const jobModalRef = ref();
const editVisible = ref(false);
const editLogVisible = ref(false);
const jobId = ref(0);
@ -299,10 +300,12 @@
* @param record 参数
*/
const handleJobLog = (record) => {
console.log(record);
// router.push({path:'/monitorJob/log'})
editLogVisible.value = true;
jobId.value = record.id;
// editLogVisible.value = true;
const { openDrawer } = jobModalRef.value;
openDrawer();
};
/**

View File

@ -1,5 +1,5 @@
<template>
<n-drawer v-model:show="props.visible" :width="size" @update:show="handleUpdate">
<n-drawer v-model:show="isDrawer" :width="size">
<n-drawer-content title="调度日志" closable>
<template #default>
<n-card :bordered="false" class="pt-3 mb-3 proCard">
@ -70,10 +70,10 @@
const basicTableRef = ref();
const createModalRef = ref();
const editVisible = ref(false);
const isDrawer = ref(false);
const logId = ref(0);
const size = document.body.clientWidth - 500;
const rowKeys = ref([]);
const emit = defineEmits(['update:visible']);
/**
* 定义查询参数
@ -87,11 +87,6 @@
* 定义接收的参数
*/
const props = defineProps({
visible: {
type: Boolean,
required: true,
default: false,
},
jobId: {
type: Number,
required: true,
@ -191,19 +186,21 @@
labelWidth: 110,
schemas,
});
const handleClose = () => {
emit('update:visible', false);
};
/**
* 执行更新
* @param show 参数
* 打开窗体
*/
const handleUpdate = (show) => {
if (!show) {
handleClose();
const openDrawer = async (noticeId) => {
isDrawer.value = true;
for (const key in formParams) {
formParams[key] = '';
}
};
/**
* 关闭窗体
*/
const handleClose = () => {
isDrawer.value = false;
};
/**
* 执行查看详情
*/
@ -231,6 +228,9 @@
},
});
}
defineExpose({
openDrawer,
});
</script>
<style lang="less" scoped></style>