|
|
|
@ -2,24 +2,35 @@ |
|
|
|
<div class="navbar"> |
|
|
|
<hamburger :toggle-click="toggleSideBar" :is-active="sidebar.opened" class="hamburger-container"/> |
|
|
|
<i>北京中电红石科技股份有限公司</i> |
|
|
|
<el-dropdown class="avatar-container" trigger="click"> |
|
|
|
<div class="avatar-wrapper"> |
|
|
|
<img src="../../../assets/user.png" class="user-avatar"> |
|
|
|
<i class="el-icon-caret-bottom"/> |
|
|
|
<div class="right-menu"> |
|
|
|
<div class="right-menu-item hover-effect"> |
|
|
|
<el-badge :value="warnCount" :hidden="badgeWarnHidden" style="margin-top: 10px;margin-right: 30px;"> |
|
|
|
<svg-icon icon-class="warn" style="font-size: 36px;" @click="handleWarn"/> |
|
|
|
</el-badge> |
|
|
|
</div> |
|
|
|
<el-dropdown-menu slot="dropdown" class="user-dropdown"> |
|
|
|
<el-dropdown-item> |
|
|
|
<span style="display:block;" @click="getUserInfo">个人信息</span> |
|
|
|
</el-dropdown-item> |
|
|
|
<el-dropdown-item divided> |
|
|
|
<span style="display:block;" @click="modifyUserPassword">修改密码</span> |
|
|
|
</el-dropdown-item> |
|
|
|
<el-dropdown-item divided> |
|
|
|
<span style="display:block;" @click="logout">注销</span> |
|
|
|
</el-dropdown-item> |
|
|
|
</el-dropdown-menu> |
|
|
|
</el-dropdown> |
|
|
|
|
|
|
|
<div class="right-menu-item hover-effect"> |
|
|
|
<el-badge :value="auditCount" :hidden="badgeAuditHidden" style="margin-top: 10px;margin-right: 30px;"> |
|
|
|
<svg-icon icon-class="audit" style="font-size: 36px;" @click="handleAudit"/> |
|
|
|
</el-badge> |
|
|
|
</div> |
|
|
|
<el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click"> |
|
|
|
<div class="avatar-wrapper"> |
|
|
|
<img src="../../../assets/user.png" class="user-avatar"> |
|
|
|
<i class="el-icon-caret-bottom"/> |
|
|
|
</div> |
|
|
|
<el-dropdown-menu slot="dropdown" class="user-dropdown"> |
|
|
|
<el-dropdown-item> |
|
|
|
<span style="display:block;" @click="getUserInfo">个人信息</span> |
|
|
|
</el-dropdown-item> |
|
|
|
<el-dropdown-item divided> |
|
|
|
<span style="display:block;" @click="modifyUserPassword">修改密码</span> |
|
|
|
</el-dropdown-item> |
|
|
|
<el-dropdown-item divided> |
|
|
|
<span style="display:block;" @click="logout">注销</span> |
|
|
|
</el-dropdown-item> |
|
|
|
</el-dropdown-menu> |
|
|
|
</el-dropdown> |
|
|
|
</div> |
|
|
|
<el-dialog |
|
|
|
:visible.sync="visible" |
|
|
|
:before-close="handleCancel" |
|
|
|
@ -54,9 +65,10 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import { mapGetters } from 'vuex' |
|
|
|
import { mapGetters, mapActions } from 'vuex' |
|
|
|
import Hamburger from '@/components/Hamburger' |
|
|
|
import { modifyPassword, getInfo, edit } from '@/api/user' |
|
|
|
import { queryLog, warn } from '@/api/material' |
|
|
|
export default { |
|
|
|
components: { |
|
|
|
Hamburger |
|
|
|
@ -75,11 +87,34 @@ export default { |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
...mapGetters([ |
|
|
|
'sidebar' |
|
|
|
'sidebar', |
|
|
|
'warnCount', |
|
|
|
'auditCount' |
|
|
|
// 'avatar' |
|
|
|
]) |
|
|
|
]), |
|
|
|
badgeWarnHidden() { |
|
|
|
return this.warnCount <= 0 |
|
|
|
}, |
|
|
|
badgeAuditHidden() { |
|
|
|
return this.auditCount <= 0 |
|
|
|
} |
|
|
|
}, |
|
|
|
created() { |
|
|
|
this.fetchMaterialAuditCount() |
|
|
|
this.fetchMaterialWarnCount() |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
...mapActions(['SetAuditCount', 'SetWarnCount']), |
|
|
|
fetchMaterialAuditCount() { |
|
|
|
queryLog(1, 0, null, null, null, null, 1, 1).then(response => { |
|
|
|
this.SetAuditCount(response.data.total) |
|
|
|
}) |
|
|
|
}, |
|
|
|
fetchMaterialWarnCount() { |
|
|
|
warn(1, 1).then(response => { |
|
|
|
this.SetWarnCount(response.data.total) |
|
|
|
}) |
|
|
|
}, |
|
|
|
toggleSideBar() { |
|
|
|
this.$store.dispatch('ToggleSideBar') |
|
|
|
}, |
|
|
|
@ -127,6 +162,12 @@ export default { |
|
|
|
message: '取消修改' |
|
|
|
}) |
|
|
|
}) |
|
|
|
}, |
|
|
|
handleAudit() { |
|
|
|
this.$router.push({ path: '/material/audit' }) |
|
|
|
}, |
|
|
|
handleWarn() { |
|
|
|
this.$router.push({ path: '/material/warn' }) |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
@ -143,32 +184,53 @@ export default { |
|
|
|
float: left; |
|
|
|
padding: 0 10px; |
|
|
|
} |
|
|
|
.screenfull { |
|
|
|
position: absolute; |
|
|
|
right: 90px; |
|
|
|
top: 16px; |
|
|
|
color: red; |
|
|
|
} |
|
|
|
.avatar-container { |
|
|
|
height: 50px; |
|
|
|
display: inline-block; |
|
|
|
position: absolute; |
|
|
|
right: 35px; |
|
|
|
.avatar-wrapper { |
|
|
|
cursor: pointer; |
|
|
|
margin-top: 5px; |
|
|
|
position: relative; |
|
|
|
line-height: initial; |
|
|
|
.user-avatar { |
|
|
|
width: 40px; |
|
|
|
height: 40px; |
|
|
|
border-radius: 10px; |
|
|
|
.right-menu { |
|
|
|
float: right; |
|
|
|
height: 100%; |
|
|
|
line-height: 50px; |
|
|
|
|
|
|
|
&:focus { |
|
|
|
outline: none; |
|
|
|
} |
|
|
|
|
|
|
|
.right-menu-item { |
|
|
|
display: inline-block; |
|
|
|
padding: 0 8px; |
|
|
|
height: 100%; |
|
|
|
font-size: 18px; |
|
|
|
color: #5a5e66; |
|
|
|
vertical-align: text-bottom; |
|
|
|
|
|
|
|
&.hover-effect { |
|
|
|
cursor: pointer; |
|
|
|
transition: background .3s; |
|
|
|
|
|
|
|
&:hover { |
|
|
|
background: rgba(0, 0, 0, .025) |
|
|
|
} |
|
|
|
} |
|
|
|
.el-icon-caret-bottom { |
|
|
|
position: absolute; |
|
|
|
right: -20px; |
|
|
|
top: 25px; |
|
|
|
font-size: 12px; |
|
|
|
} |
|
|
|
.avatar-container { |
|
|
|
margin-right: 30px; |
|
|
|
|
|
|
|
.avatar-wrapper { |
|
|
|
margin-top: 5px; |
|
|
|
position: relative; |
|
|
|
|
|
|
|
.user-avatar { |
|
|
|
cursor: pointer; |
|
|
|
width: 40px; |
|
|
|
height: 40px; |
|
|
|
border-radius: 10px; |
|
|
|
} |
|
|
|
|
|
|
|
.el-icon-caret-bottom { |
|
|
|
cursor: pointer; |
|
|
|
position: absolute; |
|
|
|
right: -20px; |
|
|
|
top: 25px; |
|
|
|
font-size: 12px; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
