diff --git a/source/Component/CommandBar/CommandBar.scss b/source/Component/CommandBar/CommandBar.scss
index dc36908..9cfee02 100644
--- a/source/Component/CommandBar/CommandBar.scss
+++ b/source/Component/CommandBar/CommandBar.scss
@@ -1,3 +1,5 @@
+@import "../Theme/Theme.scss";
+
 div.command-bar {
     height: 100%;
     user-select: none;
@@ -5,32 +7,53 @@ div.command-bar {
     flex-direction: column;
     justify-content: space-between;
     
-    button.ms-Button.command-button {
+    div.command-button {
         width: 100%;
-        text-align: center;
         display: flex;
         justify-content: center;
+        align-items: center;
         transition: all 100ms ease-in-out;
-        color:  inherit;
+        cursor: pointer;
         
-        span.ms-Button-flexContainer i.ms-Icon {
-            font-size: 25px;
+        i {
+            font-size: 22px;
+        }
+
+        div.command-button-loading {
+            
+            div.ms-Spinner-circle {
+                border-width: 2px;
+            }
         }
     }
 
-    button.ms-Button.command-button.on-end {
+    div.command-button.on-end {
         align-self: flex-end;
     }
 }
 
-div.command-bar.dark button.ms-Button.command-button.active,
-div.command-bar.dark button.ms-Button.command-button:hover {
+div.command-bar.dark div.command-button div.command-button-loading div.ms-Spinner-circle {
+    border-top-color: rgba($color: #FFFFFF, $alpha: .9);
+    border-left-color: rgba($color: #FFFFFF, $alpha: .4);
+    border-bottom-color: rgba($color: #FFFFFF, $alpha: .4);
+    border-right-color: rgba($color: #FFFFFF, $alpha: .4);
+}
+
+div.command-bar.light div.command-button div.command-button-loading div.ms-Spinner-circle {
+    border-top-color: rgba($color: #000000, $alpha: .9);
+    border-left-color: rgba($color: #000000, $alpha: .4);
+    border-bottom-color: rgba($color: #000000, $alpha: .4);
+    border-right-color: rgba($color: #000000, $alpha: .4);
+}
+
+div.command-bar.dark div.command-button.active,
+div.command-bar.dark div.command-button:hover {
     background-color: rgba($color: #FFFFFF, $alpha: .2);
     color: rgba($color: #FFFFFF, $alpha: 1);
 }
 
-div.command-bar.light button.ms-Button.command-button.active,
-div.command-bar.light button.ms-Button.command-button:hover {
+div.command-bar.light div.command-button.active,
+div.command-bar.light div.command-button:hover {
     background-color: rgba($color: #000000, $alpha: .08);
     color: rgba($color: #000000, $alpha: 1);
 }
diff --git a/source/Component/CommandBar/CommandBar.tsx b/source/Component/CommandBar/CommandBar.tsx
index d0550f8..59b68a4 100644
--- a/source/Component/CommandBar/CommandBar.tsx
+++ b/source/Component/CommandBar/CommandBar.tsx
@@ -1,5 +1,5 @@
-import { Component, ReactNode } from "react";
-import { DirectionalHint, IconButton } from "@fluentui/react";
+import { Component, ReactNode, FunctionComponent } from "react";
+import { DirectionalHint, Icon, Spinner } from "@fluentui/react";
 import { useSetting, IMixinSettingProps } from "@Context/Setting";
 import { useStatusWithEvent, IMixinStatusProps } from "@Context/Status";
 import { BackgroundLevel, Theme } from "@Component/Theme/Theme";
@@ -18,23 +18,28 @@ interface IRenderButtonParameter {
     iconName?: string;
     click?: () => void;
     active?: boolean;
+    isLoading?: boolean;
 }
 
 interface ICommandBarState {
     isSaveRunning: boolean;
 }
 
-function getRenderButton(param: IRenderButtonParameter): ReactNode {
+const CommandButton: FunctionComponent<IRenderButtonParameter> = (param) => {
     return <LocalizationTooltipHost 
         i18nKey={param.i18NKey}
         directionalHint={DirectionalHint.rightCenter}
     >
-        <IconButton
+        <div
             style={{ height: COMMAND_BAR_WIDTH }}
-            iconProps={{ iconName: param.iconName }}
-            onClick={ param.click }
+            onClick={ param.isLoading ? undefined : param.click }
             className={"command-button on-end" + (param.active ? " active" : "")}
-        />
+        >
+            {param.isLoading ? 
+                <Spinner className="command-button-loading"/> :
+                <Icon iconName={param.iconName}/>
+            }
+        </div>
     </LocalizationTooltipHost>
 }
 @useSetting
@@ -68,78 +73,84 @@ class CommandBar extends Component<IMixinSettingProps & IMixinStatusProps, IComm
                     }}
                 />
 
-                {getRenderButton({
-                    iconName: "Save",
-                    i18NKey: "Command.Bar.Save.Info",
-                    click: () => {
+                <CommandButton
+                    iconName="Save"
+                    i18NKey="Command.Bar.Save.Info"
+                    isLoading={this.state.isSaveRunning}
+                    click={() => {
                         this.setState({
                             isSaveRunning: true
                         });
-                    }
-                })}
+                    }}
+                />
 
-                {getRenderButton({
-                    iconName: this.props.status?.actuator.start() ? "Pause" : "Play",
-                    i18NKey: "Command.Bar.Play.Info",
-                    click: () => this.props.status ? this.props.status.actuator.start(
+                <CommandButton
+                    iconName={this.props.status?.actuator.start() ? "Pause" : "Play"}
+                    i18NKey="Command.Bar.Play.Info"
+                    click={() => this.props.status ? this.props.status.actuator.start(
                         !this.props.status.actuator.start()
-                    ) : undefined
-                })}
+                    ) : undefined}
+                />
 
-                {getRenderButton({
-                    iconName: "HandsFree", i18NKey: "Command.Bar.Drag.Info", 
-                    active: mouseMod === MouseMod.Drag,
-                    click: () => this.props.status ? this.props.status.setMouseMod(MouseMod.Drag) : undefined
-                })}
+                <CommandButton
+                    iconName="HandsFree"
+                    i18NKey="Command.Bar.Drag.Info"
+                    active={mouseMod === MouseMod.Drag}
+                    click={() => this.props.status ? this.props.status.setMouseMod(MouseMod.Drag) : undefined}
+                />
 
-                {getRenderButton({
-                    iconName: "TouchPointer", i18NKey: "Command.Bar.Select.Info",
-                    active: mouseMod === MouseMod.click,
-                    click: () => this.props.status ? this.props.status.setMouseMod(MouseMod.click) : undefined
-                })}
+                <CommandButton
+                    iconName="TouchPointer"
+                    i18NKey="Command.Bar.Select.Info"
+                    active={mouseMod === MouseMod.click}
+                    click={() => this.props.status ? this.props.status.setMouseMod(MouseMod.click) : undefined}
+                />
 
-                {getRenderButton({
-                    iconName: "WebAppBuilderFragmentCreate",
-                    i18NKey: "Command.Bar.Add.Group.Info",
-                    click: () => {
+                <CommandButton
+                    iconName="WebAppBuilderFragmentCreate"
+                    i18NKey="Command.Bar.Add.Group.Info"
+                    click={() => {
                         this.props.status ? this.props.status.newGroup() : undefined;
-                    }
-                })}
+                    }}
+                />
 
-                {getRenderButton({
-                    iconName: "ProductVariant",
-                    i18NKey: "Command.Bar.Add.Range.Info",
-                    click: () => {
+                <CommandButton
+                    iconName="ProductVariant"
+                    i18NKey="Command.Bar.Add.Range.Info"
+                    click={() => {
                         this.props.status ? this.props.status.newRange() : undefined;
-                    }
-                })}
+                    }}
+                />
 
-                {getRenderButton({
-                    iconName: "Running",
-                    i18NKey: "Command.Bar.Add.Behavior.Info",
-                    click: () => {
+                <CommandButton
+                    iconName="Running"
+                    i18NKey="Command.Bar.Add.Behavior.Info"
+                    click={() => {
                         this.props.status?.popup.showPopup(BehaviorPopup, {});
-                    }
-                })}
+                    }}
+                />
 
-                {getRenderButton({
-                    iconName: "Tag",
-                    i18NKey: "Command.Bar.Add.Tag.Info",
-                    click: () => {
+                <CommandButton
+                    iconName="Tag"
+                    i18NKey="Command.Bar.Add.Tag.Info"
+                    click={() => {
                         this.props.status ? this.props.status.newLabel() : undefined;
-                    }
-                })}
+                    }}
+                />
 
-                {getRenderButton({ iconName: "Camera", i18NKey: "Command.Bar.Camera.Info" })}
+                <CommandButton
+                    iconName="Camera"
+                    i18NKey="Command.Bar.Camera.Info"
+                />
             </div>
             <div>
-                {getRenderButton({
-                    iconName: "Settings",
-                    i18NKey: "Command.Bar.Setting.Info",
-                    click: () => {
+                <CommandButton
+                    iconName="Settings"
+                    i18NKey="Command.Bar.Setting.Info"
+                    click={() => {
                         this.props.status?.popup.showPopup(SettingPopup, {});
-                    }
-                })}
+                    }}
+                />
             </div>
         </Theme>
     }
diff --git a/source/Component/LoadFile/LoadFile.tsx b/source/Component/LoadFile/LoadFile.tsx
index fdb7ed4..ef1ea24 100644
--- a/source/Component/LoadFile/LoadFile.tsx
+++ b/source/Component/LoadFile/LoadFile.tsx
@@ -64,7 +64,7 @@ async function fileChecker(status: Status, file?: File) {
 			const loadFunc = () => {
 
 				// 进行转换
-				let errorMessage = status.archive.load(status.model, fileReader.result as string, file.name);
+				let errorMessage = status.archive.load(status.model, fileReader.result as string, file.name, file.path);
 				if (errorMessage) {
 					status.popup.showPopup(ConfirmPopup, {
 						infoI18n: "Popup.Load.Save.Error.Parse",
diff --git a/source/Context/Archive.tsx b/source/Context/Archive.tsx
index 8e27be2..0a361c6 100644
--- a/source/Context/Archive.tsx
+++ b/source/Context/Archive.tsx
@@ -29,7 +29,7 @@ const ArchiveSaveDownloadView: FunctionComponent<IFileInfo & ICallBackProps> = f
 		setTimeout(() => {
 			download(file, props.fileName, "text/json");
 			props.then();
-		}, 10);
+		}, 100);
 	}
 
 	useEffect(() => { runner() }, []);
@@ -44,15 +44,17 @@ function ArchiveSaveFsView(props) {
 
 	const runner = async () => {
 		const file = await props.fileData();
-		if (props.electron) {
-			props.electron.fileSave(
-				file,
-				I18N(props, "Popup.Load.Save.Select.File.Name"),
-				I18N(props, "Popup.Load.Save.Select.Path.Title"),
-				I18N(props, "Popup.Load.Save.Select.Path.Button"),
-				props.fileUrl
-			);
-		}
+		setTimeout(() => {
+			if (props.electron) {
+				props.electron.fileSave(
+					file,
+					I18N(props, "Popup.Load.Save.Select.File.Name"),
+					I18N(props, "Popup.Load.Save.Select.Path.Title"),
+					I18N(props, "Popup.Load.Save.Select.Path.Button"),
+					props.fileUrl
+				);
+			}
+		}, 100);
 	}
 
 	const saveEvent = ({name, url, success} : {name: string, url: string, success: boolean}) => {
diff --git a/source/Model/Archive.ts b/source/Model/Archive.ts
index 8c54b59..92688a1 100644
--- a/source/Model/Archive.ts
+++ b/source/Model/Archive.ts
@@ -266,6 +266,7 @@ class Archive extends Emitter<IArchiveEvent> {
         this.fileName = name;
         this.isSaved = true;
         this.isNewFile = false;
+        this.fileUrl = url;
         this.emit("fileSave", this);
     };
 
diff --git a/source/Page/SimulatorDesktop/SimulatorDesktop.tsx b/source/Page/SimulatorDesktop/SimulatorDesktop.tsx
index 62ba58c..63b0e8d 100644
--- a/source/Page/SimulatorDesktop/SimulatorDesktop.tsx
+++ b/source/Page/SimulatorDesktop/SimulatorDesktop.tsx
@@ -1,4 +1,6 @@
 import { Component, ReactNode } from "react";
+import { DndProvider } from 'react-dnd'
+import { HTML5Backend } from 'react-dnd-html5-backend'
 import { SettingProvider, Setting, Platform } from "@Context/Setting";
 import { Theme, BackgroundLevel, FontLevel } from "@Component/Theme/Theme";
 import { ISimulatorAPI } from "@Electron/SimulatorAPI";
@@ -9,10 +11,10 @@ import { initializeIcons } from '@fluentui/font-icons-mdl2';
 import { RootContainer } from "@Component/Container/RootContainer";
 import { LayoutDirection } from "@Context/Layout";
 import { CommandBar } from "@Component/CommandBar/CommandBar";
+import { LoadFile } from "@Component/LoadFile/LoadFile";
 import { HeaderBar } from "@Component/HeaderBar/HeaderBar";
 import { Popup } from "@Component/Popup/Popup";
 import { Entry } from "../Entry/Entry";
-import { Group } from "@Model/Group";
 import "./SimulatorDesktop.scss";
 
 initializeIcons("./font-icon/");
@@ -89,7 +91,9 @@ class SimulatorDesktop extends Component {
         return <SettingProvider value={this.setting}>
             <StatusProvider value={this.status}>
                 <ElectronProvider value={this.electron}>
-                    {this.renderContent()}
+                    <DndProvider backend={HTML5Backend}>
+                        {this.renderContent()}
+                    </DndProvider>
                 </ElectronProvider>
             </StatusProvider>
         </SettingProvider>
@@ -102,13 +106,15 @@ class SimulatorDesktop extends Component {
             fontLevel={FontLevel.Level3}
         >
             <Popup/>
-            <HeaderBar height={35}/>
-            <div className="app-root-space" style={{
-                height: `calc( 100% - ${35}px)`
-            }}>
-                <CommandBar/>
-                <RootContainer/>
-            </div>
+            <LoadFile>
+                <HeaderBar height={35}/>
+                <div className="app-root-space" style={{
+                    height: `calc( 100% - ${35}px)`
+                }}>
+                    <CommandBar/>
+                    <RootContainer/>
+                </div>
+            </LoadFile>
         </Theme>
     }
 }