Wed Jul 12 21:22:00 CST 2023 inscode

src/App.vue

@@ -4,7 +4,7 @@ import { is_empty, checkWin, is_black, is_white, robotPlay } from "./utils"
 import RandomTree from "./components/RandomTree.vue";
 // import { robotPlay } from './utils/api'
 // 配置
-const size = ref(20)
+const size = ref(30)
 const win_size = ref(5)
 // 棋盘
 const lattices = ref([])
@@ -53,6 +53,7 @@ function setPiece([y, x], type) {
   lattices.value[y][x] = type
 }
 async function playChess(item, row, col) {
+  console.time('playChess')
   if (isWin.length || item !== is_empty) return
 
   // 玩家下棋
@@ -70,6 +71,7 @@ async function playChess(item, row, col) {
   if (testRobo) {
     isWin = testRobo
   }
+  console.timeEnd('playChess')
 }
 </script>
 

src/components/RandomTree.vue

 <template>
-    <canvas width="500" height="300" ref="canvas"></canvas>
+    <canvas class="canvas" width="500" height="300" ref="canvas"></canvas>
 </template>
 
 <script setup>
@@ -71,9 +71,14 @@ function drawBranch(ctx, v0, thick, len, dir) {
 </script>
 
 <style>
-canvas {
+.canvas {
     position: absolute;
     right: 10px;
     bottom: 10px;
+    pointer-events: none;
+}
+
+.canvas:hover {
+    opacity: 0.3;
 }
 </style>
\ No newline at end of file