Support self operator

examples/react-guide-app/src/App.tsx

@@ -15,13 +15,20 @@ const GlobalStyle = createGlobalStyle`
   .GlobalStyle.styled {}
 `
 
+const selfOperators = [
+  { label: '大于', value: '>' },
+  { label: '小于', value: '<' },
+  { label: '等于', value: '==' },
+]
+
 export default function App () {
   const [content, setContent] = useState(MOCK_CONTENT)
   return <>
     <GlobalStyle />
     <div style={{ padding: 16, border: '1px solid #E6E6E6', backgroundColor: 'white' }}>
       <RuleEditor models={MOCK_MODEL_LIST} content={content}
         onChange={(nextContent) => setContent(nextContent)}
+        // operators={selfOperators}
         // maxDepth={2}
       />
     </div>

src/RuleEditor.tsx

@@ -2,13 +2,14 @@ import React, { useContext, useEffect, useState } from 'react'
 import { Box, Button, Icon } from '@alifd/next'
 import { EXPRESSION_TYPE_DATASOURCE, OPERATOR_TYPE_MAP, uuid } from './shared'
 import { RuleEditorContext, tree2map, ModelAndField, RuleGroupNodeRelationColumn, WidthAutoSelect, RuleGroupNodeBodyColumnWrapper, fixContent, RuleGroupNodeWrapper, RuleGroupNodeRelationColumnWrapper, RuleConditionNodeWrapper, OperatorSelect, LiteralSetter } from './RuleEditorParts'
-import { IRuleConditionNode, IRuleGroupNode, IRelation, IRuleModel, IRuleNodeType, IExpressionType } from './types'
+import { IRuleConditionNode, IRuleGroupNode, IRelation, IRuleModel, IRuleNodeType, IExpressionType, INextRecord } from './types'
 // Program Expression left right operator
 // Rule / condition
 
 function RuleConditionNode ({ node, depth = 0 } :{ node: IRuleConditionNode; depth?: number; }) {
-  const { models, mapped, onChange, maxDepth } = useContext(RuleEditorContext)
+  const { models, mapped, onChange, maxDepth, operators } = useContext(RuleEditorContext)
   const { left, right, operator } = node
+  const OperatorMap = operators || OPERATOR_TYPE_MAP['*']
 
   return <RuleConditionNodeWrapper>
     <Box direction='row' spacing={8} wrap>
@@ -17,7 +18,7 @@ function RuleConditionNode ({ node, depth = 0 } :{ node: IRuleConditionNode; dep
       {/* 2. 操作符 */}
       <OperatorSelect
         defaultValue={operator}
-        dataSource={OPERATOR_TYPE_MAP['*']}
+        dataSource={OperatorMap}
         onChange={(value, action, item) => {
           node.operator = value
           onChange()
@@ -153,11 +154,12 @@ function RuleGroupNode ({ node, depth = 0, hasBackground, hasBorder }: { node: I
 interface IRuleEditorProps {
   models: IRuleModel[];
   content: IRuleGroupNode;
+  operators?: INextRecord[];
   maxDepth?: number;
   onChange?: (content: IRuleGroupNode) => void;
 }
 
-export default ({ models: remoteModels, content: remoteContent, maxDepth, onChange } : IRuleEditorProps) => {
+export default ({ models: remoteModels, content: remoteContent, operators: remoteOperators, maxDepth, onChange } : IRuleEditorProps) => {
   const [content, setContent] = useState<IRuleGroupNode>(remoteContent)
   useEffect(() => {
     const { content: nextContent, changed } = fixContent(content)
@@ -177,6 +179,7 @@ export default ({ models: remoteModels, content: remoteContent, maxDepth, onChan
         setContent({ ...content })
         if (onChange) onChange({ ...content })
       },
+      operators: remoteOperators,
       maxDepth
     }}
   >

src/RuleEditorParts.tsx

@@ -1,6 +1,6 @@
 import styled, { css } from 'styled-components'
 import { Box, Button, DatePicker, Input, NumberPicker, Range, Select, Switch, TimePicker } from '@alifd/next'
-import { IRuleGroupNode, IRuleConditionNode, IRuleField, IMemberExpression, IRuleModel, IRelation, IRuleNodeType, IExpressionType } from './types/index'
+import { IRuleGroupNode, IRuleConditionNode, IRuleField, IMemberExpression, IRuleModel, IRelation, IRuleNodeType, IExpressionType, INextRecord } from './types/index'
 import React, { createContext, ReactNode, useContext, useEffect, useState } from 'react'
 import { uuid } from './shared'
 import moment from 'moment'
@@ -55,6 +55,7 @@ interface IRuleEditorContext {
     [id: string]: IRuleConditionNode | IRuleGroupNode
   };
   onChange: (nextContent?: any) => void;
+  operators?: INextRecord[];
   maxDepth?: number;
 }
 export const RuleEditorContext = createContext<IRuleEditorContext>(undefined)