From 86e72a64a74a87c87bf5374efd9a85ade4a966ee Mon Sep 17 00:00:00 2001
From: air <30444667+sszdot@users.noreply.github.com>
Date: Wed, 18 Jun 2025 21:09:33 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90=E7=B1=BB=20=20=E5=9E=8B=E3=80=91?=
 =?UTF-8?q?=EF=BC=9Afeat=20=E3=80=90=E5=8E=9F=20=20=E5=9B=A0=E3=80=91?=
 =?UTF-8?q?=EF=BC=9A=E6=B7=BB=E5=8A=A0=E8=AF=AD=E8=A8=80=E8=AE=BE=E7=BD=AE?=
 =?UTF-8?q?=E9=80=89=E9=A1=B9=20=20=E7=A8=8B=E5=BA=8F=E8=AE=BE=E7=BD=AE?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD=20=E3=80=90=E8=BF=87=20=20=E7=A8=8B=E3=80=91?=
 =?UTF-8?q?=EF=BC=9A=20=E3=80=90=E5=BD=B1=20=20=E5=93=8D=E3=80=91=EF=BC=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

# 类型 包含:
# feat：新功能（feature）
# fix：修补bug
# docs：文档（documentation）
# style： 格式（不影响代码运行的变动）
# refactor：重构（即不是新增功能，也不是修改bug的代码变动）
# test：增加测试
# chore：构建过程或辅助工具的变动
---
 src/router/index.js                           |  11 ++
 src/styles/myIcon.scss                        |   2 +-
 src/views/layout/components/headbar.vue       | 159 ++++++++----------
 src/views/layout/components/main/home/set.vue |  76 +++++++++
 4 files changed, 159 insertions(+), 89 deletions(-)
 create mode 100644 src/views/layout/components/main/home/set.vue

diff --git a/src/router/index.js b/src/router/index.js
index 33817c3..4e8610b 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -36,6 +36,17 @@ const routes = [
           roles: ['admin', 'editor'],
           tapName: 'plane'
         }
+      },
+      {
+        path: '/home/set',
+        component: () => import('@/views/layout/components/main/home/set'),
+        meta: {
+          title: '设置',
+          icon: 'iconfont icon-shezhi',
+          roles: ['admin', 'editor'],
+          tapName: 'plane',
+          hidden: true
+        }
       }
     ]
   },
diff --git a/src/styles/myIcon.scss b/src/styles/myIcon.scss
index 8791a8c..6534b34 100644
--- a/src/styles/myIcon.scss
+++ b/src/styles/myIcon.scss
@@ -1 +1 @@
-@import 'https://at.alicdn.com/t/c/font_3703467_1z89u99sr5w.css'; //iconfont阿里巴巴
\ No newline at end of file
+@import 'https://at.alicdn.com/t/c/font_3703467_793cqnnxv0f.css'; //iconfont阿里巴巴
\ No newline at end of file
diff --git a/src/views/layout/components/headbar.vue b/src/views/layout/components/headbar.vue
index 022ef80..dc84547 100644
--- a/src/views/layout/components/headbar.vue
+++ b/src/views/layout/components/headbar.vue
@@ -2,75 +2,59 @@
   <div>
     <!-- menu缩进按钮 -->
     <div class="w-50px h-50px fc l" id="menuTabB" @click="handleCollapse">
-      <i
-        class="iconfont f-s-26"
-        :class="isCollapse ? 'icon-a-yousuojin3x' : 'icon-a-zuosuojin3x'"
-      ></i>
+      <i class="iconfont f-s-26" :class="isCollapse ? 'icon-a-yousuojin3x' : 'icon-a-zuosuojin3x'"></i>
     </div>
     <!-- 面包屑 -->
     <Breadcrumb class="l l-h-50 m-l-5" />
     <!-- 头像 -->
     <div class="right-menu m-r-5">
-      <el-dropdown class="avatar-container" trigger="click">
+      <el-dropdown class="avatar-container" trigger="click" @command="handleCommand">
         <div class="avatar-wrapper">
