diff --git a/src/layout/components/Logo/src/Logo.vue b/src/layout/components/Logo/src/Logo.vue
index 8f8bcd94..8468774d 100644
--- a/src/layout/components/Logo/src/Logo.vue
+++ b/src/layout/components/Logo/src/Logo.vue
@@ -80,7 +80,7 @@ watch(
               layout === 'topLeft' || layout === 'top' || layout === 'cutMenu'
           }
         ]"
-        style="font-size: 14px"
+        style="font-size: 13px"
       >
         {{ title }}
       </div>
diff --git a/src/layout/components/useRenderLayout.tsx b/src/layout/components/useRenderLayout.tsx
index 927a369a..2adc87f9 100644
--- a/src/layout/components/useRenderLayout.tsx
+++ b/src/layout/components/useRenderLayout.tsx
@@ -55,7 +55,7 @@ export const useRenderLayout = () => {
                   'w-[var(--left-menu-max-width)]': !appStore.getCollapse
                 }
               ]}
-              style="transition: all var(--transition-time-02);height:60px;display: flex;
+              style="transition: all var(--transition-time-02);height:59px;display: flex;
         align-items: center;"
             ></Logo>
           ) : undefined}
diff --git a/src/styles/var.css b/src/styles/var.css
index 1b10b273..ddbb5c14 100644
--- a/src/styles/var.css
+++ b/src/styles/var.css
@@ -3,7 +3,7 @@
 
   --login-bg-color: #293146;
 
-  --left-menu-max-width: 220px;
+  --left-menu-max-width: 200px;
 
   --left-menu-min-width: 64px;
 
diff --git a/src/views/mapPage/realTimeMap/editMap.vue b/src/views/mapPage/realTimeMap/editMap.vue
index eb3d1a57..e9f9c262 100644
--- a/src/views/mapPage/realTimeMap/editMap.vue
+++ b/src/views/mapPage/realTimeMap/editMap.vue
@@ -1,152 +1,117 @@
 <template>
   <div>
-    <ContentWrap>
-      <div class="tool-list">
-        <div class="tool-item">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 打开 </div>
-        </div>
-        <div class="tool-item" @click="saveMap">
-          <Icon icon="ep:folder-checked" :size="24" />
-          <div class="name"> 保存 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:folder-opened" :size="24" />
-          <div class="name"> 另存为 </div>
-        </div>
-        <div class="line"></div>
-        <div class="tool-item">
-          <Icon icon="ep:position" :size="24" />
-          <div class="name"> 选择 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:rank" :size="24" />
-          <div class="name"> 移动 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 旋转 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:document" :size="24" />
-          <div class="name"> 复制 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:copy-document" :size="24" />
-          <div class="name"> 粘贴 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:delete" :size="24" />
-          <div class="name"> 删除 </div>
-        </div>
-        <div class="line"></div>
-        <div class="tool-item">
-          <Icon icon="ep:briefcase" :size="24" />
-          <div class="name"> 工具 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 线库 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 区域 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 文字 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 设备 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 车辆 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 测距 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 图层 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 标记 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 网格 </div>
-        </div>
-        <div class="line"></div>
-        <div class="tool-item">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 放大 </div>
-        </div>
-        <div class="tool-item">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 缩小 </div>
-        </div>
-        <div class="tool-item" @click="backPreviousStep">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 撤回 </div>
-        </div>
-        <div class="tool-item" @click="backNextStep">
-          <Icon icon="ep:folder-add" :size="24" />
-          <div class="name"> 重做 </div>
-        </div>
-      </div>
-      <!-- <el-button type="primary" @click="drawNodes" :disabled="formLoading"> 绘制节点 </el-button> -->
-    </ContentWrap>
-    <div class="map-box" ref="imgWrap" @mousewheel.prevent="rollImg" style="overflow: hidden">
-      <div class="map-box-inner" ref="image" @mousedown.prevent="moveImg">
-        <img :src="imgBgObj.imgUrl" class="map-box-img" id="mapBg" />
-        <div class="map-box-inner-dot" @click="mapClick">
-          <VueDragResizeRotate
-            v-for="(item, index) in allHistoryList[currentIndex]"
-            :key="index"
-            :parent="true"
-            :x="item.x"
-            :y="item.y"
-            :w="item.w"
-            :h="item.h"
-            :r="item.angle"
-            @rotatestop="(degree) => rotateEnd(degree, item, index)"
-            @dragstop="(x, y) => dragEnd(x, y, item, index)"
-            @resizestop="(x, y, width, height) => resizeEnd(x, y, width, height, item, index)"
-            @activated="() => activatedHandle(item, index)"
-            @deactivated="deactivatedHandle"
-            :draggable="item.draggable"
-            :resizable="item.resizable"
-            :rotatable="item.rotatable"
-            :lockAspectRatio="item.lockAspectRatio"
-          >
-            <div class="sdiv">
-              <img
-                v-if="item.labelType === 'icon'"
-                :src="item.img"
-                alt=""
-                style="width: 100%; height: 100%"
-              />
-              <div
-                v-if="item.labelType === 'node'"
-                style="width: 100%; height: 100%; background-color: #000; border-radius: 50%"
-              ></div>
+    <div class="top-tool-list">
+      <div v-for="item in state.topToolList" :key="item.id" class="top-tool-item">
+        <el-popover
+          placement="bottom"
+          :width="80"
+          trigger="click"
+          v-if="item.id === 5"
+          :disabled="currentItemIndex === -1"
+        >
+          <template #reference>
+            <div
+              class="tool-item"
+              :class="
+                toolbarTypeIndex === item.id
+                  ? 'tool-active'
+                  : item.isActive
+                    ? 'right-tool-active'
+                    : ''
+              "
+              @click="toolbarClick(item)"
+            >
+              <Icon :icon="item.icon" :size="24" />
+              <div class="name"> {{ item.name }} </div>
             </div>
