|
|
|
@ -7,20 +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>
|
|
|
|
|
<div class="vol-container" :style="{ left: menuWidth - 1 + 'px' }">
|
|
|
|
|
<div class="vol-header">
|
|
|
|
|
<div class="project-name">{{departName}}</div>
|
|
|
|
|
<div class="project-name">{{ departName }}</div>
|
|
|
|
|
<div class="header-text">
|
|
|
|
|
<!-- <div class="h-link">
|
|
|
|
|
<a
|
|
|
|
@ -35,25 +29,28 @@
|
|
|
|
|
<i v-else :class="item.icon"></i>
|
|
|
|
|
</a>
|
|
|
|
|
</div> -->
|
|
|
|
|
<div class="h-link">
|
|
|
|
|
<a href="javascript:void(0)" @click="to(item)" v-for="(item, index) in links.filter((c) => {
|
|
|
|
|
return !c.icon;
|
|
|
|
|
})" :key="index">
|
|
|
|
|
<span v-if="!item.icon"> {{ item.text }}</span>
|
|
|
|
|
<i v-else :class="item.icon"></i>
|
|
|
|
|
</a>
|
|
|
|
|
</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) => {
|
|
|
|
|
return c.icon;
|
|
|
|
|
})"
|
|
|
|
|
:key="index"
|
|
|
|
|
>
|
|
|
|
|
<a href="javascript:void(0)" @click="to(item)" v-for="(item, index) in links.filter((c) => {
|
|
|
|
|
return c.icon;
|
|
|
|
|
})" :key="index">
|
|
|
|
|
<span v-if="!item.icon"> {{ item.text }}</span>
|
|
|
|
|
<i v-else :class="item.icon"></i>
|
|
|
|
|
</a>
|
|
|
|
|
</div>
|
|
|
|
|
<!--消息管理-->
|
|
|
|
|
<div class="h-link" @click="messageModel = true">
|
|
|
|
|
<!-- <div class="h-link" @click="messageModel = true">
|
|
|
|
|
<a><i class="el-icon-message-solid"></i></a>
|
|
|
|
|
</div>
|
|
|
|
|
</div> -->
|
|
|
|
|
<div>
|
|
|
|
|
<img class="user-header" :src="userImg" :onerror="errorImg" />
|
|
|
|
|
</div>
|
|
|
|
@ -62,65 +59,37 @@
|
|
|
|
|
<span id="index-date"></span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="settings">
|
|
|
|
|
<i
|
|
|
|
|
style="font-size: 20px"
|
|
|
|
|
class="el-icon-s-tools"
|
|
|
|
|
@click="drawer_model = true"
|
|
|
|
|
/>
|
|
|
|
|
<i style="font-size: 20px" class="el-icon-s-tools" @click="drawer_model = true" />
|
|
|
|
|
</div>
|
|
|
|
|
</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>
|
|
|
|
|
<!-- 右键菜单 -->
|
|
|
|
|
<div v-show="contextMenuVisible">
|
|
|
|
|
<ul
|
|
|
|
|
:style="{ left: menuLeft + 'px', top: menuTop + 'px' }"
|
|
|
|
|
class="contextMenu"
|
|
|
|
|
>
|
|
|
|
|
<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 ? "关闭菜单" : "关闭所有"
|
|
|
|
|
}}</el-button
|
|
|
|
|
>
|
|
|
|
|
}}</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
|
|
|
|
|
>
|
|
|
|
|
<el-button link @click="closeTabs('right')">
|
|
|
|
|
<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>
|
|
|
|
@ -131,52 +100,26 @@
|
|
|
|
|
<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
|
|
|
|
|
>
|
|
|
|
|
<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>
|
|
|
|
|
</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>
|
|
|
|
@ -248,21 +191,22 @@ export default defineComponent({
|
|
|
|
|
{ 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: "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: "/dataview", id: -5, icon: "el-icon-news"},
|
|
|
|
|
{ text: "个人中心", path: "/UserInfo", id: -1, icon: "el-icon-s-custom" },
|
|
|
|
|
{
|
|
|
|
|
text: "安全退出",
|
|
|
|
@ -622,7 +566,7 @@ export default defineComponent({
|
|
|
|
|
const getDepartName = () => {
|
|
|
|
|
// departName.value = "长江云息设备集团";
|
|
|
|
|
http.get("api/Sys_Department/getUserDepartment", {}, true).then((data) => {
|
|
|
|
|
departName.value = data.DepartmentName;
|
|
|
|
|
departName.value = data.DepartmentName;
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -763,7 +707,9 @@ function showTime() {
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
color: #333;
|
|
|
|
|
box-shadow: 2px 2px 3px 0 rgb(182 182 182 / 20%);
|
|
|
|
|
i,button{
|
|
|
|
|
|
|
|
|
|
i,
|
|
|
|
|
button {
|
|
|
|
|
font-size: 14px !important;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
@ -784,12 +730,8 @@ function showTime() {
|
|
|
|
|
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;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|