-          <img
-            v-if="
-              avatar.indexOf('.jpg') !== -1 ||
-              avatar.indexOf('.gif') !== -1 ||
-              avatar.indexOf('.png') !== -1
-            "
-            :src="avatar + '?imageView2/1/w/80/h/80'"
-            class="user-avatar"
-          />
+          <img v-if="avatar && (
+            avatar.includes('.jpg') ||
+            avatar.includes('.gif') ||
+            avatar.includes('.png')
+          )" :src="avatar + '?imageView2/1/w/80/h/80'" class="user-avatar" />
           <el-avatar v-else size="medium" icon="el-icon-user-solid"></el-avatar>
           <i class="el-icon-caret-bottom"></i>
         </div>
+
         <el-dropdown-menu slot="dropdown" class="user-dropdown">
-          <el-dropdown-item divided @click.native="logout">
-            <span style="display: block">退出登录</span>
+          <!-- 自定义语言设置为右侧弹出 -->
+          <el-dropdown-item>
+            <el-popover placement="right-start" width="150" trigger="hover" v-model="languagePopoverVisible">
+              <el-radio-group v-model="currentLang" @change="changeLang">
+                <el-radio label="zh-CN">简体中文</el-radio>
+                <!-- 其他语言可继续添加 -->
+                <!-- <el-radio label="en" class="m-t-10">English</el-radio> -->
+              </el-radio-group>
+              <span slot="reference" class="mainFontColor f-s-16"><i class="iconfont icon-zhongyingwen m-r-10"></i>语言设置</span>
+            </el-popover>
           </el-dropdown-item>
+
+          <el-dropdown-item class="mainFontColor f-s-16" command="go-setting"><i class="iconfont icon-shezhi m-r-10"></i>设置</el-dropdown-item>
+          <el-dropdown-item class="mainFontColor f-s-16" divided command="logout"><i class="iconfont icon-logout m-r-10"></i>退出登录</el-dropdown-item>
         </el-dropdown-menu>
       </el-dropdown>
     </div>
+
     <!-- 页面刷新 -->
     <div class="l-h-50 p-r-15 r">
-      <el-button
-        size="small"
-        icon="iconfont icon-shuaxin"
-        @click="refreshPage"
-        circle
-      ></el-button>
+      <el-button size="small" icon="iconfont icon-shuaxin" @click="refreshPage" circle></el-button>
     </div>
     <!-- 订单信息按钮 -->
-    <el-badge
-      :hidden="
-        pendingCount + processingCount + shippedCount + requestedCount == 0
-          ? true
-          : false
-      "
-      :value="pendingCount + processingCount + shippedCount + requestedCount"
-      class="navbarBadge l-h-50 p-r-15 r"
-    >
-      <el-button
-        :type="
-          pendingCount + processingCount + shippedCount + requestedCount !== 0
-            ? 'primary'
-            : ''
-        "
-        @click="drawer = true"
-        size="small"
-        :icon="orderIcon"
-        circle
-      ></el-button>
+    <el-badge :hidden="pendingCount + processingCount + shippedCount + requestedCount == 0
+      ? true
+      : false
+      " :value="pendingCount + processingCount + shippedCount + requestedCount" class="navbarBadge l-h-50 p-r-15 r">
+      <el-button :type="pendingCount + processingCount + shippedCount + requestedCount !== 0
+        ? 'primary'
+        : ''
+        " @click="drawer = true" size="small" :icon="orderIcon" circle></el-button>
     </el-badge>
-    <el-drawer
-      :custom-class="$store.state.app.isWideScreen ? 'el-drawer-small' : 'el-drawer-large'"
-      :visible.sync="drawer"
-      :size="$store.state.app.isWideScreen ? '90%' : '60%'"
-      :append-to-body="true"
-      :modal-append-to-body="false"
-      :direction="$store.state.app.isWideScreen ? 'btt' : 'rtl'"
-    >
+    <el-drawer :custom-class="$store.state.app.isWideScreen ? 'el-drawer-small' : 'el-drawer-large'"
+      :visible.sync="drawer" :size="$store.state.app.isWideScreen ? '90%' : '60%'" :append-to-body="true"
+      :modal-append-to-body="false" :direction="$store.state.app.isWideScreen ? 'btt' : 'rtl'">
       <template slot="title">
         <div>
           <i class="l f-s-18 iconfont icon-jinjidingdan m-r-5 l-h-18"></i>
