添加左右侧收起展开

src/assets/images/arrow-left.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1748918116226" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2010" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M512 2.373117C230.785632 2.373117 2.966396 230.192352 2.966396 511.406721S230.785632 1020.440324 512 1020.440324s509.033604-227.819235 509.033604-509.033603S793.214368 2.373117 512 2.373117z m186.289687 719.054461c15.425261 15.425261 15.425261 40.34299 0 55.768251L622.349942 853.135574a39.393743 39.393743 0 0 1-55.76825 0L331.643105 619.383546c-1.186559-1.186559-2.373117-1.186559-2.373117-2.373117l-77.126303-77.126304c-3.559676-3.559676-7.119351-8.30591-8.30591-13.052144-5.932793-14.238702-3.559676-32.03708 8.30591-42.716106l77.126303-77.126304c1.186559-1.186559 3.559676-3.559676 5.932793-4.746234l232.565469-232.565469c15.425261-15.425261 40.34299-15.425261 55.768251 0l77.126303 77.126303c15.425261 15.425261 15.425261 40.34299 0 55.768251L489.455388 511.406721l208.834299 210.020857z" p-id="2011" fill="#1296db"></path></svg>
\ No newline at end of file

src/assets/images/arrow-right.svg

+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1748917856818" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1450" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M512 2.373117C230.785632 2.373117 2.966396 230.192352 2.966396 511.406721S230.785632 1020.440324 512 1020.440324s509.033604-227.819235 509.033604-509.033603S793.214368 2.373117 512 2.373117z m259.856315 537.511008L695.91657 617.010429c-1.186559 1.186559-3.559676 3.559676-5.932792 4.746234L457.418308 853.135574a39.393743 39.393743 0 0 1-55.76825 0l-77.126304-77.126304a39.393743 39.393743 0 0 1 0-55.76825l208.834299-208.834299L325.710313 302.572422a39.393743 39.393743 0 0 1 0-55.768251l77.126303-77.126303c15.425261-15.425261 40.34299-15.425261 55.768251 0L693.543453 404.616454c1.186559 1.186559 2.373117 1.186559 2.373117 2.373117l77.126304 77.126304c3.559676 3.559676 7.119351 8.30591 8.305909 13.052144 4.746234 14.238702 2.373117 30.850521-9.492468 42.716106z" p-id="1451" fill="#1296db"></path></svg>
\ No newline at end of file

src/assets/style/home.scss

@@ -126,6 +126,32 @@ body {
         }
       }
     }
+    .left-wrap-toggle {
+      position: absolute;
+      left: 430px;
+      top: 50%;
+      transform: translateY(-50%);
+      z-index: 10;
+      width: 24px;   // 至少和img宽度一致或略大
+      height: 40px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      border-radius: 0 8px 8px 0;
+      cursor: pointer;
+      pointer-events: all;
+      opacity: 0;
+      transition: opacity 0.5s;
+      &.is-appear {
+        opacity: 1;
+      }
+      img {
+        width: 30px;
+        height: 30px;
+        object-fit: contain;
+      }
+    }
+
 
     .right-wrap {
       position: absolute;
@@ -153,6 +179,33 @@ body {
         }
       }
     }
+
+    .right-wrap-toggle {
+      position: absolute;
+      right: 430px;
+      top: 50%;
+      transform: translateY(-50%);
+      z-index: 10;
+      width: 24px;
+      height: 40px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      border-radius: 8px 0 0 8px;
+      cursor: pointer;
+      pointer-events: all;
+      opacity: 0;
+      transition: opacity 0.5s;
+      &.is-appear {
+        opacity: 1;
+      }
+      img {
+        width: 30px;
+        height: 30px;
+        object-fit: contain;
+        transform: scaleX(-1); // 让箭头方向与左侧相反
+      }
+    }
     .bottom-tray {
       position: absolute;
       left: 50%;

vite.config.js

@@ -67,6 +67,11 @@ export default ({ mode }) => {
         }
       }
     },
+    server: {
+      host: '0.0.0.0',
+      port: 8080,
+      open: true,
+    },
     envDir: 'env',
     plugins: [vue()],
   });