|  |  | 
 |  |  |   <div class="common-header"> | 
 |  |  |     <div class="header"> | 
 |  |  |       <div class="logo"> | 
 |  |  |         <div>{{title}}</div> | 
 |  |  |         <div>{{ title }}</div> | 
 |  |  |         <!-- <div class="title-en">Diagnosis of Intelligent Manufacturing Integrated Service Platfrom</div> --> | 
 |  |  |       </div> | 
 |  |  |       <div class="user"> | 
 |  |  |         <el-dropdown v-if="isLogined" trigger="click"> | 
 |  |  |           <span class="el-dropdown-link"> | 
 |  |  |             <!-- <img v-if="userInfo != null" :src="userInfo.avatar == null ? `${require('@/assets/avatar/man.png')}` : userInfo.avatar" alt="">{{userInfo | displayName}}<i class="el-icon-arrow-down el-icon--right"></i> --> | 
 |  |  |             <img v-if="userInfo != null" style="width: 30px !important;" src="@/assets/avatar/man.png" alt="">{{userInfo | displayName}}<i class="el-icon-arrow-down el-icon--right"></i> | 
 |  |  |             <img | 
 |  |  |               v-if="userInfo != null" | 
 |  |  |               style="width: 30px !important" | 
 |  |  |               src="@/assets/avatar/man.png" | 
 |  |  |               alt="" | 
 |  |  |             />{{ userInfo | displayName | 
 |  |  |             }}<i class="el-icon-arrow-down el-icon--right"></i> | 
 |  |  |           </span> | 
 |  |  |           <el-dropdown-menu slot="dropdown"> | 
 |  |  |             <el-dropdown-item @click.native="changePwd">修改密码</el-dropdown-item> | 
 |  |  |             <el-dropdown-item @click.native="changePwd" | 
 |  |  |               >修改密码</el-dropdown-item | 
 |  |  |             > | 
 |  |  |             <el-dropdown-item @click.native="logout">退出登录</el-dropdown-item> | 
 |  |  |           </el-dropdown-menu> | 
 |  |  |         </el-dropdown> | 
 |  |  | 
 |  |  |       @confirm="confirmChangePwd" | 
 |  |  |       @close="visible.changePwd = false" | 
 |  |  |     > | 
 |  |  |       <el-form :model="changePwdData.form" ref="changePwdDataForm" :rules="changePwdData.rules"> | 
 |  |  |       <el-form | 
 |  |  |         :model="changePwdData.form" | 
 |  |  |         ref="changePwdDataForm" | 
 |  |  |         :rules="changePwdData.rules" | 
 |  |  |       > | 
 |  |  |         <el-form-item label="原始密码" prop="oldPwd" required> | 
 |  |  |           <el-input v-model="changePwdData.form.oldPwd" type="password" placeholder="请输入原始密码" maxlength="30" show-password></el-input> | 
 |  |  |           <el-input | 
 |  |  |             v-model="changePwdData.form.oldPwd" | 
 |  |  |             type="password" | 
 |  |  |             placeholder="请输入原始密码" | 
 |  |  |             maxlength="30" | 
 |  |  |             show-password | 
 |  |  |           ></el-input> | 
 |  |  |         </el-form-item> | 
 |  |  |         <el-form-item label="新密码" prop="newPwd" required> | 
 |  |  |           <el-input v-model="changePwdData.form.newPwd" type="password" placeholder="请输入新密码" maxlength="30" show-password></el-input> | 
 |  |  |           <el-input | 
 |  |  |             v-model="changePwdData.form.newPwd" | 
 |  |  |             type="password" | 
 |  |  |             placeholder="请输入新密码" | 
 |  |  |             maxlength="30" | 
 |  |  |             show-password | 
 |  |  |           ></el-input> | 
 |  |  |         </el-form-item> | 
 |  |  |         <el-form-item label="确认新密码" prop="confirmPwd" required> | 
 |  |  |           <el-input v-model="changePwdData.form.confirmPwd" type="password" placeholder="请再次输入新密码" maxlength="30" show-password></el-input> | 
 |  |  |           <el-input | 
 |  |  |             v-model="changePwdData.form.confirmPwd" | 
 |  |  |             type="password" | 
 |  |  |             placeholder="请再次输入新密码" | 
 |  |  |             maxlength="30" | 
 |  |  |             show-password | 
 |  |  |           ></el-input> | 
 |  |  |         </el-form-item> | 
 |  |  |       </el-form> | 
 |  |  |     </GlobalAlertWindow> | 
 |  |  | 
 |  |  |       default: true | 
 |  |  |     } | 
 |  |  |   }, | 
 |  |  |   data () { | 
 |  |  |   data() { | 
 |  |  |     return { | 
 |  |  |       title: process.env.VUE_APP_TITLE, | 
 |  |  |       visible: { | 
 |  |  | 
 |  |  |   }, | 
 |  |  |   filters: { | 
 |  |  |     // 展示名称 | 
 |  |  |     displayName (userInfo) { | 
 |  |  |     displayName(userInfo) { | 
 |  |  |       if (userInfo == null) { | 
 |  |  |         return '' | 
 |  |  |       } | 
 |  |  | 
 |  |  |   methods: { | 
 |  |  |     ...mapMutations(['setUserInfo', 'switchCollapseMenu', 'clearUserInfo']), | 
 |  |  |     // 修改密码 | 
 |  |  |     changePwd () { | 
 |  |  |     changePwd() { | 
 |  |  |       this.visible.changePwd = true | 
 |  |  |       this.$nextTick(() => { | 
 |  |  |         this.$refs.changePwdDataForm.resetFields() | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     // 确定修改密码 | 
 |  |  |     confirmChangePwd () { | 
 |  |  |     confirmChangePwd() { | 
 |  |  |       if (this.isWorking.changePwd) { | 
 |  |  |         return | 
 |  |  |       } | 
 |  |  | 
 |  |  |       }) | 
 |  |  |     }, | 
 |  |  |     // 退出登录 | 
 |  |  |     logout () { | 
 |  |  |     logout() { | 
 |  |  |       logout() | 
 |  |  |         .then(() => { | 
 |  |  |           this.clearUserInfo() | 
 |  |  | 
 |  |  | <style scoped lang="scss"> | 
 |  |  | @import "@/assets/style/variables.scss"; | 
 |  |  | .common-header { | 
 |  |  |   background-color: #1457C7; | 
 |  |  |   background-color: #2080f7; | 
 |  |  | } | 
 |  |  | .header { | 
 |  |  |   overflow: hidden; | 
 |  |  | 
 |  |  |   justify-content: space-between; | 
 |  |  |  | 
 |  |  |   .logo { | 
 |  |  |     background: url('../../assets/images/top_ic_chilun@2x.png') no-repeat; | 
 |  |  |     /* background: url("../../assets/images/top_ic_chilun@2x.png") no-repeat; */ | 
 |  |  |     box-sizing: border-box; | 
 |  |  |     min-width: 280px; | 
 |  |  |     height: 70px; | 
 |  |  |     padding: 17px 30px; | 
 |  |  |     height: 56px; | 
 |  |  |     padding: 10px 30px; | 
 |  |  |     // flex-shrink: 0; | 
 |  |  |     line-height: 36px; | 
 |  |  |     font-size: 22px; | 
 |  |  | 
 |  |  |   .user { | 
 |  |  |     width: 712px; | 
 |  |  |     box-sizing: border-box; | 
 |  |  |     height: 70px; | 
 |  |  |     height: 56px; | 
 |  |  |     padding-right: 25px; | 
 |  |  |     background: url('../../assets/images/top_ic_bolang@2x.png') no-repeat; | 
 |  |  |     background: url("../../assets/images/top_ic_bolang@2x.png") no-repeat; | 
 |  |  |     flex-shrink: 0; | 
 |  |  |     text-align: right; | 
 |  |  |     .el-dropdown { | 
 |  |  |       top: 10px; | 
 |  |  |       top: 2px; | 
 |  |  |       color: #fff; | 
 |  |  |     } | 
 |  |  |     img { | 
 |  |  | 
 |  |  | .el-dropdown-menu { | 
 |  |  |   width: 140px; | 
 |  |  |   .el-dropdown-menu__item:hover { | 
 |  |  |     background: #E3EDFB; | 
 |  |  |     background: #e3edfb; | 
 |  |  |     color: $primary-color; | 
 |  |  |   } | 
 |  |  | } |