登录相关权限修改，角色模块改造，新接口请求封装

src/components/login-form/login-form.vue

@@ -1,85 +1,181 @@
 <template>
-  <Form ref="loginForm" :model="form" :rules="rules" @keydown.enter.native="handleSubmit">
-    <FormItem prop="userName">
-      <Input size="large"  v-model="form.userName" placeholder="请输入账号" prefix="ios-contact-outline"></Input>
-    </FormItem>
-    <FormItem prop="password">
-      <Input size="large" type="password" v-model="form.password" placeholder="请输入密码" prefix="ios-lock-outline"></Input>
-    </FormItem>
-    <FormItem>
-      <Checkbox v-model="remember">记住用户名</Checkbox>
-    </FormItem>
-    <FormItem>
-      <Button size="large" @click="handleSubmit" type="primary" long>登录</Button>
-    </FormItem>
-  </Form>
+	<Form
+		ref="form"
+		:model="form"
+		:rules="rules"
+		@keydown.enter.native="handleSubmit"
+	>
+		<FormItem prop="userName">
+			<Input
+				size="large"
+				v-model="form.username"
+				placeholder="请输入账号"
+				prefix="ios-contact-outline"
+			></Input>
+		</FormItem>
+		<FormItem prop="password">
+			<Input
+				size="large"
+				type="password"
+				v-model="form.password"
+				placeholder="请输入密码"
+				prefix="ios-lock-outline"
+			></Input>
+		</FormItem>
+		<FormItem>
+			<Input
+				size="large"
+				v-model="form.code"
+				placeholder="请输入验证码"
+				prefix="ios-contact-outline"
+			></Input>
+		</FormItem>
+		<FormItem>
+			<Checkbox v-model="remember">记住用户名</Checkbox>
+			
+		</FormItem>
+		<img @click="getCodeImg" :src="image" alt=""></img>
+		<FormItem>
+			<Button size="large" @click="login" type="primary" long
+				>登录</Button
+			>
+		</FormItem>
+	</Form>
 </template>
 <script>
 import axios from 'axios'
