src/router/modules/remaining.ts | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/utils/dict.ts | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/views/data/ind/data/field/DataSetFieldForm.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/views/data/ind/data/field/index.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/views/data/ind/data/index.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 |
src/router/modules/remaining.ts
@@ -351,6 +351,29 @@ } ] }, { path: '/ind/data', component: Layout, name: 'dataSet', meta: { hidden: true }, children: [ { path: 'field/:dataSetId', component: () => import('@/views/data/ind/data/field/index.vue'), name: 'IndDataSetField', meta: { title: '数据集字段', noCache: true, hidden: true, canTo: true, icon: '', activeMenu: '/data/ind/data' } } ] }, ] export default remainingRouter src/utils/dict.ts
@@ -234,4 +234,7 @@ SCHE_TRIGGER_METHOD = 'sche_trigger_method', MODEL_PARAM_TYPE = 'model_param_type', MODEL_METHOD = 'model_method', // ========== DATA - 数据平台模块 ========== DATA_FIELD_TYPE = 'data_field_type', } src/views/data/ind/data/field/DataSetFieldForm.vue
对比新文件 @@ -0,0 +1,124 @@ <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="fieldCode"> <el-input v-model="formData.fieldCode" placeholder="请输入英文名" /> </el-form-item> <el-form-item label="中文名" prop="fieldName"> <el-input v-model="formData.fieldName" placeholder="请输入中文名" /> </el-form-item> <el-form-item label="数据类型" prop="fieldType"> <el-select v-model="formData.fieldType" placeholder="请选择"> <el-option v-for="dict in getStrDictOptions(DICT_TYPE.DATA_FIELD_TYPE)" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> </el-form-item> <el-form-item label="显示排序" prop="sort"> <el-input-number v-model="formData.sort" :min="0" controls-position="right" /> </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 { DICT_TYPE, getStrDictOptions } from '@/utils/dict' import * as DataSetFieldApi from '@/api/data/ind/data/data.field' import { CommonStatusEnum } from '@/utils/constants' defineOptions({ name: 'IndDataSetFieldForm' }) 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, dataSetId: '', fieldCode: '', fieldName: '', fieldType: '', sort: undefined }) const formRules = reactive({ fieldCode: [{ required: true, message: '数据标签不能为空', trigger: 'blur' }], fieldName: [{ required: true, message: '数据键值不能为空', trigger: 'blur' }], sort: [{ required: true, message: '数据顺序不能为空', trigger: 'blur' }] }) const formRef = ref() // 表单 Ref /** 打开弹窗 */ const open = async (type: string, id?: number, dataSetId?: string) => { dialogVisible.value = true dialogTitle.value = t('action.' + type) formType.value = type resetForm() if (dataSetId) { formData.value.dataSetId = dataSetId } // 修改时,设置数据 if (id) { formLoading.value = true try { formData.value = await DataSetFieldApi.getDataSetField(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 DataSetFieldApi.DataSetFieldVO if (formType.value === 'create') { await DataSetFieldApi.createDataSetField(data) message.success(t('common.createSuccess')) } else { await DataSetFieldApi.updateDataSetField(data) message.success(t('common.updateSuccess')) } dialogVisible.value = false // 发送操作成功的事件 emit('success') } finally { formLoading.value = false } } /** 重置表单 */ const resetForm = () => { formData.value = { id: undefined, dataSetId: '', fieldCode: '', fieldName: '', fieldType: '', sort: undefined } formRef.value?.resetFields() } </script> src/views/data/ind/data/field/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="dataSetId"> <el-select v-model="queryParams.dataSetId" class="!w-240px"> <el-option v-for="item in dictSetList" :key="item.id" :label="item.name" :value="item.id" /> </el-select> </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="['data:ind-data-set: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="英文名" header-align="center" align="left" prop="fieldCode" /> <el-table-column label="中文名" header-align="center" align="left" prop="fieldName" /> <el-table-column label="数据类型" align="center" prop="fieldType"> <template #default="scope"> <dict-tag :type="DICT_TYPE.DATA_FIELD_TYPE" :value="scope.row.fieldType" /> </template> </el-table-column> <el-table-column label="排序" align="center" prop="sort" /> <el-table-column label="操作" align="center"> <template #default="scope"> <el-button link type="primary" @click="openForm('update', scope.row.id)" v-hasPermi="['data:ind-data-set:update']" > 修改 </el-button> <el-button link type="danger" @click="handleDelete(scope.row.id)" v-hasPermi="['data:ind-data-set: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> <!-- 表单弹窗:添加/修改 --> <DataSetFieldForm ref="formRef" @success="getList" /> </template> <script lang="ts" setup> import { getIntDictOptions, DICT_TYPE } from '@/utils/dict' import { dateFormatter } from '@/utils/formatTime' import download from '@/utils/download' import * as DataSetApi from '@/api/data/ind/data/data.set' import * as DataSetFieldApi from '@/api/data/ind/data/data.field' import DataSetFieldForm from './DataSetFieldForm.vue' defineOptions({ name: 'IndDataSetField' }) 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, label: '', dataSetId: route.params.dataSetId }) const queryFormRef = ref() // 搜索的表单 const exportLoading = ref(false) // 导出的加载中 const dictSetList = ref<DataSetApi.DataSetVO[]>() // 字典类型的列表 /** 查询列表 */ const getList = async () => { loading.value = true try { const data = await DataSetFieldApi.getDataSetFieldPage(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 formRef = ref() const openForm = (type: string, id?: number) => { formRef.value.open(type, id, queryParams.dataSetId) } /** 删除按钮操作 */ const handleDelete = async (id: number) => { try { // 删除的二次确认 await message.delConfirm() // 发起删除 await DataSetFieldApi.deleteDataSetField(id) message.success(t('common.delSuccess')) // 刷新列表 await getList() } catch {} } /** 初始化 **/ onMounted(async () => { await getList() // 查询字典(精简)列表 dictSetList.value = await DataSetApi.getDataSetList() }) </script> src/views/data/ind/data/index.vue
@@ -27,7 +27,7 @@ 重置 </el-button> <el-button v-hasPermi="['system:dict:create']" v-hasPermi="['data:ind-data-set:create']" plain type="primary" @click="openForm('create')" @@ -54,18 +54,18 @@ <el-table-column align="center" label="操作"> <template #default="scope"> <el-button v-hasPermi="['system:dict:update']" v-hasPermi="['data:ind-data-set:update']" link type="primary" @click="openForm('update', scope.row.id)" > 修改 </el-button> <router-link :to="'/ind/data/field/' + scope.row.type"> <router-link :to="'/ind/data/field/' + scope.row.id"> <el-button link type="primary">字段</el-button> </router-link> <el-button v-hasPermi="['system:dict:delete']" v-hasPermi="['data:ind-data-set:delete']" link type="danger" @click="handleDelete(scope.row.id)"