update 优化表单绑定逻辑,移除流程定义配置表单,添加模型复制
This commit is contained in:
		| @ -59,7 +59,7 @@ | ||||
|  | ||||
|           <el-table border v-loading="loading" :data="modelList" @selection-change="handleSelectionChange"> | ||||
|             <el-table-column type="selection" width="55" align="center" /> | ||||
|             <el-table-column fixed align="center" type="index" label="序号" width="50"></el-table-column> | ||||
|             <el-table-column fixed align="center" type="index" label="序号" width="80"></el-table-column> | ||||
|             <el-table-column align="center" :show-overflow-tooltip="true" prop="name" label="模型名称" width="200"></el-table-column> | ||||
|             <el-table-column align="center" prop="key" label="模型KEY"></el-table-column> | ||||
|             <el-table-column align="center" prop="version" label="版本号" width="90"> | ||||
| @ -68,7 +68,7 @@ | ||||
|             <el-table-column align="center" prop="metaInfo" label="备注说明" min-width="130"></el-table-column> | ||||
|             <el-table-column align="center" :show-overflow-tooltip="true" prop="createTime" label="创建时间" width="160"></el-table-column> | ||||
|             <el-table-column align="center" :show-overflow-tooltip="true" prop="lastUpdateTime" label="更新时间" width="160"></el-table-column> | ||||
|             <el-table-column fixed="right" label="操作" align="center" width="150" class-name="small-padding fixed-width"> | ||||
|             <el-table-column fixed="right" label="操作" align="center" width="170" class-name="small-padding fixed-width"> | ||||
|               <template #default="scope"> | ||||
|                 <el-row :gutter="10" class="mb8"> | ||||
|                   <el-col :span="1.5"> | ||||
| @ -84,6 +84,11 @@ | ||||
|                       流程部署 | ||||
|                     </el-button> | ||||
|                   </el-col> | ||||
|                   <el-col :span="1.5"> | ||||
|                     <el-button link type="primary" size="small" icon="CopyDocument" @click="handleCopy(scope.row)"> | ||||
|                       复制模型 | ||||
|                     </el-button> | ||||
|                   </el-col> | ||||
|                 </el-row> | ||||
|               </template> | ||||
|             </el-table-column> | ||||
| @ -105,10 +110,10 @@ | ||||
|     <el-dialog v-model="dialog.visible" :title="dialog.title" width="650px" append-to-body :close-on-click-modal="false"> | ||||
|       <el-form ref="formRef" :model="form" :rules="rules" label-width="100px"> | ||||
|         <el-form-item label="模型名称:" prop="name"> | ||||
|           <el-input v-model="form.name" :disabled="ids && ids.length > 0" maxlength="20" show-word-limit /> | ||||
|           <el-input v-model="form.name" :disabled="ids && ids.length > 0 && billType === 'update'" maxlength="20" show-word-limit /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="模型KEY:" prop="key"> | ||||
|           <el-input v-model="form.key" :disabled="ids && ids.length > 0" maxlength="20" show-word-limit /> | ||||
|           <el-input v-model="form.key" :disabled="ids && ids.length > 0 && billType === 'update'" maxlength="20" show-word-limit /> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="流程分类" prop="categoryCode"> | ||||
|           <el-tree-select | ||||
| @ -139,6 +144,7 @@ import Design from './design.vue'; | ||||
| import { listModel, addModel, delModel, modelDeploy, getInfo, update } from '@/api/workflow/model'; | ||||
| import { ModelQuery, ModelForm, ModelVO } from '@/api/workflow/model/types'; | ||||
| import { listCategory } from '@/api/workflow/category'; | ||||
| import { copyModel } from '@/api/workflow/model/index'; | ||||
|  | ||||
| const { proxy } = getCurrentInstance() as ComponentInternalInstance; | ||||
|  | ||||
| @ -163,7 +169,7 @@ const total = ref(0); | ||||
| const modelList = ref<ModelVO[]>([]); | ||||
| const categoryOptions = ref<CategoryOption[]>([]); | ||||
| const categoryName = ref(''); | ||||
| const modelId = ref<string>(''); | ||||
| const billType = ref<string>(''); | ||||
|  | ||||
| const dialog = reactive<DialogOption>({ | ||||
|   visible: false, | ||||
| @ -268,14 +274,18 @@ const clickDeploy = async (id: string, key: string) => { | ||||
|   await getList(); | ||||
|   proxy?.$modal.msgSuccess('部署成功'); | ||||
| }; | ||||
| //新增打开 | ||||
| const handleAdd = () => { | ||||
|   billType.value = 'add'; | ||||
|   ids.value = []; | ||||
|   getTreeselect(); | ||||
|   form.value = { ...initFormData }; | ||||
|   dialog.visible = true; | ||||
|   dialog.title = '新增模型'; | ||||
| }; | ||||
| //修改打开 | ||||
| const handleUpdate = () => { | ||||
|   billType.value = 'update'; | ||||
|   dialog.title = '修改模型'; | ||||
|   nextTick(async () => { | ||||
|     await getTreeselect(); | ||||
| @ -286,20 +296,35 @@ const handleUpdate = () => { | ||||
|   }); | ||||
| }; | ||||
|  | ||||
| //复制打开 | ||||
| const handleCopy = (row?: ModelVO) => { | ||||
|   billType.value = 'copy'; | ||||
|   dialog.title = '复制模型'; | ||||
|   nextTick(async () => { | ||||
|     await getTreeselect(); | ||||
|     form.value = { ...initFormData }; | ||||
|     form.value.id = row.id | ||||
|     dialog.visible = true; | ||||
|   }); | ||||
| }; | ||||
|  | ||||
| /** 提交按钮 */ | ||||
| const submitForm = () => { | ||||
|   formRef.value.validate(async (valid: boolean) => { | ||||
|     if (valid) { | ||||
|       buttonLoading.value = true; | ||||
|       if (ids.value && ids.value.length > 0) { | ||||
|       if('copy' === billType.value){ | ||||
|         await copyModel(form.value); | ||||
|         proxy?.$modal.msgSuccess('操作成功'); | ||||
|       }else if(ids.value && ids.value.length > 0 && 'update' === billType.value){ | ||||
|         form.value.id = ids.value[0]; | ||||
|         await update(form.value); | ||||
|         proxy?.$modal.msgSuccess('新增成功'); | ||||
|       } else { | ||||
|         proxy?.$modal.msgSuccess('操作成功'); | ||||
|       }else { | ||||
|         initXml(form.value.key, form.value.name); | ||||
|         form.value.xml = xml.value; | ||||
|         await addModel(form.value); | ||||
|         proxy?.$modal.msgSuccess('新增成功'); | ||||
|         proxy?.$modal.msgSuccess('操作成功'); | ||||
|       } | ||||
|       dialog.visible = false; | ||||
|       await getList(); | ||||
|  | ||||
| @ -108,7 +108,6 @@ | ||||
|                       <template #dropdown> | ||||
|                         <el-dropdown-menu> | ||||
|                           <el-dropdown-item @click="getProcessDefinitionHitoryList(scope.row.id, scope.row.key)">历史版本</el-dropdown-item> | ||||
|                           <el-dropdown-item @click="handleFormOpen(scope.row)">表单配置</el-dropdown-item> | ||||
|                         </el-dropdown-menu> | ||||
|                       </template> | ||||
|                     </el-dropdown> | ||||
| @ -211,39 +210,11 @@ | ||||
|               <el-col :span="1.5"> | ||||
|                 <el-button link type="primary" icon="Sort" size="small" @click="handleConvertToModel(scope.row)"> 转换模型 </el-button> | ||||
|               </el-col> | ||||
|               <el-col :span="1.5"> | ||||
|                 <el-button link type="primary" icon="Setting" size="small" @click="handleFormOpen(scope.row)"> 表单配置 </el-button> | ||||
|               </el-col> | ||||
|             </el-row> | ||||
|           </template> | ||||
|         </el-table-column> | ||||
|       </el-table> | ||||
|     </el-dialog> | ||||
|     <!-- 表单配置 --> | ||||
|     <el-dialog v-model="formDialog.visible" :title="formDialog.title" width="650px" append-to-body :close-on-click-modal="false"> | ||||
|       <el-form :model="definitionConfigForm" label-width="auto"> | ||||
|         <el-form-item label="流程KEY"> | ||||
|           <el-input v-model="definitionConfigForm.processKey" disabled/> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="表单" prop="formId"> | ||||
|           <el-select v-model="definitionConfigForm.formId" clearable filterable placeholder="请选择表单"  style="width: 260px" > | ||||
|             <el-option  v-for="item in formManageList"  :key="item.id"  :label="item.formTypeName+':'+item.formName" :value="item.id" /> | ||||
|           </el-select> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="备注"> | ||||
|           <el-input v-model="definitionConfigForm.remark" type="textarea" resize="none"/> | ||||
|         </el-form-item> | ||||
|       </el-form> | ||||
|        | ||||
|       <template #footer> | ||||
|         <div class="dialog-footer"> | ||||
|           <el-button @click="formDialog.visible = false">取消</el-button> | ||||
|           <el-button type="primary" @click="handlerSaveForm"> | ||||
|             保存 | ||||
|           </el-button> | ||||
|         </div> | ||||
|       </template> | ||||
|     </el-dialog> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| @ -260,15 +231,10 @@ import { | ||||
| } from '@/api/workflow/processDefinition'; | ||||
| import ProcessPreview from './components/processPreview.vue'; | ||||
| import { listCategory } from '@/api/workflow/category'; | ||||
| import { getByDefId,saveOrUpdate } from '@/api/workflow/definitionConfig'; | ||||
| import { CategoryVO } from '@/api/workflow/category/types'; | ||||
| import { ProcessDefinitionQuery, ProcessDefinitionVO } from '@/api/workflow/processDefinition/types'; | ||||
| import { definitionConfigForm } from '@/api/workflow/definitionConfig/types'; | ||||
| import { UploadRequestOptions } from 'element-plus'; | ||||
| import { FormManageVO } from '@/api/workflow/formManage/types'; | ||||
| import { selectListFormManage } from '@/api/workflow/formManage'; | ||||
|  | ||||
| const formManageList = ref<FormManageVO[]>([]); | ||||
| const { proxy } = getCurrentInstance() as ComponentInternalInstance; | ||||
|  | ||||
| const previewRef = ref<InstanceType<typeof ProcessPreview>>(); | ||||
| @ -295,7 +261,6 @@ const categoryOptions = ref<CategoryOption[]>([]); | ||||
| const categoryName = ref(''); | ||||
| /** 部署文件分类选择 */ | ||||
| const selectCategory = ref(); | ||||
| const definitionConfigForm = ref<definitionConfigForm>({}); | ||||
|  | ||||
| const uploadDialog = reactive<DialogOption>({ | ||||
|   visible: false, | ||||
| @ -307,11 +272,6 @@ const processDefinitionDialog = reactive<DialogOption>({ | ||||
|   title: '历史版本' | ||||
| }); | ||||
|  | ||||
| const formDialog = reactive<DialogOption>({ | ||||
|   visible: false, | ||||
|   title: '表单配置' | ||||
| }); | ||||
|  | ||||
| // 查询参数 | ||||
| const queryParams = ref<ProcessDefinitionQuery>({ | ||||
|   pageNum: 1, | ||||
| @ -476,34 +436,4 @@ const handerDeployProcessFile = (data: UploadRequestOptions): XMLHttpRequest => | ||||
|     }); | ||||
|   return; | ||||
| }; | ||||
| //打开表单配置 | ||||
| const handleFormOpen = async (row: ProcessDefinitionVO) => { | ||||
|   listFormManage() | ||||
|    formDialog.visible = true | ||||
|    definitionConfigForm.value.processKey = row.key | ||||
|    definitionConfigForm.value.definitionId = row.id | ||||
|    const resp = await getByDefId(row.id) | ||||
|    if(resp.data){ | ||||
|     definitionConfigForm.value = resp.data | ||||
|    }else{ | ||||
|     definitionConfigForm.value.formId = undefined | ||||
|     definitionConfigForm.value.remark = undefined | ||||
|    } | ||||
| } | ||||
| //保存表单 | ||||
| const handlerSaveForm = async () => { | ||||
|   await proxy?.$modal.confirm('是否确认保存?'); | ||||
|   saveOrUpdate(definitionConfigForm.value).then(resp=>{ | ||||
|     if(resp.code === 200){ | ||||
|       proxy?.$modal.msgSuccess('操作成功'); | ||||
|       formDialog.visible = false | ||||
|       getList(); | ||||
|     } | ||||
|   }) | ||||
| } | ||||
| //表单列表 | ||||
| const listFormManage = async () => { | ||||
|   const res = await selectListFormManage(); | ||||
|   formManageList.value = res.data; | ||||
| } | ||||
| </script> | ||||
|  | ||||
		Reference in New Issue
	
	Block a user
	 gssong
					gssong