增加最近的标签页

ruoyi-ui/src/layout/index.vue

@@ -274,8 +274,6 @@ export default {
     },
   },
   created() {
-    console.log(this.titleHeader, "this.titleHeader");
-    console.log(this.$route.path, "路由");
     if (this.$route.path == "/tunnel") {
       if (
         this.sideTheme == "theme-blue" ||

ruoyi-ui/src/router/routerCreater.js

@@ -34,7 +34,7 @@ function processNode(node) {
       path: item.path || "",
       title: item.title,
       name: item.name,
-      meta: { menuId : prev + "_" + ids.join("-") }
+      meta: { menuId : prev + "_" + ids.join("-"), title : item.title}
     };
 
     if (item.redirect) {

ruoyi-ui/src/store/index.js

@@ -9,6 +9,7 @@ import settings from './modules/settings'
 import wsData from './modules/wsData'
 import getters from './getters'
 import manage from './modules/manage'
+import menu from './modules/menu'
 
 Vue.use(Vuex)
 
@@ -21,7 +22,8 @@ const store = new Vuex.Store({
     permission,
     settings,
     wsData,
-    manage
+    manage,
+    menu,
   },
   getters
 })

ruoyi-ui/src/store/modules/menu.js

@@ -0,0 +1,22 @@
+const state = {
+  recentPages: []
+  }
+  
+  const mutations = {
+
+    addRecent(state, item) {
+      if (state.recentPages.find(unit => unit.path == item.path)) return;
+      state.recentPages.push(item);
+    },
+    removeRecent(state, item) {
+      let i = state.recentPages.findIndex(unit => unit.path == item.path);
+      state.recentPages.splice(i, 1);
+    }
+
+  }
+  
+  export default {
+    namespaced: true,
+    state,
+    mutations,
+  }

ruoyi-ui/src/views/JiHeExpressway/common/PresetFormItems.js

@@ -132,11 +132,12 @@ export const startStation = {
           },
         },
         key: "startStakeMark[0]",
+        default:55,
         rules: [
           {
             message: "请补全桩号",
             callback(value, data) {
-              if (!value?.trim() && data.startStakeMark[1]?.trim()) return false
+              if (!((value+'')?.trim() && data.startStakeMark[1]?.trim())) return false
               else return true
             }
           }
@@ -149,6 +150,7 @@ export const startStation = {
             color: "#3DE8FF",
           },
         },
+        default: 378,
         key: "startStakeMark[1]"
       },
     ],
@@ -170,11 +172,12 @@ export const endStation = {
           },
         },
         key: "endStakeMark[0]",
+        default: 208,
         rules: [
           {
             message: "请补全桩号",
             callback(value, data) {
-              if (!value?.trim() && data.endStakeMark[1]?.trim()) return false
+              if (!((value + '')?.trim() && data.endStakeMark[1]?.trim())) return false
               else return true
             }
           }
@@ -187,6 +190,7 @@ export const endStation = {
             color: "#3DE8FF",
           },
         },
+        default: 153,
         key: "endStakeMark[1]",
       },
     ],

ruoyi-ui/src/views/JiHeExpressway/components/FormConfig/index.vue

@@ -228,7 +228,6 @@ export default {
          * @type {{ callback?: (value: any) => boolean; type?: "phone"; message: string; }[]}
          */
         const rules = item.rules || [];
-
         for (let index = 0; index < rules.length; index++) {
           const rule = rules[index];
           // 返回值 true 通过 false 异常

ruoyi-ui/src/views/JiHeExpressway/components/HeaderMenu/CustomMenu.vue

@@ -79,6 +79,7 @@ export default {
         }
       }
       this.$emit("onChange", node, key);
+      console.log(node , "菜单点击++========");
     }
   }
 };

ruoyi-ui/src/views/JiHeExpressway/components/HeaderMenu/index.vue

@@ -1,28 +1,29 @@
 <template>
-  <nav class="header">
-    <Clock class="time"></Clock>
-    <!-- 左侧菜单 -->
-    <CustomMenu :menuData="menuLeft" @onChange="onChange" prefix="l" :activeIndex="activeIndex" class="leftMenu">
-    </CustomMenu>
-    <!-- 中间标题 -->
-    <div class="vis-title">
-      <img class="logo-img" src="../../images/logo.png" />
-      <img class="title-img" src="../../images/title.png" />
+  <div class="header">
+    <div class="headerNavi">
+      <Clock class="time"></Clock>
+      <!-- 左侧菜单 -->
+      <CustomMenu :menuData="menuLeft" @onChange="onChange" prefix="l" :activeIndex="activeIndex" class="leftMenu">
+      </CustomMenu>
+      <!-- 中间标题 -->
+      <div class="vis-title">
+        <img class="logo-img" src="../../images/logo.png" />
+        <img class="title-img" src="../../images/title.png" />
+      </div>
+      <!-- 右侧菜单 -->
+      <CustomMenu :menuData="menuRight" @onChange="onChange" prefix="r" :activeIndex="activeIndex" class="rightMenu">
+      </CustomMenu>
+      <UserArea class="topButton"></UserArea>
     </div>