+import md5 from 'js-md5'
 export default {
-  name: 'LoginForm',
-  props: {
-    userNameRules: {
-      type: Array,
-      default: () => {
-        return [
-          { required: true, message: '账号不能为空', trigger: 'blur' }
-        ]
-      }
-    },
-    passwordRules: {
-      type: Array,
-      default: () => {
-        return [
-          { required: true, message: '密码不能为空', trigger: 'blur' }
-        ]
-      }
-    }
-  },
-  data () {
-    return {
-      remember: true,
-      form: {
-        userName: '',
-        password: ''
-      }
-    }
-  },
-  computed: {
-    rules () {
-      return {
-        userName: this.userNameRules,
-        password: this.passwordRules
-      }
-    }
-  },
-  methods: {
-    handleSubmit () {
-      if(this.form.password == '123456'){
-        this.$Message.info({
-          content:'密码错误',
-          duration:3,
-        });
-        return
-      }
-      this.$refs.loginForm.validate((valid) => {
-        if (valid) {
-          if (this.remember) {
-            sessionStorage.setItem('userName', this.form.userName)
-          } else {
-            sessionStorage.setItem('userName', '')
-          }
-          this.$emit('on-success-valid', {
-            userName: this.form.userName,
-            password: this.form.password
-          })
-        }
-      })
-    }
-  },
-  mounted () {
-    let userName = sessionStorage.getItem('userName')
-    userName && (this.form.userName = userName)
-  }
+	name: 'form',
+	props: {
+		userNameRules: {
+			type: Array,
+			default: () => {
+				return [
+					{
+						required: true,
+						message: '账号不能为空',
+						trigger: 'blur',
+					},
+				]
+			},
+		},
+		passwordRules: {
+			type: Array,
+			default: () => {
+				return [
+					{
+						required: true,
+						message: '密码不能为空',
+						trigger: 'blur',
+					},
+				]
+			},
+		},
+	},
+	data() {
+		return {
+			remember: true,
+
+			form: {
+				//租户ID
+				tenantId: '000000',
+				//部门ID
+				deptId: '',
+				//角色ID
+				roleId: '',
+				//用户名
+				username: 'admin',
+				//密码
+				password: 'admin',
+				//账号类型
+				type: 'account',
+				//验证码的值
+				code: '',
+				//验证码的索引
+				key: '',
+				grant_type: 'captcha',
+				scope: 'all',
+				type:'loginWithoutVerificationCode',
+				//预加载白色背景
+			},
+			image: 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7',
+		}
+	},
+	computed: {
+		rules() {
+			return {
+				userName: this.userNameRules,
+				password: this.passwordRules,
+			}
+		},
+	},
+	methods: {
+		login() {
+			const v = this
+			console.log(md5(v.form.password))
+			v.formCopy = {...v.form}
+			v.formCopy.password = md5(v.formCopy.password)
+			axios({
+				method:"post",
+				url:'/api/blade-auth/oauth/token',
+				params:this.formCopy,
+				headers:{
+					'Captcha-Key':this.form.key,
+					'Captcha-Code':this.form.code,
+					'Tenant-Id': this.form.tenantId
+				},
+			}).then(res=>{
+				console.log(res)
+				if(res.status == 200 && res.data){
+					window.localStorage.setItem("token",JSON.stringify(res.data))
+					v.getRouters()
+				}
+				// window.localStorage.setItem("token",JSON.stringify(res.data))
+                // v.$router.push("/emailHome")
+			})
+			
+		},
+		getRouters(){
+			this.$get('/api/blade-system/menu/routes').then((res) => {
+                console.log(res)
+				this.$router.push("/schedule")
+            })
+		},
+		getCodeImg() {
+			this.$get('/api/blade-auth/oauth/captcha').then((res) => {
+                const data = res
+                this.form.key = data.key
+                this.image = data.image
+            })
+		},
+		handleSubmit() {
+			if (this.form.password == '123456') {
+				this.$Message.info({
+					content: '密码错误',
+					duration: 3,
+				})
+				return
+			}
+			this.$refs.form.validate((valid) => {
+				if (valid) {
+					if (this.remember) {
+						sessionStorage.setItem('userName', this.form.userName)
+					} else {
+						sessionStorage.setItem('userName', '')
+					}
+					this.$emit('on-success-valid', {
+						userName: this.form.userName,
+						password: this.form.password,
+					})
+				}
+			})
+		},
+	},
+	mounted() {
+		let userName = sessionStorage.getItem('userName')
+		userName && (this.form.userName = userName)
+		this.getCodeImg()
+	},
 }
 </script>

src/components/main/components/header-bar/header-bar.vue