-          </VueDragResizeRotate>
-          <!-- 文档 https://github.com/a7650/vue3-draggable-resizable/blob/main/docs/document_zh.md#resizable -->
+          </template>
+          <el-form :model="state.moveForm">
+            <el-form-item label="X">
+              <el-input v-model="state.moveForm.x" placeholder="请输入" />
+            </el-form-item>
+            <el-form-item label="Y">
+              <el-input v-model="state.moveForm.y" placeholder="请输入" />
+            </el-form-item>
+            <div style="text-align: right">
+              <el-button size="small" color="#00329F" @click="moveFormSubmit">确认</el-button>
+            </div>
+          </el-form>
+        </el-popover>
+        <div
+          v-if="item.id !== 5"
+          class="tool-item"
+          :class="
+            toolbarTypeIndex === item.id ? 'tool-active' : item.isActive ? 'right-tool-active' : ''
+          "
+          @click="toolbarClick(item)"
+        >
+          <Icon :icon="item.icon" :size="24" />
+          <div class="name"> {{ item.name }} </div>
         </div>
+        <div class="line" v-if="item.id === 3 || item.id === 10 || item.id === 19"></div>
+      </div>
+    </div>
+    <div class="right-tool-list">
+      <div
+        v-for="item in state.rightToolList"
+        :key="item.id"
+        class="tool-item"
+        :class="
+          toolbarTypeIndex === item.id ? 'tool-active' : item.isActive ? 'right-tool-active' : ''
+        "
+        @click="toolbarClick(item)"
+      >
+        <Icon :icon="item.icon" :size="24" />
+        <div class="name"> {{ item.name }} </div>
       </div>
     </div>
-
-    <editNodeProperties
-      ref="editNodePropertiesRef"
-      :positionMapId="imgBgObj.positionMapId"
-      @submitNodeSuccess="submitNodeSuccess"
-    />
   </div>
