Browse Source

还原头部

master
1181364@qq.com 2 years ago
parent
commit
2aae848183
  1. 248
      src/layout/components/Navbar.vue

248
src/layout/components/Navbar.vue

@ -1,47 +1,19 @@
<template>
<div>
<div class="navbar">
<p class="breadcrumb-container"><img src="@/assets/loginImg/logo.png"
style="width: 45px;height: 45px;margin-right: 10px;" />汇融云眼贷后监管平台</p>
<!-- <h3 class="breadcrumb-container">汇融银行供应链贷后监管平台</h3> -->
<p class="breadcrumb-container"><img src="@/assets/loginImg/logo.png" style="width: 45px;height: 45px;margin-right: 10px;"/>汇融云眼贷后监管平台</p>
<!-- <h3 class="breadcrumb-container">汇融银行供应链贷后监管平台</h3> -->
<div class="right-menu">
<!-- <p>{{Orgname}} {{departmentName}} 欢迎, {{name}}</p>-->
<!-- <p>{{Orgname}} {{departmentName}} 欢迎, {{name}}</p>-->
<p>欢迎您{{name}}</p>
<el-badge :value="6" class="item">
<img src="@/assets/images/info.png" @click="getMessageInfoList">
<img src="@/assets/images/info.png">
</el-badge>
<!-- <img src="@/assets/images/dy.png" @click="logout"> -->
<span class="backToHome" @click="logout"><i class="el-icon-back"></i>返回首页</span>
</div>
</div>
<el-footer class="footer" height="40px">Copyright © {{ year }} 技术支持集团 All Rights Reserved</el-footer>
<div v-show="visible">
<div class="webswrap" @click="handleReturn()"></div>
<div class="webs">
<div class="closes" @click="handleReturn()">
<span class="el-icon-circle-close close"></span>
</div>
<div class="web tabgongzuo-form">
<el-tabs v-model="activeTypeName" @tab-click="xiaoxiTypeClick">
<el-tab-pane v-for="(ite, index) in xiaoxiType" :key="index" :label="ite.label" :name="ite.value">
<div class="lanmus">
<ul>
<li v-for="(item, indedx) in list" :key="indedx">
<div style="border:1px red solid;width:23px;height:23px">
<image src="/image/yujing.jpg" width="100%" />
</div>
<div class="btnbox" @click.stop.prevent="LookDetils(item)">
{{ item.messageContent }}--{{item.createTime}}
</div>
</li>
</ul>
</div>
</el-tab-pane>
</el-tabs>
</div>
</div>
</div>
</div>
</template>
@ -49,25 +21,11 @@
export default {
data() {
return {
activeTypeName: 0,
xiaoxiType: [
{ label: '已读', value: '1' },
{ label: '未读', value: '2' }
],
list: [
{ messageContent: '电梯系统:电梯门异常关闭', createTime: '2023-05-25' },
{ messageContent: '电梯系统:电梯门异常关闭', createTime: '2023-05-25' },
{ messageContent: '电梯系统:电梯门异常关闭', createTime: '2023-05-25' },
{ messageContent: '电梯系统:电梯门异常关闭', createTime: '2023-05-25' },
{ messageContent: '电梯系统:电梯门异常关闭', createTime: '2023-05-25' },
{ messageContent: '电梯系统:电梯门异常关闭', createTime: '2023-05-25' },
],
visible: false,
Orgname: '',
departmentName: '',
name: '',
year: '',
pNameAndDepartmentNameAndPostName: ''
year:'',
pNameAndDepartmentNameAndPostName:''
}
},
mounted() {
@ -79,17 +37,6 @@
this.year = nowDate.getFullYear()
},
methods: {
xiaoxiTypeClick(tab, event) {
console.log('77777777777777', tab, event)
this.$set(this, 'activeTypeName', tab.name)
// this.getList(tab.name)
},
handleReturn() {
this.visible = false;
},
getMessageInfoList() {
this.visible = true
},
logout() {
// this.$router.push({ path: '/home' })
window.opener = null
@ -123,15 +70,15 @@
}
}
.breadcrumb-container {
display: flex;
align-items: center;
color: #fff;
font-size: 26px;
line-height: 60px;
margin: 0;
float: left;
}
.breadcrumb-container {
display: flex;
align-items: center;
color: #fff;
font-size: 26px;
line-height: 60px;
margin: 0;
float: left;
}
.right-menu {
float: right;
@ -221,172 +168,15 @@
font-size: 14px;
color: #666;
}
::v-deep .el-badge__content {
position: relative;
::v-deep .el-badge__content{position: relative;
height: 20px;
line-height: 20px;
padding: 0 6px;
}
}
::v-deep .el-badge__content.is-fixed {
position: absolute;
top: 17px;
right: 14px;
}
.app-web {
z-index: 900;
}
.webswrap {
background-color: rgba(51, 51, 48, 0.6);
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 999;
}
.webs {
z-index: 1000;
/* background: url('/dapingmu/dapingmu_box.png') center top no-repeat;
background-size: 100% 100%; */
background-image: linear-gradient(#7c070a, #7b060a, #7c070a) !important;
/* background-image: linear-gradient(
to right,
rgba(105,3,6,0.9) 0%,
rgba(123,6,10,0.9) 25%,
rgba(123,6,10,0.9) 75%,
rgba(105,3,6,0.9) 100%); */
// border: 1px solid #9c070c;
border: 1px solid #9c4f07;
position: fixed;
top: 50px;
right: 10px;
bottom: 10px;
/* bottom: 10px; */
overflow-y: auto !important;
overflow-x: hidden;
width: 300px;
min-height: 400px;
margin: 0;
padding: 0;
}
.top {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #9c070c;
}
.top .title {
color: #f7ee02;
font-size: 16px;
font-weight: bold;
}
.closes {
text-align: right;
padding: 10px;
position: absolute;
right: 10px;
top: 10px;
z-index: 900;
}
.close {
font-size: 18px;
color: #fff;
}
.web {
padding: 10px;
text-align: center;
}
/* .lanmus{border-bottom: 1px solid #9c070c;} */
ul,
li {
list-style: none;
}
.lanmus ul {
margin: 0;
padding: 0;
/* display: flex;flex-direction: row;flex-wrap: wrap;justify-content: flex-start; */
}
.lanmus li {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
color: #fae1e1;
text-align: left;
border-bottom: 1px solid #9f0608 !important;
cursor: pointer;
}
.lanmus li .iconfont {}
.lanmus li .btnbox {
flex: 1;
/* background-image: linear-gradient(#7c070a, #7b060a, #7c070a) !important; border-radius: 10px;*/
/* border-bottom: 1px solid #9f0608 !important; */
font-size: 12px;
color: #fae1e1;
margin: 5px;
text-align: left;
padding: 5px;
}
.lanmus li .btnbox:hover {
background-image: linear-gradient(#7b060a, #9c070c, #7b060a) !important;
color: #f7ebc3;
}
/* el-tabs样式 */
.tabgongzuo-form {
/* padding: 0; */
color: #4cc6f4;
>>>.el-tabs__nav-wrap::after {
background-color: #aa1e0a !important;
}
/* 设置滑块颜色 */
>>>.el-tabs__active-bar {
background-color: #13fbfe !important;
color: #13fbfe !important;
}
/* 设置滑块停止位置 */
>>>.el-tabs__active-bar.is-top {
position: absolute !important;
z-index: 1;
}
/* 设置当前选中样式 */
>>>.el-tabs__item.is-active {
color: #13fbfe !important;
z-index: 2;
}
/* 设置未被选中样式 */
>>>.el-tabs__item {
box-sizing: border-box;
position: relative !important;
color: #fff !important;
z-index: 2;
}
}
</style>
}
</style>

Loading…
Cancel
Save