mirror of
https://github.com/m-xlsea/ruoyi-plus-soybean.git
synced 2025-09-23 23:39:47 +08:00
feat(projects): 流程定义添加设计器样式等拓展字段,优化流程分类下拉组件
This commit is contained in:
@ -15,6 +15,7 @@ defineProps<Props>();
|
||||
|
||||
const rawValue = defineModel<CommonType.IdType | null>('value', { required: false });
|
||||
const options = defineModel<Api.Common.CommonTreeRecord>('options', { required: false, default: [] });
|
||||
const expandedKeys = defineModel<CommonType.IdType[]>('expandedKeys', { required: false, default: [] });
|
||||
|
||||
const attrs: TreeSelectProps = useAttrs();
|
||||
const { loading, startLoading, endLoading } = useLoading();
|
||||
@ -34,6 +35,10 @@ async function getCategoryList() {
|
||||
const { error, data } = await fetchGetCategoryTree();
|
||||
if (error) return;
|
||||
options.value = data;
|
||||
// 设置默认展开的节点
|
||||
if (data?.length && !expandedKeys.value.length) {
|
||||
expandedKeys.value = [data[0].id];
|
||||
}
|
||||
endLoading();
|
||||
}
|
||||
|
||||
@ -43,13 +48,13 @@ getCategoryList();
|
||||
<template>
|
||||
<NTreeSelect
|
||||
v-model:value="strValue"
|
||||
v-model:expanded-keys="expandedKeys"
|
||||
filterable
|
||||
class="h-full"
|
||||
:loading="loading"
|
||||
key-field="id"
|
||||
label-field="label"
|
||||
:options="options as []"
|
||||
:default-expanded-keys="[0]"
|
||||
v-bind="attrs"
|
||||
/>
|
||||
</template>
|
||||
|
@ -73,6 +73,14 @@ export const workflowNodeTypeRecord: Record<Api.Workflow.WorkflowNodeType, strin
|
||||
|
||||
export const workflowNodeTypeOptions = transformRecordToOption(workflowNodeTypeRecord);
|
||||
|
||||
/** definition designer mode */
|
||||
export const definitionDesignerModeRecord: Record<Api.Workflow.DefinitionDesignerMode, string> = {
|
||||
CLASSICS: '经典模式',
|
||||
MIMIC: '仿钉钉模式'
|
||||
};
|
||||
|
||||
export const definitionDesignerModeOptions = transformRecordToOption(definitionDesignerModeRecord);
|
||||
|
||||
/** activity status */
|
||||
export const workflowActivityStatusRecord: Record<Api.Workflow.WorkflowActivityStatus, string> = {
|
||||
0: '挂起',
|
||||
|
14
src/typings/api/workflow.api.d.ts
vendored
14
src/typings/api/workflow.api.d.ts
vendored
@ -122,6 +122,9 @@ declare namespace Api {
|
||||
/** 工作流发布状态 */
|
||||
type WorkflowPublishStatus = 0 | 1 | 9;
|
||||
|
||||
/** 设计器模式 */
|
||||
type DefinitionDesignerMode = 'CLASSICS' | 'MIMIC';
|
||||
|
||||
/** definition */
|
||||
type Definition = Common.CommonTenantRecord<{
|
||||
/** 主键id */
|
||||
@ -139,17 +142,19 @@ declare namespace Api {
|
||||
/** 是否发布(0未发布 1已发布 9失效) */
|
||||
isPublish: WorkflowPublishStatus;
|
||||
/** 审批表单是否自定义(Y是 N否) */
|
||||
formCustom: string;
|
||||
formCustom: Api.Common.YesOrNoStatus;
|
||||
/** 审批表单路径 */
|
||||
formPath: string;
|
||||
/** 流程激活状态(0挂起 1激活) */
|
||||
activityStatus: number;
|
||||
activityStatus: WorkflowActivityStatus;
|
||||
/** 监听器类型 */
|
||||
listenerType: string;
|
||||
/** 监听器路径 */
|
||||
listenerPath: string;
|
||||
/** 业务详情 存业务表对象json字符串 */
|
||||
ext: string;
|
||||
/** 设计器模式 */
|
||||
modelValue: DefinitionDesignerMode;
|
||||
/** 删除标志 */
|
||||
delFlag: string;
|
||||
}>;
|
||||
@ -161,7 +166,10 @@ declare namespace Api {
|
||||
|
||||
/** definition operate params */
|
||||
type DefinitionOperateParams = CommonType.RecordNullable<
|
||||
Pick<Api.Workflow.Definition, 'id' | 'flowCode' | 'flowName' | 'category' | 'formPath'>
|
||||
Pick<
|
||||
Api.Workflow.Definition,
|
||||
'id' | 'flowCode' | 'flowName' | 'category' | 'formPath' | 'formCustom' | 'modelValue' | 'ext'
|
||||
>
|
||||
>;
|
||||
|
||||
/** definition list */
|
||||
|
@ -1,8 +1,10 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, reactive, ref, watch } from 'vue';
|
||||
import type { SelectOption } from 'naive-ui';
|
||||
import { definitionDesignerModeOptions } from '@/constants/workflow';
|
||||
import { fetchCreateDefinition, fetchUpdateDefinition } from '@/service/api/workflow/definition';
|
||||
import { useFormRules, useNaiveForm } from '@/hooks/common/form';
|
||||
import { useDict } from '@/hooks/business/dict';
|
||||
import { $t } from '@/locales';
|
||||
|
||||
defineOptions({
|
||||
@ -24,6 +26,7 @@ interface Emits {
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
|
||||
useDict('sys_yes_no');
|
||||
const visible = defineModel<boolean>('visible', {
|
||||
default: false
|
||||
});
|
||||
@ -51,31 +54,55 @@ type Model = Api.Workflow.DefinitionOperateParams;
|
||||
|
||||
const model: Model = reactive(createDefaultModel());
|
||||
|
||||
/** 是否自动通过 */
|
||||
const autoPass = ref<boolean>(false);
|
||||
|
||||
function createDefaultModel(): Model {
|
||||
return {
|
||||
flowCode: '',
|
||||
flowName: '',
|
||||
category: '',
|
||||
formPath: undefined
|
||||
formPath: null,
|
||||
formCustom: 'N',
|
||||
modelValue: 'CLASSICS',
|
||||
ext: ''
|
||||
};
|
||||
}
|
||||
|
||||
type RuleKey = Extract<keyof Model, 'flowCode' | 'flowName' | 'category'>;
|
||||
type RuleKey = Extract<keyof Model, 'flowCode' | 'flowName' | 'category' | 'modelValue' | 'formCustom'>;
|
||||
|
||||
const rules: Record<RuleKey, App.Global.FormRule> = {
|
||||
flowCode: createRequiredRule('流程编码不能为空'),
|
||||
flowName: createRequiredRule('流程名称不能为空'),
|
||||
category: createRequiredRule('流程类别不能为空')
|
||||
category: createRequiredRule('流程类别不能为空'),
|
||||
modelValue: createRequiredRule('设计器模式不能为空'),
|
||||
formCustom: createRequiredRule('审批表单是否自定义不能为空')
|
||||
};
|
||||
|
||||
function handleUpdateModelWhenEdit() {
|
||||
if (props.operateType === 'add') {
|
||||
Object.assign(model, createDefaultModel());
|
||||
model.formCustom = 'N';
|
||||
autoPass.value = false;
|
||||
// 设置默认的 ext JSON
|
||||
model.ext = JSON.stringify({ autoPass: false });
|
||||
return;
|
||||
}
|
||||
|
||||
if (props.operateType === 'edit' && props.rowData) {
|
||||
Object.assign(model, props.rowData);
|
||||
// 从 ext 字段解析 JSON 并设置 autoPass 值
|
||||
try {
|
||||
if (props.rowData.ext) {
|
||||
const extData = JSON.parse(props.rowData.ext);
|
||||
autoPass.value = extData.autoPass || false;
|
||||
} else {
|
||||
autoPass.value = false;
|
||||
}
|
||||
} catch {
|
||||
// 如果解析失败,设置默认值
|
||||
autoPass.value = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -86,16 +113,36 @@ function closeDrawer() {
|
||||
async function handleSubmit() {
|
||||
await validate();
|
||||
|
||||
// 将 autoPass 值序列化为 JSON 并存储到 ext 字段
|
||||
model.ext = JSON.stringify({ autoPass: autoPass.value });
|
||||
|
||||
// request
|
||||
if (props.operateType === 'add') {
|
||||
const { flowCode, flowName, category, formPath } = model;
|
||||
const { error } = await fetchCreateDefinition({ flowCode, flowName, category, formPath });
|
||||
const { flowCode, flowName, category, formPath, modelValue, formCustom, ext } = model;
|
||||
const { error } = await fetchCreateDefinition({
|
||||
flowCode,
|
||||
flowName,
|
||||
category,
|
||||
formPath: formPath || '',
|
||||
modelValue,
|
||||
formCustom,
|
||||
ext
|
||||
});
|
||||
if (error) return;
|
||||
}
|
||||
|
||||
if (props.operateType === 'edit') {
|
||||
const { id, flowCode, flowName, category, formPath } = model;
|
||||
const { error } = await fetchUpdateDefinition({ id, flowCode, flowName, category, formPath });
|
||||
const { id, flowCode, flowName, category, formPath, modelValue, formCustom, ext } = model;
|
||||
const { error } = await fetchUpdateDefinition({
|
||||
id,
|
||||
flowCode,
|
||||
flowName,
|
||||
category,
|
||||
formPath: formPath || '',
|
||||
modelValue,
|
||||
formCustom,
|
||||
ext
|
||||
});
|
||||
if (error) return;
|
||||
}
|
||||
|
||||
@ -125,6 +172,25 @@ watch(visible, () => {
|
||||
<NFormItem label="流程名称" path="flowName">
|
||||
<NInput v-model:value="model.flowName" placeholder="请输入流程名称" />
|
||||
</NFormItem>
|
||||
<NFormItem label="设计器模式" path="modelValue">
|
||||
<NRadioGroup v-model:value="model.modelValue" :disabled="operateType === 'edit'">
|
||||
<NSpace>
|
||||
<NRadioButton
|
||||
v-for="option in definitionDesignerModeOptions"
|
||||
:key="option.value"
|
||||
:value="option.value"
|
||||
:label="option.label"
|
||||
/>
|
||||
</NSpace>
|
||||
</NRadioGroup>
|
||||
</NFormItem>
|
||||
<!-- 流程配置 -->
|
||||
<NFormItem label="流程配置" path="ext">
|
||||
<NCheckbox v-model:checked="autoPass" label="下一节点执行人是当前任务处理人自动审批" />
|
||||
</NFormItem>
|
||||
<NFormItem label="是否动态表单" path="formCustom">
|
||||
<DictRadio v-model:value="model.formCustom" dict-code="sys_yes_no" />
|
||||
</NFormItem>
|
||||
<NFormItem label="审批表单路径" path="formPath">
|
||||
<template #label>
|
||||
<div class="flex-center">
|
||||
|
@ -55,7 +55,7 @@ function createDefaultModel(): Model {
|
||||
methodParams: '',
|
||||
viewSpel: '',
|
||||
remark: '',
|
||||
status: ''
|
||||
status: '0'
|
||||
};
|
||||
}
|
||||
|
||||
|
Reference in New Issue
Block a user