refactor(front): 重构前端组件和 API

- 更新了多个组件的样式和结构
- 重命名了一些 API 文件
- 添加了新的 API 接口
- 优化了部分代码的可读性和性能

cutejava-front/src/views/system/user/center.vue

@@ -9,7 +9,12 @@
           <div>
             <div style="text-align: center">
               <div class="el-upload">
-                <img :src="user.avatarName ? baseApi + '/avatar/' + user.avatarName : Avatar" title="点击上传头像" class="avatar" @click="toggleShow">
+                <img
+                  :src="user.avatarName ? baseApi + '/avatar/' + user.avatarName : Avatar"
+                  title="点击上传头像"
+                  class="avatar"
+                  @click="toggleShow"
+                >
                 <myUpload
                   v-model="show"
                   :headers="headers"
@@ -19,13 +24,36 @@
               </div>
             </div>
             <ul class="user-info">
-              <li><div style="height: 100%"><svg-icon icon-class="login" /> 登录账号<div class="user-right">{{ user.username }}</div></div></li>
-              <li><svg-icon icon-class="user1" /> 用户昵称 <div class="user-right">{{ user.nickName }}</div></li>
-              <li><svg-icon icon-class="dept" /> 所属部门 <div class="user-right"> {{ user.dept.name }}</div></li>
-              <li><svg-icon icon-class="phone" /> 手机号码 <div class="user-right">{{ user.phone }}</div></li>
-              <li><svg-icon icon-class="email" /> 用户邮箱 <div class="user-right">{{ user.email }}</div></li>
               <li>
-                <svg-icon icon-class="anq" /> 安全设置
+                <div style="height: 100%">
+                  <svg-icon icon-class="login" />
+                  登录账号
+                  <div class="user-right">{{ user.username }}</div>
+                </div>
+              </li>
+              <li>
+                <svg-icon icon-class="user1" />
+                用户昵称
+                <div class="user-right">{{ user.nickName }}</div>
+              </li>
+              <li>
+                <svg-icon icon-class="dept" />
+                所属部门
+                <div class="user-right"> {{ user.dept.name }}</div>
+              </li>
+              <li>
+                <svg-icon icon-class="phone" />
+                手机号码
+                <div class="user-right">{{ user.phone }}</div>
+              </li>
+              <li>
+                <svg-icon icon-class="email" />
+                用户邮箱
+                <div class="user-right">{{ user.email }}</div>
+              </li>
+              <li>
+                <svg-icon icon-class="anq" />
+                安全设置
                 <div class="user-right">
                   <a @click="$refs.pass.dialog = true">修改密码</a>
                   <a @click="$refs.email.dialog = true">修改邮箱</a>
@@ -40,7 +68,14 @@
         <el-card class="box-card">
           <el-tabs v-model="activeName" @tab-click="handleClick">
             <el-tab-pane label="用户资料" name="first">
-              <el-form ref="form" :model="form" :rules="rules" style="margin-top: 10px;" size="small" label-width="65px">
+              <el-form
+                ref="form"
+                :model="form"
+                :rules="rules"
+                style="margin-top: 10px;"
+                size="small"
+                label-width="65px"
+              >
                 <el-form-item label="昵称" prop="nickName">
                   <el-input v-model="form.nickName" style="width: 35%" />
                   <span style="color: #C0C0C0;margin-left: 10px;">用户昵称不作为登录使用</span>
@@ -78,7 +113,10 @@
                   align="right"
                 >
                   <template slot="header">
-                    <div style="display:inline-block;float: right;cursor: pointer" @click="init">创建日期<i class="el-icon-refresh" style="margin-left: 40px" /></div>
+                    <div style="display:inline-block;float: right;cursor: pointer" @click="init">创建日期<i
+                      class="el-icon-refresh"
+                      style="margin-left: 40px"
+                    /></div>
                   </template>
                   <template slot-scope="scope">
                     <span>{{ scope.row.createTime }}</span>
@@ -111,10 +149,11 @@ import updatePass from './center/updatePass'
 import updateEmail from './center/updateEmail'
 import { getToken } from '@/utils/auth'
 import store from '@/store'
-import { isvalidPhone } from '@/utils/validate'
+import { isvalidPhone } from '@/utils/CsValidateUtil'
 import crud from '@/mixins/crud'
 import { editUser } from '@/api/system/user'
 import Avatar from '@/assets/images/avatar.png'
+
 export default {
   name: 'Center',
   components: { updatePass, updateEmail, myUpload },
@@ -159,7 +198,8 @@ export default {
   },
   created() {
     this.form = { id: this.user.id, nickName: this.user.nickName, gender: this.user.gender, phone: this.user.phone }
-    store.dispatch('GetInfo').then(() => {})
+    store.dispatch('GetInfo').then(() => {
+    })
   },
   methods: {
     toggleShow() {
@@ -175,7 +215,8 @@ export default {
       return true
     },
     cropUploadSuccess(jsonData, field) {
-      store.dispatch('GetInfo').then(() => {})
+      store.dispatch('GetInfo').then(() => {
+      })
     },
     doSubmit() {
       if (this.$refs['form']) {
@@ -184,7 +225,8 @@ export default {
             this.saveLoading = true
             editUser(this.form).then(() => {
               this.editSuccessNotify()
-              store.dispatch('GetInfo').then(() => {})
+              store.dispatch('GetInfo').then(() => {
+              })
               this.saveLoading = false
             }).catch(() => {
               this.saveLoading = false
@@ -198,24 +240,28 @@ export default {
 </script>
 
 <style rel="stylesheet/scss" lang="scss">
-  .avatar {
-    width: 120px;
-    height: 120px;
-    border-radius: 50%;
+.avatar {
+  width: 120px;
+  height: 120px;
+  border-radius: 50%;
+}
+
+.user-info {
+  padding-left: 0;
+  list-style: none;
+
+  li {
+    border-bottom: 1px solid #F0F3F4;
+    padding: 11px 0;
+    font-size: 13px;
   }
-  .user-info {
-    padding-left: 0;
-    list-style: none;
-    li{
-      border-bottom: 1px solid #F0F3F4;
-      padding: 11px 0;
-      font-size: 13px;
-    }
-    .user-right {
-      float: right;
-      a{
-        color: #317EF3;
-      }
+
+  .user-right {
+    float: right;
+
+    a {
+      color: #317EF3;
     }
   }
+}
 </style>