一些配置

wanshenmean

2026-03-24 d01295c254063b3349a86a4474e04a62b284bd19

 Code/WCS/WIDESEAWCS_Client/src/views/Index.vue

@@ -59,25 +59,25 @@
            <span style="display: none">{{ navIndex }}</span>
          </el-tab-pane>
        </el-tabs>
        <!-- 鍙抽敭鑿滃崟 -->
        <!-- 右键菜单 -->
        <div v-show="contextMenuVisible">
          <ul :style="{ left: menuLeft + 'px', top: menuTop + 'px' }" class="contextMenu">
            <li v-show="visibleItem.all">
              <el-button link @click="closeTabs()">
                <i class="el-icon-close"></i>
                {{
                  navigation.length == 2 ? "鍏抽棴鑿滃崟" : "鍏抽棴鎵€鏈?
                  navigation.length == 2 ? "关闭菜单" : "关闭所有"
                }}</el-button>
            </li>
            <li v-show="visibleItem.left">
              <el-button link @click="closeTabs('left')"><i class="el-icon-back"></i>鍏抽棴宸﹁竟</el-button>
              <el-button link @click="closeTabs('left')"><i class="el-icon-back"></i>关闭左边</el-button>
            </li>
            <li v-show="visibleItem.right">
              <el-button link @click="closeTabs('right')">
                <i class="el-icon-right"></i>鍏抽棴鍙宠竟</el-button>
                <i class="el-icon-right"></i>关闭右边</el-button>
            </li>
            <li v-show="visibleItem.other">
              <el-button link @click="closeTabs('other')"><i class="el-icon-right"></i>鍏抽棴鍏朵粬
              <el-button link @click="closeTabs('other')"><i class="el-icon-right"></i>关闭其他
              </el-button>
            </li>
          </ul>
@@ -96,7 +96,7 @@
        </el-scrollbar>
      </div>
    </div>
    <el-drawer title="閫夋嫨涓婚" v-model="drawer_model" direction="rtl" destroy-on-close>
    <el-drawer title="选择主题" v-model="drawer_model" direction="rtl" destroy-on-close>
      <div class="theme-selector">
        <div @click="changeTheme(item.name)" class="item" v-for="(item, index) in theme_color" :key="index"
          :style="{ background: item.color }">
@@ -107,7 +107,7 @@
      </div>
    </el-drawer>

    <el-drawer title="娑堟伅鍒楄〃" v-model="messageModel" direction="rtl" destroy-on-close>
    <el-drawer title="消息列表" v-model="messageModel" direction="rtl" destroy-on-close>
      <Message :list="messageList"></Message>
    </el-drawer>
  </div>
@@ -151,14 +151,14 @@
      otherTabs: true,
      menuLeft: 0,
      menuTop: 0,
      //  contextMenuVisible: false, // 鍙抽敭鍏抽棴鏄?闅?
      //  contextMenuVisible: false, // 右键关闭是否可见
    };
  },
  setup(props, context) {
    // 鑾峰彇鍏ㄥ眬灞炴€у拰鏂规硶
    // 获取全局属性和方法
    const { proxy } = getCurrentInstance();

    // 鑿滃崟瀵艰埅榛樿瀹藉害
    // 菜单导航默认宽度
    const menuWidth = ref(200);
    const contextMenuVisible = ref(false);
    const isCollapse = ref(false);
@@ -178,23 +178,23 @@
    ]);
    const links = ref([
      // {
      //   text: "妗嗘灦瑙嗛",
      //   text: "框架视频教程",
      //   path: "https://www.cctalk.com/m/group/90268531",
      //   id: -3,
      // },
      // { text: "澶у睆鏁版嵁", path: "/bigdata", id: -3 },
      // { text: "大数据", path: "/bigdata", id: -3 },
      // {
      //   text: "妗嗘灦鏂囨。",
      //   text: "框架文档",
      //   path: "http://v2.volcore.xyz/document/guide",
      //   id: -2,
      // },   {
      //   text: "妗嗘灦浼佷笟鐗?,
      //   text: "框架产品",
      //   path: "http://pro.volcore.xyz/",
      //   id: 10,
      // },
      { text: "涓汉涓績", path: "/UserInfo", id: -1, icon: "el-icon-s-custom" },
      { text: "个人信息", path: "/UserInfo", id: -1, icon: "el-icon-s-custom" },
      {
        text: "瀹夊叏閫€鍑?,
        text: "安全退出",
        path: "/login",
        id: -4,
        icon: "el-icon-switch-button",
@@ -204,9 +204,9 @@
      'this.src="' + errorImgSrc + '"'
    );
    const selectId = ref("1");
    // 銆愰椤点€戞爣绛惧簭鍙?褰撳墠鍙抽敭閫変腑鐨勮彍鍗?
    // 【首页】标签序号(当前右键选中的菜单)
    const selectMenuIndex = ref("0");
    //2022.05.29澧炲姞tab閫夐」涓庤彍鍗曡仈鍔ㄥ姛鑳?
    //2022.05.29增加tab选项与菜单联动功能
    const currentMenuId = ref(0);
    const userName = ref("--");
    const userInfo = ref({});
@@ -218,7 +218,7 @@
    });
    const userImg = ref("");
    const navigation = reactive([
      { orderNo: "0", id: "1", name: "棣栭〉", path: "/home" },
      { orderNo: "0", id: "1", name: "首页", path: "/home" },
    ]);
    const logo = ref(imgUrl);
    const theme = ref("blue2");
