3.24功能新增

pengwei

2025-03-24 f90fbbc76d23340e4568dd4dadbab5f7f02a030f

 ÏîÄ¿´úÂë/client/src/views/tts/UserManagement/Usermanagement.vue

@@ -39,7 +39,7 @@
            size="small"
          />
        </div>
        <!-- <div class="serch_box">
        <div class="serch_box">
          <div class="serchb">
            <el-select
              v-model="queryForm.selectType"
@@ -56,11 +56,11 @@
            </el-select>
          </div>
          <input
            v-model="queryForm.selectName"
            v-model="queryForm.selectInput"
            placeholder="请输入关键词搜索"
            style="border-left: 0.06rem solid #e2e2e2"
          />
        </div> -->
        </div>
        <el-button
          @click="handleQuery"
          type="primary"
@@ -87,7 +87,7 @@
              display: flex;
              align-items: center;
            "
            ><el-icon style="margin-right: 0.2rem"><Plus /></el-icon
            ><el-icon style="margin-right: 0.2rem"> <Plus /> </el-icon
            >新建</el-button
          >
          <!-- ç”¨æˆ·è§’色新建 -->
@@ -103,7 +103,7 @@
              display: flex;
              align-items: center;
            "
            ><el-icon style="margin-right: 0.2rem"><Plus /></el-icon
            ><el-icon style="margin-right: 0.2rem"> <Plus /> </el-icon
            >新建</el-button
          >
          <el-button
@@ -123,6 +123,7 @@
      <div style="margin-top: 1rem; height: 100%">
        <!-- ç”¨æˆ·åˆ—表 -->
        <el-table
          empty-text="暂无数据"
          height="450"
          v-if="isactive == 1"
          :data="tableData"
@@ -181,7 +182,7 @@
            <template #default="scope">
              <el-image
                style="width: 70px; height: 70px"
                :src="scope.row.headImageUrl"
                :src="'http://115.159.85.185:9098' + scope.row.headImageUrl"
                show-progress
                :initial-index="4"
                fit="cover"
@@ -191,6 +192,9 @@
          <el-table-column label="是否启用" align="center" min-width="2%">
            <template #default="scope">
              <el-switch
                :disabled="
                  scope.row.userName == 'admin' || scope.row.user_Id == '1'
                "
                v-model="scope.row.enable"
                :active-value="1"
                :inactive-value="0"
@@ -206,12 +210,21 @@
          />
          <el-table-column label="操作" align="center" min-width="3%">
            <template #default="scope">
              <el-button size="small" type="text" @click="Edit(scope.row)"
              <el-button
                size="small"
                type="text"
                @click="Edit(scope.row)"
                :disabled="
                  scope.row.userName == 'admin' || scope.row.user_Id == '1'
                "
                >编辑</el-button
              >
              <el-button
                size="small"
                type="text"
                :disabled="
                  scope.row.userName == 'admin' || scope.row.user_Id == '1'
                "
                @click="Editpassword(scope.row)"
                >修改密码</el-button
              >
@@ -221,6 +234,7 @@

        <!-- ç”¨æˆ·è§’色 -->
        <el-table
          empty-text="暂无数据"
          height="450"
          v-if="isactive == 2"
          :data="grideData"
@@ -244,12 +258,10 @@
          <el-table-column prop="name" label="角色权限" align="center">
            <template #default="scope">
              <span
                @click="
                  router.replace({
                    path: `/permission`,
                    state: { info: JSON.stringify(scope.row) },
                  })
                v-if="
                  scope.row.roleName != '超级管理员' || scope.row.roleId != '1'
                "
                @click="toDetail(scope.row)"
                style="color: #4386ff; cursor: pointer"
                >管理</span
              >
@@ -259,6 +271,9 @@
          <el-table-column label="是否启用" align="center">
            <template #default="scope">
              <el-switch
                :disabled="
                  scope.row.roleName == '超级管理员' || scope.row.roleId == '1'
                "
                v-model="scope.row.enable"
                :active-value="1"
                :inactive-value="0"
@@ -270,6 +285,9 @@
          <el-table-column label="操作" align="center">
            <template #default="scope">
              <span
                v-if="
                  scope.row.roleName != '超级管理员' || scope.row.roleId != '1'
                "
                style="color: blue; font-size: 0.88rem; cursor: pointer"
                @click="EditRole(scope.row)"
                >编辑</span
