|
|
@@ -35,13 +35,13 @@
|
|
|
</div>
|
|
|
|
|
|
<!-- 工具栏 -->
|
|
|
- <span class="toolbar" v-popover:popover-personal>
|
|
|
+ <span class="toolbar" :class="{'active':toolbarActive}" v-popover:popover-personal>
|
|
|
<el-popover
|
|
|
placement="bottom"
|
|
|
- ref="popover-personal"
|
|
|
- trigger="click">
|
|
|
+ ref="reference"
|
|
|
+ trigger="click" @show="show" @hide="hide">
|
|
|
<personal-panel :user="userData"></personal-panel>
|
|
|
- <img slot="reference" :src="userData.headSculpture?userData.headSculpture:avatar" />
|
|
|
+ <img slot="reference" :src="userData.headSculpture?userData.headSculpture:avatar" />
|
|
|
</el-popover>
|
|
|
<div class="personalStyle">
|
|
|
<span >{{ userData.roleName }} - {{ userData.name }}</span>
|
|
|
@@ -96,6 +96,7 @@ export default {
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ toolbarActive:false,
|
|
|
sum: null,
|
|
|
datawidth: 1920,
|
|
|
screenWidth: document.body.clientWidth,
|
|
|
@@ -217,6 +218,13 @@ export default {
|
|
|
// }
|
|
|
},
|
|
|
methods: {
|
|
|
+ show(e){
|
|
|
+ this.toolbarActive=true;
|
|
|
+ },
|
|
|
+ hide(){
|
|
|
+ this.toolbarActive=false;
|
|
|
+
|
|
|
+ },
|
|
|
openWindow(url) {
|
|
|
window.open(url)
|
|
|
},
|
|
|
@@ -302,9 +310,8 @@ export default {
|
|
|
float: right;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- background: rgba(180, 180, 180, 0.12);
|
|
|
+
|
|
|
border-radius: 24px 24px 24px 24px;
|
|
|
- border: 1px solid rgba(180, 180, 180, 0.12);
|
|
|
margin: 7px;
|
|
|
img {
|
|
|
width: 40px;
|
|
|
@@ -314,7 +321,11 @@ export default {
|
|
|
float: right;
|
|
|
}
|
|
|
}
|
|
|
+.active {
|
|
|
+ background: rgba(180, 180, 180, 0.12);
|
|
|
+ border: 1px solid rgba(180, 180, 180, 0.12);
|
|
|
|
|
|
+}
|
|
|
.el-menu-item {
|
|
|
// padding: 0 15px!important;
|
|
|
padding: 0 14px !important;
|