+  <div class="map-box" ref="imgWrap" @mousewheel.prevent="rollImg" style="overflow: hidden">
+    <div class="map-box-inner" ref="image" @mousedown.prevent="moveImg">
+      <img :src="imgBgObj.imgUrl" class="map-box-img" id="mapBg" />
+      <div class="map-box-inner-dot" @click="mapClick" :class="state.isShowGrid ? 'grid-show' : ''">
+        <VueDragResizeRotate
+          v-for="(item, index) in allHistoryList[currentIndex]"
+          :key="index"
+          :parent="true"
+          :x="item.x"
+          :y="item.y"
+          :w="item.w"
+          :h="item.h"
+          :r="item.angle"
+          @rotatestop="(degree) => rotateEnd(degree, item, index)"
+          @dragstop="(x, y) => dragEnd(x, y, item, index)"
+          @resizestop="(x, y, width, height) => resizeEnd(x, y, width, height, item, index)"
+          @activated="() => activatedHandle(item, index)"
+          @deactivated="deactivatedHandle"
+          :draggable="item.draggable"
+          :resizable="item.resizable"
+          :rotatable="item.rotatable"
+          :lockAspectRatio="item.lockAspectRatio"
+        >
+          <div class="sdiv">
+            <img
+              v-if="item.labelType === 'icon'"
+              :src="item.img"
+              alt=""
+              style="width: 100%; height: 100%"
+            />
+            <div
+              v-if="item.labelType === 'node'"
+              style="width: 100%; height: 100%; background-color: #000; border-radius: 50%"
+            ></div>
+          </div>
+        </VueDragResizeRotate>
+        <!-- 文档 https://github.com/a7650/vue3-draggable-resizable/blob/main/docs/document_zh.md#resizable -->
+      </div>
+    </div>
+  </div>
+
+  <editNodeProperties
+    ref="editNodePropertiesRef"
+    :positionMapId="imgBgObj.positionMapId"
+    @submitNodeSuccess="submitNodeSuccess"
+  />
 </template>
 
 <script setup>
@@ -161,7 +126,7 @@ const formLoading = ref(false)
 
 const allHistoryList = ref([]) //全部的历史记录
 const currentIndex = ref(0) //用于记录是哪条历史记录的
