Files
UserhomeFront/src/views/app/AddAppContainer.vue
T

65 lines
2.3 KiB
Vue

<template>
<AppForm v-model="visible" :initForm="initFormData" :categoryList="categoryList" :isEdit="false"
:loading="submitting" @submit="handleSubmit" @cancel="visible = false" />
</template>
<script setup lang="ts">
import { ref } from "vue";
import AppForm from "./AppForm.vue";
/* ---------- 对外暴露:由父组件(AppList)调用 ---------- */
const visible = ref(false);
// 应用类型列表——由父组件通过 expose 传入,或内部自行拉取
const categoryList = ref<any[]>([]);
// 新增模式:始终传空初始值
const initFormData = ref<Record<string, any>>({});
// 成功后回调
let onSuccessCallback: (() => void) | null = null;
// useForm 托管提交
const { form, loading: submitting, send: sendForm, onSuccess, onError } = useForm(
(dto) => Apis.AppSettings.addApp({ data: dto }),
{ initialForm: { name: '', categoryId: undefined, desc: '', clients: [], pcUrl: '', pcIcon: '', appUrl: '', appIcon: '', officialAccountUrl: '', dingtalkUrl: '' }, resetAfterSubmiting: true }
);
onSuccess(() => {
Message.success('新增应用成功!');
visible.value = false;
onSuccessCallback?.();
});
onError((event) => {
Message.error(event?.error?.message || '新增失败');
});
/* ---------- 打开弹窗 ---------- */
function open(categories: any[], defaultCategoryId?: number | null, onSuccess?: () => void) {
categoryList.value = categories || [];
// 若列表已筛选某应用类型,则新增弹窗自动带入该类型;选「全部」时不带入
initFormData.value = defaultCategoryId != null ? { categoryId: defaultCategoryId } : {};
onSuccessCallback = onSuccess || null;
visible.value = true;
}
/* ---------- 提交:由 useForm 接管 loading 与异常处理 ---------- */
async function handleSubmit(formData: Record<string, any>) {
form.value = {
name: formData.name,
categoryId: formData.categoryId,
desc: formData.desc,
clients: formData.clients,
pcUrl: formData.pcUrl,
pcIcon: formData.pcIcon,
appUrl: formData.appUrl,
appIcon: formData.appIcon,
officialAccountUrl: formData.officialAccountUrl,
dingtalkUrl: formData.dingtalkUrl,
};
await sendForm();
}
defineExpose({ open, visible });
</script>