修改弹出框样式 修改取消用户角色问题

chuanyi-admin/src/App.vue

@@ -1,6 +1,6 @@
 <template>
   <div id="app">
-    <router-view/>
+    <router-view />
   </div>
 </template>
 
@@ -14,4 +14,8 @@ export default {
 .sy-content {
   margin: 15px;
 }
+.btn_custom_cancel {
+  float: right;
+  margin-left: 10px !important;
+}
 </style>

chuanyi-admin/src/permission.js

@@ -2,7 +2,7 @@ import router from './router'
 import store from './store'
 import NProgress from 'nprogress'
 import 'nprogress/nprogress.css'
-import { getToken } from '@/utils/auth'
+import { getToken, removeToken } from '@/utils/auth'
 import getPageTitle from '@/utils/get-page-title'
 
 NProgress.configure({ showSpinner: false })
@@ -16,7 +16,8 @@ router.beforeEach(async(to, from, next) => {
   const hasToken = getToken()
   if (hasToken) {
     if (to.path === '/login') {
-      next({ path: '/' })
+      next()
+      removeToken()
       NProgress.done()
     } else {
       if (to.matched.length === 0) {

chuanyi-admin/src/store/modules/permission.js

@@ -1,5 +1,6 @@
 import { constantRoutes } from '@/router'
 import { getRouters } from '@/api/menu'
+import { reject } from 'lodash'
 
 /**
  * 路由数据
@@ -85,11 +86,15 @@ const actions = {
     return new Promise(resolve => {
       // 向后端请求路由数据
       getRouters(roleIdList).then(res => {
-        const menuList = res.data.menuTree
-        const accessedRoutes = dynamicMenuRoutes(menuList)
-        accessedRoutes.push({ path: '*', redirect: '/404', hidden: true })
-        commit('SET_ROUTES', accessedRoutes)
-        resolve(accessedRoutes)
+        try {
+          const menuList = res.data.menuTree
+          const accessedRoutes = dynamicMenuRoutes(menuList)
+          accessedRoutes.push({ path: '*', redirect: '/404', hidden: true })
+          commit('SET_ROUTES', accessedRoutes)
+          resolve(accessedRoutes)
+        } catch (error) {
+          reject(error)
+        }
       })
     })
   }

chuanyi-admin/src/utils/request.js

@@ -5,6 +5,8 @@ import cache from '@/plugins/cache'
 import errorCode from '@/utils/errorCode'
 import { tansParams } from '@/utils/cqcy'
 import { logout } from '@/api/user'
+import store from '@/store'
+import router from '@/router'
 
 // 是否显示重新登录
 export const isRelogin = {
@@ -100,6 +102,15 @@ service.interceptors.response.use(res => {
       type: 'error'
     })
     return Promise.reject(new Error(msg))
+  } else if (code === 402) {
+    const roles = store.getters.roles
+    if (!roles.length) {
+      Message({
+        message: '请使用管理人员账号登录',
+        type: 'error'
+      })
+      router.replace({ path: '/login' })
+    }
   } else if (code !== 200) {
     console.log(code)
     Notification.error({

chuanyi-admin/src/views/system/auth/index.vue

@@ -146,6 +146,7 @@ export default {
       this.$confirm('是否删除该权限?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         deleteAuthList({ id }).then(res => {

chuanyi-admin/src/views/system/dept/index.vue

@@ -321,6 +321,7 @@ export default {
       this.$confirm('是否删除该部门?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         delDept([id]).then(res => {
@@ -344,6 +345,7 @@ export default {
       this.$confirm('是否批量删除部门?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         delDept(this.ids).then(res => {

chuanyi-admin/src/views/system/dict/dict-detail.vue

@@ -219,6 +219,7 @@ export default {
       this.$confirm('是否删除该字典?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         this.ids.push(id)
@@ -235,6 +236,7 @@ export default {
       this.$confirm('是否批量删除字典?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         this.delDictType()

chuanyi-admin/src/views/system/dict/index.vue

@@ -318,6 +318,7 @@ export default {
       this.$confirm('是否删除该字典?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         this.ids.push(id)
@@ -334,6 +335,7 @@ export default {
       this.$confirm('是否批量删除字典?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         this.delDictType()

chuanyi-admin/src/views/system/log/index.vue

@@ -134,6 +134,7 @@ export default {
       this.$confirm('是否清空6个月之前的日志记录?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         delLogList().then(res => {

chuanyi-admin/src/views/system/menu/index.vue

@@ -334,6 +334,7 @@ export default {
       this.$confirm('是否删除该菜单?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         delMenuList({ id }).then(res => {

chuanyi-admin/src/views/system/menu/menu-auth.vue

@@ -123,6 +123,7 @@ export default {
       this.$confirm('是否取消分配?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         this.delMenuAuthObj.permissionList.push({ id: row.id })
@@ -139,6 +140,7 @@ export default {
       this.$confirm('是否批量取消分配?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         this.delMenuAuth()

chuanyi-admin/src/views/system/menu/menu-dist.vue

@@ -130,6 +130,7 @@ export default {
       this.$confirm('是否分配接口权限?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         this.menuAuthObj.permissionList = []
@@ -147,6 +148,7 @@ export default {
       this.$confirm('是否批量分配接口权限?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         this.distMenuAuth()

chuanyi-admin/src/views/system/role/index.vue

@@ -211,6 +211,7 @@ export default {
     },
     /** 删除按钮操作 */
     handleDelete(row) {
+      console.log(row)
       const roleId = row.id
       if (!roleId) {
         const roleIdList = this.ids
@@ -224,6 +225,7 @@ export default {
         this.$confirm('您确定要删除选中的角色吗？', '提示', {
           confirmButtonText: '确定',
           cancelButtonText: '取消',
+          cancelButtonClass: 'btn_custom_cancel',
           type: 'warning'
         }).then(() => {
           for (const i in roleIdList) {
@@ -238,9 +240,10 @@ export default {
         })
         return
       }
-      this.$confirm('您确定要删除角色【' + row.userName + '】吗？', '提示', {
+      this.$confirm('您确定要删除角色【' + row.roleName + '】吗？', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         delRoleById({

chuanyi-admin/src/views/system/role/user-auth.vue

@@ -179,6 +179,7 @@ export default {
       this.$confirm('是否取消授权?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         cancelRoleAuth(query).then(res => {
@@ -202,6 +203,7 @@ export default {
       this.$confirm('是否取消授权?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         cancelAllRoleAuth(this.userIds).then(res => {

chuanyi-admin/src/views/system/role/user-menu.vue

@@ -237,6 +237,7 @@ export default {
       this.$confirm('是否分配菜单?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         this.distObj.menuList.push({ id })
@@ -253,6 +254,7 @@ export default {
       this.$confirm('是否批量分配菜单?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         this.distributionMenu()
@@ -269,6 +271,7 @@ export default {
       this.$confirm('是否分配菜单?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         this.delDistObj.menuList.push({ id })
@@ -286,6 +289,7 @@ export default {
       this.$confirm('是否批量分配菜单?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         this.delDistributionMenu()

chuanyi-admin/src/views/system/role/user-select.vue

@@ -157,7 +157,7 @@ export default {
           if (res.code === 200) {
             this.$message({
               message: res.data,
-              type: 'warning'
+              type: 'success'
             })
             this.$emit('updateUserList')
           }

chuanyi-admin/src/views/system/user/index.vue

@@ -11,7 +11,10 @@
           :inline="true"
           label-width="68px"
         >
-          <el-form-item label="用户名称" prop="userName">
+          <el-form-item
+            label="用户名称"
+            prop="userName"
+          >
             <el-input
               v-model="queryParams.userName"
               placeholder="请输入用户名称"
@@ -20,53 +23,170 @@
               @keyup.enter.native="handleQuery"
             />
           </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-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>
           </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-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>
           </el-form-item>
           <el-form-item>
-            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-            <el-button 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
+              icon="el-icon-refresh"
+              size="mini"
+              @click="resetQuery"
+            >重置</el-button>
           </el-form-item>
         </el-form>
         <!-- 操作按钮 -->
         <el-row>
           <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-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete">
+          <el-col
+            :span="1.5"
+            style="margin-left: 15px;"
+          >
+            <el-button
+              type="danger"
+              plain
+              icon="el-icon-delete"
+              size="mini"
+              :disabled="multiple"
+              @click="handleDelete"
+            >
               删除</el-button>
           </el-col>
         </el-row>
         <!-- 表格数据信息 -->
-        <el-table v-loading="loading" :data="userList" @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
+          v-loading="loading"
+          :data="userList"
+          @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>{{ 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">
-            <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-delete" @click="handleDelete(scope.row)">删除</el-button>
-              <el-button size="mini" type="text" icon="el-icon-key" @click="handleResetPwd(scope.row)">重置密码</el-button>
+          <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-delete"
+                @click="handleDelete(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>
@@ -83,17 +203,45 @@
     </el-row>
 
     <!-- 添加或修改用户配置对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+    <el-dialog
+      :title="title"
+      :visible.sync="open"
+      width="600px"
+      append-to-body
+    >
+      <el-form
+        ref="form"
+        :model="form"
+        :rules="rules"
+        label-width="80px"
+      >
         <el-row>
           <el-col :span="12">
-            <el-form-item label="用户名称" prop="userName">
-              <el-input v-if="form.userId == undefined" v-model="form.userName" placeholder="请输入用户名称" maxlength="30" />
-              <el-input v-else v-model="form.userName" placeholder="请输入用户名称" maxlength="30" readonly />
+            <el-form-item
+              label="用户名称"
+              prop="userName"
+            >
+              <el-input
+                v-if="form.userId == undefined"
+                v-model="form.userName"
+                placeholder="请输入用户名称"
+                maxlength="30"
+              />
+              <el-input
+                v-else
+                v-model="form.userName"
+                placeholder="请输入用户名称"
+                maxlength="30"
+                readonly
+              />
             </el-form-item>
           </el-col>
           <el-col :span="12">
-            <el-form-item v-if="form.userId == undefined" label="用户密码" prop="password">
+            <el-form-item
+              v-if="form.userId == undefined"
+              label="用户密码"
+              prop="password"
+            >
               <el-input
                 v-model="form.password"
                 placeholder="请输入用户密码"
@@ -108,22 +256,43 @@
         <el-row>
           <el-col :span="12">
             <el-form-item label="用户类型">
-              <el-select v-model="form.userType" placeholder="请选择用户类型">
-                <el-option v-for="dict in userType" :key="dict.value" :label="dict.name" :value="dict.value" />
+              <el-select
+                v-model="form.userType"
+                placeholder="请选择用户类型"
+              >
+                <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-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-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
+      <div
+        slot="footer"
+        class="dialog-footer"
+      >
+        <el-button
+          type="primary"
+          @click="submitForm"
+        >确 定</el-button>
         <el-button @click="cancel">取 消</el-button>
       </div>
     </el-dialog>
@@ -246,6 +415,7 @@ export default {
         this.$confirm('您确定要删除选中的用户吗？', '提示', {
           confirmButtonText: '确定',
           cancelButtonText: '取消',
+          cancelButtonClass: 'btn_custom_cancel',
           type: 'warning'
         }).then(() => {
           for (const i in userIdList) {
@@ -273,6 +443,7 @@ export default {
       this.$confirm('您确定要删除用户【' + row.userName + '】吗？', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
+        cancelButtonClass: 'btn_custom_cancel',
         type: 'warning'
       }).then(() => {
         delUserById({
@@ -296,16 +467,15 @@ export default {
         })
         return
       }
-      this.$prompt('请输入"' + row.userName + '"的新密码', '提示', {
+      this.$confirm('是否重置密码?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
-        closeOnClickModal: false,
-        inputPattern: /(?!^[0-9]+$)(?!^[A-z]+$)(?!^[^A-z0-9]+$)^[^\s\u4e00-\u9fa5]{5,20}$/,
-        inputErrorMessage: '密码需至少包含数字、字母、符号中的2种  5-20个字符  不能有中文'
-      }).then(({ value }) => {
+        cancelButtonClass: 'btn_custom_cancel',
+        type: 'warning'
+      }).then(() => {
         const data = this.$store.dispatch('user/ResetPassword', {
           userId: row.userId,
-          newPassword: value
+          newPassword: 'cy123456'
         })
         data.then(res => {
           if (res.code === 200) {
@@ -315,7 +485,12 @@ export default {
             })
           }
         })
-      }).catch(() => { })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消重置'
+        })
+      })
     },
     /** 修改按钮操作 */
     handleUpdate(row) {