fix: 1

src/layout/top/index.tsx

@@ -7,7 +7,8 @@ import style from './style.module.scss'
 
 const { Header, Sider, Content  } = Layout
 
-export const Top = () => {
+
+export const ASider = () => {
   const route = useRoute()
   const navigate = useNavigate()
   const onSelect = (selectRoute: RouteConfigTree) => {
@@ -21,14 +22,20 @@ export const Top = () => {
       />
 
   return (
+    <Sider className={style.sider}>
+      { renderMenu }
+    </Sider>
+  )
+}
+
+export const Base = ({ showMenu }: {showMenu: boolean}) => {
+  return (
     <Layout>
       <Header className={style.header}>
         <HeaderContent />
       </Header>
       <Layout>
-        <Sider className={style.sider}>
-          { renderMenu }
-        </Sider>
+        { showMenu && <ASider /> }
         <Content className={style.content}>
           <Outlet />
         </Content>
@@ -37,4 +44,7 @@ export const Top = () => {
   )
 }
 
+export const Top = () => <Base showMenu />
+export const Second = () => <Base showMenu={false} />
+
 export default Top

src/router/config.ts

@@ -42,9 +42,18 @@ export const routesConfig: RoutesConfig = [
           label: '案件管理',
           icon: ContainerOutlined
         }
-      },
+      }
+    ]
+  },
+  {
+    path: RoutePath.files,
+    element: async () => {
+      const top = await import('layout/top')
+      return { default: top.Second }
+    },
+    children: [
       {
-        path: RoutePath.files,
+        path: '' as any,
         element: () => import('views/files') as any
       }
     ]

src/views/draw-file/board/index.js

@@ -3,7 +3,8 @@ import {
   text,
   table,
   compass,
-  title
+  title,
+  bgImage
 } from './shape'
 import Layer from './editCAD/Layer'
 import { history } from './editCAD/History/History.js'
@@ -24,6 +25,7 @@ export const create = (store, canvas) => {
   }
 
   const layer = new Layer()
+  console.log(store)
   layer.start(canvas, store)
   layer.uiControl.bus.on('showAttribute', ({type, value: data}) => {
     const shape = { 
@@ -71,7 +73,6 @@ export const create = (store, canvas) => {
         }
       }
     }
-    console.log(shape)
     refs.bus.emit('selectShape', shape)
   })
   layer.uiControl.bus.on('hideAttribute', () => refs.bus.emit('selectShape', null))
@@ -88,8 +89,15 @@ export const create = (store, canvas) => {
     bus: refs.bus,
     el: canvas,
     getStore() {
-      console.log(layer.uiControl.exportJSON())
-      return store
+      const data = layer.uiControl.exportJSON()
+      const titleValue = data.floors[0]?.title.value
+      return {
+        id: store.id,
+        shapes: [
+          { type: title, text: titleValue }
+        ],
+        ...layer.uiControl.exportJSON()
+      }
     },
     viewInit() {
       layer.uiControl.menu_flex()
@@ -113,11 +121,11 @@ export const create = (store, canvas) => {
       history.handleRedo()
     },
     setImage(url) {
-      refs.baseMap.changeImage(url)
-      refs.bus.emit('storeChange')
+      console.log(url)
+      layer.uiControl.setAttributes(bgImage, 'update', url)
     },
     export() {
-      layer.uiControl.menu_screenShot()
+      console.log(layer.uiControl.menu_screenShot())
       // return new Promise(resolve => canvas.toBlob(resolve))
     },
     destroy() {

src/views/draw-file/eshape.tsx

@@ -198,7 +198,7 @@ export const EShape = ({ board }: EShapeProps) => {
 
   useEffect(() => {
     const keydownHandler = (ev: KeyboardEvent) => {
-      if (ev.key === 'Delete' && shape && !disabledDelete) {
+      if (['Backspace', 'Delete'].includes(ev.key) && shape && !disabledDelete) {
         shape.delete()
       }
     }

src/views/draw-file/header.tsx

@@ -1,5 +1,5 @@
 import { ArrowLeftOutlined } from "@ant-design/icons"
-import { Button } from "antd"
+import { Button, Form, Input, Popover } from "antd"
 import { useNavigate, fillRoutePath, RoutePath, usePathData } from "router"
 import { saveAs } from 'utils'
 import style from './style.module.scss'
@@ -14,6 +14,23 @@ import { useEffect, useState } from "react"
 import { Board, title } from "./board"
 import type { SaveBoardProps } from 'api'
 
+const Shortcut = () => (
+  <Form labelCol={{flex: '100px'}} labelAlign="left">
+    <Form.Item label="撤销">
+      <Input value="Ctrl + Z" disabled />
+    </Form.Item>
+    <Form.Item label="重做">
+      <Input value="Ctrl + Y" disabled />
+    </Form.Item>
+    <Form.Item label="删除">
+      <Input value="Backspace、Delete" disabled />
+    </Form.Item>
+    <Form.Item label="中心定位">
+      <Input value="Space" disabled />
+    </Form.Item>
+  </Form>
+)
+
 type HeaderProps = {
   board: Board
   type: BoardType
@@ -71,13 +88,30 @@ const Header = ({ board, type }: HeaderProps) => {
     const keydownHandler = (ev: KeyboardEvent) => {
       if (ev.keyCode === 32) {
         board.viewInit()
+      } else if (['Control', 'Ctrl'].includes(ev.key)) {
+        const downKey = ev.key
+        const secondaryHandler = (ev: KeyboardEvent) => {
+          console.log(ev.key)
+          if (ev.key.toUpperCase() === 'Y' && !forwardDisabled) {
+            board.forward()
+          } else if (ev.key.toUpperCase() === 'Z' && !backDisabled) {
+            board.back()
+          }
+        }
+        window.addEventListener('keydown', secondaryHandler)
+        window.addEventListener('keyup', function upHandler(ev) {
+          if (ev.key === downKey) {
+            window.removeEventListener('keydown', secondaryHandler)
+            window.removeEventListener('keyup', upHandler)
+          }
+        })
       }
     }
     window.addEventListener('keydown', keydownHandler)
     return () => {
       window.removeEventListener('keydown', keydownHandler)
     }
-  }, [board])
+  }, [board, forwardDisabled, backDisabled])
 
   return (
     <>
@@ -98,7 +132,9 @@ const Header = ({ board, type }: HeaderProps) => {
           <i className={`iconfont icon-recover ${forwardDisabled ? 'disabled':  'icon'} `} 
             onClick={() => board.forward()} 
           />
-          <i className="iconfont icon-keyboard" />
+          <Popover trigger="hover" content={<Shortcut />} title={<h4>快捷键</h4>}>
+            <i className="iconfont icon-keyboard" />
+          </Popover>
         </div>
         <Button type="primary" size="middle" onClick={save}>保存</Button>
         <Button type="default" size="middle" onClick={exportPng}>导出</Button>

src/views/draw-file/style.module.scss

@@ -47,6 +47,7 @@
 .df-header-action {
   margin-right: 60px;
   :global(.iconfont) {
+    cursor: pointer;
     font-size: 15px;
     &:not(:first-child) {
       margin-left: 32px;