修改

祖安之光

2025-06-27 b609f77709c4646daf155341475ae14fc0c7943d

 src/layout/components/Navbar.vue

@@ -1,63 +1,92 @@
<template>
  <div class="navbar">
    <hamburger id="hamburger-container" :is-active="appStore.sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
    <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!settingsStore.topNav" />
    <top-nav id="topmenu-container" class="topmenu-container" v-if="settingsStore.topNav" />
    <hamburger id="hamburger-container" :is-active="appStore.sidebar.opened" class="hamburger-container"
               @toggleClick="toggleSideBar"/>
    <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!settingsStore.topNav"/>
    <top-nav id="topmenu-container" class="topmenu-container" v-if="settingsStore.topNav"/>

    <div class="right-menu">
      <template v-if="appStore.device !== 'mobile'">
<!--        <header-search id="header-search" class="right-menu-item" />-->
        <!--        <header-search id="header-search" class="right-menu-item" />-->

<!--        <el-tooltip content="源码地址" effect="dark" placement="bottom">-->
<!--          <ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />-->
<!--        </el-tooltip>-->
        <!--        <el-tooltip content="源码地址" effect="dark" placement="bottom">-->
        <!--          <ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />-->
        <!--        </el-tooltip>-->

<!--        <el-tooltip content="文档地址" effect="dark" placement="bottom">-->
<!--          <ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" />-->
<!--        </el-tooltip>-->
        <!--        <el-tooltip content="文档地址" effect="dark" placement="bottom">-->
        <!--          <ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" />-->
        <!--        </el-tooltip>-->

        <screenfull id="screenfull" class="right-menu-item hover-effect" />
        <!--        <screenfull id="screenfull" class="right-menu-item hover-effect" />-->

<!--        <el-tooltip content="布局大小" effect="dark" placement="bottom">-->
<!--          <size-select id="size-select" class="right-menu-item hover-effect" />-->
<!--        </el-tooltip>-->
        <!--        <el-tooltip content="布局大小" effect="dark" placement="bottom">-->
        <!--          <size-select id="size-select" class="right-menu-item hover-effect" />-->
        <!--        </el-tooltip>-->
      </template>
      <div class="avatar-container">
        <el-dropdown @command="handleCommand" class="right-menu-item hover-effect" trigger="click">
          <div class="avatar-wrapper">
<!--            <img :src="userStore.avatar" class="user-avatar" />-->
            <img src="../../assets/images/avator.png" class="user-avatar" />
            <el-icon><caret-bottom /></el-icon>
            <img :src="avator" class="user-avatar"/>
            <el-icon>
              <caret-bottom/>
            </el-icon>
          </div>
          <template #dropdown>
            <el-dropdown-menu>
<!--              <router-link to="/user/profile">-->
<!--                <el-dropdown-item>个人中心</el-dropdown-item>-->
<!--              </router-link>-->
              <el-dropdown-item command="info">
                <span>基本信息</span>
              </el-dropdown-item>
              <!--              <router-link to="/user/profile">-->
              <!--                <el-dropdown-item>个人中心</el-dropdown-item>-->
              <!--              </router-link>-->
              <!--              <el-dropdown-item command="setLayout" v-if="settingsStore.showSettings">-->
              <!--                <span>布局设置</span>-->
              <!--              </el-dropdown-item>-->
              <el-dropdown-item command="password">
                <span>修改密码</span>
              </el-dropdown-item>
              <el-dropdown-item divided command="logout">
              <el-dropdown-item command="logout">
                <span>退出登录</span>
              </el-dropdown-item>
            </el-dropdown-menu>
          </template>
        </el-dropdown>
      </div>
      <el-dialog
          v-model="pwdDialog"
          title="修改密码"
          width="550px"
          :before-close="handleClose"
      >
        <el-form :model="form" size="default" ref="pwdRef" :rules="formRules" label-width="110px">
          <el-form-item label="原密码" prop="oldPassword">
            <el-input v-model.trim="form.oldPassword" type="password" show-password
                      placeholder="请输入原密码"></el-input>
          </el-form-item>
          <el-form-item label="新密码" prop="newPassword">
            <el-input v-model.trim="form.newPassword" type="password" show-password
                      placeholder="请输入新密码"></el-input>
          </el-form-item>
          <el-form-item label="重复密码" prop="confirmPassword">
            <el-input v-model.trim="form.confirmPassword" type="password" show-password
                      placeholder="请再次输入新密码"></el-input>
          </el-form-item>
        </el-form>
        <template #footer>
          <span class="dialog-footer">
              <el-button @click="handleClose" size="default">取 消</el-button>
              <el-button type="primary" @click="onSubmit" size="default" v-preReClick>确认</el-button>
          </span>
        </template>
      </el-dialog>
    </div>
    <review-dialog ref="reviewRef" ></review-dialog>
    <supervise-dialog ref="superRef"></supervise-dialog>
  </div>
