diff --git a/nezha-fronted/src/components/common/bottomBox/tabs/operationLogTab.vue b/nezha-fronted/src/components/common/bottomBox/tabs/operationLogTab.vue
index 3b2b2b5ae..61e32e9b8 100644
--- a/nezha-fronted/src/components/common/bottomBox/tabs/operationLogTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/operationLogTab.vue
@@ -6,6 +6,7 @@
     :search-msg="searchMsg"
     :tabs="tabs"
     @changeTab="changeTab"
+    @search="search"
   >
     <template v-slot:title><span :title="obj.name">{{obj.name}}</span></template>
     <template v-slot>
@@ -42,7 +43,7 @@ export default {
   },
   data () {
     return {
-      url: 'sys/log/list',
+      url: 'sys/log',
       tableId: 'operationLogTable',
       searchMsg: { // 给搜索框子组件传递的信息
         zheze_none: true,
@@ -65,9 +66,28 @@ export default {
             type: 'selectString',
             label: 'operation',
             disabled: false
-          }
+          },{
+            id: 14,
+            name: this.$t('config.operationlog.operaId'),
+            type: 'input',
+            label: 'operaId',
+            disabled: false
+          },{
+            id: 16,
+            name: this.$t('config.operationlog.state'),
+            type: 'selectString',
+            label: 'state',
+            disabled: false
+          }, {
+            id: 17,
+            name: this.$t('config.operationlog.params'),
+            type: 'input',
+            label: 'params',
+            disabled: false
+          },
         ]
-      }
+      },
+      searchLabel:{userId:this.obj.id}
     }
   },
   methods: {
@@ -81,24 +101,7 @@ export default {
       }
       return ''
     },
-    getTableData () {
-      this.$set(this.searchLabel, 'pageNo', this.pageObj.pageNo)
-      this.$set(this.searchLabel, 'pageSize', this.pageObj.pageSize)
-      this.tools.loading = true
-      this.$get('sys/log/list', this.searchLabel).then(response => {
-        this.tools.loading = false
-        if (response.code === 200) {
-          this.tableData = response.data.list
-          this.pageObj.total = response.data.total
-          if (!this.scrollbarWrap) {
-            this.$nextTick(() => {
-              this.scrollbarWrap = this.$refs.dataTable.bodyWrapper
-              this.toTopBtnHandler(this.scrollbarWrap)
-            })
-          }
-        }
-      })
-    }
+
   }
 }
 </script>
diff --git a/nezha-fronted/src/components/common/bottomBox/tabs/terminalLogTab.vue b/nezha-fronted/src/components/common/bottomBox/tabs/terminalLogTab.vue
index 2310188d7..35f53b142 100644
--- a/nezha-fronted/src/components/common/bottomBox/tabs/terminalLogTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/terminalLogTab.vue
@@ -64,7 +64,8 @@ export default {
           }
         ]
       },