@@ -298,17 +316,6 @@
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
        />
        <el-pagination
          v-if="isactive == 2"
          size="small"
          background
          layout="prev, pager, next"
          :current-page="pageQuery.page"
          :page-size="pageQuery.rows"
          :total="pageTotal"
          @size-change="RoleSizeChange"
          @current-change="RoleCurrentChange"
        />
      </div>
    </div>

@@ -320,6 +327,7 @@
      :before-close="handleClose"
      :show-close="false"
      :align-center="true"
      @close="resetForm(formUserRef)"
    >
      <template #title>
        <div
@@ -339,7 +347,9 @@
        :model="formUser"
        label-width="auto"
        label-position="top"
        ref="formRef"
        :rules="rules"
        ref="formUserRef"
        :hide-required-asterisk="true"
      >
        <el-row :gutter="20">
          <el-col :span="8">
@@ -399,14 +409,14 @@
        </el-row>
        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item>
            <el-form-item prop="role_Id">
              <template #label>
                <div style="display: flex; align-items: flex-end">
                  <span style="color: red; margin-right: 0.2rem">*</span>
                  <span
                    style="font-size: 0.88rem; color: black; font-weight: bold"
                    >用户角色</span
                  >
                    >用户角色
                  </span>
                </div>
              </template>
              <el-select
@@ -415,6 +425,7 @@
                size="small"
              >
                <el-option
                  :disabled="item.value == 20"
                  v-for="item in groupOptions"
                  :key="item.value"
                  :label="item.label"
@@ -424,7 +435,32 @@
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item>
            <el-form-item prop="roleName">
              <template #label>
                <div style="display: flex; align-items: flex-end">
                  <span style="color: red; margin-right: 0.2rem">*</span>
                  <span
                    style="font-size: 0.88rem; color: black; font-weight: bold"
                    >用户类型
                  </span>
                </div>
              </template>
              <el-select
                v-model="formUser.roleName"
                placeholder="请选择"
                size="small"
              >
                <el-option
                  v-for="item in roleNameList"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                />
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item prop="enable">
              <template #label>
                <div style="display: flex; align-items: flex-end">
                  <span style="color: red; margin-right: 0.2rem">*</span>
@@ -458,25 +494,32 @@
                  <span
                    style="font-size: 0.88rem; color: black; font-weight: bold"
                    >人脸图片</span
                  ><span
                  >
                  <!-- <span
                    style="
                      color: rgba(255, 0, 0, 1);
                      font-size: 0.75rem;
                      margin-left: 0.5rem;
                    "
                    >注：最多可上传三张，图片需要正规的人像证件照</span
                  >
                  > -->
                </div>
              </template>
              <el-upload
                ref="uploadRef"
                name="files"
                class="avatar-uploader"
                action="#"
                action="http://115.159.85.185:9098/api/User/SaveFiles"
                list-type="picture-card"
                :auto-upload="false"
                limit="1"
                :auto-upload="true"
                @before-upload="beforeAvatarUpload"
                :on-change="handleAvatarSuccess"
                :on-success="handleAvatarSuccess"
                :file-list="fileList != [] ? fileList : []"
              >
                <el-icon><Plus /></el-icon>
                <el-icon>
                  <Plus />
                </el-icon>
                <template #file="{ file }">
                  <div>
                    <img
@@ -496,14 +539,18 @@
                        class="el-upload-list__item-delete"
                        @click="handleDownload(file)"
                      >
                        <el-icon size="15"><Download /></el-icon>
                        <el-icon size="15">
                          <Download />
                        </el-icon>
                      </span>
                      <span
                        v-if="!disabled"
                        class="el-upload-list__item-delete"
                        @click="handleRemove(file)"
                      >
                        <el-icon size="15"><Delete /></el-icon>
                        <el-icon size="15">
                          <Delete />
                        </el-icon>
                      </span>
                    </span>
                  </div>
@@ -525,7 +572,7 @@
          <el-button
            size="small"
            type="primary"
            @click="saveObj"
            @click="saveObj(formUserRef)"
            style="height: 2rem; font-size: 0.88rem"
          >
            ä¿å­˜
@@ -558,7 +605,7 @@
        </div>
      </template>
      <el-form
        :model="formpassword"
        :model="formUser"
        label-width="auto"
        label-position="top"
        ref="formpasswordRef"
