新增、编辑角色

src/api/admin.js

@@ -45,10 +45,11 @@ export function updateUser(param) {
   })
 }
 
-export function getUser(userId) {
+export function getUser(params) {
   return request({
     url: `/user/getUser`,
-    method: 'get'
+    method: 'get',
+    params
   })
 }
 

src/components/toggleRole/index.vue

@@ -13,17 +13,20 @@
     :show-close="false"
     :before-close="cancel"
   >
-    <el-radio-group v-model="form.userRoleId" class="roles" v-if="hasRole">
+    <template v-if="hasRole">
-      <el-radio
+      <el-radio-group v-model="form.userRoleId" class="roles">
-        v-for="item in roles"
+        <el-radio
-        :key="item.Id"
+          v-for="item in roles"
-        :label="item.Id"
+          :key="item.Id"
-        :disabled="item.isUserRoleDisabled"
+          :label="item.Id"
-        style="margin-bottom: 10px"
+          :disabled="item.isUserRoleDisabled"
-      >
+          style="margin-bottom: 10px"
-        {{ item.UserTypeShortName }}
+        >
-      </el-radio>
+          {{ item.UserTypeShortName }}
-    </el-radio-group>
+        </el-radio>
+      </el-radio-group>
+    </template>
+
     <div v-else style="text-align: center">
       {{ $t('toggleRole:tip:noRole') }}
     </div>
@@ -101,4 +104,13 @@ export default {
   justify-content: center;
   flex-wrap: wrap;
 }
+
+/deep/ .el-radio__original {
+  display: none !important; /* 隐藏原生 radio 输入，但仍然允许交互 */
+}
+
+/deep/.el-radio:focus:not(.is-focus):not(:active):not(.is-disabled)
+  .el-radio__inner {
+  box-shadow: none !important;
+}
 </style>

src/layout/components/Navbar.vue

@@ -69,7 +69,7 @@ export default {
     ...mapGetters(['sidebar', 'name', 'device'])
   },
   created() {
-    this.isReviewer = JSON.parse(zzSessionStorage.getItem('IsReviewer'))
+    // this.isReviewer = JSON.parse(zzSessionStorage.getItem('IsReviewer'))
   },
   methods: {
     ...mapMutations({ setLanguage: 'lang/setLanguage' }),

src/views/admin/user/components/UserInfo.vue

@@ -5,7 +5,7 @@
     :model="user"
     :rules="userFormRules"
     label-width="150px"
-    style="width:800px;"
+    style="width: 800px"
   >
     <el-card class="Basic" shadow="never" size="small">
       <div slot="header" class="clearfix">
@@ -25,7 +25,7 @@
       <el-form-item label="Given Name: " prop="FirstName">
         <el-input v-model="user.FirstName" />
       </el-form-item>
-      <el-form-item label="Gender: " prop="Sex" style="margin-right:40px;">
+      <el-form-item label="Gender: " prop="Sex" style="margin-right: 40px">
         <el-radio-group v-model="user.Sex">
           <el-radio :label="1">Male</el-radio>
           <el-radio :label="0">Female</el-radio>
@@ -37,13 +37,24 @@
       <el-form-item label="Phone: " prop="Phone">
         <el-input v-model="user.Phone" />
       </el-form-item>
-      <el-form-item v-if="type==1" label="Disable:">
+      <el-form-item v-if="type == 1" label="Disable:">
-        <el-switch v-model="user.Status" :active-value="0" :inactive-value="1" />
+        <el-switch
+          v-model="user.Status"
+          :active-value="0"
+          :inactive-value="1"
+        />
       </el-form-item>
       <el-form-item label="User Type: " prop="UserTypeId">
-        <el-select ref="userType" v-model="user.UserTypeId" size="small" placeholder="Please select" style="width:100%;" :disabled="user.CanEditUserType === false">
+        <el-select
+          ref="userType"
+          v-model="user.UserTypeId"
+          size="small"
+          placeholder="Please select"
+          style="width: 100%"
+          :disabled="user.CanEditUserType === false"
+        >
           <el-option
-            v-for="(userType,key) of userTypeOptions"
+            v-for="(userType, key) of userTypeOptions"
             :key="key"
             :label="userType.UserType"
             :value="userType.Id"
@@ -52,17 +63,28 @@
       </el-form-item>
     </el-card>
 
-    <el-card class="Affiliation" shadow="never" style="margin-top:10px;" size="small">
+    <el-card
+      class="Affiliation"
+      shadow="never"
+      style="margin-top: 10px"
+      size="small"
+    >
       <div slot="header" class="clearfix">
         <span>Affiliation</span>
       </div>
       <el-form-item prop="IsZhiZhun">
-        <el-radio-group v-model="user.IsZhiZhun" @change="OrgnizationTypeChanged">
+        <el-radio-group
+          v-model="user.IsZhiZhun"
+          @change="OrgnizationTypeChanged"
+        >
           <el-radio :label="true">Internal</el-radio>
           <el-radio :label="false">External</el-radio>
         </el-radio-group>
       </el-form-item>
-      <el-form-item v-show="user.IsZhiZhun === false" label="Organization Name: ">
+      <el-form-item
+        v-show="user.IsZhiZhun === false"
+        label="Organization Name: "
+      >
         <el-input v-model="user.OrganizationName" />
       </el-form-item>
 
@@ -78,19 +100,24 @@
         type="primary"
         size="small"
         :disabled="isDisabled"
-        style="margin:10px 15px"
+        style="margin: 10px 15px"
         @click="handleSave"
-      >Save</el-button>
+        >Save</el-button
+      >
     </el-form-item>
-
   </el-form>
 </template>
 <script>
-import { getUser, addUser, updateUser, getUserTypeListByUserType } from '@/api/admin.js'
+import {
+  getUser,
+  addUser,
+  updateUser,
+  getUserTypeListByUserType,
+} from '@/api/admin.js'
 export default {
   name: 'UserInfo',
   props: {
-    userId: { type: String, default: '' }
+    userId: { type: String, default: '' },
   },
   data() {
     return {
@@ -105,60 +132,69 @@ export default {
         IsZhiZhun: '',
         OrganizationName: '',
         DepartmentName: '',
-        PositionName: ''
+        PositionName: '',
       },
       userFormRules: {
         UserName: [
           { required: true, message: 'Please specify', trigger: 'blur' },
-          { max: 50, message: 'The maximum length is 50' }
+          { max: 50, message: 'The maximum length is 50' },
         ],
         UserTypeId: [
-          { required: true, message: 'Please Select', trigger: ['blur', 'change'] }
+          {
+            required: true,
+            message: 'Please Select',
+            trigger: ['blur', 'change'],
+          },
         ],
         IsZhiZhun: [
-          { required: true, message: 'Please Select', trigger: ['blur', 'change'] }
+          {
+            required: true,
+            message: 'Please Select',
+            trigger: ['blur', 'change'],
+          },
         ],
         OrganizationName: [
-          { required: true, message: 'Please specify', trigger: 'blur' }
+          { required: true, message: 'Please specify', trigger: 'blur' },
         ],
         LastName: [
           { required: true, message: 'Please specify', trigger: 'blur' },
-          { max: 50, message: 'The maximum length is 50' }
+          { max: 50, message: 'The maximum length is 50' },
         ],
         FirstName: [
           { required: true, message: 'Please specify', trigger: 'blur' },
-          { max: 50, message: 'The maximum length is 50' }
+          { max: 50, message: 'The maximum length is 50' },
         ],
         Phone: [
-          { max: 20, min: 7, message: 'The length is 7 to 20', trigger: ['blur'] }
+          {
+            max: 20,
+            min: 7,
+            message: 'The length is 7 to 20',
+            trigger: ['blur'],
+          },
         ],
         EMail: [
           {
             required: true,
             message: 'Please input the email address',
-            trigger: 'blur'
+            trigger: 'blur',
           },
           {
             type: 'email',
             message: 'Please input the correct email address',
-            trigger: ['blur']
+            trigger: ['blur'],
           },
-          { max: 50, message: 'The maximum length is 50' }
+          { max: 50, message: 'The maximum length is 50' },
-        ],
-        Sex: [
-          { required: true, message: 'Please specify', trigger: 'blur' }
         ],
+        Sex: [{ required: true, message: 'Please specify', trigger: 'blur' }],
         Status: [
-          { required: true, message: 'Please specify', trigger: 'blur' }
+          { required: true, message: 'Please specify', trigger: 'blur' },
         ],
-        DepartmentName: [
+        DepartmentName: [{ max: 50, message: 'The maximum length is 50' }],
-          { max: 50, message: 'The maximum length is 50' }],
+        PositionName: [{ max: 50, message: 'The maximum length is 50' }],
-        PositionName: [{ max: 50, message: 'The maximum length is 50' }
-        ]
       },
       userTypeOptions: [],
       isDisabled: false,
-      type: 0 // 1为编辑，0为新增
+      type: 0, // 1为编辑，0为新增
     }
   },
   created() {
@@ -172,46 +208,58 @@ export default {
   },
   methods: {
     handleSave() {
-      this.$refs.userForm.validate(valid => {
+      this.$refs.userForm.validate((valid) => {
         if (valid) {
           this.isDisabled = true
-          const selectedUserType = this.userTypeOptions.filter(item => item.Id === this.user.UserTypeId)
+          const selectedUserType = this.userTypeOptions.filter(
+            (item) => item.Id === this.user.UserTypeId
+          )
           if (selectedUserType.length > 0) {
             this.user.UserTypeEnum = selectedUserType[0].UserTypeEnum
           }
           if (this.user.Id) {
-            updateUser(this.user).then(res => {
+            updateUser(this.user)
-              this.isDisabled = false
+              .then((res) => {
-              this.$message.success('Updated successfully')
+                this.isDisabled = false
-            }).catch(() => { this.isDisabled = false })
+                this.$message.success('Updated successfully')
+              })
+              .catch(() => {
+                this.isDisabled = false
+              })
           } else {
-            addUser(this.user).then(res => {
+            addUser(this.user)
-              this.isDisabled = false
+              .then((res) => {
-              this.user.Id = res.Result.Id
+                this.isDisabled = false
-              this.user.UserCode = res.Result.UserCode
+                this.user.Id = res.Result.Id
-              this.$emit('getUserId', res.Result.Id)
+                this.user.UserCode = res.Result.UserCode
-              this.$message.success('Added successfully')
+                this.$emit('getUserId', res.Result.Id)
-              this.$router.push({ path: '/system/user/list' })
+                this.$message.success('Added successfully')
-            }).catch(() => { this.isDisabled = false })
+                this.$router.push({ path: '/system/user/list' })
+              })
+              .catch(() => {
+                this.isDisabled = false
+              })
           }
         }
       })
     },
     getUserTypeList() {
-      getUserTypeListByUserType(0).then(res => {
+      getUserTypeListByUserType(0).then((res) => {
         if (res.IsSuccess) {
           this.userTypeOptions = res.Result
         }
       })
     },
     getUserInfo() {
-      getUser(this.userId).then(res => {
+      getUser({
+        IdentityUserId: this.userId,
+      }).then((res) => {
         this.user = res.Result
       })
     },
     OrgnizationTypeChanged(val) {
       this.user.OrganizationName = ''
-    }
+    },
-  }
+  },
 }
 </script>

src/views/login/index.vue

@@ -244,6 +244,7 @@
     </el-dialog>
     <browserTip ref="browserTip" />
     <toggleRole
+      v-if="toggleRoleVisible"
       :visible.sync="toggleRoleVisible"
       :loading="toggleRoleLoading"
       @save="loginByRole"
@@ -327,6 +328,7 @@ export default {
     },
   },
   mounted() {
+    zzSessionStorage.clear()
     this.loginType = this.$route.query.loginType
     this.location = this.$route.query.location
     zzSessionStorage.setItem('loginType', this.loginType)

src/views/system/user/components/UserInfo.vue

@@ -5,24 +5,38 @@
     :model="user"
     :rules="userFormRules"
     label-width="150px"
-    style="width:800px;"
+    style="width: 800px"
   >
     <el-card class="Basic" shadow="never" size="small">
       <div slot="header" class="clearfix">
         <span>{{ $t('system:userlist:title:Information') }}</span>
       </div>
-      <el-form-item  v-if="user.UserCode" :label="$t('system:userlist:table:S/N')" prop="UserCode">
+      <el-form-item
+        v-if="user.UserCode"
+        :label="$t('system:userlist:table:S/N')"
+        prop="UserCode"
+      >
         <el-input v-model="user.UserCode" disabled />
       </el-form-item>
 
-      <el-form-item :label="$t('system:userlist:table:UserName')" class="my_new_pwd" prop="UserName">
+      <el-form-item
+        :label="$t('system:userlist:table:UserName')"
+        class="my_new_pwd"
+        prop="UserName"
+      >
         <el-input v-model="user.UserName" />
       </el-form-item>
 
-      <el-form-item :label="$t('system:userlist:table:LastName')" prop="LastName">
+      <el-form-item
+        :label="$t('system:userlist:table:LastName')"
+        prop="LastName"
+      >
         <el-input v-model="user.LastName" />
       </el-form-item>
-      <el-form-item :label="$t('system:userlist:table:FirstName')" prop="FirstName">
+      <el-form-item
+        :label="$t('system:userlist:table:FirstName')"
+        prop="FirstName"
+      >
         <el-input v-model="user.FirstName" />
       </el-form-item>
       <!-- <el-form-item :label="$t('system:userlist:table:Gender')" prop="Sex" style="margin-right:40px;">
@@ -37,44 +51,101 @@
       <el-form-item :label="$t('system:userlist:table:Phone')" prop="Phone">
         <el-input v-model="user.Phone" />
       </el-form-item>
-      <el-form-item v-if="type==1" :label="$t('system:userlist:table:Disable')">
+      <el-form-item
-        <el-switch v-model="user.Status" :active-value="1" :inactive-value="0" />
+        v-if="type == 1"
+        :label="$t('system:userlist:table:Disable')"
+      >
+        <el-switch
+          v-model="user.Status"
+          :active-value="1"
+          :inactive-value="0"
+        />
       </el-form-item>
       <el-form-item :label="$t('system:userlist:table:IsTestUser')">
         <el-radio-group v-model="user.IsTestUser">
-          <el-radio v-for="item of $d.YesOrNo" :label="item.value">{{ item.label }}</el-radio>
+          <el-radio
+            v-for="item of $d.YesOrNo"
+            :key="item.id"
+            :label="item.value"
+            >{{ item.label }}</el-radio
+          >
         </el-radio-group>
       </el-form-item>
-      <el-form-item :label="$t('system:userlist:table:UserType')" prop="UserTypeId">
+      <el-form-item
-        <el-select ref="userType" v-model="user.UserTypeId" size="small" placeholder="Please select" style="width:100%;" :disabled="user.CanEditUserType === false">
+        :label="$t('system:userlist:table:UserType')"
-          <el-option
+        prop="UserTypeId"
-            v-for="(userType,key) of userTypeOptions"
+      >
-            v-if="userType.UserTypeEnum !== 20"
+        <div style="display: flex; align-items: center">
-            :key="key"
+          <el-select
-            :label="userType.UserType"
+            ref="userType"
-            :value="userType.Id"
+            v-model="user.Roles"
-          />
+            size="small"
-        </el-select>
+            placeholder="Please select"
+            multiple
+            style="width: 100%"
+            :disabled="user.CanEditUserType === false || type === 1"
+            @change="handleChange"
+          >
+            <template v-for="(userType, key) of userTypeOptions">
+              <el-option
+                v-if="userType.UserTypeEnum !== 20"
+                :key="key"
+                :label="userType.UserType"
+                :value="userType.Id"
+              />
+            </template>
+          </el-select>
+          <el-button
+            type="primary"
+            size="small"
+            style="margin-left: 5px"
+            v-if="type === 1"
+            @click.stop="openRoleList"
+          >
+            {{ $t('system:userlist:button:roles') }}
+          </el-button>
+        </div>
       </el-form-item>
     </el-card>
 
-    <el-card class="Affiliation" shadow="never" style="margin-top:10px;" size="small">
+    <el-card
+      class="Affiliation"
+      shadow="never"
+      style="margin-top: 10px"
+      size="small"
+    >
       <div slot="header" class="clearfix">
         <span>{{ $t('system:userlist:title:Affiliation') }}</span>
       </div>
       <el-form-item prop="IsZhiZhun">
-        <el-radio-group v-model="user.IsZhiZhun" @change="OrgnizationTypeChanged">
+        <el-radio-group
-          <el-radio :label="true">{{ $t('system:userlist:title:Internal') }}</el-radio>
+          v-model="user.IsZhiZhun"
-          <el-radio :label="false">{{ $t('system:userlist:title:External') }}</el-radio>
+          @change="OrgnizationTypeChanged"
+        >
+          <el-radio :label="true">{{
+            $t('system:userlist:title:Internal')
+          }}</el-radio>
+          <el-radio :label="false">{{
+            $t('system:userlist:title:External')
+          }}</el-radio>
         </el-radio-group>
       </el-form-item>
-      <el-form-item v-show="user.IsZhiZhun === false" :label="$t('system:userlist:table:OrganizationName')">
+      <el-form-item
+        v-show="user.IsZhiZhun === false"
+        :label="$t('system:userlist:table:OrganizationName')"
+      >
         <el-input v-model="user.OrganizationName" />
       </el-form-item>
-      <el-form-item :label="$t('system:userlist:table:Department')" prop="DepartmentName">
+      <el-form-item
+        :label="$t('system:userlist:table:Department')"
+        prop="DepartmentName"
+      >
         <el-input v-model="user.DepartmentName" />
       </el-form-item>
-      <el-form-item :label="$t('system:userlist:table:Position')" prop="PositionName">
+      <el-form-item
+        :label="$t('system:userlist:table:Position')"
+        prop="PositionName"
+      >
         <el-input v-model="user.PositionName" />
       </el-form-item>
     </el-card>
@@ -83,20 +154,34 @@
         type="primary"
         size="small"
         :disabled="isDisabled"
-        style="margin:10px 15px"
+        style="margin: 10px 15px"
         @click="handleSave"
-      >Save</el-button>
+        >Save</el-button
+      >
     </el-form-item>
-
+    <roleList
+      v-if="visible"
+      :visible.sync="visible"
+      :list="user.UserRoleList"
+      :roles.sync="user.Roles"
+      :userTypeOptions="userTypeOptions"
+    />
   </el-form>
 </template>
 <script>
-import { getUser, addUser, updateUser, getUserTypeListByUserType } from '@/api/admin.js'
+import {
+  getUser,
+  addUser,
+  updateUser,
+  getUserTypeListByUserType,
+} from '@/api/admin.js'
+import roleList from './roleList.vue'
 export default {
   name: 'UserInfo',
   props: {
-    userId: { type: String, default: '' }
+    userId: { type: String, default: '' },
   },
+  components: { roleList },
   created() {
     this.getUserTypeList()
     if (this.userId !== '') {
@@ -107,26 +192,42 @@ export default {
     }
   },
   methods: {
-    updateQueryParam(param, newValue,wurl) {
+    openRoleList() {
+      this.visible = true
+    },
+    handleChange(val) {
+      this.user.UserRoleList = []
+      val.forEach((item) => {
+        let data = this.userTypeOptions.find((d) => d.Id === item)
+        this.user.UserRoleList.push({
+          UserTypeEnum: data.UserTypeEnum,
+          UserTypeId: data.Id,
+          IsUserRoleDisabled: false,
+        })
+      })
+    },
+    updateQueryParam(param, newValue, wurl) {
       // 获取当前URL
-      let url = wurl || window.location.href;
+      let url = wurl || window.location.href
 
       // 正则表达式匹配参数
-      let regex = new RegExp('([?&])' + param + '=.*?(&|$)');
+      let regex = new RegExp('([?&])' + param + '=.*?(&|$)')
-      let separator = url.indexOf('?') !== -1 ? '&' : '?';
+      let separator = url.indexOf('?') !== -1 ? '&' : '?'
 
       // 如果参数存在，替换它，如果不存在，添加它
       if (regex.test(url)) {
-        return url.replace(regex, '$1' + param + '=' + newValue + '$2');
+        return url.replace(regex, '$1' + param + '=' + newValue + '$2')
       } else {
-        return url + separator + param + '=' + newValue;
+        return url + separator + param + '=' + newValue
       }
     },
     handleSave() {
-      this.$refs.userForm.validate(valid => {
+      this.$refs.userForm.validate((valid) => {
         if (valid) {
           this.isDisabled = true
-          const selectedUserType = this.userTypeOptions.filter(item => item.Id === this.user.UserTypeId)
+          const selectedUserType = this.userTypeOptions.filter(
+            (item) => item.Id === this.user.UserTypeId
+          )
           let newUrl = this.updateQueryParam('userName', this.user.UserName)
           newUrl = this.updateQueryParam('email', this.user.EMail, newUrl)
           window.history.pushState({ path: newUrl }, '', newUrl)
@@ -136,53 +237,88 @@ export default {
           this.user.BaseUrl = `${location.protocol}//${location.host}/login`
           this.user.RouteUrl = `${location.protocol}//${location.host}/email-recompose`
           if (this.user.Id) {
-            updateUser(this.user).then(res => {
+            updateUser(this.user)
-              this.isDisabled = false
+              .then((res) => {
-              this.$message.success('Updated successfully')
+                this.isDisabled = false
-            }).catch(() => { this.isDisabled = false })
+                this.$message.success('Updated successfully')
+              })
+              .catch(() => {
+                this.isDisabled = false
+              })
           } else {
-            addUser(this.user).then(res => {
+            addUser(this.user)
-              this.isDisabled = false
+              .then((res) => {
-              this.user.Id = res.Result.Id
+                this.isDisabled = false
-              this.user.UserCode = res.Result.UserCode
+                this.user.Id = res.Result.Id
-              this.$emit('getUserId', res.Result.Id)
+                this.user.UserCode = res.Result.UserCode
-              this.$message.success('Added successfully')
+                this.$emit('getUserId', res.Result.Id)
-              this.$router.push({ path: '/system/user/list' })
+                this.$message.success('Added successfully')
-            }).catch(() => { this.isDisabled = false })
+                this.$router.push({ path: '/system/user/list' })
+              })
+              .catch(() => {
+                this.isDisabled = false
+              })
           }
         }
       })
     },
     getUserTypeList() {
-      getUserTypeListByUserType(0).then(res => {
+      getUserTypeListByUserType(0).then((res) => {
         if (res.IsSuccess) {
           this.userTypeOptions = res.Result
         }
       })
     },
     getUserInfo() {
-      getUser(this.userId).then(res => {
+      getUser({
+        IdentityUserId: this.userId,
+      }).then((res) => {
         this.user = res.Result
+        this.user.Roles = []
+        this.user.UserRoleList = []
+        res.Result.AccountList.forEach((item) => {
+          if (!item.IsUserRoleDisabled) {
+            this.user.Roles.push(item.UserTypeId)
+          }
+          this.user.UserRoleList.push({
+            UserTypeEnum: item.UserTypeEnum,
+            UserTypeId: item.UserTypeId,
+            IsUserRoleDisabled: item.IsUserRoleDisabled,
+            UserTypeShortName: item.UserTypeShortName,
+          })
+        })
       })
     },
     OrgnizationTypeChanged(val) {
       this.user.OrganizationName = ''
-    }
+    },
   },
   data() {
     var validatePassword = (rule, value, callback) => {
-      var lang = zzSessionStorage.getItem('lang')?zzSessionStorage.getItem('lang'):'zh'
+      var lang = zzSessionStorage.getItem('lang')
+        ? zzSessionStorage.getItem('lang')
+        : 'zh'
       /* eslint-disable */
-      var reg1 = /^[a-zA-Z0-9_]{4,16}$/; //密码必须是8位以上、必须含有字母、数字、特殊符号
+      var reg1 = /^[a-zA-Z0-9_]{4,16}$/ //密码必须是8位以上、必须含有字母、数字、特殊符号
       console.log(!reg1.test(value))
       if (!reg1.test(value)) {
-        callback(lang==='zh' ? new Error("1）新建账号，用户名字符长度最小为4个字符，最大为16个字符，只可使用字母、数字、下划线；") : new Error('For a new account, the username must have:1) At least 4 characters;2) At most 16 characters;3)Only letters, numbers, and underscores are allowed.'))
+        callback(
+          lang === 'zh'
+            ? new Error(
+                '1）新建账号，用户名字符长度最小为4个字符，最大为16个字符，只可使用字母、数字、下划线；'
+              )
+            : new Error(
+                'For a new account, the username must have:1) At least 4 characters;2) At most 16 characters;3)Only letters, numbers, and underscores are allowed.'
+              )
+        )
       } else {
-        callback();
+        callback()
       }
     }
     return {
       user: {
+        Roles: [],
+        UserRoleList: [],
         UserName: '',
         LastName: '',
         FirstName: '',
@@ -194,65 +330,75 @@ export default {
         OrganizationName: '',
         DepartmentName: '',
         PositionName: '',
-        IsTestUser: false
+        IsTestUser: false,
       },
+      visible: false,
       userFormRules: {
         UserName: [
-          { required: true, validator: validatePassword, trigger: 'blur' }
+          { required: true, validator: validatePassword, trigger: 'blur' },
         ],
-        UserTypeId: [
+        Roles: [
-          { required: true, message: 'Please Select', trigger: ['blur', 'change'] }
+          {
+            required: true,
+            message: 'Please Select',
+            trigger: ['blur', 'change'],
+          },
         ],
         IsZhiZhun: [
-          { required: true, message: 'Please Select', trigger: ['blur', 'change'] }
+          {
+            required: true,
+            message: 'Please Select',
+            trigger: ['blur', 'change'],
+          },
         ],
         OrganizationName: [
-          { required: true, message: 'Please specify', trigger: 'blur' }
+          { required: true, message: 'Please specify', trigger: 'blur' },
         ],
         LastName: [
           { required: true, message: 'Please specify', trigger: 'blur' },
-          { max: 50, message: 'The maximum length is 50' }
+          { max: 50, message: 'The maximum length is 50' },
         ],
         FirstName: [
           { required: true, message: 'Please specify', trigger: 'blur' },
-          { max: 50, message: 'The maximum length is 50' }
+          { max: 50, message: 'The maximum length is 50' },
         ],
         Phone: [
-          { max: 20, min: 7, message: 'The length is 7 to 20', trigger: ['blur'] }
+          {
+            max: 20,
+            min: 7,
+            message: 'The length is 7 to 20',
+            trigger: ['blur'],
+          },
         ],
         EMail: [
           {
             required: true,
             message: 'Please input the email address',
-            trigger: 'blur'
+            trigger: 'blur',
           },
           {
             type: 'email',
             message: 'Please input the correct email address',
-            trigger: ['blur']
+            trigger: ['blur'],
           },
-          { max: 50, message: 'The maximum length is 50' }
+          { max: 50, message: 'The maximum length is 50' },
-        ],
-        Sex: [
-          { required: true, message: 'Please specify', trigger: 'blur' }
         ],
+        Sex: [{ required: true, message: 'Please specify', trigger: 'blur' }],
         Status: [
-          { required: true, message: 'Please specify', trigger: 'blur' }
+          { required: true, message: 'Please specify', trigger: 'blur' },
         ],
-        DepartmentName: [
+        DepartmentName: [{ max: 50, message: 'The maximum length is 50' }],
-          { max: 50, message: 'The maximum length is 50' }],
+        PositionName: [{ max: 50, message: 'The maximum length is 50' }],
-        PositionName: [{ max: 50, message: 'The maximum length is 50' }
-        ]
       },
       userTypeOptions: [],
       isDisabled: false,
-      type: 0 // 1为编辑，0为新增
+      type: 0, // 1为编辑，0为新增
     }
-  }
+  },
 }
 </script>
 <style scoped>
-/deep/ .is-error.my_new_pwd{
+::v-deep .is-error.my_new_pwd {
   margin-bottom: 40px;
 }
 </style>

src/views/system/user/components/roleList.vue

@@ -0,0 +1,196 @@
+<template>
+  <el-dialog
+    v-if="visible"
+    :visible.sync="visible"
+    v-dialogDrag
+    width="540px"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    append-to-body
+    :title="$t('system:userlist:roleList:title')"
+    :before-close="cancel"
+  >
+    <el-button
+      size="mini"
+      type="primary"
+      @click.stop="openAdd"
+      style="float: right"
+    >
+      {{ $t('common:button:new') }}
+    </el-button>
+    <el-table :data="list" style="width: 100%" max-height="300px">
+      <el-table-column type="index" width="40" />
+      <el-table-column
+        prop="UserTypeShortName"
+        :label="$t('system:userlist:roleList:table:UserTypeShortName')"
+      />
+      <el-table-column
+        prop="IsUserRoleDisabled"
+        :label="$t('system:userlist:roleList:table:IsUserRoleDisabled')"
+      >
+        <template slot-scope="scope">
+          <span> {{ $fd('IsEnable', !scope.row.IsUserRoleDisabled) }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column :label="$t('common:action:action')" width="120px">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            :disabled="scope.row.IsUserRoleDisabled"
+            @click.stop="scope.row.IsUserRoleDisabled = true"
+          >
+            {{ $fd('IsEnable', false) }}
+          </el-button>
+          <el-button
+            size="mini"
+            type="text"
+            :disabled="!scope.row.IsUserRoleDisabled"
+            @click.stop="scope.row.IsUserRoleDisabled = false"
+          >
+            {{ $fd('IsEnable', true) }}
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <div slot="footer">
+      <!-- 保存 -->
+      <el-button type="primary" size="small" @click="save">
+        {{ $t('common:button:confirm') }}
+      </el-button>
+    </div>
+    <el-dialog
+      v-if="addVisible"
+      :visible.sync="addVisible"
+      v-dialogDrag
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      append-to-body
+      width="540px"
+      :title="$t('system:userlist:roleList:addTitle')"
+    >
+      <el-form ref="addForm" :model="form" :rules="rule" label-width="80px">
+        <el-form-item :label="$t('system:userlist:table:UserType')">
+          <el-select
+            v-model="form.roles"
+            size="small"
+            placeholder=""
+            multiple
+            style="width: 100%"
+          >
+            <template v-for="item of roleList">
+              <el-option
+                :key="item.Id"
+                :label="item.UserType"
+                :value="item.Id"
+              />
+            </template>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <!-- 保存 -->
+        <el-button type="primary" size="small" @click="saveAdd">
+          {{ $t('common:button:confirm') }}
+        </el-button>
+        <!-- 取消 -->
+        <el-button size="small" @click="addVisible = false">
+          {{ $t('common:button:cancel') }}
+        </el-button>
+      </div>
+    </el-dialog>
+  </el-dialog>
+</template>
+<script>
+export default {
+  name: 'roleList',
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
+    },
+    list: {
+      type: Array,
+      default: () => {
+        return []
+      },
+    },
+    roles: {
+      type: Array,
+      default: () => {
+        return []
+      },
+    },
+    userTypeOptions: {
+      type: Array,
+      default: () => {
+        return []
+      },
+    },
+  },
+  data() {
+    return {
+      addVisible: false,
+      form: {
+        roles: [],
+      },
+      rule: {
+        roles: [
+          {
+            required: true,
+            message: 'Please Select',
+            trigger: ['blur', 'change'],
+          },
+        ],
+      },
+    }
+  },
+  computed: {
+    roleList() {
+      let arr = this.list.map((item) => item.UserTypeId)
+      return this.userTypeOptions.filter(
+        (item) => !arr.includes(item.Id) && item.UserTypeEnum !== 20
+      )
+    },
+  },
+  methods: {
+    cancel() {
+      this.$emit('update:visible', false)
+    },
+    openAdd() {
+      this.addVisible = true
+    },
+    save() {
+      let roles = []
+      this.list.forEach((item) => {
+        if (!item.IsUserRoleDisabled) {
+          roles.push(item.UserTypeId)
+        }
+      })
+      console.log(roles)
+      this.$emit('update:roles', roles)
+      this.$emit('update:visible', false)
+    },
+    async saveAdd() {
+      try {
+        let validate = await this.$refs.addForm.validate()
+        if (!validate) return
+        let arr = this.userTypeOptions.filter((item) =>
+          this.form.roles.includes(item.Id)
+        )
+        arr.forEach((item) => {
+          this.list.push({
+            UserTypeEnum: item.UserTypeEnum,
+            UserTypeId: item.UserTypeId,
+            IsUserRoleDisabled: false,
+            UserTypeShortName: item.UserTypeShortName,
+          })
+        })
+        this.addVisible = false
+      } catch (err) {
+        console.log(err)
+      }
+    },
+  },
+}
+</script>

src/views/system/user/list/index.vue

@@ -35,6 +35,16 @@
       <template slot="genderSlot" slot-scope="{ scope }">
         {{ scope.row.Sex ? 'Male' : 'Female' }}
       </template>
+      <template slot="UserTypeSlot" slot-scope="{ scope }">
+        {{
+          Array.isArray(scope.row.UserRoleList) &&
+          scope.row.UserRoleList.length > 0
+            ? scope.row.UserRoleList.map((item) => item.UserTypeShortName).join(
+                ','
+              )
+            : ''
+        }}
+      </template>
       <template slot="roleSlot" slot-scope="{ scope }">
         {{ scope.row.RoleNameList.map((role) => role.RoleName).join(',') }}
       </template>
@@ -115,7 +125,7 @@ export default {
           showOverflowTooltip: true,
         },
         {
-          prop: 'RealName',
+          prop: 'FullName',
           label: this.$t('system:userlist:table:RealName'),
           minWidth: 120,
           sortable: 'custom',
@@ -154,6 +164,7 @@ export default {
           prop: 'UserType',
           label: this.$t('system:userlist:table:UserType'),
           minWidth: 100,
+          slot: 'UserTypeSlot',
           sortable: 'custom',
           showOverflowTooltip: true,
         },

src/views/trials/trials-layout/components/trialsNavbar.vue

@@ -104,6 +104,7 @@
       />
     </div>
     <toggleRole
+      v-if="toggleRoleVisible"
       :visible.sync="toggleRoleVisible"
       :loading="toggleRoleLoading"
       @save="loginByRole"
@@ -242,9 +243,9 @@ export default {
           if (res) {
             this.$store
               .dispatch('permission/generateRoutes')
-              .then((res) => {
+              .then(async (res) => {
                 if (res && res.length > 0) {
-                  this.$store.dispatch('global/getNoticeList')
+                  await this.$store.dispatch('global/getNoticeList')
                   this.$router.addRoutes(res)
                   this.toggleRoleLoading = false
                   if (this.loginType === 'DevOps') {

src/views/trials/trials-myinfo/index.vue

@@ -107,11 +107,11 @@ export default {
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.07)',
       })
-      getUser(this.userId)
+      getUser()
         .then(async (res) => {
           this.user = res.Result
           /* eslint-disable */
-          zzSessionStorage.setItem('realName', this.user.RealName)
+          zzSessionStorage.setItem('Name', this.user.FullName)
           await store.dispatch('user/updateInfo')
           loading.close()
         })

src/views/trials/trials-workbench/index.vue

@@ -490,7 +490,7 @@ export default {
   },
   methods: {
     getUserInfo() {
-      getUser(this.userId).then(async res => {
+      getUser().then(async res => {
         this.user = res.Result
       }).catch(() => { loading.close() })
     },

src/views/user/myInfo.vue

@@ -17,36 +17,78 @@
           <!-- 用户基本信息 -->
           {{ $t('trials:trials-myinfo:title:basicInfo') }}
         </div>
-        <el-form ref="userForm" label-position="right" :model="user" :rules="userFormRules" label-width="120px">
+        <el-form
+          ref="userForm"
+          label-position="right"
+          :model="user"
+          :rules="userFormRules"
+          label-width="120px"
+        >
           <el-form-item v-if="user.Code" label="ID: " prop="Code">
             <el-input v-model="user.Code" disabled />
           </el-form-item>
           <!-- 姓 -->
-          <el-form-item :disabled="user.UserTypeEnum === 8" :label="$t('trials:trials-myinfo:form:surname')" prop="LastName">
+          <el-form-item
-            <el-input v-model="user.LastName" :placeholder="$t('trials:trials-myinfo:form:surname')"/>
+            :disabled="user.UserTypeEnum === 8"
+            :label="$t('trials:trials-myinfo:form:surname')"
+            prop="LastName"
+          >
+            <el-input
+              v-model="user.LastName"
+              :placeholder="$t('trials:trials-myinfo:form:surname')"
+            />
           </el-form-item>
           <!-- 名 -->
-          <el-form-item :disabled="user.UserTypeEnum === 8" :label="$t('trials:trials-myinfo:form:givenname')" prop="FirstName">
+          <el-form-item
-            <el-input v-model="user.FirstName" :placeholder="$t('trials:trials-myinfo:form:givenname')"/>
+            :disabled="user.UserTypeEnum === 8"
+            :label="$t('trials:trials-myinfo:form:givenname')"
+            prop="FirstName"
+          >
+            <el-input
+              v-model="user.FirstName"
+              :placeholder="$t('trials:trials-myinfo:form:givenname')"
+            />
           </el-form-item>
           <!-- 性别 -->
-          <el-form-item :label="$t('trials:trials-myinfo:form:gender')" prop="Sex" style="margin-right:40px;">
+          <el-form-item
+            :label="$t('trials:trials-myinfo:form:gender')"
+            prop="Sex"
+            style="margin-right: 40px"
+          >
             <el-radio-group v-model="user.Sex">
               <el-radio :label="1">Male</el-radio>
               <el-radio :label="0">Female</el-radio>
             </el-radio-group>
           </el-form-item>
           <!-- 单位 -->
-          <el-form-item :label="$t('trials:trials-myinfo:form:organization')" prop="OrganizationName">
+          <el-form-item
-            <el-input v-model="user.OrganizationName" :placeholder="$t('trials:trials-myinfo:form:organization')"/>
+            :label="$t('trials:trials-myinfo:form:organization')"
+            prop="OrganizationName"
+          >
+            <el-input
+              v-model="user.OrganizationName"
+              :placeholder="$t('trials:trials-myinfo:form:organization')"
+            />
           </el-form-item>
           <!-- 部门 -->
-          <el-form-item :label="$t('trials:trials-myinfo:form:department')" prop="DepartmentName">
+          <el-form-item
-            <el-input v-model="user.DepartmentName" :placeholder="$t('trials:trials-myinfo:form:organization')"/>
+            :label="$t('trials:trials-myinfo:form:department')"
+            prop="DepartmentName"
+          >
+            <el-input
+              v-model="user.DepartmentName"
+              :placeholder="$t('trials:trials-myinfo:form:organization')"
+            />
           </el-form-item>
           <!-- 职位 -->
-          <el-form-item :label="$t('trials:trials-myinfo:form:position')" prop="PositionName">
+          <el-form-item
-            <el-input v-model="user.PositionName" :placeholder="$t('trials:trials-myinfo:form:position')"/>
+            :label="$t('trials:trials-myinfo:form:position')"
+            prop="PositionName"
+          >
+            <el-input
+              v-model="user.PositionName"
+              :placeholder="$t('trials:trials-myinfo:form:position')"
+            />
           </el-form-item>
         </el-form>
         <!-- 保存 -->
@@ -68,39 +110,97 @@
         </div>
         <el-form label-position="right" label-width="180px">
           <!-- 用户名 -->
-          <el-form-item :label="$t('trials:trials-myinfo:form:userName')" style="margin-bottom: 5px;" prop="UserName">
+          <el-form-item
+            :label="$t('trials:trials-myinfo:form:userName')"
+            style="margin-bottom: 5px"
+            prop="UserName"
+          >
             <span>{{ user.UserName }}</span>
           </el-form-item>
           <el-form-item label="" style="position: relative" prop="UserName">
-            <el-input v-model="userForm.UserName" :placeholder="$t('trials:trials-myinfo:form:userName')"/>
+            <el-input
+              v-model="userForm.UserName"
+              :placeholder="$t('trials:trials-myinfo:form:userName')"
+            />
             <!-- 修改 -->
-            <el-button :disabled="!userForm.UserName" class="saveBtn" type="primary" size="small" @click="setNewUserName">
+            <el-button
+              :disabled="!userForm.UserName"
+              class="saveBtn"
+              type="primary"
+              size="small"
+              @click="setNewUserName"
+            >
               {{ $t('trials:trials-myinfo:button:update') }}
             </el-button>
           </el-form-item>
           <!-- 电话 -->
-          <el-form-item :label="$t('trials:trials-myinfo:form:phone')" style="margin-bottom: 5px;" prop="UserName">
+          <el-form-item
+            :label="$t('trials:trials-myinfo:form:phone')"
+            style="margin-bottom: 5px"
+            prop="UserName"
+          >
             <span>{{ user.Phone }}</span>
           </el-form-item>
           <el-form-item label="" style="position: relative" prop="UserName">
-            <el-input v-model="userForm.Phone" :placeholder="$t('trials:trials-myinfo:form:phone')"/>
+            <el-input
+              v-model="userForm.Phone"
+              :placeholder="$t('trials:trials-myinfo:form:phone')"
+            />
             <!-- 修改 -->
-            <el-button :disabled="!userForm.Phone" class="saveBtn" type="primary" size="small" @click="setNewPhone">
+            <el-button
+              :disabled="!userForm.Phone"
+              class="saveBtn"
+              type="primary"
+              size="small"
+              @click="setNewPhone"
+            >
               {{ $t('trials:trials-myinfo:button:update') }}
             </el-button>
           </el-form-item>
           <!-- 邮箱 -->
-          <el-form-item :label="$t('trials:trials-myinfo:form:email')" style="margin-bottom: 5px;" prop="UserName">
+          <el-form-item
+            :label="$t('trials:trials-myinfo:form:email')"
+            style="margin-bottom: 5px"
+            prop="UserName"
+          >
             <span>{{ user.EMail }}</span>
           </el-form-item>
-          <el-form-item label="" style="margin-bottom: 10px;position: relative" prop="EMail">
+          <el-form-item
-            <el-input v-model="userForm.EMail" @input="handleEmailChange" :placeholder="$t('trials:trials-myinfo:form:email')"/>
+            label=""
-            <el-button class="sendCode" :disabled="sendDisabled" type="primary" size="mini" @click="sendVerificationCode">{{ sendTitle }}</el-button>
+            style="margin-bottom: 10px; position: relative"
+            prop="EMail"
+          >
+            <el-input
+              v-model="userForm.EMail"
+              @input="handleEmailChange"
+              :placeholder="$t('trials:trials-myinfo:form:email')"
+            />
+            <el-button
+              class="sendCode"
+              :disabled="sendDisabled"
+              type="primary"
+              size="mini"
+              @click="sendVerificationCode"
+              >{{ sendTitle }}</el-button
+            >
           </el-form-item>
-          <el-form-item label="" style="position: relative" prop="VerificationCode">
+          <el-form-item
-            <el-input v-model="userForm.VerificationCode" :placeholder="$t('trials:researchForm:form:verifyCode')"/>
+            label=""
+            style="position: relative"
+            prop="VerificationCode"
+          >
+            <el-input
+              v-model="userForm.VerificationCode"
+              :placeholder="$t('trials:researchForm:form:verifyCode')"
+            />
             <!-- 修改 -->
-            <el-button :disabled="!userForm.EMail || !userForm.VerificationCode" class="saveBtn" type="primary" size="small" @click="setNewEmail">
+            <el-button
+              :disabled="!userForm.EMail || !userForm.VerificationCode"
+              class="saveBtn"
+              type="primary"
+              size="small"
+              @click="setNewEmail"
+            >
               {{ $t('trials:trials-myinfo:button:update') }}
             </el-button>
           </el-form-item>
@@ -111,18 +211,52 @@
           <!-- 修改密码 -->
           {{ $t('trials:trials-myinfo:title:updatePaasord') }}
         </div>
-        <el-form ref="passwordForm" label-position="right" :model="password" :rules="passwordFormRules" label-width="180px">
+        <el-form
+          ref="passwordForm"
+          label-position="right"
+          :model="password"
+          :rules="passwordFormRules"
+          label-width="180px"
+        >
           <!-- 旧密码 -->
-          <el-form-item :label="$t('recompose:form:oldPassword')" prop="OldPassWord">
+          <el-form-item
-            <el-input v-model="password.OldPassWord" type="password" show-password auto-complete="new-password" :placeholder="$t('recompose:form:oldPassword')"/>
+            :label="$t('recompose:form:oldPassword')"
+            prop="OldPassWord"
+          >
+            <el-input
+              v-model="password.OldPassWord"
+              type="password"
+              show-password
+              auto-complete="new-password"
+              :placeholder="$t('recompose:form:oldPassword')"
+            />
           </el-form-item>
           <!-- 新密码 -->
-          <el-form-item class="my_new_pwd" :label="$t('recompose:form:newPassword')" prop="NewPassWord">
+          <el-form-item
-            <el-input v-model="password.NewPassWord" type="password" show-password auto-complete="new-password" :placeholder="$t('recompose:form:newPassword')"/>
+            class="my_new_pwd"
+            :label="$t('recompose:form:newPassword')"
+            prop="NewPassWord"
+          >
+            <el-input
+              v-model="password.NewPassWord"
+              type="password"
+              show-password
+              auto-complete="new-password"
+              :placeholder="$t('recompose:form:newPassword')"
+            />
           </el-form-item>
           <!-- 确认密码 -->
-          <el-form-item :label="$t('recompose:form:confirmPassword')" prop="ConfirmPassWord">
+          <el-form-item
-            <el-input v-model="password.ConfirmPassWord" type="password" show-password auto-complete="new-password" :placeholder="$t('recompose:form:confirmPassword')"/>
+            :label="$t('recompose:form:confirmPassword')"
+            prop="ConfirmPassWord"
+          >
+            <el-input
+              v-model="password.ConfirmPassWord"
+              type="password"
+              show-password
+              auto-complete="new-password"
+              :placeholder="$t('recompose:form:confirmPassword')"
+            />
           </el-form-item>
         </el-form>
         <el-button
@@ -139,13 +273,23 @@
 </template>
 
 <script>
-import { getUserTypeList, getUser, updateUser, modifyPassword } from '@/api/admin.js'
+import {
-import { sendVerificationCode, setNewEmail, setNewPhone, setNewUserName } from '@/api/system/user.js'
+  getUserTypeList,
+  getUser,
+  updateUser,
+  modifyPassword,
+} from '@/api/admin.js'
+import {
+  sendVerificationCode,
+  setNewEmail,
+  setNewPhone,
+  setNewUserName,
+} from '@/api/system/user.js'
 import md5 from 'js-md5'
 var timer = ''
 var countdown = 60
 import store from '@/store'
-import {mapGetters, mapMutations} from 'vuex'
+import { mapGetters, mapMutations } from 'vuex'
 
 export default {
   name: 'TrialsMyinfo',
@@ -158,38 +302,102 @@ export default {
       sendDisabled: true,
       sendTitle: this.$t('trials:trials-myinfo:button:getVCode'),
       userFormRules: {
-        UserName: [{ required: true, message: this.$t('common:ruleMessage:specify'), trigger: 'blur' }],
+        UserName: [
-        UserTypeId: [{ required: true, message: this.$t('common:ruleMessage:select'), trigger: ['blur', 'change'] }],
+          {
-        IsZhiZhun: [{ required: true, message: this.$t('common:ruleMessage:select'), trigger: ['blur', 'change'] }],
+            required: true,
-        OrganizationName: [{ required: true, message: this.$t('common:ruleMessage:specify'), trigger: 'blur' }],
+            message: this.$t('common:ruleMessage:specify'),
-        LastName: [{ required: true, message: this.$t('common:ruleMessage:specify'), trigger: 'blur' }, { max: 50, message: `${this.$t('common:ruleMessage:maxLength')} 50` }],
+            trigger: 'blur',
-        FirstName: [{ required: true, message: this.$t('common:ruleMessage:specify'), trigger: 'blur' }, { max: 50, message: `${this.$t('common:ruleMessage:maxLength')} 50` }],
+          },
-        Sex: [{ required: true, message: this.$t('common:ruleMessage:specify'), trigger: 'blur' }],
+        ],
-        Status: [{ required: true, message: this.$t('common:ruleMessage:specify'), trigger: 'blur' }]
+        UserTypeId: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:select'),
+            trigger: ['blur', 'change'],
+          },
+        ],
+        IsZhiZhun: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:select'),
+            trigger: ['blur', 'change'],
+          },
+        ],
+        OrganizationName: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:specify'),
+            trigger: 'blur',
+          },
+        ],
+        LastName: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:specify'),
+            trigger: 'blur',
+          },
+          { max: 50, message: `${this.$t('common:ruleMessage:maxLength')} 50` },
+        ],
+        FirstName: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:specify'),
+            trigger: 'blur',
+          },
+          { max: 50, message: `${this.$t('common:ruleMessage:maxLength')} 50` },
+        ],
+        Sex: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:specify'),
+            trigger: 'blur',
+          },
+        ],
+        Status: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:specify'),
+            trigger: 'blur',
+          },
+        ],
       },
       passwordFormRules: {
-        OldPassWord: [{ required: true, message: this.$t('common:ruleMessage:specify'), trigger: 'blur' }],
+        OldPassWord: [
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:specify'),
+            trigger: 'blur',
+          },
+        ],
         NewPassWord: [
-          { required: true, message: this.$t('common:ruleMessage:specify'), trigger: 'blur' },
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:specify'),
+            trigger: 'blur',
+          },
           {
             required: true,
             trigger: 'blur',
-            validator: this.$validatePassword
+            validator: this.$validatePassword,
           },
         ],
         ConfirmPassWord: [
-          { required: true, message: this.$t('common:ruleMessage:specify'), trigger: 'blur' },
+          {
+            required: true,
+            message: this.$t('common:ruleMessage:specify'),
+            trigger: 'blur',
+          },
           {
             required: true,
             trigger: 'blur',
-            validator: this.$validatePassword
+            validator: this.$validatePassword,
           },
-        ]
+        ],
-      }
+      },
     }
   },
   computed: {
-    ...mapGetters(['userId', 'name'])
+    ...mapGetters(['userId', 'name']),
   },
   mounted() {
     this.getUserInfo()
@@ -198,7 +406,7 @@ export default {
   methods: {
     ...mapMutations({ setLanguage: 'lang/setLanguage' }),
     handleSave() {
-      this.$refs.userForm.validate(valid => {
+      this.$refs.userForm.validate((valid) => {
         console.log(valid)
         if (valid) {
           this.isDisabled = true
@@ -212,17 +420,24 @@ export default {
           //   this.user.OrganizationName = 'ZhiZhun'
           // }
           if (this.user.Id) {
-            updateUser(this.user).then(res => {
+            updateUser(this.user)
-              this.isDisabled = false
+              .then((res) => {
-              this.$message.success(this.$t('trials:trials-myinfo:message:updateSuccessfully'))
+                this.isDisabled = false
-              this.getUserInfo()
+                this.$message.success(
-            }).catch(() => { this.isDisabled = false })
+                  this.$t('trials:trials-myinfo:message:updateSuccessfully')
+                )
+                this.getUserInfo()
+              })
+              .catch(() => {
+                this.isDisabled = false
+              })
           }
         }
       })
     },
     handleEmailChange() {
-      var reg = /^[A-Za-z0-9]+([_\.][A-Za-z0-9]+)*@([A-Za-z0-9\-]+\.)+[A-Za-z]{2,6}$/
+      var reg =
+        /^[A-Za-z0-9]+([_\.][A-Za-z0-9]+)*@([A-Za-z0-9\-]+\.)+[A-Za-z]{2,6}$/
       if (this.userForm.EMail && reg.test(this.userForm.EMail)) {
         this.sendDisabled = false
       } else {
@@ -233,11 +448,13 @@ export default {
       sendVerificationCode(this.userForm.EMail).then(() => {
         this.settime(this)
         // 发送成功
-        this.$message.success(this.$t('trials:trials-myinfo:message:sendSuccessfully'))
+        this.$message.success(
+          this.$t('trials:trials-myinfo:message:sendSuccessfully')
+        )
       })
     },
     save() {
-      this.$refs.passwordForm.validate(valid => {
+      this.$refs.passwordForm.validate((valid) => {
         if (valid) {
           if (this.password.NewPassWord !== this.password.ConfirmPassWord) {
             this.$alert(this.$t('passwordReset:formRule:passwordsDiffer'))
@@ -246,12 +463,14 @@ export default {
           const param = {
             UserId: this.userId,
             NewPassWord: md5(this.password.NewPassWord),
-            OldPassWord: md5(this.password.OldPassWord)
+            OldPassWord: md5(this.password.OldPassWord),
           }
-          modifyPassword(param).then(res => {
+          modifyPassword(param).then((res) => {
             if (res.IsSuccess) {
               // 修改成功,请重新登录账号
-              this.$message.success(this.$t('trials:trials-myinfo:message:modifyPWSuccessfully'))
+              this.$message.success(
+                this.$t('trials:trials-myinfo:message:modifyPWSuccessfully')
+              )
               setTimeout(() => {
                 this.logout()
               }, 1000)
@@ -261,26 +480,36 @@ export default {
       })
     },
     setNewEmail() {
-      setNewEmail(this.userForm.EMail, this.userForm.VerificationCode).then(() => {
+      setNewEmail(this.userForm.EMail, this.userForm.VerificationCode).then(
-        this.userForm.EMail = ''
+        () => {
-        this.userForm.VerificationCode = ''
+          this.userForm.EMail = ''
-        this.$message.success(this.$t('trials:trials-myinfo:message:updateSuccessfully'))
+          this.userForm.VerificationCode = ''
-        this.getUserInfo()
+          this.$message.success(
-      })
+            this.$t('trials:trials-myinfo:message:updateSuccessfully')
+          )
+          this.getUserInfo()
+        }
+      )
     },
     setNewUserName() {
       setNewUserName(this.userForm.UserName).then(() => {
-        this.$store.dispatch('user/changeUserName', this.userForm.UserName).then((res) => {
+        this.$store
-          this.userForm.UserName = ''
+          .dispatch('user/changeUserName', this.userForm.UserName)
-          this.$message.success(this.$t('trials:trials-myinfo:message:updateSuccessfully'))
+          .then((res) => {
-          this.getUserInfo()
+            this.userForm.UserName = ''
-        })
+            this.$message.success(
+              this.$t('trials:trials-myinfo:message:updateSuccessfully')
+            )
+            this.getUserInfo()
+          })
       })
     },
     setNewPhone() {
       setNewPhone(this.userForm.Phone).then(() => {
         this.userForm.Phone = ''
-        this.$message.success(this.$t('trials:trials-myinfo:message:updateSuccessfully'))
+        this.$message.success(
+          this.$t('trials:trials-myinfo:message:updateSuccessfully')
+        )
         this.getUserInfo()
       })
     },
@@ -290,36 +519,42 @@ export default {
         lock: true,
         text: 'Loading',
         spinner: 'el-icon-loading',
-        background: 'rgba(0, 0, 0, 0.07)'
+        background: 'rgba(0, 0, 0, 0.07)',
       })
-      getUser(this.userId).then(async res => {
+      getUser()
-        this.user = res.Result
+        .then(async (res) => {
-        /* eslint-disable */
+          this.user = res.Result
-        zzSessionStorage.setItem('realName', this.user.RealName)
+          /* eslint-disable */
-        await store.dispatch('user/updateInfo')
+          zzSessionStorage.setItem('Name', this.user.FullName)
-        loading.close()
+          await store.dispatch('user/updateInfo')
-      }).catch(() => { loading.close() })
+          loading.close()
+        })
+        .catch(() => {
+          loading.close()
+        })
     },
     settime(obj) {
       if (countdown === 0) {
         obj.sendDisabled = false
-        obj.sendTitle = this.$t('trials:trials-myinfo:button:getVCode')// '获取验证码'
+        obj.sendTitle = this.$t('trials:trials-myinfo:button:getVCode') // '获取验证码'
         countdown = 60
         clearTimeout(timer)
         return
       } else {
         obj.sendDisabled = true
-        obj.sendTitle = `${this.$t('trials:trials-myinfo:button:wait')}(${countdown}s)`
+        obj.sendTitle = `${this.$t(
+          'trials:trials-myinfo:button:wait'
+        )}(${countdown}s)`
         countdown--
         // eslint-disable-next-line no-self-assign
         countdown = countdown
-        timer = setTimeout(function() {
+        timer = setTimeout(function () {
           obj.settime(obj)
         }, 1000)
       }
     },
     getUserTypeList() {
-      getUserTypeList().then(res => {
+      getUserTypeList().then((res) => {
         if (res.IsSuccess) {
           this.userTypeOptions = res.Result
         }
@@ -337,56 +572,93 @@ export default {
       this.$i18n.locale = 'zh'
       this.setLanguage('zh')
       this.$updateDictionary()
-    }
+    },
-  }
+  },
 }
 </script>
 
 <style lang="scss" scoped>
-.trial-myinfo{
+.trial-myinfo {
   background: #f3f3f3;
-  flex: 1;overflow: auto;display: flex;flex-direction: row;justify-content: space-around;
+  flex: 1;
-  .trial-myinfo-head{
+  overflow: auto;
-    position: absolute;top: 40px;left: -10%;font-size: 14px;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-around;
+  .trial-myinfo-head {
+    position: absolute;
+    top: 40px;
+    left: -10%;
+    font-size: 14px;
   }
-  .trial-myinfo-left{
+  .trial-myinfo-left {
     overflow: auto;
-    background: #fff;width: calc(50% - 9px);margin: 6px 0;
+    background: #fff;
+    width: calc(50% - 9px);
+    margin: 6px 0;
     padding-bottom: 50px;
-    .trial-myinfo-left-top{
+    .trial-myinfo-left-top {
-      width: 70%;padding-top: 100px;position: relative;margin: 0 auto;margin-bottom: 10px;
+      width: 70%;
-      .trial-myinfo-body{
+      padding-top: 100px;
-        width:160px;height:160px;border-radius: 50%;background: #428bca;display: flex;justify-content: center;align-items: center;
+      position: relative;
-        div{
+      margin: 0 auto;
-          color:#fff;font-size: 30px;
+      margin-bottom: 10px;
+      .trial-myinfo-body {
+        width: 160px;
+        height: 160px;
+        border-radius: 50%;
+        background: #428bca;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        div {
+          color: #fff;
+          font-size: 30px;
         }
       }
     }
   }
-  .saveBtn{
+  .saveBtn {
-    position: absolute;right: -10px;top:2px;transform: translateX(100%)
+    position: absolute;
+    right: -10px;
+    top: 2px;
+    transform: translateX(100%);
   }
-  .trial-info-btn{
+  .trial-info-btn {
-    position: absolute;bottom: -60px;left: calc(100% + 10px);min-width: 97px;
+    position: absolute;
+    bottom: -60px;
+    left: calc(100% + 10px);
+    min-width: 97px;
   }
-  .trial-myinfo-left-bottom{
+  .trial-myinfo-left-bottom {
-    width: 70%;padding-top: 100px;position: relative;margin: 0 auto;
+    width: 70%;
+    padding-top: 100px;
+    position: relative;
+    margin: 0 auto;
   }
-  .trial-myinfo-right{
+  .trial-myinfo-right {
     overflow: auto;
-    background: #fff;width: calc(50% - 9px);margin: 6px 0;
+    background: #fff;
+    width: calc(50% - 9px);
+    margin: 6px 0;
     padding-bottom: 50px;
     .sendCode {
-      position: absolute;right: -10px;top: 50%;transform: translate(100%, -50%);
+      position: absolute;
+      right: -10px;
+      top: 50%;
+      transform: translate(100%, -50%);
     }
-    .trial-myinfo-right-box{
+    .trial-myinfo-right-box {
-      width: 70%;padding-top: 100px;position: relative;margin: 0 auto;
+      width: 70%;
+      padding-top: 100px;
+      position: relative;
+      margin: 0 auto;
     }
   }
 }
 </style>
 <style scoped>
-/deep/ .is-error.my_new_pwd{
+::v-deep .is-error.my_new_pwd {
   margin-bottom: 40px;
 }
 </style>