Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commit521370f

Browse files
committed
Added removing modules
1 parent39dbd40 commit521370f

File tree

2 files changed

+100
-8
lines changed

2 files changed

+100
-8
lines changed

‎client/packages/lowcoder/src/pages/editor/right/ModulePanel.tsx

Lines changed: 91 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -19,15 +19,15 @@ import {trans, transToNode} from "i18n";
1919
import{draggingUtils}from"layout/draggingUtils";
2020
importReact,{CSSProperties,useContext,useEffect,useState}from"react";
2121
import{useDispatch,useSelector}from"react-redux";
22-
import{fetchAllModules,recycleApplication}from"redux/reduxActions/applicationActions";
22+
import{fetchAllModules,recycleApplication,updateAppMetaAction}from"redux/reduxActions/applicationActions";
2323
importstyledfrom"styled-components";
2424
importCreateAppButtonfrom"components/CreateAppButton";
2525
import{TransparentImg}from"util/commonUtils";
2626
import{ComListTitle}from"./styledComponent";
2727
import{folderElementsSelector}from"@lowcoder-ee/redux/selectors/folderSelector";
2828
import{DraggableTree}from"@lowcoder-ee/components/DraggableTree/DraggableTree";
2929
import{EditorContext}from"lowcoder-sdk";
30-
import{showAppSnapshotSelector}from"@lowcoder-ee/redux/selectors/appSnapshotSelector";
30+
import{getSelectedAppSnapshot,showAppSnapshotSelector}from"@lowcoder-ee/redux/selectors/appSnapshotSelector";
3131
import{DraggableTreeNode,DraggableTreeNodeItemRenderProps}from"@lowcoder-ee/components/DraggableTree/types";
3232
importRefTreeCompfrom"@lowcoder-ee/comps/comps/refTreeComp";
3333
import{EmptyContent}from"components/EmptyContent";
@@ -168,11 +168,65 @@ function buildTree(elementRecord: Record<string, Array<ApplicationMeta | FolderM
168168
interfaceModuleItemProps{
169169
meta:ApplicationMeta;
170170
onDrag:(type:string)=>void;
171+
isOverlay:boolean;
172+
selectedID:string;
173+
setSelectedID:(id:string)=>void;
174+
selectedType:boolean;
175+
setSelectedType:(id:boolean)=>void;
176+
resComp:NodeType;
177+
id:string;
171178
}
172179

173180
functionModuleItem(props:ModuleItemProps){
174181
constcompType="module";
175-
const{ meta}=props;
182+
const{
183+
meta,
184+
isOverlay,
185+
selectedID,
186+
setSelectedID,
187+
selectedType,
188+
setSelectedType,
189+
resComp,
190+
id
191+
}=props;
192+
constdispatch=useDispatch();
193+
consttype=resComp.isFolder;
194+
constname=resComp.name;
195+
const[error,setError]=useState<string|undefined>(undefined);
196+
const[editing,setEditing]=useState(false);
197+
consteditorState=useContext(EditorContext);
198+
constreadOnly=useSelector(showAppSnapshotSelector);
199+
constisSelected=type===selectedType&&id===selectedID;
200+
consthandleFinishRename=(value:string)=>{
201+
letsuccess=false;
202+
letcompId=name;
203+
if(resComp.rename){
204+
compId=resComp.rename(value);
205+
success=!!compId;
206+
}else{
207+
compId=name;
208+
success=true;
209+
}
210+
if(success){
211+
console.log(selectedID,value);
212+
setSelectedID(compId);
213+
setSelectedType(type);
214+
setError(undefined);
215+
try{
216+
dispatch(updateAppMetaAction({
217+
applicationId:selectedID,
218+
name:value
219+
}));
220+
}catch(error){
221+
console.error("Error: Delete module in extension:",error);
222+
throwerror;
223+
}
224+
}
225+
};
226+
227+
consthandleNameChange=(value:string)=>{
228+
value==="" ?setError("Cannot Be Empty") :setError("");
229+
};
176230
return(
177231
<ItemWrapper
178232
draggable
@@ -198,8 +252,22 @@ function ModuleItem(props: ModuleItemProps) {
198252
<divclassName="module-icon">
199253
<ModuleDocIconwidth="19px"height="19px"/>
200254
</div>
201-
<divclassName="module-content">
202-
<divclassName="module-name">{props.meta.name}</div>
255+
256+
<divstyle={{flexGrow:1,marginRight:"8px",width:"calc(100% - 62px)"}}>
257+
<EditText
258+
text={meta.name}
259+
forceClickIcon={false}
260+
disabled={!isSelected||readOnly||isOverlay}
261+
onFinish={handleFinishRename}
262+
onChange={handleNameChange}
263+
onEditStateChange={(editing)=>setEditing(editing)}
264+
/>
265+
<PopupCard
266+
editorFocus={!!error&&editing}
267+
title={error ?trans("error") :""}
268+
content={error}
269+
hasError={!!error}
270+
/>
203271
</div>
204272
</div>
205273
</ItemWrapper>
@@ -368,7 +436,13 @@ function ModuleSidebarItem(props: ModuleSidebarItemProps) {
368436
setSelectedID(compId);
369437
setSelectedType(type);
370438
setError(undefined);
371-
dispatch(updateFolder({id:selectedID,name:value}));
439+
try{
440+
dispatch(updateFolder({id:selectedID,name:value}));
441+
}catch(error){
442+
console.error("Error: Delete module in extension:",error);
443+
throwerror;
444+
}
445+
372446
}
373447
};
374448

@@ -407,7 +481,17 @@ function ModuleSidebarItem(props: ModuleSidebarItemProps) {
407481
/>
408482
</div>
409483
</> :
410-
<ModuleItemonDrag={onDrag}key={id}meta={resComp.module!}/>}
484+
<ModuleItemonDrag={onDrag}
485+
key={id}
486+
meta={resComp.module!}
487+
isOverlay={isOverlay}
488+
selectedID={selectedID}
489+
setSelectedID={setSelectedID}
490+
selectedType={selectedType}
491+
setSelectedType={setSelectedType}
492+
resComp={resComp}
493+
id={id}
494+
/>}
411495
{!readOnly&&!isOverlay&&(
412496
<EditPopovercopy={!isFolder ?onCopy :undefined}del={()=>onDelete()}>
413497
<IcontabIndex={-1}/>
@@ -421,7 +505,6 @@ function ModuleSidebarItem(props: ModuleSidebarItemProps) {
421505
exportdefaultfunctionModulePanel(){
422506
constdispatch=useDispatch();
423507
letelements=useSelector(folderElementsSelector);
424-
// const reload = () => elements = useSelector(folderElementsSelector);
425508
const{ onDrag, searchValue}=useContext(RightContext);
426509
const[deleteFlag,setDeleteFlag]=useState(false);
427510
const[selectedID,setSelectedID]=useState("");

‎client/packages/lowcoder/src/redux/reducers/uiReducers/folderReducer.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,15 @@ export const folderReducer = createReducer(initialState, {
6969
elements[action.payload.folderId??""]=elements[action.payload.folderId??""]?.map((e)=>{
7070
if(!e.folder&&e.applicationId===action.payload.applicationId){
7171
return{ ...e, ...action.payload};
72+
}else{
73+
if(e.folder){
74+
// console.log(e.subApplications);
75+
if(e.subApplications?.map(item=>{
76+
if(item.applicationId===action.payload.applicationId)
77+
item.name=action.payload.name
78+
})){
79+
}
80+
}
7281
}
7382
returne;
7483
});

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp