用户新增启用禁用

src/components/UserSelect.vue

@@ -28,7 +28,13 @@ export default {
     disabled: { type: Boolean, default: false },
     placeholder: { type: String, default: "请选择用户" },
     value: { type: [Number, String], default: "" },
-    clearable: { type: Boolean, default: true }
+    clearable: { type: Boolean, default: true },
+    filterData: {
+      type: Object,
+      default() {
+        return {};
+      }
+    }
   },
   data() {
     return {
@@ -46,13 +52,14 @@ export default {
     }
   },
   created() {
+    console.log("create");
     this.search();
   },
   methods: {
     async search() {
       this.optionList = [];
 
-      const res = await userListQuery();
+      const res = await userListQuery({ ...this.filterData });
       this.dataList = res || [];
       this.optionList = this.dataList;
     },

src/constants/navs.js

@@ -117,6 +117,6 @@ export const ROLE_NAV = {
         "app_nginx_prod_edit"
       ]
     },
-    { url: "UserManage", privilege: ["add", "edit", "resetPwd"] }
+    { url: "UserManage", privilege: ["add", "edit", "enable", "resetPwd"] }
   ]
 };

src/modules/admin/components/ModifyApp.vue

@@ -14,7 +14,6 @@
       ref="modalFormComp"
       :model="modalForm"
       :rules="rules"
-      :key="modalForm.id"
       label-width="60px"
     >
       <el-form-item prop="name" label="名称：">

src/modules/admin/components/ModifyAppEnv.vue

@@ -14,7 +14,6 @@
       ref="modalFormComp"
       :model="modalForm"
       :rules="rules"
-      :key="modalForm.id"
       label-width="80px"
     >
       <el-form-item prop="name" label="名称：">
@@ -50,6 +49,7 @@
         <user-select
           v-model="modalForm.userId"
           placeholder="请选择维护人"
+          :filter-data="{ enable: true }"
         ></user-select>
       </el-form-item>
     </el-form>

src/modules/admin/components/ModifyAppModule.vue

@@ -14,7 +14,6 @@
       ref="modalFormComp"
       :model="modalForm"
       :rules="rules"
-      :key="modalForm.id"
       label-width="60px"
     >
       <el-form-item prop="name" label="名称：">

src/modules/admin/components/ModifyAppVersion.vue

@@ -14,7 +14,6 @@
       ref="modalFormComp"
       :model="modalForm"
       :rules="rules"
-      :key="modalForm.id"
       label-width="60px"
       @submit.native.prevent
     >

src/modules/admin/components/ModifyUser.vue

@@ -72,7 +72,8 @@ const initModalForm = {
   loginName: "",
   name: "",
   role: [],
-  password: ""
+  password: "",
+  enable: true
 };
 
 export default {

src/modules/admin/components/UpdateAppBaseline.vue

@@ -14,7 +14,6 @@
       ref="modalFormComp"
       :model="modalForm"
       :rules="rules"
-      :key="modalForm.id"
       label-width="100px"
     >
       <el-form-item prop="uploadData" label="上传文件：">

src/modules/admin/views/UserManage.vue

@@ -26,6 +26,21 @@
             ></el-option>
           </el-select>
         </el-form-item>
+        <el-form-item label="启用/禁用：" label-width="90px">
+          <el-select
+            v-model="filter.enable"
+            style="width: 120px;"
+            placeholder="启用/禁用"
+            clearable
+          >
+            <el-option
+              v-for="(val, key) in ABLE_TYPE"
+              :key="key"
+              :value="key * 1"
+              :label="val"
+            ></el-option>
+          </el-select>
+        </el-form-item>
 
         <el-form-item label-width="0px">
           <el-button type="primary" @click="toPage(1)">查询</el-button>
@@ -39,9 +54,26 @@
     <div class="part-box part-box-pad">
       <el-table ref="TableList" :data="users">
         <el-table-column prop="id" label="ID" width="80"></el-table-column>
-        <el-table-column prop="loginName" label="用户名"></el-table-column>
-        <el-table-column prop="name" label="姓名"></el-table-column>
-        <el-table-column prop="roleNames" label="角色"> </el-table-column>
+        <el-table-column
+          prop="loginName"
+          label="用户名"
+          min-width="120"
+        ></el-table-column>
+        <el-table-column
+          prop="name"
+          label="姓名"
+          min-width="120"
+        ></el-table-column>
+        <el-table-column prop="roleNames" label="角色" min-width="200">
+        </el-table-column>
+        <el-table-column prop="enable" label="状态" width="80">
+          <span
+            slot-scope="scope"
+            :class="scope.row.enable ? 'color-primary' : 'color-danger'"
+          >
+            {{ scope.row.enable | ableTypeFilter }}
+          </span>
+        </el-table-column>
         <el-table-column prop="createTime" label="创建时间" width="170">
           <span slot-scope="scope">{{
             scope.row.createTime | timestampFilter
@@ -66,6 +98,13 @@
               @click="toEdit(scope.row)"
               >编辑</el-button
             >
+            <el-button
+              v-if="checkPrivilege('enable')"
+              :class="scope.row.enable ? 'btn-danger' : 'btn-primary'"
+              type="text"
+              @click="toEnable(scope.row)"
+              >{{ scope.row.enable ? "禁用" : "启用" }}</el-button
+            >
             <el-button
               v-if="checkPrivilege('resetPwd')"
               class="btn-danger"
@@ -103,6 +142,7 @@
 <script>
 import ModifyUser from "../components/ModifyUser";
 import { userListPage, userRoleList, userInsertOrUpdate } from "../api";
+import { ABLE_TYPE } from "../../../constants/enumerate";
 
 export default {
   name: "user-manage",
@@ -111,11 +151,13 @@ export default {
     return {
       filter: {
         loginNameStartWith: "",
-        role: ""
+        role: "",
+        enable: null
       },
       current: 1,
       size: this.GLOBAL.pageSize,
       total: 0,
+      ABLE_TYPE,
       roles: [],
       roleType: {},
       users: [],
@@ -146,6 +188,8 @@ export default {
         pageNumber: this.current,
         pageSize: this.size
       };
+      if (datas.enable !== null && datas.enable !== "")
+        datas.enable = !!datas.enable;
       const data = await userListPage(datas);
       this.users = data.records.map(item => {
         item.roleNames = item.role.map(code => this.roleType[code]).join("，");
@@ -168,6 +212,33 @@ export default {
     async toResetPwd(row) {
       await userInsertOrUpdate({ id: row.id, password: "123456" });
       this.$message.success("密码重置成功！");
+    },
+    async toEnable(row) {
+      // 自己不可以启用/禁用自己
+      const userId = this.$ls.get("user", { id: "" }).id;
+      if (row.id === userId) {
+        this.$message.error("不可以启用/禁用自己！");
+        return;
+      }
+
+      const action = row.enable ? "禁用" : "启用";
+      const confirm = await this.$confirm(
+        `确定要${action}用户【${row.name}】吗?`,
+        "提示",
+        {
+          type: "warning"
+        }
+      ).catch(() => {});
+
+      if (confirm !== "confirm") return;
+
+      const enable = !row.enable;
+      await userInsertOrUpdate({
+        id: row.id,
+        enable
+      });
+      row.enable = enable;
+      this.$message.success("操作成功！");
     }
   }
 };