update ai

Author: DoroWolf

src/App.vue

@@ -11,6 +11,8 @@
       :promotion-pending="promotionPending" :promotion-style="promotionStyle" :is-draw="isDraw"
       :has-resigned="hasResigned" :timeout-winner="timeoutWinner" :coordinate-label-mode="coordinateLabelMode"
       :is-flipped="isFlipped"
+      :premove="premove"
+      :last-move="lastMove"
       :get-overlay-texture="getOverlayTexture"
       :get-piece-image="getPieceImage"
       :get-square-label="getSquareLabel"
@@ -28,6 +30,7 @@
       :is-game-over="isGameOver" :is-flipped="isFlipped" :board="board" :player-color="playerColor"
       :white-time-seconds="whiteTimeSeconds"
       :black-time-seconds="blackTimeSeconds" :active-color="currentTurn" :clock-test-id="'sidebar-chess-clock'"
+      :game-mode="gameMode"
       v-model:is-sound-enabled="isSoundEnabled" v-model:coordinate-label-mode="coordinateLabelMode"
       @toggle-flip="isFlipped = !isFlipped" :has-game-started="hasGameStarted" @undo="handleUndo"
       @draw="handleDrawOffer" @resign="handleResign" @restart="handleRestart" @back-to-setup="handleBackToSetup" />
