调整canvas笔触样式改为图片

src/component/Canvas/CanvasEditor/components/BrushPanel.vue

@@ -14,7 +14,8 @@
               @click="setBrushTypeWithCommand(brush.id)"
               :class="['brush-type-item', { active: brushStore.state.type === brush.id }]"
             >
-              <div class="brush-preview" :style="getBrushPreviewStyle(brush)"></div>
+              <!-- <div class="brush-preview" :style="getBrushPreviewStyle(brush)"></div> -->
+			  <img class="brush-preview" :src="brush.imgUrl" :title="brush.name" alt="">
               <span class="brush-name">{{ brush.name }}</span>
             </div>
           </div>
@@ -886,6 +887,7 @@ onMounted(() => {
     const availableBrushes = toolManager.brushManager
       .getBrushTypes()
       ?.filter((brush) => brush.id !== "eraser");
+	  console.log(availableBrushes)
     BrushStore.setAvailableBrushes(availableBrushes);
   }
 });
@@ -1178,6 +1180,8 @@ const brushStore = BrushStore;
   margin-bottom: 8px;
   border-radius: 4px;
   background-color: rgba(0, 0, 0, 0.02);
+  object-fit: contain;
+  background-color: #fff;
 }
 
 /* 保持笔刷预览内容样式一致 */