diff --git a/src/config/getData.js b/src/config/getData.js
index d6df314..44a2bd7 100644
--- a/src/config/getData.js
+++ b/src/config/getData.js
@@ -46,4 +46,6 @@ export const rebootVehicle = () => get('vehicle/rebootVehicle', {})
 // 同步地图
 export const synchronizedMap = () => post('mapInfo/synchronizedMap', {})
 // 错误
-export const queryErrorDataByCode = (code) => post('anomalyInfo/queryErrorDataByCode?code=' + code, {})
\ No newline at end of file
+export const queryErrorDataByCode = (code) => post('anomalyInfo/queryErrorDataByCode?code=' + code, {})
+// 叉间状态
+export const backIoStatus = (type) => post('vehicle/backIoStatus?backIoStatus=' + type, {})
\ No newline at end of file
diff --git a/src/i18n/langs/en.js b/src/i18n/langs/en.js
index 9f1978e..1307fa8 100644
--- a/src/i18n/langs/en.js
+++ b/src/i18n/langs/en.js
@@ -106,5 +106,9 @@ module.exports = {
   Aresuremap: 'Are you sure to synchronize the map?',
   Mapbeencancel: 'Map synchronization has been cancelled',
   Aresureshutrestart: 'Are you sure you want to shut down and restart?',
-  shutrestartcancel: 'The operation of shutting down and restarting has been cancelled.'
+  shutrestartcancel: 'The operation of shutting down and restarting has been cancelled.',
+  Systemsettings: 'System settings',
+  Control: 'Control',
+  Workshopstatus: 'Workshop status',
+  Syncsuccessfully: 'Sync successfully'
 }