@@ -81,6 +84,7 @@ const {
   showSetup,
   playerColor,
   isClockEnabled,
+  gameMode,
   board,
   currentTurn,
   selectedSquare,
@@ -103,6 +107,7 @@ const {
   isDragging,
   dragStartSquare,
   mousePos,
+  premove,
   handleMouseDown,
   handleUndo,
   handleResign,

src/components/BoardPanel.vue

@@ -14,9 +14,9 @@
               :src="isWhiteSquare(actualRow(displayRow - 1), actualCol(displayCol - 1)) ? './texture/board/board_white.png' : './texture/board/board_black.png'"
               alt="" />
 
-            <img v-if="getOverlayTexture(board, selectedSquare, possibleMoves, isDragging, hoverSquare, actualRow(displayRow - 1), actualCol(displayCol - 1))"
+            <img v-if="getOverlayTexture(board, selectedSquare, possibleMoves, isDragging, hoverSquare, actualRow(displayRow - 1), actualCol(displayCol - 1), premove, lastMove)"
               class="square-background overlay" draggable="false"
-              :src="getOverlayTexture(board, selectedSquare, possibleMoves, isDragging, hoverSquare, actualRow(displayRow - 1), actualCol(displayCol - 1))!" alt="" />
+              :src="getOverlayTexture(board, selectedSquare, possibleMoves, isDragging, hoverSquare, actualRow(displayRow - 1), actualCol(displayCol - 1), premove, lastMove)!" alt="" />
 
             <img v-if="board[actualRow(displayRow - 1)]?.[actualCol(displayCol - 1)]" class="piece"
               draggable="false" :class="{
@@ -86,6 +86,8 @@ const props = defineProps<{
   timeoutWinner: Color | null
   coordinateLabelMode: 'off' | 'inside' | 'outside'
   isFlipped: boolean
+  premove?: { from: { row: number; col: number }; to: { row: number; col: number } } | null
+  lastMove?: { from: { row: number; col: number }; to: { row: number; col: number } } | null
   getOverlayTexture: (
     board: Board,
     selectedSquare: { row: number; col: number } | null,
@@ -94,6 +96,8 @@ const props = defineProps<{
     hoverSquare: { row: number; col: number } | null,
     row: number,
     col: number,
+    premove?: { from: { row: number; col: number }; to: { row: number; col: number } } | null,
+    lastMove?: { from: { row: number; col: number }; to: { row: number; col: number } } | null,
   ) => string | null
   getPieceImage: (
     piece: Piece,

src/components/GameSetup.vue

@@ -4,7 +4,7 @@
         <section v-if="screen === 'home'" class="home-panel">
             <div class="logo-section">
                 <!-- 修改处：将文字标题替换为图片 Logo -->
-                <img src="/texture/logo.png" alt="Chess Dragon" class="logo-img" />
+                <img src="./texture/logo.png" alt="Chess Dragon" class="logo-img" />
             </div>
             <div class="home-buttons">
                 <button class="btn btn-home" @click="startSetup('ai')">人机对战</button>

src/components/Promotion.vue

@@ -7,7 +7,7 @@
       class="promote-btn" 
       @click="$emit('select', p)"
     >
-      <img :src="`./texture/promotion/promotion_${p}_${color}.png`" :alt="p" draggable="false" />
+      <img :src="`./texture/promotion/promotion_${p}_${color}.png`" :alt="p" />
     </button>
   </div>
 </template>

src/components/Sidebar.vue

@@ -40,10 +40,10 @@
         type="button"
         class="btn"
         :class="isClaimableDraw ? 'btn-success' : 'btn-primary'"
-        :disabled="isGameActionDisabled"
+        :disabled="isDrawOfferDisabled"
         @click="handleDrawClick"
       >
-        {{ isClaimableDraw ? '宣告和棋' : '申请和棋' }}
+        {{ isClaimableDraw ? '宣告和棋' : '提议和棋' }}
       </button>
       <button type="button" class="btn btn-danger" :disabled="isGameActionDisabled" @click="handleResignClick">
         认输
@@ -87,6 +87,7 @@ interface Props {
   activeColor?: Color | null
   clockTestId?: string
   hasGameStarted?: boolean
+  gameMode?: 'ai' | 'human' | 'remote'
 }
 
 interface MovePair {
@@ -111,6 +112,7 @@ const props = withDefaults(defineProps<Props>(), {
   activeColor: null,
   clockTestId: 'sidebar-chess-clock',
   hasGameStarted: false,
+  gameMode: 'human',
 })
 
 const emit = defineEmits<{
@@ -138,6 +140,16 @@ const isGameActionDisabled = computed(() => {
   return !props.hasGameStarted || props.isGameOver || !!props.gameStatus
 })
 
+// AI 对战时禁用"提议和棋"，但"宣告和棋"仍可用
+const isDrawOfferDisabled = computed(() => {
+  if (isGameActionDisabled.value) return true
+  // "宣告和棋"（满足条件时）总是可用
+  if (isClaimableDraw.value) return false
+  // "提议和棋"在 AI 模式下禁用
+  if (props.gameMode === 'ai') return true
+  return false
+})
+
 const isClaimableDraw = computed(() => {
   return props.halfmoveClock >= 100 || props.positionCount >= 3
 })
@@ -206,8 +218,8 @@ const copyPGN = async () => {
 const handleDrawClick = () => {
   if (isClaimableDraw.value) {
     emit('draw')
-  } else {
-    confirmMessage.value = '确定要向对手申请和棋吗？'
+  } else if (props.gameMode !== 'ai') {
+    confirmMessage.value = '确定要向对手提议和棋吗？'
     pendingAction.value = 'draw'
     showConfirmModal.value = true
   }

src/composables/useBoardDisplay.ts

@@ -23,7 +23,7 @@ export function useBoardDisplay() {
     return `${8 - getActualRow(displayRow - 1)}`
   }
 
-  // --- Overlay 纹理：用于高亮选中格子与合法走法 ---
+  // --- Overlay 纹理：用于高亮选中格子、合法走法、premove、上一步移动 ---
   const getOverlayTexture = (
     board: Board,
     selectedSquare: { row: number; col: number } | null,
@@ -32,7 +32,33 @@ export function useBoardDisplay() {
     hoverSquare: { row: number; col: number } | null,
     row: number,
     col: number,
+    premove?: { from: { row: number; col: number }; to: { row: number; col: number } } | null,
+    lastMove?: { from: { row: number; col: number }; to: { row: number; col: number } } | null,
   ): string | null => {
+    // 上一步移动的高亮（起始格和目标格），优先于其他高亮
+    if (lastMove) {
+      if (
+        (lastMove.from.row === row && lastMove.from.col === col) ||
+        (lastMove.to.row === row && lastMove.to.col === col)
+      ) {
+        return './texture/board/board_hover.png'
+      }
+    }
+
+    // Premove 高亮 - 目标格
+    if (premove && premove.to.row === row && premove.to.col === col) {
+      const targetPiece = board[row]?.[col] ?? null
+      if (targetPiece !== null) {
+        return './texture/board/board_premove_capture.png'
+      }
+      return './texture/board/board_premove_placeable.png'
+    }
+
+    // Premove 高亮 - 起始格
+    if (premove && premove.from.row === row && premove.from.col === col) {
+      return './texture/board/board_premove_hover.png'
+    }
+
     if (selectedSquare?.row === row && selectedSquare?.col === col) {
       return './texture/board/board_hover.png'
     }