va_admin_frontend/src/modules/helper/components/auto-menu/quick.vue

<template>
	<el-button type="success" @click="open">快速创建</el-button>

	<cl-form ref="Form">
		<template #slot-entity="{ scope }">
			<el-cascader
				v-model="scope.entity"
				filterable
				separator="."
				:options="tree"
				@change="onEntityChange"
			/>
		</template>
	</cl-form>
</template>

<script lang="ts" name="menu-create" setup>
import { isEmpty } from "lodash-es";
import { useCool, module } from "/@/cool";
import { useForm } from "@cool-vue/crud";
import { deepPaths } from "/@/cool/utils";
import { computed, onMounted } from "vue";
import { useMenu, useAi } from "../../hooks";
import type { EpsColumn, EpsData } from "../../types";

const { service, mitt } = useCool();
const menu = useMenu();
const Form = useForm();
const ai = useAi();

// 实体列表
const list: any[] = [];

// 实体树形列表
const tree = computed(() => deepPaths(list.map((e) => e.value)));

// 打开
function open() {
	Form.value?.open({
		title: "快速创建",
		width: "800px",
		items: [
			{
				prop: "module",
				label: "选择模块",
				span: 10,
				component: {
					name: "cl-select",
					props: {
						filterable: true,
						clearable: true,
						placeholder: "请选择模块",
						allowCreate: true,
						defaultFirstOption: true,
						options: module.dirs
					}
				},
				required: true
			},
			{
				prop: "entity",
				label: "数据结构",
				span: 14,
				component: {
					name: "slot-entity"
				},
				required: true
			},
			{
				prop: "name",
				label: "菜单名称",
				span: 10,
				component: {
					name: "el-input",
					props: {
						placeholder: "请输入菜单名称"
					}
				},
				required: true
			},
			{
				prop: "router",
				label: "菜单路由",
				span: 14,
				component: {
					name: "el-input",
					props: {
						placeholder: "请输入菜单路由，如：/test"
					}
				},
				rules: {
					required: true,
					validator(_, value, callback) {
						if (!(value || "").startsWith("/")) {
							callback(new Error("必须以 / 开头"));
						} else {
							callback();
						}
					}
				}
			},
			{
				prop: "parentId",
				label: "上级节点",
				component: {
					name: "cl-menu-select",
					props: {
						type: 1
					}
				}
			},
			{
				prop: "keepAlive",
				value: true,
				label: "路由缓存",
				component: {
					name: "el-radio-group",
					options: [
						{
							label: "开启",
							value: true
						},
						{
							label: "关闭",
							value: false
						}
					]
				}
			},
			{
				prop: "icon",
				label: "菜单图标",
				component: {
					name: "cl-menu-icon"
				}
			},
			{
				prop: "orderNum",
				label: "排序号",
				component: {
					name: "el-input-number",
					props: {
						placeholder: "请填写排序号",
						min: 0,
						max: 99,
						"controls-position": "right"
					}
				}
			},
			{
				prop: "isCreateFile",
				label: "是否创建文件",
				value: 1,
				component: {
					name: "el-radio-group",
					options: [
						{
							label: "是",
							value: 1
						},
						{
							label: "否",
							value: 0
						}
					]
				}
			},
			{
				prop: "isAi",
				label: "是否AI分析",
				value: 1,
				component: {
					name: "el-radio-group",
					options: [
						{
							label: "是",
							value: 1
						},
						{
							label: "否",
							value: 0
						}
					]
				},
				hidden({ scope }) {
					return scope.isCreateFile == 0;
				}
			}
		],
		on: {
			async submit(data, { done, close }) {
				const { api, prefix, columns } = list.find((e) => e.value == data.entity.join("/"));

				// 是否需要ai分析
				if (data.isAi) {
					await ai
						.invokeFlow("comm-parse-column", {
							entity: JSON.stringify(columns)
						})
						.then((res) => {
							columns.forEach((e: EpsColumn) => {
								e.component = res.columns[e.propertyName] || "input";
							});
						});
				}

				menu.create({
					...data,
					router: data.router,
					module: data.module,
					prefix,
					api,
					columns
				})
					.then((create) => {
						// 是否需要创建文件
						if (data.isCreateFile) {
							create();
						}
						mitt.emit("helper.createMenu");
						close();
					})
					.catch((err) => {
						console.error(err);
						done();
					});
			}
		}
	});
}

// 实体切换
function onEntityChange(val: any) {
	const item = list.find((e) => e.value == val.join("/"));

	if (item) {
		Form.value?.setForm("router", `/${item.value}`);
	}
}

onMounted(() => {
	service.base.open.eps().then((res: EpsData) => {
		for (const i in res) {
			res[i].forEach((e) => {
				if (!isEmpty(e.columns)) {
					list.push({
						value: e.prefix.substring(7),
						...e
					});
				}
			});
		}
	});
});
</script>