-    <!-- 右侧菜单 -->
-    <CustomMenu :menuData="menuRight" @onChange="onChange" prefix="r" :activeIndex="activeIndex" class="rightMenu">
-    </CustomMenu>
-    <UserArea class="topButton"></UserArea>
-  </nav>
+    <RecentPages class="recent"></RecentPages>
+  </div>
 </template>
 <script>
 import menuData from "@/common/menuData";
 import CustomMenu from "./CustomMenu.vue";
 import Clock from "./Clock.vue";
 import UserArea from './UserArea.vue'
-/**
- *
- */
+import RecentPages from "../RecentPages/index.vue";
 
 export default {
   name: "HeaderMenu",
@@ -36,7 +37,8 @@ export default {
   components: {
     CustomMenu,
     Clock,
-    UserArea
+    UserArea,
+    RecentPages
   },
   emit: ["change"],
   created() {
@@ -66,97 +68,102 @@ export default {
 };
 </script>
 <style lang="less" scoped>
-.header {
-  display: flex;
-  //   justify-content: space-between;
-  align-items: center;
-  background: url("../../images/header-bg.png") no-repeat;
-  background-size: 100% 100%;
-
-  .time {
-    width: 120px;
-    margin-right: 20px;
-  }
-
-
-
-  .vis-title {
-    flex: 1;
-    width: 0;
+.header{
+  .headerNavi { height: 68px;
     display: flex;
-    justify-content: center;
+    //   justify-content: space-between;
     align-items: center;
+    background: url("../../images/header-bg.png") no-repeat;
+    background-size: 100% 100%;
 
-    .logo-img {
-      display: inline-block;
-      //   margin-left: 100px;
-      width: 48px;
-      height: 37px;
+    .time {
+      width: 120px;
+      margin-right: 20px;
     }
 
-    .title-img {
-      display: inline-block;
-      margin-left: 10px;
-      width: 373px;
-      height: 28px;
-    }
-  }
 
-  .leftMenu {
-    width: 560px;
-  }
 
-  .rightMenu {
-    width: 500px;
-  }
+    .vis-title {
+      flex: 1;
+      width: 0;
+      display: flex;
+      justify-content: center;
+      align-items: center;
 
-  .topButton{
-    width: 180px;
-  }
+      .logo-img {
+        display: inline-block;
+        //   margin-left: 100px;
+        width: 48px;
+        height: 37px;
+      }
 
-  .user {
-    width: 200px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-size: 14px;
-    font-weight: normal;
-    color: #fff;
-    line-height: 16px;
-
-    .name {
-      display: inline-block;
-      margin: 0 10px;
+      .title-img {
+        display: inline-block;
+        margin-left: 10px;
+        width: 373px;
+        height: 28px;
+      }
     }
 
-    .icon {
-      display: inline-block;
-      margin: 0 13px;
+    .leftMenu {
+      width: 560px;
     }
 
-    .icon-001 {
-      display: inline-block;
-      width: 12px;
-      height: 14px;
+    .rightMenu {
+      width: 500px;
     }
 
-    .icon-002 {
-      display: inline-block;
-      width: 9px;
-      height: 5px;
+    .topButton{
+      width: 180px;
     }
 
-    .icon-003 {
-      display: inline-block;
-      width: 18px;
-      height: 16px;
-    }
+    .user {
+      width: 200px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 14px;
+      font-weight: normal;
+      color: #fff;
+      line-height: 16px;
+
+      .name {
+        display: inline-block;
+        margin: 0 10px;
+      }
+
+      .icon {
+        display: inline-block;
+        margin: 0 13px;
+      }
+
+      .icon-001 {
+        display: inline-block;
+        width: 12px;
+        height: 14px;
+      }
 
-    .icon-004 {
-      display: inline-block;
-      width: 15px;
-      height: 15px;
+      .icon-002 {
+        display: inline-block;
+        width: 9px;
+        height: 5px;
+      }
+
+      .icon-003 {
+        display: inline-block;
+        width: 18px;
+        height: 16px;
+      }
+
+      .icon-004 {
+        display: inline-block;
+        width: 15px;
+        height: 15px;
+      }
     }
   }
+  .recent{
+    height: 32px;
+  }
 }
 </style>

ruoyi-ui/src/views/JiHeExpressway/components/RecentPages/index.vue

@@ -0,0 +1,89 @@
+<template>
+<div class="recent_pages">
+    <h4>最近使用:</h4>
+    <div class="history_buttons">
+        <div class="unit" :class="isActive(item) ? 'active' : ''" v-for="item in recentPages">
+            <p class="btn_main" @click="onClickItem(item)" :key="item.path">{{
+                item.title
+            }}</p>
+            <p class="btn_close" @click="onRemoveItem(item)">x</p>
+        </div>
+    </div>
+</div>
+</template>
+<script>
+import { mapMutations, mapState } from 'vuex';
+export default{
+    data(){
+        return {}
+    },
+    computed:{
+        ...mapState("menu", ["recentPages"])
+    },
+    watch:{
+        $route:{
+            handler(newV){
+                this.addRecent({
+                    title : newV.meta.title,
+                    path : newV.path
+                });
+            },
+            immediate : true
+        }
+    },
+    methods:{
+        ...mapMutations("menu", ["addRecent","removeRecent"]),
+        onClickItem(item){
+            this.$route.path != item.path && this.$router.push(item.path);
+        },
+        onRemoveItem(item){
+            this.removeRecent(item);
+            if(this.$route.path == item.path){
+                if(this.recentPages.length){
+                    this.$router.push(this.recentPages[this.recentPages.length-1].path)
+                }else{
+                    this.$router.push("/")
+                }
+            }
+        },
+        isActive(item) {
+            return this.$route.path == item.path;
+        }
+    }
+}
+</script>
+<style lang="scss" scoped>
+.recent_pages{ 
+    display: flex; flex-direction: row; align-items:stretch;
+    h4{ width: 100px; height: 32px; line-height: 32px; text-align: center; margin: 0; padding: 0; font-weight: bold;}
+    .history_buttons {
+        flex: 1;
+        display: flex;
+        flex-direction: row;
+        .unit {
+            cursor: default; margin-right: 3px;
+            position: relative;
+            height: 30px;
+            background-color: #048;
+
+            &.active {
+            background-color: #09C;
+            color: #FFF;
+            }
+
+            .btn_main {
+            height: 30px;
+            line-height: 30px;
+            padding: 0 12px
+            }
+
+            .btn_close {
+            background-color: #C00;
+            position: absolute;
+            right: 0;
+            top: 0;
+            }
+        }
+    }
+}
+</style>

ruoyi-ui/src/views/JiHeExpressway/components/empty.vue

@@ -19,7 +19,6 @@ export default {
     }
   },
   mounted() {
-    console.log(this.$route)
   }
 }
 </script>

ruoyi-ui/src/views/JiHeExpressway/index.vue

@@ -12,24 +12,23 @@
 <script>
 import HeaderMenu from "./components/HeaderMenu/index.vue";
 import Adaptation from "./components/Adaptation.vue";
-
 import getBoardBaseData from '@/common/getBoardBaseData'
 
 export default {
   name: "ji_ze_gao_su",
   components: {
     HeaderMenu,
-    Adaptation
+    Adaptation,
     // ...modules
   },
   data() {
     return {
       isShowContent:false,
-      headerHeight:68,
+      headerHeight:100,
       header: {
         scale: 1,
         originW: 1920,
-        originH: 68
+        originH: 100 //打开最近标签页时高100，不开启时高68
       },
     };
   },

ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeFilter/index.vue

@@ -96,7 +96,7 @@ export default {
         delete data.startStakeMark;
       if (!data.endStakeMark[0] || !data.endStakeMark[1])
         delete data.endStakeMark;
-      this.activeIcon = null;
+      // this.activeIcon = null;
       this.filterEnd(data);
     },
     async getDeviceTypeOptions() {

ruoyi-ui/src/views/JiHeExpressway/pages/developing.vue

@@ -11,7 +11,6 @@ export default {
   components: {
   },
   mounted() {
-    console.log(this.$route)
   }
 }
 </script>

ruoyi-ui/src/views/event/event/dispatchYuan.vue

@@ -711,8 +711,6 @@ export default {
     },
     deviceStatusChangeLog(event) {
       // console.log(event, "websockt工作台接收感知事件数据");
-      console.log(event, "已执行");
-      console.log(this.$route.query.id, "this.$route.query.id");
       for (let item of event) {
         if (this.$route.query.id == item.eventId) {
           this.zxList.unshift(item);
@@ -721,7 +719,6 @@ export default {
     },
   },
   async created() {
-    console.log(this.$route.query.id, "this.$route.query.id");
 
     await this.getEqTypeStateIcon();
     // await this.getTunnelData();

ruoyi-ui/vue.config.js

@@ -53,7 +53,7 @@ module.exports = {
         // target: `http://10.168.69.255:8087`, //正晨后台 连现场物联 刘文阁
         // target: `http://10.168.78.135:8087`,  //王钦
         // target: `http://10.168.66.196:8087`, //正晨后台 连现场物联 刘文阁2
-        target: `http://10.168.68.42:8087`, //王思祥
+        target: `http://10.168.68.42:8087`, //王思祥 
         changeOrigin: true,
         pathRewrite: {
           ["^" + process.env.VUE_APP_BASE_API]: "",