@@ -364,7 +364,7 @@ export default {
   },
   mounted () {
     // this.SRConnection()
-    this.alertMsg()
+    //this.alertMsg()
     this.$nextTick(() => {
       this.textAnimate()
     })

src/libs/axios.js

@@ -72,11 +72,11 @@ class HttpRequest {
             this.destroy(url)
             Message.destroy()
             Message.error('账户信息已过期！')
-            setTimeout(() => {
-              localStorage.setItem('tagNaveList', '')
-              store.commit('setToken', '')
-              router.push({ name: 'login' })
-            }, 1000)
+            // setTimeout(() => {
+            //   localStorage.setItem('tagNaveList', '')
+            //   store.commit('setToken', '')
+            //   router.push({ name: 'login' })
+            // }, 1000)
           } else {
             Message.error(data.msg)
           }

src/libs/http.js

@@ -0,0 +1,185 @@
+import Vue from 'vue';
+import axios from 'axios';
+import router from '@/router'
+axios.defaults.timeout = 65000;
+axios.defaults.baseURL = '';
+//http request 拦截器
+axios.interceptors.request.use(
+    config => {
+        // const token = getCookie('名称');注意使用的时候需要引入cookie方法，推荐js-cookie
+        var userJson = window.localStorage.getItem("token")
+        if(!userJson){
+            var userData = false
+            var token;
+        }else{
+            var userData = JSON.parse(userJson)
+            var token;
+        }  
+        if(userData && userData.access_token){
+            token = userData.access_token
+        }
+        
+        config.data = JSON.stringify(config.data)
+        config.headers['Content-Type'] = 'application/json;charset=UTF-8'
+        config.headers['Authorization'] = 'Basic c2FiZXI6c2FiZXJfc2VjcmV0'
+        config.headers['Blade-Auth'] = token
+        return config;
+    },
+    error => {
+        return Promise.reject(err);
+    }
+);
+
+
+//http response 拦截器
+axios.interceptors.response.use(
+    response => {
+        if (response.data.code == 1011008 || response.data.code == 1011006) {
+            // Toast.fail('登录过期，跳原生')
+            let userData
+            var u = navigator.userAgent;
+            var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
+            var isiOS = u.indexOf('Mac OS X') > -1
+            try{
+                if(isAndroid){
+                    window.jsi.logout()
+                }
+                if(isiOS){
+                    
+                }
+            }catch(err){
+            }
+        }
+        // if (response.data.code != 200) {
+        //     Toast.fail(response.data.message)
+        // }
+        
+        switch (response.data.code) {
+            case 32:
+                response.msg = '请求错误(400)'
+                break;
+        }
+        return response;
+    },
+    err => {
+        console.log(err.response)
+        if (err && err.response) {
+            console.log(err.response)
+            if(err.response.status == 500 || err.response.status == 503){
+                Toast.fail('服务器错误')
+                return
+            }
+            switch (err.response.data.code) {
+                
+                case 401:
+                    Toast.fail('登录已失效，请重新登录')
+                    router.push("/")
+
+                    break;
+                case 403:
+                    err.message = '拒绝访问(403)';
+                    break;
+                case 404:
+                    err.message = '请求出错(404)';
+                    break;
+                case 408:
+                    err.message = '请求超时(408)';
+                    break;
+                case 500:
+                    err.message = '服务器错误(500)';
+                    break;
+                case 501:
+                    err.message = '服务未实现(501)';
+                    break;
+                case 502:
+                    err.message = '网络错误(502)';
+                    break;
+                case 503:
+                    err.message = '服务不可用(503)';
+                    break;
+                case 504:
+                    err.message = '网络超时(504)';
+                    break;
+                case 505:
+                    err.message = 'HTTP版本不受支持(505)';
+                    break;
+                default:
+                    err.message = `${err.response.data.msg}`;
+            } 
+            // if(err.response.status == 404){
+            //     router.push("/*")
+            // }
+            // if(err.response.status == 500 || err.response.status == 502){
+            //     router.push("/500")
+            // }
+            // if(err.response.status == 401){
+            //     router.push("/401")
+            // }
+        } else {
+            err.message = '连接服务器失败!'
+        }
+        console.log(err.message)
+        // Toast.fail(err.message)
+        return Promise.reject(err);
+    }
+)
+
+/**
+ * 封装get方法
+ * @param url
+ * @param data
+ * @returns {Promise}
+ */
+
+export function get(url, params = {}) {
+    return new Promise((resolve, reject) => {
+        if(process.env.NODE_ENV == "development"){
+            var getUrl = "http://" + window.location.host + "" + url
+        }else{
+            var getUrl = "https://" + window.location.host + "/api" + url
+        }
+        axios.get(getUrl, {params:params})
+            .then(response => {
+                setTimeout(() => {
+                }, 500)
+                resolve(response.data);
+            }, err => {
+                reject(err)
+            })
+    })
+}
+
+
+/**
+ * 封装post请求
+ * @param url
+ * @param data
+ * @returns {Promise}
+ */
+
+export function post(url, data = {},params,headers) {
+    console.log(data,1231231231231)
+    return new Promise((resolve, reject) => {
+        if(process.env.NODE_ENV == "development"){
+            var postUrl = "http://" + window.location.host + url
+        }else{
+            var postUrl = "https://" + window.location.host +'/api' + url
+        }
+        axios.post(postUrl, data ,{
+            params:params,
+            headers:headers || null
+        })
+            .then(response => {
+                setTimeout(() => {
+                }, 500)
+                resolve(response.data);
+            }, err => {
+                reject(err)
+            })
+    })
+}
+
+export default {
+    post,
+    get
+}

src/main.js

@@ -18,6 +18,9 @@ import 'v-org-tree/dist/v-org-tree.css'
 // 实际打包时应该不引入mock
 /* eslint-disable */
 // if (process.env.NODE_ENV !== 'production') require('@/mock')
+import httpServer from './libs/http'
+Vue.prototype.$get = httpServer.get;
+Vue.prototype.$post = httpServer.post;
 
 Vue.use(iView, {
   i18n: (key, value) => i18n.t(key, value)

src/router/index.js

@@ -25,42 +25,42 @@ Router.prototype.push = function push (location) {
   return originalPush.call(this, location).catch(err => err)
 }
 
-router.beforeEach((to, from, next) => {
+// router.beforeEach((to, from, next) => {
   
-  iView.LoadingBar.start()
-  const token = getToken()
-  if (!token && ['technology_board'].includes(to.name)) {
-    // 未登录运行访问的页面
-    next()
-  } else if (!token && to.name !== LOGIN_PAGE_NAME) {
-    // 未登录且要跳转的页面不是登录页
-    next({
-      name: LOGIN_PAGE_NAME // 跳转到登录页
-    })
-  } else if (!token && to.name === LOGIN_PAGE_NAME) {
-    // 未登陆且要跳转的页面是登录页
-    next() // 跳转
-  } else if (token && to.name === LOGIN_PAGE_NAME) {
-    // 已登录且要跳转的页面是登录页
-    next({
-      name: homeName // 跳转到homeName页
-    })
-  } else {
-    if (store.state.user.hasGetInfo) {
-      turnTo(to, [ store.state.user.access ], next)
-    } else {
-      store.dispatch('getUserInfo').then(user => {
-        // 拉取用户信息，通过用户权限和跳转的页面的name来判断是否有权限访
-        turnTo(to, [ user.result.roleKey ], next)
-      }).catch(() => {
-        setToken('')
-        next({
-          name: 'login'
-        })
-      })
-    }
-  }
-})
+//   iView.LoadingBar.start()
+//   const token = getToken()
+//   if (!token && ['technology_board'].includes(to.name)) {
+//     // 未登录运行访问的页面
+//     next()
+//   } else if (!token && to.name !== LOGIN_PAGE_NAME) {
+//     // 未登录且要跳转的页面不是登录页
+//     next({
+//       name: LOGIN_PAGE_NAME // 跳转到登录页
+//     })
+//   } else if (!token && to.name === LOGIN_PAGE_NAME) {
+//     // 未登陆且要跳转的页面是登录页
+//     next() // 跳转
+//   } else if (token && to.name === LOGIN_PAGE_NAME) {
+//     // 已登录且要跳转的页面是登录页
+//     next({
+//       name: homeName // 跳转到homeName页
+//     })
+//   } else {
+//     if (store.state.user.hasGetInfo) {
+//       turnTo(to, [ store.state.user.access ], next)
+//     } else {
+//       store.dispatch('getUserInfo').then(user => {
+//         // 拉取用户信息，通过用户权限和跳转的页面的name来判断是否有权限访
+//         turnTo(to, [ user.result.roleKey ], next)
+//       }).catch(() => {
+//         setToken('')
+//         next({
+//           name: 'login'
+//         })
+//       })
+//     }
+//   }
+// })
 
 router.afterEach(to => {
   setTitle(to, router.app)

src/view/login/login.vue

@@ -91,20 +91,20 @@ export default {
     ...mapActions(['handleLogin', 'getUserInfo']),
     handleSubmit ({ userName, password }) {
       this.handleLogin({ userName, password }).then(res => {
-        this.getUserInfo().then(res => {
-          console.log(res)
-          window.localStorage.setItem('jobNo',res.result.jobNo)
-          /* 未在角色菜单配置首页的角色直接跳转第一个菜单 不显示首页 */
-          let menus = this.$store.state.user.menu
-          let home = menus.find(item => item.name === '_home')
-          if (!home && menus[0]) {
-            this.$router.push(menus[0].children[0].name)
-          } else {
-            this.$router.push({
-              name: this.$config.homeName
-            })
-          }
-        })
+        // this.getUserInfo().then(res => {
+        //   console.log(res)
+        //   window.localStorage.setItem('jobNo',res.result.jobNo)
+        //   /* 未在角色菜单配置首页的角色直接跳转第一个菜单 不显示首页 */
+        //   let menus = this.$store.state.user.menu
+        //   let home = menus.find(item => item.name === '_home')
+        //   if (!home && menus[0]) {
+        //     this.$router.push(menus[0].children[0].name)
+        //   } else {
+        //     this.$router.push({
+        //       name: this.$config.homeName
+        //     })
+        //   }
+        // })
         // this.$router.push({
         //   name: this.$config.homeName
         // })

src/view/system-manage/role.vue

@@ -93,25 +93,25 @@ export default {
         {
           type: 'input',
           label: '角色名',
-          key: 'name',
+          key: 'roleName',
           placeholder: '请输入分类名称'
         },
-        {
-          type: 'input',
-          label: '角色编码',
-          key: 'key',
-          placeholder: '请输入角色编码'
-        },
-        {
-          type: 'select',
-          label: '角色类型',
-          key: 'isDefault',
-          list: [
-            { label: '默认用户', value: 1 },
-            { label: '普通用户', value: 0 }
-          ],
-          placeholder: '请选择角色类型'
-        }
+        // {
+        //   type: 'input',
+        //   label: '角色编码',
+        //   key: 'key',
+        //   placeholder: '请输入角色编码'
+        // },
+        // {
+        //   type: 'select',
+        //   label: '角色类型',
+        //   key: 'isDefault',
+        //   list: [
+        //     { label: '默认用户', value: 1 },
+        //     { label: '普通用户', value: 0 }
+        //   ],
+        //   placeholder: '请选择角色类型'
+        // }
       ],
       ruleValidate: {
         name: [
@@ -344,24 +344,19 @@ export default {
         })
       }
     },
+    treeInit(data){
+      for (let i = 0; i < data.length; i++) {
+        const element = data[i];
+        element.name = element.roleName = element.title
+        if(element.children && element.children.length > 0) this.treeInit(element.children)
+      }
+    },
     getTree () {
-      GetRolePageList().then(res => {
-        if (res.code === 0) {
-          let array = [
-            { name: '默认角色', children: [], isHiddenEditBtn: true, expand: true },
-            { name: '普通角色', children: [], isHiddenEditBtn: true, expand: true }
-          ]
-          res.result.forEach(item => {
-            if (item.isDefault) {
-              item.isHiddenAddBtn = true
-              array[0].children.push(item)
-            } else {
-              array[1].children.push(item)
-              item.isHiddenAddBtn = true
-            }
-          })
-          this.treeData = array
-        }
+      const v = this
+      v.$get('/api/blade-system/role/tree').then(res=>{
+        v.treeInit(res.data)
+        this.treeData = res.data
+        console.log(res)
       })
     },
     // list 项目路由 menus 系统定义的路由
@@ -459,33 +454,36 @@ export default {
     // 提交树操作
     treeHandle (type, data, target) {
       if (type === 'add') {
-        AddRole({
-          ...data,
-          isDefault: !!data.isDefault
-        }).then(res => {
-          if (res.code === 0) {
-            this.$Message.info(res.msg)
-            this.getTree()
-          }
+        this.$post('/api/blade-system/role/submit',{
+          parentId:0,
+          roleAlias:data.roleName,
+          roleName:data.roleName,
+          sort:1,
+          tenantId:'000000'
+        }).then(res=>{
+          this.getTree()
+          this.$Message.info(res.msg)
         })
       } else if (type === 'edit') {
-        UpdateRole({
-          ...data,
-          isDefault: !!data.isDefault,
-          id: data.id
-        }).then(res => {
-          if (res.code === 0) {
-            this.$Message.info(res.msg)
-            this.getTree()
-          }
+        console.log(data,target)
+        this.$post('/api/blade-system/role/submit',{
+          parentId:data.parentId,
+          roleAlias:data.roleName,
+          roleName:data.roleName,
+          sort:1,
+          tenantId:'000000',
+          id:data.id
+        }).then(res=>{
+          this.getTree()
+          this.$Message.info(res.msg)
         })
       } else if (type === 'del') {
-        DeleteRole({ id: target.id }).then(res => {
-          if (res.code === 0) {
-            this.$Message.info(res.msg)
-            this.getTree()
-          }
+        this.$post('/api/blade-system/role/remove?ids=' + target.id + '',{
+        }).then(res=>{
+          this.getTree()
+          this.$Message.info(res.msg)
         })
+       
       }
     }
   },