</template>

<script setup>
import { ElMessageBox } from 'element-plus'
import {ElMessageBox} from 'element-plus'
import Breadcrumb from '@/components/Breadcrumb'
import TopNav from '@/components/TopNav'
import Hamburger from '@/components/Hamburger'
import {reactive, ref} from 'vue'
import {ElMessage} from "element-plus";
import Screenfull from '@/components/Screenfull'
import SizeSelect from '@/components/SizeSelect'
import HeaderSearch from '@/components/HeaderSearch'
@@ -66,34 +95,82 @@
import useAppStore from '@/store/modules/app'
import useUserStore from '@/store/modules/user'
import useSettingsStore from '@/store/modules/settings'
import {getToken, removeToken} from "@/utils/auth";
import {onMounted, ref} from "vue";
import Cookies from "js-cookie";
import reviewDialog from "@/views/safetyReview/institution/components/viewInstitution.vue"
import superviseDialog from "@/views/safetyReview/userManage/superviseUsers/components/superviseDialog.vue"
import avator from '@/assets/images/avator.png'
import {updateUserPwd} from "@/api/system/user";

let validatePwd = (rule, value, callback) => {
  const regex = /^(?=.*[A-Za-z])(?=.*\d).{8,}$/
  if (value === '') {
    callback(new Error('请输入密码'))
  } else {
    if (!regex.test(value)) {
      callback(new Error('密码须包含字母、数字，长度不少于8字符'))
    } else {
      callback()
    }
  }
}

const equalToPassword = (rule, value, callback) => {
  if (value === '') {
    callback(new Error('请再次确认新密码'))
  } else if (form.newPassword !== value) {
    callback(new Error("两次输入的密码不一致"))
  } else {
    callback()
  }
};

const appStore = useAppStore()
const userStore = useUserStore()
const settingsStore = useSettingsStore()

const reviewRef = ref();
const superRef = ref();
const userInfo = ref();
onMounted(()=>{
  if(getToken()){
    userInfo.value = JSON.parse(Cookies.get('userInfo'))
    console.log("userInfo",userInfo.value )
const pwdDialog = ref(false)
const pwdRef = ref()

  }
const form = reactive({
  newPassword: '',
  oldPassword: '',
  confirmPassword: ''
})

const formRules = reactive({
  oldPassword: [{required: true, validator: validatePwd, trigger: 'blur'}],
  newPassword: [{required: true, validator: validatePwd, trigger: 'blur'}],
  confirmPassword: [{required: true, validator: equalToPassword, trigger: 'blur'}]
})

const onSubmit = async()=>{
  const valid = await pwdRef.value.validate();
  if(valid){
    const res = await updateUserPwd(form.oldPassword,form.newPassword)
    if(res.code == 200){
      ElMessage.success('修改密码成功，请重新登录')
      pwdDialog.value = false
      logout()
    }else{
      ElMessage.warning(res.msg)
    }
  }
}

const handleClose = ()=>{
  form.value = {
    newPassword: '',
    oldPassword: '',
    confirmPassword: ''
  }
  pwdDialog.value = false
}

function toggleSideBar() {
  appStore.toggleSideBar()
}

function handleCommand(command) {
  switch (command) {
    case "info":
      getInfo();
    case "setLayout":
      setLayout();
      break;
    case "logout":
      logout();
@@ -106,40 +183,25 @@
  }
}

function getInfo() {
  console.log("getInfo")
  //机构用户
  if(userInfo.value.identity === 1){
    const obj = {
      agencyId: userInfo.value.agentId
    }
    reviewRef.value.openDialog(obj,'view')
  }
  //监管用户
  else if (userInfo.value.identity === 0) {
    const obj = {
      id: userInfo.value.id
    }
    superRef.value.openDialog('view', obj);
  }
}
function editPsd() {
  superRef.value.openDialog('pwd', userInfo.value);
}

function logout() {
  ElMessageBox.confirm('确定注销并退出系统吗？', '提示', {
    confirmButtonText: '确定',
    cancelButtonText: '取消',
    type: 'warning'
  }).then(() => {
    removeToken()
    location.href = '/homePage';
    userStore.logOut().then(() => {
      location.href = '/index';
    })
  }).catch(() => {
  });
}

  }).catch(() => { });
function editPsd() {
  pwdDialog.value = true
}

const emits = defineEmits(['setLayout'])

function setLayout() {
  emits('setLayout');
}
@@ -151,8 +213,8 @@
  overflow: hidden;
  position: relative;
  background: #fff;
  border-radius: 0.4rem 0.4rem 0 0;
  border-bottom: 1px solid #d5dce5;
  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);

  .hamburger-container {
    line-height: 46px;
    height: 100%;