Forráskód Böngészése

增加恢复已删除用户

Zt 2 éve
szülő
commit
b8a0aaa7e4

+ 17 - 0
chuanyi-admin/src/api/system/user.js

@@ -123,3 +123,20 @@ export function getAllUserByNoDept(query) {
     params: query
   })
 }
+
+// 查询所有已删除用户
+export function getDeleteUser(query) {
+  return request({
+    url: '/user/queryDeleteUser',
+    method: 'get',
+    params: query
+  })
+}
+
+// 恢复已删除用户
+export function recoveryUser(query) {
+  return request({
+    url: '/user/updateUserByListId?' + query,
+    method: 'get'
+  })
+}

+ 2 - 0
chuanyi-admin/src/utils/request.js

@@ -108,6 +108,7 @@ service.interceptors.response.use(
           {
             confirmButtonText: '重新登录',
             cancelButtonText: '取消',
+            closeOnClickModal: false,
             type: 'warning'
           }
         )
@@ -121,6 +122,7 @@ service.interceptors.response.use(
           .catch(() => {
             isRelogin.show = false
           })
+        return
       }
       return Promise.reject('无效的会话,或者会话已过期,请重新登录。')
     } else if (code === 500) {

+ 2 - 0
chuanyi-admin/src/views/system/menu/index.vue

@@ -198,6 +198,7 @@
                 <el-input
                   v-model.trim="form.menuName"
                   placeholder="请输入菜单名称"
+                  maxlength="10"
                 />
               </el-form-item>
             </el-col>
@@ -399,6 +400,7 @@ export default {
     handelEdit(id) {
       this.id = id
       this.dialogVisible = true
+      this.key++
       detailtMenuList({ id }).then((res) => {
         if (res.code === 200) {
           this.form = res.data

+ 7 - 1
chuanyi-admin/src/views/system/role/role-menu.vue

@@ -35,7 +35,13 @@
       <el-table-column label="菜单名称" prop="menuName" show-overflow-tooltip header-align="center" />
       <el-table-column label="菜单图标" prop="menuIcon" show-overflow-tooltip align="center" />
       <el-table-column label="菜单路径" prop="menuUrl" show-overflow- align="center" />
-      <el-table-column label="更新时间" prop="updateTime" show-overflow-tooltip align="center" />
+      <el-table-column label="更新时间" prop="updateTime" show-overflow-tooltip align="center">
+        <template slot-scope="scope">
+          {{
+            scope.row.updateTime === null ? "暂未更新" : scope.row.updateTime
+          }}
+        </template>
+      </el-table-column>
       <el-table-column label="创建时间" prop="createTime" show-overflow-tooltip align="center" />
       <el-table-column label="操作" align="center">
         <template slot-scope="scope">

+ 94 - 37
chuanyi-admin/src/views/system/role/role-menuSelect.vue

@@ -1,9 +1,21 @@
 <template>
   <!-- 授权用户 -->
-  <el-dialog title="添加菜单权限" width="1200px" :visible.sync="dialogVisible" :close-on-click-modal="false">
+  <el-dialog
+    title="添加菜单权限"
+    width="1200px"
+    :visible.sync="dialogVisible"
+    :close-on-click-modal="false"
+  >
     <el-row class="czBtns">
       <el-col>
-        <el-button type="primary" plain icon="el-icon-plus" size="mini" :disabled="distribution" @click="handleDel">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          :disabled="distribution"
+          @click="handleDel"
+        >
           批量分配</el-button>
       </el-col>
     </el-row>
@@ -20,16 +32,51 @@
       @selection-change="selectChange"
     >
       <el-table-column type="selection" align="center" />
-      <el-table-column label="菜单名称" prop="menuName" show-overflow-tooltip header-align="center" width="200" />
-      <el-table-column label="菜单图标" prop="menuIcon" show-overflow-tooltip align="center" />
-      <el-table-column label="菜单路径" prop="menuUrl" show-overflow- align="center" />
-      <el-table-column label="更新时间" prop="updateTime" show-overflow-tooltip align="center" />
-      <el-table-column label="创建时间" prop="createTime" show-overflow-tooltip align="center" />
+      <el-table-column
+        label="菜单名称"
+        prop="menuName"
+        show-overflow-tooltip
+        header-align="center"
+        width="200"
+      />
+      <el-table-column
+        label="菜单图标"
+        prop="menuIcon"
+        show-overflow-tooltip
+        align="center"
+      />
+      <el-table-column
+        label="菜单路径"
+        prop="menuUrl"
+        show-overflow-
+        align="center"
+      />
+      <el-table-column
+        label="更新时间"
+        prop="updateTime"
+        show-overflow-tooltip
+        align="center"
+      >
+        <template slot-scope="scope">
+          {{
+            scope.row.updateTime === null ? "暂未更新" : scope.row.updateTime
+          }}
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="创建时间"
+        prop="createTime"
+        show-overflow-tooltip
+        align="center"
+      />
       <el-table-column label="操作" align="center">
         <template slot-scope="scope">
-          <el-button type="text" size="mini" :disabled="!distribution" @click="addMenu(scope.row.id, $event)"><i
-            class="el-icon-circle-plus-outline celBtn"
-          /><span>分配</span>
+          <el-button
+            type="text"
+            size="mini"
+            :disabled="!distribution"
+            @click="addMenu(scope.row.id, $event)"
+          ><i class="el-icon-circle-plus-outline celBtn" /><span>分配</span>
           </el-button>
         </template>
       </el-table-column>
@@ -38,7 +85,11 @@
 </template>
 
 <script>
-import { getMenuListTree, distributionMenu, getRoleMenuIds } from '@/api/system/role'
+import {
+  getMenuListTree,
+  distributionMenu,
+  getRoleMenuIds
+} from '@/api/system/role'
 import multipleCheck from '@/views/system/mixins/multipleCheck'
 export default {
   mixins: [multipleCheck],
@@ -60,9 +111,7 @@ export default {
       selectFlag: false
     }
   },
-  created() {
-
-  },
+  created() {},
   methods: {
     /** 显示弹框 */
     show() {
@@ -71,7 +120,7 @@ export default {
     },
     /** 所有菜单树信息 */
     getMenuListTree() {
-      getMenuListTree().then(res => {
+      getMenuListTree().then((res) => {
         const data = res.data
         this.mulData = data
         this.toggle(this.mulData)
@@ -80,7 +129,7 @@ export default {
     },
     /** 查看角色已有菜单id集合 */
     getRoleMenuIds() {
-      getRoleMenuIds({ roleId: this.distObj.id }).then(res => {
+      getRoleMenuIds({ roleId: this.distObj.id }).then((res) => {
         if (res.code === 200) {
           const data = res.data
           this.roleMenuIds = data
@@ -90,15 +139,17 @@ export default {
     },
     /** 初始选中已有菜单 */
     toggle(data) {
-      data.forEach(item => {
+      data.forEach((item) => {
         if (this.roleMenuIds.length) {
-          this.roleMenuIds.forEach(el => {
+          this.roleMenuIds.forEach((el) => {
             if (el === item.id) {
               this.$nextTick(() => {
-                this.$refs.table && this.$refs.table.toggleRowSelection(item, true)
+                this.$refs.table &&
+                  this.$refs.table.toggleRowSelection(item, true)
               })
             }
-            this.$refs.table && this.$refs.table.toggleRowExpansion(item, false)
+            this.$refs.table &&
+              this.$refs.table.toggleRowExpansion(item, false)
           })
         } else {
           this.$refs.table && this.$refs.table.toggleRowExpansion(item, false)
@@ -110,7 +161,9 @@ export default {
     },
     /** 分配菜单多选 */
     selectChange(selection) {
-      this.distObj.menuList = selection.map(item => { return { id: item.id } })
+      this.distObj.menuList = selection.map((item) => {
+        return { id: item.id }
+      })
       this.distribution = !selection.length
     },
     /** 分配按钮 */
@@ -123,15 +176,17 @@ export default {
         cancelButtonClass: 'btn_custom_cancel',
         closeOnClickModal: false,
         type: 'warning'
-      }).then(() => {
-        this.distObj.menuList.push({ id })
-        this.distributionMenu()
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消操作'
-        })
       })
+        .then(() => {
+          this.distObj.menuList.push({ id })
+          this.distributionMenu()
+        })
+        .catch(() => {
+          this.$message({
+            type: 'info',
+            message: '已取消操作'
+          })
+        })
     },
     /** 批量分配菜单按钮 */
     handleDel(event) {
@@ -142,18 +197,20 @@ export default {
         cancelButtonClass: 'btn_custom_cancel',
         closeOnClickModal: false,
         type: 'warning'
-      }).then(() => {
-        this.distributionMenu()
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消操作'
-        })
       })
+        .then(() => {
+          this.distributionMenu()
+        })
+        .catch(() => {
+          this.$message({
+            type: 'info',
+            message: '已取消操作'
+          })
+        })
     },
     /** 分配菜单请求 */
     distributionMenu() {
-      distributionMenu(this.distObj).then(res => {
+      distributionMenu(this.distObj).then((res) => {
         if (res.code === 200) {
           this.$message({
             type: 'success',

+ 185 - 0
chuanyi-admin/src/views/system/user/delet-user.vue

@@ -0,0 +1,185 @@
+<template>
+  <div>
+    <el-dialog
+      title="已删除用户"
+      :visible.sync="dialogVisible"
+      width="50%"
+      :close-on-click-modal="false"
+    >
+      <el-table
+        ref="userTable"
+        v-loading="loading"
+        :data="tableData"
+        stripe
+        border
+        header-row-class-name="headBackground"
+        @selection-change="handleSelectionChange"
+      >
+        <el-table-column type="selection" width="50" align="center" />
+        <el-table-column
+          v-if="false"
+          key="userId"
+          label="用户编号"
+          align="center"
+          prop="userId"
+        />
+        <el-table-column
+          key="userName"
+          label="用户名称"
+          align="center"
+          prop="userName"
+          :show-overflow-tooltip="true"
+        />
+        <el-table-column
+          key="state"
+          label="用户状态"
+          align="center"
+          prop="state"
+          :show-overflow-tooltip="true"
+        >
+          <template slot-scope="scope">
+            <span>{{ scope.row.state === 0 ? "正常" : "锁定" }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          key="userType"
+          label="用户类型"
+          align="center"
+          prop="userType"
+          :show-overflow-tooltip="true"
+        >
+          <template slot-scope="scope">
+            <span>{{
+              scope.row.userType === 0 ? "客户端用户" : "管理端用户"
+            }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          key="lastLoginTime"
+          label="最后登录时间"
+          align="center"
+          prop="lastLoginTime"
+          width="160"
+        >
+          <template slot-scope="scope">
+            {{
+              scope.row.lastLoginTime === null
+                ? "暂未登陆"
+                : scope.row.lastLoginTime
+            }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="创建时间"
+          align="center"
+          prop="createTime"
+          width="160"
+        />
+      </el-table>
+      <span slot="footer" class="dialog-footer">
+        <el-button size="mini" type="primary" @click="submit">确定</el-button>
+        <el-button size="mini" @click="dialogVisible = false">取消</el-button>
+      </span>
+      <pagination
+        v-show="total > 0"
+        :total="total"
+        :page.sync="queryParams.page"
+        :limit.sync="queryParams.num"
+        align="right"
+        @pagination="getList"
+      />
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { getDeleteUser, recoveryUser } from '@/api/system/user'
+import qs from 'qs'
+export default {
+  data() {
+    return {
+      // 弹框
+      dialogVisible: false,
+      // 查询参数
+      queryParams: {
+        page: 1,
+        num: 10,
+        userName: null
+      },
+      // 表格数据
+      tableData: [],
+      // 列表总数
+      total: 0,
+      // 加载状态
+      loading: true,
+      // 选中恢复用户集合
+      userIdList: []
+    }
+  },
+  methods: {
+    /** 打开弹框 */
+    show() {
+      this.dialogVisible = true
+      this.getList()
+    },
+    /** 被删除用户表格 */
+    getList() {
+      getDeleteUser(this.queryParams).then((res) => {
+        if (res.code === 200) {
+          const data = res.data
+          this.tableData = data.userList
+          this.total = data.count
+          this.loading = false
+        }
+      })
+    },
+    /** 表格多选 */
+    handleSelectionChange(val) {
+      this.userIdList = val.map((item) => {
+        return item.userId
+      })
+    },
+    /** 确定提交 */
+    submit() {
+      if (!this.userIdList.length) {
+        this.$message({
+          type: 'warning',
+          message: '请选择已删除用户'
+        })
+        return
+      }
+      this.$confirm('是否恢复已删除用户?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
+        closeOnClickModal: false,
+        type: 'warning'
+      })
+        .then(() => {
+          this.recoveryUser()
+        })
+        .catch(() => {
+          this.$message({
+            type: 'info',
+            message: '已取消操作'
+          })
+        })
+    },
+    /** 恢复删除用户请求 */
+    recoveryUser() {
+      recoveryUser(
+        qs.stringify({ userIdList: this.userIdList }, { arrayFormat: 'repeat' })
+      ).then((res) => {
+        if (res.code === 200) {
+          this.$message({
+            message: '恢复用户成功',
+            type: 'success'
+          })
+          this.dialogVisible = false
+          this.$emit('updataData')
+        }
+      })
+    }
+  }
+}
+</script>

+ 257 - 98
chuanyi-admin/src/views/system/user/index.vue

@@ -21,26 +21,62 @@
             />
           </el-form-item>
           <el-form-item label="用户状态" prop="state">
-            <el-select v-model="queryParams.state" placeholder="请选择用户状态" clearable style="width: 150px">
-              <el-option v-for="status in userStatus" :key="status.value" :label="status.name" :value="status.value" />
+            <el-select
+              v-model="queryParams.state"
+              placeholder="请选择用户状态"
+              clearable
+              style="width: 150px"
+            >
+              <el-option
+                v-for="status in userStatus"
+                :key="status.value"
+                :label="status.name"
+                :value="status.value"
+              />
             </el-select>
           </el-form-item>
           <el-form-item label="用户类型" prop="userType">
-            <el-select v-model="queryParams.userType" placeholder="请选择用户类型" clearable style="width: 150px">
-              <el-option v-for="type in userType" :key="type.value" :label="type.name" :value="type.value" />
+            <el-select
+              v-model="queryParams.userType"
+              placeholder="请选择用户类型"
+              clearable
+              style="width: 150px"
+            >
+              <el-option
+                v-for="type in userType"
+                :key="type.value"
+                :label="type.name"
+                :value="type.value"
+              />
             </el-select>
           </el-form-item>
           <el-form-item>
-            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-            <el-button ref="btn" icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+            <el-button
+              type="primary"
+              icon="el-icon-search"
+              size="mini"
+              @click="handleQuery"
+            >搜索</el-button>
+            <el-button
+              ref="btn"
+              icon="el-icon-refresh"
+              size="mini"
+              @click="resetQuery"
+            >重置</el-button>
           </el-form-item>
         </el-form>
         <!-- 操作按钮 -->
         <el-row class="czBtns">
           <el-col :span="1.5">
-            <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
+            <el-button
+              type="primary"
+              plain
+              icon="el-icon-plus"
+              size="mini"
+              @click="handleAdd"
+            >新增</el-button>
           </el-col>
-          <el-col :span="1.5" style="margin-left: 15px;">
+          <el-col :span="1.5" style="margin-left: 15px">
             <el-button
               type="danger"
               size="mini"
@@ -52,6 +88,17 @@
               批量删除
             </el-button>
           </el-col>
+          <el-col :span="1.5" style="margin-left: 15px">
+            <el-button
+              type="primary"
+              size="mini"
+              plain
+              icon="el-icon-user-solid"
+              @click="handleDelUser"
+            >
+              已删除用户
+            </el-button>
+          </el-col>
         </el-row>
         <!-- 表格数据信息 -->
         <el-table
@@ -64,23 +111,68 @@
           @selection-change="handleSelectionChange"
         >
           <el-table-column type="selection" width="50" align="center" />
-          <el-table-column v-if="false" key="userId" label="用户编号" align="center" prop="userId" />
-          <el-table-column key="userName" label="用户名称" align="center" prop="userName" :show-overflow-tooltip="true" />
-          <el-table-column key="state" label="用户状态" align="center" prop="state" :show-overflow-tooltip="true">
+          <el-table-column
+            v-if="false"
+            key="userId"
+            label="用户编号"
+            align="center"
+            prop="userId"
+          />
+          <el-table-column
+            key="userName"
+            label="用户名称"
+            align="center"
+            prop="userName"
+            :show-overflow-tooltip="true"
+          />
+          <el-table-column
+            key="state"
+            label="用户状态"
+            align="center"
+            prop="state"
+            :show-overflow-tooltip="true"
+          >
             <template slot-scope="scope">
               <span>{{ convertUserStatus(scope.row.state) }}</span>
             </template>
           </el-table-column>
-          <el-table-column key="userType" label="用户类型" align="center" prop="userType" :show-overflow-tooltip="true">
+          <el-table-column
+            key="userType"
+            label="用户类型"
+            align="center"
+            prop="userType"
+            :show-overflow-tooltip="true"
+          >
             <template slot-scope="scope">
               <span>{{ convertUserType(scope.row.userType) }}</span>
             </template>
           </el-table-column>
-          <el-table-column key="lastLoginTime" label="最后登录时间" align="center" prop="lastLoginTime" width="160" />
-          <el-table-column label="创建时间" align="center" prop="createTime" width="160" />
-          <el-table-column label="操作" align="center" width="250" class-name="small-padding fixed-width">
+          <el-table-column
+            key="lastLoginTime"
+            label="最后登录时间"
+            align="center"
+            prop="lastLoginTime"
+            width="160"
+          />
+          <el-table-column
+            label="创建时间"
+            align="center"
+            prop="createTime"
+            width="160"
+          />
+          <el-table-column
+            label="操作"
+            align="center"
+            width="250"
+            class-name="small-padding fixed-width"
+          >
             <template v-if="scope.row.userId !== 1" slot-scope="scope">
-              <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">修改</el-button>
+              <el-button
+                size="mini"
+                type="text"
+                icon="el-icon-edit"
+                @click="handleUpdate(scope.row)"
+              >修改</el-button>
               <el-button
                 size="mini"
                 type="text"
@@ -88,7 +180,12 @@
                 :disabled="!multiple"
                 @click="handleDelete(scope.row)"
               >删除</el-button>
-              <el-button size="mini" type="text" icon="el-icon-key" @click="handleResetPwd(scope.row)">重置密码</el-button>
+              <el-button
+                size="mini"
+                type="text"
+                icon="el-icon-key"
+                @click="handleResetPwd(scope.row)"
+              >重置密码</el-button>
             </template>
           </el-table-column>
         </el-table>
@@ -109,12 +206,12 @@
       :title="title"
       :visible.sync="open"
       width="500px"
-      style="margin-top:15vh"
+      style="margin-top: 15vh"
       append-to-body
       :close-on-click-modal="false"
     >
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-row style="margin-bottom:5px">
+        <el-row style="margin-bottom: 5px">
           <el-col>
             <el-form-item label="用户名称" prop="userName">
               <el-input
@@ -122,7 +219,7 @@
                 v-model.trim="form.userName"
                 placeholder="请输入用户名称"
                 maxlength="20"
-                style="width:300px"
+                style="width: 300px"
                 minlength="2"
               />
               <el-input
@@ -132,14 +229,18 @@
                 maxlength="20"
                 minlength="2"
                 disabled
-                style="width:300px"
+                style="width: 300px"
               />
             </el-form-item>
           </el-col>
         </el-row>
-        <el-row style="margin-bottom:5px">
+        <el-row style="margin-bottom: 5px">
           <el-col>
-            <el-form-item v-if="form.userId == undefined" label="用户密码" prop="password">
+            <el-form-item
+              v-if="form.userId == undefined"
+              label="用户密码"
+              prop="password"
+            >
               <el-input
                 ref="password"
                 v-model.trim="form.password"
@@ -147,49 +248,64 @@
                 :type="passwordType"
                 maxlength="20"
                 auto-complete="new-password"
-                style="width:300px"
+                style="width: 300px"
               />
               <span class="show-pwd" @click="showPwd">
-                <svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
+                <svg-icon
+                  :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'"
+                />
               </span>
             </el-form-item>
           </el-col>
         </el-row>
-        <el-row style="margin-bottom:5px">
+        <el-row style="margin-bottom: 5px">
           <el-col :span="12">
             <el-form-item label="用户类型" prop="userType">
               <el-select v-model="form.userType" placeholder="请选择用户类型">
-                <el-option v-for="dict in userType" :key="dict.value" :label="dict.name" :value="dict.value" />
+                <el-option
+                  v-for="dict in userType"
+                  :key="dict.value"
+                  :label="dict.name"
+                  :value="dict.value"
+                />
               </el-select>
             </el-form-item>
           </el-col>
           <el-col :span="12">
             <el-form-item v-if="form.userId != undefined" label="用户状态">
               <el-radio-group v-model="form.state">
-                <el-radio v-for="dict in userStatus" :key="dict.value" :label="dict.value">{{ dict.name }}</el-radio>
+                <el-radio
+                  v-for="dict in userStatus"
+                  :key="dict.value"
+                  :label="dict.value"
+                >{{ dict.name }}</el-radio>
               </el-radio-group>
             </el-form-item>
           </el-col>
         </el-row>
-        <el-row style="margin-bottom:5px">
+        <el-row style="margin-bottom: 5px">
           <el-col>
             <el-form-item v-if="form.userId !== undefined" label="所属角色">
               <template v-if="form.roleList.length">
-                <el-tag v-for="item in form.roleList" :key="item.id" style="margin-right:10px">{{
-                  item.roleName
-                }}</el-tag>
+                <el-tag
+                  v-for="item in form.roleList"
+                  :key="item.id"
+                  style="margin-right: 10px"
+                >{{ item.roleName }}</el-tag>
               </template>
               <el-tag v-else>暂无角色</el-tag>
             </el-form-item>
           </el-col>
         </el-row>
-        <el-row style="margin-bottom:5px">
+        <el-row style="margin-bottom: 5px">
           <el-col>
             <el-form-item v-if="form.userId !== undefined" label="所属部门">
               <template v-if="form.departmentList.length">
-                <el-tag v-for="item in form.departmentList" :key="item.id" style="margin-right:10px">{{
-                  item.departmentName
-                }}</el-tag>
+                <el-tag
+                  v-for="item in form.departmentList"
+                  :key="item.id"
+                  style="margin-right: 10px"
+                >{{ item.departmentName }}</el-tag>
               </template>
               <el-tag v-else>暂无部门</el-tag>
             </el-form-item>
@@ -197,25 +313,48 @@
         </el-row>
       </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button type="primary" size="mini" @click="submitForm">确定</el-button>
+        <el-button
+          type="primary"
+          size="mini"
+          @click="submitForm"
+        >确定</el-button>
         <el-button size="mini" @click="cancel">取消</el-button>
       </div>
     </el-dialog>
+
+    <!-- 已删除用户 -->
+    <deleteUser ref="delUser" @updataData="getUserList" />
   </div>
 </template>
 
 <script>
-import { addUserInfo, getUserList, updateUserInfo, delUserById, userDetail, delUserByIds } from '@/api/system/user'
+import {
+  addUserInfo,
+  getUserList,
+  updateUserInfo,
+  delUserById,
+  userDetail,
+  delUserByIds
+} from '@/api/system/user'
 import { getPubKey } from '@/utils/auth'
 import { encrypt } from '@/utils/jsencrypt'
+import deleteUser from './delet-user.vue'
 export default {
   name: 'Index',
+  components: {
+    deleteUser
+  },
   data() {
     // 密码验证
     const validatePass = (rule, value, callback) => {
-      var reg = /(?!^\d+$)(?!^[A-Za-z]+$)(?!^[^A-Za-z0-9]+$)(?!^.*[\u4E00-\u9FA5].*$)^\S{5,20}$/
-      if (!(reg.test(value))) {
-        callback(new Error('密码必须为5-20位的字母、数字或符号任意两种的组合,不能有中文和空格'))
+      var reg =
+        /(?!^\d+$)(?!^[A-Za-z]+$)(?!^[^A-Za-z0-9]+$)(?!^.*[\u4E00-\u9FA5].*$)^\S{5,20}$/
+      if (!reg.test(value)) {
+        callback(
+          new Error(
+            '密码必须为5-20位的字母、数字或符号任意两种的组合,不能有中文和空格'
+          )
+        )
       }
       callback()
     }
@@ -261,8 +400,17 @@ export default {
       rules: {
         userName: [
           { required: true, message: '用户名称不能为空', trigger: 'blur' },
-          { min: 2, max: 20, message: '用户名称长度必须介于 2 和 20 之间', trigger: 'blur' },
-          { pattern: /^[^\s]*$/, message: '用户名称不能有空格', trigger: 'blur' }
+          {
+            min: 2,
+            max: 20,
+            message: '用户名称长度必须介于 2 和 20 之间',
+            trigger: 'blur'
+          },
+          {
+            pattern: /^[^\s]*$/,
+            message: '用户名称不能有空格',
+            trigger: 'blur'
+          }
         ],
         password: [
           { required: true, message: '用户密码不能为空', trigger: 'blur' },
@@ -292,7 +440,7 @@ export default {
     },
     /** 多选框选中数据 */
     handleSelectionChange(selection) {
-      this.ids = selection.map(item => item.userId)
+      this.ids = selection.map((item) => item.userId)
       this.multiple = !selection.length
     },
     /** 用户状态转换 */
@@ -318,11 +466,13 @@ export default {
     /** 查询用户列表 */
     getUserList() {
       this.loading = true
-      getUserList(this.queryParams).then(response => {
+      getUserList(this.queryParams).then((response) => {
         const data = response.data
         this.userList = data.userList
-        this.userList.forEach(item => {
-          item.lastLoginTime === null ? item.lastLoginTime = '暂未登录' : item.lastLoginTime
+        this.userList.forEach((item) => {
+          item.lastLoginTime === null
+            ? (item.lastLoginTime = '暂未登录')
+            : item.lastLoginTime
         })
         this.total = data.count
         this.loading = false
@@ -348,7 +498,7 @@ export default {
       }
       if (!userId) {
         const userIdList = this.ids
-        const isUid = userIdList.find(item => {
+        const isUid = userIdList.find((item) => {
           return item === uid
         })
         if (isUid === this.defaultAdminId) {
@@ -378,20 +528,22 @@ export default {
           cancelButtonClass: 'btn_custom_cancel',
           closeOnClickModal: false,
           type: 'warning'
-        }).then(() => {
-          const userId = userIdList
-          delUserByIds(userId).then(res => {
-            if (res.code === 200) {
-              this.$message({
-                message: '批量删除成功',
-                type: 'success'
-              })
-              this.getUserList()
-            }
-          })
-        }).catch(() => {
-          this.$refs.userTable.clearSelection()
         })
+          .then(() => {
+            const userId = userIdList
+            delUserByIds(userId).then((res) => {
+              if (res.code === 200) {
+                this.$message({
+                  message: '批量删除成功',
+                  type: 'success'
+                })
+                this.getUserList()
+              }
+            })
+          })
+          .catch(() => {
+            this.$refs.userTable.clearSelection()
+          })
         return
       }
       this.$confirm('您确定要删除用户【' + row.userName + '】吗?', '提示', {
@@ -400,20 +552,21 @@ export default {
         cancelButtonClass: 'btn_custom_cancel',
         closeOnClickModal: false,
         type: 'warning'
-      }).then(() => {
-        delUserById({
-          userId
-        }).then(response => {
-          if (response.code === 200) {
-            this.$message({
-              message: '删除成功',
-              type: 'success'
-            })
-            this.getUserList()
-          }
-        })
-      }).catch(() => {
       })
+        .then(() => {
+          delUserById({
+            userId
+          }).then((response) => {
+            if (response.code === 200) {
+              this.$message({
+                message: '删除成功',
+                type: 'success'
+              })
+              this.getUserList()
+            }
+          })
+        })
+        .catch(() => {})
     },
     /** 重置密码按钮操作 */
     handleResetPwd(row) {
@@ -432,29 +585,31 @@ export default {
         cancelButtonClass: 'btn_custom_cancel',
         closeOnClickModal: false,
         type: 'warning'
-      }).then(() => {
-        const data = this.$store.dispatch('user/ResetPassword', {
-          userId: row.userId,
-          newPassword: 'cy123456'
-        })
-        data.then(async(res) => {
-          if (res.code === 200) {
-            this.$message({
-              type: 'success',
-              message: '密码重置成功'
-            })
-            if (userId === uid) {
-              await this.$store.dispatch('user/Logout')
-              this.$router.push('/login')
+      })
+        .then(() => {
+          const data = this.$store.dispatch('user/ResetPassword', {
+            userId: row.userId,
+            newPassword: 'cy123456'
+          })
+          data.then(async(res) => {
+            if (res.code === 200) {
+              this.$message({
+                type: 'success',
+                message: '密码重置成功'
+              })
+              if (userId === uid) {
+                await this.$store.dispatch('user/Logout')
+                this.$router.push('/login')
+              }
             }
-          }
+          })
         })
-      }).catch(() => {
-        this.$message({
-          type: 'info',
-          message: '已取消重置'
+        .catch(() => {
+          this.$message({
+            type: 'info',
+            message: '已取消重置'
+          })
         })
-      })
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
@@ -465,7 +620,7 @@ export default {
         })
         return
       }
-      userDetail({ userId: row.userId }).then(res => {
+      userDetail({ userId: row.userId }).then((res) => {
         if (res.code === 200) {
           const data = res.data
           this.form = data
@@ -485,10 +640,10 @@ export default {
     },
     /** 表单提交 */
     submitForm() {
-      this.$refs['form'].validate(valid => {
+      this.$refs['form'].validate((valid) => {
         if (valid) {
           if (this.form.userId !== undefined) {
-            updateUserInfo(this.form).then(response => {
+            updateUserInfo(this.form).then((response) => {
               if (response.code === 200) {
                 this.$message({
                   message: '修改成功',
@@ -502,7 +657,7 @@ export default {
             const publicKey = getPubKey()
             const obj = JSON.parse(JSON.stringify(this.form))
             obj.password = encrypt(this.form.password, publicKey)
-            addUserInfo(obj).then(response => {
+            addUserInfo(obj).then((response) => {
               if (response.code === 200) {
                 this.$message({
                   message: '新增成功',
@@ -546,6 +701,10 @@ export default {
       this.$nextTick(() => {
         this.$refs.password.focus()
       })
+    },
+    /** 已删除用户弹框 */
+    handleDelUser() {
+      this.$refs.delUser.show()
     }
   }
 }