webhook节点隐藏通用属性

src/components/gFlow/propertySetting/CommonProperty.vue

@@ -4,98 +4,102 @@
 			<el-form-item label="节点名称">
 				<el-input v-model="formData.text" :disabled="readonly"></el-input>
 			</el-form-item>
-			<el-form-item label="审核方式" v-if="nodeType === NodeTypeStart">
-				<el-select v-model="formData.actionRule" placeholder="请选择审核方式" clearable :disabled="readonly">
-					<el-option v-for="item in actionRuleOption" :key="item.value" :label="item.label" :value="item.value" />
-				</el-select>
-			</el-form-item>
-			<el-form-item label="接收方式" v-else>
-				<el-select v-model="formData.actionRule" placeholder="请选择接收方式" clearable :disabled="readonly">
-					<el-option v-for="item in actionRuleOption" :key="item.value" :label="item.label" :value="item.value" />
-				</el-select>
-			</el-form-item>
-			<el-form-item
-				label="指定上级部门"
-				v-show="formData.actionRule === FlowCheckRuleFormCreatorDeptPrev || formData.actionRule === FlowCheckRuleFormCreatorDeptLeaderPrev"
-			>
-				<el-input-number v-model="formData.deptProv" style="width: 200px" placeholder="Please input">
-					<template #prefix><span>上</span></template>
-					<template #suffix><span>级部门</span></template>
-				</el-input-number>
-			</el-form-item>
-			<el-form-item label="指定角色" v-show="formData.actionRule === FlowCheckRuleRole">
-				<el-cascader
-					:options="roleList"
-					:props="{ checkStrictly: true, emitPath: false, value: 'id', label: 'name', multiple: true }"
-					placeholder="请选择角色"
-					clearable
-					class="w100"
-					v-model="formData.roleIds"
-					:disabled="readonly"
+			<template v-if="nodeType !== NodeTypeWebHook">
+				<el-form-item label="审核方式" v-if="nodeType === NodeTypeStart">
+					<el-select v-model="formData.actionRule" placeholder="请选择审核方式" clearable :disabled="readonly">
+						<el-option v-for="item in actionRuleOption" :key="item.value" :label="item.label" :value="item.value" />
+					</el-select>
+				</el-form-item>
+				<el-form-item label="接收方式" v-else>
+					<el-select v-model="formData.actionRule" placeholder="请选择接收方式" clearable :disabled="readonly">
+						<el-option v-for="item in actionRuleOption" :key="item.value" :label="item.label" :value="item.value" />
+					</el-select>
+				</el-form-item>
+				<el-form-item
+					label="指定上级部门"
+					v-show="formData.actionRule === FlowCheckRuleFormCreatorDeptPrev || formData.actionRule === FlowCheckRuleFormCreatorDeptLeaderPrev"
 				>
-					<template #default="{ node, data }">
-						<span>{{ data.name }}</span>
-						<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
-					</template>
-				</el-cascader>
-			</el-form-item>
-			<el-form-item
-				label="指定部门"
-				prop="deptId"
-				v-show="formData.actionRule === FlowCheckRuleDept || formData.actionRule === FlowCheckRuleDeptLeader"
-			>
-				<el-cascader
-					:options="deptData"
-					:props="{ checkStrictly: true, emitPath: false, value: 'deptId', label: 'deptName', multiple: true }"
-					placeholder="请选择部门"
-					clearable
-					class="w100"
-					v-model="formData.deptIds"
-					:disabled="readonly"
+					<el-input-number v-model="formData.deptProv" style="width: 200px" placeholder="Please input">
+						<template #prefix><span>上</span></template>
+						<template #suffix><span>级部门</span></template>
+					</el-input-number>
+				</el-form-item>
+				<el-form-item label="指定角色" v-show="formData.actionRule === FlowCheckRuleRole">
+					<el-cascader
+						:options="roleList"
+						:props="{ checkStrictly: true, emitPath: false, value: 'id', label: 'name', multiple: true }"
+						placeholder="请选择角色"
+						clearable
+						class="w100"
+						v-model="formData.roleIds"
+						:disabled="readonly"
+					>
+						<template #default="{ node, data }">
+							<span>{{ data.name }}</span>
+							<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
+						</template>
+					</el-cascader>
+				</el-form-item>
+				<el-form-item
+					label="指定部门"
+					prop="deptId"
+					v-show="formData.actionRule === FlowCheckRuleDept || formData.actionRule === FlowCheckRuleDeptLeader"
 				>