-const currentItemIndex = ref(0) //用于记录是在编辑那个具体的节点、图标等
+const currentItemIndex = ref(-1) //用于记录是在编辑那个具体的节点、图标等
 const imgBgObj = reactive({
   imgUrl: '',
   positionMapId: ''
@@ -229,7 +194,9 @@ const activatedHandle = (item, index) => {
   console.log('选中', item)
   currentItemIndex.value = index
   if (item.labelType === 'node') {
-    editNodePropertiesRef.value.open(item)
+    if (toolbarTypeIndex.value === 25) {
+      editNodePropertiesRef.value.open(item)
+    }
   }
 }
 //非选中
@@ -271,19 +238,10 @@ const backNextStep = () => {
     message.warning('没了老铁')
   }
 }
-//绘制节点
-const toolTypeIndex = ref(0)
-const cursorType = ref('')
-const drawNodes = () => {
-  if (toolTypeIndex.value === 1) {
-    toolTypeIndex.value = 0
-  } else {
-    toolTypeIndex.value = 1
-  }
-}
+
 //地图点击
 const mapClick = (e) => {
-  if (toolTypeIndex.value === 1) {
+  if (toolbarTypeIndex.value === 24) {
     //绘制节点
     imgList.value.push({
       x: e.offsetX,
@@ -297,7 +255,6 @@ const mapClick = (e) => {
       img: '',
       labelType: 'node'
     })
-    console.log(imgList.value)
     currentIndex.value++
     allHistoryList.value.push(JSON.parse(JSON.stringify(imgList.value)))
   }
@@ -338,6 +295,273 @@ const submitNodeSuccess = (item) => {
   allHistoryList.value[currentIndex.value][currentItemIndex.value] = item
 }
 
+//工具栏点击
+const toolbarTypeIndex = ref(0)
+const state = reactive({
+  topToolList: [
+    {
+      id: 1,
+      name: '打开',
+      icon: 'ep:folder-add',
+      isActive: false
+    },
+    {
+      id: 2,
+      name: '保存',
+      icon: 'ep:folder-checked',
+      isActive: false
+    },
+    {
+      id: 3,
+      name: '另存为',
+      icon: 'ep:folder-opened',
+      isActive: false
+    },
+    {
+      id: 4,
+      name: '选择',
+      icon: 'ep:position',
+      isActive: false
+    },
+    {
+      id: 5,
+      name: '移动',
+      icon: 'ep:rank',
+      isActive: false
+    },
+    {
+      id: 6,
+      name: '旋转',
+      icon: 'ep:folder-add',
+      isActive: false
+    },
+    {
+      id: 7,
+      name: '复制',
+      icon: 'ep:document',
+      isActive: false
+    },
+    {
+      id: 8,
+      name: '粘贴',
+      icon: 'ep:copy-document',
+      isActive: false
+    },
+    {
+      id: 9,
+      name: '删除',
+      icon: 'ep:delete',
+      isActive: false
+    },
+    {
+      id: 10,
+      name: '工具',
+      icon: 'ep:briefcase',
+      isActive: false
+    },
+    {
+      id: 11,
+      name: '线库',
+      icon: 'ep:folder-add',
+      isActive: false
+    },
+    {
+      id: 12,
+      name: '区域',
+      icon: 'ep:folder-add',
+      isActive: false
+    },
+    {
+      id: 13,
+      name: '文字',
+      icon: 'ep:folder-add',
+      isActive: false
+    },
+    {
+      id: 14,
+      name: '设备',
+      icon: 'ep:folder-add',
+      isActive: false
+    },
+    {
+      id: 15,
+      name: '车辆',
+      icon: 'ep:folder-add',
+      isActive: false
+    },
+    {
+      id: 16,
+      name: '测距',
+      icon: 'ep:folder-add',
+      isActive: false
+    },
+    {
+      id: 17,
+      name: '图层',
+      icon: 'ep:folder-add',
+      isActive: false
+    },
+    {
+      id: 18,
+      name: '标记',
+      icon: 'ep:folder-add',
+      isActive: false
+    },
+    {
+      id: 19,
+      name: '网格',
+      icon: 'ep:folder-add',
+      isActive: false
+    },
+    {
+      id: 20,
+      name: '放大',
+      icon: 'ep:zoom-in',
+      isActive: false
+    },
+    {
+      id: 21,
+      name: '缩小',
+      icon: 'ep:zoom-out',
+      isActive: false
+    },
+    {
+      id: 22,
+      name: '撤回',
+      icon: 'ep:top-left',
+      isActive: false
+    },
+    {
+      id: 23,
+      name: '重做',
+      icon: 'ep:top-right',
+      isActive: false
+    }
+  ],
+  rightToolList: [
+    {
+      id: 24,
+      name: '绘制节点',
+      icon: 'ep:circle-plus-filled',
+      isActive: false
+    },
+    {
+      id: 25,
+      name: '编辑节点',
+      icon: 'ep:circle-plus-filled',
+      isActive: false
+    },
+    {
+      id: 26,
+      name: '绘制路线',
+      icon: 'ep:semi-select',
+      isActive: false
+    },
+    {
+      id: 27,
+      name: '编辑路线',
+      icon: 'ep:semi-select',
+      isActive: false
+    }
+  ],
+  isShowGrid: false,
+  moveForm: {
+    x: '',
+    y: ''
+  }
+})
+const toolbarClick = (item) => {
+  let type = item.id
+  if (currentItemIndex.value === -1 && type === 5) {
+    message.warning('请先选择要操作的图标')
+    return
+  }
+
+  if (toolbarTypeIndex.value === type) {
+    toolbarTypeIndex.value = 0
+  } else {
+    toolbarTypeIndex.value = type
+  }
+  switch (type) {
+    case 1:
+      break
+    case 2:
+      saveMap()
+      break
+    case 3:
+      break
+    case 4:
+      break
+    case 5:
+      break
+    case 6:
+      break
+    case 7:
+      break
+    case 8:
+      break
+    case 9:
+      break
+    case 10:
+      break
+    case 11:
+      break
+    case 12:
+      break
+    case 13:
+      break
+    case 14:
+      break
+    case 15:
+      break
+    case 16:
+      break
+    case 17:
+      break
+    case 18:
+      break
+    case 19:
+      //网格
+      if (toolbarTypeIndex.value === 19) {
+        state.isShowGrid = true
+        item.isActive = true
+      } else {
+        state.isShowGrid = false
+        item.isActive = false
+      }
+      break
+    case 20:
+      break
+    case 21:
+      break
+    case 22:
+      //上一步
+      backPreviousStep()
+      break
+    case 23:
+      //下一步
+      backNextStep()
+      break
+    case 24:
+      drawNodes()
+      break
+    case 25:
+      break
+    case 26:
+      break
+    case 27:
+      break
+    default:
+      break
+  }
+}
+
+//移动工具表单提交
+const moveFormSubmit = () => {
+  allHistoryList.value[currentIndex.value][currentItemIndex.value].x = state.moveForm.x
+  allHistoryList.value[currentIndex.value][currentItemIndex.value].y = state.moveForm.y
+}
+
 onMounted(() => {
   imgList.value = [
     {
@@ -389,6 +613,9 @@ onMounted(() => {
       left: 0;
       top: 0;
       bottom: 0;
+    }
+
+    .grid-show {
       background: linear-gradient(-90deg, rgba(0, 0, 0, 0.1) 1px, transparent 1px),
         linear-gradient(rgba(0, 0, 0, 0.1) 1px, transparent 1px);
       background-size:
@@ -403,32 +630,84 @@ onMounted(() => {
   height: 100%;
 }
 
-.tool-list {
+.top-tool-list {
   display: flex;
   align-items: center;
   text-align: center;
+  background-color: #fff;
+  margin-top: -20px;
+  margin-left: -20px;
+  margin-right: -20px;
+  padding: 0 14px;
+  margin-bottom: 20px;
+  box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;
+  height: 70px;
 
-  .tool-item {
-    width: 50px;
-  }
+  .top-tool-item {
+    display: flex;
+    align-items: center;
 
-  .name {
-    font-family:
-      PingFangSC,
-      PingFang SC;
-    font-weight: 400;
-    font-size: 14px;
-    color: #0d162a;
-    line-height: 20px;
-    text-align: center;
-    font-style: normal;
-  }
+    .tool-item {
+      cursor: pointer;
+      width: 52px;
+      height: 70px;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
 
-  .line {
-    margin: 0 14px;
-    width: 1px;
-    height: 47px;
-    border: 1px solid #cccccc;
+      .name {
+        font-family:
+          PingFangSC,
+          PingFang SC;
+        font-weight: 400;
+        font-size: 14px;
+        color: #0d162a;
+        line-height: 20px;
+        text-align: center;
+        font-style: normal;
+      }
+    }
+    .line {
+      margin: 0 14px;
+      width: 1px;
+      height: 47px;
+      border: 1px solid #cccccc;
+    }
   }
 }
+
+.right-tool-list {
+  position: absolute;
+  right: 0;
+  top: 94px;
+  background-color: #fff;
+  z-index: 999;
+  text-align: center;
+  box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;
+
+  .tool-item {
+    cursor: pointer;
+    padding: 10px;
+    .name {
+      font-family:
+        PingFangSC,
+        PingFang SC;
+      font-weight: 400;
+      font-size: 14px;
+      color: #0d162a;
+      line-height: 20px;
+      text-align: center;
+      font-style: normal;
+    }
+  }
+}
+
+.tool-active {
+  background: #ebf1ff;
+  border-bottom: 2px solid #1677ff;
+}
+.right-tool-active {
+  background: #ebf1ff;
+}
 </style>