@@ -231,7 +231,7 @@
      isCollapse.value = !isCollapse.value;
      menuWidth.value = isCollapse.value ? 63 : 200;
    };
    //2021.08.28寮€鏀炬墜鍔ㄦ姌鍙犺彍鍗曟柟娉?
    //2021.08.28开放手动折叠菜单方法
    _config.menu = {
      show() {
        toggleLeft();
@@ -247,14 +247,14 @@
      localStorage.setItem("vol3_theme", name);
    };
    const to = (item) => {
      /* 2020.07.31澧炲姞鎵嬪姩鎵撳紑tabs*/
      /* 2020.07.31增加手动打开tabs*/
      if (item.path.indexOf("http") != -1) {
        window.open(item.path);
        return;
      }
      if (typeof item == "string" || item.path == "/login") {
        if (item == "/login" || item.path == "/login") {
          //纭鏄惁閫€鍑?
          //确认是否退出
          store.commit("clearUserInfo", "");
          window.location.href = "/";
          return;
@@ -266,59 +266,59 @@
      open(item);
    };
    const open = (item, useRoute) => {
      /* 2020.07.31澧炲姞鎵嬪姩鎵撳紑tabs*/
      /* 2020.07.31增加手动打开tabs*/
      let _index = navigation.findIndex((x) => {
        return x.path == item.path;
      });
      if (_index == -1) {
        navigation.push({
          //  orderNo: String(navigation.length),// 搴忓彿
          //  orderNo: String(navigation.length),// 序号
          id: item.id + "",
          name: item.name || item.text || "鏃犳爣棰?,
          name: item.name || item.text || "无标签",
          path: item.path,
          query: item.query, //2021.03.20淇鑷畾涔変簩娆℃墦寮€$tabs鏃跺弬鏁颁涪澶辩殑闂
          query: item.query, //2021.03.20修复自定义二次打开$tabs时参数丢失的问题
        });
        //鏂版墦寮€鐨則ab绉昏嚦鏈€鍚庝竴涓€夐」
        //新建打开的tab选中到最后一个选项
        selectId.value = navigation.length - 1 + "";
      } else {
        selectId.value = _index + "";
      }
      if (useRoute === undefined) {
        //闈炴爣鍑嗚彍鍗曪紝璁板綍鏈€鍚庝竴娆¤烦杞殑椤甸潰锛岀敤浜庡埛鏂?
        //非标准菜单，记录最后一次跳转的页面，用于刷新
        setItem(item);
        router.push(item);
        // this.$router.push(item);
      }
      currentMenuId.value = item.id * 1;
      // tab鑿滃崟缁戝畾鍙抽敭浜嬩欢
      // tab右键菜单绑定点击事件
      proxy.$nextTick(function (e) {
        proxy.bindRightClickMenu(true);
      });
    };
    const close = (path) => {
      /* 2020.07.31澧炲姞鎵嬪姩鎵撳紑tabs*/
      /* 2020.07.31增加手动打开tabs*/
      let index = navigation.findIndex((x) => {
        return x.path == path;
      });
      if (index == -1) {
        return _config.$Message.error("鏈壘鍒拌彍鍗?);
        return _config.$Message.error("未找到菜单");
      }
      removeNav(index);
    };
    const setItem = (item) => {
      /* 2020.07.31澧炲姞鎵嬪姩鎵撳紑tabs*/
      /* 2020.07.31增加手动打开tabs*/
      localStorage.setItem(
        window.location.origin + "_tabs",
        JSON.stringify(item)
      );
    };
    const getItem = () => {
      /* 2020.07.31澧炲姞鎵嬪姩鎵撳紑tabs*/
      /* 2020.07.31增加手动打开tabs*/
      let nav = localStorage.getItem(window.location.origin + "_tabs");
      return nav ? JSON.parse(nav) : null;
    };
    const selectNav = (item) => {
      //鍗囩骇element姝ｅ紡鐗堜慨鏀?
      //升级element正式版修改
      selectId.value = item.props.name;
      let _path = navigation[item.index].path;
      currentMenuId.value = (
@@ -335,13 +335,13 @@

    const removeNav = (_index) => {
      return new Promise(() => {
        //鍏抽棴鐨勫綋鍓嶉」,璺宠浆鍒板墠涓€涓〉闈?
        //关闭的当前项,跳转到前一个页面
        if (selectId.value == _index + "") {
          console.log(navigation[_index - 1]);
          setItem(navigation[_index - 1]);
          router.push({
            path: navigation[_index - 1].path,
            //2022.06.27淇tabs浜屾鍒囨崲鍚庡弬鏁颁涪澶辩殑闂
            //2022.06.27修复tabs二次切换后参数丢失的问题
            query: navigation[_index - 1].query,
          });
          navigation.splice(_index, 1);
@@ -366,28 +366,28 @@
      });
    };
    const onSelect = (treeId) => {
      /* 2020.07.31澧炲姞鎵嬪姩鎵撳紑tabs*/
      /* 2020.07.31增加手动打开tabs*/
      var item = getSelectMenuName(treeId);
      open(item, false);
    };

    /**
     * 鏄剧ず鍙抽敭鑿滃崟
     * @param {*} e 浜嬩欢瀵硅薄
     * 显示右键菜单
     * @param {*} e 事件对象
     */
    const openTabsMenu = function (e) {
      e.preventDefault(); // 闃叉榛樿鑿滃崟寮瑰嚭
      e.preventDefault(); // 防止默认菜单弹出
      let tabId = e.target.id.split("-")[1] * 1;

      //璁板綍褰撳墠閫変腑鐨勮彍鍗昳ndex
      //记录当前选中的菜单index
      selectMenuIndex.value =
        document.getElementById("pane-" + tabId).children[0].textContent * 1;
      //鍙湁棣栭〉鏃朵笉鏄剧ず
      //只有首页时不显示
      if (navigation.length == 1) {
        return;
      }

      //棣栭〉璁剧疆鏄剧ず鍏抽棴鍙宠竟鑿滃崟
      //首页设置显示关闭右边菜单
      if (!selectMenuIndex.value) {
        visibleItem.all = false;
        visibleItem.right = true;
@@ -395,22 +395,22 @@
        visibleItem.other = false;
      } else {
        visibleItem.all = true;
        //涓嶆槸鏈€鍚庝竴涓樉绀哄叧闂彸杈硅彍鍗?
        //不是最后一个显示关闭右边菜单
        visibleItem.right = selectMenuIndex.value != navigation.length - 1;
        //鍙湁涓や釜鑿滃崟鏃朵笉鏄剧ず鍏抽棴宸﹁竟
        //只有两个菜单时不显示关闭左边
        visibleItem.left = navigation.length != 2;
        //鍙湁涓や釜鑿滃崟鏃朵笉鏄剧ず鍏抽棴鍏朵粬
        //只有两个菜单时不显示关闭其他菜单
        visibleItem.other = navigation.length != 2;
      }
      contextMenuVisible.value = true;
      // 璁剧疆鍙抽敭鑿滃崟鏄剧ず鐨勪綅缃?
      // 设置右键菜单显示的位置
      proxy.menuLeft =
        e.target.getBoundingClientRect().left - (isCollapse.value ? 63 : 198); //-e.target.clientWidth
      proxy.menuTop = 36;
    };

    /**
     * 鍏抽棴鍙抽敭鑿滃崟
     * 关闭右键菜单
     */
    const closeTabsMenu = () => {
      contextMenuVisible.value = false;
@@ -422,25 +422,25 @@
      });
    };
    /**
     * 鍏抽棴鍏跺畠鏍囩椤?
     * @param {*} par 鍏抽棴绫诲瀷(left,right,other)
     * 关闭其他标签页
     * @param {*} par 关闭类型(left,right,other)
     */
    const closeTabs = (value) => {
      let _menuId = navigation[selectId.value * 1].id;
      let currnetIndex = selectId.value * 1; // navigation.findIndex(c => { return c.id == selectId.value });
      switch (value) {
        case "left": {
          // 鍒犻櫎宸︿晶tab鏍囩
          navigation.splice(1, currnetIndex - 1); // 鍒犻櫎宸︿晶tab鏍囩
          // 删除左侧tab标签
          navigation.splice(1, currnetIndex - 1); // 删除左侧tab标签
          break;
        }
        case "right": {
          // 鍒犻櫎鍙充晶tab鏍囩
          // 删除右侧tab标签
          if (selectMenuIndex.value == 0) {
            navigation.splice(currnetIndex); // 鍒犻櫎鍙充晶tab鏍囩
            navigation.splice(currnetIndex); // 删除右侧tab标签
            toHome();
          } else {
            navigation.splice(currnetIndex + 1); // 鍒犻櫎鍙充晶tab鏍囩
            navigation.splice(currnetIndex + 1); // 删除右侧tab标签
            if (selectMenuIndex.value < currnetIndex) {
              navigation.splice(
                selectMenuIndex.value,
@@ -451,13 +451,13 @@
          break;
        }
        case "other": {
          // 鍒犻櫎鍏朵粬鎵€鏈塼ab鏍囩
          navigation.splice(currnetIndex + 1); // 鍒犻櫎鍙充晶tab鏍囩(杩欓噷蹇呴』鎸夌収鍙斥啋宸﹂『搴忓垹闄?
          navigation.splice(1, currnetIndex - 1); // 鍒犻櫎宸︿晶tab鏍囩
          // 删除其他所有tab标签
          navigation.splice(currnetIndex + 1); // 删除右侧tab标签(这里必须按照右→左顺序删除)
          navigation.splice(1, currnetIndex - 1); // 删除左侧tab标签
          break;
        }
        default: {
          //鍏抽棴鎵€鏈?
          //关闭所有标签
          navigation.splice(1, navigation.length);
          toHome();
          break;
@@ -473,7 +473,7 @@
    watch(
      () => contextMenuVisible.value,
      (newVal, oldVal) => {
        // 鐩戣
        // 监视 contextMenuVisible 的变化，添加或移除点击事件监听器
        if (newVal) {
          document.body.addEventListener("click", closeTabsMenu);
        } else {
@@ -483,7 +483,7 @@
    );

    /**
     * 绯荤粺鍒涘缓寮€濮?
     * 系统创建开始
     */
    /**
     * 方法目的：补齐后端菜单未配置时的新页面入口，避免新增页面无入口。
@@ -557,7 +557,7 @@

      http.get("api/Sys_Menu/getTreeMenu", {}, true).then((data) => {
        data = ensureBuiltinMenus(data);
        data.push({ id: "1", name: "棣栭〉", url: "/home" }); // 涓轰簡鑾峰彇閫変腑id浣跨敤
        data.push({ id: "1", name: "首页", url: "/home" }); // 为了获取选中id使用
        data.forEach((d) => {
          d.path = (d.url || "").replace("/Manager", "");
          d.to = (d.url || "").replace("/Manager", "");
@@ -569,7 +569,7 @@
        menuOptions.value = data;
        permissionInited.value = true;

        //寮€鍚秷鎭帹閫侊紙main.js涓缃槸鍚﹀紑鍚痵ignalR锛?022.05.05
         //开启消息推送（main.js中设置是否开启signalR）2022.05.05
        if (_config.$global.signalR) {
          MessageConfig(http, (result) => {
            messageList.unshift(result);
@@ -577,18 +577,18 @@
          });
        }

        //褰撳墠鍒锋柊鏄笉鏄椤?
        //当前刷新是不是首页
        if (router.currentRoute.value.path != navigation[0].path) {
          //鏌ユ壘绯荤粺鑿滃崟
          //查找系统菜单
          let item = menuOptions.value.find((x) => {
            return x.path == router.currentRoute.value.path; //this.$route.path;
          });
          if (item) return onSelect(item.id);
          //鏌ユ壘椤堕儴蹇嵎杩炴帴
          //查找顶部快捷连接
          item = links.value.find((x) => {
            return x.path == router.currentRoute.value.path; //this.$route.path;
          });
          //鏌ユ壘鏈€鍚庝竴娆¤烦杞殑椤甸潰
          //查找最后访问的页面
          if (!item) {
            item = getItem();
          }
@@ -635,7 +635,7 @@
    };
  },
  /**
   * 鎸傝浇閽╁瓙鍑芥暟
   * 挂载完成后执行的函数
   */
  mounted() {
    let _date = showTime();
@@ -650,14 +650,14 @@

  methods: {
    /**
     * 缁戝畾鍙抽敭浜嬩欢
     * @param {*} enable 鏄惁鍚敤鍙抽敭浜嬩欢[true:鍚敤;false:绂佺敤;]
     * @param {*} $event 浜嬩欢
     * 绑定右键菜单事件
     * @param {*} enable 是否启用右键菜单事件[true:启用;false:禁用;]
     * @param {*} $event 事件对象
     */
    bindRightClickMenu(enable) {
      if (!enable) return;
      let that = this;
      // 浣跨敤鍘熺敓js 涓哄崟涓猟om缁戝畾榧犳爣鍙冲嚮浜嬩欢
      // 使用原生js 为单个dom绑定鼠标右击事件
      that.$nextTick(() => {
        let tab_top_dom = Object.assign(
          [],
@@ -671,7 +671,7 @@
  },

  /**
   * 閿€姣侀挬瀛愬嚱鏁?
   * 销毁钩子函数
   */
  destroyed() {
    $this = null;
@@ -679,13 +679,13 @@
  },
});
const week = new Array(
  "鏄熸湡涓€",
  "鏄熸湡浜?,
  "鏄熸湡涓?,
  "鏄熸湡鍥?,
  "鏄熸湡浜?,
  "鏄熸湡鍏?,
  "鏄熸湡鏃?
  "星期一",
  "星期二",
  "星期三",
  "星期四",
  "星期五",
  "星期六",
  "星期日"
);
function showTime() {
  let date = new Date();
@@ -701,7 +701,7 @@
    "." +
    (month < 10 ? "0" + month : month) +
    "." +
    (day < 10 ? "0" + day : day) + //202.08.08淇鏃ユ湡澶╂暟灏忎簬10鏃舵坊鍔?
    (day < 10 ? "0" + day : day) + //202.08.08修复日期天数小于10时添加0
    "" +
    " " +
    (hour < 10 ? "0" + hour : hour) +
@@ -709,7 +709,7 @@
    (minutes < 10 ? "0" + minutes : minutes) +
    ":" +
    (second < 10 ? "0" + second : second) +
    " " + //2020.08.30淇棣栭〉鏃ユ湡鏄熸湡澶╀笉鏄剧ず鐨勯棶棰?
    " " + //2020.08.30修复首页日期星期天不显示的问题
    (week[date.getDay() - 1] || week[6])
  );
}