修改一些细节+截选区域样式OK

slince-zero · May 13, 2024 · b5c4bb2 · b5c4bb2
1 parent fd22e57
commit b5c4bb2
Show file tree

Hide file tree

Showing 5 changed files with 53 additions and 11 deletions.
diff --git a/src/context/index.tsx b/src/context/index.tsx
@@ -110,7 +110,8 @@ export default function ImgContextProvider({
   }
 
   useEffect(() => {
-    getImage()
+    // 先关掉
+    // getImage()
   }, [])
 
   // 按下回车事件

diff --git a/src/page/center/dragScreenShot.tsx b/src/page/center/dragScreenShot.tsx
@@ -1,12 +1,19 @@
+// 用来实现拖拽截图功能
 // import { useRef } from 'react'
 // import domtoimage from 'dom-to-image'
 
+import { Button } from '@nextui-org/button'
+import { SnipScreenShotLogo } from '@/page/right/write-logo'
 
 const ScreenCapture = () => {
   return (
     <>
-      <div onClick={() => {console.log('ddddddd');
-      }}>点我</div>
+      <Button isIconOnly
+        onClick={() => {
+          console.log('ddddddd')
+        }}>
+        <SnipScreenShotLogo />
+      </Button>
     </>
   )
 }

diff --git a/src/page/center/index.tsx b/src/page/center/index.tsx
@@ -40,6 +40,7 @@ export default function CenterBoard() {
   //     centerBoardElement.style.cursor = 'url(/rubber.svg),auto'
   //   }
   // }, [boardTool])
+console.log(proportionValue,'proportionValue');
 
   return (
     <div

diff --git a/src/page/right/index.tsx b/src/page/right/index.tsx
@@ -168,7 +168,9 @@ export default function RightBoard() {
       <>
         <Navbar>
           <NavbarBrand>
-            <span className='text-gray-350 font-bold text-inherit'>编辑</span>
+            <span className='text-gray-350 font-bold text-inherit mr-2'>
+              编辑
+            </span>
           </NavbarBrand>
 
           <NavbarContent justify='end'>
@@ -216,13 +218,6 @@ export default function RightBoard() {
                 </SelectItem>
               ))}
             </SelectSection>
-            <SelectSection>
-              <SelectItem
-                key={'自定义'}
-                textValue={'自定义'}>
-                <ScreenCapture />
-              </SelectItem>
-            </SelectSection>
           </Select>
 
           <Select
@@ -433,6 +428,9 @@ export default function RightBoard() {
                   </DropdownItem>
                 </DropdownMenu>
               </Dropdown>
+
+              {/* 截图选区 */}
+              <ScreenCapture/>
             </div>
           </CardBody>
         </Card>

diff --git a/src/page/right/write-logo.tsx b/src/page/right/write-logo.tsx
@@ -72,3 +72,38 @@ export const WhiteBoardLogo = () => (
     />
   </svg>
 )
+
+export const SnipScreenShotLogo = () => (
+  <svg
+    className='icon'
+    width='24px'
+    height='24px'
+    viewBox='0 0 1024 1024'
+    version='1.1'
+    xmlns='http://www.w3.org/2000/svg'>
+    <path
+      d='M795 799H223l572.5-572.5z'
+      fill='#1296db'
+      p-id='2823'></path>
+    <path
+      d='M234.792 821.8c-17.642 0-32.077-14.435-32.077-32.077V131.077c0-17.642 14.435-32.077 32.077-32.077 17.642 0 32.077 14.435 32.077 32.077v658.646c0 17.642-14.434 32.077-32.077 32.077z'
+      fill='#1296db'
+      p-id='2824'></path>
+    <path
+      d='M925.515 789.723c0 17.642-14.435 32.077-32.077 32.077H234.792c-17.642 0-32.077-14.435-32.077-32.077 0-17.642 14.435-32.077 32.077-32.077h658.646c17.643 0 32.077 14.435 32.077 32.077z'
+      fill='#1296db'
+      p-id='2825'></path>
+    <path
+      d='M789.723 204.2c17.642 0 32.077 14.435 32.077 32.077v658.646c0 17.642-14.435 32.077-32.077 32.077-17.642 0-32.077-14.435-32.077-32.077V236.277c0-17.642 14.435-32.077 32.077-32.077z'
+      fill='#1296db'
+      p-id='2826'></path>
+    <path
+      d='M99 236.277c0-17.642 14.435-32.077 32.077-32.077h658.646c17.642 0 32.077 14.435 32.077 32.077 0 17.642-14.435 32.077-32.077 32.077H131.077c-17.642 0-32.077-14.435-32.077-32.077z'
+      fill='#1296db'
+      p-id='2827'></path>
+    <path
+      d='M886.856 137.856c12.475 12.475 12.475 32.889 0 45.364L257.72 812.356c-12.475 12.475-32.889 12.475-45.364 0-12.475-12.475-12.475-32.889 0-45.364l629.136-629.136c12.476-12.475 32.889-12.475 45.364 0z'
+      fill='#1296db'
+      p-id='2828'></path>
+  </svg>
+)