fix: stop propagation when drawer is opened
This commit is contained in:
		
							parent
							
								
									e21d819155
								
							
						
					
					
						commit
						4510242651
					
				| @ -21,67 +21,73 @@ export const ActionDrawer: ComposedActionDrawer = observer((props) => { | ||||
|   return ( | ||||
|     <> | ||||
|       {createPortal( | ||||
|         <Drawer | ||||
|           width={'50%'} | ||||
|           title={field.title} | ||||
|           {...others} | ||||
|           destroyOnClose | ||||
|           visible={visible} | ||||
|           onClose={() => setVisible(false)} | ||||
|           className={classNames( | ||||
|             others.className, | ||||
|             css` | ||||
|               &.nb-action-popup { | ||||
|                 .ant-drawer-content { | ||||
|                   background: #f0f2f5; | ||||
|                 } | ||||
|               } | ||||
|               &.nb-record-picker-selector { | ||||
|                 .nb-block-item { | ||||
|                   margin-bottom: 24px; | ||||
|                   .general-schema-designer { | ||||
|                     top: -8px; | ||||
|                     bottom: -8px; | ||||
|                     left: -8px; | ||||
|                     right: -8px; | ||||
|                   } | ||||
|                 } | ||||
|               } | ||||
|             `,
 | ||||
|           )} | ||||
|           footer={ | ||||
|             footerSchema && ( | ||||
|               <div | ||||
|                 className={css` | ||||
|                   display: flex; | ||||
|                   justify-content: flex-end; | ||||
|                   width: 100%; | ||||
|                   .ant-btn { | ||||
|                     margin-right: 8px; | ||||
|                   } | ||||
|                 `}
 | ||||
|               > | ||||
|                 <RecursionField | ||||
|                   basePath={field.address} | ||||
|                   schema={schema} | ||||
|                   onlyRenderProperties | ||||
|                   filterProperties={(s) => { | ||||
|                     return s['x-component'] === footerNodeName; | ||||
|                   }} | ||||
|                 /> | ||||
|               </div> | ||||
|             ) | ||||
|           } | ||||
|         <div | ||||
|           onClick={(e) => { | ||||
|             e.stopPropagation(); | ||||
|           }} | ||||
|         > | ||||
|           <RecursionField | ||||
|             basePath={field.address} | ||||
|             schema={schema} | ||||
|             onlyRenderProperties | ||||
|             filterProperties={(s) => { | ||||
|               return s['x-component'] !== footerNodeName; | ||||
|             }} | ||||
|           /> | ||||
|         </Drawer>, | ||||
|           <Drawer | ||||
|             width={'50%'} | ||||
|             title={field.title} | ||||
|             {...others} | ||||
|             destroyOnClose | ||||
|             visible={visible} | ||||
|             onClose={() => setVisible(false)} | ||||
|             className={classNames( | ||||
|               others.className, | ||||
|               css` | ||||
|                 &.nb-action-popup { | ||||
|                   .ant-drawer-content { | ||||
|                     background: #f0f2f5; | ||||
|                   } | ||||
|                 } | ||||
|                 &.nb-record-picker-selector { | ||||
|                   .nb-block-item { | ||||
|                     margin-bottom: 24px; | ||||
|                     .general-schema-designer { | ||||
|                       top: -8px; | ||||
|                       bottom: -8px; | ||||
|                       left: -8px; | ||||
|                       right: -8px; | ||||
|                     } | ||||
|                   } | ||||
|                 } | ||||
|               `,
 | ||||
|             )} | ||||
|             footer={ | ||||
|               footerSchema && ( | ||||
|                 <div | ||||
|                   className={css` | ||||
|                     display: flex; | ||||
|                     justify-content: flex-end; | ||||
|                     width: 100%; | ||||
|                     .ant-btn { | ||||
|                       margin-right: 8px; | ||||
|                     } | ||||
|                   `}
 | ||||
|                 > | ||||
|                   <RecursionField | ||||
|                     basePath={field.address} | ||||
|                     schema={schema} | ||||
|                     onlyRenderProperties | ||||
|                     filterProperties={(s) => { | ||||
|                       return s['x-component'] === footerNodeName; | ||||
|                     }} | ||||
|                   /> | ||||
|                 </div> | ||||
|               ) | ||||
|             } | ||||
|           > | ||||
|             <RecursionField | ||||
|               basePath={field.address} | ||||
|               schema={schema} | ||||
|               onlyRenderProperties | ||||
|               filterProperties={(s) => { | ||||
|                 return s['x-component'] !== footerNodeName; | ||||
|               }} | ||||
|             /> | ||||
|           </Drawer> | ||||
|         </div>, | ||||
|         document.body, | ||||
|       )} | ||||
|     </> | ||||
|  | ||||
| @ -27,7 +27,9 @@ export const ReadPrettyRecordPicker: React.FC = observer((props: any) => { | ||||
|               return ( | ||||
|                 <span> | ||||
|                   <a | ||||
|                     onClick={() => { | ||||
|                     onClick={(e) => { | ||||
|                       e.stopPropagation(); | ||||
|                       e.preventDefault(); | ||||
|                       setVisible(true); | ||||
|                       setRecord(record); | ||||
|                     }} | ||||
|  | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user