From 7462da8e3d36dd3646961342684affbcca34871a Mon Sep 17 00:00:00 2001 From: liriming <1343021927@qq.com> Date: 星期一, 09 九月 2024 08:38:19 +0800 Subject: [PATCH] dm item predict新增页面 --- src/views/model/pre/dm/DmModuleForm.vue | 136 +++++++ src/views/model/pre/dm/index.vue | 154 ++++++++ src/views/model/pre/item/index.vue | 151 ++++++++ src/views/model/pre/predict/index.vue | 173 +++++++++ src/api/model/pre/item/index.ts | 37 ++ src/views/model/pre/predict/MmPredictItemForm.vue | 209 +++++++++++ src/views/model/pre/item/ItemTypeForm.vue | 115 ++++++ src/api/model/pre/dm/index.ts | 37 ++ src/api/model/pre/predict/index.ts | 50 ++ 9 files changed, 1,062 insertions(+), 0 deletions(-) diff --git a/src/api/model/pre/dm/index.ts b/src/api/model/pre/dm/index.ts new file mode 100644 index 0000000..db9638a --- /dev/null +++ b/src/api/model/pre/dm/index.ts @@ -0,0 +1,37 @@ +import request from '@/config/axios' + +export interface MmItemTypeVO { + id: string + itemtypename: string, + itemclasstype: string, + assemblyname: string +} + +export interface MmItemTypePageReqVO extends PageParam { + modulename?: string +} + +// 查询MmItemType列表 +export const getMmItemTypePage = (params: MmItemTypePageReqVO) => { + return request.get({ url: '/pre/item-type/page', params }) +} + +// 查询MmItemType详情 +export const getMmItemType = (id: number) => { + return request.get({ url: `/pre/item-type/get/${id}`}) +} + +// 新增MmItemType +export const createMmItemType = (data: MmItemTypeVO) => { + return request.post({ url: '/pre/item-type/create', data }) +} + +// 修改MmItemType +export const updateMmItemType = (data: MmItemTypeVO) => { + return request.put({ url: '/pre/item-type/update', data }) +} + +// 删除MmItemType +export const deleteMmItemType = (id: number) => { + return request.delete({ url: '/pre/item-type/delete?id=' + id }) +} diff --git a/src/api/model/pre/item/index.ts b/src/api/model/pre/item/index.ts new file mode 100644 index 0000000..30a9017 --- /dev/null +++ b/src/api/model/pre/item/index.ts @@ -0,0 +1,37 @@ +import request from '@/config/axios' + +export interface MmItemTypeVO { + id: string + itemtypename: string, + itemclasstype: string, + assemblyname: string +} + +export interface MmItemTypePageReqVO extends PageParam { + itemtypename?: string +} + +// 查询MmItemType列表 +export const getMmItemTypePage = (params: MmItemTypePageReqVO) => { + return request.get({ url: '/pre/item-type/page', params }) +} + +// 查询MmItemType详情 +export const getMmItemType = (id: number) => { + return request.get({ url: `/pre/item-type/get/${id}`}) +} + +// 新增MmItemType +export const createMmItemType = (data: MmItemTypeVO) => { + return request.post({ url: '/pre/item-type/create', data }) +} + +// 修改MmItemType +export const updateMmItemType = (data: MmItemTypeVO) => { + return request.put({ url: '/pre/item-type/update', data }) +} + +// 删除MmItemType +export const deleteMmItemType = (id: number) => { + return request.delete({ url: '/pre/item-type/delete?id=' + id }) +} diff --git a/src/api/model/pre/predict/index.ts b/src/api/model/pre/predict/index.ts new file mode 100644 index 0000000..9c2c06e --- /dev/null +++ b/src/api/model/pre/predict/index.ts @@ -0,0 +1,50 @@ +import request from '@/config/axios' + +export interface MmPredictItemVO { + id: string + itemno: string, + itemname: string, + itemtypeid: string, + itemtypename: string, + granularity: number, + isfuse: number, + workchecked: number, + moduleid: string, + itemorder: number, + status: number, + categoryid: string, + pointid: string, + tagname: string, + resulttableid: string, + tablename: string, +} + +export interface MmPredictItemPageReqVO extends PageParam { + itemno?: string, + itemname?: string, +} + +// 查询MmPredictItem列表 +export const getMmPredictItemPage = (params: MmPredictItemPageReqVO) => { + return request.get({ url: '/pre/predict-item/page', params }) +} + +// 查询MmPredictItem详情 +export const getMmPredictItem = (id: number) => { + return request.get({ url: `/pre/predict-item/get/${id}`}) +} + +// 新增MmPredictItem +export const createMmPredictItem = (data: MmPredictItemVO) => { + return request.post({ url: '/pre/predict-item/create', data }) +} + +// 修改MmPredictItem +export const updateMmPredictItem = (data: MmPredictItemVO) => { + return request.put({ url: '/pre/predict-item/update', data }) +} + +// 删除MmPredictItem +export const deleteMmPredictItem = (id: number) => { + return request.delete({ url: '/pre/predict-item/delete?id=' + id }) +} diff --git a/src/views/model/pre/dm/DmModuleForm.vue b/src/views/model/pre/dm/DmModuleForm.vue new file mode 100644 index 0000000..93dcd9e --- /dev/null +++ b/src/views/model/pre/dm/DmModuleForm.vue @@ -0,0 +1,136 @@ +<template> + <Dialog v-model="dialogVisible" :title="dialogTitle" width="50%"> + <el-form + ref="formRef" + v-loading="formLoading" + :model="formData" + :rules="formRules" + label-width="120px" + > + <el-row> + <el-col :span="12"> + <el-form-item label="名称" prop="modulename"> + <el-input v-model="formData.modulename" placeholder="请输入名称"/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="类型" prop="moduletype"> + <el-input v-model="formData.moduletype" placeholder="请输入类型"/> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="周期" prop="cycle"> + <el-input v-model="formData.cycle" placeholder="请输入周期"/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="模块配置" prop="modulenavconfig"> + <el-input v-model="formData.modulenavconfig" placeholder="请输入模块配置"/> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="预测时间" prop="predicttime"> + <el-input v-model="formData.predicttime" placeholder="请输入预测时间"/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="采集时间" prop="collecttime"> + <el-input v-model="formData.collecttime" placeholder="请输入采集时间"/> + </el-form-item> + </el-col> + </el-row> + </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 DmModule from '@/api/model/pre/dm' + +defineOptions({name: 'DataDmModuleForm'}) + +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, + modulename: undefined, + moduletype: undefined, + cycle: undefined, + modulenavconfig: undefined, + predicttime: undefined, + collecttime: undefined +}) +const formRules = reactive({ + modulename: [{required: true, message: '名称不能为空', trigger: 'blur'}], + moduletype: [{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 DmModule.getDmModule(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 unknown as DmModule.DmModuleVO + if (formType.value === 'create') { + await DmModule.createDmModule(data) + message.success(t('common.createSuccess')) + } else { + await DmModule.updateDmModule(data) + message.success(t('common.updateSuccess')) + } + dialogVisible.value = false + // 发送操作成功的事件 + emit('success') + } finally { + formLoading.value = false + } +} + +/** 重置表单 */ +const resetForm = () => { + formData.value = { + id: undefined, + modulename: undefined, + moduletype: undefined, + cycle: undefined, + modulenavconfig: undefined, + predicttime: undefined, + collecttime: undefined + } + formRef.value?.resetFields() +} +</script> diff --git a/src/views/model/pre/dm/index.vue b/src/views/model/pre/dm/index.vue new file mode 100644 index 0000000..dd14eee --- /dev/null +++ b/src/views/model/pre/dm/index.vue @@ -0,0 +1,154 @@ +<template> + <!-- 搜索 --> + <ContentWrap> + <el-form + class="-mb-15px" + :model="queryParams" + ref="queryFormRef" + :inline="true" + label-width="68px" + > + <el-form-item label="名称" prop="modulename"> + <el-input + v-model="queryParams.modulename" + placeholder="请输入名称" + clearable + @keyup.enter="handleQuery" + 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="['system:tenant:create']" + > + <Icon icon="ep:plus" class="mr-5px" /> + 新增 + </el-button> + </el-form-item> + </el-form> + </ContentWrap> + + <!-- 列表 --> + <ContentWrap> + <el-table v-loading="loading" :data="list"> + <el-table-column label="名称" align="center" prop="modulename" /> + <el-table-column label="类型" align="center" prop="moduletype" /> + <el-table-column label="周期" align="center" prop="cycle" /> + <el-table-column label="模块配置" align="center" prop="modulenavconfig" /> + <el-table-column label="预测时间" align="center" prop="predicttime" /> + <el-table-column label="采集时间" align="center" prop="collecttime" /> + + <el-table-column label="操作" align="center" min-width="110" fixed="right"> + <template #default="scope"> + <el-button + link + type="primary" + @click="openForm('update', scope.row.id)" + v-hasPermi="['system:tenant:update']" + > + 编辑 + </el-button> + <el-button + link + type="danger" + @click="handleDelete(scope.row.id)" + v-hasPermi="['system:tenant:delete']" + > + 删除 + </el-button> + </template> + </el-table-column> + </el-table> + <!-- 分页 --> + <Pagination + :total="total" + v-model:page="queryParams.pageNo" + v-model:limit="queryParams.pageSize" + @pagination="getList" + /> + </ContentWrap> + + <!-- 表单弹窗:添加/修改 --> + <DmModuleForm ref="formRef" @success="getList" /> + +</template> +<script lang="ts" setup> +import DmModuleForm from './DmModuleForm.vue' +import * as DmModule from '@/api/model/pre/dm' + +defineOptions({name: 'DataDmModule'}) + + const message = useMessage() // 消息弹窗 + const {t} = useI18n() // 国际化 + + const loading = ref(true) // 列表的加载中 + const total = ref(0) // 列表的总页数 + const list = ref([]) // 列表的数据 + const queryParams = reactive({ + pageNo: 1, + pageSize: 10, + modulename: undefined, + }) + const queryFormRef = ref() // 搜索的表单 + const exportLoading = ref(false) // 导出的加载中 + + /** 查询列表 */ + const getList = async () => { + loading.value = true + try { + const page = await DmModule.getDmModulePage(queryParams) + list.value = page.list + total.value = page.total + } finally { + loading.value = false + } + } + + /** 搜索按钮操作 */ + const handleQuery = () => { + queryParams.pageNo = 1 + getList() + } + + /** 重置按钮操作 */ + const resetQuery = () => { + 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 DmModule.deleteDmModule(id) + message.success(t('common.delSuccess')) + // 刷新列表 + await getList() + } catch { + } + } + + /** 初始化 **/ + onMounted(async () => { + await getList() + }) +</script> diff --git a/src/views/model/pre/item/ItemTypeForm.vue b/src/views/model/pre/item/ItemTypeForm.vue new file mode 100644 index 0000000..5131d27 --- /dev/null +++ b/src/views/model/pre/item/ItemTypeForm.vue @@ -0,0 +1,115 @@ +<template> + <Dialog v-model="dialogVisible" :title="dialogTitle" width="50%"> + <el-form + ref="formRef" + v-loading="formLoading" + :model="formData" + :rules="formRules" + label-width="120px" + > + <el-row> + <el-col :span="24"> + <el-form-item label="名称" prop="itemtypename"> + <el-input v-model="formData.itemtypename" placeholder="请输入名称"/> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="24"> + <el-form-item label="类名" prop="itemclasstype"> + <el-input v-model="formData.itemclasstype" placeholder="请输入类名"/> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="24"> + <el-form-item label="程序集" prop="assemblyname"> + <el-input v-model="formData.assemblyname" placeholder="请输入程序集"/> + </el-form-item> + </el-col> + </el-row> + </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 MmItemType from '@/api/model/pre/item' + +defineOptions({name: 'DataMmItemTypeForm'}) + +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, + itemtypename: undefined, + itemclasstype: undefined, + assemblyname: undefined, +}) +const formRules = reactive({ + itemtypename: [{required: true, message: '名称不能为空', trigger: 'blur'}], + itemclasstype: [{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 MmItemType.getMmItemType(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 unknown as MmItemType.MmItemTypeVO + if (formType.value === 'create') { + await MmItemType.createMmItemType(data) + message.success(t('common.createSuccess')) + } else { + await MmItemType.updateMmItemType(data) + message.success(t('common.updateSuccess')) + } + dialogVisible.value = false + // 发送操作成功的事件 + emit('success') + } finally { + formLoading.value = false + } +} + +/** 重置表单 */ +const resetForm = () => { + formData.value = { + id: undefined, + itemtypename: undefined, + itemclasstype: undefined, + assemblyname: undefined, + } + formRef.value?.resetFields() +} +</script> diff --git a/src/views/model/pre/item/index.vue b/src/views/model/pre/item/index.vue new file mode 100644 index 0000000..21df860 --- /dev/null +++ b/src/views/model/pre/item/index.vue @@ -0,0 +1,151 @@ +<template> + <!-- 搜索 --> + <ContentWrap> + <el-form + class="-mb-15px" + :model="queryParams" + ref="queryFormRef" + :inline="true" + label-width="68px" + > + <el-form-item label="名称" prop="itemtypename"> + <el-input + v-model="queryParams.itemtypename" + placeholder="请输入名称" + clearable + @keyup.enter="handleQuery" + 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="['system:tenant:create']" + > + <Icon icon="ep:plus" class="mr-5px" /> + 新增 + </el-button> + </el-form-item> + </el-form> + </ContentWrap> + + <!-- 列表 --> + <ContentWrap> + <el-table v-loading="loading" :data="list"> + <el-table-column label="名称" align="center" prop="itemtypename" /> + <el-table-column label="类名" align="center" prop="itemclasstype" /> + <el-table-column label="程序集" align="center" prop="assemblyname" /> + + <el-table-column label="操作" align="center" min-width="110" fixed="right"> + <template #default="scope"> + <el-button + link + type="primary" + @click="openForm('update', scope.row.id)" + v-hasPermi="['system:tenant:update']" + > + 编辑 + </el-button> + <el-button + link + type="danger" + @click="handleDelete(scope.row.id)" + v-hasPermi="['system:tenant:delete']" + > + 删除 + </el-button> + </template> + </el-table-column> + </el-table> + <!-- 分页 --> + <Pagination + :total="total" + v-model:page="queryParams.pageNo" + v-model:limit="queryParams.pageSize" + @pagination="getList" + /> + </ContentWrap> + + <!-- 表单弹窗:添加/修改 --> + <MmItemTypeForm ref="formRef" @success="getList" /> + +</template> +<script lang="ts" setup> +import MmItemTypeForm from './ItemTypeForm.vue' +import * as MmItemType from '@/api/model/pre/item' + +defineOptions({name: 'DataMmItemType'}) + + const message = useMessage() // 消息弹窗 + const {t} = useI18n() // 国际化 + + const loading = ref(true) // 列表的加载中 + const total = ref(0) // 列表的总页数 + const list = ref([]) // 列表的数据 + const queryParams = reactive({ + pageNo: 1, + pageSize: 10, + itemtypename: undefined, + }) + const queryFormRef = ref() // 搜索的表单 + const exportLoading = ref(false) // 导出的加载中 + + /** 查询列表 */ + const getList = async () => { + loading.value = true + try { + const page = await MmItemType.getMmItemTypePage(queryParams) + list.value = page.list + total.value = page.total + } finally { + loading.value = false + } + } + + /** 搜索按钮操作 */ + const handleQuery = () => { + queryParams.pageNo = 1 + getList() + } + + /** 重置按钮操作 */ + const resetQuery = () => { + 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 MmItemType.deleteMmItemType(id) + message.success(t('common.delSuccess')) + // 刷新列表 + await getList() + } catch { + } + } + + /** 初始化 **/ + onMounted(async () => { + await getList() + }) +</script> diff --git a/src/views/model/pre/predict/MmPredictItemForm.vue b/src/views/model/pre/predict/MmPredictItemForm.vue new file mode 100644 index 0000000..9117ab0 --- /dev/null +++ b/src/views/model/pre/predict/MmPredictItemForm.vue @@ -0,0 +1,209 @@ +<template> + <Dialog v-model="dialogVisible" :title="dialogTitle" width="50%"> + <el-form + ref="formRef" + v-loading="formLoading" + :model="formData" + :rules="formRules" + label-width="120px" + > + <el-row> + <el-col :span="12"> + <el-form-item label="编号" prop="itemno"> + <el-input v-model="formData.itemno" placeholder="请输入编号"/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="预测项名" prop="itemname"> + <el-input v-model="formData.itemname" placeholder="请输入预测项名"/> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="类型ID" prop="itemtypeid"> + <el-input v-model="formData.itemtypeid" placeholder="请输入类型ID"/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="类型名称" prop="itemtypename"> + <el-input v-model="formData.itemtypename" placeholder="请输入类型名称"/> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="粒度" prop="granularity"> + <el-input v-model="formData.granularity" placeholder="请输入粒度"/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="是否融合" prop="isfuse"> + <el-input v-model="formData.isfuse" placeholder="请输入是否融合"/> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="是否检查" prop="workchecked"> + <el-input v-model="formData.workchecked" placeholder="请输入是否检查"/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="模块ID" prop="moduleid"> + <el-input v-model="formData.moduleid" placeholder="请输入模块ID"/> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="排序" prop="itemorder"> + <el-input v-model="formData.itemorder" placeholder="请输入排序"/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="是否启用" prop="status"> + <el-input v-model="formData.status" placeholder="请输入是否启用"/> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="类别ID" prop="categoryid"> + <el-input v-model="formData.categoryid" placeholder="请输入类别ID"/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="数据点ID" prop="pointid"> + <el-input v-model="formData.pointid" placeholder="请输入数据点ID"/> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="数据点名称" prop="tagname"> + <el-input v-model="formData.tagname" placeholder="请输入数据点名称"/> + </el-form-item> + </el-col> + <el-col :span="12"> + <el-form-item label="存放表ID" prop="resulttableid"> + <el-input v-model="formData.resulttableid" placeholder="请输入存放表ID"/> + </el-form-item> + </el-col> + </el-row> + <el-row> + <el-col :span="12"> + <el-form-item label="存放表" prop="tablename"> + <el-input v-model="formData.tablename" placeholder="请输入存放表"/> + </el-form-item> + </el-col> + </el-row> + </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 MmPredictItem from '@/api/model/pre/predict' + +defineOptions({name: 'DataMmPredictItemForm'}) + +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, + itemno: undefined, + itemname: undefined, + itemtypeid: undefined, + itemtypename: undefined, + granularity: undefined, + isfuse: undefined, + workchecked: undefined, + moduleid: undefined, + itemorder: undefined, + status: undefined, + categoryid: undefined, + pointid: undefined, + tagname: undefined, + resulttableid: undefined, + tablename: undefined, +}) +const formRules = reactive({ + itemno: [{required: true, message: '编号不能为空', trigger: 'blur'}], + itemname: [{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 MmPredictItem.getMmPredictItem(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 unknown as MmPredictItem.MmPredictItemVO + if (formType.value === 'create') { + await MmPredictItem.createMmPredictItem(data) + message.success(t('common.createSuccess')) + } else { + await MmPredictItem.updateMmPredictItem(data) + message.success(t('common.updateSuccess')) + } + dialogVisible.value = false + // 发送操作成功的事件 + emit('success') + } finally { + formLoading.value = false + } +} + +/** 重置表单 */ +const resetForm = () => { + formData.value = { + id: undefined, + itemno: undefined, + itemname: undefined, + itemtypeid: undefined, + itemtypename: undefined, + granularity: undefined, + isfuse: undefined, + workchecked: undefined, + moduleid: undefined, + itemorder: undefined, + status: undefined, + categoryid: undefined, + pointid: undefined, + tagname: undefined, + resulttableid: undefined, + tablename: undefined, + } + formRef.value?.resetFields() +} +</script> diff --git a/src/views/model/pre/predict/index.vue b/src/views/model/pre/predict/index.vue new file mode 100644 index 0000000..8e516fc --- /dev/null +++ b/src/views/model/pre/predict/index.vue @@ -0,0 +1,173 @@ +<template> + <!-- 搜索 --> + <ContentWrap> + <el-form + class="-mb-15px" + :model="queryParams" + ref="queryFormRef" + :inline="true" + label-width="68px" + > + <el-form-item label="编号" prop="itemno"> + <el-input + v-model="queryParams.itemno" + placeholder="请输入编号" + clearable + @keyup.enter="handleQuery" + class="!w-240px" + /> + </el-form-item> + <el-form-item label="预测项名" prop="itemname"> + <el-input + v-model="queryParams.itemname" + placeholder="请输入预测项名" + clearable + @keyup.enter="handleQuery" + 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="['system:tenant:create']" + > + <Icon icon="ep:plus" class="mr-5px" /> + 新增 + </el-button> + </el-form-item> + </el-form> + </ContentWrap> + + <!-- 列表 --> + <ContentWrap> + <el-table v-loading="loading" :data="list"> + <el-table-column label="编号" align="center" prop="itemno" /> + <el-table-column label="预测项名" align="center" prop="itemname" /> + <el-table-column label="类型ID" align="center" prop="itemtypeid" /> + <el-table-column label="类型名称" align="center" prop="itemtypename" /> + <el-table-column label="粒度" align="center" prop="granularity" /> + <el-table-column label="是否融合" align="center" prop="isfuse" /> + <el-table-column label="是否检查" align="center" prop="workchecked" /> + <el-table-column label="模块ID" align="center" prop="moduleid" /> + <el-table-column label="排序" align="center" prop="itemorder" /> + <el-table-column label="是否启用" align="center" prop="status" /> + <el-table-column label="类别ID" align="center" prop="categoryid" /> + <el-table-column label="数据点ID" align="center" prop="pointid" /> + <el-table-column label="数据点名称" align="center" prop="tagname" /> + <el-table-column label="存放表ID" align="center" prop="resulttableid" /> + <el-table-column label="存放表" align="center" prop="tablename" /> + + <el-table-column label="操作" align="center" min-width="110" fixed="right"> + <template #default="scope"> + <el-button + link + type="primary" + @click="openForm('update', scope.row.id)" + v-hasPermi="['system:tenant:update']" + > + 编辑 + </el-button> + <el-button + link + type="danger" + @click="handleDelete(scope.row.id)" + v-hasPermi="['system:tenant:delete']" + > + 删除 + </el-button> + </template> + </el-table-column> + </el-table> + <!-- 分页 --> + <Pagination + :total="total" + v-model:page="queryParams.pageNo" + v-model:limit="queryParams.pageSize" + @pagination="getList" + /> + </ContentWrap> + + <!-- 表单弹窗:添加/修改 --> + <MmPredictItemForm ref="formRef" @success="getList" /> + +</template> +<script lang="ts" setup> +import MmPredictItemForm from './MmPredictItemForm.vue' +import * as MmPredictItem from '@/api/model/pre/dm' + +defineOptions({name: 'DataMmPredictItem'}) + + const message = useMessage() // 消息弹窗 + const {t} = useI18n() // 国际化 + + const loading = ref(true) // 列表的加载中 + const total = ref(0) // 列表的总页数 + const list = ref([]) // 列表的数据 + const queryParams = reactive({ + pageNo: 1, + pageSize: 10, + itemno: undefined, + itemname: undefined, + }) + const queryFormRef = ref() // 搜索的表单 + const exportLoading = ref(false) // 导出的加载中 + + /** 查询列表 */ + const getList = async () => { + loading.value = true + try { + const page = await MmPredictItem.getMmPredictItemPage(queryParams) + list.value = page.list + total.value = page.total + } finally { + loading.value = false + } + } + + /** 搜索按钮操作 */ + const handleQuery = () => { + queryParams.pageNo = 1 + getList() + } + + /** 重置按钮操作 */ + const resetQuery = () => { + 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 MmPredictItem.deleteMmPredictItem(id) + message.success(t('common.delSuccess')) + // 刷新列表 + await getList() + } catch { + } + } + + /** 初始化 **/ + onMounted(async () => { + await getList() + }) +</script> -- Gitblit v1.9.3