diff --git a/src/main/java/com/xuxd/kafka/console/service/impl/AclServiceImpl.java b/src/main/java/com/xuxd/kafka/console/service/impl/AclServiceImpl.java
index c6ebd80..0f01f49 100644
--- a/src/main/java/com/xuxd/kafka/console/service/impl/AclServiceImpl.java
+++ b/src/main/java/com/xuxd/kafka/console/service/impl/AclServiceImpl.java
@@ -15,6 +15,7 @@ import kafka.console.KafkaAclConsole;
 import kafka.console.KafkaConfigConsole;
 import lombok.extern.slf4j.Slf4j;
 import org.apache.commons.lang3.StringUtils;
+import org.apache.kafka.clients.admin.UserScramCredentialsDescription;
 import org.apache.kafka.common.acl.AclBinding;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
@@ -68,10 +69,11 @@ public class AclServiceImpl implements AclService {
             resultMap.put(k, map);
         });
         if (entry.isNull() || StringUtils.isNotBlank(entry.getPrincipal())) {
-            Set<String> userList = configConsole.getUserList(StringUtils.isNotBlank(entry.getPrincipal()) ? Collections.singletonList(entry.getPrincipal()) : null);
-            userList.forEach(u -> {
-                if (!resultMap.containsKey(u)) {
-                    resultMap.put(u, Collections.emptyMap());
+            Map<String, UserScramCredentialsDescription> detailList = configConsole.getUserDetailList(StringUtils.isNotBlank(entry.getPrincipal()) ? Collections.singletonList(entry.getPrincipal()) : null);
+
+            detailList.values().forEach(u -> {
+                if (!resultMap.containsKey(u.name()) && !u.credentialInfos().isEmpty()) {
+                    resultMap.put(u.name(), Collections.emptyMap());
                 }
             });
         }
diff --git a/src/main/scala/kafka/console/KafkaConfigConsole.scala b/src/main/scala/kafka/console/KafkaConfigConsole.scala
index 6c4c8c1..93c979f 100644
--- a/src/main/scala/kafka/console/KafkaConfigConsole.scala
+++ b/src/main/scala/kafka/console/KafkaConfigConsole.scala
@@ -5,7 +5,7 @@ import java.util.Set
 import java.util.concurrent.TimeUnit
 
 import com.xuxd.kafka.console.config.KafkaConfig
-import org.apache.kafka.clients.admin.{ScramCredentialInfo, ScramMechanism, UserScramCredentialDeletion, UserScramCredentialUpsertion}
+import org.apache.kafka.clients.admin._
 
 /**
  * kafka-console-ui.
@@ -23,6 +23,12 @@ class KafkaConfigConsole(config: KafkaConfig) extends KafkaConsole(config: Kafka
         }).asInstanceOf[Set[String]]
     }
 
+    def getUserDetailList(users: util.List[String]): util.Map[String, UserScramCredentialsDescription] = {
+        withAdminClient({
+            adminClient => adminClient.describeUserScramCredentials(users).all().get()
+        }).asInstanceOf[util.Map[String, UserScramCredentialsDescription]]
+    }
+
     def addOrUpdateUser(name: String, pass: String): Boolean = {
         withAdminClient(adminClient => {
             try {
diff --git a/ui/src/views/acl/Acl.vue b/ui/src/views/acl/Acl.vue
index f87e911..fe154fd 100644
--- a/ui/src/views/acl/Acl.vue
+++ b/ui/src/views/acl/Acl.vue
@@ -45,8 +45,22 @@
           </a-row>
         </a-form>
       </div>
+      <div class="operation-row-button">
+        <a-button type="primary" @click="updateUser">新增/更新用户</a-button>
+        <UpdateUser
+          :visible="showUpdateUser"
+          @updateDialogData="closeUpdateUserDialog"
+        ></UpdateUser>
+      </div>
       <a-table :columns="columns" :data-source="data" bordered>
-        <a slot="operation" slot-scope="{}">删除</a>
+        <a slot="operation" slot-scope="{}">
+          <a-button class="operation-btn">删除</a-button>
+          <a-button class="operation-btn">授予生产权限</a-button>
+          <a-button class="operation-btn">收回生产权限</a-button>
+          <a-button class="operation-btn">授予消费权限</a-button>
+          <a-button class="operation-btn">收回消费权限</a-button>
+          <a-button class="operation-btn">增加权限</a-button>
+        </a>
         <!--        <a-table-->
         <!--          slot="expandedRowRender"-->
         <!--          slot-scope="{}"-->
@@ -79,9 +93,11 @@
 <script>
 import request from "@/utils/request";
 import notification from "ant-design-vue/es/notification";
+import UpdateUser from "@/views/acl/UpdateUser";
 
 export default {
   name: "Acl",
+  components: { UpdateUser },
   data() {
     return {
       queryParam: {},
@@ -90,6 +106,7 @@ export default {
       innerColumns,
       innerData,
       form: this.$form.createForm(this, { name: "advanced_search" }),
+      showUpdateUser: false,
     };
   },
   methods: {
@@ -107,6 +124,7 @@ export default {
           queryParam.resourceType = "GROUP";
           queryParam.resourceName = values.groupId;
         }
+        Object.assign(this.queryParam, queryParam);
         getAclList(this.data, queryParam);
       });
     },
@@ -114,6 +132,16 @@ export default {
     handleReset() {
       this.form.resetFields();
     },
+
+    updateUser() {
+      this.showUpdateUser = true;
+    },
+    closeUpdateUserDialog(data) {
+      this.showUpdateUser = data.show;
+      if (data.ok) {
+        getAclList(this.data, this.queryParam);
+      }
+    },
   },
   created() {
     getAclList(this.data, this.queryParam);
@@ -232,4 +260,12 @@ for (let i = 0; i < 3; ++i) {
 .input-w {
   width: 400px;
 }
+
+.operation-row-button {
+  height: 4%;
+  text-align: left;
+}
+.operation-btn {
+  margin-right: 1%;
+}
 </style>
diff --git a/ui/src/views/acl/UpdateUser.vue b/ui/src/views/acl/UpdateUser.vue
new file mode 100644
index 0000000..68b268f
--- /dev/null
+++ b/ui/src/views/acl/UpdateUser.vue
@@ -0,0 +1,120 @@
+<template>
+  <a-modal
+    title="新增/更新用户"
+    :visible.sync="show"
+    :confirm-loading="confirmLoading"
+    :width="800"
+    @ok="handleOk"
+    @cancel="handleCancel"
+    okText="提交"
+    cancelText="取消"
+    :mask="true"
+  >
+    <div>
+      <a-form layout="vertical" :form="this.form">
+        <!--每一项元素-->
+        <a-form-item label="用户名">
+          <a-input
+            placeholder="username"
+            :allowClear="true"
+            :maxLength="50"
+            v-decorator="[
+              'username',
+              {
+                rules: [{ required: true, message: '请填写用户名!' }],
+              },
+            ]"
+          />
+        </a-form-item>
+        <a-form-item label="密码">
+          <a-input
+            placeholder="password"
+            :allowClear="true"
+            :maxLength="50"
+            v-decorator="[
+              'password',
+              {
+                rules: [{ required: true, message: '请填写密码!' }],
+              },
+            ]"
+          />
+        </a-form-item>
+      </a-form>
+    </div>
+  </a-modal>
+</template>
+
+<script>
+import request from "@/utils/request";
+import notification from "ant-design-vue/es/notification";
+export default {
+  name: "UpdateUser",
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  beforeCreate() {
+    //创建表单
+    this.form = this.$form.createForm(this, { name: "form_in_modal" });
+  },
+  data() {
+    return {
+      ModalText: "Content of the modal",
+      confirmLoading: false,
+      show: this.visible,
+      userForm: {},
+    };
+  },
+  watch: {
+    visible(val) {
+      this.show = val;
+    },
+  },
+  methods: {
+    handleOk() {
+      const form = this.form;
+      form.validateFields((err, values) => {
+        if (err) {
+          return;
+        }
+        request({
+          url: api.addKafkaUser.url,
+          method: api.addKafkaUser.method,
+          data: { username: values.username, password: values.password },
+        }).then((res) => {
+          console.log(res);
+          if (res.code == 0) {
+            notification.success({
+              message: res.msg,
+            });
+            form.resetFields();
+            this.$emit("updateDialogData", { ok: true, show: false });
+          } else {
+            notification.error({
+              message: res.msg,
+            });
+          }
+        });
+      });
+    },
+    handleCancel() {
+      this.$emit("updateDialogData", { ok: false, show: false });
+    },
+  },
+};
+
+const api = {
+  addKafkaUser: {
+    url: "/user",
+    method: "post",
+  },
+};
+</script>
+
+<style scoped>
+.input-c {
+  margin-bottom: 1%;
+}
+</style>