@@ -84,66 +68,47 @@
         <el-tab-pane>
           <template slot="label">
             <span>未接单</span>
-            <el-badge
-              :hidden="pendingCount == 0 ? true : false"
-              :value="pendingCount"
-            >
+            <el-badge :hidden="pendingCount == 0 ? true : false" :value="pendingCount">
             </el-badge>
           </template>
-          <QuestTabs :list="pendingList" type = "未接单"/>
+          <QuestTabs :list="pendingList" type="未接单" />
         </el-tab-pane>
         <el-tab-pane>
           <template slot="label">
             <span>已接单</span>
-            <el-badge
-              :hidden="processingCount == 0 ? true : false"
-              :value="processingCount"
-            >
+            <el-badge :hidden="processingCount == 0 ? true : false" :value="processingCount">
             </el-badge>
           </template>
-          <QuestTabs :list="processingList" type = "已接单"/>
+          <QuestTabs :list="processingList" type="已接单" />
         </el-tab-pane>
         <el-tab-pane>
           <template slot="label">
             <span>已发货</span>
-            <el-badge
-              :hidden="shippedCount == 0 ? true : false"
-              :value="shippedCount"
-            >
+            <el-badge :hidden="shippedCount == 0 ? true : false" :value="shippedCount">
             </el-badge>
           </template>
-          <QuestTabs :list="shippedList" type = "已发货" @close-drawer="drawer = false"/>
+          <QuestTabs :list="shippedList" type="已发货" @close-drawer="drawer = false" />
         </el-tab-pane>
         <el-tab-pane>
           <template slot="label">
             <span>退款申请中</span>
-            <el-badge
-              :hidden="requestedCount == 0 ? true : false"
-              :value="requestedCount"
-            >
+            <el-badge :hidden="requestedCount == 0 ? true : false" :value="requestedCount">
             </el-badge>
           </template>
-          <QuestTabs :list="requestedList" type = "退款申请中"/>
+          <QuestTabs :list="requestedList" type="退款申请中" />
         </el-tab-pane>
       </el-tabs>
     </el-drawer>
     <!-- mqtt状态灯 -->
     <div class="l-h-50 p-r-15 r">
-      <el-button
-        size="small"
-        :type="mqttState === true ? 'success' : 'danger'"
-        :icon="
-          mqttState === true
-            ? 'iconfont icon-yaokong2'
-            : 'iconfont icon-yaokong2-copy'
-        "
-        circle
-        @click="
+      <el-button size="small" :type="mqttState === true ? 'success' : 'danger'" :icon="mqttState === true
+        ? 'iconfont icon-yaokong2'
+        : 'iconfont icon-yaokong2-copy'
+        " circle @click="
           mqttState === true
             ? $message.success('指令服务器链接正常')
             : $message.error('未链接到指令服务器')
-        "
-      ></el-button>
+          "></el-button>
     </div>
   </div>
 </template>
