完善列表和编辑页面的数据验证和交互，实现服务端和客户端两重数据验证

app/components/ui/MessageModal.tsx

@@ -146,16 +146,18 @@ export function MessageModal({
       onClick={handleClose}
       onKeyDown={handleKeyDown}
       tabIndex={0}
-      role="button"
+      role="presentation"
       aria-label="关闭对话框"
     >
-      <div 
+      <div
         className={`message-modal message-modal-${type} ${isClosing ? 'closing' : ''}`}
-        onClick={(e) => e.stopPropagation()}
         role="dialog"
         aria-modal="true"
         aria-labelledby="message-modal-title"
         aria-describedby="message-modal-content"
+        onClick={(e) => e.stopPropagation()}
+        onKeyDown={(e) => e.stopPropagation()}
+        tabIndex={-1}
       >
         {showCloseButton && (
           <button 
@@ -198,12 +200,14 @@ export function MessageModal({
               >
                 {confirmText}
               </button>
-              <button 
-                className="message-modal-button" 
-                onClick={handleClose}
-              >
-                {cancelText}
-              </button>
+              {cancelText && (
+                <button 
+                  className="message-modal-button" 
+                  onClick={handleClose}
+                >
+                  {cancelText}
+                </button>
+              )}
             </>
           )}