@@ -585,11 +632,11 @@
            </div>
          </el-col>
        </el-row>
        <el-form-item prop="password">
        <el-form-item prop="newPwd">
          <el-input
            style="margin-top: 1rem"
            size="large"
            v-model="formpassword.password"
            v-model="formUser.newPwd"
            placeholder="请输入"
          />
        </el-form-item>
@@ -623,6 +670,7 @@
      :before-close="handleClose"
      :show-close="false"
      :align-center="true"
      @close="resetForm1(formRoleRef)"
    >
      <template #title>
        <div
@@ -717,7 +765,7 @@
  </div>
</template>
<script setup>
import { ref, reactive, onMounted } from "vue";
import { ref, reactive, onMounted, toRef } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import {
  GetUserList,
@@ -726,6 +774,10 @@
  DelApi,
  ExportApi,
  ExportApi1,
  UpdatePassword,
  UpdatePwd,
  AddUserApi,
  EditUserApi,
} from "@/api/user";
import { useRouter } from "vue-router";
import { formatTime } from "@/utils/index.js";
@@ -736,17 +788,19 @@
  UpdateRoleApi,
  DeleteRoleApi,
} from "@/api/role";
const queryForm = reactive({
let obj = {
  selectName: "",
  selectTime: [], // æ—¶é—´èŒƒå›´
  selectType: "",
  selectInput: "",
});
};
const queryForm = toRef({ ...obj });
const router = useRouter();