@@ -161,7 +126,9 @@ export default {
       shop_id: this.$store.state.user.shop_id, // 商铺id(默认为本店) 过滤条件
       drawer: false,
       getQuestInterval: null, // 用于销毁时间轴
-      animationTrumpet: true // 喇叭动画
+      animationTrumpet: true, // 喇叭动画
+      currentLang: 'zh-CN',
+      languagePopoverVisible: false // 控制语言弹出框可见
     }
   },
   components: {
@@ -266,9 +233,9 @@ export default {
     orderIcon () {
       if (
         this.pendingCount +
-          this.processingCount +
-          this.shippedCount +
-          this.requestedCount ===
+        this.processingCount +
+        this.shippedCount +
+        this.requestedCount ===
         0
       ) {
         return 'iconfont icon-meiyoudingdan-01'
@@ -292,7 +259,7 @@ export default {
     /**
      * @description: 计算订单数量 订单变化播放声音 显示在图标右上角小红圈内
      */
-    computeQuestList () {},
+    computeQuestList () { },
     /**
      * @description: 刷新当前页面
      */
@@ -304,6 +271,7 @@ export default {
       this.$store.dispatch('fetchAdminList') // 获取管理员列表
       this.$store.dispatch('fetchSiteList') // 获取站点列表
       this.$store.dispatch('fetchRouteList') // 获取航线列表
+      this.$store.dispatch('fetchNoflyData', this.$store.state.user.shop_id)// 获取禁飞区数据 注意这里要有shopid  总管理员再操作其他商铺飞机时 要刷新此缓存 需要对应商铺的禁飞区数据
       this.$store.dispatch('fetchCategoryList') // 获取分类列表（小程序）
       this.$store.dispatch('fetchPaidOrderList') // 获取订单列表
       this.$store.dispatch('fetchMessageList')// 获取管理员公告列表 并弹出公告框
@@ -315,6 +283,21 @@ export default {
       this.$store
         .dispatch('user/destroyUserAsync')
         .then(this.$router.push('/login'))
+    },
+    handleCommand (command) {
+      if (command === 'go-setting') {
+        this.$router.push('/home/set')
+      } else if (command === 'logout') {
+        this.logout()
+      }
+    },
+    changeLang (lang) {
+      this.currentLang = lang
+      // 如果用 vue-i18n：
+      // this.$i18n.locale = lang;
+      localStorage.setItem('lang', lang)
+      this.$message.success(`语言切换为：${lang === 'zh-CN' ? '简体中文' : lang}`)
+      this.languagePopoverVisible = false // 切换后关闭子菜单
     }
   },
   watch: {
@@ -346,7 +329,7 @@ export default {
       }
     }
   },
-  created () {}
+  created () { }
 }
 </script>
 
diff --git a/src/views/layout/components/main/home/set.vue b/src/views/layout/components/main/home/set.vue
new file mode 100644
index 0000000..4edb614
--- /dev/null
+++ b/src/views/layout/components/main/home/set.vue
@@ -0,0 +1,76 @@
+<template>
+  <div class="h-100">
+    <map-box ref="mapbox"/>
+  </div>
+</template>
+
+<script>
+import MapBox from '@/components/MapBox'
+
+export default {
+  name: 'Home',
+  data () {
+    return {
+    }
+  },
+  components: {
+    MapBox
+  },
+  computed: {
+    airList () {
+      return this.$store.state.airList
+    },
+    /**
+     * @description: 侧边栏显隐
+     */
+    isCollapse () {
+      return this.$store.state.app.isCollapse
+    }
+  },
+  methods: {
+    /**
+     * @description: 创建飞机图标
+     */
+    makePlanes (planes) {
+      this.$refs.mapbox.removePlanes()// 先清除画布上现有的飞机
+      planes.forEach((plane, index) => { // 创建所有飞机
+        let planeDefaultLonLat
+        if (localStorage.getItem(plane.name) !== null) { // 从本地缓存 拿飞机得初始位置
+          planeDefaultLonLat = JSON.parse(localStorage.getItem(plane.name))
+          plane.lon = planeDefaultLonLat.lon
+          plane.lat = planeDefaultLonLat.lat
+        } else {
+          plane.lon = 0
+          plane.lat = 0
+        }
+        this.$refs.mapbox.makePlane(plane, index)
+      })
+    }
+  },
+  mounted () {
+    if (this.airList.length > 0) {
+      this.makePlanes(this.airList)// 创建飞机图标
+    }
+  },
+  watch: {
+    /**
+     * @description: 飞机列表更新时候 更新地图
+     */
+    airList: {
+      handler (val) {
+        this.makePlanes(val)
+      }
+    },
+    /**
+     * @description: 侧边栏显隐
+     */
+    isCollapse () {
+      return this.$store.state.app.isCollapse
+    }
+  },
+  destroyed () {
+  }
+}
+</script>
+
+<style></style>