-      nowTime: ''
+      nowTime: '',
+      searchLabel:{userId:this.obj.id}
     }
   },
   methods: {
diff --git a/nezha-fronted/src/components/common/language/cn.js b/nezha-fronted/src/components/common/language/cn.js
index b7a967b87..1da65fe01 100644
--- a/nezha-fronted/src/components/common/language/cn.js
+++ b/nezha-fronted/src/components/common/language/cn.js
@@ -697,7 +697,8 @@ const cn = {
       invalidPwd: '无效的密码，最少6个字符',
       confirmPwdErr: '两次密码输入不一致',
       reinputPwd: '请再次输入密码',
-      notification: '通知'
+      notification: '通知',
+      mobile: '电话'
     },
     roles: {
       roles: '角色',
diff --git a/nezha-fronted/src/components/common/language/en.js b/nezha-fronted/src/components/common/language/en.js
index 301af1506..203076bc2 100644
--- a/nezha-fronted/src/components/common/language/en.js
+++ b/nezha-fronted/src/components/common/language/en.js
@@ -470,7 +470,8 @@ const en = {
     key: 'Invalid key',
     repeat: 'Repeat',
     tooLong: 'Too long content',
-    onlyWord: 'only input a-z、A-Z、0-9、"_" '
+    onlyWord: 'only input a-z、A-Z、0-9、"_" ',
+    mobile:'Invalid mobile',
   },
   search: {
     searchTip: 'Enter to search', // '点击或回车执行搜索'
@@ -704,7 +705,8 @@ const en = {
       invalidPwd: 'invalide password,the length at least 6',
       confirmPwdErr: 'The two passwords are inconsistent',
       reinputPwd: 'Enter password again',
-      notification: 'Notification'
+      notification: 'Notification',
+      mobile: 'Mobile',
     },
     roles: {
       roles: 'Roles',
@@ -869,7 +871,9 @@ const en = {
         export: 'export',
         delete: 'delete',
         reset: 'reset',
-        unknown: 'unknown'
+        unknown: 'unknown',
+        login: 'login',
+        logout: 'logout'
       }
     },
     mib: {
@@ -1007,8 +1011,8 @@ const en = {
         reset: 'Reset',
         type: 'Type',
         pwd: 'Password',
-        metric: 'metric',
-        alert: 'alert',
+        metric: 'Metric',
+        alert: 'Alert',
         sysConfig: 'System config',
         pwdTip: 'Please input your password',
         promptTitle: 'Confirm',
diff --git a/nezha-fronted/src/components/common/mixin/subDataList.js b/nezha-fronted/src/components/common/mixin/subDataList.js
index 374b5ec2b..57be8db76 100644
--- a/nezha-fronted/src/components/common/mixin/subDataList.js
+++ b/nezha-fronted/src/components/common/mixin/subDataList.js
@@ -4,7 +4,8 @@ export default {
     tabs: {
       type: Array
     },
-    targetTab: String
+    targetTab: String,
+    from: String
   },
   data () {
     return {
diff --git a/nezha-fronted/src/components/common/rightBox/administration/roleBox.vue b/nezha-fronted/src/components/common/rightBox/administration/roleBox.vue
new file mode 100644
index 000000000..b64a7fb30
--- /dev/null
+++ b/nezha-fronted/src/components/common/rightBox/administration/roleBox.vue
@@ -0,0 +1,202 @@
+<template>
+  <div v-clickoutside="{obj: editRole, func: esc}" class="right-box right-box-asset">
+    <div class="right-box__header">
+      <div class="header__title">{{editRole.id ? $t('config.user.editRole') : $t('config.user.createUser')}}</div>
+      <div class="header__operation">
+        <span v-cancel="{obj: editRole, func: esc}"><i class="nz-icon nz-icon-close"></i></span>
+      </div>
+    </div>
+    <div class="right-box__container">
+      <div class="container__form">
+        <el-form :disabled="detail" :model="editRole" :rules="rules" class="right-box-form right-box-form-left" label-position = "top" label-width="120px" ref="roleForm">
+          <!--name-->
+          <el-form-item :label="$t('config.roles.name')" prop="name">
+            <el-input  maxlength="64" placeholder="" id="role-box-input-name"
+                       show-word-limit size="small" type="text" v-model="editRole.name"></el-input>
+          </el-form-item>
+          <el-form-item :label="$t('config.roles.description')">
+            <el-input :rows="2" size='mini' type="textarea" v-model="editRole.remark" id="role-box-input-remark"/>
+          </el-form-item>
+
+          <el-form-item :label="$t('config.roles.permission')">
+            <!--<div class="tree-option">
+              <button type="button" class="nz-btn nz-btn-size-small-new nz-btn-style-light-new option-btn" style="margin-left: 0px;" @click="expandAllOrNone" :class="{'btn-active':expandAllFlag}">展开/收缩</button>
+              <button type="button" class="nz-btn nz-btn-size-small-new nz-btn-style-light-new option-btn" @click="selectAllOrNone" :class="{'btn-active':selectAllFlag}"><span ><i class="nz-icon nz-icon-delete"></i></span></button>
+            </div>-->
+            <el-tree :data="menus" :default-expand-all="expandAllFlag" :props="{label:labelFormatter}"  @check-change="selectChange" class="tree-border" node-key="id" ref="menuTree" show-checkbox id="role-box-input-menus">
+              <div slot-scope="{ node, data }">
+              <span>
+                <i v-if="data.type == '1'" class="el-icon-menu"></i>
+                <i v-if="data.type == '2'" class="el-icon-edit"></i>
+              </span>
+                {{$t(data.i18n)}}
+              </div>
+            </el-tree>
+          </el-form-item>
+        </el-form>
+      </div>
+    </div>
+    <div class="right-box__footer">
+      <button id="asset-edit-cancel" v-cancel="{obj: editRole, func: esc}" class="footer__btn footer__btn--light">
+        <span>{{$t('overall.cancel')}}</span>
+      </button>
+      <button id="asset-edit-save" :class="{'footer__btn--disabled': prevent_opt.save}" :disabled="prevent_opt.save" class="footer__btn" @click="save">
+        <span>{{$t('overall.save')}}</span>
+      </button>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'userBox',
+    components: {
+    },
+    props: {
+      obj: {
+        type: Object
+      },
+      detail: Boolean
+    },
+    data () {
+      const vm = this
+      return {
+        editRole: {},
+        url: 'sys/role',
+        rightBox: {model: {show: false}},
+        rules: { // 表单校验规则
+          name: [
+            { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+          ]
+        },
+        menus: [],
+        selectedIds:[],
+        selectAllFlag: false,
+        expandAllFlag: true
+      }
+    },
+    watch: {
+      obj: {
+        deep: true,
+        immediate: true,
+        handler (n) {
+          this.editRole = JSON.parse(JSON.stringify(n))
+          if(this.editRole.roles && this.editRole.roles.length>0){
+            this.editRole.roleIds=this.editRole.roles.map(t=>t.id)
+          }
+        }
+      },
+    },
+    created () {
+
+    },
+    mounted () {
+      this.getMenus().then(()=>{
+        if (this.$refs.menuTree && this.selectedIds && this.selectedIds.length > 0) {
+          this.$refs.menuTree.setCheckedKeys(this.selectedIds, true)
+        }
+      })
+
+    },
+    methods: {
+      clickOutside () {
+        this.esc(false)
+      },
+      /* 关闭弹框 */
+      esc (refresh) {
+        this.prevent_opt.save = false
+        this.$emit('close', refresh)
+      },
+      getMenus: function () {
+        let self = this;
+        return new Promise(resolve => {
+          self.menus = []
+          if(self.editRole.id){
+            self.$get('/sys/role/menu/'+self.editRole.id).then(response => {
+              if (response.code == 200) {
+                self.menus = response.data.menus;
+                self.selectedIds = response.data.selectedIds
+              } else {
+                self.$message.error('load menu faild')
+              }
+              resolve()
+            })
+          }else{
+            self.$get('/sys/menu').then(response => {
+              if (response.code == 200) {
+                self.menus = response.data.list;
+
+              } else {
+                self.$message.error('load menu faild')
+              }
+              resolve()
+            })
+          }
+        })
+      },
+      labelFormatter: function (data, node) {
+        return data && data.i18n ? this.$t(data.i18n) : data.name
+      },
+      selectChange: function (data, isCheck, childIsCheck) {
+        if (this.$refs.menuTree) {
+          this.editRole.menuIds = this.$refs.menuTree.getCheckedKeys(true)
+        }
+      },
+      selectAllOrNone: function () {
+        if (this.$refs.menuTree) {
+          if (!this.selectAllFlag) {
+            this.$refs.menuTree.setCheckedNodes(this.menus)
+          } else {
+            this.$refs.menuTree.setCheckedNodes([])
+          }
+          this.selectAllFlag = !this.selectAllFlag
+        }
+      },
+      expandAllOrNone: function () {
+        this.expandAllFlag = !this.expandAllFlag
+        const $self = this
+        if (this.$refs.menuTree) {
+          this.menus.forEach(t => {
+            $self.$refs.menuTree.store.nodesMap[t.id].expanded = $self.expandAllFlag
+          })
+        }
+      },
+      save () {
+        if (this.prevent_opt.save) { return } ;
+        this.prevent_opt.save = true
+
+        this.$refs.userForm.validate((valid) => {
+          if (valid) {
+            if (this.editRole.id) {
+              this.$put(this.url, this.editRole).then(res => {
+                this.prevent_opt.save = false
+                if (res.code === 200) {
+                  this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
+                  this.esc(true)
+                } else {
+                  this.$message.error(res.msg)
+                }
+              })
+            } else {
+              this.$post(this.url, this.editRole).then(res => {
+                this.prevent_opt.save = false
+                if (res.code === 200) {
+                  this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
+                  this.esc(true)
+                } else {
+                  this.$message.error(res.msg)
+                }
+              })
+            }
+          } else {
+            this.prevent_opt.save = false
+            return false
+          }
+        })
+      }
+    }
+  }
+</script>
+<style lang="scss">
+  @import '@/assets/css/common/rightBoxCommon.scss';
+</style>
diff --git a/nezha-fronted/src/components/common/rightBox/administration/userBox.vue b/nezha-fronted/src/components/common/rightBox/administration/userBox.vue
new file mode 100644
index 000000000..f5fec6c55
--- /dev/null
+++ b/nezha-fronted/src/components/common/rightBox/administration/userBox.vue
@@ -0,0 +1,221 @@
+<template>
+  <div v-clickoutside="{obj: editUser, func: esc}" class="right-box right-box-asset">
+    <div class="right-box__header">
+      <div class="header__title">{{editUser.id ? $t('config.user.editUser') : $t('config.user.createUser')}}</div>
+      <div class="header__operation">
+        <span v-cancel="{obj: editUser, func: esc}"><i class="nz-icon nz-icon-close"></i></span>
+      </div>
+    </div>
+    <div class="right-box__container">
+      <div class="container__form">
+        <el-form ref="userForm" :model="editUser" :rules="editUser.id ? rules2 : rules" class="right-box-form right-box-form-left" label-position="top" label-width="120px">
+          <!--name-->
+          <el-form-item :label="$t('config.user.name')" prop="name">
+            <el-input id="account-input-name" v-model="editUser.name" :disabled="editUser.username==='admin' && editUser.id==1"
+                      maxlength="64" placeholder="" show-word-limit size="small" type="text"></el-input>
+          </el-form-item>
+          <!--username-->
+          <el-form-item :label="$t('config.user.username')" prop="username">
+            <el-input id="account-input-username" v-model="editUser.username" :disabled="editUser.username==='admin' && editUser.id==1"
+                      maxlength="64" placeholder="" show-word-limit size="small" type="text"></el-input>
+          </el-form-item>
+          <!--password-->
+          <el-form-item :label="$t('config.user.password')" prop="pin">
+            <el-input id="account-input-password" v-model="editUser.pin"  maxlength="16" placeholder=""
+                      show-word-limit size="small" type="password" @blur="passwordBlur"></el-input>
+          </el-form-item>
+          <!--passwordChange-->
+          <el-form-item :label="$t('config.user.confirmPwd')" label-width="200px" prop="pinChange">
+            <el-input id="account-input-passwordChange" v-model="editUser.pinChange"  maxlength="16" placeholder=""
+                      show-word-limit size="small" type="password"></el-input>
+          </el-form-item>
+          <!--email-->
+          <el-form-item label="E-mail" prop="email">
+            <el-input id="account-input-email" v-model="editUser.email" placeholder="" size="small" type="text"></el-input>
+          </el-form-item>
+          <!--mobile-->
+          <el-form-item :label="$t('config.user.mobile')" prop="mobile">
+            <el-input id="account-input-mobile" v-model.number="editUser.mobile" placeholder="" size="small" type="text"></el-input>
+          </el-form-item>
+          <!--enable-->
+          <el-form-item :label="$t('config.user.enable')">
+            <el-switch id="account-input-status" v-model="editUser.status" :disabled="isCurrentUser(editUser.username) || (editUser.username==='admin' && editUser.id==1) " active-color="#ee9d3f" active-value="1"
+                       inactive-value="0">
+            </el-switch>
+          </el-form-item>
+          <!--roles-->
+          <el-form-item :label="$t('config.user.roles')" prop="roleIds">
+            <el-select id="account-input-roleIds" v-model="editUser.roleIds" :disabled="(editUser.username==='admin') && editUser.id==1" multiple clearable collapse-tags placeholder="" popper-class="right-box-select-dropdown prevent-clickoutside" size="small" @change="()=>{this.$forceUpdate()}">
+              <template v-for="role in roles">
+                <el-option :key="role.id" :label="role.i18n?$t(role.i18n):role.name" :value="role.id"></el-option>
+              </template>
+            </el-select>
+          </el-form-item>
+          <el-form-item v-if="editUser.id" :label="$t('config.user.createTime')">
+            <div class="right-box-form-content-txt">{{editUser.createAt}}</div>
+          </el-form-item>
+
+        </el-form>
+      </div>
+    </div>
+    <div class="right-box__footer">
+      <button id="asset-edit-cancel" v-cancel="{obj: editUser, func: esc}" class="footer__btn footer__btn--light">
+        <span>{{$t('overall.cancel')}}</span>
+      </button>
+      <button id="asset-edit-save" :class="{'footer__btn--disabled': prevent_opt.save}" :disabled="prevent_opt.save" class="footer__btn" @click="save">
+        <span>{{$t('overall.save')}}</span>
+      </button>
+    </div>
+  </div>
+</template>
+
+<script>
+  import { host, port } from '@/components/common/js/validate'
+  export default {
+    name: 'userBox',
+    components: {
+    },
+    props: {
+      obj: {
+        type: Object
+      },
+    },
+    computed:{
+      isCurrentUser () {
+        return function (username) {
+          return localStorage.getItem('nz-username') == username
+        }
+      },
+    },
+    data () {
+      const vm = this
+      const validatePassword = (rule, value, callback) => { // 确认密码的二次校验
+        if (value === '' && this.editUser.pin) {
+          callback(new Error(this.$t('config.user.inputConfirmPwd')))
+        } else if (value !== this.editUser.pin) {
+          callback(new Error(this.$t('config.user.confirmPwdErr')))
+        } else {
+          callback()
+        }
+      }
+      return {
+        editUser: {},
+        url: 'sys/user',
+        rightBox: {model: {show: false}},
+        rules: { // 表单校验规则
+          name: [
+            { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+          ],
+          username: [
+            { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+          ],
+          pin: [
+            { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+          ],
+          pinChange: [
+            { validator: validatePassword, trigger: 'blur' },
+            { required: true, message: '', trigger: 'blur' }
+          ],
+          roleIds: [
+            { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+          ],
+          email: [
+            { type: 'email', message: this.$t('validate.email') }
+          ],
+        },
+        rules2: { // 表单校验规则
+          username: [
+            { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+          ],
+          pinChange: [
+            { validator: validatePassword, trigger: 'blur' }
+          ],
+          roleIds: [
+            { required: true, message: this.$t('validate.required'), trigger: 'blur' }
+          ],
+          email: [
+            { type: 'email', message: this.$t('validate.email') }
+          ]
+        },
+        roles: []
+      }
+    },
+    watch: {
+      obj: {
+        deep: true,
+        immediate: true,
+        handler (n) {
+          this.editUser = JSON.parse(JSON.stringify(n))
+          if(this.editUser.roles && this.editUser.roles.length>0){
+            this.editUser.roleIds=this.editUser.roles.map(t=>t.id)
+          }
+        }
+      },
+    },
+    mounted () {
+      this.getRoles()
+    },
+    methods: {
+      clickOutside () {
+        this.esc(false)
+      },
+      /* 关闭弹框 */
+      esc (refresh) {
+        this.prevent_opt.save = false
+        this.$emit('close', refresh)
+      },
+      /* 密码失去焦点 检验确认密码 */
+      passwordBlur () {
+        if (this.editUser.pin && this.editUser.pinChange) {
+          this.$refs.accountForm.validateField('passwordChange')
+        }
+      },
+      getRoles () {
+        this.roles = []
+        this.$get('sys/role?pageSize=-1').then(response => {
+          if (response.code === 200) {
+            this.roles = response.data.list
+          } else {
+            this.$message.error('load roles faild')
+          }
+        })
+      },
+      save () {
+        if (this.prevent_opt.save) { return } ;
+        this.prevent_opt.save = true
+
+        this.$refs.userForm.validate((valid) => {
+          if (valid) {
+            if (this.editUser.id) {
+              this.$put(this.url, this.editUser).then(res => {
+                this.prevent_opt.save = false
+                if (res.code === 200) {
+                  this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
+                  this.esc(true)
+                } else {
+                  this.$message.error(res.msg)
+                }
+              })
+            } else {
+              this.$post(this.url, this.editUser).then(res => {
+                this.prevent_opt.save = false
+                if (res.code === 200) {
+                  this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
+                  this.esc(true)
+                } else {
+                  this.$message.error(res.msg)
+                }
+              })
+            }
+          } else {
+            this.prevent_opt.save = false
+            return false
+          }
+        })
+      }
+    }
+  }
+</script>
+<style lang="scss">
+  @import '@/assets/css/common/rightBoxCommon.scss';
+</style>
diff --git a/nezha-fronted/src/components/common/searchSelectInfo.vue b/nezha-fronted/src/components/common/searchSelectInfo.vue
index 35efe09d4..ba861093f 100644
--- a/nezha-fronted/src/components/common/searchSelectInfo.vue
+++ b/nezha-fronted/src/components/common/searchSelectInfo.vue
@@ -101,7 +101,16 @@ const searchSelectInfo = { // value: 传给后台的值；label：显示给用
     {
       value: 'unknown',
       label: i18n.t('config.operationlog.operations.unknown')
-    }
+    },
+    {
+      value: 'login',
+      label: i18n.t('config.operationlog.operations.login')
+    },
+    {
+      value: 'logout',
+      label: i18n.t('config.operationlog.operations.logout')
+    },
+
   ],
   alertMessageState: [
     {
@@ -122,6 +131,16 @@ const searchSelectInfo = { // value: 传给后台的值；label：显示给用
       value: 'TELNET',
       label: i18n.t('config.terminallog.TELNET')
     }
+  ],
+  state:[
+    {
+      value: 'success',
+      label: i18n.t('overall.result.success')
+    },
+    {
+      value: 'fail',
+      label: i18n.t('overall.result.failed')
+    }
   ]
 }
 export default searchSelectInfo
diff --git a/nezha-fronted/src/components/common/table/settings/operationLogTable.vue b/nezha-fronted/src/components/common/table/settings/operationLogTable.vue
index f0d84fb91..a2a97f2e3 100644
--- a/nezha-fronted/src/components/common/table/settings/operationLogTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/operationLogTable.vue
@@ -38,7 +38,7 @@
                 {{scope.row[item.prop]}} ms
               </span>
         <span v-else-if="item.prop === 'username'">{{formatUsername(scope.row)}}</span>
-        <span v-else-if="item.prop === 'createDate'">{{utcTimeToTimezoneStr(scope.row[item.prop])}}</span>
+        <span v-else-if="item.prop === 'createDate'">{{scope.row[item.prop]}}</span>
         <span v-else>{{scope.row[item.prop]}}</span>
       </template>
     </el-table-column>
diff --git a/nezha-fronted/src/components/common/table/settings/userTable.vue b/nezha-fronted/src/components/common/table/settings/userTable.vue
index a5c5ae88c..19642c526 100644
--- a/nezha-fronted/src/components/common/table/settings/userTable.vue
+++ b/nezha-fronted/src/components/common/table/settings/userTable.vue
@@ -34,9 +34,7 @@
       <template slot-scope="scope" :column="item">
         <template v-if="item.prop === 'roles'">
           <template v-if="scope.row[item.prop]">
-            <template v-for="(role, index) in scope.row[item.prop]">
-              <span v-if="role" :key="index"></span>
-            </template>
+            {{scope.row[item.prop].map(t=>t.name).join(',')}}
           </template>
           <template v-else>
             <span>-</span>
diff --git a/nezha-fronted/src/components/page/config/changePwd.vue b/nezha-fronted/src/components/page/config/changePwd.vue
index baf66eb2e..ed661ebe7 100644
--- a/nezha-fronted/src/components/page/config/changePwd.vue
+++ b/nezha-fronted/src/components/page/config/changePwd.vue
@@ -2,17 +2,17 @@
   <div>
     <el-dialog class="nz-dialog" :title="$t('overall.changePwd')" :visible.sync="visible"  @open="dialogOpened"  :modal-append-to-body='false' @closed="dialogClosed" width="600px" :show-close="false" >
       <el-form :model="user" label-position = "top" label-width="150px" :rules="rules" ref="changePwdForm" size="mini">
-        <el-form-item :label="$t('config.account.account')" prop="username" v-show="curUser != sysUser">
+        <el-form-item :label="$t('config.user.account')" prop="username" v-show="curUser != sysUser">
           <el-input type="text" autocomplete="false" v-model="user.username" disabled id="change-pwd-username"></el-input>
         </el-form-item>
-        <el-form-item :label="$t('config.account.oldPwd')" prop="pwd">
-          <el-input type="password" autocomplete="false" :show-password="true" v-model="user.pwd" maxlength="20" :placeholder="$t('config.account.inputOldPwd')" id="change-pwd-pwd"></el-input>
+        <el-form-item :label="$t('config.user.oldPwd')" prop="pwd">
+          <el-input type="password" autocomplete="false" :show-password="true" v-model="user.pwd" maxlength="20" :placeholder="$t('config.user.inputOldPwd')" id="change-pwd-pwd"></el-input>
         </el-form-item>
-        <el-form-item :label="$t('config.account.newPwd')" prop="newPwd">
-          <el-input type="password" autocomplete="false" :show-password="true" v-model="user.newPwd" maxlength="20" :placeholder="$t('config.account.inputNewPwd')" id="change-pwd-newPwd"></el-input>
+        <el-form-item :label="$t('config.user.newPwd')" prop="newPwd">
+          <el-input type="password" autocomplete="false" :show-password="true" v-model="user.newPwd" maxlength="20" :placeholder="$t('config.user.inputNewPwd')" id="change-pwd-newPwd"></el-input>
         </el-form-item>
-        <el-form-item :label="$t('config.account.confirmPwd')" prop="confirmPwd">
-          <el-input type="password" autocomplete="false"  :show-password="true" v-model="user.confirmPwd" maxlength="20" :placeholder="$t('config.account.inputConfirmPwd')" id="change-pwd-confirmPwd"></el-input>
+        <el-form-item :label="$t('config.user.confirmPwd')" prop="confirmPwd">
+          <el-input type="password" autocomplete="false"  :show-password="true" v-model="user.confirmPwd" maxlength="20" :placeholder="$t('config.user.inputConfirmPwd')" id="change-pwd-confirmPwd"></el-input>
         </el-form-item>
       </el-form>
       <!--底部按钮-->
@@ -46,14 +46,14 @@ export default {
       if (value && value != '') {
         callback()
       } else {
-        callback(new Error(temp.$t('config.account.invalidPwd')))
+        callback(new Error(temp.$t('config.user.invalidPwd')))
       }
     }
     const validateConfirmPass = (rule, value, callback) => {
       if (value && value != '' && value == temp.user.newPwd) {
         callback()
       } else {
-        callback(new Error(temp.$t('config.account.confirmPwdErr')))
+        callback(new Error(temp.$t('config.user.confirmPwdErr')))
       }
     }
     return {
@@ -67,7 +67,7 @@ export default {
       rules: {
         pwd: [{ required: true, message: this.$t('validate.required'), trigger: 'blur' }],
         newPwd: [{ required: true, message: this.$t('validate.required'), trigger: 'blur' }, { validator: validatePass, trigger: 'blur' }],
-        confirmPwd: [{ required: true, message: this.$t('config.account.reinputPwd'), trigger: 'blur' }, { validator: validateConfirmPass, trigger: 'blur' }]
+        confirmPwd: [{ required: true, message: this.$t('config.user.reinputPwd'), trigger: 'blur' }, { validator: validateConfirmPass, trigger: 'blur' }]
       },
       visible: false
     }
@@ -94,7 +94,7 @@ export default {
             pin: this.user.pwd,
             newPin: this.user.newPwd
           }
-          this.$get('/sys/user/password?pin=' + paramObj.pin + '&newPin=' + paramObj.newPin).then(response => {
+          this.$get('/sys/user/pin?oldPin=' + paramObj.pin + '&newPin=' + paramObj.newPin).then(response => {
             if (response && response.code == 200) {
               this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
               this.close()
diff --git a/nezha-fronted/src/components/page/config/operationLog.vue b/nezha-fronted/src/components/page/config/operationLog.vue
index 3481112e7..db7f1b603 100644
--- a/nezha-fronted/src/components/page/config/operationLog.vue
+++ b/nezha-fronted/src/components/page/config/operationLog.vue
@@ -6,6 +6,7 @@
       :layout="['searchInput', 'elementSet']"
       :custom-table-title.sync="tools.customTableTitle"
       :from="fromRoute.operationLog"
+      @search="search"
       :search-msg="searchMsg">
       <template v-slot:default="slotProps">
         <operation-log-table
@@ -43,7 +44,7 @@ export default {
   mixins: [dataListMixin],
   data () {
     return {
-      url: 'sys/log/list',
+      url: 'sys/log',
       tableId: 'operationLogTable', // 需要分页的table的id，用于记录每页数量
       searchMsg: { // 给搜索框子组件传递的信息
         zheze_none: true,
@@ -66,9 +67,27 @@ export default {
             type: 'selectString',
             label: 'operation',
             disabled: false
-          }
+          },{
+            id: 14,
+            name: this.$t('config.operationlog.operaId'),
+            type: 'input',
+            label: 'operaId',
+            disabled: false
+          },{
+            id: 16,
+            name: this.$t('config.operationlog.state'),
+            type: 'selectString',
+            label: 'state',
+            disabled: false
+          }, {
+            id: 17,
+            name: this.$t('config.operationlog.params'),
+            type: 'input',
+            label: 'params',
+            disabled: false
+          },
         ]
-      }
+      },
     }
   }
 }
diff --git a/nezha-fronted/src/components/page/config/roles.vue b/nezha-fronted/src/components/page/config/roles.vue
index 68cff08bc..7f27549b6 100644
--- a/nezha-fronted/src/components/page/config/roles.vue
+++ b/nezha-fronted/src/components/page/config/roles.vue
@@ -35,12 +35,12 @@
       </template>
     </nz-data-list>
     <transition name="right-box">
-      <role-box v-if="rightBox.show" :role="object" @close="closeRightBox"></role-box>
+      <role-box v-if="rightBox.show" :obj="object" @close="closeRightBox"></role-box>
     </transition>
   </div>
 </template>
 <script>
-import roleBox from '@/components/common/rightBox/roleBox'
+import roleBox from '@/components/common/rightBox/administration/roleBox'
 import deleteButton from '@/components/common/deleteButton'
 import nzDataList from '@/components/common/table/nzDataList'
 import dataListMixin from '@/components/common/mixin/dataList'
diff --git a/nezha-fronted/src/components/page/config/system.vue b/nezha-fronted/src/components/page/config/system.vue
index cc19cdb9c..c3926c1f3 100644
--- a/nezha-fronted/src/components/page/config/system.vue
+++ b/nezha-fronted/src/components/page/config/system.vue
@@ -56,7 +56,7 @@
                 <el-option v-for="(item,index) in timezoneOption" :key="index" :label="item.name" :value="item.name" >
                   <div style="display: flex;justify-content: space-between;padding: 5px;">
                     <div >{{item.name}}</div>
-                    <div >{{timezoneOptionHandler(item.offset)}}</div>
+                    <div class="utc-item">{{timezoneOptionHandler(item.offset)}}</div>
                   </div>
                 </el-option>
               </el-select>
@@ -296,7 +296,7 @@ export default {
       emailCopy: null,
       emailRules: {
         email_host: [
-          // { required: true, message: this.$t('validate.required'), trigger: 'blur' },
+          { required: true, message: this.$t('validate.required'), trigger: 'blur' },
           { validator: hostPlus, trigger: 'blur' }
         ],
         email_port: [
@@ -304,7 +304,7 @@ export default {
           { validator: port, trigger: 'blur' }
         ],
         email_auth_account: [
-          { required: true, message: this.$t('validate.required'), trigger: 'blur' },
+          // { required: true, message: this.$t('validate.required'), trigger: 'blur' },
           { type: 'email', message: this.$t('validate.email'), trigger: 'blur' }
         ],
         email_send_account: [{ type: 'email', message: this.$t('validate.email'), trigger: 'blur' }],
@@ -318,7 +318,7 @@ export default {
       },
       terminalCopy: null,
       terminalRules: {
-        terminal_timeout: [{ validator: positiveInteger, trigger: 'blur' }],
+        // terminal_timeout: [{ validator: positiveInteger, trigger: 'blur' }],
         terminal_record_local_retention: [{ required: true, message: this.$t('validate.required'), trigger: 'blur' }, { validator: positiveInteger, trigger: 'blur' }],
       },
       ldap: {
@@ -918,6 +918,10 @@ export default {
   .system-config-form  /deep/ .el-input input{
     text-align: left;
   }
+  .utc-item{
+    color: #999999;
+    font-size: 12px;
+  }
 </style>
 <style lang="scss">
   .system {
@@ -1082,7 +1086,7 @@ export default {
     color: #8c939d;
     width: 100px;
     height: 100px;
-    line-height: 100px;
+    line-height: 100px !important;
     vertical-align: middle;
     text-align: center;
   }
diff --git a/nezha-fronted/src/components/page/config/system/apiKeyTable.vue b/nezha-fronted/src/components/page/config/system/apiKeyTable.vue
index d9974cfba..e8b487798 100644
--- a/nezha-fronted/src/components/page/config/system/apiKeyTable.vue
+++ b/nezha-fronted/src/components/page/config/system/apiKeyTable.vue
@@ -90,7 +90,7 @@
             <button type="button" class="nz-btn nz-btn-size-mini-new nz-btn-style-light-new" @click="cancel(scope.row)" :disabled="prevent_opt.save"><span>{{$t('overall.cancel')}}</span></button>
           </template>
           <template v-else>
-            <button class="table-operation-item" :command="['delete', scope.row]" :disabled="isBuiltIn(scope.row)"><i class="nz-icon nz-icon-delete"></i></button>
+            <button class="table-operation-item" @click="$emit('del',scope.row)" :disabled="isBuiltIn(scope.row)"><i class="nz-icon nz-icon-delete"></i></button>
           </template>
         </div>
       </el-table-column>
diff --git a/nezha-fronted/src/components/page/config/user.vue b/nezha-fronted/src/components/page/config/user.vue
index 4193c53d2..da50af21a 100644
--- a/nezha-fronted/src/components/page/config/user.vue
+++ b/nezha-fronted/src/components/page/config/user.vue
@@ -36,13 +36,13 @@
       </template>
     </nz-data-list>
     <transition name="right-box">
-      <user-box v-if="rightBox.show" :user="object" @close="closeRightBox"></user-box>
+      <user-box v-if="rightBox.show" :obj="object" @close="closeRightBox"></user-box>
     </transition>
   </div>
 </template>
 <script>
 import deleteButton from '@/components/common/deleteButton'
-import userBox from '@/components/common/rightBox/userBox'
+import userBox from '@/components/common/rightBox/administration/userBox'
 import nzDataList from '@/components/common/table/nzDataList'
 import dataListMixin from '@/components/common/mixin/dataList'
 import userTable from '@/components/common/table/settings/userTable'
@@ -79,7 +79,7 @@ export default {
           id: 10,
           name: this.$t('config.user.user'),
           type: 'input',
-          label: 'username',
+          label: 'name',
           disabled: false
         }]
       }