-					<template #default="{ node, data }">
-						<span>{{ data.deptName }}</span>
-						<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
-					</template>
-				</el-cascader>
-			</el-form-item>
-			<el-form-item label="指定岗位" prop="postIds" v-show="formData.actionRule === FlowCheckRulePost">
-				<el-select v-model="formData.postIds" placeholder="请选择" clearable class="w100" multiple :disabled="readonly">
-					<el-option v-for="post in postList" :key="'post-' + post.postId" :label="post.postName" :value="post.postId"> </el-option>
-				</el-select>
-			</el-form-item>
-			<el-form-item label="指定人员" v-show="formData.actionRule === FlowCheckRuleUser">
-				<select-user v-model="formData.userIds"></select-user>
-			</el-form-item>
-			<el-form-item label="多人审批处理规则">
-				<el-select v-model="formData.approveRule" placeholder="请选择多人审批处理规则" style="width: 100%" :disabled="readonly">
-					<el-option v-for="item in approveRuleOption" :key="item.value" :label="item.label" :value="item.value" />
-				</el-select>
-			</el-form-item>
-			<el-form-item label="网关审批处理规则" v-show="nodeType === NodeTypeConcurrent || nodeType === NodeTypePush || nodeType === NodeTypeCondition">
-				<el-select v-model="nodeType" placeholder="请选择多人审批处理规则" :disabled="true" style="width: 100%">
-					<el-option v-for="item in conditionRuleOption" :key="item.value" :label="item.label" :value="item.value" />
-				</el-select>
-			</el-form-item>
-			<el-form-item label="发送通知">
-				<el-checkbox-group v-model="formData.notice" :disabled="readonly">
-					<el-checkbox label="sms">短信</el-checkbox>
-					<el-checkbox label="email">邮件</el-checkbox>
-					<el-checkbox label="innerNotice">站内通知</el-checkbox>
-				</el-checkbox-group>
-			</el-form-item>
-			<el-form-item label="允许退回" v-show="nodeType !== NodeTypeStart">
-				<el-radio-group v-model="formData.rollback" :disabled="readonly">
-					<el-radio label="1">是</el-radio>
-					<el-radio label="0">否</el-radio>
-				</el-radio-group>
-			</el-form-item>
-			<el-form-item label="分支条件" v-show="nodeType === NodeTypeCondition">
-				<Branch ref="branchRef" :modelValue="formData.nodeExt" @setNodeExt="setNodeExt"></Branch>
-			</el-form-item>
-
+					<el-cascader
+						:options="deptData"
+						:props="{ checkStrictly: true, emitPath: false, value: 'deptId', label: 'deptName', multiple: true }"
+						placeholder="请选择部门"
+						clearable
+						class="w100"
+						v-model="formData.deptIds"
+						:disabled="readonly"
+					>
+						<template #default="{ node, data }">
+							<span>{{ data.deptName }}</span>
+							<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
+						</template>
+					</el-cascader>
+				</el-form-item>
+				<el-form-item label="指定岗位" prop="postIds" v-show="formData.actionRule === FlowCheckRulePost">
+					<el-select v-model="formData.postIds" placeholder="请选择" clearable class="w100" multiple :disabled="readonly">
+						<el-option v-for="post in postList" :key="'post-' + post.postId" :label="post.postName" :value="post.postId"> </el-option>
+					</el-select>
+				</el-form-item>
+				<el-form-item label="指定人员" v-show="formData.actionRule === FlowCheckRuleUser">
+					<select-user v-model="formData.userIds"></select-user>
+				</el-form-item>
+				<el-form-item label="多人审批处理规则">
+					<el-select v-model="formData.approveRule" placeholder="请选择多人审批处理规则" style="width: 100%" :disabled="readonly">
+						<el-option v-for="item in approveRuleOption" :key="item.value" :label="item.label" :value="item.value" />
+					</el-select>
+				</el-form-item>
+				<el-form-item
+					label="网关审批处理规则"
+					v-show="nodeType === NodeTypeConcurrent || nodeType === NodeTypePush || nodeType === NodeTypeCondition"
+				>
+					<el-select v-model="nodeType" placeholder="请选择多人审批处理规则" :disabled="true" style="width: 100%">
+						<el-option v-for="item in conditionRuleOption" :key="item.value" :label="item.label" :value="item.value" />
+					</el-select>
+				</el-form-item>
+				<el-form-item label="发送通知">
+					<el-checkbox-group v-model="formData.notice" :disabled="readonly">
+						<el-checkbox label="sms">短信</el-checkbox>
+						<el-checkbox label="email">邮件</el-checkbox>
+						<el-checkbox label="innerNotice">站内通知</el-checkbox>
+					</el-checkbox-group>
+				</el-form-item>
+				<el-form-item label="允许退回" v-show="nodeType !== NodeTypeStart">
+					<el-radio-group v-model="formData.rollback" :disabled="readonly">
+						<el-radio label="1">是</el-radio>
+						<el-radio label="0">否</el-radio>
+					</el-radio-group>
+				</el-form-item>
+				<el-form-item label="分支条件" v-show="nodeType === NodeTypeCondition">
+					<Branch ref="branchRef" :modelValue="formData.nodeExt" @setNodeExt="setNodeExt"></Branch>
+				</el-form-item>
+			</template>
 			<!-- WebHook 特定配置 -->
-			<template v-if="nodeType === NodeTypeWebHook">
+			<template v-else>
 				<el-form-item label="请求地址" required>
 					<el-input v-model="formData.webhook.url" placeholder="请输入WebHook URL" :disabled="readonly"></el-input>
 				</el-form-item>
