提交

MrShi

2025-06-16 1ab197ce175ad7001e4903005645a486a08d9ceb

 company/src/components/common/CommonHeader.vue

@@ -2,20 +2,44 @@
  <div class="common-header">
    <div class="header">
      <div class="logo">
        <div>云易保客户服务系统</div>
        <div>{{systemTitle}}</div>
        <!-- <div class="title-en">Diagnosis of Intelligent Manufacturing Integrated Service Platfrom</div> -->
      </div>
      <div class="user">
        <el-dropdown v-if="isLogined" trigger="click">
        <!--    企业    -->
        <div style="display: flex; align-items: center;" v-if="userInfo.type === 1">
          <div class="user_kf" v-if="info">
            服务人员：{{info.name}} {{info.mobile}}
          </div>
          <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" class="img1" style="width: 20px !important;" src="@/assets/icons/ic_company@2x.png" alt="">{{userInfo.showCompany.name}}<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="logout">退出登录</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
            <el-dropdown-menu slot="dropdown">
              <el-dropdown-item @click.native="changeCompany(item)" v-for="(item, index) in userInfo.companyPermissionList" :key="index">{{item.companyName}}</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
          <el-dropdown v-if="isLogined" trigger="click" style="top: -7px;">
          <span class="el-dropdown-link">
            <img v-if="userInfo != null" class="img2" style="width: 30px !important;" src="@/assets/avatar/man.png" alt="">{{userInfo.realname}}<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="logout">退出登录</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </div>
        <div v-else>
          <el-dropdown v-if="isLogined" trigger="click" style="top: -7px;">
          <span class="el-dropdown-link">
            <img v-if="userInfo != null" class="img2" 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="logout">退出登录</el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
        </div>
      </div>
    </div>
    <!-- 修改密码 -->
@@ -43,7 +67,8 @@
<script>
import { mapState, mapMutations } from 'vuex'
import GlobalAlertWindow from './GlobalAlertWindow'
import { logout, updatePwd } from '@/api/system/common'
import { logout, updatePwd, switchCompany } from '@/api/system/common'
import { findByCompanyId } from '@/api/business/customerService'
export default {
  name: 'CommonHeader',
  components: { GlobalAlertWindow },
@@ -55,6 +80,7 @@
  },
  data () {
    return {
      systemTitle: process.env.VUE_APP_SYSTEM_TITLE,
      visible: {
        // 修改密码
        changePwd: false
@@ -64,6 +90,7 @@
        changePwd: false
      },
      username: 'bob', // 用户名
      info: null,
      // 修改密码弹框
      changePwdData: {
        form: {
@@ -85,6 +112,12 @@
      }
    }
  },
  created () {
    document.title=this.systemTitle
    if (this.userInfo.companyId) {
      this.setFindByCompanyId(this.userInfo.companyId)
    }
  },
  computed: {
    ...mapState(['menuData', 'userInfo']),
    title () {
@@ -97,6 +130,11 @@
      if (userInfo == null) {
        return ''
      }
      if (userInfo.type === 1 && userInfo.company != null && userInfo.company.name.trim().length > 0) {
        if (userInfo.company.username === userInfo.username){
          return userInfo.company.name
        }
      }
      if (userInfo.realname != null && userInfo.realname.trim().length > 0) {
        return userInfo.realname
      }
@@ -105,6 +143,24 @@
  },
  methods: {
    ...mapMutations(['setUserInfo', 'switchCollapseMenu']),
    // 切换企业
    changeCompany(row) {
      if (row.companyId === this.userInfo.companyId) {
        this.$message.warning('不能切换当前企业')
        return
      }
      switchCompany({ companyId: row.companyId })
        .then(res => {
          location.reload();
        })
    },
    setFindByCompanyId(companyId) {
      if (this.userInfo.type !== 1) return
      findByCompanyId(companyId)
        .then(res => {
          this.info = res
        })
    },
    // 修改密码
    changePwd () {
      this.visible.changePwd = true
@@ -158,7 +214,11 @@
  }
}
</script>

<style>
  .el-dropdown-menu {
    width: 240px !important;
  }
</style>
<style scoped lang="scss">
@import "@/assets/style/variables.scss";
.common-header {
@@ -196,13 +256,31 @@
    padding-right: 25px;
    background: url('../../assets/images/top_ic_bolang@2x.png') no-repeat;
    flex-shrink: 0;
    text-align: right;
    .el-dropdown {
      top: 10px;
      color: #fff;
    /*text-align: right;*/
    display: flex;
    align-items: center;
    justify-content: end;
    .user_kf {
      color: #ffffff;
      font-size: 14px;
      margin-right: 30px;
    }
    img {
      width: 32px;
    .el-dropdown {
      top: -2px;
      color: #fff;
      margin-right: 30px;
      &:last-child {
        margin: 0 !important;
      }
    }
    .img1 {
      width: 20px;
      position: relative;
      top: 5px;
      margin-right: 10px;
    }
    .img2 {
      width: 20px;
      position: relative;
      top: 10px;
      margin-right: 10px;