const tableData = ref([]);
const grideData = ref([{ id: 1 }]);
const formRef = ref();
const grideData = ref([]);
//新建用户ref
const formUserRef = ref();
const options = ref([]);
const props = { multiple: true };
const isoptins = ref([
@@ -758,17 +812,16 @@
]);
//分组
const groupOptions = ref([
  { value: 1, label: "超级管理员" },
  { value: 2, label: "质检组" },
  { value: 3, label: "电气组" },
  { value: 4, label: "机械组" },
  { value: 5, label: "地沟组" },
  { value: 20, label: "超级管理员" },
  { value: 21, label: "质检组" },
  { value: 22, label: "电气组" },
  { value: 23, label: "机械组" },
  { value: 24, label: "地沟组" },
]);
const table = ref(false);
const formUser = ref({
  user_Id: undefined,
  userName: "",
  role_Id: 2,
  role_Id: 21,
  roleName: "",
  phoneNo: "",
  remark: "",
@@ -777,14 +830,47 @@
  dept_Id: 0,
  enable: 1,
  headImageUrl: "",
  createDate: formatTime(new Date()), //创建时间
  creater: JSON.parse(localStorage.getItem("user")).userName, //创建人
  newPwd: "",
});
const userform = reactive({
  userName: "",
  description: "",
const rules = reactive({
  userName: {
    required: true,
    message: "请输入用户名",
    trigger: "blur",
  },
  role_Id: {
    required: true,
    message: "请选择角色",
    trigger: "change",
  },
  newPwd: [
    {
      required: true,
      message: "请输入密码",
      trigger: "blur",
    },
  ],
  realName: {
    required: true,
    message: "请输入姓名",
    trigger: "blur",
  },
  phoneNo: {
    required: true,
    message: "请输入手机号",
    trigger: "blur",
  },
  userTrueName: {
    required: true,
    message: "请输入真实姓名",
    trigger: "blur",
  },
});

const formpasswordRef = ref();
const isactive = ref(1);
const claimdialogVisible = ref(false);
const dialogVisible = ref(false);
const imgdialogVisible = ref(false);
const dialogImageUrl = ref("");
@@ -792,27 +878,7 @@
const dialogVisible1 = ref(false);
//用户角色新建
const dialogVisible2 = ref(false);
const TorquedialogVisible = ref(false);
//分页请求参数
const pageQuery = ref({
  page: 1, //当前页面
  rows: 10, //每页显示条数
  order: "desc", //排序方式
  sort: "createDate", //排序字段
  wheres: "", //条件查询
});

const changeactive = (index) => {
  isactive.value = index;
  if (isactive.value == 1) {
    selectoptions.value = userOptions;
    initData();
  } else {
    selectoptions.value = roleOptions;
    getRole();
  }
};

//筛选条件
const userOptions = [
  {
    value: "userName",
@@ -827,7 +893,18 @@
    label: "联系方式",
  },
];

const fileList = ref([]);
const roleNameList = ref([
  { value: "电气质检", label: "电气质检" },
  { value: "机械质检", label: "机械质检" },
  { value: "地沟质检", label: "地沟质检" },
  { value: "电气力矩", label: "电气力矩" },
  { value: "电气辅助", label: "电气辅助" },
  { value: "机械力矩", label: "机械力矩" },
  { value: "机械辅助", label: "机械辅助" },
  { value: "地沟力矩", label: "地沟力矩" },
  { value: "地沟辅助", label: "地沟辅助" },
]);
const roleOptions = [
  {
    value: "roleName",
@@ -836,27 +913,70 @@
];
const selectoptions = ref([]);
selectoptions.value = userOptions;
//用户修改密码
const formpassword = ref({
  password: "",
  oldPwd: "",
  newPwd: "",
});
const passwordrules = reactive({
  password: {
    required: true,
    message: "请输入密码",
    trigger: "blur",
  },
  newPwd: [
    {
      required: true,
      message: "请输入密码",
      trigger: "blur",
    },
    {
      min: 6,
      max: 12,
      message: "密码长度在 6 åˆ° 12 ä¸ªå­—符",
      trigger: "blur",
    },
  ],
});

const uploadRef = ref();
// //用户修改密码
// const handleUpdatePassword = (row) => {
//   dialogVisible1.value = true;
//   formUser.value = Object.assign({}, row);
// };
// const UpdatePassword = () => {
//   formpasswordRef.value.validate((valid) => {
//     if (valid) {
//       UpdatePassword({
//         user_Id: formUser.value.user_Id,
//         oldPwd: formpassword.value.oldPwd,
//         newPwd: formpassword.value.newPwd,
//       }).then((res) => {
//         if (res.code == 200) {
//           ElMessage({
//             message: "修改成功",
//             type: "success",
//           });
//           dialogVisible1.value = false;
//           initData();
//         } else {
//           ElMessage({
//             message: res.msg,
//             type: "error",
//           });
//         }
//       });
//     }
//   });
// };

const pageTotal = ref(0);
//登录记录
const initData = () => {
  // æŸ¥è¯¢æ¡ä»¶
  const startTime = formatTime(queryForm.selectTime[0]);
  const endTime = formatTime(queryForm.selectTime[1]);
  const startTime = formatTime(queryForm.value.selectTime[0]);
  const endTime = formatTime(queryForm.value.selectTime[1]);
  const filter = [
    {
      name: "",
      value: queryForm.selectType,
      displayType: "int",
      name: queryForm.value.selectType,
      value: queryForm.value.selectInput,
      displayType: "like",
    },
    { name: "createDate", value: startTime, displayType: "ThanOrEqual" },
    { name: "createDate", value: endTime, displayType: "LessOrEqual" },
@@ -869,56 +989,112 @@
    pageTotal.value = res.total;
  });
};
//分页请求参数
const pageQuery = ref({
  page: 1, //当前页面
  rows: 10, //每页显示条数
  order: "desc", //排序方式
  sort: "", //排序字段
  wheres: "", //条件查询
});

//数据检索事件
const handleQuery = () => {
  pageQuery.value.page = 1;
  initData();
  if (isactive.value == 1) {
    initData();
  } else {
    getRole();
  }
};

//重置查询条件
const resetQuery = () => {
  queryForm.selectName = "";
  queryForm.selectInput = "";
  queryForm.selectTime = [];
  queryForm.selectType = "";
  queryForm.value = Object.assign({}, obj);
  pageQuery.value.page = 1;
  initData();
  if (isactive.value == 1) {
    initData();
  } else {
    getRole();
  }
};
//分页页面大小改变
const handleSizeChange = (val) => {
  pageQuery.value.rows = val;
  initData();
  if (isactive.value == 1) {
    initData();
  } else {
    getRole();
  }
};

//分页页面改变
const handleCurrentChange = (val) => {
  pageQuery.value.page = val;
  initData();
  if (isactive.value == 1) {
    initData();
  } else {
    getRole();
  }
};
//分页页面大小改变
const RoleSizeChange = (val) => {
  pageQuery.value.rows = val;
  getRole();
const handleAvatarSuccess = (val) => {
  formUser.value.headImageUrl = "/image/" + val.data;
};
//重置表单
const resetForm = (formEl) => {
  if (!formEl) return;
  formEl.resetFields();
  formUser.value = {
    user_Id: undefined,
    userName: "",
    role_Id: 21,
    roleName: "",
    phoneNo: "",
    remark: "",
    userPwd: "123456",
    userTrueName: "",
    dept_Id: 0,
    enable: 1,
    headImageUrl: "",
    newPwd: "",
  };
  fileList.value = [];
};
const resetForm1 = (formEl) => {
  if (!formEl) return;
  formEl.resetFields();
  formRole.value = {
    roleName: "",
    description: "",
  };
};

//分页页面改变
const RoleCurrentChange = (val) => {
  pageQuery.value.page = val;
  getRole();
};
const handlePictureCardPreview = (uploadFile) => {
  dialogImageUrl.value = uploadFile.url;
  imgdialogVisible.value = true;
};
const handleAvatarSuccess = (val) => {
  console.log(val);
const handleRemove = (val) => {
  fileList.value = [];
  //移除已上传的图片
  formUser.value.headImageUrl = "";
};
const beforeAvatarUpload = (val) => {
  console.log(val);
};
// const submitUpload = () => {
//   let promise = new Promise((resolve, reject) => {
//     setTimeout(async () => {
//       await uploadRef.value.submit();
//       resolve("上传成功");
//     });
//   });
//   return promise;
// };

//新建用户账号
const saveObj = () => {
  formRef.value.validate((valid) => {
const saveObj = async (formEl) => {
  // submitUpload();
  if (!formEl) return;
  await formEl.validate((valid, fields) => {
    if (valid) {
      if (formUser.value.user_Id != undefined) {
        UpdateUser(formUser.value).then((res) => {
@@ -933,6 +1109,8 @@
          initData();
        });
      }
    } else {
      console.log("error submit!", fields);
    }
  });
};
@@ -958,26 +1136,47 @@
};
//编辑用户账号
const Edit = (val) => {
  console.log(val);
  let obj = Object.assign({}, val);
  formUser.value = {
    ...obj,
  };
  if (obj.headImageUrl != "") {
    fileList.value = [
      {
        name: "1",
        url: "http://115.159.85.185:9098" + obj.headImageUrl,
      },
    ];
  }

  dialogVisible.value = true;
  formUser.value = obj;
};
const newobj = ref({});
//修改密码
const Editpassword = (val) => {
  let obj = Object.assign({}, val);
  formUser.value = obj;
  formpassword.value = val;
  newobj.value = val;
  newobj.value = Object.assign({}, val);
  console.log(newobj.value);

  dialogVisible1.value = true;
};
//保存修改密码
const savePassword = async (formEl) => {
  let obj = Object.assign({}, newobj);
  obj.password = formpassword.value.password;
  // obj.password = formpassword.value.password;
  console.log(formUser.value);

  let formdata = {
    id: formUser.value.user_Id,
    oldPwd: formUser.value.userPwd,
    newPwd: formUser.value.newPwd,
  };
  if (!formEl) return;
  await formEl.validate((valid, fields) => {
    if (valid) {
      UpdateUser(obj).then((res) => {
      UpdatePwd(formdata).then((res) => {
        ElMessage({ message: "修改密码成功", type: "success" });
        dialogVisible1.value = false;
        initData();
@@ -1003,7 +1202,10 @@
const formRole = ref({
  roleName: "",
  description: "",
  createDate: formatTime(new Date()), //创建时间
  creater: JSON.parse(localStorage.getItem("user")).userName, //创建人
});

//新建角色
const AddRole = () => {
  Roletype.value = "新建";
@@ -1040,42 +1242,38 @@
  formRole.value = obj;
  dialogVisible2.value = true;
};
//获取角色
const getRole = () => {
  GetPageDataApi({
    page: 1,
    rows: 10,
    total: 100,
    tableName: "",
    sort: "",
    order: "",
    wheres: "",
    export: true,
    value: "",
    filter: [
      {
        name: "string",
        value: "string",
        displayType: "string",
      },
    ],
  }).then((res) => {
  const startTime = formatTime(queryForm.value.selectTime[0]);
  const endTime = formatTime(queryForm.value.selectTime[1]);
  const filter = [
    {
      name: queryForm.value.selectType,
      value: queryForm.value.selectInput,
      displayType: "like",
    },
    { name: "createDate", value: startTime, displayType: "ThanOrEqual" },
    { name: "createDate", value: endTime, displayType: "LessOrEqual" },
  ];
  GetPageDataApi({ ...pageQuery.value, filter }).then((res) => {
    grideData.value = res.rows;
    pageTotal.value = res.total;
  });
};
//打印数据
const printExcel = () => {
  // æŸ¥è¯¢æ¡ä»¶
  const startTime = formatTime(queryForm.selectTime[0]);
  const endTime = formatTime(queryForm.selectTime[1]);
  const startTime = formatTime(queryForm.value.selectTime[0]);
  const endTime = formatTime(queryForm.value.selectTime[1]);
  const filter = [
    {
      name: queryForm.selectType,
      value: queryForm.selectInput,
      displayType: "String",
      name: queryForm.value.selectType,
      value: queryForm.value.selectInput,
      displayType: "like",
    },
    {
      name: "pustatus",
      value: queryForm.selectName,
      value: queryForm.value.selectName,
      displayType: "String",
    },
    { name: "createDate", value: startTime, displayType: "ThanOrEqual" },
@@ -1094,6 +1292,17 @@
    });
  }
};
//切换页面
const changeactive = (index) => {
  isactive.value = index;
  if (isactive.value == 1) {
    selectoptions.value = userOptions;
    initData();
  } else {
    selectoptions.value = roleOptions;
    getRole();
  }
};

//批量删除
const ids = ref([]);
@@ -1106,6 +1315,10 @@
  ids.value = val.map((item) => item.roleId);
};
const deleteAll = () => {
  if (ids.value.includes(1)) {
    ElMessage({ message: "超级管理员不能删除", type: "error" });
    return;
  }
  if (ids.value.length == 0) {
    ElMessage({ message: "请选择要删除的数据", type: "error" });
    return;
@@ -1122,6 +1335,11 @@
    });
  }
};
//管理
//路由跳转
const toDetail = (row) => {
  router.push({ name: "permission", state: { info: JSON.stringify(row) } });
};

onMounted(() => {
  initData();
@@ -1131,16 +1349,19 @@
.Usermanagement {
  display: flex;
  background-color: #fff;

  .content {
    width: 100%;
    display: flex;
    flex-direction: column;

    .checkbox {
      width: 11rem;
      display: flex;
      justify-content: space-between;
      margin-top: 1rem;
      margin-left: 1.31rem;

      .item {
        width: 5rem;
        height: 1.88rem;
@@ -1152,20 +1373,24 @@
        line-height: 1.88rem;
        cursor: pointer;
      }

      .isactive {
        background-color: rgba(16, 16, 16, 1);
        color: rgba(255, 255, 255, 1);
      }
    }

    .serch {
      display: flex;
      margin-top: 1.31rem;
      align-items: center;

      .time_box {
        display: flex;
        align-items: center;
        text-align: center;
        margin-left: 0.98rem;

        .time {
          box-sizing: border-box;
          width: 6.88rem;
@@ -1179,12 +1404,14 @@
          justify-content: center;
        }
      }

      .serch_box {
        display: flex;
        align-items: center;
        text-align: center;
        margin-left: 0.98rem;
        border-radius: 0.38rem;

        .serchb {
          box-sizing: border-box;
          width: 6.88rem;
@@ -1195,6 +1422,7 @@
          align-items: center;
          justify-content: center;
        }

        input {
          box-sizing: border-box;
          outline: none;
@@ -1207,6 +1435,7 @@
        }
      }
    }

    .btns {
      display: flex;
      justify-content: space-between;
@@ -1217,17 +1446,20 @@
      box-sizing: border-box;
    }
  }

  .my-header {
    height: 3.84rem;
    display: flex;
    justify-content: space-between;
    border-bottom: 0.06rem solid rgba(233, 233, 233, 1);
  }

  .avatar-uploader .avatar {
    width: 7rem;
    height: 7rem;
    display: block;
  }

  :deep(.avatar-uploader .el-upload) {
    width: 7rem;
    height: 7rem;
@@ -1238,10 +1470,12 @@
    overflow: hidden;
    transition: var(--el-transition-duration-fast);
  }

  :deep(.el-upload-list__item) {
    width: 7rem;
    height: 7rem;
  }

  .avatar-uploader .el-upload:hover {
    border-color: var(--el-color-primary);
  }
@@ -1259,6 +1493,7 @@
.confirmButtonClass {
  margin-right: 10px;
}

.el-message-box .el-message-box__btns {
  flex-direction: row-reverse !important;
  justify-content: normal !important;