@@ -106,20 +110,12 @@
 				</el-form-item>
 				<!-- 请求头 - 所有方法都显示 -->
 				<el-form-item label="请求头">
-					<WebHookParams
-						ref="headersRef"
-						v-model="formData.webhook.headers"
-						title="请求头参数"
-						@setParams="setWebHookHeaders" />
+					<WebHookParams ref="headersRef" v-model="formData.webhook.headers" title="请求头参数" @setParams="setWebHookHeaders" />
 				</el-form-item>
 
 				<!-- 请求参数 - 所有方法都显示 -->
 				<el-form-item label="请求参数">
-					<WebHookParams
-						ref="paramsRef"
-						v-model="formData.webhook.params"
-						title="URL参数"
-						@setParams="setWebHookParams" />
+					<WebHookParams ref="paramsRef" v-model="formData.webhook.params" title="URL参数" @setParams="setWebHookParams" />
 				</el-form-item>
 
 				<!-- 请求体类型 - 仅 POST/PUT 显示 -->
@@ -131,12 +127,12 @@
 
 				<!-- 请求体 - 仅 POST/PUT 显示 -->
 				<el-form-item label="请求体" v-show="formData.webhook.method === 'POST' || formData.webhook.method === 'PUT'">
-					<el-input type="textarea" v-model="formData.webhook.body"/>
-<!--					<WebHookParams-->
-<!--						ref="bodyRef"-->
-<!--						v-model="formData.webhook.body"-->
-<!--						title="请求体参数"-->
-<!--						@setParams="setWebHookBody" />-->
+					<el-input type="textarea" v-model="formData.webhook.body" :autosize="{ minRows: 10, maxRows: 10 }" />
+					<!--					<WebHookParams-->
+					<!--						ref="bodyRef"-->
+					<!--						v-model="formData.webhook.body"-->
+					<!--						title="请求体参数"-->
+					<!--						@setParams="setWebHookBody" />-->
 				</el-form-item>
 			</template>
 
@@ -148,15 +144,6 @@
 </template>
 <script setup lang="ts">
 import { NodeConditionData, WebHookParamData } from '/@/components/gFlow/propertySetting/model'
-
-interface PostInfo {
-	postId: number
-	postName: string
-}
-
-const getDeptTree = ()=> systemApi.dept.getList({ status: -1 })
-const getParams = ()=> systemApi.user.params()
-
 import selectUser from '/@/components/selectUser/index.vue'
 import LogicFlow from '@logicflow/core'
 import { computed, getCurrentInstance, onMounted, reactive, ref, toRefs } from 'vue'
@@ -169,8 +156,8 @@ import {
 	FlowCheckRuleFormCreator,
 	FlowCheckRuleFormCreatorDept,
 	FlowCheckRuleFormCreatorDeptLeader,
-	FlowCheckRuleFormCreatorDeptPrev,
 	FlowCheckRuleFormCreatorDeptLeaderPrev,
+	FlowCheckRuleFormCreatorDeptPrev,
 	FlowCheckRulePost,
 	FlowCheckRuleRole,
 	FlowCheckRuleUser,
@@ -182,6 +169,13 @@ import {
 } from '/@/components/gFlow/consts'
 import systemApi from '/@/api/system'
 
+interface PostInfo {
+	postId: number
+	postName: string
+}
+
+const getDeptTree = () => systemApi.dept.getList({ status: -1 })
+const getParams = () => systemApi.user.params()
 
 const branchRef = ref()
 const paramsRef = ref()
@@ -317,7 +311,7 @@ onMounted(() => {
 	if (properties) {
 		state.formData = Object.assign({}, state.formData, properties)
 		//设置条件
-		branchRef.value.initNodeData(state.formData.nodeExt)
+		branchRef.value?.initNodeData(state.formData.nodeExt)
 		//设置WebHook参数
 		if (nodeType.value === NodeTypeWebHook) {
 			paramsRef.value?.initParams(state.formData.webhook?.params || [])
@@ -337,12 +331,13 @@ const getSelector = () => {
 	//获取角色岗位选项
 	//TODO 可能需要加新的api
 	getParams().then((res: any) => {
-		const roles = res.roleList?.map((item: any)=>{
-			if (item.parentId === -1) {
-				item.parentId = 0
-			}
-			return item
-		}) ?? []
+		const roles =
+			res.roleList?.map((item: any) => {
+				if (item.parentId === -1) {
+					item.parentId = 0
+				}
+				return item
+			}) ?? []
 		// const roleAccess = res.roleAccess ?? []
 		// roles.map((item: any) => {
 		// 	if (!roleAccess.includes(item.id)) {
@@ -357,7 +352,7 @@ const getSelector = () => {
 	})
 }
 const onSubmit = () => {
-	branchRef.value.setNodeExt()
+	branchRef.value?.setNodeExt()
 
 	// 处理 WebHook 参数
 	if (nodeType.value === NodeTypeWebHook) {