# 内部管理系统
> 可管理人员、角色，控制物管，内管（后期客服也会）等的菜单权限等等。 接口对接：段宇飞，李明

*项目目录 基于vue-cli 百度一下你就知道*
*只摘选有必要的目录进行说明*

```项目目录
> build            ---------  webpack编译文件
> config           ---------  配置
> src              ---------  开发目录 
* index.html       ---------  默认index.html文件
* package.json     ---------  依赖等相关json
```
---

*src*

```开发目录
> assets           ---------  静态文件（图片等文件）
> components       ---------  组件
> http             ---------  axios封装目录 
> router           ---------  路由 
> store            ---------  全局状态 
> utils            ---------  工具js 
> views            ---------  vue文件目录 
* App.vue          ---------  vue指定的root根组件
* config.js        ---------  依赖等相关json
* main.js          ---------  入口
```

---

*http*

```http
* api.js           ---------  所有的api统一放到这个文件进行管理
* GlobalApi.js     ---------  用于放置所有页面可能用到的接口 避免在api中查找费力
* request.js       ---------  请求拦截器封装
```

* #### request.js中拦截
  1. 请求拦截：对请求头进行添加Authorization 具体和后端进行沟通
  2. 响应拦截：后端返回401即token失效或者无效进行跳转登录
  3. loading在这里设置全局请求等待状态（可自行更改）

---

*views摘取需要注意的点，其余不在列举*

```views
> BasicInfo                ---------  基础信息维护
  > MenuSetting
    - PropertyMenu.vue          ----  物业菜单代码 tempAutnMenuData 这个方法需要后期对应删除，这是做物业新账单时进行添加
    - PropertySecondMenu.vue    ----  物业二级菜单代码 tempAutnMenuData 这个方法需要后期对应删除，这是做物业新账单时进行添加
```

  <p style="padding: 0 20px;color: red;">tempAutnMenuData</p>

---

* #### router/index.js
  1. 当前菜单并未做到完全设置后刷新更新，是因为后端接口并未拆分单独菜单请求接口
  2. 路由拦截是根据 *导航守卫* 也就是 *beforeEach* 进行处理
  3. 拦截跳转401和404页面主要是根据 
    * router中有页面，但是无权限即401 
    * router中无页面，404
  4. 注释基本明晰，至于 *next({ path: `/login?redirect=${to.path}` })* 这里是自己做的跳转路径保留，登录时解析跳转对应的路径，解析部分看login页面

```js
router.beforeEach(async(to, from, next) => {
  NProgress.start()
  let token = sessionStorage.getItem('token')
  if (!token) {
    if (to.path !== '/login') {  
      console.log(`token失效，开始重新登录~ - ${new Date()}`)
      if (to.path == '/user/404' || to.path == '/user/401') {
        next({ path: `/login`})
      } else {
        next({ path: `/login?redirect=${to.path}` })
      }
      NProgress.done()
    } else {
      next()
      NProgress.done()
    }
  } else {
    let currentMenu = ['/login', '/user/404', '/user/401', '/user/blank']
    currentMenu = currentMenu.concat(addRouterUrl(store.getters.getMenuList))
    if (!allAuthList.includes(to.path)) {
      console.log(`您好，未找到 ${to.path} 页面，请确认跳转的路径是否正确~ - ${new Date()}`)
      next({ path: '/user/404', replace: true })
      NProgress.done()
    } else {
      if (!currentMenu.includes(to.path)) {
        console.log(`您好，您没有权限跳转到 ${to.path} ，请在运营账户管理添加对应的菜单权限~ - ${new Date()}`)
        if (from.path != '/login') {
          next({ path: '/user/401', replace: true })
        } else {
          next({ path: currentMenu[1] })
        }
      }else {
        next()
        NProgress.done()
      }
    }
  }
})
```


*剩余代码基本比较正常业务逻辑，无需注明*