diff --git a/src/i18n/langs/zh.js b/src/i18n/langs/zh.js
index d68eefa..df067d2 100644
--- a/src/i18n/langs/zh.js
+++ b/src/i18n/langs/zh.js
@@ -84,7 +84,7 @@ module.exports = {
   driverTxt2: '移动到工位点时，点击打点按钮记录当前车辆所在位置为工位点。',
   driverTxt3: '完成建图，点击结束建图按钮，等待地图自动生成。',
   carbuildingmap: '小车正在建图中',
-  errorbuildingredone: '图',
+  errorbuildingredone: '建图过程中出现错误，需要重新进行建图。',
   sureendbuilding: '确定是否结束建图?',
   endbuildingcancel: '已取消结束建图',
   errorendbuilding: '结束建图出现错误',
@@ -106,5 +106,9 @@ module.exports = {
   Aresuremap: '是否确定同步地图?',
   Mapbeencancel: '已取消同步地图',
   Aresureshutrestart: '是否确定关机重启?',
-  shutrestartcancel: '已取消关机重启'
+  shutrestartcancel: '已取消关机重启',
+  Systemsettings: '系统设置',
+  Control: '控制',
+  Workshopstatus: '叉间状态',
+  Syncsuccessfully: '同步成功'
 }
diff --git a/src/images/new/RF5.png b/src/images/new/RF5.png
new file mode 100644
index 0000000..cd2d983
Binary files /dev/null and b/src/images/new/RF5.png differ
diff --git a/src/images/new/RF6.png b/src/images/new/RF6.png
new file mode 100644
index 0000000..d6ee2ff
Binary files /dev/null and b/src/images/new/RF6.png differ
diff --git a/src/images/new/state_title_bg.png b/src/images/new/state_title_bg.png
new file mode 100644
index 0000000..a720ffe
Binary files /dev/null and b/src/images/new/state_title_bg.png differ
diff --git a/src/pages/modules/building.vue b/src/pages/modules/building.vue
index 02cc831..346ffb3 100644
--- a/src/pages/modules/building.vue
+++ b/src/pages/modules/building.vue
@@ -49,7 +49,7 @@
 </template>
 
 <script>
-import GlMap from './gl-map-3.vue'
+import GlMap from './gl-map-2.vue'
 import { driver } from 'driver.js'
 import 'driver.js/dist/driver.css'
 // import { startMapping } from '../../config/mork.js'
@@ -160,15 +160,8 @@ export default {
         nextBtnText: this.$t('next'),
         prevBtnText: this.$t('previous'),
         doneBtnText: this.$t('close'),
-        onNextClick: (element, step) => {
-          if (step.element === '#v-step-3') {
-            this.driverActive = false
-          }
-          this.driver.moveNext()
-        },
-        onCloseClick: () => {
+        onDestroyed: () => {
           this.driverActive = false
-          this.driver.destroy()
         },
         onPopoverRender: (popover, {config, state}) => {
           if (state.activeIndex === 0) {
diff --git a/src/pages/modules/gl-map-2.vue b/src/pages/modules/gl-map-2.vue
index c085d48..ffe3b73 100644
--- a/src/pages/modules/gl-map-2.vue
+++ b/src/pages/modules/gl-map-2.vue
@@ -14,9 +14,9 @@
 import * as THREE from 'three'
 import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'
 import { mapGetters } from 'vuex'
-import { points } from '../../config/point.js'
-import { points1 } from '../../config/point1.js'
-import { points2 } from '../../config/point2.js'
+// import { points } from '../../config/point.js'
+// import { points1 } from '../../config/point1.js'
+// import { points2 } from '../../config/point2.js'
 
 // 常量定义
 const UPDATE_INTERVAL = 800
@@ -295,18 +295,18 @@ export default {
     },
 
     init() {
-      // this.initWebSocket()
-      this.isLoading = false;
-      const pointData = points.data
-      this.updatePointCloud(pointData);
-      setTimeout(() => {
-        const arr = points1.data
-        this.updatePointCloud(arr);
-      }, 1000)
-      setTimeout(() => {
-        const arr = points2.data
-        this.updatePointCloud(arr);
-      }, 2000)
+      this.initWebSocket()
+      // this.isLoading = false;
+      // const pointData = points.data
+      // this.updatePointCloud(pointData);
+      // setTimeout(() => {
+      //   const arr = points1.data
+      //   this.updatePointCloud(arr);
+      // }, 1000)
+      // setTimeout(() => {
+      //   const arr = points2.data
+      //   this.updatePointCloud(arr);
+      // }, 2000)
     },
     
     updatePointCloud(points) {
diff --git a/src/pages/modules/home.vue b/src/pages/modules/home.vue
index 025204f..2c8f28a 100644
--- a/src/pages/modules/home.vue
+++ b/src/pages/modules/home.vue
@@ -83,8 +83,10 @@ export default {
   height 100%
   padding .1rem
   background-image linear-gradient(to bottom,rgba(42, 83, 138, 50%), rgba(57, 101, 181, 50%))
-  border-top 2px solid #62b2f0
-  border-left 2px solid #62b2f0
+  border-top: 3px solid #2fb4f2;
+  border-left: 3px solid #40c2f7;
+  border-right: 3px solid #5dddf8;
+  border-bottom: 3px solid #6abde9;
   box-shadow inset 0 0px 12px 8px rgba(98, 180, 243, 50%)
   p
     font-size .4rem
diff --git a/src/pages/shells/config-modal.vue b/src/pages/shells/config-modal.vue
index 9b3d5e9..9946e83 100644
--- a/src/pages/shells/config-modal.vue
+++ b/src/pages/shells/config-modal.vue
@@ -36,22 +36,35 @@
           <el-col :span="7"><button class="button_control" @click="dataFormSubmit"><p>{{$t('Save')}}</p></button></el-col>
         </el-row>
       </el-tab-pane>
-      <el-tab-pane :label="$t('Shutdownrestart')" name="second">
-        <el-row type="flex" justify="center" align="middle" class="tab_wraper">
-          <div class="reset" @click="toReboot"></div>
-        </el-row>
-      </el-tab-pane>
-      <el-tab-pane :label="$t('Synchronizemap')" name="third">
-        <el-row type="flex" justify="center" align="middle" class="tab_wraper">
-          <button class="button_control" @click="synchronizedMapConfirm"><p>{{ $t('Synchronizemap') }}</p></button>
-        </el-row>
+      <el-tab-pane :label="$t('Systemsettings')" name="second">
+        <div class="tab_wraper">
+          <div class="contorl_title">AGV</div>
+          <el-row type="flex" class="contorl_box">
+            <button class="agv_button" @click="toReboot">
+              <img src="../../images/new/RF5.png" alt="">
+              <p>{{ $t('Shutdownrestart') }}</p>
+            </button>
+            <button class="agv_button" @click="synchronizedMapConfirm">
+              <img src="../../images/new/RF6.png" alt="">
+              <p>{{ $t('Synchronizemap') }}</p>
+            </button>
+          </el-row>
+          <div class="contorl_title">{{$t('Control')}}</div>
+          <el-row type="flex" class="contorl_box">
+            <p class="contorl_title_2">{{$t('Workshopstatus')}}</p>
+            <div class="switch_button" :class="{'switch_button_on': backIoStatus}">
+              <div class="switch_on_off"></div>
+              <input type="checkbox" @click="_backIoStatus">
+          </div>
+          </el-row>
+        </div>
       </el-tab-pane>
     </el-tabs>
   </el-dialog>
 </template>
 
 <script>
-import { rebootVehicle, synchronizedMap } from '../../config/getData.js'
+import { rebootVehicle, synchronizedMap, backIoStatus } from '../../config/getData.js'
 import { mapGetters, mapActions } from 'vuex'
 export default {
   data () {
@@ -80,7 +93,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters(['serverUrl']),
+    ...mapGetters(['serverUrl', 'backIoStatus']),
   },
   watch: {
     serverUrl (newVal) {
@@ -98,6 +111,7 @@ export default {
         this.dataForm.selectedLanguage = 'en-us'
       }
       this.dataForm.serverIp = this.serverUrl
+      this.activeName = 'first'
       this.dialogVisible = true
     },
     exitUser () {
@@ -174,14 +188,32 @@ export default {
         })
         let res = await synchronizedMap()
         if (res) {
-          this.$message('同步成功')
+          this.$message(this.$t('Syncsuccessfully'))
         }
         this.loading.close()
       } catch (e) {
         this.$message.error(e)
         this.loading.close()
       }
-    }
+    },
+    async _backIoStatus () {
+      try {
+        this.loading = this.$loading({
+          lock: true,
+          spinner: 'el-icon-loading',
+          background: 'rgba(0, 0, 0, 0.6)'
+        })
+        let res = await backIoStatus(this.backIoStatus)
+        if (res) {
+          this.dialogVisible = false
+          this.$message(res.message)
+        }
+        this.loading.close()
+      } catch (e) {
+        this.$message.error(e)
+        this.loading.close()
+      }
+    },
   }
 }
 </script>
@@ -202,6 +234,60 @@ export default {
   width .72rem
   height .71rem
   background center / 100% auto url(../../images/new/reset.png) no-repeat
+.contorl_title
+  width 2rem
+  height .4rem
+  padding-left .4rem
+  font-size .24rem
+  color #fff
+  line-height .4rem
+  margin-bottom .2rem
+  background center / 100% 100% url(../../images/new/state_title_bg.png) no-repeat
+.agv_button
+  min-width .9rem
+  height .9rem
+  padding: 0.05rem;
+  font-size: .16rem;
+  color: #fff;
+  border 1px solid #3D93F0
+  background linear-gradient(0deg, #3483DA, #1E59CD)
+  img
+    width .5rem
+    height .5rem
+  +.agv_button
+    margin-left .2rem
+.contorl_box
+  padding 0 .4rem
+  margin-bottom .2rem
+.contorl_title_2
+  font-size: .2rem;
+  line-height: .4rem;
+  color: #fff;
+  padding-right: 0.1rem;
+.switch_button
+  position relative
+  width .9rem
+  height .4rem
+  border 1px solid #357ED1
+  background linear-gradient(0deg, #286495, #0F294D)
+  box-sizing border-box
+  input[type="checkbox"]
+    position absolute
+    width 100%
+    height 100%
+    opacity: 0;
+    margin: 0;
+.switch_on_off
+  position absolute
+  width .4rem
+  height 100%
+  left 0
+  background #4380AF
+.switch_button_on
+  border-color #3D93F0
+  background linear-gradient(0deg, #3483DA, #1E59CD)
+  .switch_on_off
+    background #A2FAFE
 .enClass
   .el-tabs__item
     font-size .2rem
diff --git a/src/vuex/modules/data.js b/src/vuex/modules/data.js
index 1cb6679..92db8f1 100644
--- a/src/vuex/modules/data.js
+++ b/src/vuex/modules/data.js
@@ -3,13 +3,15 @@ import * as types from '../types'
 const state = {
   carPosition: {x: '', y: '', angle: ''},
   isTop: false,
-  errorData: []
+  errorData: [],
+  backIoStatus: false
 }
 
 const getters = {
   carPosition: state => state.carPosition,
   isTop: state => state.isTop,
-  errorData: state => state.errorData
+  errorData: state => state.errorData,
+  backIoStatus: state => state.backIoStatus
 }
 
 const actions = {
@@ -32,6 +34,9 @@ const mutations = {
     if (Object.prototype.hasOwnProperty.call(data, 'errorData')) {
       state.errorData = data.errorData
     }
+    if (Object.prototype.hasOwnProperty.call(data, 'back_io_status')) {
+      state.backIoStatus = data.back_io_status
+    }
   }
 }