feat(editor-app): 添加外部文件修改检测
- 新增 ExternalModificationDialog 组件 - TauriFileAPI 支持 getFileMtime - 场景文件被外部修改时提示用户
This commit is contained in:
@@ -38,4 +38,8 @@ export class TauriFileAPI implements IFileAPI {
|
||||
public async pathExists(path: string): Promise<boolean> {
|
||||
return await TauriAPI.pathExists(path);
|
||||
}
|
||||
|
||||
public async getFileMtime(path: string): Promise<number> {
|
||||
return await TauriAPI.getFileMtime(path);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,58 @@
|
||||
import { AlertTriangle, X, RefreshCw, Save } from 'lucide-react';
|
||||
import '../styles/ConfirmDialog.css';
|
||||
|
||||
interface ExternalModificationDialogProps {
|
||||
sceneName: string;
|
||||
onReload: () => void;
|
||||
onOverwrite: () => void;
|
||||
onCancel: () => void;
|
||||
}
|
||||
|
||||
/**
|
||||
* 外部修改对话框
|
||||
* External Modification Dialog
|
||||
*
|
||||
* 当场景文件被外部修改时显示,让用户选择操作
|
||||
* Shown when scene file is modified externally, let user choose action
|
||||
*/
|
||||
export function ExternalModificationDialog({
|
||||
sceneName,
|
||||
onReload,
|
||||
onOverwrite,
|
||||
onCancel
|
||||
}: ExternalModificationDialogProps) {
|
||||
return (
|
||||
<div className="confirm-dialog-overlay" onClick={onCancel}>
|
||||
<div className="confirm-dialog external-modification-dialog" onClick={(e) => e.stopPropagation()}>
|
||||
<div className="confirm-dialog-header">
|
||||
<AlertTriangle size={20} className="warning-icon" />
|
||||
<h2>文件已被外部修改</h2>
|
||||
<button className="close-btn" onClick={onCancel}>
|
||||
<X size={16} />
|
||||
</button>
|
||||
</div>
|
||||
<div className="confirm-dialog-content">
|
||||
<p>
|
||||
场景 <strong>{sceneName}</strong> 已在编辑器外部被修改。
|
||||
</p>
|
||||
<p className="hint-text">
|
||||
请选择如何处理:
|
||||
</p>
|
||||
</div>
|
||||
<div className="confirm-dialog-footer external-modification-footer">
|
||||
<button className="confirm-dialog-btn cancel" onClick={onCancel}>
|
||||
取消
|
||||
</button>
|
||||
<button className="confirm-dialog-btn reload" onClick={onReload}>
|
||||
<RefreshCw size={14} />
|
||||
重新加载
|
||||
</button>
|
||||
<button className="confirm-dialog-btn overwrite" onClick={onOverwrite}>
|
||||
<Save size={14} />
|
||||
覆盖保存
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -126,3 +126,52 @@
|
||||
.confirm-dialog-btn:active {
|
||||
transform: scale(0.98);
|
||||
}
|
||||
|
||||
/* External Modification Dialog | 外部修改对话框 */
|
||||
.external-modification-dialog .warning-icon {
|
||||
color: #f0ad4e;
|
||||
margin-right: 8px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.external-modification-dialog .confirm-dialog-header {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.external-modification-dialog .confirm-dialog-header h2 {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.external-modification-dialog .hint-text {
|
||||
margin-top: 12px;
|
||||
color: var(--text-secondary, #999);
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.external-modification-footer {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.confirm-dialog-btn.reload {
|
||||
background: #5bc0de;
|
||||
color: white;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.confirm-dialog-btn.reload:hover {
|
||||
background: #7cd0e8;
|
||||
}
|
||||
|
||||
.confirm-dialog-btn.overwrite {
|
||||
background: #f0ad4e;
|
||||
color: white;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.confirm-dialog-btn.overwrite:hover {
|
||||
background: #f4be6e;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user