Showing
4 changed files
with
47 additions
and
29 deletions
| @@ -16,4 +16,6 @@ export const PageEnum = { | @@ -16,4 +16,6 @@ export const PageEnum = { | ||
| 16 | DEVICE_LIST: '/device/list', | 16 | DEVICE_LIST: '/device/list', | 
| 17 | 17 | ||
| 18 | SHARE_PAGE: '/share/:viewType/:id/:publicId', | 18 | SHARE_PAGE: '/share/:viewType/:id/:publicId', | 
| 19 | + | ||
| 20 | + RULE_CHAIN_DETAIL: '/rule/chain/:id', | ||
| 19 | }; | 21 | }; | 
| 1 | +import { RouteLocationNormalizedLoaded } from 'vue-router'; | ||
| 1 | import { RuleChainFieldsEnum, RuleChainFieldsNameEnum } from '../../../enum/formField/flow'; | 2 | import { RuleChainFieldsEnum, RuleChainFieldsNameEnum } from '../../../enum/formField/flow'; | 
| 2 | import { getRuleChains } from '/@/api/ruleDesigner'; | 3 | import { getRuleChains } from '/@/api/ruleDesigner'; | 
| 3 | import { FormSchema } from '/@/components/Form'; | 4 | import { FormSchema } from '/@/components/Form'; | 
| 4 | 5 | ||
| 5 | -const fetch = async (params: Recordable) => { | 6 | +const fetch = async (params: Recordable, ruleChainId: string) => { | 
| 6 | try { | 7 | try { | 
| 7 | const result = await getRuleChains(params); | 8 | const result = await getRuleChains(params); | 
| 8 | - const data = result.data.map((item) => ({ label: item.name, value: item.id.id })); | 9 | + const data = result.data | 
| 10 | + .map((item) => ({ label: item.name, value: item.id.id })) | ||
| 11 | + .filter((item) => item.value !== ruleChainId); | ||
| 9 | return data; | 12 | return data; | 
| 10 | } catch (err) { | 13 | } catch (err) { | 
| 11 | console.error(err); | 14 | console.error(err); | 
| @@ -13,24 +16,27 @@ const fetch = async (params: Recordable) => { | @@ -13,24 +16,27 @@ const fetch = async (params: Recordable) => { | ||
| 13 | } | 16 | } | 
| 14 | }; | 17 | }; | 
| 15 | 18 | ||
| 16 | -export const formSchemas: FormSchema[] = [ | ||
| 17 | - { | ||
| 18 | - field: RuleChainFieldsEnum.RULE_CHAIN_ID, | ||
| 19 | - label: RuleChainFieldsNameEnum.RULE_CHAIN_ID, | ||
| 20 | - component: 'ApiSearchSelect', | ||
| 21 | - componentProps: () => { | ||
| 22 | - return { | ||
| 23 | - placeholder: '请选择所属产品', | ||
| 24 | - showSearch: true, | ||
| 25 | - params: { | ||
| 26 | - pageSize: 50, | ||
| 27 | - page: 0, | ||
| 28 | - type: 'CORE', | ||
| 29 | - }, | ||
| 30 | - api: fetch, | ||
| 31 | - searchApi: fetch, | ||
| 32 | - getPopupContainer: () => document.body, | ||
| 33 | - }; | 19 | +export const getFormSchemas = (route: RouteLocationNormalizedLoaded): FormSchema[] => { | 
| 20 | + const ruleChainId = (route.params as Record<'id', string>).id; | ||
| 21 | + return [ | ||
| 22 | + { | ||
| 23 | + field: RuleChainFieldsEnum.RULE_CHAIN_ID, | ||
| 24 | + label: RuleChainFieldsNameEnum.RULE_CHAIN_ID, | ||
| 25 | + component: 'ApiSearchSelect', | ||
| 26 | + componentProps: () => { | ||
| 27 | + return { | ||
| 28 | + placeholder: '请选择所属产品', | ||
| 29 | + showSearch: true, | ||
| 30 | + params: { | ||
| 31 | + pageSize: 50, | ||
| 32 | + page: 0, | ||
| 33 | + type: 'CORE', | ||
| 34 | + }, | ||
| 35 | + api: (params: Recordable) => fetch(params, ruleChainId), | ||
| 36 | + searchApi: (params: Recordable) => fetch(params, ruleChainId), | ||
| 37 | + getPopupContainer: () => document.body, | ||
| 38 | + }; | ||
| 39 | + }, | ||
| 34 | }, | 40 | }, | 
| 35 | - }, | ||
| 36 | -]; | 41 | + ]; | 
| 42 | +}; | 
| 1 | <script lang="ts" setup> | 1 | <script lang="ts" setup> | 
| 2 | import type { CreateModalDefineExposeType } from '../../../types'; | 2 | import type { CreateModalDefineExposeType } from '../../../types'; | 
| 3 | import { BasicForm, useForm } from '/@/components/Form'; | 3 | import { BasicForm, useForm } from '/@/components/Form'; | 
| 4 | - import { formSchemas } from './create.config'; | 4 | + import { getFormSchemas } from './create.config'; | 
| 5 | import { NodeData } from '../../../types/node'; | 5 | import { NodeData } from '../../../types/node'; | 
| 6 | + import { useRoute } from 'vue-router'; | ||
| 6 | 7 | ||
| 7 | defineProps<{ | 8 | defineProps<{ | 
| 8 | config: NodeData; | 9 | config: NodeData; | 
| 9 | }>(); | 10 | }>(); | 
| 10 | 11 | ||
| 12 | + const ROUTE = useRoute(); | ||
| 13 | + | ||
| 11 | const [register, { validate, getFieldsValue, setFieldsValue, resetFields }] = useForm({ | 14 | const [register, { validate, getFieldsValue, setFieldsValue, resetFields }] = useForm({ | 
| 12 | - schemas: formSchemas, | 15 | + schemas: getFormSchemas(ROUTE), | 
| 13 | showActionButtonGroup: false, | 16 | showActionButtonGroup: false, | 
| 14 | }); | 17 | }); | 
| 15 | 18 | 
| @@ -2,15 +2,22 @@ | @@ -2,15 +2,22 @@ | ||
| 2 | import { NodeProps } from '@vue-flow/core'; | 2 | import { NodeProps } from '@vue-flow/core'; | 
| 3 | import { Icon } from '/@/components/Icon'; | 3 | import { Icon } from '/@/components/Icon'; | 
| 4 | import { Tooltip } from 'ant-design-vue'; | 4 | import { Tooltip } from 'ant-design-vue'; | 
| 5 | + import { useRouter } from 'vue-router'; | ||
| 6 | + import { NodeData } from '../../../types/node'; | ||
| 5 | 7 | ||
| 6 | - defineProps<{ | ||
| 7 | - nodeProps?: NodeProps; | 8 | + const props = defineProps<{ | 
| 9 | + nodeProps?: NodeProps<NodeData>; | ||
| 8 | }>(); | 10 | }>(); | 
| 9 | 11 | ||
| 12 | + const ROUTER = useRouter(); | ||
| 13 | + | ||
| 10 | const handleClick = () => { | 14 | const handleClick = () => { | 
| 11 | - // event.stopPropagation(); | ||
| 12 | - // event.preventDefault(); | ||
| 13 | - // console.log(props); | 15 | + console.log(props); | 
| 16 | + const { data } = props.nodeProps?.data || ({} as NodeData); | ||
| 17 | + const { configuration } = (data || {}) as { configuration: Record<'ruleChainId', string> }; | ||
| 18 | + if (configuration.ruleChainId) { | ||
| 19 | + ROUTER.push(`/rule/chain/${configuration.ruleChainId}`); | ||
| 20 | + } | ||
| 14 | }; | 21 | }; | 
| 15 | </script> | 22 | </script> | 
| 16 | 23 |