From e46aa927d231af83724683c7286d9db503e24cf7 Mon Sep 17 00:00:00 2001
From: z8018 <1282578289@qq.com>
Date: 星期二, 10 六月 2025 11:46:20 +0800
Subject: [PATCH] 1
---
项目代码/WCS/WIDESEAWCS_Client/src/views/Index.vue | 225 ++++++++++++++++++++++++++++++++++++--------------------
1 files changed, 144 insertions(+), 81 deletions(-)
diff --git "a/\351\241\271\347\233\256\344\273\243\347\240\201/WCS/WIDESEAWCS_Client/src/views/Index.vue" "b/\351\241\271\347\233\256\344\273\243\347\240\201/WCS/WIDESEAWCS_Client/src/views/Index.vue"
index e59ef4f..f269c58 100644
--- "a/\351\241\271\347\233\256\344\273\243\347\240\201/WCS/WIDESEAWCS_Client/src/views/Index.vue"
+++ "b/\351\241\271\347\233\256\344\273\243\347\240\201/WCS/WIDESEAWCS_Client/src/views/Index.vue"
@@ -7,8 +7,14 @@
</div>
<div class="vol-menu">
<el-scrollbar style="height: 100%">
- <VolMenu :currentMenuId="currentMenuId" :on-select="onSelect" :enable="true" :open-select="false"
- :isCollapse="isCollapse" :list="menuOptions"></VolMenu>
+ <VolMenu
+ :currentMenuId="currentMenuId"
+ :on-select="onSelect"
+ :enable="true"
+ :open-select="false"
+ :isCollapse="isCollapse"
+ :list="menuOptions"
+ ></VolMenu>
</el-scrollbar>
</div>
</div>
@@ -28,16 +34,20 @@
<span v-if="!item.icon"> {{ item.text }}</span>
<i v-else :class="item.icon"></i>
</a>
- </div> -->
+ </div>-->
</div>
<div class="header-info">
<div class="h-link">
- <a href="javascript:void(0)" @click="to(item)" v-for="(item, index) in links.filter((c) => {
+ <a
+ href="javascript:void(0)"
+ @click="to(item)"
+ v-for="(item, index) in links.filter((c) => {
return c.icon;
- })" :key="index">
- <span> {{ item.text }}</span>
+ })"
+ :key="index"
+ >
+ <span>{{ item.text }}</span>
</a>
-
</div>
<div>
<img class="user-header" :src="userImg" :onerror="errorImg" />
@@ -52,10 +62,23 @@
</div>
</div>
<div class="vol-path">
- <el-tabs @tab-click="selectNav" @tab-remove="removeNav" @contextmenu.prevent="bindRightClickMenu(false)"
- type="border-card" class="header-navigation" v-model="selectId" :strtch="false">
- <el-tab-pane v-for="(item, navIndex) in navigation" type="card" :name="navIndex + ''" :closable="navIndex > 0"
- :key="navIndex" :label="item.name">
+ <el-tabs
+ @tab-click="selectNav"
+ @tab-remove="removeNav"
+ @contextmenu.prevent="bindRightClickMenu(false)"
+ type="border-card"
+ class="header-navigation"
+ v-model="selectId"
+ :strtch="false"
+ >
+ <el-tab-pane
+ v-for="(item, navIndex) in navigation"
+ type="card"
+ :name="navIndex + ''"
+ :closable="navIndex > 0"
+ :key="navIndex"
+ :label="item.name"
+ >
<span style="display: none">{{ navIndex }}</span>
</el-tab-pane>
</el-tabs>
@@ -66,18 +89,23 @@
<el-button link @click="closeTabs()">
<i class="el-icon-close"></i>
{{
- navigation.length == 2 ? "鍏抽棴鑿滃崟" : "鍏抽棴鎵�鏈�"
- }}</el-button>
+ 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>
@@ -88,20 +116,36 @@
<loading v-show="$store.getters.isLoading()"></loading>
<router-view v-slot="{ Component }">
<keep-alive>
- <component :is="Component" :key="$route.name"
- v-if="!$route.meta || ($route.meta && !$route.meta.hasOwnProperty('keepAlive'))" />
+ <component
+ :is="Component"
+ :key="$route.name"
+ v-if="!$route.meta || ($route.meta && !$route.meta.hasOwnProperty('keepAlive'))"
+ />
</keep-alive>
- <component :is="Component" :key="$route.name" v-if="$route.meta && $route.meta.hasOwnProperty('keepAlive')" />
+ <component
+ :is="Component"
+ :key="$route.name"
+ v-if="$route.meta && $route.meta.hasOwnProperty('keepAlive')"
+ />
</router-view>
</el-scrollbar>
</div>
</div>
<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 }">
- <div v-show="item.leftColor" :style="{ background: item.leftColor }" style="height: 100%; width: 20px"
- class="t-left"></div>
+ <div
+ @click="changeTheme(item.name)"
+ class="item"
+ v-for="(item, index) in theme_color"
+ :key="index"
+ :style="{ background: item.color }"
+ >
+ <div
+ v-show="item.leftColor"
+ :style="{ background: item.leftColor }"
+ style="height: 100%; width: 20px"
+ class="t-left"
+ ></div>
<div class="t-right"></div>
</div>
</div>
@@ -120,7 +164,7 @@
import VolMenu from "@/components/basic/VolElementMenu.vue";
import Message from "./index/Message.vue";
import MessageConfig from "./index/MessageConfig.js";
-var imgUrl = require("@/assets/imgs/wms_x.png");
+var imgUrl = require("@/assets/imgs/wcs_logo.png");
var $this;
var $interval;
var $indexDate;
@@ -130,7 +174,7 @@
ref,
watch,
onMounted,
- getCurrentInstance,
+ getCurrentInstance
} from "vue";
import { useRouter, useRoute } from "vue-router";
import store from "../store/index";
@@ -139,7 +183,7 @@
components: {
VolMenu,
loading,
- Message,
+ Message
},
data() {
@@ -149,11 +193,13 @@
rightTabs: true,
otherTabs: true,
menuLeft: 0,
- menuTop: 0,
+ menuTop: 0
// contextMenuVisible: false, // 鍙抽敭鍏抽棴鏄�/闅�
};
},
setup(props, context) {
+ let client = ref(null);
+
// 鑾峰彇鍏ㄥ眬灞炴�у拰鏂规硶
const { proxy } = getCurrentInstance();
@@ -173,31 +219,22 @@
{ name: "orange2", color: "#ff9900", leftColor: "rgb(232 141 5)" },
{ name: "green", color: "rgb(25, 190, 107)" },
{ name: "green2", color: "rgb(25, 190, 107)", leftColor: "#019e4f" },
- { name: "white", color: "#fff" },
+ { name: "white", color: "#fff" }
]);
const links = ref([
- // {
- // text: "妗嗘灦瑙嗛",
- // path: "https://www.cctalk.com/m/group/90268531",
- // id: -3,
- // },
- // { text: "澶у睆鏁版嵁", path: "/bigdata", id: -3 },
- // {
- // text: "妗嗘灦鏂囨。",
- // path: "http://v2.volcore.xyz/document/guide",
- // id: -2,
- // }, {
- // text: "妗嗘灦浼佷笟鐗�",
- // path: "http://pro.volcore.xyz/",
- // id: 10,
- // },
+ {
+ text: "澶у睆鏁版嵁",
+ path: "/temppage",
+ id: -2,
+ icon: "el-icon-switch-button"
+ },
{ text: "涓汉涓績", path: "/UserInfo", id: -1, icon: "el-icon-s-custom" },
{
text: "瀹夊叏閫�鍑�",
path: "/login",
- id: -4,
- icon: "el-icon-switch-button",
- },
+ id: -1,
+ icon: "el-icon-switch-button"
+ }
]);
const errorImg = ref(
'this.src="' + require("@/assets/imgs/error-img.png") + '"'
@@ -213,11 +250,11 @@
left: false,
right: false,
all: false,
- other: false,
+ other: false
});
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");
@@ -237,15 +274,35 @@
},
hide() {
toggleLeft();
- },
+ }
};
- const changeTheme = (name) => {
+
+ const createSocket = url => {
+ // 鍒涘缓WebSocket杩炴帴
+ //"ws://127.0.0.1:9295/admin"
+ client = new WebSocket(url);
+
+ client.onopen = function() {
+ //client.onmessage = handleMessage;
+ store.commit("setWebsocket", client);
+ console.log("WebSocket 杩炴帴鎴愬姛");
+ };
+
+ client.onclose = function() {
+ console.log("WebSocket 杩炴帴鍏抽棴");
+ setTimeout(createSocket, 10000);
+ };
+
+ client.onerror = function() {};
+ };
+
+ const changeTheme = name => {
if (theme.value != name) {
theme.value = name;
}
localStorage.setItem("vol3_theme", name);
};
- const to = (item) => {
+ const to = item => {
/* 2020.07.31澧炲姞鎵嬪姩鎵撳紑tabs*/
if (item.path.indexOf("http") != -1) {
window.open(item.path);
@@ -266,7 +323,7 @@
};
const open = (item, useRoute) => {
/* 2020.07.31澧炲姞鎵嬪姩鎵撳紑tabs*/
- let _index = navigation.findIndex((x) => {
+ let _index = navigation.findIndex(x => {
return x.path == item.path;
});
if (_index == -1) {
@@ -275,7 +332,7 @@
id: item.id + "",
name: item.name || item.text || "鏃犳爣棰�",
path: item.path,
- query: item.query, //2021.03.20淇鑷畾涔変簩娆℃墦寮�$tabs鏃跺弬鏁颁涪澶辩殑闂
+ query: item.query //2021.03.20淇鑷畾涔変簩娆℃墦寮�$tabs鏃跺弬鏁颁涪澶辩殑闂
});
//鏂版墦寮�鐨則ab绉昏嚦鏈�鍚庝竴涓�夐」
selectId.value = navigation.length - 1 + "";
@@ -290,13 +347,13 @@
}
currentMenuId.value = item.id * 1;
// tab鑿滃崟缁戝畾鍙抽敭浜嬩欢
- proxy.$nextTick(function (e) {
+ proxy.$nextTick(function(e) {
proxy.bindRightClickMenu(true);
});
};
- const close = (path) => {
+ const close = path => {
/* 2020.07.31澧炲姞鎵嬪姩鎵撳紑tabs*/
- let index = navigation.findIndex((x) => {
+ let index = navigation.findIndex(x => {
return x.path == path;
});
if (index == -1) {
@@ -304,7 +361,7 @@
}
removeNav(index);
};
- const setItem = (item) => {
+ const setItem = item => {
/* 2020.07.31澧炲姞鎵嬪姩鎵撳紑tabs*/
localStorage.setItem(
window.location.origin + "_tabs",
@@ -316,23 +373,23 @@
let nav = localStorage.getItem(window.location.origin + "_tabs");
return nav ? JSON.parse(nav) : null;
};
- const selectNav = (item) => {
+ const selectNav = item => {
//鍗囩骇element姝ｅ紡鐗堜慨鏀�
selectId.value = item.props.name;
let _path = navigation[item.index].path;
currentMenuId.value = (
- menuOptions.value.find((c) => {
+ menuOptions.value.find(c => {
return c.path == _path;
}) || { id: 0 }
).id;
router.push({
path: navigation[item.index].path,
- query: navigation[item.index].query,
+ query: navigation[item.index].query
});
};
- const removeNav = (_index) => {
+ const removeNav = _index => {
return new Promise(() => {
//鍏抽棴鐨勫綋鍓嶉」,璺宠浆鍒板墠涓�涓〉闈�
if (selectId.value == _index + "") {
@@ -341,7 +398,7 @@
router.push({
path: navigation[_index - 1].path,
//2022.06.27淇tabs浜屾鍒囨崲鍚庡弬鏁颁涪澶辩殑闂
- query: navigation[_index - 1].query,
+ query: navigation[_index - 1].query
});
navigation.splice(_index, 1);
selectId.value = selectId.value - 1 + "";
@@ -352,19 +409,19 @@
}
navigation.splice(_index, 1);
currentMenuId.value = (
- menuOptions.value.find((c) => {
+ menuOptions.value.find(c => {
return c.path == navigation[selectId.value * 1].path;
}) || { id: 0 }
).id;
});
};
- const getSelectMenuName = (id) => {
- return menuOptions.value.find(function (x) {
+ const getSelectMenuName = id => {
+ return menuOptions.value.find(function(x) {
return x.id == id;
});
};
- const onSelect = (treeId) => {
+ const onSelect = treeId => {
/* 2020.07.31澧炲姞鎵嬪姩鎵撳紑tabs*/
var item = getSelectMenuName(treeId);
open(item, false);
@@ -374,7 +431,7 @@
* 鏄剧ず鍙抽敭鑿滃崟
* @param {*} e 浜嬩欢瀵硅薄
*/
- const openTabsMenu = function (e) {
+ const openTabsMenu = function(e) {
e.preventDefault(); // 闃叉榛樿鑿滃崟寮瑰嚭
let tabId = e.target.id.split("-")[1] * 1;
@@ -417,14 +474,14 @@
const toHome = () => {
open({
text: navigation[0].name,
- path: navigation[0].path,
+ path: navigation[0].path
});
};
/**
* 鍏抽棴鍏跺畠鏍囩椤�
* @param {*} par 鍏抽棴绫诲瀷(left,right,other)
*/
- const closeTabs = (value) => {
+ 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) {
@@ -463,7 +520,7 @@
}
}
selectId.value =
- navigation.findIndex((c) => {
+ navigation.findIndex(c => {
return c.id == _menuId;
}) + "";
closeTabsMenu();
@@ -499,9 +556,11 @@
}
Object.assign(_config.$tabs, { open: open, close: close });
- http.get("api/Sys_Menu/getTreeMenu", {}, true).then((data) => {
+ // createSocket(window.webConfig.webSocketUrl);
+
+ http.get("api/Sys_Menu/getTreeMenu", {}, true).then(data => {
data.push({ id: "1", name: "棣栭〉", url: "/home" }); // 涓轰簡鑾峰彇閫変腑id浣跨敤
- data.forEach((d) => {
+ data.forEach(d => {
d.path = (d.url || "").replace("/Manager", "");
d.to = (d.url || "").replace("/Manager", "");
if (!d.icon || d.icon.substring(0, 3) != "el-") {
@@ -514,7 +573,7 @@
//寮�鍚秷鎭帹閫侊紙main.js涓缃槸鍚﹀紑鍚痵ignalR锛�2022.05.05
if (_config.$global.signalR) {
- MessageConfig(http, (result) => {
+ MessageConfig(http, result => {
messageList.unshift(result);
// console.log(result)
});
@@ -523,12 +582,12 @@
//褰撳墠鍒锋柊鏄笉鏄椤�
if (router.currentRoute.value.path != navigation[0].path) {
//鏌ユ壘绯荤粺鑿滃崟
- let item = menuOptions.value.find((x) => {
+ 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) => {
+ item = links.value.find(x => {
return x.path == router.currentRoute.value.path; //this.$route.path;
});
//鏌ユ壘鏈�鍚庝竴娆¤烦杞殑椤甸潰
@@ -574,7 +633,7 @@
visibleItem,
closeTabsMenu,
closeTabs,
- currentMenuId,
+ currentMenuId
};
},
/**
@@ -584,7 +643,7 @@
let _date = showTime();
$indexDate = document.getElementById("index-date");
$indexDate.innerText = _date;
- $interval = setInterval(function () {
+ $interval = setInterval(function() {
$indexDate.innerText = showTime();
}, 1000);
@@ -610,7 +669,7 @@
item.oncontextmenu = that.openTabsMenu;
});
});
- },
+ }
},
/**
@@ -619,7 +678,7 @@
destroyed() {
$this = null;
clearInterval($interval);
- },
+ }
});
const week = new Array(
"鏄熸湡涓�",
@@ -699,8 +758,12 @@
letter-spacing: 1px;
}
-.el-tabs.el-tabs--top.el-tabs--border-card.header-navigation>.el-tabs__header .el-tabs__item:last-child,
-.el-tabs--top.el-tabs--border-card.header-navigation>.el-tabs__header .el-tabs__item:nth-child(2) {
+.el-tabs.el-tabs--top.el-tabs--border-card.header-navigation
+ > .el-tabs__header
+ .el-tabs__item:last-child,
+.el-tabs--top.el-tabs--border-card.header-navigation
+ > .el-tabs__header
+ .el-tabs__item:nth-child(2) {
padding: 0;
}
--
Gitblit v1.9.3