From aff5c9407599bd5f9ab6b239996d6cc7bac2c0d0 Mon Sep 17 00:00:00 2001 From: 潘志宝 <979469083@qq.com> Date: 星期一, 23 九月 2024 08:37:12 +0800 Subject: [PATCH] 模型平台图标 --- src/views/model/mpk/project/ProjectPackageModelDialog.vue | 4 src/views/model/mpk/file/MpkGeneratorHistory.vue | 2 src/api/model/mpk/projectPackageHistory.ts | 0 src/views/model/mpk/file/MpkRun.vue | 2 src/views/model/mpk/menu/index.vue | 155 ++++++++ src/views/model/mpk/project/ProjectPackage.vue | 2 src/views/model/mpk/icon/IconForm.vue | 105 +++++ src/api/model/mpk/menu.ts | 32 + src/api/model/mpk/project.ts | 0 src/views/model/mpk/project/ProjectPackageHistory.vue | 4 src/views/model/mpk/menu/MenuForm.vue | 102 +++++ src/views/model/mpk/menu/group/index.vue | 164 ++++++++ src/views/model/mpk/file/MpkGenerator.vue | 2 src/views/model/mpk/menu/group/GroupForm.vue | 99 +++++ src/views/model/mpk/file/index.vue | 2 src/router/modules/remaining.ts | 2 src/views/model/mpk/project/index.vue | 2 src/views/model/mpk/file/SettingForm.vue | 4 src/api/model/mpk/mpkHistory.ts | 0 src/views/model/mpk/project/ProjectForm.vue | 4 /dev/null | 228 ------------ src/api/model/mpk/group.ts | 32 + src/views/model/mpk/file/MpkForm.vue | 2 src/api/model/mpk/icon.ts | 42 ++ src/api/model/mpk/mpk.ts | 0 src/views/model/mpk/icon/index.vue | 149 +++++++ 26 files changed, 896 insertions(+), 244 deletions(-) diff --git a/src/api/model/mpk/group.ts b/src/api/model/mpk/group.ts new file mode 100644 index 0000000..3da3e2c --- /dev/null +++ b/src/api/model/mpk/group.ts @@ -0,0 +1,32 @@ +import request from '@/config/axios' + +export interface MpkGroupVO { + id: string + name: string + sort: number +} + +// 查询列表 +export const getList = () => { + return request.get({ url: '/model/mpk/group/list' }) +} + +// 获得 +export const getGroup = (id: number) => { + return request.get({ url: '/model/mpk/group/get?id=' + id }) +} + +// 新增 +export const createGroup = (data: MpkIconVO) => { + return request.post({ url: '/model/mpk/group/create', data }) +} + +// 修改 +export const updateGroup = (data: MpkIconVO) => { + return request.put({ url: '/model/mpk/group/update', data }) +} + +// 删除 +export const deleteGroup = (id: string) => { + return request.delete({ url: '/model/mpk/group/delete?id=' + id }) +} diff --git a/src/api/model/mpk/icon.ts b/src/api/model/mpk/icon.ts new file mode 100644 index 0000000..07c43b6 --- /dev/null +++ b/src/api/model/mpk/icon.ts @@ -0,0 +1,42 @@ +import request from '@/config/axios' + +export interface MpkIconVO { + id: string + iconName: string + iconDesc: string + sort: number +} + +export interface MpkIconPageReqVO extends PageParam { + iconName?: string +} + +// 查询分页列表 +export const getPage = (params: MpkIconPageReqVO) => { + return request.get({ url: '/model/mpk/icon/page', params }) +} + +// 查询列表 +export const getList = () => { + return request.get({ url: '/model/mpk/icon/list' }) +} + +// 获得 +export const getIcon = (id: number) => { + return request.get({ url: '/model/mpk/icon/get?id=' + id }) +} + +// 新增 +export const createIcon = (data: MpkIconVO) => { + return request.post({ url: '/model/mpk/icon/create', data }) +} + +// 修改 +export const updateIcon = (data: MpkIconVO) => { + return request.put({ url: '/model/mpk/icon/update', data }) +} + +// 删除 +export const deleteIcon = (id: string) => { + return request.delete({ url: '/model/mpk/icon/delete?id=' + id }) +} diff --git a/src/api/model/mpk/menu.ts b/src/api/model/mpk/menu.ts new file mode 100644 index 0000000..bcc7223 --- /dev/null +++ b/src/api/model/mpk/menu.ts @@ -0,0 +1,32 @@ +import request from '@/config/axios' + +export interface MpkMenuVO { + id: string + name: string + sort: number +} + +// 查询列表 +export const getList = () => { + return request.get({ url: '/model/mpk/menu/list' }) +} + +// 获得 +export const getMenu = (id: number) => { + return request.get({ url: '/model/mpk/menu/get?id=' + id }) +} + +// 新增 +export const createMenu = (data: MpkIconVO) => { + return request.post({ url: '/model/mpk/menu/create', data }) +} + +// 修改 +export const updateMenu = (data: MpkIconVO) => { + return request.put({ url: '/model/mpk/menu/update', data }) +} + +// 删除 +export const deleteMenu = (id: string) => { + return request.delete({ url: '/model/mpk/menu/delete?id=' + id }) +} diff --git a/src/api/mpk/mpk.ts b/src/api/model/mpk/mpk.ts similarity index 100% rename from src/api/mpk/mpk.ts rename to src/api/model/mpk/mpk.ts diff --git a/src/api/mpk/mpkHistory.ts b/src/api/model/mpk/mpkHistory.ts similarity index 100% rename from src/api/mpk/mpkHistory.ts rename to src/api/model/mpk/mpkHistory.ts diff --git a/src/api/mpk/project.ts b/src/api/model/mpk/project.ts similarity index 100% rename from src/api/mpk/project.ts rename to src/api/model/mpk/project.ts diff --git a/src/api/mpk/projectPackageHistory.ts b/src/api/model/mpk/projectPackageHistory.ts similarity index 100% rename from src/api/mpk/projectPackageHistory.ts rename to src/api/model/mpk/projectPackageHistory.ts diff --git a/src/router/modules/remaining.ts b/src/router/modules/remaining.ts index f16fc56..dcf55c7 100644 --- a/src/router/modules/remaining.ts +++ b/src/router/modules/remaining.ts @@ -398,7 +398,7 @@ component: () => import('@/views/model/mpk/file/MpkForm.vue'), name: 'MpkForm', meta: { - title: 'Mpk表单', + title: 'MDK表单', noCache: true, hidden: true, canTo: true, diff --git a/src/views/model/mpk/file/MpkForm.vue b/src/views/model/mpk/file/MpkForm.vue index 0bae832..ab9916f 100644 --- a/src/views/model/mpk/file/MpkForm.vue +++ b/src/views/model/mpk/file/MpkForm.vue @@ -235,7 +235,7 @@ </template> <script lang="ts" setup> import {DICT_TYPE, getDictOptions} from '@/utils/dict' - import * as MpkApi from '@/api/mpk/mpk' + import * as MpkApi from '@/api/model/mpk/mpk' import {FormRules} from 'element-plus' import {getAccessToken, getTenantId} from "@/utils/auth"; import SettingForm from './SettingForm.vue' diff --git a/src/views/model/mpk/file/MpkGenerator.vue b/src/views/model/mpk/file/MpkGenerator.vue index 07ccef1..5a86965 100644 --- a/src/views/model/mpk/file/MpkGenerator.vue +++ b/src/views/model/mpk/file/MpkGenerator.vue @@ -11,7 +11,7 @@ </Dialog> </template> <script lang="ts" setup> - import * as MpkApi from '@/api/mpk/mpk' + import * as MpkApi from '@/api/model/mpk/mpk' import download from "@/utils/download"; import {formatToDateString} from "@/utils/dateUtil"; diff --git a/src/views/model/mpk/file/MpkGeneratorHistory.vue b/src/views/model/mpk/file/MpkGeneratorHistory.vue index fb79acc..35cdee8 100644 --- a/src/views/model/mpk/file/MpkGeneratorHistory.vue +++ b/src/views/model/mpk/file/MpkGeneratorHistory.vue @@ -57,7 +57,7 @@ </template> <script lang="ts" setup> import download from "@/utils/download"; - import * as HistoryApi from "@/api/mpk/mpkHistory"; + import * as HistoryApi from "@/api/model/mpk/mpkHistory"; import { dateFormatter } from '@/utils/formatTime' diff --git a/src/views/model/mpk/file/MpkRun.vue b/src/views/model/mpk/file/MpkRun.vue index 2a5f7f2..f3a0318 100644 --- a/src/views/model/mpk/file/MpkRun.vue +++ b/src/views/model/mpk/file/MpkRun.vue @@ -105,7 +105,7 @@ </Dialog> </template> <script lang="ts" setup> - import * as MpkApi from '@/api/mpk/mpk' + import * as MpkApi from '@/api/model/mpk/mpk' import {FormRules} from "element-plus"; import {getAccessToken, getTenantId} from "@/utils/auth"; diff --git a/src/views/model/mpk/file/SettingForm.vue b/src/views/model/mpk/file/SettingForm.vue index aa95209..4fb2e44 100644 --- a/src/views/model/mpk/file/SettingForm.vue +++ b/src/views/model/mpk/file/SettingForm.vue @@ -110,8 +110,8 @@ </template> <script lang="ts" setup> import {DICT_TYPE,getDictOptions} from '@/utils/dict'; - import * as ProjectApi from '@/api/mpk/project' - import * as MpkApi from '@/api/mpk/mpk' + import * as ProjectApi from '@/api/model/mpk/project' + import * as MpkApi from '@/api/model/mpk/mpk' import {FormRules} from 'element-plus' import {generateUUID} from "@/utils"; import {func} from "vue-types"; diff --git a/src/views/model/mpk/file/index.vue b/src/views/model/mpk/file/index.vue index 598a7a9..8f20674 100644 --- a/src/views/model/mpk/file/index.vue +++ b/src/views/model/mpk/file/index.vue @@ -106,7 +106,7 @@ </template> <script lang="ts" setup> import {dateFormatter} from '@/utils/formatTime' - import * as MpkApi from '@/api/mpk/mpk' + import * as MpkApi from '@/api/model/mpk/mpk' import MpkGenerator from './MpkGenerator.vue' import GeneratorCodeHistory from './MpkGeneratorHistory.vue' import MpkRun from './MpkRun.vue' diff --git a/src/views/model/mpk/icon/IconForm.vue b/src/views/model/mpk/icon/IconForm.vue new file mode 100644 index 0000000..cd59d02 --- /dev/null +++ b/src/views/model/mpk/icon/IconForm.vue @@ -0,0 +1,105 @@ +<template> + <Dialog v-model="dialogVisible" :title="dialogTitle"> + <el-form + ref="formRef" + v-loading="formLoading" + :model="formData" + :rules="formRules" + label-width="80px" + > + <el-form-item label="图标名称" prop="iconName"> + <el-input v-model="formData.iconName" placeholder="请输入图标名称" /> + </el-form-item> + <el-form-item label="图标描述" prop="iconDesc"> + <el-input v-model="formData.iconDesc" placeholder="请输入图标描述" /> + </el-form-item> + <el-form-item label="排序" prop="sort"> + <el-input v-model="formData.sort" placeholder="请输入排序" /> + </el-form-item> + + </el-form> + <template #footer> + <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button> + <el-button @click="dialogVisible = false">取 消</el-button> + </template> + </Dialog> +</template> +<script lang="ts" setup> +import * as MpkIconApi from '@/api/model/mpk/icon' +import {deleteIcon} from "@/api/model/mpk/icon"; + +defineOptions({ name: 'MpkIconForm' }) + +const { t } = useI18n() // 国际化 +const message = useMessage() // 消息弹窗 + +const dialogVisible = ref(false) // 弹窗的是否展示 +const dialogTitle = ref('') // 弹窗的标题 +const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用 +const formType = ref('') // 表单的类型:create - 新增;update - 修改 +const formData = ref({ + id: undefined, + iconName: '', + iconDesc: '', + sort: undefined +}) +const formRules = reactive({ + iconName: [{ required: true, message: '名称不能为空', trigger: 'blur' }] +}) +const formRef = ref() // 表单 Ref + +/** 打开弹窗 */ +const open = async (type: string, id?: string) => { + dialogVisible.value = true + dialogTitle.value = t('action.' + type) + formType.value = type + resetForm() + // 修改时,设置数据 + if (id) { + formLoading.value = true + try { + formData.value = await MpkIconApi.getIcon(id) + } finally { + formLoading.value = false + } + } +} +defineExpose({ open }) // 提供 open 方法,用于打开弹窗 + +/** 提交表单 */ +const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调 +const submitForm = async () => { + // 校验表单 + if (!formRef) return + const valid = await formRef.value.validate() + if (!valid) return + // 提交请求 + formLoading.value = true + try { + const data = formData.value as MpkIconApi.MpkIconVO + if (formType.value === 'create') { + await MpkIconApi.createIcon(data) + message.success(t('common.createSuccess')) + } else { + await MpkIconApi.updateIcon(data) + message.success(t('common.updateSuccess')) + } + dialogVisible.value = false + // 发送操作成功的事件 + emit('success') + } finally { + formLoading.value = false + } +} + +/** 重置表单 */ +const resetForm = () => { + formData.value = { + id: undefined, + iconName: '', + iconDesc: '', + sort: undefined + } + formRef.value?.resetFields() +} +</script> diff --git a/src/views/model/mpk/icon/index.vue b/src/views/model/mpk/icon/index.vue new file mode 100644 index 0000000..e4b361e --- /dev/null +++ b/src/views/model/mpk/icon/index.vue @@ -0,0 +1,149 @@ +<template> + <!-- 搜索工作栏 --> + <ContentWrap> + <el-form + class="-mb-15px" + :model="queryParams" + ref="queryFormRef" + :inline="true" + label-width="68px" + > + <el-form-item label="模型名称" prop="iconName"> + <el-input + v-model="queryParams.iconName" + placeholder="请输入名称" + clearable + class="!w-240px" + /> + </el-form-item> + <el-form-item> + <el-button @click="handleQuery"> + <Icon icon="ep:search" class="mr-5px"/> + 搜索 + </el-button> + <el-button @click="resetQuery"> + <Icon icon="ep:refresh" class="mr-5px"/> + 重置 + </el-button> + <el-button + type="primary" + plain + @click="openForm('create')" + v-hasPermi="['mpk:icon:create']" + > + <Icon icon="ep:plus" class="mr-5px" /> + 新增 + </el-button> + + </el-form-item> + </el-form> + </ContentWrap> + + <!-- 列表 --> + <ContentWrap> + <el-table + v-loading="loading" + :data="list" + row-key="id" + > + <el-table-column prop="iconName" label="名称"/> + <el-table-column prop="iconDesc" label="描述"/> + <el-table-column prop="sort" label="排序"/> + <el-table-column label="操作" align="center" width="200px"> + <template #default="scope"> + <div class="flex items-center justify-center"> + <el-button + link + type="primary" + @click="openForm('update', scope.row.id)" + v-hasPermi="['mpk:icon:update']" + > + 编辑 + </el-button> + <el-button link type="danger" @click="handleDelete(scope.row.id)" v-hasPermi="['mpk:icon:delete']"> + <Icon icon="ep:delete"/>删除 + </el-button> + </div> + </template> + </el-table-column> + </el-table> + <!-- 分页 --> + <Pagination + v-model:limit="queryParams.pageSize" + v-model:page="queryParams.page" + :total="total" + @pagination="getList" + /> + </ContentWrap> + + <!-- 表单弹窗:添加/修改 --> + <IconForm ref="formRef" @success="getList" /> +</template> +<script lang="ts" setup> +import {dateFormatter} from '@/utils/formatTime' +import * as MpkIconApi from '@/api/model/mpk/icon' +import IconForm from './IconForm.vue' + +defineOptions({name: 'MpkIcon'}) + +const message = useMessage() // 消息弹窗 +const {t} = useI18n() // 国际化 + +const loading = ref(true) // 列表的加载中 +const total = ref(0) // 列表的总页数 +const list = ref([]) // 字典表格数据 +const queryParams = reactive({ + page: 1, + pageSize: 10, + iconName: '' +}) +const queryFormRef = ref() // 搜索的表单 + +const getList = async () => { + loading.value = true + try { + const data = await MpkIconApi.getPage(queryParams) + list.value = data.list + total.value = data.total + } finally { + loading.value = false + } +} + +/** 搜索按钮操作 */ +const handleQuery = () => { + getList() +} + +/** 重置按钮操作 */ +const resetQuery = () => { + queryParams.page = 1 + queryFormRef.value.resetFields() + handleQuery() +} + +/** 添加/修改操作 */ +const formRef = ref() +const openForm = (type: string, id?: string) => { + formRef.value.open(type, id) +} + +/** 删除按钮操作 */ +const handleDelete = async (id: string) => { + try { + // 删除的二次确认 + await message.delConfirm() + // 发起删除 + await MpkIconApi.deleteIcon(id) + message.success(t('common.delSuccess')) + // 刷新列表 + await getList() + } catch { + } +} + +/** 初始化 **/ +onMounted(async () => { + await getList() +}) +</script> diff --git a/src/views/model/mpk/menu/MenuForm.vue b/src/views/model/mpk/menu/MenuForm.vue new file mode 100644 index 0000000..55f58d9 --- /dev/null +++ b/src/views/model/mpk/menu/MenuForm.vue @@ -0,0 +1,102 @@ +<template> + <Dialog v-model="dialogVisible" :title="dialogTitle"> + <el-form + ref="formRef" + v-loading="formLoading" + :model="formData" + :rules="formRules" + label-width="80px" + > + <el-form-item label="图标名称" prop="iconName"> + <el-input v-model="formData.iconName" placeholder="请输入图标名称" /> + </el-form-item> + <el-form-item label="图标描述" prop="iconDesc"> + <el-input v-model="formData.iconDesc" placeholder="请输入图标描述" /> + </el-form-item> + <el-form-item label="排序" prop="sort"> + <el-input v-model="formData.sort" placeholder="请输入排序" /> + </el-form-item> + + </el-form> + <template #footer> + <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button> + <el-button @click="dialogVisible = false">取 消</el-button> + </template> + </Dialog> +</template> +<script lang="ts" setup> +import * as MpkMenuApi from '@/api/model/mpk/menu' + +defineOptions({ name: 'MpkMenuForm' }) + +const { t } = useI18n() // 国际化 +const message = useMessage() // 消息弹窗 + +const dialogVisible = ref(false) // 弹窗的是否展示 +const dialogTitle = ref('') // 弹窗的标题 +const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用 +const formType = ref('') // 表单的类型:create - 新增;update - 修改 +const formData = ref({ + id: undefined, + name: '', + sort: undefined +}) +const formRules = reactive({ + name: [{ required: true, message: '名称不能为空', trigger: 'blur' }] +}) +const formRef = ref() // 表单 Ref + +/** 打开弹窗 */ +const open = async (type: string, id?: number) => { + dialogVisible.value = true + dialogTitle.value = t('action.' + type) + formType.value = type + resetForm() + // 修改时,设置数据 + if (id) { + formLoading.value = true + try { + formData.value = await MpkMenuApi.getMenu(id) + } finally { + formLoading.value = false + } + } +} +defineExpose({ open }) // 提供 open 方法,用于打开弹窗 + +/** 提交表单 */ +const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调 +const submitForm = async () => { + // 校验表单 + if (!formRef) return + const valid = await formRef.value.validate() + if (!valid) return + // 提交请求 + formLoading.value = true + try { + const data = formData.value as MpkMenuApi.MpkMenuVO + if (formType.value === 'create') { + await MpkMenuApi.createMenu(data) + message.success(t('common.createSuccess')) + } else { + await MpkMenuApi.updateMenu(data) + message.success(t('common.updateSuccess')) + } + dialogVisible.value = false + // 发送操作成功的事件 + emit('success') + } finally { + formLoading.value = false + } +} + +/** 重置表单 */ +const resetForm = () => { + formData.value = { + id: undefined, + name: '', + sort: undefined + } + formRef.value?.resetFields() +} +</script> diff --git a/src/views/model/mpk/menu/group/GroupForm.vue b/src/views/model/mpk/menu/group/GroupForm.vue new file mode 100644 index 0000000..ab2e5b2 --- /dev/null +++ b/src/views/model/mpk/menu/group/GroupForm.vue @@ -0,0 +1,99 @@ +<template> + <Dialog v-model="dialogVisible" :title="dialogTitle"> + <el-form + ref="formRef" + v-loading="formLoading" + :model="formData" + :rules="formRules" + label-width="80px" + > + <el-form-item label="分组名称" prop="name"> + <el-input v-model="formData.name" placeholder="请输入分组名称" /> + </el-form-item> + <el-form-item label="排序" prop="sort"> + <el-input v-model="formData.sort" placeholder="请输入排序" /> + </el-form-item> + + </el-form> + <template #footer> + <el-button :disabled="formLoading" type="primary" @click="submitForm">确 定</el-button> + <el-button @click="dialogVisible = false">取 消</el-button> + </template> + </Dialog> +</template> +<script lang="ts" setup> +import * as MpkGroupApi from '@/api/model/mpk/group' + +defineOptions({ name: 'MpkGroupForm' }) + +const { t } = useI18n() // 国际化 +const message = useMessage() // 消息弹窗 + +const dialogVisible = ref(false) // 弹窗的是否展示 +const dialogTitle = ref('') // 弹窗的标题 +const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用 +const formType = ref('') // 表单的类型:create - 新增;update - 修改 +const formData = ref({ + id: undefined, + name: '', + sort: undefined +}) +const formRules = reactive({ + name: [{ required: true, message: '名称不能为空', trigger: 'blur' }] +}) +const formRef = ref() // 表单 Ref + +/** 打开弹窗 */ +const open = async (type: string, id?: number) => { + dialogVisible.value = true + dialogTitle.value = t('action.' + type) + formType.value = type + resetForm() + // 修改时,设置数据 + if (id) { + formLoading.value = true + try { + formData.value = await MpkGroupApi.getGroup(id) + } finally { + formLoading.value = false + } + } +} +defineExpose({ open }) // 提供 open 方法,用于打开弹窗 + +/** 提交表单 */ +const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调 +const submitForm = async () => { + // 校验表单 + if (!formRef) return + const valid = await formRef.value.validate() + if (!valid) return + // 提交请求 + formLoading.value = true + try { + const data = formData.value as MpkGroupApi.MpkGroupVO + if (formType.value === 'create') { + await MpkGroupApi.createGroup(data) + message.success(t('common.createSuccess')) + } else { + await MpkGroupApi.updateGroup(data) + message.success(t('common.updateSuccess')) + } + dialogVisible.value = false + // 发送操作成功的事件 + emit('success') + } finally { + formLoading.value = false + } +} + +/** 重置表单 */ +const resetForm = () => { + formData.value = { + id: undefined, + name: '', + sort: undefined + } + formRef.value?.resetFields() +} +</script> diff --git a/src/views/model/mpk/menu/group/index.vue b/src/views/model/mpk/menu/group/index.vue new file mode 100644 index 0000000..30fcf85 --- /dev/null +++ b/src/views/model/mpk/menu/group/index.vue @@ -0,0 +1,164 @@ +<template> + <el-drawer + v-model="drawer" + size="40%" + title="分组列表" + :direction="direction" + :before-close="handleClose" + > + <!-- 搜索工作栏 --> + <ContentWrap> + <el-form + class="-mb-15px" + :model="queryParams" + ref="queryFormRef" + :inline="true" + label-width="68px" + > + <el-form-item label="模型名称" prop="iconName"> + <el-input + v-model="queryParams.iconName" + placeholder="请输入名称" + clearable + class="!w-240px" + /> + </el-form-item> + <el-form-item> + <el-button @click="handleQuery"> + <Icon icon="ep:search" class="mr-5px"/> + 搜索 + </el-button> + <el-button @click="resetQuery"> + <Icon icon="ep:refresh" class="mr-5px"/> + 重置 + </el-button> + <el-button + type="primary" + plain + @click="openForm('create')" + v-hasPermi="['mpk:menu:create']" + > + <Icon icon="ep:plus" class="mr-5px" /> + 新增 + </el-button> + + </el-form-item> + </el-form> + </ContentWrap> + + <!-- 列表 --> + <ContentWrap> + <el-table + v-loading="loading" + :data="list" + row-key="id" + > + <el-table-column prop="name" label="名称"/> + <el-table-column prop="sort" label="排序"/> + <el-table-column label="操作" align="center" width="200px"> + <template #default="scope"> + <div class="flex items-center justify-center"> + <el-button + link + type="primary" + @click="openForm('update', scope.row.id)" + v-hasPermi="['mpk:menu:update']" + > + 编辑 + </el-button> + <el-button link type="danger" @click="handleDelete(scope.row.id)" v-hasPermi="['mpk:menu:delete']"> + <Icon icon="ep:delete"/>删除 + </el-button> + </div> + </template> + </el-table-column> + </el-table> + </ContentWrap> + + <!-- 表单弹窗:添加/修改 --> + <GroupForm ref="formRef" @success="getList" /> + </el-drawer> +</template> +<script lang="ts" setup> +import {dateFormatter} from '@/utils/formatTime' +import * as MpkGroupApi from '@/api/model/mpk/group' +import GroupForm from './GroupForm.vue' +import type {DrawerProps} from "element-plus"; + +defineOptions({name: 'MpkGroup'}) + +const message = useMessage() // 消息弹窗 +const {t} = useI18n() // 国际化 + +const drawer = ref(false) +const direction = ref<DrawerProps['direction']>('rtl') +const loading = ref(true) // 列表的加载中 +const list = ref([]) // 字典表格数据 +const queryParams = reactive({ + menuId: '', + name: '' +}) +const queryFormRef = ref() // 搜索的表单 + +const getList = async () => { + loading.value = true + try { + const data = await MpkGroupApi.getList(queryParams) + list.value = data.list + } finally { + loading.value = false + } +} + +/** 搜索按钮操作 */ +const handleQuery = () => { + getList() +} + +/** 重置按钮操作 */ +const resetQuery = () => { + queryFormRef.value.resetFields() + handleQuery() +} + +/** 添加/修改操作 */ +const formRef = ref() +const openForm = (type: string, id?: string) => { + formRef.value.open(type, id) +} + +/** 删除按钮操作 */ +const handleDelete = async (id: string) => { + try { + // 删除的二次确认 + await message.delConfirm() + // 发起删除 + await MpkGroupApi.deleteGroup(id) + message.success(t('common.delSuccess')) + // 刷新列表 + await getList() + } catch { + } +} + +/** 打开弹窗 */ +const open = async (menuId?: string) => { + resetForm() + drawer.value = true + queryParams.menuId = menuId + if (menuId) { + getList() + } +} +defineExpose({open}) // 提供 open 方法,用于打开弹窗 + +/** 重置表单 */ +const resetForm = () => { + queryParams.menuId = '' + queryParams.name = '' +} + +const handleClose = (done: () => void) => { + drawer.value = false +} +</script> diff --git a/src/views/model/mpk/menu/index.vue b/src/views/model/mpk/menu/index.vue new file mode 100644 index 0000000..91fb49f --- /dev/null +++ b/src/views/model/mpk/menu/index.vue @@ -0,0 +1,155 @@ +<template> + <!-- 搜索工作栏 --> + <ContentWrap> + <el-form + class="-mb-15px" + :model="queryParams" + ref="queryFormRef" + :inline="true" + label-width="68px" + > + <el-form-item label="模型名称" prop="iconName"> + <el-input + v-model="queryParams.iconName" + placeholder="请输入名称" + clearable + class="!w-240px" + /> + </el-form-item> + <el-form-item> + <el-button @click="handleQuery"> + <Icon icon="ep:search" class="mr-5px"/> + 搜索 + </el-button> + <el-button @click="resetQuery"> + <Icon icon="ep:refresh" class="mr-5px"/> + 重置 + </el-button> + <el-button + type="primary" + plain + @click="openForm('create')" + v-hasPermi="['mpk:menu:create']" + > + <Icon icon="ep:plus" class="mr-5px" /> + 新增 + </el-button> + + </el-form-item> + </el-form> + </ContentWrap> + + <!-- 列表 --> + <ContentWrap> + <el-table + v-loading="loading" + :data="list" + row-key="id" + > + <el-table-column prop="name" label="名称"/> + <el-table-column prop="sort" label="排序"/> + <el-table-column label="操作" align="center" width="200px"> + <template #default="scope"> + <div class="flex items-center justify-center"> + <el-button + link + type="primary" + @click="openForm('update', scope.row.id)" + v-hasPermi="['mpk:menu:update']" + > + 编辑 + </el-button> + <el-button + link + type="primary" + @click="openGroupList(scope.row.id)" + v-hasPermi="['mpk:menu:update']" + > + 分组 + </el-button> + <el-button link type="danger" @click="handleDelete(scope.row.id)" v-hasPermi="['mpk:menu:delete']"> + <Icon icon="ep:delete"/>删除 + </el-button> + </div> + </template> + </el-table-column> + </el-table> + </ContentWrap> + + <!-- 表单弹窗:添加/修改 --> + <MenuForm ref="formRef" @success="getList" /> + + <!-- 分组列表 --> + <GroupList ref="listRef" /> + +</template> +<script lang="ts" setup> +import {dateFormatter} from '@/utils/formatTime' +import * as MpkMenuApi from '@/api/model/mpk/menu' +import MenuForm from './MenuForm.vue' +import GroupList from './group/index.vue' + +defineOptions({name: 'MpkMenu'}) + +const message = useMessage() // 消息弹窗 +const {t} = useI18n() // 国际化 + +const loading = ref(true) // 列表的加载中 +const list = ref([]) // 字典表格数据 +const queryParams = reactive({ + name: '' +}) +const queryFormRef = ref() // 搜索的表单 + +const getList = async () => { + loading.value = true + try { + const data = await MpkMenuApi.getList(queryParams) + list.value = data.list + } finally { + loading.value = false + } +} + +/** 搜索按钮操作 */ +const handleQuery = () => { + getList() +} + +/** 重置按钮操作 */ +const resetQuery = () => { + queryFormRef.value.resetFields() + handleQuery() +} + +/** 添加/修改操作 */ +const formRef = ref() +const openForm = (type: string, id?: string) => { + formRef.value.open(type, id) +} + +/** 删除按钮操作 */ +const handleDelete = async (id: string) => { + try { + // 删除的二次确认 + await message.delConfirm() + // 发起删除 + await MpkMenuApi.deleteMenu(id) + message.success(t('common.delSuccess')) + // 刷新列表 + await getList() + } catch { + } +} + +/** List操作 */ +const listRef = ref() +const openGroupList = (id?: string) => { + listRef.value.open(id) +} + +/** 初始化 **/ +onMounted(async () => { + await getList() +}) +</script> diff --git a/src/views/model/mpk/project/ProjectForm.vue b/src/views/model/mpk/project/ProjectForm.vue index 37fee70..359a08d 100644 --- a/src/views/model/mpk/project/ProjectForm.vue +++ b/src/views/model/mpk/project/ProjectForm.vue @@ -40,8 +40,8 @@ </Dialog> </template> <script lang="ts" setup> - import * as ProjectApi from '@/api/mpk/project' - import * as MpkApi from '@/api/mpk/mpk' + import * as ProjectApi from '@/api/model/mpk/project' + import * as MpkApi from '@/api/model/mpk/mpk' import {FormRules} from 'element-plus' diff --git a/src/views/model/mpk/project/ProjectPackage.vue b/src/views/model/mpk/project/ProjectPackage.vue index 86f3d77..2acce8f 100644 --- a/src/views/model/mpk/project/ProjectPackage.vue +++ b/src/views/model/mpk/project/ProjectPackage.vue @@ -30,7 +30,7 @@ </Dialog> </template> <script lang="ts" setup> - import * as ProjectApi from '@/api/mpk/project' + import * as ProjectApi from '@/api/model/mpk/project' import download from "@/utils/download"; import {FormRules} from "element-plus"; import {formatToDateString} from "@/utils/dateUtil"; diff --git a/src/views/model/mpk/project/ProjectPackageHistory.vue b/src/views/model/mpk/project/ProjectPackageHistory.vue index 8548540..b276e16 100644 --- a/src/views/model/mpk/project/ProjectPackageHistory.vue +++ b/src/views/model/mpk/project/ProjectPackageHistory.vue @@ -84,8 +84,8 @@ </template> <script lang="ts" setup> import download from "@/utils/download"; - import * as PackageHistoryApi from '@/api/mpk/projectPackageHistory' - import * as ProjectApi from '@/api/mpk/project' + import * as PackageHistoryApi from '@/api/model/mpk/projectPackageHistory' + import * as ProjectApi from '@/api/model/mpk/project' import {dateFormatter} from '@/utils/formatTime' import PackageModel from './ProjectPackageModelDialog.vue' diff --git a/src/views/model/mpk/project/ProjectPackageModelDialog.vue b/src/views/model/mpk/project/ProjectPackageModelDialog.vue index a9d7f10..22adf65 100644 --- a/src/views/model/mpk/project/ProjectPackageModelDialog.vue +++ b/src/views/model/mpk/project/ProjectPackageModelDialog.vue @@ -58,8 +58,8 @@ </template> <script lang="ts" setup> import download from "@/utils/download"; - import * as projectHistoryApi from '@/api/mpk/projectPackageHistory' - import * as projectApi from '@/api/mpk/project' + import * as projectHistoryApi from '@/api/model/mpk/projectPackageHistory' + import * as projectApi from '@/api/model/mpk/project' import { dateFormatter } from '@/utils/formatTime' import { DICT_TYPE, getDictLabel } from '@/utils/dict' diff --git a/src/views/model/mpk/project/index.vue b/src/views/model/mpk/project/index.vue index 96762de..eb1aa63 100644 --- a/src/views/model/mpk/project/index.vue +++ b/src/views/model/mpk/project/index.vue @@ -129,7 +129,7 @@ </template> <script lang="ts" setup> import {dateFormatter} from '@/utils/formatTime' - import * as ProjectApi from '@/api/mpk/project' + import * as ProjectApi from '@/api/model/mpk/project' import ProjectForm from './ProjectForm.vue' import ProjectPackage from './ProjectPackage.vue' import RelevanceModel from './ProjectPackageModelDialog.vue' diff --git a/src/views/mpk/MpkForm.vue b/src/views/mpk/MpkForm.vue deleted file mode 100644 index 0bae832..0000000 --- a/src/views/mpk/MpkForm.vue +++ /dev/null @@ -1,464 +0,0 @@ -<template> - <div class="p-16px" style="background-color: #ffffff"> - <el-header> - {{title}} - </el-header> - <el-main> - <el-form - ref="formRef" - v-loading="formLoading" - :model="formData" - :rules="formRules" - label-width="120px" - > - <el-divider content-position="left">模型信息</el-divider> - <el-row :gutter="8"> - <el-col :span="20"> - <el-form-item label="模型名称" prop="pyName"> - <el-input disabled v-model="formData.pyName" placeholder=""/> - </el-form-item> - </el-col> - <el-col :span="4"> - <el-upload - ref="uploadRef" - v-model:file-list="fileList" - :show-file-list="false" - :action="importUrl" - :auto-upload="true" - :disabled="uploadLoading" - :before-upload="beforeUpload" - :headers="uploadHeaders" - :on-error="submitFormError" - :on-success="submitFormSuccess" - accept=".pyd" - > - <el-button type="primary"> - <Icon icon="ep:upload"/> - 模型上传 - </el-button> - </el-upload> - </el-col> - </el-row> - <el-row :gutter="8"> - <el-col :span="12"> - <el-form-item label="模型中文名称" prop="pyChineseName"> - <el-input v-model="formData.pyChineseName" placeholder=""/> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="模型类型" prop="pyType"> - <el-select - v-model="formData.pyType" - placeholder="请选择" - @change="pyTypeChange" - > - <el-option - v-for="dict in getDictOptions(DICT_TYPE.MODEL_TYPE)" - :key="dict.value" - :label="dict.label" - :value="dict.value" - /> - </el-select> - </el-form-item> - </el-col> - </el-row> - <el-row :gutter="8"> - <el-col :span="12"> - <el-form-item label="包名" prop="pkgName"> - <el-input v-model="formData.pkgName" placeholder=""/> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="模型路径" prop="pyModule"> - <el-input v-model="formData.pyModule" placeholder=""/> - </el-form-item> - </el-col> - </el-row> - <el-row :gutter="8"> - <el-col :span="12"> - <el-form-item label="所属菜单" prop="menuName"> - <el-input v-model="formData.menuName" placeholder=""/> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="所属组" prop="groupName"> - <el-input v-model="formData.groupName" placeholder=""/> - </el-form-item> - </el-col> - </el-row> - <el-row :gutter="8"> - <el-col :span="12"> - <el-form-item label="icon" prop="icon"> - <el-input v-model="formData.icon" placeholder=""/> - </el-form-item> - </el-col> - </el-row> - <el-row :gutter="20"> - <el-col :span="24"> - <el-form-item label="备注" prop="remark"> - <el-input v-model="formData.remark" placeholder="" type="textarea"/> - </el-form-item> - </el-col> - </el-row> - <el-divider content-position="left">模型方法</el-divider> - <el-row :gutter="20"> - <el-col :span="4"> - <el-button type="primary" size="small" @click="addRow()" >新增</el-button> - </el-col> - </el-row> - <el-table :data="formData.modelMethods" border - @expand-change="methodExpandChange" :expand-row-keys="methodExpandedRowKeys" :row-key="row => row.id"> - <el-table-column - prop="" - label="方法名" - align="center" - width="250"> - <template #default="scope"> - <el-input size="small" v-model="scope.row.methodName" placeholder=""/> - </template> - </el-table-column> - <el-table-column - prop="" - label="输入个数" - align="center"> - <template #default="scope"> - <el-input-number size="small" step-strictly v-model="scope.row.dataLength" :min="1" - :max="50"/> - </template> - </el-table-column> - <el-table-column - prop="" - label="是否有model" - align="center"> - <template #default="scope"> - <el-switch size="small" v-model="scope.row.model" :active-value="1" - :inactive-value="0"/> - </template> - </el-table-column> - <el-table-column - prop="" - label="结果key" - align="center"> - <template #default="scope"> - <el-input size="small" v-model="scope.row.resultKey"/> - </template> - </el-table-column> - <el-table-column label="方法参数" type="expand" width="100px"> - <template #default="props"> - <div class="m-16px"> - <el-button type="primary" size="small" @click="addSetting(props.row.methodSettings)">新增参数</el-button> - <el-table :data="props.row.methodSettings" border size="small"> - <el-table-column align="center" label="key" prop="settingKey"/> - <el-table-column align="center" label="参数名称" prop="name"/> - <el-table-column align="center" label="参数默认值" prop="value"/> - <el-table-column align="center" label="输入类型" prop="type"> - <template #default="props"> - <div class="flex file-row justify-center items-center"> - {{props.row.type}} - <div class="ml-8px" v-if="props.row.type === 'select'"> - <el-popover placement="left" :width="400"> - <template #reference> - <el-button size="small" link type="primary"> - <Icon icon="ep:more" /> - </el-button> - </template> - <el-table width="50%" :data="props.row.settingSelects" border size="small"> - <el-table-column align="center" label="key" prop="selectKey"/> - <el-table-column align="center" label="name" prop="name"/> - </el-table> - </el-popover> - </div> - </div> - </template> - </el-table-column> - <el-table-column align="center" label="参数类型" prop="valueType"/> - <el-table-column align="center" label="最大值" prop="max"/> - <el-table-column align="center" label="最小值" prop="min"/> - <!-- <el-table-column align="center" label="选项" width="50">--> - <!-- <template #default="props">--> - <!-- <div v-if="props.row.type === 'select'">--> - <!-- <el-popover placement="left" :width="400">--> - <!-- <template #reference>--> - <!-- <Icon icon="ep:more" />--> - <!-- </template>--> - <!-- <el-table width="50%" :data="props.row.settingSelects" border size="small">--> - <!-- <el-table-column align="center" label="key" prop="selectKey"/>--> - <!-- <el-table-column align="center" label="name" prop="name"/>--> - <!-- </el-table>--> - <!-- </el-popover>--> - <!-- </div>--> - <!-- </template>--> - <!-- </el-table-column>--> - <el-table-column label="操作" fixed="right" header-align="center" align="center" width="100"> - <template #default="scope"> - <el-button - @click="updateSetting(scope.row)" - key="danger" - type="danger" - link - >修改 - </el-button> - <el-button - @click="deleteSetting(props.row.methodSettings,scope.$index)" - key="danger" - type="danger" - link - >删除 - </el-button> - </template> - </el-table-column> - </el-table> - </div> - </template> - </el-table-column> - <el-table-column label="操作" fixed="right" header-align="center" align="center" width="100"> - <template #default="scope"> - <el-button - @click="deleteRow(scope.$index)" - key="danger" - type="danger" - link - >删除 - </el-button> - </template> - </el-table-column> - </el-table> - </el-form> - </el-main> - <el-footer> - <div class="flex flex-row justify-end items-center"> - <el-button type="primary" @click="submitForm">确 定</el-button> - </div> - </el-footer> - </div> - <SettingForm ref="settingFormRef"/> -</template> -<script lang="ts" setup> - import {DICT_TYPE, getDictOptions} from '@/utils/dict' - import * as MpkApi from '@/api/mpk/mpk' - import {FormRules} from 'element-plus' - import {getAccessToken, getTenantId} from "@/utils/auth"; - import SettingForm from './SettingForm.vue' - import {generateUUID} from "@/utils"; - - const {t} = useI18n() // 国际化 - const message = useMessage() // 消息弹窗 - const title = ref('') // 弹窗的标题 - const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用 - const formType = ref('') // 表单的类型:create - 新增;update - 修改 - const route = useRoute() // 路由 - const router = useRouter(); - - /** settingForm弹窗 */ - const settingFormRef = ref() - // 添加setting - const addSetting = (methodSettings) => { - settingFormRef.value.open(undefined,methodSettings) - } - - // 修改setting - const updateSetting = (info) => { - settingFormRef.value.open(info) - } - - const methodExpandedRowKeys = ref([]) - const methodExpandChange = async (row: any, expandedRows: any[]) => { - methodExpandedRowKeys.value = expandedRows.map(e => e.id) - } - - const formData = ref({ - id: route.params.id, - pyChineseName: undefined, - pyName: undefined, - pkgName: undefined, - pyType: undefined, - className: undefined, - pyModule: undefined, - icon: undefined, - menuName: undefined, - groupName: undefined, - remark: undefined, - modelMethods: [], - filePath: undefined, - }) - - const formRules = reactive<FormRules>({ - pyName: [ - {required: true, message: '模型名称不能为空,请上传模型文件', trigger: 'blur'} - ], - pyChineseName: [ - {required: true, message: '模型中文名称不能为空', trigger: 'blur'} - ], - pyType: [ - {required: true, message: '模型类型不能为空', trigger: 'blur'} - ], - pkgName: [ - {required: true, message: '包名不能为空', trigger: 'blur'} - ], - className: [ - {required: true, message: '类名不能为空', trigger: 'blur'} - ], - pyModule: [ - {required: true, message: '模型路径不能为空', trigger: 'blur'} - ], - menuName: [ - {required: true, message: '所属目录不能为空', trigger: 'blur'} - ], - }) - - const formRef = ref() // 表单 Ref - - /** 提交表单 */ - const submitForm = async () => { - // 校验表单 - if (!formRef) return - const valid = await formRef.value.validate() - if (!valid) return - // 模型方法校验 - if (formData.value.modelMethods?.length <= 0) { - message.error('模型方法为空') - return - } - // 模型方法名称校验 - if (formData.value.modelMethods.some(e => e.methodName === undefined || e.methodName === '' || e.dataLength === undefined || e.dataLength === null)) { - message.error('存在不合法模型方法名') - return - } - // 提交请求 - formLoading.value = true - try { - const data = formData.value as unknown as MpkApi.MpkVO - if (formType.value === 'create') { - await MpkApi.createMpk(data) - message.success(t('common.createSuccess')) - } else { - await MpkApi.updateMpk(data) - message.success(t('common.updateSuccess')) - } - } finally { - formLoading.value = false - } - // router.push({path:'/model/mpk'}) - router.back() - } - - /** 重置表单 */ - const resetForm = () => { - formData.value = { - id: undefined, - pyName: undefined, - pyChineseName: undefined, - pkgName: undefined, - pyType: undefined, - className: undefined, - pyModule: undefined, - icon: undefined, - menuName: undefined, - groupName: undefined, - remark: undefined, - modelMethods: [], - filePath: undefined - } - formRef.value?.resetFields() - } - - const addRow = function () { - formData.value.modelMethods.push({ - id: generateUUID(), - methodName: undefined, - dataLength: 1, - model: 0, - resultKey: undefined, - methodSettings: [] - }) - } - const deleteRow = function (index) { - formData.value.modelMethods.splice(index, 1) - } - - const fileList = ref([]) // 文件列表 - const importUrl = import.meta.env.VITE_BASE_URL + import.meta.env.VITE_API_URL + '/model/mpk/file/upload' - const uploadLoading = ref(false) // 表单的加载中 - const uploadHeaders = ref() // 上传 Header 头 - const beforeUpload = function (file) { - // 提交请求 - uploadHeaders.value = { - Authorization: 'Bearer ' + getAccessToken(), - 'tenant-id': getTenantId() - } - uploadLoading.value = true - return true; - } - const submitFormError = (): void => { - message.error('上传失败!') - uploadLoading.value = false - } - const submitFormSuccess = (response: any) => { - if (response.code !== 0) { - message.error(response.msg) - uploadLoading.value = false - return - } - const data = response.data; - formData.value.filePath = data.filePath - formData.value.pyName = data.fileName.replace('.pyd', '') - message.success('上传成功') - uploadLoading.value = false - } - - onMounted(async () => { - const id = formData.value.id; - const type = id ? 'edit' : 'create' - title.value = t('action.' + type) - formType.value = type - resetForm() - // 修改时,设置数据 - if (id) { - formLoading.value = true - try { - formData.value = await MpkApi.getMpk(id) - } finally { - formLoading.value = false - } - } - }) - - const pyTypeChange = () => { - if (formData.value.pyType === 'predict') { - formData.value.modelMethods = [ - { - id: generateUUID(), - methodName: 'train', - dataLength: 1, - model: 0, - resultKey: undefined, - methodSettings: [] - }, - { - - id: generateUUID(), - methodName: 'predict', - dataLength: 1, - model: 1, - resultKey: undefined, - methodSettings: [] - } - ] - debugger - }else { - formData.value.modelMethods = [ - { - id: generateUUID(), - methodName: 'schedul', - dataLength: 1, - model: 0, - resultKey: undefined, - methodSettings: [] - } - ] - } - } -</script> - -<style scoped lang="scss"> -</style> diff --git a/src/views/mpk/MpkGenerator.vue b/src/views/mpk/MpkGenerator.vue deleted file mode 100644 index 07ccef1..0000000 --- a/src/views/mpk/MpkGenerator.vue +++ /dev/null @@ -1,49 +0,0 @@ -<template> - <Dialog v-model="dialogVisible" :title="dialogTitle"> - <el-input - type="textarea" - :rows="4" - placeholder="备注" - v-model="remark"/> - <div style="width: 100%;display: flex;flex-direction: row;justify-content: end;margin-top: 16px"> - <el-button @click="generatorCode()" type="primary">生成</el-button> - </div> - </Dialog> -</template> -<script lang="ts" setup> - import * as MpkApi from '@/api/mpk/mpk' - import download from "@/utils/download"; - import {formatToDateString} from "@/utils/dateUtil"; - - - const { t } = useI18n() // 国际化 - const message = useMessage() // 消息弹窗 - - const dialogVisible = ref(false) // 弹窗的是否展示 - const dialogTitle = ref('生成代码') // 弹窗的标题 - - const remark = ref('') - const id = ref() - const zipFileName = ref() - - /** 打开弹窗 */ - const open = async (modelId: string,pyName: string) => { - dialogVisible.value = true - id.value = modelId; - zipFileName.value = pyName + '_' + formatToDateString(new Date()) + '.zip'; - remark.value = ""; - } - defineExpose({ open }) // 提供 open 方法,用于打开弹窗 - - /** 提交表单 */ - const generatorCode = async () => { - const param = { - 'id': id.value, - 'remark': remark.value, - 'zipFileName': zipFileName.value - } - const data = await MpkApi.generatorCode(param) - download.zip(data, zipFileName.value) - dialogVisible.value = false - } -</script> diff --git a/src/views/mpk/MpkGeneratorHistory.vue b/src/views/mpk/MpkGeneratorHistory.vue deleted file mode 100644 index fb79acc..0000000 --- a/src/views/mpk/MpkGeneratorHistory.vue +++ /dev/null @@ -1,109 +0,0 @@ -<template> - <Dialog v-model="dialogVisible" :title="dialogTitle" width="80%"> - <!-- 搜索工作栏 --> - <ContentWrap> - <el-form - class="-mb-15px" - :model="queryParams" - ref="queryFormRef" - :inline="true" - label-width="68px" - > - <el-form-item prop="startTime"> - <el-date-picker - v-model="queryParams.startTime" - type="datetime" - value-format="YYYY-MM-DD HH:mm:ss" - placeholder="选择日期时间"/> - </el-form-item> - <el-form-item prop="endTime"> - <el-date-picker - v-model="queryParams.endTime" - type="datetime" - value-format="YYYY-MM-DD HH:mm:ss" - placeholder="选择日期时间"/> - </el-form-item> - <el-form-item> - <el-button @click="getList"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button> - </el-form-item> - </el-form> - </ContentWrap> - - <!-- 列表 --> - <ContentWrap> - <el-table - v-loading="loading" - :data="list" - row-key="id" - border - > - <el-table-column label="文件名" header-align="center" align="center"> - <template #default="scope"> - <a style="cursor: pointer;color: #409eff" @click="downloadHistory(scope.row.id,scope.row.fileName)">{{ scope.row.fileName }}</a> - </template> - </el-table-column> - <el-table-column prop="remark" label="备注" header-align="center" align="center"/> - <el-table-column prop="createTime" label="生成时间" :formatter="dateFormatter" header-align="center" align="center" width="200"/> - </el-table> - <!-- 分页 --> - <Pagination - v-model:limit="queryParams.pageSize" - v-model:page="queryParams.page" - :total="total" - @pagination="getList" - /> - </ContentWrap> - </Dialog> -</template> -<script lang="ts" setup> - import download from "@/utils/download"; - import * as HistoryApi from "@/api/mpk/mpkHistory"; - import { dateFormatter } from '@/utils/formatTime' - - - const { t } = useI18n() // 国际化 - const message = useMessage() // 消息弹窗 - - const dialogVisible = ref(false) // 弹窗的是否展示 - const dialogTitle = ref('生成历史') // 弹窗的标题 - - const loading = ref(true) // 列表的加载中 - const total = ref(0) // 列表的总页数 - const list = ref([]) // 字典表格数据 - const queryParams = reactive({ - page: 1, - pageSize: 10, - mdkId: '', - startTime: undefined, - endTime: undefined, - }) - - /** 打开弹窗 */ - const open = async (mdkId: String) => { - dialogVisible.value = true - queryParams.mdkId = mdkId; - queryParams.startTime = undefined; - queryParams.endTime = undefined; - getList() - } - defineExpose({ open }) // 提供 open 方法,用于打开弹窗 - - const getList = async () => { - loading.value = true - try { - const data = await HistoryApi.getPage(queryParams) - list.value = data.list - total.value = data.total - } finally { - loading.value = false - } - } - - const downloadHistory = async (id,fileName) => { - const param = { - 'id': id, - } - const data = await HistoryApi.download(param) - download.zip(data, fileName) - } -</script> diff --git a/src/views/mpk/MpkRun.vue b/src/views/mpk/MpkRun.vue deleted file mode 100644 index 2a5f7f2..0000000 --- a/src/views/mpk/MpkRun.vue +++ /dev/null @@ -1,243 +0,0 @@ -<template> - <Dialog v-model="dialogVisible" :title="dialogTitle"> - <el-form - class="-mb-15px" - :model="formData" - ref="formRef" - :inline="true" - :rules="formRules" - label-width="68px" - v-loading="formLoading" - > - <el-form-item style="width: 100%"> - <el-divider content-position="left">模型信息</el-divider> - </el-form-item> - <el-form-item label="全类名" style="width: 90%" prop="className"> - <el-input v-model="formData.className" placeholder=""/> - </el-form-item> - <el-form-item label="方法名" prop="methodName"> - <el-select v-model="formData.methodName" @change="methodChange" style="width: 240px"> - <el-option - v-for="item in methodList" - :key="item.id" - :label="item.methodName" - :value="item.methodName" - /> - </el-select> - </el-form-item> - <el-divider content-position="left">模型参数信息</el-divider> - <el-row :gutter="20"> - <el-col :span="2" style="margin-bottom: 10px;margin-left: 20px"> - <el-button tag="a" href="/template/模型参数导入模板.xlsx" download="模型参数导入模板.xlsx" style="text-decoration: none;" type="primary" size="small" link>模板下载</el-button> - </el-col> - <el-col :span="2" style="margin-bottom: 10px;"> - <el-upload - ref="uploadRef" - v-model:file-list="fileList" - :show-file-list="false" - :action="importUrl" - :auto-upload="true" - :disabled="formLoading" - :before-upload="beforeUpload" - :headers="uploadHeaders" - :on-error="submitFormError" - :on-success="submitFormSuccess" - accept=".xlsx" - > - <el-button type="primary" size="small" link>参数导入</el-button> - </el-upload> - </el-col> - </el-row> - <el-row v-for="(item,index) in formData.datas" :key="index" :gutter="20"> - <el-col :span="20"> - <el-form-item :label="'参数_' + (index)" required style="width: 100%"> - <el-input v-model="formData.datas[index]" placeholder="" /> - </el-form-item> - </el-col> - </el-row> - <el-row v-if="hasModel" :gutter="20"> - <el-col :span="20"> - <el-form-item label="model" required style="width: 100%"> - <el-input v-model="formData.model" placeholder="" /> - </el-form-item> - </el-col> - </el-row> - <el-divider content-position="left">模型设置信息</el-divider> - <el-row :gutter="20"> - <el-col :span="4"> - <el-button type="primary" size="small" @click="addRow()">新增</el-button> - </el-col> - </el-row> - <el-table :data="formData.modelSettings" border> - <el-table-column - prop="" - label="参数key" - align="center"> - <template #default="scope"> - <el-input size="small" v-model="scope.row.settingKey" maxlength="50" clearable /> - </template> - </el-table-column> - <el-table-column - prop="" - label="参数value" - align="center"> - <template #default="scope"> - <el-input size="small" v-model="scope.row.settingValue" maxlength="50" clearable /> - </template> - </el-table-column> - <el-table-column label="操作" fixed="right" header-align="center" align="center" width="100"> - <template #default="scope"> - <el-button - @click="deleteRow(scope.$index)" - key="danger" - type="danger" - link - >删除</el-button> - </template> - </el-table-column> - </el-table> - <el-divider content-position="left">模型运行结果</el-divider> - <el-input v-model="modelRunResult" placeholder="" rows="4" type="textarea" /> - <div style="display: flex;flex-direction: row;justify-content: end;margin-top: 16px"> - <el-button :loading="modelRunloading" type="primary" @click="modelRun()">运行</el-button> - </div> - </el-form> - </Dialog> -</template> -<script lang="ts" setup> - import * as MpkApi from '@/api/mpk/mpk' - import {FormRules} from "element-plus"; - import {getAccessToken, getTenantId} from "@/utils/auth"; - - const { t } = useI18n() // 国际化 - const message = useMessage() // 消息弹窗 - - const dialogVisible = ref(false) // 弹窗的是否展示 - const dialogTitle = ref('模型运行') // 弹窗的标题 - - const formData = reactive({ - className: '', - methodName: '', - datas: [], - modelSettings: [], - model: undefined - }) - - // 模型方法下拉列表 - const methodList = ref([]) - const hasModel = ref(false) - - /** 打开弹窗 */ - const open = async (row) => { - dialogVisible.value = true - formData.className = row.pkgName + '.impl.' + row.pyName + 'Impl'; - const mpk = await MpkApi.getMpk(row.id) - methodList.value = mpk.modelMethods - formData.methodName = mpk.modelMethods[0].methodName - formData.datas = [] - for (let i = 0 ; i < mpk.modelMethods[0].dataLength ; i++) { - formData.datas[i] = '[[]]' - } - hasModel.value = mpk.modelMethods[0].model === 1 - } - defineExpose({ open }) // 提供 open 方法,用于打开弹窗 - - const formRules = reactive<FormRules>({ - methodName: [ - {required: true, message: '方法名不能为空', trigger: 'blur'} - ], - className: [ - {required: true, message: '全类名不能为空', trigger: 'blur'} - ] - }) - - const addRow = function () { - formData.modelSettings.push({ - settingKey: '', - settingValue: '' - }) - } - const deleteRow = function (index) { - formData.modelSettings.splice(index, 1) - } - const methodChange = function (value) { - formData.datas = [] - for (let i = 0 ; i < methodList.value.find(e => e.methodName === value)?.dataLength ; i++) { - formData.datas[i] = '[[]]' - } - hasModel.value = methodList.value.find(e => e.methodName === value)?.model === 1 - } - - const fileList = ref([]) // 文件列表 - const importUrl = - import.meta.env.VITE_BASE_URL + import.meta.env.VITE_API_URL + '/model/mpk/api/import' - const formLoading = ref(false) // 表单的加载中 - const uploadHeaders = ref() // 上传 Header 头 - /** 上传错误提示 */ - const submitFormError = (): void => { - message.error('导入失败,请检查导入文件!') - formLoading.value = false - } - const submitFormSuccess = (response: any) => { - if (response.code !== 0) { - message.error(response.msg) - formLoading.value = false - return - } - const datas = response.data; - for (let i=0;i<formData.datas.length;i++) { - formData.datas[i] = datas[i] - } - message.success('导入成功') - formLoading.value = false - } - const beforeUpload = function (file) { - // 提交请求 - uploadHeaders.value = { - Authorization: 'Bearer ' + getAccessToken(), - 'tenant-id': getTenantId() - } - formLoading.value = true - return true; - } - - // 模型运行结果 - const modelRunResult = ref('') - // 模型运行loading - const modelRunloading = ref(false) - // 表单 Ref - const formRef = ref() - // 运行 - const modelRun = async () => { -// 校验表单 - if (!formRef) return - const valid = await formRef.value.validate() - if (!valid) return - // 提交请求 - modelRunloading.value = true - try { - const data = { - ...formData - } - - //处理modelSettings - let settingsPredict = {}; - data.modelSettings.forEach(e => { - settingsPredict[e.settingKey] = e.settingValue; - }) - data.modelSettings = settingsPredict - data.hasModel = hasModel.value - if (data.hasModel && data.model) { - data.model = {model_path:data.model} - }else { - data.model = undefined - } - - modelRunResult.value = await MpkApi.modelRun(data) - modelRunloading.value = false - message.success('运行成功') - } finally { - modelRunloading.value = false - } - } -</script> diff --git a/src/views/mpk/ProjectForm.vue b/src/views/mpk/ProjectForm.vue deleted file mode 100644 index 37fee70..0000000 --- a/src/views/mpk/ProjectForm.vue +++ /dev/null @@ -1,153 +0,0 @@ -<template> - <Dialog v-model="dialogVisible" :title="dialogTitle"> - <el-form - ref="formRef" - v-loading="formLoading" - :model="formData" - :rules="formRules" - label-width="80px" - > - <el-row :gutter="20"> - <el-col :span="20"> - <el-form-item label="项目名称" prop="projectName" style="width: 100%"> - <el-input v-model="formData.projectName" placeholder="" style="width: 100%"/> - </el-form-item> - </el-col> - </el-row> - <el-row :gutter="20"> - <el-col :span="20"> - <el-form-item label="项目编码" prop="projectCode" style="width: 100%"> - <el-input v-model="formData.projectCode" placeholder="" style="width: 100%"/> - </el-form-item> - </el-col> - </el-row> - <el-row :gutter="20"> - <el-col> - <el-form-item label="关联模型" prop="models"> - <el-transfer :props="{key: 'id',label: 'pyName'}" :titles="['未选模型', '已选模型']" target-order="unshift" filterable :filter-method="filterMethod" v-model="formData.models" :data="modelList"> - <template #default="{ option }"> - <span :title="option.pyName">{{ option.pyName}}</span> - </template> - </el-transfer> - </el-form-item> - </el-col> - </el-row> - </el-form> - <template #footer> - <el-button type="primary" @click="submitForm">确 定</el-button> - <el-button @click="dialogVisible = false">取 消</el-button> - </template> - </Dialog> -</template> -<script lang="ts" setup> - import * as ProjectApi from '@/api/mpk/project' - import * as MpkApi from '@/api/mpk/mpk' - import {FormRules} from 'element-plus' - - - const {t} = useI18n() // 国际化 - const message = useMessage() // 消息弹窗 - - const dialogVisible = ref(false) // 弹窗的是否展示 - const dialogTitle = ref('') // 弹窗的标题 - const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用 - const formType = ref('') // 表单的类型:create - 新增;update - 修改 - const formData = ref({ - id: undefined, - projectName: undefined, - projectCode: undefined, - }) - - - const formRules = reactive<FormRules>({ - projectName: [ - {required: true, message: '项目名称不能为空', trigger: 'blur'}, - ], - projectCode: [ - {required: true, message: '项目编码不能为空', trigger: 'blur'}, - ], - }) - - const formRef = ref() // 表单 Ref - - /** 打开弹窗 */ - const open = async (type: string, id?: number) => { - dialogVisible.value = true - dialogTitle.value = t('action.' + type) - formType.value = type - getModelList(); - resetForm() - // 修改时,设置数据 - if (id) { - formLoading.value = true - try { - const data = await ProjectApi.getProject(id) - data.models = data.models.map(e => e.id) - formData.value = { - ...data - } - } finally { - formLoading.value = false - } - } - } - defineExpose({open}) // 提供 open 方法,用于打开弹窗 - - /** 提交表单 */ - const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调 - const submitForm = async () => { - // 校验表单 - if (!formRef) return - const valid = await formRef.value.validate() - if (!valid) return - // 提交请求 - formLoading.value = true - try { - const data = { - ...formData.value - } - data.models = data.models.map(e => { - return {id: e} - }) - if (formType.value === 'create') { - await ProjectApi.createProject(data) - message.success(t('common.createSuccess')) - } else { - await ProjectApi.updateProject(data) - message.success(t('common.updateSuccess')) - } - dialogVisible.value = false - // 发送操作成功的事件 - emit('success') - } finally { - formLoading.value = false - } - } - - /** 重置表单 */ - const resetForm = () => { - formData.value = { - id: undefined, - projectName: undefined, - projectCode: undefined, - } - formRef.value?.resetFields() - } - - // 所有模型列表 - const modelList = ref([]) - const getModelList = async () => { - modelList.value = await MpkApi.list() - } - - // 模型筛选 - const filterMethod = function (query, item) { - return item.pyName.toLowerCase().indexOf(query.toLowerCase()) !== -1 - } -</script> - -<style scoped> - :deep(.el-transfer-panel) { - width: 35%; - } -</style> diff --git a/src/views/mpk/ProjectPackage.vue b/src/views/mpk/ProjectPackage.vue deleted file mode 100644 index 86f3d77..0000000 --- a/src/views/mpk/ProjectPackage.vue +++ /dev/null @@ -1,96 +0,0 @@ -<template> - <Dialog v-model="dialogVisible" :title="dialogTitle"> - <el-form - ref="formRef" - v-loading="formLoading" - :model="formData" - :rules="formRules" - label-width="80px" - > - <el-row> - <el-col :span="8"> - <el-form-item label="版本号" prop="version"> - <el-input v-model="formData.version" placeholder="请输入版本号"/> - </el-form-item> - </el-col> - </el-row> - <el-row> - <el-col :span="24"> - <el-form-item label="更新日志" prop="log"> - <el-input type="textarea" :rows="4" placeholder="请输入更新日志" v-model="formData.log"/> - </el-form-item> - </el-col> - </el-row> - <el-row justify="end"> - <el-col :span="3"> - <el-button @click="packageProject()" type="primary">打包</el-button> - </el-col> - </el-row> - </el-form> - </Dialog> -</template> -<script lang="ts" setup> - import * as ProjectApi from '@/api/mpk/project' - import download from "@/utils/download"; - import {FormRules} from "element-plus"; - import {formatToDateString} from "@/utils/dateUtil"; - - - const { t } = useI18n() // 国际化 - const message = useMessage() // 消息弹窗 - - const dialogVisible = ref(false) // 弹窗的是否展示 - const dialogTitle = ref('打包') // 弹窗的标题 - const formLoading = ref(false) // 表单的加载中 - - const formRules = reactive<FormRules>({ - version: [ - {required: true, message: '版本号不能为空', trigger: 'blur'}, - ], - log: [ - {required: true, message: '更新日志不能为空', trigger: 'blur'}, - ] - }) - - const formData = reactive({ - log: undefined, - projectId: undefined, - projectName: undefined, - projectCode: undefined, - ids: undefined, - version: undefined, - }) - - /** 打开弹窗 */ - const open = async (projectId,projectName,projectCode,ids) => { - dialogVisible.value = true - formData.projectId = projectId - formData.projectName = projectName - formData.projectCode = projectCode - formData.ids = ids - formData.log = undefined - formData.version = 'V' - } - defineExpose({ open }) // 提供 open 方法,用于打开弹窗 - - const formRef = ref() // 表单 Ref - /** 提交表单 */ - const packageProject = async () => { - // 校验表单 - try { - if (!formRef) return - const valid = await formRef.value.validate() - if (!valid) return - - formLoading.value = true - formData.zipFileName = 'IAILMPK.' + formData.projectCode + '.' + formatToDateString(new Date()) + '.zip' - const data = await ProjectApi.packageProject(formData) - debugger - download.zip(data, formData.zipFileName) - formLoading.value = false - dialogVisible.value = false - } catch (e) { - formLoading.value = false - } - } -</script> diff --git a/src/views/mpk/ProjectPackageHistory.vue b/src/views/mpk/ProjectPackageHistory.vue deleted file mode 100644 index 8548540..0000000 --- a/src/views/mpk/ProjectPackageHistory.vue +++ /dev/null @@ -1,155 +0,0 @@ -<template> - <ContentWrap> - <el-form - class="-mb-15px" - :model="queryParams" - ref="queryFormRef" - :inline="true" - label-width="68px" - > - <el-form-item label="项目名称" prop="projectId"> - <el-select v-model="queryParams.projectId" class="!w-240px"> - <el-option - v-for="item in projectList" - :key="item.id" - :label="item.projectName" - :value="item.id" - /> - </el-select> - </el-form-item> - <el-form-item label="开始时间" prop="startTime"> - <el-date-picker - v-model="queryParams.startTime" - type="datetime" - value-format="YYYY-MM-DD HH:mm:ss" - placeholder="选择日期时间"/> - </el-form-item> - <el-form-item label="结束时间" prop="endTime"> - <el-date-picker - v-model="queryParams.endTime" - type="datetime" - value-format="YYYY-MM-DD HH:mm:ss" - placeholder="选择日期时间"/> - </el-form-item> - <el-form-item> - <el-button @click="handleQuery"> - <Icon icon="ep:search" class="mr-5px"/> - 搜索 - </el-button> - <el-button @click="resetQuery"> - <Icon icon="ep:refresh" class="mr-5px"/> - 重置 - </el-button> - </el-form-item> - </el-form> - </ContentWrap> - - <!-- 列表 --> - <ContentWrap> - <el-table v-loading="loading" :data="list"> - <el-table-column label="文件名" header-align="center" align="center" width="400"> - <template #default="scope"> - <a style="cursor: pointer;color: #409eff" - @click="downloadHistory(scope.row.filePath,scope.row.fileName)">{{ scope.row.fileName - }}</a> - </template> - </el-table-column> - <el-table-column prop="version" label="版本号" header-align="center" align="center" width="200"/> - <el-table-column prop="log" label="更新日志" header-align="center" align="center"/> - <el-table-column prop="createTime" label="打包时间" :formatter="dateFormatter" header-align="center" align="center" width="200"/> - <el-table-column label="操作" align="center" width="230px"> - <template #default="scope"> - <el-button - link - type="primary" - @click="viewPackageModel(scope.row.id)" - > - <Icon icon="ep:link"/> - 查看关联模型 - </el-button> - </template> - </el-table-column> - - </el-table> - <!-- 分页 --> - <Pagination - :total="total" - v-model:page="queryParams.pageNo" - v-model:limit="queryParams.pageSize" - @pagination="getList" - /> - </ContentWrap> - - <PackageModel ref="packageModelRef"/> -</template> -<script lang="ts" setup> - import download from "@/utils/download"; - import * as PackageHistoryApi from '@/api/mpk/projectPackageHistory' - import * as ProjectApi from '@/api/mpk/project' - import {dateFormatter} from '@/utils/formatTime' - import PackageModel from './ProjectPackageModelDialog.vue' - - defineOptions({name: 'ProjectPackageHistory'}) - - const message = useMessage() // 消息弹窗 - const {t} = useI18n() // 国际化 - const route = useRoute() // 路由 - - const loading = ref(true) // 列表的加载中 - const total = ref(0) // 列表的总页数 - const list = ref([]) // 列表的数据 - const queryParams = reactive({ - pageNo: 1, - pageSize: 10, - projectId: route.params.projectId, - startTime: undefined, - endTime: undefined, - }) - const queryFormRef = ref() // 搜索的表单 - const projectList = ref() // 字典类型的列表 - - /** 查询列表 */ - const getList = async () => { - loading.value = true - try { - const data = await PackageHistoryApi.getPage(queryParams) - list.value = data.list - total.value = data.total - } finally { - loading.value = false - } - } - - /** 搜索按钮操作 */ - const handleQuery = () => { - queryParams.pageNo = 1 - getList() - } - - /** 重置按钮操作 */ - const resetQuery = () => { - queryFormRef.value.resetFields() - handleQuery() - } - - const downloadHistory = async (filePath,fileName) => { - const param = { - filePath, - fileName, - } - const data = await PackageHistoryApi.download(param) - download.zip(data, fileName) - } - - const packageModelRef = ref() - const viewPackageModel = (id) => { - packageModelRef.value.open('package',id) - } - - /** 初始化 **/ - onMounted(async () => { - await getList() - // 查询字典(精简)列表 - projectList.value = await ProjectApi.list() - }) -</script> diff --git a/src/views/mpk/ProjectPackageModelDialog.vue b/src/views/mpk/ProjectPackageModelDialog.vue deleted file mode 100644 index 531b66f..0000000 --- a/src/views/mpk/ProjectPackageModelDialog.vue +++ /dev/null @@ -1,119 +0,0 @@ -<template> - <Dialog v-model="dialogVisible" :title="dialogTitle" width="80%"> - <!-- 搜索工作栏 --> - <ContentWrap> - <el-form - class="-mb-15px" - :model="queryParams" - ref="queryFormRef" - :inline="true" - label-width="68px" - > - <el-form-item label="模型名称" prop="pyName"> - <el-input - v-model="queryParams.pyName" - placeholder="请输入模型名称" - clearable - class="!w-240px" - /> - </el-form-item> - <el-form-item> - <el-button @click="getList"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button> - </el-form-item> - </el-form> - </ContentWrap> - - <!-- 列表 --> - <ContentWrap> - <el-table - v-loading="loading" - :data="list" - row-key="id" - border - > - <el-table-column prop="pyName" label="模型名称"/> - <el-table-column prop="pkgName" label="包名"/> - <el-table-column prop="pyModule" label="模型路径" width="300px"/> - <el-table-column prop="remark" label="备注" width="300px"/> - <el-table-column label="模型方法" type="expand" width="100px"> - <template #default="props"> - <el-table :data="props.row.modelMethods"> - <el-table-column align="center" label="方法名" prop="methodName" /> - <el-table-column align="center" label="参数长度" prop="dataLength" /> - <el-table-column align="center" label="是否有model" prop="model" :formatter="(row,column,cellValue) => cellValue === 1 ? 'true' : 'false'" /> - </el-table> - </template> - </el-table-column> - </el-table> - <!-- 分页 --> - <Pagination - v-model:limit="queryParams.pageSize" - v-model:page="queryParams.page" - :total="total" - @pagination="getList" - /> - </ContentWrap> - </Dialog> -</template> -<script lang="ts" setup> - import download from "@/utils/download"; - import * as projectHistoryApi from '@/api/mpk/projectPackageHistory' - import * as projectApi from '@/api/mpk/project' - import { dateFormatter } from '@/utils/formatTime' - - - const { t } = useI18n() // 国际化 - const message = useMessage() // 消息弹窗 - - const dialogVisible = ref(false) // 弹窗的是否展示 - const dialogTitle = ref('关联模型') // 弹窗的标题 - - const loading = ref(true) // 列表的加载中 - const total = ref(0) // 列表的总页数 - const list = ref([]) // 字典表格数据 - const queryParams = reactive({ - page: 1, - pageSize: 10, - packageHistoryId: undefined, - projectId: undefined, - pyName: undefined, - }) - - const dialogType = ref('') - - /** 打开弹窗 */ - const open = async (type: String,id: String) => { - dialogVisible.value = true - dialogType.value = type - - if (dialogType.value === 'package') { - queryParams.packageHistoryId = id; - }else if (dialogType.value === 'project') { - queryParams.projectId = id; - } - - queryParams.pyName = undefined; - getList() - } - defineExpose({ open }) // 提供 open 方法,用于打开弹窗 - - const getList = async () => { - loading.value = true - try { - let data = undefined; - if (dialogType.value === 'package') { - data = await projectHistoryApi.getPackageModel(queryParams) - data.list.forEach(e => { - e.modelMethods = JSON.parse(e.methodInfo) - }) - }else if (dialogType.value === 'project') { - data = await projectApi.getProjectModel(queryParams) - } - - list.value = data.list - total.value = data.total - } finally { - loading.value = false - } - } -</script> diff --git a/src/views/mpk/SelectForm.vue b/src/views/mpk/SelectForm.vue deleted file mode 100644 index 78f6890..0000000 --- a/src/views/mpk/SelectForm.vue +++ /dev/null @@ -1,135 +0,0 @@ -<template> - <Dialog v-model="dialogVisible" :title="dialogTitle"> - <el-form - ref="formRef" - v-loading="formLoading" - :model="formData" - :rules="formRules" - label-width="80px" - > - <el-row :gutter="8"> - <el-col :span="12"> - <el-form-item label="key" prop="selectKey"> - <el-input v-model="formData.settingKey" placeholder=""/> - </el-form-item> - </el-col> - </el-row> - <el-row :gutter="8"> - <el-col :span="12"> - <el-form-item label="name" prop="name"> - <el-input v-model="formData.name" placeholder=""/> - </el-form-item> - </el-col> - </el-row> - </el-form> - <template #footer> - <el-button type="primary" @click="submitForm">确 定</el-button> - <el-button @click="dialogVisible = false">取 消</el-button> - </template> - </Dialog> -</template> -<script lang="ts" setup> - import * as ProjectApi from '@/api/mpk/project' - import * as MpkApi from '@/api/mpk/mpk' - import {FormRules} from 'element-plus' - import {generateUUID} from "@/utils"; - - - const {t} = useI18n() // 国际化 - const message = useMessage() // 消息弹窗 - - const dialogVisible = ref(false) // 弹窗的是否展示 - const dialogTitle = ref('选项设置') // 弹窗的标题 - const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用 - const formData = ref({ - settingKey: undefined, - name: undefined, - type: undefined, - valueType: undefined, - value: undefined, - max: undefined, - min: undefined, - }) - - - const formRules = reactive<FormRules>({ - settingKey: [ - {required: true, message: 'key不能为空', trigger: 'blur'}, - ], - name: [ - {required: true, message: '参数名称不能为空', trigger: 'blur'}, - ], - type: [ - {required: true, message: '输入类型不能为空', trigger: 'blur'}, - ], - valueType: [ - {required: true, message: '参数类型不能为空', trigger: 'blur'}, - ] - }) - - const formRef = ref() // 表单 Ref - - let methodSettingsRef = undefined - let infoRef = undefined - /** 打开弹窗 */ - const open = async (info,methodSettings) => { - dialogVisible.value = true - resetForm() - // 修改时,设置数据 - if (info) { - infoRef = info - formLoading.value = true - try { - formData.value = {...info} - } finally { - formLoading.value = false - } - }else { - methodSettingsRef = methodSettings - } - } - defineExpose({open}) // 提供 open 方法,用于打开弹窗 - - - // 数据回调 - const emit = defineEmits(['addSettingCallback']) - /** 提交表单 */ - const submitForm = async () => { - // 校验表单 - if (!formRef) return - const valid = await formRef.value.validate() - if (!valid) return - // 提交请求 - formLoading.value = true - try { - if (infoRef) { - // 修改 - for (let key in formData.value) { - infoRef[key] = formData.value[key]; - } - }else { - // 新增 - const info = {...formData.value}; - info.id = generateUUID() - methodSettingsRef.push(info) - } - dialogVisible.value = false - } finally { - formLoading.value = false - } - } - - /** 重置表单 */ - const resetForm = () => { - formData.value = { - settingKey: undefined, - name: undefined, - type: undefined, - valueType: undefined, - value: undefined, - max: undefined, - min: undefined, - } - formRef.value?.resetFields() - } -</script> diff --git a/src/views/mpk/SettingForm.vue b/src/views/mpk/SettingForm.vue deleted file mode 100644 index aa95209..0000000 --- a/src/views/mpk/SettingForm.vue +++ /dev/null @@ -1,270 +0,0 @@ -<template> - <Dialog v-model="dialogVisible" :title="dialogTitle"> - <el-form - ref="formRef" - v-loading="formLoading" - :model="formData" - :rules="formRules" - label-width="80px" - > - <el-row :gutter="8"> - <el-col :span="12"> - <el-form-item label="key" prop="settingKey"> - <el-input v-model="formData.settingKey" placeholder=""/> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="参数名称" prop="name"> - <el-input v-model="formData.name" placeholder=""/> - </el-form-item> - </el-col> - </el-row> - <el-row :gutter="8"> - <el-col :span="12"> - <el-form-item label="输入类型" prop="type"> - <el-select v-model="formData.type" @change="typeChange"> - <el-option - v-for="item in getDictOptions(DICT_TYPE.MODEL_METHOD_SETTING_TYPE)" - :key="item.value" - :label="item.label" - :value="item.value" - /> - </el-select> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="参数类型" prop="valueType"> - <el-select v-model="formData.valueType"> - <el-option - v-for="item in getDictOptions(DICT_TYPE.MODEL_METHOD_SETTING_VALUE_TYPE)" - :key="item.value" - :label="item.label" - :value="item.value" - :disabled="valueTypeSelectDisabled(item.value)" - /> - </el-select> - </el-form-item> - </el-col> - </el-row> - <div v-if="formData.type === 'input'"> - <el-row :gutter="8"> - <el-col :span="8"> - <el-form-item label="默认值" prop="value"> - <el-input v-model="formData.value" placeholder=""/> - </el-form-item> - </el-col> - <el-col :span="8"> - <el-form-item label="最大值" prop="max"> - <el-input-number v-model="formData.max" placeholder=""/> - </el-form-item> - </el-col> - <el-col :span="8"> - <el-form-item label="最小值" prop="min"> - <el-input-number v-model="formData.min" placeholder=""/> - </el-form-item> - </el-col> - </el-row> - </div> - <div v-if="formData.type === 'select'"> - <el-divider content-position="left">选项信息</el-divider> - <el-row :gutter="8"> - <el-col :span="4"> - <el-button type="primary" size="small" @click="addRow()">新增</el-button> - </el-col> - </el-row> - <el-table :data="formData.settingSelects" border> - <el-table-column - prop="" - label="key" - align="center"> - <template #default="scope"> - <el-input size="small" v-model="scope.row.selectKey" maxlength="50" clearable /> - </template> - </el-table-column> - <el-table-column - prop="" - label="name" - align="center"> - <template #default="scope"> - <el-input size="small" v-model="scope.row.name" maxlength="50" clearable /> - </template> - </el-table-column> - <el-table-column label="操作" fixed="right" header-align="center" align="center" width="100"> - <template #default="scope"> - <el-button - @click="deleteRow(scope.$index)" - key="danger" - type="danger" - link - >删除</el-button> - </template> - </el-table-column> - </el-table> - </div> - </el-form> - <template #footer> - <el-button type="primary" @click="submitForm">确 定</el-button> - <el-button @click="dialogVisible = false">取 消</el-button> - </template> - </Dialog> -</template> -<script lang="ts" setup> - import {DICT_TYPE,getDictOptions} from '@/utils/dict'; - import * as ProjectApi from '@/api/mpk/project' - import * as MpkApi from '@/api/mpk/mpk' - import {FormRules} from 'element-plus' - import {generateUUID} from "@/utils"; - import {func} from "vue-types"; - - - const {t} = useI18n() // 国际化 - const message = useMessage() // 消息弹窗 - - const dialogVisible = ref(false) // 弹窗的是否展示 - const dialogTitle = ref('参数设置') // 弹窗的标题 - const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用 - const formData = ref({ - settingKey: undefined, - name: undefined, - type: undefined, - valueType: undefined, - value: undefined, - max: undefined, - min: undefined, - settingSelects: [] - }) - - - const formRules = reactive<FormRules>({ - settingKey: [ - {required: true, message: 'key不能为空', trigger: 'blur'}, - ], - name: [ - {required: true, message: '参数名称不能为空', trigger: 'blur'}, - ], - type: [ - {required: true, message: '输入类型不能为空', trigger: 'blur'}, - ], - valueType: [ - {required: true, message: '参数类型不能为空', trigger: 'blur'}, - ] - }) - - const formRef = ref() // 表单 Ref - - let methodSettingsRef = undefined - let infoRef = undefined - /** 打开弹窗 */ - const open = async (info,methodSettings) => { - dialogVisible.value = true - resetForm() - // 修改时,设置数据 - if (info) { - infoRef = info - formLoading.value = true - try { - formData.value = {...info} - } finally { - formLoading.value = false - } - }else { - methodSettingsRef = methodSettings - } - } - defineExpose({open}) // 提供 open 方法,用于打开弹窗 - - - // 数据回调 - const emit = defineEmits(['addSettingCallback']) - /** 提交表单 */ - const submitForm = async () => { - // 校验表单 - if (!formRef) return - const valid = await formRef.value.validate() - if (!valid) return - - //校验select - if (formData.value.type === 'select') { - if (formData.value.settingSelects?.length === 0) { - message.error('选项为空'); - return - } - } - - // 提交请求 - formLoading.value = true - try { - if (infoRef) { - // 修改 - for (let key in formData.value) { - infoRef[key] = formData.value[key]; - } - }else { - // 新增 - methodSettingsRef.push({...formData.value}) - } - dialogVisible.value = false - } finally { - formLoading.value = false - } - } - - /** 重置表单 */ - const resetForm = () => { - formData.value = { - settingKey: undefined, - name: undefined, - type: undefined, - valueType: undefined, - value: undefined, - max: undefined, - min: undefined, - settingSelects: [] - } - formRef.value?.resetFields() - } - - const valueTypeSelectDisabled = (value) => { - const type = formData.value.type; - switch (type) { - case "input": - if (['int','decimal','decimalArray','string'].includes(value)) { - return false - }else { - return true - } - case "file": - if (['file'].includes(value)) { - return false - }else { - return true - } - case "select": - if (['int','string'].includes(value)) { - return false - }else { - return true - } - default : - return true - } - } - - const typeChange = () => { - formData.value.valueType = undefined - formData.value.value = undefined - formData.value.max = undefined - formData.value.min = undefined - formData.value.settingSelects = [] - } - - const addRow = function () { - formData.value.settingSelects.push({ - selectKey: '', - name: '' - }) - } - const deleteRow = function (index) { - formData.value.settingSelects.splice(index, 1) - } -</script> diff --git a/src/views/mpk/mpk.vue b/src/views/mpk/mpk.vue deleted file mode 100644 index fa4fb84..0000000 --- a/src/views/mpk/mpk.vue +++ /dev/null @@ -1,209 +0,0 @@ -<template> - <!-- 搜索工作栏 --> - <ContentWrap> - <el-form - class="-mb-15px" - :model="queryParams" - ref="queryFormRef" - :inline="true" - label-width="68px" - > - <el-form-item label="模型名称" prop="pyName"> - <el-input - v-model="queryParams.pyName" - placeholder="请输入模型名称" - clearable - class="!w-240px" - /> - </el-form-item> - <el-form-item> - <el-button @click="handleQuery"> - <Icon icon="ep:search" class="mr-5px"/> - 搜索 - </el-button> - <el-button @click="resetQuery"> - <Icon icon="ep:refresh" class="mr-5px"/> - 重置 - </el-button> - <div class="ml-12px"> - <router-link :to="'/mpk/form'"> - <el-button type="primary" plain v-hasPermi="['mpk:create']"> - <Icon icon="ep:plus" class="mr-5px"/>新增</el-button> - </router-link> - </div> - - </el-form-item> - </el-form> - </ContentWrap> - - <!-- 列表 --> - <ContentWrap> - <el-table - v-loading="loading" - :data="list" - row-key="id" - > - <el-table-column prop="pyChineseName" label="模型中文名称"/> - <el-table-column prop="pyName" label="模型名称"/> - <el-table-column prop="pyType" label="模型类型" :formatter="(r,c,v) => getDictLabel(DICT_TYPE.MODEL_TYPE,v)"/> - <el-table-column prop="menuName" label="所属菜单" width="120px"/> - <el-table-column prop="groupName" label="所属组" width="120px"/> - <el-table-column prop="remark" label="备注" width="200px"/> - <el-table-column prop="createDate" label="创建时间" :formatter="dateFormatter" width="170px"/> - <el-table-column label="操作" align="center" width="200px"> - <template #default="scope"> - <div class="flex items-center justify-center"> - <router-link :to="'/mpk/form/' + scope.row.id"> - <el-button type="primary" link v-hasPermi="['mpk:update']"> - <Icon icon="ep:edit"/>修改 - </el-button> - </router-link> - <el-button link type="danger" @click="handleDelete(scope.row.id)" v-hasPermi="['mpk:delete']"> - <Icon icon="ep:delete"/>删除 - </el-button> - <div class="pl-12px"> - <el-dropdown @command="(command) => handleCommand(command, scope.row)" trigger="click"> - <el-button type="primary" link> - <Icon icon="ep:d-arrow-right" /> 更多 - </el-button> - <template #dropdown> - <el-dropdown-menu> - <el-dropdown-item - command="generatorCode" - > - 生成代码 - </el-dropdown-item> - <el-dropdown-item - command="generatorHistory" - > - 生成历史 - </el-dropdown-item> - <el-dropdown-item - command="mpkRunDialog" - > - 运行 - </el-dropdown-item> - </el-dropdown-menu> - </template> - </el-dropdown> - </div> - </div> - </template> - </el-table-column> - </el-table> - <!-- 分页 --> - <Pagination - v-model:limit="queryParams.pageSize" - v-model:page="queryParams.page" - :total="total" - @pagination="getList" - /> - </ContentWrap> - - <MpkGenerator ref="mpkGenerator"/> - <GeneratorCodeHistory ref="generatorCodeHistory"/> - <MpkRun ref="mpkRun"/> -</template> -<script lang="ts" setup> - import {dateFormatter} from '@/utils/formatTime' - import * as MpkApi from '@/api/mpk/mpk' - import MpkGenerator from './MpkGenerator.vue' - import GeneratorCodeHistory from './MpkGeneratorHistory.vue' - import MpkRun from './MpkRun.vue' - import * as UserApi from "@/api/system/user"; - import { DICT_TYPE, getDictLabel } from '@/utils/dict' - import {useAppStoreWithOut} from "@/store/modules/app"; - - defineOptions({name: 'Mpk'}) - - const message = useMessage() // 消息弹窗 - const {t} = useI18n() // 国际化 - - const loading = ref(true) // 列表的加载中 - const total = ref(0) // 列表的总页数 - const list = ref([]) // 字典表格数据 - const queryParams = reactive({ - page: 1, - pageSize: 10, - pyName: '' - }) - const queryFormRef = ref() // 搜索的表单 - - const getList = async () => { - loading.value = true - try { - const data = await MpkApi.getPage(queryParams) - list.value = data.list - total.value = data.total - } finally { - loading.value = false - } - } - - /** 操作分发 */ - const handleCommand = (command: string, row) => { - switch (command) { - case 'generatorCode': - generatorCode(row.id,row.pyName) - break - case 'generatorHistory': - generatorHistory(row.id) - break - case 'mpkRunDialog': - mpkRunDialog(row) - break - default: - break - } - } - - const mpkGenerator = ref(); - const generatorCode = (id,pyName) => { - mpkGenerator.value.open(id,pyName); - } - - const generatorCodeHistory = ref(); - const generatorHistory = (id) => { - generatorCodeHistory.value.open(id); - } - - const mpkRun = ref(); - const mpkRunDialog = (row) => { - mpkRun.value.open(row); - } - - /** 搜索按钮操作 */ - const handleQuery = () => { - getList() - } - - /** 重置按钮操作 */ - const resetQuery = () => { - queryParams.page = 1 - queryFormRef.value.resetFields() - handleQuery() - } - - /** 删除按钮操作 */ - const handleDelete = async (id: number) => { - try { - // 删除的二次确认 - await message.delConfirm() - // 发起删除 - await MpkApi.deleteMpk(id) - message.success(t('common.delSuccess')) - // 刷新列表 - await getList() - } catch { - } - } - - onActivated((to) => { - getList() - }) - - /** 初始化 **/ - onMounted(async () => { - await getList() - }) -</script> diff --git a/src/views/mpk/project.vue b/src/views/mpk/project.vue deleted file mode 100644 index cc4a287..0000000 --- a/src/views/mpk/project.vue +++ /dev/null @@ -1,228 +0,0 @@ -<template> - <!-- 搜索工作栏 --> - <ContentWrap> - <el-form - class="-mb-15px" - :model="queryParams" - ref="queryFormRef" - :inline="true" - label-width="68px" - > - <el-form-item label="项目名称" prop="projectName"> - <el-input - v-model="queryParams.projectName" - placeholder="请输入项目名称" - clearable - class="!w-240px" - /> - </el-form-item> - <el-form-item label="项目编码" prop="projectCode"> - <el-input - v-model="queryParams.projectCode" - placeholder="请输入项目编码" - clearable - class="!w-240px" - /> - </el-form-item> - <el-form-item> - <el-button @click="handleQuery"> - <Icon icon="ep:search" class="mr-5px"/> - 搜索 - </el-button> - <el-button @click="resetQuery"> - <Icon icon="ep:refresh" class="mr-5px"/> - 重置 - </el-button> - <el-button - type="primary" - plain - @click="openForm('create')" - v-hasPermi="['project:create']" - > - <Icon icon="ep:plus" class="mr-5px"/> - 新增 - </el-button> - </el-form-item> - </el-form> - </ContentWrap> - - <!-- 列表 --> - <ContentWrap> - <el-table - v-loading="loading" - :data="list" - row-key="id" - > - <el-table-column prop="projectName" label="项目名称"/> - <el-table-column prop="projectCode" label="项目编码"/> - <el-table-column prop="createTime" label="创建时间" :formatter="dateFormatter" width="300px"/> - <el-table-column label="操作" align="center" width="300px"> - <template #default="scope"> - <div class="flex items-center justify-center"> - <el-button - link - type="primary" - @click="openForm('update', scope.row.id)" - v-hasPermi="['project:update']" - > - <Icon icon="ep:edit"/> - 修改 - </el-button> - <el-button - link - type="danger" - @click="handleDelete(scope.row.id)" - v-hasPermi="['project:delete']" - > - <Icon icon="ep:delete"/> - 删除 - </el-button> - <el-button - link - type="primary" - @click="viewRelevanceModel(scope.row.id)" - > - <Icon icon="ep:link"/> - 查看关联模型 - </el-button> - <div class="pl-12px"> - <el-dropdown @command="(command) => handleCommand(command, scope.row)" - trigger="click"> - <el-button type="primary" link> - <Icon icon="ep:d-arrow-right"/> - 更多 - </el-button> - <template #dropdown> - <el-dropdown-menu> - <el-dropdown-item - command="packageModel" - > - <el-button link>打包</el-button> - </el-dropdown-item> - <el-dropdown-item - > - <router-link :to="'/project/package/history/' + scope.row.id"> - <el-button link>打包历史</el-button> - </router-link> - </el-dropdown-item> - </el-dropdown-menu> - </template> - </el-dropdown> - </div> - </div> - </template> - </el-table-column> - </el-table> - <!-- 分页 --> - <Pagination - v-model:limit="queryParams.pageSize" - v-model:page="queryParams.page" - :total="total" - @pagination="getList" - /> - </ContentWrap> - - <!-- 表单弹窗:添加/修改 --> - <ProjectForm ref="formRef" @success="getList"/> - <ProjectPackage ref="projectPackageRef"/> - <RelevanceModel ref="relevanceModelRef"/> -</template> -<script lang="ts" setup> - import {dateFormatter} from '@/utils/formatTime' - import * as ProjectApi from '@/api/mpk/project' - import ProjectForm from './ProjectForm.vue' - import ProjectPackage from './ProjectPackage.vue' - import RelevanceModel from './ProjectPackageModelDialog.vue' - - defineOptions({name: 'Project'}) - - const message = useMessage() // 消息弹窗 - const {t} = useI18n() // 国际化 - - const loading = ref(true) // 列表的加载中 - const total = ref(0) // 列表的总页数 - const list = ref([]) // 字典表格数据 - const queryParams = reactive({ - page: 1, - pageSize: 10, - projectName: '', - projectCode: '' - }) - const queryFormRef = ref() // 搜索的表单 - - const getList = async () => { - loading.value = true - try { - const data = await ProjectApi.getPage(queryParams) - list.value = data.list - total.value = data.total - } finally { - loading.value = false - } - } - - /** 操作分发 */ - const handleCommand = (command: string, row) => { - switch (command) { - case 'packageModel': - packageModel(row.id, row.projectName, row.projectCode, row.models) - break - default: - break - } - } - - //打包 - const projectPackageRef = ref(); - const packageModel = (projectId, projectName, projectCode, models) => { - let ids = models.map(e => e.id); - if (ids && ids.length > 0) { - projectPackageRef.value.open(projectId, projectName, projectCode, ids.join(",")); - } else { - message.error("请先为项目添加模型!") - } - } - - /** 搜索按钮操作 */ - const handleQuery = () => { - getList() - } - - /** 重置按钮操作 */ - const resetQuery = () => { - queryParams.page = 1 - queryFormRef.value.resetFields() - handleQuery() - } - - /** 添加/修改操作 */ - const formRef = ref() - const openForm = (type: string, id?: number) => { - formRef.value.open(type, id) - } - - /** 删除按钮操作 */ - const handleDelete = async (id: number) => { - try { - // 删除的二次确认 - await message.delConfirm() - // 发起删除 - await ProjectApi.deleteProject(id) - message.success(t('common.delSuccess')) - // 刷新列表 - await getList() - } catch { - } - } - - // 查看关联模型 - const relevanceModelRef = ref() - const viewRelevanceModel = (id) => { - relevanceModelRef.value.open('project',id) - } - - /** 初始化 **/ - onMounted(async () => { - await getList() - }) -</script> -- Gitblit v1.9.3