save

src/utils/UploadAndCut.tsx

@@ -4,11 +4,10 @@ import { VueCropper } from 'vue-cropper'
 import 'vue-cropper/dist/index.css'
 import upload from './upload'
 import { v4 as uuid } from "uuid"
-import { MdCroprotateRound } from "oh-vue-icons/icons";
+import { MdCroprotateRound, BiPlusLg } from "oh-vue-icons/icons";
-import { OhVueIcon, addIcons } from 'oh-vue-icons'
+import { OhVueIcon, addIcons, } from 'oh-vue-icons'
 import NativeColorPicker from './NativeColorPicker'
-
+addIcons(MdCroprotateRound, BiPlusLg)
-addIcons(MdCroprotateRound)
 
 export default defineComponent({
 
@@ -62,15 +61,15 @@ export default defineComponent({
         watch(
             fillColor,
             (e: string) => {
-              const elements = document.querySelectorAll('.cropper-crop-box')
+                const elements = document.querySelectorAll('.cropper-crop-box')
-              elements.forEach((element: any) => {
+                elements.forEach((element: any) => {
-                element.style.backgroundColor = e // 修改颜色为蓝色
+                    element.style.backgroundColor = e // 修改颜色为蓝色
-              })
+                })
             },
             {
-              immediate: true
+                immediate: true
             }
-          )
+        )
         return () => (
             <>
                 <Modal
@@ -96,7 +95,7 @@ export default defineComponent({
                                 img={originFile.value}
                                 autoCrop={true}
                                 fillColor={fillColor.value}
-                                
+
                             />
                         </div>
                         <div class="flex justify-between w-[250px]">
@@ -138,7 +137,7 @@ export default defineComponent({
                                 </svg>
                             </span>
                         </div>
-                        <NativeColorPicker value={fillColor.value} onUpdate:value={e => fillColor.value = e} transparent={true}/>
+                        <NativeColorPicker value={fillColor.value} onUpdate:value={e => fillColor.value = e} transparent={true} />
                         {/* {props.colorList && (
                             <div class="w-[250px] flex justify-center">
                                 <NativeColorPicker
@@ -152,11 +151,12 @@ export default defineComponent({
 
                     </div>
                 </Modal >
-                <div class="w-full h-full bg-red-500"
+                <div class="w-full h-full bg-white flex items-center justify-center"
                     onClick={() => {
                         inputRef.value?.click?.()
                     }}
                 >
+                    <OhVueIcon name={BiPlusLg.name} fill='#666666' scale={2}></OhVueIcon>
                 </div>
                 <input
                     ref={inputRef}